From ae97ad85e083d491074fe5eb7f05df2ffa9948b4 Mon Sep 17 00:00:00 2001
From: zzcr <894103554@qq.com>
Date: Sat, 10 Jun 2023 00:54:00 -0700
Subject: [PATCH] =?UTF-8?q?feat(TinyVue):=20=E5=90=8C=E6=AD=A5=E5=86=85?=
=?UTF-8?q?=E9=83=A8=E4=BB=A3=E7=A0=81=EF=BC=8C=E8=A7=A3=E5=86=B3=E8=8B=A5?=
=?UTF-8?q?=E5=B9=B2bug?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
.eslintrc.js | 13 +-
.gitignore | 4 -
README.md | 2 +-
README.zh-CN.md | 2 +-
examples/docs/newsrc/App.vue | 6 +-
examples/docs/newsrc/mobile-first.vue | 67 +-
examples/docs/newsrc/mobile.vue | 59 +-
examples/docs/newsrc/pc.vue | 79 +-
examples/docs/newsrc/resourceMobile.js | 8 +
examples/docs/newsrc/resourceMobileFirst.js | 8 +
examples/docs/newsrc/style.css | 20 +
examples/docs/package.json | 1 +
.../action-sheet/webdoc/action-sheet.cn.md | 9 +
.../action-sheet/webdoc/action-sheet.en.md | 9 +
.../app/action-sheet/webdoc/action-sheet.js | 82 ++
.../mobile-first/app/alert/webdoc/alert.js | 13 +
.../mobile-first/app/badge/webdoc/badge.cn.md | 9 +
.../mobile-first/app/badge/webdoc/badge.en.md | 9 +
.../mobile-first/app/badge/webdoc/badge.js | 127 ++
.../button-group/webdoc/button-group.cn.md | 9 +
.../button-group/webdoc/button-group.en.md | 9 +
.../app/button-group/webdoc/button-group.js | 58 +
.../app/calendar-bar/webdoc/calendar-bar.js | 2 +-
.../mobile-first/app/card/webdoc/card.cn.md | 11 +
.../mobile-first/app/card/webdoc/card.en.md | 11 +
.../mobile-first/app/card/webdoc/card.js | 153 +++
.../app/carousel/webdoc/carousel.cn.md | 11 +
.../app/carousel/webdoc/carousel.en.md | 11 +
.../app/carousel/webdoc/carousel.js | 167 +++
.../webdoc/cascader-select.cn.md | 9 +
.../webdoc/cascader-select.en.md | 9 +
.../cascader-select/webdoc/cascader-select.js | 94 ++
.../app/checkbox/webdoc/checkbox.cn.md | 9 +
.../app/checkbox/webdoc/checkbox.en.md | 9 +
.../app/checkbox/webdoc/checkbox.js | 120 ++
.../app/collapse/webdoc/collapse.cn.md | 9 +
.../app/collapse/webdoc/collapse.en.md | 9 +
.../app/collapse/webdoc/collapse.js | 154 +++
.../app/column-list-item/show-radio.vue | 51 +
.../webdoc/column-list-item.cn.md | 8 +
.../webdoc/column-list-item.en.md | 8 +
.../webdoc/column-list-item.js | 130 ++
.../webdoc/date-picker-mobile.cn.md | 9 +
.../webdoc/date-picker-mobile.en.md | 9 +
.../webdoc/date-picker-mobile.js | 56 +
.../app/drawer/webdoc/drawer.cn.md | 9 +
.../app/drawer/webdoc/drawer.en.md | 9 +
.../mobile-first/app/drawer/webdoc/drawer.js | 117 ++
.../app/dropdown/webdoc/dropdown.cn.md | 9 +
.../app/dropdown/webdoc/dropdown.en.md | 9 +
.../app/dropdown/webdoc/dropdown.js | 207 +++
.../app/exception/webdoc/exception.cn.md | 9 +
.../app/exception/webdoc/exception.en.md | 9 +
.../app/exception/webdoc/exception.js | 69 +
.../app/file-upload/webdoc/file-upload.cn.md | 9 +
.../app/file-upload/webdoc/file-upload.en.md | 9 +
.../app/file-upload/webdoc/file-upload.js | 331 +++++
.../app/filter-bar/webdoc/filter-bar.cn.md | 9 +
.../app/filter-bar/webdoc/filter-bar.en.md | 9 +
.../app/filter-bar/webdoc/filter-bar.js | 43 +
.../app/filter/webdoc/filter.cn.md | 9 +
.../app/filter/webdoc/filter.en.md | 9 +
.../mobile-first/app/filter/webdoc/filter.js | 58 +
.../app/flowchart/basic-usage.vue | 9 +-
.../app/flowchart/dot-horizon.vue | 124 ++
.../app/flowchart/dot-vertical.vue | 226 ++++
.../app/flowchart/holistic-fork.vue | 357 ++++++
.../mobile-first/app/flowchart/holistic.vue | 186 +++
.../mobile-first/app/flowchart/horizon.vue | 9 +-
.../app/flowchart/webdoc/flowchart.cn.md | 16 +
.../app/flowchart/webdoc/flowchart.en.md | 16 +
.../app/flowchart/webdoc/flowchart.js | 79 ++
.../app/form/no-validate-to-add.vue | 1 -
.../mobile-first/app/form/webdoc/form.cn.md | 9 +
.../mobile-first/app/form/webdoc/form.en.md | 9 +
.../mobile-first/app/form/webdoc/form.js | 210 +++
.../mobile-first/app/grid/basic-usage.vue | 179 +++
.../mobile-first/app/grid/webdoc/grid.cn.md | 9 +
.../mobile-first/app/grid/webdoc/grid.en.md | 9 +
.../mobile-first/app/grid/webdoc/grid.js | 43 +
.../mobile-first/app/image/webdoc/image.cn.md | 9 +
.../mobile-first/app/image/webdoc/image.en.md | 9 +
.../mobile-first/app/image/webdoc/image.js | 57 +
.../mobile-first/app/input/webdoc/input.cn.md | 9 +
.../mobile-first/app/input/webdoc/input.en.md | 9 +
.../mobile-first/app/input/webdoc/input.js | 471 +++++++
.../app/loading/webdoc/loading.cn.md | 9 +
.../app/loading/webdoc/loading.en.md | 9 +
.../app/loading/webdoc/loading.js | 118 ++
.../app/message/webdoc/message.cn.md | 9 +
.../app/message/webdoc/message.en.md | 9 +
.../app/message/webdoc/message.js | 56 +
.../mobile-first/app/modal/webdoc/modal.cn.md | 9 +
.../mobile-first/app/modal/webdoc/modal.en.md | 9 +
.../mobile-first/app/modal/webdoc/modal.js | 334 +++++
.../app/numeric/webdoc/numeric.cn.md | 9 +
.../app/numeric/webdoc/numeric.en.md | 9 +
.../app/numeric/webdoc/numeric.js | 117 ++
.../mobile-first/app/pager/webdoc/pager.cn.md | 9 +
.../mobile-first/app/pager/webdoc/pager.en.md | 9 +
.../mobile-first/app/pager/webdoc/pager.js | 58 +
.../app/popconfirm/webdoc/popconfirm.cn.md | 9 +
.../app/popconfirm/webdoc/popconfirm.en.md | 9 +
.../app/popconfirm/webdoc/popconfirm.js | 19 +
.../app/popover/webdoc/popover.cn.md | 9 +
.../app/popover/webdoc/popover.en.md | 9 +
.../app/popover/webdoc/popover.js | 203 +++
.../app/progress/webdoc/progress.cn.md | 9 +
.../app/progress/webdoc/progress.en.md | 9 +
.../app/progress/webdoc/progress.js | 129 ++
.../app/radio-block/webdoc/radio-block.cn.md | 9 +
.../app/radio-block/webdoc/radio-block.en.md | 9 +
.../app/radio-block/webdoc/radio-block.js | 58 +
.../mobile-first/app/radio/webdoc/radio.cn.md | 9 +
.../mobile-first/app/radio/webdoc/radio.en.md | 9 +
.../mobile-first/app/radio/webdoc/radio.js | 107 ++
.../mobile-first/app/rate/webdoc/rate.cn.md | 9 +
.../mobile-first/app/rate/webdoc/rate.en.md | 9 +
.../mobile-first/app/rate/webdoc/rate.js | 225 ++++
.../app/record/webdoc/record.cn.md | 9 +
.../app/record/webdoc/record.en.md | 9 +
.../mobile-first/app/record/webdoc/record.js | 19 +
.../app/scrollbar/webdoc/scrollbar.cn.md | 9 +
.../app/scrollbar/webdoc/scrollbar.en.md | 9 +
.../app/scrollbar/webdoc/scrollbar.js | 31 +
.../app/search/webdoc/search.cn.md | 9 +
.../app/search/webdoc/search.en.md | 9 +
.../mobile-first/app/search/webdoc/search.js | 176 +++
.../select-mobile/webdoc/select-mobile.cn.md | 9 +
.../select-mobile/webdoc/select-mobile.en.md | 9 +
.../app/select-mobile/webdoc/select-mobile.js | 45 +
.../app/select-view/webdoc/select-view.cn.md | 9 +
.../app/select-view/webdoc/select-view.en.md | 9 +
.../app/select-view/webdoc/select-view.js | 83 ++
.../selected-box/webdoc/selected-box.cn.md | 9 +
.../selected-box/webdoc/selected-box.en.md | 9 +
.../app/selected-box/webdoc/selected-box.js | 58 +
.../app/slider/webdoc/slider.cn.md | 9 +
.../app/slider/webdoc/slider.en.md | 9 +
.../mobile-first/app/slider/webdoc/slider.js | 192 +++
.../webdoc/standard-list-item.cn.md | 9 +
.../webdoc/standard-list-item.en.md | 9 +
.../webdoc/standard-list-item.js | 81 ++
.../mobile-first/app/steps/webdoc/steps.cn.md | 17 +
.../mobile-first/app/steps/webdoc/steps.en.md | 17 +
.../mobile-first/app/steps/webdoc/steps.js | 132 ++
.../app/switch/webdoc/switch.cn.md | 9 +
.../app/switch/webdoc/switch.en.md | 9 +
.../mobile-first/app/switch/webdoc/switch.js | 106 ++
.../mobile-first/app/tabs/webdoc/tabs.cn.md | 9 +
.../mobile-first/app/tabs/webdoc/tabs.en.md | 9 +
.../mobile-first/app/tabs/webdoc/tabs.js | 204 +++
.../app/tag-group/webdoc/tag-group.cn.md | 9 +
.../app/tag-group/webdoc/tag-group.en.md | 9 +
.../app/tag-group/webdoc/tag-group.js | 70 +
.../mobile-first/app/tag/webdoc/tag.cn.md | 9 +
.../mobile-first/app/tag/webdoc/tag.en.md | 9 +
.../mobile-first/app/tag/webdoc/tag.js | 153 +++
.../app/time-line/webdoc/time-line.cn.md | 9 +
.../app/time-line/webdoc/time-line.en.md | 9 +
.../app/time-line/webdoc/time-line.js | 93 ++
.../webdoc/time-picker-mobile.cn.md | 9 +
.../webdoc/time-picker-mobile.en.md | 9 +
.../webdoc/time-picker-mobile.js | 19 +
.../app/tooltip/webdoc/tooltip.cn.md | 9 +
.../app/tooltip/webdoc/tooltip.en.md | 9 +
.../app/tooltip/webdoc/tooltip.js | 205 +++
.../app/user-head/webdoc/user-head.cn.md | 9 +
.../app/user-head/webdoc/user-head.en.md | 9 +
.../app/user-head/webdoc/user-head.js | 57 +
.../docs/resources/pc/api/zh-CN/transfer.json | 10 +-
.../resources/pc/api/zh-CN/tree-menu.json | 2 +-
.../docs/resources/pc/api/zh-CN/tree.json | 26 +-
.../pc/demo-config/en-US/action-menu.json | 8 +
.../resources/pc/demo-config/en-US/alert.json | 2 +-
.../resources/pc/demo-config/en-US/badge.json | 16 +
.../pc/demo-config/en-US/country.json | 10 +-
.../pc/demo-config/en-US/dropdown.json | 16 +
.../pc/demo-config/en-US/ip-address.json | 10 +-
.../resources/pc/demo-config/en-US/modal.json | 4 +-
.../pc/demo-config/en-US/popover.json | 2 +-
.../pc/demo-config/en-US/select.json | 8 +
.../pc/demo-config/en-US/time-picker.json | 14 +-
.../pc/demo-config/en-US/transfer.json | 2 +-
.../pc/demo-config/zh-CN/action-menu.json | 8 +
.../resources/pc/demo-config/zh-CN/alert.json | 2 +-
.../resources/pc/demo-config/zh-CN/badge.json | 83 +-
.../pc/demo-config/zh-CN/breadcrumb.json | 35 +-
.../pc/demo-config/zh-CN/bulletin-board.json | 67 +-
.../pc/demo-config/zh-CN/collapse.json | 75 +-
.../pc/demo-config/zh-CN/country.json | 27 +-
.../pc/demo-config/zh-CN/dialog-box.json | 155 ++-
.../pc/demo-config/zh-CN/dropdown.json | 16 +
.../pc/demo-config/zh-CN/fullscreen.json | 19 +-
.../pc/demo-config/zh-CN/ip-address.json | 99 +-
.../resources/pc/demo-config/zh-CN/modal.json | 251 +++-
.../pc/demo-config/zh-CN/numeric.json | 131 +-
.../pc/demo-config/zh-CN/pop-upload.json | 123 +-
.../pc/demo-config/zh-CN/popover.json | 2 +-
.../pc/demo-config/zh-CN/select.json | 10 +-
.../pc/demo-config/zh-CN/time-picker.json | 12 +-
.../pc/demo-config/zh-CN/transfer.json | 163 ++-
.../pc/demo-config/zh-CN/tree-menu.json | 74 +-
.../pc/demo/action-menu/basic-usage.spec.ts | 23 +
.../pc/demo/action-menu/basic-usage.vue | 3 +-
.../pc/demo/action-menu/disabled.spec.ts | 13 +
.../pc/demo/action-menu/item-click.spec.ts | 19 +
.../pc/demo/action-menu/max-show-num.spec.ts | 17 +
.../pc/demo/action-menu/more-click.spec.ts | 16 +
.../pc/demo/action-menu/more-text.spec.ts | 12 +
.../pc/demo/action-menu/popper-class.spec.ts | 14 +
.../pc/demo/action-menu/slot-item.spec.ts | 14 +
.../pc/demo/action-menu/spacing.spec.ts | 17 +
.../pc/demo/action-menu/text-field.spec.ts | 13 +
.../demo/action-menu/visible-change.spec.ts | 19 +
.../docs/resources/pc/demo/alert/base.spec.ts | 24 +
.../resources/pc/demo/alert/center.spec.ts | 11 +
.../resources/pc/demo/alert/closable.spec.ts | 10 +
.../pc/demo/alert/close-text.spec.ts | 18 +
.../resources/pc/demo/alert/close.spec.ts | 14 +
.../pc/demo/alert/custom-description.spec.ts | 11 +
.../pc/demo/alert/feedback-of-result.spec.ts | 14 +
.../docs/resources/pc/demo/alert/icon.spec.ts | 13 +
.../resources/pc/demo/alert/show-icon.spec.ts | 9 +
.../docs/resources/pc/demo/alert/size.spec.ts | 10 +
.../pc/demo/alert/slot-default.spec.ts | 11 +
.../resources/pc/demo/alert/title.spec.ts | 11 +
.../docs/resources/pc/demo/alert/type.spec.ts | 69 +
.../pc/demo/anchor/basic-usage.spec.ts | 22 +
.../resources/pc/demo/anchor/is-affix.spec.ts | 18 +
.../pc/demo/anchor/on-change.spec.ts | 18 +
.../resources/pc/demo/anchor/on-change.vue | 4 +-
.../pc/demo/anchor/set-container.spec.ts | 25 +
.../pc/demo/anchor/set-container.vue | 10 +-
.../pc/demo/area/custom-service.spec.ts | 42 +
.../pc/demo/autocomplete/clearable.spec.js | 18 +-
.../pc/demo/badge/badge-class.spec.ts | 11 +
.../docs/resources/pc/demo/badge/base.spec.ts | 15 +
.../pc/demo/badge/dynamic-hidden.spec.ts | 16 +
.../resources/pc/demo/badge/is-dot.spec.ts | 13 +
.../docs/resources/pc/demo/badge/max.spec.ts | 11 +
.../resources/pc/demo/badge/offset.spec.ts | 12 +
.../pc/demo/badge/slot-content.spec.ts | 11 +
.../pc/demo/badge/slot-default.spec.ts | 12 +
.../resources/pc/demo/badge/target.spec.ts | 18 +
.../docs/resources/pc/demo/badge/type.spec.ts | 25 +
.../resources/pc/demo/breadcrumb/base.spec.ts | 26 +
.../resources/pc/demo/breadcrumb/base.vue | 2 +-
.../pc/demo/breadcrumb/options.spec.ts | 26 +
.../pc/demo/breadcrumb/separator.spec.ts | 13 +
.../pc/demo/breadcrumb/slot-default.spec.ts | 10 +
.../demo/bulletin-board/active-name.spec.ts | 18 +
.../pc/demo/bulletin-board/base.spec.ts | 32 +
.../pc/demo/bulletin-board/icon.spec.ts | 15 +
.../pc/demo/bulletin-board/more-link.spec.ts | 11 +
.../pc/demo/bulletin-board/route.spec.ts | 12 +
.../pc/demo/bulletin-board/tab-title.spec.ts | 15 +
.../pc/demo/bulletin-board/title.spec.ts | 11 +
.../pc/demo/bulletin-board/url.spec.ts | 12 +
.../pc/demo/button-group/base.spec.js | 14 +-
.../pc/demo/button-group/border.spec.js | 40 +
.../button-group-multiple.spec.js | 43 +
.../pc/demo/button-group/data.spec.js | 21 +-
.../pc/demo/button-group/disabled.spec.js | 18 +-
.../pc/demo/button-group/event-edit.spec.js | 22 +-
.../pc/demo/button-group/plain.spec.js | 26 +-
.../pc/demo/button-group/show-edit.spec.js | 39 +-
.../pc/demo/button-group/show-more.spec.js | 34 +-
.../pc/demo/button-group/size.spec.js | 27 +-
.../pc/demo/button-group/slot-default.spec.js | 21 +-
.../button-group/text-value-field.spec.js | 20 +-
.../pc/demo/button/autofocus.spec.js | 20 +-
.../resources/pc/demo/button/base.spec.js | 41 +-
.../resources/pc/demo/button/circle.spec.js | 19 +-
.../resources/pc/demo/button/click.spec.js | 15 +-
.../pc/demo/button/dynamic-disabled.spec.js | 27 +-
.../resources/pc/demo/button/icon.spec.js | 27 +-
.../resources/pc/demo/button/image.spec.js | 13 +-
.../resources/pc/demo/button/loading.spec.js | 24 +-
.../resources/pc/demo/button/plain.spec.js | 18 +-
.../pc/demo/button/reset-time.spec.js | 35 +-
.../resources/pc/demo/button/round.spec.js | 19 +-
.../resources/pc/demo/button/size.spec.js | 20 +-
.../docs/resources/pc/demo/button/size.vue | 15 +-
.../resources/pc/demo/button/text.spec.js | 13 +-
.../resources/pc/demo/button/type.spec.js | 25 +-
.../pc/demo/carousel/autoplay.spec.ts | 28 +
.../pc/demo/carousel/basic-usage.spec.ts | 28 +
.../pc/demo/carousel/card-mode.spec.ts | 44 +
.../carousel/carousel-arrow-always.spec.ts | 26 +
.../carousel/carousel-arrow-hover.spec.ts | 27 +
.../carousel/carousel-arrow-never.spec.ts | 22 +
.../pc/demo/carousel/close-loop.spec.ts | 26 +
.../demo/carousel/indicator-trigger.spec.ts | 18 +
.../pc/demo/carousel/manual-play.spec.ts | 30 +
.../pc/demo/carousel/play-interval.spec.ts | 20 +
.../pc/demo/carousel/show-title.spec.ts | 12 +
.../pc/demo/carousel/up-down-carousel.spec.ts | 18 +
.../demo/cascader-panel/basic-usage.spec.ts | 13 +
.../cascader-panel-props.spec.ts | 11 +
.../pc/demo/cascader-panel/change.spec.ts | 9 +
.../custom-option-content.spec.ts | 9 +
.../demo/cascader-panel/expand-change.spec.ts | 8 +
.../cascader/auto-load-checkStrictly.spec.ts | 23 +
.../pc/demo/cascader/auto-load.spec.ts | 18 +
.../pc/demo/cascader/basic-usage.spec.ts | 11 +
.../cascader/check-strictly-multiple.spec.ts | 13 +
.../pc/demo/cascader/check-strictly.spec.ts | 11 +
.../pc/demo/cascader/clearable.spec.ts | 13 +
.../pc/demo/cascader/collapse-tags.spec.ts | 8 +
.../pc/demo/cascader/default-multiple.spec.ts | 10 +
.../pc/demo/cascader/disabled-items.spec.ts | 11 +
.../resources/pc/demo/cascader/events.spec.ts | 9 +
.../pc/demo/cascader/expand-trigger.spec.ts | 10 +
.../pc/demo/cascader/filter-method.spec.ts | 14 +
.../demo/cascader/filterable-multiple.spec.ts | 20 +
.../pc/demo/cascader/filterable.spec.ts | 16 +
.../pc/demo/cascader/props-children.spec.ts | 8 +
.../pc/demo/cascader/show-all-levels.spec.ts | 10 +
.../pc/demo/checkbox/basic-usage.spec.ts | 11 +
.../pc/demo/checkbox/button-check-box.spec.ts | 12 +
.../checkbox/checkbox-button-multiple.spec.ts | 10 +
.../pc/demo/checkbox/checkbox-button.spec.ts | 23 +
.../pc/demo/checkbox/checkbox-events.spec.ts | 13 +
.../pc/demo/checkbox/checkbox-group.spec.ts | 11 +
.../pc/demo/checkbox/checkbox-slot.spec.ts | 10 +
.../pc/demo/checkbox/checked.spec.ts | 11 +
.../pc/demo/checkbox/content-overflow.spec.ts | 11 +
.../checkbox/dynamic-create-checkbox.spec.ts | 11 +
.../pc/demo/checkbox/group-options.spec.ts | 9 +
.../pc/demo/checkbox/indeterminate.spec.ts | 25 +
.../pc/demo/checkbox/min-max.spec.ts | 16 +
.../resources/pc/demo/checkbox/text.spec.ts | 10 +
.../demo/checkbox/vertical-checkbox.spec.ts | 25 +
.../pc/demo/checkbox/with-border.spec.ts | 26 +
.../pc/demo/collapse/accordion.spec.ts | 16 +
.../pc/demo/collapse/basic-usage.spec.ts | 26 +
.../pc/demo/collapse/block-close.spec.ts | 18 +
.../pc/demo/collapse/collapse-events.spec.ts | 13 +
.../collapse/custom-collapse-icon.spec.ts | 19 +
.../collapse/custom-collapse-title.spec.ts | 10 +
.../pc/demo/collapse/dynamic-disable.spec.ts | 15 +
.../pc/demo/collapse/nested-form.spec.ts | 9 +
.../pc/demo/collapse/nested-grid.spec.ts | 9 +
.../pc/demo/company/basic-usage.spec.ts | 25 +
.../pc/demo/company/custom-service.spec.ts | 33 +
.../pc/demo/company/custom-service.vue | 51 +-
.../pc/demo/country/custom-service.spec.js | 20 +
.../pc/demo/country/custom-service.vue | 35 +-
.../resources/pc/demo/country/fields.spec.js | 13 +
.../credit-card-form/background-image.spec.ts | 10 +
.../demo/credit-card-form/basic-usage.spec.ts | 13 +
.../credit-card-form-events.spec.ts | 18 +
.../pc/demo/currency/basic-usage.spec.ts | 9 +
.../pc/demo/currency/custom-service.spec.ts | 11 +
.../pc/demo/currency/custom-service.vue | 62 +-
.../pc/demo/currency/disable-currency.spec.ts | 9 +
.../resources/pc/demo/currency/size.spec.ts | 8 +
.../pc/demo/dept/custom-service.spec.ts | 23 +
.../resources/pc/demo/dept/custom-service.vue | 299 ++++-
.../pc/demo/detail-page/basic-usage.spec.ts | 29 +
.../demo/detail-page/custom-show-text.spec.ts | 18 +
.../pc/demo/dialog-box/basic-usage.spec.ts | 52 +
.../pc/demo/dialog-box/center.spec.ts | 21 +
.../dialog-box/close-on-click-modal.spec.ts | 16 +
.../dialog-box/close-on-press-escape.spec.ts | 16 +
.../dialog-box/custom-dialog-content.spec.ts | 16 +
.../dialog-box/custom-dialog-footer.spec.ts | 20 +
.../dialog-box/custom-dialog-title.spec.ts | 18 +
.../demo/dialog-box/dialog-top-height.spec.ts | 22 +
.../pc/demo/dialog-box/dialog-top-height.vue | 4 +-
.../pc/demo/dialog-box/dialog-width.spec.ts | 24 +
.../pc/demo/dialog-box/draggable.spec.ts | 27 +
.../pc/demo/dialog-box/draggable.vue | 14 +-
.../pc/demo/dialog-box/form-in-dialog.spec.ts | 15 +
.../pc/demo/dialog-box/fullscreen.spec.ts | 11 +
.../dialog-box/hidden-close-buttons.spec.ts | 10 +
.../pc/demo/dialog-box/hidden-header.spec.ts | 10 +
.../pc/demo/dialog-box/lock-scroll.spec.ts | 20 +
.../pc/demo/dialog-box/no-modal.spec.ts | 9 +
.../demo/dialog-box/open-close-events.spec.ts | 14 +
.../pc/demo/dialog-box/right-dialog.spec.ts | 12 +
.../demo/dialog-box/secondary-dialog.spec.ts | 11 +
.../pc/demo/drop-roles/custom-service.spec.ts | 26 +
.../pc/demo/drop-roles/custom-service.vue | 7 +-
.../pc/demo/drop-times/basic-usage.spec.ts | 16 +
.../resources/pc/demo/drop-times/size.spec.ts | 9 +
.../pc/demo/drop-times/start-end-step.spec.ts | 16 +
.../pc/demo/dropdown/basic-usage.spec.ts | 28 +
.../pc/demo/dropdown/disabled.spec.ts | 17 +
.../resources/pc/demo/dropdown/events.spec.ts | 19 +
.../pc/demo/dropdown/hide-on-click.spec.ts | 17 +
.../pc/demo/dropdown/multi-level.spec.ts | 19 +
.../pc/demo/dropdown/options.spec.ts | 22 +
.../resources/pc/demo/dropdown/size.spec.ts | 18 +
.../pc/demo/dropdown/slot-default.spec.ts | 11 +
.../pc/demo/dropdown/split-button.spec.ts | 24 +
.../resources/pc/demo/dropdown/title.spec.ts | 11 +
.../pc/demo/dropdown/trigger.spec.ts | 19 +
.../resources/pc/demo/espace/data.spec.ts | 15 +
.../pc/demo/fall-menu/custom-menuitem.spec.ts | 20 +
.../demo/fall-menu/custom-slider-icon.spec.ts | 28 +
.../pc/demo/fall-menu/data-resource.spec.ts | 25 +
.../pc/demo/file-upload/abort-quest.spec.ts | 21 +
.../pc/demo/file-upload/abort-quest.vue | 6 +-
.../file-upload/accept-file-image.spec.ts | 21 +
.../pc/demo/file-upload/basic-usage.spec.ts | 17 +
.../pc/demo/file-upload/clear-files.spec.ts | 13 +
.../pc/demo/file-upload/custom-prefix.spec.ts | 27 +
.../demo/file-upload/custom-trigger.spec.ts | 10 +
.../file-upload/custom-upload-request.spec.ts | 18 +
.../file-upload/custom-upload-tip.spec.ts | 10 +
.../demo/file-upload/drag-select-file.spec.ts | 24 +
.../pc/demo/file-upload/drag-upload.spec.ts | 20 +
.../file-upload/file-picture-card.spec.ts | 35 +
.../pc/demo/file-upload/http-request.spec.ts | 19 +
.../pc/demo/file-upload/image-size.spec.ts | 16 +
.../pc/demo/file-upload/manual-upload.spec.ts | 20 +
.../demo/file-upload/max-file-count.spec.ts | 21 +
.../pc/demo/file-upload/mini-mode.spec.ts | 10 +
.../pc/demo/file-upload/multiple-file.spec.ts | 21 +
.../pc/demo/file-upload/picture-card.spec.ts | 37 +
.../pc/demo/file-upload/picture-list.spec.ts | 28 +
.../file-upload/prevent-delete-file.spec.ts | 20 +
.../file-upload/prevent-upload-file.spec.ts | 23 +
.../pc/demo/file-upload/size.spec.ts | 13 +
.../pc/demo/file-upload/upload-events.spec.ts | 29 +
.../upload-file-list-thumb.spec.ts | 20 +
.../file-upload/upload-file-list-thumb.vue | 3 +-
.../demo/file-upload/upload-file-list.spec.ts | 22 +
.../pc/demo/file-upload/upload-limit.spec.ts | 23 +
.../demo/file-upload/upload-request.spec.ts | 29 +
.../demo/file-upload/upload-user-head.spec.ts | 14 +
.../pc/demo/file-upload/upload-user-head.vue | 8 +-
.../resources/pc/demo/file-upload/测试.jpg | Bin 0 -> 10126 bytes
.../resources/pc/demo/file-upload/测试.png | Bin 0 -> 4844 bytes
.../resources/pc/demo/file-upload/测试.svg | Bin 0 -> 6046 bytes
.../resources/pc/demo/floatbar/base.spec.ts | 11 +
.../floatbar/custom-floatbar-item.spec.ts | 14 +
.../pc/demo/floatbar/custom-style.spec.ts | 14 +
.../pc/demo/floatbar/custom-style.vue | 8 +-
.../floatbar/operation-floatbar-item.spec.ts | 15 +
.../demo/form/custom-validation-rule.spec.js | 93 ++
.../pc/demo/form/custom-validation-rule.vue | 8 +-
.../pc/demo/form/form-clear-validate.spec.js | 29 +
.../pc/demo/form/form-clear-validate.vue | 8 +-
.../pc/demo/form/form-disabled.spec.js | 73 ++
.../resources/pc/demo/form/form-disabled.vue | 19 +-
.../pc/demo/form/form-in-row.spec.js | 31 +
.../resources/pc/demo/form/form-in-row.vue | 4 +-
.../pc/demo/form/form-row-col.spec.js | 23 +
.../resources/pc/demo/form/form-row-col.vue | 4 +-
.../pc/demo/form/form-validation.spec.js | 104 ++
.../pc/demo/form/form-validation.vue | 8 +-
.../pc/demo/form/frequently-used-form.spec.js | 47 +
.../pc/demo/form/frequently-used-form.vue | 11 +-
.../resources/pc/demo/form/group-form.spec.js | 20 +
.../resources/pc/demo/form/group-form.vue | 34 +-
.../pc/demo/form/label-align.spec.js | 30 +
.../resources/pc/demo/form/label-align.vue | 12 +-
.../pc/demo/form/no-validate-to-add.spec.js | 28 +
.../pc/demo/form/no-validate-to-add.vue | 8 +-
.../pc/demo/form/novalid-tip.spec.js | 15 +
.../resources/pc/demo/form/novalid-tip.vue | 4 +-
.../docs/resources/pc/demo/form/size.spec.js | 22 +
examples/docs/resources/pc/demo/form/size.vue | 11 +-
.../resources/pc/demo/form/slot-label.spec.js | 15 +
.../resources/pc/demo/form/slot-label.vue | 20 +-
.../pc/demo/form/validate-type.spec.js | 21 +
.../resources/pc/demo/form/validate-type.vue | 4 +-
.../pc/demo/form/validation-position.spec.js | 22 +
.../pc/demo/form/validation-position.vue | 4 +-
.../pc/demo/fullscreen/example-api.spec.ts | 62 +
.../demo/fullscreen/example-component.spec.ts | 62 +
.../pc/demo/fullscreen/example-component.vue | 28 +-
.../pc/demo/grid/align/column-align.spec.js | 10 +
.../footer-align/center-footer-align.spec.js | 7 +
.../footer-align/left-footer-align.spec.js | 7 +
.../footer-align/right-footer-align.spec.js | 7 +
.../grid-align/center-grid-align.spec.js | 7 +
.../align/grid-align/left-grid-align.spec.js | 7 +
.../align/grid-align/right-grid-align.spec.js | 7 +
.../align/grid-align/right-grid-align.vue | 2 +-
.../header-align/center-header-align.spec.js | 7 +
.../header-align/left-header-align.spec.js | 7 +
.../header-align/right-header-align.spec.js | 7 +
.../pc/demo/grid/basicUsage-conf.spec.js | 7 +
.../resources/pc/demo/grid/basicUsage.spec.js | 8 +
.../pc/demo/grid/column/class-name.spec.js | 7 +
.../demo/grid/custom-style/cell-style.spec.js | 15 +
.../pc/demo/grid/custom-style/cell-style.vue | 2 -
.../footer-style/footer-cell-style.spec.js | 7 +
.../footer-style/footer-row-style.spec.js | 8 +
.../header-style/header-cell-style.spec.js | 7 +
.../header-style/header-row-style.spec.js | 7 +
.../demo/grid/custom-style/row-style.spec.js | 8 +
.../pc/demo/grid/custom/column-sort.spec.js | 2 +-
.../pc/demo/grid/custom/resetResizable.vue | 6 +-
.../pc/demo/grid/disable-radio.spec.js | 9 +
.../pc/demo/grid/disable-selection.spec.js | 9 +
.../pc/demo/grid/drag/column-drag.spec.js | 19 +
.../pc/demo/grid/drag/row-drag-ctrl.spec.js | 19 +
.../pc/demo/grid/drag/row-drag.spec.js | 19 +
.../pc/demo/grid/edit/hasRowChange.spec.js | 19 +
.../pc/demo/grid/edit/mutil-render.spec.js | 23 +
.../pc/demo/grid/edit/revertData.spec.js | 24 +
.../grid/event/cell-dblclick-event.spec.js | 2 +-
.../grid/event/cell-mouseenter-event.spec.js | 2 +-
.../grid/event/cell-mouseleave-event.spec.js | 4 +-
.../grid/event/current-change-event.spec.js | 2 +-
.../grid/event/edit-actived-event.spec.js | 2 +-
.../demo/grid/event/edit-closed-event.spec.js | 2 +-
.../grid/event/edit-disabled-event.spec.js | 2 +-
.../demo/grid/event/grid-scroll-event.spec.js | 2 +-
.../grid/event/table-data-association.spec.js | 2 +-
.../demo/grid/event/valid-error-event.spec.js | 2 +-
.../pc/demo/grid/faq/gridInDialogBox.spec.js | 4 +-
.../resources/pc/demo/grid/faq/opSlot.spec.js | 4 +-
.../pc/demo/grid/fixed/left-fixed.spec.js | 9 +
.../grid/fixed/multi-column-fixed.spec.js | 8 +
.../pc/demo/grid/fixed/right-fixed.spec.js | 7 +
.../grid/footer/footer-class-name.spec.js | 7 +
.../footer/footer-row-or-column-span.spec.js | 8 +
.../footer/footer-summation-empty.spec.js | 9 +
.../demo/grid/footer/footer-summation.spec.js | 7 +
.../gridEdit/custom-editor-select.spec.js | 14 +
.../gridEdit/custom-editor.spec.js | 15 +
.../gridEdit/inner-editor.spec.js | 15 +
.../popeditor-in-grid-remote-search.spec.js | 14 +
.../gridEdit/popeditor-in-grid.spec.js | 14 +
.../gridRenderer/custom-renderer.spec.js | 15 +
.../gridRenderer/inner-renderer.spec.js | 8 +
.../before-submit-validation.spec.js | 2 +-
.../grid_Example/gridValid/custcomp.spec.js | 2 +-
.../gridValid/editing-validation.spec.js | 2 +-
.../gridValid/row-data-valid.spec.js | 3 +-
.../gridValid/select-validation.spec.js | 2 +-
.../validation-scroll-to-col.spec.js | 2 +-
.../demo/grid/grid_Example/reverseRow.spec.js | 2 +-
.../shortcutMenu/cell-menu.spec.js | 15 +
.../shortcutMenu/footer-menu.spec.js | 10 +
.../shortcutMenu/header-menu.spec.js | 10 +
.../shortcutMenu/menu-permissions.spec.js | 10 +
.../grid/header/custom-grid-header.spec.js | 9 +
.../grid/header/header-class-name.spec.js | 7 +
.../demo/grid/header/hide-grid-header.spec.js | 7 +
.../pc/demo/grid/header/slot-header.spec.js | 9 +
.../grid/highlight/highlight-cell.spec.js | 8 +
.../highlight-current-column.spec.js | 10 +
.../highlight/highlight-current-row.spec.js | 10 +
.../highlight/highlight-hover-column.spec.js | 9 +
.../highlight/highlight-hover-row.spec.js | 10 +
.../pc/demo/grid/keyboard-config.spec.js | 2 +-
.../demo/grid/large-data/load-column.spec.js | 8 +
.../pc/demo/grid/large-data/scroll-to.spec.js | 10 +
.../demo/grid/methods/set-active-cell.spec.js | 13 +
.../grid/methods/set-all-selection.spec.js | 12 +
.../demo/grid/methods/set-current-row.spec.js | 8 +
.../demo/grid/methods/set-selection.spec.js | 9 +
.../pc/demo/grid/methods/set-selection.vue | 17 +-
.../pc/demo/grid/methods/sort.spec.js | 8 +
.../grid/methods/toggle-all-selection.spec.js | 19 +
.../grid/methods/toggle-row-selection.spec.js | 14 +
.../pc/demo/grid/mouse-config.spec.js | 2 +-
.../grid/news/async-colunm-render.spec.js | 8 +
.../pc/demo/grid/news/auto-height.spec.js | 10 +
.../pc/demo/grid/news/editor-events.spec.js | 14 +
.../grid/pager/inner-default-pager.spec.js | 8 +
.../pc/demo/grid/pager/inner-pager.spec.js | 8 +
.../pc/demo/grid/pager/showSaveMsg.spec.js | 16 +
.../pc/demo/grid/recalculate.spec.js | 11 +
.../pc/demo/grid/row-grouping.spec.js | 8 +
.../pc/demo/grid/rowGroupRender.spec.js | 7 +
.../demo/grid/sort/combinations-sort.spec.js | 8 +
.../pc/demo/grid/sort/custom-sort.spec.js | 8 +
.../pc/demo/grid/sort/default-sort.spec.js | 11 +
.../pc/demo/grid/sort/server-sort.spec.js | 8 +
.../pc/demo/grid/span/column-span.spec.js | 10 +
.../grid/span/row-span/row-span-easy.spec.js | 10 +
.../demo/grid/span/row-span/row-span.spec.js | 11 +
.../pc/demo/grid/stripe/stripe.spec.js | 7 +
.../summary/configuration-summary.spec.js | 7 +
.../demo/grid/summary/custom-summary.spec.js | 7 +
.../adaptive-column-width.spec.js | 9 +
.../adaptive-grid-off-width-height.spec.js | 11 +
.../adaptive-grid-off-width-height.vue | 17 +-
.../adaptive-un-column-width.spec.js | 9 +
.../grid/tiny-first-menu/auto-load.spec.js | 10 +
.../grid/tiny-first-menu/cell-editing.spec.js | 17 +
.../grid/tiny-first-menu/clearData.spec.js | 12 +
.../tiny-first-menu/clearRadioRow.spec.js | 18 +
.../tiny-first-menu/clearSelection.spec.js | 24 +
.../column-asyn-rendering.spec.js | 15 +
.../tiny-first-menu/column-asyn-rendering.vue | 2 +-
.../tiny-first-menu/column-min-width.spec.js | 12 +
.../grid/tiny-first-menu/column-width.spec.js | 14 +
.../demo/grid/tiny-first-menu/columns.spec.js | 12 +
.../tiny-first-menu/copy-row-data.spec.js | 7 +
.../tiny-first-menu/custom-editing.spec.js | 16 +
.../custom-operation-column.spec.js | 16 +
.../custom-serial-column.spec.js | 9 +
.../tiny-first-menu/custom-toolbar.spec.js | 9 +
.../default-serial-column.spec.js | 8 +
.../editor-is-salid-always.spec.js | 13 +
.../empty-data-default-tip.spec.js | 9 +
.../tiny-first-menu/empty-data-tip.spec.js | 9 +
.../fixed-column-width.spec.js | 8 +
.../tiny-first-menu/fixed-grid-height.spec.js | 9 +
.../grid/tiny-first-menu/format-value.spec.js | 13 +
.../tiny-first-menu/full-data-loading.spec.js | 15 +
.../tiny-first-menu/full-data-loading.vue | 1 +
.../grid/tiny-first-menu/grid-border.spec.js | 8 +
.../grid-full-screen-height.spec.js | 8 +
.../tiny-first-menu/grid-full-screen.spec.js | 12 +
.../grid/tiny-first-menu/grid-full-screen.vue | 7 +-
.../grid-large-tree-data.spec.js | 13 +
.../grid-loading-off-tip.spec.js | 8 +
.../tiny-first-menu/grid-loading-tip.spec.js | 8 +
.../tiny-first-menu/grid-size-mini.spec.js | 8 +
.../tiny-first-menu/grid-size-small.spec.js | 8 +
.../grid/tiny-first-menu/grid-size.spec.js | 8 +
.../insert-delete-update.spec.js | 45 +
.../max-min-grid-height.spec.js | 8 +
.../tiny-first-menu/min-grid-height.spec.js | 8 +
.../grid/tiny-first-menu/min-width.spec.js | 8 +
.../grid/tiny-first-menu/radio-config.spec.js | 20 +
.../grid/tiny-first-menu/refresh-grid.spec.js | 8 +
.../tiny-first-menu/request-service.spec.js | 11 +
.../resize-column-width.spec.js | 24 +
.../grid/tiny-first-menu/row-editing.spec.js | 12 +
.../demo/grid/tiny-first-menu/row-id.spec.js | 8 +
.../pc/demo/grid/tiny-first-menu/row-id.vue | 31 +-
.../grid/tiny-first-menu/save-data.spec.js | 16 +
.../tiny-first-menu/scroll-paging.spec.js | 10 +
.../grid/tiny-first-menu/start-index.spec.js | 8 +
.../grid/tiny-first-menu/static-data.spec.js | 10 +
.../tiny-first-menu/status-of-editing.spec.js | 15 +
.../status-of-noediting.spec.js | 15 +
.../trigger-mode-db-editing.spec.js | 16 +
.../trigger-mode-for-editing.spec.js | 14 +
.../trigger-mode-hm-editing.spec.js | 15 +
.../tiny-first-menu/virtual-rolling.spec.js | 15 +
.../grid/tiny-first-menu/virtual-rolling.vue | 17 +-
.../pc/demo/grid/tip/cell-tip.spec.js | 14 +
.../demo/grid/tip/column-header-tip.spec.js | 11 +
.../demo/grid/toolbar/cancel-delete.spec.js | 14 +
.../grid/toolbar/insert-remove-rows.spec.js | 8 +
.../grid/toolbar/toolbar-op-config.spec.js | 8 +
.../grid/tree-table/tree-grid-expand.spec.js | 2 +-
.../tree-table/tree-grid-fixed-column.spec.js | 2 +-
.../tree-grid-insert-delete-update.spec.js | 4 +-
.../pc/demo/hrapprover/basic-usage.spec.ts | 13 +
.../pc/demo/hrapprover/category-type.spec.ts | 13 +
.../pc/demo/hrapprover/custom-service.spec.ts | 7 +
.../pc/demo/hrapprover/custom-service.vue | 35 +-
.../pc/demo/hrapprover/disabled.spec.ts | 8 +
.../image/auto-fit-container-size.spec.ts | 16 +
.../pc/demo/image/basic-usage.spec.ts | 11 +
.../image/custom-load-failed-text.spec.ts | 10 +
.../pc/demo/image/custom-placeholder.spec.ts | 11 +
.../resources/pc/demo/image/lazy-load.spec.ts | 13 +
.../pc/demo/image/load-error.spec.ts | 8 +
.../pc/demo/image/load-event.spec.ts | 9 +
.../pc/demo/image/preview-in-dialog.spec.ts | 9 +
.../pc/demo/image/preview-src-list.spec.ts | 37 +
.../pc/demo/image/preview-z-index.spec.ts | 9 +
.../pc/demo/input/autocomplete.spec.ts | 8 +
.../resources/pc/demo/input/autofocus.spec.ts | 8 +
.../resources/pc/demo/input/autosize.spec.ts | 8 +
.../pc/demo/input/basic-usage.spec.ts | 11 +
.../resources/pc/demo/input/clearable.spec.ts | 14 +
.../docs/resources/pc/demo/input/cols.spec.ts | 8 +
.../resources/pc/demo/input/counter.spec.ts | 10 +
.../pc/demo/input/event-blur.spec.ts | 10 +
.../pc/demo/input/event-change.spec.ts | 11 +
.../pc/demo/input/event-clear.spec.ts | 11 +
.../pc/demo/input/event-focus.spec.ts | 10 +
.../docs/resources/pc/demo/input/form.spec.ts | 8 +
.../resources/pc/demo/input/label.spec.ts | 8 +
.../docs/resources/pc/demo/input/max.spec.ts | 8 +
.../resources/pc/demo/input/maxlength.spec.ts | 8 +
.../pc/demo/input/method-addMemory.spec.ts | 18 +
.../pc/demo/input/method-blur.spec.ts | 11 +
.../pc/demo/input/method-focus.spec.ts | 9 +
.../pc/demo/input/method-select.spec.ts | 12 +
.../docs/resources/pc/demo/input/min.spec.ts | 8 +
.../docs/resources/pc/demo/input/name.spec.ts | 10 +
.../pc/demo/input/prefix-icon.spec.ts | 8 +
.../resources/pc/demo/input/resize.spec.ts | 12 +
.../docs/resources/pc/demo/input/rows.spec.ts | 8 +
.../pc/demo/input/show-password.spec.ts | 14 +
.../pc/demo/input/show-word-limit.spec.ts | 10 +
.../docs/resources/pc/demo/input/size.spec.ts | 12 +
.../pc/demo/input/slot-append.spec.ts | 8 +
.../pc/demo/input/slot-prefix.spec.ts | 8 +
.../pc/demo/input/slot-prepend.spec.ts | 8 +
.../pc/demo/input/slot-suffix.spec.ts | 8 +
.../docs/resources/pc/demo/input/step.spec.ts | 8 +
.../pc/demo/input/suffix-icon.spec.ts | 8 +
.../resources/pc/demo/input/tabindex.spec.ts | 21 +
.../docs/resources/pc/demo/input/type.spec.ts | 24 +
.../pc/demo/input/validate-event.spec.ts | 14 +
.../resources/pc/demo/ip-address/blur.spec.ts | 27 +
.../pc/demo/ip-address/change.spec.ts | 27 +
.../pc/demo/ip-address/delimiter.spec.ts | 14 +
.../pc/demo/ip-address/disabled.spec.ts | 16 +
.../pc/demo/ip-address/focus.spec.ts | 23 +
.../pc/demo/ip-address/input.spec.ts | 23 +
.../pc/demo/ip-address/ipv4-type.spec.ts | 11 +
.../pc/demo/ip-address/ipv6-type.spec.ts | 11 +
.../pc/demo/ip-address/readonly.spec.ts | 24 +
.../pc/demo/ip-address/select.spec.ts | 22 +
.../resources/pc/demo/ip-address/size.spec.ts | 12 +
.../pc/demo/ip-address/slots.spec.ts | 14 +
.../pc/demo/layout/alignment.spec.ts | 13 +
.../pc/demo/layout/basic-usage.spec.ts | 21 +
.../resources/pc/demo/layout/gutter.spec.ts | 16 +
.../resources/pc/demo/layout/offset.spec.ts | 9 +
.../resources/pc/demo/layout/order.spec.ts | 13 +
.../pc/demo/layout/responsive-layout.spec.ts | 23 +
.../pc/demo/link-menu/custom-foot.spec.ts | 22 +
.../pc/demo/link-menu/custom-icon.spec.ts | 30 +
.../pc/demo/link-menu/data-resource.spec.ts | 90 ++
.../demo/link-menu/get-menu-data-sync.spec.ts | 41 +
.../pc/demo/link-menu/menu-items.spec.ts | 51 +
.../pc/demo/link/basic-usage.spec.ts | 10 +
.../pc/demo/link/config-href.spec.ts | 10 +
.../pc/demo/link/custom-icon.spec.ts | 15 +
.../pc/demo/link/dynamic-disable.spec.ts | 31 +
.../pc/demo/link/focus-no-underline.spec.ts | 13 +
.../resources/pc/demo/link/link-style.spec.ts | 25 +
.../pc/demo/loading/background.spec.ts | 8 +
.../pc/demo/loading/basic-usage.spec.ts | 10 +
.../resources/pc/demo/loading/body.spec.ts | 8 +
.../pc/demo/loading/custom-class.spec.ts | 10 +
.../pc/demo/loading/fullscreen.spec.ts | 14 +
.../pc/demo/loading/loading-tip-text.spec.ts | 8 +
.../resources/pc/demo/loading/size.spec.ts | 12 +
.../resources/pc/demo/loading/spinner.spec.ts | 16 +
.../resources/pc/demo/loading/target.spec.ts | 8 +
.../pc/demo/milestone/basic-usage.spec.ts | 68 +
.../pc/demo/milestone/custom-bottom.spec.ts | 15 +
.../pc/demo/milestone/custom-flag.spec.ts | 15 +
.../demo/milestone/custom-icon-slot.spec.ts | 15 +
.../pc/demo/milestone/custom-top.spec.ts | 15 +
.../demo/milestone/data-field-mapping.spec.ts | 22 +
.../pc/demo/milestone/data-source.spec.ts | 14 +
.../pc/demo/milestone/flag-before.spec.ts | 48 +
.../pc/demo/milestone/line-style.spec.ts | 15 +
.../demo/milestone/milestone-events.spec.ts | 15 +
.../pc/demo/milestone/milestone-space.spec.ts | 12 +
.../demo/milestone/milestones-status.spec.ts | 52 +
.../pc/demo/milestone/milestones-status.vue | 2 +-
.../pc/demo/milestone/show-number.spec.ts | 63 +
.../pc/demo/milestone/solid-style.spec.ts | 59 +
.../pc/demo/milestone/start-index.spec.ts | 14 +
.../docs/resources/pc/demo/modal/base.spec.ts | 43 +
.../docs/resources/pc/demo/modal/base.vue | 19 +-
.../pc/demo/modal/cancel-event.spec.ts | 12 +
.../pc/demo/modal/close-event.spec.ts | 13 +
.../pc/demo/modal/confirm-event.spec.ts | 12 +
.../resources/pc/demo/modal/duration.spec.ts | 25 +
.../pc/demo/modal/esc-closable.spec.ts | 11 +
.../pc/demo/modal/footer-slot.spec.ts | 11 +
.../pc/demo/modal/fullscreen.spec.ts | 12 +
.../docs/resources/pc/demo/modal/grid.spec.ts | 11 +
.../pc/demo/modal/hide-event.spec.ts | 17 +
.../docs/resources/pc/demo/modal/id.spec.ts | 11 +
.../pc/demo/modal/is-form-reset.spec.ts | 17 +
.../pc/demo/modal/lock-scroll.spec.ts | 17 +
.../resources/pc/demo/modal/lock-scroll.vue | 3 +-
.../resources/pc/demo/modal/lock-view.spec.ts | 27 +
.../pc/demo/modal/mask-closable.spec.ts | 11 +
.../resources/pc/demo/modal/message.spec.ts | 9 +
.../pc/demo/modal/min-height.spec.ts | 21 +
.../resources/pc/demo/modal/min-width.spec.ts | 20 +
.../resources/pc/demo/modal/resize.spec.ts | 25 +
.../pc/demo/modal/show-event.spec.ts | 11 +
.../pc/demo/modal/showFooter.spec.ts | 10 +
.../pc/demo/modal/showHeader.spec.ts | 10 +
.../resources/pc/demo/modal/status.spec.ts | 35 +
.../resources/pc/demo/modal/title.spec.ts | 10 +
.../docs/resources/pc/demo/modal/top.spec.ts | 10 +
.../docs/resources/pc/demo/modal/type.spec.ts | 22 +
.../resources/pc/demo/modal/value.spec.ts | 23 +
.../docs/resources/pc/demo/modal/value.vue | 7 +-
.../resources/pc/demo/modal/zIndex.spec.ts | 10 +
.../pc/demo/modal/zoom-event.spec.ts | 19 +
.../pc/demo/nav-menu/basic-usage.spec.ts | 17 +
.../demo/nav-menu/before-skip-prevent.spec.ts | 16 +
.../pc/demo/nav-menu/before-skip-prevent.vue | 306 ++++-
.../pc/demo/nav-menu/before-skip.spec.ts | 11 +
.../pc/demo/nav-menu/custom-service.spec.ts | 12 +
.../pc/demo/nav-menu/data-resource.spec.ts | 17 +
.../pc/demo/nav-menu/overflow.spec.ts | 14 +
.../pc/demo/nav-menu/slot-logo.spec.ts | 8 +
.../pc/demo/nav-menu/slot-toolbar.spec.ts | 8 +
.../pc/demo/notify/basic-usage.spec.ts | 15 +
.../pc/demo/notify/beforeClose.spec.ts | 13 +
.../pc/demo/notify/closeIcon.spec.ts | 12 +
.../pc/demo/notify/debounceDelay.spec.ts | 16 +
.../resources/pc/demo/notify/duration.spec.ts | 20 +
.../resources/pc/demo/notify/message.spec.ts | 9 +
.../resources/pc/demo/notify/onClose.spec.ts | 11 +
.../resources/pc/demo/notify/position.spec.ts | 13 +
.../pc/demo/notify/showClose.spec.ts | 9 +
.../resources/pc/demo/notify/showIcon.spec.ts | 9 +
.../pc/demo/notify/statusIcon.spec.ts | 9 +
.../resources/pc/demo/notify/title.spec.ts | 9 +
.../resources/pc/demo/notify/type.spec.ts | 21 +
.../pc/demo/notify/verticalOffset.spec.ts | 10 +
.../pc/demo/numeric/about-step.spec.ts | 18 +
.../pc/demo/numeric/allow-empty.spec.ts | 13 +
.../pc/demo/numeric/basic-usage.spec.ts | 22 +
.../pc/demo/numeric/blur-event.spec.ts | 11 +
...alculate-according-to-num-of-goods.spec.ts | 13 +
.../pc/demo/numeric/change-event.spec.ts | 10 +
.../pc/demo/numeric/controls-position.spec.ts | 16 +
.../pc/demo/numeric/controls.spec.ts | 29 +
.../pc/demo/numeric/dynamic-disabled.spec.ts | 11 +
.../pc/demo/numeric/focus-event.spec.ts | 10 +
.../resources/pc/demo/numeric/max-min.spec.ts | 18 +
.../pc/demo/numeric/mouse-wheel.spec.ts | 13 +
.../pc/demo/numeric/numeric-size.spec.ts | 27 +
.../pc/demo/numeric/precision.spec.ts | 22 +
.../pc/demo/pager/basic-usage.spec.js | 54 +-
.../pc/demo/pager/before-page-change.spec.js | 53 +-
.../pc/demo/pager/current-page.spec.js | 33 +-
.../pc/demo/pager/custom-layout.spec.js | 41 +-
.../demo/pager/custom-next-prev-text.spec.js | 23 +-
.../pc/demo/pager/hide-on-single-page.spec.js | 25 +-
.../pc/demo/pager/page-append-to-body.spec.js | 21 +-
.../pc/demo/pager/page-count.spec.js | 19 +-
.../resources/pc/demo/pager/page-size.spec.js | 34 +-
.../pc/demo/pager/pager-count.spec.js | 19 +-
.../pc/demo/pager/pager-disabled.spec.js | 19 +
.../pager/pager-events-current-change.spec.js | 23 +-
.../demo/pager/pager-events-nextclick.spec.js | 27 +-
.../pager/pager-events-prev-click.spec.js | 27 +-
.../pc/demo/pager/pager-events.spec.js | 26 +-
.../pc/demo/pager/pager-in-grid.spec.js | 28 +-
.../pc/demo/pager/pager-mode-fixed.spec.js | 28 +-
.../pc/demo/pager/pager-mode-number.spec.js | 24 +-
.../pc/demo/pager/pager-mode-simple.spec.js | 37 +-
.../pc/demo/pager/pager-mode.spec.js | 36 +-
.../pc/demo/pager/pager-size.spec.js | 11 +
.../pc/demo/pager/popper-class.spec.js | 21 +-
.../pc/demo/pop-upload/basic-usage.spec.ts | 43 +
.../pc/demo/pop-upload/before-upload.spec.ts | 25 +
.../pop-upload/custom-request-headers.spec.ts | 25 +
.../resources/pc/demo/pop-upload/data.spec.ts | 24 +
.../pc/demo/pop-upload/file-limit.spec.ts | 32 +
.../pc/demo/pop-upload/file-type.spec.ts | 28 +
.../demo/pop-upload/fill-button-text.spec.ts | 41 +
.../pc/demo/pop-upload/fill-button-text.vue | 5 +-
.../pc/demo/pop-upload/http-request.spec.ts | 26 +
.../pop-upload/max-upload-file-size.spec.ts | 24 +
.../demo/pop-upload/max-upload-file-size.vue | 2 +-
.../pop-upload/prevent-delete-file.spec.ts | 23 +
.../resources/pc/demo/pop-upload/size.spec.ts | 14 +
.../pc/demo/pop-upload/upload-name.spec.ts | 46 +
.../pc/demo/pop-upload/upload-name.vue | 2 +-
.../resources/pc/demo/pop-upload/测试.jpg | Bin 0 -> 10126 bytes
.../resources/pc/demo/pop-upload/测试.png | Bin 0 -> 4844 bytes
.../resources/pc/demo/pop-upload/测试.svg | Bin 0 -> 6046 bytes
.../pc/demo/popover/arrow-offset.spec.js | 17 +
.../pc/demo/popover/arrow-offset.vue | 18 +-
.../pc/demo/popover/basic-usage.spec.js | 12 +
.../pc/demo/popover/close-delay.spec.js | 16 +
.../pc/demo/popover/custom-tip-text.spec.js | 17 +
.../pc/demo/popover/custom-transition.spec.js | 17 +
.../pc/demo/popover/dynamic-disable.spec.js | 18 +
.../pc/demo/popover/frame-offset.spec.js | 15 +
.../pc/demo/popover/frame-offset.vue | 14 +-
.../pc/demo/popover/hidden-arrow.spec.js | 18 +
.../pc/demo/popover/open-delay.spec.js | 15 +
.../pc/demo/popover/popover-content.spec.js | 12 +
.../pc/demo/popover/popover-events.spec.js | 19 +
.../pc/demo/popover/popover-placement.spec.js | 43 +
.../pc/demo/popover/popover-width.spec.js | 12 +
.../pc/demo/popover/popper-class.spec.js | 21 +
.../pc/demo/popover/popper-options.spec.js | 12 +
.../pc/demo/popover/trigger-mode.spec.js | 31 +
.../pc/demo/popover/trigger-mode.vue | 39 +-
.../pc/demo/popover/trigger-reference.spec.js | 12 +
.../pc/demo/progress/basic-usage.spec.ts | 20 +
.../pc/demo/progress/custom-color.spec.ts | 21 +
.../pc/demo/progress/custom-color.vue | 16 +-
.../progress/dynamic-control-changes.spec.ts | 16 +
.../pc/demo/progress/format-text.spec.ts | 20 +
.../pc/demo/progress/progress-status.spec.ts | 20 +
.../progress/progress-type-circle.spec.ts | 23 +
.../progress/progress-type-dashboard.spec.ts | 14 +
.../pc/demo/progress/progress-type.spec.ts | 16 +
.../pc/demo/progress/progress-width.spec.ts | 14 +
.../progress/text-inside-or-no-text.spec.ts | 16 +
.../pc/demo/radio/active-color.spec.ts | 10 +
.../pc/demo/radio/basic-usage.spec.ts | 11 +
.../pc/demo/radio/dynamic-disable.spec.ts | 14 +
.../pc/demo/radio/group-options.spec.ts | 15 +
.../pc/demo/radio/radio-button.spec.ts | 12 +
.../pc/demo/radio/radio-default.spec.ts | 10 +
.../resources/pc/demo/radio/radio-default.vue | 7 +-
.../pc/demo/radio/radio-events.spec.ts | 13 +
.../pc/demo/radio/radio-size.spec.ts | 12 +
.../pc/demo/radio/radio-text.spec.ts | 10 +
.../pc/demo/radio/radio-value.spec.ts | 11 +
.../resources/pc/demo/radio/vertical.spec.ts | 9 +
.../pc/demo/radio/with-border.spec.ts | 12 +
.../resources/pc/demo/rate/allow-half.spec.js | 17 +
.../pc/demo/rate/basic-usage.spec.js | 60 +
.../rate/custom-3-threshold-colors.spec.js | 33 +
.../demo/rate/custom-3-threshold-icon.spec.js | 36 +
.../rate/disabled-not-selected-class.spec.js | 28 +
.../rate/disabled-not-selected-color.spec.js | 19 +
.../pc/demo/rate/dynamic-disable.spec.js | 17 +
.../resources/pc/demo/rate/max-score.spec.js | 12 +
.../pc/demo/rate/not-selected-class.spec.js | 17 +
.../pc/demo/rate/not-selected-color.spec.js | 18 +
.../resources/pc/demo/rate/radio-rate.spec.js | 13 +
.../pc/demo/rate/rate-events.spec.js | 14 +
.../resources/pc/demo/rate/show-score.spec.js | 15 +
.../pc/demo/rate/size-and-space.spec.js | 14 +
.../pc/demo/rate/text-on-bottom.spec.js | 23 +
.../pc/demo/rate/texts-and-text-color.spec.js | 31 +
.../pc/demo/rate/threshold-value.spec.js | 33 +
.../docs/resources/pc/demo/row/gutter.vue | 2 +-
.../pc/demo/scroll-text/basic-usage.spec.ts | 7 +
.../scroll-text/custom-scroll-text.spec.ts | 7 +
.../scroll-text/custom-text-style.spec.ts | 7 +
.../pc/demo/scroll-text/hover-stop.spec.ts | 8 +
.../demo/scroll-text/scroll-direction.spec.ts | 10 +
.../pc/demo/scroll-text/scroll-time.spec.ts | 7 +
.../pc/demo/scroll-text/slots.spec.ts | 7 +
.../pc/demo/search/basic-usage.spec.ts | 20 +
.../pc/demo/search/change-events.spec.ts | 13 +
.../pc/demo/search/clearable.spec.ts | 14 +
.../demo/search/custom-search-types.spec.ts | 16 +
.../pc/demo/search/default-value.spec.ts | 10 +
.../pc/demo/search/mini-mode.spec.ts | 27 +
.../pc/demo/search/search-events.spec.ts | 18 +
.../pc/demo/search/search-types.spec.ts | 16 +
.../pc/demo/search/select-events.spec.ts | 18 +
.../demo/search/show-selected-types.spec.ts | 16 +
.../pc/demo/search/slot-prefix.spec.ts | 12 +
.../pc/demo/search/transparent-mode.spec.ts | 34 +
.../pc/demo/select/allow-create.spec.ts | 34 +
.../pc/demo/select/automatic-dropdown.spec.ts | 14 +
.../pc/demo/select/basic-usage.spec.ts | 18 +
.../pc/demo/select/binding-obj.spec.ts | 16 +
.../resources/pc/demo/select/binding-obj.vue | 4 +-
.../pc/demo/select/cache-usage.spec.ts | 14 +
.../resources/pc/demo/select/cache-usage.vue | 20 +-
.../pc/demo/select/clearable.spec.ts | 15 +
.../pc/demo/select/collapse-tags.spec.ts | 18 +
.../pc/demo/select/custom-options.spec.ts | 11 +
.../pc/demo/select/custom-prefix.spec.ts | 11 +
.../demo/select/custom-reference-slot.spec.ts | 8 +
.../pc/demo/select/custom-reference-slot.vue | 2 +-
.../select/disable-grid-select-radio.spec.ts | 27 +
.../demo/select/disable-grid-select-radio.vue | 2 +
.../disabled-and-selected-options.spec.ts | 17 +
.../pc/demo/select/disabled-options.spec.ts | 16 +
.../resources/pc/demo/select/disabled.spec.ts | 8 +
.../pc/demo/select/envts-change.spec.ts | 48 +
.../pc/demo/select/envts-remove.spec.ts | 29 +
.../pc/demo/select/filter-method.spec.ts | 38 +
.../demo/select/focus-remote-method.spec.ts | 12 +
.../select/hide-select-input-border.spec.ts | 10 +
.../pc/demo/select/input-box-type.spec.ts | 26 +
.../demo/select/is-drop-inherit-width.spec.ts | 29 +
.../pc/demo/select/manual-focus-blur.spec.ts | 12 +
.../pc/demo/select/manual-focus-blur.vue | 10 +-
.../pc/demo/select/memoize-usage.spec.ts | 14 +
.../pc/demo/select/memoize-usage.vue | 7 +-
.../pc/demo/select/multiple-limit.spec.ts | 19 +
.../resources/pc/demo/select/multiple.spec.ts | 19 +
.../resources/pc/demo/select/name.spec.ts | 8 +
.../nest-checkbox-grid-clearable.spec.ts | 40 +
.../pc/demo/select/nest-checkbox-grid.spec.ts | 34 +
.../pc/demo/select/nest-checkbox-tree.spec.ts | 27 +
.../demo/select/nest-filterable-tree.spec.ts | 30 +
.../select/nest-grid-remote-filter.spec.ts | 58 +
.../demo/select/nest-grid-remote-filter.vue | 2 +
.../select/nest-radio-grid-much-data.spec.ts | 30 +
.../pc/demo/select/nest-radio-grid.spec.ts | 19 +
.../pc/demo/select/nest-radio-tree.spec.ts | 20 +
.../pc/demo/select/nest-remote-grid.spec.ts | 56 +
.../pc/demo/select/nest-remote-grid.vue | 2 +
.../pc/demo/select/no-data-text.spec.ts | 20 +
.../pc/demo/select/no-match-text.spec.ts | 13 +
.../pc/demo/select/optimization.spec.ts | 44 +
.../demo/select/option-group-disable.spec.ts | 10 +
.../pc/demo/select/option-group.spec.ts | 12 +
.../demo/select/popup-style-position.spec.ts | 11 +
.../pc/demo/select/remote-method.spec.ts | 24 +
.../pc/demo/select/remote-method.vue | 1 +
.../select/remote-search-allow-copy.spec.ts | 27 +
.../demo/select/remote-search-allow-copy.vue | 2 +
.../pc/demo/select/search-allow-copy.spec.ts | 26 +
.../pc/demo/select/search-allow-copy.vue | 26 +-
.../pc/demo/select/searchable.spec.ts | 49 +
.../pc/demo/select/set-input-value.spec.ts | 11 +
.../pc/demo/select/show-alloption.spec.ts | 11 +
.../resources/pc/demo/select/show-tip.spec.ts | 0
.../pc/demo/select/size-medium.spec.ts | 8 +
.../pc/demo/select/size-mini.spec.ts | 8 +
.../pc/demo/select/size-small.spec.ts | 8 +
.../pc/demo/select/slot-default.spec.ts | 11 +
.../pc/demo/select/slot-empty.spec.ts | 12 +
.../pc/demo/select/slot-footer.spec.ts | 12 +
.../pc/demo/select/tag-copy-all.spec.ts | 12 +
.../resources/pc/demo/select/tag-copy-all.vue | 17 +-
.../pc/demo/select/tag-select.spec.ts | 20 +
.../resources/pc/demo/select/tag-select.vue | 17 +-
.../pc/demo/slide-bar/basic-usage.spec.ts | 17 +
.../pc/demo/slide-bar/custom-content.spec.ts | 11 +
.../pc/demo/slide-bar/custom-tag.spec.ts | 11 +
.../demo/slide-bar/slide-bar-events.spec.ts | 12 +
.../pc/demo/slide-bar/slide-bar-events.vue | 4 +-
.../pc/demo/slide-bar/wheel-blocks.spec.ts | 17 +
.../pc/demo/slider/about-step.spec.ts | 20 +
.../pc/demo/slider/basic-usage.spec.ts | 20 +
.../pc/demo/slider/dynamic-disable.spec.ts | 11 +
.../pc/demo/slider/format-tooltip.spec.ts | 10 +
.../resources/pc/demo/slider/max-min.spec.ts | 24 +
.../pc/demo/slider/range-select.spec.ts | 30 +
.../pc/demo/slider/shortcut-operation.spec.ts | 35 +
.../pc/demo/slider/show-iput.spec.ts | 8 +
.../resources/pc/demo/slider/show-tip.spec.ts | 14 +
.../demo/slider/slider-event-change.spec.ts | 19 +
.../pc/demo/slider/slider-event-start.spec.ts | 20 +
.../pc/demo/slider/slider-event-stop.spec.ts | 19 +
.../pc/demo/slider/slider-slot.spec.ts | 18 +
.../pc/demo/slider/vertical-mode.spec.ts | 20 +
.../pc/demo/split/basic-usage.spec.ts | 25 +
.../pc/demo/split/basic-usage1.spec.ts | 20 +
.../pc/demo/split/left-right.spec.ts | 11 +
.../pc/demo/split/moveend-event.spec.ts | 16 +
.../pc/demo/split/movestart-event.spec.ts | 17 +
.../pc/demo/split/moving-event.spec.ts | 16 +
.../pc/demo/split/nested-use.spec.ts | 37 +
.../pc/demo/split/split-mode.spec.ts | 12 +
.../pc/demo/split/split-threshold.spec.ts | 30 +
.../pc/demo/split/top-bottom-solt.spec.ts | 10 +
.../pc/demo/split/trigger-slot.spec.ts | 8 +
.../pc/demo/steps/advanced-steps.spec.ts | 17 +
.../resources/pc/demo/steps/click.spec.ts | 19 +
.../pc/demo/steps/custom-steps-item.spec.ts | 17 +
.../pc/demo/steps/data-resource.spec.ts | 22 +
.../resources/pc/demo/steps/data-resource.vue | 17 +-
.../pc/demo/steps/node-status.spec.ts | 25 +
.../pc/demo/steps/normal-steps.spec.ts | 18 +
.../pc/demo/steps/order-progress.spec.ts | 16 +
.../pc/demo/steps/show-divider.spec.ts | 9 +
.../docs/resources/pc/demo/steps/size.spec.ts | 11 +
.../demo/steps/slot-active-node-desc.spec.ts | 13 +
.../docs/resources/pc/demo/steps/slot.spec.ts | 14 +
.../docs/resources/pc/demo/steps/slot.vue | 8 +-
.../pc/demo/steps/text-position.spec.ts | 11 +
.../pc/demo/steps/timeline-steps.spec.ts | 29 +
.../pc/demo/tabs/basic-usage.spec.ts | 20 +
.../pc/demo/tabs/before-leave.spec.ts | 16 +
.../pc/demo/tabs/custom-more-icon.spec.ts | 26 +
.../pc/demo/tabs/custom-tab-title.spec.ts | 13 +
.../pc/demo/tabs/position-bottom.spec.ts | 16 +
.../pc/demo/tabs/position-left.spec.ts | 26 +
.../pc/demo/tabs/position-right.spec.ts | 26 +
.../resources/pc/demo/tabs/position.spec.ts | 16 +
.../tabs/show-different-grid-data.spec.ts | 16 +
.../pc/demo/tabs/show-different-grid-data.vue | 4 +-
.../resources/pc/demo/tabs/stretch-wh.spec.ts | 10 +
.../pc/demo/tabs/tab-style-bordercard.spec.ts | 25 +
.../pc/demo/tabs/tab-style-card.spec.ts | 27 +
.../pc/demo/tabs/tabdata-title.spec.ts | 15 +
.../pc/demo/tabs/tabs-draggable.spec.ts | 32 +
.../pc/demo/tabs/tabs-events-add.spec.ts | 21 +
.../pc/demo/tabs/tabs-events-click.spec.ts | 12 +
.../pc/demo/tabs/tabs-events-close.spec.ts | 16 +
.../pc/demo/tabs/tabs-events-edit.spec.ts | 17 +
.../pc/demo/tabs/tabs-second-layer.spec.ts | 11 +
.../resources/pc/demo/tabs/with-add.spec.ts | 19 +
.../resources/pc/demo/tag/basic-usage.spec.ts | 10 +
.../resources/pc/demo/tag/closeable.spec.ts | 12 +
.../docs/resources/pc/demo/tag/color3.spec.ts | 10 +
.../docs/resources/pc/demo/tag/create.spec.ts | 18 +
.../resources/pc/demo/tag/disabled.spec.ts | 13 +
.../docs/resources/pc/demo/tag/effect.spec.ts | 35 +
.../docs/resources/pc/demo/tag/hit.spec.ts | 19 +
.../pc/demo/tag/slot-default.spec.ts | 12 +
.../pc/demo/tag/tag-event-click.spec.ts | 12 +
.../pc/demo/tag/tag-event-close.spec.ts | 14 +
.../resources/pc/demo/tag/tag-size.spec.ts | 16 +
.../pc/demo/text-popup/basic-usage.spec.ts | 28 +
.../pc/demo/text-popup/clear-value.spec.ts | 19 +
.../pc/demo/text-popup/placeholder.spec.ts | 13 +
.../pc/demo/text-popup/readonly.spec.ts | 12 +
.../pc/demo/text-popup/separtor.spec.ts | 20 +
.../pc/demo/text-popup/value.spec.ts | 14 +
.../pc/demo/text-popup/width.spec.ts | 11 +
.../pc/demo/time-line/basic-usage.spec.ts | 25 +
.../demo/time-line/custom-normal-step.spec.ts | 14 +
.../pc/demo/time-line/custom-normal-step.vue | 14 +-
.../time-line/custom-vertical-step.spec.ts | 15 +
.../pc/demo/time-line/different-data.spec.ts | 17 +
.../pc/demo/time-line/horizontal-step.spec.ts | 10 +
.../pc/demo/time-line/set-start-value.spec.ts | 10 +
.../pc/demo/time-line/set-step-width.spec.ts | 10 +
.../pc/demo/time-line/set-step-width.vue | 2 +-
.../pc/demo/time-line/show-number.spec.ts | 11 +
.../pc/demo/time-line/show-status.spec.ts | 11 +
.../time-line/vertical-step-reverse.spec.ts | 18 +
.../pc/demo/time-line/vertical-step.spec.ts | 10 +
.../pc/demo/time-picker/basic-usage.spec.ts | 41 +
.../pc/demo/time-picker/clear-icon.spec.ts | 24 +
.../pc/demo/time-picker/clearable.spec.ts | 16 +
.../pc/demo/time-picker/date.spec.ts | 64 +
.../pc/demo/time-picker/default-value.spec.ts | 17 +
.../pc/demo/time-picker/disabled.spec.ts | 12 +
.../pc/demo/time-picker/editable.spec.ts | 18 +
.../pc/demo/time-picker/event-blur.spec.ts | 20 +
.../pc/demo/time-picker/format.spec.ts | 20 +
.../resources/pc/demo/time-picker/format.vue | 23 +-
.../pc/demo/time-picker/is-range.spec.ts | 39 +
.../pc/demo/time-picker/name.spec.ts | 11 +
.../demo/time-picker/picker-options.spec.ts | 41 +
.../pc/demo/time-picker/popper-class.spec.ts | 14 +
.../pc/demo/time-picker/size-medium.spec.ts | 10 +
.../pc/demo/time-picker/size-mini.spec.ts | 10 +
.../pc/demo/time-picker/size-small.spec.ts | 10 +
.../pc/demo/time-picker/suffix-icon.spec.ts | 12 +
.../pc/demo/time-picker/time-low.spec.ts | 12 +
.../pc/demo/time-select/basic-usage.spec.ts | 14 +
.../pc/demo/time-select/clear-icon.spec.ts | 13 +
.../pc/demo/time-select/default-value.spec.ts | 9 +
.../pc/demo/time-select/disabled.spec.ts | 8 +
.../pc/demo/time-select/editable.spec.ts | 8 +
.../pc/demo/time-select/event-blur.spec.ts | 14 +
.../pc/demo/time-select/focus.spec.ts | 9 +
.../demo/time-select/picker-options.spec.ts | 7 +
.../pc/demo/time-select/popper-class.spec.ts | 9 +
.../time-select/range-placeholder.spec.ts | 22 +
.../pc/demo/time-select/size-medium.spec.ts | 8 +
.../pc/demo/time-select/size-mini.spec.ts | 8 +
.../pc/demo/time-select/size-small.spec.ts | 8 +
.../pc/demo/time-select/suffix-icon.spec.ts | 8 +
.../toggle-menu/automatic-filtering.spec.ts | 20 +
.../pc/demo/toggle-menu/basic-usage.spec.ts | 46 +
.../pc/demo/toggle-menu/custom-icon.spec.ts | 13 +
.../toggle-menu/default-expand-all.spec.ts | 13 +
.../pc/demo/toggle-menu/drag-events.spec.ts | 18 +
.../pc/demo/toggle-menu/draggable.spec.ts | 19 +
.../pc/demo/toggle-menu/node-click.spec.ts | 13 +
.../pc/demo/toggle-menu/node-collapse.spec.ts | 12 +
.../pc/demo/toggle-menu/node-drop.spec.ts | 15 +
.../pc/demo/toggle-menu/node-expand.spec.ts | 12 +
.../pc/demo/toggle-menu/show-filter.spec.ts | 12 +
.../pc/demo/toggle-menu/slot-node.spec.ts | 10 +
.../pc/demo/toggle-menu/slot-node.vue | 2 +-
.../pc/demo/toggle-menu/toggle-props.spec.ts | 19 +
.../pc/demo/tooltip/basic-usage.spec.js | 65 +-
.../pc/demo/tooltip/custom-transition.spec.js | 21 +
.../pc/demo/tooltip/dynamic-disable.spec.js | 23 +
.../pc/demo/tooltip/enterable.spec.js | 16 +
.../demo/tooltip/manual-control-tip.spec.js | 17 +
.../pc/demo/tooltip/open-delay.spec.js | 29 +
.../pc/demo/tooltip/popper-class.spec.js | 13 +
.../pc/demo/tooltip/popper-class.vue | 4 +-
.../pc/demo/tooltip/popper-options.spec.js | 17 +
.../pc/demo/tooltip/tabindex.spec.js | 9 +
.../pc/demo/tooltip/tooltip-content.spec.js | 19 +
.../pc/demo/tooltip/tooltip-offset.spec.js | 16 +
.../tooltip/tooltip-render-content.spec.js | 12 +
.../pc/demo/tooltip/tooltip-theme.spec.js | 29 +
.../pc/demo/tooltip/tooltip-theme.vue | 14 +-
.../pc/demo/tooltip/visible-arrow.spec.js | 13 +
.../pc/demo/tooltip/visible-show.spec.js | 30 +
.../pc/demo/transfer/basic-usage.spec.ts | 104 ++
.../demo/transfer/checked-format-text.spec.ts | 10 +
.../demo/transfer/custom-button-texts.spec.ts | 10 +
.../transfer/custom-filter-method.spec.ts | 18 +
.../pc/demo/transfer/custom-footer.spec.ts | 8 +
.../transfer/custom-render-content.spec.ts | 8 +
.../transfer/custom-transfer-titles.spec.ts | 12 +
.../pc/demo/transfer/data-source.spec.ts | 26 +
.../pc/demo/transfer/default-checked.spec.ts | 22 +
.../pc/demo/transfer/drop-config.spec.ts | 33 +
.../demo/transfer/filter-placeholder.spec.ts | 8 +
.../pc/demo/transfer/filterable.spec.ts | 18 +
.../demo/transfer/manual-clear-query.spec.ts | 12 +
.../pc/demo/transfer/nested-table.spec.ts | 48 +
.../pc/demo/transfer/nested-tree.spec.ts | 27 +
.../pc/demo/transfer/panel-slot.spec.ts | 14 +
.../transfer/props-of-data-source.spec.ts | 26 +
.../pc/demo/transfer/show-all-btn.spec.ts | 36 +
.../pc/demo/transfer/target-order.spec.ts | 17 +
.../pc/demo/transfer/transfer-events.spec.ts | 16 +
.../pc/demo/tree-menu/accordion.spec.ts | 17 +
.../pc/demo/tree-menu/basic-usage.spec.ts | 10 +
.../pc/demo/tree-menu/can-draggable.spec.ts | 40 +
.../pc/demo/tree-menu/check-strictly.spec.ts | 17 +
.../pc/demo/tree-menu/data-resource.spec.ts | 20 +
.../demo/tree-menu/default-expand-all.spec.ts | 15 +
.../tree-menu/default-expanded-keys.spec.ts | 19 +
.../pc/demo/tree-menu/empty-text.spec.ts | 9 +
.../tree-menu/event-allow-draggable.spec.ts | 19 +
.../demo/tree-menu/event-check-change.spec.ts | 16 +
.../tree-menu/event-current-change.spec.ts | 12 +
.../demo/tree-menu/event-current-change.vue | 2 +-
.../demo/tree-menu/event-node-click.spec.ts | 14 +
.../pc/demo/tree-menu/event-node-click.vue | 2 +-
.../tree-menu/event-node-collapse.spec.ts | 11 +
.../demo/tree-menu/event-node-expand.spec.ts | 10 +
.../tree-menu/expand-on-click-node.spec.ts | 10 +
.../demo/tree-menu/filter-node-method.spec.ts | 12 +
.../demo/tree-menu/get-menu-data-sync.spec.ts | 16 +
.../pc/demo/tree-menu/lazy-load.spec.ts | 13 +
.../pc/demo/tree-menu/search-icon.spec.ts | 9 +
.../pc/demo/tree-menu/show-checkbox.spec.ts | 29 +
.../pc/demo/tree-menu/text-ellipsis.spec.ts | 9 +
.../pc/demo/tree-menu/text-wrap.spec.ts | 9 +
.../demo/tree-menu/tree-menu-indent.spec.ts | 11 +
.../pc/demo/tree-menu/tree-menu-slot.spec.ts | 12 +
.../pc/demo/tree/accordion-mode.spec.ts | 13 +
.../resources/pc/demo/tree/allow-drag.spec.ts | 21 +
.../resources/pc/demo/tree/allow-drop.spec.ts | 19 +
.../pc/demo/tree/auto-expand-parent.spec.ts | 11 +
.../pc/demo/tree/basic-usage.spec.ts | 16 +
.../pc/demo/tree/check-on-click-node.spec.ts | 29 +
.../pc/demo/tree/check-strictly.spec.ts | 40 +
.../pc/demo/tree/contextmenu.spec.ts | 13 +
.../pc/demo/tree/current-node-key.spec.ts | 12 +
.../pc/demo/tree/custom-empty-text.spec.ts | 9 +
.../pc/demo/tree/custom-node-icon.spec.ts | 10 +
.../pc/demo/tree/data-source.spec.ts | 12 +
.../pc/demo/tree/default-checked-keys.spec.ts | 17 +
.../pc/demo/tree/default-expand-all.spec.ts | 13 +
.../demo/tree/default-expended-keys.spec.ts | 15 +
.../pc/demo/tree/disable-node.spec.ts | 28 +
.../pc/demo/tree/drag-events.spec.ts | 22 +
.../pc/demo/tree/expand-on-click-node.spec.ts | 21 +
.../pc/demo/tree/filter-node.spec.ts | 12 +
.../pc/demo/tree/highlight-current.spec.ts | 10 +
.../resources/pc/demo/tree/indent.spec.ts | 11 +
.../pc/demo/tree/lazy-load-node.spec.ts | 19 +
.../pc/demo/tree/node-contextmenu.spec.ts | 12 +
.../pc/demo/tree/node-draggable.spec.ts | 26 +
.../pc/demo/tree/node-events.spec.ts | 11 +
.../resources/pc/demo/tree/node-key.spec.ts | 39 +
.../pc/demo/tree/node-props-config.spec.ts | 10 +
.../pc/demo/tree/render-after-expand.spec.ts | 10 +
.../pc/demo/tree/render-content.spec.ts | 21 +
.../pc/demo/tree/set-tree-icon.spec.ts | 13 +
.../pc/demo/tree/show-checkbox.spec.ts | 34 +
.../pc/demo/tree/single-select-radio.spec.ts | 16 +
.../pc/demo/tree/single-select-radio.vue | 12 +-
.../pc/demo/tree/slot-deffault.spec.ts | 9 +
.../resources/pc/demo/tree/slot-deffault.vue | 19 +-
.../pc/demo/user-contact/basic-usage.spec.ts | 10 +
.../pc/demo/user-contact/data-source.spec.ts | 13 +
.../not-displayed-content.spec.ts | 8 +
.../user-contact/slots-usercontact.spec.ts | 12 +
.../user-contact/support-open-espace.spec.ts | 11 +
.../pc/demo/user-head/basic-usage.spec.ts | 8 +
.../resources/pc/demo/user-head/color.spec.ts | 10 +
.../user-head/custom-background-color.spec.ts | 8 +
.../custom-user-head-content.spec.ts | 8 +
.../pc/demo/user-head/icon-user-head.spec.ts | 8 +
.../pc/demo/user-head/image-user-head.spec.ts | 8 +
.../pc/demo/user-head/label-user-head.spec.ts | 8 +
.../user-head/message-count-limit.spec.ts | 8 +
.../user-head/message-count-total.spec.ts | 8 +
.../demo/user-head/message-count-type.spec.ts | 8 +
.../pc/demo/user-head/min-user-head.spec.ts | 9 +
.../render-user-head-in-grid.spec.ts | 10 +
.../pc/demo/user-head/round-user-head.spec.ts | 8 +
.../pc/demo/wizard/base-flow.spec.ts | 40 +
.../pc/demo/wizard/page-guide.spec.ts | 52 +
.../pc/demo/wizard/slot-base.spec.ts | 14 +
.../pc/demo/wizard/slot-step-button.spec.ts | 17 +
.../pc/demo/wizard/time-line-flow.spec.ts | 63 +
.../resources/pc/demo/wizard/vertical.spec.ts | 32 +
examples/vue2.7/.env.saas | 1 +
examples/vue2.7/package.json | 3 +-
examples/vue2.7/src/vite-env.d.ts | 7 +
examples/vue2.7/vite.config.ts | 8 +
examples/vue2.7/vitest.config.ts | 10 +-
examples/vue2/.env.saas | 1 +
examples/vue2/package.json | 3 +-
examples/vue2/src/vite-env.d.ts | 8 +
examples/vue2/vite.config.ts | 19 +-
examples/vue2/vitest.config.ts | 10 +-
examples/vue3/.env.saas | 1 +
examples/vue3/package.json | 5 +-
examples/vue3/src/vite-env.d.ts | 16 +
examples/vue3/vite.config.ts | 18 +-
examples/vue3/vitest.config.ts | 10 +-
internals/cli/package.json | 4 +-
internals/cli/src/commands/build/build-ui.ts | 2 +-
.../src/commands/create/commonMapping.json | 5 -
internals/cli/src/config/vite.ts | 3 +
internals/cli/src/shared/module-utils.ts | 2 -
internals/cli/tsconfig.json | 15 +-
internals/playwright-config/src/index.js | 95 +-
internals/vue-vite-import/.npmignore | 1 +
.../vue-vite-import/example/ts/package.json | 2 +-
internals/vue-vite-import/package.json | 23 +-
internals/vue-vite-import/src/index.ts | 4 +-
internals/vue-vite-import/tsconfig.json | 26 +-
package.json | 29 +-
packages/design/aurora/index.ts | 4 +
packages/design/aurora/src/grid/index.ts | 11 +
packages/design/aurora/src/switch/index.ts | 3 +
packages/design/smb/src/grid/index.ts | 6 +-
packages/modules.json | 5 -
packages/renderless/package.json | 2 +-
packages/renderless/src/anchor/index.ts | 173 +--
packages/renderless/src/anchor/vue.ts | 4 +-
packages/renderless/src/button-group/vue.ts | 4 +-
.../renderless/src/common/deps/memorize.ts | 20 +-
.../renderless/src/common/validate/util.ts | 5 +-
packages/renderless/src/dropdown-item/mf.ts | 2 +-
packages/renderless/src/dropdown-menu/vue.ts | 2 +-
packages/renderless/src/file-upload/index.ts | 1 -
packages/renderless/src/grid/utils/column.ts | 1 +
packages/renderless/src/pager/vue.ts | 4 +-
packages/renderless/src/switch/vue.ts | 12 +-
packages/theme-mobile/package.json | 2 +-
packages/theme-mobile/src/svgs/index.js | 1 +
packages/theme-saas/src/svgs/dot-download.svg | 24 +
packages/theme-saas/src/svgs/down-ward.svg | 10 +
.../theme-saas/src/svgs/left-ward-arrow.svg | 11 +
.../src/svgs/prompt-exclamation.svg | 7 +
packages/theme-saas/src/svgs/sort-default.svg | 7 +
.../src/svgs/sort-triangle-ascending.svg | 9 +
.../src/svgs/sort-triangle-descending.svg | 9 +
.../theme-saas/src/svgs/sort-triangle.svg | 12 +
packages/theme-saas/src/textarea/index.less | 118 ++
packages/theme-saas/src/textarea/vars.less | 70 +
packages/theme-saas/src/theme-tool.js | 132 ++
packages/theme-saas/src/theme.config.js | 79 ++
.../src/theme/aurora-theme/index.js | 1 +
.../theme-saas/src/theme/deep-theme/index.js | 13 +
.../src/theme/galaxy-theme/index.js | 13 +
.../src/theme/impression-theme/index.js | 14 +
packages/theme-saas/src/theme/index.js | 61 +
.../src/theme/infinity-theme/index.js | 13 +
.../theme-saas/src/theme/smb-theme/index.js | 1 +
packages/theme-saas/src/theme/utils.js | 12 +
packages/theme/package.json | 2 +-
packages/theme/scripts/build-theme-json.js | 37 +-
packages/theme/scripts/components.js | 91 +-
packages/theme/src/alert/aurora-theme.js | 1 -
packages/theme/src/alert/index.less | 1 -
packages/theme/src/alert/smb-theme.js | 5 +-
packages/theme/src/alert/vars.less | 8 +-
packages/theme/src/anchor/index.less | 9 +-
packages/theme/src/anchor/vars.less | 2 +-
packages/theme/src/breadcrumb/aurora-theme.js | 3 +-
packages/theme/src/breadcrumb/index.less | 13 +-
packages/theme/src/breadcrumb/vars.less | 4 +-
packages/theme/src/button-group/index.less | 2 +-
packages/theme/src/button/index.less | 70 +-
packages/theme/src/button/smb-theme.js | 20 +
packages/theme/src/button/vars.less | 51 +-
packages/theme/src/checkbox/aurora-theme.js | 6 +-
packages/theme/src/checkbox/index.less | 4 +-
packages/theme/src/checkbox/vars.less | 4 +
.../theme/src/collapse-item/aurora-theme.js | 5 +-
packages/theme/src/collapse-item/index.less | 8 +-
packages/theme/src/collapse-item/vars.less | 6 +
packages/theme/src/dialog-box/aurora-theme.js | 24 +
packages/theme/src/dialog-box/index.less | 26 +-
packages/theme/src/dialog-box/vars.less | 8 +-
packages/theme/src/dropdown/index.less | 12 +
packages/theme/src/grid/aurora-theme.js | 6 +-
packages/theme/src/grid/checkbox.less | 2 +-
packages/theme/src/grid/header.less | 7 +
packages/theme/src/grid/smb-theme.js | 13 +-
packages/theme/src/grid/table.less | 145 ++-
packages/theme/src/grid/vars.less | 4 +
packages/theme/src/ip-address/aurora-theme.js | 3 +-
packages/theme/src/numeric/index.less | 29 +-
packages/theme/src/numeric/smb-theme.js | 7 +-
packages/theme/src/numeric/vars.less | 6 +
packages/theme/src/pager/aurora-theme.js | 15 +
packages/theme/src/pager/index.less | 16 +-
packages/theme/src/pager/smb-theme.js | 4 +-
packages/theme/src/pager/vars.less | 14 +-
packages/theme/src/picker/index.less | 2 +-
packages/theme/src/pop-upload/index.less | 41 +-
packages/theme/src/pop-upload/vars.less | 51 +-
packages/theme/src/popeditor/index.less | 30 +-
packages/theme/src/popeditor/vars.less | 47 +-
packages/theme/src/popover/index.less | 4 -
packages/theme/src/select/index.less | 2 +-
packages/theme/src/select/vars.less | 2 +-
packages/theme/src/steps/aurora-theme.js | 13 +
packages/theme/src/svgs/draft.svg | 2 +-
packages/theme/src/svgs/error.svg | 24 +-
packages/theme/src/svgs/prompt.svg | 18 +-
packages/theme/src/svgs/success.svg | 23 +-
packages/theme/src/svgs/warning-triangle.svg | 21 +-
packages/theme/src/switch/index.less | 2 +-
packages/theme/src/textarea/index.less | 7 +
packages/theme/src/textarea/smb-theme.js | 3 +-
.../theme/src/theme/aurora-theme/index.js | 2 +-
packages/theme/src/tree-menu/aurora-theme.js | 3 +
packages/theme/src/tree/aurora-theme.js | 4 +
packages/vue-common/src/index.ts | 4 +-
packages/vue-icon-saas/index.ts | 1122 +++++++++++++++++
packages/vue-icon-saas/package.json | 4 +-
.../vue-icon-saas/src/administrator/index.ts | 4 +
.../vue-icon-saas/src/area-chart/index.ts | 4 +
.../vue-icon-saas/src/arrow-bottom/index.ts | 4 +
.../vue-icon-saas/src/arrow-down/index.ts | 4 +
.../vue-icon-saas/src/arrow-left/index.ts | 4 +
.../vue-icon-saas/src/arrow-right/index.ts | 4 +
packages/vue-icon-saas/src/arrow-up/index.ts | 4 +
packages/vue-icon-saas/src/ascending/index.ts | 4 +
.../vue-icon-saas/src/association/index.ts | 4 +
.../vue-icon-saas/src/attachment/index.ts | 4 +
packages/vue-icon-saas/src/audio/index.ts | 4 +
packages/vue-icon-saas/src/bar-chart/index.ts | 4 +
packages/vue-icon-saas/src/befilter/index.ts | 4 +
packages/vue-icon-saas/src/boat/index.ts | 4 +
packages/vue-icon-saas/src/busy/index.ts | 4 +
.../vue-icon-saas/src/calculator/index.ts | 4 +
packages/vue-icon-saas/src/calendar/index.ts | 4 +
packages/vue-icon-saas/src/check-out/index.ts | 4 +
packages/vue-icon-saas/src/check/index.ts | 4 +
.../vue-icon-saas/src/checked-linear/index.ts | 4 +
.../vue-icon-saas/src/checked-sur/index.ts | 4 +
.../vue-icon-saas/src/checked-true/index.ts | 4 +
.../vue-icon-saas/src/chevron-down/index.ts | 4 +
.../vue-icon-saas/src/chevron-left/index.ts | 4 +
.../vue-icon-saas/src/chevron-right/index.ts | 4 +
.../vue-icon-saas/src/chevron-up/index.ts | 4 +
.../vue-icon-saas/src/clear-filter/index.ts | 4 +
.../vue-icon-saas/src/clock-work/index.ts | 4 +
.../vue-icon-saas/src/close-circle/index.ts | 4 +
.../vue-icon-saas/src/close-square/index.ts | 4 +
packages/vue-icon-saas/src/close/index.ts | 4 +
.../vue-icon-saas/src/cloud-download/index.ts | 4 +
.../vue-icon-saas/src/cloud-upload/index.ts | 4 +
packages/vue-icon-saas/src/coin/index.ts | 4 +
.../vue-icon-saas/src/commission/index.ts | 4 +
.../src/conment-refresh/index.ts | 4 +
packages/vue-icon-saas/src/copy/index.ts | 4 +
packages/vue-icon-saas/src/course/index.ts | 4 +
packages/vue-icon-saas/src/crop/index.ts | 4 +
packages/vue-icon-saas/src/cue-l/index.ts | 4 +
packages/vue-icon-saas/src/custom/index.ts | 4 +
.../src/customer-service/index.ts | 4 +
packages/vue-icon-saas/src/default/index.ts | 4 +
.../src/defined-filtration/index.ts | 4 +
packages/vue-icon-saas/src/del/index.ts | 4 +
.../vue-icon-saas/src/delete-page/index.ts | 4 +
packages/vue-icon-saas/src/deleted/index.ts | 4 +
.../vue-icon-saas/src/delta-down-o/index.ts | 4 +
.../vue-icon-saas/src/delta-down/index.ts | 4 +
.../vue-icon-saas/src/delta-left-o/index.ts | 4 +
.../vue-icon-saas/src/delta-left/index.ts | 4 +
.../vue-icon-saas/src/delta-right-o/index.ts | 4 +
.../vue-icon-saas/src/delta-right/index.ts | 4 +
.../vue-icon-saas/src/delta-up-o/index.ts | 4 +
packages/vue-icon-saas/src/delta-up/index.ts | 4 +
packages/vue-icon-saas/src/derive/index.ts | 4 +
.../vue-icon-saas/src/descending/index.ts | 4 +
packages/vue-icon-saas/src/dialog/index.ts | 4 +
packages/vue-icon-saas/src/dialog2/index.ts | 4 +
packages/vue-icon-saas/src/dot-chart/index.ts | 4 +
.../vue-icon-saas/src/dot-download/index.ts | 15 +
packages/vue-icon-saas/src/dot-ipv4/index.ts | 4 +
.../vue-icon-saas/src/double-left/index.ts | 4 +
.../vue-icon-saas/src/double-right/index.ts | 4 +
packages/vue-icon-saas/src/down-o/index.ts | 4 +
packages/vue-icon-saas/src/down-ward/index.ts | 15 +
packages/vue-icon-saas/src/down/index.ts | 4 +
.../vue-icon-saas/src/download-cloud/index.ts | 4 +
.../vue-icon-saas/src/download-link/index.ts | 4 +
packages/vue-icon-saas/src/download/index.ts | 4 +
packages/vue-icon-saas/src/edit/index.ts | 4 +
.../src/editor-align-center/index.ts | 4 +
.../src/editor-align-left/index.ts | 4 +
.../src/editor-align-right/index.ts | 4 +
.../src/editor-background/index.ts | 4 +
.../vue-icon-saas/src/editor-bold/index.ts | 4 +
.../vue-icon-saas/src/editor-code/index.ts | 4 +
.../src/editor-deleteline/index.ts | 4 +
.../vue-icon-saas/src/editor-eraser/index.ts | 4 +
.../vue-icon-saas/src/editor-italic/index.ts | 4 +
.../src/editor-left-border/index.ts | 4 +
.../src/editor-list-dot/index.ts | 4 +
.../src/editor-list-num/index.ts | 4 +
.../vue-icon-saas/src/editor-list/index.ts | 4 +
.../src/editor-menu-left/index.ts | 4 +
.../src/editor-menu-right/index.ts | 4 +
.../vue-icon-saas/src/editor-quote/index.ts | 4 +
.../vue-icon-saas/src/editor-redo/index.ts | 4 +
.../src/editor-right-border/index.ts | 4 +
.../vue-icon-saas/src/editor-sub/index.ts | 4 +
.../src/editor-subtitle/index.ts | 4 +
.../vue-icon-saas/src/editor-super/index.ts | 4 +
.../vue-icon-saas/src/editor-tab/index.ts | 4 +
.../vue-icon-saas/src/editor-table/index.ts | 4 +
.../src/editor-textcolor/index.ts | 4 +
.../vue-icon-saas/src/editor-title/index.ts | 4 +
.../src/editor-underline/index.ts | 4 +
.../vue-icon-saas/src/editor-undo/index.ts | 4 +
.../vue-icon-saas/src/editor-video/index.ts | 4 +
packages/vue-icon-saas/src/ellipsis/index.ts | 4 +
packages/vue-icon-saas/src/email-add/index.ts | 4 +
.../vue-icon-saas/src/email-circle/index.ts | 4 +
packages/vue-icon-saas/src/end/index.ts | 4 +
packages/vue-icon-saas/src/error/index.ts | 4 +
.../vue-icon-saas/src/espace-auto/index.ts | 4 +
packages/vue-icon-saas/src/espace/index.ts | 4 +
.../vue-icon-saas/src/excel-type/index.ts | 4 +
packages/vue-icon-saas/src/excel/index.ts | 4 +
packages/vue-icon-saas/src/exception/index.ts | 4 +
.../vue-icon-saas/src/exclamation/index.ts | 4 +
packages/vue-icon-saas/src/export/index.ts | 4 +
.../vue-icon-saas/src/express-search/index.ts | 4 +
packages/vue-icon-saas/src/eyeclose/index.ts | 4 +
packages/vue-icon-saas/src/eyeopen/index.ts | 4 +
.../src/file-cloudupload/index.ts | 4 +
.../vue-icon-saas/src/file-excel/index.ts | 4 +
packages/vue-icon-saas/src/file-type/index.ts | 4 +
packages/vue-icon-saas/src/file/index.ts | 4 +
.../vue-icon-saas/src/files-circle/index.ts | 4 +
packages/vue-icon-saas/src/files/index.ts | 4 +
packages/vue-icon-saas/src/filetext/index.ts | 4 +
.../vue-icon-saas/src/fileupload/index.ts | 4 +
packages/vue-icon-saas/src/filtered/index.ts | 4 +
packages/vue-icon-saas/src/flag/index.ts | 4 +
.../vue-icon-saas/src/folder-closed/index.ts | 4 +
.../vue-icon-saas/src/folder-opened/index.ts | 4 +
.../vue-icon-saas/src/freeze-left/index.ts | 4 +
.../vue-icon-saas/src/freeze-right/index.ts | 4 +
packages/vue-icon-saas/src/frown-o/index.ts | 4 +
packages/vue-icon-saas/src/frown/index.ts | 4 +
.../src/fullscreen-left/index.ts | 4 +
.../vue-icon-saas/src/fullscreen/index.ts | 4 +
packages/vue-icon-saas/src/grade/index.ts | 4 +
.../vue-icon-saas/src/group-transfer/index.ts | 4 +
packages/vue-icon-saas/src/group/index.ts | 4 +
.../vue-icon-saas/src/halfchecked/index.ts | 4 +
.../vue-icon-saas/src/halfselect/index.ts | 4 +
.../vue-icon-saas/src/heartempty/index.ts | 4 +
.../vue-icon-saas/src/help-circle/index.ts | 4 +
.../vue-icon-saas/src/help-query/index.ts | 4 +
.../vue-icon-saas/src/help-solid/index.ts | 4 +
packages/vue-icon-saas/src/help/index.ts | 4 +
packages/vue-icon-saas/src/helpful/index.ts | 4 +
packages/vue-icon-saas/src/import/index.ts | 4 +
.../vue-icon-saas/src/info-circle/index.ts | 4 +
.../vue-icon-saas/src/info-solid/index.ts | 4 +
packages/vue-icon-saas/src/info/index.ts | 4 +
.../vue-icon-saas/src/information/index.ts | 4 +
packages/vue-icon-saas/src/leave/index.ts | 4 +
.../vue-icon-saas/src/left-frozen/index.ts | 4 +
packages/vue-icon-saas/src/left-o/index.ts | 4 +
.../src/left-ward-arrow/index.ts | 16 +
packages/vue-icon-saas/src/left-ward/index.ts | 4 +
packages/vue-icon-saas/src/left/index.ts | 4 +
.../vue-icon-saas/src/line-chart/index.ts | 4 +
packages/vue-icon-saas/src/link/index.ts | 4 +
packages/vue-icon-saas/src/loading/index.ts | 4 +
packages/vue-icon-saas/src/lock/index.ts | 4 +
.../vue-icon-saas/src/mail-content/index.ts | 4 +
packages/vue-icon-saas/src/mail/index.ts | 4 +
packages/vue-icon-saas/src/male/index.ts | 4 +
packages/vue-icon-saas/src/mark-on/index.ts | 4 +
packages/vue-icon-saas/src/meh/index.ts | 4 +
.../vue-icon-saas/src/message-circle/index.ts | 4 +
packages/vue-icon-saas/src/mic/index.ts | 4 +
.../vue-icon-saas/src/minscreen-left/index.ts | 4 +
packages/vue-icon-saas/src/minscreen/index.ts | 4 +
.../vue-icon-saas/src/minus-circle/index.ts | 4 +
.../vue-icon-saas/src/minus-square/index.ts | 4 +
packages/vue-icon-saas/src/minus/index.ts | 4 +
.../src/mobile-checkbox-half/index.ts | 4 +
.../src/mobile-checkbox-selected/index.ts | 4 +
.../src/mobile-checkbox/index.ts | 4 +
.../src/mobile-radio-selected/index.ts | 4 +
.../vue-icon-saas/src/mobile-radio/index.ts | 4 +
packages/vue-icon-saas/src/mobile/index.ts | 4 +
packages/vue-icon-saas/src/more/index.ts | 4 +
packages/vue-icon-saas/src/new/index.ts | 4 +
.../vue-icon-saas/src/no-premission/index.ts | 4 +
packages/vue-icon-saas/src/node-open/index.ts | 4 +
packages/vue-icon-saas/src/node/index.ts | 4 +
packages/vue-icon-saas/src/off-line/index.ts | 4 +
packages/vue-icon-saas/src/on-line/index.ts | 4 +
.../src/operationfaild-l/index.ts | 4 +
.../vue-icon-saas/src/operationfaild/index.ts | 4 +
.../vue-icon-saas/src/other-type/index.ts | 4 +
.../vue-icon-saas/src/outer-link/index.ts | 4 +
packages/vue-icon-saas/src/pagelink/index.ts | 4 +
.../vue-icon-saas/src/pager-first/index.ts | 4 +
.../vue-icon-saas/src/pager-last/index.ts | 4 +
.../vue-icon-saas/src/pager-next/index.ts | 4 +
.../vue-icon-saas/src/pager-prev/index.ts | 4 +
packages/vue-icon-saas/src/panel-max/index.ts | 4 +
.../vue-icon-saas/src/panel-mini/index.ts | 4 +
.../vue-icon-saas/src/panel-normal/index.ts | 4 +
.../vue-icon-saas/src/pause-circle/index.ts | 4 +
packages/vue-icon-saas/src/pause/index.ts | 4 +
packages/vue-icon-saas/src/pdf-type/index.ts | 4 +
.../vue-icon-saas/src/picture-type/index.ts | 4 +
packages/vue-icon-saas/src/picture/index.ts | 4 +
packages/vue-icon-saas/src/pie-chart/index.ts | 4 +
.../vue-icon-saas/src/plus-circle/index.ts | 4 +
.../vue-icon-saas/src/plus-square/index.ts | 4 +
packages/vue-icon-saas/src/plus/index.ts | 4 +
packages/vue-icon-saas/src/popup/index.ts | 4 +
packages/vue-icon-saas/src/ppt-type/index.ts | 4 +
.../vue-icon-saas/src/pre-checked/index.ts | 4 +
.../vue-icon-saas/src/print-preview/index.ts | 4 +
.../src/prompt-exclamation/index.ts | 15 +
packages/vue-icon-saas/src/pushpin/index.ts | 4 +
packages/vue-icon-saas/src/radio/index.ts | 4 +
.../vue-icon-saas/src/radioselected/index.ts | 4 +
packages/vue-icon-saas/src/refres/index.ts | 4 +
packages/vue-icon-saas/src/renew/index.ts | 4 +
packages/vue-icon-saas/src/repeat/index.ts | 4 +
packages/vue-icon-saas/src/replace/index.ts | 4 +
packages/vue-icon-saas/src/replies/index.ts | 4 +
.../vue-icon-saas/src/right-frozen/index.ts | 4 +
packages/vue-icon-saas/src/right-o/index.ts | 4 +
packages/vue-icon-saas/src/right/index.ts | 4 +
packages/vue-icon-saas/src/rightward/index.ts | 4 +
.../src/sandwich-collapse/index.ts | 4 +
.../src/sandwich-expand/index.ts | 4 +
packages/vue-icon-saas/src/save/index.ts | 4 +
packages/vue-icon-saas/src/scissor/index.ts | 4 +
packages/vue-icon-saas/src/search/index.ts | 4 +
packages/vue-icon-saas/src/select/index.ts | 4 +
packages/vue-icon-saas/src/sent/index.ts | 4 +
packages/vue-icon-saas/src/separate/index.ts | 4 +
packages/vue-icon-saas/src/setting/index.ts | 4 +
.../vue-icon-saas/src/share-arrow/index.ts | 4 +
packages/vue-icon-saas/src/share/index.ts | 4 +
.../vue-icon-saas/src/shopping-card/index.ts | 4 +
packages/vue-icon-saas/src/smile-o/index.ts | 4 +
packages/vue-icon-saas/src/smile/index.ts | 4 +
.../vue-icon-saas/src/sort-default/index.ts | 15 +
.../src/sort-triangle-ascending/index.ts | 15 +
.../src/sort-triangle-descending/index.ts | 15 +
.../vue-icon-saas/src/sort-triangle/index.ts | 15 +
packages/vue-icon-saas/src/sort/index.ts | 4 +
.../vue-icon-saas/src/star-active/index.ts | 4 +
.../vue-icon-saas/src/star-disable/index.ts | 4 +
packages/vue-icon-saas/src/star-o/index.ts | 4 +
.../vue-icon-saas/src/start-circle/index.ts | 4 +
packages/vue-icon-saas/src/start/index.ts | 4 +
.../vue-icon-saas/src/statistics/index.ts | 4 +
packages/vue-icon-saas/src/stop/index.ts | 4 +
packages/vue-icon-saas/src/success/index.ts | 4 +
.../vue-icon-saas/src/successful/index.ts | 4 +
.../src/task-cooperation/index.ts | 4 +
.../src/telephone-circle/index.ts | 4 +
packages/vue-icon-saas/src/telephone/index.ts | 4 +
packages/vue-icon-saas/src/text-tab/index.ts | 4 +
packages/vue-icon-saas/src/text-type/index.ts | 4 +
packages/vue-icon-saas/src/text/index.ts | 4 +
packages/vue-icon-saas/src/time/index.ts | 4 +
packages/vue-icon-saas/src/total/index.ts | 4 +
.../vue-icon-saas/src/triangle-down/index.ts | 4 +
packages/vue-icon-saas/src/undelete/index.ts | 4 +
packages/vue-icon-saas/src/unfilter/index.ts | 4 +
packages/vue-icon-saas/src/unfreeze/index.ts | 4 +
packages/vue-icon-saas/src/unknow/index.ts | 4 +
packages/vue-icon-saas/src/unlock/index.ts | 4 +
packages/vue-icon-saas/src/unsent/index.ts | 4 +
packages/vue-icon-saas/src/up-o/index.ts | 4 +
packages/vue-icon-saas/src/up/index.ts | 4 +
packages/vue-icon-saas/src/upload/index.ts | 4 +
packages/vue-icon-saas/src/user/index.ts | 4 +
.../vue-icon-saas/src/versiontree/index.ts | 4 +
.../vue-icon-saas/src/video-type/index.ts | 4 +
packages/vue-icon-saas/src/view/index.ts | 4 +
.../src/warning-triangle/index.ts | 4 +
packages/vue-icon-saas/src/warning/index.ts | 4 +
packages/vue-icon-saas/src/web-plus/index.ts | 4 +
packages/vue-icon-saas/src/word-type/index.ts | 4 +
packages/vue-icon-saas/src/writing/index.ts | 4 +
packages/vue-icon-saas/src/yes/index.ts | 4 +
packages/vue-icon-saas/src/zip-type/index.ts | 4 +
packages/vue-icon-saas/src/zoom-in/index.ts | 4 +
packages/vue-icon-saas/src/zoom-out/index.ts | 4 +
packages/vue-icon/index.ts | 343 ++++-
packages/vue-locale/src/lang/en.ts | 256 +++-
packages/vue-locale/src/lang/zh-CN.ts | 165 ++-
packages/vue/src/action-menu/package.json | 1 +
packages/vue/src/action-sheet/package.json | 1 +
.../vue/src/alert/__tests__/alert.test.tsx | 16 +-
packages/vue/src/alert/package.json | 1 +
packages/vue/src/amount/package.json | 1 +
packages/vue/src/anchor/package.json | 34 +-
packages/vue/src/area/package.json | 1 +
.../__tests__/autocomplete.test.tsx | 69 +
packages/vue/src/autocomplete/package.json | 1 +
packages/vue/src/avatar/package.json | 1 +
.../vue/src/badge/__tests__/badge.test.tsx | 35 +
packages/vue/src/badge/package.json | 1 +
packages/vue/src/breadcrumb-item/package.json | 1 +
packages/vue/src/breadcrumb/package.json | 1 +
packages/vue/src/bulletin-board/package.json | 1 +
.../__tests__/button-group.test.tsx | 42 +
packages/vue/src/button-group/package.json | 1 +
.../vue/src/button/__tests__/button.test.tsx | 148 +++
packages/vue/src/button/package.json | 1 +
packages/vue/src/calendar/package.json | 1 +
packages/vue/src/card-group/package.json | 5 +
packages/vue/src/card-template/package.json | 1 +
packages/vue/src/card/package.json | 5 +
packages/vue/src/carousel-item/package.json | 1 +
packages/vue/src/carousel/package.json | 1 +
packages/vue/src/cascader-menu/package.json | 1 +
packages/vue/src/cascader-node/package.json | 1 +
.../__tests__/cascader-panel.test.tsx | 119 ++
packages/vue/src/cascader-panel/package.json | 1 +
.../src/cascader/__tests__/cascader.test.tsx | 122 ++
packages/vue/src/cascader/package.json | 1 +
.../vue/src/chart/autonavi-map/package.json | 7 +-
packages/vue/src/chart/baidu-map/package.json | 7 +-
packages/vue/src/chart/chart-bar/package.json | 7 +-
.../vue/src/chart/chart-boxplot/package.json | 7 +-
.../vue/src/chart/chart-candle/package.json | 7 +-
.../vue/src/chart/chart-core/package.json | 5 +
.../vue/src/chart/chart-funnel/package.json | 7 +-
.../vue/src/chart/chart-gauge/package.json | 7 +-
.../vue/src/chart/chart-graph/package.json | 7 +-
.../vue/src/chart/chart-heatmap/package.json | 7 +-
.../src/chart/chart-histogram/package.json | 7 +-
.../vue/src/chart/chart-line/package.json | 7 +-
.../src/chart/chart-liquidfill/package.json | 7 +-
packages/vue/src/chart/chart-map/package.json | 7 +-
packages/vue/src/chart/chart-pie/package.json | 7 +-
.../vue/src/chart/chart-radar/package.json | 7 +-
.../vue/src/chart/chart-ring/package.json | 7 +-
.../vue/src/chart/chart-sankey/package.json | 7 +-
.../vue/src/chart/chart-scatter/package.json | 7 +-
.../vue/src/chart/chart-sunburst/package.json | 7 +-
.../vue/src/chart/chart-tree/package.json | 7 +-
.../src/chart/chart-waterfall/package.json | 7 +-
.../src/chart/chart-wordcloud/package.json | 7 +-
packages/vue/src/chart/package.json | 1 +
packages/vue/src/checkbox-button/package.json | 1 +
packages/vue/src/checkbox-group/package.json | 1 +
.../src/checkbox/__tests__/checkbox.test.tsx | 29 +
packages/vue/src/checkbox/package.json | 1 +
packages/vue/src/col/package.json | 1 +
packages/vue/src/collapse-item/package.json | 1 +
.../vue/src/collapse-transition/package.json | 1 +
packages/vue/src/collapse/package.json | 1 +
.../vue/src/column-list-group/package.json | 5 +
.../vue/src/column-list-item/package.json | 4 +
packages/vue/src/company/package.json | 1 +
packages/vue/src/config-provider/package.json | 1 +
.../vue/src/config-provider/src/index.vue | 30 +-
packages/vue/src/container/package.json | 1 +
packages/vue/src/country/package.json | 1 +
.../vue/src/credit-card-form/package.json | 1 +
.../vue/src/credit-card-form/src/index.ts | 5 +-
packages/vue/src/credit-card/package.json | 1 +
packages/vue/src/crop/package.json | 1 +
packages/vue/src/currency/package.json | 1 +
packages/vue/src/date-panel/package.json | 1 +
.../__tests__/date-picker.test.tsx | 24 +
packages/vue/src/date-picker/package.json | 1 +
packages/vue/src/date-range/package.json | 1 +
packages/vue/src/date-table/package.json | 1 +
packages/vue/src/dept/package.json | 1 +
packages/vue/src/detail-page/package.json | 1 +
packages/vue/src/dialog-box/package.json | 1 +
packages/vue/src/dialog-select/package.json | 5 +
packages/vue/src/drawer/package.json | 4 +
packages/vue/src/drop-roles/package.json | 1 +
.../drop-times/__tests__/drop-times.test.tsx | 23 +
packages/vue/src/drop-times/package.json | 1 +
packages/vue/src/dropdown-item/package.json | 1 +
packages/vue/src/dropdown-menu/package.json | 1 +
packages/vue/src/dropdown/package.json | 1 +
.../src/dynamic-scroller-item/package.json | 5 +
.../vue/src/dynamic-scroller/package.json | 5 +
packages/vue/src/espace/package.json | 1 +
packages/vue/src/exception/package.json | 1 +
packages/vue/src/fall-menu/package.json | 1 +
.../__tests__/file-upload.test.tsx | 52 +
packages/vue/src/file-upload/package.json | 1 +
packages/vue/src/filter-box/package.json | 5 +
packages/vue/src/filter-panel/package.json | 5 +
packages/vue/src/floatbar/package.json | 1 +
packages/vue/src/form-item/package.json | 1 +
packages/vue/src/form/__tests__/form.test.tsx | 56 +
packages/vue/src/form/package.json | 1 +
packages/vue/src/fullscreen/package.json | 1 +
packages/vue/src/grid-column/package.json | 1 +
packages/vue/src/grid-manager/package.json | 1 +
packages/vue/src/grid-toolbar/package.json | 1 +
packages/vue/src/grid/package.json | 7 +-
packages/vue/src/grid/src/body/src/body.tsx | 76 +-
packages/vue/src/grid/src/cell/src/cell.ts | 134 +-
.../vue/src/grid/src/column/src/column.ts | 4 +-
packages/vue/src/grid/src/config.ts | 45 +-
packages/vue/src/grid/src/grid/grid.ts | 168 ++-
packages/vue/src/grid/src/grid/methods.ts | 2 +-
.../grid/src/mobile-first/column-content.vue | 128 ++
.../grid/src/mobile-first/column-layout.vue | 30 +
.../src/grid/src/mobile-first/column-link.vue | 59 +
.../src/grid/src/mobile-first/column-type.vue | 31 +
.../src/grid/src/mobile-first/gantt-view.vue | 21 +
.../vue/src/grid/src/mobile-first/index.vue | 328 +++++
.../src/grid/src/mobile-first/list-view.vue | 21 +
.../src/grid/src/mobile-first/table-row.vue | 45 +
.../vue/src/grid/src/mobile-first/type.ts | 47 +
.../vue/src/grid/src/mobile-first/utils.ts | 5 +
packages/vue/src/grid/src/table/src/table.ts | 66 +-
.../grid/src/table/src/utils/autoCellWidth.ts | 11 +-
packages/vue/src/guide/package.json | 5 +
packages/vue/src/hrapprover/package.json | 1 +
packages/vue/src/image-viewer/package.json | 1 +
packages/vue/src/image/package.json | 1 +
.../vue/src/index-bar-anchor/package.json | 1 +
packages/vue/src/index-bar/package.json | 1 +
.../vue/src/input/__tests__/input.test.tsx | 30 +
packages/vue/src/input/package.json | 1 +
.../ip-address/__tests__/ip-address.test.tsx | 31 +
packages/vue/src/ip-address/package.json | 1 +
packages/vue/src/ip-address/src/pc.vue | 2 +-
packages/vue/src/layout/package.json | 1 +
packages/vue/src/link-menu/package.json | 1 +
packages/vue/src/link/__tests__/link.test.tsx | 22 +
packages/vue/src/link/package.json | 1 +
packages/vue/src/list/package.json | 1 +
packages/vue/src/loading/package.json | 1 +
packages/vue/src/locales/package.json | 1 +
packages/vue/src/logon-user/package.json | 1 +
packages/vue/src/logout/package.json | 1 +
packages/vue/src/milestone/package.json | 1 +
packages/vue/src/mini-picker/package.json | 1 +
packages/vue/src/modal/index.ts | 5 +-
packages/vue/src/modal/package.json | 1 +
packages/vue/src/month-range/package.json | 1 +
packages/vue/src/month-table/package.json | 1 +
packages/vue/src/multi-select/package.json | 1 +
packages/vue/src/nav-bar/package.json | 1 +
packages/vue/src/nav-menu/package.json | 1 +
packages/vue/src/notify/package.json | 1 +
.../src/numeric/__tests__/numeric.test.tsx | 23 +
packages/vue/src/numeric/package.json | 1 +
packages/vue/src/option-group/package.json | 1 +
packages/vue/src/option/package.json | 1 +
packages/vue/src/pager-item/package.json | 1 +
.../vue/src/pager/__test__/pager.test.tsx | 50 +
packages/vue/src/pager/package.json | 1 +
packages/vue/src/pager/src/pc.vue | 4 +-
packages/vue/src/panel/package.json | 1 +
packages/vue/src/picker-column/package.json | 1 +
packages/vue/src/picker/package.json | 1 +
packages/vue/src/picker/src/pc.vue | 6 +-
.../pop-upload/__tests__/pop-upload.test.tsx | 17 +
packages/vue/src/pop-upload/package.json | 1 +
packages/vue/src/pop-upload/src/pc.vue | 1 +
.../popeditor/__tests__/popeditor.test.tsx | 37 +
packages/vue/src/popeditor/package.json | 1 +
.../src/popover/__tests__/popover.test.tsx | 33 +
packages/vue/src/popover/package.json | 1 +
packages/vue/src/popup/package.json | 1 +
packages/vue/src/progress/package.json | 1 +
packages/vue/src/pull-refresh/package.json | 1 +
packages/vue/src/radio-button/package.json | 1 +
packages/vue/src/radio-group/package.json | 1 +
.../vue/src/radio/__tests__/radio.test.tsx | 38 +
packages/vue/src/radio/package.json | 1 +
packages/vue/src/rate/__test__/rate.test.ts | 61 +
packages/vue/src/rate/package.json | 1 +
packages/vue/src/record/package.json | 5 +
.../vue/src/recycle-scroller/package.json | 5 +
packages/vue/src/roles/package.json | 1 +
packages/vue/src/row/package.json | 1 +
packages/vue/src/scroll-text/package.json | 1 +
packages/vue/src/scrollbar/package.json | 1 +
.../vue/src/search/__tests__/search.test.tsx | 52 +
packages/vue/src/search/package.json | 1 +
packages/vue/src/select-dropdown/package.json | 1 +
.../vue/src/select/__tests__/select.test.tsx | 74 ++
packages/vue/src/select/package.json | 1 +
packages/vue/src/slide-bar/package.json | 1 +
packages/vue/src/slide-bar/src/pc.vue | 2 +-
.../vue/src/slider/__tests__/slider.test.tsx | 32 +
packages/vue/src/slider/package.json | 1 +
packages/vue/src/split/package.json | 1 +
.../vue/src/standard-list-item/package.json | 5 +
packages/vue/src/steps/package.json | 1 +
packages/vue/src/svg-icon/package.json | 1 +
.../vue/src/switch/__tests__/switch.test.tsx | 32 +
packages/vue/src/switch/package.json | 1 +
packages/vue/src/switch/src/index.ts | 4 +-
packages/vue/src/switch/src/pc.vue | 4 +-
packages/vue/src/tab-item/package.json | 1 +
packages/vue/src/tabbar-item/package.json | 1 +
packages/vue/src/tabbar/package.json | 1 +
packages/vue/src/table/package.json | 1 +
packages/vue/src/tabs/package.json | 1 +
packages/vue/src/tag/package.json | 1 +
packages/vue/src/text-popup/package.json | 1 +
packages/vue/src/time-line/package.json | 1 +
packages/vue/src/time-line/src/pc.vue | 3 +-
packages/vue/src/time-panel/package.json | 1 +
.../__tests__/time-picker.test.tsx | 30 +
packages/vue/src/time-picker/package.json | 1 +
packages/vue/src/time-range/package.json | 1 +
.../__tests__/time-select.test.tsx | 34 +
packages/vue/src/time-select/package.json | 1 +
packages/vue/src/time-spinner/package.json | 1 +
packages/vue/src/time/package.json | 1 +
packages/vue/src/toggle-menu/package.json | 1 +
packages/vue/src/tooltip/package.json | 1 +
packages/vue/src/top-box/package.json | 1 +
packages/vue/src/transfer-panel/package.json | 1 +
.../src/transfer/__tests__/transfer.test.ts | 75 ++
packages/vue/src/transfer/package.json | 1 +
packages/vue/src/tree-menu/package.json | 1 +
packages/vue/src/tree/__test__/tree.test.tsx | 200 +++
packages/vue/src/tree/package.json | 1 +
packages/vue/src/tree/src/tree-node.vue | 1 +
packages/vue/src/upload-dragger/package.json | 1 +
packages/vue/src/upload-list/package.json | 1 +
packages/vue/src/upload/package.json | 1 +
packages/vue/src/user-account/package.json | 1 +
packages/vue/src/user-contact/package.json | 1 +
packages/vue/src/user-head-group/package.json | 5 +
packages/vue/src/user-head/package.json | 1 +
packages/vue/src/user-link/package.json | 1 +
packages/vue/src/user/package.json | 1 +
packages/vue/src/wheel/package.json | 1 +
packages/vue/src/wizard/package.json | 1 +
packages/vue/src/year-range/package.json | 5 +
packages/vue/src/year-table/package.json | 1 +
volar.config.js | 2 +-
1944 files changed, 35128 insertions(+), 1812 deletions(-)
create mode 100644 examples/docs/resources/mobile-first/app/action-sheet/webdoc/action-sheet.cn.md
create mode 100644 examples/docs/resources/mobile-first/app/action-sheet/webdoc/action-sheet.en.md
create mode 100644 examples/docs/resources/mobile-first/app/action-sheet/webdoc/action-sheet.js
create mode 100644 examples/docs/resources/mobile-first/app/badge/webdoc/badge.cn.md
create mode 100644 examples/docs/resources/mobile-first/app/badge/webdoc/badge.en.md
create mode 100644 examples/docs/resources/mobile-first/app/badge/webdoc/badge.js
create mode 100644 examples/docs/resources/mobile-first/app/button-group/webdoc/button-group.cn.md
create mode 100644 examples/docs/resources/mobile-first/app/button-group/webdoc/button-group.en.md
create mode 100644 examples/docs/resources/mobile-first/app/button-group/webdoc/button-group.js
create mode 100644 examples/docs/resources/mobile-first/app/card/webdoc/card.cn.md
create mode 100644 examples/docs/resources/mobile-first/app/card/webdoc/card.en.md
create mode 100644 examples/docs/resources/mobile-first/app/card/webdoc/card.js
create mode 100644 examples/docs/resources/mobile-first/app/carousel/webdoc/carousel.cn.md
create mode 100644 examples/docs/resources/mobile-first/app/carousel/webdoc/carousel.en.md
create mode 100644 examples/docs/resources/mobile-first/app/carousel/webdoc/carousel.js
create mode 100644 examples/docs/resources/mobile-first/app/cascader-select/webdoc/cascader-select.cn.md
create mode 100644 examples/docs/resources/mobile-first/app/cascader-select/webdoc/cascader-select.en.md
create mode 100644 examples/docs/resources/mobile-first/app/cascader-select/webdoc/cascader-select.js
create mode 100644 examples/docs/resources/mobile-first/app/checkbox/webdoc/checkbox.cn.md
create mode 100644 examples/docs/resources/mobile-first/app/checkbox/webdoc/checkbox.en.md
create mode 100644 examples/docs/resources/mobile-first/app/checkbox/webdoc/checkbox.js
create mode 100644 examples/docs/resources/mobile-first/app/collapse/webdoc/collapse.cn.md
create mode 100644 examples/docs/resources/mobile-first/app/collapse/webdoc/collapse.en.md
create mode 100644 examples/docs/resources/mobile-first/app/collapse/webdoc/collapse.js
create mode 100644 examples/docs/resources/mobile-first/app/column-list-item/show-radio.vue
create mode 100644 examples/docs/resources/mobile-first/app/column-list-item/webdoc/column-list-item.cn.md
create mode 100644 examples/docs/resources/mobile-first/app/column-list-item/webdoc/column-list-item.en.md
create mode 100644 examples/docs/resources/mobile-first/app/column-list-item/webdoc/column-list-item.js
create mode 100644 examples/docs/resources/mobile-first/app/date-picker-mobile/webdoc/date-picker-mobile.cn.md
create mode 100644 examples/docs/resources/mobile-first/app/date-picker-mobile/webdoc/date-picker-mobile.en.md
create mode 100644 examples/docs/resources/mobile-first/app/date-picker-mobile/webdoc/date-picker-mobile.js
create mode 100644 examples/docs/resources/mobile-first/app/drawer/webdoc/drawer.cn.md
create mode 100644 examples/docs/resources/mobile-first/app/drawer/webdoc/drawer.en.md
create mode 100644 examples/docs/resources/mobile-first/app/drawer/webdoc/drawer.js
create mode 100644 examples/docs/resources/mobile-first/app/dropdown/webdoc/dropdown.cn.md
create mode 100644 examples/docs/resources/mobile-first/app/dropdown/webdoc/dropdown.en.md
create mode 100644 examples/docs/resources/mobile-first/app/dropdown/webdoc/dropdown.js
create mode 100644 examples/docs/resources/mobile-first/app/exception/webdoc/exception.cn.md
create mode 100644 examples/docs/resources/mobile-first/app/exception/webdoc/exception.en.md
create mode 100644 examples/docs/resources/mobile-first/app/exception/webdoc/exception.js
create mode 100644 examples/docs/resources/mobile-first/app/file-upload/webdoc/file-upload.cn.md
create mode 100644 examples/docs/resources/mobile-first/app/file-upload/webdoc/file-upload.en.md
create mode 100644 examples/docs/resources/mobile-first/app/file-upload/webdoc/file-upload.js
create mode 100644 examples/docs/resources/mobile-first/app/filter-bar/webdoc/filter-bar.cn.md
create mode 100644 examples/docs/resources/mobile-first/app/filter-bar/webdoc/filter-bar.en.md
create mode 100644 examples/docs/resources/mobile-first/app/filter-bar/webdoc/filter-bar.js
create mode 100644 examples/docs/resources/mobile-first/app/filter/webdoc/filter.cn.md
create mode 100644 examples/docs/resources/mobile-first/app/filter/webdoc/filter.en.md
create mode 100644 examples/docs/resources/mobile-first/app/filter/webdoc/filter.js
create mode 100644 examples/docs/resources/mobile-first/app/flowchart/dot-horizon.vue
create mode 100644 examples/docs/resources/mobile-first/app/flowchart/dot-vertical.vue
create mode 100644 examples/docs/resources/mobile-first/app/flowchart/holistic-fork.vue
create mode 100644 examples/docs/resources/mobile-first/app/flowchart/holistic.vue
create mode 100644 examples/docs/resources/mobile-first/app/flowchart/webdoc/flowchart.cn.md
create mode 100644 examples/docs/resources/mobile-first/app/flowchart/webdoc/flowchart.en.md
create mode 100644 examples/docs/resources/mobile-first/app/flowchart/webdoc/flowchart.js
create mode 100644 examples/docs/resources/mobile-first/app/form/webdoc/form.cn.md
create mode 100644 examples/docs/resources/mobile-first/app/form/webdoc/form.en.md
create mode 100644 examples/docs/resources/mobile-first/app/form/webdoc/form.js
create mode 100644 examples/docs/resources/mobile-first/app/grid/basic-usage.vue
create mode 100644 examples/docs/resources/mobile-first/app/grid/webdoc/grid.cn.md
create mode 100644 examples/docs/resources/mobile-first/app/grid/webdoc/grid.en.md
create mode 100644 examples/docs/resources/mobile-first/app/grid/webdoc/grid.js
create mode 100644 examples/docs/resources/mobile-first/app/image/webdoc/image.cn.md
create mode 100644 examples/docs/resources/mobile-first/app/image/webdoc/image.en.md
create mode 100644 examples/docs/resources/mobile-first/app/image/webdoc/image.js
create mode 100644 examples/docs/resources/mobile-first/app/input/webdoc/input.cn.md
create mode 100644 examples/docs/resources/mobile-first/app/input/webdoc/input.en.md
create mode 100644 examples/docs/resources/mobile-first/app/input/webdoc/input.js
create mode 100644 examples/docs/resources/mobile-first/app/loading/webdoc/loading.cn.md
create mode 100644 examples/docs/resources/mobile-first/app/loading/webdoc/loading.en.md
create mode 100644 examples/docs/resources/mobile-first/app/loading/webdoc/loading.js
create mode 100644 examples/docs/resources/mobile-first/app/message/webdoc/message.cn.md
create mode 100644 examples/docs/resources/mobile-first/app/message/webdoc/message.en.md
create mode 100644 examples/docs/resources/mobile-first/app/message/webdoc/message.js
create mode 100644 examples/docs/resources/mobile-first/app/modal/webdoc/modal.cn.md
create mode 100644 examples/docs/resources/mobile-first/app/modal/webdoc/modal.en.md
create mode 100644 examples/docs/resources/mobile-first/app/modal/webdoc/modal.js
create mode 100644 examples/docs/resources/mobile-first/app/numeric/webdoc/numeric.cn.md
create mode 100644 examples/docs/resources/mobile-first/app/numeric/webdoc/numeric.en.md
create mode 100644 examples/docs/resources/mobile-first/app/numeric/webdoc/numeric.js
create mode 100644 examples/docs/resources/mobile-first/app/pager/webdoc/pager.cn.md
create mode 100644 examples/docs/resources/mobile-first/app/pager/webdoc/pager.en.md
create mode 100644 examples/docs/resources/mobile-first/app/pager/webdoc/pager.js
create mode 100644 examples/docs/resources/mobile-first/app/popconfirm/webdoc/popconfirm.cn.md
create mode 100644 examples/docs/resources/mobile-first/app/popconfirm/webdoc/popconfirm.en.md
create mode 100644 examples/docs/resources/mobile-first/app/popconfirm/webdoc/popconfirm.js
create mode 100644 examples/docs/resources/mobile-first/app/popover/webdoc/popover.cn.md
create mode 100644 examples/docs/resources/mobile-first/app/popover/webdoc/popover.en.md
create mode 100644 examples/docs/resources/mobile-first/app/popover/webdoc/popover.js
create mode 100644 examples/docs/resources/mobile-first/app/progress/webdoc/progress.cn.md
create mode 100644 examples/docs/resources/mobile-first/app/progress/webdoc/progress.en.md
create mode 100644 examples/docs/resources/mobile-first/app/progress/webdoc/progress.js
create mode 100644 examples/docs/resources/mobile-first/app/radio-block/webdoc/radio-block.cn.md
create mode 100644 examples/docs/resources/mobile-first/app/radio-block/webdoc/radio-block.en.md
create mode 100644 examples/docs/resources/mobile-first/app/radio-block/webdoc/radio-block.js
create mode 100644 examples/docs/resources/mobile-first/app/radio/webdoc/radio.cn.md
create mode 100644 examples/docs/resources/mobile-first/app/radio/webdoc/radio.en.md
create mode 100644 examples/docs/resources/mobile-first/app/radio/webdoc/radio.js
create mode 100644 examples/docs/resources/mobile-first/app/rate/webdoc/rate.cn.md
create mode 100644 examples/docs/resources/mobile-first/app/rate/webdoc/rate.en.md
create mode 100644 examples/docs/resources/mobile-first/app/rate/webdoc/rate.js
create mode 100644 examples/docs/resources/mobile-first/app/record/webdoc/record.cn.md
create mode 100644 examples/docs/resources/mobile-first/app/record/webdoc/record.en.md
create mode 100644 examples/docs/resources/mobile-first/app/record/webdoc/record.js
create mode 100644 examples/docs/resources/mobile-first/app/scrollbar/webdoc/scrollbar.cn.md
create mode 100644 examples/docs/resources/mobile-first/app/scrollbar/webdoc/scrollbar.en.md
create mode 100644 examples/docs/resources/mobile-first/app/scrollbar/webdoc/scrollbar.js
create mode 100644 examples/docs/resources/mobile-first/app/search/webdoc/search.cn.md
create mode 100644 examples/docs/resources/mobile-first/app/search/webdoc/search.en.md
create mode 100644 examples/docs/resources/mobile-first/app/search/webdoc/search.js
create mode 100644 examples/docs/resources/mobile-first/app/select-mobile/webdoc/select-mobile.cn.md
create mode 100644 examples/docs/resources/mobile-first/app/select-mobile/webdoc/select-mobile.en.md
create mode 100644 examples/docs/resources/mobile-first/app/select-mobile/webdoc/select-mobile.js
create mode 100644 examples/docs/resources/mobile-first/app/select-view/webdoc/select-view.cn.md
create mode 100644 examples/docs/resources/mobile-first/app/select-view/webdoc/select-view.en.md
create mode 100644 examples/docs/resources/mobile-first/app/select-view/webdoc/select-view.js
create mode 100644 examples/docs/resources/mobile-first/app/selected-box/webdoc/selected-box.cn.md
create mode 100644 examples/docs/resources/mobile-first/app/selected-box/webdoc/selected-box.en.md
create mode 100644 examples/docs/resources/mobile-first/app/selected-box/webdoc/selected-box.js
create mode 100644 examples/docs/resources/mobile-first/app/slider/webdoc/slider.cn.md
create mode 100644 examples/docs/resources/mobile-first/app/slider/webdoc/slider.en.md
create mode 100644 examples/docs/resources/mobile-first/app/slider/webdoc/slider.js
create mode 100644 examples/docs/resources/mobile-first/app/standard-list-item/webdoc/standard-list-item.cn.md
create mode 100644 examples/docs/resources/mobile-first/app/standard-list-item/webdoc/standard-list-item.en.md
create mode 100644 examples/docs/resources/mobile-first/app/standard-list-item/webdoc/standard-list-item.js
create mode 100644 examples/docs/resources/mobile-first/app/steps/webdoc/steps.cn.md
create mode 100644 examples/docs/resources/mobile-first/app/steps/webdoc/steps.en.md
create mode 100644 examples/docs/resources/mobile-first/app/steps/webdoc/steps.js
create mode 100644 examples/docs/resources/mobile-first/app/switch/webdoc/switch.cn.md
create mode 100644 examples/docs/resources/mobile-first/app/switch/webdoc/switch.en.md
create mode 100644 examples/docs/resources/mobile-first/app/switch/webdoc/switch.js
create mode 100644 examples/docs/resources/mobile-first/app/tabs/webdoc/tabs.cn.md
create mode 100644 examples/docs/resources/mobile-first/app/tabs/webdoc/tabs.en.md
create mode 100644 examples/docs/resources/mobile-first/app/tabs/webdoc/tabs.js
create mode 100644 examples/docs/resources/mobile-first/app/tag-group/webdoc/tag-group.cn.md
create mode 100644 examples/docs/resources/mobile-first/app/tag-group/webdoc/tag-group.en.md
create mode 100644 examples/docs/resources/mobile-first/app/tag-group/webdoc/tag-group.js
create mode 100644 examples/docs/resources/mobile-first/app/tag/webdoc/tag.cn.md
create mode 100644 examples/docs/resources/mobile-first/app/tag/webdoc/tag.en.md
create mode 100644 examples/docs/resources/mobile-first/app/tag/webdoc/tag.js
create mode 100644 examples/docs/resources/mobile-first/app/time-line/webdoc/time-line.cn.md
create mode 100644 examples/docs/resources/mobile-first/app/time-line/webdoc/time-line.en.md
create mode 100644 examples/docs/resources/mobile-first/app/time-line/webdoc/time-line.js
create mode 100644 examples/docs/resources/mobile-first/app/time-picker-mobile/webdoc/time-picker-mobile.cn.md
create mode 100644 examples/docs/resources/mobile-first/app/time-picker-mobile/webdoc/time-picker-mobile.en.md
create mode 100644 examples/docs/resources/mobile-first/app/time-picker-mobile/webdoc/time-picker-mobile.js
create mode 100644 examples/docs/resources/mobile-first/app/tooltip/webdoc/tooltip.cn.md
create mode 100644 examples/docs/resources/mobile-first/app/tooltip/webdoc/tooltip.en.md
create mode 100644 examples/docs/resources/mobile-first/app/tooltip/webdoc/tooltip.js
create mode 100644 examples/docs/resources/mobile-first/app/user-head/webdoc/user-head.cn.md
create mode 100644 examples/docs/resources/mobile-first/app/user-head/webdoc/user-head.en.md
create mode 100644 examples/docs/resources/mobile-first/app/user-head/webdoc/user-head.js
create mode 100644 examples/docs/resources/pc/demo/action-menu/basic-usage.spec.ts
create mode 100644 examples/docs/resources/pc/demo/action-menu/disabled.spec.ts
create mode 100644 examples/docs/resources/pc/demo/action-menu/item-click.spec.ts
create mode 100644 examples/docs/resources/pc/demo/action-menu/max-show-num.spec.ts
create mode 100644 examples/docs/resources/pc/demo/action-menu/more-click.spec.ts
create mode 100644 examples/docs/resources/pc/demo/action-menu/more-text.spec.ts
create mode 100644 examples/docs/resources/pc/demo/action-menu/popper-class.spec.ts
create mode 100644 examples/docs/resources/pc/demo/action-menu/slot-item.spec.ts
create mode 100644 examples/docs/resources/pc/demo/action-menu/spacing.spec.ts
create mode 100644 examples/docs/resources/pc/demo/action-menu/text-field.spec.ts
create mode 100644 examples/docs/resources/pc/demo/action-menu/visible-change.spec.ts
create mode 100644 examples/docs/resources/pc/demo/alert/base.spec.ts
create mode 100644 examples/docs/resources/pc/demo/alert/center.spec.ts
create mode 100644 examples/docs/resources/pc/demo/alert/closable.spec.ts
create mode 100644 examples/docs/resources/pc/demo/alert/close-text.spec.ts
create mode 100644 examples/docs/resources/pc/demo/alert/close.spec.ts
create mode 100644 examples/docs/resources/pc/demo/alert/custom-description.spec.ts
create mode 100644 examples/docs/resources/pc/demo/alert/feedback-of-result.spec.ts
create mode 100644 examples/docs/resources/pc/demo/alert/icon.spec.ts
create mode 100644 examples/docs/resources/pc/demo/alert/show-icon.spec.ts
create mode 100644 examples/docs/resources/pc/demo/alert/size.spec.ts
create mode 100644 examples/docs/resources/pc/demo/alert/slot-default.spec.ts
create mode 100644 examples/docs/resources/pc/demo/alert/title.spec.ts
create mode 100644 examples/docs/resources/pc/demo/alert/type.spec.ts
create mode 100644 examples/docs/resources/pc/demo/anchor/basic-usage.spec.ts
create mode 100644 examples/docs/resources/pc/demo/anchor/is-affix.spec.ts
create mode 100644 examples/docs/resources/pc/demo/anchor/on-change.spec.ts
create mode 100644 examples/docs/resources/pc/demo/anchor/set-container.spec.ts
create mode 100644 examples/docs/resources/pc/demo/area/custom-service.spec.ts
create mode 100644 examples/docs/resources/pc/demo/badge/badge-class.spec.ts
create mode 100644 examples/docs/resources/pc/demo/badge/base.spec.ts
create mode 100644 examples/docs/resources/pc/demo/badge/dynamic-hidden.spec.ts
create mode 100644 examples/docs/resources/pc/demo/badge/is-dot.spec.ts
create mode 100644 examples/docs/resources/pc/demo/badge/max.spec.ts
create mode 100644 examples/docs/resources/pc/demo/badge/offset.spec.ts
create mode 100644 examples/docs/resources/pc/demo/badge/slot-content.spec.ts
create mode 100644 examples/docs/resources/pc/demo/badge/slot-default.spec.ts
create mode 100644 examples/docs/resources/pc/demo/badge/target.spec.ts
create mode 100644 examples/docs/resources/pc/demo/badge/type.spec.ts
create mode 100644 examples/docs/resources/pc/demo/breadcrumb/base.spec.ts
create mode 100644 examples/docs/resources/pc/demo/breadcrumb/options.spec.ts
create mode 100644 examples/docs/resources/pc/demo/breadcrumb/separator.spec.ts
create mode 100644 examples/docs/resources/pc/demo/breadcrumb/slot-default.spec.ts
create mode 100644 examples/docs/resources/pc/demo/bulletin-board/active-name.spec.ts
create mode 100644 examples/docs/resources/pc/demo/bulletin-board/base.spec.ts
create mode 100644 examples/docs/resources/pc/demo/bulletin-board/icon.spec.ts
create mode 100644 examples/docs/resources/pc/demo/bulletin-board/more-link.spec.ts
create mode 100644 examples/docs/resources/pc/demo/bulletin-board/route.spec.ts
create mode 100644 examples/docs/resources/pc/demo/bulletin-board/tab-title.spec.ts
create mode 100644 examples/docs/resources/pc/demo/bulletin-board/title.spec.ts
create mode 100644 examples/docs/resources/pc/demo/bulletin-board/url.spec.ts
create mode 100644 examples/docs/resources/pc/demo/button-group/border.spec.js
create mode 100644 examples/docs/resources/pc/demo/button-group/button-group-multiple.spec.js
create mode 100644 examples/docs/resources/pc/demo/carousel/autoplay.spec.ts
create mode 100644 examples/docs/resources/pc/demo/carousel/basic-usage.spec.ts
create mode 100644 examples/docs/resources/pc/demo/carousel/card-mode.spec.ts
create mode 100644 examples/docs/resources/pc/demo/carousel/carousel-arrow-always.spec.ts
create mode 100644 examples/docs/resources/pc/demo/carousel/carousel-arrow-hover.spec.ts
create mode 100644 examples/docs/resources/pc/demo/carousel/carousel-arrow-never.spec.ts
create mode 100644 examples/docs/resources/pc/demo/carousel/close-loop.spec.ts
create mode 100644 examples/docs/resources/pc/demo/carousel/indicator-trigger.spec.ts
create mode 100644 examples/docs/resources/pc/demo/carousel/manual-play.spec.ts
create mode 100644 examples/docs/resources/pc/demo/carousel/play-interval.spec.ts
create mode 100644 examples/docs/resources/pc/demo/carousel/show-title.spec.ts
create mode 100644 examples/docs/resources/pc/demo/carousel/up-down-carousel.spec.ts
create mode 100644 examples/docs/resources/pc/demo/cascader-panel/basic-usage.spec.ts
create mode 100644 examples/docs/resources/pc/demo/cascader-panel/cascader-panel-props.spec.ts
create mode 100644 examples/docs/resources/pc/demo/cascader-panel/change.spec.ts
create mode 100644 examples/docs/resources/pc/demo/cascader-panel/custom-option-content.spec.ts
create mode 100644 examples/docs/resources/pc/demo/cascader-panel/expand-change.spec.ts
create mode 100644 examples/docs/resources/pc/demo/cascader/auto-load-checkStrictly.spec.ts
create mode 100644 examples/docs/resources/pc/demo/cascader/auto-load.spec.ts
create mode 100644 examples/docs/resources/pc/demo/cascader/basic-usage.spec.ts
create mode 100644 examples/docs/resources/pc/demo/cascader/check-strictly-multiple.spec.ts
create mode 100644 examples/docs/resources/pc/demo/cascader/check-strictly.spec.ts
create mode 100644 examples/docs/resources/pc/demo/cascader/clearable.spec.ts
create mode 100644 examples/docs/resources/pc/demo/cascader/collapse-tags.spec.ts
create mode 100644 examples/docs/resources/pc/demo/cascader/default-multiple.spec.ts
create mode 100644 examples/docs/resources/pc/demo/cascader/disabled-items.spec.ts
create mode 100644 examples/docs/resources/pc/demo/cascader/events.spec.ts
create mode 100644 examples/docs/resources/pc/demo/cascader/expand-trigger.spec.ts
create mode 100644 examples/docs/resources/pc/demo/cascader/filter-method.spec.ts
create mode 100644 examples/docs/resources/pc/demo/cascader/filterable-multiple.spec.ts
create mode 100644 examples/docs/resources/pc/demo/cascader/filterable.spec.ts
create mode 100644 examples/docs/resources/pc/demo/cascader/props-children.spec.ts
create mode 100644 examples/docs/resources/pc/demo/cascader/show-all-levels.spec.ts
create mode 100644 examples/docs/resources/pc/demo/checkbox/basic-usage.spec.ts
create mode 100644 examples/docs/resources/pc/demo/checkbox/button-check-box.spec.ts
create mode 100644 examples/docs/resources/pc/demo/checkbox/checkbox-button-multiple.spec.ts
create mode 100644 examples/docs/resources/pc/demo/checkbox/checkbox-button.spec.ts
create mode 100644 examples/docs/resources/pc/demo/checkbox/checkbox-events.spec.ts
create mode 100644 examples/docs/resources/pc/demo/checkbox/checkbox-group.spec.ts
create mode 100644 examples/docs/resources/pc/demo/checkbox/checkbox-slot.spec.ts
create mode 100644 examples/docs/resources/pc/demo/checkbox/checked.spec.ts
create mode 100644 examples/docs/resources/pc/demo/checkbox/content-overflow.spec.ts
create mode 100644 examples/docs/resources/pc/demo/checkbox/dynamic-create-checkbox.spec.ts
create mode 100644 examples/docs/resources/pc/demo/checkbox/group-options.spec.ts
create mode 100644 examples/docs/resources/pc/demo/checkbox/indeterminate.spec.ts
create mode 100644 examples/docs/resources/pc/demo/checkbox/min-max.spec.ts
create mode 100644 examples/docs/resources/pc/demo/checkbox/text.spec.ts
create mode 100644 examples/docs/resources/pc/demo/checkbox/vertical-checkbox.spec.ts
create mode 100644 examples/docs/resources/pc/demo/checkbox/with-border.spec.ts
create mode 100644 examples/docs/resources/pc/demo/collapse/accordion.spec.ts
create mode 100644 examples/docs/resources/pc/demo/collapse/basic-usage.spec.ts
create mode 100644 examples/docs/resources/pc/demo/collapse/block-close.spec.ts
create mode 100644 examples/docs/resources/pc/demo/collapse/collapse-events.spec.ts
create mode 100644 examples/docs/resources/pc/demo/collapse/custom-collapse-icon.spec.ts
create mode 100644 examples/docs/resources/pc/demo/collapse/custom-collapse-title.spec.ts
create mode 100644 examples/docs/resources/pc/demo/collapse/dynamic-disable.spec.ts
create mode 100644 examples/docs/resources/pc/demo/collapse/nested-form.spec.ts
create mode 100644 examples/docs/resources/pc/demo/collapse/nested-grid.spec.ts
create mode 100644 examples/docs/resources/pc/demo/company/basic-usage.spec.ts
create mode 100644 examples/docs/resources/pc/demo/company/custom-service.spec.ts
create mode 100644 examples/docs/resources/pc/demo/country/custom-service.spec.js
create mode 100644 examples/docs/resources/pc/demo/country/fields.spec.js
create mode 100644 examples/docs/resources/pc/demo/credit-card-form/background-image.spec.ts
create mode 100644 examples/docs/resources/pc/demo/credit-card-form/basic-usage.spec.ts
create mode 100644 examples/docs/resources/pc/demo/credit-card-form/credit-card-form-events.spec.ts
create mode 100644 examples/docs/resources/pc/demo/currency/basic-usage.spec.ts
create mode 100644 examples/docs/resources/pc/demo/currency/custom-service.spec.ts
create mode 100644 examples/docs/resources/pc/demo/currency/disable-currency.spec.ts
create mode 100644 examples/docs/resources/pc/demo/currency/size.spec.ts
create mode 100644 examples/docs/resources/pc/demo/dept/custom-service.spec.ts
create mode 100644 examples/docs/resources/pc/demo/detail-page/basic-usage.spec.ts
create mode 100644 examples/docs/resources/pc/demo/detail-page/custom-show-text.spec.ts
create mode 100644 examples/docs/resources/pc/demo/dialog-box/basic-usage.spec.ts
create mode 100644 examples/docs/resources/pc/demo/dialog-box/center.spec.ts
create mode 100644 examples/docs/resources/pc/demo/dialog-box/close-on-click-modal.spec.ts
create mode 100644 examples/docs/resources/pc/demo/dialog-box/close-on-press-escape.spec.ts
create mode 100644 examples/docs/resources/pc/demo/dialog-box/custom-dialog-content.spec.ts
create mode 100644 examples/docs/resources/pc/demo/dialog-box/custom-dialog-footer.spec.ts
create mode 100644 examples/docs/resources/pc/demo/dialog-box/custom-dialog-title.spec.ts
create mode 100644 examples/docs/resources/pc/demo/dialog-box/dialog-top-height.spec.ts
create mode 100644 examples/docs/resources/pc/demo/dialog-box/dialog-width.spec.ts
create mode 100644 examples/docs/resources/pc/demo/dialog-box/draggable.spec.ts
create mode 100644 examples/docs/resources/pc/demo/dialog-box/form-in-dialog.spec.ts
create mode 100644 examples/docs/resources/pc/demo/dialog-box/fullscreen.spec.ts
create mode 100644 examples/docs/resources/pc/demo/dialog-box/hidden-close-buttons.spec.ts
create mode 100644 examples/docs/resources/pc/demo/dialog-box/hidden-header.spec.ts
create mode 100644 examples/docs/resources/pc/demo/dialog-box/lock-scroll.spec.ts
create mode 100644 examples/docs/resources/pc/demo/dialog-box/no-modal.spec.ts
create mode 100644 examples/docs/resources/pc/demo/dialog-box/open-close-events.spec.ts
create mode 100644 examples/docs/resources/pc/demo/dialog-box/right-dialog.spec.ts
create mode 100644 examples/docs/resources/pc/demo/dialog-box/secondary-dialog.spec.ts
create mode 100644 examples/docs/resources/pc/demo/drop-roles/custom-service.spec.ts
create mode 100644 examples/docs/resources/pc/demo/drop-times/basic-usage.spec.ts
create mode 100644 examples/docs/resources/pc/demo/drop-times/size.spec.ts
create mode 100644 examples/docs/resources/pc/demo/drop-times/start-end-step.spec.ts
create mode 100644 examples/docs/resources/pc/demo/dropdown/basic-usage.spec.ts
create mode 100644 examples/docs/resources/pc/demo/dropdown/disabled.spec.ts
create mode 100644 examples/docs/resources/pc/demo/dropdown/events.spec.ts
create mode 100644 examples/docs/resources/pc/demo/dropdown/hide-on-click.spec.ts
create mode 100644 examples/docs/resources/pc/demo/dropdown/multi-level.spec.ts
create mode 100644 examples/docs/resources/pc/demo/dropdown/options.spec.ts
create mode 100644 examples/docs/resources/pc/demo/dropdown/size.spec.ts
create mode 100644 examples/docs/resources/pc/demo/dropdown/slot-default.spec.ts
create mode 100644 examples/docs/resources/pc/demo/dropdown/split-button.spec.ts
create mode 100644 examples/docs/resources/pc/demo/dropdown/title.spec.ts
create mode 100644 examples/docs/resources/pc/demo/dropdown/trigger.spec.ts
create mode 100644 examples/docs/resources/pc/demo/espace/data.spec.ts
create mode 100644 examples/docs/resources/pc/demo/fall-menu/custom-menuitem.spec.ts
create mode 100644 examples/docs/resources/pc/demo/fall-menu/custom-slider-icon.spec.ts
create mode 100644 examples/docs/resources/pc/demo/fall-menu/data-resource.spec.ts
create mode 100644 examples/docs/resources/pc/demo/file-upload/abort-quest.spec.ts
create mode 100644 examples/docs/resources/pc/demo/file-upload/accept-file-image.spec.ts
create mode 100644 examples/docs/resources/pc/demo/file-upload/basic-usage.spec.ts
create mode 100644 examples/docs/resources/pc/demo/file-upload/clear-files.spec.ts
create mode 100644 examples/docs/resources/pc/demo/file-upload/custom-prefix.spec.ts
create mode 100644 examples/docs/resources/pc/demo/file-upload/custom-trigger.spec.ts
create mode 100644 examples/docs/resources/pc/demo/file-upload/custom-upload-request.spec.ts
create mode 100644 examples/docs/resources/pc/demo/file-upload/custom-upload-tip.spec.ts
create mode 100644 examples/docs/resources/pc/demo/file-upload/drag-select-file.spec.ts
create mode 100644 examples/docs/resources/pc/demo/file-upload/drag-upload.spec.ts
create mode 100644 examples/docs/resources/pc/demo/file-upload/file-picture-card.spec.ts
create mode 100644 examples/docs/resources/pc/demo/file-upload/http-request.spec.ts
create mode 100644 examples/docs/resources/pc/demo/file-upload/image-size.spec.ts
create mode 100644 examples/docs/resources/pc/demo/file-upload/manual-upload.spec.ts
create mode 100644 examples/docs/resources/pc/demo/file-upload/max-file-count.spec.ts
create mode 100644 examples/docs/resources/pc/demo/file-upload/mini-mode.spec.ts
create mode 100644 examples/docs/resources/pc/demo/file-upload/multiple-file.spec.ts
create mode 100644 examples/docs/resources/pc/demo/file-upload/picture-card.spec.ts
create mode 100644 examples/docs/resources/pc/demo/file-upload/picture-list.spec.ts
create mode 100644 examples/docs/resources/pc/demo/file-upload/prevent-delete-file.spec.ts
create mode 100644 examples/docs/resources/pc/demo/file-upload/prevent-upload-file.spec.ts
create mode 100644 examples/docs/resources/pc/demo/file-upload/size.spec.ts
create mode 100644 examples/docs/resources/pc/demo/file-upload/upload-events.spec.ts
create mode 100644 examples/docs/resources/pc/demo/file-upload/upload-file-list-thumb.spec.ts
create mode 100644 examples/docs/resources/pc/demo/file-upload/upload-file-list.spec.ts
create mode 100644 examples/docs/resources/pc/demo/file-upload/upload-limit.spec.ts
create mode 100644 examples/docs/resources/pc/demo/file-upload/upload-request.spec.ts
create mode 100644 examples/docs/resources/pc/demo/file-upload/upload-user-head.spec.ts
create mode 100644 examples/docs/resources/pc/demo/file-upload/测试.jpg
create mode 100644 examples/docs/resources/pc/demo/file-upload/测试.png
create mode 100644 examples/docs/resources/pc/demo/file-upload/测试.svg
create mode 100644 examples/docs/resources/pc/demo/floatbar/base.spec.ts
create mode 100644 examples/docs/resources/pc/demo/floatbar/custom-floatbar-item.spec.ts
create mode 100644 examples/docs/resources/pc/demo/floatbar/custom-style.spec.ts
create mode 100644 examples/docs/resources/pc/demo/floatbar/operation-floatbar-item.spec.ts
create mode 100644 examples/docs/resources/pc/demo/form/custom-validation-rule.spec.js
create mode 100644 examples/docs/resources/pc/demo/form/form-clear-validate.spec.js
create mode 100644 examples/docs/resources/pc/demo/form/form-disabled.spec.js
create mode 100644 examples/docs/resources/pc/demo/form/form-in-row.spec.js
create mode 100644 examples/docs/resources/pc/demo/form/form-row-col.spec.js
create mode 100644 examples/docs/resources/pc/demo/form/form-validation.spec.js
create mode 100644 examples/docs/resources/pc/demo/form/frequently-used-form.spec.js
create mode 100644 examples/docs/resources/pc/demo/form/group-form.spec.js
create mode 100644 examples/docs/resources/pc/demo/form/label-align.spec.js
create mode 100644 examples/docs/resources/pc/demo/form/no-validate-to-add.spec.js
create mode 100644 examples/docs/resources/pc/demo/form/novalid-tip.spec.js
create mode 100644 examples/docs/resources/pc/demo/form/size.spec.js
create mode 100644 examples/docs/resources/pc/demo/form/slot-label.spec.js
create mode 100644 examples/docs/resources/pc/demo/form/validate-type.spec.js
create mode 100644 examples/docs/resources/pc/demo/form/validation-position.spec.js
create mode 100644 examples/docs/resources/pc/demo/fullscreen/example-api.spec.ts
create mode 100644 examples/docs/resources/pc/demo/fullscreen/example-component.spec.ts
create mode 100644 examples/docs/resources/pc/demo/grid/align/column-align.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/align/footer-align/center-footer-align.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/align/footer-align/left-footer-align.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/align/footer-align/right-footer-align.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/align/grid-align/center-grid-align.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/align/grid-align/left-grid-align.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/align/grid-align/right-grid-align.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/align/header-align/center-header-align.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/align/header-align/left-header-align.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/align/header-align/right-header-align.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/basicUsage-conf.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/basicUsage.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/column/class-name.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/custom-style/cell-style.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/custom-style/footer-style/footer-cell-style.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/custom-style/footer-style/footer-row-style.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/custom-style/header-style/header-cell-style.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/custom-style/header-style/header-row-style.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/custom-style/row-style.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/disable-radio.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/disable-selection.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/drag/column-drag.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/drag/row-drag-ctrl.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/drag/row-drag.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/edit/hasRowChange.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/edit/mutil-render.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/edit/revertData.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/fixed/left-fixed.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/fixed/multi-column-fixed.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/fixed/right-fixed.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/footer/footer-class-name.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/footer/footer-row-or-column-span.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/footer/footer-summation-empty.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/footer/footer-summation.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/grid_Example/gridEdit/custom-editor-select.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/grid_Example/gridEdit/custom-editor.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/grid_Example/gridEdit/inner-editor.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/grid_Example/gridEdit/popeditor-in-grid-remote-search.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/grid_Example/gridEdit/popeditor-in-grid.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/grid_Example/gridRenderer/custom-renderer.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/grid_Example/gridRenderer/inner-renderer.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/grid_Example/shortcutMenu/cell-menu.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/grid_Example/shortcutMenu/footer-menu.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/grid_Example/shortcutMenu/header-menu.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/grid_Example/shortcutMenu/menu-permissions.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/header/custom-grid-header.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/header/header-class-name.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/header/hide-grid-header.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/header/slot-header.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/highlight/highlight-cell.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/highlight/highlight-current-column.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/highlight/highlight-current-row.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/highlight/highlight-hover-column.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/highlight/highlight-hover-row.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/large-data/load-column.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/large-data/scroll-to.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/methods/set-active-cell.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/methods/set-all-selection.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/methods/set-current-row.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/methods/set-selection.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/methods/sort.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/methods/toggle-all-selection.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/methods/toggle-row-selection.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/news/async-colunm-render.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/news/auto-height.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/news/editor-events.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/pager/inner-default-pager.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/pager/inner-pager.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/pager/showSaveMsg.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/recalculate.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/row-grouping.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/rowGroupRender.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/sort/combinations-sort.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/sort/custom-sort.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/sort/default-sort.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/sort/server-sort.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/span/column-span.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/span/row-span/row-span-easy.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/span/row-span/row-span.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/stripe/stripe.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/summary/configuration-summary.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/summary/custom-summary.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/adaptive-column-width.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/adaptive-grid-off-width-height.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/adaptive-un-column-width.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/auto-load.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/cell-editing.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/clearData.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/clearRadioRow.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/clearSelection.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/column-asyn-rendering.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/column-min-width.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/column-width.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/columns.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/copy-row-data.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/custom-editing.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/custom-operation-column.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/custom-serial-column.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/custom-toolbar.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/default-serial-column.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/editor-is-salid-always.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/empty-data-default-tip.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/empty-data-tip.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/fixed-column-width.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/fixed-grid-height.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/format-value.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/full-data-loading.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/grid-border.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/grid-full-screen-height.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/grid-full-screen.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/grid-large-tree-data.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/grid-loading-off-tip.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/grid-loading-tip.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/grid-size-mini.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/grid-size-small.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/grid-size.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/insert-delete-update.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/max-min-grid-height.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/min-grid-height.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/min-width.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/radio-config.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/refresh-grid.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/request-service.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/resize-column-width.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/row-editing.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/row-id.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/save-data.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/scroll-paging.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/start-index.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/static-data.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/status-of-editing.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/status-of-noediting.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/trigger-mode-db-editing.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/trigger-mode-for-editing.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/trigger-mode-hm-editing.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tiny-first-menu/virtual-rolling.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tip/cell-tip.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/tip/column-header-tip.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/toolbar/cancel-delete.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/toolbar/insert-remove-rows.spec.js
create mode 100644 examples/docs/resources/pc/demo/grid/toolbar/toolbar-op-config.spec.js
create mode 100644 examples/docs/resources/pc/demo/hrapprover/basic-usage.spec.ts
create mode 100644 examples/docs/resources/pc/demo/hrapprover/category-type.spec.ts
create mode 100644 examples/docs/resources/pc/demo/hrapprover/custom-service.spec.ts
create mode 100644 examples/docs/resources/pc/demo/hrapprover/disabled.spec.ts
create mode 100644 examples/docs/resources/pc/demo/image/auto-fit-container-size.spec.ts
create mode 100644 examples/docs/resources/pc/demo/image/basic-usage.spec.ts
create mode 100644 examples/docs/resources/pc/demo/image/custom-load-failed-text.spec.ts
create mode 100644 examples/docs/resources/pc/demo/image/custom-placeholder.spec.ts
create mode 100644 examples/docs/resources/pc/demo/image/lazy-load.spec.ts
create mode 100644 examples/docs/resources/pc/demo/image/load-error.spec.ts
create mode 100644 examples/docs/resources/pc/demo/image/load-event.spec.ts
create mode 100644 examples/docs/resources/pc/demo/image/preview-in-dialog.spec.ts
create mode 100644 examples/docs/resources/pc/demo/image/preview-src-list.spec.ts
create mode 100644 examples/docs/resources/pc/demo/image/preview-z-index.spec.ts
create mode 100644 examples/docs/resources/pc/demo/input/autocomplete.spec.ts
create mode 100644 examples/docs/resources/pc/demo/input/autofocus.spec.ts
create mode 100644 examples/docs/resources/pc/demo/input/autosize.spec.ts
create mode 100644 examples/docs/resources/pc/demo/input/basic-usage.spec.ts
create mode 100644 examples/docs/resources/pc/demo/input/clearable.spec.ts
create mode 100644 examples/docs/resources/pc/demo/input/cols.spec.ts
create mode 100644 examples/docs/resources/pc/demo/input/counter.spec.ts
create mode 100644 examples/docs/resources/pc/demo/input/event-blur.spec.ts
create mode 100644 examples/docs/resources/pc/demo/input/event-change.spec.ts
create mode 100644 examples/docs/resources/pc/demo/input/event-clear.spec.ts
create mode 100644 examples/docs/resources/pc/demo/input/event-focus.spec.ts
create mode 100644 examples/docs/resources/pc/demo/input/form.spec.ts
create mode 100644 examples/docs/resources/pc/demo/input/label.spec.ts
create mode 100644 examples/docs/resources/pc/demo/input/max.spec.ts
create mode 100644 examples/docs/resources/pc/demo/input/maxlength.spec.ts
create mode 100644 examples/docs/resources/pc/demo/input/method-addMemory.spec.ts
create mode 100644 examples/docs/resources/pc/demo/input/method-blur.spec.ts
create mode 100644 examples/docs/resources/pc/demo/input/method-focus.spec.ts
create mode 100644 examples/docs/resources/pc/demo/input/method-select.spec.ts
create mode 100644 examples/docs/resources/pc/demo/input/min.spec.ts
create mode 100644 examples/docs/resources/pc/demo/input/name.spec.ts
create mode 100644 examples/docs/resources/pc/demo/input/prefix-icon.spec.ts
create mode 100644 examples/docs/resources/pc/demo/input/resize.spec.ts
create mode 100644 examples/docs/resources/pc/demo/input/rows.spec.ts
create mode 100644 examples/docs/resources/pc/demo/input/show-password.spec.ts
create mode 100644 examples/docs/resources/pc/demo/input/show-word-limit.spec.ts
create mode 100644 examples/docs/resources/pc/demo/input/size.spec.ts
create mode 100644 examples/docs/resources/pc/demo/input/slot-append.spec.ts
create mode 100644 examples/docs/resources/pc/demo/input/slot-prefix.spec.ts
create mode 100644 examples/docs/resources/pc/demo/input/slot-prepend.spec.ts
create mode 100644 examples/docs/resources/pc/demo/input/slot-suffix.spec.ts
create mode 100644 examples/docs/resources/pc/demo/input/step.spec.ts
create mode 100644 examples/docs/resources/pc/demo/input/suffix-icon.spec.ts
create mode 100644 examples/docs/resources/pc/demo/input/tabindex.spec.ts
create mode 100644 examples/docs/resources/pc/demo/input/type.spec.ts
create mode 100644 examples/docs/resources/pc/demo/input/validate-event.spec.ts
create mode 100644 examples/docs/resources/pc/demo/ip-address/blur.spec.ts
create mode 100644 examples/docs/resources/pc/demo/ip-address/change.spec.ts
create mode 100644 examples/docs/resources/pc/demo/ip-address/delimiter.spec.ts
create mode 100644 examples/docs/resources/pc/demo/ip-address/disabled.spec.ts
create mode 100644 examples/docs/resources/pc/demo/ip-address/focus.spec.ts
create mode 100644 examples/docs/resources/pc/demo/ip-address/input.spec.ts
create mode 100644 examples/docs/resources/pc/demo/ip-address/ipv4-type.spec.ts
create mode 100644 examples/docs/resources/pc/demo/ip-address/ipv6-type.spec.ts
create mode 100644 examples/docs/resources/pc/demo/ip-address/readonly.spec.ts
create mode 100644 examples/docs/resources/pc/demo/ip-address/select.spec.ts
create mode 100644 examples/docs/resources/pc/demo/ip-address/size.spec.ts
create mode 100644 examples/docs/resources/pc/demo/ip-address/slots.spec.ts
create mode 100644 examples/docs/resources/pc/demo/layout/alignment.spec.ts
create mode 100644 examples/docs/resources/pc/demo/layout/basic-usage.spec.ts
create mode 100644 examples/docs/resources/pc/demo/layout/gutter.spec.ts
create mode 100644 examples/docs/resources/pc/demo/layout/offset.spec.ts
create mode 100644 examples/docs/resources/pc/demo/layout/order.spec.ts
create mode 100644 examples/docs/resources/pc/demo/layout/responsive-layout.spec.ts
create mode 100644 examples/docs/resources/pc/demo/link-menu/custom-foot.spec.ts
create mode 100644 examples/docs/resources/pc/demo/link-menu/custom-icon.spec.ts
create mode 100644 examples/docs/resources/pc/demo/link-menu/data-resource.spec.ts
create mode 100644 examples/docs/resources/pc/demo/link-menu/get-menu-data-sync.spec.ts
create mode 100644 examples/docs/resources/pc/demo/link-menu/menu-items.spec.ts
create mode 100644 examples/docs/resources/pc/demo/link/basic-usage.spec.ts
create mode 100644 examples/docs/resources/pc/demo/link/config-href.spec.ts
create mode 100644 examples/docs/resources/pc/demo/link/custom-icon.spec.ts
create mode 100644 examples/docs/resources/pc/demo/link/dynamic-disable.spec.ts
create mode 100644 examples/docs/resources/pc/demo/link/focus-no-underline.spec.ts
create mode 100644 examples/docs/resources/pc/demo/link/link-style.spec.ts
create mode 100644 examples/docs/resources/pc/demo/loading/background.spec.ts
create mode 100644 examples/docs/resources/pc/demo/loading/basic-usage.spec.ts
create mode 100644 examples/docs/resources/pc/demo/loading/body.spec.ts
create mode 100644 examples/docs/resources/pc/demo/loading/custom-class.spec.ts
create mode 100644 examples/docs/resources/pc/demo/loading/fullscreen.spec.ts
create mode 100644 examples/docs/resources/pc/demo/loading/loading-tip-text.spec.ts
create mode 100644 examples/docs/resources/pc/demo/loading/size.spec.ts
create mode 100644 examples/docs/resources/pc/demo/loading/spinner.spec.ts
create mode 100644 examples/docs/resources/pc/demo/loading/target.spec.ts
create mode 100644 examples/docs/resources/pc/demo/milestone/basic-usage.spec.ts
create mode 100644 examples/docs/resources/pc/demo/milestone/custom-bottom.spec.ts
create mode 100644 examples/docs/resources/pc/demo/milestone/custom-flag.spec.ts
create mode 100644 examples/docs/resources/pc/demo/milestone/custom-icon-slot.spec.ts
create mode 100644 examples/docs/resources/pc/demo/milestone/custom-top.spec.ts
create mode 100644 examples/docs/resources/pc/demo/milestone/data-field-mapping.spec.ts
create mode 100644 examples/docs/resources/pc/demo/milestone/data-source.spec.ts
create mode 100644 examples/docs/resources/pc/demo/milestone/flag-before.spec.ts
create mode 100644 examples/docs/resources/pc/demo/milestone/line-style.spec.ts
create mode 100644 examples/docs/resources/pc/demo/milestone/milestone-events.spec.ts
create mode 100644 examples/docs/resources/pc/demo/milestone/milestone-space.spec.ts
create mode 100644 examples/docs/resources/pc/demo/milestone/milestones-status.spec.ts
create mode 100644 examples/docs/resources/pc/demo/milestone/show-number.spec.ts
create mode 100644 examples/docs/resources/pc/demo/milestone/solid-style.spec.ts
create mode 100644 examples/docs/resources/pc/demo/milestone/start-index.spec.ts
create mode 100644 examples/docs/resources/pc/demo/modal/base.spec.ts
create mode 100644 examples/docs/resources/pc/demo/modal/cancel-event.spec.ts
create mode 100644 examples/docs/resources/pc/demo/modal/close-event.spec.ts
create mode 100644 examples/docs/resources/pc/demo/modal/confirm-event.spec.ts
create mode 100644 examples/docs/resources/pc/demo/modal/duration.spec.ts
create mode 100644 examples/docs/resources/pc/demo/modal/esc-closable.spec.ts
create mode 100644 examples/docs/resources/pc/demo/modal/footer-slot.spec.ts
create mode 100644 examples/docs/resources/pc/demo/modal/fullscreen.spec.ts
create mode 100644 examples/docs/resources/pc/demo/modal/grid.spec.ts
create mode 100644 examples/docs/resources/pc/demo/modal/hide-event.spec.ts
create mode 100644 examples/docs/resources/pc/demo/modal/id.spec.ts
create mode 100644 examples/docs/resources/pc/demo/modal/is-form-reset.spec.ts
create mode 100644 examples/docs/resources/pc/demo/modal/lock-scroll.spec.ts
create mode 100644 examples/docs/resources/pc/demo/modal/lock-view.spec.ts
create mode 100644 examples/docs/resources/pc/demo/modal/mask-closable.spec.ts
create mode 100644 examples/docs/resources/pc/demo/modal/message.spec.ts
create mode 100644 examples/docs/resources/pc/demo/modal/min-height.spec.ts
create mode 100644 examples/docs/resources/pc/demo/modal/min-width.spec.ts
create mode 100644 examples/docs/resources/pc/demo/modal/resize.spec.ts
create mode 100644 examples/docs/resources/pc/demo/modal/show-event.spec.ts
create mode 100644 examples/docs/resources/pc/demo/modal/showFooter.spec.ts
create mode 100644 examples/docs/resources/pc/demo/modal/showHeader.spec.ts
create mode 100644 examples/docs/resources/pc/demo/modal/status.spec.ts
create mode 100644 examples/docs/resources/pc/demo/modal/title.spec.ts
create mode 100644 examples/docs/resources/pc/demo/modal/top.spec.ts
create mode 100644 examples/docs/resources/pc/demo/modal/type.spec.ts
create mode 100644 examples/docs/resources/pc/demo/modal/value.spec.ts
create mode 100644 examples/docs/resources/pc/demo/modal/zIndex.spec.ts
create mode 100644 examples/docs/resources/pc/demo/modal/zoom-event.spec.ts
create mode 100644 examples/docs/resources/pc/demo/nav-menu/basic-usage.spec.ts
create mode 100644 examples/docs/resources/pc/demo/nav-menu/before-skip-prevent.spec.ts
create mode 100644 examples/docs/resources/pc/demo/nav-menu/before-skip.spec.ts
create mode 100644 examples/docs/resources/pc/demo/nav-menu/custom-service.spec.ts
create mode 100644 examples/docs/resources/pc/demo/nav-menu/data-resource.spec.ts
create mode 100644 examples/docs/resources/pc/demo/nav-menu/overflow.spec.ts
create mode 100644 examples/docs/resources/pc/demo/nav-menu/slot-logo.spec.ts
create mode 100644 examples/docs/resources/pc/demo/nav-menu/slot-toolbar.spec.ts
create mode 100644 examples/docs/resources/pc/demo/notify/basic-usage.spec.ts
create mode 100644 examples/docs/resources/pc/demo/notify/beforeClose.spec.ts
create mode 100644 examples/docs/resources/pc/demo/notify/closeIcon.spec.ts
create mode 100644 examples/docs/resources/pc/demo/notify/debounceDelay.spec.ts
create mode 100644 examples/docs/resources/pc/demo/notify/duration.spec.ts
create mode 100644 examples/docs/resources/pc/demo/notify/message.spec.ts
create mode 100644 examples/docs/resources/pc/demo/notify/onClose.spec.ts
create mode 100644 examples/docs/resources/pc/demo/notify/position.spec.ts
create mode 100644 examples/docs/resources/pc/demo/notify/showClose.spec.ts
create mode 100644 examples/docs/resources/pc/demo/notify/showIcon.spec.ts
create mode 100644 examples/docs/resources/pc/demo/notify/statusIcon.spec.ts
create mode 100644 examples/docs/resources/pc/demo/notify/title.spec.ts
create mode 100644 examples/docs/resources/pc/demo/notify/type.spec.ts
create mode 100644 examples/docs/resources/pc/demo/notify/verticalOffset.spec.ts
create mode 100644 examples/docs/resources/pc/demo/numeric/about-step.spec.ts
create mode 100644 examples/docs/resources/pc/demo/numeric/allow-empty.spec.ts
create mode 100644 examples/docs/resources/pc/demo/numeric/basic-usage.spec.ts
create mode 100644 examples/docs/resources/pc/demo/numeric/blur-event.spec.ts
create mode 100644 examples/docs/resources/pc/demo/numeric/calculate-according-to-num-of-goods.spec.ts
create mode 100644 examples/docs/resources/pc/demo/numeric/change-event.spec.ts
create mode 100644 examples/docs/resources/pc/demo/numeric/controls-position.spec.ts
create mode 100644 examples/docs/resources/pc/demo/numeric/controls.spec.ts
create mode 100644 examples/docs/resources/pc/demo/numeric/dynamic-disabled.spec.ts
create mode 100644 examples/docs/resources/pc/demo/numeric/focus-event.spec.ts
create mode 100644 examples/docs/resources/pc/demo/numeric/max-min.spec.ts
create mode 100644 examples/docs/resources/pc/demo/numeric/mouse-wheel.spec.ts
create mode 100644 examples/docs/resources/pc/demo/numeric/numeric-size.spec.ts
create mode 100644 examples/docs/resources/pc/demo/numeric/precision.spec.ts
create mode 100644 examples/docs/resources/pc/demo/pager/pager-disabled.spec.js
create mode 100644 examples/docs/resources/pc/demo/pager/pager-size.spec.js
create mode 100644 examples/docs/resources/pc/demo/pop-upload/basic-usage.spec.ts
create mode 100644 examples/docs/resources/pc/demo/pop-upload/before-upload.spec.ts
create mode 100644 examples/docs/resources/pc/demo/pop-upload/custom-request-headers.spec.ts
create mode 100644 examples/docs/resources/pc/demo/pop-upload/data.spec.ts
create mode 100644 examples/docs/resources/pc/demo/pop-upload/file-limit.spec.ts
create mode 100644 examples/docs/resources/pc/demo/pop-upload/file-type.spec.ts
create mode 100644 examples/docs/resources/pc/demo/pop-upload/fill-button-text.spec.ts
create mode 100644 examples/docs/resources/pc/demo/pop-upload/http-request.spec.ts
create mode 100644 examples/docs/resources/pc/demo/pop-upload/max-upload-file-size.spec.ts
create mode 100644 examples/docs/resources/pc/demo/pop-upload/prevent-delete-file.spec.ts
create mode 100644 examples/docs/resources/pc/demo/pop-upload/size.spec.ts
create mode 100644 examples/docs/resources/pc/demo/pop-upload/upload-name.spec.ts
create mode 100644 examples/docs/resources/pc/demo/pop-upload/测试.jpg
create mode 100644 examples/docs/resources/pc/demo/pop-upload/测试.png
create mode 100644 examples/docs/resources/pc/demo/pop-upload/测试.svg
create mode 100644 examples/docs/resources/pc/demo/popover/arrow-offset.spec.js
create mode 100644 examples/docs/resources/pc/demo/popover/basic-usage.spec.js
create mode 100644 examples/docs/resources/pc/demo/popover/close-delay.spec.js
create mode 100644 examples/docs/resources/pc/demo/popover/custom-tip-text.spec.js
create mode 100644 examples/docs/resources/pc/demo/popover/custom-transition.spec.js
create mode 100644 examples/docs/resources/pc/demo/popover/dynamic-disable.spec.js
create mode 100644 examples/docs/resources/pc/demo/popover/frame-offset.spec.js
create mode 100644 examples/docs/resources/pc/demo/popover/hidden-arrow.spec.js
create mode 100644 examples/docs/resources/pc/demo/popover/open-delay.spec.js
create mode 100644 examples/docs/resources/pc/demo/popover/popover-content.spec.js
create mode 100644 examples/docs/resources/pc/demo/popover/popover-events.spec.js
create mode 100644 examples/docs/resources/pc/demo/popover/popover-placement.spec.js
create mode 100644 examples/docs/resources/pc/demo/popover/popover-width.spec.js
create mode 100644 examples/docs/resources/pc/demo/popover/popper-class.spec.js
create mode 100644 examples/docs/resources/pc/demo/popover/popper-options.spec.js
create mode 100644 examples/docs/resources/pc/demo/popover/trigger-mode.spec.js
create mode 100644 examples/docs/resources/pc/demo/popover/trigger-reference.spec.js
create mode 100644 examples/docs/resources/pc/demo/progress/basic-usage.spec.ts
create mode 100644 examples/docs/resources/pc/demo/progress/custom-color.spec.ts
create mode 100644 examples/docs/resources/pc/demo/progress/dynamic-control-changes.spec.ts
create mode 100644 examples/docs/resources/pc/demo/progress/format-text.spec.ts
create mode 100644 examples/docs/resources/pc/demo/progress/progress-status.spec.ts
create mode 100644 examples/docs/resources/pc/demo/progress/progress-type-circle.spec.ts
create mode 100644 examples/docs/resources/pc/demo/progress/progress-type-dashboard.spec.ts
create mode 100644 examples/docs/resources/pc/demo/progress/progress-type.spec.ts
create mode 100644 examples/docs/resources/pc/demo/progress/progress-width.spec.ts
create mode 100644 examples/docs/resources/pc/demo/progress/text-inside-or-no-text.spec.ts
create mode 100644 examples/docs/resources/pc/demo/radio/active-color.spec.ts
create mode 100644 examples/docs/resources/pc/demo/radio/basic-usage.spec.ts
create mode 100644 examples/docs/resources/pc/demo/radio/dynamic-disable.spec.ts
create mode 100644 examples/docs/resources/pc/demo/radio/group-options.spec.ts
create mode 100644 examples/docs/resources/pc/demo/radio/radio-button.spec.ts
create mode 100644 examples/docs/resources/pc/demo/radio/radio-default.spec.ts
create mode 100644 examples/docs/resources/pc/demo/radio/radio-events.spec.ts
create mode 100644 examples/docs/resources/pc/demo/radio/radio-size.spec.ts
create mode 100644 examples/docs/resources/pc/demo/radio/radio-text.spec.ts
create mode 100644 examples/docs/resources/pc/demo/radio/radio-value.spec.ts
create mode 100644 examples/docs/resources/pc/demo/radio/vertical.spec.ts
create mode 100644 examples/docs/resources/pc/demo/radio/with-border.spec.ts
create mode 100644 examples/docs/resources/pc/demo/rate/allow-half.spec.js
create mode 100644 examples/docs/resources/pc/demo/rate/basic-usage.spec.js
create mode 100644 examples/docs/resources/pc/demo/rate/custom-3-threshold-colors.spec.js
create mode 100644 examples/docs/resources/pc/demo/rate/custom-3-threshold-icon.spec.js
create mode 100644 examples/docs/resources/pc/demo/rate/disabled-not-selected-class.spec.js
create mode 100644 examples/docs/resources/pc/demo/rate/disabled-not-selected-color.spec.js
create mode 100644 examples/docs/resources/pc/demo/rate/dynamic-disable.spec.js
create mode 100644 examples/docs/resources/pc/demo/rate/max-score.spec.js
create mode 100644 examples/docs/resources/pc/demo/rate/not-selected-class.spec.js
create mode 100644 examples/docs/resources/pc/demo/rate/not-selected-color.spec.js
create mode 100644 examples/docs/resources/pc/demo/rate/radio-rate.spec.js
create mode 100644 examples/docs/resources/pc/demo/rate/rate-events.spec.js
create mode 100644 examples/docs/resources/pc/demo/rate/show-score.spec.js
create mode 100644 examples/docs/resources/pc/demo/rate/size-and-space.spec.js
create mode 100644 examples/docs/resources/pc/demo/rate/text-on-bottom.spec.js
create mode 100644 examples/docs/resources/pc/demo/rate/texts-and-text-color.spec.js
create mode 100644 examples/docs/resources/pc/demo/rate/threshold-value.spec.js
create mode 100644 examples/docs/resources/pc/demo/scroll-text/basic-usage.spec.ts
create mode 100644 examples/docs/resources/pc/demo/scroll-text/custom-scroll-text.spec.ts
create mode 100644 examples/docs/resources/pc/demo/scroll-text/custom-text-style.spec.ts
create mode 100644 examples/docs/resources/pc/demo/scroll-text/hover-stop.spec.ts
create mode 100644 examples/docs/resources/pc/demo/scroll-text/scroll-direction.spec.ts
create mode 100644 examples/docs/resources/pc/demo/scroll-text/scroll-time.spec.ts
create mode 100644 examples/docs/resources/pc/demo/scroll-text/slots.spec.ts
create mode 100644 examples/docs/resources/pc/demo/search/basic-usage.spec.ts
create mode 100644 examples/docs/resources/pc/demo/search/change-events.spec.ts
create mode 100644 examples/docs/resources/pc/demo/search/clearable.spec.ts
create mode 100644 examples/docs/resources/pc/demo/search/custom-search-types.spec.ts
create mode 100644 examples/docs/resources/pc/demo/search/default-value.spec.ts
create mode 100644 examples/docs/resources/pc/demo/search/mini-mode.spec.ts
create mode 100644 examples/docs/resources/pc/demo/search/search-events.spec.ts
create mode 100644 examples/docs/resources/pc/demo/search/search-types.spec.ts
create mode 100644 examples/docs/resources/pc/demo/search/select-events.spec.ts
create mode 100644 examples/docs/resources/pc/demo/search/show-selected-types.spec.ts
create mode 100644 examples/docs/resources/pc/demo/search/slot-prefix.spec.ts
create mode 100644 examples/docs/resources/pc/demo/search/transparent-mode.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/allow-create.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/automatic-dropdown.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/basic-usage.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/binding-obj.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/cache-usage.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/clearable.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/collapse-tags.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/custom-options.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/custom-prefix.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/custom-reference-slot.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/disable-grid-select-radio.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/disabled-and-selected-options.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/disabled-options.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/disabled.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/envts-change.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/envts-remove.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/filter-method.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/focus-remote-method.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/hide-select-input-border.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/input-box-type.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/is-drop-inherit-width.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/manual-focus-blur.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/memoize-usage.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/multiple-limit.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/multiple.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/name.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/nest-checkbox-grid-clearable.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/nest-checkbox-grid.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/nest-checkbox-tree.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/nest-filterable-tree.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/nest-grid-remote-filter.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/nest-radio-grid-much-data.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/nest-radio-grid.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/nest-radio-tree.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/nest-remote-grid.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/no-data-text.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/no-match-text.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/optimization.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/option-group-disable.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/option-group.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/popup-style-position.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/remote-method.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/remote-search-allow-copy.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/search-allow-copy.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/searchable.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/set-input-value.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/show-alloption.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/show-tip.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/size-medium.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/size-mini.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/size-small.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/slot-default.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/slot-empty.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/slot-footer.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/tag-copy-all.spec.ts
create mode 100644 examples/docs/resources/pc/demo/select/tag-select.spec.ts
create mode 100644 examples/docs/resources/pc/demo/slide-bar/basic-usage.spec.ts
create mode 100644 examples/docs/resources/pc/demo/slide-bar/custom-content.spec.ts
create mode 100644 examples/docs/resources/pc/demo/slide-bar/custom-tag.spec.ts
create mode 100644 examples/docs/resources/pc/demo/slide-bar/slide-bar-events.spec.ts
create mode 100644 examples/docs/resources/pc/demo/slide-bar/wheel-blocks.spec.ts
create mode 100644 examples/docs/resources/pc/demo/slider/about-step.spec.ts
create mode 100644 examples/docs/resources/pc/demo/slider/basic-usage.spec.ts
create mode 100644 examples/docs/resources/pc/demo/slider/dynamic-disable.spec.ts
create mode 100644 examples/docs/resources/pc/demo/slider/format-tooltip.spec.ts
create mode 100644 examples/docs/resources/pc/demo/slider/max-min.spec.ts
create mode 100644 examples/docs/resources/pc/demo/slider/range-select.spec.ts
create mode 100644 examples/docs/resources/pc/demo/slider/shortcut-operation.spec.ts
create mode 100644 examples/docs/resources/pc/demo/slider/show-iput.spec.ts
create mode 100644 examples/docs/resources/pc/demo/slider/show-tip.spec.ts
create mode 100644 examples/docs/resources/pc/demo/slider/slider-event-change.spec.ts
create mode 100644 examples/docs/resources/pc/demo/slider/slider-event-start.spec.ts
create mode 100644 examples/docs/resources/pc/demo/slider/slider-event-stop.spec.ts
create mode 100644 examples/docs/resources/pc/demo/slider/slider-slot.spec.ts
create mode 100644 examples/docs/resources/pc/demo/slider/vertical-mode.spec.ts
create mode 100644 examples/docs/resources/pc/demo/split/basic-usage.spec.ts
create mode 100644 examples/docs/resources/pc/demo/split/basic-usage1.spec.ts
create mode 100644 examples/docs/resources/pc/demo/split/left-right.spec.ts
create mode 100644 examples/docs/resources/pc/demo/split/moveend-event.spec.ts
create mode 100644 examples/docs/resources/pc/demo/split/movestart-event.spec.ts
create mode 100644 examples/docs/resources/pc/demo/split/moving-event.spec.ts
create mode 100644 examples/docs/resources/pc/demo/split/nested-use.spec.ts
create mode 100644 examples/docs/resources/pc/demo/split/split-mode.spec.ts
create mode 100644 examples/docs/resources/pc/demo/split/split-threshold.spec.ts
create mode 100644 examples/docs/resources/pc/demo/split/top-bottom-solt.spec.ts
create mode 100644 examples/docs/resources/pc/demo/split/trigger-slot.spec.ts
create mode 100644 examples/docs/resources/pc/demo/steps/advanced-steps.spec.ts
create mode 100644 examples/docs/resources/pc/demo/steps/click.spec.ts
create mode 100644 examples/docs/resources/pc/demo/steps/custom-steps-item.spec.ts
create mode 100644 examples/docs/resources/pc/demo/steps/data-resource.spec.ts
create mode 100644 examples/docs/resources/pc/demo/steps/node-status.spec.ts
create mode 100644 examples/docs/resources/pc/demo/steps/normal-steps.spec.ts
create mode 100644 examples/docs/resources/pc/demo/steps/order-progress.spec.ts
create mode 100644 examples/docs/resources/pc/demo/steps/show-divider.spec.ts
create mode 100644 examples/docs/resources/pc/demo/steps/size.spec.ts
create mode 100644 examples/docs/resources/pc/demo/steps/slot-active-node-desc.spec.ts
create mode 100644 examples/docs/resources/pc/demo/steps/slot.spec.ts
create mode 100644 examples/docs/resources/pc/demo/steps/text-position.spec.ts
create mode 100644 examples/docs/resources/pc/demo/steps/timeline-steps.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tabs/basic-usage.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tabs/before-leave.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tabs/custom-more-icon.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tabs/custom-tab-title.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tabs/position-bottom.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tabs/position-left.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tabs/position-right.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tabs/position.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tabs/show-different-grid-data.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tabs/stretch-wh.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tabs/tab-style-bordercard.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tabs/tab-style-card.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tabs/tabdata-title.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tabs/tabs-draggable.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tabs/tabs-events-add.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tabs/tabs-events-click.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tabs/tabs-events-close.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tabs/tabs-events-edit.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tabs/tabs-second-layer.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tabs/with-add.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tag/basic-usage.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tag/closeable.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tag/color3.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tag/create.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tag/disabled.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tag/effect.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tag/hit.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tag/slot-default.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tag/tag-event-click.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tag/tag-event-close.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tag/tag-size.spec.ts
create mode 100644 examples/docs/resources/pc/demo/text-popup/basic-usage.spec.ts
create mode 100644 examples/docs/resources/pc/demo/text-popup/clear-value.spec.ts
create mode 100644 examples/docs/resources/pc/demo/text-popup/placeholder.spec.ts
create mode 100644 examples/docs/resources/pc/demo/text-popup/readonly.spec.ts
create mode 100644 examples/docs/resources/pc/demo/text-popup/separtor.spec.ts
create mode 100644 examples/docs/resources/pc/demo/text-popup/value.spec.ts
create mode 100644 examples/docs/resources/pc/demo/text-popup/width.spec.ts
create mode 100644 examples/docs/resources/pc/demo/time-line/basic-usage.spec.ts
create mode 100644 examples/docs/resources/pc/demo/time-line/custom-normal-step.spec.ts
create mode 100644 examples/docs/resources/pc/demo/time-line/custom-vertical-step.spec.ts
create mode 100644 examples/docs/resources/pc/demo/time-line/different-data.spec.ts
create mode 100644 examples/docs/resources/pc/demo/time-line/horizontal-step.spec.ts
create mode 100644 examples/docs/resources/pc/demo/time-line/set-start-value.spec.ts
create mode 100644 examples/docs/resources/pc/demo/time-line/set-step-width.spec.ts
create mode 100644 examples/docs/resources/pc/demo/time-line/show-number.spec.ts
create mode 100644 examples/docs/resources/pc/demo/time-line/show-status.spec.ts
create mode 100644 examples/docs/resources/pc/demo/time-line/vertical-step-reverse.spec.ts
create mode 100644 examples/docs/resources/pc/demo/time-line/vertical-step.spec.ts
create mode 100644 examples/docs/resources/pc/demo/time-picker/basic-usage.spec.ts
create mode 100644 examples/docs/resources/pc/demo/time-picker/clear-icon.spec.ts
create mode 100644 examples/docs/resources/pc/demo/time-picker/clearable.spec.ts
create mode 100644 examples/docs/resources/pc/demo/time-picker/date.spec.ts
create mode 100644 examples/docs/resources/pc/demo/time-picker/default-value.spec.ts
create mode 100644 examples/docs/resources/pc/demo/time-picker/disabled.spec.ts
create mode 100644 examples/docs/resources/pc/demo/time-picker/editable.spec.ts
create mode 100644 examples/docs/resources/pc/demo/time-picker/event-blur.spec.ts
create mode 100644 examples/docs/resources/pc/demo/time-picker/format.spec.ts
create mode 100644 examples/docs/resources/pc/demo/time-picker/is-range.spec.ts
create mode 100644 examples/docs/resources/pc/demo/time-picker/name.spec.ts
create mode 100644 examples/docs/resources/pc/demo/time-picker/picker-options.spec.ts
create mode 100644 examples/docs/resources/pc/demo/time-picker/popper-class.spec.ts
create mode 100644 examples/docs/resources/pc/demo/time-picker/size-medium.spec.ts
create mode 100644 examples/docs/resources/pc/demo/time-picker/size-mini.spec.ts
create mode 100644 examples/docs/resources/pc/demo/time-picker/size-small.spec.ts
create mode 100644 examples/docs/resources/pc/demo/time-picker/suffix-icon.spec.ts
create mode 100644 examples/docs/resources/pc/demo/time-picker/time-low.spec.ts
create mode 100644 examples/docs/resources/pc/demo/time-select/basic-usage.spec.ts
create mode 100644 examples/docs/resources/pc/demo/time-select/clear-icon.spec.ts
create mode 100644 examples/docs/resources/pc/demo/time-select/default-value.spec.ts
create mode 100644 examples/docs/resources/pc/demo/time-select/disabled.spec.ts
create mode 100644 examples/docs/resources/pc/demo/time-select/editable.spec.ts
create mode 100644 examples/docs/resources/pc/demo/time-select/event-blur.spec.ts
create mode 100644 examples/docs/resources/pc/demo/time-select/focus.spec.ts
create mode 100644 examples/docs/resources/pc/demo/time-select/picker-options.spec.ts
create mode 100644 examples/docs/resources/pc/demo/time-select/popper-class.spec.ts
create mode 100644 examples/docs/resources/pc/demo/time-select/range-placeholder.spec.ts
create mode 100644 examples/docs/resources/pc/demo/time-select/size-medium.spec.ts
create mode 100644 examples/docs/resources/pc/demo/time-select/size-mini.spec.ts
create mode 100644 examples/docs/resources/pc/demo/time-select/size-small.spec.ts
create mode 100644 examples/docs/resources/pc/demo/time-select/suffix-icon.spec.ts
create mode 100644 examples/docs/resources/pc/demo/toggle-menu/automatic-filtering.spec.ts
create mode 100644 examples/docs/resources/pc/demo/toggle-menu/basic-usage.spec.ts
create mode 100644 examples/docs/resources/pc/demo/toggle-menu/custom-icon.spec.ts
create mode 100644 examples/docs/resources/pc/demo/toggle-menu/default-expand-all.spec.ts
create mode 100644 examples/docs/resources/pc/demo/toggle-menu/drag-events.spec.ts
create mode 100644 examples/docs/resources/pc/demo/toggle-menu/draggable.spec.ts
create mode 100644 examples/docs/resources/pc/demo/toggle-menu/node-click.spec.ts
create mode 100644 examples/docs/resources/pc/demo/toggle-menu/node-collapse.spec.ts
create mode 100644 examples/docs/resources/pc/demo/toggle-menu/node-drop.spec.ts
create mode 100644 examples/docs/resources/pc/demo/toggle-menu/node-expand.spec.ts
create mode 100644 examples/docs/resources/pc/demo/toggle-menu/show-filter.spec.ts
create mode 100644 examples/docs/resources/pc/demo/toggle-menu/slot-node.spec.ts
create mode 100644 examples/docs/resources/pc/demo/toggle-menu/toggle-props.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tooltip/custom-transition.spec.js
create mode 100644 examples/docs/resources/pc/demo/tooltip/dynamic-disable.spec.js
create mode 100644 examples/docs/resources/pc/demo/tooltip/enterable.spec.js
create mode 100644 examples/docs/resources/pc/demo/tooltip/manual-control-tip.spec.js
create mode 100644 examples/docs/resources/pc/demo/tooltip/open-delay.spec.js
create mode 100644 examples/docs/resources/pc/demo/tooltip/popper-class.spec.js
create mode 100644 examples/docs/resources/pc/demo/tooltip/popper-options.spec.js
create mode 100644 examples/docs/resources/pc/demo/tooltip/tabindex.spec.js
create mode 100644 examples/docs/resources/pc/demo/tooltip/tooltip-content.spec.js
create mode 100644 examples/docs/resources/pc/demo/tooltip/tooltip-offset.spec.js
create mode 100644 examples/docs/resources/pc/demo/tooltip/tooltip-render-content.spec.js
create mode 100644 examples/docs/resources/pc/demo/tooltip/tooltip-theme.spec.js
create mode 100644 examples/docs/resources/pc/demo/tooltip/visible-arrow.spec.js
create mode 100644 examples/docs/resources/pc/demo/tooltip/visible-show.spec.js
create mode 100644 examples/docs/resources/pc/demo/transfer/basic-usage.spec.ts
create mode 100644 examples/docs/resources/pc/demo/transfer/checked-format-text.spec.ts
create mode 100644 examples/docs/resources/pc/demo/transfer/custom-button-texts.spec.ts
create mode 100644 examples/docs/resources/pc/demo/transfer/custom-filter-method.spec.ts
create mode 100644 examples/docs/resources/pc/demo/transfer/custom-footer.spec.ts
create mode 100644 examples/docs/resources/pc/demo/transfer/custom-render-content.spec.ts
create mode 100644 examples/docs/resources/pc/demo/transfer/custom-transfer-titles.spec.ts
create mode 100644 examples/docs/resources/pc/demo/transfer/data-source.spec.ts
create mode 100644 examples/docs/resources/pc/demo/transfer/default-checked.spec.ts
create mode 100644 examples/docs/resources/pc/demo/transfer/drop-config.spec.ts
create mode 100644 examples/docs/resources/pc/demo/transfer/filter-placeholder.spec.ts
create mode 100644 examples/docs/resources/pc/demo/transfer/filterable.spec.ts
create mode 100644 examples/docs/resources/pc/demo/transfer/manual-clear-query.spec.ts
create mode 100644 examples/docs/resources/pc/demo/transfer/nested-table.spec.ts
create mode 100644 examples/docs/resources/pc/demo/transfer/nested-tree.spec.ts
create mode 100644 examples/docs/resources/pc/demo/transfer/panel-slot.spec.ts
create mode 100644 examples/docs/resources/pc/demo/transfer/props-of-data-source.spec.ts
create mode 100644 examples/docs/resources/pc/demo/transfer/show-all-btn.spec.ts
create mode 100644 examples/docs/resources/pc/demo/transfer/target-order.spec.ts
create mode 100644 examples/docs/resources/pc/demo/transfer/transfer-events.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree-menu/accordion.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree-menu/basic-usage.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree-menu/can-draggable.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree-menu/check-strictly.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree-menu/data-resource.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree-menu/default-expand-all.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree-menu/default-expanded-keys.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree-menu/empty-text.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree-menu/event-allow-draggable.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree-menu/event-check-change.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree-menu/event-current-change.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree-menu/event-node-click.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree-menu/event-node-collapse.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree-menu/event-node-expand.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree-menu/expand-on-click-node.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree-menu/filter-node-method.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree-menu/get-menu-data-sync.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree-menu/lazy-load.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree-menu/search-icon.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree-menu/show-checkbox.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree-menu/text-ellipsis.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree-menu/text-wrap.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree-menu/tree-menu-indent.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree-menu/tree-menu-slot.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree/accordion-mode.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree/allow-drag.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree/allow-drop.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree/auto-expand-parent.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree/basic-usage.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree/check-on-click-node.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree/check-strictly.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree/contextmenu.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree/current-node-key.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree/custom-empty-text.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree/custom-node-icon.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree/data-source.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree/default-checked-keys.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree/default-expand-all.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree/default-expended-keys.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree/disable-node.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree/drag-events.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree/expand-on-click-node.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree/filter-node.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree/highlight-current.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree/indent.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree/lazy-load-node.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree/node-contextmenu.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree/node-draggable.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree/node-events.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree/node-key.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree/node-props-config.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree/render-after-expand.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree/render-content.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree/set-tree-icon.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree/show-checkbox.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree/single-select-radio.spec.ts
create mode 100644 examples/docs/resources/pc/demo/tree/slot-deffault.spec.ts
create mode 100644 examples/docs/resources/pc/demo/user-contact/basic-usage.spec.ts
create mode 100644 examples/docs/resources/pc/demo/user-contact/data-source.spec.ts
create mode 100644 examples/docs/resources/pc/demo/user-contact/not-displayed-content.spec.ts
create mode 100644 examples/docs/resources/pc/demo/user-contact/slots-usercontact.spec.ts
create mode 100644 examples/docs/resources/pc/demo/user-contact/support-open-espace.spec.ts
create mode 100644 examples/docs/resources/pc/demo/user-head/basic-usage.spec.ts
create mode 100644 examples/docs/resources/pc/demo/user-head/color.spec.ts
create mode 100644 examples/docs/resources/pc/demo/user-head/custom-background-color.spec.ts
create mode 100644 examples/docs/resources/pc/demo/user-head/custom-user-head-content.spec.ts
create mode 100644 examples/docs/resources/pc/demo/user-head/icon-user-head.spec.ts
create mode 100644 examples/docs/resources/pc/demo/user-head/image-user-head.spec.ts
create mode 100644 examples/docs/resources/pc/demo/user-head/label-user-head.spec.ts
create mode 100644 examples/docs/resources/pc/demo/user-head/message-count-limit.spec.ts
create mode 100644 examples/docs/resources/pc/demo/user-head/message-count-total.spec.ts
create mode 100644 examples/docs/resources/pc/demo/user-head/message-count-type.spec.ts
create mode 100644 examples/docs/resources/pc/demo/user-head/min-user-head.spec.ts
create mode 100644 examples/docs/resources/pc/demo/user-head/render-user-head-in-grid.spec.ts
create mode 100644 examples/docs/resources/pc/demo/user-head/round-user-head.spec.ts
create mode 100644 examples/docs/resources/pc/demo/wizard/base-flow.spec.ts
create mode 100644 examples/docs/resources/pc/demo/wizard/page-guide.spec.ts
create mode 100644 examples/docs/resources/pc/demo/wizard/slot-base.spec.ts
create mode 100644 examples/docs/resources/pc/demo/wizard/slot-step-button.spec.ts
create mode 100644 examples/docs/resources/pc/demo/wizard/time-line-flow.spec.ts
create mode 100644 examples/docs/resources/pc/demo/wizard/vertical.spec.ts
create mode 100644 examples/vue2.7/.env.saas
create mode 100644 examples/vue2.7/src/vite-env.d.ts
create mode 100644 examples/vue2/.env.saas
create mode 100644 examples/vue2/src/vite-env.d.ts
create mode 100644 examples/vue3/.env.saas
create mode 100644 examples/vue3/src/vite-env.d.ts
create mode 100644 internals/vue-vite-import/.npmignore
create mode 100644 packages/design/aurora/src/grid/index.ts
create mode 100644 packages/design/aurora/src/switch/index.ts
create mode 100644 packages/theme-saas/src/svgs/dot-download.svg
create mode 100644 packages/theme-saas/src/svgs/down-ward.svg
create mode 100644 packages/theme-saas/src/svgs/left-ward-arrow.svg
create mode 100644 packages/theme-saas/src/svgs/prompt-exclamation.svg
create mode 100644 packages/theme-saas/src/svgs/sort-default.svg
create mode 100644 packages/theme-saas/src/svgs/sort-triangle-ascending.svg
create mode 100644 packages/theme-saas/src/svgs/sort-triangle-descending.svg
create mode 100644 packages/theme-saas/src/svgs/sort-triangle.svg
create mode 100644 packages/theme-saas/src/textarea/index.less
create mode 100644 packages/theme-saas/src/textarea/vars.less
create mode 100644 packages/theme-saas/src/theme-tool.js
create mode 100644 packages/theme-saas/src/theme.config.js
create mode 100644 packages/theme-saas/src/theme/aurora-theme/index.js
create mode 100644 packages/theme-saas/src/theme/deep-theme/index.js
create mode 100644 packages/theme-saas/src/theme/galaxy-theme/index.js
create mode 100644 packages/theme-saas/src/theme/impression-theme/index.js
create mode 100644 packages/theme-saas/src/theme/index.js
create mode 100644 packages/theme-saas/src/theme/infinity-theme/index.js
create mode 100644 packages/theme-saas/src/theme/smb-theme/index.js
create mode 100644 packages/theme-saas/src/theme/utils.js
create mode 100644 packages/theme/src/dialog-box/aurora-theme.js
create mode 100644 packages/theme/src/pager/aurora-theme.js
create mode 100644 packages/theme/src/steps/aurora-theme.js
create mode 100644 packages/theme/src/tree-menu/aurora-theme.js
create mode 100644 packages/theme/src/tree/aurora-theme.js
create mode 100644 packages/vue-icon-saas/index.ts
create mode 100644 packages/vue-icon-saas/src/administrator/index.ts
create mode 100644 packages/vue-icon-saas/src/area-chart/index.ts
create mode 100644 packages/vue-icon-saas/src/arrow-bottom/index.ts
create mode 100644 packages/vue-icon-saas/src/arrow-down/index.ts
create mode 100644 packages/vue-icon-saas/src/arrow-left/index.ts
create mode 100644 packages/vue-icon-saas/src/arrow-right/index.ts
create mode 100644 packages/vue-icon-saas/src/arrow-up/index.ts
create mode 100644 packages/vue-icon-saas/src/ascending/index.ts
create mode 100644 packages/vue-icon-saas/src/association/index.ts
create mode 100644 packages/vue-icon-saas/src/attachment/index.ts
create mode 100644 packages/vue-icon-saas/src/audio/index.ts
create mode 100644 packages/vue-icon-saas/src/bar-chart/index.ts
create mode 100644 packages/vue-icon-saas/src/befilter/index.ts
create mode 100644 packages/vue-icon-saas/src/boat/index.ts
create mode 100644 packages/vue-icon-saas/src/busy/index.ts
create mode 100644 packages/vue-icon-saas/src/calculator/index.ts
create mode 100644 packages/vue-icon-saas/src/calendar/index.ts
create mode 100644 packages/vue-icon-saas/src/check-out/index.ts
create mode 100644 packages/vue-icon-saas/src/check/index.ts
create mode 100644 packages/vue-icon-saas/src/checked-linear/index.ts
create mode 100644 packages/vue-icon-saas/src/checked-sur/index.ts
create mode 100644 packages/vue-icon-saas/src/checked-true/index.ts
create mode 100644 packages/vue-icon-saas/src/chevron-down/index.ts
create mode 100644 packages/vue-icon-saas/src/chevron-left/index.ts
create mode 100644 packages/vue-icon-saas/src/chevron-right/index.ts
create mode 100644 packages/vue-icon-saas/src/chevron-up/index.ts
create mode 100644 packages/vue-icon-saas/src/clear-filter/index.ts
create mode 100644 packages/vue-icon-saas/src/clock-work/index.ts
create mode 100644 packages/vue-icon-saas/src/close-circle/index.ts
create mode 100644 packages/vue-icon-saas/src/close-square/index.ts
create mode 100644 packages/vue-icon-saas/src/close/index.ts
create mode 100644 packages/vue-icon-saas/src/cloud-download/index.ts
create mode 100644 packages/vue-icon-saas/src/cloud-upload/index.ts
create mode 100644 packages/vue-icon-saas/src/coin/index.ts
create mode 100644 packages/vue-icon-saas/src/commission/index.ts
create mode 100644 packages/vue-icon-saas/src/conment-refresh/index.ts
create mode 100644 packages/vue-icon-saas/src/copy/index.ts
create mode 100644 packages/vue-icon-saas/src/course/index.ts
create mode 100644 packages/vue-icon-saas/src/crop/index.ts
create mode 100644 packages/vue-icon-saas/src/cue-l/index.ts
create mode 100644 packages/vue-icon-saas/src/custom/index.ts
create mode 100644 packages/vue-icon-saas/src/customer-service/index.ts
create mode 100644 packages/vue-icon-saas/src/default/index.ts
create mode 100644 packages/vue-icon-saas/src/defined-filtration/index.ts
create mode 100644 packages/vue-icon-saas/src/del/index.ts
create mode 100644 packages/vue-icon-saas/src/delete-page/index.ts
create mode 100644 packages/vue-icon-saas/src/deleted/index.ts
create mode 100644 packages/vue-icon-saas/src/delta-down-o/index.ts
create mode 100644 packages/vue-icon-saas/src/delta-down/index.ts
create mode 100644 packages/vue-icon-saas/src/delta-left-o/index.ts
create mode 100644 packages/vue-icon-saas/src/delta-left/index.ts
create mode 100644 packages/vue-icon-saas/src/delta-right-o/index.ts
create mode 100644 packages/vue-icon-saas/src/delta-right/index.ts
create mode 100644 packages/vue-icon-saas/src/delta-up-o/index.ts
create mode 100644 packages/vue-icon-saas/src/delta-up/index.ts
create mode 100644 packages/vue-icon-saas/src/derive/index.ts
create mode 100644 packages/vue-icon-saas/src/descending/index.ts
create mode 100644 packages/vue-icon-saas/src/dialog/index.ts
create mode 100644 packages/vue-icon-saas/src/dialog2/index.ts
create mode 100644 packages/vue-icon-saas/src/dot-chart/index.ts
create mode 100644 packages/vue-icon-saas/src/dot-download/index.ts
create mode 100644 packages/vue-icon-saas/src/dot-ipv4/index.ts
create mode 100644 packages/vue-icon-saas/src/double-left/index.ts
create mode 100644 packages/vue-icon-saas/src/double-right/index.ts
create mode 100644 packages/vue-icon-saas/src/down-o/index.ts
create mode 100644 packages/vue-icon-saas/src/down-ward/index.ts
create mode 100644 packages/vue-icon-saas/src/down/index.ts
create mode 100644 packages/vue-icon-saas/src/download-cloud/index.ts
create mode 100644 packages/vue-icon-saas/src/download-link/index.ts
create mode 100644 packages/vue-icon-saas/src/download/index.ts
create mode 100644 packages/vue-icon-saas/src/edit/index.ts
create mode 100644 packages/vue-icon-saas/src/editor-align-center/index.ts
create mode 100644 packages/vue-icon-saas/src/editor-align-left/index.ts
create mode 100644 packages/vue-icon-saas/src/editor-align-right/index.ts
create mode 100644 packages/vue-icon-saas/src/editor-background/index.ts
create mode 100644 packages/vue-icon-saas/src/editor-bold/index.ts
create mode 100644 packages/vue-icon-saas/src/editor-code/index.ts
create mode 100644 packages/vue-icon-saas/src/editor-deleteline/index.ts
create mode 100644 packages/vue-icon-saas/src/editor-eraser/index.ts
create mode 100644 packages/vue-icon-saas/src/editor-italic/index.ts
create mode 100644 packages/vue-icon-saas/src/editor-left-border/index.ts
create mode 100644 packages/vue-icon-saas/src/editor-list-dot/index.ts
create mode 100644 packages/vue-icon-saas/src/editor-list-num/index.ts
create mode 100644 packages/vue-icon-saas/src/editor-list/index.ts
create mode 100644 packages/vue-icon-saas/src/editor-menu-left/index.ts
create mode 100644 packages/vue-icon-saas/src/editor-menu-right/index.ts
create mode 100644 packages/vue-icon-saas/src/editor-quote/index.ts
create mode 100644 packages/vue-icon-saas/src/editor-redo/index.ts
create mode 100644 packages/vue-icon-saas/src/editor-right-border/index.ts
create mode 100644 packages/vue-icon-saas/src/editor-sub/index.ts
create mode 100644 packages/vue-icon-saas/src/editor-subtitle/index.ts
create mode 100644 packages/vue-icon-saas/src/editor-super/index.ts
create mode 100644 packages/vue-icon-saas/src/editor-tab/index.ts
create mode 100644 packages/vue-icon-saas/src/editor-table/index.ts
create mode 100644 packages/vue-icon-saas/src/editor-textcolor/index.ts
create mode 100644 packages/vue-icon-saas/src/editor-title/index.ts
create mode 100644 packages/vue-icon-saas/src/editor-underline/index.ts
create mode 100644 packages/vue-icon-saas/src/editor-undo/index.ts
create mode 100644 packages/vue-icon-saas/src/editor-video/index.ts
create mode 100644 packages/vue-icon-saas/src/ellipsis/index.ts
create mode 100644 packages/vue-icon-saas/src/email-add/index.ts
create mode 100644 packages/vue-icon-saas/src/email-circle/index.ts
create mode 100644 packages/vue-icon-saas/src/end/index.ts
create mode 100644 packages/vue-icon-saas/src/error/index.ts
create mode 100644 packages/vue-icon-saas/src/espace-auto/index.ts
create mode 100644 packages/vue-icon-saas/src/espace/index.ts
create mode 100644 packages/vue-icon-saas/src/excel-type/index.ts
create mode 100644 packages/vue-icon-saas/src/excel/index.ts
create mode 100644 packages/vue-icon-saas/src/exception/index.ts
create mode 100644 packages/vue-icon-saas/src/exclamation/index.ts
create mode 100644 packages/vue-icon-saas/src/export/index.ts
create mode 100644 packages/vue-icon-saas/src/express-search/index.ts
create mode 100644 packages/vue-icon-saas/src/eyeclose/index.ts
create mode 100644 packages/vue-icon-saas/src/eyeopen/index.ts
create mode 100644 packages/vue-icon-saas/src/file-cloudupload/index.ts
create mode 100644 packages/vue-icon-saas/src/file-excel/index.ts
create mode 100644 packages/vue-icon-saas/src/file-type/index.ts
create mode 100644 packages/vue-icon-saas/src/file/index.ts
create mode 100644 packages/vue-icon-saas/src/files-circle/index.ts
create mode 100644 packages/vue-icon-saas/src/files/index.ts
create mode 100644 packages/vue-icon-saas/src/filetext/index.ts
create mode 100644 packages/vue-icon-saas/src/fileupload/index.ts
create mode 100644 packages/vue-icon-saas/src/filtered/index.ts
create mode 100644 packages/vue-icon-saas/src/flag/index.ts
create mode 100644 packages/vue-icon-saas/src/folder-closed/index.ts
create mode 100644 packages/vue-icon-saas/src/folder-opened/index.ts
create mode 100644 packages/vue-icon-saas/src/freeze-left/index.ts
create mode 100644 packages/vue-icon-saas/src/freeze-right/index.ts
create mode 100644 packages/vue-icon-saas/src/frown-o/index.ts
create mode 100644 packages/vue-icon-saas/src/frown/index.ts
create mode 100644 packages/vue-icon-saas/src/fullscreen-left/index.ts
create mode 100644 packages/vue-icon-saas/src/fullscreen/index.ts
create mode 100644 packages/vue-icon-saas/src/grade/index.ts
create mode 100644 packages/vue-icon-saas/src/group-transfer/index.ts
create mode 100644 packages/vue-icon-saas/src/group/index.ts
create mode 100644 packages/vue-icon-saas/src/halfchecked/index.ts
create mode 100644 packages/vue-icon-saas/src/halfselect/index.ts
create mode 100644 packages/vue-icon-saas/src/heartempty/index.ts
create mode 100644 packages/vue-icon-saas/src/help-circle/index.ts
create mode 100644 packages/vue-icon-saas/src/help-query/index.ts
create mode 100644 packages/vue-icon-saas/src/help-solid/index.ts
create mode 100644 packages/vue-icon-saas/src/help/index.ts
create mode 100644 packages/vue-icon-saas/src/helpful/index.ts
create mode 100644 packages/vue-icon-saas/src/import/index.ts
create mode 100644 packages/vue-icon-saas/src/info-circle/index.ts
create mode 100644 packages/vue-icon-saas/src/info-solid/index.ts
create mode 100644 packages/vue-icon-saas/src/info/index.ts
create mode 100644 packages/vue-icon-saas/src/information/index.ts
create mode 100644 packages/vue-icon-saas/src/leave/index.ts
create mode 100644 packages/vue-icon-saas/src/left-frozen/index.ts
create mode 100644 packages/vue-icon-saas/src/left-o/index.ts
create mode 100644 packages/vue-icon-saas/src/left-ward-arrow/index.ts
create mode 100644 packages/vue-icon-saas/src/left-ward/index.ts
create mode 100644 packages/vue-icon-saas/src/left/index.ts
create mode 100644 packages/vue-icon-saas/src/line-chart/index.ts
create mode 100644 packages/vue-icon-saas/src/link/index.ts
create mode 100644 packages/vue-icon-saas/src/loading/index.ts
create mode 100644 packages/vue-icon-saas/src/lock/index.ts
create mode 100644 packages/vue-icon-saas/src/mail-content/index.ts
create mode 100644 packages/vue-icon-saas/src/mail/index.ts
create mode 100644 packages/vue-icon-saas/src/male/index.ts
create mode 100644 packages/vue-icon-saas/src/mark-on/index.ts
create mode 100644 packages/vue-icon-saas/src/meh/index.ts
create mode 100644 packages/vue-icon-saas/src/message-circle/index.ts
create mode 100644 packages/vue-icon-saas/src/mic/index.ts
create mode 100644 packages/vue-icon-saas/src/minscreen-left/index.ts
create mode 100644 packages/vue-icon-saas/src/minscreen/index.ts
create mode 100644 packages/vue-icon-saas/src/minus-circle/index.ts
create mode 100644 packages/vue-icon-saas/src/minus-square/index.ts
create mode 100644 packages/vue-icon-saas/src/minus/index.ts
create mode 100644 packages/vue-icon-saas/src/mobile-checkbox-half/index.ts
create mode 100644 packages/vue-icon-saas/src/mobile-checkbox-selected/index.ts
create mode 100644 packages/vue-icon-saas/src/mobile-checkbox/index.ts
create mode 100644 packages/vue-icon-saas/src/mobile-radio-selected/index.ts
create mode 100644 packages/vue-icon-saas/src/mobile-radio/index.ts
create mode 100644 packages/vue-icon-saas/src/mobile/index.ts
create mode 100644 packages/vue-icon-saas/src/more/index.ts
create mode 100644 packages/vue-icon-saas/src/new/index.ts
create mode 100644 packages/vue-icon-saas/src/no-premission/index.ts
create mode 100644 packages/vue-icon-saas/src/node-open/index.ts
create mode 100644 packages/vue-icon-saas/src/node/index.ts
create mode 100644 packages/vue-icon-saas/src/off-line/index.ts
create mode 100644 packages/vue-icon-saas/src/on-line/index.ts
create mode 100644 packages/vue-icon-saas/src/operationfaild-l/index.ts
create mode 100644 packages/vue-icon-saas/src/operationfaild/index.ts
create mode 100644 packages/vue-icon-saas/src/other-type/index.ts
create mode 100644 packages/vue-icon-saas/src/outer-link/index.ts
create mode 100644 packages/vue-icon-saas/src/pagelink/index.ts
create mode 100644 packages/vue-icon-saas/src/pager-first/index.ts
create mode 100644 packages/vue-icon-saas/src/pager-last/index.ts
create mode 100644 packages/vue-icon-saas/src/pager-next/index.ts
create mode 100644 packages/vue-icon-saas/src/pager-prev/index.ts
create mode 100644 packages/vue-icon-saas/src/panel-max/index.ts
create mode 100644 packages/vue-icon-saas/src/panel-mini/index.ts
create mode 100644 packages/vue-icon-saas/src/panel-normal/index.ts
create mode 100644 packages/vue-icon-saas/src/pause-circle/index.ts
create mode 100644 packages/vue-icon-saas/src/pause/index.ts
create mode 100644 packages/vue-icon-saas/src/pdf-type/index.ts
create mode 100644 packages/vue-icon-saas/src/picture-type/index.ts
create mode 100644 packages/vue-icon-saas/src/picture/index.ts
create mode 100644 packages/vue-icon-saas/src/pie-chart/index.ts
create mode 100644 packages/vue-icon-saas/src/plus-circle/index.ts
create mode 100644 packages/vue-icon-saas/src/plus-square/index.ts
create mode 100644 packages/vue-icon-saas/src/plus/index.ts
create mode 100644 packages/vue-icon-saas/src/popup/index.ts
create mode 100644 packages/vue-icon-saas/src/ppt-type/index.ts
create mode 100644 packages/vue-icon-saas/src/pre-checked/index.ts
create mode 100644 packages/vue-icon-saas/src/print-preview/index.ts
create mode 100644 packages/vue-icon-saas/src/prompt-exclamation/index.ts
create mode 100644 packages/vue-icon-saas/src/pushpin/index.ts
create mode 100644 packages/vue-icon-saas/src/radio/index.ts
create mode 100644 packages/vue-icon-saas/src/radioselected/index.ts
create mode 100644 packages/vue-icon-saas/src/refres/index.ts
create mode 100644 packages/vue-icon-saas/src/renew/index.ts
create mode 100644 packages/vue-icon-saas/src/repeat/index.ts
create mode 100644 packages/vue-icon-saas/src/replace/index.ts
create mode 100644 packages/vue-icon-saas/src/replies/index.ts
create mode 100644 packages/vue-icon-saas/src/right-frozen/index.ts
create mode 100644 packages/vue-icon-saas/src/right-o/index.ts
create mode 100644 packages/vue-icon-saas/src/right/index.ts
create mode 100644 packages/vue-icon-saas/src/rightward/index.ts
create mode 100644 packages/vue-icon-saas/src/sandwich-collapse/index.ts
create mode 100644 packages/vue-icon-saas/src/sandwich-expand/index.ts
create mode 100644 packages/vue-icon-saas/src/save/index.ts
create mode 100644 packages/vue-icon-saas/src/scissor/index.ts
create mode 100644 packages/vue-icon-saas/src/search/index.ts
create mode 100644 packages/vue-icon-saas/src/select/index.ts
create mode 100644 packages/vue-icon-saas/src/sent/index.ts
create mode 100644 packages/vue-icon-saas/src/separate/index.ts
create mode 100644 packages/vue-icon-saas/src/setting/index.ts
create mode 100644 packages/vue-icon-saas/src/share-arrow/index.ts
create mode 100644 packages/vue-icon-saas/src/share/index.ts
create mode 100644 packages/vue-icon-saas/src/shopping-card/index.ts
create mode 100644 packages/vue-icon-saas/src/smile-o/index.ts
create mode 100644 packages/vue-icon-saas/src/smile/index.ts
create mode 100644 packages/vue-icon-saas/src/sort-default/index.ts
create mode 100644 packages/vue-icon-saas/src/sort-triangle-ascending/index.ts
create mode 100644 packages/vue-icon-saas/src/sort-triangle-descending/index.ts
create mode 100644 packages/vue-icon-saas/src/sort-triangle/index.ts
create mode 100644 packages/vue-icon-saas/src/sort/index.ts
create mode 100644 packages/vue-icon-saas/src/star-active/index.ts
create mode 100644 packages/vue-icon-saas/src/star-disable/index.ts
create mode 100644 packages/vue-icon-saas/src/star-o/index.ts
create mode 100644 packages/vue-icon-saas/src/start-circle/index.ts
create mode 100644 packages/vue-icon-saas/src/start/index.ts
create mode 100644 packages/vue-icon-saas/src/statistics/index.ts
create mode 100644 packages/vue-icon-saas/src/stop/index.ts
create mode 100644 packages/vue-icon-saas/src/success/index.ts
create mode 100644 packages/vue-icon-saas/src/successful/index.ts
create mode 100644 packages/vue-icon-saas/src/task-cooperation/index.ts
create mode 100644 packages/vue-icon-saas/src/telephone-circle/index.ts
create mode 100644 packages/vue-icon-saas/src/telephone/index.ts
create mode 100644 packages/vue-icon-saas/src/text-tab/index.ts
create mode 100644 packages/vue-icon-saas/src/text-type/index.ts
create mode 100644 packages/vue-icon-saas/src/text/index.ts
create mode 100644 packages/vue-icon-saas/src/time/index.ts
create mode 100644 packages/vue-icon-saas/src/total/index.ts
create mode 100644 packages/vue-icon-saas/src/triangle-down/index.ts
create mode 100644 packages/vue-icon-saas/src/undelete/index.ts
create mode 100644 packages/vue-icon-saas/src/unfilter/index.ts
create mode 100644 packages/vue-icon-saas/src/unfreeze/index.ts
create mode 100644 packages/vue-icon-saas/src/unknow/index.ts
create mode 100644 packages/vue-icon-saas/src/unlock/index.ts
create mode 100644 packages/vue-icon-saas/src/unsent/index.ts
create mode 100644 packages/vue-icon-saas/src/up-o/index.ts
create mode 100644 packages/vue-icon-saas/src/up/index.ts
create mode 100644 packages/vue-icon-saas/src/upload/index.ts
create mode 100644 packages/vue-icon-saas/src/user/index.ts
create mode 100644 packages/vue-icon-saas/src/versiontree/index.ts
create mode 100644 packages/vue-icon-saas/src/video-type/index.ts
create mode 100644 packages/vue-icon-saas/src/view/index.ts
create mode 100644 packages/vue-icon-saas/src/warning-triangle/index.ts
create mode 100644 packages/vue-icon-saas/src/warning/index.ts
create mode 100644 packages/vue-icon-saas/src/web-plus/index.ts
create mode 100644 packages/vue-icon-saas/src/word-type/index.ts
create mode 100644 packages/vue-icon-saas/src/writing/index.ts
create mode 100644 packages/vue-icon-saas/src/yes/index.ts
create mode 100644 packages/vue-icon-saas/src/zip-type/index.ts
create mode 100644 packages/vue-icon-saas/src/zoom-in/index.ts
create mode 100644 packages/vue-icon-saas/src/zoom-out/index.ts
create mode 100644 packages/vue/src/autocomplete/__tests__/autocomplete.test.tsx
create mode 100644 packages/vue/src/badge/__tests__/badge.test.tsx
create mode 100644 packages/vue/src/button-group/__tests__/button-group.test.tsx
create mode 100644 packages/vue/src/button/__tests__/button.test.tsx
create mode 100644 packages/vue/src/cascader-panel/__tests__/cascader-panel.test.tsx
create mode 100644 packages/vue/src/cascader/__tests__/cascader.test.tsx
create mode 100644 packages/vue/src/checkbox/__tests__/checkbox.test.tsx
create mode 100644 packages/vue/src/date-picker/__tests__/date-picker.test.tsx
create mode 100644 packages/vue/src/drop-times/__tests__/drop-times.test.tsx
create mode 100644 packages/vue/src/file-upload/__tests__/file-upload.test.tsx
create mode 100644 packages/vue/src/form/__tests__/form.test.tsx
create mode 100644 packages/vue/src/grid/src/mobile-first/column-content.vue
create mode 100644 packages/vue/src/grid/src/mobile-first/column-layout.vue
create mode 100644 packages/vue/src/grid/src/mobile-first/column-link.vue
create mode 100644 packages/vue/src/grid/src/mobile-first/column-type.vue
create mode 100644 packages/vue/src/grid/src/mobile-first/gantt-view.vue
create mode 100644 packages/vue/src/grid/src/mobile-first/index.vue
create mode 100644 packages/vue/src/grid/src/mobile-first/list-view.vue
create mode 100644 packages/vue/src/grid/src/mobile-first/table-row.vue
create mode 100644 packages/vue/src/grid/src/mobile-first/type.ts
create mode 100644 packages/vue/src/grid/src/mobile-first/utils.ts
create mode 100644 packages/vue/src/input/__tests__/input.test.tsx
create mode 100644 packages/vue/src/ip-address/__tests__/ip-address.test.tsx
create mode 100644 packages/vue/src/link/__tests__/link.test.tsx
create mode 100644 packages/vue/src/numeric/__tests__/numeric.test.tsx
create mode 100644 packages/vue/src/pager/__test__/pager.test.tsx
create mode 100644 packages/vue/src/pop-upload/__tests__/pop-upload.test.tsx
create mode 100644 packages/vue/src/popeditor/__tests__/popeditor.test.tsx
create mode 100644 packages/vue/src/popover/__tests__/popover.test.tsx
create mode 100644 packages/vue/src/radio/__tests__/radio.test.tsx
create mode 100644 packages/vue/src/rate/__test__/rate.test.ts
create mode 100644 packages/vue/src/search/__tests__/search.test.tsx
create mode 100644 packages/vue/src/select/__tests__/select.test.tsx
create mode 100644 packages/vue/src/slider/__tests__/slider.test.tsx
create mode 100644 packages/vue/src/switch/__tests__/switch.test.tsx
create mode 100644 packages/vue/src/time-picker/__tests__/time-picker.test.tsx
create mode 100644 packages/vue/src/time-select/__tests__/time-select.test.tsx
create mode 100644 packages/vue/src/transfer/__tests__/transfer.test.ts
create mode 100644 packages/vue/src/tree/__test__/tree.test.tsx
diff --git a/.eslintrc.js b/.eslintrc.js
index f9c047c4b..3baa85b10 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -4,9 +4,12 @@
module.exports = {
extends: '@antfu',
rules: {
- 'vue/component-tags-order': ['error', {
- order: [['script', 'template'], 'style'],
- }],
+ 'vue/component-tags-order': [
+ 'error',
+ {
+ order: [['script', 'template'], 'style']
+ }
+ ],
'vue/order-in-components': 'off',
'vue/component-name-in-template-casing': 'off',
'vue/custom-event-name-casing': 'off',
@@ -38,6 +41,6 @@ module.exports = {
'@typescript-eslint/brace-style': 'off',
'@typescript-eslint/restrict-plus-operands': 'off',
'@typescript-eslint/no-use-before-define': 'off',
- '@typescript-eslint/restrict-template-expressions': 'off',
- },
+ '@typescript-eslint/restrict-template-expressions': 'off'
+ }
}
diff --git a/.gitignore b/.gitignore
index 75f3ea20e..354a55c53 100644
--- a/.gitignore
+++ b/.gitignore
@@ -8,16 +8,12 @@ allDist/
packages/**/runtime
coverage/
-/packages/vue-icon-saas/src
-/packages/vue-icon-saas/index.ts
/packages/vue/index.ts
/packages/vue/pc.ts
/packages/vue/mobile.ts
/packages/vue/app.ts
-/packages/vue-icon/src/index.ts
/examples/**/playwright-report
-/examples/docs/.vitepress/cache
vite.config.ts.timestamp*
vitest.config.ts.timestamp*
diff --git a/README.md b/README.md
index 3db450881..c4c069367 100644
--- a/README.md
+++ b/README.md
@@ -59,7 +59,7 @@ pnpm i
pnpm dev
# Vue.js 2
-pnpm dev:vue2
+pnpm dev2
```
Open your browser and visit: [http://127.0.0.1:7130/](http://127.0.0.1:7130/)
diff --git a/README.zh-CN.md b/README.zh-CN.md
index 7e3869f2e..b1837c97d 100644
--- a/README.zh-CN.md
+++ b/README.zh-CN.md
@@ -59,7 +59,7 @@ pnpm i
pnpm dev
# 启动 Vue2 项目
-pnpm dev:vue2
+pnpm dev2
```
打开浏览器访问：[http://127.0.0.1:7130/](http://127.0.0.1:7130/)
diff --git a/examples/docs/newsrc/App.vue b/examples/docs/newsrc/App.vue
index 414484a9d..c7239221f 100644
--- a/examples/docs/newsrc/App.vue
+++ b/examples/docs/newsrc/App.vue
@@ -25,9 +25,8 @@ import { ButtonGroup, Link } from '@opentiny/vue'
import TinyPc from './pc.vue'
import TinyMobile from './mobile.vue'
import TinyMobileFirst from './mobile-first.vue'
-import { hooks, provideDesignConfig } from '@opentiny/vue-common'
+import { hooks } from '@opentiny/vue-common'
import { useModeCtx } from './uses'
-import designAuroraConfig from '@opentiny/vue-design-aurora'
export default {
components: {
@@ -48,9 +47,6 @@ export default {
vueVersion: hooks.version
})
- // 注入aurora主题规范
- provideDesignConfig(designAuroraConfig)
-
hooks.onMounted(() => {
hooks.watch(
() => modeState.mode,
diff --git a/examples/docs/newsrc/mobile-first.vue b/examples/docs/newsrc/mobile-first.vue
index 8c2d4340f..8839ee2d7 100644
--- a/examples/docs/newsrc/mobile-first.vue
+++ b/examples/docs/newsrc/mobile-first.vue
@@ -10,12 +10,16 @@
-
- {{ modeState.pathName }}
+
+
-
{{ state.currDemo?.name['zh-CN'] }}({{ state.currDemo?.codeFiles[0] }}):
+
+ {{ state.currDemo?.name['zh-CN'] }}
+ ({{ state.currDemo?.codeFiles[0] }} ):
+
@@ -40,23 +44,29 @@
{{ key }}
-
-
-
- {{
- data.row.name
- }}
- {{ data.row.name }}
-
-
-
-
-
-
-
-
+
+
+
+ 名称
+ 类型
+ 默认值
+ 说明
+
+
+
+
+
+ {{
+ row.name
+ }}
+ {{ row.name }}
+
+ {{ row.type }}
+ {{ row.defaultValue }}
+
+
+
-
- {{ modeState.pathName }}
+
+
-
{{ state.currDemo?.name['zh-CN'] }}({{ state.currDemo?.codeFiles[0] }}):
+
+ {{ state.currDemo?.name['zh-CN'] }}( {{ state.currDemo?.codeFiles[0] }} ):
+
@@ -44,23 +47,30 @@
{{ key }}
-
-
-
- {{
- data.row.name
- }}
- {{ data.row.name }}
-
-
-
-
-
-
-
-
+
+
+
+
+ 名称
+ 类型
+ 默认值
+ 说明
+
+
+
+
+
+ {{
+ row.name
+ }}
+ {{ row.name }}
+
+ {{ row.type }}
+ {{ row.defaultValue }}
+
+
+
+
diff --git a/examples/docs/resources/mobile-first/app/column-list-item/webdoc/column-list-item.en.md b/examples/docs/resources/mobile-first/app/column-list-item/webdoc/column-list-item.en.md
new file mode 100644
index 000000000..1f43565e2
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/column-list-item/webdoc/column-list-item.en.md
@@ -0,0 +1,8 @@
+---
+title: ColumnListItem 分区列表项
+---
+
+# ColumnListItem 分区列表项
+
+
+
diff --git a/examples/docs/resources/mobile-first/app/column-list-item/webdoc/column-list-item.js b/examples/docs/resources/mobile-first/app/column-list-item/webdoc/column-list-item.js
new file mode 100644
index 000000000..6f21442d4
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/column-list-item/webdoc/column-list-item.js
@@ -0,0 +1,130 @@
+export default {
+ column: '2',
+ owner: '',
+ demos: [
+ {
+ demoId: 'basic-usage',
+ name: {
+ 'zh-CN': '基本用法',
+ 'en-US': 'basic usage'
+ },
+ desc: {
+ 'zh-CN': '
',
+ 'en-US': 'button type
'
+ },
+ codeFiles: ['basic-usage.vue']
+ },
+
+ {
+ demoId: 'size',
+ name: {
+ 'zh-CN': '设置尺寸',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过 `size` 属性可以设置分区列表项的大小，支持 small 和 medium 两种尺寸。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['size.vue']
+ },
+ {
+ demoId: 'content-slot',
+ name: {
+ 'zh-CN': '内容区插槽',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过 `#column1、#column2、#column3、#column4` 可以设置内容区插槽，最多支持 4 个内容插槽。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['content-slot.vue']
+ },
+ {
+ demoId: 'custom-width',
+ name: {
+ 'zh-CN': '自定义内容插槽宽度',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '通过 `flex-basis` 属性可以设置内容插槽的宽度，flex-basis 类型为数组，最多能传入 4 个值，支持百分比，固定宽度及固有的尺寸关键词，默认为 auto，详情见 flex 的 flex-basis 属性。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['custom-width.vue']
+ },
+ {
+ demoId: 'icon-click-event',
+ name: {
+ 'zh-CN': '操作列按钮点击事件',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过 `icon-click` 给按钮加点击事件。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['icon-click-event.vue']
+ },
+ {
+ demoId: 'icon-disabled',
+ name: {
+ 'zh-CN': '操作列按钮隐藏与禁用',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '操作列配置项 options 中添加属性 hidden 可以隐藏按钮，可以通过 disabled 属性禁用操作按钮。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['icon-disabled.vue']
+ },
+ {
+ demoId: 'image-operate-slot',
+ name: {
+ 'zh-CN': '图片和操作列插槽',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过 `#image` 可以设置图片插槽，通过 `#operate` 可以设置操作列插槽。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['image-operate-slot.vue']
+ },
+ {
+ demoId: 'show-radio',
+ name: {
+ 'zh-CN': '单选',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过属性`show-radio`设置卡片单选，需同时设置 label，`disabled` 属性可以禁用单选按钮 。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['show-radio.vue']
+ },
+ {
+ demoId: 'show-checkbox',
+ name: {
+ 'zh-CN': '多选',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过属性`show-checkbox`设置卡片多选，需同时设置 label，`disabled` 属性可以禁用复选按钮 。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['show-checkbox.vue']
+ },
+ {
+ demoId: 'list-group',
+ name: {
+ 'zh-CN': '列表组',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '通过引入`column-list-group`组件来对列表进行分组，使用列表组结合复选功能时，需要给 item 设置 label，以此来记录选中的列表项。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['list-group.vue']
+ }
+ ],
+ apis: []
+}
diff --git a/examples/docs/resources/mobile-first/app/date-picker-mobile/webdoc/date-picker-mobile.cn.md b/examples/docs/resources/mobile-first/app/date-picker-mobile/webdoc/date-picker-mobile.cn.md
new file mode 100644
index 000000000..28aabe946
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/date-picker-mobile/webdoc/date-picker-mobile.cn.md
@@ -0,0 +1,9 @@
+---
+title: DatePickerMobile 日期选择器组件
+---
+
+# DatePickerMobile 日期选择器组件
+
+
+
+
diff --git a/examples/docs/resources/mobile-first/app/date-picker-mobile/webdoc/date-picker-mobile.en.md b/examples/docs/resources/mobile-first/app/date-picker-mobile/webdoc/date-picker-mobile.en.md
new file mode 100644
index 000000000..28aabe946
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/date-picker-mobile/webdoc/date-picker-mobile.en.md
@@ -0,0 +1,9 @@
+---
+title: DatePickerMobile 日期选择器组件
+---
+
+# DatePickerMobile 日期选择器组件
+
+
+
+
diff --git a/examples/docs/resources/mobile-first/app/date-picker-mobile/webdoc/date-picker-mobile.js b/examples/docs/resources/mobile-first/app/date-picker-mobile/webdoc/date-picker-mobile.js
new file mode 100644
index 000000000..ceb7fa2d4
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/date-picker-mobile/webdoc/date-picker-mobile.js
@@ -0,0 +1,56 @@
+export default {
+ column: '2',
+ owner: '',
+ demos: [
+ {
+ demoId: 'basic-usage',
+ name: {
+ 'zh-CN': '基本用法',
+ 'en-US': 'basic usage'
+ },
+ desc: {
+ 'zh-CN': '设置 `type` 属性默认值为 `date`，以日期的形式进行选择。
',
+ 'en-US': 'button type
'
+ },
+ codeFiles: ['basic-usage.vue']
+ },
+
+ {
+ demoId: 'datetime',
+ name: {
+ 'zh-CN': '选择日期时间',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '设置 `type` 属性为 `datetime`，以日期时间的形式进行选择。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['datetime.vue']
+ },
+ {
+ demoId: 'date-range',
+ name: {
+ 'zh-CN': '选择日期范围',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '设置 `type` 属性为 `daterange`，以日期范围的形式进行选择。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['date-range.vue']
+ },
+ {
+ demoId: 'datetime-range',
+ name: {
+ 'zh-CN': '选择日期时间范围',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '设置 `type` 属性为 `datetimerange`，以日期时间范围的形式进行选择。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['datetime-range.vue']
+ }
+ ],
+ apis: []
+}
diff --git a/examples/docs/resources/mobile-first/app/drawer/webdoc/drawer.cn.md b/examples/docs/resources/mobile-first/app/drawer/webdoc/drawer.cn.md
new file mode 100644
index 000000000..408078906
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/drawer/webdoc/drawer.cn.md
@@ -0,0 +1,9 @@
+---
+title: Drawer 抽屉组件
+---
+
+# Drawer 抽屉组件
+
+
+
+
diff --git a/examples/docs/resources/mobile-first/app/drawer/webdoc/drawer.en.md b/examples/docs/resources/mobile-first/app/drawer/webdoc/drawer.en.md
new file mode 100644
index 000000000..408078906
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/drawer/webdoc/drawer.en.md
@@ -0,0 +1,9 @@
+---
+title: Drawer 抽屉组件
+---
+
+# Drawer 抽屉组件
+
+
+
+
diff --git a/examples/docs/resources/mobile-first/app/drawer/webdoc/drawer.js b/examples/docs/resources/mobile-first/app/drawer/webdoc/drawer.js
new file mode 100644
index 000000000..4feee386d
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/drawer/webdoc/drawer.js
@@ -0,0 +1,117 @@
+export default {
+ column: '2',
+ owner: '',
+ demos: [
+ {
+ demoId: 'basic-usage',
+ name: {
+ 'zh-CN': '基本用法',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['basic-usage.vue']
+ },
+ {
+ demoId: 'placement',
+ name: {
+ 'zh-CN': '抽屉方向',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '添加 `placement` 属性设置抽屉的方向，可选值有 `left|right|top|bottom`，默认值为 `right`。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['placement.vue']
+ },
+ {
+ demoId: 'width',
+ name: {
+ 'zh-CN': '抽屉宽度',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '添加 `width` 属性设置抽屉的宽度，默认值为 `300px`。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['width.vue']
+ },
+ {
+ demoId: 'dragable',
+ name: {
+ 'zh-CN': '拖拽功能',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '添加 `dragable` 属性开启抽屉宽度拖拽功能，默认值为 `false`。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['dragable.vue']
+ },
+ {
+ demoId: 'mask',
+ name: {
+ 'zh-CN': '遮罩层1',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '添加 `mask` 属性可以关闭遮罩层，默认值为 `true` 。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['mask.vue']
+ },
+ {
+ demoId: 'mask-event',
+ name: {
+ 'zh-CN': '遮罩层2',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '默认弹窗打开后，可以单击遮罩层关闭弹窗，设置 `mask-closable` 为 `false` 后将禁用该功能，默认值为 `true` 。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['mask-event.vue']
+ },
+ {
+ demoId: 'show',
+ name: {
+ 'zh-CN': '显示隐藏',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '- show-header: 显示头部，默认值为 true；- show-footer: 显示底部，默认值为 false；
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['show.vue']
+ },
+ {
+ demoId: 'slot',
+ name: {
+ 'zh-CN': '插槽',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '- header: 头部插槽，默认显示头部，设置 :show-header="true" 时有效；- header-right: 头部右侧插槽，默认显示关闭功能；- footer: 头部插槽，默认隐藏底部，设置 :show-footer="true" 时有效；
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['slot.vue']
+ },
+ {
+ demoId: 'event',
+ name: {
+ 'zh-CN': '事件',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '- hide: 关闭抽屉事件；- confirm: 确认事件，设置 :show-footer="true" 时有效；
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['event.vue']
+ }
+ ],
+ apis: []
+}
diff --git a/examples/docs/resources/mobile-first/app/dropdown/webdoc/dropdown.cn.md b/examples/docs/resources/mobile-first/app/dropdown/webdoc/dropdown.cn.md
new file mode 100644
index 000000000..006c3bb45
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/dropdown/webdoc/dropdown.cn.md
@@ -0,0 +1,9 @@
+---
+title: Dropdown 下拉菜单
+---
+
+# Dropdown 下拉菜单
+
+
+将动作或菜单折叠到下拉菜单中。
+
diff --git a/examples/docs/resources/mobile-first/app/dropdown/webdoc/dropdown.en.md b/examples/docs/resources/mobile-first/app/dropdown/webdoc/dropdown.en.md
new file mode 100644
index 000000000..006c3bb45
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/dropdown/webdoc/dropdown.en.md
@@ -0,0 +1,9 @@
+---
+title: Dropdown 下拉菜单
+---
+
+# Dropdown 下拉菜单
+
+
+将动作或菜单折叠到下拉菜单中。
+
diff --git a/examples/docs/resources/mobile-first/app/dropdown/webdoc/dropdown.js b/examples/docs/resources/mobile-first/app/dropdown/webdoc/dropdown.js
new file mode 100644
index 000000000..187919d29
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/dropdown/webdoc/dropdown.js
@@ -0,0 +1,207 @@
+export default {
+ column: '2',
+ owner: '',
+ demos: [
+ {
+ demoId: 'basic-usage',
+ name: {
+ 'zh-CN': '基本用法',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '基本用法
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['basic-usage.vue']
+ },
+
+ {
+ demoId: 'checked-status',
+ name: {
+ 'zh-CN': '选中态',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '通过添加`checked-status`属性实现选中态，其中必须添加索引值`current-index`和选中态`selected`属性
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['checked-status.vue']
+ },
+ {
+ demoId: 'label-over',
+ name: {
+ 'zh-CN': '标签超出显示',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '当文字超出规定范围展示全部信息
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['label-over.vue']
+ },
+ {
+ demoId: 'button-dropdown',
+ name: {
+ 'zh-CN': '下拉按钮1',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可以通过 `split-button` 属性设置按钮下拉菜单。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['button-dropdown.vue']
+ },
+ {
+ demoId: 'button-type',
+ name: {
+ 'zh-CN': '下拉按钮2',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可以通过 `type` 属性设置下拉菜单按钮类型，仅支持`primary`类型。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['button-type.vue']
+ },
+ {
+ demoId: 'button-size',
+ name: {
+ 'zh-CN': '下拉按钮3',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '通过 size 属性设置按钮不同的大小尺寸，包括 medium、small、mini 三种不同大小。不设置时为默认尺寸。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['button-size.vue']
+ },
+ {
+ demoId: 'multi-stage',
+ name: {
+ 'zh-CN': '二级下拉触发对象',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '将动作或菜单折叠到下拉菜单中。（暂不支持三级菜单）可以通过 `multi-stage` 属性设置二级下拉菜单，通过添加`level="2"`以便区分二级层级。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['multi-stage.vue']
+ },
+ {
+ demoId: 'many-dropdown',
+ name: {
+ 'zh-CN': '更多图标下拉',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '通过添加`show-self-icon`属性自定义用户图标,无旋旋转动画；通过添加`:show-icon="false"`属性自定义用户图标,有旋旋转动画。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['many-dropdown.vue']
+ },
+ {
+ demoId: 'arrow-button',
+ name: {
+ 'zh-CN': '箭头按钮1',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过添加`border`属性可实现箭头按钮
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['arrow-button.vue']
+ },
+ {
+ demoId: 'border-size',
+ name: {
+ 'zh-CN': '箭头按钮2',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '通过 size 属性设置按钮不同的大小尺寸，包括 medium、small、mini 三种不同大小。不设置时为默认尺寸。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['border-size.vue']
+ },
+ {
+ demoId: 'events-visible-change',
+ name: {
+ 'zh-CN': 'visible-change 事件',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '内置事件包含：`button-click`、`item-click`、`visible-change` 事件。`visible-change` 事件：下拉框出现/隐藏时触发
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['events-visible-change.vue']
+ },
+ {
+ demoId: 'events-item-click',
+ name: {
+ 'zh-CN': 'item-click 事件',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '点击菜单项时触发的事件回调。可以通过`itemData`，获取菜单项中设置的`item-data`属性
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['events-item-click.vue']
+ },
+ {
+ demoId: 'events-button-click',
+ name: {
+ 'zh-CN': 'button-click 事件',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '当下拉触发元素呈现为按钮组，即`split-button`属性为`true`时，点击左侧按钮的事件回调
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['events-button-click.vue']
+ },
+ {
+ demoId: 'trigger-event',
+ name: {
+ 'zh-CN': '触发方式',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可以配置 `click` 激活或者 `hover` 激活。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['trigger-event.vue']
+ },
+ {
+ demoId: 'pop-direction',
+ name: {
+ 'zh-CN': '弹出方向',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '通过属性`palcement`来设置菜单弹出位置。可选值（top/top-start/top-end/bottom/bottom-start/bottom-end），默认：bottom-start;top：上居中;top-start：上偏左;top-end：上偏右;bottom 下居中;bottom-start 下偏左;bottom-end 下偏右
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['pop-direction.vue']
+ },
+ {
+ demoId: '/max-height',
+ name: {
+ 'zh-CN': '最大高度',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过添加`max-height`属性可设置下拉最大高度
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['/max-height.vue']
+ }
+ ],
+ apis: []
+}
diff --git a/examples/docs/resources/mobile-first/app/exception/webdoc/exception.cn.md b/examples/docs/resources/mobile-first/app/exception/webdoc/exception.cn.md
new file mode 100644
index 000000000..486a1e8e5
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/exception/webdoc/exception.cn.md
@@ -0,0 +1,9 @@
+---
+title: Exception 缺省页
+---
+
+# Exception 缺省页
+
+
+
+
diff --git a/examples/docs/resources/mobile-first/app/exception/webdoc/exception.en.md b/examples/docs/resources/mobile-first/app/exception/webdoc/exception.en.md
new file mode 100644
index 000000000..486a1e8e5
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/exception/webdoc/exception.en.md
@@ -0,0 +1,9 @@
+---
+title: Exception 缺省页
+---
+
+# Exception 缺省页
+
+
+
+
diff --git a/examples/docs/resources/mobile-first/app/exception/webdoc/exception.js b/examples/docs/resources/mobile-first/app/exception/webdoc/exception.js
new file mode 100644
index 000000000..6c9705f14
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/exception/webdoc/exception.js
@@ -0,0 +1,69 @@
+export default {
+ column: '2',
+ owner: '',
+ demos: [
+ {
+ demoId: 'message',
+ name: {
+ 'zh-CN': '基本用法',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['message.vue']
+ },
+ {
+ demoId: 'page-empty',
+ name: {
+ 'zh-CN': '页面级空态',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '通过添加`page-empty`属性展示页面级空态，其中 type 类型有`pagenoperm`、 `pageweaknet`、 `pagenothing`、 `pageservererror`
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['page-empty.vue']
+ },
+ {
+ demoId: 'component-empty',
+ name: {
+ 'zh-CN': '组件级空态',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '通过添加`component-empty`属性展示组件级空态，其中 type 类型有`noperm、 nodata、 weaknet、noresult、 nonews`
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['component-empty.vue']
+ },
+ {
+ demoId: 'sub-message',
+ name: {
+ 'zh-CN': '自定义二级标题内容',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过`sub-message`自定义二级标题
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['sub-message.vue']
+ },
+ {
+ demoId: 'button-text',
+ name: {
+ 'zh-CN': '自定义插槽',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '已去除`button-text`自定义按钮文本，直接可以通过插槽自定义
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['button-text.vue']
+ }
+ ],
+ apis: []
+}
diff --git a/examples/docs/resources/mobile-first/app/file-upload/webdoc/file-upload.cn.md b/examples/docs/resources/mobile-first/app/file-upload/webdoc/file-upload.cn.md
new file mode 100644
index 000000000..a0ac5c8d2
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/file-upload/webdoc/file-upload.cn.md
@@ -0,0 +1,9 @@
+---
+title: FileUpload 文件上传
+---
+
+# FileUpload 文件上传
+
+
+可以设定文件的类型与上传的个数等。可自定义上传服务。
+
diff --git a/examples/docs/resources/mobile-first/app/file-upload/webdoc/file-upload.en.md b/examples/docs/resources/mobile-first/app/file-upload/webdoc/file-upload.en.md
new file mode 100644
index 000000000..a0ac5c8d2
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/file-upload/webdoc/file-upload.en.md
@@ -0,0 +1,9 @@
+---
+title: FileUpload 文件上传
+---
+
+# FileUpload 文件上传
+
+
+可以设定文件的类型与上传的个数等。可自定义上传服务。
+
diff --git a/examples/docs/resources/mobile-first/app/file-upload/webdoc/file-upload.js b/examples/docs/resources/mobile-first/app/file-upload/webdoc/file-upload.js
new file mode 100644
index 000000000..9c3f54a9c
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/file-upload/webdoc/file-upload.js
@@ -0,0 +1,331 @@
+export default {
+ column: '2',
+ owner: '',
+ demos: [
+ {
+ demoId: 'basic-usage',
+ name: {
+ 'zh-CN': '基本用法',
+ 'en-US': 'basic usage'
+ },
+ desc: {
+ 'zh-CN': '属性 action(type：String) 上传服务器地址。
',
+ 'en-US': 'button type
'
+ },
+ codeFiles: ['basic-usage.vue']
+ },
+
+ {
+ demoId: 'file-type',
+ name: {
+ 'zh-CN': '可上传的文件类型',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过配置 `accept(.doc,.docx)` 来限制上传文件的格式为 `.doc .docx`
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['file-type.vue']
+ },
+ {
+ demoId: 'file-list',
+ name: {
+ 'zh-CN': '上传的文件列表',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过 `fileList` 配置需要显示的文件列表。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['file-list.vue']
+ },
+ {
+ demoId: 'show-title',
+ name: {
+ 'zh-CN': '隐藏标题',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '配置 `show-title` 为 `false` 隐藏标题，默认为 `true`。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['show-title.vue']
+ },
+ {
+ demoId: 'title',
+ name: {
+ 'zh-CN': '自定义标题',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过 `title` 可自定义标题。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['title.vue']
+ },
+ {
+ demoId: 'preview',
+ name: {
+ 'zh-CN': '文件预览',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '文件上传模式，配置 `preview` 事件，已上传的文件会显示预览按钮，点击预览图标会触发 `preview` 事件。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['preview.vue']
+ },
+ {
+ demoId: 'preview-picture',
+ name: {
+ 'zh-CN': '图片预览',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '图片上传模式，配置 `preview` 事件，已上传的文件会显示预览图标，点击预览图标会触发 `preview` 事件。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['preview-picture.vue']
+ },
+ {
+ demoId: 'download-all',
+ name: {
+ 'zh-CN': '下载全部',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '文件上传模式，配置 `download-all` 事件，会显示下载全部按钮，点击下载全部按钮会触发 `download-all` 事件
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['download-all.vue']
+ },
+ {
+ demoId: 'download',
+ name: {
+ 'zh-CN': '文件下载',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '文件上传模式，配置 `download-file` 事件，已上传的文件会显示下载按钮，点击下载按钮会触发 `download-file` 事件
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['download.vue']
+ },
+ {
+ demoId: 'download-picture',
+ name: {
+ 'zh-CN': '图片下载',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '图片上传模式，配置 `download-file` 事件，已上传的文件会显示下载图标，点击下载按钮会触发 `download-file` 事件
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['download-picture.vue']
+ },
+ {
+ demoId: 're-upload',
+ name: {
+ 'zh-CN': '文件重新上传',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '文件上传模式，配置 `re-upload` 事件，上传失败的文件会显示重新上传按钮，点击重新上传按钮会触发 `re-upload` 事件
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['re-upload.vue']
+ },
+ {
+ demoId: 're-upload-picture',
+ name: {
+ 'zh-CN': '图片重新上传',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '图片上传模式，配置 `re-upload` 事件，上传失败的文件会显示重新上传图标，点击重新上传按钮会触发 `re-upload` 事件
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['re-upload-picture.vue']
+ },
+ {
+ demoId: 'display-only',
+ name: {
+ 'zh-CN': '文件只读模式',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '文件上传模式，通过 `display-only` 设置组件是否只读。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['display-only.vue']
+ },
+ {
+ demoId: 'display-only-picture',
+ name: {
+ 'zh-CN': '图片只读模式',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '图片上传模式，通过 `display-only` 设置组件是否只读。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['display-only-picture.vue']
+ },
+ {
+ demoId: 'display-only-video-audio',
+ name: {
+ 'zh-CN': '音视频只读模式',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '音视频上传模式，通过 `display-only` 设置组件是否只读。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['display-only-video-audio.vue']
+ },
+ {
+ demoId: 'picture',
+ name: {
+ 'zh-CN': '图片上传--picture-single',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '设置 `list-type` 为 `picture-single`，展示单图片模式。可配置 `file-list` 属性展示对应的图片
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['picture.vue']
+ },
+ {
+ demoId: 'picture-card',
+ name: {
+ 'zh-CN': '图片上传--picture-card',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '设置 `list-type` 为 `picture-card`，展示图片墙模式。可配置 `file-list` 属性展示对应的图片
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['picture-card.vue']
+ },
+ {
+ demoId: 'picture-show-name',
+ name: {
+ 'zh-CN': '图片上传--show-name',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '设置 `show-name` 控制是否展示图片名字
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['picture-show-name.vue']
+ },
+ {
+ demoId: 'video',
+ name: {
+ 'zh-CN': '视频上传',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '在 `list-type` 为 `picture-single` 时，设置 `source-type` 为 `video` 时展示视频
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['video.vue']
+ },
+ {
+ demoId: 'audio',
+ name: {
+ 'zh-CN': '音频上传',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '在 `list-type` 为 `picture-single` 时，设置 `source-type` 为 `audio` 时展示视频
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['audio.vue']
+ },
+ {
+ demoId: 'multi-media',
+ name: {
+ 'zh-CN': '多媒体上传1',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '在 `list-type` 为 `picture-card` 时，设置 `source-type` 为 `video/audio/picture` 时进行视频、音频、图片上传，`source-type` 支持 `video、audio、picture` 的互相组合
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['multi-media.vue']
+ },
+ {
+ demoId: 'multi-media-native',
+ name: {
+ 'zh-CN': '多媒体上传2',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '同时在多媒体上传模式下，可配置hwh5属性，进行原生上传。可在 `trigger-click` 事件中进行文件选取操作并上传，可在 `play` 事件中进行音视频播放操作
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['multi-media-native.vue']
+ },
+
+ {
+ demoId: 'drag',
+ name: {
+ 'zh-CN': '拖拽上传',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '设置 `list-type` 为 `drag-single`，开启单文件拖拽上传。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['drag.vue']
+ },
+ {
+ demoId: 'drag-file-list',
+ name: {
+ 'zh-CN': '拖拽上传显示文件',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可配置 `file-list` 属性展示对应的文件
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['drag-file-list.vue']
+ },
+ {
+ demoId: 'event-trigger-click',
+ name: {
+ 'zh-CN': '事件',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '`trigger-click` 点击文件上传时触发的事件
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['event-trigger-click.vue']
+ },
+ {
+ demoId: 'assist-content',
+ name: {
+ 'zh-CN': '插槽',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '`assist-content` 辅助内容插槽
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['assist-content.vue']
+ }
+ ],
+ apis: []
+}
diff --git a/examples/docs/resources/mobile-first/app/filter-bar/webdoc/filter-bar.cn.md b/examples/docs/resources/mobile-first/app/filter-bar/webdoc/filter-bar.cn.md
new file mode 100644
index 000000000..22bc93b40
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/filter-bar/webdoc/filter-bar.cn.md
@@ -0,0 +1,9 @@
+---
+title: FilterBar 过滤栏
+---
+
+# FilterBar 过滤栏
+
+
+
+
diff --git a/examples/docs/resources/mobile-first/app/filter-bar/webdoc/filter-bar.en.md b/examples/docs/resources/mobile-first/app/filter-bar/webdoc/filter-bar.en.md
new file mode 100644
index 000000000..22bc93b40
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/filter-bar/webdoc/filter-bar.en.md
@@ -0,0 +1,9 @@
+---
+title: FilterBar 过滤栏
+---
+
+# FilterBar 过滤栏
+
+
+
+
diff --git a/examples/docs/resources/mobile-first/app/filter-bar/webdoc/filter-bar.js b/examples/docs/resources/mobile-first/app/filter-bar/webdoc/filter-bar.js
new file mode 100644
index 000000000..7b3a39ae0
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/filter-bar/webdoc/filter-bar.js
@@ -0,0 +1,43 @@
+export default {
+ column: '2',
+ owner: '',
+ demos: [
+ {
+ demoId: 'basic-usage',
+ name: {
+ 'zh-CN': '基本用法',
+ 'en-US': 'basic usage'
+ },
+ desc: {
+ 'zh-CN': '基本用法
',
+ 'en-US': 'button type
'
+ },
+ codeFiles: ['basic-usage.vue']
+ },
+ {
+ demoId: 'readonly',
+ name: {
+ 'zh-CN': '选中项只读',
+ 'en-US': 'button round'
+ },
+ desc: {
+ 'zh-CN': '点击事件不改变选中项。
',
+ 'en-US': 'button round
'
+ },
+ codeFiles: ['readonly.vue']
+ },
+ {
+ demoId: 'slot',
+ name: {
+ 'zh-CN': '插槽',
+ 'en-US': 'button round'
+ },
+ desc: {
+ 'zh-CN': '可使用右侧 `icon` 自定义插槽。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['slot.vue']
+ }
+ ],
+ apis: []
+}
diff --git a/examples/docs/resources/mobile-first/app/filter/webdoc/filter.cn.md b/examples/docs/resources/mobile-first/app/filter/webdoc/filter.cn.md
new file mode 100644
index 000000000..4bcaf4016
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/filter/webdoc/filter.cn.md
@@ -0,0 +1,9 @@
+---
+title: Filter 过滤器
+---
+
+# Filter 过滤器
+
+
+
+
diff --git a/examples/docs/resources/mobile-first/app/filter/webdoc/filter.en.md b/examples/docs/resources/mobile-first/app/filter/webdoc/filter.en.md
new file mode 100644
index 000000000..4bcaf4016
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/filter/webdoc/filter.en.md
@@ -0,0 +1,9 @@
+---
+title: Filter 过滤器
+---
+
+# Filter 过滤器
+
+
+
+
diff --git a/examples/docs/resources/mobile-first/app/filter/webdoc/filter.js b/examples/docs/resources/mobile-first/app/filter/webdoc/filter.js
new file mode 100644
index 000000000..a358c3215
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/filter/webdoc/filter.js
@@ -0,0 +1,58 @@
+export default {
+ column: '2',
+ owner: '',
+ demos: [
+ {
+ demoId: 'basic-usage',
+ name: {
+ 'zh-CN': '基本用法',
+ 'en-US': 'basic usage'
+ },
+ desc: {
+ 'zh-CN':
+ '过滤类型 type 包括 单选、多选、枚举单选 (radio | checkbox | enum-radio)。
',
+ 'en-US': 'button type
'
+ },
+ codeFiles: ['basic-usage.vue']
+ },
+ {
+ demoId: 'column-num',
+ name: {
+ 'zh-CN': '面板每行标签数',
+ 'en-US': 'button round'
+ },
+ desc: {
+ 'zh-CN': '通过 column-num 属性设置面板每行标签数，默认值为 3。
',
+ 'en-US': 'button round
'
+ },
+ codeFiles: ['column-num.vue']
+ },
+ {
+ demoId: 'filter-group',
+ name: {
+ 'zh-CN': '过滤组',
+ 'en-US': '过滤组'
+ },
+ desc: {
+ 'zh-CN':
+ '通过 filter-group 属性开启过滤组功能，filter-value 绑定过滤组的值。过滤组类型 type 包括 单选、多选 (radio | checkbox)。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['filter-group.vue']
+ },
+ {
+ demoId: 'enumeration',
+ name: {
+ 'zh-CN': '枚举单选',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '设置过滤类型 type: "enum-radio" 时，当前数据为枚举单选，通过 showAll: true 显示 全部 选择项。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['enumeration.vue']
+ }
+ ],
+ apis: []
+}
diff --git a/examples/docs/resources/mobile-first/app/flowchart/basic-usage.vue b/examples/docs/resources/mobile-first/app/flowchart/basic-usage.vue
index 6444c6b75..1655ee517 100644
--- a/examples/docs/resources/mobile-first/app/flowchart/basic-usage.vue
+++ b/examples/docs/resources/mobile-first/app/flowchart/basic-usage.vue
@@ -1,5 +1,12 @@
-
+
diff --git a/examples/docs/resources/mobile-first/app/flowchart/dot-horizon.vue b/examples/docs/resources/mobile-first/app/flowchart/dot-horizon.vue
new file mode 100644
index 000000000..77beb200e
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/flowchart/dot-horizon.vue
@@ -0,0 +1,124 @@
+
+
+
+
+
+
diff --git a/examples/docs/resources/mobile-first/app/flowchart/dot-vertical.vue b/examples/docs/resources/mobile-first/app/flowchart/dot-vertical.vue
new file mode 100644
index 000000000..c4111cec9
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/flowchart/dot-vertical.vue
@@ -0,0 +1,226 @@
+
+
+
+
+
+
diff --git a/examples/docs/resources/mobile-first/app/flowchart/holistic-fork.vue b/examples/docs/resources/mobile-first/app/flowchart/holistic-fork.vue
new file mode 100644
index 000000000..9d66d4c4c
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/flowchart/holistic-fork.vue
@@ -0,0 +1,357 @@
+
+
+
+
+
+
+
+
diff --git a/examples/docs/resources/mobile-first/app/flowchart/holistic.vue b/examples/docs/resources/mobile-first/app/flowchart/holistic.vue
new file mode 100644
index 000000000..df5449c6c
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/flowchart/holistic.vue
@@ -0,0 +1,186 @@
+
+
+
+
+
+
+
+
diff --git a/examples/docs/resources/mobile-first/app/flowchart/horizon.vue b/examples/docs/resources/mobile-first/app/flowchart/horizon.vue
index 281a5acc7..c152d88f8 100644
--- a/examples/docs/resources/mobile-first/app/flowchart/horizon.vue
+++ b/examples/docs/resources/mobile-first/app/flowchart/horizon.vue
@@ -1,5 +1,12 @@
-
+
diff --git a/examples/docs/resources/mobile-first/app/flowchart/webdoc/flowchart.cn.md b/examples/docs/resources/mobile-first/app/flowchart/webdoc/flowchart.cn.md
new file mode 100644
index 000000000..8e356754e
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/flowchart/webdoc/flowchart.cn.md
@@ -0,0 +1,16 @@
+---
+title: Flowchart 流程图
+---
+
+# Flowchart 流程图
+
+
+基本用法
+该组件可以用来定制流程图，不依赖其它库或组件。默认的实现支持有状态的节点和连线，支持节点和连线以及空白区域的点击事件。
+点模式
+提供了节点组件 Node 用于定制多端流程图的节点样式
+
+业务场景
+提供了节点组件 Node 用于定制多端流程图的节点样式
+
+
diff --git a/examples/docs/resources/mobile-first/app/flowchart/webdoc/flowchart.en.md b/examples/docs/resources/mobile-first/app/flowchart/webdoc/flowchart.en.md
new file mode 100644
index 000000000..8e356754e
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/flowchart/webdoc/flowchart.en.md
@@ -0,0 +1,16 @@
+---
+title: Flowchart 流程图
+---
+
+# Flowchart 流程图
+
+
+基本用法
+该组件可以用来定制流程图，不依赖其它库或组件。默认的实现支持有状态的节点和连线，支持节点和连线以及空白区域的点击事件。
+点模式
+提供了节点组件 Node 用于定制多端流程图的节点样式
+
+业务场景
+提供了节点组件 Node 用于定制多端流程图的节点样式
+
+
diff --git a/examples/docs/resources/mobile-first/app/flowchart/webdoc/flowchart.js b/examples/docs/resources/mobile-first/app/flowchart/webdoc/flowchart.js
new file mode 100644
index 000000000..a0b30c28c
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/flowchart/webdoc/flowchart.js
@@ -0,0 +1,79 @@
+export default {
+ column: '2',
+ owner: '',
+ demos: [
+ {
+ demoId: '/basic-usage',
+ name: {
+ 'zh-CN': '垂直图形',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['/basic-usage.vue']
+ },
+ {
+ demoId: 'horizon',
+ name: {
+ 'zh-CN': '水平图形',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['horizon.vue']
+ },
+ {
+ demoId: 'dot-vertical',
+ name: {
+ 'zh-CN': '点模式-垂直图形',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['dot-vertical.vue']
+ },
+ {
+ demoId: 'dot-horizon',
+ name: {
+ 'zh-CN': '点模式-水平图形',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['dot-horizon.vue']
+ },
+ {
+ demoId: 'holistic',
+ name: {
+ 'zh-CN': '全景图',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['holistic.vue']
+ },
+ {
+ demoId: 'holistic-fork',
+ name: {
+ 'zh-CN': '全景图-分叉',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['holistic-fork.vue']
+ }
+ ],
+ apis: []
+}
diff --git a/examples/docs/resources/mobile-first/app/form/no-validate-to-add.vue b/examples/docs/resources/mobile-first/app/form/no-validate-to-add.vue
index ae0f815ec..fad47820f 100644
--- a/examples/docs/resources/mobile-first/app/form/no-validate-to-add.vue
+++ b/examples/docs/resources/mobile-first/app/form/no-validate-to-add.vue
@@ -130,7 +130,6 @@ export default {
.demo-ruleForm .tiny-form-item .tiny-form-item__content {
width: 270px;
}
-
button:first-of-type {
margin-left: 100px;
}
diff --git a/examples/docs/resources/mobile-first/app/form/webdoc/form.cn.md b/examples/docs/resources/mobile-first/app/form/webdoc/form.cn.md
new file mode 100644
index 000000000..6702addcb
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/form/webdoc/form.cn.md
@@ -0,0 +1,9 @@
+---
+title: Form 表单
+---
+
+# Form 表单
+
+
+由按钮、输入框、选择器、单选框、多选框等控件组成，用以收集、校验、提交数据。
+
diff --git a/examples/docs/resources/mobile-first/app/form/webdoc/form.en.md b/examples/docs/resources/mobile-first/app/form/webdoc/form.en.md
new file mode 100644
index 000000000..6702addcb
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/form/webdoc/form.en.md
@@ -0,0 +1,9 @@
+---
+title: Form 表单
+---
+
+# Form 表单
+
+
+由按钮、输入框、选择器、单选框、多选框等控件组成，用以收集、校验、提交数据。
+
diff --git a/examples/docs/resources/mobile-first/app/form/webdoc/form.js b/examples/docs/resources/mobile-first/app/form/webdoc/form.js
new file mode 100644
index 000000000..380ac0951
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/form/webdoc/form.js
@@ -0,0 +1,210 @@
+export default {
+ column: '2',
+ owner: '',
+ demos: [
+ {
+ demoId: 'frequently-used-form',
+ name: {
+ 'zh-CN': '常用表单',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '在 Form 组件中，每一个表单域由一个 FormItem 组件构成，表单域中可以放置各种类型的表单控件，包括 Input、Select、Checkbox、Radio、Switch、DatePicker、TimePicker。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['frequently-used-form.vue']
+ },
+ {
+ demoId: 'form-in-row',
+ name: {
+ 'zh-CN': '行内表单',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '当垂直方向空间受限且表单较简单时，可以在一行内放置表单，设置 `inline` 属性可以让表单域变为行内的表单域。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['form-in-row.vue']
+ },
+ {
+ demoId: 'form-validation',
+ name: {
+ 'zh-CN': '表单校验',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '包括常用的必填、日期、时间、URL、邮件等校验规则。通过 `trigger` 配置触发校验规则的方式，为 `change` 时，当输入框值改变即触发校验，为 `blur` 时则失焦后触发校验。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['form-validation.vue']
+ },
+ {
+ demoId: 'custom-validation-rule',
+ name: {
+ 'zh-CN': '自定义校验规则',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '通过 `validator` 选项进行自定义校验，校验方法中 `callback` 必须被调用。通过配置 `validate-on-rule-change` 属性,设置是否在 `rules` 属性改变后立即触发一次验证
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['custom-validation-rule.vue']
+ },
+ {
+ demoId: 'validation-position',
+ name: {
+ 'zh-CN': '校验提示位置',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '通过 `validate-position` 可自定义错误提示出现的位置，在 `Form` 组件上设置后，子组件`FormItem`会继承父组件设置。单独在 `FormItem` 组件上进行设置优先级高于在 `From`上的设置。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['validation-position.vue']
+ },
+ {
+ demoId: 'popper-options-bubbling',
+ name: {
+ 'zh-CN': '校验提示跟随表单项移动',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '通过配置 `popperOptions.bubbling` 为 `true` ，可实现表单的校验提示跟随 Form 表单外部的滚动条滚动。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['popper-options-bubbling.vue']
+ },
+ {
+ demoId: 'switch-from-item',
+ name: {
+ 'zh-CN': '动态切换 FormItem',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '在表单中通过 `v-if` 切换两个 `FormItem` 控制页面元素时，会存在错误提示错位问题，原因时 Vue 复用了 ToolTip 组件，这时需要将 form-item 上加上 `key` 属性标识
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['switch-from-item.vue']
+ },
+ {
+ demoId: 'no-validate-to-add',
+ name: {
+ 'zh-CN': 'RichText 等无校验的组件添加校验的方法',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['no-validate-to-add.vue']
+ },
+ {
+ demoId: 'size',
+ name: {
+ 'zh-CN': '表单尺寸',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '通过在 `tiny-form` 标签上设置 `size` 属性可以改变表单内组件尺寸；设置 `disabled` 属性可以改变表单内组件禁用状态
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['size.vue']
+ },
+ {
+ demoId: 'form-clear-validate',
+ name: {
+ 'zh-CN': '移除表单项的校验结果',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '调用 `clearValidate` 方法移除表单项的校验结果。传入待移除的表单项的 `prop` 属性或者 `prop` 组成的数组，如不传则移除整个表单的校验结果。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['form-clear-validate.vue']
+ },
+ {
+ demoId: 'slot-label',
+ name: {
+ 'zh-CN': '标签文本插槽',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过在 `label` 插槽，自定义标签文本的内容
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['slot-label.vue']
+ },
+ {
+ demoId: 'form-item-tip',
+ name: {
+ 'zh-CN': '给表单项 label 添加提示',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过给 form-item 添加 tip-content 属性给 label 添加提示信息
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['form-item-tip.vue']
+ },
+ {
+ demoId: 'validate-type',
+ name: {
+ 'zh-CN': '校验提示的形式',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '通过 `validate-type` 可设置校验提示信息是以 `text` 文本显示还是以 `tip` 提示框的形式显示，默认为 `tip` 。也可直接配置在某一个 `` 上控制某一项的校验提示形式。',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['validate-type.vue']
+ },
+ {
+ demoId: 'form-disabled',
+ name: {
+ 'zh-CN': '表单禁用',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过 `disabled` 可设置表单是否禁用，默认为 `false`。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['form-disabled.vue']
+ },
+ {
+ demoId: 'form-display-only',
+ name: {
+ 'zh-CN': '只读 display-only',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过 `display-only` 属性，开启只读模式
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['form-display-only.vue']
+ },
+ {
+ demoId: 'validate-debounce',
+ name: {
+ 'zh-CN': '防抖处理',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '设置 FormItem 的属性 `validate-debounce` 为 `true`，可以开启校验防抖，在连续输入的情况下，会在最后一次输入结束时才开始校验。默认为 `false` 不开启。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['validate-debounce.vue']
+ }
+ ],
+ apis: []
+}
diff --git a/examples/docs/resources/mobile-first/app/grid/basic-usage.vue b/examples/docs/resources/mobile-first/app/grid/basic-usage.vue
new file mode 100644
index 000000000..649562222
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/grid/basic-usage.vue
@@ -0,0 +1,179 @@
+
+
+
+ 表格视图
+ 卡片视图
+
+
+
+
+
+
+
+
diff --git a/examples/docs/resources/mobile-first/app/grid/webdoc/grid.cn.md b/examples/docs/resources/mobile-first/app/grid/webdoc/grid.cn.md
new file mode 100644
index 000000000..b0debc154
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/grid/webdoc/grid.cn.md
@@ -0,0 +1,9 @@
+---
+title: Grid 表格
+---
+
+# Grid 表格
+
+
+表格组件，提供了非常强大数据表格功能，在 Grid 可以展示数据列表，可以对数据列表进行选择、编辑等。
+
diff --git a/examples/docs/resources/mobile-first/app/grid/webdoc/grid.en.md b/examples/docs/resources/mobile-first/app/grid/webdoc/grid.en.md
new file mode 100644
index 000000000..b0debc154
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/grid/webdoc/grid.en.md
@@ -0,0 +1,9 @@
+---
+title: Grid 表格
+---
+
+# Grid 表格
+
+
+表格组件，提供了非常强大数据表格功能，在 Grid 可以展示数据列表，可以对数据列表进行选择、编辑等。
+
diff --git a/examples/docs/resources/mobile-first/app/grid/webdoc/grid.js b/examples/docs/resources/mobile-first/app/grid/webdoc/grid.js
new file mode 100644
index 000000000..a207919d6
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/grid/webdoc/grid.js
@@ -0,0 +1,43 @@
+export default {
+ column: '2',
+ owner: '',
+ demos: [
+ {
+ demoId: 'basic-usage',
+ name: {
+ 'zh-CN': '枚举单选',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['basic-usage.vue']
+ },
+ {
+ demoId: 'column-anchor',
+ name: {
+ 'zh-CN': '列锚点',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['column-anchor.vue']
+ },
+ {
+ demoId: 'operation-column',
+ name: {
+ 'zh-CN': '操作列',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['operation-column.vue']
+ }
+ ],
+ apis: []
+}
diff --git a/examples/docs/resources/mobile-first/app/image/webdoc/image.cn.md b/examples/docs/resources/mobile-first/app/image/webdoc/image.cn.md
new file mode 100644
index 000000000..0baebc049
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/image/webdoc/image.cn.md
@@ -0,0 +1,9 @@
+---
+title: Image 图片预览
+---
+
+# Image 图片预览
+
+
+图片容器，在保留原生 img 的特性下，支持懒加载，自定义占位、加载失败等功能。
+
diff --git a/examples/docs/resources/mobile-first/app/image/webdoc/image.en.md b/examples/docs/resources/mobile-first/app/image/webdoc/image.en.md
new file mode 100644
index 000000000..0baebc049
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/image/webdoc/image.en.md
@@ -0,0 +1,9 @@
+---
+title: Image 图片预览
+---
+
+# Image 图片预览
+
+
+图片容器，在保留原生 img 的特性下，支持懒加载，自定义占位、加载失败等功能。
+
diff --git a/examples/docs/resources/mobile-first/app/image/webdoc/image.js b/examples/docs/resources/mobile-first/app/image/webdoc/image.js
new file mode 100644
index 000000000..afa43193b
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/image/webdoc/image.js
@@ -0,0 +1,57 @@
+export default {
+ column: '2',
+ owner: '',
+ demos: [
+ {
+ demoId: 'basic-usage',
+ name: {
+ 'zh-CN': '基本用法',
+ 'en-US': 'basic usage'
+ },
+ desc: {
+ 'zh-CN': '通过 `image-size` 设置预览的图片尺寸大小，通过`round`设置是否展示圆形。
',
+ 'en-US': 'button type
'
+ },
+ codeFiles: ['basic-usage.vue']
+ },
+
+ {
+ demoId: 'show-hover',
+ name: {
+ 'zh-CN': '图片悬浮',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过 `show-hover` 设置预览的图片的悬浮效果。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['show-hover.vue']
+ },
+ {
+ demoId: 'auto-fit-container-size',
+ name: {
+ 'zh-CN': '自适应容器尺寸',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '可通过 `fit` 属性确定图片如何适应到容器框，同原生 css 的 object-fit 属性。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['auto-fit-container-size.vue']
+ },
+ {
+ demoId: 'preview-src-list',
+ name: {
+ 'zh-CN': '预览大图',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过 `preview-src-list` 开启预览大图的功能，通过添加`show-index`开启图片序列号展示。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['preview-src-list.vue']
+ }
+ ],
+ apis: []
+}
diff --git a/examples/docs/resources/mobile-first/app/input/webdoc/input.cn.md b/examples/docs/resources/mobile-first/app/input/webdoc/input.cn.md
new file mode 100644
index 000000000..45bb9e1d0
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/input/webdoc/input.cn.md
@@ -0,0 +1,9 @@
+---
+title: Input 输入框
+---
+
+# Input 输入框
+
+
+通过鼠标或键盘输入字符。
+
diff --git a/examples/docs/resources/mobile-first/app/input/webdoc/input.en.md b/examples/docs/resources/mobile-first/app/input/webdoc/input.en.md
new file mode 100644
index 000000000..45bb9e1d0
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/input/webdoc/input.en.md
@@ -0,0 +1,9 @@
+---
+title: Input 输入框
+---
+
+# Input 输入框
+
+
+通过鼠标或键盘输入字符。
+
diff --git a/examples/docs/resources/mobile-first/app/input/webdoc/input.js b/examples/docs/resources/mobile-first/app/input/webdoc/input.js
new file mode 100644
index 000000000..3df544824
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/input/webdoc/input.js
@@ -0,0 +1,471 @@
+export default {
+ column: '2',
+ owner: '',
+ demos: [
+ {
+ demoId: 'basic-usage',
+ name: {
+ 'zh-CN': '基本用法',
+ 'en-US': 'basic usage'
+ },
+ desc: {
+ 'zh-CN': '
',
+ 'en-US': 'button type
'
+ },
+ codeFiles: ['basic-usage.vue']
+ },
+
+ {
+ demoId: 'clearable',
+ name: {
+ 'zh-CN': '可清空',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `clearable` 属性设置输入框显示清空图标按钮。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['clearable.vue']
+ },
+ {
+ demoId: 'show-password',
+ name: {
+ 'zh-CN': '密码显示',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '当 `type` 为 `password` 时，可通过 `show-password` 属性设置输入框显示密码显示/隐藏切换图标按钮。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['show-password.vue']
+ },
+ {
+ demoId: 'type',
+ name: {
+ 'zh-CN': 'type 属性',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '通对应的 type 属性，可以设置为对应的类型。默认为 text，可选值为 text，textarea 和其他 原生 input 的 type 值
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['type.vue']
+ },
+ {
+ demoId: 'size',
+ name: {
+ 'zh-CN': '尺寸',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '可通过 `size` 属性设置尺寸大小，可选值：`medium / small / mini`。注意：只在 `type!="textarea"` 时有效。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['size.vue']
+ },
+ {
+ demoId: 'form',
+ name: {
+ 'zh-CN': 'form',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `form` 属性设置原生属性 form 。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['form.vue']
+ },
+ {
+ demoId: 'enumnameeration',
+ name: {
+ 'zh-CN': 'name',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `name` 原生属性。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['name.vue']
+ },
+ {
+ demoId: 'label',
+ name: {
+ 'zh-CN': '输入框关联文字',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `label` 属性设置输入框关联的 label 文字。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['label.vue']
+ },
+ {
+ demoId: 'prefix-icon',
+ name: {
+ 'zh-CN': '头部图标',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `prefix-icon` 属性设置输入框头部图标。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['prefix-icon.vue']
+ },
+ {
+ demoId: 'suffix-icon',
+ name: {
+ 'zh-CN': '尾部图标',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': ' 可通过 `suffix-icon` 属性设置输入框尾部图标。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['suffix-icon.vue']
+ },
+ {
+ demoId: 'slot-prefix',
+ name: {
+ 'zh-CN': '可通过 slot="prefix" 设置头部图标',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['slot-prefix.vue']
+ },
+ {
+ demoId: 'slot-suffix',
+ name: {
+ 'zh-CN': '可通过 slot="suffix" 设置尾部图标',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['slot-suffix.vue']
+ },
+ {
+ demoId: 'resize',
+ name: {
+ 'zh-CN': '可缩放文本域',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '可通过 `resize` 属性设置文本域的缩放。可选值：`none / both / horizontal / vertical`。注意：只在 `type="textarea"` 时有效。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['resize.vue']
+ },
+ {
+ demoId: 'rows',
+ name: {
+ 'zh-CN': '文本域行数',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `rows` 属性设置文本域显示行数。注意：只在 `text="textarea"` 时有效。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['rows.vue']
+ },
+ {
+ demoId: 'cols',
+ name: {
+ 'zh-CN': '文本域宽度',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `cols` 属性设置文本域显示宽度。注意：只在 `text="textarea"` 时有效。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['cols.vue']
+ },
+ {
+ demoId: 'autosize',
+ name: {
+ 'zh-CN': '可自适应文本高度的文本域',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '可通过 `autosize` 属性设置文本域自适应内容高度。可传入对象，如`{ minRows: 2, maxRows: 6 }`。注意：只对 `type="textarea"` 有效。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['autosize.vue']
+ },
+ {
+ demoId: 'tabindex',
+ name: {
+ 'zh-CN': '输入框的 tabindex',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `tabindex` 属性设置输入框的 tabindex
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['tabindex.vue']
+ },
+ {
+ demoId: 'slot-prepend',
+ name: {
+ 'zh-CN': '前置内容',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '配置 `prepend` slot，设置输入框前置内容，注意：只对 `type="text"` 有效。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['slot-prepend.vue']
+ },
+ {
+ demoId: 'slot-append',
+ name: {
+ 'zh-CN': '后置内容',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '配置 `append` slot，设置输入框后置内容，注意：只对 `type="text"` 有效。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['slot-append.vue']
+ },
+ {
+ demoId: 'slot-prefix',
+ name: {
+ 'zh-CN': '头部内容',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '配置 `prefix` slot，设置输入框头部内容，注意：只对 `type="text"` 有效。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['slot-prefix.vue']
+ },
+ {
+ demoId: 'slot-suffix',
+ name: {
+ 'zh-CN': '尾部内容',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '配置 `suffix` slot，设置输入框尾部内容，注意：只对 `type="text"` 有效。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['slot-suffix.vue']
+ },
+ {
+ demoId: 'max',
+ name: {
+ 'zh-CN': '最大值',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `max` 属性设置输入框最大值。`max` 是原生属性。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['max.vue']
+ },
+ {
+ demoId: 'min',
+ name: {
+ 'zh-CN': '最小值',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `min` 属性设置输入框最小值。`min` 是原生属性。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['min.vue']
+ },
+ {
+ demoId: 'maxlength',
+ name: {
+ 'zh-CN': '最大输入长度',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `maxlength` 属性设置输入框最大输入长度。`maxlength` 是原生属性。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['maxlength.vue']
+ },
+ {
+ demoId: 'show-word-limit',
+ name: {
+ 'zh-CN': '输入字数统计',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '可通过 `show-word-limit` 属性设置是否显示输入字数统计，只在 type = "text" 或 type = "textarea" 时有效
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['show-word-limit.vue']
+ },
+ {
+ demoId: 'counter',
+ name: {
+ 'zh-CN': '计数器',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `counter` 属性设置显示输入框字符计数器。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['counter.vue']
+ },
+ {
+ demoId: 'step',
+ name: {
+ 'zh-CN': '输入字段的合法数字间隔',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `step` 属性设置输入字段的合法数字间隔。`step` 是原生属性。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['step.vue']
+ },
+ {
+ demoId: 'validate-event',
+ name: {
+ 'zh-CN': '输入时触发表单校验',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '可通过 `validate-event` 属性设置输入时触发表单校验。通过 `trigger` 配置触发校验规则的方式，为 `change` 时，当输入框值改变即触发校验，为 `blur` 时则失焦后触发校验。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['validate-event.vue']
+ },
+ {
+ demoId: 'autofocus',
+ name: {
+ 'zh-CN': '自动获取焦点',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `autofocus` 属性设置自动获取焦点。`autofocus` 是原生属性。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['autofocus.vue']
+ },
+ {
+ demoId: 'autocomplete',
+ name: {
+ 'zh-CN': '自动补全',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `autocomplete` 属性设置自动补全，默认值为 off ，可选 on 。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['autocomplete.vue']
+ },
+ {
+ demoId: 'event-blur',
+ name: {
+ 'zh-CN': '失焦事件',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '输入框失去焦点时触发 `blur` 事件。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['event-blur.vue']
+ },
+ {
+ demoId: 'event-change',
+ name: {
+ 'zh-CN': '值改变事件',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '输入框值改变时触发 `change` 事件。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['event-change.vue']
+ },
+ {
+ demoId: 'event-clear',
+ name: {
+ 'zh-CN': '清除事件',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '点击输入框清除按钮时触发 `clear` 事件。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['event-clear.vue']
+ },
+ {
+ demoId: 'event-focus',
+ name: {
+ 'zh-CN': '聚焦事件',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '输入框获取焦点时触发 `focus` 事件。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['event-focus.vue']
+ },
+ {
+ demoId: 'method-addMemory',
+ name: {
+ 'zh-CN': '记忆历史输入',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['method-addMemory.vue']
+ },
+ {
+ demoId: 'method-blur',
+ name: {
+ 'zh-CN': '失去焦点',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['method-blur.vue']
+ },
+ {
+ demoId: 'method-focus',
+ name: {
+ 'zh-CN': '获取焦点',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['method-focus.vue']
+ },
+ {
+ demoId: 'method-select',
+ name: {
+ 'zh-CN': '选中输入框文本',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['method-select.vue']
+ }
+ ],
+ apis: []
+}
diff --git a/examples/docs/resources/mobile-first/app/loading/webdoc/loading.cn.md b/examples/docs/resources/mobile-first/app/loading/webdoc/loading.cn.md
new file mode 100644
index 000000000..b33dedec4
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/loading/webdoc/loading.cn.md
@@ -0,0 +1,9 @@
+---
+title: Loading 加载
+---
+
+# Loading 加载
+
+
+加载数据时显示的动画效果。
+
diff --git a/examples/docs/resources/mobile-first/app/loading/webdoc/loading.en.md b/examples/docs/resources/mobile-first/app/loading/webdoc/loading.en.md
new file mode 100644
index 000000000..b33dedec4
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/loading/webdoc/loading.en.md
@@ -0,0 +1,9 @@
+---
+title: Loading 加载
+---
+
+# Loading 加载
+
+
+加载数据时显示的动画效果。
+
diff --git a/examples/docs/resources/mobile-first/app/loading/webdoc/loading.js b/examples/docs/resources/mobile-first/app/loading/webdoc/loading.js
new file mode 100644
index 000000000..0213f5e6f
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/loading/webdoc/loading.js
@@ -0,0 +1,118 @@
+export default {
+ column: '2',
+ owner: '',
+ demos: [
+ {
+ demoId: 'basic-usage',
+ name: {
+ 'zh-CN': '基本用法',
+ 'en-US': 'basic usage'
+ },
+ desc: {
+ 'zh-CN': '通过静态方法 `Loading.service` 在指定 `target` 上设置加载。
',
+ 'en-US': 'button type
'
+ },
+ codeFiles: ['basic-usage.vue']
+ },
+
+ {
+ demoId: 'loading-tip-text',
+ name: {
+ 'zh-CN': '自定义加载提示文本',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过 `text` 自定义加载文字的提示文本。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['loading-tip-text.vue']
+ },
+ {
+ demoId: 'background',
+ name: {
+ 'zh-CN': '自定义遮罩背景色',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过 `background` 自定义背景颜色和透明度。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['background.vue']
+ },
+ {
+ demoId: 'custom-class',
+ name: {
+ 'zh-CN': '自定义样式',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过 `customClass` 指定类名进行样式修改。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['custom-class.vue']
+ },
+ {
+ demoId: 'body',
+ name: {
+ 'zh-CN': '修饰符',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['body.vue']
+ },
+ {
+ demoId: 'fullscreen',
+ name: {
+ 'zh-CN': '全局加载',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '通过 `v-loading.lock.fullscreen` 指令方式或者服务方式进行全局加载，如需使用指令方式全局加载需要如下操作：
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['fullscreen.vue']
+ },
+ {
+ demoId: 'spinner',
+ name: {
+ 'zh-CN': '自定义加载图标',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过 `spinner` 自定义加载图标。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['spinner.vue']
+ },
+ {
+ demoId: 'target',
+ name: {
+ 'zh-CN': '区域加载',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过 `target` 指定 Loading 需要覆盖的 DOM 节点。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['target.vue']
+ },
+ {
+ demoId: 'loading-size',
+ name: {
+ 'zh-CN': '尺寸',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '通过在 `Loading.service` 中设置 `size` 属性加载不同的大小尺寸，包括 large、medium、small、mini 四种不同大小。不设置时为默认尺寸。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['loading-size.vue']
+ }
+ ],
+ apis: []
+}
diff --git a/examples/docs/resources/mobile-first/app/message/webdoc/message.cn.md b/examples/docs/resources/mobile-first/app/message/webdoc/message.cn.md
new file mode 100644
index 000000000..c4e993f36
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/message/webdoc/message.cn.md
@@ -0,0 +1,9 @@
+---
+title: Message 提示框
+---
+
+# Message 提示框
+
+
+
+
diff --git a/examples/docs/resources/mobile-first/app/message/webdoc/message.en.md b/examples/docs/resources/mobile-first/app/message/webdoc/message.en.md
new file mode 100644
index 000000000..c4e993f36
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/message/webdoc/message.en.md
@@ -0,0 +1,9 @@
+---
+title: Message 提示框
+---
+
+# Message 提示框
+
+
+
+
diff --git a/examples/docs/resources/mobile-first/app/message/webdoc/message.js b/examples/docs/resources/mobile-first/app/message/webdoc/message.js
new file mode 100644
index 000000000..e147cdfec
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/message/webdoc/message.js
@@ -0,0 +1,56 @@
+export default {
+ column: '2',
+ owner: '',
+ demos: [
+ {
+ demoId: 'base',
+ name: {
+ 'zh-CN': '基本用法',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `this.$message` 弹出信息提示框。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['base.vue']
+ },
+ {
+ demoId: 'duration',
+ name: {
+ 'zh-CN': '自动关闭延时',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `duration` 属性设置自动关闭的延迟时间，只对 type=message 有效。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['duration.vue']
+ },
+ {
+ demoId: 'status',
+ name: {
+ 'zh-CN': '消息状态',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '可通过 `status` 属性设置消息状态，可选值有 `info | success | warning | error `。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['status.vue']
+ },
+ {
+ demoId: 'id',
+ name: {
+ 'zh-CN': '防止重复提示',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '如果不想窗口重复点击，可以设置唯一的 `id` 防止重复提示，只对 type=message 有效。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['id.vue']
+ }
+ ],
+ apis: []
+}
diff --git a/examples/docs/resources/mobile-first/app/modal/webdoc/modal.cn.md b/examples/docs/resources/mobile-first/app/modal/webdoc/modal.cn.md
new file mode 100644
index 000000000..191718672
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/modal/webdoc/modal.cn.md
@@ -0,0 +1,9 @@
+---
+title: Modal 模态框
+---
+
+# Modal 模态框
+
+
+
+
diff --git a/examples/docs/resources/mobile-first/app/modal/webdoc/modal.en.md b/examples/docs/resources/mobile-first/app/modal/webdoc/modal.en.md
new file mode 100644
index 000000000..191718672
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/modal/webdoc/modal.en.md
@@ -0,0 +1,9 @@
+---
+title: Modal 模态框
+---
+
+# Modal 模态框
+
+
+
+
diff --git a/examples/docs/resources/mobile-first/app/modal/webdoc/modal.js b/examples/docs/resources/mobile-first/app/modal/webdoc/modal.js
new file mode 100644
index 000000000..1fd4bcca3
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/modal/webdoc/modal.js
@@ -0,0 +1,334 @@
+export default {
+ column: '2',
+ owner: '',
+ demos: [
+ {
+ demoId: 'base',
+ name: {
+ 'zh-CN': '基本用法',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `Modal.alert` 方法设置弹出框，通过 `Modal.confirm` 方法设置确认弹出框。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['base.vue']
+ },
+ {
+ demoId: 'div-button-content',
+ name: {
+ 'zh-CN': '按钮内容',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '可在 `Modal.alert` 方法里通过添加 `confirmContent` 属性设置确定按钮内容，通过 `cancelContent` 属性设置取消按钮内容。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['div-button-content.vue']
+ },
+ {
+ demoId: 'fullscreen',
+ name: {
+ 'zh-CN': '最大化显示',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `fullscreen` 属性设置是否最大化显示。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['fullscreen.vue']
+ },
+ {
+ demoId: 'esc-closable',
+ name: {
+ 'zh-CN': '按 Esc 键关闭弹出框',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `esc-closable` 属性设置是否允许按 Esc 键关闭窗口，默认为 `false`。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['esc-closable.vue']
+ },
+ {
+ demoId: 'duration',
+ name: {
+ 'zh-CN': '自动关闭延时',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `duration` 属性设置自动关闭的延迟时间，只对 type=message 有效。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['duration.vue']
+ },
+ {
+ demoId: 'id',
+ name: {
+ 'zh-CN': '防止重复提示',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '如果不想窗口重复点击，可以设置唯一的 `id` 防止重复提示，只对 type=message 有效。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['id.vue']
+ },
+ {
+ demoId: 'lock-scroll',
+ name: {
+ 'zh-CN': '锁住滚动条',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `lock-scroll` 属性设置是否锁住滚动条，不允许页面滚动。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['lock-scroll.vue']
+ },
+ {
+ demoId: 'lock-view',
+ name: {
+ 'zh-CN': '锁住页面',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `lock-view` 属性设置是否锁住页面，不允许窗口之外的任何操作。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['lock-view.vue']
+ },
+ {
+ demoId: 'mask-closable',
+ name: {
+ 'zh-CN': '点击遮罩层关闭窗口',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `mask-closable` 属性设置是否允许点击遮罩层关闭窗口。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['mask-closable.vue']
+ },
+ {
+ demoId: 'message',
+ name: {
+ 'zh-CN': '自定义内容',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `message` 属性设置窗口的内容。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['message.vue']
+ },
+ {
+ demoId: 'showFooter',
+ name: {
+ 'zh-CN': '不显示底部',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `showFooter` 属性设置是否显示底部，默认为 `true`。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['showFooter.vue']
+ },
+ {
+ demoId: 'showHeader',
+ name: {
+ 'zh-CN': '不显示头部',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `showHeader` 属性设置是否显示头部，默认为 `true`。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['showHeader.vue']
+ },
+ {
+ demoId: 'status',
+ name: {
+ 'zh-CN': '消息状态',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '可通过 `status` 属性设置消息状态，可选值有 `info | success | warning | error | loading | 自定义组件`，`status` 可以是自定义组件。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['status.vue']
+ },
+ {
+ demoId: 'title',
+ name: {
+ 'zh-CN': '标题',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `title` 属性设置窗口的标题。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['title.vue']
+ },
+ {
+ demoId: 'type',
+ name: {
+ 'zh-CN': '窗口类型',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `type` 属性设置窗口类型，可选值 `alert | confirm | message`。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['type.vue']
+ },
+ {
+ demoId: 'value',
+ name: {
+ 'zh-CN': '绑定值',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `v-model` 属性绑定值。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['value.vue']
+ },
+ {
+ demoId: 'zIndex',
+ name: {
+ 'zh-CN': '自定义堆叠顺序',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `zIndex` 属性设置自定义堆叠顺序（对于某些特殊场景，比如被遮挡时可能会用到）。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['zIndex.vue']
+ },
+ {
+ demoId: 'cancel-event',
+ name: {
+ 'zh-CN': '取消按钮事件',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '点击取消按钮时触发 `cancel` 事件。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['cancel-event.vue']
+ },
+ {
+ demoId: 'close-event',
+ name: {
+ 'zh-CN': '关闭按钮事件',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '点击关闭按钮时会触发 `close` 事件。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['close-event.vue']
+ },
+ {
+ demoId: 'confirm-event',
+ name: {
+ 'zh-CN': '确定按钮事件',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '点击确定按钮时会触发 `confirm` 事件。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['confirm-event.vue']
+ },
+ {
+ demoId: 'hide-event',
+ name: {
+ 'zh-CN': '窗口关闭事件',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '窗口关闭时会触发 `hide` 事件。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['hide-event.vue']
+ },
+ {
+ demoId: 'show-event',
+ name: {
+ 'zh-CN': '窗口显示事件',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '在窗口显示时会触发 `show` 事件。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['show-event.vue']
+ },
+ {
+ demoId: 'zoom-event',
+ name: {
+ 'zh-CN': '窗口缩放事件',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '窗口缩放时会触发 `zoom` 事件。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['zoom-event.vue']
+ },
+ {
+ demoId: 'value',
+ name: {
+ 'zh-CN': '默认插槽',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `templete` 设置默认插槽。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['value.vue']
+ },
+ {
+ demoId: 'footer-slot',
+ name: {
+ 'zh-CN': '底部插槽',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `slot="footer"` 设置底部插槽。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['footer-slot.vue']
+ },
+ {
+ demoId: 'grid',
+ name: {
+ 'zh-CN': '嵌套 grid',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过插槽嵌套 grid
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['grid.vue']
+ },
+ {
+ demoId: 'before-close',
+ name: {
+ 'zh-CN': '拦截弹窗关闭',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '通过 `before-close` 属性可以配置一个拦截弹窗关闭的方法。如果方法返回 false 值，则拦截弹窗关闭；否则不拦截
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['before-close.vue']
+ }
+ ],
+ apis: []
+}
diff --git a/examples/docs/resources/mobile-first/app/numeric/webdoc/numeric.cn.md b/examples/docs/resources/mobile-first/app/numeric/webdoc/numeric.cn.md
new file mode 100644
index 000000000..4cd2f7fc4
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/numeric/webdoc/numeric.cn.md
@@ -0,0 +1,9 @@
+---
+title: Numeric 计数器
+---
+
+# Numeric 计数器
+
+
+Numeric 计数器可用于输入数字,可自定义数值范围，步进大小。支持鼠标键盘增减。
+
diff --git a/examples/docs/resources/mobile-first/app/numeric/webdoc/numeric.en.md b/examples/docs/resources/mobile-first/app/numeric/webdoc/numeric.en.md
new file mode 100644
index 000000000..4cd2f7fc4
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/numeric/webdoc/numeric.en.md
@@ -0,0 +1,9 @@
+---
+title: Numeric 计数器
+---
+
+# Numeric 计数器
+
+
+Numeric 计数器可用于输入数字,可自定义数值范围，步进大小。支持鼠标键盘增减。
+
diff --git a/examples/docs/resources/mobile-first/app/numeric/webdoc/numeric.js b/examples/docs/resources/mobile-first/app/numeric/webdoc/numeric.js
new file mode 100644
index 000000000..5231386bd
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/numeric/webdoc/numeric.js
@@ -0,0 +1,117 @@
+export default {
+ column: '2',
+ owner: '',
+ demos: [
+ {
+ demoId: 'basic-usage',
+ name: {
+ 'zh-CN': '基本用法',
+ 'en-US': 'basic usage'
+ },
+ desc: {
+ 'zh-CN': '
',
+ 'en-US': 'button type
'
+ },
+ codeFiles: ['basic-usage.vue']
+ },
+
+ {
+ demoId: 'numeric-size',
+ name: {
+ 'zh-CN': '尺寸',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `size` 属性设置计数器尺寸。可取值 `medium`。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['numeric-size.vue']
+ },
+ {
+ demoId: 'dynamic-disabled',
+ name: {
+ 'zh-CN': '禁用',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过设置 disabled 控制是否禁用计数器
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['dynamic-disabled.vue']
+ },
+ {
+ demoId: 'max-min',
+ name: {
+ 'zh-CN': '数值循环',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '可通过设置 `max` 属性设置计数器允许的最大值，通过设置 `min` 属性设置计数器允许的最小值通过设置 `circulate` 属性设置是否循环，即数组首尾相连
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['max-min.vue']
+ },
+ {
+ demoId: 'about-step',
+ name: {
+ 'zh-CN': '步长',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `step` 属性设置计数器的步长。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['about-step.vue']
+ },
+ {
+ demoId: 'unit',
+ name: {
+ 'zh-CN': '数值单位',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `unit` 属性设置计数器的单位
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['unit.vue']
+ },
+ {
+ demoId: 'focus-event',
+ name: {
+ 'zh-CN': '聚焦事件',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '输入框获得焦点时触发 `focus` 事件。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['focus-event.vue']
+ },
+ {
+ demoId: 'blur-event',
+ name: {
+ 'zh-CN': '失焦事件',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '输入框失去焦点时触发 `blur` 事件。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['blur-event.vue']
+ },
+ {
+ demoId: 'change-event',
+ name: {
+ 'zh-CN': '值改变事件',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '输入框值被改变时触发 `change` 事件。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['change-event.vue']
+ }
+ ],
+ apis: []
+}
diff --git a/examples/docs/resources/mobile-first/app/pager/webdoc/pager.cn.md b/examples/docs/resources/mobile-first/app/pager/webdoc/pager.cn.md
new file mode 100644
index 000000000..4bcaf4016
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/pager/webdoc/pager.cn.md
@@ -0,0 +1,9 @@
+---
+title: Filter 过滤器
+---
+
+# Filter 过滤器
+
+
+
+
diff --git a/examples/docs/resources/mobile-first/app/pager/webdoc/pager.en.md b/examples/docs/resources/mobile-first/app/pager/webdoc/pager.en.md
new file mode 100644
index 000000000..4bcaf4016
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/pager/webdoc/pager.en.md
@@ -0,0 +1,9 @@
+---
+title: Filter 过滤器
+---
+
+# Filter 过滤器
+
+
+
+
diff --git a/examples/docs/resources/mobile-first/app/pager/webdoc/pager.js b/examples/docs/resources/mobile-first/app/pager/webdoc/pager.js
new file mode 100644
index 000000000..a358c3215
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/pager/webdoc/pager.js
@@ -0,0 +1,58 @@
+export default {
+ column: '2',
+ owner: '',
+ demos: [
+ {
+ demoId: 'basic-usage',
+ name: {
+ 'zh-CN': '基本用法',
+ 'en-US': 'basic usage'
+ },
+ desc: {
+ 'zh-CN':
+ '过滤类型 type 包括 单选、多选、枚举单选 (radio | checkbox | enum-radio)。
',
+ 'en-US': 'button type
'
+ },
+ codeFiles: ['basic-usage.vue']
+ },
+ {
+ demoId: 'column-num',
+ name: {
+ 'zh-CN': '面板每行标签数',
+ 'en-US': 'button round'
+ },
+ desc: {
+ 'zh-CN': '通过 column-num 属性设置面板每行标签数，默认值为 3。
',
+ 'en-US': 'button round
'
+ },
+ codeFiles: ['column-num.vue']
+ },
+ {
+ demoId: 'filter-group',
+ name: {
+ 'zh-CN': '过滤组',
+ 'en-US': '过滤组'
+ },
+ desc: {
+ 'zh-CN':
+ '通过 filter-group 属性开启过滤组功能，filter-value 绑定过滤组的值。过滤组类型 type 包括 单选、多选 (radio | checkbox)。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['filter-group.vue']
+ },
+ {
+ demoId: 'enumeration',
+ name: {
+ 'zh-CN': '枚举单选',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '设置过滤类型 type: "enum-radio" 时，当前数据为枚举单选，通过 showAll: true 显示 全部 选择项。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['enumeration.vue']
+ }
+ ],
+ apis: []
+}
diff --git a/examples/docs/resources/mobile-first/app/popconfirm/webdoc/popconfirm.cn.md b/examples/docs/resources/mobile-first/app/popconfirm/webdoc/popconfirm.cn.md
new file mode 100644
index 000000000..78b9ad437
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/popconfirm/webdoc/popconfirm.cn.md
@@ -0,0 +1,9 @@
+---
+title: Popconfirm 气泡确认框组件
+---
+
+# Popconfirm 气泡确认框组件
+
+
+
+
diff --git a/examples/docs/resources/mobile-first/app/popconfirm/webdoc/popconfirm.en.md b/examples/docs/resources/mobile-first/app/popconfirm/webdoc/popconfirm.en.md
new file mode 100644
index 000000000..78b9ad437
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/popconfirm/webdoc/popconfirm.en.md
@@ -0,0 +1,9 @@
+---
+title: Popconfirm 气泡确认框组件
+---
+
+# Popconfirm 气泡确认框组件
+
+
+
+
diff --git a/examples/docs/resources/mobile-first/app/popconfirm/webdoc/popconfirm.js b/examples/docs/resources/mobile-first/app/popconfirm/webdoc/popconfirm.js
new file mode 100644
index 000000000..066f9df8e
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/popconfirm/webdoc/popconfirm.js
@@ -0,0 +1,19 @@
+export default {
+ column: '2',
+ owner: '',
+ demos: [
+ {
+ demoId: 'basic-usage',
+ name: {
+ 'zh-CN': '基本用法',
+ 'en-US': 'basic usage'
+ },
+ desc: {
+ 'zh-CN': '
',
+ 'en-US': 'button type
'
+ },
+ codeFiles: ['basic-usage.vue']
+ }
+ ],
+ apis: []
+}
diff --git a/examples/docs/resources/mobile-first/app/popover/webdoc/popover.cn.md b/examples/docs/resources/mobile-first/app/popover/webdoc/popover.cn.md
new file mode 100644
index 000000000..79f3d1e02
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/popover/webdoc/popover.cn.md
@@ -0,0 +1,9 @@
+---
+title: Popover 气泡框
+---
+
+# Popover 气泡框
+
+
+Popover 可通过对一个触发源操作触发弹出框,支持自定义弹出内容，延迟触发和渐变动画
+
diff --git a/examples/docs/resources/mobile-first/app/popover/webdoc/popover.en.md b/examples/docs/resources/mobile-first/app/popover/webdoc/popover.en.md
new file mode 100644
index 000000000..79f3d1e02
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/popover/webdoc/popover.en.md
@@ -0,0 +1,9 @@
+---
+title: Popover 气泡框
+---
+
+# Popover 气泡框
+
+
+Popover 可通过对一个触发源操作触发弹出框,支持自定义弹出内容，延迟触发和渐变动画
+
diff --git a/examples/docs/resources/mobile-first/app/popover/webdoc/popover.js b/examples/docs/resources/mobile-first/app/popover/webdoc/popover.js
new file mode 100644
index 000000000..57781d5ba
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/popover/webdoc/popover.js
@@ -0,0 +1,203 @@
+export default {
+ column: '2',
+ owner: '',
+ demos: [
+ {
+ demoId: 'basic-usage',
+ name: {
+ 'zh-CN': '基本用法',
+ 'en-US': 'basic usage'
+ },
+ desc: {
+ 'zh-CN': '
',
+ 'en-US': 'button type
'
+ },
+ codeFiles: ['basic-usage.vue']
+ },
+
+ {
+ demoId: 'popover-content',
+ name: {
+ 'zh-CN': '添加内容',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '`content` 设置要显示的内容。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['popover-content.vue']
+ },
+ {
+ demoId: 'arrow-offset',
+ name: {
+ 'zh-CN': '箭头偏移',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '`arrow-offset` 在 Popover 的范围内，设置箭头的偏移量，来改变箭头的位置。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['arrow-offset.vue']
+ },
+ {
+ demoId: 'frame-offset',
+ name: {
+ 'zh-CN': '弹出框偏移',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '`offset` 在触发源的范围内，设置弹框的偏移量，来改变弹框的位置。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['frame-offset.vue']
+ },
+ {
+ demoId: 'close-delay',
+ name: {
+ 'zh-CN': '延迟隐藏',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '`close-delay` 弹出框延迟隐藏单位为毫秒(Number)
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['close-delay.vue']
+ },
+ {
+ demoId: 'dynamic-disable',
+ name: {
+ 'zh-CN': '禁用',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '`disabled` 设置是否禁用弹出框。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['dynamic-disable.vue']
+ },
+ {
+ demoId: 'open-delay',
+ name: {
+ 'zh-CN': '延迟显示',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '`open-delay`，设置延迟时间 ( type:number,单位毫秒 )
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['open-delay.vue']
+ },
+ {
+ demoId: 'popover-placement',
+ name: {
+ 'zh-CN': '显示位置',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '`placement` 设置弹出框的的位置,可选值为（to/top-start/top-end/bottom/bottom-start/bottom-end/left/left-start/left-end/right/right-start/right-end）
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['popover-placement.vue']
+ },
+ {
+ demoId: 'popper-class',
+ name: {
+ 'zh-CN': '自定义样式',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '`popper-class` 可配置单个或多个 class
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['popper-class.vue']
+ },
+ {
+ demoId: 'trigger-mode',
+ name: {
+ 'zh-CN': '触发方式',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '`trigger`设定弹出框的触发方式
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['trigger-mode.vue']
+ },
+ {
+ demoId: 'hidden-arrow',
+ name: {
+ 'zh-CN': '隐藏提示框箭头',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '`visible-arrow` 设定是否显示提示框的箭头
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['hidden-arrow.vue']
+ },
+ {
+ demoId: 'popover-width',
+ name: {
+ 'zh-CN': '宽度',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '`width` 弹出框的宽度
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['popover-width.vue']
+ },
+ {
+ demoId: 'popper-options',
+ name: {
+ 'zh-CN': '弹出框选项',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '`popper-options` 配置弹出框选项
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['popper-options.vue']
+ },
+ {
+ demoId: 'trigger-reference',
+ name: {
+ 'zh-CN': '触发源',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '`slot` 设置弹出框的触发源
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['trigger-reference.vue']
+ },
+ {
+ demoId: 'custom-tip-text',
+ name: {
+ 'zh-CN': '自定义提示文本',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '`content` 设置自定义文本，也可在标签内直接嵌套默认插槽为自定义文本
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['custom-tip-text.vue']
+ },
+ {
+ demoId: 'popover-events',
+ name: {
+ 'zh-CN': '事件',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '`hide` 隐藏时触发回调
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['popover-events.vue']
+ }
+ ],
+ apis: []
+}
diff --git a/examples/docs/resources/mobile-first/app/progress/webdoc/progress.cn.md b/examples/docs/resources/mobile-first/app/progress/webdoc/progress.cn.md
new file mode 100644
index 000000000..859b582a8
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/progress/webdoc/progress.cn.md
@@ -0,0 +1,9 @@
+---
+title: Progress 进度条
+---
+
+# Progress 进度条
+
+
+用于展示操作进度，告知用户当前状态和预期。
+
diff --git a/examples/docs/resources/mobile-first/app/progress/webdoc/progress.en.md b/examples/docs/resources/mobile-first/app/progress/webdoc/progress.en.md
new file mode 100644
index 000000000..859b582a8
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/progress/webdoc/progress.en.md
@@ -0,0 +1,9 @@
+---
+title: Progress 进度条
+---
+
+# Progress 进度条
+
+
+用于展示操作进度，告知用户当前状态和预期。
+
diff --git a/examples/docs/resources/mobile-first/app/progress/webdoc/progress.js b/examples/docs/resources/mobile-first/app/progress/webdoc/progress.js
new file mode 100644
index 000000000..ebd0b3520
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/progress/webdoc/progress.js
@@ -0,0 +1,129 @@
+export default {
+ column: '2',
+ owner: '',
+ demos: [
+ {
+ demoId: 'basic-usage',
+ name: {
+ 'zh-CN': '基本用法',
+ 'en-US': 'basic usage'
+ },
+ desc: {
+ 'zh-CN': '
',
+ 'en-US': 'button type
'
+ },
+ codeFiles: ['basic-usage.vue']
+ },
+
+ {
+ demoId: 'progress-type',
+ name: {
+ 'zh-CN': 'line 类型',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '`type="line"` 显示为 line 类型
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['progress-type.vue']
+ },
+ {
+ demoId: 'progress-type-circle',
+ name: {
+ 'zh-CN': 'circle 类型',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '`type="circle"` 显示为 circle 类型。`width`可以调整环形进度条画布宽度，默认值为 96px。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['progress-type-circle.vue']
+ },
+ {
+ demoId: 'progress-size',
+ name: {
+ 'zh-CN': '尺寸',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '`size` 进度条的大小（small/medium/large）
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['progress-size.vue']
+ },
+ {
+ demoId: 'progress-width',
+ name: {
+ 'zh-CN': '自定义宽度',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '`stroke-width`自定义进度条的宽度，单位 px
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['progress-width.vue']
+ },
+ {
+ demoId: 'progress-status',
+ name: {
+ 'zh-CN': '状态',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '`status` 进度条当前状态（success/exception/warning）
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['progress-status.vue']
+ },
+ {
+ demoId: 'text-inside-or-no-text',
+ name: {
+ 'zh-CN': '文字内显或不显',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '`show-text` 是否显示进度条文字内容
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['text-inside-or-no-text.vue']
+ },
+ {
+ demoId: 'custom-color',
+ name: {
+ 'zh-CN': '自定义颜色',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过 `color` 设置进度条颜色。color 进度条背景色（会覆盖 status 状态颜色）
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['custom-color.vue']
+ },
+ {
+ demoId: 'format-text',
+ name: {
+ 'zh-CN': '自定义显示文字',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '`text-inside` 进度条显示文字内置在进度条内（只在 type=line 时可用），`format`自定义进度条的文字
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['format-text.vue']
+ },
+ {
+ demoId: 'dynamic-control-changes',
+ name: {
+ 'zh-CN': '动态控制进度条变化',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过设置 `percentage` 动态控制进度条变化
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['dynamic-control-changes.vue']
+ }
+ ],
+ apis: []
+}
diff --git a/examples/docs/resources/mobile-first/app/radio-block/webdoc/radio-block.cn.md b/examples/docs/resources/mobile-first/app/radio-block/webdoc/radio-block.cn.md
new file mode 100644
index 000000000..4bcaf4016
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/radio-block/webdoc/radio-block.cn.md
@@ -0,0 +1,9 @@
+---
+title: Filter 过滤器
+---
+
+# Filter 过滤器
+
+
+
+
diff --git a/examples/docs/resources/mobile-first/app/radio-block/webdoc/radio-block.en.md b/examples/docs/resources/mobile-first/app/radio-block/webdoc/radio-block.en.md
new file mode 100644
index 000000000..4bcaf4016
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/radio-block/webdoc/radio-block.en.md
@@ -0,0 +1,9 @@
+---
+title: Filter 过滤器
+---
+
+# Filter 过滤器
+
+
+
+
diff --git a/examples/docs/resources/mobile-first/app/radio-block/webdoc/radio-block.js b/examples/docs/resources/mobile-first/app/radio-block/webdoc/radio-block.js
new file mode 100644
index 000000000..a358c3215
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/radio-block/webdoc/radio-block.js
@@ -0,0 +1,58 @@
+export default {
+ column: '2',
+ owner: '',
+ demos: [
+ {
+ demoId: 'basic-usage',
+ name: {
+ 'zh-CN': '基本用法',
+ 'en-US': 'basic usage'
+ },
+ desc: {
+ 'zh-CN':
+ '过滤类型 type 包括 单选、多选、枚举单选 (radio | checkbox | enum-radio)。
',
+ 'en-US': 'button type
'
+ },
+ codeFiles: ['basic-usage.vue']
+ },
+ {
+ demoId: 'column-num',
+ name: {
+ 'zh-CN': '面板每行标签数',
+ 'en-US': 'button round'
+ },
+ desc: {
+ 'zh-CN': '通过 column-num 属性设置面板每行标签数，默认值为 3。
',
+ 'en-US': 'button round
'
+ },
+ codeFiles: ['column-num.vue']
+ },
+ {
+ demoId: 'filter-group',
+ name: {
+ 'zh-CN': '过滤组',
+ 'en-US': '过滤组'
+ },
+ desc: {
+ 'zh-CN':
+ '通过 filter-group 属性开启过滤组功能，filter-value 绑定过滤组的值。过滤组类型 type 包括 单选、多选 (radio | checkbox)。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['filter-group.vue']
+ },
+ {
+ demoId: 'enumeration',
+ name: {
+ 'zh-CN': '枚举单选',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '设置过滤类型 type: "enum-radio" 时，当前数据为枚举单选，通过 showAll: true 显示 全部 选择项。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['enumeration.vue']
+ }
+ ],
+ apis: []
+}
diff --git a/examples/docs/resources/mobile-first/app/radio/webdoc/radio.cn.md b/examples/docs/resources/mobile-first/app/radio/webdoc/radio.cn.md
new file mode 100644
index 000000000..364a3699b
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/radio/webdoc/radio.cn.md
@@ -0,0 +1,9 @@
+---
+title: Radio 单选框
+---
+
+# Radio 单选框
+
+
+用于配置不同场景的选项，在一组备选项中进行单选
+
diff --git a/examples/docs/resources/mobile-first/app/radio/webdoc/radio.en.md b/examples/docs/resources/mobile-first/app/radio/webdoc/radio.en.md
new file mode 100644
index 000000000..364a3699b
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/radio/webdoc/radio.en.md
@@ -0,0 +1,9 @@
+---
+title: Radio 单选框
+---
+
+# Radio 单选框
+
+
+用于配置不同场景的选项，在一组备选项中进行单选
+
diff --git a/examples/docs/resources/mobile-first/app/radio/webdoc/radio.js b/examples/docs/resources/mobile-first/app/radio/webdoc/radio.js
new file mode 100644
index 000000000..e8c730948
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/radio/webdoc/radio.js
@@ -0,0 +1,107 @@
+export default {
+ column: '2',
+ owner: '',
+ demos: [
+ {
+ demoId: 'basic-usage',
+ name: {
+ 'zh-CN': '基本用法',
+ 'en-US': 'basic usage'
+ },
+ desc: {
+ 'zh-CN':
+ '通过 `v-model` 绑定变量，设置的变量值为默认选中的 Radio，变量值对应 `label` 属性的值。通过 `text` 也可以配置显示文本，与默认插槽配置纯文本的结果一致
',
+ 'en-US': 'button type
'
+ },
+ codeFiles: ['basic-usage.vue']
+ },
+
+ {
+ demoId: 'group-options',
+ name: {
+ 'zh-CN': '配置式单选组',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '提供 `options` 属性，支持通过配置对象数组数据的形式来渲染单选组。使用该属性后，可以不用再在标签中以插槽的形式插入 `` 或 `` 标签。',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['group-options.vue']
+ },
+ {
+ demoId: 'dynamic-disable',
+ name: {
+ 'zh-CN': '禁用状态',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '设置 `disabled` 属性即可启动禁用状态，默认为 false 。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['dynamic-disable.vue']
+ },
+ {
+ demoId: 'vertical',
+ name: {
+ 'zh-CN': '垂直布局',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可在 RadioGroup 组件上设置 `vertical` 属性，使单选框垂直布局。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['vertical.vue']
+ },
+ {
+ demoId: 'radio-text',
+ name: {
+ 'zh-CN': '文字内容',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可在 Radio 组件上设置 `text` 属性，设置内容。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['radio-text.vue']
+ },
+ {
+ demoId: 'radio-events',
+ name: {
+ 'zh-CN': '单选框事件',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '可在 Radio、RadioGroup 组件上设置 `change` 事件，当绑定值变化时触发，回调函数为选中的 Radio label 值。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['radio-events.vue']
+ },
+ {
+ demoId: 'radio-default',
+ name: {
+ 'zh-CN': '默认插槽',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过 `default` 默认插槽列表。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['radio-default.vue']
+ },
+ {
+ demoId: 'read-only',
+ name: {
+ 'zh-CN': '只读',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过添加`display-only`,给单选框增加只读属性。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['read-only.vue']
+ }
+ ],
+ apis: []
+}
diff --git a/examples/docs/resources/mobile-first/app/rate/webdoc/rate.cn.md b/examples/docs/resources/mobile-first/app/rate/webdoc/rate.cn.md
new file mode 100644
index 000000000..f5a3b35c9
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/rate/webdoc/rate.cn.md
@@ -0,0 +1,9 @@
+---
+title: Rate 评分
+---
+
+# Rate 评分
+
+
+Rate 快速评级，对评价进行展示。
+
diff --git a/examples/docs/resources/mobile-first/app/rate/webdoc/rate.en.md b/examples/docs/resources/mobile-first/app/rate/webdoc/rate.en.md
new file mode 100644
index 000000000..f5a3b35c9
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/rate/webdoc/rate.en.md
@@ -0,0 +1,9 @@
+---
+title: Rate 评分
+---
+
+# Rate 评分
+
+
+Rate 快速评级，对评价进行展示。
+
diff --git a/examples/docs/resources/mobile-first/app/rate/webdoc/rate.js b/examples/docs/resources/mobile-first/app/rate/webdoc/rate.js
new file mode 100644
index 000000000..939f1b222
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/rate/webdoc/rate.js
@@ -0,0 +1,225 @@
+export default {
+ column: '2',
+ owner: '',
+ demos: [
+ {
+ demoId: 'basic-usage',
+ name: {
+ 'zh-CN': '基本用法',
+ 'en-US': 'basic usage'
+ },
+ desc: {
+ 'zh-CN': '
',
+ 'en-US': 'button type
'
+ },
+ codeFiles: ['basic-usage.vue']
+ },
+
+ {
+ demoId: 'custom-3-threshold-colors',
+ name: {
+ 'zh-CN': '自定义 3 分段颜色',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `colors` 定义 3 分段颜色。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['custom-3-threshold-colors.vue']
+ },
+ {
+ demoId: 'disabled-not-selected-color',
+ name: {
+ 'zh-CN': '禁用时未选中图标颜色',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `disabled-void-color` 自定义禁用时未选中图标颜色。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['disabled-not-selected-color.vue']
+ },
+ {
+ demoId: 'disabled-not-selected-class',
+ name: {
+ 'zh-CN': '禁用时未选中图标类名',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `disabled-void-icon-class` 自定义禁用时未选中图标类名。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['disabled-not-selected-class.vue']
+ },
+ {
+ demoId: 'custom-3-threshold-icon.vue',
+ name: {
+ 'zh-CN': '自定义 3 分段图标样式',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `icon-classes` 自定义 3 分段图标样式。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['custom-3-threshold-icon.vue.vue']
+ },
+ {
+ demoId: 'texts-and-text-color',
+ name: {
+ 'zh-CN': '辅助文字及颜色',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '可通过 `texts show-text text-color` 三个属性分别设置辅助文字内容、是否显示辅助文字及辅助文字颜色。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['texts-and-text-color.vue']
+ },
+ {
+ demoId: 'size',
+ name: {
+ 'zh-CN': '尺寸',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `type` 设置尺寸 `large small(默认)` 。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['size.vue']
+ },
+ {
+ demoId: 'not-selected-color',
+ name: {
+ 'zh-CN': '未选中图标颜色',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `void-color` 定义未选中图标颜色。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['not-selected-color.vue']
+ },
+ {
+ demoId: 'not-selected-class',
+ name: {
+ 'zh-CN': '未选中图标类名',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `void-icon-class` 定义未选中图标类名。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['not-selected-class.vue']
+ },
+ {
+ demoId: 'text-on-bottom',
+ name: {
+ 'zh-CN': '图标下文字提示',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `text-on-bottom` 定义是否在图标下显示文字提示。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['text-on-bottom.vue']
+ },
+ {
+ demoId: 'allow-half',
+ name: {
+ 'zh-CN': '半选',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `allow-half` 定义是否支持半选。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['allow-half.vue']
+ },
+ {
+ demoId: 'enumeration',
+ name: {
+ 'zh-CN': '枚举单选',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '设置过滤类型
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['enumeration.vue']
+ },
+ {
+ demoId: 'dynamic-disable',
+ name: {
+ 'zh-CN': '禁用',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `disabled` 定义是否禁用。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['dynamic-disable.vue']
+ },
+ {
+ demoId: 'show-score',
+ name: {
+ 'zh-CN': '分数显示',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `show-score score-template` 分别定义是否显示分数和显示的模板。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['show-score.vue']
+ },
+ {
+ demoId: 'radio-rate',
+ name: {
+ 'zh-CN': '单选模式',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `radio` 设置单选模式。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['radio-rate.vue']
+ },
+ {
+ demoId: 'max-score',
+ name: {
+ 'zh-CN': '最大分值',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `max` 设置最大分值。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['max-score.vue']
+ },
+ {
+ demoId: 'threshold-value',
+ name: {
+ 'zh-CN': '界限值',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `low-threshold high-threshold` 分别设置下限值和上限值，通过`colors`配置显示星的颜色
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['threshold-value.vue']
+ },
+ {
+ demoId: 'rate-events',
+ name: {
+ 'zh-CN': '事件',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '监听 `change` 事件触发处理方法。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['rate-events.vue']
+ }
+ ],
+ apis: []
+}
diff --git a/examples/docs/resources/mobile-first/app/record/webdoc/record.cn.md b/examples/docs/resources/mobile-first/app/record/webdoc/record.cn.md
new file mode 100644
index 000000000..2645db085
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/record/webdoc/record.cn.md
@@ -0,0 +1,9 @@
+---
+title: Record 录音
+---
+
+# Record 录音
+
+
+Record 语音录入。
+
diff --git a/examples/docs/resources/mobile-first/app/record/webdoc/record.en.md b/examples/docs/resources/mobile-first/app/record/webdoc/record.en.md
new file mode 100644
index 000000000..2645db085
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/record/webdoc/record.en.md
@@ -0,0 +1,9 @@
+---
+title: Record 录音
+---
+
+# Record 录音
+
+
+Record 语音录入。
+
diff --git a/examples/docs/resources/mobile-first/app/record/webdoc/record.js b/examples/docs/resources/mobile-first/app/record/webdoc/record.js
new file mode 100644
index 000000000..066f9df8e
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/record/webdoc/record.js
@@ -0,0 +1,19 @@
+export default {
+ column: '2',
+ owner: '',
+ demos: [
+ {
+ demoId: 'basic-usage',
+ name: {
+ 'zh-CN': '基本用法',
+ 'en-US': 'basic usage'
+ },
+ desc: {
+ 'zh-CN': '
',
+ 'en-US': 'button type
'
+ },
+ codeFiles: ['basic-usage.vue']
+ }
+ ],
+ apis: []
+}
diff --git a/examples/docs/resources/mobile-first/app/scrollbar/webdoc/scrollbar.cn.md b/examples/docs/resources/mobile-first/app/scrollbar/webdoc/scrollbar.cn.md
new file mode 100644
index 000000000..edf895006
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/scrollbar/webdoc/scrollbar.cn.md
@@ -0,0 +1,9 @@
+---
+title: Scrollbar 滚动条
+---
+
+# Scrollbar 滚动条
+
+
+提供各个浏览器下，风格统一，更美观的滚动条。
+
diff --git a/examples/docs/resources/mobile-first/app/scrollbar/webdoc/scrollbar.en.md b/examples/docs/resources/mobile-first/app/scrollbar/webdoc/scrollbar.en.md
new file mode 100644
index 000000000..edf895006
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/scrollbar/webdoc/scrollbar.en.md
@@ -0,0 +1,9 @@
+---
+title: Scrollbar 滚动条
+---
+
+# Scrollbar 滚动条
+
+
+提供各个浏览器下，风格统一，更美观的滚动条。
+
diff --git a/examples/docs/resources/mobile-first/app/scrollbar/webdoc/scrollbar.js b/examples/docs/resources/mobile-first/app/scrollbar/webdoc/scrollbar.js
new file mode 100644
index 000000000..d3d1b67c0
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/scrollbar/webdoc/scrollbar.js
@@ -0,0 +1,31 @@
+export default {
+ column: '2',
+ owner: '',
+ demos: [
+ {
+ demoId: 'basic-usage',
+ name: {
+ 'zh-CN': '基本用法',
+ 'en-US': ''
+ },
+ desc: {
+ 'zh-CN': '
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['basic-usage.vue']
+ },
+ {
+ demoId: 'horizon',
+ name: {
+ 'zh-CN': '水平滚动条',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['horizon.vue']
+ }
+ ],
+ apis: []
+}
diff --git a/examples/docs/resources/mobile-first/app/search/webdoc/search.cn.md b/examples/docs/resources/mobile-first/app/search/webdoc/search.cn.md
new file mode 100644
index 000000000..953269549
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/search/webdoc/search.cn.md
@@ -0,0 +1,9 @@
+---
+title: Search 搜索
+---
+
+# Search 搜索
+
+
+指定条件对象进行搜索数据。
+
diff --git a/examples/docs/resources/mobile-first/app/search/webdoc/search.en.md b/examples/docs/resources/mobile-first/app/search/webdoc/search.en.md
new file mode 100644
index 000000000..953269549
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/search/webdoc/search.en.md
@@ -0,0 +1,9 @@
+---
+title: Search 搜索
+---
+
+# Search 搜索
+
+
+指定条件对象进行搜索数据。
+
diff --git a/examples/docs/resources/mobile-first/app/search/webdoc/search.js b/examples/docs/resources/mobile-first/app/search/webdoc/search.js
new file mode 100644
index 000000000..d1ac88163
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/search/webdoc/search.js
@@ -0,0 +1,176 @@
+export default {
+ column: '2',
+ owner: '',
+ demos: [
+ {
+ demoId: 'basic-usage',
+ name: {
+ 'zh-CN': '基本用法',
+ 'en-US': 'basic usage'
+ },
+ desc: {
+ 'zh-CN': '
',
+ 'en-US': 'button type
'
+ },
+ codeFiles: ['basic-usage.vue']
+ },
+
+ {
+ demoId: 'clearable',
+ name: {
+ 'zh-CN': '可清除',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `clearable` 属性设置显示清空图标按钮。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['clearable.vue']
+ },
+ {
+ demoId: 'mini-mode',
+ name: {
+ 'zh-CN': '迷你模式',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `mini` 设置组件为 mini 模式。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['mini-mode.vue']
+ },
+ {
+ demoId: 'transparent-mode',
+ name: {
+ 'zh-CN': '透明模式',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `transparent` 设置组件为透明模式（`mini`模式下有效）。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['transparent-mode.vue']
+ },
+ {
+ demoId: 'default-value',
+ name: {
+ 'zh-CN': '默认值搜索',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `v-model` 配置组件默认搜索条件。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['default-value.vue']
+ },
+ {
+ demoId: 'search-types',
+ name: {
+ 'zh-CN': '搜索类型',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `search-types` 配置组件可选的搜索类型。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['search-types.vue']
+ },
+ {
+ demoId: 'enter-search',
+ name: {
+ 'zh-CN': '回车搜索',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `is-enter-search` 属性设置按回车键后触发搜索。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['enter-search.vue']
+ },
+ {
+ demoId: 'custom-search-types',
+ name: {
+ 'zh-CN': '自定义搜索类型的内容',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['custom-search-types.vue']
+ },
+ {
+ demoId: 'show-selected-types',
+ name: {
+ 'zh-CN': '自定义搜索类型选择后的展示',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['show-selected-types.vue']
+ },
+ {
+ demoId: 'search-events',
+ name: {
+ 'zh-CN': 'search 事件',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['search-events.vue']
+ },
+ {
+ demoId: 'change-events',
+ name: {
+ 'zh-CN': 'change 事件',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['change-events.vue']
+ },
+ {
+ demoId: 'select-events',
+ name: {
+ 'zh-CN': 'select 事件',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['select-events.vue']
+ },
+ {
+ demoId: 'button-search',
+ name: {
+ 'zh-CN': '按钮搜索',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `show-button` 属性对移动端设置按钮搜索。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['button-search.vue']
+ },
+ {
+ demoId: 'change-bg',
+ name: {
+ 'zh-CN': '切换背景色',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `change-bg-color` 属性切换背景色。(只针对移动端有效)
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['change-bg.vue']
+ }
+ ],
+ apis: []
+}
diff --git a/examples/docs/resources/mobile-first/app/select-mobile/webdoc/select-mobile.cn.md b/examples/docs/resources/mobile-first/app/select-mobile/webdoc/select-mobile.cn.md
new file mode 100644
index 000000000..1caa4ca55
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/select-mobile/webdoc/select-mobile.cn.md
@@ -0,0 +1,9 @@
+---
+title: SelectMobile 面板选择器组件
+---
+
+# SelectMobile 面板选择器组件
+
+
+
+
diff --git a/examples/docs/resources/mobile-first/app/select-mobile/webdoc/select-mobile.en.md b/examples/docs/resources/mobile-first/app/select-mobile/webdoc/select-mobile.en.md
new file mode 100644
index 000000000..1caa4ca55
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/select-mobile/webdoc/select-mobile.en.md
@@ -0,0 +1,9 @@
+---
+title: SelectMobile 面板选择器组件
+---
+
+# SelectMobile 面板选择器组件
+
+
+
+
diff --git a/examples/docs/resources/mobile-first/app/select-mobile/webdoc/select-mobile.js b/examples/docs/resources/mobile-first/app/select-mobile/webdoc/select-mobile.js
new file mode 100644
index 000000000..f8b476b25
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/select-mobile/webdoc/select-mobile.js
@@ -0,0 +1,45 @@
+export default {
+ column: '2',
+ owner: '',
+ demos: [
+ {
+ demoId: 'basic-usage',
+ name: {
+ 'zh-CN': '基本用法',
+ 'en-US': 'basic usage'
+ },
+ desc: {
+ 'zh-CN': '
',
+ 'en-US': 'button type
'
+ },
+ codeFiles: ['basic-usage.vue']
+ },
+
+ {
+ demoId: 'multiple',
+ name: {
+ 'zh-CN': '多选',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '通过添加属性 `multiple`，开启多选功能。 通过 `@update:text` 事件接收选中项的 `textField` 文本信息，`text-split` 设置文本分隔符，默认值为 `; `。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['multiple.vue']
+ },
+ {
+ demoId: 'ellipsis',
+ name: {
+ 'zh-CN': '内容超出隐藏',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '添加属性 `ellipsis` 选项内容会超出隐藏。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['ellipsis.vue']
+ }
+ ],
+ apis: []
+}
diff --git a/examples/docs/resources/mobile-first/app/select-view/webdoc/select-view.cn.md b/examples/docs/resources/mobile-first/app/select-view/webdoc/select-view.cn.md
new file mode 100644
index 000000000..0e760852d
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/select-view/webdoc/select-view.cn.md
@@ -0,0 +1,9 @@
+---
+title: SelectView 页面选择器组件
+---
+
+# SelectView 页面选择器组件
+
+
+
+
diff --git a/examples/docs/resources/mobile-first/app/select-view/webdoc/select-view.en.md b/examples/docs/resources/mobile-first/app/select-view/webdoc/select-view.en.md
new file mode 100644
index 000000000..0e760852d
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/select-view/webdoc/select-view.en.md
@@ -0,0 +1,9 @@
+---
+title: SelectView 页面选择器组件
+---
+
+# SelectView 页面选择器组件
+
+
+
+
diff --git a/examples/docs/resources/mobile-first/app/select-view/webdoc/select-view.js b/examples/docs/resources/mobile-first/app/select-view/webdoc/select-view.js
new file mode 100644
index 000000000..466470eb0
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/select-view/webdoc/select-view.js
@@ -0,0 +1,83 @@
+export default {
+ column: '2',
+ owner: '',
+ demos: [
+ {
+ demoId: 'basic-usage',
+ name: {
+ 'zh-CN': '基本用法',
+ 'en-US': 'basic usage'
+ },
+ desc: {
+ 'zh-CN': '
',
+ 'en-US': 'button type
'
+ },
+ codeFiles: ['basic-usage.vue']
+ },
+
+ {
+ demoId: 'field',
+ name: {
+ 'zh-CN': '显示三个字段两行',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['field.vue']
+ },
+ {
+ demoId: 'multiple',
+ name: {
+ 'zh-CN': '多选',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['multiple.vue']
+ },
+ {
+ demoId: 'multiple-required',
+ name: {
+ 'zh-CN': '必选项',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '添加 `required-selected-list` 属性开启必选项列表，开启 `multiple` 多选时有效。可通过事件 `search-click` 的第二个返回参数判断是否操作成功，必选项不能取消勾选。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['multiple-required.vue']
+ },
+ {
+ demoId: 'text',
+ name: {
+ 'zh-CN': '文本信息',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '通过 `@update:text` 事件接收选中项的 `textField` 文本信息，`text-split` 设置文本分隔符，默认值为 `;`。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['text.vue']
+ },
+ {
+ demoId: 'infinit-scroll',
+ name: {
+ 'zh-CN': '无限滚动',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '配置 `infinite-scroll` 属性开启无限滚动，配置参数 `{ load: () => {}, delay: 200, disabled: false, distance: 0, immediate: true }`，可参考 `InfiniteScroll 无限滚动` 组件文档。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['infinit-scroll.vue']
+ }
+ ],
+ apis: []
+}
diff --git a/examples/docs/resources/mobile-first/app/selected-box/webdoc/selected-box.cn.md b/examples/docs/resources/mobile-first/app/selected-box/webdoc/selected-box.cn.md
new file mode 100644
index 000000000..4bcaf4016
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/selected-box/webdoc/selected-box.cn.md
@@ -0,0 +1,9 @@
+---
+title: Filter 过滤器
+---
+
+# Filter 过滤器
+
+
+
+
diff --git a/examples/docs/resources/mobile-first/app/selected-box/webdoc/selected-box.en.md b/examples/docs/resources/mobile-first/app/selected-box/webdoc/selected-box.en.md
new file mode 100644
index 000000000..4bcaf4016
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/selected-box/webdoc/selected-box.en.md
@@ -0,0 +1,9 @@
+---
+title: Filter 过滤器
+---
+
+# Filter 过滤器
+
+
+
+
diff --git a/examples/docs/resources/mobile-first/app/selected-box/webdoc/selected-box.js b/examples/docs/resources/mobile-first/app/selected-box/webdoc/selected-box.js
new file mode 100644
index 000000000..a358c3215
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/selected-box/webdoc/selected-box.js
@@ -0,0 +1,58 @@
+export default {
+ column: '2',
+ owner: '',
+ demos: [
+ {
+ demoId: 'basic-usage',
+ name: {
+ 'zh-CN': '基本用法',
+ 'en-US': 'basic usage'
+ },
+ desc: {
+ 'zh-CN':
+ '过滤类型 type 包括 单选、多选、枚举单选 (radio | checkbox | enum-radio)。
',
+ 'en-US': 'button type
'
+ },
+ codeFiles: ['basic-usage.vue']
+ },
+ {
+ demoId: 'column-num',
+ name: {
+ 'zh-CN': '面板每行标签数',
+ 'en-US': 'button round'
+ },
+ desc: {
+ 'zh-CN': '通过 column-num 属性设置面板每行标签数，默认值为 3。
',
+ 'en-US': 'button round
'
+ },
+ codeFiles: ['column-num.vue']
+ },
+ {
+ demoId: 'filter-group',
+ name: {
+ 'zh-CN': '过滤组',
+ 'en-US': '过滤组'
+ },
+ desc: {
+ 'zh-CN':
+ '通过 filter-group 属性开启过滤组功能，filter-value 绑定过滤组的值。过滤组类型 type 包括 单选、多选 (radio | checkbox)。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['filter-group.vue']
+ },
+ {
+ demoId: 'enumeration',
+ name: {
+ 'zh-CN': '枚举单选',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '设置过滤类型 type: "enum-radio" 时，当前数据为枚举单选，通过 showAll: true 显示 全部 选择项。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['enumeration.vue']
+ }
+ ],
+ apis: []
+}
diff --git a/examples/docs/resources/mobile-first/app/slider/webdoc/slider.cn.md b/examples/docs/resources/mobile-first/app/slider/webdoc/slider.cn.md
new file mode 100644
index 000000000..6923694ae
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/slider/webdoc/slider.cn.md
@@ -0,0 +1,9 @@
+---
+title: Slider 滑块
+---
+
+# Slider 滑块
+
+
+通过鼠标滑动滑块来确定位置和大小。多种形式，横向、纵向和范围滑块。
+
diff --git a/examples/docs/resources/mobile-first/app/slider/webdoc/slider.en.md b/examples/docs/resources/mobile-first/app/slider/webdoc/slider.en.md
new file mode 100644
index 000000000..6923694ae
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/slider/webdoc/slider.en.md
@@ -0,0 +1,9 @@
+---
+title: Slider 滑块
+---
+
+# Slider 滑块
+
+
+通过鼠标滑动滑块来确定位置和大小。多种形式，横向、纵向和范围滑块。
+
diff --git a/examples/docs/resources/mobile-first/app/slider/webdoc/slider.js b/examples/docs/resources/mobile-first/app/slider/webdoc/slider.js
new file mode 100644
index 000000000..901d97d9d
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/slider/webdoc/slider.js
@@ -0,0 +1,192 @@
+export default {
+ column: '2',
+ owner: '',
+ demos: [
+ {
+ demoId: 'basic-usage',
+ name: {
+ 'zh-CN': '基本用法',
+ 'en-US': 'basic usage'
+ },
+ desc: {
+ 'zh-CN': '
',
+ 'en-US': 'button type
'
+ },
+ codeFiles: ['basic-usage.vue']
+ },
+
+ {
+ demoId: 'max-min',
+ name: {
+ 'zh-CN': '最大最小值',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过设置`min` `max` 来设置滑块取值范围
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['max-min.vue']
+ },
+ {
+ demoId: 'format-tooltip',
+ name: {
+ 'zh-CN': '当前值',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过设置`format-tooltip` 来属性设置 value
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['format-tooltip.vue']
+ },
+ {
+ demoId: 'range-select',
+ name: {
+ 'zh-CN': '范围选择',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过`v-model` 为数组 设定初始范围选择
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['range-select.vue']
+ },
+ {
+ demoId: 'show-input',
+ name: {
+ 'zh-CN': '输入框模式',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '通过配置`show-input`，开启滑块输入框模式。可以通过`unit`属性设置输入框后面显示的单位，默认为 `%`
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['show-input.vue']
+ },
+ {
+ demoId: 'show-graduate',
+ name: {
+ 'zh-CN': '显示刻度',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '通过设置`show-steps` 属性来显示刻度，需结合 step 一起使用，显示的刻度个数为 `max / step`，最前与最后的刻度默认不显示
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['show-graduate.vue']
+ },
+ {
+ demoId: 'show-label',
+ name: {
+ 'zh-CN': '显示 Label',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '通过设置`show-label` 属性来显示 Label，需结合`show-steps`一起使用可以通过`format-label` 函数自定义想要显示的 label
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['show-label.vue']
+ },
+ {
+ demoId: 'dynamic-disable',
+ name: {
+ 'zh-CN': '禁用',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过设置属性`disabled` ,设置滑动滑块禁止滑动
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['dynamic-disable.vue']
+ },
+ {
+ demoId: 'show-tip',
+ name: {
+ 'zh-CN': '提示',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过设定`:show-tip="false"`，关闭滑块提示。(默认开启)
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['show-tip.vue']
+ },
+ {
+ demoId: 'about-step',
+ name: {
+ 'zh-CN': '步长',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过设置`step`来配置滑块滑动的步长
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['about-step.vue']
+ },
+ {
+ demoId: 'slider-event-change',
+ name: {
+ 'zh-CN': 'change 事件',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['slider-event-change.vue']
+ },
+ {
+ demoId: 'slider-event-start',
+ name: {
+ 'zh-CN': 'start 滑块开始滑动事件',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['slider-event-start.vue']
+ },
+ {
+ demoId: 'slider-event-stop',
+ name: {
+ 'zh-CN': 'stop 滑块停止滑动事件',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['slider-event-stop.vue']
+ },
+ {
+ demoId: 'slider-slot',
+ name: {
+ 'zh-CN': '默认插槽',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '默认插槽`default` 在滑块的尾部
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['slider-slot.vue']
+ },
+ {
+ demoId: 'left-right-slot',
+ name: {
+ 'zh-CN': '左右插槽',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '左插槽`left`，右插槽`right`，注意这两个插槽只在移动端展示，PC 端默认是隐藏的，如果想要看效果请将页面缩小至移动端大小。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['left-right-slot.vue']
+ }
+ ],
+ apis: []
+}
diff --git a/examples/docs/resources/mobile-first/app/standard-list-item/webdoc/standard-list-item.cn.md b/examples/docs/resources/mobile-first/app/standard-list-item/webdoc/standard-list-item.cn.md
new file mode 100644
index 000000000..9079c050a
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/standard-list-item/webdoc/standard-list-item.cn.md
@@ -0,0 +1,9 @@
+---
+title: StandardListItem 标准列表项
+---
+
+# StandardListItem 标准列表项
+
+
+
+
diff --git a/examples/docs/resources/mobile-first/app/standard-list-item/webdoc/standard-list-item.en.md b/examples/docs/resources/mobile-first/app/standard-list-item/webdoc/standard-list-item.en.md
new file mode 100644
index 000000000..9079c050a
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/standard-list-item/webdoc/standard-list-item.en.md
@@ -0,0 +1,9 @@
+---
+title: StandardListItem 标准列表项
+---
+
+# StandardListItem 标准列表项
+
+
+
+
diff --git a/examples/docs/resources/mobile-first/app/standard-list-item/webdoc/standard-list-item.js b/examples/docs/resources/mobile-first/app/standard-list-item/webdoc/standard-list-item.js
new file mode 100644
index 000000000..5dd925a86
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/standard-list-item/webdoc/standard-list-item.js
@@ -0,0 +1,81 @@
+export default {
+ column: '2',
+ owner: '',
+ demos: [
+ {
+ demoId: 'basic-usage',
+ name: {
+ 'zh-CN': '基本用法',
+ 'en-US': 'basic usage'
+ },
+ desc: {
+ 'zh-CN':
+ '通过设置`:show-image="true"`可以显示图片区域
',
+ 'en-US': 'button type
'
+ },
+ codeFiles: ['basic-usage.vue']
+ },
+
+ {
+ demoId: 'type',
+ name: {
+ 'zh-CN': '设置类型',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过 `type` 属性可以设置标准列表项的模式，支持 card 和 list 两种模式。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['type.vue']
+ },
+ {
+ demoId: 'content-slot',
+ name: {
+ 'zh-CN': '内容区插槽',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过 `#default` 可以设置内容区插槽，`#tag` 可以设置标签插槽。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['content-slot.vue']
+ },
+ {
+ demoId: 'icon-click-event',
+ name: {
+ 'zh-CN': '操作列按钮点击事件',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过 `icon-click` 给按钮加点击事件。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['icon-click-event.vue']
+ },
+ {
+ demoId: 'icon-disabled',
+ name: {
+ 'zh-CN': '操作列按钮隐藏与禁用',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '操作列配置项 `options` 中添加属性 hidden 可以隐藏按钮，可以通过 disabled 属性禁用操作按钮。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['icon-disabled.vue']
+ },
+ {
+ demoId: 'image-operate-slot',
+ name: {
+ 'zh-CN': '头像和操作列插槽',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过 `#image` 可以设置头像插槽，通过 `#operate` 可以设置操作列插槽。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['image-operate-slot.vue']
+ }
+ ],
+ apis: []
+}
diff --git a/examples/docs/resources/mobile-first/app/steps/webdoc/steps.cn.md b/examples/docs/resources/mobile-first/app/steps/webdoc/steps.cn.md
new file mode 100644
index 000000000..25bedc4a6
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/steps/webdoc/steps.cn.md
@@ -0,0 +1,17 @@
+---
+title: Steps 步骤条
+---
+
+# Steps 步骤条
+
+
+ 属性说明
+vertical：是否开启垂直单链型，默认值为 false；
+active：当前活动的节点；
+nameField：节点名称的映射字段，默认值为 name；
+statusField：节点状态的映射字段，默认值为 status，状态的可选值有：doing | done | error | disabled | 空字符串；
+descriptionField：节点描述的映射字段，默认值为 description，仅单链型有效；
+visibleNum：节点描述的映射字段，默认值为 5；
+data：节点列表；
+duration：节点滚动的持续时间（单位 ms），默认值为 300，仅高级向导模式有效。
+
diff --git a/examples/docs/resources/mobile-first/app/steps/webdoc/steps.en.md b/examples/docs/resources/mobile-first/app/steps/webdoc/steps.en.md
new file mode 100644
index 000000000..25bedc4a6
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/steps/webdoc/steps.en.md
@@ -0,0 +1,17 @@
+---
+title: Steps 步骤条
+---
+
+# Steps 步骤条
+
+
+ 属性说明
+vertical：是否开启垂直单链型，默认值为 false；
+active：当前活动的节点；
+nameField：节点名称的映射字段，默认值为 name；
+statusField：节点状态的映射字段，默认值为 status，状态的可选值有：doing | done | error | disabled | 空字符串；
+descriptionField：节点描述的映射字段，默认值为 description，仅单链型有效；
+visibleNum：节点描述的映射字段，默认值为 5；
+data：节点列表；
+duration：节点滚动的持续时间（单位 ms），默认值为 300，仅高级向导模式有效。
+
diff --git a/examples/docs/resources/mobile-first/app/steps/webdoc/steps.js b/examples/docs/resources/mobile-first/app/steps/webdoc/steps.js
new file mode 100644
index 000000000..5a2471bb0
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/steps/webdoc/steps.js
@@ -0,0 +1,132 @@
+export default {
+ column: '2',
+ owner: '',
+ demos: [
+ {
+ demoId: 'data-resource',
+ name: {
+ 'zh-CN': '横向单链型',
+ 'en-US': 'basic usage'
+ },
+ desc: {
+ 'zh-CN': '默认显示横向单链型
',
+ 'en-US': 'button type
'
+ },
+ codeFiles: ['data-resource.vue']
+ },
+ {
+ demoId: 'vertical',
+ name: {
+ 'zh-CN': '垂直单链型',
+ 'en-US': 'button round'
+ },
+ desc: {
+ 'zh-CN': '添加 `vertical` 属性开启垂直单链型，通过 `visible-num` 属性设置显示的节点数，默认为 5。
',
+ 'en-US': 'button round
'
+ },
+ codeFiles: ['vertical.vue']
+ },
+ {
+ demoId: 'advanced-steps',
+ name: {
+ 'zh-CN': '高级向导1',
+ 'en-US': ''
+ },
+ desc: {
+ 'zh-CN': '添加属性 `advanced` 启用高级向导功能。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['advanced-steps.vue']
+ },
+ {
+ demoId: 'advanced-flex',
+ name: {
+ 'zh-CN': '高级向导2',
+ 'en-US': ''
+ },
+ desc: {
+ 'zh-CN': '添加属性 `flex` 开启总宽度响应，节点等宽，撑满父容器，节点名称超出省略，默认值为 `false`。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['advanced-flex.vue']
+ },
+ {
+ demoId: 'advanced-no-arrow',
+ name: {
+ 'zh-CN': '高级向导3',
+ 'en-US': ''
+ },
+ desc: {
+ 'zh-CN':
+ '添加属性 `no-arrow` 隐藏左右箭头，在 PC 端按住 `shift+鼠标滚轮` 进行节点左右滚动，移动端触屏左右滑动即可。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['advanced-no-arrow.vue']
+ },
+
+ {
+ demoId: 'slot-item',
+ name: {
+ 'zh-CN': '插槽1',
+ 'en-US': ''
+ },
+ desc: {
+ 'zh-CN': '`item` 节点插槽。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['slot-item.vue']
+ },
+ {
+ demoId: 'slot',
+ name: {
+ 'zh-CN': '插槽2',
+ 'en-US': ''
+ },
+ desc: {
+ 'zh-CN': '`prefix` 前置插槽，仅开启 `advanced` 高级向导模式有效。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['slot.vue']
+ },
+ {
+ demoId: 'slot-bottom',
+ name: {
+ 'zh-CN': '插槽3',
+ 'en-US': ''
+ },
+ desc: {
+ 'zh-CN': '`block-bottom` 滚动块底部插槽，仅开启 `advanced` 高级向导模式有效。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['slot-bottom.vue']
+ },
+
+ {
+ demoId: 'duration',
+ name: {
+ 'zh-CN': '节点滚动时间',
+ 'en-US': ''
+ },
+ desc: {
+ 'zh-CN':
+ '`duration` 设置节点左右滚动的持续时间，默认值为 300（单位 ms），设置 0 则无滚动动画，仅开启 `advanced` 高级向导模式有效。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['duration.vue']
+ },
+
+ {
+ demoId: 'complicated',
+ name: {
+ 'zh-CN': '综合示例',
+ 'en-US': ''
+ },
+ desc: {
+ 'zh-CN': '综合示例
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['complicated.vue']
+ }
+ ],
+ apis: []
+}
diff --git a/examples/docs/resources/mobile-first/app/switch/webdoc/switch.cn.md b/examples/docs/resources/mobile-first/app/switch/webdoc/switch.cn.md
new file mode 100644
index 000000000..c2715e255
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/switch/webdoc/switch.cn.md
@@ -0,0 +1,9 @@
+---
+title: Switch 开关
+---
+
+# Switch 开关
+
+
+Switch 在两种状态间切换选择。
+
diff --git a/examples/docs/resources/mobile-first/app/switch/webdoc/switch.en.md b/examples/docs/resources/mobile-first/app/switch/webdoc/switch.en.md
new file mode 100644
index 000000000..c2715e255
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/switch/webdoc/switch.en.md
@@ -0,0 +1,9 @@
+---
+title: Switch 开关
+---
+
+# Switch 开关
+
+
+Switch 在两种状态间切换选择。
+
diff --git a/examples/docs/resources/mobile-first/app/switch/webdoc/switch.js b/examples/docs/resources/mobile-first/app/switch/webdoc/switch.js
new file mode 100644
index 000000000..3b27b12ed
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/switch/webdoc/switch.js
@@ -0,0 +1,106 @@
+export default {
+ column: '2',
+ owner: '',
+ demos: [
+ {
+ demoId: 'basic-usage',
+ name: {
+ 'zh-CN': '基本用法',
+ 'en-US': 'basic usage'
+ },
+ desc: {
+ 'zh-CN': '
',
+ 'en-US': 'button type
'
+ },
+ codeFiles: ['basic-usage.vue']
+ },
+
+ {
+ demoId: 'mini-mode',
+ name: {
+ 'zh-CN': '迷你尺寸',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '设置是否为 mini 模式，默认为 false。当设置 `mini` 为 `true` 且处于移动端时，开关会变为 mini 尺寸。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['mini-mode.vue']
+ },
+ {
+ demoId: 'icon-mode',
+ name: {
+ 'zh-CN': '图标开关',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '设置是否显示为图标模式。当设置 `types` 为 `icon` 时，显示为带图标的开关。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['icon-mode.vue']
+ },
+ {
+ demoId: 'word-mode',
+ name: {
+ 'zh-CN': '文本模式',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '设置是否显示为文字模式。当设置 `types` 为 `word` 时，显示为带文字的开关。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['word-mode.vue']
+ },
+ {
+ demoId: 'loading-mode',
+ name: {
+ 'zh-CN': '加载态开关',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '设置是否显示为加载模式。当设置 `types` 为 `loading` 时，显示为加载态的开关。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['loading-mode.vue']
+ },
+ {
+ demoId: 'dynamic-disable',
+ name: {
+ 'zh-CN': '禁用状态',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '`disable` 属性表示的是当前状态是无法被使用的，默认值为 false(true/false)。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['dynamic-disable.vue']
+ },
+ {
+ demoId: 'custom-open-close',
+ name: {
+ 'zh-CN': '自定义开关显示',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '在文字模式中，通过具名插槽 open 和 close 自定义 Switch 显示。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['custom-open-close.vue']
+ },
+ {
+ demoId: 'custom-true-false-value',
+ name: {
+ 'zh-CN': '自定义开关取值',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '`通过 true-value 和 false-value 属性设置 Switch 在开和关状态下的不同取值。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['custom-true-false-value.vue']
+ }
+ ],
+ apis: []
+}
diff --git a/examples/docs/resources/mobile-first/app/tabs/webdoc/tabs.cn.md b/examples/docs/resources/mobile-first/app/tabs/webdoc/tabs.cn.md
new file mode 100644
index 000000000..d77db3e82
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/tabs/webdoc/tabs.cn.md
@@ -0,0 +1,9 @@
+---
+title: Tabs 标签页
+---
+
+# Tabs 标签页
+
+
+分隔内容上有关联但属于不同类别的数据集合。
+
diff --git a/examples/docs/resources/mobile-first/app/tabs/webdoc/tabs.en.md b/examples/docs/resources/mobile-first/app/tabs/webdoc/tabs.en.md
new file mode 100644
index 000000000..d77db3e82
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/tabs/webdoc/tabs.en.md
@@ -0,0 +1,9 @@
+---
+title: Tabs 标签页
+---
+
+# Tabs 标签页
+
+
+分隔内容上有关联但属于不同类别的数据集合。
+
diff --git a/examples/docs/resources/mobile-first/app/tabs/webdoc/tabs.js b/examples/docs/resources/mobile-first/app/tabs/webdoc/tabs.js
new file mode 100644
index 000000000..9ebcea5fc
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/tabs/webdoc/tabs.js
@@ -0,0 +1,204 @@
+export default {
+ column: '2',
+ owner: '',
+ demos: [
+ {
+ demoId: 'mobile-first',
+ name: {
+ 'zh-CN': '基本用法',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '通过 `v-model` 设置初始激活的标签页，绑定的值对应 `tiny-tab-item` 元素中 `name` 属性的值。一个 `tiny-tab-item` 为一个标签页，通过 `title` 属性设置标签页标题。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['mobile-first.vue']
+ },
+ {
+ demoId: 'align-center',
+ name: {
+ 'zh-CN': '居中对齐',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '在小屏下，页签项较少并且可以完全显示时，页签项默认居中对齐。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['align-center.vue']
+ },
+ {
+ demoId: 'tab-style-card',
+ name: {
+ 'zh-CN': 'card 类型',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过 `tab-style` 设置标签页风格类型，默认为 `card` 通过 `active-name` 设置初始激活的标签页 。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['tab-style-card.vue']
+ },
+ {
+ demoId: 'tab-style-bordercard',
+ name: {
+ 'zh-CN': 'bordercard 类型',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过 `tab-style` 设置标签页风格类型为 `bordercard` 。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['tab-style-bordercard.vue']
+ },
+ {
+ demoId: 'with-add',
+ name: {
+ 'zh-CN': '标签页可增加',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '设置 `with-add` 属性启用标签可增加功能。同时通过 `add` 事件自定义实现增加标签页的逻辑。配置 `show-more-tabs` 属性后当标签页超过一定宽度时将显示 `更多` 按钮。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['with-add.vue']
+ },
+ {
+ demoId: 'tabs-events-close',
+ name: {
+ 'zh-CN': '标签页可关闭',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过 `withClose` 属性设置是否可关闭标签页。同时可通过 `close` 事件自定义实现关闭标签页的逻辑。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['tabs-events-close.vue']
+ },
+ {
+ demoId: 'before-leave',
+ name: {
+ 'zh-CN': '离开前事件',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '`before-leave` 切换标签之前的钩子函数，若返回 false 或者返回 Promise 且被 reject，则阻止切换，返回 true 则可以切换。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['before-leave.vue']
+ },
+ {
+ demoId: 'stretch-wh',
+ name: {
+ 'zh-CN': '可自动撑开',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '`stretch` 属性设置标签的宽度是否自撑开，默认为 false 。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['stretch-wh.vue']
+ },
+ {
+ demoId: 'tabs-events-add',
+ name: {
+ 'zh-CN': 'add 事件',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '点击新增按钮增加标签页时触发 `add` 事件
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['tabs-events-add.vue']
+ },
+ {
+ demoId: 'tabs-events-click',
+ name: {
+ 'zh-CN': 'click 事件',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '单击标签页时触发 `click` 事件
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['tabs-events-click.vue']
+ },
+ {
+ demoId: 'tabs-events-close',
+ name: {
+ 'zh-CN': 'close 事件',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '关闭标签页时触发 `close` 事件
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['tabs-events-close.vue']
+ },
+ {
+ demoId: 'custom-tab-title',
+ name: {
+ 'zh-CN': '自定义标签页标题',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过 `tiny-tab-item` 的 `title` 插槽自定义标签页标题，比如在标题前增加图标。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['custom-tab-title.vue']
+ },
+ {
+ demoId: 'tabdata-title',
+ name: {
+ 'zh-CN': '循环创建标签页',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过 `v-for` 根据数据循环创建多个 `tiny-tab-item` 。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['tabdata-title.vue']
+ },
+ {
+ demoId: 'show-echarts',
+ name: {
+ 'zh-CN': '标签页切换显示不同图表',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ 'Tabs 组件里使用 Chart 组件要调用 Chart 实例方法 `resize()`，例如示例中的 `this.$refs.firstChart.resize()`，这样才能让 Chart 自适应父元素响应变化。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['show-echarts.vue']
+ },
+ {
+ demoId: 'show-different-grid-data',
+ name: {
+ 'zh-CN': '标签页切换不同 Grid',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ 'Tabs 组件里使用 Grid 组件需要 Grid 设置属性 `:auto-resize="true"`，这样才能让 Grid 自适应父元素响应变化。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['show-different-grid-data.vue']
+ },
+ {
+ demoId: 'tabs-tabs',
+ name: {
+ 'zh-CN': '标签页嵌套',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': ' 可将 子 tabs 作为 父 tabs 的 tab-item 嵌套显示标签页
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['tabs-tabs.vue']
+ }
+ ],
+ apis: []
+}
diff --git a/examples/docs/resources/mobile-first/app/tag-group/webdoc/tag-group.cn.md b/examples/docs/resources/mobile-first/app/tag-group/webdoc/tag-group.cn.md
new file mode 100644
index 000000000..e982071a4
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/tag-group/webdoc/tag-group.cn.md
@@ -0,0 +1,9 @@
+---
+title: TagGroup 标签组
+---
+
+# TagGroup 标签组
+
+
+TagGroup 标签组，用于标记事物的属性和维度
+
diff --git a/examples/docs/resources/mobile-first/app/tag-group/webdoc/tag-group.en.md b/examples/docs/resources/mobile-first/app/tag-group/webdoc/tag-group.en.md
new file mode 100644
index 000000000..e982071a4
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/tag-group/webdoc/tag-group.en.md
@@ -0,0 +1,9 @@
+---
+title: TagGroup 标签组
+---
+
+# TagGroup 标签组
+
+
+TagGroup 标签组，用于标记事物的属性和维度
+
diff --git a/examples/docs/resources/mobile-first/app/tag-group/webdoc/tag-group.js b/examples/docs/resources/mobile-first/app/tag-group/webdoc/tag-group.js
new file mode 100644
index 000000000..880b1cd5a
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/tag-group/webdoc/tag-group.js
@@ -0,0 +1,70 @@
+export default {
+ column: '2',
+ owner: '',
+ demos: [
+ {
+ demoId: 'basic-usage',
+ name: {
+ 'zh-CN': '基本用法',
+ 'en-US': 'basic usage'
+ },
+ desc: {
+ 'zh-CN': '
',
+ 'en-US': 'button type
'
+ },
+ codeFiles: ['basic-usage.vue']
+ },
+
+ {
+ demoId: 'tag-group-type',
+ name: {
+ 'zh-CN': '类型',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '`type`可以为标签设置相应的类型，可选值（success / warning / alerting / error / info / default），默认值为 info。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['tag-group-type.vue']
+ },
+ {
+ demoId: 'tag-group-size',
+ name: {
+ 'zh-CN': '尺寸',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `size` 设置 TagGroup 标签组标签大小，可选值（medium / small / mini），默认值为 medium。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['tag-group-size.vue']
+ },
+ {
+ demoId: 'tag-group-effect',
+ name: {
+ 'zh-CN': '主题',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '可通过 `effect` 设置 TagGroup 标签组 标签主题，可选值（dark / light / plain），默认值为 light。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['tag-group-effect.vue']
+ },
+ {
+ demoId: 'tag-group-event',
+ name: {
+ 'zh-CN': 'Click 事件',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': 'TagGroup 标签组提供了`item-click`事件，`item-click`事件默认提供的参数有 `item,index,event`
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['tag-group-event.vue']
+ }
+ ],
+ apis: []
+}
diff --git a/examples/docs/resources/mobile-first/app/tag/webdoc/tag.cn.md b/examples/docs/resources/mobile-first/app/tag/webdoc/tag.cn.md
new file mode 100644
index 000000000..5e75e1dee
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/tag/webdoc/tag.cn.md
@@ -0,0 +1,9 @@
+---
+title: Tag 标签
+---
+
+# Tag 标签
+
+
+Tag 标签组件，用于标记事物的属性和维度
+
diff --git a/examples/docs/resources/mobile-first/app/tag/webdoc/tag.en.md b/examples/docs/resources/mobile-first/app/tag/webdoc/tag.en.md
new file mode 100644
index 000000000..5e75e1dee
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/tag/webdoc/tag.en.md
@@ -0,0 +1,9 @@
+---
+title: Tag 标签
+---
+
+# Tag 标签
+
+
+Tag 标签组件，用于标记事物的属性和维度
+
diff --git a/examples/docs/resources/mobile-first/app/tag/webdoc/tag.js b/examples/docs/resources/mobile-first/app/tag/webdoc/tag.js
new file mode 100644
index 000000000..7aba014cb
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/tag/webdoc/tag.js
@@ -0,0 +1,153 @@
+export default {
+ column: '2',
+ owner: '',
+ demos: [
+ {
+ demoId: 'basic-usage',
+ name: {
+ 'zh-CN': '基本用法',
+ 'en-US': 'basic usage'
+ },
+ desc: {
+ 'zh-CN': '
',
+ 'en-US': 'button type
'
+ },
+ codeFiles: ['basic-usage.vue']
+ },
+
+ {
+ demoId: 'color3',
+ name: {
+ 'zh-CN': '颜色',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `color` 设置标签背景色。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['color3.vue']
+ },
+ {
+ demoId: 'hit',
+ name: {
+ 'zh-CN': '边框',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `hit` 设置标签边框，可选值（true/false）true 为有边框，false 无边框,默认值为 false。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['hit.vue']
+ },
+ {
+ demoId: 'tag-size',
+ name: {
+ 'zh-CN': '尺寸',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `size` 设置 Tag 标签大小，可选值（medium / small / mini），默认值为 medium。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['tag-size.vue']
+ },
+ {
+ demoId: 'effect',
+ name: {
+ 'zh-CN': '主题',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '可通过 `effect` 设置 Tag 标签主题，可选值（dark / light / plain），默认值为 light。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['effect.vue']
+ },
+ {
+ demoId: 'create',
+ name: {
+ 'zh-CN': '动态编辑标签',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过点击`+ New Tag`在文本框中输入你要定义的标签名就能在标签列表中最后一个创建标签 。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['create.vue']
+ },
+ {
+ demoId: 'closeable',
+ name: {
+ 'zh-CN': '可移除标签',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '`closable` 属性可以为标签设置成可去除标签。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['closeable.vue']
+ },
+ {
+ demoId: 'tag-event-click',
+ name: {
+ 'zh-CN': 'Click 事件',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '设置过滤类型
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['tag-event-click.vue']
+ },
+ {
+ demoId: 'tag-event-close',
+ name: {
+ 'zh-CN': 'Close 事件',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '设置过滤类型
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['tag-event-close.vue']
+ },
+ {
+ demoId: 'tag-selectable',
+ name: {
+ 'zh-CN': '标签可选中',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '标签加上 selectable 属性可开启选中功能
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['tag-selectable.vue']
+ },
+ {
+ demoId: 'colorful-tag',
+ name: {
+ 'zh-CN': '多彩标签',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `theme` 设置其他颜色的标签，目前新增的彩色标签有 pink、purple、cyan。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['colorful-tag.vue']
+ },
+ {
+ demoId: 'content',
+ name: {
+ 'zh-CN': '属性传值显示内容',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过绑定`value`属性设置自定义内容
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['content.vue']
+ }
+ ],
+ apis: []
+}
diff --git a/examples/docs/resources/mobile-first/app/time-line/webdoc/time-line.cn.md b/examples/docs/resources/mobile-first/app/time-line/webdoc/time-line.cn.md
new file mode 100644
index 000000000..3cee5f448
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/time-line/webdoc/time-line.cn.md
@@ -0,0 +1,9 @@
+---
+title: TimeLine 时间线
+---
+
+# TimeLine 时间线
+
+
+
+
diff --git a/examples/docs/resources/mobile-first/app/time-line/webdoc/time-line.en.md b/examples/docs/resources/mobile-first/app/time-line/webdoc/time-line.en.md
new file mode 100644
index 000000000..3cee5f448
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/time-line/webdoc/time-line.en.md
@@ -0,0 +1,9 @@
+---
+title: TimeLine 时间线
+---
+
+# TimeLine 时间线
+
+
+
+
diff --git a/examples/docs/resources/mobile-first/app/time-line/webdoc/time-line.js b/examples/docs/resources/mobile-first/app/time-line/webdoc/time-line.js
new file mode 100644
index 000000000..5fbd52068
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/time-line/webdoc/time-line.js
@@ -0,0 +1,93 @@
+export default {
+ column: '2',
+ owner: '',
+ demos: [
+ {
+ demoId: 'basic-usage',
+ name: {
+ 'zh-CN': '基本用法',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过 `data` 属性设置时间线步骤条数据
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['basic-usage.vue']
+ },
+ {
+ demoId: 'sub-field',
+ name: {
+ 'zh-CN': '两侧分布',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过 `sub-field` 属性设置时间线两侧展示。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['sub-field.vue']
+ },
+ {
+ demoId: 'single-status',
+ name: {
+ 'zh-CN': '单状态时间轴',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过在`data`里面的属性`autoColor`设置自定义图标
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['single-status.vue']
+ },
+ {
+ demoId: 'many-status',
+ name: {
+ 'zh-CN': '多状态时间轴',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '通过在`data`里面的属性`autoColor`设置自定义状态。对应场景： `success` ：成功 `error` ：失败 `info` ：等待
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['many-status.vue']
+ },
+ {
+ demoId: 'node-toset',
+ name: {
+ 'zh-CN': '节点配置图标',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过在`data`里面的属性`autoColor`设置自定义图标
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['node-toset.vue']
+ },
+ {
+ demoId: 'fold-time',
+ name: {
+ 'zh-CN': '折叠时间轴',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '当节点超过七项时，自动折叠节点，仅展示最近三项，点击后展开
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['fold-time.vue']
+ },
+ {
+ demoId: 'auto-slot',
+ name: {
+ 'zh-CN': '自定义插槽',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '通过 `slot` 为 `left` 可以自定义步骤条右侧内容。`data`中自定义属性名应避免`name`(正标题)、`tips`(副标题)、`time`(时间)属性
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['auto-slot.vue']
+ }
+ ],
+ apis: []
+}
diff --git a/examples/docs/resources/mobile-first/app/time-picker-mobile/webdoc/time-picker-mobile.cn.md b/examples/docs/resources/mobile-first/app/time-picker-mobile/webdoc/time-picker-mobile.cn.md
new file mode 100644
index 000000000..c2ba1f6b2
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/time-picker-mobile/webdoc/time-picker-mobile.cn.md
@@ -0,0 +1,9 @@
+---
+title: TimePickerMobile 时间选择器组件
+---
+
+# TimePickerMobile 时间选择器组件
+
+
+
+
diff --git a/examples/docs/resources/mobile-first/app/time-picker-mobile/webdoc/time-picker-mobile.en.md b/examples/docs/resources/mobile-first/app/time-picker-mobile/webdoc/time-picker-mobile.en.md
new file mode 100644
index 000000000..c2ba1f6b2
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/time-picker-mobile/webdoc/time-picker-mobile.en.md
@@ -0,0 +1,9 @@
+---
+title: TimePickerMobile 时间选择器组件
+---
+
+# TimePickerMobile 时间选择器组件
+
+
+
+
diff --git a/examples/docs/resources/mobile-first/app/time-picker-mobile/webdoc/time-picker-mobile.js b/examples/docs/resources/mobile-first/app/time-picker-mobile/webdoc/time-picker-mobile.js
new file mode 100644
index 000000000..066f9df8e
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/time-picker-mobile/webdoc/time-picker-mobile.js
@@ -0,0 +1,19 @@
+export default {
+ column: '2',
+ owner: '',
+ demos: [
+ {
+ demoId: 'basic-usage',
+ name: {
+ 'zh-CN': '基本用法',
+ 'en-US': 'basic usage'
+ },
+ desc: {
+ 'zh-CN': '
',
+ 'en-US': 'button type
'
+ },
+ codeFiles: ['basic-usage.vue']
+ }
+ ],
+ apis: []
+}
diff --git a/examples/docs/resources/mobile-first/app/tooltip/webdoc/tooltip.cn.md b/examples/docs/resources/mobile-first/app/tooltip/webdoc/tooltip.cn.md
new file mode 100644
index 000000000..5bea2ba6d
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/tooltip/webdoc/tooltip.cn.md
@@ -0,0 +1,9 @@
+---
+title: ToolTip 文字提示
+---
+
+# ToolTip 文字提示
+
+
+动态显示提示信息，一般通过鼠标事件进行响应；
+
diff --git a/examples/docs/resources/mobile-first/app/tooltip/webdoc/tooltip.en.md b/examples/docs/resources/mobile-first/app/tooltip/webdoc/tooltip.en.md
new file mode 100644
index 000000000..5bea2ba6d
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/tooltip/webdoc/tooltip.en.md
@@ -0,0 +1,9 @@
+---
+title: ToolTip 文字提示
+---
+
+# ToolTip 文字提示
+
+
+动态显示提示信息，一般通过鼠标事件进行响应；
+
diff --git a/examples/docs/resources/mobile-first/app/tooltip/webdoc/tooltip.js b/examples/docs/resources/mobile-first/app/tooltip/webdoc/tooltip.js
new file mode 100644
index 000000000..a16d54236
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/tooltip/webdoc/tooltip.js
@@ -0,0 +1,205 @@
+export default {
+ column: '2',
+ owner: '',
+ demos: [
+ {
+ demoId: 'basic-usage',
+ name: {
+ 'zh-CN': '基本用法',
+ 'en-US': 'basic usage'
+ },
+ desc: {
+ 'zh-CN': '
',
+ 'en-US': 'button type
'
+ },
+ codeFiles: ['basic-usage.vue']
+ },
+
+ {
+ demoId: 'dynamic-disable',
+ name: {
+ 'zh-CN': '禁用',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过 `disabled` 设置禁用
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['dynamic-disable.vue']
+ },
+ {
+ demoId: 'manual-control-tip',
+ name: {
+ 'zh-CN': '手动控制',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '手动控制模式，通过设置 `manual` 属性为 true 后，mouseenter 和 mouseleave 事件将不会生效,然后可以通过设置 `v-model` 动态控制显示和隐藏
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['manual-control-tip.vue']
+ },
+ {
+ demoId: 'tooltip-theme',
+ name: {
+ 'zh-CN': '主题',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过 `effect` 属性设置主题,可选值 dark/light 两种主题。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['tooltip-theme.vue']
+ },
+ {
+ demoId: 'open-delay',
+ name: {
+ 'zh-CN': '自动隐藏和延迟时间',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '通过 `hide-after` 属性设置 Tooltip 组件出现后自动隐藏延时，单位毫秒，为 0 则不会自动隐藏。通过 `open-delay` 属性设置 Tooltip 组件延迟出现的时间，单位毫秒。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['open-delay.vue']
+ },
+ {
+ demoId: 'tooltip-offset',
+ name: {
+ 'zh-CN': '偏移量',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过 `offset` 属性设置 Tooltip 组件出现位置的偏移量。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['tooltip-offset.vue']
+ },
+ {
+ demoId: 'enterable',
+ name: {
+ 'zh-CN': '鼠标是否可进入',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过 `enterable` 属性设置鼠标是否可进入到 tooltip 中。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['enterable.vue']
+ },
+ {
+ demoId: 'visible-arrow',
+ name: {
+ 'zh-CN': '是否显示箭头',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过 `visible-arrow` 属性设置是否显示 Tooltip 箭头。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['visible-arrow.vue']
+ },
+ {
+ demoId: 'popper-class',
+ name: {
+ 'zh-CN': '添加样式类名',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过 `popper-class` 属性为 Tooltip 的 popper 添加类名。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['popper-class.vue']
+ },
+ {
+ demoId: 'tooltip-content',
+ name: {
+ 'zh-CN': '插槽',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '设置过通过 `content` 插槽添加自定义内容。滤类型
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['tooltip-content.vue']
+ },
+ {
+ demoId: 'popper-options',
+ name: {
+ 'zh-CN': 'popper 配置',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '通过 `popper-options` 属性为 Tooltip 的 popper 配置参数,具体可参考[popper.js](https://popper.js.org/)
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['popper-options.vue']
+ },
+ {
+ demoId: 'popper-options-bubbling',
+ name: {
+ 'zh-CN': 'popper 配置通过 bubbling 控制 tip 位置',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': 'popperOptions.bubbling 配置为 true 时，所有的父元素包含滚动条，滚动时都会动态改变 tip 的位置
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['popper-options-bubbling.vue']
+ },
+ {
+ demoId: 'tabindex',
+ name: {
+ 'zh-CN': 'tabindex 配置',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '通过配置 `tabindex`， 配置的属性会自动添加到该组件的触发原上。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['tabindex.vue']
+ },
+ {
+ demoId: 'content-pre',
+ name: {
+ 'zh-CN': '文本预格式化',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '配置 `pre` 为 `true`，就会预格式化 `content` 文本。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['content-pre.vue']
+ },
+ {
+ demoId: 'content-render',
+ name: {
+ 'zh-CN': '自定义渲染',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '使用属性 `renderContent` 配置自定义渲染方法
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['content-render.vue']
+ },
+ {
+ demoId: 'z-index',
+ name: {
+ 'zh-CN': '弹出层 zIndex',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '设置`z-index`属性为`relative`时，弹出层样式属性 zIndex 值参考 Reference 及其父级 Dom。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['z-index.vue']
+ }
+ ],
+ apis: []
+}
diff --git a/examples/docs/resources/mobile-first/app/user-head/webdoc/user-head.cn.md b/examples/docs/resources/mobile-first/app/user-head/webdoc/user-head.cn.md
new file mode 100644
index 000000000..d1f9b62b5
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/user-head/webdoc/user-head.cn.md
@@ -0,0 +1,9 @@
+---
+title: UserHead 用户头像
+---
+
+# UserHead 用户头像
+
+
+UserHead 用户头像组件，用来代表用户或事物，支持图片、图标或字符展示。
+
diff --git a/examples/docs/resources/mobile-first/app/user-head/webdoc/user-head.en.md b/examples/docs/resources/mobile-first/app/user-head/webdoc/user-head.en.md
new file mode 100644
index 000000000..d1f9b62b5
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/user-head/webdoc/user-head.en.md
@@ -0,0 +1,9 @@
+---
+title: UserHead 用户头像
+---
+
+# UserHead 用户头像
+
+
+UserHead 用户头像组件，用来代表用户或事物，支持图片、图标或字符展示。
+
diff --git a/examples/docs/resources/mobile-first/app/user-head/webdoc/user-head.js b/examples/docs/resources/mobile-first/app/user-head/webdoc/user-head.js
new file mode 100644
index 000000000..9883ad8c5
--- /dev/null
+++ b/examples/docs/resources/mobile-first/app/user-head/webdoc/user-head.js
@@ -0,0 +1,57 @@
+export default {
+ column: '2',
+ owner: '',
+ demos: [
+ {
+ demoId: 'basic-usage',
+ name: {
+ 'zh-CN': '基本用法',
+ 'en-US': 'basic usage'
+ },
+ desc: {
+ 'zh-CN': '
',
+ 'en-US': 'button type
'
+ },
+ codeFiles: ['basic-usage.vue']
+ },
+
+ {
+ demoId: 'user-head-style',
+ name: {
+ 'zh-CN': '圆形头像',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `round` 设置圆形头像。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['user-head-style.vue']
+ },
+ {
+ demoId: 'user-head-size',
+ name: {
+ 'zh-CN': '头像尺寸',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN': '可通过 `size` 设置圆形头像尺寸大小。
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['user-head-size.vue']
+ },
+ {
+ demoId: 'user-head-group',
+ name: {
+ 'zh-CN': '群组头像',
+ 'en-US': 'events'
+ },
+ desc: {
+ 'zh-CN':
+ '通过`group-size`属性设置群组头像整体尺寸大小，通过`list`传入对应数据
',
+ 'en-US': '
bbutton click
'
+ },
+ codeFiles: ['user-head-group.vue']
+ }
+ ],
+ apis: []
+}
diff --git a/examples/docs/resources/pc/api/zh-CN/transfer.json b/examples/docs/resources/pc/api/zh-CN/transfer.json
index 6be53c3ff..83f1d7053 100644
--- a/examples/docs/resources/pc/api/zh-CN/transfer.json
+++ b/examples/docs/resources/pc/api/zh-CN/transfer.json
@@ -178,7 +178,7 @@
"defaultValue": ""
},
{
- "name": "button",
+ "name": "button-panel",
"sample": "panel-slot",
"type": "",
"desc": "自定义穿梭按钮",
@@ -192,15 +192,15 @@
"defaultValue": ""
},
{
- "name": "leftPanel",
- "sample": "",
+ "name": "left-panel",
+ "sample": "panel-slot",
"type": "",
"desc": "左侧自定义内容",
"defaultValue": ""
},
{
- "name": "rightPanel",
- "sample": "",
+ "name": "right-panel",
+ "sample": "panel-slot",
"type": "",
"desc": "右侧自定义内容",
"defaultValue": ""
diff --git a/examples/docs/resources/pc/api/zh-CN/tree-menu.json b/examples/docs/resources/pc/api/zh-CN/tree-menu.json
index 06dd6cff2..95eaf9424 100644
--- a/examples/docs/resources/pc/api/zh-CN/tree-menu.json
+++ b/examples/docs/resources/pc/api/zh-CN/tree-menu.json
@@ -181,7 +181,7 @@
"events": [
{
"name": "node-click",
- "sample": "event-current-change",
+ "sample": "event-node-click",
"type": "Function(arg1,arg2)",
"desc": "节点被点击时的回调;//参数: arg1:Object \n{ children: 点击节点的子节点, id: 点击节点的id, label: 点击节点的title }\n// arg2:Object // 当前点击节点的数据信息对象",
"defaultValue": ""
diff --git a/examples/docs/resources/pc/api/zh-CN/tree.json b/examples/docs/resources/pc/api/zh-CN/tree.json
index 621ee0e07..4408dc2a8 100644
--- a/examples/docs/resources/pc/api/zh-CN/tree.json
+++ b/examples/docs/resources/pc/api/zh-CN/tree.json
@@ -4,7 +4,7 @@
"name": "data",
"sample": "data-source",
"type": "Array",
- "desc": "设置数据源。可配置静态数据源和动态数据源。;展示数据",
+ "desc": "设置数据源。可配置静态数据源和动态数据源。",
"defaultValue": ""
},
{
@@ -53,7 +53,7 @@
"name": "node-key",
"sample": "node-key",
"type": "String",
- "desc": "节点唯一标识属性名称。;每个树节点用来作为唯一标识的属性，整棵树应该是唯一的",
+ "desc": "节点唯一标识属性名称。每个树节点用来作为唯一标识的属性，整棵树应该是唯一的",
"defaultValue": ""
},
{
@@ -74,7 +74,7 @@
"name": "expand-on-click-node",
"sample": "expand-on-click-node",
"type": "Boolean",
- "desc": "点击节点展开收起开关。当设置为true: 点击节点内容时可展开/收起节点。设置为false: 只有点击节点名称前面的展开/收起图标才能进行节点展开/收起。;是否在点击节点的时候展开或者收缩节点， 默认值为 true，如果为 false，则只有点箭头图标的时候才会展开或者收缩节点。",
+ "desc": "点击节点展开收起开关。当设置为true: 点击节点内容时可展开/收起节点。设置为false: 只有点击节点名称前面的展开/收起图标才能进行节点展开/收起。是否在点击节点的时候展开或者收缩节点， 默认值为 true，如果为 false，则只有点箭头图标的时候才会展开或者收缩节点。",
"defaultValue": "该属性的默认值为 true"
},
{
@@ -95,7 +95,7 @@
"name": "default-checked-keys",
"sample": "default-checked-keys",
"type": "Array",
- "desc": "配置默认选中。取值为 key 在数据源 dataset 中所对应的值。组件生成后会默认将 defaultValue 中所对应的节点选中。;默认勾选的节点的 key 的数组",
+ "desc": "配置默认选中。取值为 key 在数据源 dataset 中所对应的值。组件生成后会默认将 defaultValue 中所对应的节点选中。默认勾选的节点的 key 的数组",
"defaultValue": ""
},
{
@@ -123,7 +123,7 @@
"name": "draggable",
"sample": "node-draggable",
"type": "Boolean",
- "desc": "是否开启节点拖拽，节点的位置可任意拖放，改变原来的节点的父子结构。;是否开启拖拽节点功能",
+ "desc": "是否开启节点拖拽，节点的位置可任意拖放，改变原来的节点的父子结构。是否开启拖拽节点功能",
"defaultValue": "该属性的默认值为 false"
},
{
@@ -158,7 +158,7 @@
"name": "lazy",
"sample": "lazy-load-node",
"type": "Boolean",
- "desc": "异步加载模式，展开节点时再请求数据。需要服务支持。;是否懒加载子节点，需与 load 方法结合使用",
+ "desc": "异步加载模式，展开节点时再请求数据。需要服务支持。是否懒加载子节点，需与 load 方法结合使用",
"defaultValue": "该属性的默认值为 false"
},
{
@@ -172,14 +172,14 @@
"name": "filter-node-method",
"sample": "filter-node",
"type": "Function(value, data, node)",
- "desc": "指定输入筛选时匹配的节点的字段值。showFilter 为 false时无效。;对树节点进行筛选时执行的方法，返回 true 表示这个节点可以显示，返回 false 则表示这个节点会被隐藏",
+ "desc": "指定输入筛选时匹配的节点的字段值。showFilter 为 false时无效。对树节点进行筛选时执行的方法，返回 true 表示这个节点可以显示，返回 false 则表示这个节点会被隐藏",
"defaultValue": ""
},
{
"name": "accordion",
"sample": "accordion-mode",
"type": "Boolean",
- "desc": "是否为单一路径。为 true 时，全部层级的节点同级互斥，为数字时，不大于该值的节点同级互斥。;是否每次只打开一个同级树节点展开",
+ "desc": "是否为单一路径。为 true 时，全部层级的节点同级互斥，为数字时，不大于该值的节点同级互斥。是否每次只打开一个同级树节点展开",
"defaultValue": "该属性的默认值为 false"
},
{
@@ -232,7 +232,7 @@
"name": "getCheckedNodes",
"sample": "check-on-click-node",
"type": "(leafOnly, includeHalfChecked) => result",
- "desc": "获取选中标识的数据。;若节点可被选择（即 show-checkbox 为 true），则返回目前被选中的节点所组成的数组，仅配置多选时生效",
+ "desc": "获取选中标识的数据。若节点可被选择（即 show-checkbox 为 true），则返回目前被选中的节点所组成的数组，仅配置多选时生效",
"defaultValue": ""
},
{
@@ -323,7 +323,7 @@
"name": "remove",
"sample": "",
"type": "(data) => void",
- "desc": "删除节点。;删除 Tree 中的一个节点，使用此方法必须设置 node-key 属性",
+ "desc": "删除节点。删除 Tree 中的一个节点，使用此方法必须设置 node-key 属性",
"defaultValue": ""
},
{
@@ -353,7 +353,7 @@
"name": "node-click",
"sample": "check-on-click-node",
"type": "Function(data, node, vm)",
- "desc": "点击节点后的事件。;节点被点击时的回调;//参数说明\n{data: 节点数据,node: 节点状态信息（包括数据）,vm: 组件实例}",
+ "desc": "点击节点后的事件。节点被点击时的回调;//参数说明\n{data: 节点数据,node: 节点状态信息（包括数据）,vm: 组件实例}",
"defaultValue": ""
},
{
@@ -388,7 +388,7 @@
"name": "node-expand",
"sample": "default-expanded-keys",
"type": "Function(data, node, vm)",
- "desc": "展开节点后的事件。;节点被展开时触发的事件;//参数说明\n{data: 节点数据,node: 节点状态信息（包括数据,vm: 当前组件实例}",
+ "desc": "展开节点后的事件。节点被展开时触发的事件;//参数说明\n{data: 节点数据,node: 节点状态信息（包括数据,vm: 当前组件实例}",
"defaultValue": ""
},
{
@@ -437,7 +437,7 @@
"name": "node-drop",
"sample": "node-draggable",
"type": "Function(draggingNode, targetNode, dropType, event)",
- "desc": "拖放节点后的事件。开启 dragable 属性为 true 有效。;拖拽成功完成时触发的事件;//参数\n{draggingNode: 拖拽节点,targetNode: 目标节点,dropType: 拖拽类型, //拖拽节点在目标节点对应关系（before/after/inner/none)\nevent: 原生事件}",
+ "desc": "拖放节点后的事件。开启 dragable 属性为 true 有效。拖拽成功完成时触发的事件;//参数\n{draggingNode: 拖拽节点,targetNode: 目标节点,dropType: 拖拽类型, //拖拽节点在目标节点对应关系（before/after/inner/none)\nevent: 原生事件}",
"defaultValue": ""
}
]
diff --git a/examples/docs/resources/pc/demo-config/en-US/action-menu.json b/examples/docs/resources/pc/demo-config/en-US/action-menu.json
index 495460ba6..b596d1d8f 100644
--- a/examples/docs/resources/pc/demo-config/en-US/action-menu.json
+++ b/examples/docs/resources/pc/demo-config/en-US/action-menu.json
@@ -78,5 +78,13 @@
"component": " ActionMenu",
"findIntroStr": "ActionMenu",
"demoId": "slot-item"
+ },
+ {
+ "title": "Drop-down menu visible change",
+ "content": "When the drop-down menu change to be visible or hidden, the visible-change event is triggered.",
+ "link": "action-menu/visible-change",
+ "component": " ActionMenu",
+ "findIntroStr": "ActionMenu",
+ "demoId": "visible-change"
}
]
diff --git a/examples/docs/resources/pc/demo-config/en-US/alert.json b/examples/docs/resources/pc/demo-config/en-US/alert.json
index f20d8574b..a90f98ca1 100644
--- a/examples/docs/resources/pc/demo-config/en-US/alert.json
+++ b/examples/docs/resources/pc/demo-config/en-US/alert.json
@@ -65,7 +65,7 @@
},
{
"title": "Customized prompt content",
- "content": "When size is set to large, you can customize the prompt content through the description attribute or slot.
\n",
+ "content": "You can customize the prompt content through the description attribute or slot.
\n",
"link": "alert/custom-description",
"component": "Alert",
"findIntroStr": "Alert alarms, including warning, error, info, and success.",
diff --git a/examples/docs/resources/pc/demo-config/en-US/badge.json b/examples/docs/resources/pc/demo-config/en-US/badge.json
index 713ce5b3c..672ab53b7 100644
--- a/examples/docs/resources/pc/demo-config/en-US/badge.json
+++ b/examples/docs/resources/pc/demo-config/en-US/badge.json
@@ -39,6 +39,14 @@
"findIntroStr": "Badge displays specified data, such as the number of to-do tasks and the number of new tasks.",
"demoId": "target"
},
+ {
+ "title": "Custom Class Name",
+ "content": "badge-class Custom Class Name
\n",
+ "link": "badge/badge-class",
+ "component": "Badge flag",
+ "findIntroStr": "Badge displays specified data, such as the number of to-do tasks and the number of new tasks.",
+ "demoId": "badge-class"
+ },
{
"title": "Custom Tag Target",
"content": "default slot Tag Content Custom
\n",
@@ -62,5 +70,13 @@
"component": "Badge flag",
"findIntroStr": "Badge displays specified data, such as the number of to-do tasks and the number of new tasks.",
"demoId": "dynamic-hidden"
+ },
+ {
+ "title": "Tag Offset",
+ "content": "offset Custom Tag Offset
\n",
+ "link": "badge/offset",
+ "component": "Badge flag",
+ "findIntroStr": "Badge displays specified data, such as the number of to-do tasks and the number of new tasks.",
+ "demoId": "offset"
}
]
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo-config/en-US/country.json b/examples/docs/resources/pc/demo-config/en-US/country.json
index bac2d301c..12d11b40b 100644
--- a/examples/docs/resources/pc/demo-config/en-US/country.json
+++ b/examples/docs/resources/pc/demo-config/en-US/country.json
@@ -14,5 +14,13 @@
"component": "Country",
"findIntroStr": "Country: country/region component, which is used to display and select country/region names. The options are obtained by configuring the data source.",
"demoId": "custom-service"
+ },
+ {
+ "title": "Custom Data Fields",
+ "content": "When a user-defined data body is used, fields must be used to specify fields.",
+ "link": "country/fields",
+ "component": "Country",
+ "findIntroStr": "Country: country/region component, which is used to display and select country/region names. The options are obtained by configuring the data source.",
+ "demoId": "fields"
}
-]
\ No newline at end of file
+]
diff --git a/examples/docs/resources/pc/demo-config/en-US/dropdown.json b/examples/docs/resources/pc/demo-config/en-US/dropdown.json
index 73933790b..2f24e9923 100644
--- a/examples/docs/resources/pc/demo-config/en-US/dropdown.json
+++ b/examples/docs/resources/pc/demo-config/en-US/dropdown.json
@@ -23,6 +23,14 @@
"findIntroStr": "Dropdown drop-down list.",
"demoId": "trigger"
},
+ {
+ "title": "Custom Text",
+ "content": "DropdownYou can customize the text of DropdownMenu through the title attribute.
\n",
+ "link": "dropdown/options",
+ "component": "Dropdown drop-down list",
+ "findIntroStr": "Dropdown drop-down list.",
+ "demoId": "options"
+ },
{
"title": "Menu hiding mode",
"content": "The drop-down menu is hidden by default after a menu item is clicked. You can disable this function by setting hide-on-click to false.
\n",
@@ -62,5 +70,13 @@
"component": "Dropdown drop-down list",
"findIntroStr": "Dropdown drop-down list.",
"demoId": "events"
+ },
+ {
+ "title": "Default Slot",
+ "content": "Dropdown can customize content through the default slot
\n",
+ "link": "dropdown/slot-default",
+ "component": "Dropdown drop-down list",
+ "findIntroStr": "Dropdown drop-down list.",
+ "demoId": "slot-default"
}
]
diff --git a/examples/docs/resources/pc/demo-config/en-US/ip-address.json b/examples/docs/resources/pc/demo-config/en-US/ip-address.json
index 562de0a8e..825c90f8a 100644
--- a/examples/docs/resources/pc/demo-config/en-US/ip-address.json
+++ b/examples/docs/resources/pc/demo-config/en-US/ip-address.json
@@ -86,5 +86,13 @@
"component": "IpAddress text box",
"findIntroStr": "The IP address text box is the same as that of the native IpAddress component of the HTML. In addition, the data binding function is provided.",
"demoId": "select"
+ },
+ {
+ "title": "input event",
+ "content": "The input event is triggered when a user enters a text box. ",
+ "link": "ip-address/input",
+ "component": "IpAddress text box",
+ "findIntroStr": "The IP address text box is the same as that of the native IpAddress component of the HTML. In addition, the data binding function is provided.",
+ "demoId": "input"
}
-]
\ No newline at end of file
+]
diff --git a/examples/docs/resources/pc/demo-config/en-US/modal.json b/examples/docs/resources/pc/demo-config/en-US/modal.json
index f85a82628..126484c99 100644
--- a/examples/docs/resources/pc/demo-config/en-US/modal.json
+++ b/examples/docs/resources/pc/demo-config/en-US/modal.json
@@ -1,7 +1,7 @@
[
{
"title": "Basic Usage",
- "content": "You can use the Modal.alert method to set a pop-up box, and use the Modal.confirm method to set a confirmation pop-up box.
\n",
+ "content": "You can use the Modal.alert method to set a pop-up box, and use the Modal.confirm method to set a confirmation pop-up box. The function returns a Promise object, where the property vm can be used to close the current Modal.
\n",
"link": "modal/base",
"component": "Modal modal box",
"findIntroStr": "Modal modal box",
@@ -247,4 +247,4 @@
"findIntroStr": "Modal modal box",
"demoId": "grid"
}
-]
\ No newline at end of file
+]
diff --git a/examples/docs/resources/pc/demo-config/en-US/popover.json b/examples/docs/resources/pc/demo-config/en-US/popover.json
index e7f7a9dc2..9f9597e3f 100644
--- a/examples/docs/resources/pc/demo-config/en-US/popover.json
+++ b/examples/docs/resources/pc/demo-config/en-US/popover.json
@@ -17,7 +17,7 @@
},
{
"title": "Arrow Offset",
- "content": "arrow-offset Sets the offset of the arrow to change the position of the arrow.
\n",
+ "content": "arrow-offset Sets the offset of the arrow to change the position of the arrow.By default, the arrow retains at least 8px of space to ensure that the arrow does not stick to the left.
\n",
"link": "popover/arrow-offset",
"component": " Popover",
"findIntroStr": "Popover can trigger a pop-up dialog box by performing operations on a trigger source. The pop-up content, delay triggering, and gradient animation are supported.",
diff --git a/examples/docs/resources/pc/demo-config/en-US/select.json b/examples/docs/resources/pc/demo-config/en-US/select.json
index 4f149cbe7..3d50330a7 100644
--- a/examples/docs/resources/pc/demo-config/en-US/select.json
+++ b/examples/docs/resources/pc/demo-config/en-US/select.json
@@ -415,6 +415,14 @@
"findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.",
"demoId": "cache-usage"
},
+ {
+ "title": "Hide drop-down",
+ "content": "Use the hide-drop attribute to disable the display of the drop-down list.
\n",
+ "link": "select/hide-select-input-border",
+ "component": "Select Selector",
+ "findIntroStr": "Select selector is a UI component that displays and selects data from a drop-down list box.",
+ "demoId": "hide-select-input-border"
+ },
{
"title": "Slot Mode",
"content": "If the list rendering component is set to vue-option through slot to output the drop-down list, you need to manually add the cache function.
\n",
diff --git a/examples/docs/resources/pc/demo-config/en-US/time-picker.json b/examples/docs/resources/pc/demo-config/en-US/time-picker.json
index f24d35d6d..13c9872ae 100644
--- a/examples/docs/resources/pc/demo-config/en-US/time-picker.json
+++ b/examples/docs/resources/pc/demo-config/en-US/time-picker.json
@@ -10,10 +10,10 @@
{
"title": "Selection Range",
"content": "picker-options Set the time range
\n",
- "link": "time-picker/basic-usage",
+ "link": "time-picker/picker-options",
"component": "TimePicker Time Selector",
"findIntroStr": "This command is used to set or select a date, including the date format of year, month, month, day, hour, minute, and second.",
- "demoId": "basic-usage1"
+ "demoId": "picker-options"
},
{
"title": "Arrow Selection",
@@ -135,9 +135,17 @@
"findIntroStr": "This command is used to set or select a date, including the date format of year, month, month, day, hour, minute, and second.",
"demoId": "editable"
},
+ {
+ "title": "Disabled status",
+ "content": "You can set disabled to true, you can disabled the time picker。
\n",
+ "link": "time-picker/disabled",
+ "component": " TimePicker Time Selector",
+ "findIntroStr": "This command is used to set or select a date, including the date format of year, month, month, day, hour, minute, and second.",
+ "demoId": "disabled"
+ },
{
"title": "Event",
- "content": "When focusing or out of focus, the focus and bulr events are triggered. When the selected value is determined, the change event is triggered.
\n",
+ "content": "When focusing or out of focus, the focus and blur events are triggered. When the selected value is determined, the change event is triggered.
\n",
"link": "time-picker/event-blur",
"component": "TimePicker Time Selector",
"findIntroStr": "This command is used to set or select a date, including the date format of year, month, month, day, hour, minute, and second.",
diff --git a/examples/docs/resources/pc/demo-config/en-US/transfer.json b/examples/docs/resources/pc/demo-config/en-US/transfer.json
index de70a1a7d..ab43a773b 100644
--- a/examples/docs/resources/pc/demo-config/en-US/transfer.json
+++ b/examples/docs/resources/pc/demo-config/en-US/transfer.json
@@ -137,7 +137,7 @@
},
{
"title": "Panel Slot",
- "content": "You can use left-panel and right-panel to customize the contents of the left and right panels. Use button to customize the shuttle button
\n",
+ "content": "You can use left-panel and right-panel to customize the contents of the left and right panels. Use button-panel to customize the shuttle button
\n",
"link": "transfer/panel-slot",
"component": "Transfer shuttle box",
"findIntroStr": "Shuttle box, which provides bidirectional selection of table data.",
diff --git a/examples/docs/resources/pc/demo-config/zh-CN/action-menu.json b/examples/docs/resources/pc/demo-config/zh-CN/action-menu.json
index 77df836e9..c5bee1eb5 100644
--- a/examples/docs/resources/pc/demo-config/zh-CN/action-menu.json
+++ b/examples/docs/resources/pc/demo-config/zh-CN/action-menu.json
@@ -78,5 +78,13 @@
"component": " ActionMenu 菜单按钮",
"findIntroStr": "ActionMenu 菜单按钮",
"demoId": "slot-item"
+ },
+ {
+ "title": "下拉面板显示事件",
+ "content": "当下拉面板出现或者隐藏时触发 visible-change 事件",
+ "link": "action-menu/visible-change",
+ "component": " ActionMenu 菜单按钮",
+ "findIntroStr": "ActionMenu 菜单按钮",
+ "demoId": "visible-change"
}
]
diff --git a/examples/docs/resources/pc/demo-config/zh-CN/alert.json b/examples/docs/resources/pc/demo-config/zh-CN/alert.json
index 1db532962..277590298 100644
--- a/examples/docs/resources/pc/demo-config/zh-CN/alert.json
+++ b/examples/docs/resources/pc/demo-config/zh-CN/alert.json
@@ -65,7 +65,7 @@
},
{
"title": "自定义提示内容",
- "content": "当 size 为 large时，可通过 description 属性或插槽设置自定义提示内容。
\n",
+ "content": "可通过 description 属性或插槽设置自定义提示内容。
\n",
"link": "alert/custom-description",
"component": " Alert 警告",
"findIntroStr": "Alert 警告,提供 warning、error、info、success 四种类型显示不同类别的信息。",
diff --git a/examples/docs/resources/pc/demo-config/zh-CN/badge.json b/examples/docs/resources/pc/demo-config/zh-CN/badge.json
index d591ebde8..3a58b6f79 100644
--- a/examples/docs/resources/pc/demo-config/zh-CN/badge.json
+++ b/examples/docs/resources/pc/demo-config/zh-CN/badge.json
@@ -1 +1,82 @@
-[{"title":"基本用法","content":"Badge 展示指定数据信息，如：我的待办数、新任务数等。
\n","link":"badge/base","component":" Badge 标记","findIntroStr":"Badge 展示指定数据信息，如：我的待办数、新任务数等。","demoId":"base"},{"title":"主題样式","content":"type 设置显示主题，可选值：primary、success、warning、danger、info，默认值：danger
\n","link":"badge/type","component":" Badge 标记","findIntroStr":"Badge 展示指定数据信息，如：我的待办数、新任务数等。","demoId":"type"},{"title":"小圆点标记","content":"is-dot 显示小圆点标记
\n","link":"badge/is-dot","component":" Badge 标记","findIntroStr":"Badge 展示指定数据信息，如：我的待办数、新任务数等。","demoId":"is-dot"},{"title":"计数最大值","content":"max 超过最大值会显示 '{max}+'
\n","link":"badge/max","component":" Badge 标记","findIntroStr":"Badge 展示指定数据信息，如：我的待办数、新任务数等。","demoId":"max"},{"title":"跳转链接","content":"href定义跳转链接
\n","link":"badge/target","component":" Badge 标记","findIntroStr":"Badge 展示指定数据信息，如：我的待办数、新任务数等。","demoId":"target"},{"title":"自定义标记目标","content":"default slot 标记内容自定义
\n","link":"badge/slot-default","component":" Badge 标记","findIntroStr":"Badge 展示指定数据信息，如：我的待办数、新任务数等。","demoId":"slot-default"},{"title":"自定义提示内容","content":"content slot 自定义提示内容
\n","link":"badge/slot-content","component":" Badge 标记","findIntroStr":"Badge 展示指定数据信息，如：我的待办数、新任务数等。","demoId":"slot-content"},{"title":"消息已读动态隐藏标记","content":"hidden 隐藏标记
\n","link":"badge/dynamic-hidden","component":" Badge 标记","findIntroStr":"Badge 展示指定数据信息，如：我的待办数、新任务数等。","demoId":"dynamic-hidden"}]
+[
+ {
+ "title": "基本用法",
+ "content": "Badge 展示指定数据信息，如：我的待办数、新任务数等。
\n",
+ "link": "badge/base",
+ "component": " Badge 标记",
+ "findIntroStr": "Badge 展示指定数据信息，如：我的待办数、新任务数等。",
+ "demoId": "base"
+ },
+ {
+ "title": "主題样式",
+ "content": "type 设置显示主题，可选值：primary、success、warning、danger、info，默认值：danger
\n",
+ "link": "badge/type",
+ "component": " Badge 标记",
+ "findIntroStr": "Badge 展示指定数据信息，如：我的待办数、新任务数等。",
+ "demoId": "type"
+ },
+ {
+ "title": "小圆点标记",
+ "content": "is-dot 显示小圆点标记
\n",
+ "link": "badge/is-dot",
+ "component": " Badge 标记",
+ "findIntroStr": "Badge 展示指定数据信息，如：我的待办数、新任务数等。",
+ "demoId": "is-dot"
+ },
+ {
+ "title": "计数最大值",
+ "content": "max 超过最大值会显示 '{max}+'
\n",
+ "link": "badge/max",
+ "component": " Badge 标记",
+ "findIntroStr": "Badge 展示指定数据信息，如：我的待办数、新任务数等。",
+ "demoId": "max"
+ },
+ {
+ "title": "跳转链接",
+ "content": "href定义跳转链接
\n",
+ "link": "badge/target",
+ "component": " Badge 标记",
+ "findIntroStr": "Badge 展示指定数据信息，如：我的待办数、新任务数等。",
+ "demoId": "target"
+ },
+ {
+ "title": "自定义类名",
+ "content": "badge-class 自定义类名
\n",
+ "link": "badge/badge-class",
+ "component": " Badge 标记",
+ "findIntroStr": "Badge 展示指定数据信息，如：我的待办数、新任务数等。",
+ "demoId": "badge-class"
+ },
+ {
+ "title": "自定义标记目标",
+ "content": "default slot 标记内容自定义
\n",
+ "link": "badge/slot-default",
+ "component": " Badge 标记",
+ "findIntroStr": "Badge 展示指定数据信息，如：我的待办数、新任务数等。",
+ "demoId": "slot-default"
+ },
+ {
+ "title": "自定义提示内容",
+ "content": "content slot 自定义提示内容
\n",
+ "link": "badge/slot-content",
+ "component": " Badge 标记",
+ "findIntroStr": "Badge 展示指定数据信息，如：我的待办数、新任务数等。",
+ "demoId": "slot-content"
+ },
+ {
+ "title": "消息已读动态隐藏标记",
+ "content": "hidden 隐藏标记
\n",
+ "link": "badge/dynamic-hidden",
+ "component": " Badge 标记",
+ "findIntroStr": "Badge 展示指定数据信息，如：我的待办数、新任务数等。",
+ "demoId": "dynamic-hidden"
+ },
+ {
+ "title": "标记的位置",
+ "content": "offset 调整标记的位置
\n",
+ "link": "badge/offset",
+ "component": " Badge 标记",
+ "findIntroStr": "Badge 展示指定数据信息，如：我的待办数、新任务数等。",
+ "demoId": "offset"
+ }
+]
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo-config/zh-CN/breadcrumb.json b/examples/docs/resources/pc/demo-config/zh-CN/breadcrumb.json
index 1fa7ba930..b4d081c50 100644
--- a/examples/docs/resources/pc/demo-config/zh-CN/breadcrumb.json
+++ b/examples/docs/resources/pc/demo-config/zh-CN/breadcrumb.json
@@ -1 +1,34 @@
-[{"title":"基本用法","content":"详细用法参考如下示例","link":"breadcrumb/base","component":" Breadcrumb 面包屑","findIntroStr":"Breadcrumb 面包屑导航，作用是告诉访问者他们目前在网站中的位置以及如何返回。","demoId":"base"},{"title":"自定义节点","content":"设置子组件 BreadcrumbItem 的 默认插槽，自定义节点内容。to 设置路由跳转的对象，同时设置 replace 后将不会向 history 添加新记录。
\n","link":"breadcrumb/slot-default","component":" Breadcrumb 面包屑","findIntroStr":"Breadcrumb 面包屑导航，作用是告诉访问者他们目前在网站中的位置以及如何返回。","demoId":"slot-default"},{"title":"自定义分隔符","content":"设置 separator 或 separator-icon 属性，自定义分隔符。
\n","link":"breadcrumb/separator","component":" Breadcrumb 面包屑","findIntroStr":"Breadcrumb 面包屑导航，作用是告诉访问者他们目前在网站中的位置以及如何返回。","demoId":"separator"},{"title":"options 配置","content":"通过 options 总体配置每个 BreadcrumbItem。
设置textField 指定显示字段，默认显示字段为 label\n","link":"breadcrumb/options","component":" Breadcrumb 面包屑","findIntroStr":"Breadcrumb 面包屑导航，作用是告诉访问者他们目前在网站中的位置以及如何返回。","demoId":"options"}]
+[
+ {
+ "title": "基本用法",
+ "content": "详细用法参考如下示例",
+ "link": "breadcrumb/base",
+ "component": " Breadcrumb 面包屑",
+ "findIntroStr": "Breadcrumb 面包屑导航，作用是告诉访问者他们目前在网站中的位置以及如何返回。",
+ "demoId": "base"
+ },
+ {
+ "title": "自定义节点",
+ "content": "设置子组件 BreadcrumbItem 的 默认插槽，自定义节点内容。to 设置路由跳转的对象，同时设置 replace 后将不会向 history 添加新记录。
\n",
+ "link": "breadcrumb/slot-default",
+ "component": " Breadcrumb 面包屑",
+ "findIntroStr": "Breadcrumb 面包屑导航，作用是告诉访问者他们目前在网站中的位置以及如何返回。",
+ "demoId": "slot-default"
+ },
+ {
+ "title": "自定义分隔符",
+ "content": "设置 separator 或 separator-icon 属性，自定义分隔符。
\n",
+ "link": "breadcrumb/separator",
+ "component": " Breadcrumb 面包屑",
+ "findIntroStr": "Breadcrumb 面包屑导航，作用是告诉访问者他们目前在网站中的位置以及如何返回。",
+ "demoId": "separator"
+ },
+ {
+ "title": "options 配置",
+ "content": "通过 options 总体配置每个 BreadcrumbItem。
设置textField 指定显示字段，默认显示字段为 label\n",
+ "link": "breadcrumb/options",
+ "component": " Breadcrumb 面包屑",
+ "findIntroStr": "Breadcrumb 面包屑导航，作用是告诉访问者他们目前在网站中的位置以及如何返回。",
+ "demoId": "options"
+ }
+]
diff --git a/examples/docs/resources/pc/demo-config/zh-CN/bulletin-board.json b/examples/docs/resources/pc/demo-config/zh-CN/bulletin-board.json
index 76b0d9dcb..61e7d7be1 100644
--- a/examples/docs/resources/pc/demo-config/zh-CN/bulletin-board.json
+++ b/examples/docs/resources/pc/demo-config/zh-CN/bulletin-board.json
@@ -1 +1,66 @@
-[{"title":"基本用法","content":"必须设置 data 属性设置公告牌公告信息数据，以及 tab-title 属性设置每个公告牌标题。
\n","link":"bulletin-board/base","component":" BulletinBoard 公告牌","findIntroStr":"BulletinBoard 公告牌组件，展现需要重点关注的信息。","demoId":"base"},{"title":"公告牌标题","content":"可通过 title 设置公告牌标题。
\n","link":"bulletin-board/title","component":" BulletinBoard 公告牌","findIntroStr":"BulletinBoard 公告牌组件，展现需要重点关注的信息。","demoId":"title"},{"title":"默认激活的选项卡","content":"可通过 active-name 设置默认激活的选项卡，从 1 开始计算。
\n","link":"bulletin-board/active-name","component":" BulletinBoard 公告牌","findIntroStr":"BulletinBoard 公告牌组件，展现需要重点关注的信息。","demoId":"active-name"},{"title":"选项卡标题","content":"可通过 tab-title 属性自定义选项卡标题。
\n","link":"bulletin-board/tab-title","component":" BulletinBoard 公告牌","findIntroStr":"BulletinBoard 公告牌组件，展现需要重点关注的信息。","demoId":"tab-title"},{"title":"基于Url的跳转","content":"基于 Url 的跳转是根据数据中的 url 和 target 字段进行跳转的。
\n","link":"bulletin-board/url","component":" BulletinBoard 公告牌","findIntroStr":"BulletinBoard 公告牌组件，展现需要重点关注的信息。","demoId":"url"},{"title":"基于Route的跳转","content":"基于 Route 的跳转是根据数据中的 route 字段进行跳转的。
\n","link":"bulletin-board/route","component":" BulletinBoard 公告牌","findIntroStr":"BulletinBoard 公告牌组件，展现需要重点关注的信息。","demoId":"route"},{"title":"显示 “更多” 链接","content":"可通过 more-link 显示并设置更多链接。 show-more 设置是否显示更多按钮，默认为 true。
\n","link":"bulletin-board/more-link","component":" BulletinBoard 公告牌","findIntroStr":"BulletinBoard 公告牌组件，展现需要重点关注的信息。","demoId":"more-link"},{"title":"自定义新公告前缀","content":"可通过 icon 自定义新公告前缀图标。
\n","link":"bulletin-board/icon","component":" BulletinBoard 公告牌","findIntroStr":"BulletinBoard 公告牌组件，展现需要重点关注的信息。","demoId":"icon"}]
+[
+ {
+ "title": "基本用法",
+ "content": "必须设置 data 属性设置公告牌公告信息数据，以及 tab-title 属性设置每个公告牌标题。
\n",
+ "link": "bulletin-board/base",
+ "component": " BulletinBoard 公告牌",
+ "findIntroStr": "BulletinBoard 公告牌组件，展现需要重点关注的信息。",
+ "demoId": "base"
+ },
+ {
+ "title": "公告牌标题",
+ "content": "可通过 title 设置公告牌标题。
\n",
+ "link": "bulletin-board/title",
+ "component": " BulletinBoard 公告牌",
+ "findIntroStr": "BulletinBoard 公告牌组件，展现需要重点关注的信息。",
+ "demoId": "title"
+ },
+ {
+ "title": "默认激活的选项卡",
+ "content": "可通过 active-name 设置默认激活的选项卡，从 1 开始计算。
\n",
+ "link": "bulletin-board/active-name",
+ "component": " BulletinBoard 公告牌",
+ "findIntroStr": "BulletinBoard 公告牌组件，展现需要重点关注的信息。",
+ "demoId": "active-name"
+ },
+ {
+ "title": "选项卡标题",
+ "content": "可通过 tab-title 属性自定义选项卡标题。
\n",
+ "link": "bulletin-board/tab-title",
+ "component": " BulletinBoard 公告牌",
+ "findIntroStr": "BulletinBoard 公告牌组件，展现需要重点关注的信息。",
+ "demoId": "tab-title"
+ },
+ {
+ "title": "基于Url的跳转",
+ "content": "基于 Url 的跳转是根据数据中的 url 和 target 字段进行跳转的。
\n",
+ "link": "bulletin-board/url",
+ "component": " BulletinBoard 公告牌",
+ "findIntroStr": "BulletinBoard 公告牌组件，展现需要重点关注的信息。",
+ "demoId": "url"
+ },
+ {
+ "title": "基于Route的跳转",
+ "content": "基于 Route 的跳转是根据数据中的 route 字段进行跳转的。
\n",
+ "link": "bulletin-board/route",
+ "component": " BulletinBoard 公告牌",
+ "findIntroStr": "BulletinBoard 公告牌组件，展现需要重点关注的信息。",
+ "demoId": "route"
+ },
+ {
+ "title": "显示 “更多” 链接",
+ "content": "可通过 more-link 显示并设置更多链接。 show-more 设置是否显示更多按钮，默认为 true。
\n",
+ "link": "bulletin-board/more-link",
+ "component": " BulletinBoard 公告牌",
+ "findIntroStr": "BulletinBoard 公告牌组件，展现需要重点关注的信息。",
+ "demoId": "more-link"
+ },
+ {
+ "title": "自定义新公告前缀",
+ "content": "可通过 icon 自定义新公告前缀图标。
\n",
+ "link": "bulletin-board/icon",
+ "component": " BulletinBoard 公告牌",
+ "findIntroStr": "BulletinBoard 公告牌组件，展现需要重点关注的信息。",
+ "demoId": "icon"
+ }
+]
diff --git a/examples/docs/resources/pc/demo-config/zh-CN/collapse.json b/examples/docs/resources/pc/demo-config/zh-CN/collapse.json
index e97d6c3ea..88623c81c 100644
--- a/examples/docs/resources/pc/demo-config/zh-CN/collapse.json
+++ b/examples/docs/resources/pc/demo-config/zh-CN/collapse.json
@@ -1 +1,74 @@
-[{"title":"基本用法","content":"详细用法参考如下示例","link":"collapse/basic-usage","component":" Collapse 折叠面板","findIntroStr":"内容区可指定动态页面或自定义 html 等，支持展开收起操作。","demoId":"basic-usage"},{"title":"手风琴效果","content":"配置 accordion 属性为 true 后，折叠面板将展示手风琴效果。\n配置 v-model 设置当前激活的面板(如果是手风琴模式，绑定值类型需要为 string ，否则为 array )\nchange 事件，在当前激活面板改变时触发，参数为当前的 value 值\n配置 name 属性作为每个 collapse-item 的唯一标志符
\n","link":"collapse/accordion","component":" Collapse 折叠面板","findIntroStr":"内容区可指定动态页面或自定义 html 等，支持展开收起操作。","demoId":"accordion"},{"title":"禁用状态","content":"在 collapse-item 元素上配置 disabled 属性为 true 后，将禁用指定的折叠面板项。
\n","link":"collapse/dynamic-disable","component":" Collapse 折叠面板","findIntroStr":"内容区可指定动态页面或自定义 html 等，支持展开收起操作。","demoId":"dynamic-disable"},{"title":"自定义面板标题","content":"在 collapse-item 元素上配置 title 属性可以指定每个折叠面板项的标题。但同时也可以通过 title 插槽的方式自定义面板标题，比如在标题前增加图标。
\n","link":"collapse/custom-collapse-title","component":" Collapse 折叠面板","findIntroStr":"内容区可指定动态页面或自定义 html 等，支持展开收起操作。","demoId":"custom-collapse-title"},{"title":"自定义展开折叠图标","content":"在 collapse-item 元素上可以通过 icon 插槽的方式自定义展开折叠 icon 图标。
\n","link":"collapse/custom-collapse-icon","component":" Collapse 折叠面板","findIntroStr":"内容区可指定动态页面或自定义 html 等，支持展开收起操作。","demoId":"custom-collapse-icon"},{"title":"折叠面板事件","content":"激活面板的值改变时将触发 change 事件。
\n","link":"collapse/collapse-events","component":" Collapse 折叠面板","findIntroStr":"内容区可指定动态页面或自定义 html 等，支持展开收起操作。","demoId":"collapse-events"},{"title":"阻止折叠面板关闭事件","content":":before-close 折叠面板关闭前事件,方法里面return true/false，表示是否可以关闭
\n","link":"collapse/block-close","component":" Collapse 折叠面板","findIntroStr":"内容区可指定动态页面或自定义 html 等，支持展开收起操作。","demoId":"block-close"},{"title":"嵌套表格","content":"通过 collapse-item 元素的默认插槽嵌入表格。
\n","link":"collapse/nested-grid","component":" Collapse 折叠面板","findIntroStr":"内容区可指定动态页面或自定义 html 等，支持展开收起操作。","demoId":"nested-grid"},{"title":"嵌套表单","content":"通过 collapse-item 元素的默认插槽嵌入表单。
\n","link":"collapse/nested-form","component":" Collapse 折叠面板","findIntroStr":"内容区可指定动态页面或自定义 html 等，支持展开收起操作。","demoId":"nested-form"}]
+[
+ {
+ "title": "基本用法",
+ "content": "详细用法参考如下示例",
+ "link": "collapse/basic-usage",
+ "component": " Collapse 折叠面板",
+ "findIntroStr": "内容区可指定动态页面或自定义 html 等，支持展开收起操作。",
+ "demoId": "basic-usage"
+ },
+ {
+ "title": "手风琴效果",
+ "content": "配置 accordion 属性为 true 后，折叠面板将展示手风琴效果。\n配置 v-model 设置当前激活的面板(如果是手风琴模式，绑定值类型需要为 string ，否则为 array )\nchange 事件，在当前激活面板改变时触发，参数为当前的 value 值\n配置 name 属性作为每个 collapse-item 的唯一标志符
\n",
+ "link": "collapse/accordion",
+ "component": " Collapse 折叠面板",
+ "findIntroStr": "内容区可指定动态页面或自定义 html 等，支持展开收起操作。",
+ "demoId": "accordion"
+ },
+ {
+ "title": "禁用状态",
+ "content": "在 collapse-item 元素上配置 disabled 属性为 true 后，将禁用指定的折叠面板项。
\n",
+ "link": "collapse/dynamic-disable",
+ "component": " Collapse 折叠面板",
+ "findIntroStr": "内容区可指定动态页面或自定义 html 等，支持展开收起操作。",
+ "demoId": "dynamic-disable"
+ },
+ {
+ "title": "自定义面板标题",
+ "content": "在 collapse-item 元素上配置 title 属性可以指定每个折叠面板项的标题。但同时也可以通过 title 插槽的方式自定义面板标题，比如在标题前增加图标。
\n",
+ "link": "collapse/custom-collapse-title",
+ "component": " Collapse 折叠面板",
+ "findIntroStr": "内容区可指定动态页面或自定义 html 等，支持展开收起操作。",
+ "demoId": "custom-collapse-title"
+ },
+ {
+ "title": "自定义展开折叠图标",
+ "content": "在 collapse-item 元素上可以通过 icon 插槽的方式自定义展开折叠 icon 图标。
\n",
+ "link": "collapse/custom-collapse-icon",
+ "component": " Collapse 折叠面板",
+ "findIntroStr": "内容区可指定动态页面或自定义 html 等，支持展开收起操作。",
+ "demoId": "custom-collapse-icon"
+ },
+ {
+ "title": "折叠面板事件",
+ "content": "激活面板的值改变时将触发 change 事件。
\n",
+ "link": "collapse/collapse-events",
+ "component": " Collapse 折叠面板",
+ "findIntroStr": "内容区可指定动态页面或自定义 html 等，支持展开收起操作。",
+ "demoId": "collapse-events"
+ },
+ {
+ "title": "阻止折叠面板关闭事件",
+ "content": ":before-close 折叠面板关闭前事件,方法里面return true/false，表示是否可以关闭
\n",
+ "link": "collapse/block-close",
+ "component": " Collapse 折叠面板",
+ "findIntroStr": "内容区可指定动态页面或自定义 html 等，支持展开收起操作。",
+ "demoId": "block-close"
+ },
+ {
+ "title": "嵌套表格",
+ "content": "通过 collapse-item 元素的默认插槽嵌入表格。
\n",
+ "link": "collapse/nested-grid",
+ "component": " Collapse 折叠面板",
+ "findIntroStr": "内容区可指定动态页面或自定义 html 等，支持展开收起操作。",
+ "demoId": "nested-grid"
+ },
+ {
+ "title": "嵌套表单",
+ "content": "通过 collapse-item 元素的默认插槽嵌入表单。
\n",
+ "link": "collapse/nested-form",
+ "component": " Collapse 折叠面板",
+ "findIntroStr": "内容区可指定动态页面或自定义 html 等，支持展开收起操作。",
+ "demoId": "nested-form"
+ }
+]
diff --git a/examples/docs/resources/pc/demo-config/zh-CN/country.json b/examples/docs/resources/pc/demo-config/zh-CN/country.json
index 0cf40dc52..22bf7b4ba 100644
--- a/examples/docs/resources/pc/demo-config/zh-CN/country.json
+++ b/examples/docs/resources/pc/demo-config/zh-CN/country.json
@@ -1 +1,26 @@
-[{"title":"基本用法","content":"详细用法参考如下示例","link":"country/basic-usage","component":" Country 国家/地区","findIntroStr":"Country 国家/地区组件，用于国家/地区名称展示及选择，通过配置数据源获取选项。","demoId":"basic-usage"},{"title":"自定义服务","content":"通过 fetch-country 属性可以指定一个方法，在方法中可实现请求自定义的服务。 clearable 设置是否可清空，默认值为 true。
\n","link":"country/custom-service","component":" Country 国家/地区","findIntroStr":"Country 国家/地区组件，用于国家/地区名称展示及选择，通过配置数据源获取选项。","demoId":"custom-service"}]
+[
+ {
+ "title": "基本用法",
+ "content": "详细用法参考如下示例",
+ "link": "country/basic-usage",
+ "component": " Country 国家/地区",
+ "findIntroStr": "Country 国家/地区组件，用于国家/地区名称展示及选择，通过配置数据源获取选项。",
+ "demoId": "basic-usage"
+ },
+ {
+ "title": "自定义服务",
+ "content": "通过 fetch-country 属性可以指定一个方法，在方法中可实现请求自定义的服务。 clearable 设置是否可清空，默认值为 true。
\n",
+ "link": "country/custom-service",
+ "component": " Country 国家/地区",
+ "findIntroStr": "Country 国家/地区组件，用于国家/地区名称展示及选择，通过配置数据源获取选项。",
+ "demoId": "custom-service"
+ },
+ {
+ "title": "自定义数据的字段",
+ "content": "当使用自定义的数据体时，需要使用fields来指定字段",
+ "link": "country/fields",
+ "component": " Country 国家/地区",
+ "findIntroStr": "Country 国家/地区组件，用于国家/地区名称展示及选择，通过配置数据源获取选项。",
+ "demoId": "fields"
+ }
+]
diff --git a/examples/docs/resources/pc/demo-config/zh-CN/dialog-box.json b/examples/docs/resources/pc/demo-config/zh-CN/dialog-box.json
index 15b973c2d..8c0350fd4 100644
--- a/examples/docs/resources/pc/demo-config/zh-CN/dialog-box.json
+++ b/examples/docs/resources/pc/demo-config/zh-CN/dialog-box.json
@@ -1 +1,154 @@
-[{"title":"基本用法","content":"详细用法参考如下示例","link":"dialog-box/basic-usage","component":" DialogBox 对话框","findIntroStr":"模态对话框，在浮层中显示，引导用户进行相关操作。","demoId":"basic-usage"},{"title":"二级弹窗","content":"通过 default 默认插槽和底部操作区按钮实现二级弹窗。设置 append-to-body 属性后，二级弹窗的实体 DOM 结构将追加到 body 元素上。
\n","link":"dialog-box/secondary-dialog","component":" DialogBox 对话框","findIntroStr":"模态对话框，在浮层中显示，引导用户进行相关操作。","demoId":"secondary-dialog"},{"title":"自定义标题","content":"除 title 属性可以设置弹窗标题外，还可以通过 title 插槽自定义弹窗标题区的内容。
\n","link":"dialog-box/custom-dialog-title","component":" DialogBox 对话框","findIntroStr":"模态对话框，在浮层中显示，引导用户进行相关操作。","demoId":"custom-dialog-title"},{"title":"自定义内容","content":"通过 default 默认插槽自定义弹窗主体部分的内容。
\n","link":"dialog-box/custom-dialog-content","component":" DialogBox 对话框","findIntroStr":"模态对话框，在浮层中显示，引导用户进行相关操作。","demoId":"custom-dialog-content"},{"title":"自定义底部","content":"通过 footer 插槽自定义弹窗底部操作区内容。
\n","link":"dialog-box/custom-dialog-footer","component":" DialogBox 对话框","findIntroStr":"模态对话框，在浮层中显示，引导用户进行相关操作。","demoId":"custom-dialog-footer"},{"title":"隐藏关闭按钮","content":"默认弹窗右上角会显示关闭图标，单击可以关闭弹窗。若设置 show-close 为 false 后，将隐藏关闭图标，要实现关闭弹窗的功能可以通过底部操作区按钮的 click 事件切换 visible 属性的值为 false 。
\n","link":"dialog-box/hidden-close-buttons","component":" DialogBox 对话框","findIntroStr":"模态对话框，在浮层中显示，引导用户进行相关操作。","demoId":"hidden-close-buttons"},{"title":"禁用 ESC 关闭","content":"默认弹窗打开后，可以按下 Esc 键关闭弹窗，设置 close-on-press-escape 为 false 后将禁用该功能。
\n","link":"dialog-box/close-on-press-escape","component":" DialogBox 对话框","findIntroStr":"模态对话框，在浮层中显示，引导用户进行相关操作。","demoId":"close-on-press-escape"},{"title":"弹窗距离顶部的高度","content":"通过 top 属性指定弹窗距离窗口顶部的高度，默认为屏高的 15% 。
\n","link":"dialog-box/dialog-top-height","component":" DialogBox 对话框","findIntroStr":"模态对话框，在浮层中显示，引导用户进行相关操作。","demoId":"dialog-top-height"},{"title":"弹窗的宽度","content":"通过 width 属性指定弹窗的宽度。
\n","link":"dialog-box/dialog-width","component":" DialogBox 对话框","findIntroStr":"模态对话框，在浮层中显示，引导用户进行相关操作。","demoId":"dialog-width"},{"title":"点击遮罩时不关闭弹窗","content":"默认弹窗打开后，可以单击遮罩层关闭弹窗，设置 close-on-click-modal 为 false 后将禁用该功能。
\n","link":"dialog-box/close-on-click-modal","component":" DialogBox 对话框","findIntroStr":"模态对话框，在浮层中显示，引导用户进行相关操作。","demoId":"close-on-click-modal"},{"title":"不启用遮罩层","content":"默认弹窗打开时会显示遮罩层，设置 modal 为 false 后将不启用遮罩层。无遮罩层时，单击弹窗外部区域仍然可以关闭弹窗。
\n","link":"dialog-box/no-modal","component":" DialogBox 对话框","findIntroStr":"模态对话框，在浮层中显示，引导用户进行相关操作。","demoId":"no-modal"},{"title":"右侧弹窗","content":"设置 right-slide 属性为 true 后，弹窗将从窗口右侧弹出。\n设置 modal-append-to-body 属性默认为 true 遮罩层应用在 body 上。
\n","link":"dialog-box/right-dialog","component":" DialogBox 对话框","findIntroStr":"模态对话框，在浮层中显示，引导用户进行相关操作。","demoId":"right-dialog"},{"title":"隐藏标题区域","content":"弹窗默认有标题区域，设置 show-header 为 false 后，将隐藏标题区域。
\n","link":"dialog-box/hidden-header","component":" DialogBox 对话框","findIntroStr":"模态对话框，在浮层中显示，引导用户进行相关操作。","demoId":"hidden-header"},{"title":"弹出时禁用滚动","content":"弹窗弹出后，背景页面默认仍然是不可以滚动的，设置 lock-scroll 为 fasle 后将不锁定被遮罩内容的滚动。
\n","link":"dialog-box/lock-scroll","component":" DialogBox 对话框","findIntroStr":"模态对话框，在浮层中显示，引导用户进行相关操作。","demoId":"lock-scroll"},{"title":"头部和底部水平居中","content":"头部标题默认显示在区域左侧，设置 center 为 true 后，将居中显示。
\n","link":"dialog-box/center","component":" DialogBox 对话框","findIntroStr":"模态对话框，在浮层中显示，引导用户进行相关操作。","demoId":"center"},{"title":"可拖拽的弹窗","content":"默认弹窗不可拖拽，设置 draggable 属性为 true 后，鼠标移入标题区域单击可拖拽，拖拽事件有 @drag-start、drag-move、drag-end。
\n","link":"dialog-box/draggable","component":" DialogBox 对话框","findIntroStr":"模态对话框，在浮层中显示，引导用户进行相关操作。","demoId":"draggable"},{"title":"全屏弹窗","content":"设置 fullscreen 属性为 true 可显示全屏弹窗，默认弹窗宽度是 500px，此时设置宽度是不生效的。
\n","link":"dialog-box/fullscreen","component":" DialogBox 对话框","findIntroStr":"模态对话框，在浮层中显示，引导用户进行相关操作。","demoId":"fullscreen"},{"title":"弹出与关闭事件","content":"open ：对话框打开时触发，opened ：对话框打开动画结束时触发，close ：对话框关闭时触发，closed ：对话框关闭动画结束时触发。
\n","link":"dialog-box/open-close-events","component":" DialogBox 对话框","findIntroStr":"模态对话框，在浮层中显示，引导用户进行相关操作。","demoId":"open-close-events"},{"title":"弹窗表单","content":"通过 default 默认插槽实现嵌套表单以及表单提交的逻辑。
\n默认关闭弹窗的时候重置表单，设置is-form-reset 为false,则关闭弹窗的时候不重置表格
","link":"dialog-box/form-in-dialog","component":" DialogBox 对话框","findIntroStr":"模态对话框，在浮层中显示，引导用户进行相关操作。","demoId":"form-in-dialog"}]
+[
+ {
+ "title": "基本用法",
+ "content": "详细用法参考如下示例",
+ "link": "dialog-box/basic-usage",
+ "component": " DialogBox 对话框",
+ "findIntroStr": "模态对话框，在浮层中显示，引导用户进行相关操作。",
+ "demoId": "basic-usage"
+ },
+ {
+ "title": "二级弹窗",
+ "content": "通过 default 默认插槽和底部操作区按钮实现二级弹窗。设置 append-to-body 属性后，二级弹窗的实体 DOM 结构将追加到 body 元素上。
\n",
+ "link": "dialog-box/secondary-dialog",
+ "component": " DialogBox 对话框",
+ "findIntroStr": "模态对话框，在浮层中显示，引导用户进行相关操作。",
+ "demoId": "secondary-dialog"
+ },
+ {
+ "title": "自定义标题",
+ "content": "除 title 属性可以设置弹窗标题外，还可以通过 title 插槽自定义弹窗标题区的内容。
\n",
+ "link": "dialog-box/custom-dialog-title",
+ "component": " DialogBox 对话框",
+ "findIntroStr": "模态对话框，在浮层中显示，引导用户进行相关操作。",
+ "demoId": "custom-dialog-title"
+ },
+ {
+ "title": "自定义内容",
+ "content": "通过 default 默认插槽自定义弹窗主体部分的内容。
\n",
+ "link": "dialog-box/custom-dialog-content",
+ "component": " DialogBox 对话框",
+ "findIntroStr": "模态对话框，在浮层中显示，引导用户进行相关操作。",
+ "demoId": "custom-dialog-content"
+ },
+ {
+ "title": "自定义底部",
+ "content": "通过 footer 插槽自定义弹窗底部操作区内容。
\n",
+ "link": "dialog-box/custom-dialog-footer",
+ "component": " DialogBox 对话框",
+ "findIntroStr": "模态对话框，在浮层中显示，引导用户进行相关操作。",
+ "demoId": "custom-dialog-footer"
+ },
+ {
+ "title": "隐藏关闭按钮",
+ "content": "默认弹窗右上角会显示关闭图标，单击可以关闭弹窗。若设置 show-close 为 false 后，将隐藏关闭图标，要实现关闭弹窗的功能可以通过底部操作区按钮的 click 事件切换 visible 属性的值为 false 。
\n",
+ "link": "dialog-box/hidden-close-buttons",
+ "component": " DialogBox 对话框",
+ "findIntroStr": "模态对话框，在浮层中显示，引导用户进行相关操作。",
+ "demoId": "hidden-close-buttons"
+ },
+ {
+ "title": "禁用 ESC 关闭",
+ "content": "默认弹窗打开后，可以按下 Esc 键关闭弹窗，设置 close-on-press-escape 为 false 后将禁用该功能。
\n",
+ "link": "dialog-box/close-on-press-escape",
+ "component": " DialogBox 对话框",
+ "findIntroStr": "模态对话框，在浮层中显示，引导用户进行相关操作。",
+ "demoId": "close-on-press-escape"
+ },
+ {
+ "title": "弹窗距离顶部的高度",
+ "content": "通过 top 属性指定弹窗距离窗口顶部的高度，默认为屏高的 15% 。
\n",
+ "link": "dialog-box/dialog-top-height",
+ "component": " DialogBox 对话框",
+ "findIntroStr": "模态对话框，在浮层中显示，引导用户进行相关操作。",
+ "demoId": "dialog-top-height"
+ },
+ {
+ "title": "弹窗的宽度",
+ "content": "通过 width 属性指定弹窗的宽度。
\n",
+ "link": "dialog-box/dialog-width",
+ "component": " DialogBox 对话框",
+ "findIntroStr": "模态对话框，在浮层中显示，引导用户进行相关操作。",
+ "demoId": "dialog-width"
+ },
+ {
+ "title": "点击遮罩时不关闭弹窗",
+ "content": "默认弹窗打开后，可以单击遮罩层关闭弹窗，设置 close-on-click-modal 为 false 后将禁用该功能。
\n",
+ "link": "dialog-box/close-on-click-modal",
+ "component": " DialogBox 对话框",
+ "findIntroStr": "模态对话框，在浮层中显示，引导用户进行相关操作。",
+ "demoId": "close-on-click-modal"
+ },
+ {
+ "title": "不启用遮罩层",
+ "content": "默认弹窗打开时会显示遮罩层，设置 modal 为 false 后将不启用遮罩层。无遮罩层时，单击弹窗外部区域仍然可以关闭弹窗。
\n",
+ "link": "dialog-box/no-modal",
+ "component": " DialogBox 对话框",
+ "findIntroStr": "模态对话框，在浮层中显示，引导用户进行相关操作。",
+ "demoId": "no-modal"
+ },
+ {
+ "title": "右侧弹窗",
+ "content": "设置 right-slide 属性为 true 后，弹窗将从窗口右侧弹出。\n设置 modal-append-to-body 属性默认为 true 遮罩层应用在 body 上。
\n",
+ "link": "dialog-box/right-dialog",
+ "component": " DialogBox 对话框",
+ "findIntroStr": "模态对话框，在浮层中显示，引导用户进行相关操作。",
+ "demoId": "right-dialog"
+ },
+ {
+ "title": "隐藏标题区域",
+ "content": "弹窗默认有标题区域，设置 show-header 为 false 后，将隐藏标题区域。
\n",
+ "link": "dialog-box/hidden-header",
+ "component": " DialogBox 对话框",
+ "findIntroStr": "模态对话框，在浮层中显示，引导用户进行相关操作。",
+ "demoId": "hidden-header"
+ },
+ {
+ "title": "弹出时禁用滚动",
+ "content": "弹窗弹出后，背景页面默认仍然是不可以滚动的，设置 lock-scroll 为 fasle 后将不锁定被遮罩内容的滚动。
\n",
+ "link": "dialog-box/lock-scroll",
+ "component": " DialogBox 对话框",
+ "findIntroStr": "模态对话框，在浮层中显示，引导用户进行相关操作。",
+ "demoId": "lock-scroll"
+ },
+ {
+ "title": "头部和底部水平居中",
+ "content": "头部标题默认显示在区域左侧，设置 center 为 true 后，将居中显示。
\n",
+ "link": "dialog-box/center",
+ "component": " DialogBox 对话框",
+ "findIntroStr": "模态对话框，在浮层中显示，引导用户进行相关操作。",
+ "demoId": "center"
+ },
+ {
+ "title": "可拖拽的弹窗",
+ "content": "默认弹窗不可拖拽，设置 draggable 属性为 true 后，鼠标移入标题区域单击可拖拽，拖拽事件有 @drag-start、drag-move、drag-end。
\n",
+ "link": "dialog-box/draggable",
+ "component": " DialogBox 对话框",
+ "findIntroStr": "模态对话框，在浮层中显示，引导用户进行相关操作。",
+ "demoId": "draggable"
+ },
+ {
+ "title": "全屏弹窗",
+ "content": "设置 fullscreen 属性为 true 可显示全屏弹窗，默认弹窗宽度是 500px，此时设置宽度是不生效的。
\n",
+ "link": "dialog-box/fullscreen",
+ "component": " DialogBox 对话框",
+ "findIntroStr": "模态对话框，在浮层中显示，引导用户进行相关操作。",
+ "demoId": "fullscreen"
+ },
+ {
+ "title": "弹出与关闭事件",
+ "content": "open ：对话框打开时触发，opened ：对话框打开动画结束时触发，close ：对话框关闭时触发，closed ：对话框关闭动画结束时触发。
\n",
+ "link": "dialog-box/open-close-events",
+ "component": " DialogBox 对话框",
+ "findIntroStr": "模态对话框，在浮层中显示，引导用户进行相关操作。",
+ "demoId": "open-close-events"
+ },
+ {
+ "title": "弹窗表单",
+ "content": "通过 default 默认插槽实现嵌套表单以及表单提交的逻辑。
\n默认关闭弹窗的时候重置表单，设置is-form-reset 为false,则关闭弹窗的时候不重置表格
",
+ "link": "dialog-box/form-in-dialog",
+ "component": " DialogBox 对话框",
+ "findIntroStr": "模态对话框，在浮层中显示，引导用户进行相关操作。",
+ "demoId": "form-in-dialog"
+ }
+]
diff --git a/examples/docs/resources/pc/demo-config/zh-CN/dropdown.json b/examples/docs/resources/pc/demo-config/zh-CN/dropdown.json
index a766941d4..161175f8a 100644
--- a/examples/docs/resources/pc/demo-config/zh-CN/dropdown.json
+++ b/examples/docs/resources/pc/demo-config/zh-CN/dropdown.json
@@ -23,6 +23,14 @@
"findIntroStr": "Dropdown 下拉菜单。",
"demoId": "trigger"
},
+ {
+ "title": "自定义文本",
+ "content": "Dropdown 可以通过title 属性去自定义显示文本
\n",
+ "link": "dropdown/title",
+ "component": "Dropdown 下拉菜单",
+ "findIntroStr": "Dropdown 下拉菜单。",
+ "demoId": "title"
+ },
{
"title": "菜单隐藏方式",
"content": "下拉菜单默认在点击菜单项后会被隐藏，将 hide-on-click 属性默认为 false 可以关闭此功能。
\n",
@@ -70,5 +78,13 @@
"component": "Dropdown 下拉菜单",
"findIntroStr": "Dropdown 下拉菜单。",
"demoId": "events"
+ },
+ {
+ "title": "默认插槽",
+ "content": "Dropdown 可以通过default 插槽去自定义显示内容
\n",
+ "link": "dropdown/slot-default",
+ "component": "Dropdown 下拉菜单",
+ "findIntroStr": "Dropdown 下拉菜单。",
+ "demoId": "slot-default"
}
]
diff --git a/examples/docs/resources/pc/demo-config/zh-CN/fullscreen.json b/examples/docs/resources/pc/demo-config/zh-CN/fullscreen.json
index d62a37b3f..43f6bf9b8 100644
--- a/examples/docs/resources/pc/demo-config/zh-CN/fullscreen.json
+++ b/examples/docs/resources/pc/demo-config/zh-CN/fullscreen.json
@@ -1 +1,18 @@
-[{"title":"组件式使用","content":"详细用法参考如下示例","link":"fullscreen/example-component","component":" Fullscreen 全屏显示","findIntroStr":"Fullscreen 全屏显示","demoId":"example-component"},{"title":"函数式使用","content":"详细用法参考如下示例","link":"fullscreen/example-api","component":" Fullscreen 全屏显示","findIntroStr":"Fullscreen 全屏显示","demoId":"example-api"}]
+[
+ {
+ "title": "组件式使用",
+ "content": "详细用法参考如下示例",
+ "link": "fullscreen/example-component",
+ "component": " Fullscreen 全屏显示",
+ "findIntroStr": "Fullscreen 全屏显示",
+ "demoId": "example-component"
+ },
+ {
+ "title": "函数式使用",
+ "content": "详细用法参考如下示例",
+ "link": "fullscreen/example-api",
+ "component": " Fullscreen 全屏显示",
+ "findIntroStr": "Fullscreen 全屏显示",
+ "demoId": "example-api"
+ }
+]
diff --git a/examples/docs/resources/pc/demo-config/zh-CN/ip-address.json b/examples/docs/resources/pc/demo-config/zh-CN/ip-address.json
index 3a70c21bd..3b47fc74a 100644
--- a/examples/docs/resources/pc/demo-config/zh-CN/ip-address.json
+++ b/examples/docs/resources/pc/demo-config/zh-CN/ip-address.json
@@ -1 +1,98 @@
-[{"title":"IPv4 类型","content":"可通过 type 属性配置 IPv4 类型，默认是 IPv4。
\n","link":"ip-address/ipv4-type","component":" IpAddress 输入框","findIntroStr":"IP 地址输入框与 HTML 原生的 IpAddress 组件保持一致，同时提供数据绑定功能。","demoId":"ipv4-type"},{"title":"IPv6 类型","content":"可通过 type属性配置为 IPv6 类型，默认是 IPv4。
\n","link":"ip-address/ipv6-type","component":" IpAddress 输入框","findIntroStr":"IP 地址输入框与 HTML 原生的 IpAddress 组件保持一致，同时提供数据绑定功能。","demoId":"ipv6-type"},{"title":"文本只读","content":"通过 readonly 属性设置文本的只读行，默认为 false 。
\n","link":"ip-address/readonly","component":" IpAddress 输入框","findIntroStr":"IP 地址输入框与 HTML 原生的 IpAddress 组件保持一致，同时提供数据绑定功能。","demoId":"readonly"},{"title":"禁用","content":"通过 disabled 属性设置文本是否禁用，默认为 false。
\n","link":"ip-address/disabled","component":" IpAddress 输入框","findIntroStr":"IP 地址输入框与 HTML 原生的 IpAddress 组件保持一致，同时提供数据绑定功能。","demoId":"disabled"},{"title":"输入框大小","content":"可设置为medium，small，mini
\n","link":"ip-address/size","component":" IpAddress 输入框","findIntroStr":"IP 地址输入框与 HTML 原生的 IpAddress 组件保持一致，同时提供数据绑定功能。","demoId":"size"},{"title":"属性设置分隔符","content":"可通过 delimiter 属性设置分隔符(图标类)。
\n","link":"ip-address/delimiter","component":" IpAddress 输入框","findIntroStr":"IP 地址输入框与 HTML 原生的 IpAddress 组件保持一致，同时提供数据绑定功能。","demoId":"delimiter"},{"title":"默认插槽","content":"可通过默认插槽设置分隔符。
\n","link":"ip-address/slots","component":" IpAddress 输入框","findIntroStr":"IP 地址输入框与 HTML 原生的 IpAddress 组件保持一致，同时提供数据绑定功能。","demoId":"slots"},{"title":"focus 事件","content":"文本框获取焦点时触发 focus 事件。
\n","link":"ip-address/focus","component":" IpAddress 输入框","findIntroStr":"IP 地址输入框与 HTML 原生的 IpAddress 组件保持一致，同时提供数据绑定功能。","demoId":"focus"},{"title":"blur 事件","content":"文本框失去焦点时触发 blur 事件。
\n","link":"ip-address/blur","component":" IpAddress 输入框","findIntroStr":"IP 地址输入框与 HTML 原生的 IpAddress 组件保持一致，同时提供数据绑定功能。","demoId":"blur"},{"title":"change 事件","content":"文本框内容改变后触发 change 事件。
\n","link":"ip-address/change","component":" IpAddress 输入框","findIntroStr":"IP 地址输入框与 HTML 原生的 IpAddress 组件保持一致，同时提供数据绑定功能。","demoId":"change"},{"title":"select 事件","content":"文本框内容选中时触发 select 事件。
\n","link":"ip-address/select","component":" IpAddress 输入框","findIntroStr":"IP 地址输入框与 HTML 原生的 IpAddress 组件保持一致，同时提供数据绑定功能。","demoId":"select"}]
+[
+ {
+ "title": "IPv4 类型",
+ "content": "可通过 type 属性配置 IPv4 类型，默认是 IPv4。
\n",
+ "link": "ip-address/ipv4-type",
+ "component": " IpAddress 输入框",
+ "findIntroStr": "IP 地址输入框与 HTML 原生的 IpAddress 组件保持一致，同时提供数据绑定功能。",
+ "demoId": "ipv4-type"
+ },
+ {
+ "title": "IPv6 类型",
+ "content": "可通过 type属性配置为 IPv6 类型，默认是 IPv4。
\n",
+ "link": "ip-address/ipv6-type",
+ "component": " IpAddress 输入框",
+ "findIntroStr": "IP 地址输入框与 HTML 原生的 IpAddress 组件保持一致，同时提供数据绑定功能。",
+ "demoId": "ipv6-type"
+ },
+ {
+ "title": "文本只读",
+ "content": "通过 readonly 属性设置文本的只读行，默认为 false 。
\n",
+ "link": "ip-address/readonly",
+ "component": " IpAddress 输入框",
+ "findIntroStr": "IP 地址输入框与 HTML 原生的 IpAddress 组件保持一致，同时提供数据绑定功能。",
+ "demoId": "readonly"
+ },
+ {
+ "title": "禁用",
+ "content": "通过 disabled 属性设置文本是否禁用，默认为 false。
\n",
+ "link": "ip-address/disabled",
+ "component": " IpAddress 输入框",
+ "findIntroStr": "IP 地址输入框与 HTML 原生的 IpAddress 组件保持一致，同时提供数据绑定功能。",
+ "demoId": "disabled"
+ },
+ {
+ "title": "输入框大小",
+ "content": "可设置为medium，small，mini
\n",
+ "link": "ip-address/size",
+ "component": " IpAddress 输入框",
+ "findIntroStr": "IP 地址输入框与 HTML 原生的 IpAddress 组件保持一致，同时提供数据绑定功能。",
+ "demoId": "size"
+ },
+ {
+ "title": "属性设置分隔符",
+ "content": "可通过 delimiter 属性设置分隔符(图标类)。
\n",
+ "link": "ip-address/delimiter",
+ "component": " IpAddress 输入框",
+ "findIntroStr": "IP 地址输入框与 HTML 原生的 IpAddress 组件保持一致，同时提供数据绑定功能。",
+ "demoId": "delimiter"
+ },
+ {
+ "title": "默认插槽",
+ "content": "可通过默认插槽设置分隔符。
\n",
+ "link": "ip-address/slots",
+ "component": " IpAddress 输入框",
+ "findIntroStr": "IP 地址输入框与 HTML 原生的 IpAddress 组件保持一致，同时提供数据绑定功能。",
+ "demoId": "slots"
+ },
+ {
+ "title": "focus 事件",
+ "content": "文本框获取焦点时触发 focus 事件。
\n",
+ "link": "ip-address/focus",
+ "component": " IpAddress 输入框",
+ "findIntroStr": "IP 地址输入框与 HTML 原生的 IpAddress 组件保持一致，同时提供数据绑定功能。",
+ "demoId": "focus"
+ },
+ {
+ "title": "blur 事件",
+ "content": "文本框失去焦点时触发 blur 事件。
\n",
+ "link": "ip-address/blur",
+ "component": " IpAddress 输入框",
+ "findIntroStr": "IP 地址输入框与 HTML 原生的 IpAddress 组件保持一致，同时提供数据绑定功能。",
+ "demoId": "blur"
+ },
+ {
+ "title": "change 事件",
+ "content": "文本框内容改变后触发 change 事件。
\n",
+ "link": "ip-address/change",
+ "component": " IpAddress 输入框",
+ "findIntroStr": "IP 地址输入框与 HTML 原生的 IpAddress 组件保持一致，同时提供数据绑定功能。",
+ "demoId": "change"
+ },
+ {
+ "title": "select 事件",
+ "content": "文本框内容选中时触发 select 事件。
\n",
+ "link": "ip-address/select",
+ "component": " IpAddress 输入框",
+ "findIntroStr": "IP 地址输入框与 HTML 原生的 IpAddress 组件保持一致，同时提供数据绑定功能。",
+ "demoId": "select"
+ },
+ {
+ "title": "input 事件",
+ "content": "文本框输入时触发 input 事件。
\n",
+ "link": "ip-address/input",
+ "component": " IpAddress 输入框",
+ "findIntroStr": "IP 地址输入框与 HTML 原生的 IpAddress 组件保持一致，同时提供数据绑定功能。",
+ "demoId": "input"
+ }
+]
diff --git a/examples/docs/resources/pc/demo-config/zh-CN/modal.json b/examples/docs/resources/pc/demo-config/zh-CN/modal.json
index 757513ed4..46a81fb5a 100644
--- a/examples/docs/resources/pc/demo-config/zh-CN/modal.json
+++ b/examples/docs/resources/pc/demo-config/zh-CN/modal.json
@@ -1 +1,250 @@
-[{"title":"基本用法","content":"可通过 Modal.alert 方法设置弹出框，通过 Modal.confirm 方法设置确认弹出框。
\n","link":"modal/base","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"base"},{"title":"最大化显示","content":"可通过 fullscreen 属性设置是否最大化显示。
\n","link":"modal/fullscreen","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"fullscreen"},{"title":"按 Esc 键关闭弹出框","content":"可通过 esc-closable 属性设置是否允许按 Esc 键关闭窗口，默认为 false。
\n","link":"modal/esc-closable","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"esc-closable"},{"title":"自动关闭延时","content":"可通过 duration 属性设置自动关闭的延迟时间，只对 type=message 有效。
\n","link":"modal/duration","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"duration"},{"title":"防止重复提示","content":"如果不想窗口重复点击，可以设置唯一的 id 防止重复提示，只对 type=message 有效。
\n","link":"modal/id","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"id"},{"title":"锁住滚动条","content":"可通过 lock-scroll 属性设置是否锁住滚动条，不允许页面滚动。
\n","link":"modal/lock-scroll","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"lock-scroll"},{"title":"锁住页面","content":"可通过 lock-view 属性设置是否锁住页面，不允许窗口之外的任何操作。
\n","link":"modal/lock-view","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"lock-view"},{"title":"显示遮罩层","content":"可通过 mask 属性设置是否显示遮罩层，默认为 true。
\n","link":"modal/lock-view","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"lock-view1"},{"title":"点击遮罩层关闭窗口","content":"可通过 mask-closable 属性设置是否允许点击遮罩层关闭窗口。
\n","link":"modal/mask-closable","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"mask-closable"},{"title":"自定义内容","content":"可通过 message 属性设置窗口的内容。
\n","link":"modal/message","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"message"},{"title":"调整窗口大小","content":"可通过和width和height设置窗口的宽高，而通过 resize 设置是否允许拖动调整窗口大小。
\n","link":"modal/resize","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"resize"},{"title":"调整窗口大小后窗口显示的最小宽度","content":"配置 resize 可拖拽属性为 true后，可通过 min-width 属性设置拖拽后窗口的最小宽度。
\n","link":"modal/min-width","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"min-width"},{"title":"调整窗口大小后窗口显示的最小高度","content":"配置 resize 可拖拽属性为 true后，可通过 min-height 属性设置拖拽后窗口的最小高度。
\n","link":"modal/min-height","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"min-height"},{"title":"不显示底部","content":"可通过 showFooter 属性设置是否显示底部，默认为 true。
\n","link":"modal/showFooter","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"showFooter"},{"title":"不显示头部","content":"可通过 showHeader 属性设置是否显示头部，默认为 true。
\n","link":"modal/showHeader","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"showHeader"},{"title":"消息状态","content":"可通过 status 属性设置消息状态，可选值有 info | success | warning | error | loading。
\n","link":"modal/status","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"status"},{"title":"标题","content":"可通过 title 属性设置窗口的标题。
\n","link":"modal/title","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"title"},{"title":"距离顶部的位置","content":"可通过 top 属性设置消息距离顶部的位置，只对 type=message 有效。
\n","link":"modal/top","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"top"},{"title":"窗口类型","content":"可通过 type 属性设置窗口类型，可选值 alert | confirm | message。
\n","link":"modal/type","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"type"},{"title":"绑定值","content":"可通过 value/v-model 属性绑定值。
\n","link":"modal/value","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"value"},{"title":"自定义堆叠顺序","content":"可通过 zIndex 属性设置自定义堆叠顺序（对于某些特殊场景，比如被遮挡时可能会用到）。
\n","link":"modal/zIndex","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"zIndex"},{"title":"取消按钮事件","content":"点击取消按钮时触发 cancel 事件。
\n","link":"modal/cancel-event","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"cancel-event"},{"title":"关闭按钮事件","content":"点击关闭按钮时会触发 close 事件。
\n","link":"modal/close-event","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"close-event"},{"title":"确定按钮事件","content":"点击确定按钮时会触发 confirm 事件。
\n","link":"modal/confirm-event","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"confirm-event"},{"title":"窗口关闭事件","content":"窗口关闭时会触发 hide 事件。
\n","link":"modal/hide-event","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"hide-event"},{"title":"窗口显示事件","content":"在窗口显示时会触发 show 事件。
\n","link":"modal/show-event","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"show-event"},{"title":"窗口缩放事件","content":"窗口缩放时会触发 zoom 事件。
\n","link":"modal/zoom-event","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"zoom-event"},{"title":"关闭弹窗，是否重置表单数据","content":"Modal嵌套表单使用时，关闭弹窗时，重置表单数据
\n设置 is-form-reset 为false,则关闭弹窗是不重置表单
","link":"modal/is-form-reset","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"is-form-reset"},{"title":"默认插槽","content":"可通过 templete 设置默认插槽。
\n","link":"modal/value","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"value1"},{"title":"底部插槽","content":"可通过 slot="footer" 设置底部插槽。
\n","link":"modal/footer-slot","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"footer-slot"},{"title":"嵌套 grid","content":"可通过插槽嵌套 grid
\n","link":"modal/grid","component":" Modal 模态框","findIntroStr":"Modal 模态框","demoId":"grid"}]
+[
+ {
+ "title": "基本用法",
+ "content": "可通过 Modal.alert 方法设置弹出框，通过 Modal.confirm 方法设置确认弹出框。函数返回一个 Promise 对象，其中属性 vm 可用来关闭当前模态框
\n",
+ "link": "modal/base",
+ "component": " Modal 模态框",
+ "findIntroStr": "Modal 模态框",
+ "demoId": "base"
+ },
+ {
+ "title": "最大化显示",
+ "content": "可通过 fullscreen 属性设置是否最大化显示。
\n",
+ "link": "modal/fullscreen",
+ "component": " Modal 模态框",
+ "findIntroStr": "Modal 模态框",
+ "demoId": "fullscreen"
+ },
+ {
+ "title": "按 Esc 键关闭弹出框",
+ "content": "可通过 esc-closable 属性设置是否允许按 Esc 键关闭窗口，默认为 false。
\n",
+ "link": "modal/esc-closable",
+ "component": " Modal 模态框",
+ "findIntroStr": "Modal 模态框",
+ "demoId": "esc-closable"
+ },
+ {
+ "title": "自动关闭延时",
+ "content": "可通过 duration 属性设置自动关闭的延迟时间，只对 type=message 有效。
\n",
+ "link": "modal/duration",
+ "component": " Modal 模态框",
+ "findIntroStr": "Modal 模态框",
+ "demoId": "duration"
+ },
+ {
+ "title": "防止重复提示",
+ "content": "如果不想窗口重复点击，可以设置唯一的 id 防止重复提示，只对 type=message 有效。
\n",
+ "link": "modal/id",
+ "component": " Modal 模态框",
+ "findIntroStr": "Modal 模态框",
+ "demoId": "id"
+ },
+ {
+ "title": "锁住滚动条",
+ "content": "可通过 lock-scroll 属性设置是否锁住滚动条，不允许页面滚动。
\n",
+ "link": "modal/lock-scroll",
+ "component": " Modal 模态框",
+ "findIntroStr": "Modal 模态框",
+ "demoId": "lock-scroll"
+ },
+ {
+ "title": "锁住页面",
+ "content": "可通过 lock-view 属性设置是否锁住页面，不允许窗口之外的任何操作。
\n",
+ "link": "modal/lock-view",
+ "component": " Modal 模态框",
+ "findIntroStr": "Modal 模态框",
+ "demoId": "lock-view"
+ },
+ {
+ "title": "显示遮罩层",
+ "content": "可通过 mask 属性设置是否显示遮罩层，默认为 true。
\n",
+ "link": "modal/lock-view",
+ "component": " Modal 模态框",
+ "findIntroStr": "Modal 模态框",
+ "demoId": "lock-view1"
+ },
+ {
+ "title": "点击遮罩层关闭窗口",
+ "content": "可通过 mask-closable 属性设置是否允许点击遮罩层关闭窗口。
\n",
+ "link": "modal/mask-closable",
+ "component": " Modal 模态框",
+ "findIntroStr": "Modal 模态框",
+ "demoId": "mask-closable"
+ },
+ {
+ "title": "自定义内容",
+ "content": "可通过 message 属性设置窗口的内容。
\n",
+ "link": "modal/message",
+ "component": " Modal 模态框",
+ "findIntroStr": "Modal 模态框",
+ "demoId": "message"
+ },
+ {
+ "title": "调整窗口大小",
+ "content": "可通过和width和height设置窗口的宽高，而通过 resize 设置是否允许拖动调整窗口大小。
\n",
+ "link": "modal/resize",
+ "component": " Modal 模态框",
+ "findIntroStr": "Modal 模态框",
+ "demoId": "resize"
+ },
+ {
+ "title": "调整窗口大小后窗口显示的最小宽度",
+ "content": "配置 resize 可拖拽属性为 true后，可通过 min-width 属性设置拖拽后窗口的最小宽度。
\n",
+ "link": "modal/min-width",
+ "component": " Modal 模态框",
+ "findIntroStr": "Modal 模态框",
+ "demoId": "min-width"
+ },
+ {
+ "title": "调整窗口大小后窗口显示的最小高度",
+ "content": "配置 resize 可拖拽属性为 true后，可通过 min-height 属性设置拖拽后窗口的最小高度。
\n",
+ "link": "modal/min-height",
+ "component": " Modal 模态框",
+ "findIntroStr": "Modal 模态框",
+ "demoId": "min-height"
+ },
+ {
+ "title": "不显示底部",
+ "content": "可通过 showFooter 属性设置是否显示底部，默认为 true。
\n",
+ "link": "modal/showFooter",
+ "component": " Modal 模态框",
+ "findIntroStr": "Modal 模态框",
+ "demoId": "showFooter"
+ },
+ {
+ "title": "不显示头部",
+ "content": "可通过 showHeader 属性设置是否显示头部，默认为 true。
\n",
+ "link": "modal/showHeader",
+ "component": " Modal 模态框",
+ "findIntroStr": "Modal 模态框",
+ "demoId": "showHeader"
+ },
+ {
+ "title": "消息状态",
+ "content": "可通过 status 属性设置消息状态，可选值有 info | success | warning | error | loading。
\n",
+ "link": "modal/status",
+ "component": " Modal 模态框",
+ "findIntroStr": "Modal 模态框",
+ "demoId": "status"
+ },
+ {
+ "title": "标题",
+ "content": "可通过 title 属性设置窗口的标题。
\n",
+ "link": "modal/title",
+ "component": " Modal 模态框",
+ "findIntroStr": "Modal 模态框",
+ "demoId": "title"
+ },
+ {
+ "title": "距离顶部的位置",
+ "content": "可通过 top 属性设置消息距离顶部的位置，只对 type=message 有效。
\n",
+ "link": "modal/top",
+ "component": " Modal 模态框",
+ "findIntroStr": "Modal 模态框",
+ "demoId": "top"
+ },
+ {
+ "title": "窗口类型",
+ "content": "可通过 type 属性设置窗口类型，可选值 alert | confirm | message。
\n",
+ "link": "modal/type",
+ "component": " Modal 模态框",
+ "findIntroStr": "Modal 模态框",
+ "demoId": "type"
+ },
+ {
+ "title": "绑定值",
+ "content": "可通过 value/v-model 属性绑定值。
\n",
+ "link": "modal/value",
+ "component": " Modal 模态框",
+ "findIntroStr": "Modal 模态框",
+ "demoId": "value"
+ },
+ {
+ "title": "自定义堆叠顺序",
+ "content": "可通过 zIndex 属性设置自定义堆叠顺序（对于某些特殊场景，比如被遮挡时可能会用到）。
\n",
+ "link": "modal/zIndex",
+ "component": " Modal 模态框",
+ "findIntroStr": "Modal 模态框",
+ "demoId": "zIndex"
+ },
+ {
+ "title": "取消按钮事件",
+ "content": "点击取消按钮时触发 cancel 事件。
\n",
+ "link": "modal/cancel-event",
+ "component": " Modal 模态框",
+ "findIntroStr": "Modal 模态框",
+ "demoId": "cancel-event"
+ },
+ {
+ "title": "关闭按钮事件",
+ "content": "点击关闭按钮时会触发 close 事件。
\n",
+ "link": "modal/close-event",
+ "component": " Modal 模态框",
+ "findIntroStr": "Modal 模态框",
+ "demoId": "close-event"
+ },
+ {
+ "title": "确定按钮事件",
+ "content": "点击确定按钮时会触发 confirm 事件。
\n",
+ "link": "modal/confirm-event",
+ "component": " Modal 模态框",
+ "findIntroStr": "Modal 模态框",
+ "demoId": "confirm-event"
+ },
+ {
+ "title": "窗口关闭事件",
+ "content": "窗口关闭时会触发 hide 事件。
\n",
+ "link": "modal/hide-event",
+ "component": " Modal 模态框",
+ "findIntroStr": "Modal 模态框",
+ "demoId": "hide-event"
+ },
+ {
+ "title": "窗口显示事件",
+ "content": "在窗口显示时会触发 show 事件。
\n",
+ "link": "modal/show-event",
+ "component": " Modal 模态框",
+ "findIntroStr": "Modal 模态框",
+ "demoId": "show-event"
+ },
+ {
+ "title": "窗口缩放事件",
+ "content": "窗口缩放时会触发 zoom 事件。
\n",
+ "link": "modal/zoom-event",
+ "component": " Modal 模态框",
+ "findIntroStr": "Modal 模态框",
+ "demoId": "zoom-event"
+ },
+ {
+ "title": "关闭弹窗，是否重置表单数据",
+ "content": "Modal嵌套表单使用时，关闭弹窗时，重置表单数据
\n设置 is-form-reset 为false,则关闭弹窗是不重置表单
",
+ "link": "modal/is-form-reset",
+ "component": " Modal 模态框",
+ "findIntroStr": "Modal 模态框",
+ "demoId": "is-form-reset"
+ },
+ {
+ "title": "默认插槽",
+ "content": "可通过 templete 设置默认插槽。
\n",
+ "link": "modal/value",
+ "component": " Modal 模态框",
+ "findIntroStr": "Modal 模态框",
+ "demoId": "value1"
+ },
+ {
+ "title": "底部插槽",
+ "content": "可通过 slot="footer" 设置底部插槽。
\n",
+ "link": "modal/footer-slot",
+ "component": " Modal 模态框",
+ "findIntroStr": "Modal 模态框",
+ "demoId": "footer-slot"
+ },
+ {
+ "title": "嵌套 grid",
+ "content": "可通过插槽嵌套 grid
\n",
+ "link": "modal/grid",
+ "component": " Modal 模态框",
+ "findIntroStr": "Modal 模态框",
+ "demoId": "grid"
+ }
+]
diff --git a/examples/docs/resources/pc/demo-config/zh-CN/numeric.json b/examples/docs/resources/pc/demo-config/zh-CN/numeric.json
index e72b82d16..20bd1ac2b 100644
--- a/examples/docs/resources/pc/demo-config/zh-CN/numeric.json
+++ b/examples/docs/resources/pc/demo-config/zh-CN/numeric.json
@@ -1 +1,130 @@
-[{"title":"基本用法","content":"详细用法参考如下示例","link":"numeric/basic-usage","component":" Numeric 计数器","findIntroStr":"Numeric 计数器可用于输入数字,可自定义数值范围，步进大小。支持鼠标键盘增减。","demoId":"basic-usage"},{"title":"可清空特性","content":"可通过 allow-empty 属性设置计数器内容的可清空特性。默认为 false，表示不可清空。
\n","link":"numeric/allow-empty","component":" Numeric 计数器","findIntroStr":"Numeric 计数器可用于输入数字,可自定义数值范围，步进大小。支持鼠标键盘增减。","demoId":"allow-empty"},{"title":"步长","content":"可通过 step 属性设置计数器的步长。
\n","link":"numeric/about-step","component":" Numeric 计数器","findIntroStr":"Numeric 计数器可用于输入数字,可自定义数值范围，步进大小。支持鼠标键盘增减。","demoId":"about-step"},{"title":"数值循环","content":"可通过设置 max 属性设置计数器允许的最大值，通过设置 min 属性设置计数器允许的最小值,通过设置 circulate 属性设置向上到达最大值后从最小值开始，或反过来。
\n","link":"numeric/max-min","component":" Numeric 计数器","findIntroStr":"Numeric 计数器可用于输入数字,可自定义数值范围，步进大小。支持鼠标键盘增减。","demoId":"max-min"},{"title":"尺寸","content":"可通过 size 属性设置计数器尺寸。可取值 medium / small / mini。
\n","link":"numeric/numeric-size","component":" Numeric 计数器","findIntroStr":"Numeric 计数器可用于输入数字,可自定义数值范围，步进大小。支持鼠标键盘增减。","demoId":"numeric-size"},{"title":"控制按钮","content":"可通过 controls 属性设置计数器是否有控制按钮。
\n","link":"numeric/controls","component":" Numeric 计数器","findIntroStr":"Numeric 计数器可用于输入数字,可自定义数值范围，步进大小。支持鼠标键盘增减。","demoId":"controls"},{"title":"控制按钮显示位置","content":"可通过 controls-position 属性设置控制按钮显示的位置。
\n","link":"numeric/controls-position","component":" Numeric 计数器","findIntroStr":"Numeric 计数器可用于输入数字,可自定义数值范围，步进大小。支持鼠标键盘增减。","demoId":"controls-position"},{"title":"关联文字","content":"可通过 label 属性设置输入框关联的 label 文字。
\n","link":"numeric/controls","component":" Numeric 计数器","findIntroStr":"Numeric 计数器可用于输入数字,可自定义数值范围，步进大小。支持鼠标键盘增减。","demoId":"controls1"},{"title":"disabled","content":"通过设置 disabled 控制是否禁用计数器","link":"numeric/dynamic-disabled","component":"Numeric 计数器","findIntroStr":"Numeric 计数器可用于输入数字,可自定义数值范围，步进大小。支持鼠标键盘增减。","demoId":"dynamic-disabled"},{"title":"name","content":"可通过 name 属性设置原生属性。
\n","link":"numeric/controls","component":" Numeric 计数器","findIntroStr":"Numeric 计数器可用于输入数字,可自定义数值范围，步进大小。支持鼠标键盘增减。","demoId":"controls2"},{"title":"数值精度","content":"可通过 precision 属性设置计数器的精度值。
\n","link":"numeric/precision","component":" Numeric 计数器","findIntroStr":"Numeric 计数器可用于输入数字,可自定义数值范围，步进大小。支持鼠标键盘增减。","demoId":"precision"},{"title":"鼠标滚轮滚动改变值","content":"可通过 mouseWheel 属性控制鼠标滚动滑轮是否能改变数值。
\n","link":"numeric/mouse-wheel","component":" Numeric 计数器","findIntroStr":"Numeric 计数器可用于输入数字,可自定义数值范围，步进大小。支持鼠标键盘增减。","demoId":"mouse-wheel"},{"title":"聚焦事件","content":"输入框获得焦点时触发 focus 事件。
\n","link":"numeric/focus-event","component":" Numeric 计数器","findIntroStr":"Numeric 计数器可用于输入数字,可自定义数值范围，步进大小。支持鼠标键盘增减。","demoId":"focus-event"},{"title":"失焦事件","content":"输入框失去焦点时触发 blur 事件。
\n","link":"numeric/blur-event","component":" Numeric 计数器","findIntroStr":"Numeric 计数器可用于输入数字,可自定义数值范围，步进大小。支持鼠标键盘增减。","demoId":"blur-event"},{"title":"值改变事件","content":"输入框值被改变时触发 change 事件。
\n","link":"numeric/change-event","component":" Numeric 计数器","findIntroStr":"Numeric 计数器可用于输入数字,可自定义数值范围，步进大小。支持鼠标键盘增减。","demoId":"change-event"},{"title":"根据商品数量自动计算价格","content":"根据商品数量自动计算价格。
\n","link":"numeric/calculate-according-to-num-of-goods","component":" Numeric 计数器","findIntroStr":"Numeric 计数器可用于输入数字,可自定义数值范围，步进大小。支持鼠标键盘增减。","demoId":"calculate-according-to-num-of-goods"}]
+[
+ {
+ "title": "基本用法",
+ "content": "详细用法参考如下示例",
+ "link": "numeric/basic-usage",
+ "component": " Numeric 计数器",
+ "findIntroStr": "Numeric 计数器可用于输入数字,可自定义数值范围，步进大小。支持鼠标键盘增减。",
+ "demoId": "basic-usage"
+ },
+ {
+ "title": "可清空特性",
+ "content": "可通过 allow-empty 属性设置计数器内容的可清空特性。默认为 false，表示不可清空。
\n",
+ "link": "numeric/allow-empty",
+ "component": " Numeric 计数器",
+ "findIntroStr": "Numeric 计数器可用于输入数字,可自定义数值范围，步进大小。支持鼠标键盘增减。",
+ "demoId": "allow-empty"
+ },
+ {
+ "title": "步长",
+ "content": "可通过 step 属性设置计数器的步长。
\n",
+ "link": "numeric/about-step",
+ "component": " Numeric 计数器",
+ "findIntroStr": "Numeric 计数器可用于输入数字,可自定义数值范围，步进大小。支持鼠标键盘增减。",
+ "demoId": "about-step"
+ },
+ {
+ "title": "最值与数值循环",
+ "content": "可通过设置 max 属性设置计数器允许的最大值，通过设置 min 属性设置计数器允许的最小值,通过设置 circulate 属性设置向上到达最大值后从最小值开始，或反过来。
\n",
+ "link": "numeric/max-min",
+ "component": " Numeric 计数器",
+ "findIntroStr": "Numeric 计数器可用于输入数字,可自定义数值范围，步进大小。支持鼠标键盘增减。",
+ "demoId": "max-min"
+ },
+ {
+ "title": "尺寸",
+ "content": "可通过 size 属性设置计数器尺寸。可取值 medium / small / mini。
\n",
+ "link": "numeric/numeric-size",
+ "component": " Numeric 计数器",
+ "findIntroStr": "Numeric 计数器可用于输入数字,可自定义数值范围，步进大小。支持鼠标键盘增减。",
+ "demoId": "numeric-size"
+ },
+ {
+ "title": "控制按钮",
+ "content": "可通过 controls 属性设置计数器是否有控制按钮。
\n",
+ "link": "numeric/controls",
+ "component": " Numeric 计数器",
+ "findIntroStr": "Numeric 计数器可用于输入数字,可自定义数值范围，步进大小。支持鼠标键盘增减。",
+ "demoId": "controls"
+ },
+ {
+ "title": "控制按钮显示位置",
+ "content": "可通过 controls-position 属性设置控制按钮显示的位置。
\n",
+ "link": "numeric/controls-position",
+ "component": " Numeric 计数器",
+ "findIntroStr": "Numeric 计数器可用于输入数字,可自定义数值范围，步进大小。支持鼠标键盘增减。",
+ "demoId": "controls-position"
+ },
+ {
+ "title": "关联文字",
+ "content": "可通过 label 属性设置输入框关联的 label 文字。
\n",
+ "link": "numeric/controls",
+ "component": " Numeric 计数器",
+ "findIntroStr": "Numeric 计数器可用于输入数字,可自定义数值范围，步进大小。支持鼠标键盘增减。",
+ "demoId": "controls1"
+ },
+ {
+ "title": "disabled",
+ "content": "通过设置 disabled 控制是否禁用计数器",
+ "link": "numeric/dynamic-disabled",
+ "component": "Numeric 计数器",
+ "findIntroStr": "Numeric 计数器可用于输入数字,可自定义数值范围，步进大小。支持鼠标键盘增减。",
+ "demoId": "dynamic-disabled"
+ },
+ {
+ "title": "name",
+ "content": "可通过 name 属性设置原生属性。
\n",
+ "link": "numeric/controls",
+ "component": " Numeric 计数器",
+ "findIntroStr": "Numeric 计数器可用于输入数字,可自定义数值范围，步进大小。支持鼠标键盘增减。",
+ "demoId": "controls2"
+ },
+ {
+ "title": "数值精度",
+ "content": "可通过 precision 属性设置计数器的精度值。
\n",
+ "link": "numeric/precision",
+ "component": " Numeric 计数器",
+ "findIntroStr": "Numeric 计数器可用于输入数字,可自定义数值范围，步进大小。支持鼠标键盘增减。",
+ "demoId": "precision"
+ },
+ {
+ "title": "鼠标滚轮滚动改变值",
+ "content": "可通过 mouseWheel 属性控制鼠标滚动滑轮是否能改变数值。
\n",
+ "link": "numeric/mouse-wheel",
+ "component": " Numeric 计数器",
+ "findIntroStr": "Numeric 计数器可用于输入数字,可自定义数值范围，步进大小。支持鼠标键盘增减。",
+ "demoId": "mouse-wheel"
+ },
+ {
+ "title": "聚焦事件",
+ "content": "输入框获得焦点时触发 focus 事件。
\n",
+ "link": "numeric/focus-event",
+ "component": " Numeric 计数器",
+ "findIntroStr": "Numeric 计数器可用于输入数字,可自定义数值范围，步进大小。支持鼠标键盘增减。",
+ "demoId": "focus-event"
+ },
+ {
+ "title": "失焦事件",
+ "content": "输入框失去焦点时触发 blur 事件。
\n",
+ "link": "numeric/blur-event",
+ "component": " Numeric 计数器",
+ "findIntroStr": "Numeric 计数器可用于输入数字,可自定义数值范围，步进大小。支持鼠标键盘增减。",
+ "demoId": "blur-event"
+ },
+ {
+ "title": "值改变事件",
+ "content": "输入框值被改变时触发 change 事件。
\n",
+ "link": "numeric/change-event",
+ "component": " Numeric 计数器",
+ "findIntroStr": "Numeric 计数器可用于输入数字,可自定义数值范围，步进大小。支持鼠标键盘增减。",
+ "demoId": "change-event"
+ },
+ {
+ "title": "根据商品数量自动计算价格",
+ "content": "根据商品数量自动计算价格。
\n",
+ "link": "numeric/calculate-according-to-num-of-goods",
+ "component": " Numeric 计数器",
+ "findIntroStr": "Numeric 计数器可用于输入数字,可自定义数值范围，步进大小。支持鼠标键盘增减。",
+ "demoId": "calculate-according-to-num-of-goods"
+ }
+]
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo-config/zh-CN/pop-upload.json b/examples/docs/resources/pc/demo-config/zh-CN/pop-upload.json
index bcfd03bce..6319e31fa 100644
--- a/examples/docs/resources/pc/demo-config/zh-CN/pop-upload.json
+++ b/examples/docs/resources/pc/demo-config/zh-CN/pop-upload.json
@@ -1 +1,122 @@
-[{"title":"基本用法","content":"通过 action 属性设置上传的服务接口。
\n","link":"pop-upload/basic-usage","component":" PopUpload 弹出框上传","findIntroStr":"点击所设置的元素，弹出上传对话框。","demoId":"basic-usage"},{"title":"自定义请求头","content":"通过 headers 属性自定义上传请求头信息。
\n","link":"pop-upload/custom-request-headers","component":" PopUpload 弹出框上传","findIntroStr":"点击所设置的元素，弹出上传对话框。","demoId":"custom-request-headers"},{"title":"上传时附带的额外参数","content":"通过 data 属性自定义上传时附带的额外参数。
\n","link":"pop-upload/data","component":" PopUpload 弹出框上传","findIntroStr":"点击所设置的元素，弹出上传对话框。","demoId":"data"},{"title":"设置组件大小","content":"可设置为：medium，small，mini\n通过 disabled 属性设置是否禁用，默认值为 false 。
\n","link":"pop-upload/size","component":" PopUpload 弹出框上传","findIntroStr":"点击所设置的元素，弹出上传对话框。","demoId":"size"},{"title":"覆盖默认请求","content":"通过配置 http-request 覆盖默认的上传行为，可以自定义上传的实现
\n","link":"pop-upload/http-request","component":" PopUpload 弹出框上传","findIntroStr":"点击所设置的元素，弹出上传对话框。","demoId":"http-request"},{"title":"上传的文件字段名","content":"通过 upload-name 属性设置上传的文件字段名，默认值为 file 。
\n","link":"pop-upload/upload-name","component":" PopUpload 弹出框上传","findIntroStr":"点击所设置的元素，弹出上传对话框。","demoId":"upload-name1"},{"title":"发送 cookie 凭证信息","content":"详细用法参考如下示例","link":"pop-upload/upload-name","component":" PopUpload 弹出框上传","findIntroStr":"点击所设置的元素，弹出上传对话框。","demoId":"upload-name"},{"title":"文件上传弹框中取消按钮的文本","content":"通过 cancel-button-text 属性指定取消按钮的文本内容
\n","link":"pop-upload/fill-button-text","component":" PopUpload 弹出框上传","findIntroStr":"点击所设置的元素，弹出上传对话框。","demoId":"fill-button-text1"},{"title":"文件上传弹框中提交按钮的文本","content":"详细用法参考如下示例","link":"pop-upload/fill-button-text","component":" PopUpload 弹出框上传","findIntroStr":"点击所设置的元素，弹出上传对话框。","demoId":"fill-button-text2"},{"title":"打开弹出框的按钮的文本","content":"详细用法参考如下示例","link":"pop-upload/fill-button-text","component":" PopUpload 弹出框上传","findIntroStr":"点击所设置的元素，弹出上传对话框。","demoId":"fill-button-text4"},{"title":"最大上传文件数","content":"通过 limit 属性可以指定最大上传的文件数量，配置 multiple 属性后可同时选择多个文件。
\n","link":"pop-upload/file-limit","component":" PopUpload 弹出框上传","findIntroStr":"点击所设置的元素，弹出上传对话框。","demoId":"file-limit"},{"title":"可上传文件类型","content":"通过 accept 属性可以对选择文件时的文件类型进行控制，而 upload-file-type 属性可以指定在上传时进行校验的文件类型。
\n","link":"pop-upload/file-type","component":" PopUpload 弹出框上传","findIntroStr":"点击所设置的元素，弹出上传对话框。","demoId":"file-type"},{"title":"可上传文件大小","content":"通过 max-upload-file-size 属性指定可上传文件的大小。
\n","link":"pop-upload/max-upload-file-size","component":" PopUpload 弹出框上传","findIntroStr":"点击所设置的元素，弹出上传对话框。","demoId":"max-upload-file-size"},{"title":"阻止删除文件","content":":before-remove（移除文件前回调事件）,方法里面return true/false，表示是否可以删除
\n","link":"pop-upload/prevent-delete-file","component":" PopUpload 弹出框上传","findIntroStr":"点击所设置的元素，弹出上传对话框。","demoId":"prevent-delete-file"},{"title":"阻止上传文件","content":":before-upload 上传文件之前的钩子，参数为上传的文件，若返回 false 或者返回 Promise 且被 reject，则停止上传
\n","link":"pop-upload/before-upload","component":" PopUpload 弹出框上传","findIntroStr":"点击所设置的元素，弹出上传对话框。","demoId":"before-upload"}]
+[
+ {
+ "title": "基本用法",
+ "content": "通过 action 属性设置上传的服务接口。
\n",
+ "link": "pop-upload/basic-usage",
+ "component": " PopUpload 弹出框上传",
+ "findIntroStr": "点击所设置的元素，弹出上传对话框。",
+ "demoId": "basic-usage"
+ },
+ {
+ "title": "自定义请求头",
+ "content": "通过 headers 属性自定义上传请求头信息。
\n",
+ "link": "pop-upload/custom-request-headers",
+ "component": " PopUpload 弹出框上传",
+ "findIntroStr": "点击所设置的元素，弹出上传对话框。",
+ "demoId": "custom-request-headers"
+ },
+ {
+ "title": "上传时附带的额外参数",
+ "content": "通过 data 属性自定义上传时附带的额外参数。
\n",
+ "link": "pop-upload/data",
+ "component": " PopUpload 弹出框上传",
+ "findIntroStr": "点击所设置的元素，弹出上传对话框。",
+ "demoId": "data"
+ },
+ {
+ "title": "设置组件大小",
+ "content": "可设置为：medium，small，mini\n通过 disabled 属性设置是否禁用，默认值为 false 。
\n",
+ "link": "pop-upload/size",
+ "component": " PopUpload 弹出框上传",
+ "findIntroStr": "点击所设置的元素，弹出上传对话框。",
+ "demoId": "size"
+ },
+ {
+ "title": "覆盖默认请求",
+ "content": "通过配置 http-request 覆盖默认的上传行为，可以自定义上传的实现
\n",
+ "link": "pop-upload/http-request",
+ "component": " PopUpload 弹出框上传",
+ "findIntroStr": "点击所设置的元素，弹出上传对话框。",
+ "demoId": "http-request"
+ },
+ {
+ "title": "上传的文件字段名",
+ "content": "通过 upload-name 属性设置上传的文件字段名，默认值为 file 。
\n",
+ "link": "pop-upload/upload-name",
+ "component": " PopUpload 弹出框上传",
+ "findIntroStr": "点击所设置的元素，弹出上传对话框。",
+ "demoId": "upload-name1"
+ },
+ {
+ "title": "发送 cookie 凭证信息",
+ "content": "详细用法参考如下示例",
+ "link": "pop-upload/upload-name",
+ "component": " PopUpload 弹出框上传",
+ "findIntroStr": "点击所设置的元素，弹出上传对话框。",
+ "demoId": "upload-name"
+ },
+ {
+ "title": "文件上传弹框中取消按钮的文本",
+ "content": "通过 cancel-button-text 属性指定取消按钮的文本内容
\n",
+ "link": "pop-upload/fill-button-text",
+ "component": " PopUpload 弹出框上传",
+ "findIntroStr": "点击所设置的元素，弹出上传对话框。",
+ "demoId": "fill-button-text1"
+ },
+ {
+ "title": "文件上传弹框中提交按钮的文本",
+ "content": "详细用法参考如下示例",
+ "link": "pop-upload/fill-button-text",
+ "component": " PopUpload 弹出框上传",
+ "findIntroStr": "点击所设置的元素，弹出上传对话框。",
+ "demoId": "fill-button-text2"
+ },
+ {
+ "title": "打开弹出框的按钮的文本",
+ "content": "详细用法参考如下示例",
+ "link": "pop-upload/fill-button-text",
+ "component": " PopUpload 弹出框上传",
+ "findIntroStr": "点击所设置的元素，弹出上传对话框。",
+ "demoId": "fill-button-text4"
+ },
+ {
+ "title": "最大上传文件数",
+ "content": "通过 limit 属性可以指定最大上传的文件数量，配置 multiple 属性后可同时选择多个文件。
\n",
+ "link": "pop-upload/file-limit",
+ "component": " PopUpload 弹出框上传",
+ "findIntroStr": "点击所设置的元素，弹出上传对话框。",
+ "demoId": "file-limit"
+ },
+ {
+ "title": "可上传文件类型",
+ "content": "通过 accept 属性可以对选择文件时的文件类型进行控制，而 upload-file-type 属性可以指定在上传时进行校验的文件类型。
\n",
+ "link": "pop-upload/file-type",
+ "component": " PopUpload 弹出框上传",
+ "findIntroStr": "点击所设置的元素，弹出上传对话框。",
+ "demoId": "file-type"
+ },
+ {
+ "title": "可上传文件大小",
+ "content": "通过 max-upload-file-size 属性指定可上传文件的大小。
\n",
+ "link": "pop-upload/max-upload-file-size",
+ "component": " PopUpload 弹出框上传",
+ "findIntroStr": "点击所设置的元素，弹出上传对话框。",
+ "demoId": "max-upload-file-size"
+ },
+ {
+ "title": "阻止删除文件",
+ "content": ":before-remove（移除文件前回调事件）,方法里面return true/false，表示是否可以删除
\n",
+ "link": "pop-upload/prevent-delete-file",
+ "component": " PopUpload 弹出框上传",
+ "findIntroStr": "点击所设置的元素，弹出上传对话框。",
+ "demoId": "prevent-delete-file"
+ },
+ {
+ "title": "阻止上传文件",
+ "content": ":before-upload 上传文件之前的钩子，参数为上传的文件，若返回 false 或者返回 Promise 且被 reject，则停止上传
\n",
+ "link": "pop-upload/before-upload",
+ "component": " PopUpload 弹出框上传",
+ "findIntroStr": "点击所设置的元素，弹出上传对话框。",
+ "demoId": "before-upload"
+ }
+]
diff --git a/examples/docs/resources/pc/demo-config/zh-CN/popover.json b/examples/docs/resources/pc/demo-config/zh-CN/popover.json
index d61972397..11e9efffe 100644
--- a/examples/docs/resources/pc/demo-config/zh-CN/popover.json
+++ b/examples/docs/resources/pc/demo-config/zh-CN/popover.json
@@ -17,7 +17,7 @@
},
{
"title": "箭头偏移",
- "content": "arrow-offset 设置箭头的偏移量，来改变箭头的位置。
\n",
+ "content": "arrow-offset 设置箭头的在弹窗层上的偏移量。箭头默认至少会保留8px的空间， 以保证箭头不会贴在弹窗层两边。
\n",
"link": "popover/arrow-offset",
"component": " Popover",
"findIntroStr": "Popover可通过对一个触发源操作触发弹出框,支持自定义弹出内容，延迟触发和渐变动画",
diff --git a/examples/docs/resources/pc/demo-config/zh-CN/select.json b/examples/docs/resources/pc/demo-config/zh-CN/select.json
index 5457d1293..0e61dc4e4 100644
--- a/examples/docs/resources/pc/demo-config/zh-CN/select.json
+++ b/examples/docs/resources/pc/demo-config/zh-CN/select.json
@@ -311,6 +311,14 @@
"findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。",
"demoId": "is-drop-inherit-width"
},
+ {
+ "title": "隐藏下拉",
+ "content": "通过 hide-drop 属性设置下拉列表不显示。
\n",
+ "link": "select/hide-select-input-border",
+ "component": " Select 选择器",
+ "findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。",
+ "demoId": "hide-select-input-border"
+ },
{
"title": "默认插槽",
"content": "通过 default 默认插槽列表。
\n",
@@ -433,7 +441,7 @@
},
{
"title": "配置方式",
- "content": "通过设置 cache-op 开启缓存功能并且通过 options 设置下来选项。
\n",
+ "content": "通过设置 cache-op 开启缓存功能并且通过 options 设置下拉选项。
\n",
"link": "select/cache-usage",
"component": " Select 选择器",
"findIntroStr": "Select 选择器是一种通过点击弹出下拉列表展示数据并进行选择的 UI 组件。",
diff --git a/examples/docs/resources/pc/demo-config/zh-CN/time-picker.json b/examples/docs/resources/pc/demo-config/zh-CN/time-picker.json
index b76f53e1d..d0a467f01 100644
--- a/examples/docs/resources/pc/demo-config/zh-CN/time-picker.json
+++ b/examples/docs/resources/pc/demo-config/zh-CN/time-picker.json
@@ -10,10 +10,10 @@
{
"title": "选择范围",
"content": "picker-options 设置时间选择范围
\n",
- "link": "time-picker/basic-usage",
+ "link": "time-picker/picker-options",
"component": " TimePicker 时间选择器",
"findIntroStr": "用于设置/选择日期，包括年月/年月日/年月日时分/年月日时分秒日期格式。",
- "demoId": "basic-usage1"
+ "demoId": "picker-options"
},
{
"title": "箭头选择",
@@ -135,6 +135,14 @@
"findIntroStr": "用于设置/选择日期，包括年月/年月日/年月日时分/年月日时分秒日期格式。",
"demoId": "editable"
},
+ {
+ "title": "禁用状态",
+ "content": "通过设置 disabled 为 true 后，禁用时间输入框。
\n",
+ "link": "time-picker/disabled",
+ "component": " TimePicker 时间选择器",
+ "findIntroStr": "用于设置/选择日期，包括年月/年月日/年月日时分/年月日时分秒日期格式。",
+ "demoId": "disabled"
+ },
{
"title": "事件",
"content": "当聚焦和失焦时会触发 focus 和 bulr 事件，当确定选值时会触发 change 事件
\n",
diff --git a/examples/docs/resources/pc/demo-config/zh-CN/transfer.json b/examples/docs/resources/pc/demo-config/zh-CN/transfer.json
index 46ac34dc6..9e7f48e82 100644
--- a/examples/docs/resources/pc/demo-config/zh-CN/transfer.json
+++ b/examples/docs/resources/pc/demo-config/zh-CN/transfer.json
@@ -1 +1,162 @@
-[{"title":"基本用法","content":"通过 value 属性进行双向绑定，其指定的值为默认选择的值，将展示在右侧列表。\n\ndata 属性提供数据源，其是一个对象数组，对象中默认字段有 key、label、disabled 。
\n","link":"transfer/basic-usage","component":" Transfer 穿梭框","findIntroStr":"穿梭框，提供表格数据的双向选择。","demoId":"basic-usage"},{"title":"数据源","content":"可请求服务获取数据，再将数据赋予 data 。
\n","link":"transfer/data-source","component":" Transfer 穿梭框","findIntroStr":"穿梭框，提供表格数据的双向选择。","demoId":"data-source"},{"title":"展示全部移动按钮","content":"可通过 show-all-btn 属性设置展示全部移动按钮。
\n","link":"transfer/show-all-btn","component":" Transfer 穿梭框","findIntroStr":"穿梭框，提供表格数据的双向选择。","demoId":"show-all-btn"},{"title":"自定义列表标题","content":"通过 titles 属性可对左右列表的标题进行自定义。
\n","link":"transfer/custom-transfer-titles","component":" Transfer 穿梭框","findIntroStr":"穿梭框，提供表格数据的双向选择。","demoId":"custom-transfer-titles"},{"title":"自定义按钮文案","content":"通过 button-texts 属性自定义左右穿梭的按钮文本。
\n","link":"transfer/custom-button-texts","component":" Transfer 穿梭框","findIntroStr":"穿梭框，提供表格数据的双向选择。","demoId":"custom-button-texts"},{"title":"搜索框占位符","content":"通过 filter-placeholder 属性自定义搜索框占位符。
\n","link":"transfer/filter-placeholder","component":" Transfer 穿梭框","findIntroStr":"穿梭框，提供表格数据的双向选择。","demoId":"filter-placeholder"},{"title":"自定义搜索方法","content":"提供 filter-method 钩子函数，可自定义搜索的方法。
\n","link":"transfer/custom-filter-method","component":" Transfer 穿梭框","findIntroStr":"穿梭框，提供表格数据的双向选择。","demoId":"custom-filter-method"},{"title":"默认勾选项","content":"通过 left-default-checked、right-default-checked 属性分别指定左右侧列表默认的勾选数据。
\n","link":"transfer/default-checked","component":" Transfer 穿梭框","findIntroStr":"穿梭框，提供表格数据的双向选择。","demoId":"default-checked"},{"title":"自定义数据项渲染","content":"使用 render-content 自定义数据项
\n","link":"transfer/custom-render-content","component":" Transfer 穿梭框","findIntroStr":"穿梭框，提供表格数据的双向选择。","demoId":"custom-render-content"},{"title":"列表顶部勾选状态文案","content":"指定 format 属性后，勾选数据时，左右侧列表顶部将展示已勾选数据和所有数据的比值。
\n","link":"transfer/checked-format-text","component":" Transfer 穿梭框","findIntroStr":"穿梭框，提供表格数据的双向选择。","demoId":"checked-format-text"},{"title":"可搜索","content":"通过 filterable 属性开启左右侧列表的搜索功能。
\n","link":"transfer/filterable","component":" Transfer 穿梭框","findIntroStr":"穿梭框，提供表格数据的双向选择。","demoId":"filterable"},{"title":"数据源的字段别名","content":"当数据对象中的字段和默认不一致时，可通过 props 属性进行映射。
\n","link":"transfer/props-of-data-source","component":" Transfer 穿梭框","findIntroStr":"穿梭框，提供表格数据的双向选择。","demoId":"props-of-data-source"},{"title":"右侧排序策略","content":"通过 target-order 属性设置右侧列表元素的排序策略，有 original、push、unshift 三个选项，默认为 original 。
\n排序策略
\n
若为 original，则保持与数据源相同的顺序\n若为 push，则新加入的元素排在最后\n若为 unshift，则新加入的元素排在最前
\n
使用拖拽功能时请先安装 sortablejs 插件
\n
通过 drop-config 属性配置 sortablejs 插件进行左右拖拽穿梭。
\n","link":"transfer/drop-config","component":" Transfer 穿梭框","findIntroStr":"穿梭框，提供表格数据的双向选择。","demoId":"drop-config"},{"title":"穿梭框事件","content":"主要有 change、left-check-change、right-check-change 三个事件。
\n事件说明
\n
change：右侧列表元素变化时触发\nleft-check-change：左侧列表元素被用户选中 / 取消选中时触发\nright-check-change：右侧列表元素被用户选中 / 取消选中时触发
\n
调用 clearQuery() 方法可清空左右侧列表的搜索框，参数为 left 或者 right 。
\n","link":"transfer/manual-clear-query","component":" Transfer 穿梭框","findIntroStr":"穿梭框，提供表格数据的双向选择。","demoId":"manual-clear-query"},{"title":"自定义列表底部","content":"通过 left-footer、right-footer 插槽可分别对左右列表底部进行自定义。
\n","link":"transfer/custom-footer","component":" Transfer 穿梭框","findIntroStr":"穿梭框，提供表格数据的双向选择。","demoId":"custom-footer"},{"title":"面板插槽","content":"可通过 left-panel 和 right-panel 自定义左、右侧面板内容；通过 button 自定义穿梭按钮
\n","link":"transfer/panel-slot","component":" Transfer 穿梭框","findIntroStr":"穿梭框，提供表格数据的双向选择。","demoId":"panel-slot"},{"title":"嵌套表格","content":"当 render 属性里的 plugin 设置为 Table 时指定穿梭框渲染成表格，具体配置可参考 grid 组件的配置。
\n","link":"transfer/nested-table","component":" Transfer 穿梭框","findIntroStr":"穿梭框，提供表格数据的双向选择。","demoId":"nested-table"},{"title":"嵌套树","content":"当 render 属性里的 plugin 设置为 Tree 时指定穿梭框渲染成树，通过 treeConfig 属性配置树相关的配置（具体配置可参考 tree 组件的配置）。
\n","link":"transfer/nested-tree","component":" Transfer 穿梭框","findIntroStr":"穿梭框，提供表格数据的双向选择。","demoId":"nested-tree"}]
+[
+ {
+ "title": "基本用法",
+ "content": "通过 value 属性进行双向绑定，其指定的值为默认选择的值，将展示在右侧列表。\n\ndata 属性提供数据源，其是一个对象数组，对象中默认字段有 key、label、disabled 。
\n",
+ "link": "transfer/basic-usage",
+ "component": " Transfer 穿梭框",
+ "findIntroStr": "穿梭框，提供表格数据的双向选择。",
+ "demoId": "basic-usage"
+ },
+ {
+ "title": "数据源",
+ "content": "可请求服务获取数据，再将数据赋予 data 。
\n",
+ "link": "transfer/data-source",
+ "component": " Transfer 穿梭框",
+ "findIntroStr": "穿梭框，提供表格数据的双向选择。",
+ "demoId": "data-source"
+ },
+ {
+ "title": "展示全部移动按钮",
+ "content": "可通过 show-all-btn 属性设置展示全部移动按钮。
\n",
+ "link": "transfer/show-all-btn",
+ "component": " Transfer 穿梭框",
+ "findIntroStr": "穿梭框，提供表格数据的双向选择。",
+ "demoId": "show-all-btn"
+ },
+ {
+ "title": "自定义列表标题",
+ "content": "通过 titles 属性可对左右列表的标题进行自定义。
\n",
+ "link": "transfer/custom-transfer-titles",
+ "component": " Transfer 穿梭框",
+ "findIntroStr": "穿梭框，提供表格数据的双向选择。",
+ "demoId": "custom-transfer-titles"
+ },
+ {
+ "title": "自定义按钮文案",
+ "content": "通过 button-texts 属性自定义左右穿梭的按钮文本。
\n",
+ "link": "transfer/custom-button-texts",
+ "component": " Transfer 穿梭框",
+ "findIntroStr": "穿梭框，提供表格数据的双向选择。",
+ "demoId": "custom-button-texts"
+ },
+ {
+ "title": "搜索框占位符",
+ "content": "通过 filter-placeholder 属性自定义搜索框占位符。
\n",
+ "link": "transfer/filter-placeholder",
+ "component": " Transfer 穿梭框",
+ "findIntroStr": "穿梭框，提供表格数据的双向选择。",
+ "demoId": "filter-placeholder"
+ },
+ {
+ "title": "自定义搜索方法",
+ "content": "提供 filter-method 钩子函数，可自定义搜索的方法。
\n",
+ "link": "transfer/custom-filter-method",
+ "component": " Transfer 穿梭框",
+ "findIntroStr": "穿梭框，提供表格数据的双向选择。",
+ "demoId": "custom-filter-method"
+ },
+ {
+ "title": "默认勾选项",
+ "content": "通过 left-default-checked、right-default-checked 属性分别指定左右侧列表默认的勾选数据。
\n",
+ "link": "transfer/default-checked",
+ "component": " Transfer 穿梭框",
+ "findIntroStr": "穿梭框，提供表格数据的双向选择。",
+ "demoId": "default-checked"
+ },
+ {
+ "title": "自定义数据项渲染",
+ "content": "使用 render-content 自定义数据项
\n",
+ "link": "transfer/custom-render-content",
+ "component": " Transfer 穿梭框",
+ "findIntroStr": "穿梭框，提供表格数据的双向选择。",
+ "demoId": "custom-render-content"
+ },
+ {
+ "title": "列表顶部勾选状态文案",
+ "content": "指定 format 属性后，勾选数据时，左右侧列表顶部将展示已勾选数据和所有数据的比值。
\n",
+ "link": "transfer/checked-format-text",
+ "component": " Transfer 穿梭框",
+ "findIntroStr": "穿梭框，提供表格数据的双向选择。",
+ "demoId": "checked-format-text"
+ },
+ {
+ "title": "可搜索",
+ "content": "通过 filterable 属性开启左右侧列表的搜索功能。
\n",
+ "link": "transfer/filterable",
+ "component": " Transfer 穿梭框",
+ "findIntroStr": "穿梭框，提供表格数据的双向选择。",
+ "demoId": "filterable"
+ },
+ {
+ "title": "数据源的字段别名",
+ "content": "当数据对象中的字段和默认不一致时，可通过 props 属性进行映射。
\n",
+ "link": "transfer/props-of-data-source",
+ "component": " Transfer 穿梭框",
+ "findIntroStr": "穿梭框，提供表格数据的双向选择。",
+ "demoId": "props-of-data-source"
+ },
+ {
+ "title": "右侧排序策略",
+ "content": "通过 target-order 属性设置右侧列表元素的排序策略，有 original、push、unshift 三个选项，默认为 original 。
\n排序策略
\n
若为 original，则保持与数据源相同的顺序\n若为 push，则新加入的元素排在最后\n若为 unshift，则新加入的元素排在最前
\n
使用拖拽功能时请先安装 sortablejs 插件
\n
通过 drop-config 属性配置 sortablejs 插件进行左右拖拽穿梭。
\n",
+ "link": "transfer/drop-config",
+ "component": " Transfer 穿梭框",
+ "findIntroStr": "穿梭框，提供表格数据的双向选择。",
+ "demoId": "drop-config"
+ },
+ {
+ "title": "穿梭框事件",
+ "content": "主要有 change、left-check-change、right-check-change 三个事件。
\n事件说明
\n
change：右侧列表元素变化时触发\nleft-check-change：左侧列表元素被用户选中 / 取消选中时触发\nright-check-change：右侧列表元素被用户选中 / 取消选中时触发
\n
调用 clearQuery() 方法可清空左右侧列表的搜索框，参数为 left 或者 right 。
\n",
+ "link": "transfer/manual-clear-query",
+ "component": " Transfer 穿梭框",
+ "findIntroStr": "穿梭框，提供表格数据的双向选择。",
+ "demoId": "manual-clear-query"
+ },
+ {
+ "title": "自定义列表底部",
+ "content": "通过 left-footer、right-footer 插槽可分别对左右列表底部进行自定义。
\n",
+ "link": "transfer/custom-footer",
+ "component": " Transfer 穿梭框",
+ "findIntroStr": "穿梭框，提供表格数据的双向选择。",
+ "demoId": "custom-footer"
+ },
+ {
+ "title": "面板插槽",
+ "content": "可通过 left-panel 和 right-panel 自定义左、右侧面板内容；通过 button-panel 自定义穿梭按钮
\n",
+ "link": "transfer/panel-slot",
+ "component": " Transfer 穿梭框",
+ "findIntroStr": "穿梭框，提供表格数据的双向选择。",
+ "demoId": "panel-slot"
+ },
+ {
+ "title": "嵌套表格",
+ "content": "当 render 属性里的 plugin 设置为 Table 时指定穿梭框渲染成表格，具体配置可参考 grid 组件的配置。
\n",
+ "link": "transfer/nested-table",
+ "component": " Transfer 穿梭框",
+ "findIntroStr": "穿梭框，提供表格数据的双向选择。",
+ "demoId": "nested-table"
+ },
+ {
+ "title": "嵌套树",
+ "content": "当 render 属性里的 plugin 设置为 Tree 时指定穿梭框渲染成树，通过 treeConfig 属性配置树相关的配置（具体配置可参考 tree 组件的配置）。
\n",
+ "link": "transfer/nested-tree",
+ "component": " Transfer 穿梭框",
+ "findIntroStr": "穿梭框，提供表格数据的双向选择。",
+ "demoId": "nested-tree"
+ }
+]
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo-config/zh-CN/tree-menu.json b/examples/docs/resources/pc/demo-config/zh-CN/tree-menu.json
index fa3c83516..63b78298e 100644
--- a/examples/docs/resources/pc/demo-config/zh-CN/tree-menu.json
+++ b/examples/docs/resources/pc/demo-config/zh-CN/tree-menu.json
@@ -95,38 +95,6 @@
"findIntroStr": "以树形方式显示的菜单，适用于版型定制的一种组件。",
"demoId": "can-draggable"
},
- {
- "title": "拖拽菜单回调事件",
- "content": "拖拽菜单回调事件,配合 draggable 使用。
\n",
- "link": "tree-menu/event-allow-draggable",
- "component": " TreeMenu 树型菜单",
- "findIntroStr": "以树形方式显示的菜单，适用于版型定制的一种组件。",
- "demoId": "event-allow-draggable"
- },
- {
- "title": "节点被展开时触发的事件",
- "content": "节点被展开时触发的事件
\n",
- "link": "tree-menu/event-node-expand",
- "component": " TreeMenu 树型菜单",
- "findIntroStr": "以树形方式显示的菜单，适用于版型定制的一种组件。",
- "demoId": "event-node-expand"
- },
- {
- "title": "节点被关闭时触发的事件",
- "content": "节点被关闭时触发的事件
\n",
- "link": "tree-menu/event-node-collapse",
- "component": " TreeMenu 树型菜单",
- "findIntroStr": "以树形方式显示的菜单，适用于版型定制的一种组件。",
- "demoId": "event-node-collapse"
- },
- {
- "title": "节点选中状态发生变化时的回调",
- "content": "节点选中状态发生变化时的回调
\n",
- "link": "tree-menu/event-check-change",
- "component": " TreeMenu 树型菜单",
- "findIntroStr": "以树形方式显示的菜单，适用于版型定制的一种组件。",
- "demoId": "event-check-change"
- },
{
"title": "点击文字展开菜单",
"content": "可通过属性 expand-on-click-node 配置点击文字即可展开子菜单。
\n",
@@ -176,11 +144,51 @@
"demoId": "tree-menu-slot"
},
{
- "title": "事件",
+ "title": "节点点击事件",
+ "content": "node-click节点被点击触发的事件。
\n",
+ "link": "tree-menu/event-node-click",
+ "component": " TreeMenu 树型菜单",
+ "findIntroStr": "以树形方式显示的菜单，适用于版型定制的一种组件。",
+ "demoId": "event-node-click"
+ },
+ {
+ "title": "当前选中节点变化事件",
"content": "current-change 当前选中节点变化时触发的事件。
\n",
"link": "tree-menu/event-current-change",
"component": " TreeMenu 树型菜单",
"findIntroStr": "以树形方式显示的菜单，适用于版型定制的一种组件。",
"demoId": "event-current-change"
+ },
+ {
+ "title": "拖拽菜单回调事件",
+ "content": "拖拽菜单回调事件,配合 draggable 使用。
\n",
+ "link": "tree-menu/event-allow-draggable",
+ "component": " TreeMenu 树型菜单",
+ "findIntroStr": "以树形方式显示的菜单，适用于版型定制的一种组件。",
+ "demoId": "event-allow-draggable"
+ },
+ {
+ "title": "节点被展开时触发的事件",
+ "content": "节点被展开时触发的事件
\n",
+ "link": "tree-menu/event-node-expand",
+ "component": " TreeMenu 树型菜单",
+ "findIntroStr": "以树形方式显示的菜单，适用于版型定制的一种组件。",
+ "demoId": "event-node-expand"
+ },
+ {
+ "title": "节点被折叠时触发的事件",
+ "content": "节点被折叠时触发的事件
\n",
+ "link": "tree-menu/event-node-collapse",
+ "component": " TreeMenu 树型菜单",
+ "findIntroStr": "以树形方式显示的菜单，适用于版型定制的一种组件。",
+ "demoId": "event-node-collapse"
+ },
+ {
+ "title": "节点选中状态变化事件",
+ "content": "节点选中状态发生变化时的回调
\n",
+ "link": "tree-menu/event-check-change",
+ "component": " TreeMenu 树型菜单",
+ "findIntroStr": "以树形方式显示的菜单，适用于版型定制的一种组件。",
+ "demoId": "event-check-change"
}
]
diff --git a/examples/docs/resources/pc/demo/action-menu/basic-usage.spec.ts b/examples/docs/resources/pc/demo/action-menu/basic-usage.spec.ts
new file mode 100644
index 000000000..dbf736a7f
--- /dev/null
+++ b/examples/docs/resources/pc/demo/action-menu/basic-usage.spec.ts
@@ -0,0 +1,23 @@
+import { test, expect } from '@playwright/test'
+
+test('测试基本用法', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/action-menu/basic-usage')
+
+ const preview = page.locator('#preview')
+ const actionMenu = preview.locator('.tiny-action-menu')
+ const menuItem = actionMenu.locator('.tiny-action-menu__item')
+ const dropDownMenu = page.locator('body > .tiny-dropdown-menu.tiny-popper')
+ const childMenu = page.locator('.tiny-dropdown-menu.tiny-dropdown-item--child')
+ const moreItem = menuItem.last().getByRole('button', { name: '更多' })
+
+ await expect(menuItem).toHaveCount(3)
+ await expect(menuItem.last()).toHaveText(/更多/)
+ await expect(moreItem.locator('svg path')).toHaveAttribute('d', 'M2 6h20L12 19z')
+ await expect(actionMenu.locator('.tiny-action-menu__item-line')).toHaveCount(2)
+ await moreItem.hover()
+ await expect(moreItem.locator('svg')).toHaveCSS('transform', 'matrix(-1, 0, 0, -1, 0, 0)')
+ await expect(dropDownMenu).toBeVisible()
+ await dropDownMenu.locator('.tiny-dropdown-item').filter({ hasText: '网络设置' }).hover()
+ await expect(childMenu).toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/action-menu/basic-usage.vue b/examples/docs/resources/pc/demo/action-menu/basic-usage.vue
index 4a00382ba..15e68a202 100644
--- a/examples/docs/resources/pc/demo/action-menu/basic-usage.vue
+++ b/examples/docs/resources/pc/demo/action-menu/basic-usage.vue
@@ -1,5 +1,6 @@
-
+
+
diff --git a/examples/docs/resources/pc/demo/button/text.spec.js b/examples/docs/resources/pc/demo/button/text.spec.js
index 10824b0b2..477ef7fd3 100644
--- a/examples/docs/resources/pc/demo/button/text.spec.js
+++ b/examples/docs/resources/pc/demo/button/text.spec.js
@@ -1,7 +1,8 @@
-import { test, expect } from '@playwright/test';
+import { test, expect } from '@playwright/test'
-test('test', async ({ page }) => {
- await page.goto('http://localhost:7130/pc/button/icon');
- await page.getByText('文字按钮').click();
- await page.getByRole('button', { name: 'text属性' }).click();
-});
\ No newline at end of file
+test('测试按钮文字', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/button/text')
+ await expect(page.getByRole('button', { name: '文本按钮' })).toHaveClass(/tiny-button--text/)
+ await expect(page.getByRole('button', { name: 'text属性' })).toHaveClass(/tiny-button--text/)
+})
diff --git a/examples/docs/resources/pc/demo/button/type.spec.js b/examples/docs/resources/pc/demo/button/type.spec.js
index a5321997f..bbba527e0 100644
--- a/examples/docs/resources/pc/demo/button/type.spec.js
+++ b/examples/docs/resources/pc/demo/button/type.spec.js
@@ -1,14 +1,13 @@
-import { test, expect } from '@playwright/test';
+import { test, expect } from '@playwright/test'
-test('test', async ({ page }) => {
- await page.goto('http://localhost:7130/pc/button/image');
- await page.getByText('主题样式').click();
- await page.getByRole('button', { name: '主要按钮' }).click();
- await expect(page.getByRole('button', { name: '主要按钮' })).toHaveText('主要按钮')
- await page.getByRole('button', { name: '成功按钮' }).click();
- await page.getByRole('button', { name: '信息按钮' }).click();
- await page.getByRole('button', { name: '警告按钮' }).click();
- await page.getByRole('button', { name: '危险按钮' }).click();
- await page.getByRole('button', { name: '文本按钮' }).click();
- await expect(page.getByRole('button', { name: '文本按钮' })).toHaveText('文本按钮')
-});
\ No newline at end of file
+test('测试按钮类型', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/button/type')
+ await expect(page.getByRole('button', { name: '默认按钮' })).toHaveClass(/tiny-button--default/)
+ await expect(page.getByRole('button', { name: '主要按钮' })).toHaveClass(/tiny-button--primary/)
+ await expect(page.getByRole('button', { name: '成功按钮' })).toHaveClass(/tiny-button--success/)
+ await expect(page.getByRole('button', { name: '信息按钮' })).toHaveClass(/tiny-button--info/)
+ await expect(page.getByRole('button', { name: '警告按钮' })).toHaveClass(/tiny-button--warning/)
+ await expect(page.getByRole('button', { name: '危险按钮' })).toHaveClass(/tiny-button--danger/)
+ await expect(page.getByRole('button', { name: '文本按钮' })).toHaveClass(/tiny-button--text/)
+})
diff --git a/examples/docs/resources/pc/demo/carousel/autoplay.spec.ts b/examples/docs/resources/pc/demo/carousel/autoplay.spec.ts
new file mode 100644
index 000000000..a70a2f256
--- /dev/null
+++ b/examples/docs/resources/pc/demo/carousel/autoplay.spec.ts
@@ -0,0 +1,28 @@
+import { test, expect } from '@playwright/test';
+
+test('自动切换', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull());
+ await page.goto('http://localhost:7130/pc/carousel/autoplay');
+ const preview = page.locator('#preview');
+ const carousel = preview.locator('.tiny-carousel');
+ const carouselItems = preview.locator('div.tiny-carousel__item');
+ // 默认显示第一张幻灯片
+ await expect(carouselItems.first()).toHaveCSS('transform', 'matrix(1, 0, 0, 1, 0, 0)');
+
+ // 这里需要等待幻灯片在3秒后切换
+ await page.waitForTimeout(3000);
+ // 当前应该显示第二张幻灯片
+ await expect(carouselItems.nth(1)).toHaveCSS('transform', 'matrix(1, 0, 0, 1, 0, 0)');
+
+ await carousel.hover();
+ await page.waitForTimeout(100);
+ // 点击下一张按钮
+ await preview.locator('button:nth-child(2)').click();
+ // 当前应该显示第三张幻灯片
+ await expect(carouselItems.nth(2)).toHaveCSS('transform', 'matrix(1, 0, 0, 1, 0, 0)');
+
+ // 点击上一张按钮
+ await page.locator('.tiny-carousel__arrow').first().click();
+ // 当前应该显示第二张幻灯片
+ await expect(carouselItems.nth(1)).toHaveCSS('transform', 'matrix(1, 0, 0, 1, 0, 0)');
+})
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/carousel/basic-usage.spec.ts b/examples/docs/resources/pc/demo/carousel/basic-usage.spec.ts
new file mode 100644
index 000000000..fa49d90e0
--- /dev/null
+++ b/examples/docs/resources/pc/demo/carousel/basic-usage.spec.ts
@@ -0,0 +1,28 @@
+import { test, expect } from '@playwright/test';
+
+test('基础用法', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull());
+ await page.goto('http://localhost:7130/pc/carousel/basic-usage');
+ const preview = page.locator('#preview');
+ const carousel = preview.locator('.tiny-carousel');
+ const carouselItems = preview.locator('div.tiny-carousel__item');
+ // 默认显示第一张幻灯片
+ await expect(carouselItems.first()).toHaveCSS('transform', 'matrix(1, 0, 0, 1, 0, 0)');
+
+ await carousel.hover();
+ await page.waitForTimeout(100);
+ // 点击下一张按钮
+ await preview.locator('button:nth-child(2)').click();
+ // 当前应该显示第二张幻灯片
+ await expect(carouselItems.nth(1)).toHaveCSS('transform', 'matrix(1, 0, 0, 1, 0, 0)');
+
+ // 点击上一张按钮
+ await page.locator('.tiny-carousel__arrow').first().click();
+ // 当前应该显示第一张幻灯片
+ await expect(carouselItems.first()).toHaveCSS('transform', 'matrix(1, 0, 0, 1, 0, 0)');
+
+ // 点击底部按钮切换
+ await preview.getByRole('list').getByRole('button').nth(1).click();
+ // 当前应该显示第二张幻灯片
+ await expect(carouselItems.nth(1)).toHaveCSS('transform', 'matrix(1, 0, 0, 1, 0, 0)');
+})
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/carousel/card-mode.spec.ts b/examples/docs/resources/pc/demo/carousel/card-mode.spec.ts
new file mode 100644
index 000000000..f4ffbc9fb
--- /dev/null
+++ b/examples/docs/resources/pc/demo/carousel/card-mode.spec.ts
@@ -0,0 +1,44 @@
+import { test, expect } from '@playwright/test';
+
+test('卡片模式', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull());
+ await page.goto('http://localhost:7130/pc/carousel/card-mode');
+ const preview = page.locator('#preview');
+ const carousel = preview.locator('.tiny-carousel');
+ const carouselItems = preview.locator('div.tiny-carousel__item');
+ // 默认显示第一张幻灯片
+ await expect(carouselItems.first()).toHaveCSS('transform', 'matrix(1, 0, 0, 1, 192.75, 0)');
+ // 第二张幻灯片应该可见，并且被缩放
+ await expect(carouselItems.nth(1)).toHaveCSS('transform', 'matrix(0.83, 0, 0, 0.83, 418.267, 0)');
+ // 第四张幻灯片应该可见，并且被缩放
+ await expect(carouselItems.nth(3)).toHaveCSS('transform', 'matrix(0.83, 0, 0, 0.83, -32.7675, 0)');
+
+ await carousel.hover();
+ await page.waitForTimeout(100);
+ // 点击下一张按钮
+ await preview.locator('button:nth-child(2)').click();
+ // 当前应该显示第二张幻灯片
+ await expect(carouselItems.nth(1)).toHaveCSS('transform', 'matrix(1, 0, 0, 1, 192.75, 0)');
+ // 第三张幻灯片应该可见，并且被缩放
+ await expect(carouselItems.nth(2)).toHaveCSS('transform', 'matrix(0.83, 0, 0, 0.83, 418.267, 0)');
+ // 第一张幻灯片应该可见，并且被缩放
+ await expect(carouselItems.first()).toHaveCSS('transform', 'matrix(0.83, 0, 0, 0.83, -32.7675, 0)');
+
+ // 点击底部按钮切换
+ await preview.getByRole('list').getByRole('button').nth(2).click();
+ // 当前应该显示第三张幻灯片
+ await expect(carouselItems.nth(2)).toHaveCSS('transform', 'matrix(1, 0, 0, 1, 192.75, 0)');
+ // 第四张幻灯片应该可见，并且被缩放
+ await expect(carouselItems.nth(3)).toHaveCSS('transform', 'matrix(0.83, 0, 0, 0.83, 418.267, 0)');
+ // 第二张幻灯片应该可见，并且被缩放
+ await expect(carouselItems.nth(1)).toHaveCSS('transform', 'matrix(0.83, 0, 0, 0.83, -32.7675, 0)');
+
+ // 点击上一张按钮
+ await page.locator('.tiny-carousel__arrow').first().click();
+ // 当前应该显示第二张幻灯片
+ await expect(carouselItems.nth(1)).toHaveCSS('transform', 'matrix(1, 0, 0, 1, 192.75, 0)');
+ // 第三张幻灯片应该可见，并且被缩放
+ await expect(carouselItems.nth(2)).toHaveCSS('transform', 'matrix(0.83, 0, 0, 0.83, 418.267, 0)');
+ // 第一张幻灯片应该可见，并且被缩放
+ await expect(carouselItems.first()).toHaveCSS('transform', 'matrix(0.83, 0, 0, 0.83, -32.7675, 0)');
+})
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/carousel/carousel-arrow-always.spec.ts b/examples/docs/resources/pc/demo/carousel/carousel-arrow-always.spec.ts
new file mode 100644
index 000000000..bfafea217
--- /dev/null
+++ b/examples/docs/resources/pc/demo/carousel/carousel-arrow-always.spec.ts
@@ -0,0 +1,26 @@
+import { test, expect } from '@playwright/test';
+
+test('总是显示切换箭头', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull());
+ await page.goto('http://localhost:7130/pc/carousel/carousel-arrow-always');
+ const preview = page.locator('#preview');
+ const carousel = preview.locator('.tiny-carousel');
+ const carouselItems = preview.locator('div.tiny-carousel__item');
+ // 默认显示第一张幻灯片
+ await expect(carouselItems.first()).toHaveCSS('transform', 'matrix(1, 0, 0, 1, 0, 0)');
+
+ // 点击下一张按钮
+ await preview.locator('button:nth-child(2)').click();
+ // 当前应该显示第二张幻灯片
+ await expect(carouselItems.nth(1)).toHaveCSS('transform', 'matrix(1, 0, 0, 1, 0, 0)');
+
+ // 点击上一张按钮
+ await page.locator('.tiny-carousel__arrow').first().click();
+ // 当前应该显示第一张幻灯片
+ await expect(carouselItems.first()).toHaveCSS('transform', 'matrix(1, 0, 0, 1, 0, 0)');
+
+ // 点击底部按钮切换
+ await preview.getByRole('list').getByRole('button').nth(1).click();
+ // 当前应该显示第二张幻灯片
+ await expect(carouselItems.nth(1)).toHaveCSS('transform', 'matrix(1, 0, 0, 1, 0, 0)');
+})
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/carousel/carousel-arrow-hover.spec.ts b/examples/docs/resources/pc/demo/carousel/carousel-arrow-hover.spec.ts
new file mode 100644
index 000000000..03d34f6b1
--- /dev/null
+++ b/examples/docs/resources/pc/demo/carousel/carousel-arrow-hover.spec.ts
@@ -0,0 +1,27 @@
+import { test, expect } from '@playwright/test';
+
+test('hover 时显示切换箭头', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull());
+ await page.goto('http://localhost:7130/pc/carousel/carousel-arrow-hover');
+ const preview = page.locator('#preview');
+ const carousel = preview.locator('.tiny-carousel');
+ const carouselItems = preview.locator('div.tiny-carousel__item');
+
+ await carousel.hover();
+ await page.waitForTimeout(100);
+ const arrow = carousel.locator('.tiny-carousel__arrow');
+ // 左侧切换按钮
+ await expect(arrow.first()).toBeVisible();
+ // 右侧切换按钮
+ await expect(arrow.nth(1)).toBeVisible();
+
+ // 点击下一张按钮
+ await preview.locator('button:nth-child(2)').click();
+ // 当前应该显示第二张幻灯片
+ await expect(carouselItems.nth(1)).toHaveCSS('transform', 'matrix(1, 0, 0, 1, 0, 0)');
+
+ // 点击上一张按钮
+ await page.locator('.tiny-carousel__arrow').first().click();
+ // 当前应该显示第一张幻灯片
+ await expect(carouselItems.first()).toHaveCSS('transform', 'matrix(1, 0, 0, 1, 0, 0)');
+})
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/carousel/carousel-arrow-never.spec.ts b/examples/docs/resources/pc/demo/carousel/carousel-arrow-never.spec.ts
new file mode 100644
index 000000000..b98316e38
--- /dev/null
+++ b/examples/docs/resources/pc/demo/carousel/carousel-arrow-never.spec.ts
@@ -0,0 +1,22 @@
+import { test, expect } from '@playwright/test';
+
+test('隐藏切换箭头', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull());
+ await page.goto('http://localhost:7130/pc/carousel/carousel-arrow-never');
+ const preview = page.locator('#preview');
+ const carousel = preview.locator('.tiny-carousel');
+ const carouselItems = preview.locator('div.tiny-carousel__item');
+
+ await carousel.hover();
+ await page.waitForTimeout(100);
+ const arrow = carousel.locator('.tiny-carousel__arrow');
+ // 左侧切换按钮应该不可见
+ await expect(arrow.first()).not.toBeVisible();
+ // 右侧切换按钮应该不可见
+ await expect(arrow.nth(1)).not.toBeVisible();
+
+ // 点击底部按钮切换
+ await preview.getByRole('list').getByRole('button').nth(1).click();
+ // 当前应该显示第二张幻灯片
+ await expect(carouselItems.nth(1)).toHaveCSS('transform', 'matrix(1, 0, 0, 1, 0, 0)');
+})
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/carousel/close-loop.spec.ts b/examples/docs/resources/pc/demo/carousel/close-loop.spec.ts
new file mode 100644
index 000000000..f8b9aa3d8
--- /dev/null
+++ b/examples/docs/resources/pc/demo/carousel/close-loop.spec.ts
@@ -0,0 +1,26 @@
+import { test, expect } from '@playwright/test';
+
+test('关闭循环轮播', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull());
+ await page.goto('http://localhost:7130/pc/carousel/close-loop');
+ const preview = page.locator('#preview');
+ const carousel = preview.locator('.tiny-carousel');
+ const carouselItems = preview.locator('div.tiny-carousel__item');
+ const arrow = carousel.locator('.tiny-carousel__arrow');
+
+ // 左侧切换按钮应该不可见
+ await expect(arrow.first()).not.toBeVisible();
+ // 点击下一张按钮
+ await arrow.nth(1).click();
+ // 当前应该显示第二张幻灯片
+ await expect(carouselItems.nth(1)).toHaveCSS('transform', 'matrix(1, 0, 0, 1, 0, 0)');
+ await arrow.nth(1).click();
+ // 当前应该显示第三张幻灯片
+ await expect(carouselItems.nth(2)).toHaveCSS('transform', 'matrix(1, 0, 0, 1, 0, 0)');
+ // 右侧切换按钮应该不可见
+ await expect(arrow.nth(1)).not.toBeVisible();
+ // 点击上一张按钮
+ await arrow.first().click();
+ // 当前应该显示第一张幻灯片
+ await expect(carouselItems.nth(1)).toHaveCSS('transform', 'matrix(1, 0, 0, 1, 0, 0)');
+});
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/carousel/indicator-trigger.spec.ts b/examples/docs/resources/pc/demo/carousel/indicator-trigger.spec.ts
new file mode 100644
index 000000000..e6548b09b
--- /dev/null
+++ b/examples/docs/resources/pc/demo/carousel/indicator-trigger.spec.ts
@@ -0,0 +1,18 @@
+import { test, expect } from '@playwright/test';
+
+test('指示器和触发方式', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull());
+ await page.goto('http://localhost:7130/pc/carousel/indicator-trigger');
+ const preview = page.locator('#preview');
+ const carouselItems = preview.locator('div.tiny-carousel__item');
+ const indicators = preview.getByRole('list').getByRole('button');
+
+ // 悬浮底部第二个按钮
+ await indicators.nth(1).hover();
+ // 当前应该显示第一张幻灯片
+ await expect(carouselItems.first()).toHaveCSS('transform', 'matrix(1, 0, 0, 1, 0, 0)');
+ // 点击底部第二个按钮
+ await indicators.nth(1).click();
+ // 当前应该显示第二张幻灯片
+ await expect(carouselItems.nth(1)).toHaveCSS('transform', 'matrix(1, 0, 0, 1, 0, 0)');
+})
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/carousel/manual-play.spec.ts b/examples/docs/resources/pc/demo/carousel/manual-play.spec.ts
new file mode 100644
index 000000000..65e25e536
--- /dev/null
+++ b/examples/docs/resources/pc/demo/carousel/manual-play.spec.ts
@@ -0,0 +1,30 @@
+import { test, expect } from '@playwright/test';
+
+test('手动轮播', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull());
+ await page.goto('http://localhost:7130/pc/carousel/manual-play');
+ const preview = page.locator('#preview');
+ const carouselItems = preview.locator('div.tiny-carousel__item');
+ const numButtons = preview.locator('#num').getByRole('button');
+
+ // 减一
+ await numButtons.first().click();
+ // 当前应该显示第二张幻灯片
+ await expect(carouselItems.nth(1)).toHaveCSS('transform', 'matrix(1, 0, 0, 1, 0, 0)');
+ // 加一
+ await numButtons.nth(1).click();
+ // 当前应该显示第三张幻灯片
+ await expect(carouselItems.nth(2)).toHaveCSS('transform', 'matrix(1, 0, 0, 1, 0, 0)');
+ // 点击上一张按钮
+ await page.getByRole('button', { name: '上一张' }).click();
+ // 当前应该显示第二张幻灯片
+ await expect(carouselItems.nth(1)).toHaveCSS('transform', 'matrix(1, 0, 0, 1, 0, 0)');
+ // 点击下一张按钮
+ await page.getByRole('button', { name: '下一张' }).click();
+ // 当前应该显示第三张幻灯片
+ await expect(carouselItems.nth(2)).toHaveCSS('transform', 'matrix(1, 0, 0, 1, 0, 0)');
+ // 指定一个序号
+ await page.getByRole('spinbutton').fill('4');
+ // 当前应该显示第四张幻灯片
+ await expect(carouselItems.nth(3)).toHaveCSS('transform', 'matrix(1, 0, 0, 1, 0, 0)');
+})
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/carousel/play-interval.spec.ts b/examples/docs/resources/pc/demo/carousel/play-interval.spec.ts
new file mode 100644
index 000000000..9f5270061
--- /dev/null
+++ b/examples/docs/resources/pc/demo/carousel/play-interval.spec.ts
@@ -0,0 +1,20 @@
+import { test, expect } from '@playwright/test';
+
+test('轮播间隔时间', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull());
+ await page.goto('http://localhost:7130/pc/carousel/play-interval');
+ const preview = page.locator('#preview');
+ const carouselItems = preview.locator('div.tiny-carousel__item');
+ // 等待1秒后幻灯片切换
+ await page.waitForTimeout(1000);
+ // 当前应该显示第二张幻灯片
+ await expect(carouselItems.nth(1)).toHaveCSS('transform', 'matrix(1, 0, 0, 1, 0, 0)');
+ // 等待1秒后幻灯片切换
+ await page.waitForTimeout(1000);
+ // 当前应该显示第三张幻灯片
+ await expect(carouselItems.nth(2)).toHaveCSS('transform', 'matrix(1, 0, 0, 1, 0, 0)');
+ // 等待1秒后幻灯片切换
+ await page.waitForTimeout(1000);
+ // 当前应该显示第四张幻灯片
+ await expect(carouselItems.nth(3)).toHaveCSS('transform', 'matrix(1, 0, 0, 1, 0, 0)');
+})
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/carousel/show-title.spec.ts b/examples/docs/resources/pc/demo/carousel/show-title.spec.ts
new file mode 100644
index 000000000..1a718fd9f
--- /dev/null
+++ b/examples/docs/resources/pc/demo/carousel/show-title.spec.ts
@@ -0,0 +1,12 @@
+import { test, expect } from '@playwright/test';
+
+test('显示标题', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull());
+ await page.goto('http://localhost:7130/pc/carousel/show-title');
+ const preview = page.locator('#preview');
+ const carouselItems = preview.locator('div.tiny-carousel__item');
+ const indicators = preview.getByRole('list').getByRole('button');
+ await expect(carouselItems.first().locator('span')).toHaveText('幻灯片 - 1');
+ await indicators.nth(1).hover();
+ await expect(carouselItems.nth(1).locator('span')).toHaveText('幻灯片 - 2');
+})
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/carousel/up-down-carousel.spec.ts b/examples/docs/resources/pc/demo/carousel/up-down-carousel.spec.ts
new file mode 100644
index 000000000..b3fa4fe54
--- /dev/null
+++ b/examples/docs/resources/pc/demo/carousel/up-down-carousel.spec.ts
@@ -0,0 +1,18 @@
+import { test, expect } from '@playwright/test';
+
+test('纵向轮播', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull());
+ await page.goto('http://localhost:7130/pc/carousel/up-down-carousel');
+ const preview = page.locator('#preview');
+ const indicators = preview.getByRole('button');
+ const carouselItems = preview.locator('.tiny-carousel__item');
+ await indicators.nth(1).hover();
+ // 第一张幻灯片在Y轴向上平移了150px
+ await expect(carouselItems.first()).toHaveCSS('transform', 'matrix(1, 0, 0, 1, 0, -150)');
+ // 当前应该显示第二张幻灯片
+ await expect(carouselItems.nth(1)).toHaveCSS('transform', 'matrix(1, 0, 0, 1, 0, 0)');
+ // 第三张幻灯片在Y轴向下平移了150px
+ await expect(carouselItems.nth(2)).toHaveCSS('transform', 'matrix(1, 0, 0, 1, 0, 150)');
+ // 第四张幻灯片在Y轴向上平移了450px
+ await expect(carouselItems.nth(3)).toHaveCSS('transform', 'matrix(1, 0, 0, 1, 0, -450)');
+})
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/cascader-panel/basic-usage.spec.ts b/examples/docs/resources/pc/demo/cascader-panel/basic-usage.spec.ts
new file mode 100644
index 000000000..b4c96fb44
--- /dev/null
+++ b/examples/docs/resources/pc/demo/cascader-panel/basic-usage.spec.ts
@@ -0,0 +1,13 @@
+import { test, expect } from '@playwright/test'
+
+test('基本用法', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/cascader-panel/basic-usage')
+ await page
+ .locator('div')
+ .filter({ hasText: /^指南组件$/ })
+ .nth(2)
+ .click()
+ await page.getByRole('menuitem', { name: '指南' }).click()
+ await expect(page.getByText('安装开发')).toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/cascader-panel/cascader-panel-props.spec.ts b/examples/docs/resources/pc/demo/cascader-panel/cascader-panel-props.spec.ts
new file mode 100644
index 000000000..b7c75104d
--- /dev/null
+++ b/examples/docs/resources/pc/demo/cascader-panel/cascader-panel-props.spec.ts
@@ -0,0 +1,11 @@
+import { test, expect } from '@playwright/test'
+
+test('Props 选项', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/cascader-panel/cascader-panel-props')
+ await expect(page.getByText('指南组件')).toBeVisible()
+ await page.getByRole('menuitem', { name: '指南' }).click()
+ await expect(page.getByText('安装开发')).toBeVisible()
+ await page.getByText('安装').click()
+ await expect(page.getByText('项目登记环境准备安装 CLI创建项目')).toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/cascader-panel/change.spec.ts b/examples/docs/resources/pc/demo/cascader-panel/change.spec.ts
new file mode 100644
index 000000000..f84fd3715
--- /dev/null
+++ b/examples/docs/resources/pc/demo/cascader-panel/change.spec.ts
@@ -0,0 +1,9 @@
+import { test, expect } from '@playwright/test'
+
+test('选中节点变化', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/cascader-panel/change')
+ await page.getByRole('menuitem', { name: '指南' }).click()
+ await page.getByRole('menuitem', { name: '安装' }).getByRole('radio').click()
+ await expect(page.getByText('change 事件，当前选中的值为:安装；传入的值为:zhinan,anzhuang')).toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/cascader-panel/custom-option-content.spec.ts b/examples/docs/resources/pc/demo/cascader-panel/custom-option-content.spec.ts
new file mode 100644
index 000000000..85e5252b3
--- /dev/null
+++ b/examples/docs/resources/pc/demo/cascader-panel/custom-option-content.spec.ts
@@ -0,0 +1,9 @@
+import { test, expect } from '@playwright/test'
+
+test('自定义节点内容', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/cascader-panel/custom-option-content')
+ await expect(page.getByText('指南自定义(2)组件自定义(6)')).toBeVisible()
+ await page.getByRole('menuitem', { name: '指南自定义(2)' }).click()
+ await expect(page.getByText('安装自定义(4)开发自定义(2)')).toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/cascader-panel/expand-change.spec.ts b/examples/docs/resources/pc/demo/cascader-panel/expand-change.spec.ts
new file mode 100644
index 000000000..336303190
--- /dev/null
+++ b/examples/docs/resources/pc/demo/cascader-panel/expand-change.spec.ts
@@ -0,0 +1,8 @@
+import { test, expect } from '@playwright/test'
+
+test('展开节点发生变化', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/cascader-panel/expand-change')
+ await page.getByRole('menuitem', { name: '组件' }).click()
+ await expect(page.getByText('节点变化值：zujian')).toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/cascader/auto-load-checkStrictly.spec.ts b/examples/docs/resources/pc/demo/cascader/auto-load-checkStrictly.spec.ts
new file mode 100644
index 000000000..12f2fa57d
--- /dev/null
+++ b/examples/docs/resources/pc/demo/cascader/auto-load-checkStrictly.spec.ts
@@ -0,0 +1,23 @@
+import { test, expect } from '@playwright/test'
+
+test('动态加载且父子级不相关联', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/cascader/auto-load-checkStrictly')
+ await page.locator('#preview').getByRole('img').nth(1).click()
+ const svg = page.locator('.tiny-cascader-node__postfix > .st0')
+ await expect(svg).toHaveAttribute(
+ 'd',
+ 'M7 21c.2 0 .5-.1.6-.2l9.9-8c.2-.2.4-.5.4-.8 0-.3-.1-.6-.4-.8L7.6 3.3c-.4-.4-1.1-.3-1.4.2-.4.4-.3 1.1.2 1.4l8.9 7.2-8.9 7.2c-.4.4-.5 1-.2 1.4.2.2.5.3.8.3z'
+ )
+ await page.getByRole('menuitem', { name: '选项1' }).click()
+ const loadingSvg = page.getByRole('menuitem', { name: '选项1' }).locator('path')
+ await expect(loadingSvg).toHaveAttribute(
+ 'd',
+ 'M511.883 287.998h-.362a31.999 31.999 0 0 1-31.66-31.977v-.361c0-.105.117-11.723.117-63.659v-96a31.999 31.999 0 1 1 64.001 0v96c0 52.586-.112 63.882-.12 64.338a32.003 32.003 0 0 1-31.976 31.66zm.115 672A31.999 31.999 0 0 1 480 928v-96.38c0-51.61-.112-63.174-.115-63.286s0-.242 0-.361a31.999 31.999 0 0 1 63.998-.314c0 .455.119 11.711.119 64.034v96.307a31.999 31.999 0 0 1-32.003 32zM330.9 363.021a31.898 31.898 0 0 1-22.866-9.612c-.076-.076-8.208-8.37-44.932-45.095l-67.903-67.885a31.999 31.999 0 0 1 45.257-45.253l67.881 67.882c37.183 37.183 45.09 45.253 45.412 45.578A31.999 31.999 0 0 1 330.9 363.02zm475.238 475.094a31.901 31.901 0 0 1-22.628-9.375l-67.885-67.88c-36.724-36.725-45.018-44.86-45.098-44.94a31.999 31.999 0 0 1 44.777-45.73c.325.318 8.395 8.23 45.578 45.412l67.881 67.882a31.999 31.999 0 0 1-22.625 54.63zm-582.137 0a31.901 31.901 0 0 0 22.628-9.375l67.882-67.88c36.724-36.725 45.022-44.86 45.097-44.94a31.999 31.999 0 0 0-44.776-45.73c-.325.318-8.395 8.23-45.578 45.412l-67.881 67.885A31.999 31.999 0 0 0 224 838.115zm31.949-294.056h-.362c-.104 0-11.722-.116-63.658-.116H95.943a31.999 31.999 0 1 1 0-64.002h95.997c52.586 0 63.882.112 64.337.12a31.999 31.999 0 0 1 31.66 31.977v.361a32.003 32.003 0 0 1-31.988 31.66zm511.99 0a32.003 32.003 0 0 1-31.995-31.667v-.361a31.999 31.999 0 0 1 31.66-31.97c.455 0 11.754-.12 64.34-.12h96.001a31.999 31.999 0 0 1 0 64.002h-96c-51.936 0-63.554.112-63.666.116h-.336zM693 363.018a31.999 31.999 0 0 1-22.863-54.382c.318-.325 8.23-8.395 45.412-45.578l67.882-67.885a31.999 31.999 0 1 1 45.263 45.256l-67.892 67.882c-31.02 31.023-41.644 41.76-44.241 44.393l-.697.723a31.909 31.909 0 0 1-22.864 9.59z'
+ )
+ await page.waitForTimeout(1000)
+ await page.getByRole('menuitem', { name: '选项2' }).getByRole('radio').click()
+ await page.getByPlaceholder('请选择').click()
+ const light = page.getByRole('menuitem', { name: '选项2' }).getByRole('radio')
+ await expect(light).toHaveClass('tiny-radio is-checked')
+})
diff --git a/examples/docs/resources/pc/demo/cascader/auto-load.spec.ts b/examples/docs/resources/pc/demo/cascader/auto-load.spec.ts
new file mode 100644
index 000000000..2210083e3
--- /dev/null
+++ b/examples/docs/resources/pc/demo/cascader/auto-load.spec.ts
@@ -0,0 +1,18 @@
+import { test, expect } from '@playwright/test'
+
+test('动态加载', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/cascader/auto-load')
+ await page.locator('#preview').getByRole('img').nth(1).click()
+ const svg = page.locator('.tiny-cascader-node__postfix > .st0')
+ await expect(svg).toHaveAttribute(
+ 'd',
+ 'M7 21c.2 0 .5-.1.6-.2l9.9-8c.2-.2.4-.5.4-.8 0-.3-.1-.6-.4-.8L7.6 3.3c-.4-.4-1.1-.3-1.4.2-.4.4-.3 1.1.2 1.4l8.9 7.2-8.9 7.2c-.4.4-.5 1-.2 1.4.2.2.5.3.8.3z'
+ )
+ await page.getByRole('menuitem', { name: '选项1' }).click()
+ const loadingSvg = page.getByRole('menuitem', { name: '选项1' }).locator('path')
+ await expect(loadingSvg).toHaveAttribute(
+ 'd',
+ 'M511.883 287.998h-.362a31.999 31.999 0 0 1-31.66-31.977v-.361c0-.105.117-11.723.117-63.659v-96a31.999 31.999 0 1 1 64.001 0v96c0 52.586-.112 63.882-.12 64.338a32.003 32.003 0 0 1-31.976 31.66zm.115 672A31.999 31.999 0 0 1 480 928v-96.38c0-51.61-.112-63.174-.115-63.286s0-.242 0-.361a31.999 31.999 0 0 1 63.998-.314c0 .455.119 11.711.119 64.034v96.307a31.999 31.999 0 0 1-32.003 32zM330.9 363.021a31.898 31.898 0 0 1-22.866-9.612c-.076-.076-8.208-8.37-44.932-45.095l-67.903-67.885a31.999 31.999 0 0 1 45.257-45.253l67.881 67.882c37.183 37.183 45.09 45.253 45.412 45.578A31.999 31.999 0 0 1 330.9 363.02zm475.238 475.094a31.901 31.901 0 0 1-22.628-9.375l-67.885-67.88c-36.724-36.725-45.018-44.86-45.098-44.94a31.999 31.999 0 0 1 44.777-45.73c.325.318 8.395 8.23 45.578 45.412l67.881 67.882a31.999 31.999 0 0 1-22.625 54.63zm-582.137 0a31.901 31.901 0 0 0 22.628-9.375l67.882-67.88c36.724-36.725 45.022-44.86 45.097-44.94a31.999 31.999 0 0 0-44.776-45.73c-.325.318-8.395 8.23-45.578 45.412l-67.881 67.885A31.999 31.999 0 0 0 224 838.115zm31.949-294.056h-.362c-.104 0-11.722-.116-63.658-.116H95.943a31.999 31.999 0 1 1 0-64.002h95.997c52.586 0 63.882.112 64.337.12a31.999 31.999 0 0 1 31.66 31.977v.361a32.003 32.003 0 0 1-31.988 31.66zm511.99 0a32.003 32.003 0 0 1-31.995-31.667v-.361a31.999 31.999 0 0 1 31.66-31.97c.455 0 11.754-.12 64.34-.12h96.001a31.999 31.999 0 0 1 0 64.002h-96c-51.936 0-63.554.112-63.666.116h-.336zM693 363.018a31.999 31.999 0 0 1-22.863-54.382c.318-.325 8.23-8.395 45.412-45.578l67.882-67.885a31.999 31.999 0 1 1 45.263 45.256l-67.892 67.882c-31.02 31.023-41.644 41.76-44.241 44.393l-.697.723a31.909 31.909 0 0 1-22.864 9.59z'
+ )
+})
diff --git a/examples/docs/resources/pc/demo/cascader/basic-usage.spec.ts b/examples/docs/resources/pc/demo/cascader/basic-usage.spec.ts
new file mode 100644
index 000000000..d4f8c5512
--- /dev/null
+++ b/examples/docs/resources/pc/demo/cascader/basic-usage.spec.ts
@@ -0,0 +1,11 @@
+import { test, expect } from '@playwright/test'
+
+test('基本用法', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/cascader/basic-usage')
+ await page.getByPlaceholder('请选择').click()
+ const cascader = page.locator(
+ '.tiny-cascader-menu > .tiny-cascader-menu__wrap > .tiny-cascader-menu__list > .is-active > span'
+ )
+ await expect(cascader).toHaveText('安装 CLI')
+})
diff --git a/examples/docs/resources/pc/demo/cascader/check-strictly-multiple.spec.ts b/examples/docs/resources/pc/demo/cascader/check-strictly-multiple.spec.ts
new file mode 100644
index 000000000..af6daf86d
--- /dev/null
+++ b/examples/docs/resources/pc/demo/cascader/check-strictly-multiple.spec.ts
@@ -0,0 +1,13 @@
+import { test, expect } from '@playwright/test'
+
+test('多选选择任意一级选项', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/cascader/check-strictly-multiple')
+ await page.getByText('指南/安装指南/开发/引入组件').click()
+ await page.getByRole('menuitem', { name: '开发' }).locator('span').nth(1).click()
+ await page.getByRole('menuitem', { name: '安装' }).click()
+ const kaifa = page.getByRole('menuitem', { name: '开发' }).locator('span').nth(1)
+ const anzhuang = page.getByRole('menuitem', { name: '安装' }).locator('span').nth(1)
+ await expect(kaifa).toHaveCSS('background-color', 'rgb(94, 124, 224)')
+ await expect(anzhuang).toHaveCSS('background-color', 'rgb(94, 124, 224)')
+})
diff --git a/examples/docs/resources/pc/demo/cascader/check-strictly.spec.ts b/examples/docs/resources/pc/demo/cascader/check-strictly.spec.ts
new file mode 100644
index 000000000..932ba5acd
--- /dev/null
+++ b/examples/docs/resources/pc/demo/cascader/check-strictly.spec.ts
@@ -0,0 +1,11 @@
+import { test, expect } from '@playwright/test'
+
+test('父子级不相关联', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/cascader/check-strictly')
+ await page.getByPlaceholder('请选择').click()
+ await page.getByRole('menuitem', { name: '开发' }).getByRole('radio').click()
+ await page.getByPlaceholder('请选择').click()
+ const light = page.getByRole('menuitem', { name: '开发' }).getByRole('radio')
+ await expect(light).toHaveClass('tiny-radio is-checked')
+})
diff --git a/examples/docs/resources/pc/demo/cascader/clearable.spec.ts b/examples/docs/resources/pc/demo/cascader/clearable.spec.ts
new file mode 100644
index 000000000..36f69ef29
--- /dev/null
+++ b/examples/docs/resources/pc/demo/cascader/clearable.spec.ts
@@ -0,0 +1,13 @@
+import { test, expect } from '@playwright/test'
+
+test('可清空', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/cascader/clearable')
+ const text = await page.locator('#preview').getByRole('textbox').inputValue()
+ await expect(text).toEqual('指南+安装+项目登记')
+ await page.locator('.tiny-input__suffix-inner > .tiny-svg').click()
+ const textClear = await page.locator('#preview').getByRole('textbox').inputValue()
+ await expect(textClear).toEqual('')
+ const medium = page.locator('.tiny-cascader--medium')
+ await expect(medium).toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/cascader/collapse-tags.spec.ts b/examples/docs/resources/pc/demo/cascader/collapse-tags.spec.ts
new file mode 100644
index 000000000..96d6f1217
--- /dev/null
+++ b/examples/docs/resources/pc/demo/cascader/collapse-tags.spec.ts
@@ -0,0 +1,8 @@
+import { test, expect } from '@playwright/test'
+
+test('折叠展示 Tag', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/cascader/collapse-tags')
+ const tag = page.locator('span').filter({ hasText: '+ 2' }).first()
+ await expect(tag).toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/cascader/default-multiple.spec.ts b/examples/docs/resources/pc/demo/cascader/default-multiple.spec.ts
new file mode 100644
index 000000000..1dc97f3cc
--- /dev/null
+++ b/examples/docs/resources/pc/demo/cascader/default-multiple.spec.ts
@@ -0,0 +1,10 @@
+import { test, expect } from '@playwright/test'
+
+test('多选', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/cascader/default-multiple')
+ const multiple = page.locator('.tiny-cascader-multiple')
+ const multipleText = page.getByText('指南/安装/项目登记指南/安装/安装 CLI指南/开发/引入组件')
+ await expect(multiple).toBeVisible()
+ await expect(multipleText).toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/cascader/disabled-items.spec.ts b/examples/docs/resources/pc/demo/cascader/disabled-items.spec.ts
new file mode 100644
index 000000000..b065d4c71
--- /dev/null
+++ b/examples/docs/resources/pc/demo/cascader/disabled-items.spec.ts
@@ -0,0 +1,11 @@
+import { test, expect } from '@playwright/test'
+
+test('禁用选项', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/cascader/disabled-items')
+ await page.getByPlaceholder('请选择').click()
+ const cascader = page.locator(
+ '.tiny-cascader-menu > .tiny-cascader-menu__wrap > .tiny-cascader-menu__list > .is-disabled'
+ )
+ await expect(cascader).toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/cascader/events.spec.ts b/examples/docs/resources/pc/demo/cascader/events.spec.ts
new file mode 100644
index 000000000..ece4e2503
--- /dev/null
+++ b/examples/docs/resources/pc/demo/cascader/events.spec.ts
@@ -0,0 +1,9 @@
+import { test, expect } from '@playwright/test'
+
+test('事件', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/cascader/events')
+ await page.getByPlaceholder('请选择').click()
+ await expect(page.getByText('当前触发了:visible-change 事件,当前状态为：true')).toBeVisible()
+ await expect(page.getByText('当前触发了:focus 事件')).toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/cascader/expand-trigger.spec.ts b/examples/docs/resources/pc/demo/cascader/expand-trigger.spec.ts
new file mode 100644
index 000000000..efa7ca84f
--- /dev/null
+++ b/examples/docs/resources/pc/demo/cascader/expand-trigger.spec.ts
@@ -0,0 +1,10 @@
+import { test, expect } from '@playwright/test'
+
+test('hover 触发子菜单', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/cascader/expand-trigger')
+ await page.getByPlaceholder('请选择').click()
+ await page.getByRole('menuitem', { name: '指南' }).hover()
+ const cascader = page.getByText('安装开发')
+ await expect(cascader).toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/cascader/filter-method.spec.ts b/examples/docs/resources/pc/demo/cascader/filter-method.spec.ts
new file mode 100644
index 000000000..3b1f7b621
--- /dev/null
+++ b/examples/docs/resources/pc/demo/cascader/filter-method.spec.ts
@@ -0,0 +1,14 @@
+import { test, expect } from '@playwright/test'
+
+test('自定义搜索逻辑', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/cascader/filter-method')
+ await page.getByPlaceholder('试试搜索：安装').click()
+ await page.getByPlaceholder('试试搜索：安装').fill('安装')
+ await page
+ .getByRole('listitem')
+ .filter({ hasText: /^指南\/安装$/ })
+ .click()
+ const text = await page.locator('#preview').getByRole('textbox').inputValue()
+ await expect(text).toEqual('指南/安装')
+})
diff --git a/examples/docs/resources/pc/demo/cascader/filterable-multiple.spec.ts b/examples/docs/resources/pc/demo/cascader/filterable-multiple.spec.ts
new file mode 100644
index 000000000..0ae0c010b
--- /dev/null
+++ b/examples/docs/resources/pc/demo/cascader/filterable-multiple.spec.ts
@@ -0,0 +1,20 @@
+import { test, expect } from '@playwright/test'
+
+test('多选可搜索', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/cascader/filterable-multiple')
+ await page.getByPlaceholder('试试搜索：安装').nth(1).click()
+ await page.getByPlaceholder('试试搜索：安装').nth(1).fill('安装')
+ await page.waitForTimeout(1000)
+ const text = await page.locator('.tiny-cascader__suggestion-item')
+ await expect(text).toHaveText([
+ '指南/安装/项目登记',
+ '指南/安装/环境准备',
+ '指南/安装/安装 CLI',
+ '指南/安装/创建项目'
+ ])
+ await page.getByRole('listitem').filter({ hasText: '指南/安装/项目登记' }).click()
+ await page.getByRole('listitem').filter({ hasText: '指南/安装/环境准备' }).click()
+ await expect(page.locator('span').filter({ hasText: '指南/安装/项目登记' }).first()).toBeVisible()
+ await expect(page.locator('span').filter({ hasText: '指南/安装/环境准备' }).first()).toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/cascader/filterable.spec.ts b/examples/docs/resources/pc/demo/cascader/filterable.spec.ts
new file mode 100644
index 000000000..1b945d0ff
--- /dev/null
+++ b/examples/docs/resources/pc/demo/cascader/filterable.spec.ts
@@ -0,0 +1,16 @@
+import { test, expect } from '@playwright/test'
+
+test('可搜索', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/cascader/filterable')
+ await page.getByPlaceholder('试试搜索：安装').click()
+ await page.getByPlaceholder('试试搜索：安装').fill('安装')
+ await page.waitForTimeout(1000)
+ const text = await page.locator('.tiny-cascader__suggestion-item')
+ await expect(text).toHaveText([
+ '指南/安装/项目登记',
+ '指南/安装/环境准备',
+ '指南/安装/安装 CLI',
+ '指南/安装/创建项目'
+ ])
+})
diff --git a/examples/docs/resources/pc/demo/cascader/props-children.spec.ts b/examples/docs/resources/pc/demo/cascader/props-children.spec.ts
new file mode 100644
index 000000000..569e43715
--- /dev/null
+++ b/examples/docs/resources/pc/demo/cascader/props-children.spec.ts
@@ -0,0 +1,8 @@
+import { test, expect } from '@playwright/test'
+
+test('指定选项', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/cascader/props-children')
+ const text = await page.locator('#preview').getByRole('textbox').inputValue()
+ await expect(text).toEqual('指南/安装/安装 CLI')
+})
diff --git a/examples/docs/resources/pc/demo/cascader/show-all-levels.spec.ts b/examples/docs/resources/pc/demo/cascader/show-all-levels.spec.ts
new file mode 100644
index 000000000..78c92db16
--- /dev/null
+++ b/examples/docs/resources/pc/demo/cascader/show-all-levels.spec.ts
@@ -0,0 +1,10 @@
+import { test, expect } from '@playwright/test'
+
+test('仅显示最后一级', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/cascader/show-all-levels')
+ await page.getByPlaceholder('请选择').click()
+ await page.getByText('项目登记').click()
+ const text = await page.locator('#preview').getByRole('textbox').inputValue()
+ await expect(text).toEqual('项目登记')
+})
diff --git a/examples/docs/resources/pc/demo/checkbox/basic-usage.spec.ts b/examples/docs/resources/pc/demo/checkbox/basic-usage.spec.ts
new file mode 100644
index 000000000..d53a9e57d
--- /dev/null
+++ b/examples/docs/resources/pc/demo/checkbox/basic-usage.spec.ts
@@ -0,0 +1,11 @@
+import { test, expect } from '@playwright/test';
+
+test('基础用法', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull());
+ await page.goto('http://localhost:7130/pc/checkbox/basic-usage');
+ const preview = page.locator('#preview');
+ const checkbox = preview.locator('.tiny-checkbox');
+ await expect(checkbox).toHaveClass(/is-checked/);
+ await checkbox.click();
+ await expect(checkbox).not.toHaveClass(/is-checked/);
+})
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/checkbox/button-check-box.spec.ts b/examples/docs/resources/pc/demo/checkbox/button-check-box.spec.ts
new file mode 100644
index 000000000..bbb045921
--- /dev/null
+++ b/examples/docs/resources/pc/demo/checkbox/button-check-box.spec.ts
@@ -0,0 +1,12 @@
+import { test, expect } from '@playwright/test';
+
+test('按钮形式的复选框未选中时', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull());
+ await page.goto('http://localhost:7130/pc/checkbox/button-chek-box');
+ const preview = page.locator('#preview');
+ const buttonCheck = preview.locator('.tiny-checkbox-button');
+ await buttonCheck.click();
+ await expect(buttonCheck).toHaveClass(/is-checked/);
+ await page.getByRole('button', { name: '获取文本' }).click();
+ await expect(page.getByText(/真文本/)).toBeVisible();
+ })
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/checkbox/checkbox-button-multiple.spec.ts b/examples/docs/resources/pc/demo/checkbox/checkbox-button-multiple.spec.ts
new file mode 100644
index 000000000..312f3a780
--- /dev/null
+++ b/examples/docs/resources/pc/demo/checkbox/checkbox-button-multiple.spec.ts
@@ -0,0 +1,10 @@
+import { test, expect } from '@playwright/test';
+
+test('多行按钮', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull());
+ await page.goto('http://localhost:7130/pc/checkbox/checkbox-button-multiple');
+ const preview = page.locator('#preview');
+ const checkbox = preview.locator('.tiny-checkbox-group > label');
+ await checkbox.nth(2).click();
+ await expect(checkbox.nth(2)).toHaveClass(/is-checked/);
+})
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/checkbox/checkbox-button.spec.ts b/examples/docs/resources/pc/demo/checkbox/checkbox-button.spec.ts
new file mode 100644
index 000000000..c1bb7e9a4
--- /dev/null
+++ b/examples/docs/resources/pc/demo/checkbox/checkbox-button.spec.ts
@@ -0,0 +1,23 @@
+import { test, expect } from '@playwright/test';
+
+test('按钮形式的复选框选中时', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull());
+ await page.goto('http://localhost:7130/pc/checkbox/checkbox-button');
+ const preview = page.locator('#preview');
+ const buttonCheck = preview.locator('.tiny-checkbox-button');
+ await expect(buttonCheck).toHaveClass(/is-checked/);
+ await expect(buttonCheck.locator('.tiny-checkbox-button__inner')).toHaveCSS('background-color', 'rgb(64, 158, 255)');
+ await page.getByRole('button', { name: '获取文本' }).click();
+ await expect(page.getByText(/真文本/)).toBeVisible();
+})
+
+test('按钮形式的复选框未选中时', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull());
+ await page.goto('http://localhost:7130/pc/checkbox/checkbox-button');
+ const preview = page.locator('#preview');
+ const buttonCheck = preview.locator('.tiny-checkbox-button');
+ await buttonCheck.click();
+ await expect(buttonCheck).not.toHaveClass(/is-checked/);
+ await page.getByRole('button', { name: '获取文本' }).click();
+ await expect(page.getByText(/假文本/)).toBeVisible();
+ })
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/checkbox/checkbox-events.spec.ts b/examples/docs/resources/pc/demo/checkbox/checkbox-events.spec.ts
new file mode 100644
index 000000000..8c83ac37d
--- /dev/null
+++ b/examples/docs/resources/pc/demo/checkbox/checkbox-events.spec.ts
@@ -0,0 +1,13 @@
+import { test, expect } from '@playwright/test';
+
+test('事件', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull());
+ await page.goto('http://localhost:7130/pc/checkbox/checkbox-events');
+ const preview = page.locator('#preview');
+ const checkbox = preview.locator('.tiny-checkbox-group > label');
+ await checkbox.nth(1).click();
+ await expect(page.getByText('当前选择：["复选框1","复选框2"]')).toBeVisible();
+ await checkbox.nth(0).click();
+ await checkbox.nth(1).click();
+ await expect(page.getByText('当前选择：[]')).toBeVisible();
+})
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/checkbox/checkbox-group.spec.ts b/examples/docs/resources/pc/demo/checkbox/checkbox-group.spec.ts
new file mode 100644
index 000000000..0c0e85248
--- /dev/null
+++ b/examples/docs/resources/pc/demo/checkbox/checkbox-group.spec.ts
@@ -0,0 +1,11 @@
+import { test, expect } from '@playwright/test';
+
+test('复选框组和垂直复选框组', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull());
+ await page.goto('http://localhost:7130/pc/checkbox/checkbox-group');
+ const preview = page.locator('#preview');
+ const group = preview.locator('.tiny-checkbox-group');
+ await group.first().getByText('复选框1').first().click();
+ await group.first().getByText('复选框2').first().click();
+ await expect(group.nth(1).locator('label').nth(1)).toHaveClass(/is-checked/);
+})
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/checkbox/checkbox-slot.spec.ts b/examples/docs/resources/pc/demo/checkbox/checkbox-slot.spec.ts
new file mode 100644
index 000000000..78c74f416
--- /dev/null
+++ b/examples/docs/resources/pc/demo/checkbox/checkbox-slot.spec.ts
@@ -0,0 +1,10 @@
+import { test, expect } from '@playwright/test';
+
+test('插槽', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull());
+ await page.goto('http://localhost:7130/pc/checkbox/checkbox-slot');
+ const preview = page.locator('#preview');
+ const checkbox = preview.locator('.tiny-checkbox-group > label');
+ await expect(checkbox.first().locator('.tiny-checkbox__label > span')).toHaveCSS('color', 'rgb(255, 0, 0)');
+ await expect(checkbox.nth(1).locator('.tiny-checkbox__label > span')).toHaveCSS('color', 'rgb(0, 0, 255)');
+})
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/checkbox/checked.spec.ts b/examples/docs/resources/pc/demo/checkbox/checked.spec.ts
new file mode 100644
index 000000000..ffe6d85c4
--- /dev/null
+++ b/examples/docs/resources/pc/demo/checkbox/checked.spec.ts
@@ -0,0 +1,11 @@
+import { test, expect } from '@playwright/test';
+
+test('当前是否勾选', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull());
+ await page.goto('http://localhost:7130/pc/checkbox/checked');
+ const preview = page.locator('#preview');
+ const checkbox = preview.locator('.tiny-checkbox-group > label');
+ await expect(checkbox.first()).toHaveClass(/is-checked/);
+ await expect(checkbox.nth(1)).toHaveClass(/is-disabled/);
+ await expect(checkbox.nth(2)).toHaveClass(/is-disabled is-checked/);
+})
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/checkbox/content-overflow.spec.ts b/examples/docs/resources/pc/demo/checkbox/content-overflow.spec.ts
new file mode 100644
index 000000000..c5d007c15
--- /dev/null
+++ b/examples/docs/resources/pc/demo/checkbox/content-overflow.spec.ts
@@ -0,0 +1,11 @@
+import { test, expect } from '@playwright/test';
+
+test('内容超出时的提示信息', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull());
+ await page.goto('http://localhost:7130/pc/checkbox/content-overflow');
+ const preview = page.locator('#preview');
+ const label = preview.locator('.tiny-checkbox__label > div').first();
+ await expect(label).toHaveClass(/content-overflow/);
+ await label.hover();
+ await expect(preview.locator('.tiny-tooltip').filter({ hasText: '备选项1 提示文字 提示文字' })).toBeVisible();
+})
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/checkbox/dynamic-create-checkbox.spec.ts b/examples/docs/resources/pc/demo/checkbox/dynamic-create-checkbox.spec.ts
new file mode 100644
index 000000000..4d2973be0
--- /dev/null
+++ b/examples/docs/resources/pc/demo/checkbox/dynamic-create-checkbox.spec.ts
@@ -0,0 +1,11 @@
+import { test, expect } from '@playwright/test';
+
+test('动态生成复选框组', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull());
+ await page.goto('http://localhost:7130/pc/checkbox/dynamic-create-checkbox');
+ const preview = page.locator('#preview');
+ await preview.getByRole('checkbox', { name: '上海' }).filter({ hasText: '上海' }).click();
+ await expect(page.getByText('当前选择：["北京","广州","上海"]')).toBeVisible();
+ await preview.getByRole('checkbox', { name: '上海' }).filter({ hasText: '上海' }).click();
+ await expect(page.getByText('当前选择：["北京","广州"]')).toBeVisible();
+})
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/checkbox/group-options.spec.ts b/examples/docs/resources/pc/demo/checkbox/group-options.spec.ts
new file mode 100644
index 000000000..70b1d4122
--- /dev/null
+++ b/examples/docs/resources/pc/demo/checkbox/group-options.spec.ts
@@ -0,0 +1,9 @@
+import { test, expect } from '@playwright/test';
+
+test('配置式复选框组', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull());
+ await page.goto('http://localhost:7130/pc/checkbox/group-options');
+ const preview = page.locator('#preview');
+ await preview.getByText('很好').click();
+ await expect(page.locator('.tiny-modal__body').filter({ hasText: 'click' })).toBeVisible();
+})
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/checkbox/indeterminate.spec.ts b/examples/docs/resources/pc/demo/checkbox/indeterminate.spec.ts
new file mode 100644
index 000000000..d3238a2aa
--- /dev/null
+++ b/examples/docs/resources/pc/demo/checkbox/indeterminate.spec.ts
@@ -0,0 +1,25 @@
+import { test, expect } from '@playwright/test';
+
+test('禁用', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull());
+ await page.goto('http://localhost:7130/pc/checkbox/indeterminate');
+ const preview = page.locator('#preview');
+ await preview.locator('.tiny-switch').click();
+ const indeterminate = preview.locator('label').filter({ hasText: '全选' }).locator('span').first();
+ await expect(indeterminate).toHaveClass(/is-disabled/);
+ await expect(page.locator('label').filter({ hasText: '北京' }).locator('span').first()).toHaveClass(/is-disabled/);
+ await expect(page.locator('label').filter({ hasText: '广州' }).locator('span').first()).toHaveClass(/is-disabled/);
+})
+
+test('全选、半选', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull());
+ await page.goto('http://localhost:7130/pc/checkbox/indeterminate');
+ const preview = page.locator('#preview');
+ const indeterminate = preview.locator('label').filter({ hasText: '全选' }).locator('span').first();
+ await expect(indeterminate).toHaveClass(/is-indeterminate/);
+ await page.locator('label').filter({ hasText: '广州' }).locator('span').nth(1).click();
+ await page.locator('label').filter({ hasText: '深圳' }).locator('span').nth(1).click();
+ await expect(indeterminate).toHaveClass(/is-indeterminate/);
+ await page.locator('label').filter({ hasText: '上海' }).locator('span').nth(1).click();
+ await expect(indeterminate).toHaveClass(/is-checked/);
+})
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/checkbox/min-max.spec.ts b/examples/docs/resources/pc/demo/checkbox/min-max.spec.ts
new file mode 100644
index 000000000..089add57e
--- /dev/null
+++ b/examples/docs/resources/pc/demo/checkbox/min-max.spec.ts
@@ -0,0 +1,16 @@
+import { test, expect } from '@playwright/test';
+
+test('可选数量限制', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull());
+ await page.goto('http://localhost:7130/pc/checkbox/min-max');
+ const preview = page.locator('#preview');
+ const labels = preview.locator('.tiny-checkbox-group > label');
+ const disabledLabels = labels.locator('.is-disabled');
+ const checkedLabels = labels.locator('.is-checked');
+ await expect(disabledLabels).toHaveCount(2);
+ await expect(labels.locator('.is-checked.is-disabled')).toHaveCount(0);
+ await page.locator('label').filter({ hasText: '北京' }).locator('span').nth(1).click();
+ await expect(disabledLabels).toHaveCount(1);
+ await expect(checkedLabels).toHaveCount(1);
+ await expect(labels.locator('.is-checked.is-disabled')).toHaveCount(1);
+});
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/checkbox/text.spec.ts b/examples/docs/resources/pc/demo/checkbox/text.spec.ts
new file mode 100644
index 000000000..0d0dd5597
--- /dev/null
+++ b/examples/docs/resources/pc/demo/checkbox/text.spec.ts
@@ -0,0 +1,10 @@
+import { test, expect } from '@playwright/test';
+
+test('文本', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull());
+ await page.goto('http://localhost:7130/pc/checkbox/text');
+ const preview = page.locator('#preview');
+ await preview.locator('span').nth(2).click();
+ await preview.getByRole('button', { name: '获取文本' }).click();
+ await expect(page.locator('.tiny-modal').filter({ hasText: 'change 事件，当前选中的值为:真文本' })).toBeVisible();
+})
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/checkbox/vertical-checkbox.spec.ts b/examples/docs/resources/pc/demo/checkbox/vertical-checkbox.spec.ts
new file mode 100644
index 000000000..9c092385f
--- /dev/null
+++ b/examples/docs/resources/pc/demo/checkbox/vertical-checkbox.spec.ts
@@ -0,0 +1,25 @@
+import { test, expect } from '@playwright/test';
+
+test('垂直布局', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull());
+ await page.goto('http://localhost:7130/pc/checkbox/vertical-checkbox');
+ const preview = page.locator('#preview');
+ const checkedLabelBJ = preview.getByRole('checkbox', { name: '北京' }).filter({ hasText: '北京' })
+ await checkedLabelBJ.click();
+ await expect(checkedLabelBJ).toHaveClass(/is-checked/);
+ const checkedLabelSH = preview.getByRole('checkbox', { name: '上海' }).filter({ hasText: '上海' })
+ await checkedLabelSH.click();
+ await expect(checkedLabelSH).not.toHaveClass(/is-checked/);
+ const checkedLabelGZ = preview.getByRole('checkbox', { name: '广州' }).filter({ hasText: '广州' })
+ await checkedLabelGZ.click();
+ await expect(checkedLabelGZ).toHaveClass(/is-checked/);
+ const checkedLabelSZ = preview.getByRole('checkbox', { name: '深圳' }).filter({ hasText: '深圳' })
+ await checkedLabelSZ.click();
+ await expect(checkedLabelSZ).toHaveClass(/is-checked/);
+ const parentWrapper = preview.locator('div.tiny-checkbox-group.is-vertical');
+ await expect(parentWrapper).toHaveCSS('display', 'inline-block');
+ await expect(checkedLabelBJ).toHaveCSS('display', 'block');
+ await expect(checkedLabelSH).toHaveCSS('display', 'block');
+ await expect(checkedLabelGZ).toHaveCSS('display', 'block');
+ await expect(checkedLabelSZ).toHaveCSS('display', 'block');
+})
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/checkbox/with-border.spec.ts b/examples/docs/resources/pc/demo/checkbox/with-border.spec.ts
new file mode 100644
index 000000000..0fbe6a197
--- /dev/null
+++ b/examples/docs/resources/pc/demo/checkbox/with-border.spec.ts
@@ -0,0 +1,26 @@
+import { test, expect } from '@playwright/test';
+
+test('尺寸', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull());
+ await page.goto('http://localhost:7130/pc/checkbox/with-border');
+ const checkedLabelGZ = page.getByRole('checkbox', { name: '广州' }).filter({ hasText: '广州' });
+ // 点击第1个选项
+ await checkedLabelGZ.first().click();
+ await expect(checkedLabelGZ.first()).toHaveClass(/is-checked/);
+ let box = await checkedLabelGZ.first().boundingBox();
+ // 判断高度是否符合
+ await expect(box?.height).toBeCloseTo(42);
+ await checkedLabelGZ.nth(1).click();
+ await expect(checkedLabelGZ.nth(1)).toHaveClass(/is-checked/);
+ box = await checkedLabelGZ.nth(1).boundingBox();
+ await expect(box?.height).toBeCloseTo(36);
+ await checkedLabelGZ.nth(2).click();
+ await expect(checkedLabelGZ.nth(2)).toHaveClass(/is-checked/);
+ box = await checkedLabelGZ.nth(2).boundingBox();
+ await expect(box?.height).toBeCloseTo(30);
+ await checkedLabelGZ.nth(3).click();
+ await expect(checkedLabelGZ.nth(3)).toHaveClass(/is-checked/);
+ box = await checkedLabelGZ.nth(3).boundingBox();
+ await expect(Math.floor(box?.height || 24)).toBeCloseTo(24);
+ await expect(checkedLabelGZ.nth(4)).toHaveClass(/is-disabled/);
+})
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/collapse/accordion.spec.ts b/examples/docs/resources/pc/demo/collapse/accordion.spec.ts
new file mode 100644
index 000000000..747cdd57a
--- /dev/null
+++ b/examples/docs/resources/pc/demo/collapse/accordion.spec.ts
@@ -0,0 +1,16 @@
+import { test, expect } from '@playwright/test'
+
+test('Collapse 手风琴模式', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/collapse/accordion')
+
+ const header = page.locator('.tiny-collapse-item__header')
+ const content = page.locator('.tiny-collapse-item__wrap')
+
+ // 内容折叠时点击标题展开，该项内容展开，其他内容折叠
+ await expect(content.first()).not.toHaveCSS('display', 'none')
+ await header.nth(1).click()
+ await expect(header.nth(1)).toHaveClass(/is-active/)
+ await expect(content.nth(1)).not.toHaveCSS('display', 'none')
+ await expect(content.first()).toHaveCSS('display', 'none')
+})
diff --git a/examples/docs/resources/pc/demo/collapse/basic-usage.spec.ts b/examples/docs/resources/pc/demo/collapse/basic-usage.spec.ts
new file mode 100644
index 000000000..b38de720e
--- /dev/null
+++ b/examples/docs/resources/pc/demo/collapse/basic-usage.spec.ts
@@ -0,0 +1,26 @@
+import { test, expect } from '@playwright/test'
+
+test('Collapse 基础用法', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/collapse/basic-usage')
+
+ const header = page.locator('.tiny-collapse-item__header')
+ const content = page.locator('.tiny-collapse-item__wrap')
+ const arrow = page.locator('.tiny-collapse-item__arrow')
+
+ // 内容折叠时点击标题展开，再次点击折叠
+ await expect(content.nth(1)).toHaveCSS('display', 'none')
+ await header.nth(1).click()
+ await expect(header.nth(1)).toHaveClass(/is-active/)
+ await expect(content.nth(1)).not.toHaveCSS('display', 'none')
+ await header.nth(1).click()
+ await expect(header.nth(1)).not.toHaveClass(/is-active/)
+ await expect(content.nth(1)).toHaveCSS('display', 'none')
+
+ // 内容展开时，标题箭头向上
+ await expect(content.first()).not.toHaveCSS('display', 'none')
+ await expect(arrow.first()).toHaveCSS('transform', 'matrix(0, -1, 1, 0, 0, 0)')
+ await header.first().click()
+ await expect(content.first()).toHaveCSS('display', 'none')
+ await expect(arrow.first()).toHaveCSS('transform', 'matrix(0, 1, -1, 0, 0, 0)')
+})
diff --git a/examples/docs/resources/pc/demo/collapse/block-close.spec.ts b/examples/docs/resources/pc/demo/collapse/block-close.spec.ts
new file mode 100644
index 000000000..d3241b331
--- /dev/null
+++ b/examples/docs/resources/pc/demo/collapse/block-close.spec.ts
@@ -0,0 +1,18 @@
+import { test, expect } from '@playwright/test'
+
+test('Collapse 阻止折叠面板关闭事件', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/collapse/block-close')
+
+ const modal = page.locator('.tiny-modal')
+ const header = page.locator('.tiny-collapse-item__header')
+ const content = page.locator('.tiny-collapse-item__wrap')
+
+ // 点击标题，展开的内容不折叠
+ await expect(header.first()).toHaveClass(/is-active/)
+ await expect(content.first()).not.toHaveCSS('display', 'none')
+ await header.first().click()
+ await expect(header.first()).toHaveClass(/is-active/)
+ await expect(modal).toHaveText(/阻止面板关闭/)
+ await expect(content.first()).not.toHaveCSS('display', 'none')
+})
diff --git a/examples/docs/resources/pc/demo/collapse/collapse-events.spec.ts b/examples/docs/resources/pc/demo/collapse/collapse-events.spec.ts
new file mode 100644
index 000000000..f1bd74382
--- /dev/null
+++ b/examples/docs/resources/pc/demo/collapse/collapse-events.spec.ts
@@ -0,0 +1,13 @@
+import { test, expect } from '@playwright/test'
+
+test('Collapse 折叠面板事件', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/collapse/collapse-events')
+
+ const header = page.locator('.tiny-collapse-item__header')
+ const modal = page.locator('.tiny-modal')
+
+ // 点击标题，事件执行
+ await header.first().click()
+ await expect(modal).toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/collapse/custom-collapse-icon.spec.ts b/examples/docs/resources/pc/demo/collapse/custom-collapse-icon.spec.ts
new file mode 100644
index 000000000..aee359ec9
--- /dev/null
+++ b/examples/docs/resources/pc/demo/collapse/custom-collapse-icon.spec.ts
@@ -0,0 +1,19 @@
+import { test, expect } from '@playwright/test'
+
+test('Collapse 自定义展开折叠图标', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/collapse/custom-collapse-icon')
+
+ const header = page.locator('.tiny-collapse-item__header')
+ const content = page.locator('.tiny-collapse-item__wrap')
+ const customArrow = page.locator('.tiny-collapse-item__arrow').first()
+
+ // 自定义图标，内容展开时，标题箭头向上
+ await expect(customArrow.locator('svg')).toHaveClass(/icon-delta-right/)
+ await expect(content.first()).not.toHaveCSS('display', 'none')
+ await expect(customArrow).toHaveCSS('transform', 'matrix(0, -1, 1, 0, 0, 0)')
+ await header.first().click()
+ await expect(header.first()).not.toHaveClass(/is-active/)
+ await expect(content.first()).toHaveCSS('display', 'none')
+ await expect(customArrow).toHaveCSS('transform', 'matrix(0, 1, -1, 0, 0, 0)')
+})
diff --git a/examples/docs/resources/pc/demo/collapse/custom-collapse-title.spec.ts b/examples/docs/resources/pc/demo/collapse/custom-collapse-title.spec.ts
new file mode 100644
index 000000000..34dfdf47d
--- /dev/null
+++ b/examples/docs/resources/pc/demo/collapse/custom-collapse-title.spec.ts
@@ -0,0 +1,10 @@
+import { test, expect } from '@playwright/test'
+
+test('Collapse 自定义面板标题', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/collapse/custom-collapse-title')
+
+ const header = page.locator('.tiny-collapse-item__header')
+ await expect(header.first().locator('span')).toBeVisible()
+ await expect(header.nth(1).locator('div')).not.toHaveCount(0)
+})
diff --git a/examples/docs/resources/pc/demo/collapse/dynamic-disable.spec.ts b/examples/docs/resources/pc/demo/collapse/dynamic-disable.spec.ts
new file mode 100644
index 000000000..851908880
--- /dev/null
+++ b/examples/docs/resources/pc/demo/collapse/dynamic-disable.spec.ts
@@ -0,0 +1,15 @@
+import { test, expect } from '@playwright/test'
+
+test('Collapse 禁用状态', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/collapse/dynamic-disable')
+
+ const disabledItem = page.locator('.tiny-collapse-item').nth(2)
+ const disabledHeader = page.locator('.tiny-collapse-item__header').nth(2)
+ const disabledContent = page.locator('.tiny-collapse-item__wrap').nth(2)
+
+ await expect(disabledItem).toHaveClass(/is-disabled/)
+ await expect(disabledContent).toHaveCSS('display', 'none')
+ await disabledHeader.click()
+ await expect(disabledContent).toHaveCSS('display', 'none')
+})
diff --git a/examples/docs/resources/pc/demo/collapse/nested-form.spec.ts b/examples/docs/resources/pc/demo/collapse/nested-form.spec.ts
new file mode 100644
index 000000000..526324430
--- /dev/null
+++ b/examples/docs/resources/pc/demo/collapse/nested-form.spec.ts
@@ -0,0 +1,9 @@
+import { test, expect } from '@playwright/test'
+
+test('Collapse 嵌套表单', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/collapse/nested-form')
+
+ const content = page.locator('.tiny-collapse-item__content')
+ await expect(content.locator('.tiny-form')).toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/collapse/nested-grid.spec.ts b/examples/docs/resources/pc/demo/collapse/nested-grid.spec.ts
new file mode 100644
index 000000000..73e55daa6
--- /dev/null
+++ b/examples/docs/resources/pc/demo/collapse/nested-grid.spec.ts
@@ -0,0 +1,9 @@
+import { test, expect } from '@playwright/test'
+
+test('Collapse 嵌套表格', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/collapse/nested-grid')
+
+ const content = page.locator('.tiny-collapse-item__content')
+ await expect(content.locator('.tiny-grid')).toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/company/basic-usage.spec.ts b/examples/docs/resources/pc/demo/company/basic-usage.spec.ts
new file mode 100644
index 000000000..37dc0239c
--- /dev/null
+++ b/examples/docs/resources/pc/demo/company/basic-usage.spec.ts
@@ -0,0 +1,25 @@
+import { test, expect } from '@playwright/test'
+
+test('基本用法', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).not.toBeNull())
+ await page.goto('http://localhost:7130/pc/company/basic-usage')
+
+ const select = page.getByPlaceholder('请选择')
+ const dropdown = page.locator('.tiny-select-dropdown.tiny-popper')
+ const icon = page.locator('#preview svg').nth(1)
+ const modal = page.locator('.tiny-modal')
+ const text = page.getByText('当前选中值：')
+
+ await expect(select).toHaveCount(1)
+ await expect(text).toHaveCount(1)
+ await text.isVisible()
+ await expect(dropdown).not.toBeVisible()
+
+ // 展开和收回下拉框测试
+ await icon.click()
+ await expect(dropdown).toBeVisible()
+ await expect(modal.nth(0)).toHaveText('visible:true')
+ await icon.click()
+ await expect(dropdown).not.toBeVisible()
+ await expect(modal.nth(1)).toHaveText('visible:false')
+})
diff --git a/examples/docs/resources/pc/demo/company/custom-service.spec.ts b/examples/docs/resources/pc/demo/company/custom-service.spec.ts
new file mode 100644
index 000000000..315c8259f
--- /dev/null
+++ b/examples/docs/resources/pc/demo/company/custom-service.spec.ts
@@ -0,0 +1,33 @@
+import { test, expect } from '@playwright/test'
+
+test('自定义服务', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).not.toBeNull())
+ await page.goto('http://localhost:7130/pc/company/custom-service')
+
+ const expand = page.locator('#preview svg').nth(1)
+ const clear = page.locator('#preview svg').nth(2)
+ const dropdownItems = page.locator('.tiny-option.tiny-select-dropdown__item')
+ const input = page.locator('#preview').getByPlaceholder('请输入')
+ const count = 2
+ const companys = ['一', '二']
+ const modal = page.locator('.tiny-modal')
+
+ // 展开
+ await expand.click()
+ await expect(dropdownItems).toHaveCount(count)
+ for (let i = 0; i < count; i++) {
+ await expect(dropdownItems.nth(i)).toHaveText(`公司${companys[i]}`)
+ }
+
+ // 选择
+ await dropdownItems.nth(0).click()
+ await expect(modal.nth(0)).toHaveText('change:0001')
+ await expect(input).toHaveValue('公司一')
+ await input.hover()
+
+ // 清空
+ await clear.click()
+ await expect(modal.nth(1)).toHaveText('change:')
+ await expect(modal.nth(2)).toHaveText('clear:触发了')
+ await expect(input).toHaveValue('')
+})
diff --git a/examples/docs/resources/pc/demo/company/custom-service.vue b/examples/docs/resources/pc/demo/company/custom-service.vue
index 41f7dbe93..84d69410e 100644
--- a/examples/docs/resources/pc/demo/company/custom-service.vue
+++ b/examples/docs/resources/pc/demo/company/custom-service.vue
@@ -1,9 +1,19 @@
-
diff --git a/examples/docs/resources/pc/demo/floatbar/operation-floatbar-item.spec.ts b/examples/docs/resources/pc/demo/floatbar/operation-floatbar-item.spec.ts
new file mode 100644
index 000000000..cd6945841
--- /dev/null
+++ b/examples/docs/resources/pc/demo/floatbar/operation-floatbar-item.spec.ts
@@ -0,0 +1,15 @@
+import { test, expect } from '@playwright/test'
+
+test('操作浮动块内容', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/floatbar/operation-floatbar-item')
+
+ const floatbar = page.locator('#preview .tiny-float-bar')
+ const item = floatbar.getByRole('listitem').filter({ hasText: 'custom-Add' })
+ await page.getByRole('button', { name: '增加一项' }).click()
+ await expect(item).toBeVisible()
+ await page.getByRole('button', { name: '删除一项' }).click()
+ await expect(item).not.toBeVisible()
+ await page.getByRole('button', { name: '删除所有项' }).click()
+ await expect(floatbar.getByRole('listitem')).toHaveCount(0)
+})
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/form/custom-validation-rule.spec.js b/examples/docs/resources/pc/demo/form/custom-validation-rule.spec.js
new file mode 100644
index 000000000..139fc010b
--- /dev/null
+++ b/examples/docs/resources/pc/demo/form/custom-validation-rule.spec.js
@@ -0,0 +1,93 @@
+import { test, expect } from '@playwright/test'
+
+test('测试有密码校验', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/form/custom-validation-rule')
+
+ const preview = page.locator('#preview')
+ const form = preview.locator('.tiny-form')
+ const submitButton = form.getByRole('button', { name: '注册' })
+ const username = form.locator('input[type="text"]')
+ const password = form.locator('input[type="password"]')
+ const usernameValid = page.getByText('表单项被校验后触发的事件,所校验字段为:username')
+ const passwordValid = page.getByText('表单项被校验后触发的事件,所校验字段为:password')
+
+ // 校验提示出现
+ await submitButton.click()
+ await expect(usernameValid).toBeVisible()
+ await expect(page.getByText('校验不通过！！')).toBeVisible()
+ await expect(passwordValid).toBeVisible()
+ await expect(preview.getByText('必填').first()).toBeVisible()
+ await expect(preview.getByText('必填').nth(1)).toBeVisible()
+
+ const noValidUsername = '1'
+ const validUsername = '123'
+ const noValidPassword = '1'
+ const validPassword = 'Test1234'
+ await username.click()
+ await username.fill(noValidUsername)
+ await expect(preview.getByText('长度必须不小于2')).toBeVisible()
+ await username.fill(validUsername)
+ await expect(preview.getByText('长度必须不小于2')).not.toBeVisible()
+ await password.click()
+ await password.fill(noValidPassword)
+ await password.blur()
+ await expect(preview.getByText('最少八个字符，至少包含一个大写字母，一个小写字母和一个数字')).toBeVisible()
+ await password.click()
+ await password.fill(validPassword)
+ await password.blur()
+ await expect(preview.getByText('最少八个字符，至少包含一个大写字母，一个小写字母和一个数字')).not.toBeVisible()
+ // 检验提示不出现
+ await submitButton.click()
+ await expect(page.getByText('校验不通过！！')).not.toBeVisible()
+ await expect(passwordValid).not.toBeVisible()
+ await expect(preview.getByText('必填').first()).not.toBeVisible()
+ await expect(preview.getByText('必填').nth(1)).not.toBeVisible()
+})
+
+test('测试清除密码校验', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/form/custom-validation-rule')
+
+ const preview = page.locator('#preview')
+ const form = preview.locator('.tiny-form')
+ const cleanButton = form.getByRole('button', { name: '清除密码校验' })
+ const submitButton = form.getByRole('button', { name: '注册' })
+ const username = form.locator('input[type="text"]')
+ const password = form.locator('input[type="password"]')
+ const usernameValid = page.getByText('表单项被校验后触发的事件,所校验字段为:username')
+ const passwordValid = page.getByText('表单项被校验后触发的事件,所校验字段为:password')
+
+ // 校验提示出现
+ await cleanButton.click()
+ await submitButton.click()
+ await expect(usernameValid).toBeVisible()
+ await expect(page.getByText('校验不通过！！')).toBeVisible()
+ await expect(passwordValid).not.toBeVisible()
+ await expect(preview.getByText('必填').first()).toBeVisible()
+ await expect(preview.getByText('必填').nth(1)).not.toBeVisible()
+
+ const noValidUsername = '1'
+ const validUsername = '123'
+ const noValidPassword = '1'
+ const validPassword = 'Test1234'
+ await username.click()
+ await username.fill(noValidUsername)
+ await expect(preview.getByText('长度必须不小于2')).toBeVisible()
+ await username.fill(validUsername)
+ await expect(preview.getByText('长度必须不小于2')).not.toBeVisible()
+ await password.click()
+ await password.fill(noValidPassword)
+ await password.blur()
+ await expect(preview.getByText('最少八个字符，至少包含一个大写字母，一个小写字母和一个数字')).not.toBeVisible()
+ await password.click()
+ await password.fill(validPassword)
+ await password.blur()
+ await expect(preview.getByText('最少八个字符，至少包含一个大写字母，一个小写字母和一个数字')).not.toBeVisible()
+ // 检验提示不出现
+ await submitButton.click()
+ await expect(page.getByText('校验不通过！！')).not.toBeVisible()
+ await expect(passwordValid).not.toBeVisible()
+ await expect(preview.getByText('必填').first()).not.toBeVisible()
+ await expect(preview.getByText('必填').nth(1)).not.toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/form/custom-validation-rule.vue b/examples/docs/resources/pc/demo/form/custom-validation-rule.vue
index 8b5882033..75a48dadc 100644
--- a/examples/docs/resources/pc/demo/form/custom-validation-rule.vue
+++ b/examples/docs/resources/pc/demo/form/custom-validation-rule.vue
@@ -17,8 +17,12 @@
- 注册
- 清除密码校验
+
+ 注册
+
+
+ 清除密码校验
+
diff --git a/examples/docs/resources/pc/demo/form/form-clear-validate.spec.js b/examples/docs/resources/pc/demo/form/form-clear-validate.spec.js
new file mode 100644
index 000000000..58762fc98
--- /dev/null
+++ b/examples/docs/resources/pc/demo/form/form-clear-validate.spec.js
@@ -0,0 +1,29 @@
+import { test, expect } from '@playwright/test'
+
+test('测试移除校验是否成功', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/form/form-clear-validate')
+
+ const preview = page.locator('#preview')
+ const form = preview.locator('.tiny-form')
+ const submitButton = form.getByRole('button', { name: '提交' })
+ const cleanButton = form.getByRole('button', { name: '移除表单校验' })
+ // 必填的tooltip提示
+ const requiredTip = page.locator('.tiny-tooltip').getByText('必填')
+ // 日期校验tooltip提示
+ const dateTip = page.locator('.tiny-tooltip').getByText('不符合规则的日期格式')
+
+ await submitButton.click()
+ await expect(requiredTip.first()).toBeVisible()
+ await expect(requiredTip.nth(1)).toBeVisible()
+ await expect(requiredTip.nth(2)).toBeVisible()
+ await expect(requiredTip.nth(3)).toBeVisible()
+ await expect(dateTip).toBeVisible()
+
+ await cleanButton.click()
+ await expect(requiredTip.first()).not.toBeVisible()
+ await expect(requiredTip.nth(1)).not.toBeVisible()
+ await expect(requiredTip.nth(2)).not.toBeVisible()
+ await expect(requiredTip.nth(3)).not.toBeVisible()
+ await expect(dateTip).not.toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/form/form-clear-validate.vue b/examples/docs/resources/pc/demo/form/form-clear-validate.vue
index 7922307af..a6db9ed46 100644
--- a/examples/docs/resources/pc/demo/form/form-clear-validate.vue
+++ b/examples/docs/resources/pc/demo/form/form-clear-validate.vue
@@ -23,8 +23,12 @@
- 移除表单校验
- 提交
+
+ 移除表单校验
+
+
+ 提交
+
diff --git a/examples/docs/resources/pc/demo/form/form-disabled.spec.js b/examples/docs/resources/pc/demo/form/form-disabled.spec.js
new file mode 100644
index 000000000..233423383
--- /dev/null
+++ b/examples/docs/resources/pc/demo/form/form-disabled.spec.js
@@ -0,0 +1,73 @@
+import { test, expect } from '@playwright/test'
+
+test('测试表单禁用', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/form/form-disabled')
+
+ const preview = page.locator('#preview')
+ const form = preview.locator('.tiny-form')
+ const disabledButton = preview.getByRole('button', { name: '禁用表单' })
+ const startButton = preview.getByRole('button', { name: '启用表单' })
+ const formItem = form.locator('.tiny-form-item')
+ const slider = formItem.nth(18).locator('.tiny-slider__handle')
+
+ // 设置视口宽高，否则滑动不在视口中则无法拖动
+ await page.setViewportSize({
+ width: 1400,
+ height: 1200
+ })
+
+ await disabledButton.click()
+ await expect(formItem.first().locator('input')).toBeDisabled()
+ await expect(formItem.nth(1).locator('input')).toBeDisabled()
+ await expect(formItem.nth(2).locator('.tiny-numeric__input')).toHaveClass(/is-disabled/)
+ await expect(formItem.nth(3).locator('.tiny-switch')).toHaveClass(/tiny-switch-disabled/)
+ await expect(formItem.nth(4).locator('input').first()).toBeDisabled()
+ await expect(formItem.nth(5).locator('input').nth(1)).toBeDisabled()
+ await expect(formItem.nth(6).locator('input').first()).toBeDisabled()
+ await expect(formItem.nth(7).locator('input').first()).toBeDisabled()
+ await expect(formItem.nth(8).locator('input')).toBeDisabled()
+ await expect(formItem.nth(9).locator('input')).toBeDisabled()
+ await expect(formItem.nth(10).locator('input')).toBeDisabled()
+ await expect(formItem.nth(11).locator('textarea')).toBeDisabled()
+ await expect(formItem.nth(12).locator('input')).toBeDisabled()
+ await expect(formItem.nth(13).locator('button').first()).toHaveClass(/disabled/)
+ await expect(formItem.nth(14).locator('input')).toBeDisabled()
+ await expect(formItem.nth(15).locator('input').first()).toBeDisabled()
+ await expect(formItem.nth(17).locator('input').first()).toBeDisabled()
+ // 尝试拖到滑块,应是无法拖动状态
+ const { x, y, height } = await slider.boundingBox()
+ await page.mouse.move(x, y + (height / 2))
+ await page.mouse.down()
+ await page.mouse.move(x + 50, y + (height / 2))
+ await page.mouse.up()
+ const { x: newX } = await slider.boundingBox()
+ expect(newX).toEqual(x)
+
+ await startButton.click()
+ await expect(formItem.first().locator('input')).not.toBeDisabled()
+ await expect(formItem.nth(1).locator('input')).not.toBeDisabled()
+ await expect(formItem.nth(2).locator('.tiny-numeric__input')).not.toHaveClass(/is-disabled/)
+ await expect(formItem.nth(3).locator('.tiny-switch')).not.toHaveClass(/tiny-switch-disabled/)
+ await expect(formItem.nth(4).locator('input').first()).not.toBeDisabled()
+ await expect(formItem.nth(5).locator('input').nth(1)).not.toBeDisabled()
+ await expect(formItem.nth(6).locator('input').first()).not.toBeDisabled()
+ await expect(formItem.nth(7).locator('input').first()).not.toBeDisabled()
+ await expect(formItem.nth(8).locator('input')).not.toBeDisabled()
+ await expect(formItem.nth(9).locator('input')).not.toBeDisabled()
+ await expect(formItem.nth(10).locator('input')).not.toBeDisabled()
+ await expect(formItem.nth(11).locator('textarea')).not.toBeDisabled()
+ await expect(formItem.nth(12).locator('input')).not.toBeDisabled()
+ await expect(formItem.nth(13).locator('button').first()).not.toHaveClass(/disabled/)
+ await expect(formItem.nth(14).locator('input')).not.toBeDisabled()
+ await expect(formItem.nth(15).locator('input').first()).not.toBeDisabled()
+ await expect(formItem.nth(17).locator('input').first()).not.toBeDisabled()
+ // 尝试拖到滑块,应是可以拖动状态
+ const sliderBox = await slider.boundingBox()
+ await page.mouse.move(sliderBox.x, sliderBox.y + (sliderBox.height / 2))
+ await page.mouse.down()
+ await page.mouse.move(sliderBox.x + 50, sliderBox.y + (sliderBox.height / 2))
+ await page.mouse.up()
+ const afterSliderBox = await slider.boundingBox()
+ expect(sliderBox.x).toBeLessThan(afterSliderBox.x)
+})
diff --git a/examples/docs/resources/pc/demo/form/form-disabled.vue b/examples/docs/resources/pc/demo/form/form-disabled.vue
index 74777ce37..94336d3cb 100644
--- a/examples/docs/resources/pc/demo/form/form-disabled.vue
+++ b/examples/docs/resources/pc/demo/form/form-disabled.vue
@@ -23,12 +23,18 @@
- 男
+
+ 男
+
- 复选框
- 复选框2
+
+ 复选框
+
+
+ 复选框2
+
@@ -55,7 +61,8 @@
-
+
+
- 提交
+
+ 提交
+
diff --git a/examples/docs/resources/pc/demo/form/form-in-row.spec.js b/examples/docs/resources/pc/demo/form/form-in-row.spec.js
new file mode 100644
index 000000000..32028a815
--- /dev/null
+++ b/examples/docs/resources/pc/demo/form/form-in-row.spec.js
@@ -0,0 +1,31 @@
+import { test, expect } from '@playwright/test'
+
+test('测试行内表单', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/form/form-in-row')
+
+ const preview = page.locator('#preview')
+ const form = preview.locator('.tiny-form')
+ const item1 = form.locator('.tiny-form-item').first()
+ const item2 = form.locator('.tiny-form-item').nth(1)
+
+ // 测试单行情况
+ await page.setViewportSize({
+ width: 1400,
+ height: 700
+ })
+ await page.waitForTimeout(200)
+ let box1 = await item1.boundingBox()
+ let box2 = await item2.boundingBox()
+ expect(box1.y).toEqual(box2.y)
+
+ // 测试换行情况
+ await page.setViewportSize({
+ width: 900,
+ height: 700
+ })
+ await page.waitForTimeout(200)
+ box1 = await item1.boundingBox()
+ box2 = await item2.boundingBox()
+ expect(box1.y).toBeLessThan(box2.y)
+})
diff --git a/examples/docs/resources/pc/demo/form/form-in-row.vue b/examples/docs/resources/pc/demo/form/form-in-row.vue
index 7ec95af22..a9ee7fec8 100644
--- a/examples/docs/resources/pc/demo/form/form-in-row.vue
+++ b/examples/docs/resources/pc/demo/form/form-in-row.vue
@@ -4,7 +4,9 @@
- 男
+
+ 男
+
diff --git a/examples/docs/resources/pc/demo/form/form-row-col.spec.js b/examples/docs/resources/pc/demo/form/form-row-col.spec.js
new file mode 100644
index 000000000..61916c356
--- /dev/null
+++ b/examples/docs/resources/pc/demo/form/form-row-col.spec.js
@@ -0,0 +1,23 @@
+import { test, expect } from '@playwright/test'
+
+test('测试表单复杂布局', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/form/form-row-col')
+
+ const preview = page.locator('#preview')
+ const form = preview.locator('.tiny-form')
+ const formItem = form.locator('.tiny-form-item')
+
+ const item1Box = await formItem.first().boundingBox()
+ const item2Box = await formItem.nth(1).boundingBox()
+ const item3Box = await formItem.nth(2).boundingBox()
+ const item4Box = await formItem.nth(3).boundingBox()
+ const item5Box = await formItem.nth(4).boundingBox()
+ // 表单第一项和第二项在同一水平线且宽度相同
+ expect(item1Box.y).toEqual(item2Box.y)
+ expect(item1Box.width).toEqual(item2Box.width)
+ // 表单第三项和第四项在同一水平线且宽度相同
+ expect(item3Box.y).toEqual(item4Box.y)
+ expect(item3Box.width).toEqual(item4Box.width)
+ expect(item4Box.y).toBeLessThan(item5Box.y)
+})
diff --git a/examples/docs/resources/pc/demo/form/form-row-col.vue b/examples/docs/resources/pc/demo/form/form-row-col.vue
index 7c8f58f6d..571849746 100644
--- a/examples/docs/resources/pc/demo/form/form-row-col.vue
+++ b/examples/docs/resources/pc/demo/form/form-row-col.vue
@@ -35,7 +35,9 @@
- 提交
+
+ 提交
+
diff --git a/examples/docs/resources/pc/demo/form/form-validation.spec.js b/examples/docs/resources/pc/demo/form/form-validation.spec.js
new file mode 100644
index 000000000..4a91405eb
--- /dev/null
+++ b/examples/docs/resources/pc/demo/form/form-validation.spec.js
@@ -0,0 +1,104 @@
+import { test, expect } from '@playwright/test'
+
+test('测试表单校验规则', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/form/form-validation')
+
+ const preview = page.locator('#preview')
+ const form = preview.locator('.tiny-form')
+
+ // 直接提交，查看是否出现检验提示
+ await form.getByRole('button', { name: '提交' }).click()
+ await expect(page.getByRole('tooltip', { name: '必填' }).first()).toBeVisible()
+ await expect(page.getByRole('tooltip', { name: '不符合规则的日期格式' })).toBeVisible()
+ await expect(page.getByRole('tooltip', { name: '必填' }).nth(1)).toBeVisible()
+ await expect(page.getByRole('tooltip', { name: '必填' }).nth(2)).toBeVisible()
+ await expect(page.getByRole('tooltip', { name: '必填 2~11 之间的数字' })).toBeVisible()
+ await expect(page.getByRole('tooltip', { name: '必填1.1.1.1' })).toBeVisible()
+})
+
+test('测试表单输入变化和失焦是否出现校验', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/form/form-validation')
+
+ const preview = page.locator('#preview')
+ const form = preview.locator('.tiny-form')
+ const formItem = form.locator('.tiny-form-item')
+ const requiredTip = page.getByRole('tooltip', { name: '必填' })
+
+ // 对长度有要求的检验
+ const firstInput = formItem.first().locator('input')
+ await firstInput.click()
+ await firstInput.blur()
+ await expect(requiredTip.first()).toBeVisible()
+ await firstInput.fill('1')
+ await expect(requiredTip.first()).not.toBeVisible()
+ await expect(page.getByRole('tooltip', { name: '长度必须不小于2' })).toBeVisible()
+ await firstInput.fill('111')
+ await expect(page.getByRole('tooltip', { name: '长度必须不小于2' })).not.toBeVisible()
+
+ // 日期选择器的校验
+ const datePicker = form.locator('.tiny-date-editor').first().locator('input')
+ await datePicker.click()
+ // 点击第一项输入去触发失焦，调用blur事件不会将日期选择器收起
+ await firstInput.click()
+ await expect(page.getByRole('tooltip', { name: '不符合规则的日期格式' })).toBeVisible()
+ await datePicker.click()
+ await page.locator('.tiny-date-picker').getByText('15').click()
+ await expect(page.getByRole('tooltip', { name: '不符合规则的日期格式' })).not.toBeVisible()
+
+ // url输入框
+ const urlInput = formItem.nth(2).locator('input')
+ const validUrl = 'https://test.com'
+ urlInput.fill('1111')
+ await expect(page.getByRole('tooltip', { name: '非法 URL 地址' })).toBeVisible()
+ urlInput.fill(validUrl)
+ await expect(page.getByRole('tooltip', { name: '非法 URL 地址' })).not.toBeVisible()
+
+ // email输入框
+ const emailInput = formItem.nth(4).locator('input')
+ const validEmail = '111@test.com'
+ emailInput.fill('1111')
+ await expect(page.getByRole('tooltip', { name: '非法邮件地址' })).toBeVisible()
+ emailInput.fill(validEmail)
+ await expect(page.getByRole('tooltip', { name: '非法邮件地址' })).not.toBeVisible()
+
+ // 级联选择器
+ const cascade = formItem.locator('.tiny-cascader input')
+ const cascadeSelect = page.locator('.tiny-cascader-dropdown')
+ await cascade.click()
+ await firstInput.click()
+ await expect(requiredTip.first()).toBeVisible()
+ await cascade.click()
+ await cascadeSelect.getByText('指南').click()
+ await cascadeSelect.getByText('安装').click()
+ await expect(requiredTip.first()).not.toBeVisible()
+
+ // numeric输入
+ const numeric = formItem.locator('.tiny-numeric').first()
+ const increase = numeric.locator('.tiny-numeric__increase')
+ await increase.click()
+ await expect(page.getByRole('tooltip', { name: '必填 2~11 之间的数字' })).toBeVisible()
+ await increase.click()
+ await expect(page.getByRole('tooltip', { name: '必填 2~11 之间的数字' })).not.toBeVisible()
+
+ // ip输入
+ const ipInput = formItem.locator('.tiny-ip-address input')
+ await ipInput.nth(0).fill('2')
+ await ipInput.nth(1).fill('2')
+ await ipInput.nth(2).fill('2')
+ await ipInput.nth(3).fill('2')
+ await expect(page.getByRole('tooltip', { name: '必填1.1.1.1' })).toBeVisible()
+ await ipInput.nth(0).fill('1')
+ await ipInput.nth(1).fill('1')
+ await ipInput.nth(2).fill('1')
+ await ipInput.nth(3).fill('1')
+ await expect(page.getByRole('tooltip', { name: '必填1.1.1.1' })).not.toBeVisible()
+
+ // 提交成功
+ const submitButton = form.getByRole('button', { name: '提交' })
+ const successModal = page.locator('.tiny-modal__box').getByText('提交成功')
+ await formItem.locator('.tiny-radio').first().click()
+ await submitButton.click()
+ await expect(successModal).toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/form/form-validation.vue b/examples/docs/resources/pc/demo/form/form-validation.vue
index 90dcbc223..d1550110d 100644
--- a/examples/docs/resources/pc/demo/form/form-validation.vue
+++ b/examples/docs/resources/pc/demo/form/form-validation.vue
@@ -20,8 +20,10 @@
-
- 男
+
+ 男
+
@@ -20,10 +22,13 @@
-
+
+
- 提交
+
+ 提交
+
diff --git a/examples/docs/resources/pc/demo/form/group-form.spec.js b/examples/docs/resources/pc/demo/form/group-form.spec.js
new file mode 100644
index 000000000..98fbca4d7
--- /dev/null
+++ b/examples/docs/resources/pc/demo/form/group-form.spec.js
@@ -0,0 +1,20 @@
+import { test, expect } from '@playwright/test'
+
+test('测试分组表单', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/form/group-form')
+
+ const preview = page.locator('#preview')
+ const form = preview.locator('.tiny-form')
+ const requiredTip = page.locator('.tiny-tooltip').getByText('必填')
+ const submitButton = preview.getByRole('button', { name: '确认' })
+
+ await expect(form).toHaveCount(2)
+ await submitButton.click()
+ await expect(requiredTip).toHaveCount(2)
+ await form.first().locator('input').first().fill('1111')
+ await form.nth(1).locator('input').first().fill('1111')
+ await submitButton.click()
+ await expect(requiredTip).toHaveCount(0)
+ await expect(page.locator('.tiny-modal__box').getByText('提交成功')).toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/form/group-form.vue b/examples/docs/resources/pc/demo/form/group-form.vue
index 6a9d6545c..a76e65b7f 100644
--- a/examples/docs/resources/pc/demo/form/group-form.vue
+++ b/examples/docs/resources/pc/demo/form/group-form.vue
@@ -1,41 +1,57 @@
+
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/modal/zIndex.spec.ts b/examples/docs/resources/pc/demo/modal/zIndex.spec.ts
new file mode 100644
index 000000000..ec00c156c
--- /dev/null
+++ b/examples/docs/resources/pc/demo/modal/zIndex.spec.ts
@@ -0,0 +1,10 @@
+import { test, expect } from '@playwright/test'
+
+test('自定义z-index', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/modal/zIndex')
+
+ const modal = page.locator('.tiny-modal')
+ await page.getByRole('button', { name: 'zIndex的值为500' }).click()
+ await expect(modal).toHaveCSS('z-index', '500')
+})
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/modal/zoom-event.spec.ts b/examples/docs/resources/pc/demo/modal/zoom-event.spec.ts
new file mode 100644
index 000000000..4208add91
--- /dev/null
+++ b/examples/docs/resources/pc/demo/modal/zoom-event.spec.ts
@@ -0,0 +1,19 @@
+import { test, expect } from '@playwright/test'
+
+test('窗口缩放事件', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/modal/zoom-event')
+
+ await page.getByRole('button', { name: '窗口缩放时触发事件' }).click()
+ const modal = page.locator('.tiny-modal__box')
+
+ // 获取弹窗位置
+ const { x, y } = await modal.boundingBox()
+
+ // 开始拖动
+ await page.mouse.move(x, y)
+ await page.mouse.down()
+ await page.mouse.move(x, y - 50)
+ await expect(page.locator('.tiny-modal.type__message')).toHaveText('窗口缩放时触发事件')
+ await page.mouse.up()
+})
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/nav-menu/basic-usage.spec.ts b/examples/docs/resources/pc/demo/nav-menu/basic-usage.spec.ts
new file mode 100644
index 000000000..2ba353cf9
--- /dev/null
+++ b/examples/docs/resources/pc/demo/nav-menu/basic-usage.spec.ts
@@ -0,0 +1,17 @@
+import { test, expect } from '@playwright/test';
+
+test('基础用法', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull());
+ await page.goto('http://localhost:7130/pc/nav-menu/basic-usage');
+ const preview = page.locator('#preview');
+ const popMenu = preview.locator('.popmenu');
+ const homePage = preview.getByText('首页');
+ await homePage.click();
+ await expect(homePage).toHaveCSS('border-bottom', /3px solid/);
+ const components = preview.getByText('组件');
+ await components.hover();
+ await expect(popMenu).toBeVisible();
+ const showMore = preview.getByText('更多');
+ await showMore.hover();
+ await expect(popMenu).toBeVisible();
+});
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/nav-menu/before-skip-prevent.spec.ts b/examples/docs/resources/pc/demo/nav-menu/before-skip-prevent.spec.ts
new file mode 100644
index 000000000..9e9f98aae
--- /dev/null
+++ b/examples/docs/resources/pc/demo/nav-menu/before-skip-prevent.spec.ts
@@ -0,0 +1,16 @@
+import { test, expect } from '@playwright/test';
+
+test('使用组件默认服务时，菜单跳转处理', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull());
+ await page.goto('http://localhost:7130/pc/nav-menu/before-skip-prevent');
+ const preview = page.locator('#preview');
+ const popMenu = preview.locator('.popmenu');
+ const modal = page.locator('div').filter({ hasText: /prevent 事件/ }).first();
+ await preview.getByText('首页').click();
+ await expect(modal).toBeVisible();
+ const components = preview.locator('a').filter({ hasText: '组件' });
+ await components.hover();
+ await expect(popMenu).toBeVisible();
+ await components.click();
+ await expect(modal).toBeVisible();
+})
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/nav-menu/before-skip-prevent.vue b/examples/docs/resources/pc/demo/nav-menu/before-skip-prevent.vue
index 60feb66e8..6a9d1fc8e 100644
--- a/examples/docs/resources/pc/demo/nav-menu/before-skip-prevent.vue
+++ b/examples/docs/resources/pc/demo/nav-menu/before-skip-prevent.vue
@@ -1,6 +1,6 @@
-
+
@@ -9,7 +9,7 @@
diff --git a/examples/docs/resources/pc/demo/nav-menu/before-skip.spec.ts b/examples/docs/resources/pc/demo/nav-menu/before-skip.spec.ts
new file mode 100644
index 000000000..cc20880c8
--- /dev/null
+++ b/examples/docs/resources/pc/demo/nav-menu/before-skip.spec.ts
@@ -0,0 +1,11 @@
+import { test, expect } from '@playwright/test';
+
+test('菜单跳转处理', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull());
+ await page.goto('http://localhost:7130/pc/nav-menu/before-skip');
+ const preview = page.locator('#preview');
+ await preview.getByText('规范').click();
+ await expect(page.locator('div').filter({ hasText: '当前跳转的菜单为：规范' }).first()).toBeVisible();
+ await preview.getByText('案例').click();
+ await expect(page.locator('div').filter({ hasText: '当前跳转的菜单为：案例' }).first()).toBeVisible();
+})
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/nav-menu/custom-service.spec.ts b/examples/docs/resources/pc/demo/nav-menu/custom-service.spec.ts
new file mode 100644
index 000000000..49f0918cc
--- /dev/null
+++ b/examples/docs/resources/pc/demo/nav-menu/custom-service.spec.ts
@@ -0,0 +1,12 @@
+import { test, expect } from '@playwright/test';
+
+test('自定义服务', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull());
+ await page.goto('http://localhost:7130/pc/nav-menu/custom-service');
+ const preview = page.locator('#preview');
+ const guides = preview.getByText('指南');
+ await guides.hover();
+ await expect(preview.locator('.popmenu')).toBeVisible();
+ await guides.click();
+ await expect(guides).toHaveCSS('border-bottom', /3px solid/);
+})
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/nav-menu/data-resource.spec.ts b/examples/docs/resources/pc/demo/nav-menu/data-resource.spec.ts
new file mode 100644
index 000000000..2f25f5624
--- /dev/null
+++ b/examples/docs/resources/pc/demo/nav-menu/data-resource.spec.ts
@@ -0,0 +1,17 @@
+import { test, expect } from '@playwright/test';
+
+test('数据源', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull());
+ await page.goto('http://localhost:7130/pc/nav-menu/data-resource');
+ const preview = page.locator('#preview');
+ const popMenu = preview.locator('.popmenu');
+ const homePage = preview.getByText('首页');
+ await homePage.click();
+ await expect(homePage).toHaveCSS('border-bottom', /3px solid/);
+ const components = preview.getByText('组件');
+ await components.hover();
+ await expect(popMenu).toBeVisible();
+ const showMore = preview.getByText('更多');
+ await showMore.hover();
+ await expect(popMenu).toBeVisible();
+})
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/nav-menu/overflow.spec.ts b/examples/docs/resources/pc/demo/nav-menu/overflow.spec.ts
new file mode 100644
index 000000000..b7762ac86
--- /dev/null
+++ b/examples/docs/resources/pc/demo/nav-menu/overflow.spec.ts
@@ -0,0 +1,14 @@
+import { test, expect } from '@playwright/test';
+
+test('显示策略', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull());
+ await page.goto('http://localhost:7130/pc/nav-menu/overflow');
+ const preview = page.locator('#preview');
+ const popMenu = preview.locator('.popmenu');
+ await preview.locator('.more-button').hover();
+ await expect(popMenu).toBeVisible();
+ await preview.getByRole('listitem').filter({ hasText: '指南' }).nth(2).hover();
+ await expect(popMenu.locator('.sub-menu')).toBeVisible();
+ await preview.getByText('指南').first().hover();
+ await expect(popMenu).toBeVisible();
+})
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/nav-menu/slot-logo.spec.ts b/examples/docs/resources/pc/demo/nav-menu/slot-logo.spec.ts
new file mode 100644
index 000000000..bfbfa816c
--- /dev/null
+++ b/examples/docs/resources/pc/demo/nav-menu/slot-logo.spec.ts
@@ -0,0 +1,8 @@
+import { test, expect } from '@playwright/test';
+
+test('Logo 插槽', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull());
+ await page.goto('http://localhost:7130/pc/nav-menu/slot-logo');
+ const preview = page.locator('#preview');
+ await expect(preview.locator('.slot-logo svg')).toHaveCount(1);
+})
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/nav-menu/slot-toolbar.spec.ts b/examples/docs/resources/pc/demo/nav-menu/slot-toolbar.spec.ts
new file mode 100644
index 000000000..d05bfedd2
--- /dev/null
+++ b/examples/docs/resources/pc/demo/nav-menu/slot-toolbar.spec.ts
@@ -0,0 +1,8 @@
+import { test, expect } from '@playwright/test';
+
+test('Toolbar 插槽', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull());
+ await page.goto('http://localhost:7130/pc/nav-menu/slot-toolbar');
+ const preview = page.locator('#preview');
+ await expect(preview.locator('.slot-toolbar svg')).toHaveCount(1);
+});
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/notify/basic-usage.spec.ts b/examples/docs/resources/pc/demo/notify/basic-usage.spec.ts
new file mode 100644
index 000000000..6e1a81587
--- /dev/null
+++ b/examples/docs/resources/pc/demo/notify/basic-usage.spec.ts
@@ -0,0 +1,15 @@
+import { test, expect } from '@playwright/test'
+
+test('基本用法', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/notify/basic-usage')
+ await page.getByRole('button', { name: '弹出提示框' }).click()
+ const status = page.locator('.tiny-notify__icon-status')
+ await expect(status).toBeVisible()
+ await expect(page.getByRole('heading', { name: '通知消息的标题' })).toBeVisible()
+ await expect(
+ page.getByText('通知消息的正文，通知消息的正文，通知消息的正文，通知消息的正文，通知消息的正文，通知消息的正文')
+ ).toBeVisible()
+ const close = page.locator('.tiny-notify__icon-close > .tiny-svg')
+ await expect(close).toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/notify/beforeClose.spec.ts b/examples/docs/resources/pc/demo/notify/beforeClose.spec.ts
new file mode 100644
index 000000000..18cf9cb43
--- /dev/null
+++ b/examples/docs/resources/pc/demo/notify/beforeClose.spec.ts
@@ -0,0 +1,13 @@
+import { test, expect } from '@playwright/test'
+
+test('关闭通知框前触发的事件', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/notify/beforeClose')
+ await page.getByRole('button', { name: '关闭前的事件' }).click()
+ await page.locator('.tiny-notify__icon-close > .tiny-svg').click()
+ const cloEveNT = await page
+ .locator('div')
+ .filter({ hasText: '在通知框关闭前触发的事件,返回 false 可阻止关闭通知框' })
+ .nth(1)
+ await expect(cloEveNT).toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/notify/closeIcon.spec.ts b/examples/docs/resources/pc/demo/notify/closeIcon.spec.ts
new file mode 100644
index 000000000..5675bba65
--- /dev/null
+++ b/examples/docs/resources/pc/demo/notify/closeIcon.spec.ts
@@ -0,0 +1,12 @@
+import { test, expect } from '@playwright/test'
+
+test('自定义关闭图标', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/notify/closeIcon')
+ await page.getByRole('button', { name: '自定义关闭图标' }).click()
+ const svg = page.locator('.tiny-notify__icon-close > .tiny-svg > .st0')
+ await expect(svg).toHaveAttribute(
+ 'd',
+ 'M3 1h18c.9 0 2 1.1 2 2v18c0 .9-1 2-2 2H3c-.9 0-2-1.1-2-2V3c0-.9 1.1-2 2-2zm0 2v18h18V3H3zm13.8 4.2c.3.3.3.9 0 1.2L13.2 12l3.6 3.6c.3.3.3.9 0 1.2-.2.2-.4.2-.6.2-.2 0-.4-.1-.6-.2L12 13.2l-3.6 3.6c-.1.1-.4.2-.6.2s-.4-.1-.6-.2c-.3-.3-.3-.9 0-1.2l3.6-3.6-3.6-3.6c-.3-.3-.3-.9 0-1.2.3-.3.9-.3 1.2 0l3.6 3.6 3.6-3.6c.3-.3.8-.3 1.2 0z'
+ )
+})
diff --git a/examples/docs/resources/pc/demo/notify/debounceDelay.spec.ts b/examples/docs/resources/pc/demo/notify/debounceDelay.spec.ts
new file mode 100644
index 000000000..775bd7ebc
--- /dev/null
+++ b/examples/docs/resources/pc/demo/notify/debounceDelay.spec.ts
@@ -0,0 +1,16 @@
+import { test, expect } from '@playwright/test'
+
+test('配置防抖', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/notify/debounceDelay')
+ await page.getByRole('button', { name: 'Debounce' }).click()
+ await page.waitForTimeout(3000)
+ const db = page
+ .locator('div')
+ .filter({
+ hasText:
+ '通知消息的标题通知消息的正文，通知消息的正文，通知消息的正文，通知消息的正文，通知消息的正文，通知消息的正文'
+ })
+ .first()
+ await expect(db).toBeVisible
+})
diff --git a/examples/docs/resources/pc/demo/notify/duration.spec.ts b/examples/docs/resources/pc/demo/notify/duration.spec.ts
new file mode 100644
index 000000000..3fd411517
--- /dev/null
+++ b/examples/docs/resources/pc/demo/notify/duration.spec.ts
@@ -0,0 +1,20 @@
+import { test, expect } from '@playwright/test'
+
+test('自动关闭延时', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/notify/duration')
+ await page.getByRole('button', { name: '默认4500 ms后自动关闭提示框' }).click()
+ await page.waitForSelector('.tiny-notify')
+ await page.waitForTimeout(4500)
+ await page.waitForSelector('.tiny-notify', { state: 'hidden' })
+
+ await page.getByRole('button', { name: '500ms后自动关闭提示框' }).click()
+ await page.waitForSelector('.tiny-notify')
+ await page.waitForTimeout(500)
+ await page.waitForSelector('.tiny-notify', { state: 'hidden' })
+
+ await page.getByRole('button', { name: '5000ms后自动关闭提示框' }).click()
+ await page.waitForSelector('.tiny-notify')
+ await page.waitForTimeout(5000)
+ await page.waitForSelector('.tiny-notify', { state: 'hidden' })
+})
diff --git a/examples/docs/resources/pc/demo/notify/message.spec.ts b/examples/docs/resources/pc/demo/notify/message.spec.ts
new file mode 100644
index 000000000..265a02f39
--- /dev/null
+++ b/examples/docs/resources/pc/demo/notify/message.spec.ts
@@ -0,0 +1,9 @@
+import { test, expect } from '@playwright/test'
+
+test('自定义内容', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/notify/message')
+ await page.getByRole('button', { name: '自定义内容' }).click()
+ const content = await page.getByRole('paragraph').filter({ hasText: '自定义内容' })
+ await expect(content).toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/notify/onClose.spec.ts b/examples/docs/resources/pc/demo/notify/onClose.spec.ts
new file mode 100644
index 000000000..66ce0f9af
--- /dev/null
+++ b/examples/docs/resources/pc/demo/notify/onClose.spec.ts
@@ -0,0 +1,11 @@
+import { test, expect } from '@playwright/test'
+
+test('点击关闭按钮时触发事件', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/notify/close')
+ await page.getByRole('button', { name: '点击关闭按钮时触发事件' }).click()
+ const notify = page.locator('.tiny-notify')
+ await page.locator('.tiny-notify__icon-close').click()
+ const modal = page.locator('.tiny-modal__box')
+ await expect(modal).toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/notify/position.spec.ts b/examples/docs/resources/pc/demo/notify/position.spec.ts
new file mode 100644
index 000000000..d24d2a148
--- /dev/null
+++ b/examples/docs/resources/pc/demo/notify/position.spec.ts
@@ -0,0 +1,13 @@
+import { test, expect } from '@playwright/test'
+
+test('显示位置', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/notify/position')
+ await page.getByRole('button', { name: '默认bottom-right' }).click()
+ await page.getByRole('button', { name: 'top-right' }).click()
+ const bottom = page.locator('.bottom-right')
+ const bottomBox = await bottom.boundingBox()
+ const top = page.locator('.top-right')
+ const topBox = await top.boundingBox()
+ expect(topBox.y).toBeLessThan(bottomBox.y)
+})
diff --git a/examples/docs/resources/pc/demo/notify/showClose.spec.ts b/examples/docs/resources/pc/demo/notify/showClose.spec.ts
new file mode 100644
index 000000000..e30db5861
--- /dev/null
+++ b/examples/docs/resources/pc/demo/notify/showClose.spec.ts
@@ -0,0 +1,9 @@
+import { test, expect } from '@playwright/test'
+
+test('不显示关闭按钮', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/notify/showClose')
+ await page.getByRole('button', { name: '不显示关闭按钮' }).click()
+ const close = page.locator('.tiny-notify__close-zone')
+ await expect(close).not.toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/notify/showIcon.spec.ts b/examples/docs/resources/pc/demo/notify/showIcon.spec.ts
new file mode 100644
index 000000000..e546cf82a
--- /dev/null
+++ b/examples/docs/resources/pc/demo/notify/showIcon.spec.ts
@@ -0,0 +1,9 @@
+import { test, expect } from '@playwright/test'
+
+test('不显示类型图标', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/notify/showIcon')
+ await page.getByRole('button', { name: '不显示类型图标' }).click()
+ const icon = page.locator('.tiny-notify__icon-zone')
+ await expect(icon).not.toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/notify/statusIcon.spec.ts b/examples/docs/resources/pc/demo/notify/statusIcon.spec.ts
new file mode 100644
index 000000000..77f767695
--- /dev/null
+++ b/examples/docs/resources/pc/demo/notify/statusIcon.spec.ts
@@ -0,0 +1,9 @@
+import { test, expect } from '@playwright/test'
+
+test('自定义类型图标', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/notify/statusIcon')
+ await page.getByRole('button', { name: '自定义类型图标' }).click()
+ const close = page.locator('.tiny-notify__icon-status')
+ await expect(close).toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/notify/title.spec.ts b/examples/docs/resources/pc/demo/notify/title.spec.ts
new file mode 100644
index 000000000..cbe7f1e9b
--- /dev/null
+++ b/examples/docs/resources/pc/demo/notify/title.spec.ts
@@ -0,0 +1,9 @@
+import { test, expect } from '@playwright/test'
+
+test('标题', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/notify/title')
+ await page.getByRole('button', { name: '自定义标题' }).click()
+ const title = page.locator('.tiny-notify__title')
+ await expect(title).toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/notify/type.spec.ts b/examples/docs/resources/pc/demo/notify/type.spec.ts
new file mode 100644
index 000000000..b7061fa08
--- /dev/null
+++ b/examples/docs/resources/pc/demo/notify/type.spec.ts
@@ -0,0 +1,21 @@
+import { test, expect } from '@playwright/test'
+
+test('消息类型', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/notify/type')
+ await page.getByRole('button', { name: 'info类型' }).click()
+ const info = page.locator('.tiny-notify--info')
+ await expect(info).toBeVisible()
+
+ await page.getByRole('button', { name: 'success类型' }).click()
+ const success = page.locator('.tiny-notify--success')
+ await expect(success).toBeVisible()
+
+ await page.getByRole('button', { name: 'error类型' }).click()
+ const error = page.locator('.tiny-notify--error')
+ await expect(error).toBeVisible()
+
+ await page.getByRole('button', { name: 'warning类型' }).click()
+ const warning = page.locator('.tiny-notify--warning')
+ await expect(warning).toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/notify/verticalOffset.spec.ts b/examples/docs/resources/pc/demo/notify/verticalOffset.spec.ts
new file mode 100644
index 000000000..4c297aaac
--- /dev/null
+++ b/examples/docs/resources/pc/demo/notify/verticalOffset.spec.ts
@@ -0,0 +1,10 @@
+import { test, expect } from '@playwright/test'
+
+test('垂直方向偏离距离', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/notify/verticalOffset')
+ await page.getByRole('button', { name: '弹出提示框' }).click()
+ const notify = page.locator('.tiny-notify')
+ const offset = await notify.getAttribute('verticalOffset')
+ await expect(offset).toEqual('100')
+})
diff --git a/examples/docs/resources/pc/demo/numeric/about-step.spec.ts b/examples/docs/resources/pc/demo/numeric/about-step.spec.ts
new file mode 100644
index 000000000..edd01c15b
--- /dev/null
+++ b/examples/docs/resources/pc/demo/numeric/about-step.spec.ts
@@ -0,0 +1,18 @@
+import { test, expect } from '@playwright/test'
+
+test('步长', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/numeric/about-step')
+
+ const input = page.getByRole('spinbutton')
+ const increaseBtn = page.locator('#preview .tiny-numeric__increase')
+ const decreaseBtn = page.locator('#preview .tiny-numeric__decrease')
+ const value = Number(await input.inputValue())
+ const step = 2
+ await decreaseBtn.click()
+ const decreasedVal = Number(await input.inputValue())
+ expect(value).toEqual(decreasedVal + step)
+ await increaseBtn.click()
+ const increasedVal = Number(await input.inputValue())
+ expect(decreasedVal).toEqual(increasedVal - step)
+})
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/numeric/allow-empty.spec.ts b/examples/docs/resources/pc/demo/numeric/allow-empty.spec.ts
new file mode 100644
index 000000000..b329d3d1a
--- /dev/null
+++ b/examples/docs/resources/pc/demo/numeric/allow-empty.spec.ts
@@ -0,0 +1,13 @@
+import { test, expect } from '@playwright/test'
+
+test('可清空特性', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/numeric/allow-empty')
+
+ const input = page.getByRole('spinbutton')
+ await input.click()
+ await input.press('Backspace')
+ await page.locator('.rel').click()
+ const value = await input.inputValue()
+ expect(value).toEqual('')
+})
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/numeric/basic-usage.spec.ts b/examples/docs/resources/pc/demo/numeric/basic-usage.spec.ts
new file mode 100644
index 000000000..abb2aa082
--- /dev/null
+++ b/examples/docs/resources/pc/demo/numeric/basic-usage.spec.ts
@@ -0,0 +1,22 @@
+import { test, expect } from '@playwright/test'
+
+test('基本用法', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/numeric/basic-usage')
+
+ const input = page.getByRole('spinbutton')
+ const increaseBtn = page.locator('#preview .tiny-numeric__increase')
+ const decreaseBtn = page.locator('#preview .tiny-numeric__decrease')
+ const value = Number(await input.inputValue())
+ await increaseBtn.click()
+ const increasedVal = Number(await input.inputValue())
+ expect(value).toEqual(increasedVal - 1)
+
+ await decreaseBtn.click()
+ const decreasedVal = Number(await input.inputValue())
+ expect(decreasedVal).toEqual(increasedVal - 1)
+
+ await input.fill('10001')
+ const currentVal = await input.inputValue()
+ expect(currentVal).toEqual('10001')
+})
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/numeric/blur-event.spec.ts b/examples/docs/resources/pc/demo/numeric/blur-event.spec.ts
new file mode 100644
index 000000000..8f4ecf91a
--- /dev/null
+++ b/examples/docs/resources/pc/demo/numeric/blur-event.spec.ts
@@ -0,0 +1,11 @@
+import { test, expect } from '@playwright/test'
+
+test('失焦事件', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/numeric/blur-event')
+
+ const numeric = page.getByRole('spinbutton')
+ await numeric.focus()
+ await numeric.blur()
+ await expect(page.getByText('失焦事件', { exact: true })).toBeVisible()
+})
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/numeric/calculate-according-to-num-of-goods.spec.ts b/examples/docs/resources/pc/demo/numeric/calculate-according-to-num-of-goods.spec.ts
new file mode 100644
index 000000000..7a2972868
--- /dev/null
+++ b/examples/docs/resources/pc/demo/numeric/calculate-according-to-num-of-goods.spec.ts
@@ -0,0 +1,13 @@
+import { test, expect } from '@playwright/test'
+
+test('根据商品数量自动计算价格', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/numeric/calculate-according-to-num-of-goods')
+
+ const numeric = page.getByPlaceholder('请输入商品数量')
+ const totalTxt = page.locator('#preview .content ~div ~div')
+ await numeric.click()
+ await numeric.fill('10')
+ await numeric.blur()
+ await expect(totalTxt).toContainText('100')
+})
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/numeric/change-event.spec.ts b/examples/docs/resources/pc/demo/numeric/change-event.spec.ts
new file mode 100644
index 000000000..2b93da944
--- /dev/null
+++ b/examples/docs/resources/pc/demo/numeric/change-event.spec.ts
@@ -0,0 +1,10 @@
+import { test, expect } from '@playwright/test'
+
+test('值改变事件', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/numeric/change-event')
+
+ const increaseBtn = page.locator('.tiny-numeric__increase')
+ await increaseBtn.click()
+ await expect(page.getByText('新值：2，旧值：1')).toBeVisible()
+})
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/numeric/controls-position.spec.ts b/examples/docs/resources/pc/demo/numeric/controls-position.spec.ts
new file mode 100644
index 000000000..62a3e35ee
--- /dev/null
+++ b/examples/docs/resources/pc/demo/numeric/controls-position.spec.ts
@@ -0,0 +1,16 @@
+import { test, expect } from '@playwright/test'
+
+test('控制按钮设置在右侧显示', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/numeric/controls-position')
+
+ const numeric = page.locator('#preview .tiny-numeric')
+ const decreaseBtn = numeric.locator('.tiny-numeric__decrease')
+ const numericBox = await numeric.boundingBox()
+ const decreaseBtnBox = await decreaseBtn.boundingBox()
+ await expect(numeric).toHaveClass(/is-controls-right/)
+ // 判断按钮是否位于右侧
+ expect(numericBox.x).toBeLessThan(decreaseBtnBox.x)
+ await decreaseBtn.click()
+ await numeric.locator('.tiny-numeric__increase').click()
+})
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/numeric/controls.spec.ts b/examples/docs/resources/pc/demo/numeric/controls.spec.ts
new file mode 100644
index 000000000..625bc8800
--- /dev/null
+++ b/examples/docs/resources/pc/demo/numeric/controls.spec.ts
@@ -0,0 +1,29 @@
+import { test, expect } from '@playwright/test'
+
+test.describe('属性设置', () => {
+ test('控制按钮的显示与隐藏', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/numeric/controls')
+
+ const numeric = page.locator('#preview .tiny-numeric')
+ await expect(numeric).toHaveClass(/is-without-controls/)
+ await expect(numeric.locator('.tiny-numeric__decrease')).not.toBeVisible()
+ await expect(numeric.locator('.tiny-numeric__increase')).not.toBeVisible()
+ })
+
+ test('关联文字', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/numeric/controls')
+
+ const numericInput = page.locator('#preview .tiny-numeric .tiny-numeric__input-inner')
+ await expect(numericInput).toHaveAttribute('aria-label', '关联文字')
+ })
+
+ test('name属性', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/numeric/controls')
+
+ const numericInput = page.locator('#preview .tiny-numeric .tiny-numeric__input-inner')
+ await expect(numericInput).toHaveAttribute('name', 'name')
+ })
+})
diff --git a/examples/docs/resources/pc/demo/numeric/dynamic-disabled.spec.ts b/examples/docs/resources/pc/demo/numeric/dynamic-disabled.spec.ts
new file mode 100644
index 000000000..ac6a9b9ac
--- /dev/null
+++ b/examples/docs/resources/pc/demo/numeric/dynamic-disabled.spec.ts
@@ -0,0 +1,11 @@
+import { test, expect } from '@playwright/test'
+
+test('禁用', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/numeric/dynamic-disabled')
+
+ const numeric = page.locator('#preview .tiny-numeric')
+ const numericInput = numeric.locator('.tiny-numeric__input-inner')
+ await expect(numeric).toHaveClass(/is-disabled/)
+ await expect(numericInput).toBeDisabled()
+})
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/numeric/focus-event.spec.ts b/examples/docs/resources/pc/demo/numeric/focus-event.spec.ts
new file mode 100644
index 000000000..064f79aab
--- /dev/null
+++ b/examples/docs/resources/pc/demo/numeric/focus-event.spec.ts
@@ -0,0 +1,10 @@
+import { test, expect } from '@playwright/test'
+
+test('聚焦事件', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/numeric/focus-event')
+
+ const numeric = page.getByRole('spinbutton')
+ await numeric.focus()
+ await expect(page.getByText('focus 事件', { exact: true })).toBeVisible()
+})
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/numeric/max-min.spec.ts b/examples/docs/resources/pc/demo/numeric/max-min.spec.ts
new file mode 100644
index 000000000..4ae096b67
--- /dev/null
+++ b/examples/docs/resources/pc/demo/numeric/max-min.spec.ts
@@ -0,0 +1,18 @@
+import { test, expect } from '@playwright/test'
+
+test('最值与数值循环', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/numeric/max-min')
+
+ const input = page.getByRole('spinbutton')
+ const increaseBtn = page.locator('#preview .tiny-numeric__increase')
+ const decreaseBtn = page.locator('#preview .tiny-numeric__decrease')
+ const min = 0
+ const max = 10
+ await decreaseBtn.click()
+ const decreasedVal = Number(await input.inputValue())
+ expect(decreasedVal).toEqual(max)
+ await increaseBtn.click()
+ const increasedVal = Number(await input.inputValue())
+ expect(increasedVal).toEqual(min)
+})
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/numeric/mouse-wheel.spec.ts b/examples/docs/resources/pc/demo/numeric/mouse-wheel.spec.ts
new file mode 100644
index 000000000..d50f35329
--- /dev/null
+++ b/examples/docs/resources/pc/demo/numeric/mouse-wheel.spec.ts
@@ -0,0 +1,13 @@
+import { test, expect } from '@playwright/test'
+
+test('鼠标滚轮事件', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/numeric/mouse-wheel')
+
+ const numeric = page.getByRole('spinbutton')
+ const initVal = Number(await numeric.inputValue())
+ await numeric.click()
+ await page.mouse.wheel(0, -100)
+ const currentVal = Number(await numeric.inputValue())
+ expect(currentVal).toBeLessThan(initVal)
+})
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/numeric/numeric-size.spec.ts b/examples/docs/resources/pc/demo/numeric/numeric-size.spec.ts
new file mode 100644
index 000000000..aae0680f1
--- /dev/null
+++ b/examples/docs/resources/pc/demo/numeric/numeric-size.spec.ts
@@ -0,0 +1,27 @@
+import { test, expect } from '@playwright/test'
+
+test('尺寸', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/numeric/numeric-size')
+
+ // large尺寸
+ const largeNumeric = page.locator('#preview .tiny-numeric').first()
+ await expect(largeNumeric).toHaveClass(/tiny-numeric--medium/)
+ await largeNumeric.getByRole('spinbutton').fill('123')
+ await largeNumeric.locator('.tiny-numeric__decrease').click()
+ await largeNumeric.locator('.tiny-numeric__increase').click()
+
+ // small尺寸
+ const smallNumeric = page.locator('#preview .tiny-numeric').nth(1)
+ await expect(smallNumeric).toHaveClass(/tiny-numeric--small/)
+ await smallNumeric.getByRole('spinbutton').fill('111')
+ await smallNumeric.locator('.tiny-numeric__decrease').click()
+ await smallNumeric.locator('.tiny-numeric__increase').click()
+
+ // mini尺寸
+ const miniNumeric = page.locator('#preview .tiny-numeric').nth(2)
+ await expect(miniNumeric).toHaveClass(/tiny-numeric--mini/)
+ await miniNumeric.getByRole('spinbutton').fill('100')
+ await miniNumeric.locator('.tiny-numeric__decrease').click()
+ await miniNumeric.locator('.tiny-numeric__increase').click()
+})
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/numeric/precision.spec.ts b/examples/docs/resources/pc/demo/numeric/precision.spec.ts
new file mode 100644
index 000000000..801a136c2
--- /dev/null
+++ b/examples/docs/resources/pc/demo/numeric/precision.spec.ts
@@ -0,0 +1,22 @@
+import { test, expect } from '@playwright/test'
+
+test('数值精度', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/numeric/precision')
+
+ const numericInput = page.getByRole('spinbutton')
+ await numericInput.fill('2.2222')
+ await numericInput.blur()
+ let actualValue = await numericInput.inputValue()
+ expect(actualValue).toEqual('2.22')
+
+ await numericInput.fill('8.88888')
+ await numericInput.blur()
+ actualValue = await numericInput.inputValue()
+ expect(actualValue).toEqual('8.89')
+
+ await numericInput.fill('6.66')
+ await numericInput.blur()
+ actualValue = await numericInput.inputValue()
+ expect(actualValue).toEqual('6.66')
+})
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/pager/basic-usage.spec.js b/examples/docs/resources/pc/demo/pager/basic-usage.spec.js
index 747aad5be..d1ba5c62a 100644
--- a/examples/docs/resources/pc/demo/pager/basic-usage.spec.js
+++ b/examples/docs/resources/pc/demo/pager/basic-usage.spec.js
@@ -1,10 +1,46 @@
-import { test, expect } from '@playwright/test';
+import { test, expect } from '@playwright/test'
-test('test', async ({ page }) => {
- await page.goto('http://localhost:7130/pc/pager/basic-usage');
- await page.getByText('基本用法').nth(1).click();
- await page.getByText('2').nth(1).click();
- await page.getByText('5').first().click();
- await expect(page.getByText('5').first()).toHaveAttribute('class', 'is-active')
- await expect(page.locator('//*[@id="preview"]/div[2]/div[2]/div[1]/button[2]')).toBeDisabled
-});
\ No newline at end of file
+test('测试分页基本用法', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/pager/basic-usage')
+
+ const preview = page.locator('#preview')
+ const pager = preview.locator('.tiny-pager')
+ const getPrev = (parent) => parent.locator('.tiny-pager__btn-prev')
+ const getNext = (parent) => parent.locator('.tiny-pager__btn-next')
+ const isActive = /is-active/
+
+ // 第一个分页组件
+ const firstPrev = getPrev(pager.first())
+ const firstNext = getNext(pager.first())
+ const firstPager = pager.first()
+ await expect(firstPager.locator('li').getByText('1')).toHaveClass(isActive)
+ await expect(firstPrev).toBeDisabled()
+ await expect(firstNext).not.toBeDisabled()
+ await firstPager.locator('li').getByText('5').click()
+ await expect(firstPager.locator('li').getByText('5')).toHaveClass(isActive)
+ await expect(firstPrev).not.toBeDisabled()
+ await expect(firstNext).toBeDisabled()
+ await firstPrev.click()
+ await expect(firstPager.locator('li').getByText('4')).toHaveClass(isActive)
+ await expect(firstPrev).not.toBeDisabled()
+ await expect(firstNext).not.toBeDisabled()
+
+ // 第二个分页组件
+ const secondPrev = getPrev(pager.nth(1))
+ const secondNext = getNext(pager.nth(1))
+ const secondPager = pager.nth(1)
+ await expect(secondPager.locator('li').first()).toHaveClass(isActive)
+ await expect(secondPager.locator('li').getByText('7')).not.toBeVisible()
+ await expect(secondPrev).toBeDisabled()
+ await expect(secondNext).not.toBeDisabled()
+ await secondPager.locator('li').getByText('10').click()
+ await expect(secondPager.locator('li').getByText('10')).toHaveClass(isActive)
+ await expect(secondPager.locator('li').getByText('7')).toBeVisible()
+ await expect(secondPrev).not.toBeDisabled()
+ await expect(secondNext).toBeDisabled()
+ await secondPrev.click()
+ await expect(secondPager.locator('li').getByText('9')).toHaveClass(isActive)
+ await expect(secondPrev).not.toBeDisabled()
+ await expect(secondNext).not.toBeDisabled()
+})
diff --git a/examples/docs/resources/pc/demo/pager/before-page-change.spec.js b/examples/docs/resources/pc/demo/pager/before-page-change.spec.js
index 68a317787..5a3314742 100644
--- a/examples/docs/resources/pc/demo/pager/before-page-change.spec.js
+++ b/examples/docs/resources/pc/demo/pager/before-page-change.spec.js
@@ -1,18 +1,37 @@
-import { test, expect } from '@playwright/test';
+import { test, expect } from '@playwright/test'
-test('test', async ({ page }) => {
- await page.goto('http://localhost:7130/pc/pager/before-page-change');
- await page.getByText('分页事件before-page-change').nth(1).click();
- await page.getByRole('textbox').nth(2).click();
- await page.getByRole('textbox').nth(2).fill('4');
- await page.getByRole('button', { name: '前往' }).click();
- await page.getByRole('button', { name: '确认' }).click();
- await page.getByRole('textbox').nth(2).click();
- await page.getByRole('textbox').nth(2).fill('9');
- await page.getByRole('button', { name: '前往' }).click();
- await page.getByRole('button', { name: '确认' }).click();
- await page.getByRole('textbox').nth(2).click();
- await page.getByRole('textbox').nth(2).fill('5');
- await page.getByRole('button', { name: '前往' }).click();
- await page.getByRole('button', { name: '取消' }).click();
-});
\ No newline at end of file
+test('测试切换分页前时间', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/pager/before-page-change')
+
+ const preview = page.locator('#preview')
+ const pager = preview.locator('.tiny-pager')
+ const prev = pager.locator('.tiny-pager__btn-prev')
+ const next = pager.locator('.tiny-pager__btn-next')
+ const tipModal = page.locator('.tiny-modal__box').filter({ hasText: '消息提示' })
+ const confirmBtn = tipModal.getByRole('button', { name: '确认' })
+
+ await pager.locator('li').getByText('6').click()
+ await expect(tipModal).toBeVisible()
+ await confirmBtn.click()
+ await expect(tipModal).not.toBeVisible()
+ await next.click()
+ await expect(tipModal).toBeVisible()
+ await confirmBtn.click()
+ await expect(tipModal).not.toBeVisible()
+ await prev.click()
+ await expect(tipModal).toBeVisible()
+ await confirmBtn.click()
+ await expect(tipModal).not.toBeVisible()
+ await pager.locator('.tiny-pager__popover').click()
+ await page.locator('.tiny-pager__selector').getByText('50').click()
+ await expect(tipModal).toBeVisible()
+ await confirmBtn.click()
+ await expect(tipModal).not.toBeVisible()
+ await pager.locator('.tiny-pager__goto input').fill('100')
+ await page.waitForTimeout(200)
+ await pager.locator('.tiny-pager__goto input').press('Enter')
+ await expect(tipModal).toBeVisible()
+ await confirmBtn.click()
+ await expect(tipModal).not.toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/pager/current-page.spec.js b/examples/docs/resources/pc/demo/pager/current-page.spec.js
index 5fbea3253..03929c58b 100644
--- a/examples/docs/resources/pc/demo/pager/current-page.spec.js
+++ b/examples/docs/resources/pc/demo/pager/current-page.spec.js
@@ -1,10 +1,25 @@
-import { test, expect } from '@playwright/test';
+import { test, expect } from '@playwright/test'
-test('test', async ({ page }) => {
- await page.goto('http://localhost:7130/pc/pager/current-page');
- await page.locator('div:nth-child(2) > .link-primary').click();
- await page.locator('#preview').getByText('1').click();
- await page.locator('#preview').getByText('5').click()
- await expect(page.locator('#preview').getByText('5')).toHaveText('5')
- await expect(page.locator('//*[@id="preview"]/div[2]/div[2]/button[2]')).toBeDisabled
-});
\ No newline at end of file
+test('测试设置当前页', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/pager/current-page')
+
+ const preview = page.locator('#preview')
+ const pager = preview.locator('.tiny-pager')
+ const getPrev = (parent) => parent.locator('.tiny-pager__btn-prev')
+ const getNext = (parent) => parent.locator('.tiny-pager__btn-next')
+ const isActive = /is-active/
+ const prev = getPrev(pager.first())
+ const next = getNext(pager.first())
+ await expect(pager.locator('li').getByText('2')).toHaveClass(isActive)
+ await expect(prev).not.toBeDisabled()
+ await expect(next).not.toBeDisabled()
+ await pager.locator('li').getByText('5').click()
+ await expect(pager.locator('li').getByText('5')).toHaveClass(isActive)
+ await expect(prev).not.toBeDisabled()
+ await expect(next).toBeDisabled()
+ await pager.locator('li').getByText('1').click()
+ await expect(pager.locator('li').getByText('1')).toHaveClass(isActive)
+ await expect(prev).toBeDisabled()
+ await expect(next).not.toBeDisabled()
+})
diff --git a/examples/docs/resources/pc/demo/pager/custom-layout.spec.js b/examples/docs/resources/pc/demo/pager/custom-layout.spec.js
index 944f3d5e9..c05902e3d 100644
--- a/examples/docs/resources/pc/demo/pager/custom-layout.spec.js
+++ b/examples/docs/resources/pc/demo/pager/custom-layout.spec.js
@@ -1,16 +1,27 @@
-import { test, expect } from '@playwright/test';
+import { test, expect } from '@playwright/test'
-test('test', async ({ page }) => {
- await page.goto('http://localhost:7130/pc/pager/custom-layout');
- await page.getByText('自定义分页布局').nth(1).click();
- await page.locator('#preview svg').nth(1).click();
- await page.getByRole('listitem', { name: '20' }).click();
- await page.locator('#preview').getByText('50').click();
- await expect(page.locator('#preview').getByText('50')).toHaveAttribute('class', 'is-active');
- await expect(page.locator('//*[@id="preview"]/div[2]/div[2]/button[2]')).toBeDisabled;
- await page.locator('#preview svg').nth(1).click();
- await page.getByRole('listitem', { name: '50' }).click();
- await page.locator('#preview').getByText('20').click();
- await expect(page.locator('#preview').getByText('20')).toHaveAttribute('class', 'is-active')
- await expect(page.locator('//*[@id="preview"]/div[2]/div[2]/button[2]')).toBeDisabled;
-});
\ No newline at end of file
+test('测试自定义分页布局', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/pager/custom-layout')
+
+ const preview = page.locator('#preview')
+ const pager = preview.locator('.tiny-pager')
+ const prev = pager.locator('.tiny-pager__btn-prev')
+ const next = pager.locator('.tiny-pager__btn-next')
+ const slot = pager.getByText('我是插槽')
+
+ await expect(slot).toBeVisible()
+ const pageSizeBox = await pager.locator('.tiny-pager__input').boundingBox()
+ const slotBox = await slot.boundingBox()
+ expect(pageSizeBox.x).toBeLessThan(slotBox.x)
+ const prevBox = await prev.boundingBox()
+ expect(slotBox.x).toBeLessThan(prevBox.x)
+ const pagesBox = await pager.locator('.tiny-pager__pages').boundingBox()
+ expect(prevBox.x).toBeLessThan(pagesBox.x)
+ const nextBox = await next.boundingBox()
+ expect(pagesBox.x).toBeLessThan(nextBox.x)
+ const gotoBox = await pager.locator('.tiny-pager__goto').boundingBox()
+ expect(nextBox.x).toBeLessThan(gotoBox.x)
+ const totalBox = await pager.locator('.tiny-pager__total').boundingBox()
+ expect(gotoBox.x).toBeLessThan(totalBox.x)
+})
diff --git a/examples/docs/resources/pc/demo/pager/custom-next-prev-text.spec.js b/examples/docs/resources/pc/demo/pager/custom-next-prev-text.spec.js
index 5b566f1c3..ae77dbd26 100644
--- a/examples/docs/resources/pc/demo/pager/custom-next-prev-text.spec.js
+++ b/examples/docs/resources/pc/demo/pager/custom-next-prev-text.spec.js
@@ -1,11 +1,14 @@
-import { test, expect } from '@playwright/test';
+import { test, expect } from '@playwright/test'
-test('test', async ({ page }) => {
- await page.goto('http://localhost:7130/pc/pager/hide-on-single-page');
- await page.getByText('自定义上下页按钮文本').click();
- await page.locator('#preview').getByText('2').click();
- await page.getByRole('button', { name: '上一页' }).click();
- await expect(page.getByRole('button', { name: '上一页' })).toHaveText('上一页')
- await page.getByRole('button', { name: '下一页' }).click();
- await expect(page.getByRole('button', { name: '下一页' })).toHaveText('下一页')
-});
\ No newline at end of file
+test('自定义上下页按钮文本', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/pager/custom-next-prev-text')
+
+ const preview = page.locator('#preview')
+ const pager = preview.locator('.tiny-pager')
+ const prev = pager.locator('.tiny-pager__btn-prev')
+ const next = pager.locator('.tiny-pager__btn-next')
+
+ await expect(prev).toHaveText('上一页')
+ await expect(next).toHaveText('下一页')
+})
diff --git a/examples/docs/resources/pc/demo/pager/hide-on-single-page.spec.js b/examples/docs/resources/pc/demo/pager/hide-on-single-page.spec.js
index 3bf2e42cc..aeb86812c 100644
--- a/examples/docs/resources/pc/demo/pager/hide-on-single-page.spec.js
+++ b/examples/docs/resources/pc/demo/pager/hide-on-single-page.spec.js
@@ -1,10 +1,17 @@
-import { test, expect } from '@playwright/test';
+import { test, expect } from '@playwright/test'
-test('test', async ({ page }) => {
- await page.goto('http://localhost:7130/pc/pager/hide-on-single-page');
- await page.getByText('只有一页时隐藏分页').nth(2).click();
- await page.locator('#preview').getByText('1').click();
- await expect(page.locator('#preview').getByText('1')).toHaveAttribute('class', 'is-active')
- await page.locator('#preview span').nth(1).click();
- await expect(page.locator('#preview').getByText('1')).toBeHidden(0);
-});
\ No newline at end of file
+test('只有一页时隐藏分页', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/pager/hide-on-single-page')
+
+ const preview = page.locator('#preview')
+ const pager = preview.locator('.tiny-pager')
+ const prev = pager.locator('.tiny-pager__btn-prev')
+ const next = pager.locator('.tiny-pager__btn-next')
+
+ await expect(prev).toBeDisabled()
+ await expect(next).toBeDisabled()
+ await expect(pager).toBeVisible()
+ await preview.locator('.tiny-switch').click()
+ await expect(pager).not.toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/pager/page-append-to-body.spec.js b/examples/docs/resources/pc/demo/pager/page-append-to-body.spec.js
index b811fe154..4b1f597fd 100644
--- a/examples/docs/resources/pc/demo/pager/page-append-to-body.spec.js
+++ b/examples/docs/resources/pc/demo/pager/page-append-to-body.spec.js
@@ -1,8 +1,15 @@
-import { test, expect } from '@playwright/test';
+import { test, expect } from '@playwright/test'
-test('test', async ({ page }) => {
- await page.goto('http://localhost:7130/pc/pager/popper-append-to-body');
- await page.getByText('分页下拉框显示位置').nth(1).click();
- await page.locator('span').filter({ hasText: '51020304050100' }).locator('svg').click();
- await page.getByRole('listitem', { name: '5' }).first().click();
-});
\ No newline at end of file
+test('分页下拉框显示位置', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/pager/popper-append-to-body')
+
+ const preview = page.locator('#preview')
+ const pager = preview.locator('.tiny-pager')
+ const sizeSelect = pager.locator('.tiny-pager__selector')
+
+ await pager.locator('.tiny-pager__input').click()
+ await expect(sizeSelect).toBeVisible()
+ await sizeSelect.getByText('100').click()
+ await expect(pager.locator('.tiny-pager__pages')).toHaveCount(1)
+})
diff --git a/examples/docs/resources/pc/demo/pager/page-count.spec.js b/examples/docs/resources/pc/demo/pager/page-count.spec.js
index af83953c8..801796bef 100644
--- a/examples/docs/resources/pc/demo/pager/page-count.spec.js
+++ b/examples/docs/resources/pc/demo/pager/page-count.spec.js
@@ -1,9 +1,12 @@
-import { test, expect } from '@playwright/test';
+import { test, expect } from '@playwright/test'
-test('test', async ({ page }) => {
- await page.goto('http://localhost:7130/pc/pager/pager-count');
- await page.getByText('页码按钮数量').nth(1).click();
- await page.locator('.is-active').click();
- await page.getByText('14').click();
- await page.locator('#preview').getByText('20').click();
-});
\ No newline at end of file
+test('页码按钮数量', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/pager/page-count')
+
+ const preview = page.locator('#preview')
+ const pager = preview.locator('.tiny-pager')
+ const pageItem = pager.locator('.tiny-pager__pages li')
+
+ await expect(pageItem.last()).toHaveText('200')
+})
diff --git a/examples/docs/resources/pc/demo/pager/page-size.spec.js b/examples/docs/resources/pc/demo/pager/page-size.spec.js
index 04a3437fb..44ac899b4 100644
--- a/examples/docs/resources/pc/demo/pager/page-size.spec.js
+++ b/examples/docs/resources/pc/demo/pager/page-size.spec.js
@@ -1,14 +1,22 @@
-import { test, expect } from '@playwright/test';
+import { test, expect } from '@playwright/test'
-test('test', async ({ page }) => {
- await page.goto('http://localhost:7130/pc/pager/pager-count');
- await page.getByText('每页显示数量').click();
- await page.getByRole('listitem').filter({ hasText: '10' }).click();
- await expect(page.getByRole('listitem').filter({ hasText: '10' })).toHaveAttribute('class', 'is-active');
- await expect(page.locator('//*[@id="preview"]/div[2]/div[2]/button[2]')).toBeDisabled
- await page.locator('span').filter({ hasText: '51020304050100' }).locator('path').click();
- await page.getByRole('listitem', { name: '10' }).first().click();
- await page.locator('#preview').getByText('5').click();
- await expect(page.locator('#preview').getByText('5')).toHaveAttribute('class', 'is-active')
- await expect(page.locator('//*[@id="preview"]/div[2]/div[2]/button[2]')).toBeDisabled
-});
\ No newline at end of file
+test('每页显示数量', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/pager/page-size')
+
+ const total = 50
+ const initPageSize = 5
+ const getPageCount = (pageSize) => String(Math.ceil(total / pageSize))
+ const preview = page.locator('#preview')
+ const pager = preview.locator('.tiny-pager')
+ const sizeChange = pager.locator('.tiny-pager__input')
+ const sizeSelect = page.locator('.tiny-pager__selector')
+ const pageItem = pager.locator('.tiny-pager__pages li')
+
+ await expect(pageItem.last()).toHaveText(getPageCount(initPageSize))
+ await sizeChange.click()
+ await sizeSelect.getByText('20').click()
+ await expect(pageItem.last()).toHaveText(getPageCount(20))
+ await sizeSelect.getByText('50').click()
+ await expect(pageItem.last()).toHaveText(getPageCount(50))
+})
diff --git a/examples/docs/resources/pc/demo/pager/pager-count.spec.js b/examples/docs/resources/pc/demo/pager/pager-count.spec.js
index 1e495aba0..33a48d8aa 100644
--- a/examples/docs/resources/pc/demo/pager/pager-count.spec.js
+++ b/examples/docs/resources/pc/demo/pager/pager-count.spec.js
@@ -1,9 +1,12 @@
-import { test, expect } from '@playwright/test';
+import { test, expect } from '@playwright/test'
-test('test', async ({ page }) => {
- await page.goto('http://localhost:7130/pc/pager/pager-mode');
- await page.getByText('总页数').nth(2).click();
- await page.getByText('200').click();
- await expect(page.getByText('200')).toHaveText('200')
- await expect(page.locator('button').nth(4)).toBeDisabled
-});
\ No newline at end of file
+test('页码按钮数量', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/pager/pager-count')
+
+ const preview = page.locator('#preview')
+ const pager = preview.locator('.tiny-pager')
+ const pageItem = pager.locator('.tiny-pager__pages li')
+
+ await expect(pageItem).toHaveCount(16)
+})
diff --git a/examples/docs/resources/pc/demo/pager/pager-disabled.spec.js b/examples/docs/resources/pc/demo/pager/pager-disabled.spec.js
new file mode 100644
index 000000000..79d40fc5d
--- /dev/null
+++ b/examples/docs/resources/pc/demo/pager/pager-disabled.spec.js
@@ -0,0 +1,19 @@
+import { test, expect } from '@playwright/test'
+
+test('测试禁用状态', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/pager/pager-disabled')
+
+ const preview = page.locator('#preview')
+ const pager = preview.locator('.tiny-pager').first()
+ const sizeChange = pager.locator('.tiny-pager__input > input')
+ const pageItem = pager.locator('.tiny-pager__pages li')
+ const prev = pager.locator('.tiny-pager__btn-prev')
+ const next = pager.locator('.tiny-pager__btn-next')
+
+ await expect(sizeChange).toBeDisabled()
+ await expect(prev).toBeDisabled()
+ await expect(next).toBeDisabled()
+ await expect(pageItem.first()).toHaveCSS('cursor', 'not-allowed')
+ await expect(pageItem.last()).toHaveCSS('cursor', 'not-allowed')
+})
diff --git a/examples/docs/resources/pc/demo/pager/pager-events-current-change.spec.js b/examples/docs/resources/pc/demo/pager/pager-events-current-change.spec.js
index 7697356dc..c2d1ef362 100644
--- a/examples/docs/resources/pc/demo/pager/pager-events-current-change.spec.js
+++ b/examples/docs/resources/pc/demo/pager/pager-events-current-change.spec.js
@@ -1,8 +1,17 @@
-import { test, expect } from '@playwright/test';
+import { test, expect } from '@playwright/test'
-test('test', async ({ page }) => {
- await page.goto('http://localhost:7130/pc/pager/pager-events');
- await page.locator('.f12 > div:nth-child(9)').click();
- await page.getByText('6').click();
- await page.locator('div').filter({ hasText: 'current-change 事件，当前页: 6' }).nth(1).click();
-});
\ No newline at end of file
+test('页码发生变化时触发事件', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/pager/pager-events-current-change')
+
+ const preview = page.locator('#preview')
+ const pager = preview.locator('.tiny-pager')
+ const pageItem = pager.locator('.tiny-pager__pages li')
+ const modalBox = page.locator('.tiny-modal__box')
+
+ await pageItem.last().click()
+ await expect(modalBox.filter({ hasText: 'current-change 事件，当前页: 10' })).toBeVisible()
+ await pageItem.first().click()
+ // 需匹配以1结尾
+ await expect(modalBox.filter({ hasText: /current-change 事件，当前页: 1$/ })).toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/pager/pager-events-nextclick.spec.js b/examples/docs/resources/pc/demo/pager/pager-events-nextclick.spec.js
index c4400b8bc..a5bde36ac 100644
--- a/examples/docs/resources/pc/demo/pager/pager-events-nextclick.spec.js
+++ b/examples/docs/resources/pc/demo/pager/pager-events-nextclick.spec.js
@@ -1,9 +1,20 @@
-import { test, expect } from '@playwright/test';
+import { test, expect } from '@playwright/test'
-test('test', async ({ page }) => {
- await page.goto('http://localhost:7130/pc/pager/pager-events-nextclick');
- await page.locator('.f12 > div:nth-child(11)').click();
- await page.getByRole('listitem').filter({ hasText: '3' }).click();
- await page.locator('button').nth(4).click();
- await page.getByText('next-click 事件，当前页: 4').click();
-});
\ No newline at end of file
+test('分页事件next-click', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/pager/pager-events-nextclick')
+
+ const preview = page.locator('#preview')
+ const pager = preview.locator('.tiny-pager')
+ const prev = pager.locator('.tiny-pager__btn-prev')
+ const next = pager.locator('.tiny-pager__btn-next')
+ const pageItem = pager.locator('.tiny-pager__pages li')
+ const modalBox = page.locator('.tiny-modal__box').filter({ hasText: 'next-click 事件' })
+
+ await pageItem.last().click()
+ await expect(modalBox).not.toBeVisible()
+ await prev.click()
+ await expect(modalBox).not.toBeVisible()
+ await next.click()
+ await expect(modalBox).toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/pager/pager-events-prev-click.spec.js b/examples/docs/resources/pc/demo/pager/pager-events-prev-click.spec.js
index 2ad42c61a..6b431e88c 100644
--- a/examples/docs/resources/pc/demo/pager/pager-events-prev-click.spec.js
+++ b/examples/docs/resources/pc/demo/pager/pager-events-prev-click.spec.js
@@ -1,9 +1,20 @@
-import { test, expect } from '@playwright/test';
+import { test, expect } from '@playwright/test'
-test('test', async ({ page }) => {
- await page.goto('http://localhost:7130/pc/pager/pager-events-prev-click');
- await page.getByText('分页事件prev-click').nth(1).click();
- await page.getByText('6').click();
- await page.locator('button').nth(3).click();
- await page.getByText('prev-click 事件，当前页: 5').click();
-});
\ No newline at end of file
+test('分页事件prev-click', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/pager/pager-events-prev-click')
+
+ const preview = page.locator('#preview')
+ const pager = preview.locator('.tiny-pager')
+ const prev = pager.locator('.tiny-pager__btn-prev')
+ const next = pager.locator('.tiny-pager__btn-next')
+ const pageItem = pager.locator('.tiny-pager__pages li')
+ const modalBox = page.locator('.tiny-modal__box').filter({ hasText: 'prev-click 事件' })
+
+ await next.click()
+ await expect(modalBox).not.toBeVisible()
+ await pageItem.last().click()
+ await expect(modalBox).not.toBeVisible()
+ await prev.click()
+ await expect(modalBox).toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/pager/pager-events.spec.js b/examples/docs/resources/pc/demo/pager/pager-events.spec.js
index 666f7bcb9..64c0621d1 100644
--- a/examples/docs/resources/pc/demo/pager/pager-events.spec.js
+++ b/examples/docs/resources/pc/demo/pager/pager-events.spec.js
@@ -1,9 +1,19 @@
-import { test, expect } from '@playwright/test';
+import { test, expect } from '@playwright/test'
-test('test', async ({ page }) => {
- await page.goto('http://localhost:7130/pc/pager/pager-events');
- await page.getByText('分页事件size-change').nth(1).click();
- await page.locator('.tiny-pager__input-btn > .tiny-svg').click();
- await page.getByRole('listitem', { name: '30' }).click();
- await page.getByText('size-change 事件，每页 30 条').click();
-});
\ No newline at end of file
+test('分页事件size-change', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/pager/pager-events')
+
+ const preview = page.locator('#preview')
+ const pager = preview.locator('.tiny-pager')
+ const sizeSelect = page.locator('.tiny-pager__selector')
+ const sizeChange = pager.locator('.tiny-pager__input')
+ const modalBox = page.locator('.tiny-modal__box')
+
+ await sizeChange.click()
+ await sizeSelect.getByText('50').click()
+ await expect(modalBox.filter({ hasText: 'size-change 事件，每页 50 条' })).toBeVisible()
+ await sizeChange.click()
+ await sizeSelect.getByText('100').click()
+ await expect(modalBox.filter({ hasText: 'size-change 事件，每页 100 条' })).toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/pager/pager-in-grid.spec.js b/examples/docs/resources/pc/demo/pager/pager-in-grid.spec.js
index 6ad384565..0e84a5c63 100644
--- a/examples/docs/resources/pc/demo/pager/pager-in-grid.spec.js
+++ b/examples/docs/resources/pc/demo/pager/pager-in-grid.spec.js
@@ -1,14 +1,16 @@
-import { test, expect } from '@playwright/test';
+import { test, expect } from '@playwright/test'
-test('test', async ({ page }) => {
- await page.goto('http://localhost:7130/pc/pager/custom-next-prev-text');
- await page.getByText('Grid 表格分页').click();
- await page.locator('span').filter({ hasText: '5102050' }).locator('svg').click();
- await page.getByRole('listitem', { name: '5' }).first().click();
- await page.getByRole('listitem').filter({ hasText: '4' }).click();
- await expect(page.locator('//*[@id="preview"]/div[2]/div[2]/div[2]/button[2]')).toBeDisabled
- await page.locator('.tiny-pager__input-btn > .tiny-svg > .st0').click();
- await page.getByRole('listitem', { name: '10' }).click();
- await page.getByRole('listitem').filter({ hasText: '2' }).click();
- await expect(page.locator('//*[@id="preview"]/div[2]/div[2]/div[2]/button[2]')).toBeDisabled
-});
\ No newline at end of file
+test('测试表格分页', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/pager/pager-in-grid')
+
+ const preview = page.locator('#preview')
+ const pager = preview.locator('.tiny-pager')
+ const next = pager.locator('.tiny-pager__btn-next')
+ const firstTableRow = preview.locator('.tiny-grid .tiny-grid-body__row').first()
+
+ await next.click()
+ await expect(firstTableRow).toHaveText(/WSX科技YX公司/)
+ await next.click()
+ await expect(firstTableRow).toHaveText(/TIG管理YX公司/)
+})
diff --git a/examples/docs/resources/pc/demo/pager/pager-mode-fixed.spec.js b/examples/docs/resources/pc/demo/pager/pager-mode-fixed.spec.js
index bbda2c219..3b40e4d58 100644
--- a/examples/docs/resources/pc/demo/pager/pager-mode-fixed.spec.js
+++ b/examples/docs/resources/pc/demo/pager/pager-mode-fixed.spec.js
@@ -1,11 +1,19 @@
-import { test, expect } from '@playwright/test';
+import { test, expect } from '@playwright/test'
-test('test', async ({ page }) => {
- await page.goto('http://localhost:7130/pc/pager/basic-usage');
- await page.getByText('fixed 模式').click();
- await page.locator('#preview').getByText('1').first().click();
- await expect(page.locator('#preview').getByText('1').first()).toHaveAttribute('class', 'is-active')
- await page.locator('#preview').getByText('10').click();
- await expect(page.locator('#preview').getByText('10')).toHaveAttribute('class', 'is-active')
- await expect(page.locator('//*[@id="preview"]/div[2]/div[2]/div/button[2]')).toBeDisabled
-});
\ No newline at end of file
+test('分页fixed模式', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/pager/pager-mode-fixed')
+
+ const preview = page.locator('#preview')
+ const pager = preview.locator('.tiny-pager')
+ const prev = pager.locator('.tiny-pager__btn-prev')
+ const next = pager.locator('.tiny-pager__btn-next')
+
+ // fixed 模式只有上一页、页码和下一页
+ await expect(prev).toBeVisible()
+ await expect(pager.locator('.tiny-pager__pages')).toBeVisible()
+ await expect(next).toBeVisible()
+ await expect(pager.locator('.tiny-pager__input')).not.toBeVisible()
+ await expect(pager.locator('.tiny-pager__goto')).not.toBeVisible()
+ await expect(pager.locator('.tiny-pager__total')).not.toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/pager/pager-mode-number.spec.js b/examples/docs/resources/pc/demo/pager/pager-mode-number.spec.js
index a95f44b85..d0aea7b94 100644
--- a/examples/docs/resources/pc/demo/pager/pager-mode-number.spec.js
+++ b/examples/docs/resources/pc/demo/pager/pager-mode-number.spec.js
@@ -1,8 +1,18 @@
-import { test, expect } from '@playwright/test';
+import { test, expect } from '@playwright/test'
-test('test', async ({ page }) => {
- await page.goto('http://localhost:7130/pc/pager/current-page');
- await page.getByText('number 模式').click();
- await page.getByRole('listitem').filter({ hasText: '2' }).click();
- await expect(page.getByRole('listitem').filter({ hasText: '2' })).toHaveText('2')
-});
\ No newline at end of file
+test('分页number模式', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/pager/pager-mode-number')
+
+ const preview = page.locator('#preview')
+ const pager = preview.locator('.tiny-pager')
+ const prev = pager.locator('.tiny-pager__btn-prev')
+ const next = pager.locator('.tiny-pager__btn-next')
+
+ await expect(prev).toBeVisible()
+ await expect(pager.locator('.tiny-pager__pages')).toBeVisible()
+ await expect(next).toBeVisible()
+ await expect(pager.locator('.tiny-pager__input')).toBeVisible()
+ await expect(pager.locator('.tiny-pager__goto')).toBeVisible()
+ await expect(pager.locator('.tiny-pager__total')).toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/pager/pager-mode-simple.spec.js b/examples/docs/resources/pc/demo/pager/pager-mode-simple.spec.js
index ae9dcfc30..65cdccfd9 100644
--- a/examples/docs/resources/pc/demo/pager/pager-mode-simple.spec.js
+++ b/examples/docs/resources/pc/demo/pager/pager-mode-simple.spec.js
@@ -1,21 +1,18 @@
-import { test, expect } from '@playwright/test';
+import { test, expect } from '@playwright/test'
-test('test', async ({ page }) => {
- await page.goto('http://localhost:7130/pc/pager/pager-mode-simple');
- await page.getByText('simple 模式').nth(1).click();
- await page.locator('.tiny-pager__input-btn').click();
- await page.getByRole('listitem', { name: '10' }).first().click();
- await page.locator('#preview').getByRole('listitem').click();
- await page.locator('button').nth(4).click();
- await page.locator('button').nth(4).click();
- await page.locator('button').nth(4).click();
- await page.locator('button').nth(4).click();
- await page.locator('button').nth(4).click();
- await page.locator('button').nth(4).click();
- await page.locator('button').nth(4).click();
- await page.locator('button').nth(4).click();
- await page.locator('button').nth(4).click();
- await page.getByRole('listitem').filter({ hasText: '10' }).click();
- await expect(page.getByRole('listitem').filter({ hasText: '10' })).toHaveAttribute('class', 'is-active')
- await expect(page.locator('//*[@id="preview"]/div[2]/div[2]/div/button[2]')).toBeDisabled
-});
\ No newline at end of file
+test('分页simple模式', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/pager/pager-mode-simple')
+
+ const preview = page.locator('#preview')
+ const pager = preview.locator('.tiny-pager')
+ const prev = pager.locator('.tiny-pager__btn-prev')
+ const next = pager.locator('.tiny-pager__btn-next')
+
+ await expect(prev).toBeVisible()
+ await expect(pager.locator('.tiny-pager__pages')).toBeVisible()
+ await expect(next).toBeVisible()
+ await expect(pager.locator('.tiny-pager__input')).toBeVisible()
+ await expect(pager.locator('.tiny-pager__goto')).not.toBeVisible()
+ await expect(pager.locator('.tiny-pager__total')).toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/pager/pager-mode.spec.js b/examples/docs/resources/pc/demo/pager/pager-mode.spec.js
index e9c176a97..6a228104f 100644
--- a/examples/docs/resources/pc/demo/pager/pager-mode.spec.js
+++ b/examples/docs/resources/pc/demo/pager/pager-mode.spec.js
@@ -1,20 +1,18 @@
-import { test, expect } from '@playwright/test';
+import { test, expect } from '@playwright/test'
-test('test', async ({ page }) => {
- await page.goto('http://localhost:7130/pc/pager/pager-mode');
- await page.getByRole('textbox').nth(1).click();
- await page.locator('.tiny-pager__input-btn').click();
- await page.getByRole('textbox').nth(2).click();
- await page.getByRole('textbox').nth(2).fill('6');
- await expect(page.locator('//*[@id="preview"]/div[2]/div[2]/div/button[2]')).not.toBeDisabled
- await page.getByRole('button', { name: '前往' }).click();
- await page.getByRole('textbox').nth(2).click();
- await page.getByRole('textbox').nth(2).fill('10');
- await expect(page.locator('//*[@id="preview"]/div[2]/div[2]/div/button[2]')).not.toBeDisabled
- await page.getByRole('button', { name: '前往' }).click();
- await page.getByRole('textbox').nth(2).click();
- await page.getByRole('textbox').nth(2).press('ArrowRight');
- await page.getByRole('textbox').nth(2).fill('12');
- await page.getByRole('button', { name: '前往' }).click();
- await expect(page.locator('#preview').getByRole('button').nth(1)).toBeDisabled
-});
\ No newline at end of file
+test('分页complete模式', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/pager/pager-mode')
+
+ const preview = page.locator('#preview')
+ const pager = preview.locator('.tiny-pager')
+ const prev = pager.locator('.tiny-pager__btn-prev')
+ const next = pager.locator('.tiny-pager__btn-next')
+
+ await expect(prev).toBeVisible()
+ await expect(pager.locator('.tiny-pager__pages')).toBeVisible()
+ await expect(next).toBeVisible()
+ await expect(pager.locator('.tiny-pager__input')).toBeVisible()
+ await expect(pager.locator('.tiny-pager__goto')).toBeVisible()
+ await expect(pager.locator('.tiny-pager__total')).toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/pager/pager-size.spec.js b/examples/docs/resources/pc/demo/pager/pager-size.spec.js
new file mode 100644
index 000000000..c2806e13e
--- /dev/null
+++ b/examples/docs/resources/pc/demo/pager/pager-size.spec.js
@@ -0,0 +1,11 @@
+import { test, expect } from '@playwright/test'
+
+test('分页尺寸', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/pager/pager-size')
+
+ const preview = page.locator('#preview')
+ const pager = preview.locator('.tiny-pager.tiny-pager__number')
+
+ await expect(pager.nth(1)).toHaveClass(/tiny-pager--mini/)
+})
diff --git a/examples/docs/resources/pc/demo/pager/popper-class.spec.js b/examples/docs/resources/pc/demo/pager/popper-class.spec.js
index 34becc0f7..13b253f34 100644
--- a/examples/docs/resources/pc/demo/pager/popper-class.spec.js
+++ b/examples/docs/resources/pc/demo/pager/popper-class.spec.js
@@ -1,9 +1,14 @@
-import { test, expect } from '@playwright/test';
+import { test, expect } from '@playwright/test'
-test('test', async ({ page }) => {
- await page.goto('http://localhost:7130/pc/pager/popper-class');
- await page.getByText('自定义分页下拉框的类名').nth(2).click();
- await page.locator('#preview svg').nth(1).click();
- await page.getByRole('listitem', { name: '5' }).first().click();
- await expect(page.locator('//div[@role="tooltip"]')).toHaveClass(/custom-pager/)
-});
\ No newline at end of file
+test('自定义分页下拉框的类名', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/pager/popper-class')
+
+ const preview = page.locator('#preview')
+ const pager = preview.locator('.tiny-pager')
+ const sizeChange = pager.locator('.tiny-pager__input')
+ const sizeSelect = page.locator('.tiny-pager__selector')
+
+ await sizeChange.click()
+ await expect(sizeSelect).toHaveClass(/custom-pager/)
+})
diff --git a/examples/docs/resources/pc/demo/pop-upload/basic-usage.spec.ts b/examples/docs/resources/pc/demo/pop-upload/basic-usage.spec.ts
new file mode 100644
index 000000000..64123b593
--- /dev/null
+++ b/examples/docs/resources/pc/demo/pop-upload/basic-usage.spec.ts
@@ -0,0 +1,43 @@
+import { test, expect } from '@playwright/test'
+import exp from 'constants'
+
+test('PopUpload 基本用法', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/pop-upload/basic-usage')
+
+ const preview = page.locator('#preview')
+ const modalAppearBtn = preview.getByRole('button', { name: '选择文件' })
+ const modal = page.locator('.tiny-modal')
+ const selectFilesBtn = modal.getByRole('button', { name: '选择文件' })
+ const uploadsBtn = modal.getByRole('button', { name: '开始上传' })
+ const cancelBtn = modal.getByRole('button', { name: '取消' })
+ const lists = modal.locator('.tiny-popupload__dialog-table-item')
+ const deleteIcon = lists.locator('.delIcon')
+ const path = require('node:path')
+ const currentPath = path.resolve(__dirname, '测试.jpg')
+
+ // 点击选择文件按钮，上传弹窗弹出
+ await modalAppearBtn.click()
+ await expect(modal).toBeVisible()
+ await expect(selectFilesBtn).toBeVisible()
+
+ // 没有文件被选择时，开始上传按钮禁用
+ await expect(lists).toHaveCount(0)
+ await expect(uploadsBtn).toBeDisabled()
+
+ // 点击选择文件后，文件被选择，开始上传按钮启用
+ const [fileChooser] = await Promise.all([page.waitForEvent('filechooser'), selectFilesBtn.click()])
+ await fileChooser.setFiles(currentPath)
+ await expect(lists).toHaveCount(1)
+ await expect(uploadsBtn).not.toBeDisabled()
+
+ // 文件被选择后，点击垃圾桶图标删除文件
+ await expect(lists).toHaveCount(1)
+ await deleteIcon.click()
+ await expect(lists).toHaveCount(0)
+ await expect(uploadsBtn).toBeDisabled()
+
+ // 点击取消按钮，上传弹窗消失
+ await cancelBtn.click()
+ await expect(modal).not.toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/pop-upload/before-upload.spec.ts b/examples/docs/resources/pc/demo/pop-upload/before-upload.spec.ts
new file mode 100644
index 000000000..b66e8ecc3
--- /dev/null
+++ b/examples/docs/resources/pc/demo/pop-upload/before-upload.spec.ts
@@ -0,0 +1,25 @@
+import { test, expect } from '@playwright/test'
+
+test('PopUpload 阻止上传文件', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/pop-upload/before-upload')
+
+ const preview = page.locator('#preview')
+ const modalAppearBtn = preview.getByRole('button', { name: '选择文件' })
+ const uploadModal = page.locator('.tiny-modal').nth(0)
+ const messageModal = page.locator('.tiny-modal').nth(1)
+ const selectFilesBtn = uploadModal.getByRole('button', { name: '选择文件' })
+ const uploadsBtn = uploadModal.getByRole('button', { name: '开始上传' })
+ const lists = uploadModal.locator('.tiny-popupload__dialog-table-item')
+ const path = require('node:path')
+ const currentPath = path.resolve(__dirname, '测试.jpg')
+
+ await modalAppearBtn.click()
+ const [fileChooser] = await Promise.all([page.waitForEvent('filechooser'), selectFilesBtn.click()])
+ await fileChooser.setFiles(currentPath)
+ await expect(lists).toHaveCount(1)
+
+ // 点击开始上传文件按钮，信息提示弹窗出现
+ await uploadsBtn.click()
+ await expect(messageModal).toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/pop-upload/custom-request-headers.spec.ts b/examples/docs/resources/pc/demo/pop-upload/custom-request-headers.spec.ts
new file mode 100644
index 000000000..ab87ccffa
--- /dev/null
+++ b/examples/docs/resources/pc/demo/pop-upload/custom-request-headers.spec.ts
@@ -0,0 +1,25 @@
+import { test, expect } from '@playwright/test'
+
+test('PopUpload 自定义请求头', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/pop-upload/custom-request-headers')
+
+ const preview = page.locator('#preview')
+ const modalAppearBtn = preview.getByRole('button', { name: '选择文件' })
+ const uploadModal = page.locator('.tiny-modal')
+ const selectFilesBtn = uploadModal.getByRole('button', { name: '选择文件' })
+ const uploadsBtn = uploadModal.getByRole('button', { name: '开始上传' })
+ const path = require('node:path')
+ const currentPath = path.resolve(__dirname, '测试.jpg')
+
+ await modalAppearBtn.click()
+ const [fileChooser] = await Promise.all([page.waitForEvent('filechooser'), selectFilesBtn.click()])
+ await fileChooser.setFiles(currentPath)
+
+ // 获取请求头
+ const [request] = await Promise.all([page.waitForEvent('request'), uploadsBtn.click()])
+ const { authorization } = await request.headers()
+
+ await expect(request.headers()).not.toBeNull()
+ await expect(authorization).toEqual('Basic QWxhZGRpbjpvcGVuIHNlc2FtZQ==')
+})
diff --git a/examples/docs/resources/pc/demo/pop-upload/data.spec.ts b/examples/docs/resources/pc/demo/pop-upload/data.spec.ts
new file mode 100644
index 000000000..449b3e447
--- /dev/null
+++ b/examples/docs/resources/pc/demo/pop-upload/data.spec.ts
@@ -0,0 +1,24 @@
+import { test, expect } from '@playwright/test'
+
+test('PopUpload 上传时附带的额外参数', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/pop-upload/data')
+
+ const preview = page.locator('#preview')
+ const modalAppearBtn = preview.getByRole('button', { name: '选择文件' })
+ const uploadModal = page.locator('.tiny-modal')
+ const selectFilesBtn = uploadModal.getByRole('button', { name: '选择文件' })
+ const uploadsBtn = uploadModal.getByRole('button', { name: '开始上传' })
+ const path = require('node:path')
+ const currentPath = path.resolve(__dirname, '测试.jpg')
+
+ await modalAppearBtn.click()
+ const [fileChooser] = await Promise.all([page.waitForEvent('filechooser'), selectFilesBtn.click()])
+ await fileChooser.setFiles(currentPath)
+
+ // 获取请求体
+ const [request] = await Promise.all([page.waitForEvent('request'), uploadsBtn.click()])
+ const body = await request.postData()
+
+ await expect(body).toBeNull()
+})
diff --git a/examples/docs/resources/pc/demo/pop-upload/file-limit.spec.ts b/examples/docs/resources/pc/demo/pop-upload/file-limit.spec.ts
new file mode 100644
index 000000000..c177ea9f0
--- /dev/null
+++ b/examples/docs/resources/pc/demo/pop-upload/file-limit.spec.ts
@@ -0,0 +1,32 @@
+import { test, expect } from '@playwright/test'
+
+test('PopUpload 最大上传文件数', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/pop-upload/file-limit')
+
+ const preview = page.locator('#preview')
+ const modalAppearBtn = preview.getByRole('button', { name: '选择文件' })
+ const uploadModal = page.locator('.tiny-modal').nth(0)
+ const alert = uploadModal.locator('.tiny-alert')
+ const selectFilesBtn = uploadModal.getByRole('button', { name: '选择批量文件' })
+ const lists = uploadModal.locator('.tiny-popupload__dialog-table-item')
+ const path = require('node:path')
+ const path1= path.resolve(__dirname, '测试.jpg')
+ const path2 = path.resolve(__dirname, '测试.png')
+ const path3 = path.resolve(__dirname, '测试.svg')
+ const path4 = path.resolve(__dirname, '测试.svg')
+
+ await modalAppearBtn.click()
+ await expect(alert.getByText('上传文件数限制为:3')).toBeVisible()
+ const [fileChooser] = await Promise.all([page.waitForEvent('filechooser'), selectFilesBtn.click()])
+ await fileChooser.setFiles(path1)
+ await fileChooser.setFiles(path2)
+ await fileChooser.setFiles(path3)
+ await expect(lists).toHaveCount(3)
+
+ await fileChooser.setFiles(path4)
+ await expect(lists).toHaveCount(3)
+ await expect(alert.getByText('上传文件数量超出限制,已取消该操作')).toBeVisible()
+
+
+})
diff --git a/examples/docs/resources/pc/demo/pop-upload/file-type.spec.ts b/examples/docs/resources/pc/demo/pop-upload/file-type.spec.ts
new file mode 100644
index 000000000..c80cf155c
--- /dev/null
+++ b/examples/docs/resources/pc/demo/pop-upload/file-type.spec.ts
@@ -0,0 +1,28 @@
+import { test, expect } from '@playwright/test'
+
+test('PopUpload 可上传文件类型', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/pop-upload/file-type')
+
+ const preview = page.locator('#preview')
+ const modalAppearBtn = preview.getByRole('button', { name: '选择文件' })
+ const uploadModal = page.locator('.tiny-modal').nth(0)
+ const alert = uploadModal.locator('.tiny-alert')
+ const selectFilesBtn = uploadModal.getByRole('button', { name: '选择文件' })
+ const uploadsBtn = uploadModal.getByRole('button', { name: '开始上传' })
+ const lists = uploadModal.locator('.tiny-popupload__dialog-table-item')
+ const path = require('node:path')
+ const path1 = path.resolve(__dirname, '测试.jpg')
+ const path2 = path.resolve(__dirname, '测试.png')
+ const path3 = path.resolve(__dirname, '测试.svg')
+
+ await modalAppearBtn.click()
+ await expect(alert.getByText('上传文件类型限制为:.png,.jpg')).toBeVisible()
+ const [fileChooser] = await Promise.all([page.waitForEvent('filechooser'), selectFilesBtn.click()])
+ await fileChooser.setFiles(path1)
+ await fileChooser.setFiles(path2)
+ await fileChooser.setFiles(path3)
+ await expect(lists).toHaveCount(3)
+ await uploadsBtn.click()
+ await expect(alert.getByText('测试.svg:上传文件类型不匹配')).toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/pop-upload/fill-button-text.spec.ts b/examples/docs/resources/pc/demo/pop-upload/fill-button-text.spec.ts
new file mode 100644
index 000000000..6838c0b5c
--- /dev/null
+++ b/examples/docs/resources/pc/demo/pop-upload/fill-button-text.spec.ts
@@ -0,0 +1,41 @@
+import { test, expect } from '@playwright/test'
+test.describe('PopUpload 自定义按钮的文本', () => {
+
+ test('PopUpload 文件上传弹框中取消按钮的文本', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/pop-upload/fill-button-text1')
+
+ const modalAppearBtn = page.getByRole('button', { name: '自定义按钮文本' })
+ const modal = page.locator('.tiny-modal')
+ const cancelBtn = modal.getByRole('button', { name: '自定义取消按钮' })
+
+ await modalAppearBtn.click()
+ await expect(cancelBtn).toHaveText(/自定义取消按钮/)
+ })
+
+ test('PopUpload 文件上传弹框中提交按钮的文本', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/pop-upload/fill-button-text2')
+
+ const modalAppearBtn = page.getByRole('button', { name: '自定义按钮文本' })
+ const modal = page.locator('.tiny-modal')
+ const uploadsBtn = modal.getByRole('button', { name: '自定义提交按钮文本' })
+
+ await modalAppearBtn.click()
+ await expect(uploadsBtn).toHaveText(/自定义提交按钮文本/)
+ })
+
+ test('PopUpload 打开弹出框的按钮的文本', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/pop-upload/fill-button-text4')
+
+ const modalAppearBtn = page.getByRole('button', { name: '自定义按钮文本' })
+ const modal = page.locator('.tiny-modal')
+
+
+ await expect(modalAppearBtn).toHaveText(/自定义按钮文本/)
+ await modalAppearBtn.click()
+ await expect(modal).toBeVisible()
+ })
+})
+
diff --git a/examples/docs/resources/pc/demo/pop-upload/fill-button-text.vue b/examples/docs/resources/pc/demo/pop-upload/fill-button-text.vue
index 34a562fa1..8ed70fcc1 100644
--- a/examples/docs/resources/pc/demo/pop-upload/fill-button-text.vue
+++ b/examples/docs/resources/pc/demo/pop-upload/fill-button-text.vue
@@ -1,5 +1,6 @@
diff --git a/examples/docs/resources/pc/demo/pop-upload/http-request.spec.ts b/examples/docs/resources/pc/demo/pop-upload/http-request.spec.ts
new file mode 100644
index 000000000..3ee2c4355
--- /dev/null
+++ b/examples/docs/resources/pc/demo/pop-upload/http-request.spec.ts
@@ -0,0 +1,26 @@
+import { test, expect } from '@playwright/test'
+
+test('PopUpload 覆盖默认请求', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/pop-upload/http-request')
+
+ const preview = page.locator('#preview')
+ const modalAppearBtn = preview.getByRole('button', { name: '选择文件' })
+ const uploadModal = page.locator('.tiny-modal').nth(0)
+ const messageModal = page.locator('.tiny-modal').nth(1)
+ const selectFilesBtn = uploadModal.getByRole('button', { name: '选择文件' })
+ const uploadsBtn = uploadModal.getByRole('button', { name: '开始上传' })
+ const lists = uploadModal.locator('.tiny-popupload__dialog-table-item')
+ const path = require('node:path')
+ const currentPath = path.resolve(__dirname, '测试.jpg')
+
+ await modalAppearBtn.click()
+ const [fileChooser] = await Promise.all([page.waitForEvent('filechooser'), selectFilesBtn.click()])
+ await fileChooser.setFiles(currentPath)
+ await expect(lists).toHaveCount(1)
+
+ // 自定义上传行为
+ await uploadsBtn.click()
+ await expect(messageModal).toBeVisible()
+ await expect(messageModal).toHaveText(/上传成功/)
+})
diff --git a/examples/docs/resources/pc/demo/pop-upload/max-upload-file-size.spec.ts b/examples/docs/resources/pc/demo/pop-upload/max-upload-file-size.spec.ts
new file mode 100644
index 000000000..7fbb2ec91
--- /dev/null
+++ b/examples/docs/resources/pc/demo/pop-upload/max-upload-file-size.spec.ts
@@ -0,0 +1,24 @@
+import { test, expect } from '@playwright/test'
+
+test('PopUpload 可上传文件大小', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/pop-upload/max-upload-file-size')
+
+ const preview = page.locator('#preview')
+ const modalAppearBtn = preview.getByRole('button', { name: '选择文件' })
+ const uploadModal = page.locator('.tiny-modal').nth(0)
+ const alert = uploadModal.locator('.tiny-alert')
+ const selectFilesBtn = uploadModal.getByRole('button', { name: '选择文件' })
+ const uploadsBtn = uploadModal.getByRole('button', { name: '开始上传' })
+ const lists = uploadModal.locator('.tiny-popupload__dialog-table-item')
+ const path = require('node:path')
+ const currentPath= path.resolve(__dirname, '测试.jpg')
+
+ await modalAppearBtn.click()
+ await expect(alert.getByText('上传文件大小不超过:9KB')).toBeVisible()
+ const [fileChooser] = await Promise.all([page.waitForEvent('filechooser'), selectFilesBtn.click()])
+ await fileChooser.setFiles(currentPath)
+ await expect(lists).toHaveCount(1)
+ await uploadsBtn.click()
+ await expect(alert.getByText('测试.jpg:上传文件大小超出限制')).toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/pop-upload/max-upload-file-size.vue b/examples/docs/resources/pc/demo/pop-upload/max-upload-file-size.vue
index a552b54b8..c36aab366 100644
--- a/examples/docs/resources/pc/demo/pop-upload/max-upload-file-size.vue
+++ b/examples/docs/resources/pc/demo/pop-upload/max-upload-file-size.vue
@@ -1,5 +1,5 @@
-
diff --git a/examples/docs/resources/pc/demo/popover/basic-usage.spec.js b/examples/docs/resources/pc/demo/popover/basic-usage.spec.js
new file mode 100644
index 000000000..eaffaecc2
--- /dev/null
+++ b/examples/docs/resources/pc/demo/popover/basic-usage.spec.js
@@ -0,0 +1,12 @@
+import { test, expect } from '@playwright/test'
+
+test('基本用法', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/popover/basic-usage')
+
+ let button = page.getByRole('button', { name: '悬浮我提示' })
+ let pop = page.getByRole('tooltip', { name: /这是一段内容/ })
+
+ await button.hover()
+ await expect(pop).toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/popover/close-delay.spec.js b/examples/docs/resources/pc/demo/popover/close-delay.spec.js
new file mode 100644
index 000000000..149ad64de
--- /dev/null
+++ b/examples/docs/resources/pc/demo/popover/close-delay.spec.js
@@ -0,0 +1,16 @@
+import { test, expect } from '@playwright/test'
+
+test('延迟隐藏', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/popover/close-delay')
+
+ const button = page.getByRole('button', { name: '提示' })
+ const pop = page.getByRole('tooltip', { name: /这是一段内容/ })
+
+ await button.hover()
+ await expect(pop).toBeVisible()
+
+ await page.mouse.move(0, 0)
+ await page.waitForTimeout(3100)
+ await expect(pop).toBeHidden()
+})
diff --git a/examples/docs/resources/pc/demo/popover/custom-tip-text.spec.js b/examples/docs/resources/pc/demo/popover/custom-tip-text.spec.js
new file mode 100644
index 000000000..2e92e6100
--- /dev/null
+++ b/examples/docs/resources/pc/demo/popover/custom-tip-text.spec.js
@@ -0,0 +1,17 @@
+import { test, expect } from '@playwright/test'
+
+test('自定义提示文本', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/popover/custom-tip-text')
+
+ let button = page.getByRole('button', { name: '悬浮我触发' })
+ let pop = page.getByRole('tooltip', { name: /这是一段内容/ })
+
+ await button.nth(0).hover()
+ await expect(pop).toBeVisible()
+ await page.mouse.move(0, 0)
+ await page.waitForTimeout(300)
+
+ await button.nth(1).hover()
+ await expect(pop).toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/popover/custom-transition.spec.js b/examples/docs/resources/pc/demo/popover/custom-transition.spec.js
new file mode 100644
index 000000000..b2e6874a5
--- /dev/null
+++ b/examples/docs/resources/pc/demo/popover/custom-transition.spec.js
@@ -0,0 +1,17 @@
+import { test, expect } from '@playwright/test'
+
+test('自定义渐变动画', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/popover/custom-transition')
+
+ let button = page.getByRole('button', { name: '悬浮看效果' })
+ let pop = page.getByRole('tooltip', { name: /这是一段内容/ })
+
+ await button.nth(0).hover()
+ await expect(pop).toHaveClass(/fade-in-linear-enter-active/)
+ await page.mouse.move(0, 0)
+ await page.waitForTimeout(300)
+
+ await button.nth(1).hover()
+ await expect(pop).not.toHaveClass(/fade-in-linear-enter-active/)
+})
diff --git a/examples/docs/resources/pc/demo/popover/dynamic-disable.spec.js b/examples/docs/resources/pc/demo/popover/dynamic-disable.spec.js
new file mode 100644
index 000000000..d043e6ae0
--- /dev/null
+++ b/examples/docs/resources/pc/demo/popover/dynamic-disable.spec.js
@@ -0,0 +1,18 @@
+import { test, expect } from '@playwright/test'
+
+test('动态禁用', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/popover/dynamic-disable')
+
+ let disBtn = page.getByRole('button', { name: '禁用弹出框' })
+ let popBtn = page.getByRole('button', { name: '悬浮弹出' })
+ let pop = page.getByRole('tooltip', { name: /这是一段内容/ })
+
+ await popBtn.hover()
+ await expect(pop).toBeVisible()
+ await page.waitForTimeout(300)
+
+ await disBtn.click()
+ await popBtn.hover()
+ await expect(pop).toBeHidden()
+})
diff --git a/examples/docs/resources/pc/demo/popover/frame-offset.spec.js b/examples/docs/resources/pc/demo/popover/frame-offset.spec.js
new file mode 100644
index 000000000..5db3c31b3
--- /dev/null
+++ b/examples/docs/resources/pc/demo/popover/frame-offset.spec.js
@@ -0,0 +1,15 @@
+import { test, expect } from '@playwright/test'
+
+test('弹出框偏移', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/popover/frame-offset')
+
+ let poppers = page.locator('.tiny-popover')
+
+ const box1 = await poppers.nth(0).boundingBox()
+ const box2 = await poppers.nth(1).boundingBox()
+ const box3 = await poppers.nth(2).boundingBox()
+
+ expect(box1.x - box2.x).toEqual(50)
+ expect(box3.x - box1.x).toEqual(50)
+})
diff --git a/examples/docs/resources/pc/demo/popover/frame-offset.vue b/examples/docs/resources/pc/demo/popover/frame-offset.vue
index 7f9c0fe4b..b5285e082 100644
--- a/examples/docs/resources/pc/demo/popover/frame-offset.vue
+++ b/examples/docs/resources/pc/demo/popover/frame-offset.vue
@@ -1,16 +1,16 @@
-
+
默认
-
+
左移50
-
+
右移50
@@ -25,12 +25,16 @@ export default {
components: {
TinyPopover: Popover,
TinyButton: Button
+ },
+ data() {
+ return { show: true }
}
}
diff --git a/examples/docs/resources/pc/demo/popover/hidden-arrow.spec.js b/examples/docs/resources/pc/demo/popover/hidden-arrow.spec.js
new file mode 100644
index 000000000..f0ad9e0c8
--- /dev/null
+++ b/examples/docs/resources/pc/demo/popover/hidden-arrow.spec.js
@@ -0,0 +1,18 @@
+import { test, expect } from '@playwright/test'
+
+test('隐藏箭头', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/popover/hidden-arrow')
+
+ let button1 = page.getByRole('button', { name: '有提示箭头' })
+ let button2 = page.getByRole('button', { name: '无提示箭头' })
+ let pop = page.getByRole('tooltip', { name: /这是一段内容/ }).locator('.popper__arrow')
+
+ await button1.hover()
+ await expect(pop).toBeVisible()
+ await page.mouse.move(0, 0)
+ await page.waitForTimeout(200)
+
+ await button2.hover()
+ await expect(pop).toBeHidden()
+})
diff --git a/examples/docs/resources/pc/demo/popover/open-delay.spec.js b/examples/docs/resources/pc/demo/popover/open-delay.spec.js
new file mode 100644
index 000000000..9b53cc854
--- /dev/null
+++ b/examples/docs/resources/pc/demo/popover/open-delay.spec.js
@@ -0,0 +1,15 @@
+import { test, expect } from '@playwright/test'
+
+test('延迟显示', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/popover/open-delay')
+
+ let button = page.getByRole('button', { name: '鼠标悬浮我两秒' })
+ let pop = page.getByRole('tooltip', { name: /这是一段内容/ })
+
+ await button.hover()
+ await expect(pop).toBeHidden()
+
+ await page.waitForTimeout(2100)
+ await expect(pop).toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/popover/popover-content.spec.js b/examples/docs/resources/pc/demo/popover/popover-content.spec.js
new file mode 100644
index 000000000..e46918357
--- /dev/null
+++ b/examples/docs/resources/pc/demo/popover/popover-content.spec.js
@@ -0,0 +1,12 @@
+import { test, expect } from '@playwright/test'
+
+test('添加内容', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/popover/popover-content')
+
+ let button = page.getByRole('button', { name: '提示' })
+ let pop = page.getByRole('tooltip', { name: '这是一段内容' })
+
+ await button.click()
+ await expect(pop).toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/popover/popover-events.spec.js b/examples/docs/resources/pc/demo/popover/popover-events.spec.js
new file mode 100644
index 000000000..805ce0b30
--- /dev/null
+++ b/examples/docs/resources/pc/demo/popover/popover-events.spec.js
@@ -0,0 +1,19 @@
+import { test, expect } from '@playwright/test'
+
+test('事件', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/popover/popover-events')
+
+ let button = page.getByRole('button', { name: '悬浮我触发' })
+ let pop = page.getByRole('tooltip', { name: /这是一段内容/ })
+ let notify1 = page.locator('.tiny-notify__content').filter({ hasText: /显示时触发/ })
+ let notify2 = page.locator('.tiny-notify__content').filter({ hasText: /隐藏时触发/ })
+
+ await button.hover()
+ await expect(pop).toBeVisible()
+ await expect(notify1).toBeVisible()
+ await page.mouse.move(0, 0)
+ await page.waitForTimeout(300)
+
+ await expect(notify2.nth(1)).toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/popover/popover-placement.spec.js b/examples/docs/resources/pc/demo/popover/popover-placement.spec.js
new file mode 100644
index 000000000..8cde3cb35
--- /dev/null
+++ b/examples/docs/resources/pc/demo/popover/popover-placement.spec.js
@@ -0,0 +1,43 @@
+import { test, expect } from '@playwright/test'
+
+test('显示位置', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/popover/popover-placement')
+
+ let top = page.getByRole('button', { name: /top/ })
+ let bottom = page.getByRole('button', { name: /bottom/ })
+ let left = page.getByRole('button', { name: /left/ })
+ let right = page.getByRole('button', { name: /right/ })
+ let poppers = page.locator('body > .tiny-popover')
+
+ // top
+ await top.hover()
+ let box1 = await top.boundingBox()
+ let box2 = await poppers.nth(0).boundingBox()
+ expect(box1.y - box2.y).toBeGreaterThan(0)
+ await page.waitForTimeout(200)
+ await page.mouse.move(0, 0)
+
+ // bottom
+ await bottom.hover()
+ box1 = await bottom.boundingBox()
+ box2 = await poppers.nth(1).boundingBox()
+ expect(box1.y - box2.y).toBeLessThan(0)
+ await page.waitForTimeout(200)
+ await page.mouse.move(0, 0)
+
+ // left
+ await left.hover()
+ box1 = await left.boundingBox()
+ box2 = await poppers.nth(2).boundingBox()
+ expect(box1.x - box2.x).toBeGreaterThan(0)
+ await page.waitForTimeout(200)
+ await page.mouse.move(0, 0)
+
+ // right
+ await right.hover()
+ box1 = await right.boundingBox()
+ box2 = await poppers.nth(3).boundingBox()
+ expect(box1.x - box2.x).toBeLessThan(0)
+ await page.waitForTimeout(200)
+})
diff --git a/examples/docs/resources/pc/demo/popover/popover-width.spec.js b/examples/docs/resources/pc/demo/popover/popover-width.spec.js
new file mode 100644
index 000000000..a4715b7d6
--- /dev/null
+++ b/examples/docs/resources/pc/demo/popover/popover-width.spec.js
@@ -0,0 +1,12 @@
+import { test, expect } from '@playwright/test'
+
+test('宽度', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/popover/popover-width')
+
+ let button = page.getByRole('button', { name: '悬浮我看效果' })
+ let pop = page.getByRole('tooltip', { name: /这是一段内容/ })
+
+ await button.hover()
+ await expect(pop).toHaveCSS('height', '300px')
+})
diff --git a/examples/docs/resources/pc/demo/popover/popper-class.spec.js b/examples/docs/resources/pc/demo/popover/popper-class.spec.js
new file mode 100644
index 000000000..8893a6f67
--- /dev/null
+++ b/examples/docs/resources/pc/demo/popover/popper-class.spec.js
@@ -0,0 +1,21 @@
+import { test, expect } from '@playwright/test'
+
+test('自定义样式', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/popover/popper-class')
+
+ let button1 = page.getByRole('button', { name: /单个class/ })
+ let button2 = page.getByRole('button', { name: /多个class/ })
+
+ let poppers = page.locator('body > .tiny-popover')
+
+ // 单个class
+ await button1.hover()
+ await expect(poppers.nth(0)).toHaveClass(/demo-popover-class1/)
+ await page.waitForTimeout(200)
+ await page.mouse.move(0, 0)
+
+ // 多个class
+ await button2.hover()
+ await expect(poppers.nth(1)).toHaveClass(/demo-popover-class2/)
+})
diff --git a/examples/docs/resources/pc/demo/popover/popper-options.spec.js b/examples/docs/resources/pc/demo/popover/popper-options.spec.js
new file mode 100644
index 000000000..f8c8eee97
--- /dev/null
+++ b/examples/docs/resources/pc/demo/popover/popper-options.spec.js
@@ -0,0 +1,12 @@
+import { test, expect } from '@playwright/test'
+
+test('弹出框选项', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/popover/popper-options')
+
+ let button = page.getByRole('button', { name: '提示' })
+ let pop = page.getByRole('tooltip', { name: /这是一段内容/ })
+
+ await button.hover()
+ await expect(pop).toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/popover/trigger-mode.spec.js b/examples/docs/resources/pc/demo/popover/trigger-mode.spec.js
new file mode 100644
index 000000000..04cf716d3
--- /dev/null
+++ b/examples/docs/resources/pc/demo/popover/trigger-mode.spec.js
@@ -0,0 +1,31 @@
+import { test, expect } from '@playwright/test'
+
+test('触发方式', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/popover/trigger-mode')
+
+ let button1 = page.getByRole('button', { name: 'hover 激活' })
+ let button2 = page.getByRole('button', { name: 'click 激活' })
+ let button3 = page.getByRole('button', { name: 'focus 激活' })
+ let button4 = page.getByRole('button', { name: '手动激活' })
+ let pop1 = page.getByRole('tooltip', { name: /hover 激活/ })
+ let pop2 = page.getByRole('tooltip', { name: /click 激活/ })
+ let pop3 = page.getByRole('tooltip', { name: /focus 激活/ })
+ let pop4 = page.getByRole('tooltip', { name: /手动激活/ })
+
+ await button1.hover()
+ await expect(pop1).toBeVisible()
+ await page.waitForTimeout(100)
+
+ await button2.click()
+ await expect(pop2).toBeVisible()
+ await page.waitForTimeout(100)
+
+ await page.keyboard.press('Tab')
+ await expect(pop3).toBeVisible()
+ await page.waitForTimeout(100)
+
+ await button4.click()
+ await expect(pop4).toBeVisible()
+ await page.waitForTimeout(100)
+})
diff --git a/examples/docs/resources/pc/demo/popover/trigger-mode.vue b/examples/docs/resources/pc/demo/popover/trigger-mode.vue
index 6cdb40195..75ca539ae 100644
--- a/examples/docs/resources/pc/demo/popover/trigger-mode.vue
+++ b/examples/docs/resources/pc/demo/popover/trigger-mode.vue
@@ -1,47 +1,24 @@
-
+
hover 激活
-
+
click 激活
-
+
focus 激活
-
+
手动激活
@@ -66,7 +43,7 @@ export default {
diff --git a/examples/docs/resources/pc/demo/popover/trigger-reference.spec.js b/examples/docs/resources/pc/demo/popover/trigger-reference.spec.js
new file mode 100644
index 000000000..26867ab24
--- /dev/null
+++ b/examples/docs/resources/pc/demo/popover/trigger-reference.spec.js
@@ -0,0 +1,12 @@
+import { test, expect } from '@playwright/test'
+
+test('触发源', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/popover/trigger-reference')
+
+ let button = page.getByRole('button', { name: '触发源' })
+ let pop = page.getByRole('tooltip', { name: /这是一段内容/ })
+
+ await button.hover()
+ await expect(pop).toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/progress/basic-usage.spec.ts b/examples/docs/resources/pc/demo/progress/basic-usage.spec.ts
new file mode 100644
index 000000000..f101b5eca
--- /dev/null
+++ b/examples/docs/resources/pc/demo/progress/basic-usage.spec.ts
@@ -0,0 +1,20 @@
+import { test, expect } from '@playwright/test'
+
+test.describe('progress 基本用法', () => {
+ test('正常显示', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).not.toBeNull())
+ await page.goto('http://127.0.0.1:7130/pc/progress/basic-usage')
+
+ const progress = page.getByRole('progressbar')
+ const outer = progress.locator('div.tiny-progress-bar__outer')
+ const inner = progress.locator('div.tiny-progress-bar__inner')
+
+ await expect(outer).toBeVisible()
+ await expect(outer).toHaveCSS('height', '6px')
+ await expect(inner).toBeVisible()
+ await expect(inner).toHaveCSS('border-radius', '3px')
+ await expect(page.getByText('50%')).toBeVisible()
+ await expect(progress).toHaveAttribute('aria-valuemin', '0')
+ await expect(progress).toHaveAttribute('aria-valuemax', '100')
+ })
+})
diff --git a/examples/docs/resources/pc/demo/progress/custom-color.spec.ts b/examples/docs/resources/pc/demo/progress/custom-color.spec.ts
new file mode 100644
index 000000000..04c13dcd4
--- /dev/null
+++ b/examples/docs/resources/pc/demo/progress/custom-color.spec.ts
@@ -0,0 +1,21 @@
+import { test, expect } from '@playwright/test'
+
+test.describe('自定义颜色', () => {
+ test('根据长度改变颜色', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).not.toBeNull())
+ await page.goto('http://localhost:7130/pc/progress/custom-color')
+
+ const progress = page.getByRole('progressbar')
+ const progress1 = progress.nth(0).locator('div.tiny-progress-bar__inner')
+ const progress2 = progress.nth(1).locator('div.tiny-progress-bar__inner')
+ const progress3 = progress.nth(2).locator('div.tiny-progress-bar__inner')
+ const button = page.getByRole('button', { name: '点击增加改变颜色' })
+
+ await expect(progress1).toHaveCSS('background-color', 'rgb(64, 158, 255)')
+ await expect(progress2).toHaveCSS('background-color', 'rgb(230, 162, 60)')
+ await expect(progress3).toHaveCSS('background-color', 'rgb(92, 184, 122)')
+ await button.click()
+ await expect(progress2).toHaveCSS('background-color', 'rgb(103, 194, 58)')
+ await expect(progress3).toHaveCSS('background-color', 'rgb(25, 137, 250)')
+ })
+})
diff --git a/examples/docs/resources/pc/demo/progress/custom-color.vue b/examples/docs/resources/pc/demo/progress/custom-color.vue
index 91357f9a5..e7d36f5dc 100644
--- a/examples/docs/resources/pc/demo/progress/custom-color.vue
+++ b/examples/docs/resources/pc/demo/progress/custom-color.vue
@@ -1,20 +1,23 @@
- 点击增加改变颜色
+
+
diff --git a/examples/docs/resources/pc/demo/radio/radio-events.spec.ts b/examples/docs/resources/pc/demo/radio/radio-events.spec.ts
new file mode 100644
index 000000000..a90ed11d2
--- /dev/null
+++ b/examples/docs/resources/pc/demo/radio/radio-events.spec.ts
@@ -0,0 +1,13 @@
+import { test, expect } from '@playwright/test'
+
+test('单选框事件', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/radio/radio-events')
+ await page.getByRole('radio', { name: '选项二' }).click()
+ const radio1 = page.locator('div').filter({ hasText: 'change 事件，选中的 Radio label 值为：2' }).nth(1)
+ await expect(radio1).toBeVisible()
+
+ await page.getByRole('radio', { name: '月度' }).first().click()
+ const radio2 = page.locator('div').filter({ hasText: 'change 事件，选中的 Radio label 值为：2' }).nth(1)
+ await expect(radio2).toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/radio/radio-size.spec.ts b/examples/docs/resources/pc/demo/radio/radio-size.spec.ts
new file mode 100644
index 000000000..2e5bc0612
--- /dev/null
+++ b/examples/docs/resources/pc/demo/radio/radio-size.spec.ts
@@ -0,0 +1,12 @@
+import { test, expect } from '@playwright/test'
+
+test('尺寸设置', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/radio/radio-size')
+ const radio1 = page.locator('.tiny-radio-button--medium')
+ const radio2 = page.locator('.tiny-radio-button--small')
+ const radio3 = page.locator('.tiny-radio-button--mini ')
+ await expect(radio1.nth(0)).toBeVisible()
+ await expect(radio2.nth(0)).toBeVisible()
+ await expect(radio3.nth(0)).toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/radio/radio-text.spec.ts b/examples/docs/resources/pc/demo/radio/radio-text.spec.ts
new file mode 100644
index 000000000..b19bb65a6
--- /dev/null
+++ b/examples/docs/resources/pc/demo/radio/radio-text.spec.ts
@@ -0,0 +1,10 @@
+import { test, expect } from '@playwright/test'
+
+test('文字内容', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/radio/radio-text')
+ const radio1 = page.getByText('选项一')
+ const radio2 = page.getByText('选项二')
+ await expect(radio1).toBeVisible()
+ await expect(radio2).toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/radio/radio-value.spec.ts b/examples/docs/resources/pc/demo/radio/radio-value.spec.ts
new file mode 100644
index 000000000..b41e020a9
--- /dev/null
+++ b/examples/docs/resources/pc/demo/radio/radio-value.spec.ts
@@ -0,0 +1,11 @@
+import { test, expect } from '@playwright/test'
+
+test('radio-value', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/radio/radio-value')
+ const radio1 = page.locator('.tiny-radio').nth(0)
+ const radio2 = page.locator('.tiny-radio').nth(1)
+ await expect(radio1).toBeVisible()
+ await expect(radio2).toBeVisible()
+ await expect(radio1).toHaveClass('tiny-radio is-checked')
+})
diff --git a/examples/docs/resources/pc/demo/radio/vertical.spec.ts b/examples/docs/resources/pc/demo/radio/vertical.spec.ts
new file mode 100644
index 000000000..305d3fba7
--- /dev/null
+++ b/examples/docs/resources/pc/demo/radio/vertical.spec.ts
@@ -0,0 +1,9 @@
+import { test, expect } from '@playwright/test'
+
+test('垂直布局', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/radio/vertical')
+ const radioGroup = page.locator('.list-inline')
+ await expect(radioGroup).toBeVisible()
+ await expect(radioGroup).toHaveCSS('flex-direction', 'column')
+})
diff --git a/examples/docs/resources/pc/demo/radio/with-border.spec.ts b/examples/docs/resources/pc/demo/radio/with-border.spec.ts
new file mode 100644
index 000000000..46b53ac89
--- /dev/null
+++ b/examples/docs/resources/pc/demo/radio/with-border.spec.ts
@@ -0,0 +1,12 @@
+import { test, expect } from '@playwright/test'
+
+test('带有边框', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/radio/with-border')
+ const bordered1 = page.locator('.is-bordered').nth(0)
+ const bordered2 = page.locator('.is-bordered').nth(1)
+ const bordered3 = page.locator('.is-bordered').nth(2)
+ await expect(bordered1).toBeVisible()
+ await expect(bordered2).toBeVisible()
+ await expect(bordered3).toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/rate/allow-half.spec.js b/examples/docs/resources/pc/demo/rate/allow-half.spec.js
new file mode 100644
index 000000000..285dc698e
--- /dev/null
+++ b/examples/docs/resources/pc/demo/rate/allow-half.spec.js
@@ -0,0 +1,17 @@
+import { test, expect } from '@playwright/test'
+
+test.describe('Rate 允许半选', () => {
+ test('允许半选', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/rate/allow-half')
+
+ // 判断rate组件是否出现
+ await expect(page.locator('//*[@id="preview"]/div[2]/div[2]/div')).toBeVisible()
+
+ // 点击icon前一半允许半选
+ const icon = page.locator('.tiny-rate__star > .tiny-svg')
+ const rate = await page.locator('.tiny-rate > span:nth-child(1)').boundingBox()
+ await page.mouse.click(rate.x + rate.width / 2, rate.y + rate.height / 2)
+ await expect(icon.nth(0)).toHaveClass(/ratehalf/)
+ })
+})
diff --git a/examples/docs/resources/pc/demo/rate/basic-usage.spec.js b/examples/docs/resources/pc/demo/rate/basic-usage.spec.js
new file mode 100644
index 000000000..8c9ecf2de
--- /dev/null
+++ b/examples/docs/resources/pc/demo/rate/basic-usage.spec.js
@@ -0,0 +1,60 @@
+import { test, expect } from '@playwright/test'
+
+test.describe('Rate 基本用法', () => {
+ test('rate 组件出现', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/rate/allow-half')
+
+ // 判断rate组件是否出现
+ await expect(page.locator('//*[@id="preview"]/div[2]/div[2]/div')).toBeVisible()
+ })
+
+ test('鼠标hover时，icon高亮', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/rate/basic-usage')
+
+ // 鼠标hover到相应icon时，icon样式改变
+ const icon = page.locator('.tiny-rate__star > .tiny-svg')
+ await icon.nth(0).hover()
+ await expect(icon.nth(0)).toHaveClass(/hover/)
+ await expect(icon.nth(0)).toHaveCSS('fill', 'rgb(255, 187, 51)')
+
+ await icon.nth(1).hover()
+ await expect(icon.nth(1)).toHaveClass(/hover/)
+ await expect(icon.nth(1)).toHaveCSS('fill', 'rgb(255, 187, 51)')
+
+ await icon.nth(2).hover()
+ await expect(icon.nth(2)).toHaveClass(/hover/)
+ await expect(icon.nth(2)).toHaveCSS('fill', 'rgb(255, 187, 51)')
+
+ await icon.nth(3).hover()
+ await expect(icon.nth(3)).toHaveClass(/hover/)
+ await expect(icon.nth(3)).toHaveCSS('fill', 'rgb(255, 187, 51)')
+
+ await icon.nth(4).hover()
+ await expect(icon.nth(4)).toHaveClass(/hover/)
+ await expect(icon.nth(4)).toHaveCSS('fill', 'rgb(255, 187, 51)')
+ })
+
+ test('click选中值准确', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/rate/basic-usage')
+
+ const icon = page.locator('.tiny-rate__star > .tiny-svg')
+ const text = page.locator('//*[@id="preview"]/div[2]/div[2]/div/span[6]')
+ await icon.nth(0).click()
+ await expect(text).toHaveText('很差')
+
+ await icon.nth(1).click()
+ await expect(text).toHaveText('差')
+
+ await icon.nth(2).click()
+ await expect(text).toHaveText('一般')
+
+ await icon.nth(3).click()
+ await expect(text).toHaveText('好')
+
+ await icon.nth(4).click()
+ await expect(text).toHaveText('很好')
+ })
+})
diff --git a/examples/docs/resources/pc/demo/rate/custom-3-threshold-colors.spec.js b/examples/docs/resources/pc/demo/rate/custom-3-threshold-colors.spec.js
new file mode 100644
index 000000000..983155c00
--- /dev/null
+++ b/examples/docs/resources/pc/demo/rate/custom-3-threshold-colors.spec.js
@@ -0,0 +1,33 @@
+import { test, expect } from '@playwright/test'
+
+test.describe('rate 自定义 3 分段颜色', () => {
+ test('hover或选中时三分段呈现不同颜色', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/rate/custom-3-threshold-colors')
+
+ // hover时三分段颜色
+ const icon = page.locator('.tiny-rate__star > .tiny-svg')
+ await icon.nth(0).hover()
+ await expect(icon.nth(0)).toHaveCSS('fill', 'rgb(250, 219, 20)')
+ await icon.nth(1).hover()
+ await expect(icon.nth(1)).toHaveCSS('fill', 'rgb(250, 219, 20)')
+ await icon.nth(2).hover()
+ await expect(icon.nth(2)).toHaveCSS('fill', 'rgb(255, 122, 69)')
+ await icon.nth(3).hover()
+ await expect(icon.nth(3)).toHaveCSS('fill', 'rgb(255, 169, 64)')
+ await icon.nth(4).hover()
+ await expect(icon.nth(4)).toHaveCSS('fill', 'rgb(255, 169, 64)')
+
+ // 选中时时三分段颜色
+ await icon.nth(0).click()
+ await expect(icon.nth(0)).toHaveCSS('fill', 'rgb(250, 219, 20)')
+ await icon.nth(1).click()
+ await expect(icon.nth(1)).toHaveCSS('fill', 'rgb(250, 219, 20)')
+ await icon.nth(2).click()
+ await expect(icon.nth(2)).toHaveCSS('fill', 'rgb(255, 122, 69)')
+ await icon.nth(3).click()
+ await expect(icon.nth(3)).toHaveCSS('fill', 'rgb(255, 169, 64)')
+ await icon.nth(4).click()
+ await expect(icon.nth(4)).toHaveCSS('fill', 'rgb(255, 169, 64)')
+ })
+})
diff --git a/examples/docs/resources/pc/demo/rate/custom-3-threshold-icon.spec.js b/examples/docs/resources/pc/demo/rate/custom-3-threshold-icon.spec.js
new file mode 100644
index 000000000..cc3382410
--- /dev/null
+++ b/examples/docs/resources/pc/demo/rate/custom-3-threshold-icon.spec.js
@@ -0,0 +1,36 @@
+import { test, expect } from '@playwright/test'
+
+test.describe('Rate 自定义 3 分段图标样式', () => {
+ test('自定义三分段图标样式', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/rate/custom-3-threshold-icon')
+
+ const icon = page.locator('.tiny-rate__star > .tiny-svg')
+
+ await icon.nth(0).click()
+ await expect(page.locator('.tiny-rate > span:nth-child(1) > .tiny-svg > .st0').first()).toHaveAttribute(
+ 'd',
+ 'M6.5 11C5.7 11 5 10.3 5 9.5S5.7 8 6.5 8 8 8.7 8 9.5 7.3 11 6.5 11zm11 0c-.8 0-1.5-.7-1.5-1.5S16.7 8 17.5 8s1.5.7 1.5 1.5-.7 1.5-1.5 1.5zm-2.4 8c-.5 0-.9-.4-.9-.9 0-1.3-1-2.3-2.2-2.3s-2.2 1-2.2 2.3c0 .5-.4.9-.9.9s-.9-.4-.9-.9c0-2.3 1.8-4.1 4-4.1s4 1.8 4 4.1c0 .5-.4.9-.9.9z'
+ )
+ await icon.nth(1).click()
+ await expect(page.locator('.tiny-rate > span:nth-child(2) > .tiny-svg > .st0').first()).toHaveAttribute(
+ 'd',
+ 'M6.5 11C5.7 11 5 10.3 5 9.5S5.7 8 6.5 8 8 8.7 8 9.5 7.3 11 6.5 11zm11 0c-.8 0-1.5-.7-1.5-1.5S16.7 8 17.5 8s1.5.7 1.5 1.5-.7 1.5-1.5 1.5zm-2.4 8c-.5 0-.9-.4-.9-.9 0-1.3-1-2.3-2.2-2.3s-2.2 1-2.2 2.3c0 .5-.4.9-.9.9s-.9-.4-.9-.9c0-2.3 1.8-4.1 4-4.1s4 1.8 4 4.1c0 .5-.4.9-.9.9z'
+ )
+ await icon.nth(2).click()
+ await expect(page.locator('.tiny-rate > span:nth-child(3) > .tiny-svg > .st0').first()).toHaveAttribute(
+ 'd',
+ 'M9 16h6.1c.6 0 1 .4 1 1s-.4 1-1 1H9c-.6 0-1-.4-1-1s.5-1 1-1zm-2.5-5C5.7 11 5 10.3 5 9.5S5.7 8 6.5 8 8 8.7 8 9.5 7.3 11 6.5 11zm11 0c-.8 0-1.5-.7-1.5-1.5S16.7 8 17.5 8s1.5.7 1.5 1.5-.7 1.5-1.5 1.5z'
+ )
+ await icon.nth(3).click()
+ await expect(page.locator('.tiny-rate > span:nth-child(4) > .tiny-svg > .st0').last()).toHaveAttribute(
+ 'd',
+ 'M12 24C5.4 24 0 18.6 0 12S5.4 0 12 0s12 5.4 12 12-5.4 12-12 12zm0-2c5.5 0 10-4.5 10-10S17.5 2 12 2 2 6.5 2 12s4.5 10 10 10z'
+ )
+ await icon.nth(4).click()
+ await expect(page.locator('.tiny-rate > span:nth-child(5) > .tiny-svg > .st0').last()).toHaveAttribute(
+ 'd',
+ 'M12 24C5.4 24 0 18.6 0 12S5.4 0 12 0s12 5.4 12 12-5.4 12-12 12zm0-2c5.5 0 10-4.5 10-10S17.5 2 12 2 2 6.5 2 12s4.5 10 10 10z'
+ )
+ })
+})
diff --git a/examples/docs/resources/pc/demo/rate/disabled-not-selected-class.spec.js b/examples/docs/resources/pc/demo/rate/disabled-not-selected-class.spec.js
new file mode 100644
index 000000000..4b3809ddd
--- /dev/null
+++ b/examples/docs/resources/pc/demo/rate/disabled-not-selected-class.spec.js
@@ -0,0 +1,28 @@
+import { test, expect } from '@playwright/test'
+
+test.describe('Rate 自定义禁用时未选中图标类名', () => {
+ test('禁用时未选中图标类名', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/rate/disabled-not-selected-class')
+
+ // 禁用
+ const icon = page.locator('.tiny-rate__star > .tiny-svg')
+ await icon.nth(0).hover()
+ await expect(icon.nth(0)).toHaveClass(/disabled/)
+ await icon.nth(1).hover()
+ await expect(icon.nth(1)).toHaveClass(/disabled/)
+ await icon.nth(2).hover()
+ await expect(icon.nth(3)).toHaveClass(/disabled/)
+ await icon.nth(3).hover()
+ await expect(icon.nth(3)).toHaveClass(/disabled/)
+ await icon.nth(4).hover()
+ await expect(icon.nth(4)).toHaveClass(/disabled/)
+
+ // 未选中图标
+ const svg = page.locator('.tiny-rate > span:nth-child(5) > .tiny-svg > .st0')
+ await expect(svg).toHaveAttribute(
+ 'd',
+ 'M12 1c-.4 0-.8.1-1.1.3-.4.2-.6.5-.8.9L7.8 7l-5 .8c-.8.1-1.4.7-1.7 1.4s-.1 1.6.5 2.2l3.7 3.8-.9 5.4c-.1.6.1 1.2.5 1.7s1 .8 1.6.8c.4 0 .7-.1 1-.3l4.4-2.5 4.4 2.5c.3.2.7.3 1 .3.6 0 1.2-.3 1.6-.8.4-.5.6-1.1.5-1.7l-.9-5.4 3.7-3.8c.6-.6.7-1.4.5-2.2-.3-.8-.9-1.3-1.7-1.4L16 7l-2.2-4.8c-.2-.4-.5-.7-.8-.9-.2-.2-.6-.3-1-.3z'
+ )
+ })
+})
diff --git a/examples/docs/resources/pc/demo/rate/disabled-not-selected-color.spec.js b/examples/docs/resources/pc/demo/rate/disabled-not-selected-color.spec.js
new file mode 100644
index 000000000..e01f8cfce
--- /dev/null
+++ b/examples/docs/resources/pc/demo/rate/disabled-not-selected-color.spec.js
@@ -0,0 +1,19 @@
+import { test, expect } from '@playwright/test'
+
+test.describe('Rate 自定义禁用时未选中图标颜色', () => {
+ test('icon禁用', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/rate/disabled-not-selected-color')
+
+ const icon = page.locator('.tiny-rate__star > .tiny-svg')
+
+ await expect(icon.nth(0)).toHaveClass(/disabled/)
+ await expect(icon.nth(1)).toHaveClass(/disabled/)
+ await expect(icon.nth(2)).toHaveClass(/disabled/)
+ await expect(icon.nth(3)).toHaveClass(/disabled/)
+ await expect(icon.nth(4)).toHaveClass(/disabled/)
+
+ await expect(icon.nth(3)).toHaveCSS('fill', 'rgb(255, 0, 0)')
+ await expect(icon.nth(4)).toHaveCSS('fill', 'rgb(255, 0, 0)')
+ })
+})
diff --git a/examples/docs/resources/pc/demo/rate/dynamic-disable.spec.js b/examples/docs/resources/pc/demo/rate/dynamic-disable.spec.js
new file mode 100644
index 000000000..c57e2cf1a
--- /dev/null
+++ b/examples/docs/resources/pc/demo/rate/dynamic-disable.spec.js
@@ -0,0 +1,17 @@
+import { test, expect } from '@playwright/test'
+
+test.describe('Rate 禁用', () => {
+ test('icon禁用', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/rate/dynamic-disable')
+
+ const icon = page.locator('.tiny-rate__star')
+
+ // 测试每个人icon是否禁用，半选icon应选择第一个icon
+ await expect(icon.nth(0).locator('svg')).toHaveClass(/disabled/)
+ await expect(icon.nth(1).locator('svg')).toHaveClass(/disabled/)
+ await expect(icon.nth(2).locator('svg').first()).toHaveClass(/disabled/)
+ await expect(icon.nth(3).locator('svg')).toHaveClass(/disabled/)
+ await expect(icon.nth(4).locator('svg')).toHaveClass(/disabled/)
+ })
+})
diff --git a/examples/docs/resources/pc/demo/rate/max-score.spec.js b/examples/docs/resources/pc/demo/rate/max-score.spec.js
new file mode 100644
index 000000000..1f65edbf5
--- /dev/null
+++ b/examples/docs/resources/pc/demo/rate/max-score.spec.js
@@ -0,0 +1,12 @@
+import { test, expect } from '@playwright/test'
+
+test.describe('Rate 最大分值', () => {
+ test('设置最大分值', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/rate/max-score')
+
+ const icon = page.locator('.tiny-rate__star > .tiny-svg')
+
+ await expect(icon).toHaveCount(8)
+ })
+})
diff --git a/examples/docs/resources/pc/demo/rate/not-selected-class.spec.js b/examples/docs/resources/pc/demo/rate/not-selected-class.spec.js
new file mode 100644
index 000000000..b2ab0cb3c
--- /dev/null
+++ b/examples/docs/resources/pc/demo/rate/not-selected-class.spec.js
@@ -0,0 +1,17 @@
+import { test, expect } from '@playwright/test'
+
+test.describe('Rate 自定义未选中图标类名', () => {
+ test('自定义未选中图标', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/rate/not-selected-class')
+
+ const icon = page.locator('.tiny-rate__star > .tiny-svg')
+ const svg = page.locator('span:nth-child(5) > .tiny-svg > .st0')
+
+ await icon.nth(4).hover()
+ await expect(svg).toHaveAttribute(
+ 'd',
+ 'M12 1c-.4 0-.8.1-1.1.3-.4.2-.6.5-.8.9L7.8 7l-5 .8c-.8.1-1.4.7-1.7 1.4s-.1 1.6.5 2.2l3.7 3.8-.9 5.4c-.1.6.1 1.2.5 1.7s1 .8 1.6.8c.4 0 .7-.1 1-.3l4.4-2.5 4.4 2.5c.3.2.7.3 1 .3.6 0 1.2-.3 1.6-.8.4-.5.6-1.1.5-1.7l-.9-5.4 3.7-3.8c.6-.6.7-1.4.5-2.2-.3-.8-.9-1.3-1.7-1.4L16 7l-2.2-4.8c-.2-.4-.5-.7-.8-.9-.2-.2-.6-.3-1-.3z'
+ )
+ })
+})
diff --git a/examples/docs/resources/pc/demo/rate/not-selected-color.spec.js b/examples/docs/resources/pc/demo/rate/not-selected-color.spec.js
new file mode 100644
index 000000000..9b8eb4684
--- /dev/null
+++ b/examples/docs/resources/pc/demo/rate/not-selected-color.spec.js
@@ -0,0 +1,18 @@
+import { test, expect } from '@playwright/test'
+
+test.describe('Rate 自定义未选中图标类名', () => {
+ test('自定义未选中图标', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/rate/not-selected-color')
+
+ const icon = page.locator('.tiny-rate__star > .tiny-svg')
+
+ await expect(icon.nth(4)).toHaveCSS('fill', 'rgb(255, 0, 0)')
+
+ await icon.nth(4).hover()
+ await expect(icon.nth(4)).toHaveCSS('fill', 'rgb(255, 187, 51)')
+
+ await icon.nth(4).click()
+ await expect(icon.nth(4)).toHaveCSS('fill', 'rgb(255, 187, 51)')
+ })
+})
diff --git a/examples/docs/resources/pc/demo/rate/radio-rate.spec.js b/examples/docs/resources/pc/demo/rate/radio-rate.spec.js
new file mode 100644
index 000000000..b9a5b5073
--- /dev/null
+++ b/examples/docs/resources/pc/demo/rate/radio-rate.spec.js
@@ -0,0 +1,13 @@
+import { test, expect } from '@playwright/test'
+
+test('单选模式', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/rate/radio-rate')
+
+ const icon = page.locator('.tiny-rate__star > .tiny-svg')
+
+ await icon.last().click()
+ await expect(icon.last()).toHaveCSS('fill', 'rgb(255, 187, 51)')
+ await expect(icon.first()).toHaveCSS('fill', 'rgba(25, 25, 25, 0.05)')
+ await expect(icon.nth(1)).toHaveCSS('fill', 'rgba(25, 25, 25, 0.05)')
+})
diff --git a/examples/docs/resources/pc/demo/rate/rate-events.spec.js b/examples/docs/resources/pc/demo/rate/rate-events.spec.js
new file mode 100644
index 000000000..88c585f47
--- /dev/null
+++ b/examples/docs/resources/pc/demo/rate/rate-events.spec.js
@@ -0,0 +1,14 @@
+import { test, expect } from '@playwright/test'
+
+test.describe('rate change事件', () => {
+ test('分数改变时事件', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/rate/rate-events')
+
+ const icon = page.locator('.tiny-rate__star > .tiny-svg')
+ const modal = page.locator('.tiny-modal__box')
+
+ await icon.nth(4).click()
+ await expect(modal).toBeVisible()
+ })
+})
diff --git a/examples/docs/resources/pc/demo/rate/show-score.spec.js b/examples/docs/resources/pc/demo/rate/show-score.spec.js
new file mode 100644
index 000000000..dbafae9b1
--- /dev/null
+++ b/examples/docs/resources/pc/demo/rate/show-score.spec.js
@@ -0,0 +1,15 @@
+import { test, expect } from '@playwright/test'
+
+test.describe('rate 分数显示及分数模板', () => {
+ test('分数显示', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/rate/show-score')
+
+ const icon = page.locator('.tiny-rate__star > .tiny-svg')
+ const score = page.locator('.tiny-rate__text')
+
+ await expect(score).toBeVisible()
+ await icon.nth(0).click()
+ await expect(score).toHaveText(/您的评分是1/)
+ })
+})
diff --git a/examples/docs/resources/pc/demo/rate/size-and-space.spec.js b/examples/docs/resources/pc/demo/rate/size-and-space.spec.js
new file mode 100644
index 000000000..8c00bce6d
--- /dev/null
+++ b/examples/docs/resources/pc/demo/rate/size-and-space.spec.js
@@ -0,0 +1,14 @@
+import { test, expect } from '@playwright/test'
+
+test.describe('rate 大小及占位宽度', () => {
+ test('自定义图标大小及占位宽度', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/rate/size-and-space')
+
+ const rate = page.locator('.tiny-rate__star')
+ const svg = page.locator('.tiny-rate__star > .tiny-svg')
+
+ await expect(rate.first()).toHaveCSS('width', '36px')
+ await expect(svg.nth(1)).toHaveCSS('font-size', '26px')
+ })
+})
diff --git a/examples/docs/resources/pc/demo/rate/text-on-bottom.spec.js b/examples/docs/resources/pc/demo/rate/text-on-bottom.spec.js
new file mode 100644
index 000000000..3ec9ba86b
--- /dev/null
+++ b/examples/docs/resources/pc/demo/rate/text-on-bottom.spec.js
@@ -0,0 +1,23 @@
+import { test, expect } from '@playwright/test'
+
+test.describe('rate 图标下方文字提示', () => {
+ test('图标下文字提示', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/rate/text-on-bottom')
+
+ const text = page.locator('.tiny-rate__bottom-text')
+ // 图标下方文字可见
+ await expect(text.nth(0)).toBeVisible()
+ await expect(text.nth(1)).toBeVisible()
+ await expect(text.nth(2)).toBeVisible()
+ await expect(text.nth(3)).toBeVisible()
+ await expect(text.nth(4)).toBeVisible()
+
+ // 分值与提示图标下方提示文字对应
+ await expect(text.nth(0)).toHaveText(/很差/)
+ await expect(text.nth(1)).toHaveText(/差/)
+ await expect(text.nth(2)).toHaveText(/一般/)
+ await expect(text.nth(3)).toHaveText(/好/)
+ await expect(text.nth(4)).toHaveText(/很好/)
+ })
+})
diff --git a/examples/docs/resources/pc/demo/rate/texts-and-text-color.spec.js b/examples/docs/resources/pc/demo/rate/texts-and-text-color.spec.js
new file mode 100644
index 000000000..51259c0ca
--- /dev/null
+++ b/examples/docs/resources/pc/demo/rate/texts-and-text-color.spec.js
@@ -0,0 +1,31 @@
+import { test, expect } from '@playwright/test'
+
+test.describe('rate 辅助文字及文字颜色', () => {
+ test('辅助文字及文字颜色', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/rate/texts-and-text-color')
+
+ const icon = page.locator('.tiny-rate__star > .tiny-svg')
+ const text = page.locator('.tiny-rate__text')
+
+ // 辅助文字可见及颜色
+ await expect(text).toBeVisible()
+ await expect(text).toHaveCSS('color', 'rgb(255, 0, 0)')
+
+ // 选中值与辅助文字对应
+ await icon.nth(0).click()
+ await expect(text).toHaveText('很差')
+
+ await icon.nth(1).click()
+ await expect(text).toHaveText('差')
+
+ await icon.nth(2).click()
+ await expect(text).toHaveText('一般')
+
+ await icon.nth(3).click()
+ await expect(text).toHaveText('好')
+
+ await icon.nth(4).click()
+ await expect(text).toHaveText('很好')
+ })
+})
diff --git a/examples/docs/resources/pc/demo/rate/threshold-value.spec.js b/examples/docs/resources/pc/demo/rate/threshold-value.spec.js
new file mode 100644
index 000000000..70c29f1ff
--- /dev/null
+++ b/examples/docs/resources/pc/demo/rate/threshold-value.spec.js
@@ -0,0 +1,33 @@
+import { test, expect } from '@playwright/test'
+
+test.describe('rate 自定义三分段界限值', () => {
+ test('三段分界限值', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/rate/threshold-value')
+
+ // hover时三分段颜色
+ const icon = page.locator('.tiny-rate__star > .tiny-svg')
+ await icon.nth(0).hover()
+ await expect(icon.nth(0)).toHaveCSS('fill', 'rgb(250, 219, 20)')
+ await icon.nth(1).hover()
+ await expect(icon.nth(1)).toHaveCSS('fill', 'rgb(255, 122, 69)')
+ await icon.nth(2).hover()
+ await expect(icon.nth(2)).toHaveCSS('fill', 'rgb(255, 122, 69)')
+ await icon.nth(3).hover()
+ await expect(icon.nth(3)).toHaveCSS('fill', 'rgb(255, 169, 64)')
+ await icon.nth(4).hover()
+ await expect(icon.nth(4)).toHaveCSS('fill', 'rgb(255, 169, 64)')
+
+ // 选中时时三分段颜色
+ await icon.nth(0).click()
+ await expect(icon.nth(0)).toHaveCSS('fill', 'rgb(250, 219, 20)')
+ await icon.nth(1).click()
+ await expect(icon.nth(1)).toHaveCSS('fill', 'rgb(255, 122, 69)')
+ await icon.nth(2).click()
+ await expect(icon.nth(2)).toHaveCSS('fill', 'rgb(255, 122, 69)')
+ await icon.nth(3).click()
+ await expect(icon.nth(3)).toHaveCSS('fill', 'rgb(255, 169, 64)')
+ await icon.nth(4).click()
+ await expect(icon.nth(4)).toHaveCSS('fill', 'rgb(255, 169, 64)')
+ })
+})
diff --git a/examples/docs/resources/pc/demo/row/gutter.vue b/examples/docs/resources/pc/demo/row/gutter.vue
index 66d867779..06833d248 100644
--- a/examples/docs/resources/pc/demo/row/gutter.vue
+++ b/examples/docs/resources/pc/demo/row/gutter.vue
@@ -1,7 +1,7 @@
-
+
默认
diff --git a/examples/docs/resources/pc/demo/scroll-text/basic-usage.spec.ts b/examples/docs/resources/pc/demo/scroll-text/basic-usage.spec.ts
new file mode 100644
index 000000000..edec847dd
--- /dev/null
+++ b/examples/docs/resources/pc/demo/scroll-text/basic-usage.spec.ts
@@ -0,0 +1,7 @@
+import { test, expect } from '@playwright/test'
+
+test('基本用法', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/scroll-text/basic-usage')
+ await expect(page.locator('.tiny-scroll-text__content')).toHaveCSS('animation-name', 'moveLeft')
+})
diff --git a/examples/docs/resources/pc/demo/scroll-text/custom-scroll-text.spec.ts b/examples/docs/resources/pc/demo/scroll-text/custom-scroll-text.spec.ts
new file mode 100644
index 000000000..796a3696c
--- /dev/null
+++ b/examples/docs/resources/pc/demo/scroll-text/custom-scroll-text.spec.ts
@@ -0,0 +1,7 @@
+import { test, expect } from '@playwright/test'
+
+test('自定义文本内容', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/scroll-text/custom-scroll-text')
+ await expect(page.getByText('设置 text 自定义滚动的文本内容')).toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/scroll-text/custom-text-style.spec.ts b/examples/docs/resources/pc/demo/scroll-text/custom-text-style.spec.ts
new file mode 100644
index 000000000..dd658c900
--- /dev/null
+++ b/examples/docs/resources/pc/demo/scroll-text/custom-text-style.spec.ts
@@ -0,0 +1,7 @@
+import { test, expect } from '@playwright/test'
+
+test('自定义文本样式', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/scroll-text/custom-text-style')
+ await expect(page.locator('.scrollclass')).toHaveCSS('background-color', 'rgb(255, 0, 0)')
+})
diff --git a/examples/docs/resources/pc/demo/scroll-text/hover-stop.spec.ts b/examples/docs/resources/pc/demo/scroll-text/hover-stop.spec.ts
new file mode 100644
index 000000000..099f26c24
--- /dev/null
+++ b/examples/docs/resources/pc/demo/scroll-text/hover-stop.spec.ts
@@ -0,0 +1,8 @@
+import { test, expect } from '@playwright/test'
+
+test('鼠标悬停时文本停止滚动', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/scroll-text/hover-stop')
+ await page.locator('.tiny-scroll-text__content').dispatchEvent('mouseenter')
+ await expect(page.locator('.tiny-scroll-text__content')).toHaveCSS('animation-play-state', 'paused')
+})
diff --git a/examples/docs/resources/pc/demo/scroll-text/scroll-direction.spec.ts b/examples/docs/resources/pc/demo/scroll-text/scroll-direction.spec.ts
new file mode 100644
index 000000000..e5f26f471
--- /dev/null
+++ b/examples/docs/resources/pc/demo/scroll-text/scroll-direction.spec.ts
@@ -0,0 +1,10 @@
+import { test, expect } from '@playwright/test'
+
+test('文字滚动方向', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/scroll-text/scroll-direction')
+ await expect(page.locator('.tiny-scroll-text__content').nth(0)).toHaveCSS('animation-name', 'moveLeft')
+ await expect(page.locator('.tiny-scroll-text__content').nth(1)).toHaveCSS('animation-name', 'moveRight')
+ await expect(page.locator('.tiny-scroll-text__content').nth(2)).toHaveCSS('animation-name', 'moveUp')
+ await expect(page.locator('.tiny-scroll-text__content').nth(3)).toHaveCSS('animation-name', 'moveDown')
+})
diff --git a/examples/docs/resources/pc/demo/scroll-text/scroll-time.spec.ts b/examples/docs/resources/pc/demo/scroll-text/scroll-time.spec.ts
new file mode 100644
index 000000000..2575d1be9
--- /dev/null
+++ b/examples/docs/resources/pc/demo/scroll-text/scroll-time.spec.ts
@@ -0,0 +1,7 @@
+import { test, expect } from '@playwright/test'
+
+test('滚动时间间隔', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/scroll-text/scroll-time')
+ await expect(page.locator('.tiny-scroll-text__content')).toHaveCSS('animation-duration', '10s')
+})
diff --git a/examples/docs/resources/pc/demo/scroll-text/slots.spec.ts b/examples/docs/resources/pc/demo/scroll-text/slots.spec.ts
new file mode 100644
index 000000000..82c594609
--- /dev/null
+++ b/examples/docs/resources/pc/demo/scroll-text/slots.spec.ts
@@ -0,0 +1,7 @@
+import { test, expect } from '@playwright/test'
+
+test('通过 solt 插槽自定义文本内容', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/scroll-text/slots')
+ await expect(page.getByText('通过插槽设置滚动的文本内容')).toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/search/basic-usage.spec.ts b/examples/docs/resources/pc/demo/search/basic-usage.spec.ts
new file mode 100644
index 000000000..194c032e6
--- /dev/null
+++ b/examples/docs/resources/pc/demo/search/basic-usage.spec.ts
@@ -0,0 +1,20 @@
+import { expect, test } from '@playwright/test'
+
+test('是否正常渲染', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://127.0.0.1:7130/pc/search/basic-usage')
+
+ const search = page.locator('#preview .tiny-search')
+ const first = search.locator('.tiny-search__line')
+ const selector = search.locator('.tiny-search__selector')
+ const firstPresent = first.locator('.tiny-search__present')
+ const firstInput = first.locator('.tiny-search__input')
+ const icon = first.locator('a > svg')
+
+ await expect(first).toBeVisible()
+ await expect(icon).toBeVisible()
+ await expect(selector).not.toBeVisible()
+ await expect(firstPresent).not.toBeVisible()
+ await firstInput.fill('123')
+ await expect(firstInput).toHaveValue('123')
+})
diff --git a/examples/docs/resources/pc/demo/search/change-events.spec.ts b/examples/docs/resources/pc/demo/search/change-events.spec.ts
new file mode 100644
index 000000000..b535a321e
--- /dev/null
+++ b/examples/docs/resources/pc/demo/search/change-events.spec.ts
@@ -0,0 +1,13 @@
+import { expect, test } from '@playwright/test'
+
+test('cahnge事件是否正常触发', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/search/change-events')
+
+ const input = page.locator('.tiny-search').getByRole('textbox')
+ const modalText = page.locator('.tiny-modal').getByText('111')
+
+ await input.fill('111')
+ await input.press('Enter')
+ await modalText.waitFor({ state: 'attached', timeout: 100 })
+})
diff --git a/examples/docs/resources/pc/demo/search/clearable.spec.ts b/examples/docs/resources/pc/demo/search/clearable.spec.ts
new file mode 100644
index 000000000..06addb8a9
--- /dev/null
+++ b/examples/docs/resources/pc/demo/search/clearable.spec.ts
@@ -0,0 +1,14 @@
+import { expect, test } from '@playwright/test'
+
+test('清空输入值', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/search/clearable')
+
+ const input = page.locator('.tiny-search__input')
+ const close = page.locator('.tiny-search__input-btn a').first()
+
+ await input.fill('123')
+ await expect(input).toHaveValue('123')
+ await close.click()
+ await expect(input).toHaveValue('')
+})
diff --git a/examples/docs/resources/pc/demo/search/custom-search-types.spec.ts b/examples/docs/resources/pc/demo/search/custom-search-types.spec.ts
new file mode 100644
index 000000000..e79c4b004
--- /dev/null
+++ b/examples/docs/resources/pc/demo/search/custom-search-types.spec.ts
@@ -0,0 +1,16 @@
+import { expect, test } from '@playwright/test'
+
+test('自定义下拉选择的内容', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/search/custom-search-types')
+
+ const search = page.locator('.tiny-search')
+ const expand = search.locator('.icon-outer')
+ const option = search.locator('.tiny-search__poplist-item').filter({ hasText: '插槽3' })
+ const text = search.locator('.tiny-search__text')
+
+ await expect(text).toHaveText('插槽1')
+ await expand.click()
+ await option.click() // 下拉选择
+ await expect(text).toHaveText('插槽3')
+})
diff --git a/examples/docs/resources/pc/demo/search/default-value.spec.ts b/examples/docs/resources/pc/demo/search/default-value.spec.ts
new file mode 100644
index 000000000..f113be452
--- /dev/null
+++ b/examples/docs/resources/pc/demo/search/default-value.spec.ts
@@ -0,0 +1,10 @@
+import { expect, test } from '@playwright/test'
+
+test('设置默认值搜索', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/search/default-value')
+
+ const input = page.locator('.tiny-search__input')
+
+ await expect(input).toHaveValue('搜索')
+})
diff --git a/examples/docs/resources/pc/demo/search/mini-mode.spec.ts b/examples/docs/resources/pc/demo/search/mini-mode.spec.ts
new file mode 100644
index 000000000..43e6c50f7
--- /dev/null
+++ b/examples/docs/resources/pc/demo/search/mini-mode.spec.ts
@@ -0,0 +1,27 @@
+import { expect, test } from '@playwright/test'
+
+test('迷你模式', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/search/mini-mode')
+
+ const search = page.locator('.tiny-search.mini')
+ const blank = page.getByRole('code').first()
+ const line = search.locator('.tiny-search__line')
+ const input = search.locator('.tiny-search__input')
+ const icon = search.locator('.tiny-search__input-btn > a')
+
+ await expect(search).toHaveClass(/collapse/)
+ await expect(input).not.toBeVisible()
+ await expect(line).toHaveCSS('width', '28px')
+ await expect(line).toHaveCSS('border-radius', '28px')
+
+ await icon.click()
+ await expect(search).not.toHaveClass(/collapse/)
+ await expect(input).toBeVisible()
+
+ await blank.click() // 点击空白处收回
+ await expect(search).toHaveClass(/collapse/)
+ await expect(input).not.toBeVisible()
+ await expect(line).toHaveCSS('width', '28px')
+ await expect(line).toHaveCSS('border-radius', '28px')
+})
diff --git a/examples/docs/resources/pc/demo/search/search-events.spec.ts b/examples/docs/resources/pc/demo/search/search-events.spec.ts
new file mode 100644
index 000000000..5b18bc5dc
--- /dev/null
+++ b/examples/docs/resources/pc/demo/search/search-events.spec.ts
@@ -0,0 +1,18 @@
+import { expect, test } from '@playwright/test'
+
+test('搜索事件是否正常触发', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/search/search-events')
+
+ const modal = page.locator('.tiny-modal')
+ const input = page.locator('.tiny-search').getByRole('textbox')
+ const modalText = modal.getByText('111')
+ const button = page.locator('.tiny-search__input-btn > a')
+ const empty = modal.getByText('undefined')
+
+ await button.click()
+ await expect(empty).toBeVisible()
+ await input.fill('111')
+ await button.click()
+ await modalText.waitFor({ state: 'attached', timeout: 100 })
+})
diff --git a/examples/docs/resources/pc/demo/search/search-types.spec.ts b/examples/docs/resources/pc/demo/search/search-types.spec.ts
new file mode 100644
index 000000000..4b52b77ab
--- /dev/null
+++ b/examples/docs/resources/pc/demo/search/search-types.spec.ts
@@ -0,0 +1,16 @@
+import { expect, test } from '@playwright/test'
+
+test('下拉选择搜索类型', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/search/search-types')
+
+ const search = page.locator('.tiny-search')
+ const expand = search.locator('.icon-outer')
+ const option = search.locator('.tiny-search__poplist-item').filter({ hasText: '找文档' })
+ const text = search.locator('.tiny-search__text')
+
+ await expect(text).toHaveText('找人')
+ await expand.click()
+ await option.click() // 下拉选择
+ await expect(text).toHaveText('找文档')
+})
diff --git a/examples/docs/resources/pc/demo/search/select-events.spec.ts b/examples/docs/resources/pc/demo/search/select-events.spec.ts
new file mode 100644
index 000000000..f46a7280f
--- /dev/null
+++ b/examples/docs/resources/pc/demo/search/select-events.spec.ts
@@ -0,0 +1,18 @@
+import { expect, test } from '@playwright/test'
+
+test('选择事件是否正常触发', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/search/select-events')
+
+ const search = page.locator('.tiny-search')
+ const expand = search.locator('.icon-outer')
+ const option = search.locator('.tiny-search__poplist-item').filter({ hasText: '找谁' })
+ const text = search.locator('.tiny-search__text')
+ const modalText = page.locator('.tiny-modal').getByText('找谁')
+
+ await expect(text).toHaveText('找人')
+ await expand.click()
+ await option.click() // 下拉选择
+ await expect(text).toHaveText('找谁')
+ await modalText.waitFor({ state: 'attached', timeout: 100 })
+})
diff --git a/examples/docs/resources/pc/demo/search/show-selected-types.spec.ts b/examples/docs/resources/pc/demo/search/show-selected-types.spec.ts
new file mode 100644
index 000000000..c5d1ce23c
--- /dev/null
+++ b/examples/docs/resources/pc/demo/search/show-selected-types.spec.ts
@@ -0,0 +1,16 @@
+import { expect, test } from '@playwright/test'
+
+test('自定义搜索并且展示的字段', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/search/show-selected-types')
+
+ const search = page.locator('.tiny-search')
+ const expand = search.locator('.icon-outer')
+ const option = search.locator('.tiny-search__poplist-item').filter({ hasText: '找谁' })
+ const text = search.locator('.tiny-search__present > b')
+
+ await expect(text).toHaveText('找人')
+ await expand.click()
+ await option.click() // 下拉选择
+ await expect(text).toHaveText('找谁')
+})
diff --git a/examples/docs/resources/pc/demo/search/slot-prefix.spec.ts b/examples/docs/resources/pc/demo/search/slot-prefix.spec.ts
new file mode 100644
index 000000000..3731be2a7
--- /dev/null
+++ b/examples/docs/resources/pc/demo/search/slot-prefix.spec.ts
@@ -0,0 +1,12 @@
+import { expect, test } from '@playwright/test'
+
+test('左侧插槽是否正常显示', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/search/slot-prefix')
+
+ const search = page.locator('.tiny-search')
+ const prefix = search.locator('.tiny-search__prefix > svg')
+
+ await expect(prefix).toBeVisible()
+ await expect(prefix).toHaveCSS('font-size', '14px')
+})
diff --git a/examples/docs/resources/pc/demo/search/transparent-mode.spec.ts b/examples/docs/resources/pc/demo/search/transparent-mode.spec.ts
new file mode 100644
index 000000000..c5d60c04a
--- /dev/null
+++ b/examples/docs/resources/pc/demo/search/transparent-mode.spec.ts
@@ -0,0 +1,34 @@
+import { expect, test } from '@playwright/test'
+
+test('迷你模式下的透明模式', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/search/transparent-mode')
+
+ const search = page.locator('.tiny-search.mini')
+ const blank = page.getByRole('code').first()
+ const option = search.locator('.tiny-search__poplist-item').filter({ hasText: '找文档' })
+ const line = search.locator('.tiny-search__line')
+ const input = search.locator('.tiny-search__input')
+ const icon = search.locator('.tiny-search__input-btn > a')
+ const text = search.locator('.tiny-search__text')
+ const expand = search.locator('.icon-outer')
+
+ await expect(search).toHaveClass(/collapse/)
+ await expect(input).not.toBeVisible()
+ await expect(line).toHaveCSS('width', '28px')
+ await expect(line).toHaveCSS('border-radius', '28px')
+
+ await icon.click()
+ await expect(search).not.toHaveClass(/collapse/)
+ await expect(input).toBeVisible()
+ await expect(text).toHaveText('找人')
+ await expand.click()
+ await option.click() // 下拉选择
+ await expect(text).toHaveText('找文档')
+
+ await blank.click() // 点击空白处收回
+ await expect(search).toHaveClass(/collapse/)
+ await expect(input).not.toBeVisible()
+ await expect(line).toHaveCSS('width', '28px')
+ await expect(line).toHaveCSS('border-radius', '28px')
+})
diff --git a/examples/docs/resources/pc/demo/select/allow-create.spec.ts b/examples/docs/resources/pc/demo/select/allow-create.spec.ts
new file mode 100644
index 000000000..f2d90a9e5
--- /dev/null
+++ b/examples/docs/resources/pc/demo/select/allow-create.spec.ts
@@ -0,0 +1,34 @@
+import { test, expect } from '@playwright/test'
+
+test('click', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/allow-create')
+ const input = page.locator('#preview .tiny-input__inner')
+ await input.click()
+ await input.fill('测试allow-create')
+ const KeyboardEvent = await page.evaluateHandle(() => new KeyboardEvent('keyup'))
+ await input.dispatchEvent('keyup', { KeyboardEvent })
+ await expect(input).toHaveValue('测试allow-create')
+ await page.getByRole('listitem').filter({ hasText: '测试allow-create' }).click()
+ await expect(input).toHaveValue('测试allow-create')
+ await input.click()
+ await expect(input).toHaveValue('')
+ await expect(page.getByRole('listitem').filter({ hasText: '测试allow-create' })).toHaveClass(/selected/)
+})
+
+test('press-enter', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/allow-create')
+ const input = page.locator('#preview .tiny-input__inner')
+ await input.click()
+
+ await input.press('a')
+ await input.press('b')
+ await input.press('Enter')
+
+ await expect(page.locator('.tiny-select-dropdown__wrap')).toBeHidden()
+ await expect(input).toHaveValue('ab')
+
+ await input.click()
+
+ await expect(input).toHaveValue('')
+ await expect(page.getByRole('listitem').filter({ hasText: 'ab' })).toHaveClass(/selected/)
+})
diff --git a/examples/docs/resources/pc/demo/select/automatic-dropdown.spec.ts b/examples/docs/resources/pc/demo/select/automatic-dropdown.spec.ts
new file mode 100644
index 000000000..66465d233
--- /dev/null
+++ b/examples/docs/resources/pc/demo/select/automatic-dropdown.spec.ts
@@ -0,0 +1,14 @@
+import { test, expect } from '@playwright/test'
+
+test('automatic-dropdown', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/automatic-dropdown')
+ const input = page.locator('#preview .tiny-input__inner')
+
+ await page.getByRole('button', { name: '点击获取焦点' }).click()
+ await page.getByRole('listitem').filter({ hasText: '双皮奶' }).click()
+ await expect(input).toHaveValue('双皮奶')
+ await input.click()
+ await expect(page.getByRole('listitem').filter({ hasText: '双皮奶' })).toHaveClass(/selected/)
+ await page.locator('.rel').click()
+ await expect(page.locator('div').filter({ hasText: '黄金糕双皮奶蚵仔煎龙须面北京烤鸭' }).first()).toBeHidden()
+})
diff --git a/examples/docs/resources/pc/demo/select/basic-usage.spec.ts b/examples/docs/resources/pc/demo/select/basic-usage.spec.ts
new file mode 100644
index 000000000..40f4034e3
--- /dev/null
+++ b/examples/docs/resources/pc/demo/select/basic-usage.spec.ts
@@ -0,0 +1,18 @@
+import { test, expect } from '@playwright/test'
+
+test('basic', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/basic-usage')
+ const input = page.locator('#preview .tiny-input__inner')
+
+ await input.click()
+ await page.getByRole('listitem').filter({ hasText: '蚵仔煎' }).click()
+ await expect(input).toHaveValue('蚵仔煎')
+ await page.locator('#preview svg').nth(1).click()
+ await expect(page.getByRole('listitem').filter({ hasText: '蚵仔煎' })).toHaveClass(/selected/)
+ await page.getByRole('listitem').filter({ hasText: '北京烤鸭' }).click()
+ await expect(input).toHaveValue('北京烤鸭')
+ await input.click()
+ await expect(page.getByRole('listitem').filter({ hasText: '北京烤鸭' })).toHaveClass(/selected/)
+ await page.locator('.rel').click()
+ await expect(page.locator('div').filter({ hasText: '黄金糕双皮奶蚵仔煎龙须面北京烤鸭' }).first()).toBeHidden()
+})
diff --git a/examples/docs/resources/pc/demo/select/binding-obj.spec.ts b/examples/docs/resources/pc/demo/select/binding-obj.spec.ts
new file mode 100644
index 000000000..5b016ebde
--- /dev/null
+++ b/examples/docs/resources/pc/demo/select/binding-obj.spec.ts
@@ -0,0 +1,16 @@
+import { test, expect } from '@playwright/test'
+
+test('binding-obj', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/binding-obj')
+ const input = page.locator('#preview .tiny-input__inner')
+ const valueLocator = page.locator('#preview .value')
+
+ await input.click()
+ await page.getByRole('listitem').filter({ hasText: '龙须面' }).click()
+ await expect(input).toHaveValue('龙须面')
+ await expect(valueLocator).toHaveText('{ "val": "选项4", "id": 4 }')
+ await input.click()
+ await page.getByRole('listitem').filter({ hasText: '蚵仔煎' }).click()
+ await expect(input).toHaveValue('蚵仔煎')
+ await expect(valueLocator).toHaveText('{ "val": "选项3", "id": 3 }')
+})
diff --git a/examples/docs/resources/pc/demo/select/binding-obj.vue b/examples/docs/resources/pc/demo/select/binding-obj.vue
index 14d48928d..4cd8b41d7 100644
--- a/examples/docs/resources/pc/demo/select/binding-obj.vue
+++ b/examples/docs/resources/pc/demo/select/binding-obj.vue
@@ -3,7 +3,9 @@
- {{ value }}
+
+ {{ value }}
+
diff --git a/examples/docs/resources/pc/demo/select/cache-usage.spec.ts b/examples/docs/resources/pc/demo/select/cache-usage.spec.ts
new file mode 100644
index 000000000..1034d9bb7
--- /dev/null
+++ b/examples/docs/resources/pc/demo/select/cache-usage.spec.ts
@@ -0,0 +1,14 @@
+import { expect, test } from '@playwright/test'
+
+test('cache-op', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/cache-usage')
+ const input = page.locator('#preview .tiny-input__inner')
+ const cacheValue = page.locator('#preview .cache-value')
+
+ await input.click()
+ await page.getByRole('listitem').filter({ hasText: '黄金糕' }).click()
+ await expect(cacheValue).toContainText(['选项1'])
+ await input.click()
+ await page.getByRole('listitem').filter({ hasText: '双皮奶' }).click()
+ await expect(cacheValue).toContainText(['选项2'])
+})
diff --git a/examples/docs/resources/pc/demo/select/cache-usage.vue b/examples/docs/resources/pc/demo/select/cache-usage.vue
index 4029cd41a..2ba9ce522 100644
--- a/examples/docs/resources/pc/demo/select/cache-usage.vue
+++ b/examples/docs/resources/pc/demo/select/cache-usage.vue
@@ -1,5 +1,17 @@
-
+
+
+ {{ cacheValue }}
+
+
diff --git a/examples/docs/resources/pc/demo/select/clearable.spec.ts b/examples/docs/resources/pc/demo/select/clearable.spec.ts
new file mode 100644
index 000000000..702633a8e
--- /dev/null
+++ b/examples/docs/resources/pc/demo/select/clearable.spec.ts
@@ -0,0 +1,15 @@
+import { test, expect } from '@playwright/test'
+
+test('clearable', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/clearable')
+ const input = page.locator('#preview .tiny-input__inner')
+ const icon = page.locator('#preview .tiny-input__suffix')
+
+ await expect(input).toHaveValue('蚵仔煎')
+ await input.hover()
+ await icon.click()
+ await expect(input).toHaveValue('')
+ await icon.click()
+ await page.getByRole('listitem').filter({ hasText: '双皮奶' }).click()
+ await expect(input).toHaveValue('双皮奶')
+})
diff --git a/examples/docs/resources/pc/demo/select/collapse-tags.spec.ts b/examples/docs/resources/pc/demo/select/collapse-tags.spec.ts
new file mode 100644
index 000000000..334034fc4
--- /dev/null
+++ b/examples/docs/resources/pc/demo/select/collapse-tags.spec.ts
@@ -0,0 +1,18 @@
+import { test, expect } from '@playwright/test'
+
+test('collapse-tags', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/collapse-tags')
+ await expect(page.locator('span.tiny-tag')).toHaveCount(2)
+ await expect(page.locator('span').filter({ hasText: '黄金糕' }).nth(1)).toBeVisible()
+ await expect(page.locator('span').filter({ hasText: '+ 1' }).nth(1)).toBeVisible()
+ await page.getByText('黄金糕+ 1').click()
+ await expect(page.getByRole('listitem').filter({ hasText: '黄金糕' })).toHaveClass(/selected/)
+ await expect(page.getByRole('listitem').filter({ hasText: '双皮奶' })).toHaveClass(/selected/)
+ await page.getByRole('listitem').filter({ hasText: '黄金糕' }).locator('span').nth(2).click()
+ await expect(page.locator('span').filter({ hasText: '+ 1' }).nth(1)).toBeHidden()
+ await expect(page.locator('span.tiny-tag')).toHaveCount(1)
+ await page.getByRole('listitem').filter({ hasText: '蚵仔煎' }).locator('span').nth(2).click()
+ await page.getByRole('listitem').filter({ hasText: '北京烤鸭' }).locator('span').nth(2).click()
+ await expect(page.locator('span').filter({ hasText: '+ 2' }).nth(1)).toBeVisible()
+ await expect(page.locator('span.tiny-tag')).toHaveCount(2)
+})
diff --git a/examples/docs/resources/pc/demo/select/custom-options.spec.ts b/examples/docs/resources/pc/demo/select/custom-options.spec.ts
new file mode 100644
index 000000000..75b42fa40
--- /dev/null
+++ b/examples/docs/resources/pc/demo/select/custom-options.spec.ts
@@ -0,0 +1,11 @@
+import { test, expect } from '@playwright/test'
+
+test('option-slot', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/custom-options')
+ const input = page.locator('#preview .tiny-input__inner')
+
+ await input.click()
+ expect(page.getByText('选项1')).toHaveCSS('float', 'right')
+ await page.getByText('黄金糕选项1').click()
+ await expect(input).toHaveValue('黄金糕')
+})
diff --git a/examples/docs/resources/pc/demo/select/custom-prefix.spec.ts b/examples/docs/resources/pc/demo/select/custom-prefix.spec.ts
new file mode 100644
index 000000000..9760a2885
--- /dev/null
+++ b/examples/docs/resources/pc/demo/select/custom-prefix.spec.ts
@@ -0,0 +1,11 @@
+import { test, expect } from '@playwright/test'
+
+test('custom-prefix', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/custom-prefix')
+ const prefix = page.locator('#preview .tiny-input .tiny-input__prefix .tiny-svg')
+
+ await expect(prefix).toBeVisible()
+ await page.locator('.tiny-select__tags').click()
+ await page.getByRole('listitem').filter({ hasText: '黄金糕' }).click()
+ await expect(page.locator('.tiny-select span').filter({ hasText: '黄金糕' }).nth(1)).toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/select/custom-reference-slot.spec.ts b/examples/docs/resources/pc/demo/select/custom-reference-slot.spec.ts
new file mode 100644
index 000000000..c461a305b
--- /dev/null
+++ b/examples/docs/resources/pc/demo/select/custom-reference-slot.spec.ts
@@ -0,0 +1,8 @@
+import { test } from '@playwright/test'
+
+test('custom-reference', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/custom-reference-slot')
+ const reference = page.locator('#preview .custom-reference')
+ await reference.click()
+ await page.getByRole('listitem').filter({ hasText: '黄金糕' }).click()
+})
diff --git a/examples/docs/resources/pc/demo/select/custom-reference-slot.vue b/examples/docs/resources/pc/demo/select/custom-reference-slot.vue
index c039ab2cd..81f8eeb9c 100644
--- a/examples/docs/resources/pc/demo/select/custom-reference-slot.vue
+++ b/examples/docs/resources/pc/demo/select/custom-reference-slot.vue
@@ -1,7 +1,7 @@
-
diff --git a/examples/docs/resources/pc/demo/select/disable-grid-select-radio.spec.ts b/examples/docs/resources/pc/demo/select/disable-grid-select-radio.spec.ts
new file mode 100644
index 000000000..0da8fb85c
--- /dev/null
+++ b/examples/docs/resources/pc/demo/select/disable-grid-select-radio.spec.ts
@@ -0,0 +1,27 @@
+import { test, expect } from '@playwright/test'
+
+test('test-grid-select', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/disable-grid-select-radio')
+ const tags = page.locator('.grid-select .tiny-tag')
+
+ await page.locator('.tiny-select__tags').click()
+ await page.getByRole('row', { name: '华南区 广东省 广州市' }).getByRole('cell').first().click()
+
+ await expect(tags.filter({ hasText: '广州市' })).toHaveCount(1)
+ await page.getByRole('row', { name: '华南区 广东省 深圳市' }).getByRole('cell').first().click()
+ await expect(tags.filter({ hasText: '深圳市' })).toHaveCount(0)
+})
+
+test('test-grid-radio', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/disable-grid-select-radio')
+
+ const input = page.locator('.grid-radio .tiny-input__inner')
+ await input.click()
+ await page.getByRole('row', { name: '华南区 广东省 深圳市' }).getByRole('cell').first().click()
+ await expect(page.getByPlaceholder('请选择').nth(1)).toHaveValue('深圳市')
+ await input.click()
+ await page.getByRole('row', { name: '华南区 广东省 广州市' }).getByRole('cell').first().click()
+ await expect(page.getByPlaceholder('请选择').nth(1)).toHaveValue('深圳市')
+ await page.getByRole('row', { name: '华南区 广东省 佛山市' }).getByRole('cell').first().click()
+ await expect(page.getByPlaceholder('请选择').nth(1)).toHaveValue('佛山市')
+})
diff --git a/examples/docs/resources/pc/demo/select/disable-grid-select-radio.vue b/examples/docs/resources/pc/demo/select/disable-grid-select-radio.vue
index 5b73992d7..d2a63bcf9 100644
--- a/examples/docs/resources/pc/demo/select/disable-grid-select-radio.vue
+++ b/examples/docs/resources/pc/demo/select/disable-grid-select-radio.vue
@@ -2,6 +2,7 @@
{
+ await page.goto('http://localhost:7130/pc/select/disabled-and-selected-options')
+ const slect = page.locator('#preview .tiny-select')
+ const tags = page.locator('#preview .tiny-select .tiny-tag')
+ const listitem = page.getByRole('listitem')
+ await expect(tags.filter({ hasText: '黄金糕' }).locator('svg')).toHaveCount(0)
+ await slect.click()
+ await expect(listitem.filter({ hasText: '全部' })).toHaveCount(0)
+ await expect(listitem.filter({ hasText: '黄金糕' })).toHaveClass(/is-disabled/)
+ await page.getByRole('listitem').filter({ hasText: '双皮奶' }).click()
+ await expect(tags.filter({ hasText: '黄金糕' }).locator('.tiny-svg')).toHaveCount(0)
+ await expect(tags.filter({ hasText: '双皮奶' }).locator('.tiny-svg')).toHaveCount(1)
+ await page.getByRole('listitem').filter({ hasText: '黄金糕' }).click()
+ await expect(tags.filter({ hasText: '黄金糕' }).locator('.tiny-svg')).toHaveCount(0)
+})
diff --git a/examples/docs/resources/pc/demo/select/disabled-options.spec.ts b/examples/docs/resources/pc/demo/select/disabled-options.spec.ts
new file mode 100644
index 000000000..f75723234
--- /dev/null
+++ b/examples/docs/resources/pc/demo/select/disabled-options.spec.ts
@@ -0,0 +1,16 @@
+import { test, expect } from '@playwright/test'
+
+test('disabled-options', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/disabled-options')
+ const select = page.locator('#preview .tiny-select')
+ const tags = page.locator('#preview .tiny-select .tiny-tag')
+
+ await select.click()
+ await expect(page.getByRole('listitem').filter({ hasText: '黄金糕' })).toHaveClass(/is-disabled/)
+ await expect(page.getByRole('listitem').filter({ hasText: '蚵仔煎' })).toHaveClass(/is-disabled/)
+ await page.getByRole('listitem').filter({ hasText: '黄金糕' }).click()
+ await expect(tags).toHaveCount(0)
+ await page.getByRole('listitem').filter({ hasText: '双皮奶' }).click()
+ await expect(tags).toHaveCount(1)
+ await expect(tags.filter({ hasText: '双皮奶' })).toHaveCount(1)
+})
diff --git a/examples/docs/resources/pc/demo/select/disabled.spec.ts b/examples/docs/resources/pc/demo/select/disabled.spec.ts
new file mode 100644
index 000000000..aeb072c82
--- /dev/null
+++ b/examples/docs/resources/pc/demo/select/disabled.spec.ts
@@ -0,0 +1,8 @@
+import { test, expect } from '@playwright/test'
+
+test('disabled', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/disabled')
+ const input = page.locator('#preview .tiny-input__inner')
+ const hasDisabled = await input.evaluate((input) => input.hasAttribute('disabled'))
+ await expect(hasDisabled).toBe(true)
+})
diff --git a/examples/docs/resources/pc/demo/select/envts-change.spec.ts b/examples/docs/resources/pc/demo/select/envts-change.spec.ts
new file mode 100644
index 000000000..bde65e6e0
--- /dev/null
+++ b/examples/docs/resources/pc/demo/select/envts-change.spec.ts
@@ -0,0 +1,48 @@
+import { test, expect } from '@playwright/test'
+
+test('focus', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/envts-change')
+ const model = page.locator('.tiny-modal')
+ const input = page.locator('#preview .tiny-input__inner')
+
+ await input.click()
+ await page.waitForTimeout(500)
+ await expect(model.filter({ hasText: 'focus事件' })).toHaveCount(1)
+})
+
+test('change', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/envts-change')
+ const model = page.locator('.tiny-modal')
+ const input = page.locator('#preview .tiny-input__inner')
+
+ await input.click()
+ await page.getByRole('listitem').filter({ hasText: '黄金糕' }).click()
+ await expect(input).toHaveValue('黄金糕')
+ await page.waitForTimeout(500)
+ await expect(model.filter({ hasText: 'changes事件' })).toHaveCount(1)
+})
+
+test('clear', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/envts-change')
+ const model = page.locator('.tiny-modal')
+ const input = page.locator('#preview .tiny-input__inner')
+
+ await input.click()
+ await page.getByRole('listitem').filter({ hasText: '黄金糕' }).click()
+ await expect(input).toHaveValue('黄金糕')
+ input.hover()
+ await page.locator('#preview .tiny-input .tiny-input__suffix').click()
+ await page.waitForTimeout(500)
+ await expect(model.filter({ hasText: 'clear事件' })).toHaveCount(1)
+})
+
+test('blur', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/envts-change')
+ const model = page.locator('.tiny-modal')
+ const input = page.locator('#preview .tiny-input__inner')
+
+ await input.click()
+ await input.blur()
+ await page.waitForTimeout(500)
+ await expect(model.filter({ hasText: 'blur事件' })).toHaveCount(1)
+})
diff --git a/examples/docs/resources/pc/demo/select/envts-remove.spec.ts b/examples/docs/resources/pc/demo/select/envts-remove.spec.ts
new file mode 100644
index 000000000..ab02669d1
--- /dev/null
+++ b/examples/docs/resources/pc/demo/select/envts-remove.spec.ts
@@ -0,0 +1,29 @@
+import { test, expect } from '@playwright/test'
+
+test('remove-tag', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/envts-remove')
+ const model = page.locator('.tiny-modal')
+ const select = page.locator('#preview .tiny-select')
+ const tags = page.locator('#preview .tiny-select .tiny-tag')
+
+ await select.click()
+ await page.getByRole('listitem').filter({ hasText: '黄金糕' }).click()
+ await expect(tags.filter({ hasText: '黄金糕' })).toHaveCount(1)
+ await tags.filter({ hasText: '黄金糕' }).locator('.tiny-svg').click()
+ await page.waitForTimeout(500)
+ await expect(model.filter({ hasText: 'removeTag事件' })).toHaveCount(1)
+})
+
+test('visible-change', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/envts-remove')
+ const model = page.locator('.tiny-modal')
+ const input = page.locator('#preview .tiny-input__inner')
+ const select = page.locator('#preview .tiny-select')
+
+ await select.click()
+ await page.waitForTimeout(500)
+ await expect(model.filter({ hasText: 'visibleChange事件' })).toHaveCount(1)
+ await input.blur()
+ await page.waitForTimeout(500)
+ await expect(model.filter({ hasText: 'visibleChange事件' })).toHaveCount(1)
+})
diff --git a/examples/docs/resources/pc/demo/select/filter-method.spec.ts b/examples/docs/resources/pc/demo/select/filter-method.spec.ts
new file mode 100644
index 000000000..f1aa05439
--- /dev/null
+++ b/examples/docs/resources/pc/demo/select/filter-method.spec.ts
@@ -0,0 +1,38 @@
+import { expect, test } from '@playwright/test'
+
+test('filter-nothing', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/filter-method')
+ const input = page.locator('#preview .tiny-input__inner')
+
+ await input.click()
+ await input.press('1')
+ await expect(input).toHaveValue('1')
+ await input.press('Enter')
+
+ const listitems = await page.locator('.tiny-select-dropdown').getByRole('listitem').all()
+ listitems.forEach(async (item) => {
+ await expect(item).toHaveAttribute('display', 'none')
+ })
+})
+
+test('filter-something', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/filter-method')
+ const input = page.locator('#preview .tiny-input__inner')
+
+ await input.click()
+ await input.fill('双皮奶')
+ await expect(input).toHaveValue('双皮奶')
+ await input.press('Enter')
+
+ const listitems = await page
+ .locator('.tiny-select-dropdown')
+ .getByRole('listitem')
+ .filter({ hasNotText: '双皮奶' })
+ .all()
+ listitems.forEach(async (item) => {
+ await expect(item).toHaveAttribute('display', 'none')
+ })
+ await expect(page.locator('.tiny-select-dropdown').getByRole('listitem').filter({ hasText: '双皮奶' })).toBeVisible()
+ await page.locator('.tiny-select-dropdown').getByRole('listitem').filter({ hasText: '双皮奶' }).click()
+ await expect(input).toHaveValue('双皮奶')
+})
diff --git a/examples/docs/resources/pc/demo/select/focus-remote-method.spec.ts b/examples/docs/resources/pc/demo/select/focus-remote-method.spec.ts
new file mode 100644
index 000000000..bfd1cd13b
--- /dev/null
+++ b/examples/docs/resources/pc/demo/select/focus-remote-method.spec.ts
@@ -0,0 +1,12 @@
+import { test, expect } from '@playwright/test'
+
+test('remote-method', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/focus-remote-method')
+ const input = page.locator('#preview .tiny-input__inner')
+
+ await input.click()
+ const listitems = await page.locator('.tiny-select-dropdown').getByRole('listitem')
+ await expect(listitems).toHaveCount(0)
+ await page.waitForTimeout(1000)
+ await expect(listitems).toHaveCount(50)
+})
diff --git a/examples/docs/resources/pc/demo/select/hide-select-input-border.spec.ts b/examples/docs/resources/pc/demo/select/hide-select-input-border.spec.ts
new file mode 100644
index 000000000..b6add428f
--- /dev/null
+++ b/examples/docs/resources/pc/demo/select/hide-select-input-border.spec.ts
@@ -0,0 +1,10 @@
+import { test, expect } from '@playwright/test'
+
+test('hidedrop', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/hide-select-input-border')
+ const select = page.locator('#preview .tiny-select').first()
+ const dropdown = page.locator('.tiny-select-dropdown')
+
+ await select.click()
+ await expect(dropdown).toBeHidden()
+})
diff --git a/examples/docs/resources/pc/demo/select/input-box-type.spec.ts b/examples/docs/resources/pc/demo/select/input-box-type.spec.ts
new file mode 100644
index 000000000..29ef62ccb
--- /dev/null
+++ b/examples/docs/resources/pc/demo/select/input-box-type.spec.ts
@@ -0,0 +1,26 @@
+import { test, expect } from '@playwright/test'
+
+test('default', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/input-box-type')
+ const select = page.locator('#preview .tiny-select').first()
+
+ await expect(select).toHaveClass(/tiny-select__underline/)
+})
+
+test('disable', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/input-box-type')
+ const select = page.locator('#preview .tiny-select').nth(1)
+ const input = select.locator('.tiny-input__inner')
+
+ await expect(select).toHaveClass(/tiny-select__underline/)
+ const hasDisabled = await input.evaluate((input) => input.hasAttribute('disabled'))
+ await expect(hasDisabled).toBe(true)
+})
+
+test('multiple', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/input-box-type')
+ const select = page.locator('#preview .tiny-select').nth(2)
+
+ await expect(select).toHaveClass(/tiny-select__underline/)
+ await expect(select).toHaveClass(/tiny-select__multiple/)
+})
diff --git a/examples/docs/resources/pc/demo/select/is-drop-inherit-width.spec.ts b/examples/docs/resources/pc/demo/select/is-drop-inherit-width.spec.ts
new file mode 100644
index 000000000..02da033ed
--- /dev/null
+++ b/examples/docs/resources/pc/demo/select/is-drop-inherit-width.spec.ts
@@ -0,0 +1,29 @@
+import { expect, test } from '@playwright/test'
+
+test('not-inherit-width', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/is-drop-inherit-width')
+ const input = page.getByPlaceholder('请选择').first()
+ await input.click()
+ await page.waitForTimeout(1000)
+ const listitem = page.getByRole('listitem').filter({ hasText: '双皮奶' })
+ const inputBox = await input.boundingBox()
+
+ const listitemBox = await listitem.boundingBox()
+ await page.waitForTimeout(3000)
+ const result = listitemBox.width > inputBox.width
+ await expect(result).toBe(true)
+})
+
+test('inherit-width', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/is-drop-inherit-width')
+ const input = page.getByPlaceholder('请选择').nth(1)
+ await input.click()
+ await page.waitForTimeout(1000)
+ const listitem = page.getByRole('listitem').filter({ hasText: '双皮奶' })
+ const inputBox = await input.boundingBox()
+
+ const listitemBox = await listitem.boundingBox()
+ await page.waitForTimeout(3000)
+ const result = listitemBox.width === inputBox.width
+ await expect(result).toBe(true)
+})
diff --git a/examples/docs/resources/pc/demo/select/manual-focus-blur.spec.ts b/examples/docs/resources/pc/demo/select/manual-focus-blur.spec.ts
new file mode 100644
index 000000000..397daf2b9
--- /dev/null
+++ b/examples/docs/resources/pc/demo/select/manual-focus-blur.spec.ts
@@ -0,0 +1,12 @@
+import { test, expect } from '@playwright/test'
+
+test('manual-focus-blur', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/manual-focus-blur')
+ await page.getByRole('button', { name: '单击按钮 Select 将获取焦点' }).click()
+ await page.waitForTimeout(1000)
+ const dropdown = page.locator('.tiny-select-dropdown')
+ await expect(dropdown).toBeVisible()
+ await page.getByRole('button', { name: '单击按钮 Select 将失去焦点' }).click()
+ await page.waitForTimeout(1000)
+ await expect(dropdown).toBeHidden()
+})
diff --git a/examples/docs/resources/pc/demo/select/manual-focus-blur.vue b/examples/docs/resources/pc/demo/select/manual-focus-blur.vue
index 22a175da2..f21615237 100644
--- a/examples/docs/resources/pc/demo/select/manual-focus-blur.vue
+++ b/examples/docs/resources/pc/demo/select/manual-focus-blur.vue
@@ -1,8 +1,12 @@
- 单击按钮 Select 将获取焦点
- 单击按钮 Select 将失去焦点
-
+
+ 单击按钮 Select 将获取焦点
+
+
+ 单击按钮 Select 将失去焦点
+
+
diff --git a/examples/docs/resources/pc/demo/select/memoize-usage.spec.ts b/examples/docs/resources/pc/demo/select/memoize-usage.spec.ts
new file mode 100644
index 000000000..eb56e52ad
--- /dev/null
+++ b/examples/docs/resources/pc/demo/select/memoize-usage.spec.ts
@@ -0,0 +1,14 @@
+import { expect, test } from '@playwright/test'
+
+test('memoize-usage', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/memoize-usage')
+ const input = page.locator('#preview .tiny-input__inner')
+ const cacheValue = page.locator('#preview .cache-value')
+
+ await input.click()
+ await page.getByRole('listitem').filter({ hasText: '黄金糕' }).click()
+ await expect(cacheValue).toContainText(['选项1'])
+ await input.click()
+ await page.getByRole('listitem').filter({ hasText: '双皮奶' }).click()
+ await expect(cacheValue).toContainText(['选项2'])
+})
diff --git a/examples/docs/resources/pc/demo/select/memoize-usage.vue b/examples/docs/resources/pc/demo/select/memoize-usage.vue
index dc485cff3..624fb1916 100644
--- a/examples/docs/resources/pc/demo/select/memoize-usage.vue
+++ b/examples/docs/resources/pc/demo/select/memoize-usage.vue
@@ -10,6 +10,9 @@
:highlight-class="item._highlightClass"
>
+
+ {{ cacheValue }}
+
@@ -50,12 +53,14 @@ export default {
data() {
return {
options,
- value: '选项3'
+ value: '选项3',
+ cacheValue: []
}
},
methods: {
clickItem(value) {
MemorizeInstance.updateByKey(value)
+ this.cacheValue = window.localStorage.getItem('tiny_memorize_test456')
}
}
}
diff --git a/examples/docs/resources/pc/demo/select/multiple-limit.spec.ts b/examples/docs/resources/pc/demo/select/multiple-limit.spec.ts
new file mode 100644
index 000000000..97e8f2ed4
--- /dev/null
+++ b/examples/docs/resources/pc/demo/select/multiple-limit.spec.ts
@@ -0,0 +1,19 @@
+import { test, expect } from '@playwright/test'
+
+test('multiple-limit', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/multiple-limit')
+ const select = page.locator('#preview .tiny-select')
+
+ await select.click()
+ await page.getByRole('listitem').filter({ hasText: '黄金糕' }).click()
+ await page.getByRole('listitem').filter({ hasText: '双皮奶' }).click()
+ await page.waitForTimeout(2000)
+ const listitems = await page
+ .locator('.tiny-select-dropdown')
+ .getByRole('listitem')
+ .filter({ hasNotText: /黄金糕|双皮奶/ })
+
+ await expect(listitems.nth(0)).toHaveClass(/is-disabled/)
+ await expect(listitems.nth(1)).toHaveClass(/is-disabled/)
+ await expect(listitems.nth(2)).toHaveClass(/is-disabled/)
+})
diff --git a/examples/docs/resources/pc/demo/select/multiple.spec.ts b/examples/docs/resources/pc/demo/select/multiple.spec.ts
new file mode 100644
index 000000000..63b783999
--- /dev/null
+++ b/examples/docs/resources/pc/demo/select/multiple.spec.ts
@@ -0,0 +1,19 @@
+import { expect, test } from '@playwright/test'
+
+test('test', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/multiple')
+ const select = page.locator('#preview .tiny-select')
+
+ await expect(select.locator('.tiny-tag')).toHaveCount(2)
+ await select.click()
+ await page.getByRole('listitem').filter({ hasText: '全部' }).click()
+ await expect(select.locator('.tiny-tag')).toHaveCount(7)
+ await page.getByRole('listitem').filter({ hasText: '全部' }).click()
+ await expect(select.locator('.tiny-tag')).toHaveCount(0)
+ await page.getByRole('listitem').filter({ hasText: '黄金糕' }).click()
+ await expect(select.locator('.tiny-tag')).toHaveCount(1)
+ await page.getByRole('listitem').filter({ hasText: '双皮奶' }).click()
+ await expect(select.locator('.tiny-tag')).toHaveCount(2)
+ await select.locator('.tiny-tag').filter({ hasText: '双皮奶' }).getByRole('img').click()
+ await expect(select.locator('.tiny-tag')).toHaveCount(1)
+})
diff --git a/examples/docs/resources/pc/demo/select/name.spec.ts b/examples/docs/resources/pc/demo/select/name.spec.ts
new file mode 100644
index 000000000..ac77a7122
--- /dev/null
+++ b/examples/docs/resources/pc/demo/select/name.spec.ts
@@ -0,0 +1,8 @@
+import { test, expect } from '@playwright/test'
+
+test('name', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/name')
+
+ const input = page.locator('#preview .tiny-input__inner')
+ await expect(input).toHaveAttribute('name', 'inputName')
+})
diff --git a/examples/docs/resources/pc/demo/select/nest-checkbox-grid-clearable.spec.ts b/examples/docs/resources/pc/demo/select/nest-checkbox-grid-clearable.spec.ts
new file mode 100644
index 000000000..7880cec2e
--- /dev/null
+++ b/examples/docs/resources/pc/demo/select/nest-checkbox-grid-clearable.spec.ts
@@ -0,0 +1,40 @@
+import { test, expect } from '@playwright/test'
+
+test('grid-filterable', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/nest-checkbox-grid-clearable')
+ const input = page.locator('#preview .tiny-input__inner')
+
+ await input.click()
+ await page.waitForTimeout(500)
+ const tr = page.locator('.tiny-select-dropdown .tiny-grid__body-wrapper .tiny-grid-body__row')
+ await expect(tr).toHaveCount(5)
+ await input.fill('深圳')
+ await input.press('Enter')
+ await page.waitForTimeout(500)
+ await expect(tr).toHaveCount(2)
+ await page.getByRole('row', { name: '华南区 广东省 深圳1' }).getByRole('cell').first().click()
+ await expect(input).toHaveValue('深圳1')
+ await input.click()
+ await page.waitForTimeout(500)
+ await expect(tr.filter({ hasText: '深圳1' })).toHaveClass(/row__current/)
+})
+
+test('grid-clearable', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/nest-checkbox-grid-clearable')
+ const input = page.locator('#preview .tiny-input__inner')
+ const suffix = page.locator('#preview .tiny-input__suffix')
+
+ await input.click()
+ await page.waitForTimeout(500)
+ const tr = page.locator('.tiny-select-dropdown .tiny-grid__body-wrapper .tiny-grid-body__row')
+ await expect(tr).toHaveCount(5)
+ await input.fill('深圳')
+ await input.press('Enter')
+ await page.waitForTimeout(500)
+ await expect(tr).toHaveCount(2)
+ await page.getByRole('row', { name: '华南区 广东省 深圳1' }).getByRole('cell').first().click()
+ await expect(input).toHaveValue('深圳1')
+ await input.hover()
+ await suffix.click()
+ await expect(input).toHaveValue('')
+})
diff --git a/examples/docs/resources/pc/demo/select/nest-checkbox-grid.spec.ts b/examples/docs/resources/pc/demo/select/nest-checkbox-grid.spec.ts
new file mode 100644
index 000000000..9307b1a94
--- /dev/null
+++ b/examples/docs/resources/pc/demo/select/nest-checkbox-grid.spec.ts
@@ -0,0 +1,34 @@
+import { expect, test } from '@playwright/test'
+
+test('grid-multiple', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/nest-checkbox-grid')
+ const suffix = page.locator('#preview .tiny-input__suffix')
+ const select = page.locator('#preview .tiny-select')
+ const tag = select.locator('.tiny-tag')
+
+ await expect(tag).toHaveCount(2)
+ await suffix.click()
+ await page.waitForTimeout(500)
+
+ const tr = page.locator('.tiny-select-dropdown .tiny-grid__body-wrapper .tiny-grid-body__row')
+ const currentTr = page.locator('.tiny-select-dropdown .tiny-grid__body-wrapper .row__selected')
+
+ await expect(tr).toHaveCount(5)
+ await expect(currentTr).toHaveCount(2)
+ await page.getByRole('row', { name: '华南区 广东省 珠海市' }).getByRole('cell').first().click()
+ await expect(tag).toHaveCount(3)
+ await expect(currentTr).toHaveCount(3)
+ await page.getByRole('row', { name: '华南区 广东省 珠海市' }).getByRole('cell').first().click()
+ await expect(tag).toHaveCount(2)
+ await expect(currentTr).toHaveCount(2)
+ await page.getByRole('row', { name: '区域 省份 城市' }).getByRole('cell').first().click()
+ await expect(tag).toHaveCount(5)
+ await expect(currentTr).toHaveCount(5)
+ let all = await page.getByRole('row', { name: '区域 省份 城市' }).locator('.tiny-grid-checkbox__icon .tiny-svg')
+ await expect(all).toHaveClass(/icon-checked-sur/)
+ await page.getByRole('row', { name: '区域 省份 城市' }).getByRole('cell').first().click()
+ await page.waitForTimeout(500)
+ await expect(all).toBeHidden()
+ await expect(tag).toHaveCount(0)
+ await expect(currentTr).toHaveCount(0)
+})
diff --git a/examples/docs/resources/pc/demo/select/nest-checkbox-tree.spec.ts b/examples/docs/resources/pc/demo/select/nest-checkbox-tree.spec.ts
new file mode 100644
index 000000000..84a462eef
--- /dev/null
+++ b/examples/docs/resources/pc/demo/select/nest-checkbox-tree.spec.ts
@@ -0,0 +1,27 @@
+import { expect, test } from '@playwright/test'
+
+test('tree-multiple', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/nest-checkbox-tree')
+ const suffix = page.locator('#preview .tiny-input__suffix')
+ const select = page.locator('#preview .tiny-select')
+ const selectDropdown = page.locator('.tiny-select-dropdown')
+ const tag = select.locator('.tiny-tag')
+
+ await expect(tag).toHaveCount(2)
+ await suffix.click()
+ await page.waitForTimeout(500)
+ const treeNodes = selectDropdown.getByRole('treeitem')
+ const checkedTreeNodes = selectDropdown.locator('.tiny-tree-node.is-checked')
+
+ await page.waitForTimeout(500)
+ await expect(checkedTreeNodes).toHaveCount(4)
+ await expect(treeNodes).toHaveCount(7)
+ await page
+ .locator('div')
+ .filter({ hasText: /^一级 2$/ })
+ .locator('.tiny-checkbox')
+ .click()
+ await page.waitForTimeout(500)
+ await expect(checkedTreeNodes).toHaveCount(7)
+ await expect(tag).toHaveCount(7)
+})
diff --git a/examples/docs/resources/pc/demo/select/nest-filterable-tree.spec.ts b/examples/docs/resources/pc/demo/select/nest-filterable-tree.spec.ts
new file mode 100644
index 000000000..547b51445
--- /dev/null
+++ b/examples/docs/resources/pc/demo/select/nest-filterable-tree.spec.ts
@@ -0,0 +1,30 @@
+import { expect, test } from '@playwright/test'
+
+test('filterable-tree', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/nest-filterable-tree')
+ const input = page.locator('#preview .tiny-input__inner')
+ const selectDropdown = page.locator('.tiny-select-dropdown')
+
+ await expect(input).toHaveValue('')
+ await expect(selectDropdown).toBeHidden()
+ await input.click()
+ await page.waitForTimeout(500)
+ const treeNodes = selectDropdown.getByRole('treeitem')
+ await expect(treeNodes).toHaveCount(7)
+ await input.fill('2-')
+ await input.press('Enter')
+ await page.waitForTimeout(500)
+ const hiddenTreeNodes = selectDropdown.locator('.tiny-tree-node.is-hidden')
+ await expect(hiddenTreeNodes).toHaveCount(4)
+ const checkedTreeNodes = selectDropdown.locator('.tiny-tree-node.is-checked')
+ await expect(checkedTreeNodes).toHaveCount(0)
+ await page.getByRole('treeitem', { name: '一级 2' }).locator('div').filter({ hasText: '一级 2' }).click()
+ await page.waitForTimeout(500)
+ await expect(selectDropdown).toBeHidden()
+ await page.waitForTimeout(1000)
+ await expect(input).toHaveValue('一级 2')
+ await input.click()
+ await page.waitForTimeout(1000)
+ await expect(checkedTreeNodes).toHaveCount(3)
+ await expect(page.locator('.is-current .tiny-tree-node__content')).toHaveText('二级 2-2')
+})
diff --git a/examples/docs/resources/pc/demo/select/nest-grid-remote-filter.spec.ts b/examples/docs/resources/pc/demo/select/nest-grid-remote-filter.spec.ts
new file mode 100644
index 000000000..5d6eaf275
--- /dev/null
+++ b/examples/docs/resources/pc/demo/select/nest-grid-remote-filter.spec.ts
@@ -0,0 +1,58 @@
+import { expect, test } from '@playwright/test'
+
+test('remote-method', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/nest-grid-remote-filter')
+ const input = page.getByRole('textbox').nth(1)
+ const suffixSvg = page.locator('.tiny-input__suffix .tiny-select__caret').first()
+
+ await expect(suffixSvg).toBeHidden()
+ const dropdown = page.locator('.grid-remote')
+ await expect(dropdown).toBeHidden()
+ await input.fill(' ')
+ await input.press('Enter')
+ await page.waitForTimeout(1000)
+ await expect(dropdown).toBeVisible()
+ await expect(dropdown.locator('.tiny-grid__body tbody')).toBeEmpty()
+ await input.fill('')
+ await input.press('Enter')
+ await page.waitForTimeout(1000)
+ await expect(dropdown.locator('.tiny-grid__body tbody')).not.toBeEmpty()
+ await page.getByRole('row', { name: '华南区0 广东省0 广州市0' }).getByRole('cell').first().click()
+ const tags = page.locator('.tiny-select .tiny-tag')
+ await expect((await tags.all()).length).toEqual(1)
+ await expect(tags.first()).toContainText(/广州市0/)
+ await page.getByRole('row', { name: '华南区1 广东省1 广州市1' }).getByRole('cell').first().click()
+ await expect((await tags.all()).length).toEqual(2)
+ await expect(tags.first()).toContainText(/广州市0/)
+ await expect(tags.nth(1)).toContainText(/广州市1/)
+})
+
+test('remote-config', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/nest-grid-remote-filter')
+ const input = page.getByRole('textbox').nth(3)
+ const suffixSvg = page.locator('.tiny-input__suffix .tiny-select__caret').nth(1)
+
+ await expect(suffixSvg).toBeVisible()
+ const dropdown = page.locator('.grid-remote-config')
+ await expect(dropdown).toBeHidden()
+ await input.click()
+ await page.waitForTimeout(1000)
+ await expect(dropdown).toBeVisible()
+ await expect(dropdown.locator('.tiny-grid__body tbody')).not.toBeEmpty()
+ await page.getByRole('row', { name: '华南区0 广东省0 广州市0' }).getByRole('cell').first().click()
+ const tags = page.locator('.tiny-select .tiny-tag')
+ await expect((await tags.all()).length).toEqual(1)
+ await expect(tags.first()).toContainText(/广州市0/)
+ await page.getByRole('row', { name: '华南区1 广东省1 广州市1' }).getByRole('cell').first().click()
+ await expect((await tags.all()).length).toEqual(2)
+ await expect(tags.first()).toContainText(/广州市0/)
+ await expect(tags.nth(1)).toContainText(/广州市1/)
+ await tags.nth(0).locator('.tiny-svg').click()
+ await tags.nth(0).locator('.tiny-svg').click()
+ await expect((await tags.all()).length).toEqual(0)
+ await input.fill(' ')
+ await input.press('Enter')
+ await page.waitForTimeout(1000)
+ await expect(dropdown).toBeVisible()
+ await expect(dropdown.locator('.tiny-grid__body tbody')).toBeEmpty()
+})
diff --git a/examples/docs/resources/pc/demo/select/nest-grid-remote-filter.vue b/examples/docs/resources/pc/demo/select/nest-grid-remote-filter.vue
index 6ea29f107..bb98cf8ac 100644
--- a/examples/docs/resources/pc/demo/select/nest-grid-remote-filter.vue
+++ b/examples/docs/resources/pc/demo/select/nest-grid-remote-filter.vue
@@ -13,6 +13,7 @@
text-field="city"
render-type="grid"
:grid-op="gridOpRadio"
+ popper-class="grid-remote"
>
diff --git a/examples/docs/resources/pc/demo/select/nest-radio-grid-much-data.spec.ts b/examples/docs/resources/pc/demo/select/nest-radio-grid-much-data.spec.ts
new file mode 100644
index 000000000..9302954eb
--- /dev/null
+++ b/examples/docs/resources/pc/demo/select/nest-radio-grid-much-data.spec.ts
@@ -0,0 +1,30 @@
+import { expect, test } from '@playwright/test'
+
+test('grid-much-data', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/nest-radio-grid-much-data')
+ const input = page.locator('#preview .tiny-input__inner')
+ const suffixSvg = await page.locator('#preview .tiny-select__caret').first()
+
+ await expect(suffixSvg).toHaveCount(1)
+ await expect(suffixSvg).toBeVisible()
+ const dropdown = page.locator('.tiny-select-dropdown')
+ await expect(dropdown).toBeHidden()
+ await input.click()
+ await page.waitForTimeout(1000)
+ await expect(dropdown).toBeVisible()
+ await expect(dropdown.locator('.tiny-grid__body tbody')).not.toBeEmpty()
+ await page.getByRole('row', { name: '华南区0 广东省 广州市' }).getByRole('cell').first().click()
+ await expect(input).toHaveValue('广州市')
+ await input.click()
+ await page.waitForTimeout(1000)
+ await expect(dropdown.locator('.tiny-grid-body__row').first()).toHaveClass(/row__current/)
+ await expect((await dropdown.locator('.tiny-grid-body__row').all()).length).toEqual(7)
+ await expect(page.getByRole('row', { name: '华南区12 广东省 广州市' })).not.toBeInViewport()
+ await dropdown.locator('.tiny-grid-body__row').nth(6).scrollIntoViewIfNeeded()
+ await expect((await dropdown.locator('.tiny-grid-body__row').all()).length).toEqual(7)
+ await page.waitForTimeout(1000)
+ await dropdown.locator('.tiny-grid-body__row').nth(6).scrollIntoViewIfNeeded()
+ await expect((await dropdown.locator('.tiny-grid-body__row').all()).length).toEqual(7)
+ await page.waitForTimeout(1000)
+ await page.getByRole('row', { name: '华南区12 广东省 广州市' }).getByRole('cell').first().click()
+})
diff --git a/examples/docs/resources/pc/demo/select/nest-radio-grid.spec.ts b/examples/docs/resources/pc/demo/select/nest-radio-grid.spec.ts
new file mode 100644
index 000000000..5dfbbad77
--- /dev/null
+++ b/examples/docs/resources/pc/demo/select/nest-radio-grid.spec.ts
@@ -0,0 +1,19 @@
+import { test, expect } from '@playwright/test'
+
+test('radio-grid', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/nest-radio-grid')
+ const input = page.locator('#preview .tiny-input__inner')
+ const suffixSvg = await page.locator('#preview .tiny-select__caret').first()
+
+ await expect(suffixSvg).toHaveCount(1)
+ await expect(suffixSvg).toBeVisible()
+
+ await input.click()
+ await page.getByRole('row', { name: '华南区 广东省 广州市' }).getByRole('cell').first().click()
+ await page.waitForTimeout(1000)
+ await expect(input).toHaveValue('广州市')
+ await input.click()
+ await page.getByRole('row', { name: '华南区 广东省 深圳市' }).getByRole('cell').first().click()
+ await page.waitForTimeout(1000)
+ await expect(input).toHaveValue('深圳市')
+})
diff --git a/examples/docs/resources/pc/demo/select/nest-radio-tree.spec.ts b/examples/docs/resources/pc/demo/select/nest-radio-tree.spec.ts
new file mode 100644
index 000000000..68b1698f8
--- /dev/null
+++ b/examples/docs/resources/pc/demo/select/nest-radio-tree.spec.ts
@@ -0,0 +1,20 @@
+import { test, expect } from '@playwright/test'
+
+test('radio-tree', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/nest-radio-tree')
+ const input = page.locator('#preview .tiny-input__inner')
+ const suffixSvg = await page.locator('#preview .tiny-select__caret').first()
+
+ await expect(suffixSvg).toHaveCount(1)
+ await expect(suffixSvg).toBeVisible()
+ await expect(input).toHaveValue('三级 1-1-2')
+ await input.click()
+ await page.waitForTimeout(1000)
+ await expect(page.getByRole('treeitem', { name: '三级 1-1-2' })).toHaveClass(/is-current/)
+ await page.getByRole('treeitem', { name: '二级 2-1' }).locator('div').filter({ hasText: '二级 2-1' }).click()
+ await page.waitForTimeout(1000)
+ await expect(input).toHaveValue('二级 2-1')
+ await input.click()
+ await page.waitForTimeout(1000)
+ await expect(page.getByRole('treeitem', { name: '二级 2-1' })).toHaveClass(/is-current/)
+})
diff --git a/examples/docs/resources/pc/demo/select/nest-remote-grid.spec.ts b/examples/docs/resources/pc/demo/select/nest-remote-grid.spec.ts
new file mode 100644
index 000000000..c1ffe9650
--- /dev/null
+++ b/examples/docs/resources/pc/demo/select/nest-remote-grid.spec.ts
@@ -0,0 +1,56 @@
+import { expect, test } from '@playwright/test'
+
+test('nest-remote-method', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/nest-remote-grid')
+ const input = page.locator('#preview .tiny-input__inner').first()
+ const suffixSvg = page.locator('.tiny-input__suffix .tiny-select__caret').first()
+
+ await expect(suffixSvg).toBeHidden()
+ const dropdown = page.locator('.grid-remote')
+ await expect(dropdown).toBeHidden()
+ await input.focus()
+ await input.fill(' ')
+ await input.press('Enter')
+ await page.waitForTimeout(1000)
+ await expect(dropdown).toBeVisible()
+ await expect(dropdown.locator('.tiny-grid__body tbody')).toBeEmpty()
+ await input.fill('')
+ await input.press('Enter')
+ await page.waitForTimeout(1000)
+ await expect(dropdown.locator('.tiny-grid__body tbody')).not.toBeEmpty()
+ await page.getByRole('row', { name: '5100000' }).locator('div').first().click()
+ await expect(input).toHaveValue('5100000')
+ await input.click()
+ await expect(page.getByRole('row', { name: '5100000' })).toHaveClass(/row__current/)
+ await page.getByRole('row', { name: '5900003' }).locator('div').first().click()
+ await expect(input).toHaveValue('5900003')
+ await input.click()
+ await expect(page.getByRole('row', { name: '5900003' })).toHaveClass(/row__current/)
+})
+
+test('nest-remote-config', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/nest-remote-grid')
+ const input = page.locator('#preview .tiny-input__inner').nth(1)
+ const suffixSvg = page.locator('.tiny-input__suffix .tiny-select__caret').nth(1)
+
+ await expect(suffixSvg).toBeVisible()
+ const dropdown = page.locator('.grid-remote-config')
+ await expect(dropdown).toBeHidden()
+ await input.click()
+ await page.waitForTimeout(1000)
+ await expect(dropdown).toBeVisible()
+ await expect(dropdown.locator('.tiny-grid__body tbody')).not.toBeEmpty()
+ await page.getByRole('row', { name: '5100000' }).getByRole('cell').first().click()
+ await expect(input).toHaveValue('5100000')
+ await input.click()
+ await expect(page.getByRole('row', { name: '5100000' })).toHaveClass(/row__current/)
+ await page.getByRole('row', { name: '5900003' }).getByRole('cell').first().click()
+ await expect(input).toHaveValue('5900003')
+ await input.click()
+ await expect(page.getByRole('row', { name: '5900003' })).toHaveClass(/row__current/)
+ await input.fill(' ')
+ await input.press('Enter')
+ await page.waitForTimeout(1000)
+ await expect(dropdown).toBeVisible()
+ await expect(dropdown.locator('.tiny-grid__body tbody')).toBeEmpty()
+})
diff --git a/examples/docs/resources/pc/demo/select/nest-remote-grid.vue b/examples/docs/resources/pc/demo/select/nest-remote-grid.vue
index 19ac2782e..d2539daca 100644
--- a/examples/docs/resources/pc/demo/select/nest-remote-grid.vue
+++ b/examples/docs/resources/pc/demo/select/nest-remote-grid.vue
@@ -12,6 +12,7 @@
text-field="coaNumber"
render-type="grid"
:grid-op="gridOpRadio"
+ popper-class="grid-remote"
>
diff --git a/examples/docs/resources/pc/demo/select/no-data-text.spec.ts b/examples/docs/resources/pc/demo/select/no-data-text.spec.ts
new file mode 100644
index 000000000..c71189760
--- /dev/null
+++ b/examples/docs/resources/pc/demo/select/no-data-text.spec.ts
@@ -0,0 +1,20 @@
+import { test, expect } from '@playwright/test'
+
+test('no-data-text', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/no-data-text')
+ const input = page.locator('#preview .tiny-input__inner').first()
+
+ await input.click()
+ await page.waitForTimeout(1000)
+ await expect(page.locator('body>.tiny-select-dropdown .tiny-select-dropdown__empty')).toHaveText('None')
+})
+
+test('show-empty-image', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/no-data-text')
+ const input = page.locator('#preview .tiny-input__inner').nth(1)
+
+ await input.click()
+ await page.waitForTimeout(1000)
+ await expect(page.locator('body>.tiny-select-dropdown .tiny-select-dropdown__empty')).toHaveText('暂无数据')
+ await expect(page.locator('.tiny-select-dropdown__empty-images')).toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/select/no-match-text.spec.ts b/examples/docs/resources/pc/demo/select/no-match-text.spec.ts
new file mode 100644
index 000000000..2d2e67567
--- /dev/null
+++ b/examples/docs/resources/pc/demo/select/no-match-text.spec.ts
@@ -0,0 +1,13 @@
+import { test, expect } from '@playwright/test'
+
+test('no-match-text', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/no-match-text')
+ const input = page.locator('#preview .tiny-input__inner')
+ await input.click()
+ const listItems = page.locator('.tiny-select-dropdown__list').getByRole('listitem')
+ await expect((await listItems.all()).length).toEqual(5)
+ await expect(page.getByText('No Match')).toBeHidden()
+ await input.fill('1')
+ await input.press('Enter')
+ await expect(page.getByText('No Match')).toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/select/optimization.spec.ts b/examples/docs/resources/pc/demo/select/optimization.spec.ts
new file mode 100644
index 000000000..91883b3e3
--- /dev/null
+++ b/examples/docs/resources/pc/demo/select/optimization.spec.ts
@@ -0,0 +1,44 @@
+import { test, expect } from '@playwright/test'
+
+test('radio-optimization', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/optimization')
+ const select = page.locator('#preview .tiny-select').first()
+ const input = page.locator('#preview .tiny-input__inner').first()
+
+ await select.click()
+ await page.waitForTimeout(1000)
+ const options = page.locator('.tiny-select-dropdown__list').getByRole('listitem')
+ await page.waitForTimeout(1000)
+ await expect((await options.all()).length).toEqual(10)
+ await expect(options.filter({ hasText: '黄金糕17' })).not.toBeInViewport()
+ await options.nth(9).scrollIntoViewIfNeeded()
+ await page.waitForTimeout(1000)
+ await options.nth(9).scrollIntoViewIfNeeded()
+ await expect(options.filter({ hasText: '黄金糕17' })).toBeInViewport()
+ await options.filter({ hasText: '黄金糕17' }).click()
+ await expect(input).toHaveValue('黄金糕17')
+})
+
+test('select-optimization', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/optimization')
+ const select = page.locator('#preview .tiny-select').nth(1)
+ const tags = page.locator('#preview .tiny-select .tiny-tag')
+
+ await select.click()
+ await page.waitForTimeout(1000)
+ const options = page.locator('.tiny-select-dropdown__list').getByRole('listitem')
+ await expect((await options.all()).length).toEqual(10)
+ await expect(options.filter({ hasText: '黄金糕17' })).not.toBeInViewport()
+ await expect(options.filter({ hasText: '黄金糕16' })).not.toBeInViewport()
+ await options.nth(9).scrollIntoViewIfNeeded()
+ await page.waitForTimeout(1000)
+ await options.nth(9).scrollIntoViewIfNeeded()
+ await expect(options.filter({ hasText: '黄金糕16' })).toBeInViewport()
+ await expect(options.filter({ hasText: '黄金糕17' })).toBeInViewport()
+ await options.filter({ hasText: '黄金糕17' }).click()
+ await expect(tags.first()).toHaveText('黄金糕17')
+ await expect((await tags.all()).length).toEqual(1)
+ await options.filter({ hasText: '黄金糕16' }).click()
+ await expect((await tags.all()).length).toEqual(2)
+ await expect(tags.nth(1)).toHaveText('+ 1')
+})
diff --git a/examples/docs/resources/pc/demo/select/option-group-disable.spec.ts b/examples/docs/resources/pc/demo/select/option-group-disable.spec.ts
new file mode 100644
index 000000000..7850c6538
--- /dev/null
+++ b/examples/docs/resources/pc/demo/select/option-group-disable.spec.ts
@@ -0,0 +1,10 @@
+import { test, expect } from '@playwright/test'
+
+test('option-group-disable', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/option-group-disable')
+ const select = page.locator('#preview .tiny-select')
+ await select.click()
+ const listitems = page.locator('.tiny-option')
+ await expect(listitems.filter({ hasText: '上海' })).toHaveClass(/is-disabled/)
+ await expect(listitems.filter({ hasText: '北京' })).toHaveClass(/is-disabled/)
+})
diff --git a/examples/docs/resources/pc/demo/select/option-group.spec.ts b/examples/docs/resources/pc/demo/select/option-group.spec.ts
new file mode 100644
index 000000000..1f831b066
--- /dev/null
+++ b/examples/docs/resources/pc/demo/select/option-group.spec.ts
@@ -0,0 +1,12 @@
+import { test, expect } from '@playwright/test'
+
+test('option-group', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/option-group')
+ const select = page.locator('#preview .tiny-select')
+ await select.click()
+ const listitems = page.locator('.tiny-option')
+ await expect(listitems.filter({ hasText: '上海' })).toHaveClass(/is-disabled/)
+ await expect(listitems.filter({ hasText: '北京' })).toHaveClass(/is-disabled/)
+ const groups = page.locator('.tiny-option-group')
+ await expect((await groups.all()).length).toEqual(2)
+})
diff --git a/examples/docs/resources/pc/demo/select/popup-style-position.spec.ts b/examples/docs/resources/pc/demo/select/popup-style-position.spec.ts
new file mode 100644
index 000000000..49f18461c
--- /dev/null
+++ b/examples/docs/resources/pc/demo/select/popup-style-position.spec.ts
@@ -0,0 +1,11 @@
+import { test, expect } from '@playwright/test'
+
+test('popup-style-position', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/popup-style-position')
+ const select = page.locator('#preview .tiny-select')
+
+ await select.click()
+ const selectDropdown = select.locator('.tiny-select-dropdown')
+ await expect(selectDropdown).toHaveCount(1)
+ await expect(selectDropdown).toHaveClass(/drop/)
+})
diff --git a/examples/docs/resources/pc/demo/select/remote-method.spec.ts b/examples/docs/resources/pc/demo/select/remote-method.spec.ts
new file mode 100644
index 000000000..3e3e075ed
--- /dev/null
+++ b/examples/docs/resources/pc/demo/select/remote-method.spec.ts
@@ -0,0 +1,24 @@
+import { expect, test } from '@playwright/test'
+
+test('reserve-keyword', async ({ page }) => {
+ await page.goto('http://localhost:7130/pc/select/remote-method')
+ const tags = page.locator('#preview .tiny-select .tiny-tag')
+ const searchInput = page.locator('#preview .tiny-select__input')
+
+ await searchInput.focus()
+ await searchInput.press('a')
+ await page.waitForTimeout(1000)
+ await page.getByRole('listitem').filter({ hasText: 'Alabama' }).click()
+ await expect(searchInput).toHaveValue('a')
+ await expect((await tags.all()).length).toEqual(1)
+ await searchInput.press('l')
+ await page.waitForTimeout(1000)
+
+ const options = page.locator('.tiny-select-dropdown__list .tiny-option')
+
+ await expect((await options.all()).length).toEqual(3)
+ await options.filter({ hasText: 'Alaska' }).click()
+ await page.waitForTimeout(1000)
+ await expect((await tags.all()).length).toEqual(2)
+ await expect(searchInput).toHaveValue('al')
+})
diff --git a/examples/docs/resources/pc/demo/select/remote-method.vue b/examples/docs/resources/pc/demo/select/remote-method.vue
index c3ebe453a..a84b201a8 100644
--- a/examples/docs/resources/pc/demo/select/remote-method.vue
+++ b/examples/docs/resources/pc/demo/select/remote-method.vue
@@ -2,6 +2,7 @@
{
+ await page.goto('http://localhost:7130/pc/select/remote-search-allow-copy')
+ const input = page.locator('#preview .tiny-input__inner')
+ const options = page.locator('.tiny-select-dropdown').locator('.tiny-option')
+
+ input.press('a')
+ await page.waitForTimeout(1000)
+ await options.filter({ hasText: 'Alaska' }).click()
+ await expect(input).toHaveValue('Alaska')
+ await page.mouse.move(340, 356)
+ await page.waitForTimeout(1000)
+ await page.mouse.down()
+ await page.waitForTimeout(1000)
+ await page.mouse.move(278, 356)
+ await page.waitForTimeout(200)
+ await page.mouse.up()
+ await expect(page.locator('.tiny-select-dropdown')).toBeHidden()
+ await page.keyboard.press('Control+C')
+ const valueInput = page.locator('.custom')
+ await expect(valueInput).toHaveValue('')
+ await valueInput.focus()
+ await page.keyboard.press('Control+V')
+ await page.waitForTimeout(200)
+ await expect(valueInput).toHaveValue('Alaska')
+})
diff --git a/examples/docs/resources/pc/demo/select/remote-search-allow-copy.vue b/examples/docs/resources/pc/demo/select/remote-search-allow-copy.vue
index a80e73c51..645ecf0f3 100644
--- a/examples/docs/resources/pc/demo/select/remote-search-allow-copy.vue
+++ b/examples/docs/resources/pc/demo/select/remote-search-allow-copy.vue
@@ -12,6 +12,8 @@
>
+ 复制到此处：
+
-
+
diff --git a/examples/docs/resources/pc/demo/user-contact/basic-usage.spec.ts b/examples/docs/resources/pc/demo/user-contact/basic-usage.spec.ts
new file mode 100644
index 000000000..8b6a1bd8a
--- /dev/null
+++ b/examples/docs/resources/pc/demo/user-contact/basic-usage.spec.ts
@@ -0,0 +1,10 @@
+import { test, expect } from '@playwright/test'
+
+test('基础用法', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/user-contact/basic-usage')
+ const partBox = page.locator('.dropdown-part')
+ await partBox.hover()
+ const dialogBox = page.locator('.tiny-user-contact__title')
+ await expect(dialogBox).toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/user-contact/data-source.spec.ts b/examples/docs/resources/pc/demo/user-contact/data-source.spec.ts
new file mode 100644
index 000000000..ecdd6b028
--- /dev/null
+++ b/examples/docs/resources/pc/demo/user-contact/data-source.spec.ts
@@ -0,0 +1,13 @@
+import { test, expect } from '@playwright/test'
+
+test('设置数据源', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/user-contact/data-source')
+ const partBox = page.locator('.dropdown-part')
+ await partBox.hover()
+ const imageUrl = page.locator('.tiny-user-head div').first()
+ await expect(imageUrl).toHaveCSS(
+ 'background-image',
+ 'url("http://localhost:7130/pc/user-contact/static/images/fruit.jpg")'
+ )
+})
diff --git a/examples/docs/resources/pc/demo/user-contact/not-displayed-content.spec.ts b/examples/docs/resources/pc/demo/user-contact/not-displayed-content.spec.ts
new file mode 100644
index 000000000..0d73a07d7
--- /dev/null
+++ b/examples/docs/resources/pc/demo/user-contact/not-displayed-content.spec.ts
@@ -0,0 +1,8 @@
+import { test, expect } from '@playwright/test'
+
+test('定制弹框不显示的内容', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/user-contact/not-displayed-content')
+ const noneBox = page.locator('.no-arrow')
+ await expect(noneBox).toHaveCSS('display', 'none')
+})
diff --git a/examples/docs/resources/pc/demo/user-contact/slots-usercontact.spec.ts b/examples/docs/resources/pc/demo/user-contact/slots-usercontact.spec.ts
new file mode 100644
index 000000000..dc03067ee
--- /dev/null
+++ b/examples/docs/resources/pc/demo/user-contact/slots-usercontact.spec.ts
@@ -0,0 +1,12 @@
+import { test, expect } from '@playwright/test'
+
+test('自定义默认插槽', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/user-contact/slots-usercontact')
+ const partBox = page.locator('.dropdown-part')
+ await partBox.hover()
+ await page.waitForTimeout(300)
+ const slotDiv = page.locator('.tiny-card-template__body')
+ await expect(slotDiv).toHaveText('自定义插槽内容')
+
+})
diff --git a/examples/docs/resources/pc/demo/user-contact/support-open-espace.spec.ts b/examples/docs/resources/pc/demo/user-contact/support-open-espace.spec.ts
new file mode 100644
index 000000000..79aac43de
--- /dev/null
+++ b/examples/docs/resources/pc/demo/user-contact/support-open-espace.spec.ts
@@ -0,0 +1,11 @@
+import { test, expect } from '@playwright/test'
+
+test('用户联系人使用', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/espace/support-open-espace')
+
+ const espace = page.locator('.tiny-card-template .tiny-espace')
+ await page.getByRole('link', { name: '小红' }).hover()
+ await expect(espace).toBeVisible()
+ await page.getByRole('link', { name: 'im:test1' }).click()
+});
\ No newline at end of file
diff --git a/examples/docs/resources/pc/demo/user-head/basic-usage.spec.ts b/examples/docs/resources/pc/demo/user-head/basic-usage.spec.ts
new file mode 100644
index 000000000..c74b113b3
--- /dev/null
+++ b/examples/docs/resources/pc/demo/user-head/basic-usage.spec.ts
@@ -0,0 +1,8 @@
+import { test, expect } from '@playwright/test'
+
+test('基础用法', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/user-head/basic-usage')
+ const svgBox = page.locator('.tiny-user-head__portrait svg')
+ await expect(svgBox).toHaveCount(1)
+})
diff --git a/examples/docs/resources/pc/demo/user-head/color.spec.ts b/examples/docs/resources/pc/demo/user-head/color.spec.ts
new file mode 100644
index 000000000..f3dfdc5db
--- /dev/null
+++ b/examples/docs/resources/pc/demo/user-head/color.spec.ts
@@ -0,0 +1,10 @@
+import { test, expect } from '@playwright/test'
+
+test('自定义颜色', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/user-head/color')
+ const div1 = page.locator('.tiny-user-head__portrait').first()
+ await expect(div1).toHaveCSS('background-color', 'rgb(64, 169, 255)')
+ const div2 = page.locator('div:nth-child(2) > .tiny-user-head__portrait')
+ await expect(div2).toHaveCSS('background-color', 'rgb(250, 140, 22)')
+})
diff --git a/examples/docs/resources/pc/demo/user-head/custom-background-color.spec.ts b/examples/docs/resources/pc/demo/user-head/custom-background-color.spec.ts
new file mode 100644
index 000000000..33da2d85c
--- /dev/null
+++ b/examples/docs/resources/pc/demo/user-head/custom-background-color.spec.ts
@@ -0,0 +1,8 @@
+import { test, expect } from '@playwright/test'
+
+test('自定义背景颜色', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/user-head/custom-background-color')
+ const div1 = page.locator('.tiny-user-head__portrait')
+ await expect(div1).toHaveCSS('background-color', 'rgb(94, 124, 224)')
+})
diff --git a/examples/docs/resources/pc/demo/user-head/custom-user-head-content.spec.ts b/examples/docs/resources/pc/demo/user-head/custom-user-head-content.spec.ts
new file mode 100644
index 000000000..170869b64
--- /dev/null
+++ b/examples/docs/resources/pc/demo/user-head/custom-user-head-content.spec.ts
@@ -0,0 +1,8 @@
+import { test, expect } from '@playwright/test'
+
+test('自定义图像内容', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/user-head/custom-user-head-content')
+ const svg1 = page.locator('.tiny-user-head .tiny-svg path')
+ await expect(await svg1.getAttribute('d')).not.toContain('M19.2 18.6c-.4-.9-1-1.8-1.7-2.5S16 14.8 15')
+})
diff --git a/examples/docs/resources/pc/demo/user-head/icon-user-head.spec.ts b/examples/docs/resources/pc/demo/user-head/icon-user-head.spec.ts
new file mode 100644
index 000000000..d6e719498
--- /dev/null
+++ b/examples/docs/resources/pc/demo/user-head/icon-user-head.spec.ts
@@ -0,0 +1,8 @@
+import { test, expect } from '@playwright/test'
+
+test('图片头像', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/user-head/image-user-head')
+ const minBox = page.locator('.tiny-user-head__portrait')
+ await expect(minBox).toHaveCSS('background-image', 'none')
+})
diff --git a/examples/docs/resources/pc/demo/user-head/image-user-head.spec.ts b/examples/docs/resources/pc/demo/user-head/image-user-head.spec.ts
new file mode 100644
index 000000000..156f02d81
--- /dev/null
+++ b/examples/docs/resources/pc/demo/user-head/image-user-head.spec.ts
@@ -0,0 +1,8 @@
+import { test, expect } from '@playwright/test'
+
+test('图片头像', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/user-head/image-user-head')
+ const headImg = page.locator('.tiny-user-head')
+ await expect(headImg).toHaveAttribute('value', 'localhost:3000/webnova/static/img/compontent.b2f0f5b.png')
+})
diff --git a/examples/docs/resources/pc/demo/user-head/label-user-head.spec.ts b/examples/docs/resources/pc/demo/user-head/label-user-head.spec.ts
new file mode 100644
index 000000000..8ff5b1442
--- /dev/null
+++ b/examples/docs/resources/pc/demo/user-head/label-user-head.spec.ts
@@ -0,0 +1,8 @@
+import { test, expect } from '@playwright/test'
+
+test('文字头像', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/user-head/label-user-head')
+ const minBox = page.locator('.tiny-user-head__portrait')
+ await expect(minBox).toHaveText('文字')
+})
diff --git a/examples/docs/resources/pc/demo/user-head/message-count-limit.spec.ts b/examples/docs/resources/pc/demo/user-head/message-count-limit.spec.ts
new file mode 100644
index 000000000..97fa01d56
--- /dev/null
+++ b/examples/docs/resources/pc/demo/user-head/message-count-limit.spec.ts
@@ -0,0 +1,8 @@
+import { test, expect } from '@playwright/test'
+
+test('消息计数上限', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/user-head/message-count-limit')
+ const messageBox = page.locator('.tiny-user-head__message')
+ await expect(messageBox).toHaveText('99+')
+})
diff --git a/examples/docs/resources/pc/demo/user-head/message-count-total.spec.ts b/examples/docs/resources/pc/demo/user-head/message-count-total.spec.ts
new file mode 100644
index 000000000..396198cd0
--- /dev/null
+++ b/examples/docs/resources/pc/demo/user-head/message-count-total.spec.ts
@@ -0,0 +1,8 @@
+import { test, expect } from '@playwright/test'
+
+test('头像消息计数', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/user-head/message-count-total')
+ const messageBox = page.locator('.tiny-user-head__message')
+ await expect(messageBox).toHaveText('100')
+})
diff --git a/examples/docs/resources/pc/demo/user-head/message-count-type.spec.ts b/examples/docs/resources/pc/demo/user-head/message-count-type.spec.ts
new file mode 100644
index 000000000..e7c2be0df
--- /dev/null
+++ b/examples/docs/resources/pc/demo/user-head/message-count-type.spec.ts
@@ -0,0 +1,8 @@
+import { test, expect } from '@playwright/test'
+
+test('使用小红点代替具体数值', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/user-head/message-count-type')
+ const messageBox = page.locator('.tiny-user-head__message')
+ await expect(messageBox).toHaveCSS('background-color', 'rgb(255, 0, 0)')
+})
diff --git a/examples/docs/resources/pc/demo/user-head/min-user-head.spec.ts b/examples/docs/resources/pc/demo/user-head/min-user-head.spec.ts
new file mode 100644
index 000000000..cf25da609
--- /dev/null
+++ b/examples/docs/resources/pc/demo/user-head/min-user-head.spec.ts
@@ -0,0 +1,9 @@
+import { test, expect } from '@playwright/test'
+
+test('小头像', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/user-head/min-user-head')
+ const minBox = page.locator('.tiny-user-head__portrait.min')
+ await expect(minBox).toHaveCSS('width', '30px')
+ await expect(minBox).toHaveCSS('height', '30px')
+})
diff --git a/examples/docs/resources/pc/demo/user-head/render-user-head-in-grid.spec.ts b/examples/docs/resources/pc/demo/user-head/render-user-head-in-grid.spec.ts
new file mode 100644
index 000000000..fedcac099
--- /dev/null
+++ b/examples/docs/resources/pc/demo/user-head/render-user-head-in-grid.spec.ts
@@ -0,0 +1,10 @@
+import { test, expect } from '@playwright/test'
+
+test('Grid 单元格展示头像', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/user-head/render-user-head-in-grid')
+ const iconBox = page.getByRole('cell', { name: '800 GFD科技YX公司' }).locator('svg')
+ await expect(iconBox).toBeVisible()
+ const iconBox1 = page.getByRole('cell', { name: '300 WWW科技YX公司' }).locator('svg')
+ await expect(iconBox1).toBeVisible()
+})
diff --git a/examples/docs/resources/pc/demo/user-head/round-user-head.spec.ts b/examples/docs/resources/pc/demo/user-head/round-user-head.spec.ts
new file mode 100644
index 000000000..b52cc8c49
--- /dev/null
+++ b/examples/docs/resources/pc/demo/user-head/round-user-head.spec.ts
@@ -0,0 +1,8 @@
+import { test, expect } from '@playwright/test'
+
+test('圆形头像', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).toBeNull())
+ await page.goto('http://localhost:7130/pc/user-head/round-user-head')
+ const minBox = page.locator('.tiny-user-head__portrait')
+ await expect(minBox).toHaveCSS('border-radius', '50%')
+})
diff --git a/examples/docs/resources/pc/demo/wizard/base-flow.spec.ts b/examples/docs/resources/pc/demo/wizard/base-flow.spec.ts
new file mode 100644
index 000000000..0d5e092e2
--- /dev/null
+++ b/examples/docs/resources/pc/demo/wizard/base-flow.spec.ts
@@ -0,0 +1,40 @@
+import { test, expect } from '@playwright/test'
+
+test('基本用法', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).not.toBeNull())
+ await page.goto('http://localhost:7130/pc/wizard/base-flow')
+
+ const stepItems = page.locator('.tiny-wizard__steps-item')
+ const charts = stepItems.locator('.tiny-wizard__chart')
+ const names = stepItems.locator('.tiny-wizard__name')
+ const chartCount = 5
+ const itemStatus = [/is-ready/, /is-doing/]
+ const descs = ['出差信息填写', '项目信息填写', '主管审批', '权签人审批', '完成申请']
+ const readyColor = 'rgb(94, 124, 224)'
+
+ await expect(charts).toHaveCount(chartCount)
+ for (let i = 0; i < chartCount; i++) {
+ const items = charts.nth(i)
+ const itemList = items.locator('span')
+ const first = itemList.nth(0)
+ const middle = itemList.nth(1)
+ const last = itemList.nth(2)
+
+ await expect(items).toHaveCSS('width', '120px')
+ await expect(items).toHaveCSS('height', '20px')
+ await expect(first).toHaveClass('tiny-wizard__chart-line')
+ await expect(middle).toHaveClass(/tiny-wizard__chart-icon/)
+ await expect(middle).toHaveText(String(i + 1))
+ await expect(last).toHaveClass('tiny-wizard__chart-line')
+ await expect(names.nth(i)).toHaveText(descs[i])
+
+ if (i < 2) {
+ await expect(stepItems.nth(i)).toHaveClass(itemStatus[i])
+ await expect(first).toHaveCSS('background-color', readyColor)
+ await expect(middle).toHaveCSS('background-color', readyColor)
+ } else {
+ await expect(first).toHaveCSS('background-color', 'rgb(194, 196, 199)')
+ await expect(middle).toHaveCSS('background-color', 'rgb(223, 225, 230)')
+ }
+ }
+})
diff --git a/examples/docs/resources/pc/demo/wizard/page-guide.spec.ts b/examples/docs/resources/pc/demo/wizard/page-guide.spec.ts
new file mode 100644
index 000000000..dbad1dc6d
--- /dev/null
+++ b/examples/docs/resources/pc/demo/wizard/page-guide.spec.ts
@@ -0,0 +1,52 @@
+import { test, expect } from '@playwright/test'
+
+test('页向导流程图', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).not.toBeNull())
+ await page.goto('http://localhost:7130/pc/wizard/page-guide')
+
+ const stepItems = page.locator('.tiny-wizard__steps-item')
+ const buttons = page.locator('.tiny-wizard__button')
+ const prev = buttons.getByRole('button', { name: '上一步' })
+ const next = buttons.getByRole('button', { name: '下一步' })
+ const save = buttons.getByRole('button', { name: '保存' })
+ const charts = stepItems.locator('.tiny-wizard__chart')
+ const prevClasss = [/is-ready/, /is-doing/]
+ const nextClasss = [/is-ready/, /is-ready/, /is-doing/]
+
+ await save.isVisible()
+ await expect(charts).toHaveCount(5)
+ for (let i = 0; i < 2; i++) {
+ await expect(stepItems.nth(i)).toHaveClass(prevClasss[i])
+ if (i === 1) {
+ const currentNode = stepItems.nth(i).locator('.tiny-wizard__chart > span').nth(1)
+ const { width, height } = await currentNode.boundingBox()
+ await expect(currentNode).toHaveClass('tiny-wizard__chart-svg')
+ await expect(width).toBeCloseTo(20)
+ await expect(height).toBeCloseTo(22.67, 2)
+ }
+ }
+
+ await next.click()
+ for (let i = 0; i < 3; i++) {
+ await expect(stepItems.nth(i)).toHaveClass(nextClasss[i])
+ if (i === 2) {
+ const currentNode = stepItems.nth(i).locator('.tiny-wizard__chart > span').nth(1)
+ const { width, height } = await currentNode.boundingBox()
+ await expect(currentNode).toHaveClass('tiny-wizard__chart-svg')
+ await expect(width).toBeCloseTo(20)
+ await expect(height).toBeCloseTo(22.67, 2)
+ }
+ }
+
+ await prev.click()
+ for (let i = 0; i < 2; i++) {
+ await expect(stepItems.nth(i)).toHaveClass(prevClasss[i])
+ if (i === 1) {
+ const currentNode = stepItems.nth(i).locator('.tiny-wizard__chart > span').nth(1)
+ const { width, height } = await currentNode.boundingBox()
+ await expect(currentNode).toHaveClass('tiny-wizard__chart-svg')
+ await expect(width).toBeCloseTo(20)
+ await expect(height).toBeCloseTo(22.67, 2)
+ }
+ }
+})
diff --git a/examples/docs/resources/pc/demo/wizard/slot-base.spec.ts b/examples/docs/resources/pc/demo/wizard/slot-base.spec.ts
new file mode 100644
index 000000000..8b2671b8b
--- /dev/null
+++ b/examples/docs/resources/pc/demo/wizard/slot-base.spec.ts
@@ -0,0 +1,14 @@
+import { test, expect } from '@playwright/test'
+
+test('基本插槽', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).not.toBeNull())
+ await page.goto('http://localhost:7130/pc/wizard/slot-base')
+
+ const stepItems = page.locator('.tiny-wizard__steps-item')
+ const names = stepItems.locator('.tiny-wizard__name')
+ const descs = ['出差信息填写', '项目信息填写', '主管审批', '权签人审批', '完成申请']
+
+ for (let i = 0; i < 5; i++) {
+ await expect(names.nth(i)).toHaveText(descs[i])
+ }
+})
diff --git a/examples/docs/resources/pc/demo/wizard/slot-step-button.spec.ts b/examples/docs/resources/pc/demo/wizard/slot-step-button.spec.ts
new file mode 100644
index 000000000..4f6ca783d
--- /dev/null
+++ b/examples/docs/resources/pc/demo/wizard/slot-step-button.spec.ts
@@ -0,0 +1,17 @@
+import { test, expect } from '@playwright/test'
+
+test('步骤插槽', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).not.toBeNull())
+ await page.goto('http://localhost:7130/pc/wizard/slot-step-button')
+
+ const buttons = page.locator('.tiny-wizard__button').getByRole('button')
+ const texts = ['第一步', '第二步', '第三步']
+ const modal = page.locator('.tiny-modal')
+
+ await expect(buttons).toHaveCount(3)
+ for (let i = 0; i < 3; i++) {
+ await expect(buttons.nth(i)).toHaveText(texts[i])
+ await buttons.nth(i).click()
+ await expect(modal.nth(i)).toHaveText(`步骤${i + 1}`)
+ }
+})
diff --git a/examples/docs/resources/pc/demo/wizard/time-line-flow.spec.ts b/examples/docs/resources/pc/demo/wizard/time-line-flow.spec.ts
new file mode 100644
index 000000000..03387fed0
--- /dev/null
+++ b/examples/docs/resources/pc/demo/wizard/time-line-flow.spec.ts
@@ -0,0 +1,63 @@
+import { test, expect } from '@playwright/test'
+
+test('时间线流程图', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).not.toBeNull())
+ await page.goto('http://localhost:7130/pc/wizard/time-line-flow')
+
+ const wizard = page.locator('.tiny-wizard__vertical.is-time-line-flow')
+ const nodeLines = wizard.locator('.tiny-wizard__chart-line.is-time-line')
+ const nodeIcons = wizard.locator('.tiny-wizard__time-wrapper > svg')
+ const nodeDates = wizard.locator('.tiny-wizard__date > span').filter({ hasText: /2013-12-1/ })
+ const wizardChilds = page.locator('.tiny-wizard__chart-children.is-ready')
+ const childNodeLines = wizardChilds.locator('.tiny-wizard__chart-line')
+ const childNodeIcons = wizardChilds.locator('.tiny-wizard__chart-icon')
+ const childNodeDates = wizardChilds.locator('.tiny-wizard__date.time-line-text')
+ const details = wizardChilds.locator('.tiny-wizard__chart-detail')
+ const userNames = wizardChilds.getByRole('link')
+ const texts = [/提交小红/, /转他人处理小胡/, /主管审批小张/]
+ const expandBtns = page.getByRole('listitem').locator('svg')
+ const xiaoHongTop = page
+ .getByRole('tooltip', { name: '小红 部门：某部门 邮件：example@example.com 手机：1234567890' })
+ .locator('div')
+ .filter({ hasText: '小红工号：123456890' })
+ .nth(3)
+ const xiaoHongBottom = page
+ .getByRole('tooltip', { name: '小红 部门：某部门 邮件：example@example.com 手机：1234567890' })
+ .getByText('部门：某部门邮件：example@example.com手机：1234567890')
+
+ await expect(nodeLines).toHaveCount(2)
+ await expect(nodeDates).toHaveCount(2)
+ await expect(childNodeLines).toHaveCount(3)
+ await expect(childNodeIcons).toHaveCount(3)
+ await expect(childNodeDates).toHaveCount(3)
+ await expect(details).toHaveCount(3)
+ await expect(userNames).toHaveCount(3)
+ for (let i = 0; i < 3; i++) {
+ await expect(childNodeLines.nth(i)).toHaveCSS('width', '4px')
+ await expect(childNodeLines.nth(i)).toHaveCSS('height', '88px')
+ await expect(details.nth(i)).toHaveText(texts[i])
+ await expect(childNodeDates.nth(i)).toHaveText(/20*1*:50/)
+
+ if (i === 2) {
+ await expect(childNodeLines.nth(i)).toHaveCSS('background-color', 'rgba(0, 0, 0, 0)')
+ }
+ if (i < 2) {
+ await expect(nodeIcons.nth(i)).toHaveCSS('width', '16px')
+ await expect(nodeIcons.nth(i)).toHaveCSS('height', '20px')
+ await expect(nodeLines.nth(i)).toHaveCSS('width', '4px')
+ await expect(nodeLines.nth(i)).toHaveCSS('height', '88px')
+ }
+ }
+
+ await userNames.first().hover()
+ await expect(xiaoHongTop).toBeVisible()
+ await expect(xiaoHongBottom).toBeVisible()
+ await expandBtns.nth(0).click()
+ await expect(nodeLines).toHaveCount(2)
+ await expect(nodeDates).toHaveCount(2)
+ await expect(childNodeLines).toHaveCount(1)
+ await expect(childNodeIcons).toHaveCount(1)
+ await expect(childNodeDates).toHaveCount(1)
+ await expect(details).toHaveCount(1)
+ await expect(userNames).toHaveCount(1)
+})
diff --git a/examples/docs/resources/pc/demo/wizard/vertical.spec.ts b/examples/docs/resources/pc/demo/wizard/vertical.spec.ts
new file mode 100644
index 000000000..96d1d22dc
--- /dev/null
+++ b/examples/docs/resources/pc/demo/wizard/vertical.spec.ts
@@ -0,0 +1,32 @@
+import { test, expect } from '@playwright/test'
+
+test('垂直流程图', async ({ page }) => {
+ page.on('pageerror', (exception) => expect(exception).not.toBeNull())
+ await page.goto('http://localhost:7130/pc/wizard/vertical')
+
+ const wizard = page.locator('.tiny-wizard__vertical')
+ const nodeLines = wizard.locator('.tiny-wizard__chart-line')
+ const nodeIcons = wizard.locator('.tiny-wizard__chart-icon')
+ const nodeNames = wizard.locator('.tiny-wizard__chart-name')
+ const nodeCount = 5
+ const names = ['提交提交', '直接主管审批通过', '二级主管审批同意', '一级审批', '完成完成']
+
+ await expect(nodeLines).toHaveCount(nodeCount)
+ await expect(nodeIcons).toHaveCount(nodeCount)
+ await expect(nodeNames).toHaveCount(nodeCount)
+ for (let i = 0; i < nodeCount; i++) {
+ await expect(nodeNames.nth(i)).toHaveText(names[i])
+ await expect(nodeLines.nth(i)).toHaveCSS('width', '4px')
+ await expect(nodeLines.nth(i)).toHaveCSS('height', '88px')
+ await expect(nodeIcons.nth(i)).toHaveCSS('height', '20px')
+ await expect(nodeIcons.nth(i)).toHaveCSS('height', '20px')
+
+ if (i === 3) {
+ await expect(nodeLines.nth(i)).toHaveCSS('background-color', 'rgb(194, 196, 199)')
+ await expect(nodeIcons.nth(i)).toHaveCSS('background-color', 'rgb(223, 225, 230)')
+ } else {
+ await expect(nodeLines.nth(i)).toHaveCSS('background-color', 'rgb(94, 124, 224)')
+ await expect(nodeIcons.nth(i)).toHaveCSS('background-color', 'rgb(94, 124, 224)')
+ }
+ }
+})
diff --git a/examples/vue2.7/.env.saas b/examples/vue2.7/.env.saas
new file mode 100644
index 000000000..da85b8245
--- /dev/null
+++ b/examples/vue2.7/.env.saas
@@ -0,0 +1 @@
+VITE_TINY_THEME=saas
\ No newline at end of file
diff --git a/examples/vue2.7/package.json b/examples/vue2.7/package.json
index d212bb960..bdd2df04a 100644
--- a/examples/vue2.7/package.json
+++ b/examples/vue2.7/package.json
@@ -8,6 +8,7 @@
],
"scripts": {
"dev": "vite --port 7127",
+ "dev:saas": "vite --port 7127 --mode saas",
"build": "vite build",
"preview": "vite preview",
"test:e2e": "playwright test",
@@ -29,7 +30,7 @@
"@playwright/test": "^1.29.2",
"@vitejs/plugin-vue2": "^2.2.0",
"@vitejs/plugin-vue2-jsx": "^1.1.0",
- "@vitest/ui": "^0.27.1",
+ "@vitest/ui": "^0.31.0",
"@vue/babel-helper-vue-jsx-merge-props": "^1.4.0",
"@vue/test-utils": "^1.3.3",
"jsdom": "^21.0.0",
diff --git a/examples/vue2.7/src/vite-env.d.ts b/examples/vue2.7/src/vite-env.d.ts
new file mode 100644
index 000000000..323c78a6c
--- /dev/null
+++ b/examples/vue2.7/src/vite-env.d.ts
@@ -0,0 +1,7 @@
+///
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/packages/theme-saas/src/svgs/down-ward.svg b/packages/theme-saas/src/svgs/down-ward.svg
new file mode 100644
index 000000000..04ad2d541
--- /dev/null
+++ b/packages/theme-saas/src/svgs/down-ward.svg
@@ -0,0 +1,10 @@
+
+
+
+
+
diff --git a/packages/theme-saas/src/svgs/left-ward-arrow.svg b/packages/theme-saas/src/svgs/left-ward-arrow.svg
new file mode 100644
index 000000000..739c047a5
--- /dev/null
+++ b/packages/theme-saas/src/svgs/left-ward-arrow.svg
@@ -0,0 +1,11 @@
+
+
+
+
+
diff --git a/packages/theme-saas/src/svgs/prompt-exclamation.svg b/packages/theme-saas/src/svgs/prompt-exclamation.svg
new file mode 100644
index 000000000..1c56238a1
--- /dev/null
+++ b/packages/theme-saas/src/svgs/prompt-exclamation.svg
@@ -0,0 +1,7 @@
+
+
+ icon/alert/prompt/16
+
+
+
\ No newline at end of file
diff --git a/packages/theme-saas/src/svgs/sort-default.svg b/packages/theme-saas/src/svgs/sort-default.svg
new file mode 100644
index 000000000..6da73e461
--- /dev/null
+++ b/packages/theme-saas/src/svgs/sort-default.svg
@@ -0,0 +1,7 @@
+
+
+
+
+
diff --git a/packages/theme-saas/src/svgs/sort-triangle-ascending.svg b/packages/theme-saas/src/svgs/sort-triangle-ascending.svg
new file mode 100644
index 000000000..d824a8d4b
--- /dev/null
+++ b/packages/theme-saas/src/svgs/sort-triangle-ascending.svg
@@ -0,0 +1,9 @@
+
+
+
diff --git a/packages/theme-saas/src/svgs/sort-triangle-descending.svg b/packages/theme-saas/src/svgs/sort-triangle-descending.svg
new file mode 100644
index 000000000..fd5f56ada
--- /dev/null
+++ b/packages/theme-saas/src/svgs/sort-triangle-descending.svg
@@ -0,0 +1,9 @@
+
+
+
diff --git a/packages/theme-saas/src/svgs/sort-triangle.svg b/packages/theme-saas/src/svgs/sort-triangle.svg
new file mode 100644
index 000000000..cc016c6fb
--- /dev/null
+++ b/packages/theme-saas/src/svgs/sort-triangle.svg
@@ -0,0 +1,12 @@
+
+
+
+
+
diff --git a/packages/theme-saas/src/textarea/index.less b/packages/theme-saas/src/textarea/index.less
new file mode 100644
index 000000000..b33535384
--- /dev/null
+++ b/packages/theme-saas/src/textarea/index.less
@@ -0,0 +1,118 @@
+/**
+* Copyright (c) 2022 - present TinyVue Authors.
+* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd.
+*
+* Use of this source code is governed by an MIT-style license.
+*
+* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL,
+* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR
+* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
+*
+*/
+
+@import '../mixins/input.less';
+@import '../mixins/common.less';
+@import '../custom.less';
+@import './vars.less';
+@import '../transition/icon.less';
+
+@textarea-prefix-cls: ~'@{css-prefix}textarea';
+@input-prefix-cls: ~'@{css-prefix}input';
+
+.@{textarea-prefix-cls} {
+ .component-css-vars-textarea();
+
+ position: relative;
+ display: inline-block;
+ width: 100%;
+ vertical-align: bottom;
+ font-size: var(--ti-textarea-font-size);
+ border: 1px solid var(--ti-textarea-border-color);
+ border-radius: var(--ti-textarea-border-radius);
+ &:hover{
+ border-color: var(--ti-textarea-hover-border-color);
+ }
+
+
+ &.is-disabled &__inner {
+ background-color: var(--ti-textarea-disabled-bg-color);
+ border-color: var(--ti-textarea-border-color);
+ color: var(--ti-textarea-disabled-text-color);
+ cursor: not-allowed;
+ .placeholder(@color: var(--ti-textarea-placeholder-text-color));
+ }
+
+ &.is-disabled{
+ background-color: var(--ti-textarea-disabled-bg-color);
+ &:hover {
+ border-color: var(--ti-textarea-border-color);
+ }
+ }
+
+ &.is-exceed {
+ .@{textarea-prefix-cls}__inner {
+ border-color: var(--ti-textarea-exceed-text-color);
+ }
+
+ .@{input-prefix-cls}__count {
+ color: var(--ti-textarea-exceed-text-color);
+ &-text-length{
+ color: var(--ti-textarea-exceed-text-color);
+ }
+ }
+ }
+
+ .@{input-prefix-cls}__count {
+ color: var(--ti-textarea-count-color);
+ background: var(--ti-textarea-bg-color);
+ font-size: var(--ti-textarea-count-font-size);
+ text-align: right;
+ position: absolute;
+ bottom: var(--ti-textarea-count-bottom);
+ right: var(--ti-textarea-count-right);
+ width: var(--ti-textarea-count-width);
+ border-bottom-left-radius: var(--ti-textarea-count-border-radius);
+ padding-right: var(--ti-textarea-count-padding-right);
+ &-text-length{
+ color: var(--ti-textarea-count-text-length-color);
+ }
+ }
+
+ &__inner {
+ display: block;
+ width: var(--ti-textarea-inner-width);
+ min-height: 60px;
+ min-height: calc(var(--ti-textarea-height, 30px) * 2);
+ color: var(--ti-textarea-text-color);
+ border: none;
+ border-radius: var(--ti-textarea-border-radius);
+ background: var(--ti-textarea-bg-color);
+ padding: var(--ti-textarea-padding-vertical) var(--ti-textarea-padding-horizontal);
+ padding-right: var(--ti-textarea-padding-right);
+ padding-bottom: var(--ti-textarea-padding-bottom);
+ line-height: 1.5;
+ font-size: var(--ti-textarea-font-size);
+ font-family: var(--ti-textarea-font-family);
+ resize: vertical;
+ box-sizing: border-box;
+ transition: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
+ .placeholder(@color: var(--ti-textarea-placeholder-text-color));
+
+ &:hover {
+ border-color: var(--ti-textarea-inner-hover-border-color);
+ }
+ &:focus {
+ border-color: var(--ti-textarea-inner-active-border-color);
+ }
+
+ .@{textarea-prefix-cls}:has(&:focus) {
+ border-color: var(--ti-textarea-active-border-color);
+ }
+
+ &:hover,
+ &:focus {
+ outline: 0;
+ }
+ }
+}
+
diff --git a/packages/theme-saas/src/textarea/vars.less b/packages/theme-saas/src/textarea/vars.less
new file mode 100644
index 000000000..9e68c7df6
--- /dev/null
+++ b/packages/theme-saas/src/textarea/vars.less
@@ -0,0 +1,70 @@
+/**
+* Copyright (c) 2022 - present TinyVue Authors.
+* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd.
+*
+* Use of this source code is governed by an MIT-style license.
+*
+* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL,
+* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR
+* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
+*
+*/
+
+.component-css-vars-textarea() {
+ // 文本域文本颜色
+ --ti-textarea-text-color: var(--ti-common-color-text-primary);
+ // 文本域背景颜色
+ --ti-textarea-bg-color: var(--ti-common-color-icon-white);
+ // 文本域字体大小
+ --ti-textarea-font-size: var(--ti-common-font-size-base);
+ // 文本域计数器字体大小
+ --ti-textarea-count-font-size: var(--ti-common-font-size-base);
+ // 文本域高度
+ --ti-textarea-height: var(--ti-common-size-height-normal);
+ // 文本域边框圆角
+ --ti-textarea-border-radius: var(--ti-common-border-radius-normal);
+ // 文本域边框色
+ --ti-textarea-border-color: var(--ti-common-color-border);
+ // 文本域内层hover时显示的边框颜色
+ --ti-textarea-inner-hover-border-color: var(--ti-common-color-border-hover);
+ // 文本域内层active时显示的边框颜色
+ --ti-textarea-inner-active-border-color: var(--ti-common-color-line-active);
+ // 文本域占位符文本颜色
+ --ti-textarea-placeholder-text-color: var(--ti-common-color-placeholder);
+ // 文本域disabled时的文本颜色
+ --ti-textarea-disabled-text-color: var(--ti-common-color-text-disabled);
+ // 文本域disabled时的背景颜色
+ --ti-textarea-disabled-bg-color: var(--ti-common-color-bg-disabled);
+ // 文本域exceed时的文本颜色
+ --ti-textarea-exceed-text-color: var(--ti-common-bg-primary);
+ // 计数器的颜色
+ --ti-textarea-count-color: var(--ti-common-color-text-weaken);
+ // 文本框垂直方向内边距
+ --ti-textarea-padding-vertical: var(--ti-common-space-2x);
+ // 文本框水平方向内边距
+ --ti-textarea-padding-horizontal: var(--ti-common-space-2x);
+ // 文本框右侧内边距
+ --ti-textarea-padding-right: var(--ti-common-space-2x);
+ // 文本框底部内边距
+ --ti-textarea-padding-bottom: var(--ti-common-space-2x);
+ // 计数器底部距离
+ --ti-textarea-count-bottom: 5px;
+ // 计数器右侧距离
+ --ti-textarea-count-right: 16px;
+ // 文本域hover时显示的边框颜色
+ --ti-textarea-hover-border-color: var(--ti-common-color-border-hover);
+ // 文本域active时显示的边框颜色
+ --ti-textarea-active-border-color: var(--ti-common-color-line-active);
+ // 计数器宽度
+ --ti-textarea-count-width: auto;
+ // 文本域宽度
+ --ti-textarea-inner-width: 100%;
+ // 计数器圆角
+ --ti-textarea-count-border-radius: 0;
+ // 计数器文本字数颜色
+ --ti-textarea-count-text-length-color: var(--ti-common-color-text-weaken);
+ // 计数器右侧内边距
+ --ti-textarea-count-padding-right: var(--ti-common-space-0);
+ // 文本框字体
+ --ti-textarea-font-family: var(--ti-common-font-family);
+}
diff --git a/packages/theme-saas/src/theme-tool.js b/packages/theme-saas/src/theme-tool.js
new file mode 100644
index 000000000..2d9dad10f
--- /dev/null
+++ b/packages/theme-saas/src/theme-tool.js
@@ -0,0 +1,132 @@
+/**
+ * Copyright (c) 2022 - present TinyVue Authors.
+ * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd.
+ *
+ * Use of this source code is governed by an MIT-style license.
+ *
+ * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL,
+ * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR
+ * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
+ *
+ */
+
+import definedComponents from './theme.config'
+
+/**
+ * TinyVue主题切换类 负责CSS变量主题的装卸，主题元数据转换成主题数据
+ * 使用示例：new TinyThemeTool(theme,'styleSheetId')
+ * @param {Object} theme 主题配置数据，结构如下：
+ * {
+ * id: 'tiny-infinity-theme',
+ * name: 'Infinity',
+ * cnName: '无限',
+ * data: {'ti-base-color': 'white'}
+ * }
+ * @param {String} styleSheetId style标签的id
+ */
+
+export default class TinyThemeTool {
+ // 当前主题
+ currentTheme
+
+ // 当前style标签元素
+ contentElement
+
+ // 当前style标签的id
+ styleSheetId
+
+ // 默认主题
+
+ defaultTheme = {
+ id: 'tiny-default-theme',
+ name: 'Default',
+ cnName: '默认',
+ data: {}
+ }
+
+ constructor(theme, styleSheetId = 'tinyThemeVariables') {
+ let currentTheme = theme
+ if (!theme) {
+ currentTheme = this.defaultTheme
+ }
+ this.styleSheetId = styleSheetId
+ this.changeTheme(currentTheme)
+ }
+
+ changeTheme(theme) {
+ let currentTheme = theme
+ if (typeof window === 'undefined' || typeof document === 'undefined') {
+ throw new TypeError('当前主题工具只支持浏览器环境')
+ }
+ if (!theme) {
+ currentTheme = this.defaultTheme
+ }
+ this.currentTheme = currentTheme
+ if (!this.contentElement) {
+ const styleElement = document.getElementById(this.styleSheetId)
+ if (styleElement) {
+ this.contentElement = styleElement
+ } else {
+ this.contentElement = document.createElement('style')
+ this.contentElement.id = this.styleSheetId
+ document.head.appendChild(this.contentElement)
+ }
+ }
+ this.contentElement.textContent = this.formatCSSVariables(currentTheme.data)
+
+ this.contentElement.setAttribute('tiny-theme', this.currentTheme.id)
+ }
+
+ // 通过 `组件css变量`，来推导出组件名： 从 ti-checkbox-button-bg-color， 推导出 checkbox-button
+ findClassName(name) {
+ const compNameList = name.split('-')
+ if (compNameList.length < 2) {
+ return false
+ }
+ const compLength = definedComponents.length
+ let compName = ''
+ for (let i = 0; i < compLength; i++) {
+ // 先试试是不是双段式的组件名： 比如dialog-box 这种
+ if (definedComponents[i] === `${compNameList[1]}-${compNameList[2]}`) {
+ compName = `tiny-${definedComponents[i]}`
+ break
+ }
+ }
+ // 不是双段的组件，则取第一位为组件名
+ if (!compName) {
+ compName = `tiny-${compNameList[1]}`
+ }
+
+ // 提高权重，促使主题变换成功
+ compName = `${compName}[class*=tiny]`
+ return compName
+ }
+
+ formatCSSVariables(themeData) {
+ const componentsMap = {}
+ let rootCssVar = 'html:root {'
+ let componentsCssVar = ''
+
+ Object.keys(themeData).forEach((item) => {
+ const isBaseCssVar = item.startsWith('ti-base') || item.startsWith('ti-common')
+ if (isBaseCssVar) {
+ rootCssVar += `--${item}:${themeData[item]};`
+ } else {
+ const classkey = this.findClassName(item)
+ if (classkey) {
+ if (componentsMap[classkey]) {
+ componentsMap[classkey].push(`--${item}:${themeData[item]};`)
+ } else {
+ componentsMap[classkey] = [`--${item}:${themeData[item]};`]
+ }
+ }
+ }
+ })
+
+ Object.keys(componentsMap).forEach((item) => {
+ componentsCssVar += `.${item}{${componentsMap[item].join('')}}`
+ })
+
+ return `${rootCssVar}}${componentsCssVar}`
+ }
+}
diff --git a/packages/theme-saas/src/theme.config.js b/packages/theme-saas/src/theme.config.js
new file mode 100644
index 000000000..76f0a4f7a
--- /dev/null
+++ b/packages/theme-saas/src/theme.config.js
@@ -0,0 +1,79 @@
+/**
+ * Copyright (c) 2022 - present TinyVue Authors.
+ * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd.
+ *
+ * Use of this source code is governed by an MIT-style license.
+ *
+ * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL,
+ * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR
+ * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
+ *
+ */
+
+export default [
+ 'action-menu',
+ 'bulletin-board',
+ 'button-group',
+ 'card-container',
+ 'card-item',
+ 'card-layout',
+ 'card-template',
+ 'carousel-item',
+ 'cascader-menu',
+ 'cascader-panel',
+ 'cascader-node',
+ 'checkbox-button',
+ 'checkbox-group',
+ 'context-menu',
+ 'collapse-item',
+ 'detail-page',
+ 'dialog-box',
+ 'dropdown-item',
+ 'dropdown-menu',
+ 'drop-roles',
+ 'drop-times',
+ 'date-panel',
+ 'date-picker',
+ 'data-range',
+ 'date-table',
+ 'fall-menu',
+ 'form-item',
+ 'img-preview',
+ 'img-preview-item',
+ 'ip-address',
+ 'link-menu',
+ 'month-range',
+ 'month-table',
+ 'nav-menu',
+ 'option-group',
+ 'option',
+ 'pop-editor',
+ 'popup-horiz-menu',
+ 'popup-menu',
+ 'picker-panel',
+ 'quick-link-menu',
+ 'time-picker',
+ 'time-spinner',
+ 'time-panel',
+ 'time-range',
+ 'time-select',
+ 'scroll-text',
+ 'slide-bar',
+ 'slide-img',
+ 'select-dropdown',
+ 'suggest-popup',
+ 'tab-item',
+ 'tabs-dropdown',
+ 'textarea',
+ 'text-parse',
+ 'text-popup',
+ 'toggle-menu',
+ 'tree-menu',
+ 'upload-list',
+ 'user-account',
+ 'user-card',
+ 'user-contact',
+ 'user-head',
+ 'user-link',
+ 'year-table'
+]
diff --git a/packages/theme-saas/src/theme/aurora-theme/index.js b/packages/theme-saas/src/theme/aurora-theme/index.js
new file mode 100644
index 000000000..244254ea6
--- /dev/null
+++ b/packages/theme-saas/src/theme/aurora-theme/index.js
@@ -0,0 +1 @@
+export const tinyBaseAuroraTheme = {}
diff --git a/packages/theme-saas/src/theme/deep-theme/index.js b/packages/theme-saas/src/theme/deep-theme/index.js
new file mode 100644
index 000000000..bc5104a5c
--- /dev/null
+++ b/packages/theme-saas/src/theme/deep-theme/index.js
@@ -0,0 +1,13 @@
+/**
+ * Copyright (c) 2022 - present TinyVue Authors.
+ * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd.
+ *
+ * Use of this source code is governed by an MIT-style license.
+ *
+ * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL,
+ * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR
+ * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
+ *
+ */
+
+export const deepTheme = {}
diff --git a/packages/theme-saas/src/theme/galaxy-theme/index.js b/packages/theme-saas/src/theme/galaxy-theme/index.js
new file mode 100644
index 000000000..12661b280
--- /dev/null
+++ b/packages/theme-saas/src/theme/galaxy-theme/index.js
@@ -0,0 +1,13 @@
+/**
+ * Copyright (c) 2022 - present TinyVue Authors.
+ * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd.
+ *
+ * Use of this source code is governed by an MIT-style license.
+ *
+ * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL,
+ * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR
+ * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
+ *
+ */
+
+export const galaxyTheme = {}
diff --git a/packages/theme-saas/src/theme/impression-theme/index.js b/packages/theme-saas/src/theme/impression-theme/index.js
new file mode 100644
index 000000000..49b8670e7
--- /dev/null
+++ b/packages/theme-saas/src/theme/impression-theme/index.js
@@ -0,0 +1,14 @@
+/**
+* Copyright (c) 2022 - present TinyVue Authors.
+* Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd.
+*
+* Use of this source code is governed by an MIT-style license.
+*
+* THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL,
+* BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR
+* A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
+*
+*/
+
+export const impressionTheme = {
+}
diff --git a/packages/theme-saas/src/theme/index.js b/packages/theme-saas/src/theme/index.js
new file mode 100644
index 000000000..d757c8ca8
--- /dev/null
+++ b/packages/theme-saas/src/theme/index.js
@@ -0,0 +1,61 @@
+/**
+ * Copyright (c) 2022 - present TinyVue Authors.
+ * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd.
+ *
+ * Use of this source code is governed by an MIT-style license.
+ *
+ * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL,
+ * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR
+ * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
+ *
+ */
+
+import { flattenObject } from './utils'
+import { impressionTheme } from './impression-theme'
+import { infinityTheme } from './infinity-theme'
+import { deepTheme } from './deep-theme'
+import { galaxyTheme } from './galaxy-theme'
+import * as auroraTheme from './aurora-theme'
+import * as smbTheme from './smb-theme'
+
+export const tinyImpressionTheme = {
+ id: 'tiny-impression-theme',
+ name: 'Impression',
+ cnName: '印象',
+ data: impressionTheme
+}
+
+export const tinyInfinityTheme = {
+ id: 'tiny-infinity-theme',
+ name: 'Infinity',
+ cnName: '无限',
+ data: infinityTheme
+}
+
+export const tinyDeepTheme = {
+ id: 'tiny-deep-theme',
+ name: 'Deep',
+ cnName: '深邃夜空',
+ data: deepTheme
+}
+
+export const tinyGalaxyTheme = {
+ id: 'tiny-galaxy-theme',
+ name: 'Galaxy',
+ cnName: '追光',
+ data: galaxyTheme
+}
+
+export const tinyAuroraTheme = {
+ id: 'tiny-aurora-theme',
+ name: 'Aurora',
+ cnName: 'Aurora',
+ data: flattenObject(auroraTheme)
+}
+
+export const tinySmbTheme = {
+ id: 'tiny-smb-theme',
+ name: 'SMB',
+ cnName: 'SMB',
+ data: flattenObject(smbTheme)
+}
diff --git a/packages/theme-saas/src/theme/infinity-theme/index.js b/packages/theme-saas/src/theme/infinity-theme/index.js
new file mode 100644
index 000000000..2dfa228b5
--- /dev/null
+++ b/packages/theme-saas/src/theme/infinity-theme/index.js
@@ -0,0 +1,13 @@
+/**
+ * Copyright (c) 2022 - present TinyVue Authors.
+ * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd.
+ *
+ * Use of this source code is governed by an MIT-style license.
+ *
+ * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL,
+ * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR
+ * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
+ *
+ */
+
+export const infinityTheme = {}
diff --git a/packages/theme-saas/src/theme/smb-theme/index.js b/packages/theme-saas/src/theme/smb-theme/index.js
new file mode 100644
index 000000000..dfd526f0c
--- /dev/null
+++ b/packages/theme-saas/src/theme/smb-theme/index.js
@@ -0,0 +1 @@
+export const tinyBaseSmbTheme = {}
diff --git a/packages/theme-saas/src/theme/utils.js b/packages/theme-saas/src/theme/utils.js
new file mode 100644
index 000000000..b5beeb04c
--- /dev/null
+++ b/packages/theme-saas/src/theme/utils.js
@@ -0,0 +1,12 @@
+export function flattenObject(obj) {
+ const result = {}
+
+ Object.entries(obj).forEach(([key, val]) => {
+ if (val && typeof val === 'object')
+ Object.assign(result, val)
+ else
+ result[key] = val
+ })
+
+ return result
+}
diff --git a/packages/theme/package.json b/packages/theme/package.json
index b6c487baa..fd3158593 100644
--- a/packages/theme/package.json
+++ b/packages/theme/package.json
@@ -1,6 +1,6 @@
{
"name": "@opentiny/vue-theme",
- "version": "3.8.2",
+ "version": "3.8.0",
"description": "An enterprise-class UI component library, support both Vue.js 2 and Vue.js 3, as well as PC and mobile.",
"main": "index.css",
"homepage": "https://opentiny.design/tiny-vue",
diff --git a/packages/theme/scripts/build-theme-json.js b/packages/theme/scripts/build-theme-json.js
index 3d6aa386a..97d61c348 100644
--- a/packages/theme/scripts/build-theme-json.js
+++ b/packages/theme/scripts/build-theme-json.js
@@ -6,7 +6,7 @@
const fs = require('fs')
const path = require('path')
const fg = require('fast-glob')
-const allComp = require('./components')
+const aliasCompName = require('./components')
const xlsx = require('node-xlsx')
const themeConfFile = path.resolve(__dirname, './theme.json')
@@ -73,10 +73,8 @@ function parseFile(component) {
let [_, key, value] = matches
- const componentName = allComp[component.name]
- if (componentName) {
- formated.push(formatRule(componentName, key, value, desc))
- }
+ const name = aliasCompName[component.name] || component.name
+ formated.push(formatRule(name, key, value, desc))
desc = '未知变量'
}
}
@@ -112,11 +110,28 @@ fg(['**/vars.less']).then((files) => {
function writeExcel(data, fileName) {
const excelData = []
- data.forEach(item => {
+ data.forEach((item) => {
let addInfo = {}
addInfo.name = item.name + '配置化'
addInfo.data = [
- ['id', 'key', 'variable（可选）', 'value（可选）', 'desc', 'descEn', 'component', 'componentDesc', 'componentDescEn', 'selector', 'type', 'group', 'isImportant', 'ui（所属的框架）', 'show', 'configurable']
+ [
+ 'id',
+ 'key',
+ 'variable（可选）',
+ 'value（可选）',
+ 'desc',
+ 'descEn',
+ 'component',
+ 'componentDesc',
+ 'componentDescEn',
+ 'selector',
+ 'type',
+ 'group',
+ 'isImportant',
+ 'ui（所属的框架）',
+ 'show',
+ 'configurable'
+ ]
]
item.data.forEach((idKey, i) => {
if (i === 0) {
@@ -140,16 +155,18 @@ function writeThemeExcel() {
let themeData = fs.readFileSync(themeConfFile, 'utf-8').toString()
themeData = JSON.parse(themeData)
const openXlsxObj = {}
- Object.values(themeData).forEach(item => {
+ Object.values(themeData).forEach((item) => {
// 过滤掉非开源的
if (item.isOpen) {
delete item.isOpen
- openXlsxObj[item.component] = openXlsxObj[item.component] ? [...openXlsxObj[item.component], Object.values(item)] : [Object.values(item)]
+ openXlsxObj[item.component] = openXlsxObj[item.component]
+ ? [...openXlsxObj[item.component], Object.values(item)]
+ : [Object.values(item)]
}
})
const openXlsxArr = []
- Object.entries(openXlsxObj).forEach(item => {
+ Object.entries(openXlsxObj).forEach((item) => {
openXlsxArr.push({ name: item[0], data: item[1] })
})
writeExcel(openXlsxArr, 'themeExcel')
diff --git a/packages/theme/scripts/components.js b/packages/theme/scripts/components.js
index 5e95b40aa..e79ca9855 100644
--- a/packages/theme/scripts/components.js
+++ b/packages/theme/scripts/components.js
@@ -1,33 +1,15 @@
// 组件和文件夹名映射表
module.exports = {
// 开源组件
- 'action-menu': 'action-menu',
- alert: 'alert',
- anchor: 'anchor',
- autocomplete: 'autocomplete',
- badge: 'badge',
- breadcrumb: 'breadcrumb',
'breadcrumb-item': 'breadcrumb',
- 'bulletin-board': 'bulletin-board',
- button: 'button',
- 'button-group': 'button-group',
- calendar: 'calendar',
- carousel: 'carousel',
'carousel-item': 'carousel',
- cascader: 'cascader',
'cascader-menu': 'cascader',
'cascader-node': 'cascader',
- 'cascader-panel': 'cascader-panel',
- checkbox: 'checkbox',
'checkbox-button': 'checkbox',
'checkbox-group': 'checkbox',
- collapse: 'collapse',
'collapse-item': 'collapse',
- container: 'container',
'credit-card': 'credit-card-form',
'credit-card-form': 'credit-card-form',
- crop: 'crop',
- 'date-picker': 'date-picker',
'picker': 'date-picker',
'time-spinner': 'date-picker',
'date-panel': 'date-picker',
@@ -37,90 +19,19 @@ module.exports = {
'time-panel': 'date-picker',
'time-range': 'date-picker',
'year-table': 'date-picker',
- 'dialog-box': 'dialog-box',
- 'detail-page': 'detail-page',
- dropdown: 'dropdown',
'dropdown-item': 'dropdown',
'dropdown-menu': 'dropdown',
- 'drop-times': 'drop-times',
- 'fall-menu': 'fall-menu',
- 'file-upload': 'file-upload',
'upload': 'file-upload',
'upload-dragger': 'file-upload',
'upload-list': 'file-upload',
- floatbar: 'floatbar',
- form: 'form',
'form-item': 'form',
- fullscreen: 'fullscreen',
- grid: 'grid',
- image: 'image',
'image-viewer': 'image',
-
- input: 'input',
'tall-storage': 'input',
- 'ip-address': 'ip-address',
- layout: 'layout',
- link: 'link',
- 'link-menu': 'link-menu',
- loading: 'loading',
- milestone: 'milestone',
- modal: 'modal',
- 'nav-menu': 'nav-menu',
- notify: 'notify',
- numeric: 'numeric',
- pager: 'pager',
- 'pop-upload': 'pop-upload',
- popeditor: 'popeditor',
- popover: 'popover',
- progress: 'progress',
- radio: 'radio',
'radio-button': 'radio',
'radio-group': 'radio',
- rate: 'rate',
'scroll-text': 'scroll-text',
- search: 'search',
- select: 'select',
- option: 'select',
'option-group': 'select',
'select-dropdown': 'select',
- 'slide-bar': 'slide-bar',
- slider: 'slider',
- split: 'split',
- steps: 'steps',
- switch: 'switch',
- tabs: 'tabs',
- tag: 'tag',
- 'text-popup': 'text-popup',
- 'time-line': 'time-line',
- 'time-picker': 'time-picker',
- textarea: 'textarea',
- 'time-select': 'time-select',
- 'toggle-menu': 'toggle-menu',
- tooltip: 'tooltip',
- transfer: 'transfer',
- tree: 'tree',
- 'tree-menu': 'tree-menu',
- 'user-contact': 'user-contact',
'card-template': 'user-contact',
- espace: 'user-contact',
- 'user-head': 'user-head',
- wizard: 'wizard',
-
- // 非开源组件
- amount: 'amount',
- company: 'company',
- country: 'country',
- currency: 'currency',
- dept: 'dept',
- 'drop-roles': 'drop-roles',
- hrapprover: 'hrapprover',
- logout: 'logout',
- menubar: 'menubar',
- poplist: 'poplist',
- roles: 'roles',
- scrollbar: 'scrollbar',
- 'top-box': 'top-box',
- user: 'user',
- 'user-account': 'user-account',
- 'user-link': 'user-link',
+ espace: 'user-contact'
}
diff --git a/packages/theme/src/alert/aurora-theme.js b/packages/theme/src/alert/aurora-theme.js
index 772a56a67..c424cc229 100644
--- a/packages/theme/src/alert/aurora-theme.js
+++ b/packages/theme/src/alert/aurora-theme.js
@@ -1,5 +1,4 @@
export const tinyAlertAuroraTheme = {
- 'ti-alert-normal-height': 'var(--ti-common-size-9x)',
'ti-alert-normal-padding-top': 'var(--ti-common-space-2x)',
'ti-alert-normal-padding-right': 'var(--ti-common-space-3x)',
'ti-alert-normal-padding-left': 'var(--ti-common-space-3x)',
diff --git a/packages/theme/src/alert/index.less b/packages/theme/src/alert/index.less
index 630f6c000..d04958a33 100644
--- a/packages/theme/src/alert/index.less
+++ b/packages/theme/src/alert/index.less
@@ -26,7 +26,6 @@
font-family: var(--ti-alert-font-family);
&&--normal {
- height: var(--ti-alert-normal-height);
padding: var(--ti-alert-normal-padding-top) var(--ti-alert-normal-padding-right) var(--ti-alert-normal-padding-bottom) var(--ti-alert-normal-padding-left);
margin: var(--ti-alert-normal-margin-vertical) var(--ti-alert-normal-margin-horizontal);
display: flex;
diff --git a/packages/theme/src/alert/smb-theme.js b/packages/theme/src/alert/smb-theme.js
index 4bf73310d..dd71eb0b5 100644
--- a/packages/theme/src/alert/smb-theme.js
+++ b/packages/theme/src/alert/smb-theme.js
@@ -1,5 +1,4 @@
export const tinyAlertSmbTheme = {
- 'ti-alert-normal-height': 'var(--ti-common-space-10x)',
'ti-alert-border-radius': 'var(--ti-common-border-radius-4)',
'ti-alert-description-font-size': 'var(--ti-common-font-size-1)',
'ti-alert-warning-border-color': 'transparent',
@@ -25,8 +24,8 @@ export const tinyAlertSmbTheme = {
'ti-alert-normal-padding-left': 'var(--ti-common-space-4x)',
'ti-alert-normal-padding-right': 'var(--ti-common-space-3x)',
'ti-alert-title-font-size': 'var(--ti-common-font-size-4)',
- 'ti-alert-icon-font-size': 'var(--ti-common-font-size-2)',
- 'ti-alert-large-icon-font-size': 'var(--ti-common-font-size-5)',
+ 'ti-alert-icon-font-size': 'var(--ti-common-font-size-base)',
+ 'ti-alert-large-icon-font-size': '21px',
'ti-alert-large-icon-margin-top': '3px',
'ti-alert-large-padding-top': 'var(--ti-common-space-4x)',
'ti-alert-large-padding-bottom': 'var(--ti-common-space-4x)',
diff --git a/packages/theme/src/alert/vars.less b/packages/theme/src/alert/vars.less
index beb560d23..2375f37ab 100644
--- a/packages/theme/src/alert/vars.less
+++ b/packages/theme/src/alert/vars.less
@@ -21,14 +21,12 @@
--ti-alert-close-text-font-size: var(--ti-common-font-size-base);
// 组件圆角
--ti-alert-border-radius: var(--ti-common-border-radius-normal);
- // 组件高度
- --ti-alert-normal-height: calc(var(--ti-common-size-base) * 10.5);
// 标题文本色
--ti-alert-title-text-color: var(--ti-common-color-text-primary);
// 标题字号
--ti-alert-title-font-size: var(--ti-common-font-size-1);
// 标题图标字号
- --ti-alert-icon-font-size: var(--ti-common-font-size-2);
+ --ti-alert-icon-font-size: var(--ti-common-font-size-1);
// 描述内容行高
--ti-alert-description-line-height: var(--ti-common-line-height-number);
// 描述内容顶部内边距
@@ -66,7 +64,7 @@
// large尺寸操作字号
--ti-alert-opration-font-size: var(--ti-common-font-size-base);
// large尺寸图标字号
- --ti-alert-large-icon-font-size: var(--ti-common-font-size-5);
+ --ti-alert-large-icon-font-size: 21px;
// large尺寸图标顶部外边距
--ti-alert-large-icon-margin-top: calc(var(--ti-common-space-base) - 2px);
// large尺寸描述内容左内边距
@@ -123,4 +121,4 @@
--ti-alert-info-close-icon-color: var(--ti-alert-info-icon-color);
// info类型悬浮关闭图标色
--ti-alert-info-close-hover-icon-color: var(--ti-alert-info-icon-color);
-}
\ No newline at end of file
+}
diff --git a/packages/theme/src/anchor/index.less b/packages/theme/src/anchor/index.less
index 1acc0c816..7846d962d 100644
--- a/packages/theme/src/anchor/index.less
+++ b/packages/theme/src/anchor/index.less
@@ -67,17 +67,14 @@
&-title {
display: block;
max-width: 100%;
- padding: var(--ti-anchor-link-title-padding-vertical) var(--ti-anchor-link-title-padding-right) var(--ti-anchor-link-title-padding-vertical) var(--ti-anchor-link-title-padding-left);
+ padding: var(--ti-anchor-link-title-padding-vertical) var(--ti-anchor-link-title-padding-right)
+ var(--ti-anchor-link-title-padding-vertical) var(--ti-anchor-link-title-padding-left);
white-space: nowrap;
text-overflow: ellipsis;
color: var(--ti-anchor-text-color);
- &--active {
+ &&--active {
color: var(--ti-anchor-link-active-text-color);
}
}
}
}
-
-.tiny-anchor-scroll-container {
- scroll-behavior: smooth;
-}
diff --git a/packages/theme/src/anchor/vars.less b/packages/theme/src/anchor/vars.less
index b801f8264..ba9d6e1b0 100644
--- a/packages/theme/src/anchor/vars.less
+++ b/packages/theme/src/anchor/vars.less
@@ -26,7 +26,7 @@
// 选中锚点文本色
--ti-anchor-link-active-text-color: var(--ti-common-color-primary-active);
// 选中锚点蒙层背景色
- --ti-anchor-link-mask-bg-color: var(--ti-common-color-info-plain-disabled-bg-color);
+ --ti-anchor-link-mask-bg-color: rgba(80, 115, 229, 0.15);
// 悬浮锚点文本色
--ti-anchor-link-hover-text-color: var(--ti-common-color-primary-active);
// 锚点竖向轨道背景色
diff --git a/packages/theme/src/breadcrumb/aurora-theme.js b/packages/theme/src/breadcrumb/aurora-theme.js
index 7ea4aa86d..668158823 100644
--- a/packages/theme/src/breadcrumb/aurora-theme.js
+++ b/packages/theme/src/breadcrumb/aurora-theme.js
@@ -1,3 +1,4 @@
export const tinyBreadcrumbAuroraTheme = {
- 'ti-breadcrumb-text-color': '#333'
+ 'ti-breadcrumb-text-color': '#333',
+ 'ti-breadcrumb-selected-hover-text-color': '#1890ff'
}
diff --git a/packages/theme/src/breadcrumb/index.less b/packages/theme/src/breadcrumb/index.less
index 134af33a0..0850edf31 100644
--- a/packages/theme/src/breadcrumb/index.less
+++ b/packages/theme/src/breadcrumb/index.less
@@ -66,10 +66,7 @@
color: var(--ti-breadcrumb-hover-text-color);
text-decoration: var(--ti-breadcrumb-hover-text-decoration);
}
-
}
-
-
}
& &__separator {
@@ -90,14 +87,14 @@
& &__item:last-child:hover {
cursor: text;
- color: var(--ti-breadcrumb-hover-text-color);
text-decoration: none;
-
+ .@{breadcrumb-prefix-cls}__inner {
+ color: var(--ti-breadcrumb-selected-hover-text-color);
+ }
a {
cursor: text;
- color: var(--ti-breadcrumb-selected-text-color);
+ color: var(--ti-breadcrumb-selected-hover-text-color);
text-decoration: none;
}
-
}
-}
\ No newline at end of file
+}
diff --git a/packages/theme/src/breadcrumb/vars.less b/packages/theme/src/breadcrumb/vars.less
index 9e6d9568d..4d460a57e 100644
--- a/packages/theme/src/breadcrumb/vars.less
+++ b/packages/theme/src/breadcrumb/vars.less
@@ -35,4 +35,6 @@
--ti-breadcrumb-text-font-weight: var(--ti-common-font-weight-7);
// 当前节点文本色
--ti-breadcrumb-selected-text-color: var(--ti-common-color-text-primary);
-}
\ No newline at end of file
+ // 当前节点悬浮文本色
+ --ti-breadcrumb-selected-hover-text-color: var(--ti-breadcrumb-selected-text-color);
+}
diff --git a/packages/theme/src/button-group/index.less b/packages/theme/src/button-group/index.less
index 26d8ff179..ba36447b8 100644
--- a/packages/theme/src/button-group/index.less
+++ b/packages/theme/src/button-group/index.less
@@ -111,7 +111,7 @@
&.plain,
&[plain] {
- color: var(--ti-button-group-item-active-bg-color);
+ color: var(--ti-button-group-item-active-text-color);
background: none;
}
}
diff --git a/packages/theme/src/button/index.less b/packages/theme/src/button/index.less
index f9f0fc566..034442c30 100644
--- a/packages/theme/src/button/index.less
+++ b/packages/theme/src/button/index.less
@@ -329,10 +329,8 @@
border-radius: var(--ti-button-text-hover-border-radius);
- & .@{svg-prefix-cls} {
- width: var(--ti-button-text-svg-width);
- height: var(--ti-button-text-svg-height);
- fill: var(--ti-button-text-svg-fill);
+ &:has(.@{svg-prefix-cls}) {
+ padding: 0 var(--ti-button-text-svg-padding-horizontal);
}
&:has(.@{svg-prefix-cls}):hover {
@@ -344,10 +342,6 @@
}
}
- &:has(.@{svg-prefix-cls}) {
- padding: 0 var(--ti-button-text-svg-padding-horizontal);
- }
-
&:has(.@{svg-prefix-cls}).is-disabled {
background: transparent;
fill: var(--ti-button-text-svg-fill-disabled);
@@ -361,6 +355,66 @@
background: transparent;
}
}
+
+ & .@{svg-prefix-cls} {
+ vertical-align: middle;
+ fill: var(--ti-button-text-svg-fill);
+ }
+
+ &.@{button-prefix-cls}.@{button-prefix-cls}--large {
+ min-width: var(--ti-button-text-size-large-min-width);
+ height: var(--ti-button-text-size-large-height);
+ line-height: calc(var(--ti-button-text-size-large-height) - 2px);
+
+ svg {
+ width: var(--ti-button-text-size-large-svg-width);
+ height: var(--ti-button-text-size-large-svg-height);
+ }
+ }
+
+ &.@{button-prefix-cls}.@{button-prefix-cls}--medium {
+ min-width: var(--ti-button-text-size-medium-min-width);
+ height: var(--ti-button-text-size-medium-height);
+ line-height: calc(var(--ti-button-text-size-medium-height) - 2px);
+
+ svg {
+ width: var(--ti-button-text-size-medium-svg-width);
+ height: var(--ti-button-text-size-medium-svg-height);
+ }
+ }
+
+ &.@{button-prefix-cls} {
+ min-width: var(--ti-button-text-size-default-min-width);
+ height: var(--ti-button-text-size-default-height);
+ line-height: calc(var(--ti-button-text-size-default-height) - 2px);
+
+ svg {
+ width: var(--ti-button-text-size-default-svg-width);
+ height: var(--ti-button-text-size-default-svg-height);
+ }
+ }
+
+ &.@{button-prefix-cls}.@{button-prefix-cls}--small {
+ min-width: var(--ti-button-text-size-small-min-width);
+ height: var(--ti-button-text-size-small-height);
+ line-height: calc(var(--ti-button-text-size-small-height) - 2px);
+
+ svg {
+ width: var(--ti-button-text-size-small-svg-width);
+ height: var(--ti-button-text-size-small-svg-height);
+ }
+ }
+
+ &.@{button-prefix-cls}.@{button-prefix-cls}--mini {
+ min-width: var(--ti-button-text-size-mini-min-width);
+ height: var(--ti-button-text-size-mini-height);
+ line-height: calc(var(--ti-button-text-size-mini-height) - 2px);
+
+ svg {
+ width: var(--ti-button-text-size-mini-svg-width);
+ height: var(--ti-button-text-size-mini-svg-height);
+ }
+ }
}
&&--large {
diff --git a/packages/theme/src/button/smb-theme.js b/packages/theme/src/button/smb-theme.js
index 136c9164a..a9734b02d 100644
--- a/packages/theme/src/button/smb-theme.js
+++ b/packages/theme/src/button/smb-theme.js
@@ -42,4 +42,24 @@ export const tinyButtonSmbTheme = {
'ti-button-size-large-margin-left': '16px',
'ti-button-size-medium-margin-left': '16px',
'ti-button-size-small-margin-left': '8px',
+ 'ti-button-text-size-large-min-width': '56px',
+ 'ti-button-text-size-large-height': '56px',
+ 'ti-button-text-size-large-svg-width': '48px',
+ 'ti-button-text-size-large-svg-height': '48px',
+ 'ti-button-text-size-medium-min-width': '40px',
+ 'ti-button-text-size-medium-height': '40px',
+ 'ti-button-text-size-medium-svg-width': '32px',
+ 'ti-button-text-size-medium-svg-height': '32px',
+ 'ti-button-text-size-default-min-width': '32px',
+ 'ti-button-text-size-default-height': '32px',
+ 'ti-button-text-size-default-svg-width': '24px',
+ 'ti-button-text-size-default-svg-height': '24px',
+ 'ti-button-text-size-small-min-width': '24px',
+ 'ti-button-text-size-small-height': '24px',
+ 'ti-button-text-size-small-svg-width': '16px',
+ 'ti-button-text-size-small-svg-height': '16px',
+ 'ti-button-text-size-mini-min-width': '24px',
+ 'ti-button-text-size-mini-height': '24px',
+ 'ti-button-text-size-mini-svg-width': '16px',
+ 'ti-button-text-size-mini-svg-height': '16px',
}
diff --git a/packages/theme/src/button/vars.less b/packages/theme/src/button/vars.less
index d835c188f..d02a2c0cc 100644
--- a/packages/theme/src/button/vars.less
+++ b/packages/theme/src/button/vars.less
@@ -92,7 +92,7 @@
--ti-button-size-mini-padding-horizontal: var(--ti-common-size-2x);
// 迷你尺寸按钮最小宽度
--ti-button-size-mini-mini-width: var(--ti-common-size-16x);
-
+
// 默认按钮文本色
--ti-button-normal-text-color: var(--ti-common-color-text-primary);
@@ -133,6 +133,10 @@
--ti-button-text-svg-width: 1em;
// 文字按钮图标高度
--ti-button-text-svg-height: 1em;
+ // mini文字按钮图标宽度
+ --ti-button-text-size-mini-svg-width: 1em;
+ // mini文字按钮图标高度
+ --ti-button-text-size-mini-svg-width: 1em;
// 文字按钮悬浮背景色
--ti-button-text-hover-bg-color: transparent;
// 文字按钮悬浮圆角
@@ -319,4 +323,49 @@
--ti-button-padding-horizontal: var(--ti-common-space-5x);
// 默认圆形按钮内边距
--ti-button-size-normal-padding: var(--ti-common-space-2x);
+
+ // 纯文本按钮超大尺寸最小宽度
+ --ti-button-text-size-large-min-width: var(--ti-common-size-24x);
+ // 纯文本按钮超大尺寸高度
+ --ti-button-text-size-large-height: var(--ti-common-size-height-large);
+ // 纯文本按钮超大尺寸图标宽度
+ --ti-button-text-size-large-svg-width: 1em;
+ // 纯文本按钮超大尺寸图标高度
+ --ti-button-text-size-large-svg-height: 1em;
+
+ // 纯文本按钮中等尺寸最小宽度
+ --ti-button-text-size-medium-min-width: var(--ti-common-size-22x);
+ // 纯文本按钮中等尺寸高度
+ --ti-button-text-size-medium-height: var(--ti-common-size-height-medium);
+ // 纯文本按钮中等尺寸图标宽度
+ --ti-button-text-size-medium-svg-width: 1em;
+ // 纯文本按钮中等尺寸图标高度
+ --ti-button-text-size-medium-svg-height: 1em;
+
+ // 纯文本按钮默认尺寸最小宽度
+ --ti-button-text-size-default-min-width: var(--ti-common-size-20x);
+ // 纯文本按钮默认尺寸高度
+ --ti-button-text-size-default-height: var(--ti-common-size-height-normal);
+ // 纯文本按钮默认尺寸图标宽度
+ --ti-button-text-size-default-svg-width: 1em;
+ // 纯文本按钮默认尺寸图标高度
+ --ti-button-text-size-default-svg-height: 1em;
+
+ // 纯文本按钮小尺寸最小宽度
+ --ti-button-text-size-small-min-width: var(--ti-common-size-18x);
+ // 纯文本按钮小尺寸高度
+ --ti-button-text-size-small-height: var(--ti-common-size-height-small);
+ // 纯文本按钮小尺寸图标宽度
+ --ti-button-text-size-small-svg-width: 1em;
+ // 纯文本按钮小尺寸图标高度
+ --ti-button-text-size-small-svg-height: 1em;
+
+ // 纯文本按钮迷你尺寸最小宽度
+ --ti-button-text-size-small-min-width: var(--ti-common-size-16x);
+ // 纯文本按钮迷你尺寸高度
+ --ti-button-text-size-small-height: var(--ti-common-size-height-mini);
+ // 纯文本按钮迷你尺寸图标宽度
+ --ti-button-text-size-small-svg-width: 1em;
+ // 纯文本按钮迷你尺寸图标高度
+ --ti-button-text-size-small-svg-height: 1em;
}
diff --git a/packages/theme/src/checkbox/aurora-theme.js b/packages/theme/src/checkbox/aurora-theme.js
index abe7dbe2a..dfc5636b3 100644
--- a/packages/theme/src/checkbox/aurora-theme.js
+++ b/packages/theme/src/checkbox/aurora-theme.js
@@ -1,5 +1,9 @@
export const tinyCheckboxAuroraTheme = {
'ti-checkbox-bg-color-checked-disabled': '#999',
'ti-checkbox-border-color-checked-disabled': '#999',
- 'ti-checkbox-icon-color-disabled': '#fff'
+ 'ti-checkbox-icon-color-disabled': '#fff',
+ 'ti-checkbox-width': 'calc(var(--ti-common-size-3x) + 2px)',
+ 'ti-checkbox-height': 'calc(var(--ti-common-size-3x) + 2px)',
+ 'ti-checkbox-icon-margin-left': '3px',
+ 'ti-checkbox-icon-margin-top': '-1px',
}
diff --git a/packages/theme/src/checkbox/index.less b/packages/theme/src/checkbox/index.less
index e98849d42..79132c4aa 100644
--- a/packages/theme/src/checkbox/index.less
+++ b/packages/theme/src/checkbox/index.less
@@ -202,8 +202,8 @@
border: 1px solid var(--ti-checkbox-border-color);
border-radius: var(--ti-checkbox-border-radius);
box-sizing: border-box;
- width: 16px;
- height: 16px;
+ width: var(--ti-checkbox-width);
+ height: var(--ti-checkbox-height);
background-color: var(--ti-checkbox-bg-color);
outline: none;
z-index: 1;
diff --git a/packages/theme/src/checkbox/vars.less b/packages/theme/src/checkbox/vars.less
index 007e1b19f..f77fec888 100644
--- a/packages/theme/src/checkbox/vars.less
+++ b/packages/theme/src/checkbox/vars.less
@@ -11,6 +11,10 @@
*/
.component-css-vars-checkbox() {
+ // 复选框宽度
+ --ti-checkbox-width: var(--ti-common-size-4x);
+ // 复选框高度
+ --ti-checkbox-height: var(--ti-common-size-4x);
// 默认复选框文本色
--ti-checkbox-text-font-family: var(--ti-common-font-family);
// 默认复选框文本色
diff --git a/packages/theme/src/collapse-item/aurora-theme.js b/packages/theme/src/collapse-item/aurora-theme.js
index d27e6f772..dcb2cfdcb 100644
--- a/packages/theme/src/collapse-item/aurora-theme.js
+++ b/packages/theme/src/collapse-item/aurora-theme.js
@@ -18,5 +18,8 @@ export const tinyCollapseitemAuroraTheme = {
'ti-collapse-item-content-padding-left': 'var(--ti-common-space-6x)',
'ti-collapse-item-content-padding-bottom': 'var(--ti-common-space-6x)',
'ti-collapse-item-content-padding-right': 'var(--ti-common-space-6x)',
- 'ti-collapse-item-content-padding-top': 'var(--ti-common-space-0)'
+ 'ti-collapse-item-content-padding-top': 'var(--ti-common-space-0)',
+ 'ti-collapse-item-arrow-transform': 'rotate(0)',
+ 'ti-collapse-item-is-active-arrow-transform': 'rotate(90deg)',
+ 'ti-collapse-item-is-active-arrow-text-color': '#1890ff'
}
diff --git a/packages/theme/src/collapse-item/index.less b/packages/theme/src/collapse-item/index.less
index 3d330dd65..5e5ab47cc 100644
--- a/packages/theme/src/collapse-item/index.less
+++ b/packages/theme/src/collapse-item/index.less
@@ -73,7 +73,7 @@
font-size: var(--ti-collapse-item-arrow-font-size);
order: -1;
transition: transform 0.3s;
- transform: rotate(90deg);
+ transform: var(--ti-collapse-item-arrow-transform);
svg {
font-size: var(--ti-collapse-item-icon-font-size);
@@ -85,8 +85,10 @@
border-bottom-color: transparent;
.@{collapse-item-prefix-cls}__arrow {
- transform: rotate(-90deg);
- fill: var(--ti-collapse-item-arrow-hover-text-color);
+ transform: var(--ti-collapse-item-is-active-arrow-transform);
+ svg{
+ fill: var(--ti-collapse-item-is-active-arrow-text-color);
+ }
}
}
}
diff --git a/packages/theme/src/collapse-item/vars.less b/packages/theme/src/collapse-item/vars.less
index 2076474cf..7e575f5c9 100644
--- a/packages/theme/src/collapse-item/vars.less
+++ b/packages/theme/src/collapse-item/vars.less
@@ -57,6 +57,12 @@
--ti-collapse-item-arrow-hover-text-color: var(--ti-common-color-info);
// 面板头部箭头尺寸
--ti-collapse-item-icon-font-size: var(--ti-common-font-size-2);
+ // 面板头部箭头旋转角度
+ --ti-collapse-item-arrow-transform: rotate(90deg);
+ // 面板展开头部箭头旋转角度
+ --ti-collapse-item-is-active-arrow-transform: rotate(-90deg);
+ // 面板展开头部箭头图标色
+ --ti-collapse-item-is-active-arrow-text-color: var(--ti-collapse-item-icon-color);
// 面板头部垂直内边距
--ti-collapse-item-header-padding-vertical: var(--ti-common-space-0);
// 面板头部水平内边距
diff --git a/packages/theme/src/dialog-box/aurora-theme.js b/packages/theme/src/dialog-box/aurora-theme.js
new file mode 100644
index 000000000..512d21559
--- /dev/null
+++ b/packages/theme/src/dialog-box/aurora-theme.js
@@ -0,0 +1,24 @@
+export const tinyDialogBoxAuroraTheme = {
+ 'ti-dialog-box-head-padding-top': 'var(--ti-common-space-2x)',
+ 'ti-dialog-box-head-padding-horizontal': 'var(--ti-common-space-6x)',
+ 'ti-dialog-box-head-padding-bottom': 'var(--ti-common-space-2x)',
+ 'ti-dialog-box-head-title-font-size': 'var(--ti-common-font-size-1)',
+ 'ti-dialog-box-head-border-bottom-color': 'var(--ti-common-color-line-normal)',
+ 'ti-dialog-box-close-icon-size': 'var(--ti-common-font-size-2)',
+ 'ti-dialog-box-close-icon-color': '#c4c4c4',
+ 'ti-dialog-box-btn-position-top': 'calc(var(--ti-dialog-box-head-padding-top) + 2px)',
+ 'ti-dialog-box-btn-position-right': 'var(--ti-dialog-box-head-padding-horizontal)',
+ 'ti-dialog-box-body-padding-vertical': 'var(--ti-common-space-6x)',
+ 'ti-dialog-box-body-padding-horizontal': 'var(--ti-common-space-6x)',
+ 'ti-dialog-box-footer-padding-top': '0',
+ 'ti-dialog-box-footer-padding-horizontal': '0',
+ 'ti-dialog-box-footer-margin-bottom': 'var(--ti-common-space-6x)',
+ 'ti-dialog-box-drawer-min-width': '30%',
+ 'ti-dialog-box-drawer-footer-text-align': 'center',
+ 'ti-dialog-box-drawer-padding-left': '0px',
+ 'ti-dialog-box-drawer-padding-right': '0px',
+ 'ti-dialog-box-drawer-header-padding-top': 'var(--ti-common-space-2x)',
+ 'ti-dialog-box-drawer-header-padding-bottom': 'var(--ti-common-space-2x)',
+ 'ti-dialog-box-drawer-header-padding-left': 'var(--ti-common-space-6x)',
+ 'ti-dialog-box-drawer-body-padding-right': 'var(--ti-common-space-6x)'
+}
diff --git a/packages/theme/src/dialog-box/index.less b/packages/theme/src/dialog-box/index.less
index 19d9d8dea..599ad6c32 100644
--- a/packages/theme/src/dialog-box/index.less
+++ b/packages/theme/src/dialog-box/index.less
@@ -41,6 +41,13 @@
top: 0;
width: 100vw;
height: 100vh;
+
+ .@{dialog-box-prefix-cls}__footer {
+ position: absolute;
+ left: 0;
+ bottom: 0;
+ width: 100vw;
+ }
}
&.is-center {
@@ -70,6 +77,7 @@
font-size: var(--ti-dialog-box-head-title-font-size);
color: var(--ti-dialog-box-head-title-text-color);
font-weight: var(--ti-dialog-box-head-title-font-weight);
+ border-bottom: 1px solid var(--ti-dialog-box-head-border-bottom-color);
.@{dialog-box-prefix-cls}__title {
flex: 1;
@@ -114,6 +122,7 @@
& &__body {
text-align: left;
padding: var(--ti-dialog-box-body-padding-vertical) var(--ti-dialog-box-body-padding-horizontal);
+ margin-bottom: var(--ti-dialog-box-body-margin-bottom);
color: var(--ti-dialog-box-body-text-color);
font-size: var(--ti-dialog-box-body-font-size);
overflow: auto;
@@ -135,7 +144,7 @@
& &__footer {
text-align: inherit;
- padding: var(--ti-dialog-box-footer-padding-vertical) var(--ti-dialog-box-footer-padding-horizontal) var(--ti-dialog-box-footer-margin-bottom);
+ padding: var(--ti-dialog-box-footer-padding-top) var(--ti-dialog-box-footer-padding-horizontal) var(--ti-dialog-box-footer-margin-bottom);
text-align: center;
box-sizing: border-box;
@@ -182,11 +191,24 @@
bottom: 0;
padding: var(--ti-dialog-box-drawer-footer-padding-top) var(--ti-dialog-box-drawer-footer-padding-right) var(--ti-dialog-box-drawer-footer-padding-bottom) var(--ti-dialog-box-drawer-footer-padding-left);
border-top: 1px solid var(--ti-dialog-box-drawer-divider-border-color);
- text-align: right;
+ text-align: var(--ti-dialog-box-drawer-footer-text-align);
}
}
}
+body:not(.@{dialog-box-prefix-cls}__scroll-lock) {
+ .v-modal {
+ pointer-events: none;
+ }
+
+ .@{dialog-box-prefix-cls}__wrapper {
+ pointer-events: none;
+
+ .@{dialog-box-prefix-cls} {
+ pointer-events: auto;
+ }
+ }
+}
.v-modal {
position: fixed;
left: 0;
diff --git a/packages/theme/src/dialog-box/vars.less b/packages/theme/src/dialog-box/vars.less
index d7065f8b0..707b1dbc6 100644
--- a/packages/theme/src/dialog-box/vars.less
+++ b/packages/theme/src/dialog-box/vars.less
@@ -34,6 +34,8 @@
--ti-dialog-box-head-title-font-weight: var(--ti-common-font-weight-7);
// 头部文本色
--ti-dialog-box-head-title-text-color: var(--ti-common-color-text-primary);
+ // 头部底边框颜色
+ --ti-dialog-box-head-border-bottom-color: var(--ti-common-color-transparent);
// 头部字体图标色(hide)
--ti-dialog-box-head-font-icon-color: var(--ti-common-color-icon-normal);
// 头部字体图标悬浮颜色(hide)
@@ -70,11 +72,9 @@
--ti-dialog-box-body-padding-vertical: var(--ti-common-space-0);
// 内容水平内边距
--ti-dialog-box-body-padding-horizontal: var(--ti-common-space-8x);
- // 内容下外边距
- --ti-dialog-box-body-margin-bottom: var(--ti-common-space-3x);
// 底部上内边距
- --ti-dialog-box-footer-padding-vertical: calc(var(--ti-common-space-base) * 7);
+ --ti-dialog-box-footer-padding-top: calc(var(--ti-common-space-base) * 7);
// 底部水平内边距
--ti-dialog-box-footer-padding-horizontal: var(--ti-common-space-8x);
// 底部下内边距
@@ -104,6 +104,8 @@
--ti-dialog-box-drawer-body-padding-left: var(--ti-common-space-0);
// 抽屉内容右内边距
--ti-dialog-box-drawer-header-padding-right: var(--ti-common-space-0);
+ // 抽屉底部文本对齐方式
+ --ti-dialog-box-drawer-footer-text-align: right;
// 抽屉底部上内边距
--ti-dialog-box-drawer-footer-padding-top: var(--ti-common-space-5x);
// 抽屉底部下内边距
diff --git a/packages/theme/src/dropdown/index.less b/packages/theme/src/dropdown/index.less
index 9fb3e244b..b3af5c029 100644
--- a/packages/theme/src/dropdown/index.less
+++ b/packages/theme/src/dropdown/index.less
@@ -46,6 +46,9 @@
fill: var(--ti-dropdown-button-icon-color);
font-size:var(--ti-dropdown-button-icon-size)
}
+ &.@{css-prefix}button--default .@{svg-prefix-cls}{
+ fill: var(--ti-button-normal-text-color);
+ }
&:not(.@{dropdown-prefix-cls}__caret-button):hover {
color: var(--ti-dropdown-text-color-hover);
@@ -53,6 +56,12 @@
.@{svg-prefix-cls} {
fill: var(--ti-dropdown-icon-color-hover);
}
+ &[disabled] {
+ color: var(--ti-dropdown-text-color-disabled);
+ .@{svg-prefix-cls} {
+ fill: var(--ti-dropdown-text-color-disabled);
+ }
+ }
}
}
@@ -127,6 +136,9 @@
[disabled] {
cursor: not-allowed;
color: var(--ti-dropdown-text-color-disabled);
+ svg {
+ fill: var(--ti-dropdown-text-color-disabled);
+ }
}
&:hover {
diff --git a/packages/theme/src/grid/aurora-theme.js b/packages/theme/src/grid/aurora-theme.js
index 6cf7fab80..b142ebee6 100644
--- a/packages/theme/src/grid/aurora-theme.js
+++ b/packages/theme/src/grid/aurora-theme.js
@@ -11,5 +11,9 @@ export const tinyGridAuroraTheme = {
'ti-grid-header-repair-border-color': 'var(--ti-common-color-line-dividing)',
'ti-grid-header-resizable-line-height': '60%',
'ti-grid-header-resizable-bg-color': '#d8d8d8',
- 'ti-grid-body-td-border-color': 'var(--ti-common-color-transparent)'
+ 'ti-grid-body-td-border-color': 'var(--ti-common-color-transparent)',
+ 'ti-grid-column-icon-text-color': '#c0c4cc',
+ 'ti-grid-header-icon-font-size': 'var(--ti-common-font-size-1)',
+ 'ti-grid-column-icon-scale-size': '0.8',
+ 'ti-grid-tree-icon-color': '#939599'
}
diff --git a/packages/theme/src/grid/checkbox.less b/packages/theme/src/grid/checkbox.less
index f63a26099..6bb835fca 100644
--- a/packages/theme/src/grid/checkbox.less
+++ b/packages/theme/src/grid/checkbox.less
@@ -26,7 +26,7 @@
> input {
& + .@{grid-checkbox-prefix-cls}__icon {
- font-size: var(--ti-common-font-size-1);
+ font-size: var(--ti-grid-checkbox-icon-size);
}
}
}
diff --git a/packages/theme/src/grid/header.less b/packages/theme/src/grid/header.less
index f89c786cf..8c331e7c9 100644
--- a/packages/theme/src/grid/header.less
+++ b/packages/theme/src/grid/header.less
@@ -37,6 +37,13 @@
font-size: var(--ti-grid-font-size);
color: var(--ti-grid-header-text-color);
+ // 去掉最后一个竖线
+ &:nth-last-of-type(2) {
+ .@{grid-prefix-cls}-resizable.is__line:before {
+ width: 0px;
+ }
+ }
+
&.is__sortable {
.@{grid-cell-prefix-cls} {
padding-right: 20px;
diff --git a/packages/theme/src/grid/smb-theme.js b/packages/theme/src/grid/smb-theme.js
index c00a61d03..742692fde 100644
--- a/packages/theme/src/grid/smb-theme.js
+++ b/packages/theme/src/grid/smb-theme.js
@@ -1,20 +1,21 @@
export const tinyGridSmbTheme = {
'ti-grid-header-background-color': 'var(--ti-common-color-bg-white-emphasize)',
'ti-grid-medium-header-column-height': '46px',
- 'ti-grid-default-header-column-height': '40px',
- 'ti-grid-small-header-column-height': '32px',
+ 'ti-grid-default-header-column-height': 'var(--ti-common-size-height-medium)',
+ 'ti-grid-small-header-column-height': 'var(--ti-common-size-height-normal)',
'ti-grid-mini-header-column-height': '26px',
'ti-grid-medium-column-height': '52px',
'ti-grid-default-column-height': 'var(--ti-common-size-height-large)',
- 'ti-grid-small-column-height': 'var(--ti-common-size-height-large)',
- 'ti-grid-mini-column-height': '30px',
+ 'ti-grid-small-column-height': 'var(--ti-common-size-height-medium)',
+ 'ti-grid-mini-column-height': 'var(--ti-common-size-height-minor)',
'ti-grid-header-resizable-bg-color': 'rgba(0,0,0,0.15)',
'ti-grid-header-resizable-line-height': '16px',
'ti-grid-checkbox-border-color': 'var(--ti-common-color-line-normal)',
'ti-grid-checkbox-border-radius': 'var(--ti-common-border-radius-2)',
'ti-grid-header-repair-border-color': 'var(--ti-common-color-transparent)',
- 'ti-grid-td-padding-horizontal': '11px',
+ 'ti-grid-td-padding-horizontal': 'var(--ti-common-space-3x)',
'ti-grid-header-text-color': 'var(--ti-common-color-text-secondary)',
'ti-grid-row-hover-background-color': 'var(--ti-common-color-bg-white-emphasize)',
- 'ti-grid-icon-color': 'var(--ti-common-color-icon)'
+ 'ti-grid-icon-color': 'var(--ti-common-color-icon)',
+ 'ti-grid-checkbox-icon-size': 'var(--ti-common-font-size-2)',
}
diff --git a/packages/theme/src/grid/table.less b/packages/theme/src/grid/table.less
index 2ed7011f6..6ad512fd8 100644
--- a/packages/theme/src/grid/table.less
+++ b/packages/theme/src/grid/table.less
@@ -260,8 +260,13 @@
&:nth-child(2n) {
background-color: var(--ti-grid-row-striped-background-color);
}
+
+ &.row__current{
+ background-color: var(--ti-grid-row-hover-background-color);
+ }
}
+
&.row__selected {
&:not(.row__hover) {
&:nth-child(2n) {
@@ -274,6 +279,15 @@
}
}
}
+
+ &.row__highlight .@{grid-prefix-cls}-body__row:hover{
+ background-color: var(--ti-grid-row-hover-background-color);
+
+ .fixed__column{
+ background-color: var(--ti-grid-row-hover-background-color);
+ }
+ }
+
&.mark-insert {
.@{grid-prefix-cls}-body__row.row__new {
background-color: var(--ti-grid-new-row-background-color);
@@ -659,13 +673,11 @@
}
}
- .@{grid-prefix-cls}-sort__asc-btn,
- .@{grid-prefix-cls}-sort__desc-btn {
- height: 16px;
- line-height: 16px;
+ .@{grid-prefix-cls}-sort__btn {
display: block;
font-size: var(--ti-grid-header-icon-font-size);
fill: var(--ti-grid-column-icon-text-color);
+ transform: scale(var(--ti-grid-column-icon-scale-size));
cursor: pointer;
&:hover {
@@ -676,10 +688,6 @@
fill: var(--ti-grid-primary-color);
}
}
-
- .@{grid-prefix-cls}-sort__desc-btn {
- margin-top: -2px;
- }
}
// 列拖拽参考线
@@ -1047,20 +1055,6 @@
}
}
- // 表格全屏样式
- &.@{css-prefix}fullscreen-full {
- z-index: 1000;
- position: fixed;
- overflow: auto;
- background: var(--ti-grid-light-color);
- width: 100%;
- height: 100%;
- top: 0;
- left: 0;
- margin: 0;
- padding: 8px;
- }
-
// 默认的和筛选面板渲染器和编辑器样式
&,
&__filter-wrapper {
@@ -1146,4 +1140,111 @@
}
}
}
+
+ & &__selected-box-outer {
+ width: 100%;
+ display: grid;
+ }
+
+ & &__selected-box-outer-default {
+ grid-template-columns: repeat(4, minmax(0, 1fr));
+ }
+
+ & &__selected-box-wrapper {
+ border-width: 1px;
+ border-style: solid;
+ border-color: #eeeeee;
+ }
+
+ & &__selected-box-wrapper-default {
+ display: block;
+ }
+
+ & &__selected-box-table {
+ grid-column: span 3 / span 3;
+ height: max-content;
+ }
+
+ & &__column-anchor {
+ flex-wrap: nowrap;
+ margin-top: 0.5rem;
+ margin-bottom: 0.5rem;
+ height: 2rem;
+ align-items: center;
+ }
+
+ & &__column-anchor-item {
+ flex-shrink: 0;
+ max-width: 20rem;
+ overflow: hidden;
+ text-overflow: ellipsis;
+ white-space: nowrap;
+ margin-right: 1.5rem;
+ font-size: 0.875rem;
+ cursor: pointer;
+ color: #161e26;
+
+ &:last-child {
+ margin-right: 0px;
+ }
+
+ &:hover {
+ color: #0072e8;
+
+ .@{grid-prefix-cls}__column-anchor-item-icon {
+ fill: #0072e8;
+ }
+ }
+
+ &--active {
+ padding-left: 1.25rem;
+ position: relative;
+ color: #005bba;
+ }
+ }
+
+ & &__column-anchor-item-icon {
+ position: absolute;
+ left: 0px;
+ bottom: 50%;
+ transform: translateY(50%);
+ fill: #005bba;
+ }
+
+ & &__oper-col-elps {
+ outline: 2px solid transparent;
+ outline-offset: 2px;
+ font-size: 1rem;
+ line-height: 1.5rem;
+ cursor: pointer;
+ }
+
+ & &__oper-col-button {
+ font-size: 0.875rem;
+ line-height: 1.25rem;
+ cursor: pointer;
+ margin-right: 0.5rem;
+
+ &--disabled {
+ cursor: not-allowed;
+ fill: rgba(51, 61, 72, 0.3);
+ color: rgba(22, 30, 38, 0.3);
+ }
+ }
}
+
+// 表格全屏样式
+&.@{css-prefix}fullscreen-full {
+ z-index: 1000;
+ position: fixed;
+ overflow: auto;
+ background: var(--ti-grid-light-color);
+ width: 100%;
+ height: 100%;
+ top: 0;
+ left: 0;
+ margin: 0;
+ padding: 8px;
+}
+
+
diff --git a/packages/theme/src/grid/vars.less b/packages/theme/src/grid/vars.less
index 7e3673868..3fc8ce795 100644
--- a/packages/theme/src/grid/vars.less
+++ b/packages/theme/src/grid/vars.less
@@ -50,6 +50,8 @@
// 表格内部多选按钮边框色
--ti-grid-checkbox-border-color: var(--ti-common-color-line-dividing);
+ // 表格复选框字号
+ --ti-grid-checkbox-icon-size: var(--ti-common-font-size-1);
// 表格内部多选按钮边框圆角
--ti-grid-checkbox-border-radius: var(--ti-common-border-radius-normal);
@@ -132,6 +134,8 @@
--ti-grid-td-padding-horizontal: var(--ti-common-space-2x);
// 表头排序图标尺寸
--ti-grid-header-icon-font-size: var(--ti-common-font-size-2);
+ // 表头排序图标尺寸缩放比例
+ --ti-grid-column-icon-scale-size: 1;
// 表格无数据背景图片
--ti-table-nodata-td-bg-img-url: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAFoAAABaCAYAAAFPr3GUAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAADPNJREFUeNqUULENwCAMK0wsSDmBk3oCn/UFegR7N84oH6SAoAISFdWShwQbRxaIuDFoSzE/SEaIzAycgY2quBNNiawnfYl7iOGkEAJRTDsrf/yecQwJAEAUWmvS0ltdjJEYlFL9eA4J3nticM71477llhIB17hKo9WQaVbi2dBoO6Gb3x8BhE1DAFRxA7ocI1LCwxcXjMhpiFCk/YcpdoCJvH37FkXFlStXUDSAFO8HsVavXs3w69cvFMXCwsIMu3btwkz7Hz9+xBoxjx49wlQsKSmJ4VA2NjY0lyOBZ8+egWlgssUaQyDFB3BF35s3b1D4pOQmeE5iJKQQRLCgC6DZgmIIQABhSxsw7PCfOHAAlxnYBCkBCUQn1Fu3bjF8+fKF4dy5cwwpKSkMc+bMAcf38+fPwfKurq4M8vLyOMMQa+xs3boVbIC3tzfWxIMMQBYKCQkxBAUFYY3NAHRRkMEBAQHgtI2nfAHnBRsbG4Z3795hzWkgw9djk3n9+jVm8kYDoFyJo+KB551GdEFQWMJ8QAiIiooyGBkZYU+8uHIEqJr4/v07To0wy1lZWRlERESwmo03taCnDlAEgyIblnJAAMTGlVrwlcbkAqzpHFdrgKjqGJsgQADWqxjHQRgI2lEqGn8h10F5NS3iO1F+cj0PoM0DaE6iRbwA6SQekDRUIHE3lhKZZRfMwUhuzHq9LLOzy1L5u+tOyv2yduaIqLVEQYqvjakYOfvzjtxyF2gu4qfaj5FGjLHHrHEaxeOqocDnp/UnaXWWZavEzfNc5PTJHUDdSH0APRdsreo9qFbHceydVIgYznCiNFKh6bpODcOgwjCc6TQ0/IWqqmyX6ft+1jBmPIYBDMuyXI22rmtxhDlLh2g6ED0u9AXrGJNV27YqiqKJYwpjjLXl9JkraeuUAh+I9kOMfE3T+EfMIU3TWSqSJFFFUYh98MY9wGu6QEsKgmCyJzl19fhflbdg89ZjSOWVyyt47fa7F9ALMZMIo4P2/V/YAk1ZoY9yytFNH+FU4jEMPjc4/OYCWmqmrnAbZv/jb/1Ih34FYM6KURuGoajieAwkF8jQwVlsqLdshq5eSm7Q3iBX6QmKfYIO3jKkFzD4CM0eaMGQzbR9wko/qSV9K3HaB4IEK9b395f+ey/c9t81Zq0mdcXadW1ONgRpje9iODx9jzWrUM54hUMCtVmZ6L6NQ107YNn+2rUfhiKIQ+L5ouQzz3MRRZEIgkBKQ2WVUOo3mUw6r+E76Ak+2/QsieunZFxkPZqUMlJcgd9zGuIJ4GccM12ZHnO324nNZiOWy6XwfV9SJ2aGrNjv95JroOkmSSIWi4Vp+pb6P7c28Q7+gYDH47F0KzmanAOYBwDoG3g4Ax/I9IttlpIlQNM01rtS+kepts5sUBlP05QT9BSZvu+TGbWI8a5T+ymJ8kKZqUx3upEO5/QvgDDTRUxvBoDZZHJdUGZIwuFw6FVSXst2rMDxptSAbSMi0ygLjQ10PA7n87nchFAOfTa2p+s6pwjD8OhG2zYialoNk/hFEiAoELTJC+tqLm+cifTfkjiOZaZ0sG0+XY0zceMTAm3thtgoVVXJo8/zvF7Z6SoPKFh1KjGRySS7mN1FUchxDsqy/MyyrM9PXk18ms0/6ro28g7aLOg1g6TUYUX7iY5Pxy09/A8Ycc/pqp38+MfBjlyVyzUVzIpDK/p0xBl5+rsLBZmRe444AQNfAjBvBbdtBDFwdfBPjyQNCEkFKcF2BUEaEOwKknTiVBClAcWpIPZP+jk//ewOFOunl+M5HA3qsLsc3u35NMDCEGzvDSgulxzyPJbO4X1zSZ09r9PI738/rwVLyi4JuksIX3tEvLtGghhcQhDcJKzZFefNnq7cg4UUvKeFD9+f0JoiKUH6bbPpl4Ejx7YxTO+DOMYl82hZPWfpi5FuxTdWKlFlCP8Y+fp+8rgHYu79keQdUVeJWfpYCIurXFmWpvOL5XJZT0jojgaKAqSfkoLq30nHH4AkJjMNJN4F1drVpOlIgYGV1WpVP5jR7iSHljkq/MRnp0o1iV3jT57KpS+66njSTg5BTZUxKCWJdbg5D9wjGxfxdUPa1Uh07F3Q3b35fM6UYLVvU6Rl5kl6wbon3IewSA2bzaZehCH+4uzRYo0myk4jMIopVqwZnsBHidNXngdBERobJ566TxRTxNwUINnKIARE+FRYwx6YxvDMMYiARefTophixWZENGkmymAPDCvDEPp/CFxQpGEtPQrLanKz2cz0aVgbpHHQSXyiSe92uzCdTk1RXQvqOalXIgXCHAzSHq7sXW6JpWEVWKdkjMbBhqUHIZ26FPpAvrXYuFOpwvbgQTnALazQCJL6JQCPpU+8pBn3yPVaNOkO4Q64rfr4YwrSusg1gJxi+oHu4u5uWe6hQ6PVtWJcLYJF1ehsJpDgI3pst1sz5CGXwLJCHtzDebEADyBNTbPgoMCKGIK0SiUhzbgYSHv77CD9wIY9WBpAc78EJEY7SH/TIe+n9deYDtjv97WlSwBFsLgHZkYceuILaTOnxnWLB63X62yW5ynZkDShE9x+oysV6mKF7c2ARWmJPV646svlLJDtOPigTHZ7NQ/57MjqgO85sQZF2y9mFxS7cBmv5hHLZVyaR0LLuwvGpM0r40BdSpEO4XhG3KJDhRXzdYyEy5AYCKtYPxqB8KJrajoZwcc/WLc0k+VBTf38CmQfGyOZaQWbml43G94OeOCKtuRC6wKaMLkKiXPlgjx6tJnlzeprx1X8r/26aZf1X4D2zienjRgK4yZCQmwIbFmNlAMk3USwSnKCcoPCEXqD3qDlBKQ3oCdowpJVWLPJEeACqPqN/EZmOjOZ2M+TyZ8njaBFcuxvnj8/29970brQ97XEvr0b+7MbYZ7MrHvP6obhMaxJoMc2Av7WksX2t10KZtsO9MDuM0ZmO2xud8uLbQD6xnpJ12y3vdvZ99gmoBPbob7ZTXuxDrTcFNC88QezX1YZ4msDvY8ABwO+DtBt0iW3xb7UXTzrAH1uQ6D+AddSDid0fQsBuvaR3sGqdepVQBem6AcFqvO5eX19/fR/HAzzSOq/xt+kLlLRhWGdmkkBVpqHXQb0LNZGg4SYk5OTdZNb1AwRIcXUuNwZjaIMcW4KJHedpkDGu3jILNoUyJiUD8vPLEUbFW3r86e7Uw2Q5Y6IqxWuXfLl+dpiaCJFpQGd8HtJHTcfsKfGud10qQNu+RnSusuXJGfTcWiCjEUupfv9fjqgTXq0vHjq9HCxjTaCh36L4qSkpp2PfbdrXQY02+ggSbpwH1ZU/Enqd0ZejGrNNrl5RT6BQ/CQuspPalsCvIcSvczS+5eOE2GoWJ3E9rYYgLI4I/j6+PjIKEQ8X8l+CUfjzV9DW6ODeLRIlhBH5utJhRgyEFcphLKoSl1U1U+0Bfkqv6LAk89QnHVgmxybmhLvVeYKHwAbXqbzeAp1KagGliSJV9uiWy8CDXGzL3UUpeCLoyjT2+2xWTPNoszQ70hiOAsfFOJqMEM4umxmhNIU4iscwp017ktUtHFHM2aWUEm8AuCZ3p6qxszKhOKrBORFRsQDiLwkRJDoZCXaiEAbWbjX0WxNOij6QiIaqIOBDIfDrIpeSNsuR/usAQL02dlZE/xcumFR8Wg0kTwu6M/Pz0HhHd7rnmn4giGFpzHKqLhHEFsDtNtBBsRmpajCvoZH+9BG3oibG+BnfaClk3ge+S/i4Vp5XZPJJKUh2vNt0w3v4GcoBIeI6c0C9B+NODoPtFCGRB4oi9lt+XI0bVKWCUDg516v5wWKG96xg5XjgMhAp19zMY1BHxJ5HB0dpdEHmxkG6HPABAhIygWM/L99jX7RPxdoX0dYYWleCLcC79pAC9gsNrkvMVnb8OCiSsY+cbREHbR5enraBD+D7eOxc3L3oE0fAA0YDIRpGpLpDD9rGlxPZOTyMx4e4WQxvXGROBr6eNH2ahZEMaiDg/+AXDIV47BInEBAjbTtNhbTqQu00dqK53la4uk2GvyMZ0t8HgHoDNP8nSF/+KvxCXgwZ9QSrzIozhbkUnXTRhYnjiDb7wj9+lT1quhyVg1sjPNeavkyKBbFy8vL1hz8X11dpSFnzYQ2b5DLgE53p0ZZlUQZm6enp/R3bqCvr68bv9JyZxlxPUBHsEL1UpWug73z0ihKcFmIWAwZcKieo0qzUfU3Ppsc1QgvmRU1MSWKpTqSMHUhzQ7ayi8wqCtyTOx06B4w/c+LB0Yxl2xpqeTugG1mdw69rg4lPYXot2Z/NdJeYvTQ1IqBDWO6e0ARYxOQSBR6lbWw0+fC5FL6d2iRu7BjDMrWipH+Rqd+bHGkcm/7/6bZaBMJnWPb8bbmG85t/2ZRz1U2kKJ8bhdTnqbTNeQ0bartsW0EelW8PnCe8zVmwtyCt3CeZVsG9g+URCM796dvBgAAAABJRU5ErkJggg==');
}
diff --git a/packages/theme/src/ip-address/aurora-theme.js b/packages/theme/src/ip-address/aurora-theme.js
index 9be536788..c67e0eaef 100644
--- a/packages/theme/src/ip-address/aurora-theme.js
+++ b/packages/theme/src/ip-address/aurora-theme.js
@@ -1,4 +1,5 @@
export const tinyIpAddressAuroraTheme = {
'ti-ip-address-normal-height': 'calc(var(--ti-common-size-base) * 7.5)',
- 'ti-ip-address-input-width': 'var(--ti-common-size-16x)'
+ 'ti-ip-address-input-width': 'var(--ti-common-size-16x)',
+ 'ti-ip-address-normal-width': 'calc(var(--ti-common-size-base) * 67.5)'
}
diff --git a/packages/theme/src/numeric/index.less b/packages/theme/src/numeric/index.less
index 095cf8f7c..c65b486fa 100644
--- a/packages/theme/src/numeric/index.less
+++ b/packages/theme/src/numeric/index.less
@@ -117,11 +117,11 @@
&:hover {
&:not(.is-disabled) {
- & ~ .@{numeric-prefix-cls}__input .@{numeric-prefix-cls}__input-inner:not(.is-disabled) {
+ &~.@{numeric-prefix-cls}__input .@{numeric-prefix-cls}__input-inner:not(.is-disabled) {
border-color: var(--ti-numeric-input-icon-color-hover);
}
- & ~ .@{numeric-prefix-cls}__input.is-disabled .@{numeric-prefix-cls}__input-inner:not(.is-disabled) {
+ &~.@{numeric-prefix-cls}__input.is-disabled .@{numeric-prefix-cls}__input-inner:not(.is-disabled) {
border-color: var(--ti-numeric-input-border-color-disabled);
}
}
@@ -150,7 +150,9 @@
content: '';
display: inline-block;
position: absolute;
+ top: 50%;
left: 0;
+ transform: translateY(-50%);
height: var(--ti-numeric-input-dividing-border-height);
border-left: 1px solid var(--ti-numeric-input-dividing-border-color);
}
@@ -170,7 +172,9 @@
content: '';
display: inline-block;
position: absolute;
+ top: 50%;
right: 0;
+ transform: translateY(-50%);
height: var(--ti-numeric-input-dividing-border-height);
border-left: 1px solid var(--ti-numeric-input-dividing-border-color);
}
@@ -198,6 +202,7 @@
margin: 0 1px 0 0;
background: var(--ti-numeric-input-unit-bg-color);
}
+
&.is-disabled &__decrease,
&.is-disabled &__increase {
border-color: var(--ti-numeric-input-border-color-disabled);
@@ -223,6 +228,11 @@
width: var(--ti-numeric-input-icon-width-medium);
line-height: calc(var(--ti-numeric-input-height-medium) - 2);
font-size: var(--ti-numeric-input-icon-size-medium);
+
+ &::before,
+ &::after {
+ height: var(--ti-numeric-input-divider-height-medium);
+ }
}
.@{numeric-prefix-cls}__input-inner {
@@ -241,6 +251,11 @@
width: var(--ti-numeric-input-icon-width-small);
line-height: calc(var(--ti-numeric-input-icon-width-small) - 2);
font-size: var(--ti-numeric-input-icon-size-small);
+
+ &::before,
+ &::after {
+ height: var(--ti-numeric-input-divider-height-small);
+ }
}
.@{numeric-prefix-cls}__input-inner {
@@ -253,12 +268,18 @@
&--mini {
width: var(--ti-numeric-input-width-mini);
+ font-size: 0; // 消除父子元素间多出来的空白
.@{numeric-prefix-cls}__decrease,
.@{numeric-prefix-cls}__increase {
width: var(--ti-numeric-input-icon-width-mini);
line-height: calc(var(--ti-numeric-input-icon-width-mini) - 4);
font-size: var(--ti-numeric-input-icon-size-mini);
+
+ &::before,
+ &::after {
+ height: var(--ti-numeric-input-divider-height-mini);
+ }
}
.@{numeric-prefix-cls}__input-inner {
@@ -274,12 +295,14 @@
padding-left: 8px;
padding-right: 8px;
}
+
.@{numeric-prefix-cls}__input {
&.has-unit {
.@{numeric-prefix-cls}__input-inner {
padding: 0 50px 0 8px;
}
}
+
&.text-align-left {
.@{numeric-prefix-cls}__input-inner {
text-align: left;
@@ -332,4 +355,4 @@
}
}
}
-}
+}
\ No newline at end of file
diff --git a/packages/theme/src/numeric/smb-theme.js b/packages/theme/src/numeric/smb-theme.js
index 9035e0366..588ce90f3 100644
--- a/packages/theme/src/numeric/smb-theme.js
+++ b/packages/theme/src/numeric/smb-theme.js
@@ -5,6 +5,9 @@ export const tinyNumericSmbTheme = {
'ti-numeric-input-icon-size': 'var(--ti-common-font-size-2)',
'ti-numeric-input-btn-border-color-disabled': 'transparent',
'ti-numeric-input-dividing-border-color': 'var(--ti-common-color-line-dividing)',
- 'ti-numeric-input-dividing-border-height': 'calc(0.625 * var(--ti-numeric-input-normal-height))',
- 'ti-numeric-input-dividing-border-display': 'none'
+ 'ti-numeric-input-dividing-border-height': 'var(--ti-common-space-5x)',
+ 'ti-numeric-input-dividing-border-display': 'none',
+ 'ti-numeric-input-divider-height-medium': 'var(--ti-common-space-6x)',
+ 'ti-numeric-input-divider-height-small': 'calc(var(--ti-common-space-5x) - 2px)',
+ 'ti-numeric-input-divider-height-mini': 'calc(var(--ti-common-space-4x) - 1px)'
}
diff --git a/packages/theme/src/numeric/vars.less b/packages/theme/src/numeric/vars.less
index bdf62fe20..450a8bc1d 100644
--- a/packages/theme/src/numeric/vars.less
+++ b/packages/theme/src/numeric/vars.less
@@ -65,6 +65,8 @@
--ti-numeric-input-icon-width-medium: var(--ti-numeric-input-height-medium);
// medium尺寸图标大小
--ti-numeric-input-icon-size-medium: var(--ti-common-font-size-2);
+ // medium尺寸分割线高度
+ --ti-numeric-input-divider-height-medium: var(--ti-numeric-input-height-medium);
// small尺寸宽度
--ti-numeric-input-width-small: var(--ti-common-size-50x);
@@ -74,6 +76,8 @@
--ti-numeric-input-icon-width-small: var(--ti-numeric-input-height-small);
// small尺寸图标大小
--ti-numeric-input-icon-size-small: var(--ti-common-font-size-1);
+ // small尺寸分割线高度
+ --ti-numeric-input-divider-height-small: var(--ti-numeric-input-height-small);
// mini尺寸宽度
--ti-numeric-input-width-mini: calc(var(--ti-common-space-10) * 13);
@@ -83,6 +87,8 @@
--ti-numeric-input-icon-width-mini: var(--ti-numeric-input-height-mini);
// mini尺寸图标大小
--ti-numeric-input-icon-size-mini: var(--ti-common-font-size-base);
+ // mini尺寸分割线高度
+ --ti-numeric-input-divider-height-mini: var(--ti-numeric-input-height-mini);
// 单位内容宽度
--ti-numeric-input-unit-width: calc(var(--ti-common-space-10) * 5);
diff --git a/packages/theme/src/pager/aurora-theme.js b/packages/theme/src/pager/aurora-theme.js
new file mode 100644
index 000000000..f94a4153e
--- /dev/null
+++ b/packages/theme/src/pager/aurora-theme.js
@@ -0,0 +1,15 @@
+export const tinyPagerAuroraTheme = {
+ 'ti-pager-li-border-color': 'var(--ti-common-color-line-normal)',
+ 'ti-pager-width': '30px',
+ 'ti-pager-height': '30px',
+ 'ti-pager-input-height': '30px',
+ 'ti-pager-btn-svg-color': 'var(--ti-common-color-icon-normal)',
+ 'ti-pager-poplist-item-hover-text-color': 'var(--ti-common-color-icon-normal)',
+ 'ti-pager-list-item-hover-text-color': 'var(--ti-common-color-icon-normal)',
+ 'ti-pager-poplist-item-hover-border-color': 'var(--ti-common-color-icon-normal)',
+ 'ti-pager-goto-text-color': 'var(--ti-common-color-icon-normal)',
+ 'ti-pager-active-font-color': 'var(--ti-common-color-icon-normal)',
+ 'ti-pager-prev-next-hover-bg-color': 'transparent',
+ 'ti-pager-poplist-item-hover-bg-color': 'transparent',
+ 'ti-pager-active-bg-color': 'transparent',
+}
diff --git a/packages/theme/src/pager/index.less b/packages/theme/src/pager/index.less
index 15de4967b..48b464418 100644
--- a/packages/theme/src/pager/index.less
+++ b/packages/theme/src/pager/index.less
@@ -66,9 +66,10 @@
color: var(--ti-pager-text-color);
padding: var(--ti-pager-poplist-item-padding-vertical) var(--ti-pager-poplist-item-padding-horizontal);
box-sizing: border-box;
- border: 1px solid transparent;
+ border: 1px solid var(--ti-pager-li-border-color);
transition: all 0.5s ease;
+
a {
color: var(--ti-pager-text-color);
}
@@ -112,7 +113,8 @@
&.is-active {
font-weight: var(--ti-pager-active-font-weight);
color: var(--ti-pager-active-font-color);
- background-color: var(--ti-pager-primary-bg-color);
+ background-color: var(--ti-pager-active-bg-color);
+ border: 1px solid var(--ti-pager-poplist-item-hover-border-color);
}
}
li:last-child {
@@ -159,7 +161,7 @@
height: var(--ti-pager-input-height);
line-height: var(--ti-pager-input-height);
border: 1px solid #d9d9d9;
- color: var(--ti-pager-text-color);
+ color: var(--ti-pager-goto-text-color);
vertical-align: middle;
border-radius: var(--ti-pager-input-border-radius);
background: #fff;
@@ -184,6 +186,7 @@
&__btn-prev,
&__btn-next {
+ width: var(--ti-pager-width);
height: var(--ti-pager-height);
line-height: calc(var(--ti-pager-height) - 2px);
display: inline-flex;
@@ -193,7 +196,7 @@
font-weight: bolder;
color: var(--ti-pagination-prev-next-color);
outline: none;
- border: none;
+ border: 1px solid var(--ti-pager-li-border-color);
background: transparent;
margin-top: 0;
margin-right: var(--ti-pager-prev-margin-right);
@@ -211,13 +214,14 @@
}
svg {
- fill: var(--ti-pager-prev-next-svg-fill);
+ fill: var(--ti-pager-btn-svg-color);
font-size: var(--ti-pager-svg-font-size);
vertical-align: middle;
}
&:hover {
background-color: var(--ti-pager-prev-next-hover-bg-color);
+ border: 1px solid var(--ti-pager-poplist-item-hover-border-color);
svg {
fill: var(--ti-pager-poplist-item-hover-text-color);
@@ -392,7 +396,7 @@
svg {
font-size: var(--ti-pager-svg-font-size);
- fill: var(--ti-pager-total-svg-fill);
+ fill: var(--ti-pager-total-svg-color);
vertical-align: middle;
}
}
diff --git a/packages/theme/src/pager/smb-theme.js b/packages/theme/src/pager/smb-theme.js
index ba2acac22..229980e94 100644
--- a/packages/theme/src/pager/smb-theme.js
+++ b/packages/theme/src/pager/smb-theme.js
@@ -11,7 +11,7 @@ export const tinyPagerSmbTheme = {
'ti-pager-total-height': '22px',
'ti-pager-total-line-height': '22px',
'ti-pager-input-border-color': '#C2C2C2',
- 'ti-pager-total-svg-fill': '#808080',
+ 'ti-pager-total-svg-color': 'var(--ti-common-color-icon-normal)',
'ti-pager-input-padding-vertical': '12px',
'ti-pager-svg-font-size': '16px',
'ti-pager-prev-padding-left': '0px',
@@ -21,7 +21,7 @@ export const tinyPagerSmbTheme = {
'ti-pager-next-margin-left': '8px',
'ti-pager-next-margin-right': '0px',
'ti-pager-next-padding-right': '0px',
- 'ti-pager-prev-next-svg-fill': '#808080',
+ 'ti-pager-btn-svg-color': 'var(--ti-common-color-icon-normal)',
'ti-pager-active-font-weight': '600',
'ti-pager-dot-is-popup-display': 'none',
'ti-pager-dot-before-display': 'block',
diff --git a/packages/theme/src/pager/vars.less b/packages/theme/src/pager/vars.less
index b90226cd6..a32d52d13 100644
--- a/packages/theme/src/pager/vars.less
+++ b/packages/theme/src/pager/vars.less
@@ -17,6 +17,8 @@
--ti-pager-primary-bg-color: var(--ti-common-color-primary-normal);
// 分页页码选中项文字色
--ti-pager-active-font-color: var(--ti-common-color-text-white);
+ // 分页页码选中项背景色
+ --ti-pager-active-bg-color: var(--ti-common-color-primary-normal);
// 自定义上下页按钮文本色
--ti-pager-primary-text-color: var(--ti-common-color-text-link);
// 分页跳转输入框激活颜色
@@ -63,7 +65,9 @@
--ti-pager-poplist-item-unchecked-box-shadow: none;
// 分页项圆角
- --ti-pager-li-border-radius:var(--ti-common-border-radius-normal);
+ --ti-pager-li-border-radius: var(--ti-common-border-radius-normal);
+ // 分页项边框颜色
+ --ti-pager-li-border-color: var(--ti-common-color-transparent);
// 分页项悬浮颜色
--ti-pager-li-item-hover-text-color: var(--ti-common-color-text-highlight);
// 分页项悬浮字重
@@ -89,6 +93,8 @@
// 分页下一页文字禁用色
--ti-pager-prev-next-text-color-disabled: var(--ti-common-color-text-disabled);
+ // 分页跳转输入框文字颜色
+ --ti-pager-goto-text-color: var(--ti-common-color-text-secondary);
// 分页跳转输入框边框悬浮颜色
--ti-pager-goto-btn-border-hover-color: var(--ti-common-color-border-hover);
// 分页跳转输入框文字颜色
@@ -108,7 +114,7 @@
// 分页下一页左侧外边距
--ti-pager-next-margin-left: 6px;
// 分页上一页和下一页图标填充
- --ti-pager-prev-next-svg-fill: var(--ti-pager-normal-text-color);
+ --ti-pager-btn-svg-color: var(--ti-common-color-info-normal);
// 分页总条数字体大小
--ti-pager-total-font-size: 12px;
@@ -117,7 +123,7 @@
// 分页总条数行高
--ti-pager-total-line-height: 24px;
// 分页总条数图标填充色
- --ti-pager-total-svg-fill: var(--ti-pager-normal-text-color);
+ --ti-pager-total-svg-color: var(--ti-common-color-info-normal);
// 分页图标大小
--ti-pager-svg-font-size: var(--ti-pager-font-size);
@@ -133,7 +139,7 @@
// 分页页码选项框宽度
--ti-pager-sizes-input-width: 78px;
// 分页选择框悬浮文本色
- --ti-pager-sizes-input-hover-text-color: var(--ti-pager-normal-text-color);
+ --ti-pager-sizes-input-hover-text-color: var(--ti-common-color-info-normal);
// 分页选择框右侧下拉按钮
--ti-pager-input-btn-width: 24px;
// 分页选择框右侧下拉按钮右距离
diff --git a/packages/theme/src/picker/index.less b/packages/theme/src/picker/index.less
index 4e0fdb184..695b6d476 100644
--- a/packages/theme/src/picker/index.less
+++ b/packages/theme/src/picker/index.less
@@ -59,7 +59,7 @@
}
}
- .@{input-prefix-cls}__icon {
+ .@{input-prefix-cls}__icon-container {
width: initial;
cursor: pointer;
fill: var(--ti-date-editor-input-icon-color-fill);
diff --git a/packages/theme/src/pop-upload/index.less b/packages/theme/src/pop-upload/index.less
index c7b2f3cd6..e5b60dd29 100644
--- a/packages/theme/src/pop-upload/index.less
+++ b/packages/theme/src/pop-upload/index.less
@@ -15,15 +15,18 @@
@popupload-prefix-cls: ~'@{css-prefix}popupload';
@upload-list-prefix-cls: ~'@{css-prefix}upload-list';
-@grid-modal-prefix-cls: ~'@{css-prefix}grid-modal';
+@popupload__modal-prefix-cls: ~'@{css-prefix}popupload__modal';
@alert-prefix-cls: ~'@{css-prefix}alert';
+.@{popupload__modal-prefix-cls} {
+ .component-css-vars-pop-upload();
+}
+
.@{popupload-prefix-cls} {
.component-css-vars-pop-upload();
-
- font-size: var(--ti-popupload-font-size);
display: flex;
align-items: center;
+ font-size: var(--ti-popupload-font-size);
&__dialog {
max-height: 512px;
@@ -34,12 +37,12 @@
&__dialog-header {
.@{alert-prefix-cls} {
- margin-bottom: 10px;
+ margin-bottom: var(--ti-popupload-dialog-header-alert-margin-bottom);
}
}
&__dialog-body {
- padding-bottom: 24px;
+ padding-bottom: var(--ti-popupload-dialog-table-body-padding-bottom);
.@{upload-list-prefix-cls} {
display: none;
@@ -51,7 +54,7 @@
display: flex;
align-items: center;
justify-content: center;
- padding-bottom: 24px;
+ padding-bottom: var(--ti-popupload-dialog-footer-padding-bottom);
}
&__dialog-tips {
@@ -60,13 +63,15 @@
}
&__dialog-table {
- height: 280px;
+ font-size: var(--ti-popupload-dialog-table-font-size);
+ height: var(--ti-popupload-dialog-table-height);
width: 100%;
- margin-top: 10px;
+ margin-top: var(--ti-popupload-dialog-margin-top);
.header-col {
border-right: 1px solid var(--ti-popupload-dialog-table-border-color);
- padding: 0 12px;
+ padding: var(--ti-popupload-table-header-col-padding-vertical)
+ var(--ti-popupload-table-header-col-padding-horizontal);
&:last-child {
border-right: none;
@@ -74,9 +79,9 @@
}
.body-col {
- padding: 8px 12px;
- margin: 0;
- line-height: 20px;
+ padding: var(--ti-popupload-table-body-col-padding-vertical) var(--ti-popupload-table-body-col-padding-horizontal);
+ margin: var(--ti-popupload-table-body-col-margin-vertical) var(--ti-popupload-table-body-col-margin-horizontal);
+ line-height: var(--ti-popupload-table-body-col-line-height);
}
.col1 {
@@ -96,7 +101,7 @@
height: var(--ti-popupload-dialog-table-header-height);
width: 100%;
color: var(--ti-popupload-dialog-table-header-text-color);
- font-weight: 700;
+ font-weight: var(--ti-popupload-dialog-table-header-font-weight);
display: flex;
align-items: center;
justify-content: space-between;
@@ -122,24 +127,22 @@
justify-content: space-between;
&:nth-child(even) {
- background: rgba(51, 51, 51, 0.06);
+ background: var(--ti-popupload-table-item-even-bg-color);
}
.delIcon {
- height: 17px;
- width: 17px;
+ width: var(--ti-popupload-dialog-table-icon-size);
fill: var(--ti-popupload-dialog-table-icon-color);
cursor: pointer;
&:hover {
- height: 17px;
- width: 17px;
+ width: var(--ti-popupload-dialog-table-icon-size-hover);
fill: var(--ti-popupload-dialog-table-icon-color-hover);
}
}
}
- &__modal .@{grid-modal-prefix-cls}__body {
+ &__modal .@{popupload__modal-prefix-cls}__body {
overflow-y: auto;
}
}
diff --git a/packages/theme/src/pop-upload/vars.less b/packages/theme/src/pop-upload/vars.less
index 964a61913..719e13886 100644
--- a/packages/theme/src/pop-upload/vars.less
+++ b/packages/theme/src/pop-upload/vars.less
@@ -11,11 +11,52 @@
*/
.component-css-vars-pop-upload() {
+ // 上传按钮文字大小(hide)
--ti-popupload-font-size: var(--ti-common-font-size-base);
- --ti-popupload-dialog-table-border-color: var(--ti-common-color-border);
+ // 弹出框头部alert提示底部外边距
+ --ti-popupload-dialog-header-alert-margin-bottom: var(--ti-common-space-10);
+ // 弹出框表格高度
+ --ti-popupload-dialog-table-height: calc(var(--ti-common-size-35x) * 2);
+ // 弹出框表格字号
+ --ti-popupload-dialog-table-font-size: var(--ti-common-font-size-1);
+ // 弹出框表格顶部外边距
+ --ti-popupload-dialog-margin-top: var(--ti-common-space-10);
+ // 弹出框表格头部分割线颜色
+ --ti-popupload-dialog-table-border-color: var(--ti-common-color-line-normal);
+ // 弹出框表格头部高度
--ti-popupload-dialog-table-header-height: var(--ti-common-size-height-small);
- --ti-popupload-dialog-table-header-text-color: var(--ti-common-color-info-normal);
- --ti-popupload-dialog-table-header-bg-color: #f1f1f1;
- --ti-popupload-dialog-table-icon-color: var(--ti-base-color-brand-6);
- --ti-popupload-dialog-table-icon-color-hover: var(--ti-base-color-bg-8);
+ // 弹出框表格头部文本色
+ --ti-popupload-dialog-table-header-text-color: var(--ti-common-color-text-primary);
+ // 弹出框表格头部字重
+ --ti-popupload-dialog-table-header-font-weight: var(--ti-common-font-weight-bold);
+ // 弹出框表格头部背景色
+ --ti-popupload-dialog-table-header-bg-color: var(--ti-common-color-bg-normal);
+ // 弹出框表格头部item垂直内边距
+ --ti-popupload-table-header-col-padding-vertical: var(--ti-common-space-0);
+ // 弹出框表格头部item水平内边距
+ --ti-popupload-table-header-col-padding-horizontal: var(--ti-common-space-3x);
+ // 弹出框表格内容item垂直内边距
+ --ti-popupload-table-body-col-padding-vertical: var(--ti-common-space-2x);
+ // 弹出框表格内容item水平内边距
+ --ti-popupload-table-body-col-padding-horizontal: var(--ti-common-space-3x);
+ // 弹出框表格内容item垂直外边距
+ --ti-popupload-table-body-col-margin-vertical: var(--ti-common-space-0);
+ // 弹出框表格内容item水平外边距
+ --ti-popupload-table-body-col-margin-horizontal: var(--ti-common-space-0);
+ // 弹出框表格内容item行高
+ --ti-popupload-table-body-col-line-height: var(--ti-common-line-height-4);
+ // 弹出框表格内容偶数行背景色
+ --ti-popupload-table-item-even-bg-color: var(--ti-common-color-info-bg);
+ // 弹出框表格底部内边距
+ --ti-popupload-dialog-table-body-padding-bottom: var(--ti-common-space-10);
+ // 弹出框底部内边距
+ --ti-popupload-dialog-footer-padding-bottom: var(--ti-common-space-6x);
+ // 弹出框已上传文件的删除图标色
+ --ti-popupload-dialog-table-icon-color: var(--ti-common-color-icon-active);
+ // 弹出框已上传文件的删除图标尺寸
+ --ti-popupload-dialog-table-icon-size: var(--ti-common-size-4x);
+ // 弹出框已上传文件的删除图标悬浮色
+ --ti-popupload-dialog-table-icon-color-hover: var(--ti-common-bg-primary);
+ // 弹出框已上传文件的删除图标悬浮尺寸
+ --ti-popupload-dialog-table-icon-size-hover: var(--ti-common-size-4x);
}
diff --git a/packages/theme/src/popeditor/index.less b/packages/theme/src/popeditor/index.less
index da125309d..8eac296e0 100644
--- a/packages/theme/src/popeditor/index.less
+++ b/packages/theme/src/popeditor/index.less
@@ -19,11 +19,17 @@
@dialog-box-prefix-cls: ~'@{css-prefix}dialog-box';
@svg-prefix-cls: ~'@{css-prefix}svg';
+.@{dialog-box-prefix-cls} {
+ .component-css-vars-popeditor();
+}
+
.@{popeditor-prefix-cls} {
.component-css-vars-popeditor();
.@{input-prefix-cls} {
&.@{popeditor-prefix-cls}-readonly .@{input-prefix-cls}__inner {
+ padding-left: var(--ti-popeditor-input-padding-left);
+
&:hover,
&:focus,
&:active {
@@ -62,6 +68,7 @@
.@{input-prefix-cls}__inner {
padding-right: 50px;
}
+
.@{svg-prefix-cls}__popeditor {
&.@{css-prefix}chevron {
margin-right: 8px;
@@ -87,9 +94,9 @@
cursor: pointer;
.@{svg-prefix-cls}__popeditor {
- height: 30px;
- line-height: 30px;
- font-size: var(--ti-common-font-size-1);
+ height: var(--ti-popeditor-icon-height);
+ line-height: var(--ti-popeditor-icon-line-height);
+ font-size: var(--ti-popeditor-icon-font-size);
fill: var(--ti-popeditor-icon-color);
cursor: pointer;
@@ -125,7 +132,7 @@
display: flex;
justify-content: flex-end;
align-items: center;
- margin-bottom: 12px;
+ margin-bottom: var(--ti-popeditor-search-item-margin-bottom);
.@{popeditor-prefix-cls}__search-label {
text-align: right;
@@ -142,7 +149,7 @@
.@{popeditor-prefix-cls}__search-footer {
width: 100%;
text-align: center;
- margin: 12px auto;
+ margin: var(--ti-popeditor-search-footer-margin-vertical) var(--ti-popeditor-search-footer-margin-horizontal);
}
}
@@ -155,7 +162,7 @@
&__left,
&__right {
width: 50%;
- padding: 0 4px;
+ padding: var(--ti-popeditor-tabs-body-padding-vertical) var(--ti-popeditor-tabs-body-padding-horizontal);
vertical-align: top;
&.@{popeditor-prefix-cls}-body__radio {
@@ -169,12 +176,12 @@
margin: 0;
padding: 0 10px;
overflow: hidden;
- height: 40px;
+ height: var(--ti-popeditor-tabs-li-height);
width: 100%;
position: relative;
ul {
- height: 40px;
+ height: var(--ti-popeditor-tabs-li-height);
border-bottom: 1px solid var(--ti-popeditor-border-color);
box-sizing: border-box;
@@ -182,7 +189,7 @@
float: left;
margin-right: -1px;
cursor: pointer;
- padding: 0 20px;
+ padding: var(--ti-popeditor-tabs-li-padding-vertical) var(--ti-popeditor-tabs-li-padding-horizontal);
color: var(--ti-popeditor-tabs-text-color);
min-width: 90px;
height: var(--ti-popeditor-tabs-li-height);
@@ -191,7 +198,7 @@
&.@{popeditor-prefix-cls}__tabs-selected {
color: var(--ti-popeditor-tabs-selected-text-color);
border-bottom: 3px solid var(--ti-popeditor-tabs-selected-text-color);
- font-weight: 700;
+ font-weight: var(--ti-popeditor-tabs-selected-font-weight);
}
}
}
@@ -199,7 +206,8 @@
.@{popeditor-prefix-cls}__tabs-body {
.tabs-body-item {
- padding: 12px 12px 0px;
+ padding: var(--ti-popeditor-tabs-body-item-padding-top) var(--ti-popeditor-tabs-body-item-padding-horizontal)
+ var(--ti-popeditor-tabs-body-item-padding-bottom);
.@{pager-prefix-cls} {
padding-bottom: 0;
diff --git a/packages/theme/src/popeditor/vars.less b/packages/theme/src/popeditor/vars.less
index 9cf9e5d62..46260325b 100644
--- a/packages/theme/src/popeditor/vars.less
+++ b/packages/theme/src/popeditor/vars.less
@@ -11,11 +11,48 @@
*/
.component-css-vars-popeditor() {
+ // 弹出框标题底部边框色和输入框边框色
--ti-popeditor-border-color: var(--ti-common-color-border);
- --ti-popeditor-icon-color: var(--ti-base-color-brand-6);
- --ti-popeditor-icon-color-disabled: var(--ti-common-color-text-disabled);
- --ti-popeditor-icon-color-hover: var(--ti-base-color-brand-5);
- --ti-popeditor-tabs-text-color: var(--ti-common-color-info-normal);
- --ti-popeditor-tabs-selected-text-color: var(--ti-base-color-brand-6);
+ // 输入框左内边距
+ --ti-popeditor-input-padding-left: var(--ti-common-space-2x);
+ // 输入框右侧默认图标色
+ --ti-popeditor-icon-color: var(--ti-common-color-icon-active);
+ // 输入框右侧禁用图标色
+ --ti-popeditor-icon-color-disabled: var(--ti-common-color-placeholder);
+ // 输入框右侧默认图标悬浮色
+ --ti-popeditor-icon-color-hover: var(--ti-common-color-primary-hover);
+ // 输入框右侧默认图标字号
+ --ti-popeditor-icon-font-size: var(--ti-common-font-size-1);
+ // 输入框右侧默认图标高度
+ --ti-popeditor-icon-height: var(--ti-common-size-height-normal);
+ // 输入框右侧默认图标行高
+ --ti-popeditor-icon-line-height: var(--ti-popeditor-icon-height);
+ // 弹出框头部标题选中文本色和边框色
+ --ti-popeditor-tabs-selected-text-color: var(--ti-common-color-line-active);
+ // 弹出框头部标题高度
--ti-popeditor-tabs-li-height: var(--ti-common-size-10x);
+ // 弹出框头部标题选中文本字重
+ --ti-popeditor-tabs-selected-font-weight: var(--ti-common-font-weight-bold);
+ // 弹出框查询条件item底部外边距
+ --ti-popeditor-search-item-margin-bottom: var(--ti-common-space-3x);
+ // 弹出框查询条件页脚垂直外边距
+ --ti-popeditor-search-footer-margin-vertical: var(--ti-common-space-3x);
+ // 弹出框查询条件页脚水平外边距
+ --ti-popeditor-search-footer-margin-horizontal: auto;
+ // 弹出编辑头部标签页文本色(hide)
+ --ti-popeditor-tabs-text-color: var(--ti-common-color-info-normal);
+ // 弹出表格头部标签页item垂直内边距
+ --ti-popeditor-tabs-li-padding-vertical: var(--ti-common-space-0);
+ // 弹出表格头部标签页item水平内边距
+ --ti-popeditor-tabs-li-padding-horizontal: var(--ti-common-space-5x);
+ // 弹出框表格垂直内边距
+ --ti-popeditor-tabs-body-padding-vertical: var(--ti-common-space-0);
+ // 弹出框表格水平内边距
+ --ti-popeditor-tabs-body-padding-horizontal: var(--ti-common-space-base);
+ // 弹出表格内容顶部内边距
+ --ti-popeditor-tabs-body-item-padding-top: var(--ti-common-space-3x);
+ // 弹出表格内容水平内边距
+ --ti-popeditor-tabs-body-item-padding-horizontal: var(--ti-common-space-3x);
+ // 弹出表格内容底部内边距
+ --ti-popeditor-tabs-body-item-padding-bottom: var(--ti-common-space-0);
}
diff --git a/packages/theme/src/popover/index.less b/packages/theme/src/popover/index.less
index 3280beba4..f9f248e71 100644
--- a/packages/theme/src/popover/index.less
+++ b/packages/theme/src/popover/index.less
@@ -61,7 +61,6 @@
.popper__arrow {
bottom: calc(var(--ti-popover-arrow-height) * -1);
left: 50%;
- margin-right: 3px;
border-top-color: var(--ti-popover-arrow-border-color);
border-bottom-width: 0;
border-top-width: var(--ti-popover-arrow-height);
@@ -81,7 +80,6 @@
.popper__arrow {
top: calc(var(--ti-popover-arrow-height) * -1);
left: 50%;
- margin-right: 3px;
border-top-width: 0;
border-bottom-color: var(--ti-popover-arrow-border-color);
border-bottom-width: var(--ti-popover-arrow-height);
@@ -101,7 +99,6 @@
.popper__arrow {
top: 50%;
left: calc(var(--ti-popover-arrow-height) * -1);
- margin-bottom: 3px;
border-right-color: var(--ti-popover-arrow-border-color);
border-left-width: 0;
border-right-width: var(--ti-popover-arrow-height);
@@ -121,7 +118,6 @@
.popper__arrow {
top: 50%;
right: calc(var(--ti-popover-arrow-height) * -1);
- margin-bottom: 3px;
border-right-width: 0;
border-left-color: var(--ti-popover-arrow-border-color);
border-left-width: var(--ti-popover-arrow-height);
diff --git a/packages/theme/src/select/index.less b/packages/theme/src/select/index.less
index 4a309c4f8..348aad5c4 100644
--- a/packages/theme/src/select/index.less
+++ b/packages/theme/src/select/index.less
@@ -245,7 +245,7 @@
}
&.is-focus .@{input-prefix-cls}__inner {
- border-color: var(--ti-select-inner-hover-border-color);
+ border-color: var(--ti-select-inner-border-color-active);
}
}
diff --git a/packages/theme/src/select/vars.less b/packages/theme/src/select/vars.less
index 3f8903926..87843ba23 100644
--- a/packages/theme/src/select/vars.less
+++ b/packages/theme/src/select/vars.less
@@ -12,7 +12,7 @@
.component-css-vars-select() {
// 输入框悬浮时的边框色(hide)
- --ti-select-inner-hover-border-color: var(--ti-common-color-icon-darkbg-hover);
+ --ti-select-inner-border-color-active: var(--ti-common-color-line-active);
// 可搜索输入框文本色
--ti-select-input-text-color: var(--ti-common-color-text-primary);
// 选择器输入框字号(hide)
diff --git a/packages/theme/src/steps/aurora-theme.js b/packages/theme/src/steps/aurora-theme.js
new file mode 100644
index 000000000..c3d9a472a
--- /dev/null
+++ b/packages/theme/src/steps/aurora-theme.js
@@ -0,0 +1,13 @@
+export const tinyStepsAuroraTheme = {
+ 'ti-steps-advanced-li-text-color': 'var(--ti-common-color-text-white)',
+ 'ti-steps-line-margin-horizontal': '0px',
+ 'ti-steps-line-bg-color': '#dbdbdb',
+ 'ti-steps-line-height': 'var(--ti-common-space-base)',
+ 'ti-steps-unselected-icon-color': 'var(--ti-common-color-text-white)',
+ 'ti-steps-unselected-border-color': 'var(--ti-common-color-line-normal)',
+ 'ti-steps-icon-bg-color': 'var(--ti-common-color-line-normal)',
+ 'ti-steps-active-font-weight': 'var(--ti-common-font-weight-7)',
+ 'ti-steps-unselected-hover-icon-color': 'var(--ti-common-color-text-white)',
+ 'ti-steps-text-color-hover': 'var(--ti-common-color-text-primary)',
+ 'ti-steps-unselected-hover-border-color': 'var(--ti-common-color-line-normal)'
+}
\ No newline at end of file
diff --git a/packages/theme/src/svgs/draft.svg b/packages/theme/src/svgs/draft.svg
index e1e0626bb..a4b72194f 100644
--- a/packages/theme/src/svgs/draft.svg
+++ b/packages/theme/src/svgs/draft.svg
@@ -7,7 +7,7 @@
-
- icon/alert/error/24
-
-
-
-
-
\ No newline at end of file
+
+
+
+
+
diff --git a/packages/theme/src/svgs/prompt.svg b/packages/theme/src/svgs/prompt.svg
index a78d869a5..03f69dc2d 100644
--- a/packages/theme/src/svgs/prompt.svg
+++ b/packages/theme/src/svgs/prompt.svg
@@ -1,6 +1,12 @@
-
-
-
-
-
\ No newline at end of file
+
+
+
+
+
diff --git a/packages/theme/src/svgs/success.svg b/packages/theme/src/svgs/success.svg
index 576283ecf..e4f4b9c0a 100644
--- a/packages/theme/src/svgs/success.svg
+++ b/packages/theme/src/svgs/success.svg
@@ -1,10 +1,13 @@
-
-
- icon/alert/success/24
-
-
-
-
-
\ No newline at end of file
+
+
+
+
+
diff --git a/packages/theme/src/svgs/warning-triangle.svg b/packages/theme/src/svgs/warning-triangle.svg
index 8c322a3e2..2370f779c 100644
--- a/packages/theme/src/svgs/warning-triangle.svg
+++ b/packages/theme/src/svgs/warning-triangle.svg
@@ -1,8 +1,13 @@
-
-
-
-
-
\ No newline at end of file
+
+
+
+
+
diff --git a/packages/theme/src/switch/index.less b/packages/theme/src/switch/index.less
index 0317cc85c..a98f1d3bd 100644
--- a/packages/theme/src/switch/index.less
+++ b/packages/theme/src/switch/index.less
@@ -42,7 +42,7 @@
&__text{
width: var(--ti-switch-text-width);
.@{switch-prefix-cls}-inner{
- left: calc(var(--ti-switch-inner-position-left) + 9px);
+ left: calc(var(--ti-switch-inner-position-left) + 7px);
}
}
diff --git a/packages/theme/src/textarea/index.less b/packages/theme/src/textarea/index.less
index ef008a55e..b33535384 100644
--- a/packages/theme/src/textarea/index.less
+++ b/packages/theme/src/textarea/index.less
@@ -42,6 +42,13 @@
.placeholder(@color: var(--ti-textarea-placeholder-text-color));
}
+ &.is-disabled{
+ background-color: var(--ti-textarea-disabled-bg-color);
+ &:hover {
+ border-color: var(--ti-textarea-border-color);
+ }
+ }
+
&.is-exceed {
.@{textarea-prefix-cls}__inner {
border-color: var(--ti-textarea-exceed-text-color);
diff --git a/packages/theme/src/textarea/smb-theme.js b/packages/theme/src/textarea/smb-theme.js
index ef6c32c94..467946146 100644
--- a/packages/theme/src/textarea/smb-theme.js
+++ b/packages/theme/src/textarea/smb-theme.js
@@ -20,5 +20,6 @@ export const tinyTextareaSmbTheme = {
'ti-textarea-scrollbar-track-piece-bg-color': '#fff',
'ti-textarea-scrollbar-hover-bg-color': 'var(--ti-common-color-bg-dark-disabled)',
'ti-textarea-count-padding-right': 'var(--ti-common-space-base)',
- 'ti-textarea-padding-bottom': 'var(--ti-common-space-4x)'
+ 'ti-textarea-padding-bottom': 'var(--ti-common-space-4x)',
+ 'ti-textarea-disabled-bg-color': '#f2f2f2'
}
diff --git a/packages/theme/src/theme/aurora-theme/index.js b/packages/theme/src/theme/aurora-theme/index.js
index fe270b9d9..0844f8ea8 100644
--- a/packages/theme/src/theme/aurora-theme/index.js
+++ b/packages/theme/src/theme/aurora-theme/index.js
@@ -68,7 +68,7 @@ export const tinyBaseAuroraTheme = {
'ti-common-color-success-bg': '#f6ffed', // 成功-背景色
'ti-common-color-success-border': '#95de64', // 成功-边框色
- 'ti-common-color-error-text': '#333', // 错误-文字色
+ 'ti-common-color-error-text': 'var(--ti-base-color-error-3)', // 错误-文字色
'ti-common-color-error-bg': '#fff1f0', // 错误-背景色/校验背景色
'ti-common-color-error-border': '#ff7875', // 错误-校验边框色
diff --git a/packages/theme/src/tree-menu/aurora-theme.js b/packages/theme/src/tree-menu/aurora-theme.js
new file mode 100644
index 000000000..1b8c7fe51
--- /dev/null
+++ b/packages/theme/src/tree-menu/aurora-theme.js
@@ -0,0 +1,3 @@
+export const tinyTreeMenuAuroraTheme = {
+ 'ti-tree-menu-node-current-text-color': 'var(--ti-common-color-icon-active)',
+}
\ No newline at end of file
diff --git a/packages/theme/src/tree/aurora-theme.js b/packages/theme/src/tree/aurora-theme.js
new file mode 100644
index 000000000..80313ec95
--- /dev/null
+++ b/packages/theme/src/tree/aurora-theme.js
@@ -0,0 +1,4 @@
+export const tinyTreeAuroraTheme = {
+ 'ti-tree-node-expand-icon-color': 'var(--ti-common-color-text-primary)',
+ 'ti-tree-node-checked-icon-color': 'var(--ti-common-color-text-primary)'
+}
\ No newline at end of file
diff --git a/packages/vue-common/src/index.ts b/packages/vue-common/src/index.ts
index 03ecfe0c8..3f4c8b8b8 100644
--- a/packages/vue-common/src/index.ts
+++ b/packages/vue-common/src/index.ts
@@ -15,6 +15,7 @@ import { twMerge } from 'tailwind-merge'
import '@opentiny/vue-theme/base/index.less'
import { defineComponent, isVue2, isVue3 } from './adapter'
+
export { defineComponent, isVue2, isVue3, appProperties }
export const $prefix = 'Tiny'
@@ -109,7 +110,8 @@ export const $setup = ({ props, context, template, extend = {} }) => {
export const mergeClass = (...cssClasses) => twMerge(stringifyCssClass(cssClasses))
-const design = {
+// 提供给没有renderless层的组件使用（比如TinyVuePlus组件）
+export const design = {
configKey: Symbol('designConfigKey'),
configInstance: null
}
diff --git a/packages/vue-icon-saas/index.ts b/packages/vue-icon-saas/index.ts
new file mode 100644
index 000000000..9bfec22bc
--- /dev/null
+++ b/packages/vue-icon-saas/index.ts
@@ -0,0 +1,1122 @@
+import IconAdministrator from './src/administrator'
+import IconAudio from './src/audio'
+import IconAreaChart from './src/area-chart'
+import IconArrowBottom from './src/arrow-bottom'
+import IconArrowDown from './src/arrow-down'
+import IconArrowLeft from './src/arrow-left'
+import IconArrowRight from './src/arrow-right'
+import IconArrowUp from './src/arrow-up'
+import IconAscending from './src/ascending'
+import IconAssociation from './src/association'
+import IconAttachment from './src/attachment'
+import IconBarChart from './src/bar-chart'
+import IconBefilter from './src/befilter'
+import IconBoat from './src/boat'
+import IconBusy from './src/busy'
+import IconCalculator from './src/calculator'
+import IconCalendar from './src/calendar'
+import IconCheckOut from './src/check-out'
+import IconCheck from './src/check'
+import IconCheckedLinear from './src/checked-linear'
+import IconCheckedSur from './src/checked-sur'
+import IconCheckedTrue from './src/checked-true'
+import IconChevronDown from './src/chevron-down'
+import IconChevronLeft from './src/chevron-left'
+import IconChevronRight from './src/chevron-right'
+import IconChevronUp from './src/chevron-up'
+import IconClearFilter from './src/clear-filter'
+import IconClockWork from './src/clock-work'
+import IconCloseCircle from './src/close-circle'
+import IconCloseSquare from './src/close-square'
+import IconClose from './src/close'
+import IconCloudDownload from './src/cloud-download'
+import IconCloudUpload from './src/cloud-upload'
+import IconCoin from './src/coin'
+import IconCommission from './src/commission'
+import IconConmentRefresh from './src/conment-refresh'
+import IconCopy from './src/copy'
+import IconCourse from './src/course'
+import IconCueL from './src/cue-l'
+import IconCustom from './src/custom'
+import IconCustomerService from './src/customer-service'
+import IconCrop from './src/crop'
+import IconDefault from './src/default'
+import IconDefinedFiltration from './src/defined-filtration'
+import IconDel from './src/del'
+import IconDeletePage from './src/delete-page'
+import IconDeleted from './src/deleted'
+import IconDeltaDownO from './src/delta-down-o'
+import IconDeltaDown from './src/delta-down'
+import IconDeltaLeftO from './src/delta-left-o'
+import IconDeltaLeft from './src/delta-left'
+import IconDeltaRightO from './src/delta-right-o'
+import IconDeltaRight from './src/delta-right'
+import IconDeltaUpO from './src/delta-up-o'
+import IconDeltaUp from './src/delta-up'
+import IconDerive from './src/derive'
+import IconDescending from './src/descending'
+import IconDialog from './src/dialog'
+import IconDialog2 from './src/dialog2'
+import IconDotChart from './src/dot-chart'
+import IconDotIpv4 from './src/dot-ipv4'
+import IconDoubleLeft from './src/double-left'
+import IconDoubleRight from './src/double-right'
+import IconDownO from './src/down-o'
+import IconDown from './src/down'
+import IconDownloadCloud from './src/download-cloud'
+import IconDownloadLink from './src/download-link'
+import IconDownload from './src/download'
+import IconEdit from './src/edit'
+import IconEditorTab from './src/editor-tab'
+import IconEllipsis from './src/ellipsis'
+import IconEmailAdd from './src/email-add'
+import IconEmailCircle from './src/email-circle'
+import IconEnd from './src/end'
+import IconError from './src/error'
+import IconEspaceAuto from './src/espace-auto'
+import IconEspace from './src/espace'
+import IconExcel from './src/excel'
+import IconException from './src/exception'
+import IconExclamation from './src/exclamation'
+import IconExport from './src/export'
+import IconExpressSearch from './src/express-search'
+import IconEyeclose from './src/eyeclose'
+import IconEyeopen from './src/eyeopen'
+import IconMic from './src/mic'
+import IconExcelType from './src/excel-type'
+
+import IconEditorAlignCenter from './src/editor-align-center'
+import IconEditorAlignLeft from './src/editor-align-left'
+import IconEditorAlignRight from './src/editor-align-right'
+import IconEditorBackground from './src/editor-background'
+import IconEditorBold from './src/editor-bold'
+import IconEditorCode from './src/editor-code'
+import IconEditorDeleteline from './src/editor-deleteline'
+import IconEditorEraser from './src/editor-eraser'
+import IconEditorItalic from './src/editor-italic'
+import IconEditorLeftBorder from './src/editor-left-border'
+import IconEditorList from './src/editor-list'
+import IconEditorListDot from './src/editor-list-dot'
+import IconEditorListNum from './src/editor-list-num'
+import IconEditorMenuLeft from './src/editor-menu-left'
+import IconEditorMenuRight from './src/editor-menu-right'
+import IconEditorQuote from './src/editor-quote'
+import IconEditorRedo from './src/editor-redo'
+import IconEditorRightBorder from './src/editor-right-border'
+import IconEditorSub from './src/editor-sub'
+import IconEditorSubtitle from './src/editor-subtitle'
+import IconEditorSuper from './src/editor-super'
+import IconEditorTable from './src/editor-table'
+import IconEditorTextcolor from './src/editor-textcolor'
+import IconEditorTitle from './src/editor-title'
+import IconEditorUnderline from './src/editor-underline'
+import IconEditorUndo from './src/editor-undo'
+import IconEditorVideo from './src/editor-video'
+
+import IconFileCloudupload from './src/file-cloudupload'
+import IconFileExcel from './src/file-excel'
+import IconFile from './src/file'
+import IconFilesCircle from './src/files-circle'
+import IconFiles from './src/files'
+import IconFiletext from './src/filetext'
+import IconFileupload from './src/fileupload'
+import IconFiltered from './src/filtered'
+import IconFlag from './src/flag'
+import IconFolderClosed from './src/folder-closed'
+import IconFolderOpened from './src/folder-opened'
+import IconFreezeLeft from './src/freeze-left'
+import IconFreezeRight from './src/freeze-right'
+import IconFrownO from './src/frown-o'
+import IconFrown from './src/frown'
+import IconFullscreen from './src/fullscreen'
+import IconFullscreenLeft from './src/fullscreen-left'
+import IconFileType from './src/file-type'
+import IconGrade from './src/grade'
+import IconGroupTransfer from './src/group-transfer'
+import IconGroup from './src/group'
+import IconHalfchecked from './src/halfchecked'
+import IconHalfselect from './src/halfselect'
+import IconHeartempty from './src/heartempty'
+import IconHelpCircle from './src/help-circle'
+import IconHelpQuery from './src/help-query'
+import IconHelpSolid from './src/help-solid'
+import IconHelp from './src/help'
+import IconHelpful from './src/helpful'
+import IconImport from './src/import'
+import IconInfoCircle from './src/info-circle'
+import IconInfoSolid from './src/info-solid'
+import IconInfo from './src/info'
+import IconInformation from './src/information'
+import IconLeave from './src/leave'
+import IconLeftFrozen from './src/left-frozen'
+import IconLeftO from './src/left-o'
+import IconLeftWard from './src/left-ward'
+import IconLeft from './src/left'
+import IconLineChart from './src/line-chart'
+import IconLink from './src/link'
+import IconLoading from './src/loading'
+import IconLock from './src/lock'
+import IconMailContent from './src/mail-content'
+import IconMail from './src/mail'
+import IconMale from './src/male'
+import IconMarkOn from './src/mark-on'
+import IconMeh from './src/meh'
+import IconMessageCircle from './src/message-circle'
+import IconMinscreen from './src/minscreen'
+import IconMinscreenLeft from './src/minscreen-left'
+import IconMinusCircle from './src/minus-circle'
+import IconMinusSquare from './src/minus-square'
+import IconMinus from './src/minus'
+import IconMobile from './src/mobile'
+import IconMore from './src/more'
+import IconNew from './src/new'
+import IconNoPremission from './src/no-premission'
+import IconNodeOpen from './src/node-open'
+import IconNode from './src/node'
+import IconOffLine from './src/off-line'
+import IconOnLine from './src/on-line'
+import IconOperationfaildL from './src/operationfaild-l'
+import IconOperationfaild from './src/operationfaild'
+import IconOuterLink from './src/outer-link'
+import IconOtherType from './src/other-type'
+import IconPagelink from './src/pagelink'
+import IconPagerFirst from './src/pager-first'
+import IconPagerLast from './src/pager-last'
+import IconPagerNext from './src/pager-next'
+import IconPagerPrev from './src/pager-prev'
+import IconPanelMax from './src/panel-max'
+import IconPanelMini from './src/panel-mini'
+import IconPanelNormal from './src/panel-normal'
+import IconPauseCircle from './src/pause-circle'
+import IconPause from './src/pause'
+import IconPicture from './src/picture'
+import IconPieChart from './src/pie-chart'
+import IconPlusCircle from './src/plus-circle'
+import IconPlusSquare from './src/plus-square'
+import IconPlus from './src/plus'
+import IconPopup from './src/popup'
+import IconPreChecked from './src/pre-checked'
+import IconPrintPreview from './src/print-preview'
+import IconPushpin from './src/pushpin'
+import IconPdfType from './src/pdf-type'
+import IconPictureType from './src/picture-type'
+import IconPptType from './src/ppt-type'
+import IconRadio from './src/radio'
+import IconRadioselected from './src/radioselected'
+import IconRefres from './src/refres'
+import IconRenew from './src/renew'
+import IconRepeat from './src/repeat'
+import IconReplace from './src/replace'
+import IconReplies from './src/replies'
+import IconRightFrozen from './src/right-frozen'
+import IconRightO from './src/right-o'
+import IconRight from './src/right'
+import IconRightward from './src/rightward'
+import IconSandwichCollapse from './src/sandwich-collapse'
+import IconSandwichExpand from './src/sandwich-expand'
+import IconSave from './src/save'
+import IconScissor from './src/scissor'
+import IconSearch from './src/search'
+import IconSelect from './src/select'
+import IconSent from './src/sent'
+import IconSeparate from './src/separate'
+import IconSetting from './src/setting'
+import IconShare from './src/share'
+import IconShareArrow from './src/share-arrow'
+import IconShoppingCard from './src/shopping-card'
+import IconSmileO from './src/smile-o'
+import IconSmile from './src/smile'
+import IconSort from './src/sort'
+import IconStarActive from './src/star-active'
+import IconStarDisable from './src/star-disable'
+import IconStarO from './src/star-o'
+import IconStartCircle from './src/start-circle'
+import IconStart from './src/start'
+import IconStatistics from './src/statistics'
+import IconStop from './src/stop'
+import IconSuccess from './src/success'
+import IconSuccessful from './src/successful'
+import IconTaskCooperation from './src/task-cooperation'
+import IconTelephoneCircle from './src/telephone-circle'
+import IconTelephone from './src/telephone'
+import IconTextTab from './src/text-tab'
+import IconText from './src/text'
+import IconTime from './src/time'
+import IconTotal from './src/total'
+import IconTriangleDown from './src/triangle-down'
+import IconTextType from './src/text-type'
+import IconUndelete from './src/undelete'
+import IconUnfilter from './src/unfilter'
+import IconUnfreeze from './src/unfreeze'
+import IconUnknow from './src/unknow'
+import IconUnlock from './src/unlock'
+import IconUnsent from './src/unsent'
+import IconUpO from './src/up-o'
+import IconUp from './src/up'
+import IconUpload from './src/upload'
+import IconUser from './src/user'
+import IconVersiontree from './src/versiontree'
+import IconView from './src/view'
+import IconVideoType from './src/video-type'
+import IconWarningTriangle from './src/warning-triangle'
+import IconWarning from './src/warning'
+import IconWebPlus from './src/web-plus'
+import IconWriting from './src/writing'
+import IconWordType from './src/word-type'
+import IconYes from './src/yes'
+import IconZoomIn from './src/zoom-in'
+import IconZoomOut from './src/zoom-out'
+import IconZipType from './src/zip-type'
+import IconMobileRadio from './src/mobile-radio'
+import IconMobileRadioSelected from './src/mobile-radio-selected'
+import IconMobileCheckbox from './src/mobile-checkbox'
+import IconMobileCheckboxHalf from './src/mobile-checkbox-half'
+import IconMobileCheckboxSelected from './src/mobile-checkbox-selected'
+
+// new icons
+import IconDownWard from './src/down-ward'
+import IconDotDownload from './src/dot-download'
+import IconLeftWardArrow from './src/left-ward-arrow'
+import IconPromptExclamation from './src/prompt-exclamation'
+import IconSortDefault from './src/sort-default'
+import IconSortTriangle from './src/sort-triangle'
+import IconSortTriangleAscending from './src/sort-triangle-ascending'
+import IconSortTriangleDescending from './src/sort-triangle-descending'
+
+export { IconDownWard }
+export { IconDownWard as iconDownWard }
+export { IconDotDownload }
+export { IconDotDownload as iconDotDownload }
+export { IconLeftWardArrow }
+export { IconLeftWardArrow as iconLeftWardArrow }
+export { IconPromptExclamation }
+export { IconPromptExclamation as iconPromptExclamation }
+export { IconSortDefault }
+export { IconSortDefault as iconSortDefault }
+export { IconSortTriangle }
+export { IconSortTriangle as iconSortTriangle }
+export { IconSortTriangleAscending }
+export { IconSortTriangleAscending as iconSortTriangleAscending }
+export { IconSortTriangleDescending }
+export { IconSortTriangleDescending as iconSortTriangleDescending }
+
+// old icons
+export { IconMobileCheckbox }
+export { IconMobileCheckbox as iconMobileCheckbox }
+export { IconMobileCheckboxHalf }
+export { IconMobileCheckboxHalf as iconMobileCheckboxHalf }
+export { IconMobileCheckboxSelected }
+export { IconMobileCheckboxSelected as iconMobileCheckboxSelected }
+export { IconMobileRadio }
+export { IconMobileRadio as iconMobileRadio }
+export { IconMobileRadioSelected }
+export { IconMobileRadioSelected as iconMobileRadioSelected }
+export { IconAdministrator }
+export { IconAdministrator as iconAdministrator }
+export { IconAudio }
+export { IconAudio as iconAudio }
+export { IconAreaChart }
+export { IconAreaChart as iconAreaChart }
+export { IconArrowDown }
+export { IconArrowDown as iconArrowDown }
+export { IconArrowBottom }
+export { IconArrowBottom as iconArrowBottom }
+export { IconArrowLeft }
+export { IconArrowLeft as iconArrowLeft }
+export { IconArrowRight }
+export { IconArrowRight as iconArrowRight }
+export { IconArrowUp }
+export { IconArrowUp as iconArrowUp }
+export { IconAscending }
+export { IconAscending as iconAscending }
+export { IconAssociation }
+export { IconAssociation as iconAssociation }
+export { IconAttachment }
+export { IconAttachment as iconAttachment }
+export { IconBarChart }
+export { IconBarChart as iconBarChart }
+export { IconBefilter }
+export { IconBefilter as iconBefilter }
+export { IconBoat }
+export { IconBoat as iconBoat }
+export { IconBusy }
+export { IconBusy as iconBusy }
+export { IconCalculator }
+export { IconCalculator as iconCalculator }
+export { IconCalendar }
+export { IconCalendar as iconCalendar }
+export { IconCheckOut }
+export { IconCheckOut as iconCheckOut }
+export { IconCheck }
+export { IconCheck as iconCheck }
+export { IconCheckedLinear }
+export { IconCheckedLinear as iconCheckedLinear }
+export { IconCheckedSur }
+export { IconCheckedSur as iconCheckedSur }
+export { IconCheckedTrue }
+export { IconCheckedTrue as iconCheckedTrue }
+export { IconChevronDown }
+export { IconChevronDown as iconChevronDown }
+export { IconChevronLeft }
+export { IconChevronLeft as iconChevronLeft }
+export { IconChevronRight }
+export { IconChevronRight as iconChevronRight }
+export { IconChevronUp }
+export { IconChevronUp as iconChevronUp }
+export { IconClearFilter }
+export { IconClearFilter as iconClearFilter }
+export { IconClockWork }
+export { IconClockWork as iconClockWork }
+export { IconCloseCircle }
+export { IconCloseCircle as iconCloseCircle }
+export { IconCloseSquare }
+export { IconCloseSquare as iconCloseSquare }
+export { IconClose }
+export { IconClose as iconClose }
+export { IconCloudDownload }
+export { IconCloudDownload as iconCloudDownload }
+export { IconCloudUpload }
+export { IconCloudUpload as iconCloudUpload }
+export { IconCoin }
+export { IconCoin as iconCoin }
+export { IconCommission }
+export { IconCommission as iconCommission }
+export { IconConmentRefresh }
+export { IconConmentRefresh as iconConmentRefresh }
+export { IconCopy }
+export { IconCopy as iconCopy }
+export { IconCourse }
+export { IconCourse as iconCourse }
+export { IconCueL }
+export { IconCueL as iconCueL }
+export { IconCustom }
+export { IconCustom as iconCustom }
+export { IconCustomerService }
+export { IconCustomerService as iconCustomerService }
+export { IconCrop }
+export { IconCrop as iconCrop }
+export { IconDefault }
+export { IconDefault as iconDefault }
+export { IconDefinedFiltration }
+export { IconDefinedFiltration as iconDefinedFiltration }
+export { IconDel }
+export { IconDel as iconDel }
+export { IconDeletePage }
+export { IconDeletePage as iconDeletePage }
+export { IconDeleted }
+export { IconDeleted as iconDeleted }
+export { IconDeltaDownO }
+export { IconDeltaDownO as iconDeltaDownO }
+export { IconDeltaDown }
+export { IconDeltaDown as iconDeltaDown }
+export { IconDeltaLeftO }
+export { IconDeltaLeftO as iconDeltaLeftO }
+export { IconDeltaLeft }
+export { IconDeltaLeft as iconDeltaLeft }
+export { IconDeltaRightO }
+export { IconDeltaRightO as iconDeltaRightO }
+export { IconDeltaRight }
+export { IconDeltaRight as iconDeltaRight }
+export { IconDeltaUpO }
+export { IconDeltaUpO as iconDeltaUpO }
+export { IconDeltaUp }
+export { IconDeltaUp as iconDeltaUp }
+export { IconDerive }
+export { IconDerive as iconDerive }
+export { IconDescending }
+export { IconDescending as iconDescending }
+export { IconDialog }
+export { IconDialog as iconDialog }
+export { IconDialog2 }
+export { IconDialog2 as iconDialog2 }
+export { IconDotChart }
+export { IconDotChart as iconDotChart }
+export { IconDotIpv4 }
+export { IconDotIpv4 as iconDotIpv4 }
+export { IconDoubleLeft }
+export { IconDoubleLeft as iconDoubleLeft }
+export { IconDoubleRight }
+export { IconDoubleRight as iconDoubleRight }
+export { IconDownO }
+export { IconDownO as iconDownO }
+export { IconDown }
+export { IconDown as iconDown }
+export { IconDownloadCloud }
+export { IconDownloadCloud as iconDownloadCloud }
+export { IconDownloadLink }
+export { IconDownloadLink as iconDownloadLink }
+export { IconDownload }
+export { IconDownload as iconDownload }
+export { IconEdit }
+export { IconEdit as iconEdit }
+export { IconEditorTab }
+export { IconEditorTab as iconEditorTab }
+export { IconEllipsis }
+export { IconEllipsis as iconEllipsis }
+export { IconEmailAdd }
+export { IconEmailAdd as iconEmailAdd }
+export { IconEmailCircle }
+export { IconEmailCircle as iconEmailCircle }
+export { IconEnd }
+export { IconEnd as iconEnd }
+export { IconError }
+export { IconError as iconError }
+export { IconEspaceAuto }
+export { IconEspaceAuto as iconEspaceAuto }
+export { IconEspace }
+export { IconEspace as iconEspace }
+export { IconExcel }
+export { IconExcel as iconExcel }
+export { IconException }
+export { IconException as iconException }
+export { IconExclamation }
+export { IconExclamation as iconExclamation }
+export { IconExport }
+export { IconExport as iconExport }
+export { IconExpressSearch }
+export { IconExpressSearch as iconExpressSearch }
+export { IconEyeclose }
+export { IconEyeclose as iconEyeclose }
+export { IconEyeopen }
+export { IconEyeopen as iconEyeopen }
+export { IconMic }
+export { IconMic as iconMic }
+export { IconExcelType }
+export { IconExcelType as iconExcelType }
+export { IconEditorAlignCenter }
+export { IconEditorAlignCenter as iconEditorAlignCenter }
+export { IconEditorAlignLeft }
+export { IconEditorAlignLeft as iconEditorAlignLeft }
+export { IconEditorAlignRight }
+export { IconEditorAlignRight as iconEditorAlignRight }
+export { IconEditorBackground }
+export { IconEditorBackground as iconEditorBackground }
+export { IconEditorBold }
+export { IconEditorBold as iconEditorBold }
+export { IconEditorCode }
+export { IconEditorCode as iconEditorCode }
+export { IconEditorDeleteline }
+export { IconEditorDeleteline as iconEditorDeleteline }
+export { IconEditorEraser }
+export { IconEditorEraser as iconEditorEraser }
+export { IconEditorItalic }
+export { IconEditorItalic as iconEditorItalic }
+export { IconEditorLeftBorder }
+export { IconEditorLeftBorder as iconEditorLeftBorder }
+export { IconEditorList }
+export { IconEditorList as iconEditorList }
+export { IconEditorListDot }
+export { IconEditorListDot as iconEditorListDot }
+export { IconEditorListNum }
+export { IconEditorListNum as iconEditorListNum }
+export { IconEditorMenuLeft }
+export { IconEditorMenuLeft as iconEditorMenuLeft }
+export { IconEditorMenuRight }
+export { IconEditorMenuRight as iconEditorMenuRight }
+export { IconEditorQuote }
+export { IconEditorQuote as iconEditorQuote }
+export { IconEditorRedo }
+export { IconEditorRedo as iconEditorRedo }
+export { IconEditorRightBorder }
+export { IconEditorRightBorder as iconEditorRightBorder }
+export { IconEditorSub }
+export { IconEditorSub as iconEditorSub }
+export { IconEditorSubtitle }
+export { IconEditorSubtitle as iconEditorSubtitle }
+export { IconEditorSuper }
+export { IconEditorSuper as iconEditorSuper }
+export { IconEditorTable }
+export { IconEditorTable as iconEditorTable }
+export { IconEditorTextcolor }
+export { IconEditorTextcolor as iconEditorTextcolor }
+export { IconEditorTitle }
+export { IconEditorTitle as iconEditorTitle }
+export { IconEditorUnderline }
+export { IconEditorUnderline as iconEditorUnderline }
+export { IconEditorUndo }
+export { IconEditorUndo as iconEditorUndo }
+export { IconEditorVideo }
+export { IconEditorVideo as iconEditorVideo }
+export { IconFileCloudupload }
+export { IconFileCloudupload as iconFileCloudupload }
+export { IconFileExcel }
+export { IconFileExcel as iconFileExcel }
+export { IconFile }
+export { IconFile as iconFile }
+export { IconFilesCircle }
+export { IconFilesCircle as iconFilesCircle }
+export { IconFiles }
+export { IconFiles as iconFiles }
+export { IconFiletext }
+export { IconFiletext as iconFiletext }
+export { IconFileupload }
+export { IconFileupload as iconFileupload }
+export { IconFiltered }
+export { IconFiltered as iconFiltered }
+export { IconFlag }
+export { IconFlag as iconFlag }
+export { IconFolderClosed }
+export { IconFolderClosed as iconFolderClosed }
+export { IconFolderOpened }
+export { IconFolderOpened as iconFolderOpened }
+export { IconFreezeLeft }
+export { IconFreezeLeft as iconFreezeLeft }
+export { IconFreezeRight }
+export { IconFreezeRight as iconFreezeRight }
+export { IconFrownO }
+export { IconFrownO as iconFrownO }
+export { IconFrown }
+export { IconFrown as iconFrown }
+export { IconFullscreen }
+export { IconFullscreen as iconFullscreen }
+export { IconFullscreenLeft }
+export { IconFullscreenLeft as iconFullscreenLeft }
+export { IconFileType }
+export { IconFileType as iconFileType }
+export { IconGrade }
+export { IconGrade as iconGrade }
+export { IconGroupTransfer }
+export { IconGroupTransfer as iconGroupTransfer }
+export { IconGroup }
+export { IconGroup as iconGroup }
+export { IconHalfchecked }
+export { IconHalfchecked as iconHalfchecked }
+export { IconHalfselect }
+export { IconHalfselect as iconHalfselect }
+export { IconHeartempty }
+export { IconHeartempty as iconHeartempty }
+export { IconHelpCircle }
+export { IconHelpCircle as iconHelpCircle }
+export { IconHelpQuery }
+export { IconHelpQuery as iconHelpQuery }
+export { IconHelpSolid }
+export { IconHelpSolid as iconHelpSolid }
+export { IconHelp }
+export { IconHelp as iconHelp }
+export { IconHelpful }
+export { IconHelpful as iconHelpful }
+export { IconImport }
+export { IconImport as iconImport }
+export { IconInfoCircle }
+export { IconInfoCircle as iconInfoCircle }
+export { IconInfoSolid }
+export { IconInfoSolid as iconInfoSolid }
+export { IconInfo }
+export { IconInfo as iconInfo }
+export { IconInformation }
+export { IconInformation as iconInformation }
+export { IconLeave }
+export { IconLeave as iconLeave }
+export { IconLeftFrozen }
+export { IconLeftFrozen as iconLeftFrozen }
+export { IconLeftO }
+export { IconLeftO as iconLeftO }
+export { IconLeftWard }
+export { IconLeftWard as iconLeftWard }
+export { IconLeft }
+export { IconLeft as iconLeft }
+export { IconLineChart }
+export { IconLineChart as iconLineChart }
+export { IconLink }
+export { IconLink as iconLink }
+export { IconLoading }
+export { IconLoading as iconLoading }
+export { IconLock }
+export { IconLock as iconLock }
+export { IconMailContent }
+export { IconMailContent as iconMailContent }
+export { IconMail }
+export { IconMail as iconMail }
+export { IconMale }
+export { IconMale as iconMale }
+export { IconMarkOn }
+export { IconMarkOn as iconMarkOn }
+export { IconMeh }
+export { IconMeh as iconMeh }
+export { IconMessageCircle }
+export { IconMessageCircle as iconMessageCircle }
+export { IconMinscreen }
+export { IconMinscreen as iconMinscreen }
+export { IconMinscreenLeft }
+export { IconMinscreenLeft as iconMinscreenLeft }
+export { IconMinusCircle }
+export { IconMinusCircle as iconMinusCircle }
+export { IconMinusSquare }
+export { IconMinusSquare as iconMinusSquare }
+export { IconMinus }
+export { IconMinus as iconMinus }
+export { IconMobile }
+export { IconMobile as iconMobile }
+export { IconMore }
+export { IconMore as iconMore }
+export { IconNew }
+export { IconNew as iconNew }
+export { IconNoPremission }
+export { IconNoPremission as iconNoPremission }
+export { IconNodeOpen }
+export { IconNodeOpen as iconNodeOpen }
+export { IconNode }
+export { IconNode as iconNode }
+export { IconOffLine }
+export { IconOffLine as iconOffLine }
+export { IconOnLine }
+export { IconOnLine as iconOnLine }
+export { IconOperationfaildL }
+export { IconOperationfaildL as iconOperationfaildL }
+export { IconOperationfaild }
+export { IconOperationfaild as iconOperationfaild }
+export { IconOuterLink }
+export { IconOuterLink as iconOuterLink }
+export { IconOtherType }
+export { IconOtherType as iconOtherType }
+export { IconPagelink }
+export { IconPagelink as iconPagelink }
+export { IconPagerFirst }
+export { IconPagerFirst as iconPagerFirst }
+export { IconPagerLast }
+export { IconPagerLast as iconPagerLast }
+export { IconPagerNext }
+export { IconPagerNext as iconPagerNext }
+export { IconPagerPrev }
+export { IconPagerPrev as iconPagerPrev }
+export { IconPanelMax }
+export { IconPanelMax as iconPanelMax }
+export { IconPanelMini }
+export { IconPanelMini as iconPanelMini }
+export { IconPanelNormal }
+export { IconPanelNormal as iconPanelNormal }
+export { IconPauseCircle }
+export { IconPauseCircle as iconPauseCircle }
+export { IconPause }
+export { IconPause as iconPause }
+export { IconPicture }
+export { IconPicture as iconPicture }
+export { IconPieChart }
+export { IconPieChart as iconPieChart }
+export { IconPlusCircle }
+export { IconPlusCircle as iconPlusCircle }
+export { IconPlusSquare }
+export { IconPlusSquare as iconPlusSquare }
+export { IconPlus }
+export { IconPlus as iconPlus }
+export { IconPopup }
+export { IconPopup as iconPopup }
+export { IconPreChecked }
+export { IconPreChecked as iconPreChecked }
+export { IconPrintPreview }
+export { IconPrintPreview as iconPrintPreview }
+export { IconPushpin }
+export { IconPushpin as iconPushpin }
+export { IconPdfType }
+export { IconPdfType as iconPdfType }
+export { IconPictureType }
+export { IconPictureType as iconPictureType }
+export { IconPptType }
+export { IconPptType as iconPptType }
+export { IconRadio }
+export { IconRadio as iconRadio }
+export { IconRadioselected }
+export { IconRadioselected as iconRadioselected }
+export { IconRefres }
+export { IconRefres as iconRefres }
+export { IconRenew }
+export { IconRenew as iconRenew }
+export { IconRepeat }
+export { IconRepeat as iconRepeat }
+export { IconReplace }
+export { IconReplace as iconReplace }
+export { IconReplies }
+export { IconReplies as iconReplies }
+export { IconRightFrozen }
+export { IconRightFrozen as iconRightFrozen }
+export { IconRightO }
+export { IconRightO as iconRightO }
+export { IconRight }
+export { IconRight as iconRight }
+export { IconRightward }
+export { IconRightward as iconRightward }
+export { IconSandwichCollapse }
+export { IconSandwichCollapse as iconSandwichCollapse }
+export { IconSandwichExpand }
+export { IconSandwichExpand as iconSandwichExpand }
+export { IconSave }
+export { IconSave as iconSave }
+export { IconScissor }
+export { IconScissor as iconScissor }
+export { IconSearch }
+export { IconSearch as iconSearch }
+export { IconSelect }
+export { IconSelect as iconSelect }
+export { IconSent }
+export { IconSent as iconSent }
+export { IconSeparate }
+export { IconSeparate as iconSeparate }
+export { IconSetting }
+export { IconSetting as iconSetting }
+export { IconShare }
+export { IconShare as iconShare }
+export { IconShareArrow }
+export { IconShareArrow as iconShareArrow }
+export { IconShoppingCard }
+export { IconShoppingCard as iconShoppingCard }
+export { IconSmileO }
+export { IconSmileO as iconSmileO }
+export { IconSmile }
+export { IconSmile as iconSmile }
+export { IconSort }
+export { IconSort as iconSort }
+export { IconStarActive }
+export { IconStarActive as iconStarActive }
+export { IconStarDisable }
+export { IconStarDisable as iconStarDisable }
+export { IconStarO }
+export { IconStarO as iconStarO }
+export { IconStartCircle }
+export { IconStartCircle as iconStartCircle }
+export { IconStart }
+export { IconStart as iconStart }
+export { IconStatistics }
+export { IconStatistics as iconStatistics }
+export { IconStop }
+export { IconStop as iconStop }
+export { IconSuccess }
+export { IconSuccess as iconSuccess }
+export { IconSuccessful }
+export { IconSuccessful as iconSuccessful }
+export { IconTaskCooperation }
+export { IconTaskCooperation as iconTaskCooperation }
+export { IconTelephoneCircle }
+export { IconTelephoneCircle as iconTelephoneCircle }
+export { IconTelephone }
+export { IconTelephone as iconTelephone }
+export { IconTextTab }
+export { IconTextTab as iconTextTab }
+export { IconText }
+export { IconText as iconText }
+export { IconTime }
+export { IconTime as iconTime }
+export { IconTotal }
+export { IconTotal as iconTotal }
+export { IconTriangleDown }
+export { IconTriangleDown as iconTriangleDown }
+export { IconTextType }
+export { IconTextType as iconTextType }
+export { IconUndelete }
+export { IconUndelete as iconUndelete }
+export { IconUnfilter }
+export { IconUnfilter as iconUnfilter }
+export { IconUnfreeze }
+export { IconUnfreeze as iconUnfreeze }
+export { IconUnknow }
+export { IconUnknow as iconUnknow }
+export { IconUnlock }
+export { IconUnlock as iconUnlock }
+export { IconUnsent }
+export { IconUnsent as iconUnsent }
+export { IconUpO }
+export { IconUpO as iconUpO }
+export { IconUp }
+export { IconUp as iconUp }
+export { IconUpload }
+export { IconUpload as iconUpload }
+export { IconUser }
+export { IconUser as iconUser }
+export { IconVersiontree }
+export { IconVersiontree as iconVersiontree }
+export { IconView }
+export { IconView as iconView }
+export { IconVideoType }
+export { IconVideoType as iconVideoType }
+export { IconWarningTriangle }
+export { IconWarningTriangle as iconWarningTriangle }
+export { IconWarning }
+export { IconWarning as iconWarning }
+export { IconWebPlus }
+export { IconWebPlus as iconWebPlus }
+export { IconWriting }
+export { IconWriting as iconWriting }
+export { IconWordType }
+export { IconWordType as iconWordType }
+export { IconYes }
+export { IconYes as iconYes }
+export { IconZoomIn }
+export { IconZoomIn as iconZoomIn }
+export { IconZoomOut }
+export { IconZoomOut as iconZoomOut }
+export { IconZipType }
+export { IconZipType as iconZipType }
+
+export default {
+ IconAdministrator,
+ IconAudio,
+ IconAreaChart,
+ IconArrowDown,
+ IconArrowBottom,
+ IconArrowLeft,
+ IconArrowRight,
+ IconArrowUp,
+ IconAscending,
+ IconAssociation,
+ IconAttachment,
+ IconBarChart,
+ IconBefilter,
+ IconBoat,
+ IconBusy,
+ IconCalculator,
+ IconCalendar,
+ IconCheckOut,
+ IconCheck,
+ IconCheckedLinear,
+ IconCheckedSur,
+ IconCheckedTrue,
+ IconChevronDown,
+ IconChevronLeft,
+ IconChevronRight,
+ IconChevronUp,
+ IconClearFilter,
+ IconClockWork,
+ IconCloseCircle,
+ IconCloseSquare,
+ IconClose,
+ IconCloudDownload,
+ IconCloudUpload,
+ IconCoin,
+ IconCommission,
+ IconConmentRefresh,
+ IconCopy,
+ IconCourse,
+ IconCueL,
+ IconCustom,
+ IconCustomerService,
+ IconCrop,
+ IconDefault,
+ IconDefinedFiltration,
+ IconDel,
+ IconDeletePage,
+ IconDeleted,
+ IconDeltaDownO,
+ IconDeltaDown,
+ IconDeltaLeftO,
+ IconDeltaLeft,
+ IconDeltaRightO,
+ IconDeltaRight,
+ IconDeltaUpO,
+ IconDeltaUp,
+ IconDerive,
+ IconDescending,
+ IconDialog,
+ IconDialog2,
+ IconDotChart,
+ IconDotIpv4,
+ IconDoubleLeft,
+ IconDoubleRight,
+ IconDownO,
+ IconDown,
+ IconDownloadCloud,
+ IconDownloadLink,
+ IconDownload,
+ IconEdit,
+ IconEditorTab,
+ IconEllipsis,
+ IconEmailAdd,
+ IconEmailCircle,
+ IconEnd,
+ IconError,
+ IconEspaceAuto,
+ IconEspace,
+ IconExcel,
+ IconException,
+ IconExclamation,
+ IconExport,
+ IconExpressSearch,
+ IconEyeclose,
+ IconEyeopen,
+ IconMic,
+ IconExcelType,
+ IconEditorAlignCenter,
+ IconEditorAlignLeft,
+ IconEditorAlignRight,
+ IconEditorBackground,
+ IconEditorBold,
+ IconEditorCode,
+ IconEditorDeleteline,
+ IconEditorEraser,
+ IconEditorItalic,
+ IconEditorLeftBorder,
+ IconEditorList,
+ IconEditorListDot,
+ IconEditorListNum,
+ IconEditorMenuLeft,
+ IconEditorMenuRight,
+ IconEditorQuote,
+ IconEditorRedo,
+ IconEditorRightBorder,
+ IconEditorSub,
+ IconEditorSubtitle,
+ IconEditorSuper,
+ IconEditorTable,
+ IconEditorTextcolor,
+ IconEditorTitle,
+ IconEditorUnderline,
+ IconEditorUndo,
+ IconEditorVideo,
+ IconFileCloudupload,
+ IconFileExcel,
+ IconFile,
+ IconFilesCircle,
+ IconFiles,
+ IconFiletext,
+ IconFileupload,
+ IconFiltered,
+ IconFlag,
+ IconFolderClosed,
+ IconFolderOpened,
+ IconFreezeLeft,
+ IconFreezeRight,
+ IconFrownO,
+ IconFrown,
+ IconFullscreen,
+ IconFullscreenLeft,
+ IconFileType,
+ IconGrade,
+ IconGroupTransfer,
+ IconGroup,
+ IconHalfchecked,
+ IconHalfselect,
+ IconHeartempty,
+ IconHelpCircle,
+ IconHelpQuery,
+ IconHelpSolid,
+ IconHelp,
+ IconHelpful,
+ IconImport,
+ IconInfoCircle,
+ IconInfoSolid,
+ IconInfo,
+ IconInformation,
+ IconLeave,
+ IconLeftFrozen,
+ IconLeftO,
+ IconLeftWard,
+ IconLeft,
+ IconLineChart,
+ IconLink,
+ IconLoading,
+ IconLock,
+ IconMailContent,
+ IconMail,
+ IconMale,
+ IconMarkOn,
+ IconMeh,
+ IconMessageCircle,
+ IconMinscreen,
+ IconMinscreenLeft,
+ IconMinusCircle,
+ IconMinusSquare,
+ IconMinus,
+ IconMobile,
+ IconMore,
+ IconNew,
+ IconNoPremission,
+ IconNodeOpen,
+ IconNode,
+ IconOffLine,
+ IconOnLine,
+ IconOperationfaildL,
+ IconOperationfaild,
+ IconOuterLink,
+ IconOtherType,
+ IconPagelink,
+ IconPagerFirst,
+ IconPagerLast,
+ IconPagerNext,
+ IconPagerPrev,
+ IconPanelMax,
+ IconPanelMini,
+ IconPanelNormal,
+ IconPauseCircle,
+ IconPause,
+ IconPicture,
+ IconPieChart,
+ IconPlusCircle,
+ IconPlusSquare,
+ IconPlus,
+ IconPopup,
+ IconPreChecked,
+ IconPrintPreview,
+ IconPushpin,
+ IconPdfType,
+ IconPictureType,
+ IconPptType,
+ IconRadio,
+ IconRadioselected,
+ IconRefres,
+ IconRenew,
+ IconRepeat,
+ IconReplace,
+ IconReplies,
+ IconRightFrozen,
+ IconRightO,
+ IconRight,
+ IconRightward,
+ IconSandwichCollapse,
+ IconSandwichExpand,
+ IconSave,
+ IconScissor,
+ IconSearch,
+ IconSelect,
+ IconSent,
+ IconSeparate,
+ IconSetting,
+ IconShare,
+ IconShareArrow,
+ IconShoppingCard,
+ IconSmileO,
+ IconSmile,
+ IconSort,
+ IconStarActive,
+ IconStarDisable,
+ IconStarO,
+ IconStartCircle,
+ IconStart,
+ IconStatistics,
+ IconStop,
+ IconSuccess,
+ IconSuccessful,
+ IconTaskCooperation,
+ IconTelephoneCircle,
+ IconTelephone,
+ IconTextTab,
+ IconText,
+ IconTime,
+ IconTotal,
+ IconTriangleDown,
+ IconTextType,
+ IconUndelete,
+ IconUnfilter,
+ IconUnfreeze,
+ IconUnknow,
+ IconUnlock,
+ IconUnsent,
+ IconUpO,
+ IconUp,
+ IconUpload,
+ IconUser,
+ IconVersiontree,
+ IconView,
+ IconVideoType,
+ IconWarningTriangle,
+ IconWarning,
+ IconWebPlus,
+ IconWriting,
+ IconWordType,
+ IconYes,
+ IconZoomIn,
+ IconZoomOut,
+ IconZipType,
+ IconMobileRadio,
+ IconMobileRadioSelected,
+ IconMobileCheckbox,
+ IconMobileCheckboxHalf,
+ IconMobileCheckboxSelected
+}
diff --git a/packages/vue-icon-saas/package.json b/packages/vue-icon-saas/package.json
index 8b27285b3..73b7159fc 100644
--- a/packages/vue-icon-saas/package.json
+++ b/packages/vue-icon-saas/package.json
@@ -1,9 +1,9 @@
{
"name": "@opentiny/vue-icon-saas",
+ "private": true,
"version": "3.7.0",
"description": "",
- "main": "lib/index.js",
- "module": "index.ts",
+ "main": "index.ts",
"license": "MIT",
"sideEffects": false,
"exports": {
diff --git a/packages/vue-icon-saas/src/administrator/index.ts b/packages/vue-icon-saas/src/administrator/index.ts
new file mode 100644
index 000000000..f97fce5d3
--- /dev/null
+++ b/packages/vue-icon-saas/src/administrator/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Administrator from '@opentiny/vue-theme-saas/svgs/administrator.svg'
+
+export default svg({ name: 'IconAdministrator', component: Administrator })
diff --git a/packages/vue-icon-saas/src/area-chart/index.ts b/packages/vue-icon-saas/src/area-chart/index.ts
new file mode 100644
index 000000000..3a54afb80
--- /dev/null
+++ b/packages/vue-icon-saas/src/area-chart/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import AreaChart from '@opentiny/vue-theme-saas/svgs/area-chart.svg'
+
+export default svg({ name: 'IconAreaChart', component: AreaChart })
diff --git a/packages/vue-icon-saas/src/arrow-bottom/index.ts b/packages/vue-icon-saas/src/arrow-bottom/index.ts
new file mode 100644
index 000000000..1f4c75584
--- /dev/null
+++ b/packages/vue-icon-saas/src/arrow-bottom/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import ArrowBottom from '@opentiny/vue-theme-saas/svgs/arrow-bottom.svg'
+
+export default svg({ name: 'IconArrowBottom', component: ArrowBottom })
diff --git a/packages/vue-icon-saas/src/arrow-down/index.ts b/packages/vue-icon-saas/src/arrow-down/index.ts
new file mode 100644
index 000000000..75df52aab
--- /dev/null
+++ b/packages/vue-icon-saas/src/arrow-down/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import ArrowDown from '@opentiny/vue-theme-saas/svgs/arrow-down.svg'
+
+export default svg({ name: 'IconArrowDown', component: ArrowDown })
diff --git a/packages/vue-icon-saas/src/arrow-left/index.ts b/packages/vue-icon-saas/src/arrow-left/index.ts
new file mode 100644
index 000000000..8f001f3d1
--- /dev/null
+++ b/packages/vue-icon-saas/src/arrow-left/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import ArrowLeft from '@opentiny/vue-theme-saas/svgs/arrow-left.svg'
+
+export default svg({ name: 'IconArrowLeft', component: ArrowLeft })
diff --git a/packages/vue-icon-saas/src/arrow-right/index.ts b/packages/vue-icon-saas/src/arrow-right/index.ts
new file mode 100644
index 000000000..365ec890e
--- /dev/null
+++ b/packages/vue-icon-saas/src/arrow-right/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import ArrowRight from '@opentiny/vue-theme-saas/svgs/arrow-right.svg'
+
+export default svg({ name: 'IconArrowRight', component: ArrowRight })
diff --git a/packages/vue-icon-saas/src/arrow-up/index.ts b/packages/vue-icon-saas/src/arrow-up/index.ts
new file mode 100644
index 000000000..515d3e7ff
--- /dev/null
+++ b/packages/vue-icon-saas/src/arrow-up/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import ArrowUp from '@opentiny/vue-theme-saas/svgs/arrow-up.svg'
+
+export default svg({ name: 'IconArrowUp', component: ArrowUp })
diff --git a/packages/vue-icon-saas/src/ascending/index.ts b/packages/vue-icon-saas/src/ascending/index.ts
new file mode 100644
index 000000000..93daaabb1
--- /dev/null
+++ b/packages/vue-icon-saas/src/ascending/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Ascending from '@opentiny/vue-theme-saas/svgs/ascending.svg'
+
+export default svg({ name: 'IconAscending', component: Ascending })
diff --git a/packages/vue-icon-saas/src/association/index.ts b/packages/vue-icon-saas/src/association/index.ts
new file mode 100644
index 000000000..ca5d50905
--- /dev/null
+++ b/packages/vue-icon-saas/src/association/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Association from '@opentiny/vue-theme-saas/svgs/association.svg'
+
+export default svg({ name: 'IconAssociation', component: Association })
diff --git a/packages/vue-icon-saas/src/attachment/index.ts b/packages/vue-icon-saas/src/attachment/index.ts
new file mode 100644
index 000000000..9ad5db307
--- /dev/null
+++ b/packages/vue-icon-saas/src/attachment/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Attachment from '@opentiny/vue-theme-saas/svgs/attachment.svg'
+
+export default svg({ name: 'IconAttachment', component: Attachment })
diff --git a/packages/vue-icon-saas/src/audio/index.ts b/packages/vue-icon-saas/src/audio/index.ts
new file mode 100644
index 000000000..1a4bae3fd
--- /dev/null
+++ b/packages/vue-icon-saas/src/audio/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Audio from '@opentiny/vue-theme-saas/svgs/audio.svg'
+
+export default svg({ name: 'IconAudio', component: Audio })
diff --git a/packages/vue-icon-saas/src/bar-chart/index.ts b/packages/vue-icon-saas/src/bar-chart/index.ts
new file mode 100644
index 000000000..3c828db0c
--- /dev/null
+++ b/packages/vue-icon-saas/src/bar-chart/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import BarChart from '@opentiny/vue-theme-saas/svgs/bar-chart.svg'
+
+export default svg({ name: 'IconBarChart', component: BarChart })
diff --git a/packages/vue-icon-saas/src/befilter/index.ts b/packages/vue-icon-saas/src/befilter/index.ts
new file mode 100644
index 000000000..188699eb8
--- /dev/null
+++ b/packages/vue-icon-saas/src/befilter/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Befilter from '@opentiny/vue-theme-saas/svgs/befilter.svg'
+
+export default svg({ name: 'IconBefilter', component: Befilter })
diff --git a/packages/vue-icon-saas/src/boat/index.ts b/packages/vue-icon-saas/src/boat/index.ts
new file mode 100644
index 000000000..b557994ca
--- /dev/null
+++ b/packages/vue-icon-saas/src/boat/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Boat from '@opentiny/vue-theme-saas/svgs/boat.svg'
+
+export default svg({ name: 'IconBoat', component: Boat })
diff --git a/packages/vue-icon-saas/src/busy/index.ts b/packages/vue-icon-saas/src/busy/index.ts
new file mode 100644
index 000000000..672f2e9a5
--- /dev/null
+++ b/packages/vue-icon-saas/src/busy/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Busy from '@opentiny/vue-theme-saas/svgs/busy.svg'
+
+export default svg({ name: 'IconBusy', component: Busy })
diff --git a/packages/vue-icon-saas/src/calculator/index.ts b/packages/vue-icon-saas/src/calculator/index.ts
new file mode 100644
index 000000000..2433daae8
--- /dev/null
+++ b/packages/vue-icon-saas/src/calculator/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Calculator from '@opentiny/vue-theme-saas/svgs/calculator.svg'
+
+export default svg({ name: 'IconCalculator', component: Calculator })
diff --git a/packages/vue-icon-saas/src/calendar/index.ts b/packages/vue-icon-saas/src/calendar/index.ts
new file mode 100644
index 000000000..799074e15
--- /dev/null
+++ b/packages/vue-icon-saas/src/calendar/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Calendar from '@opentiny/vue-theme-saas/svgs/calendar.svg'
+
+export default svg({ name: 'IconCalendar', component: Calendar })
diff --git a/packages/vue-icon-saas/src/check-out/index.ts b/packages/vue-icon-saas/src/check-out/index.ts
new file mode 100644
index 000000000..bac70c7a4
--- /dev/null
+++ b/packages/vue-icon-saas/src/check-out/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import CheckOut from '@opentiny/vue-theme-saas/svgs/check-out.svg'
+
+export default svg({ name: 'IconCheckOut', component: CheckOut })
diff --git a/packages/vue-icon-saas/src/check/index.ts b/packages/vue-icon-saas/src/check/index.ts
new file mode 100644
index 000000000..2eb97a7fe
--- /dev/null
+++ b/packages/vue-icon-saas/src/check/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Check from '@opentiny/vue-theme-saas/svgs/check.svg'
+
+export default svg({ name: 'IconCheck', component: Check })
diff --git a/packages/vue-icon-saas/src/checked-linear/index.ts b/packages/vue-icon-saas/src/checked-linear/index.ts
new file mode 100644
index 000000000..a2c38c53e
--- /dev/null
+++ b/packages/vue-icon-saas/src/checked-linear/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import CheckedLinear from '@opentiny/vue-theme-saas/svgs/checked-linear.svg'
+
+export default svg({ name: 'IconCheckedLinear', component: CheckedLinear })
diff --git a/packages/vue-icon-saas/src/checked-sur/index.ts b/packages/vue-icon-saas/src/checked-sur/index.ts
new file mode 100644
index 000000000..de8e63689
--- /dev/null
+++ b/packages/vue-icon-saas/src/checked-sur/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import CheckedSur from '@opentiny/vue-theme-saas/svgs/checked-sur.svg'
+
+export default svg({ name: 'IconCheckedSur', component: CheckedSur })
diff --git a/packages/vue-icon-saas/src/checked-true/index.ts b/packages/vue-icon-saas/src/checked-true/index.ts
new file mode 100644
index 000000000..748581d65
--- /dev/null
+++ b/packages/vue-icon-saas/src/checked-true/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import CheckedTrue from '@opentiny/vue-theme-saas/svgs/checked-true.svg'
+
+export default svg({ name: 'IconCheckedTrue', component: CheckedTrue })
diff --git a/packages/vue-icon-saas/src/chevron-down/index.ts b/packages/vue-icon-saas/src/chevron-down/index.ts
new file mode 100644
index 000000000..48466fde1
--- /dev/null
+++ b/packages/vue-icon-saas/src/chevron-down/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import ChevronDown from '@opentiny/vue-theme-saas/svgs/chevron-down.svg'
+
+export default svg({ name: 'IconChevronDown', component: ChevronDown })
diff --git a/packages/vue-icon-saas/src/chevron-left/index.ts b/packages/vue-icon-saas/src/chevron-left/index.ts
new file mode 100644
index 000000000..3e43609a6
--- /dev/null
+++ b/packages/vue-icon-saas/src/chevron-left/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import ChevronLeft from '@opentiny/vue-theme-saas/svgs/chevron-left.svg'
+
+export default svg({ name: 'IconChevronLeft', component: ChevronLeft })
diff --git a/packages/vue-icon-saas/src/chevron-right/index.ts b/packages/vue-icon-saas/src/chevron-right/index.ts
new file mode 100644
index 000000000..2938feab9
--- /dev/null
+++ b/packages/vue-icon-saas/src/chevron-right/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import ChevronRight from '@opentiny/vue-theme-saas/svgs/chevron-right.svg'
+
+export default svg({ name: 'IconChevronRight', component: ChevronRight })
diff --git a/packages/vue-icon-saas/src/chevron-up/index.ts b/packages/vue-icon-saas/src/chevron-up/index.ts
new file mode 100644
index 000000000..6b7dadeef
--- /dev/null
+++ b/packages/vue-icon-saas/src/chevron-up/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import ChevronUp from '@opentiny/vue-theme-saas/svgs/chevron-up.svg'
+
+export default svg({ name: 'IconChevronUp', component: ChevronUp })
diff --git a/packages/vue-icon-saas/src/clear-filter/index.ts b/packages/vue-icon-saas/src/clear-filter/index.ts
new file mode 100644
index 000000000..de31421ac
--- /dev/null
+++ b/packages/vue-icon-saas/src/clear-filter/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import ClearFilter from '@opentiny/vue-theme-saas/svgs/clear-filter.svg'
+
+export default svg({ name: 'IconClearFilter', component: ClearFilter })
diff --git a/packages/vue-icon-saas/src/clock-work/index.ts b/packages/vue-icon-saas/src/clock-work/index.ts
new file mode 100644
index 000000000..3de241210
--- /dev/null
+++ b/packages/vue-icon-saas/src/clock-work/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import ClockWork from '@opentiny/vue-theme-saas/svgs/clock-work.svg'
+
+export default svg({ name: 'IconClockWork', component: ClockWork })
diff --git a/packages/vue-icon-saas/src/close-circle/index.ts b/packages/vue-icon-saas/src/close-circle/index.ts
new file mode 100644
index 000000000..ef104c0cf
--- /dev/null
+++ b/packages/vue-icon-saas/src/close-circle/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import CloseCircle from '@opentiny/vue-theme-saas/svgs/close-circle.svg'
+
+export default svg({ name: 'IconCloseCircle', component: CloseCircle })
diff --git a/packages/vue-icon-saas/src/close-square/index.ts b/packages/vue-icon-saas/src/close-square/index.ts
new file mode 100644
index 000000000..d378779aa
--- /dev/null
+++ b/packages/vue-icon-saas/src/close-square/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import CloseSquare from '@opentiny/vue-theme-saas/svgs/close-square.svg'
+
+export default svg({ name: 'IconCloseSquare', component: CloseSquare })
diff --git a/packages/vue-icon-saas/src/close/index.ts b/packages/vue-icon-saas/src/close/index.ts
new file mode 100644
index 000000000..78749a388
--- /dev/null
+++ b/packages/vue-icon-saas/src/close/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Close from '@opentiny/vue-theme-saas/svgs/close.svg'
+
+export default svg({ name: 'IconClose', component: Close })
diff --git a/packages/vue-icon-saas/src/cloud-download/index.ts b/packages/vue-icon-saas/src/cloud-download/index.ts
new file mode 100644
index 000000000..cfa339587
--- /dev/null
+++ b/packages/vue-icon-saas/src/cloud-download/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import CloudDownload from '@opentiny/vue-theme-saas/svgs/cloud-download.svg'
+
+export default svg({ name: 'IconCloudDownload', component: CloudDownload })
diff --git a/packages/vue-icon-saas/src/cloud-upload/index.ts b/packages/vue-icon-saas/src/cloud-upload/index.ts
new file mode 100644
index 000000000..a9b67354e
--- /dev/null
+++ b/packages/vue-icon-saas/src/cloud-upload/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import CloudUpload from '@opentiny/vue-theme-saas/svgs/cloud-upload.svg'
+
+export default svg({ name: 'IconCloudUpload', component: CloudUpload })
diff --git a/packages/vue-icon-saas/src/coin/index.ts b/packages/vue-icon-saas/src/coin/index.ts
new file mode 100644
index 000000000..b99ad19c6
--- /dev/null
+++ b/packages/vue-icon-saas/src/coin/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Coin from '@opentiny/vue-theme-saas/svgs/coin.svg'
+
+export default svg({ name: 'IconCoin', component: Coin })
diff --git a/packages/vue-icon-saas/src/commission/index.ts b/packages/vue-icon-saas/src/commission/index.ts
new file mode 100644
index 000000000..94b122b78
--- /dev/null
+++ b/packages/vue-icon-saas/src/commission/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Commission from '@opentiny/vue-theme-saas/svgs/commission.svg'
+
+export default svg({ name: 'IconCommission', component: Commission })
diff --git a/packages/vue-icon-saas/src/conment-refresh/index.ts b/packages/vue-icon-saas/src/conment-refresh/index.ts
new file mode 100644
index 000000000..37c724437
--- /dev/null
+++ b/packages/vue-icon-saas/src/conment-refresh/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import ConmentRefresh from '@opentiny/vue-theme-saas/svgs/conment-refresh.svg'
+
+export default svg({ name: 'IconConmentRefresh', component: ConmentRefresh })
diff --git a/packages/vue-icon-saas/src/copy/index.ts b/packages/vue-icon-saas/src/copy/index.ts
new file mode 100644
index 000000000..781749a92
--- /dev/null
+++ b/packages/vue-icon-saas/src/copy/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Copy from '@opentiny/vue-theme-saas/svgs/copy.svg'
+
+export default svg({ name: 'IconCopy', component: Copy })
diff --git a/packages/vue-icon-saas/src/course/index.ts b/packages/vue-icon-saas/src/course/index.ts
new file mode 100644
index 000000000..f32b31e25
--- /dev/null
+++ b/packages/vue-icon-saas/src/course/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Course from '@opentiny/vue-theme-saas/svgs/course.svg'
+
+export default svg({ name: 'IconCourse', component: Course })
diff --git a/packages/vue-icon-saas/src/crop/index.ts b/packages/vue-icon-saas/src/crop/index.ts
new file mode 100644
index 000000000..4eb162493
--- /dev/null
+++ b/packages/vue-icon-saas/src/crop/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Crop from '@opentiny/vue-theme-saas/svgs/crop.svg'
+
+export default svg({ name: 'IconCrop', component: Crop })
diff --git a/packages/vue-icon-saas/src/cue-l/index.ts b/packages/vue-icon-saas/src/cue-l/index.ts
new file mode 100644
index 000000000..ec80d1d1a
--- /dev/null
+++ b/packages/vue-icon-saas/src/cue-l/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import CueL from '@opentiny/vue-theme-saas/svgs/cue-l.svg'
+
+export default svg({ name: 'IconCueL', component: CueL })
diff --git a/packages/vue-icon-saas/src/custom/index.ts b/packages/vue-icon-saas/src/custom/index.ts
new file mode 100644
index 000000000..3f254db19
--- /dev/null
+++ b/packages/vue-icon-saas/src/custom/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Custom from '@opentiny/vue-theme-saas/svgs/custom.svg'
+
+export default svg({ name: 'IconCustom', component: Custom })
diff --git a/packages/vue-icon-saas/src/customer-service/index.ts b/packages/vue-icon-saas/src/customer-service/index.ts
new file mode 100644
index 000000000..5abff1ea9
--- /dev/null
+++ b/packages/vue-icon-saas/src/customer-service/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import CustomerService from '@opentiny/vue-theme-saas/svgs/customer-service.svg'
+
+export default svg({ name: 'IconCustomerService', component: CustomerService })
diff --git a/packages/vue-icon-saas/src/default/index.ts b/packages/vue-icon-saas/src/default/index.ts
new file mode 100644
index 000000000..40f86be59
--- /dev/null
+++ b/packages/vue-icon-saas/src/default/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Default from '@opentiny/vue-theme-saas/svgs/default.svg'
+
+export default svg({ name: 'IconDefault', component: Default })
diff --git a/packages/vue-icon-saas/src/defined-filtration/index.ts b/packages/vue-icon-saas/src/defined-filtration/index.ts
new file mode 100644
index 000000000..a9278f76e
--- /dev/null
+++ b/packages/vue-icon-saas/src/defined-filtration/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import DefinedFiltration from '@opentiny/vue-theme-saas/svgs/defined-filtration.svg'
+
+export default svg({ name: 'IconDefinedFiltration', component: DefinedFiltration })
diff --git a/packages/vue-icon-saas/src/del/index.ts b/packages/vue-icon-saas/src/del/index.ts
new file mode 100644
index 000000000..72a685828
--- /dev/null
+++ b/packages/vue-icon-saas/src/del/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Del from '@opentiny/vue-theme-saas/svgs/del.svg'
+
+export default svg({ name: 'IconDel', component: Del })
diff --git a/packages/vue-icon-saas/src/delete-page/index.ts b/packages/vue-icon-saas/src/delete-page/index.ts
new file mode 100644
index 000000000..03b523ac5
--- /dev/null
+++ b/packages/vue-icon-saas/src/delete-page/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import DeletePage from '@opentiny/vue-theme-saas/svgs/delete-page.svg'
+
+export default svg({ name: 'IconDeletePage', component: DeletePage })
diff --git a/packages/vue-icon-saas/src/deleted/index.ts b/packages/vue-icon-saas/src/deleted/index.ts
new file mode 100644
index 000000000..a252c08e1
--- /dev/null
+++ b/packages/vue-icon-saas/src/deleted/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Deleted from '@opentiny/vue-theme-saas/svgs/deleted.svg'
+
+export default svg({ name: 'IconDeleted', component: Deleted })
diff --git a/packages/vue-icon-saas/src/delta-down-o/index.ts b/packages/vue-icon-saas/src/delta-down-o/index.ts
new file mode 100644
index 000000000..09ee96b77
--- /dev/null
+++ b/packages/vue-icon-saas/src/delta-down-o/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import DeltaDownO from '@opentiny/vue-theme-saas/svgs/delta-down-o.svg'
+
+export default svg({ name: 'IconDeltaDownO', component: DeltaDownO })
diff --git a/packages/vue-icon-saas/src/delta-down/index.ts b/packages/vue-icon-saas/src/delta-down/index.ts
new file mode 100644
index 000000000..a21f93b29
--- /dev/null
+++ b/packages/vue-icon-saas/src/delta-down/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import DeltaDown from '@opentiny/vue-theme-saas/svgs/delta-down.svg'
+
+export default svg({ name: 'IconDeltaDown', component: DeltaDown })
diff --git a/packages/vue-icon-saas/src/delta-left-o/index.ts b/packages/vue-icon-saas/src/delta-left-o/index.ts
new file mode 100644
index 000000000..932b96aba
--- /dev/null
+++ b/packages/vue-icon-saas/src/delta-left-o/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import DeltaLeftO from '@opentiny/vue-theme-saas/svgs/delta-left-o.svg'
+
+export default svg({ name: 'IconDeltaLeftO', component: DeltaLeftO })
diff --git a/packages/vue-icon-saas/src/delta-left/index.ts b/packages/vue-icon-saas/src/delta-left/index.ts
new file mode 100644
index 000000000..e2530e012
--- /dev/null
+++ b/packages/vue-icon-saas/src/delta-left/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import DeltaLeft from '@opentiny/vue-theme-saas/svgs/delta-left.svg'
+
+export default svg({ name: 'IconDeltaLeft', component: DeltaLeft })
diff --git a/packages/vue-icon-saas/src/delta-right-o/index.ts b/packages/vue-icon-saas/src/delta-right-o/index.ts
new file mode 100644
index 000000000..a3822e4a8
--- /dev/null
+++ b/packages/vue-icon-saas/src/delta-right-o/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import DeltaRightO from '@opentiny/vue-theme-saas/svgs/delta-right-o.svg'
+
+export default svg({ name: 'IconDeltaRightO', component: DeltaRightO })
diff --git a/packages/vue-icon-saas/src/delta-right/index.ts b/packages/vue-icon-saas/src/delta-right/index.ts
new file mode 100644
index 000000000..2f30f2bc5
--- /dev/null
+++ b/packages/vue-icon-saas/src/delta-right/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import DeltaRight from '@opentiny/vue-theme-saas/svgs/delta-right.svg'
+
+export default svg({ name: 'IconDeltaRight', component: DeltaRight })
diff --git a/packages/vue-icon-saas/src/delta-up-o/index.ts b/packages/vue-icon-saas/src/delta-up-o/index.ts
new file mode 100644
index 000000000..71f6e8c45
--- /dev/null
+++ b/packages/vue-icon-saas/src/delta-up-o/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import DeltaUpO from '@opentiny/vue-theme-saas/svgs/delta-up-o.svg'
+
+export default svg({ name: 'IconDeltaUpO', component: DeltaUpO })
diff --git a/packages/vue-icon-saas/src/delta-up/index.ts b/packages/vue-icon-saas/src/delta-up/index.ts
new file mode 100644
index 000000000..90565c09d
--- /dev/null
+++ b/packages/vue-icon-saas/src/delta-up/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import DeltaUp from '@opentiny/vue-theme-saas/svgs/delta-up.svg'
+
+export default svg({ name: 'IconDeltaUp', component: DeltaUp })
diff --git a/packages/vue-icon-saas/src/derive/index.ts b/packages/vue-icon-saas/src/derive/index.ts
new file mode 100644
index 000000000..ec62ca1b9
--- /dev/null
+++ b/packages/vue-icon-saas/src/derive/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Derive from '@opentiny/vue-theme-saas/svgs/derive.svg'
+
+export default svg({ name: 'IconDerive', component: Derive })
diff --git a/packages/vue-icon-saas/src/descending/index.ts b/packages/vue-icon-saas/src/descending/index.ts
new file mode 100644
index 000000000..6d41b0d0c
--- /dev/null
+++ b/packages/vue-icon-saas/src/descending/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Descending from '@opentiny/vue-theme-saas/svgs/descending.svg'
+
+export default svg({ name: 'IconDescending', component: Descending })
diff --git a/packages/vue-icon-saas/src/dialog/index.ts b/packages/vue-icon-saas/src/dialog/index.ts
new file mode 100644
index 000000000..3a6fd0871
--- /dev/null
+++ b/packages/vue-icon-saas/src/dialog/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Dialog from '@opentiny/vue-theme-saas/svgs/dialog.svg'
+
+export default svg({ name: 'IconDialog', component: Dialog })
diff --git a/packages/vue-icon-saas/src/dialog2/index.ts b/packages/vue-icon-saas/src/dialog2/index.ts
new file mode 100644
index 000000000..bcda869c1
--- /dev/null
+++ b/packages/vue-icon-saas/src/dialog2/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Dialog2 from '@opentiny/vue-theme-saas/svgs/dialog2.svg'
+
+export default svg({ name: 'IconDialog2', component: Dialog2 })
diff --git a/packages/vue-icon-saas/src/dot-chart/index.ts b/packages/vue-icon-saas/src/dot-chart/index.ts
new file mode 100644
index 000000000..620f0afc8
--- /dev/null
+++ b/packages/vue-icon-saas/src/dot-chart/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import DotChart from '@opentiny/vue-theme-saas/svgs/dot-chart.svg'
+
+export default svg({ name: 'IconDotChart', component: DotChart })
diff --git a/packages/vue-icon-saas/src/dot-download/index.ts b/packages/vue-icon-saas/src/dot-download/index.ts
new file mode 100644
index 000000000..b24365c1d
--- /dev/null
+++ b/packages/vue-icon-saas/src/dot-download/index.ts
@@ -0,0 +1,15 @@
+/**
+ * Copyright (c) 2022 - present TinyVue Authors.
+ * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd.
+ *
+ * Use of this source code is governed by an MIT-style license.
+ *
+ * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL,
+ * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR
+ * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
+ *
+ */
+import { svg } from '@opentiny/vue-common'
+import DotDownload from '@opentiny/vue-theme-saas/svgs/dot-download.svg'
+
+export default svg({ name: 'iconDotDownload', component: DotDownload })
diff --git a/packages/vue-icon-saas/src/dot-ipv4/index.ts b/packages/vue-icon-saas/src/dot-ipv4/index.ts
new file mode 100644
index 000000000..11a469086
--- /dev/null
+++ b/packages/vue-icon-saas/src/dot-ipv4/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import DotIpv4 from '@opentiny/vue-theme-saas/svgs/dot-ipv4.svg'
+
+export default svg({ name: 'IconDotIpv4', component: DotIpv4 })
diff --git a/packages/vue-icon-saas/src/double-left/index.ts b/packages/vue-icon-saas/src/double-left/index.ts
new file mode 100644
index 000000000..432835108
--- /dev/null
+++ b/packages/vue-icon-saas/src/double-left/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import DoubleLeft from '@opentiny/vue-theme-saas/svgs/double-left.svg'
+
+export default svg({ name: 'IconDoubleLeft', component: DoubleLeft })
diff --git a/packages/vue-icon-saas/src/double-right/index.ts b/packages/vue-icon-saas/src/double-right/index.ts
new file mode 100644
index 000000000..44d9ee880
--- /dev/null
+++ b/packages/vue-icon-saas/src/double-right/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import DoubleRight from '@opentiny/vue-theme-saas/svgs/double-right.svg'
+
+export default svg({ name: 'IconDoubleRight', component: DoubleRight })
diff --git a/packages/vue-icon-saas/src/down-o/index.ts b/packages/vue-icon-saas/src/down-o/index.ts
new file mode 100644
index 000000000..91774d6b7
--- /dev/null
+++ b/packages/vue-icon-saas/src/down-o/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import DownO from '@opentiny/vue-theme-saas/svgs/down-o.svg'
+
+export default svg({ name: 'IconDownO', component: DownO })
diff --git a/packages/vue-icon-saas/src/down-ward/index.ts b/packages/vue-icon-saas/src/down-ward/index.ts
new file mode 100644
index 000000000..381f7deef
--- /dev/null
+++ b/packages/vue-icon-saas/src/down-ward/index.ts
@@ -0,0 +1,15 @@
+/**
+ * Copyright (c) 2022 - present TinyVue Authors.
+ * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd.
+ *
+ * Use of this source code is governed by an MIT-style license.
+ *
+ * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL,
+ * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR
+ * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
+ *
+ */
+import { svg } from '@opentiny/vue-common'
+import DownWard from '@opentiny/vue-theme-saas/svgs/down-ward.svg'
+
+export default svg({ name: 'IconDownWard', component: DownWard })
diff --git a/packages/vue-icon-saas/src/down/index.ts b/packages/vue-icon-saas/src/down/index.ts
new file mode 100644
index 000000000..46bfa168b
--- /dev/null
+++ b/packages/vue-icon-saas/src/down/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Down from '@opentiny/vue-theme-saas/svgs/down.svg'
+
+export default svg({ name: 'IconDown', component: Down })
diff --git a/packages/vue-icon-saas/src/download-cloud/index.ts b/packages/vue-icon-saas/src/download-cloud/index.ts
new file mode 100644
index 000000000..3001cf72b
--- /dev/null
+++ b/packages/vue-icon-saas/src/download-cloud/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import DownloadCloud from '@opentiny/vue-theme-saas/svgs/download-cloud.svg'
+
+export default svg({ name: 'IconDownloadCloud', component: DownloadCloud })
diff --git a/packages/vue-icon-saas/src/download-link/index.ts b/packages/vue-icon-saas/src/download-link/index.ts
new file mode 100644
index 000000000..4bf2a8e3a
--- /dev/null
+++ b/packages/vue-icon-saas/src/download-link/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import DownloadLink from '@opentiny/vue-theme-saas/svgs/download-link.svg'
+
+export default svg({ name: 'IconDownloadLink', component: DownloadLink })
diff --git a/packages/vue-icon-saas/src/download/index.ts b/packages/vue-icon-saas/src/download/index.ts
new file mode 100644
index 000000000..a1384aaec
--- /dev/null
+++ b/packages/vue-icon-saas/src/download/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Download from '@opentiny/vue-theme-saas/svgs/download.svg'
+
+export default svg({ name: 'IconDownload', component: Download })
diff --git a/packages/vue-icon-saas/src/edit/index.ts b/packages/vue-icon-saas/src/edit/index.ts
new file mode 100644
index 000000000..1d7894d46
--- /dev/null
+++ b/packages/vue-icon-saas/src/edit/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Edit from '@opentiny/vue-theme-saas/svgs/edit.svg'
+
+export default svg({ name: 'IconEdit', component: Edit })
diff --git a/packages/vue-icon-saas/src/editor-align-center/index.ts b/packages/vue-icon-saas/src/editor-align-center/index.ts
new file mode 100644
index 000000000..5df91d352
--- /dev/null
+++ b/packages/vue-icon-saas/src/editor-align-center/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import EditorAlignCenter from '@opentiny/vue-theme-saas/svgs/editor-align-center.svg'
+
+export default svg({ name: 'EditorAlignCenter', component: EditorAlignCenter })
diff --git a/packages/vue-icon-saas/src/editor-align-left/index.ts b/packages/vue-icon-saas/src/editor-align-left/index.ts
new file mode 100644
index 000000000..1598c8dd0
--- /dev/null
+++ b/packages/vue-icon-saas/src/editor-align-left/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import EditorAlignLeft from '@opentiny/vue-theme-saas/svgs/editor-align-left.svg'
+
+export default svg({ name: 'EditorAlignLeft', component: EditorAlignLeft })
diff --git a/packages/vue-icon-saas/src/editor-align-right/index.ts b/packages/vue-icon-saas/src/editor-align-right/index.ts
new file mode 100644
index 000000000..3bcaaf925
--- /dev/null
+++ b/packages/vue-icon-saas/src/editor-align-right/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import EditorAlignRight from '@opentiny/vue-theme-saas/svgs/editor-align-right.svg'
+
+export default svg({ name: 'EditorAlignRight', component: EditorAlignRight })
diff --git a/packages/vue-icon-saas/src/editor-background/index.ts b/packages/vue-icon-saas/src/editor-background/index.ts
new file mode 100644
index 000000000..490657565
--- /dev/null
+++ b/packages/vue-icon-saas/src/editor-background/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import EditorBackground from '@opentiny/vue-theme-saas/svgs/editor-background.svg'
+
+export default svg({ name: 'EditorBackground', component: EditorBackground })
diff --git a/packages/vue-icon-saas/src/editor-bold/index.ts b/packages/vue-icon-saas/src/editor-bold/index.ts
new file mode 100644
index 000000000..841b1d351
--- /dev/null
+++ b/packages/vue-icon-saas/src/editor-bold/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import EditorBold from '@opentiny/vue-theme-saas/svgs/editor-bold.svg'
+
+export default svg({ name: 'EditorBold', component: EditorBold })
diff --git a/packages/vue-icon-saas/src/editor-code/index.ts b/packages/vue-icon-saas/src/editor-code/index.ts
new file mode 100644
index 000000000..83e393668
--- /dev/null
+++ b/packages/vue-icon-saas/src/editor-code/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import EditorCode from '@opentiny/vue-theme-saas/svgs/editor-code.svg'
+
+export default svg({ name: 'EditorCode', component: EditorCode })
diff --git a/packages/vue-icon-saas/src/editor-deleteline/index.ts b/packages/vue-icon-saas/src/editor-deleteline/index.ts
new file mode 100644
index 000000000..3c0e283dc
--- /dev/null
+++ b/packages/vue-icon-saas/src/editor-deleteline/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import EditorDeleteline from '@opentiny/vue-theme-saas/svgs/editor-deleteline.svg'
+
+export default svg({ name: 'EditorDeleteline', component: EditorDeleteline })
diff --git a/packages/vue-icon-saas/src/editor-eraser/index.ts b/packages/vue-icon-saas/src/editor-eraser/index.ts
new file mode 100644
index 000000000..bf3946f2e
--- /dev/null
+++ b/packages/vue-icon-saas/src/editor-eraser/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import EditorEraser from '@opentiny/vue-theme-saas/svgs/editor-eraser.svg'
+
+export default svg({ name: 'EditorEraser', component: EditorEraser })
diff --git a/packages/vue-icon-saas/src/editor-italic/index.ts b/packages/vue-icon-saas/src/editor-italic/index.ts
new file mode 100644
index 000000000..bc5d7bb49
--- /dev/null
+++ b/packages/vue-icon-saas/src/editor-italic/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import EditorItalic from '@opentiny/vue-theme-saas/svgs/editor-italic.svg'
+
+export default svg({ name: 'EditorItalic', component: EditorItalic })
diff --git a/packages/vue-icon-saas/src/editor-left-border/index.ts b/packages/vue-icon-saas/src/editor-left-border/index.ts
new file mode 100644
index 000000000..80b29ca5e
--- /dev/null
+++ b/packages/vue-icon-saas/src/editor-left-border/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import EditorLeftBorder from '@opentiny/vue-theme-saas/svgs/editor-left-border.svg'
+
+export default svg({ name: 'EditorLeftBorder', component: EditorLeftBorder })
diff --git a/packages/vue-icon-saas/src/editor-list-dot/index.ts b/packages/vue-icon-saas/src/editor-list-dot/index.ts
new file mode 100644
index 000000000..c1ae89d1c
--- /dev/null
+++ b/packages/vue-icon-saas/src/editor-list-dot/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import EditorListDot from '@opentiny/vue-theme-saas/svgs/editor-list-dot.svg'
+
+export default svg({ name: 'EditorListDot', component: EditorListDot })
diff --git a/packages/vue-icon-saas/src/editor-list-num/index.ts b/packages/vue-icon-saas/src/editor-list-num/index.ts
new file mode 100644
index 000000000..eb8e12248
--- /dev/null
+++ b/packages/vue-icon-saas/src/editor-list-num/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import EditorListNum from '@opentiny/vue-theme-saas/svgs/editor-list-num.svg'
+
+export default svg({ name: 'EditorListNum', component: EditorListNum })
diff --git a/packages/vue-icon-saas/src/editor-list/index.ts b/packages/vue-icon-saas/src/editor-list/index.ts
new file mode 100644
index 000000000..4f03d117c
--- /dev/null
+++ b/packages/vue-icon-saas/src/editor-list/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import EditorList from '@opentiny/vue-theme-saas/svgs/editor-list.svg'
+
+export default svg({ name: 'EditorList', component: EditorList })
diff --git a/packages/vue-icon-saas/src/editor-menu-left/index.ts b/packages/vue-icon-saas/src/editor-menu-left/index.ts
new file mode 100644
index 000000000..64bf44592
--- /dev/null
+++ b/packages/vue-icon-saas/src/editor-menu-left/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import EditorMenuLeft from '@opentiny/vue-theme-saas/svgs/editor-menu-left.svg'
+
+export default svg({ name: 'EditorMenuLeft', component: EditorMenuLeft })
diff --git a/packages/vue-icon-saas/src/editor-menu-right/index.ts b/packages/vue-icon-saas/src/editor-menu-right/index.ts
new file mode 100644
index 000000000..97b26e8f4
--- /dev/null
+++ b/packages/vue-icon-saas/src/editor-menu-right/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import EditorMenuRight from '@opentiny/vue-theme-saas/svgs/editor-menu-right.svg'
+
+export default svg({ name: 'EditorMenuRight', component: EditorMenuRight })
diff --git a/packages/vue-icon-saas/src/editor-quote/index.ts b/packages/vue-icon-saas/src/editor-quote/index.ts
new file mode 100644
index 000000000..2338c291d
--- /dev/null
+++ b/packages/vue-icon-saas/src/editor-quote/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import EditorQuote from '@opentiny/vue-theme-saas/svgs/editor-quote.svg'
+
+export default svg({ name: 'EditorQuote', component: EditorQuote })
diff --git a/packages/vue-icon-saas/src/editor-redo/index.ts b/packages/vue-icon-saas/src/editor-redo/index.ts
new file mode 100644
index 000000000..2c46a9572
--- /dev/null
+++ b/packages/vue-icon-saas/src/editor-redo/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import EditorRedo from '@opentiny/vue-theme-saas/svgs/editor-redo.svg'
+
+export default svg({ name: 'EditorRedo', component: EditorRedo })
diff --git a/packages/vue-icon-saas/src/editor-right-border/index.ts b/packages/vue-icon-saas/src/editor-right-border/index.ts
new file mode 100644
index 000000000..cd6a758a1
--- /dev/null
+++ b/packages/vue-icon-saas/src/editor-right-border/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import EditorRightBorder from '@opentiny/vue-theme-saas/svgs/editor-right-border.svg'
+
+export default svg({ name: 'EditorRightBorder', component: EditorRightBorder })
diff --git a/packages/vue-icon-saas/src/editor-sub/index.ts b/packages/vue-icon-saas/src/editor-sub/index.ts
new file mode 100644
index 000000000..07f9667e3
--- /dev/null
+++ b/packages/vue-icon-saas/src/editor-sub/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import EditorSub from '@opentiny/vue-theme-saas/svgs/editor-sub.svg'
+
+export default svg({ name: 'EditorSub', component: EditorSub })
diff --git a/packages/vue-icon-saas/src/editor-subtitle/index.ts b/packages/vue-icon-saas/src/editor-subtitle/index.ts
new file mode 100644
index 000000000..a3d12d46e
--- /dev/null
+++ b/packages/vue-icon-saas/src/editor-subtitle/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import EditorSubtitle from '@opentiny/vue-theme-saas/svgs/editor-subtitle.svg'
+
+export default svg({ name: 'EditorSubtitle', component: EditorSubtitle })
diff --git a/packages/vue-icon-saas/src/editor-super/index.ts b/packages/vue-icon-saas/src/editor-super/index.ts
new file mode 100644
index 000000000..4f2bae2e5
--- /dev/null
+++ b/packages/vue-icon-saas/src/editor-super/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import EditorSuper from '@opentiny/vue-theme-saas/svgs/editor-super.svg'
+
+export default svg({ name: 'EditorSuper', component: EditorSuper })
diff --git a/packages/vue-icon-saas/src/editor-tab/index.ts b/packages/vue-icon-saas/src/editor-tab/index.ts
new file mode 100644
index 000000000..b6f1e4f0e
--- /dev/null
+++ b/packages/vue-icon-saas/src/editor-tab/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import EditorTab from '@opentiny/vue-theme-saas/svgs/editor-tab.svg'
+
+export default svg({ name: 'IconEditorTab', component: EditorTab })
diff --git a/packages/vue-icon-saas/src/editor-table/index.ts b/packages/vue-icon-saas/src/editor-table/index.ts
new file mode 100644
index 000000000..ff9644b8b
--- /dev/null
+++ b/packages/vue-icon-saas/src/editor-table/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import EditorTable from '@opentiny/vue-theme-saas/svgs/editor-table.svg'
+
+export default svg({ name: 'EditorTable', component: EditorTable })
diff --git a/packages/vue-icon-saas/src/editor-textcolor/index.ts b/packages/vue-icon-saas/src/editor-textcolor/index.ts
new file mode 100644
index 000000000..95f442522
--- /dev/null
+++ b/packages/vue-icon-saas/src/editor-textcolor/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import EditorTextcolor from '@opentiny/vue-theme-saas/svgs/editor-textcolor.svg'
+
+export default svg({ name: 'EditorTextcolor', component: EditorTextcolor })
diff --git a/packages/vue-icon-saas/src/editor-title/index.ts b/packages/vue-icon-saas/src/editor-title/index.ts
new file mode 100644
index 000000000..3afe559f2
--- /dev/null
+++ b/packages/vue-icon-saas/src/editor-title/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import EditorTitle from '@opentiny/vue-theme-saas/svgs/editor-title.svg'
+
+export default svg({ name: 'EditorTitle', component: EditorTitle })
diff --git a/packages/vue-icon-saas/src/editor-underline/index.ts b/packages/vue-icon-saas/src/editor-underline/index.ts
new file mode 100644
index 000000000..da56c7f66
--- /dev/null
+++ b/packages/vue-icon-saas/src/editor-underline/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import EditorUnderline from '@opentiny/vue-theme-saas/svgs/editor-underline.svg'
+
+export default svg({ name: 'EditorUnderline', component: EditorUnderline })
diff --git a/packages/vue-icon-saas/src/editor-undo/index.ts b/packages/vue-icon-saas/src/editor-undo/index.ts
new file mode 100644
index 000000000..281e7dd20
--- /dev/null
+++ b/packages/vue-icon-saas/src/editor-undo/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import EditorUndo from '@opentiny/vue-theme-saas/svgs/editor-undo.svg'
+
+export default svg({ name: 'EditorUndo', component: EditorUndo })
diff --git a/packages/vue-icon-saas/src/editor-video/index.ts b/packages/vue-icon-saas/src/editor-video/index.ts
new file mode 100644
index 000000000..c330ecea3
--- /dev/null
+++ b/packages/vue-icon-saas/src/editor-video/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import EditorVideo from '@opentiny/vue-theme-saas/svgs/editor-video.svg'
+
+export default svg({ name: 'EditorVideo', component: EditorVideo })
diff --git a/packages/vue-icon-saas/src/ellipsis/index.ts b/packages/vue-icon-saas/src/ellipsis/index.ts
new file mode 100644
index 000000000..cc9fa544c
--- /dev/null
+++ b/packages/vue-icon-saas/src/ellipsis/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Ellipsis from '@opentiny/vue-theme-saas/svgs/ellipsis.svg'
+
+export default svg({ name: 'IconEllipsis', component: Ellipsis })
diff --git a/packages/vue-icon-saas/src/email-add/index.ts b/packages/vue-icon-saas/src/email-add/index.ts
new file mode 100644
index 000000000..460f44335
--- /dev/null
+++ b/packages/vue-icon-saas/src/email-add/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import EmailAdd from '@opentiny/vue-theme-saas/svgs/email-add.svg'
+
+export default svg({ name: 'IconEmailAdd', component: EmailAdd })
diff --git a/packages/vue-icon-saas/src/email-circle/index.ts b/packages/vue-icon-saas/src/email-circle/index.ts
new file mode 100644
index 000000000..f1786d3d2
--- /dev/null
+++ b/packages/vue-icon-saas/src/email-circle/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import EmailCircle from '@opentiny/vue-theme-saas/svgs/email-circle.svg'
+
+export default svg({ name: 'IconEmailCircle', component: EmailCircle })
diff --git a/packages/vue-icon-saas/src/end/index.ts b/packages/vue-icon-saas/src/end/index.ts
new file mode 100644
index 000000000..ea7f58ed8
--- /dev/null
+++ b/packages/vue-icon-saas/src/end/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import End from '@opentiny/vue-theme-saas/svgs/end.svg'
+
+export default svg({ name: 'IconEnd', component: End })
diff --git a/packages/vue-icon-saas/src/error/index.ts b/packages/vue-icon-saas/src/error/index.ts
new file mode 100644
index 000000000..38d8e26bf
--- /dev/null
+++ b/packages/vue-icon-saas/src/error/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Error from '@opentiny/vue-theme-saas/svgs/error.svg'
+
+export default svg({ name: 'IconError', component: Error })
diff --git a/packages/vue-icon-saas/src/espace-auto/index.ts b/packages/vue-icon-saas/src/espace-auto/index.ts
new file mode 100644
index 000000000..8d6c8b639
--- /dev/null
+++ b/packages/vue-icon-saas/src/espace-auto/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import EspaceAuto from '@opentiny/vue-theme-saas/svgs/espace-auto.svg'
+
+export default svg({ name: 'IconEspaceAuto', component: EspaceAuto })
diff --git a/packages/vue-icon-saas/src/espace/index.ts b/packages/vue-icon-saas/src/espace/index.ts
new file mode 100644
index 000000000..c79d9bb26
--- /dev/null
+++ b/packages/vue-icon-saas/src/espace/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Espace from '@opentiny/vue-theme-saas/svgs/espace.svg'
+
+export default svg({ name: 'IconEspace', component: Espace })
diff --git a/packages/vue-icon-saas/src/excel-type/index.ts b/packages/vue-icon-saas/src/excel-type/index.ts
new file mode 100644
index 000000000..fa3aa2f34
--- /dev/null
+++ b/packages/vue-icon-saas/src/excel-type/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import ExcelType from '@opentiny/vue-theme-saas/svgs/excel-type.svg'
+
+export default svg({ name: 'IconExcelType', component: ExcelType })
diff --git a/packages/vue-icon-saas/src/excel/index.ts b/packages/vue-icon-saas/src/excel/index.ts
new file mode 100644
index 000000000..bd44bf2e0
--- /dev/null
+++ b/packages/vue-icon-saas/src/excel/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Excel from '@opentiny/vue-theme-saas/svgs/excel.svg'
+
+export default svg({ name: 'IconExcel', component: Excel })
diff --git a/packages/vue-icon-saas/src/exception/index.ts b/packages/vue-icon-saas/src/exception/index.ts
new file mode 100644
index 000000000..1230bd638
--- /dev/null
+++ b/packages/vue-icon-saas/src/exception/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Exception from '@opentiny/vue-theme-saas/svgs/exception.svg'
+
+export default svg({ name: 'IconException', component: Exception })
diff --git a/packages/vue-icon-saas/src/exclamation/index.ts b/packages/vue-icon-saas/src/exclamation/index.ts
new file mode 100644
index 000000000..f1bdf30c4
--- /dev/null
+++ b/packages/vue-icon-saas/src/exclamation/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Exclamation from '@opentiny/vue-theme-saas/svgs/exclamation.svg'
+
+export default svg({ name: 'IconExclamation', component: Exclamation })
diff --git a/packages/vue-icon-saas/src/export/index.ts b/packages/vue-icon-saas/src/export/index.ts
new file mode 100644
index 000000000..9ec674c4d
--- /dev/null
+++ b/packages/vue-icon-saas/src/export/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Export from '@opentiny/vue-theme-saas/svgs/export.svg'
+
+export default svg({ name: 'IconExport', component: Export })
diff --git a/packages/vue-icon-saas/src/express-search/index.ts b/packages/vue-icon-saas/src/express-search/index.ts
new file mode 100644
index 000000000..35e467908
--- /dev/null
+++ b/packages/vue-icon-saas/src/express-search/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import ExpressSearch from '@opentiny/vue-theme-saas/svgs/express-search.svg'
+
+export default svg({ name: 'IconExpressSearch', component: ExpressSearch })
diff --git a/packages/vue-icon-saas/src/eyeclose/index.ts b/packages/vue-icon-saas/src/eyeclose/index.ts
new file mode 100644
index 000000000..39cd43bfd
--- /dev/null
+++ b/packages/vue-icon-saas/src/eyeclose/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Eyeclose from '@opentiny/vue-theme-saas/svgs/eyeclose.svg'
+
+export default svg({ name: 'IconEyeclose', component: Eyeclose })
diff --git a/packages/vue-icon-saas/src/eyeopen/index.ts b/packages/vue-icon-saas/src/eyeopen/index.ts
new file mode 100644
index 000000000..b467704fc
--- /dev/null
+++ b/packages/vue-icon-saas/src/eyeopen/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Eyeopen from '@opentiny/vue-theme-saas/svgs/eyeopen.svg'
+
+export default svg({ name: 'IconEyeopen', component: Eyeopen })
diff --git a/packages/vue-icon-saas/src/file-cloudupload/index.ts b/packages/vue-icon-saas/src/file-cloudupload/index.ts
new file mode 100644
index 000000000..18844506c
--- /dev/null
+++ b/packages/vue-icon-saas/src/file-cloudupload/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import FileCloudupload from '@opentiny/vue-theme-saas/svgs/file-cloudupload.svg'
+
+export default svg({ name: 'IconFileCloudupload', component: FileCloudupload })
diff --git a/packages/vue-icon-saas/src/file-excel/index.ts b/packages/vue-icon-saas/src/file-excel/index.ts
new file mode 100644
index 000000000..d53a7fa2b
--- /dev/null
+++ b/packages/vue-icon-saas/src/file-excel/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import FileExcel from '@opentiny/vue-theme-saas/svgs/file-excel.svg'
+
+export default svg({ name: 'IconFileExcel', component: FileExcel })
diff --git a/packages/vue-icon-saas/src/file-type/index.ts b/packages/vue-icon-saas/src/file-type/index.ts
new file mode 100644
index 000000000..a9978d0d1
--- /dev/null
+++ b/packages/vue-icon-saas/src/file-type/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import FileType from '@opentiny/vue-theme-saas/svgs/file-type.svg'
+
+export default svg({ name: 'IconFileType', component: FileType })
diff --git a/packages/vue-icon-saas/src/file/index.ts b/packages/vue-icon-saas/src/file/index.ts
new file mode 100644
index 000000000..42b350443
--- /dev/null
+++ b/packages/vue-icon-saas/src/file/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import File from '@opentiny/vue-theme-saas/svgs/file.svg'
+
+export default svg({ name: 'IconFile', component: File })
diff --git a/packages/vue-icon-saas/src/files-circle/index.ts b/packages/vue-icon-saas/src/files-circle/index.ts
new file mode 100644
index 000000000..6d35d4361
--- /dev/null
+++ b/packages/vue-icon-saas/src/files-circle/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import FilesCircle from '@opentiny/vue-theme-saas/svgs/files-circle.svg'
+
+export default svg({ name: 'IconFilesCircle', component: FilesCircle })
diff --git a/packages/vue-icon-saas/src/files/index.ts b/packages/vue-icon-saas/src/files/index.ts
new file mode 100644
index 000000000..f30b75d7b
--- /dev/null
+++ b/packages/vue-icon-saas/src/files/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Files from '@opentiny/vue-theme-saas/svgs/files.svg'
+
+export default svg({ name: 'IconFiles', component: Files })
diff --git a/packages/vue-icon-saas/src/filetext/index.ts b/packages/vue-icon-saas/src/filetext/index.ts
new file mode 100644
index 000000000..8669783cf
--- /dev/null
+++ b/packages/vue-icon-saas/src/filetext/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Filetext from '@opentiny/vue-theme-saas/svgs/filetext.svg'
+
+export default svg({ name: 'IconFiletext', component: Filetext })
diff --git a/packages/vue-icon-saas/src/fileupload/index.ts b/packages/vue-icon-saas/src/fileupload/index.ts
new file mode 100644
index 000000000..a1b5f4eb9
--- /dev/null
+++ b/packages/vue-icon-saas/src/fileupload/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Fileupload from '@opentiny/vue-theme-saas/svgs/fileupload.svg'
+
+export default svg({ name: 'IconFileupload', component: Fileupload })
diff --git a/packages/vue-icon-saas/src/filtered/index.ts b/packages/vue-icon-saas/src/filtered/index.ts
new file mode 100644
index 000000000..556620a97
--- /dev/null
+++ b/packages/vue-icon-saas/src/filtered/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Filtered from '@opentiny/vue-theme-saas/svgs/filtered.svg'
+
+export default svg({ name: 'IconFiltered', component: Filtered })
diff --git a/packages/vue-icon-saas/src/flag/index.ts b/packages/vue-icon-saas/src/flag/index.ts
new file mode 100644
index 000000000..43c045ea9
--- /dev/null
+++ b/packages/vue-icon-saas/src/flag/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Flag from '@opentiny/vue-theme-saas/svgs/flag.svg'
+
+export default svg({ name: 'IconFlag', component: Flag })
diff --git a/packages/vue-icon-saas/src/folder-closed/index.ts b/packages/vue-icon-saas/src/folder-closed/index.ts
new file mode 100644
index 000000000..f1aea8a00
--- /dev/null
+++ b/packages/vue-icon-saas/src/folder-closed/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import FolderClosed from '@opentiny/vue-theme-saas/svgs/folder-closed.svg'
+
+export default svg({ name: 'IconFolderClosed', component: FolderClosed })
diff --git a/packages/vue-icon-saas/src/folder-opened/index.ts b/packages/vue-icon-saas/src/folder-opened/index.ts
new file mode 100644
index 000000000..47f0ccb60
--- /dev/null
+++ b/packages/vue-icon-saas/src/folder-opened/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import FolderOpened from '@opentiny/vue-theme-saas/svgs/folder-opened.svg'
+
+export default svg({ name: 'IconFolderOpened', component: FolderOpened })
diff --git a/packages/vue-icon-saas/src/freeze-left/index.ts b/packages/vue-icon-saas/src/freeze-left/index.ts
new file mode 100644
index 000000000..1155a5289
--- /dev/null
+++ b/packages/vue-icon-saas/src/freeze-left/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import FreezeLeft from '@opentiny/vue-theme-saas/svgs/freeze-left.svg'
+
+export default svg({ name: 'IconFreezeLeft', component: FreezeLeft })
diff --git a/packages/vue-icon-saas/src/freeze-right/index.ts b/packages/vue-icon-saas/src/freeze-right/index.ts
new file mode 100644
index 000000000..b584b9470
--- /dev/null
+++ b/packages/vue-icon-saas/src/freeze-right/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import FreezeRight from '@opentiny/vue-theme-saas/svgs/freeze-right.svg'
+
+export default svg({ name: 'IconFreezeRight', component: FreezeRight })
diff --git a/packages/vue-icon-saas/src/frown-o/index.ts b/packages/vue-icon-saas/src/frown-o/index.ts
new file mode 100644
index 000000000..1e634b0b1
--- /dev/null
+++ b/packages/vue-icon-saas/src/frown-o/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import FrownO from '@opentiny/vue-theme-saas/svgs/frown-o.svg'
+
+export default svg({ name: 'IconFrownO', component: FrownO })
diff --git a/packages/vue-icon-saas/src/frown/index.ts b/packages/vue-icon-saas/src/frown/index.ts
new file mode 100644
index 000000000..5797351dd
--- /dev/null
+++ b/packages/vue-icon-saas/src/frown/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Frown from '@opentiny/vue-theme-saas/svgs/frown.svg'
+
+export default svg({ name: 'IconFrown', component: Frown })
diff --git a/packages/vue-icon-saas/src/fullscreen-left/index.ts b/packages/vue-icon-saas/src/fullscreen-left/index.ts
new file mode 100644
index 000000000..3ea60ba44
--- /dev/null
+++ b/packages/vue-icon-saas/src/fullscreen-left/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import FullscreenLeft from '@opentiny/vue-theme-saas/svgs/fullscreen-left.svg'
+
+export default svg({ name: 'IconFullscreenLeft', component: FullscreenLeft })
diff --git a/packages/vue-icon-saas/src/fullscreen/index.ts b/packages/vue-icon-saas/src/fullscreen/index.ts
new file mode 100644
index 000000000..00b85c4f2
--- /dev/null
+++ b/packages/vue-icon-saas/src/fullscreen/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Fullscreen from '@opentiny/vue-theme-saas/svgs/fullscreen.svg'
+
+export default svg({ name: 'IconFullscreen', component: Fullscreen })
diff --git a/packages/vue-icon-saas/src/grade/index.ts b/packages/vue-icon-saas/src/grade/index.ts
new file mode 100644
index 000000000..c3912d850
--- /dev/null
+++ b/packages/vue-icon-saas/src/grade/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Grade from '@opentiny/vue-theme-saas/svgs/grade.svg'
+
+export default svg({ name: 'IconGrade', component: Grade })
diff --git a/packages/vue-icon-saas/src/group-transfer/index.ts b/packages/vue-icon-saas/src/group-transfer/index.ts
new file mode 100644
index 000000000..52b976d2e
--- /dev/null
+++ b/packages/vue-icon-saas/src/group-transfer/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import GroupTransfer from '@opentiny/vue-theme-saas/svgs/group-transfer.svg'
+
+export default svg({ name: 'IconGroupTransfer', component: GroupTransfer })
diff --git a/packages/vue-icon-saas/src/group/index.ts b/packages/vue-icon-saas/src/group/index.ts
new file mode 100644
index 000000000..1828df6d0
--- /dev/null
+++ b/packages/vue-icon-saas/src/group/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Group from '@opentiny/vue-theme-saas/svgs/group.svg'
+
+export default svg({ name: 'IconGroup', component: Group })
diff --git a/packages/vue-icon-saas/src/halfchecked/index.ts b/packages/vue-icon-saas/src/halfchecked/index.ts
new file mode 100644
index 000000000..2704a8f3a
--- /dev/null
+++ b/packages/vue-icon-saas/src/halfchecked/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Halfchecked from '@opentiny/vue-theme-saas/svgs/halfchecked.svg'
+
+export default svg({ name: 'IconHalfchecked', component: Halfchecked })
diff --git a/packages/vue-icon-saas/src/halfselect/index.ts b/packages/vue-icon-saas/src/halfselect/index.ts
new file mode 100644
index 000000000..40832b85d
--- /dev/null
+++ b/packages/vue-icon-saas/src/halfselect/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Halfselect from '@opentiny/vue-theme-saas/svgs/halfselect.svg'
+
+export default svg({ name: 'IconHalfselect', component: Halfselect })
diff --git a/packages/vue-icon-saas/src/heartempty/index.ts b/packages/vue-icon-saas/src/heartempty/index.ts
new file mode 100644
index 000000000..04c045e45
--- /dev/null
+++ b/packages/vue-icon-saas/src/heartempty/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Heartempty from '@opentiny/vue-theme-saas/svgs/heartempty.svg'
+
+export default svg({ name: 'IconHeartempty', component: Heartempty })
diff --git a/packages/vue-icon-saas/src/help-circle/index.ts b/packages/vue-icon-saas/src/help-circle/index.ts
new file mode 100644
index 000000000..3e6a7983e
--- /dev/null
+++ b/packages/vue-icon-saas/src/help-circle/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import HelpCircle from '@opentiny/vue-theme-saas/svgs/help-circle.svg'
+
+export default svg({ name: 'IconHelpCircle', component: HelpCircle })
diff --git a/packages/vue-icon-saas/src/help-query/index.ts b/packages/vue-icon-saas/src/help-query/index.ts
new file mode 100644
index 000000000..37b19bab2
--- /dev/null
+++ b/packages/vue-icon-saas/src/help-query/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import HelpQuery from '@opentiny/vue-theme-saas/svgs/help-query.svg'
+
+export default svg({ name: 'IconHelpQuery', component: HelpQuery })
diff --git a/packages/vue-icon-saas/src/help-solid/index.ts b/packages/vue-icon-saas/src/help-solid/index.ts
new file mode 100644
index 000000000..32aa759ff
--- /dev/null
+++ b/packages/vue-icon-saas/src/help-solid/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import HelpSolid from '@opentiny/vue-theme-saas/svgs/help-solid.svg'
+
+export default svg({ name: 'IconHelpSolid', component: HelpSolid })
diff --git a/packages/vue-icon-saas/src/help/index.ts b/packages/vue-icon-saas/src/help/index.ts
new file mode 100644
index 000000000..b9e9ef91f
--- /dev/null
+++ b/packages/vue-icon-saas/src/help/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Help from '@opentiny/vue-theme-saas/svgs/help.svg'
+
+export default svg({ name: 'IconHelp', component: Help })
diff --git a/packages/vue-icon-saas/src/helpful/index.ts b/packages/vue-icon-saas/src/helpful/index.ts
new file mode 100644
index 000000000..e9e179cca
--- /dev/null
+++ b/packages/vue-icon-saas/src/helpful/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Helpful from '@opentiny/vue-theme-saas/svgs/helpful.svg'
+
+export default svg({ name: 'IconHelpful', component: Helpful })
diff --git a/packages/vue-icon-saas/src/import/index.ts b/packages/vue-icon-saas/src/import/index.ts
new file mode 100644
index 000000000..fb21c3f04
--- /dev/null
+++ b/packages/vue-icon-saas/src/import/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Import from '@opentiny/vue-theme-saas/svgs/import.svg'
+
+export default svg({ name: 'IconImport', component: Import })
diff --git a/packages/vue-icon-saas/src/info-circle/index.ts b/packages/vue-icon-saas/src/info-circle/index.ts
new file mode 100644
index 000000000..6293d8773
--- /dev/null
+++ b/packages/vue-icon-saas/src/info-circle/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import InfoCircle from '@opentiny/vue-theme-saas/svgs/info-circle.svg'
+
+export default svg({ name: 'IconInfoCircle', component: InfoCircle })
diff --git a/packages/vue-icon-saas/src/info-solid/index.ts b/packages/vue-icon-saas/src/info-solid/index.ts
new file mode 100644
index 000000000..e99347a0d
--- /dev/null
+++ b/packages/vue-icon-saas/src/info-solid/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import InfoSolid from '@opentiny/vue-theme-saas/svgs/info-solid.svg'
+
+export default svg({ name: 'IconInfoSolid', component: InfoSolid })
diff --git a/packages/vue-icon-saas/src/info/index.ts b/packages/vue-icon-saas/src/info/index.ts
new file mode 100644
index 000000000..29ccd1b8a
--- /dev/null
+++ b/packages/vue-icon-saas/src/info/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Info from '@opentiny/vue-theme-saas/svgs/info.svg'
+
+export default svg({ name: 'IconInfo', component: Info })
diff --git a/packages/vue-icon-saas/src/information/index.ts b/packages/vue-icon-saas/src/information/index.ts
new file mode 100644
index 000000000..aaef9d6dc
--- /dev/null
+++ b/packages/vue-icon-saas/src/information/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Information from '@opentiny/vue-theme-saas/svgs/information.svg'
+
+export default svg({ name: 'IconInformation', component: Information })
diff --git a/packages/vue-icon-saas/src/leave/index.ts b/packages/vue-icon-saas/src/leave/index.ts
new file mode 100644
index 000000000..3ff2ffd47
--- /dev/null
+++ b/packages/vue-icon-saas/src/leave/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Leave from '@opentiny/vue-theme-saas/svgs/leave.svg'
+
+export default svg({ name: 'IconLeave', component: Leave })
diff --git a/packages/vue-icon-saas/src/left-frozen/index.ts b/packages/vue-icon-saas/src/left-frozen/index.ts
new file mode 100644
index 000000000..7e5ab136f
--- /dev/null
+++ b/packages/vue-icon-saas/src/left-frozen/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import LeftFrozen from '@opentiny/vue-theme-saas/svgs/left-frozen.svg'
+
+export default svg({ name: 'IconLeftFrozen', component: LeftFrozen })
diff --git a/packages/vue-icon-saas/src/left-o/index.ts b/packages/vue-icon-saas/src/left-o/index.ts
new file mode 100644
index 000000000..76afd81c2
--- /dev/null
+++ b/packages/vue-icon-saas/src/left-o/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import LeftO from '@opentiny/vue-theme-saas/svgs/left-o.svg'
+
+export default svg({ name: 'IconLeftO', component: LeftO })
diff --git a/packages/vue-icon-saas/src/left-ward-arrow/index.ts b/packages/vue-icon-saas/src/left-ward-arrow/index.ts
new file mode 100644
index 000000000..765bcef43
--- /dev/null
+++ b/packages/vue-icon-saas/src/left-ward-arrow/index.ts
@@ -0,0 +1,16 @@
+/**
+ * Copyright (c) 2022 - present TinyVue Authors.
+ * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd.
+ *
+ * Use of this source code is governed by an MIT-style license.
+ *
+ * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL,
+ * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR
+ * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
+ *
+ */
+
+import { svg } from '@opentiny/vue-common'
+import LeftWardArrow from '@opentiny/vue-theme-saas/svgs/Left-ward-arrow.svg'
+
+export default svg({ name: 'IconLeftWardArrow', component: LeftWardArrow })
diff --git a/packages/vue-icon-saas/src/left-ward/index.ts b/packages/vue-icon-saas/src/left-ward/index.ts
new file mode 100644
index 000000000..0b0d4ff72
--- /dev/null
+++ b/packages/vue-icon-saas/src/left-ward/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import LeftWard from '@opentiny/vue-theme-saas/svgs/left-ward.svg'
+
+export default svg({ name: 'IconLeftWard', component: LeftWard })
diff --git a/packages/vue-icon-saas/src/left/index.ts b/packages/vue-icon-saas/src/left/index.ts
new file mode 100644
index 000000000..70498f75a
--- /dev/null
+++ b/packages/vue-icon-saas/src/left/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Left from '@opentiny/vue-theme-saas/svgs/left.svg'
+
+export default svg({ name: 'IconLeft', component: Left })
diff --git a/packages/vue-icon-saas/src/line-chart/index.ts b/packages/vue-icon-saas/src/line-chart/index.ts
new file mode 100644
index 000000000..b559e0e20
--- /dev/null
+++ b/packages/vue-icon-saas/src/line-chart/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import LineChart from '@opentiny/vue-theme-saas/svgs/line-chart.svg'
+
+export default svg({ name: 'IconLineChart', component: LineChart })
diff --git a/packages/vue-icon-saas/src/link/index.ts b/packages/vue-icon-saas/src/link/index.ts
new file mode 100644
index 000000000..791473483
--- /dev/null
+++ b/packages/vue-icon-saas/src/link/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Link from '@opentiny/vue-theme-saas/svgs/link.svg'
+
+export default svg({ name: 'IconLink', component: Link })
diff --git a/packages/vue-icon-saas/src/loading/index.ts b/packages/vue-icon-saas/src/loading/index.ts
new file mode 100644
index 000000000..adc5e41be
--- /dev/null
+++ b/packages/vue-icon-saas/src/loading/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Loading from '@opentiny/vue-theme-saas/svgs/loading.svg'
+
+export default svg({ name: 'IconLoading', component: Loading })
diff --git a/packages/vue-icon-saas/src/lock/index.ts b/packages/vue-icon-saas/src/lock/index.ts
new file mode 100644
index 000000000..95491ea1f
--- /dev/null
+++ b/packages/vue-icon-saas/src/lock/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Lock from '@opentiny/vue-theme-saas/svgs/lock.svg'
+
+export default svg({ name: 'IconLock', component: Lock })
diff --git a/packages/vue-icon-saas/src/mail-content/index.ts b/packages/vue-icon-saas/src/mail-content/index.ts
new file mode 100644
index 000000000..645b23cfc
--- /dev/null
+++ b/packages/vue-icon-saas/src/mail-content/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import MailContent from '@opentiny/vue-theme-saas/svgs/mail-content.svg'
+
+export default svg({ name: 'IconMailContent', component: MailContent })
diff --git a/packages/vue-icon-saas/src/mail/index.ts b/packages/vue-icon-saas/src/mail/index.ts
new file mode 100644
index 000000000..d15be207e
--- /dev/null
+++ b/packages/vue-icon-saas/src/mail/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Mail from '@opentiny/vue-theme-saas/svgs/mail.svg'
+
+export default svg({ name: 'IconMail', component: Mail })
diff --git a/packages/vue-icon-saas/src/male/index.ts b/packages/vue-icon-saas/src/male/index.ts
new file mode 100644
index 000000000..8de849787
--- /dev/null
+++ b/packages/vue-icon-saas/src/male/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Male from '@opentiny/vue-theme-saas/svgs/male.svg'
+
+export default svg({ name: 'IconMale', component: Male })
diff --git a/packages/vue-icon-saas/src/mark-on/index.ts b/packages/vue-icon-saas/src/mark-on/index.ts
new file mode 100644
index 000000000..c3720c85f
--- /dev/null
+++ b/packages/vue-icon-saas/src/mark-on/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import MarkOn from '@opentiny/vue-theme-saas/svgs/mark-on.svg'
+
+export default svg({ name: 'IconMarkOn', component: MarkOn })
diff --git a/packages/vue-icon-saas/src/meh/index.ts b/packages/vue-icon-saas/src/meh/index.ts
new file mode 100644
index 000000000..eb5bc7c80
--- /dev/null
+++ b/packages/vue-icon-saas/src/meh/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Meh from '@opentiny/vue-theme-saas/svgs/meh.svg'
+
+export default svg({ name: 'IconMeh', component: Meh })
diff --git a/packages/vue-icon-saas/src/message-circle/index.ts b/packages/vue-icon-saas/src/message-circle/index.ts
new file mode 100644
index 000000000..8e3ccdad0
--- /dev/null
+++ b/packages/vue-icon-saas/src/message-circle/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import MessageCircle from '@opentiny/vue-theme-saas/svgs/message-circle.svg'
+
+export default svg({ name: 'IconMessageCircle', component: MessageCircle })
diff --git a/packages/vue-icon-saas/src/mic/index.ts b/packages/vue-icon-saas/src/mic/index.ts
new file mode 100644
index 000000000..fe0f48cb6
--- /dev/null
+++ b/packages/vue-icon-saas/src/mic/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Mic from '@opentiny/vue-theme-saas/svgs/mic.svg'
+
+export default svg({ name: 'IconMic', component: Mic })
diff --git a/packages/vue-icon-saas/src/minscreen-left/index.ts b/packages/vue-icon-saas/src/minscreen-left/index.ts
new file mode 100644
index 000000000..d239991f5
--- /dev/null
+++ b/packages/vue-icon-saas/src/minscreen-left/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import MinscreenLeft from '@opentiny/vue-theme-saas/svgs/minscreen-left.svg'
+
+export default svg({ name: 'IconMinscreenLeft', component: MinscreenLeft })
diff --git a/packages/vue-icon-saas/src/minscreen/index.ts b/packages/vue-icon-saas/src/minscreen/index.ts
new file mode 100644
index 000000000..77b751da0
--- /dev/null
+++ b/packages/vue-icon-saas/src/minscreen/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Minscreen from '@opentiny/vue-theme-saas/svgs/minscreen.svg'
+
+export default svg({ name: 'IconMinscreen', component: Minscreen })
diff --git a/packages/vue-icon-saas/src/minus-circle/index.ts b/packages/vue-icon-saas/src/minus-circle/index.ts
new file mode 100644
index 000000000..ff05b12c3
--- /dev/null
+++ b/packages/vue-icon-saas/src/minus-circle/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import MinusCircle from '@opentiny/vue-theme-saas/svgs/minus-circle.svg'
+
+export default svg({ name: 'IconMinusCircle', component: MinusCircle })
diff --git a/packages/vue-icon-saas/src/minus-square/index.ts b/packages/vue-icon-saas/src/minus-square/index.ts
new file mode 100644
index 000000000..85ab06536
--- /dev/null
+++ b/packages/vue-icon-saas/src/minus-square/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import MinusSquare from '@opentiny/vue-theme-saas/svgs/minus-square.svg'
+
+export default svg({ name: 'IconMinusSquare', component: MinusSquare })
diff --git a/packages/vue-icon-saas/src/minus/index.ts b/packages/vue-icon-saas/src/minus/index.ts
new file mode 100644
index 000000000..bf4ae3a80
--- /dev/null
+++ b/packages/vue-icon-saas/src/minus/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Minus from '@opentiny/vue-theme-saas/svgs/minus.svg'
+
+export default svg({ name: 'IconMinus', component: Minus })
diff --git a/packages/vue-icon-saas/src/mobile-checkbox-half/index.ts b/packages/vue-icon-saas/src/mobile-checkbox-half/index.ts
new file mode 100644
index 000000000..0cc3b85d3
--- /dev/null
+++ b/packages/vue-icon-saas/src/mobile-checkbox-half/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import MobileCheckboxHalf from '@opentiny/vue-theme-saas/svgs/mobile-checkbox-half.svg'
+
+export default svg({ name: 'IconMobileCheckboxHalf', component: MobileCheckboxHalf })
diff --git a/packages/vue-icon-saas/src/mobile-checkbox-selected/index.ts b/packages/vue-icon-saas/src/mobile-checkbox-selected/index.ts
new file mode 100644
index 000000000..5f445d296
--- /dev/null
+++ b/packages/vue-icon-saas/src/mobile-checkbox-selected/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import MobileCheckboxSelected from '@opentiny/vue-theme-saas/svgs/mobile-checkbox-selected.svg'
+
+export default svg({ name: 'IconMobileCheckboxSelected', component: MobileCheckboxSelected })
diff --git a/packages/vue-icon-saas/src/mobile-checkbox/index.ts b/packages/vue-icon-saas/src/mobile-checkbox/index.ts
new file mode 100644
index 000000000..72387b81e
--- /dev/null
+++ b/packages/vue-icon-saas/src/mobile-checkbox/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import MobileCheckbox from '@opentiny/vue-theme-saas/svgs/mobile-checkbox.svg'
+
+export default svg({ name: 'IconMobileCheckbox', component: MobileCheckbox })
diff --git a/packages/vue-icon-saas/src/mobile-radio-selected/index.ts b/packages/vue-icon-saas/src/mobile-radio-selected/index.ts
new file mode 100644
index 000000000..f4d0866d5
--- /dev/null
+++ b/packages/vue-icon-saas/src/mobile-radio-selected/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import MobileRadioSelected from '@opentiny/vue-theme-saas/svgs/mobile-radio-selected.svg'
+
+export default svg({ name: 'IconMobileRadioSelected', component: MobileRadioSelected })
diff --git a/packages/vue-icon-saas/src/mobile-radio/index.ts b/packages/vue-icon-saas/src/mobile-radio/index.ts
new file mode 100644
index 000000000..84c378b1d
--- /dev/null
+++ b/packages/vue-icon-saas/src/mobile-radio/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import MobileRadio from '@opentiny/vue-theme-saas/svgs/mobile-radio.svg'
+
+export default svg({ name: 'IconMobileRadio', component: MobileRadio })
diff --git a/packages/vue-icon-saas/src/mobile/index.ts b/packages/vue-icon-saas/src/mobile/index.ts
new file mode 100644
index 000000000..72695f601
--- /dev/null
+++ b/packages/vue-icon-saas/src/mobile/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Mobile from '@opentiny/vue-theme-saas/svgs/mobile.svg'
+
+export default svg({ name: 'IconMobile', component: Mobile })
diff --git a/packages/vue-icon-saas/src/more/index.ts b/packages/vue-icon-saas/src/more/index.ts
new file mode 100644
index 000000000..6ddcb7065
--- /dev/null
+++ b/packages/vue-icon-saas/src/more/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import More from '@opentiny/vue-theme-saas/svgs/more.svg'
+
+export default svg({ name: 'IconMore', component: More })
diff --git a/packages/vue-icon-saas/src/new/index.ts b/packages/vue-icon-saas/src/new/index.ts
new file mode 100644
index 000000000..f6d80e62b
--- /dev/null
+++ b/packages/vue-icon-saas/src/new/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import New from '@opentiny/vue-theme-saas/svgs/new.svg'
+
+export default svg({ name: 'IconNew', component: New })
diff --git a/packages/vue-icon-saas/src/no-premission/index.ts b/packages/vue-icon-saas/src/no-premission/index.ts
new file mode 100644
index 000000000..648c65209
--- /dev/null
+++ b/packages/vue-icon-saas/src/no-premission/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import NoPremission from '@opentiny/vue-theme-saas/svgs/no-premission.svg'
+
+export default svg({ name: 'IconNoPremission', component: NoPremission })
diff --git a/packages/vue-icon-saas/src/node-open/index.ts b/packages/vue-icon-saas/src/node-open/index.ts
new file mode 100644
index 000000000..421ab9764
--- /dev/null
+++ b/packages/vue-icon-saas/src/node-open/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import NodeOpen from '@opentiny/vue-theme-saas/svgs/node-open.svg'
+
+export default svg({ name: 'IconNodeOpen', component: NodeOpen })
diff --git a/packages/vue-icon-saas/src/node/index.ts b/packages/vue-icon-saas/src/node/index.ts
new file mode 100644
index 000000000..587999809
--- /dev/null
+++ b/packages/vue-icon-saas/src/node/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Node from '@opentiny/vue-theme-saas/svgs/node.svg'
+
+export default svg({ name: 'IconNode', component: Node })
diff --git a/packages/vue-icon-saas/src/off-line/index.ts b/packages/vue-icon-saas/src/off-line/index.ts
new file mode 100644
index 000000000..159ad9130
--- /dev/null
+++ b/packages/vue-icon-saas/src/off-line/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import OffLine from '@opentiny/vue-theme-saas/svgs/off-line.svg'
+
+export default svg({ name: 'IconOffLine', component: OffLine })
diff --git a/packages/vue-icon-saas/src/on-line/index.ts b/packages/vue-icon-saas/src/on-line/index.ts
new file mode 100644
index 000000000..ca6f158a3
--- /dev/null
+++ b/packages/vue-icon-saas/src/on-line/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import OnLine from '@opentiny/vue-theme-saas/svgs/on-line.svg'
+
+export default svg({ name: 'IconOnLine', component: OnLine })
diff --git a/packages/vue-icon-saas/src/operationfaild-l/index.ts b/packages/vue-icon-saas/src/operationfaild-l/index.ts
new file mode 100644
index 000000000..5956dc8c9
--- /dev/null
+++ b/packages/vue-icon-saas/src/operationfaild-l/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import OperationfaildL from '@opentiny/vue-theme-saas/svgs/operationfaild-l.svg'
+
+export default svg({ name: 'IconOperationfaildL', component: OperationfaildL })
diff --git a/packages/vue-icon-saas/src/operationfaild/index.ts b/packages/vue-icon-saas/src/operationfaild/index.ts
new file mode 100644
index 000000000..36d49e456
--- /dev/null
+++ b/packages/vue-icon-saas/src/operationfaild/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Operationfaild from '@opentiny/vue-theme-saas/svgs/operationfaild.svg'
+
+export default svg({ name: 'IconOperationfaild', component: Operationfaild })
diff --git a/packages/vue-icon-saas/src/other-type/index.ts b/packages/vue-icon-saas/src/other-type/index.ts
new file mode 100644
index 000000000..853a07004
--- /dev/null
+++ b/packages/vue-icon-saas/src/other-type/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import OtherType from '@opentiny/vue-theme-saas/svgs/other-type.svg'
+
+export default svg({ name: 'IconOtherType', component: OtherType })
diff --git a/packages/vue-icon-saas/src/outer-link/index.ts b/packages/vue-icon-saas/src/outer-link/index.ts
new file mode 100644
index 000000000..dac064adc
--- /dev/null
+++ b/packages/vue-icon-saas/src/outer-link/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import OuterLink from '@opentiny/vue-theme-saas/svgs/outer-link.svg'
+
+export default svg({ name: 'IconOuterLink', component: OuterLink })
diff --git a/packages/vue-icon-saas/src/pagelink/index.ts b/packages/vue-icon-saas/src/pagelink/index.ts
new file mode 100644
index 000000000..867c865f9
--- /dev/null
+++ b/packages/vue-icon-saas/src/pagelink/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Pagelink from '@opentiny/vue-theme-saas/svgs/pagelink.svg'
+
+export default svg({ name: 'IconPagelink', component: Pagelink })
diff --git a/packages/vue-icon-saas/src/pager-first/index.ts b/packages/vue-icon-saas/src/pager-first/index.ts
new file mode 100644
index 000000000..b9eb690bd
--- /dev/null
+++ b/packages/vue-icon-saas/src/pager-first/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import PagerFirst from '@opentiny/vue-theme-saas/svgs/pager-first.svg'
+
+export default svg({ name: 'IconPagerFirst', component: PagerFirst })
diff --git a/packages/vue-icon-saas/src/pager-last/index.ts b/packages/vue-icon-saas/src/pager-last/index.ts
new file mode 100644
index 000000000..b5ff43b26
--- /dev/null
+++ b/packages/vue-icon-saas/src/pager-last/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import PagerLast from '@opentiny/vue-theme-saas/svgs/pager-last.svg'
+
+export default svg({ name: 'IconPagerLast', component: PagerLast })
diff --git a/packages/vue-icon-saas/src/pager-next/index.ts b/packages/vue-icon-saas/src/pager-next/index.ts
new file mode 100644
index 000000000..531584c9c
--- /dev/null
+++ b/packages/vue-icon-saas/src/pager-next/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import PagerNext from '@opentiny/vue-theme-saas/svgs/pager-next.svg'
+
+export default svg({ name: 'IconPagerNext', component: PagerNext })
diff --git a/packages/vue-icon-saas/src/pager-prev/index.ts b/packages/vue-icon-saas/src/pager-prev/index.ts
new file mode 100644
index 000000000..91d27bb4b
--- /dev/null
+++ b/packages/vue-icon-saas/src/pager-prev/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import PagerPrev from '@opentiny/vue-theme-saas/svgs/pager-prev.svg'
+
+export default svg({ name: 'IconPagerPrev', component: PagerPrev })
diff --git a/packages/vue-icon-saas/src/panel-max/index.ts b/packages/vue-icon-saas/src/panel-max/index.ts
new file mode 100644
index 000000000..8145fe68d
--- /dev/null
+++ b/packages/vue-icon-saas/src/panel-max/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import PanelMax from '@opentiny/vue-theme-saas/svgs/panel-max.svg'
+
+export default svg({ name: 'IconPanelMax', component: PanelMax })
diff --git a/packages/vue-icon-saas/src/panel-mini/index.ts b/packages/vue-icon-saas/src/panel-mini/index.ts
new file mode 100644
index 000000000..c8763343b
--- /dev/null
+++ b/packages/vue-icon-saas/src/panel-mini/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import PanelMini from '@opentiny/vue-theme-saas/svgs/panel-mini.svg'
+
+export default svg({ name: 'IconPanelMini', component: PanelMini })
diff --git a/packages/vue-icon-saas/src/panel-normal/index.ts b/packages/vue-icon-saas/src/panel-normal/index.ts
new file mode 100644
index 000000000..1b197abd4
--- /dev/null
+++ b/packages/vue-icon-saas/src/panel-normal/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import PanelNormal from '@opentiny/vue-theme-saas/svgs/panel-normal.svg'
+
+export default svg({ name: 'IconPanelNormal', component: PanelNormal })
diff --git a/packages/vue-icon-saas/src/pause-circle/index.ts b/packages/vue-icon-saas/src/pause-circle/index.ts
new file mode 100644
index 000000000..b373aeab2
--- /dev/null
+++ b/packages/vue-icon-saas/src/pause-circle/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import PauseCircle from '@opentiny/vue-theme-saas/svgs/pause-circle.svg'
+
+export default svg({ name: 'IconPauseCircle', component: PauseCircle })
diff --git a/packages/vue-icon-saas/src/pause/index.ts b/packages/vue-icon-saas/src/pause/index.ts
new file mode 100644
index 000000000..dd5583a2f
--- /dev/null
+++ b/packages/vue-icon-saas/src/pause/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Pause from '@opentiny/vue-theme-saas/svgs/pause.svg'
+
+export default svg({ name: 'IconPause', component: Pause })
diff --git a/packages/vue-icon-saas/src/pdf-type/index.ts b/packages/vue-icon-saas/src/pdf-type/index.ts
new file mode 100644
index 000000000..78072a5c2
--- /dev/null
+++ b/packages/vue-icon-saas/src/pdf-type/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import PdfType from '@opentiny/vue-theme-saas/svgs/pdf-type.svg'
+
+export default svg({ name: 'IconPdfType', component: PdfType })
diff --git a/packages/vue-icon-saas/src/picture-type/index.ts b/packages/vue-icon-saas/src/picture-type/index.ts
new file mode 100644
index 000000000..2b2baba4a
--- /dev/null
+++ b/packages/vue-icon-saas/src/picture-type/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import PictureType from '@opentiny/vue-theme-saas/svgs/picture-type.svg'
+
+export default svg({ name: 'IconPictureType', component: PictureType })
diff --git a/packages/vue-icon-saas/src/picture/index.ts b/packages/vue-icon-saas/src/picture/index.ts
new file mode 100644
index 000000000..3af239bad
--- /dev/null
+++ b/packages/vue-icon-saas/src/picture/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Picture from '@opentiny/vue-theme-saas/svgs/picture.svg'
+
+export default svg({ name: 'IconPicture', component: Picture })
diff --git a/packages/vue-icon-saas/src/pie-chart/index.ts b/packages/vue-icon-saas/src/pie-chart/index.ts
new file mode 100644
index 000000000..40044ff75
--- /dev/null
+++ b/packages/vue-icon-saas/src/pie-chart/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import PieChart from '@opentiny/vue-theme-saas/svgs/pie-chart.svg'
+
+export default svg({ name: 'IconPieChart', component: PieChart })
diff --git a/packages/vue-icon-saas/src/plus-circle/index.ts b/packages/vue-icon-saas/src/plus-circle/index.ts
new file mode 100644
index 000000000..cb3850f2c
--- /dev/null
+++ b/packages/vue-icon-saas/src/plus-circle/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import PlusCircle from '@opentiny/vue-theme-saas/svgs/plus-circle.svg'
+
+export default svg({ name: 'IconPlusCircle', component: PlusCircle })
diff --git a/packages/vue-icon-saas/src/plus-square/index.ts b/packages/vue-icon-saas/src/plus-square/index.ts
new file mode 100644
index 000000000..54d6e4370
--- /dev/null
+++ b/packages/vue-icon-saas/src/plus-square/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import PlusSquare from '@opentiny/vue-theme-saas/svgs/plus-square.svg'
+
+export default svg({ name: 'IconPlusSquare', component: PlusSquare })
diff --git a/packages/vue-icon-saas/src/plus/index.ts b/packages/vue-icon-saas/src/plus/index.ts
new file mode 100644
index 000000000..04bf6ceba
--- /dev/null
+++ b/packages/vue-icon-saas/src/plus/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Plus from '@opentiny/vue-theme-saas/svgs/plus.svg'
+
+export default svg({ name: 'IconPlus', component: Plus })
diff --git a/packages/vue-icon-saas/src/popup/index.ts b/packages/vue-icon-saas/src/popup/index.ts
new file mode 100644
index 000000000..38d0ca42a
--- /dev/null
+++ b/packages/vue-icon-saas/src/popup/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Popup from '@opentiny/vue-theme-saas/svgs/popup.svg'
+
+export default svg({ name: 'IconPopup', component: Popup })
diff --git a/packages/vue-icon-saas/src/ppt-type/index.ts b/packages/vue-icon-saas/src/ppt-type/index.ts
new file mode 100644
index 000000000..3beb85985
--- /dev/null
+++ b/packages/vue-icon-saas/src/ppt-type/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import PptType from '@opentiny/vue-theme-saas/svgs/ppt-type.svg'
+
+export default svg({ name: 'IconPptType', component: PptType })
diff --git a/packages/vue-icon-saas/src/pre-checked/index.ts b/packages/vue-icon-saas/src/pre-checked/index.ts
new file mode 100644
index 000000000..c940eaba6
--- /dev/null
+++ b/packages/vue-icon-saas/src/pre-checked/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import PreChecked from '@opentiny/vue-theme-saas/svgs/pre-checked.svg'
+
+export default svg({ name: 'IconPreChecked', component: PreChecked })
diff --git a/packages/vue-icon-saas/src/print-preview/index.ts b/packages/vue-icon-saas/src/print-preview/index.ts
new file mode 100644
index 000000000..ad9e93d70
--- /dev/null
+++ b/packages/vue-icon-saas/src/print-preview/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import PrintPreview from '@opentiny/vue-theme-saas/svgs/print-preview.svg'
+
+export default svg({ name: 'IconPrintPreview', component: PrintPreview })
diff --git a/packages/vue-icon-saas/src/prompt-exclamation/index.ts b/packages/vue-icon-saas/src/prompt-exclamation/index.ts
new file mode 100644
index 000000000..7848728c9
--- /dev/null
+++ b/packages/vue-icon-saas/src/prompt-exclamation/index.ts
@@ -0,0 +1,15 @@
+/**
+ * Copyright (c) 2022 - present TinyVue Authors.
+ * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd.
+ *
+ * Use of this source code is governed by an MIT-style license.
+ *
+ * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL,
+ * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR
+ * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
+ *
+ */
+import { svg } from '@opentiny/vue-common'
+import PrompExclamation from '@opentiny/vue-theme-saas/svgs/prompt-exclamation.svg'
+
+export default svg({ name: 'IconPrompExclamation', component: PrompExclamation })
diff --git a/packages/vue-icon-saas/src/pushpin/index.ts b/packages/vue-icon-saas/src/pushpin/index.ts
new file mode 100644
index 000000000..58556bcfc
--- /dev/null
+++ b/packages/vue-icon-saas/src/pushpin/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Pushpin from '@opentiny/vue-theme-saas/svgs/pushpin.svg'
+
+export default svg({ name: 'IconPushpin', component: Pushpin })
diff --git a/packages/vue-icon-saas/src/radio/index.ts b/packages/vue-icon-saas/src/radio/index.ts
new file mode 100644
index 000000000..0878b0daf
--- /dev/null
+++ b/packages/vue-icon-saas/src/radio/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Radio from '@opentiny/vue-theme-saas/svgs/radio.svg'
+
+export default svg({ name: 'IconRadio', component: Radio })
diff --git a/packages/vue-icon-saas/src/radioselected/index.ts b/packages/vue-icon-saas/src/radioselected/index.ts
new file mode 100644
index 000000000..500d1def0
--- /dev/null
+++ b/packages/vue-icon-saas/src/radioselected/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Radioselected from '@opentiny/vue-theme-saas/svgs/radioselected.svg'
+
+export default svg({ name: 'IconRadioselected', component: Radioselected })
diff --git a/packages/vue-icon-saas/src/refres/index.ts b/packages/vue-icon-saas/src/refres/index.ts
new file mode 100644
index 000000000..adaf5cf40
--- /dev/null
+++ b/packages/vue-icon-saas/src/refres/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Refres from '@opentiny/vue-theme-saas/svgs/refres.svg'
+
+export default svg({ name: 'IconRefres', component: Refres })
diff --git a/packages/vue-icon-saas/src/renew/index.ts b/packages/vue-icon-saas/src/renew/index.ts
new file mode 100644
index 000000000..2b24c4dd6
--- /dev/null
+++ b/packages/vue-icon-saas/src/renew/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Renew from '@opentiny/vue-theme-saas/svgs/renew.svg'
+
+export default svg({ name: 'IconRenew', component: Renew })
diff --git a/packages/vue-icon-saas/src/repeat/index.ts b/packages/vue-icon-saas/src/repeat/index.ts
new file mode 100644
index 000000000..7d3cf7b02
--- /dev/null
+++ b/packages/vue-icon-saas/src/repeat/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Repeat from '@opentiny/vue-theme-saas/svgs/repeat.svg'
+
+export default svg({ name: 'IconRepeat', component: Repeat })
diff --git a/packages/vue-icon-saas/src/replace/index.ts b/packages/vue-icon-saas/src/replace/index.ts
new file mode 100644
index 000000000..6e5240348
--- /dev/null
+++ b/packages/vue-icon-saas/src/replace/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Replace from '@opentiny/vue-theme-saas/svgs/replace.svg'
+
+export default svg({ name: 'IconReplace', component: Replace })
diff --git a/packages/vue-icon-saas/src/replies/index.ts b/packages/vue-icon-saas/src/replies/index.ts
new file mode 100644
index 000000000..24193e6c4
--- /dev/null
+++ b/packages/vue-icon-saas/src/replies/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Replies from '@opentiny/vue-theme-saas/svgs/replies.svg'
+
+export default svg({ name: 'IconReplies', component: Replies })
diff --git a/packages/vue-icon-saas/src/right-frozen/index.ts b/packages/vue-icon-saas/src/right-frozen/index.ts
new file mode 100644
index 000000000..17e892b3f
--- /dev/null
+++ b/packages/vue-icon-saas/src/right-frozen/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import RightFrozen from '@opentiny/vue-theme-saas/svgs/right-frozen.svg'
+
+export default svg({ name: 'IconRightFrozen', component: RightFrozen })
diff --git a/packages/vue-icon-saas/src/right-o/index.ts b/packages/vue-icon-saas/src/right-o/index.ts
new file mode 100644
index 000000000..eb629a9d0
--- /dev/null
+++ b/packages/vue-icon-saas/src/right-o/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import RightO from '@opentiny/vue-theme-saas/svgs/right-o.svg'
+
+export default svg({ name: 'IconRightO', component: RightO })
diff --git a/packages/vue-icon-saas/src/right/index.ts b/packages/vue-icon-saas/src/right/index.ts
new file mode 100644
index 000000000..2d86dd490
--- /dev/null
+++ b/packages/vue-icon-saas/src/right/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Right from '@opentiny/vue-theme-saas/svgs/right.svg'
+
+export default svg({ name: 'IconRight', component: Right })
diff --git a/packages/vue-icon-saas/src/rightward/index.ts b/packages/vue-icon-saas/src/rightward/index.ts
new file mode 100644
index 000000000..0c437eb53
--- /dev/null
+++ b/packages/vue-icon-saas/src/rightward/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Rightward from '@opentiny/vue-theme-saas/svgs/rightward.svg'
+
+export default svg({ name: 'IconRightward', component: Rightward })
diff --git a/packages/vue-icon-saas/src/sandwich-collapse/index.ts b/packages/vue-icon-saas/src/sandwich-collapse/index.ts
new file mode 100644
index 000000000..cf2b75b09
--- /dev/null
+++ b/packages/vue-icon-saas/src/sandwich-collapse/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import SandwichCollapse from '@opentiny/vue-theme-saas/svgs/sandwich-collapse.svg'
+
+export default svg({ name: 'IconSandwichCollapse', component: SandwichCollapse })
diff --git a/packages/vue-icon-saas/src/sandwich-expand/index.ts b/packages/vue-icon-saas/src/sandwich-expand/index.ts
new file mode 100644
index 000000000..fffd0a886
--- /dev/null
+++ b/packages/vue-icon-saas/src/sandwich-expand/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import SandwichExpand from '@opentiny/vue-theme-saas/svgs/sandwich-expand.svg'
+
+export default svg({ name: 'IconSandwichExpand', component: SandwichExpand })
diff --git a/packages/vue-icon-saas/src/save/index.ts b/packages/vue-icon-saas/src/save/index.ts
new file mode 100644
index 000000000..6e1a421c0
--- /dev/null
+++ b/packages/vue-icon-saas/src/save/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Save from '@opentiny/vue-theme-saas/svgs/save.svg'
+
+export default svg({ name: 'IconSave', component: Save })
diff --git a/packages/vue-icon-saas/src/scissor/index.ts b/packages/vue-icon-saas/src/scissor/index.ts
new file mode 100644
index 000000000..5ea98dcf4
--- /dev/null
+++ b/packages/vue-icon-saas/src/scissor/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Scissor from '@opentiny/vue-theme-saas/svgs/scissor.svg'
+
+export default svg({ name: 'IconScissor', component: Scissor })
diff --git a/packages/vue-icon-saas/src/search/index.ts b/packages/vue-icon-saas/src/search/index.ts
new file mode 100644
index 000000000..79e96c140
--- /dev/null
+++ b/packages/vue-icon-saas/src/search/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Search from '@opentiny/vue-theme-saas/svgs/search.svg'
+
+export default svg({ name: 'IconSearch', component: Search })
diff --git a/packages/vue-icon-saas/src/select/index.ts b/packages/vue-icon-saas/src/select/index.ts
new file mode 100644
index 000000000..6259bc9ea
--- /dev/null
+++ b/packages/vue-icon-saas/src/select/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Select from '@opentiny/vue-theme-saas/svgs/select.svg'
+
+export default svg({ name: 'IconSelect', component: Select })
diff --git a/packages/vue-icon-saas/src/sent/index.ts b/packages/vue-icon-saas/src/sent/index.ts
new file mode 100644
index 000000000..cb680e120
--- /dev/null
+++ b/packages/vue-icon-saas/src/sent/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Sent from '@opentiny/vue-theme-saas/svgs/sent.svg'
+
+export default svg({ name: 'IconSent', component: Sent })
diff --git a/packages/vue-icon-saas/src/separate/index.ts b/packages/vue-icon-saas/src/separate/index.ts
new file mode 100644
index 000000000..dbb10bd70
--- /dev/null
+++ b/packages/vue-icon-saas/src/separate/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Separate from '@opentiny/vue-theme-saas/svgs/separate.svg'
+
+export default svg({ name: 'IconSeparate', component: Separate })
diff --git a/packages/vue-icon-saas/src/setting/index.ts b/packages/vue-icon-saas/src/setting/index.ts
new file mode 100644
index 000000000..7294031a5
--- /dev/null
+++ b/packages/vue-icon-saas/src/setting/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Setting from '@opentiny/vue-theme-saas/svgs/setting.svg'
+
+export default svg({ name: 'IconSetting', component: Setting })
diff --git a/packages/vue-icon-saas/src/share-arrow/index.ts b/packages/vue-icon-saas/src/share-arrow/index.ts
new file mode 100644
index 000000000..9700bf6fd
--- /dev/null
+++ b/packages/vue-icon-saas/src/share-arrow/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import ShareArrow from '@opentiny/vue-theme-saas/svgs/share-arrow.svg'
+
+export default svg({ name: 'IconShareArrow', component: ShareArrow })
diff --git a/packages/vue-icon-saas/src/share/index.ts b/packages/vue-icon-saas/src/share/index.ts
new file mode 100644
index 000000000..8c44aeabc
--- /dev/null
+++ b/packages/vue-icon-saas/src/share/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Share from '@opentiny/vue-theme-saas/svgs/share.svg'
+
+export default svg({ name: 'IconShare', component: Share })
diff --git a/packages/vue-icon-saas/src/shopping-card/index.ts b/packages/vue-icon-saas/src/shopping-card/index.ts
new file mode 100644
index 000000000..a359496af
--- /dev/null
+++ b/packages/vue-icon-saas/src/shopping-card/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import ShoppingCard from '@opentiny/vue-theme-saas/svgs/shopping-card.svg'
+
+export default svg({ name: 'IconShoppingCard', component: ShoppingCard })
diff --git a/packages/vue-icon-saas/src/smile-o/index.ts b/packages/vue-icon-saas/src/smile-o/index.ts
new file mode 100644
index 000000000..7d582d210
--- /dev/null
+++ b/packages/vue-icon-saas/src/smile-o/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import SmileO from '@opentiny/vue-theme-saas/svgs/smile-o.svg'
+
+export default svg({ name: 'IconSmileO', component: SmileO })
diff --git a/packages/vue-icon-saas/src/smile/index.ts b/packages/vue-icon-saas/src/smile/index.ts
new file mode 100644
index 000000000..929dc5c74
--- /dev/null
+++ b/packages/vue-icon-saas/src/smile/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Smile from '@opentiny/vue-theme-saas/svgs/smile.svg'
+
+export default svg({ name: 'IconSmile', component: Smile })
diff --git a/packages/vue-icon-saas/src/sort-default/index.ts b/packages/vue-icon-saas/src/sort-default/index.ts
new file mode 100644
index 000000000..6ec7baafe
--- /dev/null
+++ b/packages/vue-icon-saas/src/sort-default/index.ts
@@ -0,0 +1,15 @@
+/**
+ * Copyright (c) 2022 - present TinyVue Authors.
+ * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd.
+ *
+ * Use of this source code is governed by an MIT-style license.
+ *
+ * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL,
+ * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR
+ * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
+ *
+ */
+import { svg } from '@opentiny/vue-common'
+import SortDefault from '@opentiny/vue-theme-saas/svgs/sort-default.svg'
+
+export default svg({ name: 'IconSortDefault', component: SortDefault })
diff --git a/packages/vue-icon-saas/src/sort-triangle-ascending/index.ts b/packages/vue-icon-saas/src/sort-triangle-ascending/index.ts
new file mode 100644
index 000000000..e85fac405
--- /dev/null
+++ b/packages/vue-icon-saas/src/sort-triangle-ascending/index.ts
@@ -0,0 +1,15 @@
+/**
+ * Copyright (c) 2022 - present TinyVue Authors.
+ * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd.
+ *
+ * Use of this source code is governed by an MIT-style license.
+ *
+ * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL,
+ * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR
+ * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
+ *
+ */
+import { svg } from '@opentiny/vue-common'
+import SortTriangleAscending from '@opentiny/vue-theme-saas/svgs/sort-triangle-ascending.svg'
+
+export default svg({ name: 'IconSortTriangleAscending', component: SortTriangleAscending })
diff --git a/packages/vue-icon-saas/src/sort-triangle-descending/index.ts b/packages/vue-icon-saas/src/sort-triangle-descending/index.ts
new file mode 100644
index 000000000..5d4a06a0a
--- /dev/null
+++ b/packages/vue-icon-saas/src/sort-triangle-descending/index.ts
@@ -0,0 +1,15 @@
+/**
+ * Copyright (c) 2022 - present TinyVue Authors.
+ * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd.
+ *
+ * Use of this source code is governed by an MIT-style license.
+ *
+ * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL,
+ * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR
+ * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
+ *
+ */
+import { svg } from '@opentiny/vue-common'
+import SortTriangleDescending from '@opentiny/vue-theme-saas/svgs/sort-triangle-descending.svg'
+
+export default svg({ name: 'IconSortTriangleDescending', component: SortTriangleDescending })
diff --git a/packages/vue-icon-saas/src/sort-triangle/index.ts b/packages/vue-icon-saas/src/sort-triangle/index.ts
new file mode 100644
index 000000000..20a2ed3a6
--- /dev/null
+++ b/packages/vue-icon-saas/src/sort-triangle/index.ts
@@ -0,0 +1,15 @@
+/**
+ * Copyright (c) 2022 - present TinyVue Authors.
+ * Copyright (c) 2022 - present Huawei Cloud Computing Technologies Co., Ltd.
+ *
+ * Use of this source code is governed by an MIT-style license.
+ *
+ * THE OPEN SOURCE SOFTWARE IN THIS PRODUCT IS DISTRIBUTED IN THE HOPE THAT IT WILL BE USEFUL,
+ * BUT WITHOUT ANY WARRANTY, WITHOUT EVEN THE IMPLIED WARRANTY OF MERCHANTABILITY OR FITNESS FOR
+ * A PARTICULAR PURPOSE. SEE THE APPLICABLE LICENSES FOR MORE DETAILS.
+ *
+ */
+import { svg } from '@opentiny/vue-common'
+import SortTriangle from '@opentiny/vue-theme-saas/svgs/sort-triangle.svg'
+
+export default svg({ name: 'IconSortTriangle', component: SortTriangle })
diff --git a/packages/vue-icon-saas/src/sort/index.ts b/packages/vue-icon-saas/src/sort/index.ts
new file mode 100644
index 000000000..df7823eaf
--- /dev/null
+++ b/packages/vue-icon-saas/src/sort/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Sort from '@opentiny/vue-theme-saas/svgs/sort.svg'
+
+export default svg({ name: 'IconSort', component: Sort })
diff --git a/packages/vue-icon-saas/src/star-active/index.ts b/packages/vue-icon-saas/src/star-active/index.ts
new file mode 100644
index 000000000..701763109
--- /dev/null
+++ b/packages/vue-icon-saas/src/star-active/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import StarActive from '@opentiny/vue-theme-saas/svgs/star-active.svg'
+
+export default svg({ name: 'IconStarActive', component: StarActive })
diff --git a/packages/vue-icon-saas/src/star-disable/index.ts b/packages/vue-icon-saas/src/star-disable/index.ts
new file mode 100644
index 000000000..98c69adb1
--- /dev/null
+++ b/packages/vue-icon-saas/src/star-disable/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import StarDisable from '@opentiny/vue-theme-saas/svgs/star-disable.svg'
+
+export default svg({ name: 'IconStarDisable', component: StarDisable })
diff --git a/packages/vue-icon-saas/src/star-o/index.ts b/packages/vue-icon-saas/src/star-o/index.ts
new file mode 100644
index 000000000..83538b18f
--- /dev/null
+++ b/packages/vue-icon-saas/src/star-o/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import StarO from '@opentiny/vue-theme-saas/svgs/star-o.svg'
+
+export default svg({ name: 'IconStarO', component: StarO })
diff --git a/packages/vue-icon-saas/src/start-circle/index.ts b/packages/vue-icon-saas/src/start-circle/index.ts
new file mode 100644
index 000000000..a009630d8
--- /dev/null
+++ b/packages/vue-icon-saas/src/start-circle/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import StartCircle from '@opentiny/vue-theme-saas/svgs/start-circle.svg'
+
+export default svg({ name: 'IconStartCircle', component: StartCircle })
diff --git a/packages/vue-icon-saas/src/start/index.ts b/packages/vue-icon-saas/src/start/index.ts
new file mode 100644
index 000000000..47b30dc44
--- /dev/null
+++ b/packages/vue-icon-saas/src/start/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Start from '@opentiny/vue-theme-saas/svgs/start.svg'
+
+export default svg({ name: 'IconStart', component: Start })
diff --git a/packages/vue-icon-saas/src/statistics/index.ts b/packages/vue-icon-saas/src/statistics/index.ts
new file mode 100644
index 000000000..8a6a8d23b
--- /dev/null
+++ b/packages/vue-icon-saas/src/statistics/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Statistics from '@opentiny/vue-theme-saas/svgs/statistics.svg'
+
+export default svg({ name: 'IconStatistics', component: Statistics })
diff --git a/packages/vue-icon-saas/src/stop/index.ts b/packages/vue-icon-saas/src/stop/index.ts
new file mode 100644
index 000000000..6cba8fdb3
--- /dev/null
+++ b/packages/vue-icon-saas/src/stop/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Stop from '@opentiny/vue-theme-saas/svgs/stop.svg'
+
+export default svg({ name: 'IconStop', component: Stop })
diff --git a/packages/vue-icon-saas/src/success/index.ts b/packages/vue-icon-saas/src/success/index.ts
new file mode 100644
index 000000000..907a15768
--- /dev/null
+++ b/packages/vue-icon-saas/src/success/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Success from '@opentiny/vue-theme-saas/svgs/success.svg'
+
+export default svg({ name: 'IconSuccess', component: Success })
diff --git a/packages/vue-icon-saas/src/successful/index.ts b/packages/vue-icon-saas/src/successful/index.ts
new file mode 100644
index 000000000..0aeee9258
--- /dev/null
+++ b/packages/vue-icon-saas/src/successful/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Successful from '@opentiny/vue-theme-saas/svgs/successful.svg'
+
+export default svg({ name: 'IconSuccessful', component: Successful })
diff --git a/packages/vue-icon-saas/src/task-cooperation/index.ts b/packages/vue-icon-saas/src/task-cooperation/index.ts
new file mode 100644
index 000000000..ed5fb0f82
--- /dev/null
+++ b/packages/vue-icon-saas/src/task-cooperation/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import TaskCooperation from '@opentiny/vue-theme-saas/svgs/task-cooperation.svg'
+
+export default svg({ name: 'IconTaskCooperation', component: TaskCooperation })
diff --git a/packages/vue-icon-saas/src/telephone-circle/index.ts b/packages/vue-icon-saas/src/telephone-circle/index.ts
new file mode 100644
index 000000000..f3a3a6a7a
--- /dev/null
+++ b/packages/vue-icon-saas/src/telephone-circle/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import TelephoneCircle from '@opentiny/vue-theme-saas/svgs/telephone-circle.svg'
+
+export default svg({ name: 'IconTelephoneCircle', component: TelephoneCircle })
diff --git a/packages/vue-icon-saas/src/telephone/index.ts b/packages/vue-icon-saas/src/telephone/index.ts
new file mode 100644
index 000000000..7715e8e69
--- /dev/null
+++ b/packages/vue-icon-saas/src/telephone/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Telephone from '@opentiny/vue-theme-saas/svgs/telephone.svg'
+
+export default svg({ name: 'IconTelephone', component: Telephone })
diff --git a/packages/vue-icon-saas/src/text-tab/index.ts b/packages/vue-icon-saas/src/text-tab/index.ts
new file mode 100644
index 000000000..b2d42bc13
--- /dev/null
+++ b/packages/vue-icon-saas/src/text-tab/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import TextTab from '@opentiny/vue-theme-saas/svgs/text-tab.svg'
+
+export default svg({ name: 'IconTextTab', component: TextTab })
diff --git a/packages/vue-icon-saas/src/text-type/index.ts b/packages/vue-icon-saas/src/text-type/index.ts
new file mode 100644
index 000000000..2085ed74e
--- /dev/null
+++ b/packages/vue-icon-saas/src/text-type/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import TextType from '@opentiny/vue-theme-saas/svgs/text-type.svg'
+
+export default svg({ name: 'IconTextType', component: TextType })
diff --git a/packages/vue-icon-saas/src/text/index.ts b/packages/vue-icon-saas/src/text/index.ts
new file mode 100644
index 000000000..280e67df7
--- /dev/null
+++ b/packages/vue-icon-saas/src/text/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Text from '@opentiny/vue-theme-saas/svgs/text.svg'
+
+export default svg({ name: 'IconText', component: Text })
diff --git a/packages/vue-icon-saas/src/time/index.ts b/packages/vue-icon-saas/src/time/index.ts
new file mode 100644
index 000000000..0f423b401
--- /dev/null
+++ b/packages/vue-icon-saas/src/time/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Time from '@opentiny/vue-theme-saas/svgs/time.svg'
+
+export default svg({ name: 'IconTime', component: Time })
diff --git a/packages/vue-icon-saas/src/total/index.ts b/packages/vue-icon-saas/src/total/index.ts
new file mode 100644
index 000000000..9ee0c1b5f
--- /dev/null
+++ b/packages/vue-icon-saas/src/total/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Total from '@opentiny/vue-theme-saas/svgs/total.svg'
+
+export default svg({ name: 'IconTotal', component: Total })
diff --git a/packages/vue-icon-saas/src/triangle-down/index.ts b/packages/vue-icon-saas/src/triangle-down/index.ts
new file mode 100644
index 000000000..f837c76d5
--- /dev/null
+++ b/packages/vue-icon-saas/src/triangle-down/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import TriangleDown from '@opentiny/vue-theme-saas/svgs/triangle-down.svg'
+
+export default svg({ name: 'IconTriangleDown', component: TriangleDown })
diff --git a/packages/vue-icon-saas/src/undelete/index.ts b/packages/vue-icon-saas/src/undelete/index.ts
new file mode 100644
index 000000000..cbc40a047
--- /dev/null
+++ b/packages/vue-icon-saas/src/undelete/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Undelete from '@opentiny/vue-theme-saas/svgs/undelete.svg'
+
+export default svg({ name: 'IconUndelete', component: Undelete })
diff --git a/packages/vue-icon-saas/src/unfilter/index.ts b/packages/vue-icon-saas/src/unfilter/index.ts
new file mode 100644
index 000000000..4ac167bba
--- /dev/null
+++ b/packages/vue-icon-saas/src/unfilter/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Unfilter from '@opentiny/vue-theme-saas/svgs/unfilter.svg'
+
+export default svg({ name: 'IconUnfilter', component: Unfilter })
diff --git a/packages/vue-icon-saas/src/unfreeze/index.ts b/packages/vue-icon-saas/src/unfreeze/index.ts
new file mode 100644
index 000000000..a1ce4a574
--- /dev/null
+++ b/packages/vue-icon-saas/src/unfreeze/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Unfreeze from '@opentiny/vue-theme-saas/svgs/unfreeze.svg'
+
+export default svg({ name: 'IconUnfreeze', component: Unfreeze })
diff --git a/packages/vue-icon-saas/src/unknow/index.ts b/packages/vue-icon-saas/src/unknow/index.ts
new file mode 100644
index 000000000..0fceeb049
--- /dev/null
+++ b/packages/vue-icon-saas/src/unknow/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Unknow from '@opentiny/vue-theme-saas/svgs/unknow.svg'
+
+export default svg({ name: 'IconUnknow', component: Unknow })
diff --git a/packages/vue-icon-saas/src/unlock/index.ts b/packages/vue-icon-saas/src/unlock/index.ts
new file mode 100644
index 000000000..604f0f9b9
--- /dev/null
+++ b/packages/vue-icon-saas/src/unlock/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Unlock from '@opentiny/vue-theme-saas/svgs/unlock.svg'
+
+export default svg({ name: 'IconUnlock', component: Unlock })
diff --git a/packages/vue-icon-saas/src/unsent/index.ts b/packages/vue-icon-saas/src/unsent/index.ts
new file mode 100644
index 000000000..5224eacc3
--- /dev/null
+++ b/packages/vue-icon-saas/src/unsent/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Unsent from '@opentiny/vue-theme-saas/svgs/unsent.svg'
+
+export default svg({ name: 'IconUnsent', component: Unsent })
diff --git a/packages/vue-icon-saas/src/up-o/index.ts b/packages/vue-icon-saas/src/up-o/index.ts
new file mode 100644
index 000000000..e2910983b
--- /dev/null
+++ b/packages/vue-icon-saas/src/up-o/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import UpO from '@opentiny/vue-theme-saas/svgs/up-o.svg'
+
+export default svg({ name: 'IconUpO', component: UpO })
diff --git a/packages/vue-icon-saas/src/up/index.ts b/packages/vue-icon-saas/src/up/index.ts
new file mode 100644
index 000000000..ee86de645
--- /dev/null
+++ b/packages/vue-icon-saas/src/up/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Up from '@opentiny/vue-theme-saas/svgs/up.svg'
+
+export default svg({ name: 'IconUp', component: Up })
diff --git a/packages/vue-icon-saas/src/upload/index.ts b/packages/vue-icon-saas/src/upload/index.ts
new file mode 100644
index 000000000..def6fb717
--- /dev/null
+++ b/packages/vue-icon-saas/src/upload/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Upload from '@opentiny/vue-theme-saas/svgs/upload.svg'
+
+export default svg({ name: 'IconUpload', component: Upload })
diff --git a/packages/vue-icon-saas/src/user/index.ts b/packages/vue-icon-saas/src/user/index.ts
new file mode 100644
index 000000000..e5fece6a4
--- /dev/null
+++ b/packages/vue-icon-saas/src/user/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import User from '@opentiny/vue-theme-saas/svgs/user.svg'
+
+export default svg({ name: 'IconUser', component: User })
diff --git a/packages/vue-icon-saas/src/versiontree/index.ts b/packages/vue-icon-saas/src/versiontree/index.ts
new file mode 100644
index 000000000..aaf4f8a0d
--- /dev/null
+++ b/packages/vue-icon-saas/src/versiontree/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Versiontree from '@opentiny/vue-theme-saas/svgs/versiontree.svg'
+
+export default svg({ name: 'IconVersiontree', component: Versiontree })
diff --git a/packages/vue-icon-saas/src/video-type/index.ts b/packages/vue-icon-saas/src/video-type/index.ts
new file mode 100644
index 000000000..4a32dd0bc
--- /dev/null
+++ b/packages/vue-icon-saas/src/video-type/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import VideoType from '@opentiny/vue-theme-saas/svgs/video-type.svg'
+
+export default svg({ name: 'IconVideoType', component: VideoType })
diff --git a/packages/vue-icon-saas/src/view/index.ts b/packages/vue-icon-saas/src/view/index.ts
new file mode 100644
index 000000000..7b37091b6
--- /dev/null
+++ b/packages/vue-icon-saas/src/view/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import View from '@opentiny/vue-theme-saas/svgs/view.svg'
+
+export default svg({ name: 'IconView', component: View })
diff --git a/packages/vue-icon-saas/src/warning-triangle/index.ts b/packages/vue-icon-saas/src/warning-triangle/index.ts
new file mode 100644
index 000000000..76224cd06
--- /dev/null
+++ b/packages/vue-icon-saas/src/warning-triangle/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import WarningTriangle from '@opentiny/vue-theme-saas/svgs/warning-triangle.svg'
+
+export default svg({ name: 'IconWarningTriangle', component: WarningTriangle })
diff --git a/packages/vue-icon-saas/src/warning/index.ts b/packages/vue-icon-saas/src/warning/index.ts
new file mode 100644
index 000000000..da16d6f77
--- /dev/null
+++ b/packages/vue-icon-saas/src/warning/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Warning from '@opentiny/vue-theme-saas/svgs/warning.svg'
+
+export default svg({ name: 'IconWarning', component: Warning })
diff --git a/packages/vue-icon-saas/src/web-plus/index.ts b/packages/vue-icon-saas/src/web-plus/index.ts
new file mode 100644
index 000000000..4f2a0a7d1
--- /dev/null
+++ b/packages/vue-icon-saas/src/web-plus/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import WebPlus from '@opentiny/vue-theme-saas/svgs/web-plus.svg'
+
+export default svg({ name: 'IconWebPlus', component: WebPlus })
diff --git a/packages/vue-icon-saas/src/word-type/index.ts b/packages/vue-icon-saas/src/word-type/index.ts
new file mode 100644
index 000000000..f864d1f1a
--- /dev/null
+++ b/packages/vue-icon-saas/src/word-type/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import WordType from '@opentiny/vue-theme-saas/svgs/word-type.svg'
+
+export default svg({ name: 'IconWordType', component: WordType })
diff --git a/packages/vue-icon-saas/src/writing/index.ts b/packages/vue-icon-saas/src/writing/index.ts
new file mode 100644
index 000000000..48bc847aa
--- /dev/null
+++ b/packages/vue-icon-saas/src/writing/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Writing from '@opentiny/vue-theme-saas/svgs/writing.svg'
+
+export default svg({ name: 'IconWriting', component: Writing })
diff --git a/packages/vue-icon-saas/src/yes/index.ts b/packages/vue-icon-saas/src/yes/index.ts
new file mode 100644
index 000000000..27691ce85
--- /dev/null
+++ b/packages/vue-icon-saas/src/yes/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import Yes from '@opentiny/vue-theme-saas/svgs/yes.svg'
+
+export default svg({ name: 'IconYes', component: Yes })
diff --git a/packages/vue-icon-saas/src/zip-type/index.ts b/packages/vue-icon-saas/src/zip-type/index.ts
new file mode 100644
index 000000000..b2996c9ed
--- /dev/null
+++ b/packages/vue-icon-saas/src/zip-type/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import ZipType from '@opentiny/vue-theme-saas/svgs/zip-type.svg'
+
+export default svg({ name: 'IconZipType', component: ZipType })
diff --git a/packages/vue-icon-saas/src/zoom-in/index.ts b/packages/vue-icon-saas/src/zoom-in/index.ts
new file mode 100644
index 000000000..366b27056
--- /dev/null
+++ b/packages/vue-icon-saas/src/zoom-in/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import ZoomIn from '@opentiny/vue-theme-saas/svgs/zoom-in.svg'
+
+export default svg({ name: 'IconZoomIn', component: ZoomIn })
diff --git a/packages/vue-icon-saas/src/zoom-out/index.ts b/packages/vue-icon-saas/src/zoom-out/index.ts
new file mode 100644
index 000000000..86f3f43f7
--- /dev/null
+++ b/packages/vue-icon-saas/src/zoom-out/index.ts
@@ -0,0 +1,4 @@
+import { svg } from '@opentiny/vue-common'
+import ZoomOut from '@opentiny/vue-theme-saas/svgs/zoom-out.svg'
+
+export default svg({ name: 'IconZoomOut', component: ZoomOut })
diff --git a/packages/vue-icon/index.ts b/packages/vue-icon/index.ts
index 6b1579132..d2b56574c 100644
--- a/packages/vue-icon/index.ts
+++ b/packages/vue-icon/index.ts
@@ -353,348 +353,687 @@ import IconSortTriangle from './src/sort-triangle'
import IconSortTriangleAscending from './src/sort-triangle-ascending'
import IconSortTriangleDescending from './src/sort-triangle-descending'
-export * from './lowercase'
export {
IconSortTriangle,
+ IconSortTriangle as iconSortTriangle,
IconSortTriangleAscending,
+ IconSortTriangleAscending as iconSortTriangleAscending,
IconSortTriangleDescending,
+ IconSortTriangleDescending as iconSortTriangleDescending,
IconPromptExclamation,
+ IconPromptExclamation as iconPromptExclamation,
IconPrompt,
+ IconPrompt as iconPrompt,
IconExpand,
+ IconExpand as iconExpand,
IconPutAway,
+ IconPutAway as iconPutAway,
IconStretch,
+ IconStretch as iconStretch,
IconAddCircle,
+ IconAddCircle as iconAddCircle,
IconAudio,
+ IconAudio as iconAudio,
IconMic,
+ IconMic as iconMic,
IconExcelType,
+ IconExcelType as iconExcelType,
IconFileType,
+ IconFileType as iconFileType,
IconOtherType,
+ IconOtherType as iconOtherType,
IconPdfType,
+ IconPdfType as iconPdfType,
IconPictureType,
+ IconPictureType as iconPictureType,
IconPptType,
+ IconPptType as iconPptType,
IconTextType,
+ IconTextType as iconTextType,
IconVideoType,
+ IconVideoType as iconVideoType,
IconWordType,
+ IconWordType as iconWordType,
IconZipType,
+ IconZipType as iconZipType,
IconMobileCheckbox,
+ IconMobileCheckbox as iconMobileCheckbox,
IconMobileCheckboxHalf,
+ IconMobileCheckboxHalf as iconMobileCheckboxHalf,
IconMobileCheckboxSelected,
+ IconMobileCheckboxSelected as iconMobileCheckboxSelected,
IconMobileRadio,
+ IconMobileRadio as iconMobileRadio,
IconMobileRadioSelected,
+ IconMobileRadioSelected as iconMobileRadioSelected,
IconAdd,
+ IconAdd as iconAdd,
IconAdministrator,
+ IconAdministrator as iconAdministrator,
IconAlignBaseline,
+ IconAlignBaseline as iconAlignBaseline,
IconAlignCenter,
+ IconAlignCenter as iconAlignCenter,
IconAlignFlexCenter,
+ IconAlignFlexCenter as iconAlignFlexCenter,
IconAlignFlexEnd,
+ IconAlignFlexEnd as iconAlignFlexEnd,
IconAlignFlexStart,
+ IconAlignFlexStart as iconAlignFlexStart,
IconAlignJustify,
+ IconAlignJustify as iconAlignJustify,
IconAlignLeft,
+ IconAlignLeft as iconAlignLeft,
IconAlignRight,
+ IconAlignRight as iconAlignRight,
IconAlignStretch,
+ IconAlignStretch as iconAlignStretch,
IconAngularjs,
+ IconAngularjs as iconAngularjs,
IconApp,
+ IconApp as iconApp,
IconApplication,
+ IconApplication as iconApplication,
IconAreaChart,
+ IconAreaChart as iconAreaChart,
IconArrowBottom,
+ IconArrowBottom as iconArrowBottom,
IconArrowDown,
+ IconArrowDown as iconArrowDown,
IconArrowLeft,
+ IconArrowLeft as iconArrowLeft,
IconArrowRight,
+ IconArrowRight as iconArrowRight,
IconArrowUp,
+ IconArrowUp as iconArrowUp,
IconAscending,
+ IconAscending as iconAscending,
IconAssociation,
+ IconAssociation as iconAssociation,
IconAttachment,
+ IconAttachment as iconAttachment,
IconBarChart,
+ IconBarChart as iconBarChart,
IconBefilter,
+ IconBefilter as iconBefilter,
IconBoat,
+ IconBoat as iconBoat,
IconBoxSolid,
+ IconBoxSolid as iconBoxSolid,
IconBusy,
+ IconBusy as iconBusy,
IconCalculator,
+ IconCalculator as iconCalculator,
IconCalendar,
+ IconCalendar as iconCalendar,
IconCheckOut,
+ IconCheckOut as iconCheckOut,
IconCheck,
+ IconCheck as iconCheck,
IconCheckedLinear,
+ IconCheckedLinear as iconCheckedLinear,
IconCheckedSur,
+ IconCheckedSur as iconCheckedSur,
IconCheckedTrue,
+ IconCheckedTrue as iconCheckedTrue,
IconChevronDown,
+ IconChevronDown as iconChevronDown,
IconChevronLeft,
+ IconChevronLeft as iconChevronLeft,
IconChevronRight,
+ IconChevronRight as iconChevronRight,
IconChevronUp,
+ IconChevronUp as iconChevronUp,
IconClearFilter,
+ IconClearFilter as iconClearFilter,
IconClockWork,
+ IconClockWork as iconClockWork,
IconCloseCircle,
+ IconCloseCircle as iconCloseCircle,
IconCloseSquare,
+ IconCloseSquare as iconCloseSquare,
IconClose,
+ IconClose as iconClose,
IconCloudDownload,
+ IconCloudDownload as iconCloudDownload,
IconCloudUpload,
+ IconCloudUpload as iconCloudUpload,
IconCode,
+ IconCode as iconCode,
IconCoin,
+ IconCoin as iconCoin,
IconColReverse,
+ IconColReverse as iconColReverse,
IconCommission,
+ IconCommission as iconCommission,
IconConmentRefresh,
+ IconConmentRefresh as iconConmentRefresh,
IconCopySolid,
+ IconCopySolid as iconCopySolid,
IconCopy,
+ IconCopy as iconCopy,
IconCrop,
+ IconCrop as iconCrop,
IconCourse,
+ IconCourse as iconCourse,
IconCueL,
+ IconCueL as iconCueL,
IconCustom,
+ IconCustom as iconCustom,
IconCustomerService,
+ IconCustomerService as iconCustomerService,
IconDataSource,
+ IconDataSource as iconDataSource,
IconDefault,
+ IconDefault as iconDefault,
IconDefinedFiltration,
+ IconDefinedFiltration as iconDefinedFiltration,
IconDel,
+ IconDel as iconDel,
IconDeletePage,
+ IconDeletePage as iconDeletePage,
IconDeleted,
+ IconDeleted as iconDeleted,
IconDeltaDownO,
+ IconDeltaDownO as iconDeltaDownO,
IconDeltaDown,
+ IconDeltaDown as iconDeltaDown,
IconDeltaLeftO,
+ IconDeltaLeftO as iconDeltaLeftO,
IconDeltaLeft,
+ IconDeltaLeft as iconDeltaLeft,
IconDeltaRightO,
+ IconDeltaRightO as iconDeltaRightO,
IconDeltaRight,
+ IconDeltaRight as iconDeltaRight,
IconDeltaUpO,
+ IconDeltaUpO as iconDeltaUpO,
IconDeltaUp,
+ IconDeltaUp as iconDeltaUp,
IconDerive,
+ IconDerive as iconDerive,
IconDescending,
+ IconDescending as iconDescending,
IconDesktopView,
+ IconDesktopView as iconDesktopView,
IconDialog,
+ IconDialog as iconDialog,
IconDialog2,
+ IconDialog2 as iconDialog2,
IconDirectionCol,
+ IconDirectionCol as iconDirectionCol,
IconDirectionRow,
+ IconDirectionRow as iconDirectionRow,
IconDotChart,
+ IconDotChart as iconDotChart,
IconDotDownload,
+ IconDotDownload as iconDotDownload,
IconDotIpv4,
+ IconDotIpv4 as iconDotIpv4,
IconDoubleLeft,
+ IconDoubleLeft as iconDoubleLeft,
IconDoubleRight,
+ IconDoubleRight as iconDoubleRight,
IconDownO,
+ IconDownO as iconDownO,
IconDown,
+ IconDown as iconDown,
IconDownWard,
+ IconDownWard as iconDownWard,
IconDownloadCloud,
+ IconDownloadCloud as iconDownloadCloud,
IconDownloadLink,
+ IconDownloadLink as iconDownloadLink,
IconDownload,
+ IconDownload as iconDownload,
IconDraft,
+ IconDraft as iconDraft,
IconEdit,
+ IconEdit as iconEdit,
IconEditorTab,
+ IconEditorTab as iconEditorTab,
IconEllipsis,
+ IconEllipsis as iconEllipsis,
IconEmailAdd,
+ IconEmailAdd as iconEmailAdd,
IconEmailCircle,
+ IconEmailCircle as iconEmailCircle,
IconEnd,
+ IconEnd as iconEnd,
IconError,
+ IconError as iconError,
IconEspaceAuto,
+ IconEspaceAuto as iconEspaceAuto,
IconEspace,
+ IconEspace as iconEspace,
IconExcel,
+ IconExcel as iconExcel,
IconException,
+ IconException as iconException,
IconExclamation,
+ IconExclamation as iconExclamation,
IconExport,
+ IconExport as iconExport,
IconExpressSearch,
+ IconExpressSearch as iconExpressSearch,
IconEyeclose,
+ IconEyeclose as iconEyeclose,
IconEyeopen,
+ IconEyeopen as iconEyeopen,
IconEditorAlignCenter,
+ IconEditorAlignCenter as iconEditorAlignCenter,
IconEditorAlignLeft,
+ IconEditorAlignLeft as iconEditorAlignLeft,
IconEditorAlignRight,
+ IconEditorAlignRight as iconEditorAlignRight,
IconEditorBackground,
+ IconEditorBackground as iconEditorBackground,
IconEditorBold,
+ IconEditorBold as iconEditorBold,
IconEditorCode,
+ IconEditorCode as iconEditorCode,
IconEditorDeleteline,
+ IconEditorDeleteline as iconEditorDeleteline,
IconEditorEraser,
+ IconEditorEraser as iconEditorEraser,
IconEditorItalic,
+ IconEditorItalic as iconEditorItalic,
IconEditorLeftBorder,
+ IconEditorLeftBorder as iconEditorLeftBorder,
IconEditorList,
+ IconEditorList as iconEditorList,
IconEditorListDot,
+ IconEditorListDot as iconEditorListDot,
IconEditorListNum,
+ IconEditorListNum as iconEditorListNum,
IconEditorMenuLeft,
+ IconEditorMenuLeft as iconEditorMenuLeft,
IconEditorMenuRight,
+ IconEditorMenuRight as iconEditorMenuRight,
IconEditorQuote,
+ IconEditorQuote as iconEditorQuote,
IconEditorRedo,
+ IconEditorRedo as iconEditorRedo,
IconEditorRightBorder,
+ IconEditorRightBorder as iconEditorRightBorder,
IconEditorSub,
+ IconEditorSub as iconEditorSub,
IconEditorSubtitle,
+ IconEditorSubtitle as iconEditorSubtitle,
IconEditorSuper,
+ IconEditorSuper as iconEditorSuper,
IconEditorTable,
+ IconEditorTable as iconEditorTable,
IconEditorTextcolor,
+ IconEditorTextcolor as iconEditorTextcolor,
IconEditorTitle,
+ IconEditorTitle as iconEditorTitle,
IconEditorUnderline,
+ IconEditorUnderline as iconEditorUnderline,
IconEditorUndo,
+ IconEditorUndo as iconEditorUndo,
IconEditorVideo,
+ IconEditorVideo as iconEditorVideo,
IconFileCloudupload,
+ IconFileCloudupload as iconFileCloudupload,
IconFileExcel,
+ IconFileExcel as iconFileExcel,
IconFile,
+ IconFile as iconFile,
IconFilesCircle,
+ IconFilesCircle as iconFilesCircle,
IconFiles,
+ IconFiles as iconFiles,
IconFiletext,
+ IconFiletext as iconFiletext,
IconFileupload,
+ IconFileupload as iconFileupload,
IconFiltered,
+ IconFiltered as iconFiltered,
IconFlag,
+ IconFlag as iconFlag,
IconFolderClosed,
+ IconFolderClosed as iconFolderClosed,
IconFolderOpened,
+ IconFolderOpened as iconFolderOpened,
IconFontColor,
+ IconFontColor as iconFontColor,
IconFontFamily,
+ IconFontFamily as iconFontFamily,
IconFontSize,
+ IconFontSize as iconFontSize,
IconFontStyle,
+ IconFontStyle as iconFontStyle,
IconFontWeight,
+ IconFontWeight as iconFontWeight,
IconFreezeLeft,
+ IconFreezeLeft as iconFreezeLeft,
IconFreezeRight,
+ IconFreezeRight as iconFreezeRight,
IconFrownO,
+ IconFrownO as iconFrownO,
IconFrown,
+ IconFrown as iconFrown,
IconFullscreen,
+ IconFullscreen as iconFullscreen,
IconFullscreenLeft,
+ IconFullscreenLeft as iconFullscreenLeft,
IconMinscreenLeft,
+ IconMinscreenLeft as iconMinscreenLeft,
IconGrade,
+ IconGrade as iconGrade,
IconGroupTransfer,
+ IconGroupTransfer as iconGroupTransfer,
IconGroup,
+ IconGroup as iconGroup,
IconHalfchecked,
+ IconHalfchecked as iconHalfchecked,
IconHalfselect,
+ IconHalfselect as iconHalfselect,
IconHeartempty,
+ IconHeartempty as iconHeartempty,
IconHelpCircle,
+ IconHelpCircle as iconHelpCircle,
IconHelpQuery,
+ IconHelpQuery as iconHelpQuery,
IconHelpSolid,
+ IconHelpSolid as iconHelpSolid,
IconHelp,
+ IconHelp as iconHelp,
IconHelpful,
+ IconHelpful as iconHelpful,
IconHideLeft,
+ IconHideLeft as iconHideLeft,
IconHideRight,
+ IconHideRight as iconHideRight,
IconHideTopleft,
+ IconHideTopleft as iconHideTopleft,
IconImport,
+ IconImport as iconImport,
IconInfoCircle,
+ IconInfoCircle as iconInfoCircle,
IconInfoSolid,
+ IconInfoSolid as iconInfoSolid,
IconInfo,
+ IconInfo as iconInfo,
IconInformation,
+ IconInformation as iconInformation,
IconJs,
+ IconJs as iconJs,
IconJusitfyCenter,
+ IconJusitfyCenter as iconJusitfyCenter,
IconJusitfyFlexEnd,
+ IconJusitfyFlexEnd as iconJusitfyFlexEnd,
IconJusitfySpaceAround,
+ IconJusitfySpaceAround as iconJusitfySpaceAround,
IconJusitfySpaceBetween,
+ IconJusitfySpaceBetween as iconJusitfySpaceBetween,
IconJustitfyFlexStart,
+ IconJustitfyFlexStart as iconJustitfyFlexStart,
IconLanguage,
+ IconLanguage as iconLanguage,
IconLeave,
+ IconLeave as iconLeave,
IconLeftFrozen,
+ IconLeftFrozen as iconLeftFrozen,
IconLeftO,
+ IconLeftO as iconLeftO,
IconLeftWard,
+ IconLeftWard as iconLeftWard,
IconLeft,
+ IconLeft as iconLeft,
IconLineChart,
+ IconLineChart as iconLineChart,
IconLineHeight,
+ IconLineHeight as iconLineHeight,
IconLineThrought,
+ IconLineThrought as iconLineThrought,
IconLink,
+ IconLink as iconLink,
IconLoading,
+ IconLoading as iconLoading,
IconLoadingShadow,
+ IconLoadingShadow as iconLoadingShadow,
IconLock,
+ IconLock as iconLock,
IconLeftWardArrow,
+ IconLeftWardArrow as iconLeftWardArrow,
IconMailContent,
+ IconMailContent as iconMailContent,
IconMail,
+ IconMail as iconMail,
IconMale,
+ IconMale as iconMale,
IconMarkOn,
+ IconMarkOn as iconMarkOn,
IconMeh,
+ IconMeh as iconMeh,
IconMessageCircle,
+ IconMessageCircle as iconMessageCircle,
IconMinscreen,
+ IconMinscreen as iconMinscreen,
IconMinusCircle,
+ IconMinusCircle as iconMinusCircle,
IconMinusSquare,
+ IconMinusSquare as iconMinusSquare,
IconMinus,
+ IconMinus as iconMinus,
IconMobileView,
+ IconMobileView as iconMobileView,
IconMobile,
+ IconMobile as iconMobile,
IconMore,
+ IconMore as iconMore,
IconNew,
+ IconNew as iconNew,
IconNoPremission,
+ IconNoPremission as iconNoPremission,
IconNodeOpen,
+ IconNodeOpen as iconNodeOpen,
IconNode,
+ IconNode as iconNode,
IconNodejs,
+ IconNodejs as iconNodejs,
IconNone,
+ IconNone as iconNone,
IconOffLine,
+ IconOffLine as iconOffLine,
IconOnLine,
+ IconOnLine as iconOnLine,
IconOperationfaildL,
+ IconOperationfaildL as iconOperationfaildL,
IconOperationfaild,
+ IconOperationfaild as iconOperationfaild,
IconOuterLink,
+ IconOuterLink as iconOuterLink,
IconPagelink,
+ IconPagelink as iconPagelink,
IconPagerFirst,
+ IconPagerFirst as iconPagerFirst,
IconPagerLast,
+ IconPagerLast as iconPagerLast,
IconPagerNext,
+ IconPagerNext as iconPagerNext,
IconPagerPrev,
+ IconPagerPrev as iconPagerPrev,
IconPanelMax,
+ IconPanelMax as iconPanelMax,
IconPanelMini,
+ IconPanelMini as iconPanelMini,
IconPanelNormal,
+ IconPanelNormal as iconPanelNormal,
IconPauseCircle,
+ IconPauseCircle as iconPauseCircle,
IconPause,
+ IconPause as iconPause,
IconPicture,
+ IconPicture as iconPicture,
IconPieChart,
+ IconPieChart as iconPieChart,
IconPlusCircle,
+ IconPlusCircle as iconPlusCircle,
IconPlusSquare,
+ IconPlusSquare as iconPlusSquare,
IconPlus,
+ IconPlus as iconPlus,
IconPopup,
+ IconPopup as iconPopup,
IconPreChecked,
+ IconPreChecked as iconPreChecked,
IconPrintPreview,
+ IconPrintPreview as iconPrintPreview,
IconPushpin,
+ IconPushpin as iconPushpin,
IconRadio,
+ IconRadio as iconRadio,
IconRadioselected,
+ IconRadioselected as iconRadioselected,
IconReactjs,
+ IconReactjs as iconReactjs,
IconRedo,
+ IconRedo as iconRedo,
IconRefres,
+ IconRefres as iconRefres,
IconRenew,
+ IconRenew as iconRenew,
IconRepeat,
+ IconRepeat as iconRepeat,
IconReplace,
+ IconReplace as iconReplace,
IconReplies,
+ IconReplies as iconReplies,
IconRightFrozen,
+ IconRightFrozen as iconRightFrozen,
IconRightO,
+ IconRightO as iconRightO,
IconRight,
+ IconRight as iconRight,
IconRightward,
+ IconRightward as iconRightward,
IconRowReverse,
+ IconRowReverse as iconRowReverse,
IconSandwichCollapse,
+ IconSandwichCollapse as iconSandwichCollapse,
IconSandwichExpand,
+ IconSandwichExpand as iconSandwichExpand,
IconSave,
+ IconSave as iconSave,
IconScissor,
+ IconScissor as iconScissor,
IconSearch,
+ IconSearch as iconSearch,
IconSelect,
+ IconSelect as iconSelect,
IconSent,
+ IconSent as iconSent,
IconSeparate,
+ IconSeparate as iconSeparate,
IconSetting,
+ IconSetting as iconSetting,
IconShare,
+ IconShare as iconShare,
IconShareArrow,
+ IconShareArrow as iconShareArrow,
IconShoppingCard,
+ IconShoppingCard as iconShoppingCard,
IconSmileO,
+ IconSmileO as iconSmileO,
IconSmile,
+ IconSmile as iconSmile,
IconSortDefault,
+ IconSortDefault as iconSortDefault,
IconSort,
+ IconSort as iconSort,
IconStarActive,
+ IconStarActive as iconStarActive,
IconStarDisable,
+ IconStarDisable as iconStarDisable,
IconStarO,
+ IconStarO as iconStarO,
IconStartCircle,
+ IconStartCircle as iconStartCircle,
IconStart,
+ IconStart as iconStart,
IconStatistics,
+ IconStatistics as iconStatistics,
IconStop,
+ IconStop as iconStop,
IconStreamSolid,
+ IconStreamSolid as iconStreamSolid,
IconSuccess,
+ IconSuccess as iconSuccess,
IconSuccessful,
+ IconSuccessful as iconSuccessful,
IconTabletView,
+ IconTabletView as iconTabletView,
IconTaskCooperation,
+ IconTaskCooperation as iconTaskCooperation,
IconTelephoneCircle,
+ IconTelephoneCircle as iconTelephoneCircle,
IconTelephone,
+ IconTelephone as iconTelephone,
IconTextAlign,
+ IconTextAlign as iconTextAlign,
IconTextDecoration,
+ IconTextDecoration as iconTextDecoration,
IconTextTab,
+ IconTextTab as iconTextTab,
IconText,
+ IconText as iconText,
IconTime,
+ IconTime as iconTime,
IconTotal,
+ IconTotal as iconTotal,
IconTriangleDown,
+ IconTriangleDown as iconTriangleDown,
IconUndelete,
+ IconUndelete as iconUndelete,
IconUnderline,
+ IconUnderline as iconUnderline,
IconUndo,
+ IconUndo as iconUndo,
IconUnfilter,
+ IconUnfilter as iconUnfilter,
IconUnfreeze,
+ IconUnfreeze as iconUnfreeze,
IconUnknow,
+ IconUnknow as iconUnknow,
IconUnknown,
+ IconUnknown as iconUnknown,
IconUnlock,
+ IconUnlock as iconUnlock,
IconUnsent,
+ IconUnsent as iconUnsent,
IconUpO,
+ IconUpO as iconUpO,
IconUp,
+ IconUp as iconUp,
IconUpWard,
+ IconUpWard as iconUpWard,
IconUpload,
+ IconUpload as iconUpload,
IconUser,
+ IconUser as iconUser,
IconVersiontree,
+ IconVersiontree as iconVersiontree,
IconView,
+ IconView as iconView,
IconVuejs,
+ IconVuejs as iconVuejs,
IconWarningTriangle,
+ IconWarningTriangle as iconWarningTriangle,
IconWarning,
+ IconWarning as iconWarning,
IconWebPlus,
+ IconWebPlus as iconWebPlus,
IconWriting,
+ IconWriting as iconWriting,
IconYes,
+ IconYes as iconYes,
IconZoomIn,
- IconZoomOut
+ IconZoomIn as iconZoomIn,
+ IconZoomOut,
+ IconZoomOut as iconZoomOut,
}
export default {
diff --git a/packages/vue-locale/src/lang/en.ts b/packages/vue-locale/src/lang/en.ts
index 78bac1a7d..cfa7f3ba3 100644
--- a/packages/vue-locale/src/lang/en.ts
+++ b/packages/vue-locale/src/lang/en.ts
@@ -16,6 +16,10 @@ export default {
hello: 'Hello {name}',
code: 'en-US',
ui: {
+ buttonMessage: {
+ cancel: 'Cancel',
+ confirm: 'Confirm'
+ },
wizard: {
previousStep: 'LastStep',
nextStep: 'NextStep',
@@ -58,6 +62,9 @@ export default {
cancel: 'Cancel',
confirm: 'OK'
},
+ cell: {
+ placeholder: 'Select'
+ },
cascader: {
noMatch: 'No matching data',
loading: 'Loading',
@@ -135,7 +142,8 @@ export default {
fri: 'Fri'
},
timezone: 'selecting a timezone',
- year: ''
+ year: '',
+ to: 'to'
},
calendar: {
showType: {
@@ -182,7 +190,16 @@ export default {
pcview: 'View the file on the PC',
nodata: 'Get some rest',
create: 'Create',
- provide: 'Provided by the TINY Team DEV'
+ provide: 'Provided by the TINY Team DEV',
+ nodatamf: 'No data',
+ nopermmf: 'No access',
+ weaknetmf: 'Network anomaly',
+ noresult: 'No result',
+ nonews: 'No latest news',
+ pagenoperm: '403:No access',
+ pageweaknet: 'Network anomaly',
+ pagenothing: '404:The page you visited does not exist',
+ pageservererror: '500:Server exception'
},
fileUpload: {
largefile: ' is too large and will be uploaded in segments. Please wait.',
@@ -197,7 +214,39 @@ export default {
previewFile: 'Preview file',
updateFile: 'Update file',
deleteFile: 'Delete file',
- empty: 'is empty!'
+ empty: 'is empty!',
+ kiaScanTip:
+ 'Sorry, unable to download. Please pass the KIA test first to download a file using public network. Current document is being checked by the KIA, Please wait a while then redownload.',
+ fileNameExceeds: 'exceeds 255 characters. Please change the file name.',
+ fileName: 'The file name',
+ calcHash: 'Document is calculating encryption',
+ uploadFile: 'Upload file',
+ downloadAll: 'Download all',
+ onlySupport: 'Only support {type} file',
+ fileNotLessThan: 'The file cannot be less than',
+ fileNotMoreThan: 'The file cannot be more than',
+ notSupport: 'The file in this format cannot be uploaded. Upload the file again.',
+ attachment: 'Attachment'
+ },
+ uploadList: {
+ pictureUploading: 'Picture uploading',
+ uploadFailed: 'Upload failed',
+ uploading: 'Uploading',
+ download: 'Download',
+ reUpload: 'Re-upload',
+ delete: 'Delete',
+ noAttachments: 'No attachments',
+ cancel: 'Cancel',
+ preview: 'Preview',
+ releaseAndUpload: 'Release the mouse and upload the file',
+ dragOrClickImport: 'Drag the file here, or click Import',
+ shoot: 'Shoot',
+ selectFromAlbum: 'Select from album'
+ },
+ upload: {
+ addPicture: 'Add picture',
+ addAudio: 'Add audio',
+ addVideo: 'Add video'
},
grid: {
dataUnchanged: 'Data unchanged!',
@@ -228,7 +277,8 @@ export default {
dargSelf: 'Self dragging is not allowed.',
dargFixed: 'Fixed columns cannot be dragged.',
remoteMethod: '"remoteMethod" needs to be set for remote storage for personalized template management.',
- remoteSelectedMethod: '"remoteSelectedMethod" needs to be set for remote storage for personalized template management.'
+ remoteSelectedMethod:
+ '"remoteSelectedMethod" needs to be set for remote storage for personalized template management.'
},
filter: {
allFilter: 'All',
@@ -253,9 +303,29 @@ export default {
invisible: 'Invisible',
unsorted: 'No sortting',
unfrozen: 'Unfrozen',
- visible: 'Visible'
+ visible: 'Visible',
+ unfreeze: 'Unfrozen',
+ unsort: 'Unsort'
},
+ toolbar: {
+ set: 'Set',
+ selected: 'Selected',
+ freeze: 'Freeze',
+ sort: 'Sort',
+ clear: 'Clear',
+ search: 'Search',
+ all: 'All'
+ },
+ columnSet: 'Column Setting',
+ overwriteSave: 'Overwrite Save',
+ saveAs: 'Save as',
+ saveTemplate: 'Save Template',
+ selectTemplate: 'Select Template',
hideMsg: 'Leave one column to show at least.',
+ maxFreezeNumMsg: 'Maxium number of frozen columns is 6',
+ defaultTemplateName:
+ 'Please enter a name, if not filled in, it will be generated by the system according to time',
+ reserveTemplateName: 'If the name is not filled in, the previous name will be retained',
resetBtn: 'Reset',
saveBtn: 'OK',
tabs: {
@@ -317,7 +387,13 @@ export default {
pageClassifier: '',
pagesize: 'Records/Page',
prev: 'Prev',
- total: 'Total '
+ total: 'Total ',
+ totals: 'Total: ',
+ jump: 'Go to',
+ hundredThousand: '100K+',
+ million: '1M+',
+ tenMillion: '10M+',
+ loadingTotals: 'Loading Totals...'
},
popeditor: {
cancel: 'Cancel',
@@ -388,10 +464,8 @@ export default {
titles: ['List 1', 'List 2']
},
tree: {
- emptyText: 'No data'
- },
- upload: {
- limitUploadFileNumber: 'The maximum number of files to be uploaded has been reached.'
+ emptyText: 'No data',
+ switchText: 'check easily'
},
usercard: {
address: 'Address',
@@ -399,6 +473,7 @@ export default {
department: 'Department',
email: 'email',
employeeId: 'Employee ID',
+ 'employee_id': 'Employee ID',
empno: 'Employee Number',
expand: 'Expand',
fax: 'Fax',
@@ -457,6 +532,7 @@ export default {
font: 'Font',
file: 'File',
betterTable: 'Table',
+ fullscreen: 'Fullscreen',
insertColumnRight: 'Insert Column Right',
insertColumnLeft: 'Insert Column Left',
insertRowUp: 'Insert Row Up',
@@ -467,7 +543,8 @@ export default {
deleteRow: 'Delete Current Row',
deleteTable: 'Delete Table',
colorPicker: 'Background Color',
- placeholder: 'Insert text here...'
+ placeholder: 'Insert text here...',
+ maxLength: 'Text Length exceeds the Limit, max Length config is '
},
steps: {
done: 'Completed',
@@ -487,82 +564,123 @@ export default {
pullRefresh: {
pullingDown: 'Pull down to refresh',
pullingUp: 'Pull up to refresh',
+ pulling: 'Pull down to refresh',
loosing: 'Release to refresh',
success: 'Refresh success',
failed: 'Refresh failed',
noMore: 'There is no more'
+ },
+ currency: {
+ defaultCurrency: 'Default currency',
+ setDefault: 'Set as default'
+ },
+ calendarBar: {
+ week: { 0: 'SUN', 1: 'MON', 2: 'TUE', 3: 'WED', 4: 'THU', 5: 'FRI', 6: 'SAT' },
+ year: 'Year %s',
+ yearMonth: '%m %y',
+ month: {
+ 1: 'January',
+ 2: 'February',
+ 3: 'March',
+ 4: 'April',
+ 5: 'May',
+ 6: 'June',
+ 7: 'July',
+ 8: 'August',
+ 9: 'September',
+ 10: 'October',
+ 11: 'November',
+ 12: 'December'
+ },
+ monthAbbr: {
+ 1: 'Jan',
+ 2: 'Feb',
+ 3: 'Mar',
+ 4: 'Apr',
+ 5: 'May',
+ 6: 'Jun',
+ 7: 'Jul',
+ 8: 'Aug',
+ 9: 'Sept',
+ 10: 'Oct',
+ 11: 'Nov',
+ 12: 'Dec'
+ }
+ },
+ selectedBox: {
+ select: 'Selected (%s)',
+ allSelect: 'All selected (%s)',
+ clear: 'Clear'
+ },
+ record: {
+ record: 'Record',
+ cancel: 'Cancel',
+ confirm: 'Confirm',
+ clickToStartRecording: 'Click to start recording',
+ clickToResumeRecording: 'Click to resume recording'
+ },
+ dialogSelect: {
+ treeSearch: 'Enter a keyword and press Enter'
}
},
validation: {
array: {
- len: '%s must be exactly %s in length',
- min: '%s cannot be less than %s in length',
- max: '%s cannot be greater than %s in length',
- range: '%s must be between %s and %s in length'
+ len: 'must be exactly %s in length',
+ min: 'cannot be less than %s in length',
+ max: 'cannot be greater than %s in length',
+ range: 'must be between %s and %s in length'
},
date: {
- format: '%s date %s is invalid for format %s',
- invalid: '%s date %s is invalid',
- parse: '%s date could not be parsed, %s is invalid '
+ format: 'date %s is invalid for format %s',
+ invalid: 'date %s is invalid',
+ parse: 'date could not be parsed, %s is invalid '
},
default: 'Validation error on field %s',
- enum: '%s must be one of %s',
+ enum: 'must be one of %s',
number: {
- len: '%s must equal %s',
- min: '%s cannot be less than %s',
- max: '%s cannot be greater than %s',
- range: '%s must be between %s and %s'
+ len: 'must equal %s',
+ min: 'cannot be less than %s',
+ max: 'cannot be greater than %s',
+ range: 'must be between %s and %s'
},
pattern: {
- mismatch: '%s value %s does not match pattern %s'
+ mismatch: 'value %s does not match pattern %s'
},
- required: '%s is required',
+ required: 'required',
string: {
- len: '%s must be exactly %s characters',
- min: '%s must be at least %s characters',
- max: '%s cannot be longer than %s characters',
- range: '%s must be between %s and %s characters'
+ len: 'must be exactly %s characters',
+ min: 'must be at least %s characters',
+ max: 'cannot be longer than %s characters',
+ range: 'must be between %s and %s characters'
},
types: {
- acceptFile: '%s is not a valid %s',
- acceptImg: '%s is not a valid %s',
- array: '%s is not an %s',
- boolean: '%s is not a %s',
- date: '%s is not a %s',
- dateTime: '%s is not a valid %s',
- dateYM: '%s is not a valid %s',
- dateYMD: '%s is not a valid %s',
- digits: '%s is not a valid %s',
- email: '%s is not a valid %s',
- fileSize: '%s is not a valid %s',
- float: '%s is not a %s',
- hex: '%s is not a valid %s',
- integer: '%s is not an %s',
- longDateTime: '%s is not a valid %s',
- method: '%s is not a %s (function)',
- number: '%s is not a %s',
- object: '%s is not an %s',
- regexp: '%s is not a valid %s',
- specialch: '%s is not a valid %s',
- specialch2: '%s is not a valid %s',
- speczh: '%s is not a valid %s',
- string: '%s is not a %s',
- time: '%s is not a valid %s',
- url: '%s is not a valid %s',
- version: '%s is not a valid %s'
+ acceptFile: 'not a valid %s',
+ acceptImg: 'not a valid %s',
+ array: 'not an %s',
+ boolean: 'not a %s',
+ date: 'not a %s',
+ dateTime: 'not a valid %s',
+ dateYM: 'not a valid %s',
+ dateYMD: 'not a valid %s',
+ digits: 'not a valid %s',
+ email: 'not a valid %s',
+ fileSize: 'not a valid %s',
+ float: 'not a %s',
+ hex: 'not a valid %s',
+ integer: 'not an %s',
+ longDateTime: 'not a valid %s',
+ method: 'not a %s (function)',
+ number: 'not a %s',
+ object: 'not an %s',
+ regexp: 'not a valid %s',
+ specialch: 'not a valid %s',
+ specialch2: 'not a valid %s',
+ speczh: 'not a valid %s',
+ string: 'not a %s',
+ time: 'not a valid %s',
+ url: 'not a valid %s',
+ version: 'not a valid %s'
},
- whitespace: '%s cannot be empty'
- },
- vueplus: {
- beingMaintained: {
- label: 'The selected service is in maintenance state in {city}.',
- maintainedTime: 'Maintenance time:',
- description: 'Maintenance time cannot manage resources, which brings inconvenience to you. ',
- changeTo: 'Please switch to'
- },
- beta: {
- moreText: 'Learn More',
- applyText: 'Apply Now'
- }
+ whitespace: 'cannot be empty'
}
-}
+} as any
diff --git a/packages/vue-locale/src/lang/zh-CN.ts b/packages/vue-locale/src/lang/zh-CN.ts
index bedeee9ed..6cfd400fe 100644
--- a/packages/vue-locale/src/lang/zh-CN.ts
+++ b/packages/vue-locale/src/lang/zh-CN.ts
@@ -16,6 +16,10 @@ export default {
hello: '你好 {name}',
code: 'zh-CN',
ui: {
+ buttonMessage: {
+ cancel: '取消',
+ confirm: '确定'
+ },
wizard: {
previousStep: '上一步',
nextStep: '下一步',
@@ -58,6 +62,9 @@ export default {
cancel: '取消',
confirm: '确认'
},
+ cell: {
+ placeholder: '请选择'
+ },
cascader: {
noMatch: '无匹配数据',
loading: '加载中',
@@ -135,7 +142,8 @@ export default {
sat: '六'
},
timezone: '选择时区',
- year: '年'
+ year: '年',
+ to: '至'
},
calendar: {
showType: {
@@ -182,12 +190,22 @@ export default {
pcview: '请到PC上查看文件',
nodata: '休息一下',
create: '创建',
- provide: 'TINY 开发团队提供'
+ provide: 'TINY 开发团队提供',
+ nodatamf: '暂无数据',
+ nopermmf: '无访问权限',
+ weaknetmf: '网络异常',
+ noresult: '无相关搜索结果',
+ nonews: '暂无最新消息',
+ pagenoperm: '403:无访问权限',
+ pageweaknet: '网络异常',
+ pagenothing: '404:你访问的页面不存在',
+ pageservererror: '500:服务器异常'
},
fileUpload: {
largefile: '文件过大，将会分片上传，请耐心等待!',
folder: '文件所在文件夹层数已超过 5 层，将不会上传该文件',
init: '服务报错，请重试',
+ token: '请先进行 EDM 鉴权，获取 token',
exceed: '文件超过最大限制',
largeFile: '文件大小超出限制 2G ！',
fileSize: '{name}大小不能小于 ',
@@ -196,7 +214,38 @@ export default {
previewFile: '预览文件',
updateFile: '更新文件',
deleteFile: '删除文件',
- empty: '是空文件！'
+ empty: '是空文件！',
+ kiaScanTip: '抱歉，从公网接入下载文档，需要通过KIA检测；当前文档正在KIA检测中，请稍后几分钟后再下载！',
+ fileNameExceeds: '超过255个字符，请修改文件名。',
+ fileName: '该文件名',
+ calcHash: '文档正在计算加密中',
+ uploadFile: '文件上传',
+ downloadAll: '全部下载',
+ onlySupport: '仅支持{type}格式文件',
+ fileNotLessThan: '文件不能小于',
+ fileNotMoreThan: '文件不能超过',
+ notSupport: '不支持上传该格式的文件，请重新上传',
+ attachment: '附件'
+ },
+ uploadList: {
+ pictureUploading: '图片上传中',
+ uploadFailed: '上传失败',
+ uploading: '上传中',
+ download: '下载',
+ reUpload: '重新上传',
+ delete: '删除',
+ noAttachments: '暂无附件',
+ cancel: '取消',
+ preview: '预览',
+ releaseAndUpload: '释放鼠标，上传文件',
+ dragOrClickImport: '将文件拖到此处，或点击导入',
+ shoot: '拍摄',
+ selectFromAlbum: '从相册选择'
+ },
+ upload: {
+ addPicture: '添加图片',
+ addAudio: '添加音频',
+ addVideo: '添加视频'
},
grid: {
dataUnchanged: '数据未改动！',
@@ -252,9 +301,28 @@ export default {
unsorted: '未排序',
frozenLeft: '左冻结',
frozenRight: '右冻结',
- unfrozen: '未冻结'
+ unfrozen: '未冻结',
+ unfreeze: '取消冻结',
+ unsort: '取消排序'
},
+ toolbar: {
+ set: '设置',
+ selected: '已选',
+ freeze: '冻结',
+ sort: '排序',
+ clear: '清空',
+ search: '搜索',
+ all: '全选'
+ },
+ columnSet: '列设置',
+ overwriteSave: '覆盖保存',
+ saveAs: '另存为',
+ saveTemplate: '存模板',
+ selectTemplate: '选择模板',
hideMsg: '至少保留一列显示',
+ maxFreezeNumMsg: '冻结列不可超过6项',
+ defaultTemplateName: '请输入名称，如未填写由系统按时间生成',
+ reserveTemplateName: '如未填写名称将保留之前的名称',
resetBtn: '重置',
saveBtn: '确定',
tabs: {
@@ -316,7 +384,13 @@ export default {
pageClassifier: '页',
pagesize: '条/页',
prev: '上一页',
- total: '总条数'
+ total: '总条数',
+ totals: '总计：',
+ jump: '跳至',
+ hundredThousand: '10万+',
+ million: '100万+',
+ tenMillion: '1千万+',
+ loadingTotals: '加载总条数…'
},
popeditor: {
cancel: '取 消',
@@ -360,7 +434,7 @@ export default {
select: {
loading: '加载中',
noMatch: '无匹配数据',
- noData: '无数据',
+ noData: '暂无相关数据',
placeholder: '请选择'
},
search: {
@@ -387,10 +461,8 @@ export default {
titles: ['列表 1', '列表 2']
},
tree: {
- emptyText: '暂无数据'
- },
- upload: {
- limitUploadFileNumber: '已达到最大上传文件数'
+ emptyText: '暂无数据',
+ switchText: '同时勾选下级'
},
usercard: {
address: '地址',
@@ -398,6 +470,8 @@ export default {
department: '部门',
email: '邮箱',
employeeId: '员工 ID',
+ 'employee_id': '员工 ID',
+ empno: '工号',
expand: '展开',
fax: '传真',
internal: '内线',
@@ -455,6 +529,7 @@ export default {
font: '字体',
file: '文件',
betterTable: '表格',
+ fullscreen: '全屏',
insertColumnRight: '右插入列',
insertColumnLeft: '左插入列',
insertRowUp: '上插入行',
@@ -465,7 +540,8 @@ export default {
deleteRow: '删除当前行',
deleteTable: '删除表格',
colorPicker: '背景颜色',
- placeholder: '在此处插入文本...'
+ placeholder: '在此处插入文本...',
+ maxLength: '文本长度超过限制，支持的最大长度是 '
},
steps: {
done: '已完成',
@@ -485,10 +561,63 @@ export default {
pullRefresh: {
pullingDown: '下拉即可刷新',
pullingUp: '上拉即可刷新',
+ pulling: '下拉即可刷新',
loosing: '释放即可刷新',
success: '刷新成功',
failed: '刷新失败',
noMore: '没有更多了'
+ },
+ currency: {
+ defaultCurrency: '默认币种',
+ setDefault: '设为默认'
+ },
+ calendarBar: {
+ week: { 0: '日', 1: '一', 2: '二', 3: '三', 4: '四', 5: '五', 6: '六' },
+ year: '%s年',
+ yearMonth: '%y年%m月',
+ month: {
+ 1: '1月',
+ 2: '2月',
+ 3: '3月',
+ 4: '4月',
+ 5: '5月',
+ 6: '6月',
+ 7: '7月',
+ 8: '8月',
+ 9: '9月',
+ 10: '10月',
+ 11: '11月',
+ 12: '12月'
+ },
+ monthAbbr: {
+ 1: '1',
+ 2: '2',
+ 3: '3',
+ 4: '4',
+ 5: '5',
+ 6: '6',
+ 7: '7',
+ 8: '8',
+ 9: '9',
+ 10: '10',
+ 11: '11',
+ 12: '12'
+ }
+ },
+ selectedBox: {
+ select: '已选（%s）',
+ allSelect: '已全选（%s）',
+ clear: '清空'
+ },
+ record: {
+ record: '录音',
+ cancel: '取消',
+ confirm: '确定',
+ clickToStartRecording: '点击开始录音',
+ clickToResumeRecording: '点击继续录音'
+ },
+ dialogSelect: {
+ treeSearch: '请输入关键字并回车'
}
},
validation: {
@@ -550,17 +679,5 @@ export default {
version: '非法版本格式'
},
whitespace: '%s 不能为空'
- },
- vueplus: {
- beingMaintained: {
- label: '所选服务在{city}处于维护状态。',
- maintainedTime: '维护时间：',
- description: '维护时间无法管理资源，给你带来不便，还请谅解！',
- changeTo: '请切换至'
- },
- beta: {
- moreText: '了解更多',
- applyText: '立即申请'
- }
}
-}
+} as any
diff --git a/packages/vue/src/action-menu/package.json b/packages/vue/src/action-menu/package.json
index 14ad5e904..9f3e02316 100644
--- a/packages/vue/src/action-menu/package.json
+++ b/packages/vue/src/action-menu/package.json
@@ -4,6 +4,7 @@
"description": "",
"main": "lib/index.js",
"module": "index.ts",
+ "sideEffects": false,
"devDependencies": {
"@opentiny-internal/vue-test-utils": "workspace:*",
"vitest": "^0.31.0"
diff --git a/packages/vue/src/action-sheet/package.json b/packages/vue/src/action-sheet/package.json
index 6f53bd7d3..77fe9fd64 100644
--- a/packages/vue/src/action-sheet/package.json
+++ b/packages/vue/src/action-sheet/package.json
@@ -4,6 +4,7 @@
"description": "",
"main": "lib/index.js",
"module": "index.ts",
+ "sideEffects": false,
"devDependencies": {
"@opentiny-internal/vue-test-utils": "workspace:*",
"vitest": "^0.31.0"
diff --git a/packages/vue/src/alert/__tests__/alert.test.tsx b/packages/vue/src/alert/__tests__/alert.test.tsx
index e5c2884d8..81262273e 100644
--- a/packages/vue/src/alert/__tests__/alert.test.tsx
+++ b/packages/vue/src/alert/__tests__/alert.test.tsx
@@ -7,32 +7,32 @@ describe('PC Mode', () => {
const mount = mountPcMode
test('render test & type & size', async () => {
- const TEXT = 'Winter is coming'
- const wrapper = mount(() => TEXT
+ title: () => text
}}
description="type 为 success"
/>
))
- expect(wrapper.find('.tiny-alert__title').text()).toEqual(TEXT)
+ expect(wrapper.find('.tiny-alert__title').text()).toEqual(text)
})
})
diff --git a/packages/vue/src/alert/package.json b/packages/vue/src/alert/package.json
index 102211a20..6a54003df 100644
--- a/packages/vue/src/alert/package.json
+++ b/packages/vue/src/alert/package.json
@@ -4,6 +4,7 @@
"description": "",
"main": "lib/index.js",
"module": "index.ts",
+ "sideEffects": false,
"devDependencies": {
"@opentiny-internal/vue-test-utils": "workspace:*",
"vitest": "^0.31.0"
diff --git a/packages/vue/src/amount/package.json b/packages/vue/src/amount/package.json
index e689a4950..ac178df25 100644
--- a/packages/vue/src/amount/package.json
+++ b/packages/vue/src/amount/package.json
@@ -4,6 +4,7 @@
"description": "",
"main": "lib/index.js",
"module": "index.ts",
+ "sideEffects": false,
"devDependencies": {
"@opentiny-internal/vue-test-utils": "workspace:*",
"vitest": "^0.31.0"
diff --git a/packages/vue/src/anchor/package.json b/packages/vue/src/anchor/package.json
index a5096d2f1..f5ee3cd9a 100644
--- a/packages/vue/src/anchor/package.json
+++ b/packages/vue/src/anchor/package.json
@@ -1,16 +1,20 @@
{
- "name": "@opentiny/vue-anchor",
- "version": "3.7.0",
- "description": "",
- "main": "lib/index.js",
- "scripts": {
- "build": "pnpm -w build:ui $npm_package_name",
- "//postversion": "pnpm build"
- },
- "dependencies": {
- "@opentiny/vue-renderless": "workspace:~",
- "@opentiny/vue-common": "workspace:~"
- },
- "license": "MIT"
- }
-
\ No newline at end of file
+ "name": "@opentiny/vue-anchor",
+ "version": "3.7.0",
+ "description": "",
+ "main": "lib/index.js",
+ "sideEffects": false,
+ "devDependencies": {
+ "@opentiny-internal/vue-test-utils": "workspace:*",
+ "vitest": "^0.31.0"
+ },
+ "scripts": {
+ "build": "pnpm -w build:ui $npm_package_name",
+ "//postversion": "pnpm build"
+ },
+ "dependencies": {
+ "@opentiny/vue-renderless": "workspace:~",
+ "@opentiny/vue-common": "workspace:~"
+ },
+ "license": "MIT"
+}
diff --git a/packages/vue/src/area/package.json b/packages/vue/src/area/package.json
index 2515500aa..dfbe49ced 100644
--- a/packages/vue/src/area/package.json
+++ b/packages/vue/src/area/package.json
@@ -4,6 +4,7 @@
"description": "",
"main": "lib/index.js",
"module": "index.ts",
+ "sideEffects": false,
"devDependencies": {
"@opentiny-internal/vue-test-utils": "workspace:*",
"vitest": "^0.31.0"
diff --git a/packages/vue/src/autocomplete/__tests__/autocomplete.test.tsx b/packages/vue/src/autocomplete/__tests__/autocomplete.test.tsx
new file mode 100644
index 000000000..b865fc712
--- /dev/null
+++ b/packages/vue/src/autocomplete/__tests__/autocomplete.test.tsx
@@ -0,0 +1,69 @@
+import { mountPcMode } from '@opentiny-internal/vue-test-utils'
+import { describe, expect, test,vi } from 'vitest'
+import Autocomplete from '@opentiny/vue-autocomplete'
+import { nextTick } from 'vue'
+
+const loadAll = [
+ {
+ value: 'GFD科技YX公司',
+ address: '福州'
+ },
+ {
+ value: 'WWWW科技YX公司',
+ address: '深圳福田区'
+ },
+ {
+ value: 'RFV有限责任公司',
+ address: '中山市'
+ }
+]
+
+const querySearch = (queryString, cb) => {
+ const restaurants = loadAll
+ let results = queryString ? restaurants.filter(this.createFilter(queryString)) : restaurants
+ cb(results)
+}
+
+const createFilter = (queryString) => (restaurant) => restaurant.value.toLowerCase().indexOf(queryString.toLowerCase()) === 0
+
+describe('PC Mode', () => {
+ const mount = mountPcMode
+
+ test('size', async () => {
+ const value = 'GFD科技'
+ const text = '请输入内容'
+ const medium = 'medium'
+ const wrapper = mount(() =>
+
+ )
+ expect(wrapper.find('.tiny-input-medium').exists()).toBe(true)
+
+ })
+
+ test('events', async () => {
+ const value = ''
+ const keys = 'name'
+ const handleSelect = vi.fn()
+ const wrapper = mount(() =>
+
+ )
+ await nextTick()
+ const target = wrapper.getComponent(Autocomplete).vm
+ await nextTick()
+ target.handleKeyEnter()
+ expect(handleSelect).toHaveBeenCalled()
+ })
+
+ test('slot', async () => {
+ const value = ''
+ const text = '请输入内容'
+ const wrapper = mount(() => 前置内容
,
+ append: () => 后置内容
+ }}>
+
+ )
+ expect(wrapper.find('.tiny-input-group__prepend').exists()).toBe(true)
+ expect(wrapper.find('.tiny-input-group__append').exists()).toBe(true)
+ })
+})
diff --git a/packages/vue/src/autocomplete/package.json b/packages/vue/src/autocomplete/package.json
index 1b6abe913..149aade2f 100644
--- a/packages/vue/src/autocomplete/package.json
+++ b/packages/vue/src/autocomplete/package.json
@@ -4,6 +4,7 @@
"description": "",
"main": "lib/index.js",
"module": "index.ts",
+ "sideEffects": false,
"devDependencies": {
"@opentiny-internal/vue-test-utils": "workspace:*",
"vitest": "^0.31.0"
diff --git a/packages/vue/src/avatar/package.json b/packages/vue/src/avatar/package.json
index 05dbf9d97..1a3a426c4 100644
--- a/packages/vue/src/avatar/package.json
+++ b/packages/vue/src/avatar/package.json
@@ -4,6 +4,7 @@
"description": "",
"main": "lib/index.js",
"module": "index.ts",
+ "sideEffects": false,
"devDependencies": {
"@opentiny-internal/vue-test-utils": "workspace:*",
"vitest": "^0.31.0"
diff --git a/packages/vue/src/badge/__tests__/badge.test.tsx b/packages/vue/src/badge/__tests__/badge.test.tsx
new file mode 100644
index 000000000..67590d270
--- /dev/null
+++ b/packages/vue/src/badge/__tests__/badge.test.tsx
@@ -0,0 +1,35 @@
+import { mountPcMode } from '@opentiny-internal/vue-test-utils'
+import { describe, expect, test } from 'vitest'
+import Badge from '@opentiny/vue-badge'
+
+describe('PC Mode', () => {
+ const mount = mountPcMode
+
+ test('type & value', async () => {
+ const num = 2
+ const text = 'danger 类型'
+ const wrapper = mount(() => {text} )
+ expect(wrapper.find('.tiny-badge__content-text').text()).toEqual(String(num))
+ expect(wrapper.find('.tiny-badge').classes()).toContain('tiny-badge--danger')
+ })
+
+ test('max', async () => {
+ const wrapper = mount(() => 小圆点显示 )
+ expect(wrapper.find('.tiny-badge__content-text').text()).toEqual('2+')
+ })
+
+ test('is-dot', async () => {
+ const wrapper = mount(() => 小圆点显示 )
+ expect(wrapper.find('.tiny-badge').classes()).toContain('tiny-badge--default')
+ })
+
+ test('slot', async () => {
+ const wrapper = mount(() => 自定义
+ }}
+ >自定义内容插槽 )
+ expect(wrapper.find('.badge__content').text()).toEqual('自定义')
+ })
+})
diff --git a/packages/vue/src/badge/package.json b/packages/vue/src/badge/package.json
index 2c9e8bdc5..371cad7c9 100644
--- a/packages/vue/src/badge/package.json
+++ b/packages/vue/src/badge/package.json
@@ -4,6 +4,7 @@
"description": "",
"main": "lib/index.js",
"module": "index.ts",
+ "sideEffects": false,
"devDependencies": {
"@opentiny-internal/vue-test-utils": "workspace:*",
"vitest": "^0.31.0"
diff --git a/packages/vue/src/breadcrumb-item/package.json b/packages/vue/src/breadcrumb-item/package.json
index b653155b8..a18937eb3 100644
--- a/packages/vue/src/breadcrumb-item/package.json
+++ b/packages/vue/src/breadcrumb-item/package.json
@@ -4,6 +4,7 @@
"description": "",
"main": "lib/index.js",
"module": "index.ts",
+ "sideEffects": false,
"devDependencies": {
"@opentiny-internal/vue-test-utils": "workspace:*",
"vitest": "^0.31.0"
diff --git a/packages/vue/src/breadcrumb/package.json b/packages/vue/src/breadcrumb/package.json
index af38eefb6..2b64eb88f 100644
--- a/packages/vue/src/breadcrumb/package.json
+++ b/packages/vue/src/breadcrumb/package.json
@@ -4,6 +4,7 @@
"description": "",
"main": "lib/index.js",
"module": "index.ts",
+ "sideEffects": false,
"devDependencies": {
"@opentiny-internal/vue-test-utils": "workspace:*",
"vitest": "^0.31.0"
diff --git a/packages/vue/src/bulletin-board/package.json b/packages/vue/src/bulletin-board/package.json
index e7a83432e..832f7fec0 100644
--- a/packages/vue/src/bulletin-board/package.json
+++ b/packages/vue/src/bulletin-board/package.json
@@ -4,6 +4,7 @@
"description": "",
"main": "lib/index.js",
"module": "index.ts",
+ "sideEffects": false,
"devDependencies": {
"@opentiny-internal/vue-test-utils": "workspace:*",
"vitest": "^0.31.0"
diff --git a/packages/vue/src/button-group/__tests__/button-group.test.tsx b/packages/vue/src/button-group/__tests__/button-group.test.tsx
new file mode 100644
index 000000000..7e850bd3a
--- /dev/null
+++ b/packages/vue/src/button-group/__tests__/button-group.test.tsx
@@ -0,0 +1,42 @@
+import { mountPcMode } from '@opentiny-internal/vue-test-utils'
+import { describe, expect, test, vi } from 'vitest'
+import ButtonGroup from '@opentiny/vue-button-group'
+import Button from '@opentiny/vue-button'
+
+const groupData = [
+ { text: 'Button1', value: 'Button1' },
+ { text: 'Button2', value: 'Button2' },
+ { text: 'Button3', value: 'Button3' }
+]
+
+describe('PC Mode', () => {
+ const mount = mountPcMode
+
+ test('type & icon', async () => {
+ const wrapper = mount(() => TEST <> {scopeData.data.label}自定义
+ !scopeData.node.isLeaf&& ({scopeData.data.children.length})
+ }}
+ > )
+ expect(wrapper.find('.only-slot').exists()).toBe(true)
+ })
+})
diff --git a/packages/vue/src/cascader-panel/package.json b/packages/vue/src/cascader-panel/package.json
index 5e86ff9e7..731625252 100644
--- a/packages/vue/src/cascader-panel/package.json
+++ b/packages/vue/src/cascader-panel/package.json
@@ -4,6 +4,7 @@
"description": "",
"main": "lib/index.js",
"module": "index.ts",
+ "sideEffects": false,
"devDependencies": {
"@opentiny-internal/vue-test-utils": "workspace:*",
"vitest": "^0.31.0"
diff --git a/packages/vue/src/cascader/__tests__/cascader.test.tsx b/packages/vue/src/cascader/__tests__/cascader.test.tsx
new file mode 100644
index 000000000..bed973a01
--- /dev/null
+++ b/packages/vue/src/cascader/__tests__/cascader.test.tsx
@@ -0,0 +1,122 @@
+import { mountPcMode } from '@opentiny-internal/vue-test-utils'
+import { describe, expect, test, vi } from 'vitest'
+import Cascader from '@opentiny/vue-cascader'
+import { nextTick } from 'vue'
+
+const options = [
+ {
+ value: 'zhinan',
+ label: '指南',
+ children: [
+ {
+ value: 'anzhuang',
+ label: '安装',
+ children: [
+ {
+ value: 'xiangmudengji',
+ label: '项目登记'
+ },
+ {
+ value: 'huanjingzhunbei',
+ label: '环境准备'
+ },
+ {
+ value: 'anzhuangcli',
+ label: '安装 CLI'
+ },
+ {
+ value: 'chuangjianxiangmu',
+ label: '创建项目'
+ }
+ ]
+ },
+ {
+ value: 'kaifa',
+ label: '开发',
+ children: [
+ {
+ value: 'yinruzujian',
+ label: '引入组件'
+ },
+ {
+ value: 'monishuju',
+ label: '模拟数据'
+ }
+ ]
+ }
+ ]
+ },
+ {
+ value: 'zujian',
+ label: '组件',
+ children: [
+ {
+ value: 'basic',
+ label: '框架风格',
+ children: [
+ {
+ value: 'layout',
+ label: 'Layout 布局'
+ },
+ {
+ value: 'color',
+ label: 'Color 色彩'
+ },
+ {
+ value: 'font',
+ label: 'Font 字体'
+ },
+ {
+ value: 'icon',
+ label: 'Icon 图标'
+ }
+ ]
+ }]
+ }]
+
+let value = ['zhinan', 'anzhuang']
+
+describe('PC Mode', () => {
+ const mount = mountPcMode
+
+ test('size', async () => {
+ const separators = '+'
+ const medium = 'medium'
+ const wrapper = mount(() => 没有选项
+ }}
+ > )
+
+ expect(wrapper.find('.tiny-cascader__empty-text').exists()).toBe(true)
+ })
+})
diff --git a/packages/vue/src/cascader/package.json b/packages/vue/src/cascader/package.json
index aad3a2397..a1e3890d5 100644
--- a/packages/vue/src/cascader/package.json
+++ b/packages/vue/src/cascader/package.json
@@ -4,6 +4,7 @@
"description": "",
"main": "lib/index.js",
"module": "index.ts",
+ "sideEffects": false,
"devDependencies": {
"@opentiny-internal/vue-test-utils": "workspace:*",
"vitest": "^0.31.0"
diff --git a/packages/vue/src/chart/autonavi-map/package.json b/packages/vue/src/chart/autonavi-map/package.json
index 726a06941..bcf41ee51 100644
--- a/packages/vue/src/chart/autonavi-map/package.json
+++ b/packages/vue/src/chart/autonavi-map/package.json
@@ -4,7 +4,12 @@
"description": "",
"main": "lib/index.js",
"module": "index.ts",
- "scripts": {
+ "sideEffects": false,
+ "devDependencies": {
+ "@opentiny-internal/vue-test-utils": "workspace:*",
+ "vitest": "^0.31.0"
+ },
+ "scripts": {
"build": "pnpm -w build:ui $npm_package_name",
"//postversion": "pnpm build"
},
diff --git a/packages/vue/src/chart/baidu-map/package.json b/packages/vue/src/chart/baidu-map/package.json
index 6903c9380..927125025 100644
--- a/packages/vue/src/chart/baidu-map/package.json
+++ b/packages/vue/src/chart/baidu-map/package.json
@@ -4,7 +4,12 @@
"description": "",
"main": "lib/index.js",
"module": "index.ts",
- "scripts": {
+ "sideEffects": false,
+ "devDependencies": {
+ "@opentiny-internal/vue-test-utils": "workspace:*",
+ "vitest": "^0.31.0"
+ },
+ "scripts": {
"build": "pnpm -w build:ui $npm_package_name",
"//postversion": "pnpm build"
},
diff --git a/packages/vue/src/chart/chart-bar/package.json b/packages/vue/src/chart/chart-bar/package.json
index 61fbcd1b3..1723271f4 100644
--- a/packages/vue/src/chart/chart-bar/package.json
+++ b/packages/vue/src/chart/chart-bar/package.json
@@ -4,7 +4,12 @@
"description": "",
"main": "lib/index.js",
"module": "index.ts",
- "scripts": {
+ "sideEffects": false,
+ "devDependencies": {
+ "@opentiny-internal/vue-test-utils": "workspace:*",
+ "vitest": "^0.31.0"
+ },
+ "scripts": {
"build": "pnpm -w build:ui $npm_package_name",
"//postversion": "pnpm build"
},
diff --git a/packages/vue/src/chart/chart-boxplot/package.json b/packages/vue/src/chart/chart-boxplot/package.json
index 6ee075586..e03df6f5e 100644
--- a/packages/vue/src/chart/chart-boxplot/package.json
+++ b/packages/vue/src/chart/chart-boxplot/package.json
@@ -4,7 +4,12 @@
"description": "",
"main": "lib/index.js",
"module": "index.ts",
- "scripts": {
+ "sideEffects": false,
+ "devDependencies": {
+ "@opentiny-internal/vue-test-utils": "workspace:*",
+ "vitest": "^0.31.0"
+ },
+ "scripts": {
"build": "pnpm -w build:ui $npm_package_name",
"//postversion": "pnpm build"
},
diff --git a/packages/vue/src/chart/chart-candle/package.json b/packages/vue/src/chart/chart-candle/package.json
index 08a4e893b..9b530a37f 100644
--- a/packages/vue/src/chart/chart-candle/package.json
+++ b/packages/vue/src/chart/chart-candle/package.json
@@ -4,7 +4,12 @@
"description": "",
"main": "lib/index.js",
"module": "index.ts",
- "scripts": {
+ "sideEffects": false,
+ "devDependencies": {
+ "@opentiny-internal/vue-test-utils": "workspace:*",
+ "vitest": "^0.31.0"
+ },
+ "scripts": {
"build": "pnpm -w build:ui $npm_package_name",
"//postversion": "pnpm build"
},
diff --git a/packages/vue/src/chart/chart-core/package.json b/packages/vue/src/chart/chart-core/package.json
index 4fc090c82..b373ad930 100644
--- a/packages/vue/src/chart/chart-core/package.json
+++ b/packages/vue/src/chart/chart-core/package.json
@@ -4,6 +4,11 @@
"description": "",
"main": "lib/index.js",
"module": "index.ts",
+ "sideEffects": false,
+ "devDependencies": {
+ "@opentiny-internal/vue-test-utils": "workspace:*",
+ "vitest": "^0.31.0"
+ },
"scripts": {
"build": "pnpm -w build:ui $npm_package_name",
"//postversion": "pnpm build"
diff --git a/packages/vue/src/chart/chart-funnel/package.json b/packages/vue/src/chart/chart-funnel/package.json
index 09f8326c6..fa5facb8c 100644
--- a/packages/vue/src/chart/chart-funnel/package.json
+++ b/packages/vue/src/chart/chart-funnel/package.json
@@ -4,7 +4,12 @@
"description": "",
"main": "lib/index.js",
"module": "index.ts",
- "scripts": {
+ "sideEffects": false,
+ "devDependencies": {
+ "@opentiny-internal/vue-test-utils": "workspace:*",
+ "vitest": "^0.31.0"
+ },
+ "scripts": {
"build": "pnpm -w build:ui $npm_package_name",
"//postversion": "pnpm build"
},
diff --git a/packages/vue/src/chart/chart-gauge/package.json b/packages/vue/src/chart/chart-gauge/package.json
index c1547ccfa..a93495614 100644
--- a/packages/vue/src/chart/chart-gauge/package.json
+++ b/packages/vue/src/chart/chart-gauge/package.json
@@ -4,7 +4,12 @@
"description": "",
"main": "lib/index.js",
"module": "index.ts",
- "scripts": {
+ "sideEffects": false,
+ "devDependencies": {
+ "@opentiny-internal/vue-test-utils": "workspace:*",
+ "vitest": "^0.31.0"
+ },
+ "scripts": {
"build": "pnpm -w build:ui $npm_package_name",
"//postversion": "pnpm build"
},
diff --git a/packages/vue/src/chart/chart-graph/package.json b/packages/vue/src/chart/chart-graph/package.json
index 7276b63b7..ee07e007f 100644
--- a/packages/vue/src/chart/chart-graph/package.json
+++ b/packages/vue/src/chart/chart-graph/package.json
@@ -4,7 +4,12 @@
"description": "",
"main": "lib/index.js",
"module": "index.ts",
- "scripts": {
+ "sideEffects": false,
+ "devDependencies": {
+ "@opentiny-internal/vue-test-utils": "workspace:*",
+ "vitest": "^0.31.0"
+ },
+ "scripts": {
"build": "pnpm -w build:ui $npm_package_name",
"//postversion": "pnpm build"
},
diff --git a/packages/vue/src/chart/chart-heatmap/package.json b/packages/vue/src/chart/chart-heatmap/package.json
index 901e57252..d2e4bf4b6 100644
--- a/packages/vue/src/chart/chart-heatmap/package.json
+++ b/packages/vue/src/chart/chart-heatmap/package.json
@@ -4,7 +4,12 @@
"description": "",
"main": "lib/index.js",
"module": "index.ts",
- "scripts": {
+ "sideEffects": false,
+ "devDependencies": {
+ "@opentiny-internal/vue-test-utils": "workspace:*",
+ "vitest": "^0.31.0"
+ },
+ "scripts": {
"build": "pnpm -w build:ui $npm_package_name",
"//postversion": "pnpm build"
},
diff --git a/packages/vue/src/chart/chart-histogram/package.json b/packages/vue/src/chart/chart-histogram/package.json
index de2591cb5..04072319a 100644
--- a/packages/vue/src/chart/chart-histogram/package.json
+++ b/packages/vue/src/chart/chart-histogram/package.json
@@ -4,7 +4,12 @@
"description": "",
"main": "lib/index.js",
"module": "index.ts",
- "scripts": {
+ "sideEffects": false,
+ "devDependencies": {
+ "@opentiny-internal/vue-test-utils": "workspace:*",
+ "vitest": "^0.31.0"
+ },
+ "scripts": {
"build": "pnpm -w build:ui $npm_package_name",
"//postversion": "pnpm build"
},
diff --git a/packages/vue/src/chart/chart-line/package.json b/packages/vue/src/chart/chart-line/package.json
index b12bc9fa2..446c2427d 100644
--- a/packages/vue/src/chart/chart-line/package.json
+++ b/packages/vue/src/chart/chart-line/package.json
@@ -4,7 +4,12 @@
"description": "",
"main": "lib/index.js",
"module": "index.ts",
- "scripts": {
+ "sideEffects": false,
+ "devDependencies": {
+ "@opentiny-internal/vue-test-utils": "workspace:*",
+ "vitest": "^0.31.0"
+ },
+ "scripts": {
"build": "pnpm -w build:ui $npm_package_name",
"//postversion": "pnpm build"
},
diff --git a/packages/vue/src/chart/chart-liquidfill/package.json b/packages/vue/src/chart/chart-liquidfill/package.json
index 5b509105b..961ba2715 100644
--- a/packages/vue/src/chart/chart-liquidfill/package.json
+++ b/packages/vue/src/chart/chart-liquidfill/package.json
@@ -4,7 +4,12 @@
"description": "",
"main": "lib/index.js",
"module": "index.ts",
- "scripts": {
+ "sideEffects": false,
+ "devDependencies": {
+ "@opentiny-internal/vue-test-utils": "workspace:*",
+ "vitest": "^0.31.0"
+ },
+ "scripts": {
"build": "pnpm -w build:ui $npm_package_name",
"//postversion": "pnpm build"
},
diff --git a/packages/vue/src/chart/chart-map/package.json b/packages/vue/src/chart/chart-map/package.json
index 0cd8e9712..a8de10adc 100644
--- a/packages/vue/src/chart/chart-map/package.json
+++ b/packages/vue/src/chart/chart-map/package.json
@@ -4,7 +4,12 @@
"description": "",
"main": "lib/index.js",
"module": "index.ts",
- "scripts": {
+ "sideEffects": false,
+ "devDependencies": {
+ "@opentiny-internal/vue-test-utils": "workspace:*",
+ "vitest": "^0.31.0"
+ },
+ "scripts": {
"build": "pnpm -w build:ui $npm_package_name",
"//postversion": "pnpm build"
},
diff --git a/packages/vue/src/chart/chart-pie/package.json b/packages/vue/src/chart/chart-pie/package.json
index 04c0a5e03..1c730b411 100644
--- a/packages/vue/src/chart/chart-pie/package.json
+++ b/packages/vue/src/chart/chart-pie/package.json
@@ -4,7 +4,12 @@
"description": "",
"main": "lib/index.js",
"module": "index.ts",
- "scripts": {
+ "sideEffects": false,
+ "devDependencies": {
+ "@opentiny-internal/vue-test-utils": "workspace:*",
+ "vitest": "^0.31.0"
+ },
+ "scripts": {
"build": "pnpm -w build:ui $npm_package_name",
"//postversion": "pnpm build"
},
diff --git a/packages/vue/src/chart/chart-radar/package.json b/packages/vue/src/chart/chart-radar/package.json
index 643b407a9..cb856c79f 100644
--- a/packages/vue/src/chart/chart-radar/package.json
+++ b/packages/vue/src/chart/chart-radar/package.json
@@ -4,7 +4,12 @@
"description": "",
"main": "lib/index.js",
"module": "index.ts",
- "scripts": {
+ "sideEffects": false,
+ "devDependencies": {
+ "@opentiny-internal/vue-test-utils": "workspace:*",
+ "vitest": "^0.31.0"
+ },
+ "scripts": {
"build": "pnpm -w build:ui $npm_package_name",
"//postversion": "pnpm build"
},
diff --git a/packages/vue/src/chart/chart-ring/package.json b/packages/vue/src/chart/chart-ring/package.json
index 5e936bc0b..2c40cd2bc 100644
--- a/packages/vue/src/chart/chart-ring/package.json
+++ b/packages/vue/src/chart/chart-ring/package.json
@@ -4,7 +4,12 @@
"description": "",
"main": "lib/index.js",
"module": "index.ts",
- "scripts": {
+ "sideEffects": false,
+ "devDependencies": {
+ "@opentiny-internal/vue-test-utils": "workspace:*",
+ "vitest": "^0.31.0"
+ },
+ "scripts": {
"build": "pnpm -w build:ui $npm_package_name",
"//postversion": "pnpm build"
},
diff --git a/packages/vue/src/chart/chart-sankey/package.json b/packages/vue/src/chart/chart-sankey/package.json
index 6e278af11..ba0090022 100644
--- a/packages/vue/src/chart/chart-sankey/package.json
+++ b/packages/vue/src/chart/chart-sankey/package.json
@@ -4,7 +4,12 @@
"description": "",
"main": "lib/index.js",
"module": "index.ts",
- "scripts": {
+ "sideEffects": false,
+ "devDependencies": {
+ "@opentiny-internal/vue-test-utils": "workspace:*",
+ "vitest": "^0.31.0"
+ },
+ "scripts": {
"build": "pnpm -w build:ui $npm_package_name",
"//postversion": "pnpm build"
},
diff --git a/packages/vue/src/chart/chart-scatter/package.json b/packages/vue/src/chart/chart-scatter/package.json
index aa66426b0..1dd9b46ef 100644
--- a/packages/vue/src/chart/chart-scatter/package.json
+++ b/packages/vue/src/chart/chart-scatter/package.json
@@ -4,7 +4,12 @@
"description": "",
"main": "lib/index.js",
"module": "index.ts",
- "scripts": {
+ "sideEffects": false,
+ "devDependencies": {
+ "@opentiny-internal/vue-test-utils": "workspace:*",
+ "vitest": "^0.31.0"
+ },
+ "scripts": {
"build": "pnpm -w build:ui $npm_package_name",
"//postversion": "pnpm build"
},
diff --git a/packages/vue/src/chart/chart-sunburst/package.json b/packages/vue/src/chart/chart-sunburst/package.json
index 3a10b7bd5..72481822a 100644
--- a/packages/vue/src/chart/chart-sunburst/package.json
+++ b/packages/vue/src/chart/chart-sunburst/package.json
@@ -4,7 +4,12 @@
"description": "",
"main": "lib/index.js",
"module": "index.ts",
- "scripts": {
+ "sideEffects": false,
+ "devDependencies": {
+ "@opentiny-internal/vue-test-utils": "workspace:*",
+ "vitest": "^0.31.0"
+ },
+ "scripts": {
"build": "pnpm -w build:ui $npm_package_name",
"//postversion": "pnpm build"
},
diff --git a/packages/vue/src/chart/chart-tree/package.json b/packages/vue/src/chart/chart-tree/package.json
index 2995d9714..9f7a8dce2 100644
--- a/packages/vue/src/chart/chart-tree/package.json
+++ b/packages/vue/src/chart/chart-tree/package.json
@@ -4,7 +4,12 @@
"description": "",
"main": "lib/index.js",
"module": "index.ts",
- "scripts": {
+ "sideEffects": false,
+ "devDependencies": {
+ "@opentiny-internal/vue-test-utils": "workspace:*",
+ "vitest": "^0.31.0"
+ },
+ "scripts": {
"build": "pnpm -w build:ui $npm_package_name",
"//postversion": "pnpm build"
},
diff --git a/packages/vue/src/chart/chart-waterfall/package.json b/packages/vue/src/chart/chart-waterfall/package.json
index afd92608a..eef869c13 100644
--- a/packages/vue/src/chart/chart-waterfall/package.json
+++ b/packages/vue/src/chart/chart-waterfall/package.json
@@ -4,7 +4,12 @@
"description": "",
"main": "lib/index.js",
"module": "index.ts",
- "scripts": {
+ "sideEffects": false,
+ "devDependencies": {
+ "@opentiny-internal/vue-test-utils": "workspace:*",
+ "vitest": "^0.31.0"
+ },
+ "scripts": {
"build": "pnpm -w build:ui $npm_package_name",
"//postversion": "pnpm build"
},
diff --git a/packages/vue/src/chart/chart-wordcloud/package.json b/packages/vue/src/chart/chart-wordcloud/package.json
index 0e23cf7d4..ce119e4bc 100644
--- a/packages/vue/src/chart/chart-wordcloud/package.json
+++ b/packages/vue/src/chart/chart-wordcloud/package.json
@@ -4,7 +4,12 @@
"description": "",
"main": "lib/index.js",
"module": "index.ts",
- "scripts": {
+ "sideEffects": false,
+ "devDependencies": {
+ "@opentiny-internal/vue-test-utils": "workspace:*",
+ "vitest": "^0.31.0"
+ },
+ "scripts": {
"build": "pnpm -w build:ui $npm_package_name",
"//postversion": "pnpm build"
},
diff --git a/packages/vue/src/chart/package.json b/packages/vue/src/chart/package.json
index 4cd12a0af..b11abb63f 100644
--- a/packages/vue/src/chart/package.json
+++ b/packages/vue/src/chart/package.json
@@ -10,6 +10,7 @@
"index.d.ts",
"src"
],
+ "sideEffects": false,
"devDependencies": {
"@opentiny-internal/vue-test-utils": "workspace:*",
"vitest": "^0.31.0"
diff --git a/packages/vue/src/checkbox-button/package.json b/packages/vue/src/checkbox-button/package.json
index 9d766cf30..8f70bc330 100644
--- a/packages/vue/src/checkbox-button/package.json
+++ b/packages/vue/src/checkbox-button/package.json
@@ -4,6 +4,7 @@
"description": "",
"main": "lib/index.js",
"module": "index.ts",
+ "sideEffects": false,
"devDependencies": {
"@opentiny-internal/vue-test-utils": "workspace:*",
"vitest": "^0.31.0"
diff --git a/packages/vue/src/checkbox-group/package.json b/packages/vue/src/checkbox-group/package.json
index 44bffbdeb..e27137fda 100644
--- a/packages/vue/src/checkbox-group/package.json
+++ b/packages/vue/src/checkbox-group/package.json
@@ -4,6 +4,7 @@
"description": "",
"main": "lib/index.js",
"module": "index.ts",
+ "sideEffects": false,
"devDependencies": {
"@opentiny-internal/vue-test-utils": "workspace:*",
"vitest": "^0.31.0"
diff --git a/packages/vue/src/checkbox/__tests__/checkbox.test.tsx b/packages/vue/src/checkbox/__tests__/checkbox.test.tsx
new file mode 100644
index 000000000..6fce79f04
--- /dev/null
+++ b/packages/vue/src/checkbox/__tests__/checkbox.test.tsx
@@ -0,0 +1,29 @@
+import { mountPcMode } from '@opentiny-internal/vue-test-utils'
+import { describe, expect, test, vi } from 'vitest'
+import Checkbox from '@opentiny/vue-checkbox'
+
+let checked = ''
+
+describe('PC Mode', () => {
+ const mount = mountPcMode
+
+ test('size', async () => {
+ const wrapper = mount(() => 复选框1
+ }}
+ > )
+ expect(wrapper.find('.only-slot').exists()).toBe(true)
+ })
+})
diff --git a/packages/vue/src/checkbox/package.json b/packages/vue/src/checkbox/package.json
index e2b970f36..74e0b7584 100644
--- a/packages/vue/src/checkbox/package.json
+++ b/packages/vue/src/checkbox/package.json
@@ -4,6 +4,7 @@
"description": "",
"main": "lib/index.js",
"module": "index.ts",
+ "sideEffects": false,
"devDependencies": {
"@opentiny-internal/vue-test-utils": "workspace:*",
"vitest": "^0.31.0"
diff --git a/packages/vue/src/col/package.json b/packages/vue/src/col/package.json
index b420ee161..e575c49d5 100644
--- a/packages/vue/src/col/package.json
+++ b/packages/vue/src/col/package.json
@@ -4,6 +4,7 @@
"description": "",
"main": "lib/index.js",
"module": "index.ts",
+ "sideEffects": false,
"devDependencies": {
"@opentiny-internal/vue-test-utils": "workspace:*",
"vitest": "^0.31.0"
diff --git a/packages/vue/src/collapse-item/package.json b/packages/vue/src/collapse-item/package.json
index 9fb096aeb..23860b860 100644
--- a/packages/vue/src/collapse-item/package.json
+++ b/packages/vue/src/collapse-item/package.json
@@ -4,6 +4,7 @@
"description": "",
"main": "lib/index.js",
"module": "index.ts",
+ "sideEffects": false,
"devDependencies": {
"@opentiny-internal/vue-test-utils": "workspace:*",
"vitest": "^0.31.0"
diff --git a/packages/vue/src/collapse-transition/package.json b/packages/vue/src/collapse-transition/package.json
index d543ac892..f24127385 100644
--- a/packages/vue/src/collapse-transition/package.json
+++ b/packages/vue/src/collapse-transition/package.json
@@ -4,6 +4,7 @@
"description": "",
"main": "lib/index.js",
"module": "index.ts",
+ "sideEffects": false,
"devDependencies": {
"@opentiny-internal/vue-test-utils": "workspace:*",
"vitest": "^0.31.0"
diff --git a/packages/vue/src/collapse/package.json b/packages/vue/src/collapse/package.json
index e09def069..b1db80897 100644
--- a/packages/vue/src/collapse/package.json
+++ b/packages/vue/src/collapse/package.json
@@ -4,6 +4,7 @@
"description": "",
"main": "lib/index.js",
"module": "index.ts",
+ "sideEffects": false,
"devDependencies": {
"@opentiny-internal/vue-test-utils": "workspace:*",
"vitest": "^0.31.0"
diff --git a/packages/vue/src/column-list-group/package.json b/packages/vue/src/column-list-group/package.json
index 74a8add0e..57c134575 100644
--- a/packages/vue/src/column-list-group/package.json
+++ b/packages/vue/src/column-list-group/package.json
@@ -4,6 +4,11 @@
"description": "",
"main": "lib/index.js",
"module": "index.ts",
+ "sideEffects": false,
+ "devDependencies": {
+ "@opentiny-internal/vue-test-utils": "workspace:*",
+ "vitest": "^0.31.0"
+ },
"dependencies": {
"@opentiny/vue-common": "workspace:~",
"@opentiny/vue-renderless": "workspace:~"
diff --git a/packages/vue/src/column-list-item/package.json b/packages/vue/src/column-list-item/package.json
index 54926f5c4..ca7a7a46f 100644
--- a/packages/vue/src/column-list-item/package.json
+++ b/packages/vue/src/column-list-item/package.json
@@ -5,6 +5,10 @@
"main": "lib/index.js",
"module": "index.ts",
"sideEffects": false,
+ "devDependencies": {
+ "@opentiny-internal/vue-test-utils": "workspace:*",
+ "vitest": "^0.31.0"
+ },
"dependencies": {
"@opentiny/vue-checkbox": "workspace:~",
"@opentiny/vue-common": "workspace:~",
diff --git a/packages/vue/src/company/package.json b/packages/vue/src/company/package.json
index ac4542b42..b6b9e4c03 100644
--- a/packages/vue/src/company/package.json
+++ b/packages/vue/src/company/package.json
@@ -4,6 +4,7 @@
"description": "",
"main": "lib/index.js",
"module": "index.ts",
+ "sideEffects": false,
"devDependencies": {
"@opentiny-internal/vue-test-utils": "workspace:*",
"vitest": "^0.31.0"
diff --git a/packages/vue/src/config-provider/package.json b/packages/vue/src/config-provider/package.json
index f485ebe39..9410a0c1f 100644
--- a/packages/vue/src/config-provider/package.json
+++ b/packages/vue/src/config-provider/package.json
@@ -3,6 +3,7 @@
"version": "3.7.14",
"main": "lib/index.js",
"module": "index.ts",
+ "sideEffects": false,
"devDependencies": {
"@opentiny-internal/vue-test-utils": "workspace:*",
"vitest": "^0.31.0"
diff --git a/packages/vue/src/config-provider/src/index.vue b/packages/vue/src/config-provider/src/index.vue
index 192869e9b..349226e03 100644
--- a/packages/vue/src/config-provider/src/index.vue
+++ b/packages/vue/src/config-provider/src/index.vue
@@ -41,18 +41,20 @@ export default defineComponent({
}
}
},
- ..._props.map((item) => {
- return {
- [item]: {
- type: String
+ ..._props
+ .map((item) => {
+ return {
+ [item]: {
+ type: String
+ }
}
- }
- }).reduce((pre, cur) => {
- return {
- ...pre,
- ...cur
- }
- })
+ })
+ .reduce((pre, cur) => {
+ return {
+ ...pre,
+ ...cur
+ }
+ })
},
setup(props, { slots }) {
const { direction } = hooks.toRefs(props)
@@ -81,21 +83,21 @@ export default defineComponent({
class: this.classNames,
style: this.cssVar
}
+ const slots = isVue2 ? this.$slots?.default : this.slots?.default?.()
if (!this.props.tag.enable) {
- const slots = this.slots?.default?.()
if (isVue2 && (slots?.length ?? 1) > 1) {
return hooks.h('div', {}, slots)
}
return slots
}
const tagName = this.props.tag.name ?? 'div'
- return hooks.h(tagName, attr, this.$slots.default)
+ return hooks.h(tagName, attr, slots)
}
})