From aebd8fa722809cb32b1f8cb0a586086ab3250c30 Mon Sep 17 00:00:00 2001 From: wangyaju Date: Thu, 26 May 2022 14:05:10 +0800 Subject: [PATCH] chore(release): release 13.2.0 (#225) Co-authored-by: huaweidevcloud --- .../src/demo-nav/d-demo-nav.component.html | 12 + .../src/demo-nav/d-demo-nav.component.scss | 49 ++ .../src/demo-nav/d-demo-nav.component.ts | 33 + .../src/demo-nav/d-demo-nav.module.ts | 22 + .../header}/theme-picker/theme-data-more.ts | 0 .../theme-picker/theme-picker-i18n.type.ts | 42 ++ .../header/theme-picker/theme-picker-img.ts | 7 + .../theme-picker/theme-picker.component.html | 89 ++- .../theme-picker/theme-picker.component.scss | 89 ++- .../theme-picker/theme-picker.component.ts | 196 +++++- .../accordion/demo/accordion-demo.moudule.ts | 2 +- devui/alert/demo/alert-demo.module.ts | 2 +- devui/anchor/demo/anchor-demo.module.ts | 2 +- .../animations/demo/animations-demo.module.ts | 2 +- .../auto-complete-popup.component.html | 2 +- .../auto-complete-popup.component.scss | 36 +- .../auto-complete-popup.component.theme.scss | 5 - .../auto-complete-popup.component.ts | 3 +- .../demo/auto-complete-demo.module.ts | 2 +- .../auto-complete-demo-basic.component.html | 1 + .../auto-complete-demo-disable.component.html | 6 +- .../auto-complete-demo-disable.component.ts | 37 +- devui/avatar/demo/avatar-demo.module.ts | 2 +- devui/back-top/demo/back-top-demo.module.ts | 2 +- devui/badge/badge.component.html | 6 +- devui/badge/badge.component.scss | 7 +- devui/badge/demo/badge-demo.module.ts | 2 +- devui/badge/demo/custom/custom.component.html | 2 +- .../breadcrumb-item.component.html | 2 +- .../breadcrumb-item.component.scss | 4 +- devui/breadcrumb/breadcrumb.component.scss | 6 + .../breadcrumb/demo/breadcrumb-demo.module.ts | 2 +- devui/button/button-group.component.scss | 21 + devui/button/button.component.html | 3 +- devui/button/button.component.scss | 105 ++-- devui/button/button.component.ts | 1 + devui/button/demo/button-demo.module.ts | 2 +- .../button/demo/groups/groups.component.html | 43 +- .../button/demo/groups/groups.component.scss | 47 -- devui/button/demo/groups/groups.component.ts | 3 +- devui/button/demo/icon/icon.component.html | 30 +- devui/button/demo/size/size.component.html | 2 +- devui/button/doc/api-cn.md | 1 + devui/button/doc/api-en.md | 1 + devui/card/demo/card-demo.module.ts | 2 +- devui/carousel/carousel-item.component.ts | 11 +- devui/carousel/carousel.component.scss | 6 +- devui/carousel/carousel.component.ts | 6 +- .../carousel-demo-autoplay.component.html | 2 +- .../carousel-demo-autoplay.component.ts | 1 + devui/carousel/demo/carousel-demo.module.ts | 2 +- devui/carousel/doc/api-cn.md | 41 +- devui/carousel/doc/api-en.md | 37 +- devui/cascader/cascader-li.component.scss | 20 +- devui/cascader/cascader.component.scss | 1 + devui/cascader/demo/cascader-demo.module.ts | 2 +- .../category-search.component.html | 232 ++++--- .../category-search.component.scss | 81 +-- .../category-search.component.ts | 91 ++- .../category-search/category-search.module.ts | 1 - .../demo/auto-scroll/auto-scroll.component.ts | 9 +- .../demo/basic/basic.component.ts | 3 +- .../demo/category-search-demo.component.html | 2 +- .../demo/category-search-demo.module.ts | 10 +- devui/checkbox/checkbox-group.component.scss | 2 +- devui/checkbox/checkbox.component.html | 16 +- devui/checkbox/checkbox.component.scss | 8 +- .../demo/basic/checkbox-basic.component.html | 3 +- devui/checkbox/demo/checkbox-demo.module.ts | 8 +- .../group/checkbox-group-basic.component.html | 4 +- .../demo/clipboard/clipboard.component.scss | 2 + devui/common/demo/common-demo.module.ts | 2 +- devui/dashboard/doc/api-en.md | 2 +- .../data-table/data-table-body.component.scss | 6 +- .../data-table/data-table-cell.component.html | 15 +- .../data-table/data-table-head.component.html | 9 + .../data-table/data-table-row.component.html | 4 +- devui/data-table/data-table.component.html | 23 +- devui/data-table/data-table.component.scss | 207 ++++++- devui/data-table/data-table.component.ts | 28 +- devui/data-table/data-table.spec.ts | 2 +- .../data-table-demo-async.component.html | 9 +- .../demo/basic-old/basic-old.component.html | 2 +- .../data-table-demo-basic.component.html | 2 +- .../demo/cell-merge/cell-merge.component.html | 2 +- .../check-options-column.component.html | 2 +- .../check-options.component.html | 2 +- .../check-options/check-options.component.ts | 10 +- .../data-table/demo/data-table-demo.module.ts | 2 +- .../drag-column/drag-column.component.html | 1 + .../demo/drag-row/drag-row.component.html | 2 +- .../editable-old/editable-old.component.html | 1 + .../data-table-demo-editable.component.html | 2 +- .../expand-row-old.component.html | 2 +- .../demo/expand-row/expand-row.component.html | 8 +- .../fix-column-old.component.html | 2 +- .../fix-column-old.component.ts | 15 + .../demo/fix-column/fix-column.component.html | 2 +- .../demo/fix-column/fix-column.component.ts | 27 + .../fix-height-virtual-scroll.component.html | 1 + .../header-grouping.component.html | 2 +- .../interaction-column.component.html | 16 +- .../interaction-column.component.ts | 4 + .../interaction/interaction.component.html | 5 +- .../demo/interaction/interaction.component.ts | 18 +- ...ata-table-demo-lazyloaddata.component.html | 1 + .../data-table-demo-maxheight.component.html | 9 +- ...data-table-demo-multiheader.component.html | 2 +- .../muti-drag-row.component.html | 1 + .../mutil-styles/mutil-styles.component.html | 11 + .../mutil-styles/mutil-styles.component.scss | 1 + .../mutil-styles/mutil-styles.component.ts | 36 +- .../tree-table-old.component.html | 1 + .../demo/tree-table/tree-data.component.html | 1 + .../virtual-scroll.component.html | 1 + devui/data-table/doc/api-cn.md | 6 +- devui/data-table/doc/api-en.md | 6 +- .../table/body/tbody.component.scss | 6 +- .../table/body/td/td.component.html | 14 +- .../head/th/filter/filter.component.html | 3 + .../head/th/filter/filter.component.scss | 22 +- .../table/head/th/filter/filter.component.ts | 18 +- .../table/head/th/sort/sort.component.scss | 28 +- .../table/head/th/sort/sort.component.ts | 8 +- .../table/head/th/th.component.html | 17 +- .../data-table/table/head/th/th.component.ts | 15 + devui/data-table/table/row/tr.component.ts | 26 +- .../tmpl/data-table-column-tmpl.component.ts | 12 + .../datepicker-pro-calendar.component.html | 19 +- .../datepicker-pro-calendar.component.scss | 16 +- .../datepicker-pro-calendar.component.ts | 14 + .../datepicker-pro.component.html | 17 +- .../datepicker-pro.component.scss | 14 +- .../datepicker-pro.component.ts | 7 + .../datepicker-pro/datepicker-pro.service.ts | 4 + .../demo/datepicker-pro-demo.module.ts | 2 +- .../datepicker-host-template.component.html | 6 +- ...datepicker-pro-static-panel.component.html | 9 +- .../datepicker-pro-static-panel.component.ts | 3 + .../datepicker-pro-tab-type.component.html | 2 +- devui/datepicker-pro/doc/api-cn.md | 4 + devui/datepicker-pro/doc/api-en.md | 4 + .../lib/calendar-panel.component.html | 4 +- .../lib/calendar-panel.component.ts | 25 +- .../range-datepicker-pro.component.html | 19 +- .../range-datepicker-pro.component.scss | 16 +- .../range-datepicker-pro.component.ts | 10 + .../datepicker/date-range-picker.directive.ts | 7 +- devui/datepicker/datepicker.directive.ts | 5 +- .../demo/button/button.component.html | 2 +- .../datepicker/demo/datepicker-demo.module.ts | 2 +- .../demo/animation/animation.component.html | 2 +- .../demo/design-animation-demo.module.ts | 2 +- .../border-radius.component.html | 2 +- .../border-radius/border-radius.component.ts | 8 +- .../demo/design-border-radius-demo.module.ts | 2 +- .../color/demo/color/color.component.html | 6 +- .../color/demo/design-color-demo.module.ts | 2 +- .../font/demo/design-font-demo.module.ts | 2 +- .../font/demo/font/font.component.html | 4 +- .../link/demo/design-link-demo.module.ts | 2 +- .../shadow/demo/design-shadow-demo.module.ts | 2 +- .../shadow/demo/shadow/shadow.component.html | 4 +- .../shadow/demo/shadow/shadow.component.ts | 52 +- .../demo/design-z-index-demo.module.ts | 2 +- .../demo/z-index/z-index.component.html | 2 +- devui/dragdrop/demo/dragdrop-demo.module.ts | 2 +- devui/drawer/demo/drawer-demo.module.ts | 2 +- devui/drawer/drawer.component.scss | 7 +- .../demo/add-icon/add-icon.component.scss | 22 - .../demo/add-icon/add-icon.component.ts | 3 +- .../append-to-body.component.html | 2 +- .../append-to-body.component.scss | 4 - .../dropdown/demo/basic/basic.component.html | 54 +- devui/dropdown/demo/basic/basic.component.ts | 2 + .../close-scope/close-scope.component.scss | 4 - .../dropdown/demo/dropdown-demo.component.ts | 1 - devui/dropdown/demo/dropdown-demo.module.ts | 4 +- .../dropdown/demo/focus/focus.component.scss | 2 +- .../dropdown/demo/hover/hover.component.scss | 4 - .../multi-level/multi-level.component.css | 3 +- devui/dropdown/doc/api-cn.md | 2 +- devui/dropdown/doc/api-en.md | 2 +- devui/dropdown/dropdown-menu.directive.ts | 6 + devui/dropdown/dropdown.directive.ts | 46 +- devui/dropdown/dropdown.spec.ts | 38 +- .../demo/editable-select-demo.module.ts | 2 +- devui/form/demo/basic/basic.component.html | 3 +- devui/form/demo/form-demo.module.ts | 2 +- .../label-horizontal.component.html | 2 +- .../demo/modal-one/modal-one.component.html | 2 +- .../demo/multi-col/multi-col.component.html | 2 +- devui/form/form-label.component.html | 11 +- devui/form/form-label.component.scss | 11 +- .../demo/fullscreen-demo.component.html | 1 + .../fullscreen/demo/fullscreen-demo.module.ts | 2 +- .../demo/normal/normal.component.html | 2 +- devui/gantt/demo/basic/basic.component.html | 2 +- devui/gantt/demo/basic/basic.component.ts | 5 +- devui/gantt/demo/gantt-demo.module.ts | 2 +- devui/gantt/demo/table/table.component.html | 4 +- devui/gantt/demo/table/table.component.scss | 6 +- devui/gantt/demo/table/table.component.ts | 5 +- .../gantt-scale/gantt-scale.component.html | 2 +- .../gantt-scale/gantt-scale.component.ts | 3 + .../gantt-tools/gantt-tools.component.html | 6 +- devui/gantt/gantt.model.ts | 1 + devui/i18n/en-us.ts | 6 +- devui/i18n/i18n.model.ts | 4 +- devui/i18n/zh-cn.ts | 6 +- devui/icon/demo/basic/basic.component.html | 39 ++ devui/icon/demo/basic/basic.component.scss | 1 + devui/icon/demo/basic/basic.component.ts | 11 + devui/icon/demo/icon-demo.component.html | 17 + devui/icon/demo/icon-demo.component.ts | 53 ++ devui/icon/demo/icon-demo.module.ts | 39 ++ .../demo/icon-group/icon-group.component.html | 13 + .../demo/icon-group/icon-group.component.scss | 1 + .../demo/icon-group/icon-group.component.ts | 11 + devui/icon/doc/api-cn.md | 28 + devui/icon/doc/api-en.md | 28 + devui/icon/icon-group.component.html | 1 + devui/icon/icon-group.component.scss | 3 + devui/icon/icon-group.component.ts | 8 + devui/icon/icon.component.html | 8 + devui/icon/icon.component.scss | 84 +++ devui/icon/icon.component.ts | 16 + devui/icon/icon.module.ts | 13 + devui/icon/index.ts | 1 + .../{utils/globalConfig => icon}/package.json | 0 devui/icon/public-api.ts | 4 + .../demo/image-preview-demo.module.ts | 2 +- .../demo/input-number-demo.module.ts | 2 +- devui/layout/demo/layout-demo.module.ts | 2 +- devui/loading/demo/loading-demo.module.ts | 2 +- devui/mention/demo/mention-demo.module.ts | 2 +- devui/mention/mention.component.scss | 2 +- devui/mention/mention.directive.ts | 8 +- .../demo/autofocus/autofocus.component.html | 2 +- .../demo/autofocus/autofocus.component.ts | 12 +- .../basic-update/basic-update.component.html | 2 +- .../basic-update/basic-update.component.ts | 3 +- .../demo/basic-update/modal-test.component.ts | 5 +- devui/modal/demo/basic/basic.component.html | 6 +- devui/modal/demo/basic/basic.component.ts | 74 +-- .../demo/basic/modal-test.component.html | 6 - devui/modal/demo/cases/cases.component.html | 2 +- devui/modal/demo/cases/cases.component.ts | 2 +- .../demo/cases/modal-cases.component.html | 9 +- .../modal/demo/cases/modal-cases.component.ts | 6 +- .../demo/customize/customize.component.html | 2 +- .../demo/customize/customize.component.ts | 6 +- .../demo/customize/modal-alert.component.scss | 3 +- .../customize/modal-no-btn.component.scss | 7 +- .../demo/fixed/fixed-wrapper.component.html | 2 +- .../demo/fixed/fixed-wrapper.component.ts | 4 +- .../modal/demo/fixed/modal-test.component.ts | 20 - devui/modal/demo/hide/hide.component.html | 2 +- devui/modal/demo/hide/hide.component.ts | 16 +- .../modal/demo/hide/modal-form.component.html | 6 +- .../modal/demo/hide/modal-form.component.scss | 6 +- devui/modal/demo/modal-demo.component.html | 21 +- devui/modal/demo/modal-demo.component.ts | 62 +- devui/modal/demo/modal-demo.module.ts | 7 +- .../{fixed => }/modal-test.component.html | 2 +- .../demo/{basic => }/modal-test.component.ts | 10 +- .../dialog-content.component.ts | 2 +- .../modal-content/modal-content.component.ts | 6 +- .../demo/template/template.component.html | 4 +- .../modal/demo/template/template.component.ts | 21 +- devui/modal/demo/tips/tips.component.css | 3 - devui/modal/demo/tips/tips.component.html | 8 +- devui/modal/demo/tips/tips.component.ts | 94 +-- .../modal/demo/warning/warning.component.html | 1 - devui/modal/demo/warning/warning.component.ts | 32 - devui/modal/dialog.service.ts | 2 +- devui/modal/doc/api-cn.md | 12 +- devui/modal/doc/api-en.md | 12 +- devui/modal/modal-container.component.html | 2 +- devui/modal/modal-container.component.scss | 6 + devui/modal/modal-footer.component.html | 25 +- devui/modal/modal-header.component.html | 55 +- devui/modal/modal-header.component.scss | 39 +- devui/modal/modal-header.component.ts | 6 +- devui/modal/modal.component.scss | 8 +- devui/modal/modal.module.ts | 6 +- devui/modal/modal.spec.ts | 4 +- devui/modal/modal.types.ts | 2 +- ...ti-auto-complete-demo-array.component.html | 10 +- .../demo/multi-auto-complete-demo.module.ts | 2 +- .../multi-auto-complete.component.html | 25 +- .../multi-auto-complete.component.scss | 29 +- .../multi-auto-complete.component.ts | 8 +- .../multi-auto-complete.module.ts | 8 +- .../multi-auto-complete.spec.ts | 14 +- .../demo/nav-sprite-demo.component.html | 2 +- .../nav-sprite/demo/nav-sprite-demo.module.ts | 2 +- devui/nav-sprite/nav-sprite.component.html | 2 +- devui/nav-sprite/nav-sprite.component.ts | 6 +- devui/package.json | 2 +- .../demo/basic/basic.component.html | 18 - .../pagination/demo/basic/basic.component.ts | 3 +- .../pagination/demo/pagination-demo.module.ts | 6 +- .../demo/widgets/widgets.component.html | 14 +- .../demo/widgets/widgets.component.ts | 2 + devui/pagination/pagination.component.html | 30 +- devui/pagination/pagination.component.scss | 8 +- devui/pagination/pagination.component.ts | 22 +- devui/pagination/pagination.module.ts | 6 +- devui/pagination/pagination.spec.ts | 34 +- devui/panel/demo/panel-demo.module.ts | 2 +- devui/polyfills.ts | 6 - devui/popover/demo/popover-demo.module.ts | 2 +- devui/progress/demo/progress-demo.module.ts | 2 +- devui/progress/progress.component.scss | 2 +- .../demo/quadrant-diagram-demo.module.ts | 2 +- .../quadrant-label.component.html | 2 +- devui/radio/demo/radio-demo.module.ts | 2 +- devui/radio/radio.component.scss | 4 +- .../rate/demo/clear/rate-clear.component.html | 2 + .../rate/demo/clear/rate-clear.component.scss | 3 + devui/rate/demo/clear/rate-clear.component.ts | 17 + devui/rate/demo/rate-demo.component.html | 7 + devui/rate/demo/rate-demo.component.ts | 7 + devui/rate/demo/rate-demo.module.ts | 4 +- devui/rate/doc/api-cn.md | 1 + devui/rate/doc/api-en.md | 1 + devui/rate/rate.component.scss | 4 +- devui/rate/rate.component.ts | 23 +- devui/read-tip/demo/read-tip-demo.module.ts | 2 +- devui/search/demo/search-demo.module.ts | 2 +- devui/search/search.component.html | 28 +- devui/search/search.component.scss | 50 +- .../custom-search/custom-search.component.ts | 114 ++-- devui/select/demo/select-demo.module.ts | 2 +- devui/select/select.component.html | 32 +- devui/select/select.component.scss | 40 +- devui/select/select.component.ts | 19 +- devui/select/select.spec.ts | 11 +- devui/slider/demo/slider-demo.module.ts | 2 +- .../splitter/demo/shrink/shrink.component.ts | 2 - devui/splitter/demo/splitter-demo.module.ts | 2 +- devui/splitter/splitter-pane.component.ts | 20 +- devui/splitter/splitter.service.ts | 6 +- devui/status/demo/status-demo.module.ts | 2 +- .../demo/custom/custom.component.ts | 2 +- .../demo/steps-guide-demo.module.ts | 2 +- devui/steps-guide/steps-guide.directive.ts | 10 +- devui/sticky/demo/sticky-demo.module.ts | 2 +- devui/style/core/_dropdown.scss | 82 ++- devui/style/theme/_basic.scss | 63 +- devui/style/theme/_color.scss | 167 ++--- .../demo/add-delete/add-delete.component.html | 18 + .../demo/add-delete/add-delete.component.ts | 62 ++ devui/tabs/demo/basic/basic.component.css | 4 - devui/tabs/demo/basic/basic.component.html | 4 +- devui/tabs/demo/basic/basic.component.ts | 16 +- .../before-change.component.html | 2 +- .../before-change/before-change.component.ts | 19 +- .../demo/big-data/big-data.component.html | 9 + .../tabs/demo/big-data/big-data.component.ts | 25 + .../configurable-tabs.component.html | 35 -- .../configurable-tabs.component.scss | 66 -- .../configurable-tabs.component.ts | 83 --- .../tabs-transfer.component.html | 12 - .../tabs-transfer/tabs-transfer.component.ts | 36 -- devui/tabs/demo/custom/custom.component.html | 10 +- devui/tabs/demo/custom/custom.component.scss | 7 - devui/tabs/demo/custom/custom.component.ts | 1 - devui/tabs/demo/size/size.component.html | 17 + devui/tabs/demo/size/size.component.ts | 27 + devui/tabs/demo/tabs-demo.component.html | 24 +- devui/tabs/demo/tabs-demo.component.ts | 33 +- devui/tabs/demo/tabs-demo.module.ts | 52 +- .../type-options/type-options.component.html | 1 - .../demo/type-pills/type-pills.component.html | 9 +- .../demo/type-pills/type-pills.component.ts | 21 +- .../type-slider/type-slider.component.html | 9 +- .../demo/type-slider/type-slider.component.ts | 22 +- .../type-wrapped/type-wrapped.component.html | 5 +- .../type-wrapped/type-wrapped.component.ts | 21 +- devui/tabs/doc/api-cn.md | 41 +- devui/tabs/doc/api-en.md | 39 +- devui/tabs/tabs.component.html | 155 ++++- devui/tabs/tabs.component.scss | 585 ++++++++++-------- devui/tabs/tabs.component.ts | 151 +++-- devui/tabs/tabs.module.ts | 7 +- .../tags-input/demo/tags.input-demo.module.ts | 2 +- devui/tags-input/doc/api-cn.md | 7 +- devui/tags-input/doc/api-en.md | 43 +- devui/tags-input/tags.input.component.ts | 16 +- devui/tags/demo/basic/basic.component.ts | 1 + devui/tags/demo/tags-demo.module.ts | 2 +- devui/tags/tag.component.scss | 13 +- .../text-input/demo/text-input-demo.module.ts | 2 +- devui/textarea/demo/text-demo.module.ts | 2 +- devui/theme-collection/extend-theme.scss | 236 ++++++- devui/theme-collection/extend-theme.ts | 89 ++- .../theme-custom-components-data.ts | 31 + devui/theme-collection/theme-initial-data.ts | 134 ++++ devui/theme/theme-data.ts | 80 ++- devui/time-axis/demo/time-axis-demo.module.ts | 2 +- .../demo/basic/basic.component.html | 1 + .../demo/format/format.component.html | 2 +- .../demo/time-picker-demo.module.ts | 2 +- devui/time-picker/time-picker.component.scss | 1 + devui/time-picker/time-picker.component.ts | 10 +- devui/toast/demo/toast-demo.module.ts | 2 +- devui/toast/toast.component.html | 17 +- devui/toast/toast.component.ts | 10 +- .../toggle-menu-container.component.scss | 1 - .../toggle-menu-container.component.ts | 7 +- .../toggle-menu-label.component.html | 15 +- .../toggle-menu-label.component.scss | 12 +- .../toggle-menu-list-item.component.scss | 49 +- .../toggle-menu-list.component.scss | 6 +- .../toggle-menu/toggle-menu-list.component.ts | 12 +- .../toggle-menu-operation.component.html | 16 +- .../toggle/demo/custom/custom.component.html | 4 +- devui/toggle/demo/toggle-demo.module.ts | 2 +- devui/toggle/toggle.component.scss | 2 +- devui/tooltip/demo/tooltip-demo.module.ts | 2 +- devui/transfer/demo/transfer-demo.module.ts | 2 +- .../basic/tree-select-basic.component.html | 10 +- .../demo/basic/tree-select-basic.component.ts | 234 ++++--- .../demo/tree-select-demo.module.ts | 2 +- devui/tree-select/tree-select.component.scss | 2 +- devui/tree-select/tree-select.component.ts | 5 +- devui/tree/demo/basic/basic.component.html | 4 +- devui/tree/demo/basic/basic.component.ts | 86 +-- .../check-control.component.html | 20 +- .../check-control/check-control.component.ts | 71 +-- .../demo/checkable/checkable.component.html | 22 - .../demo/checkable/checkable.component.ts | 108 ---- .../demo/custom-key/custom-key.component.html | 13 + .../demo/custom-key/custom-key.component.ts | 61 ++ .../custom-loading.component.html | 7 +- .../custom-loading.component.ts | 243 ++++---- .../custom-title-key.component.html | 11 - .../custom-title-key.component.ts | 156 ----- .../demo/customize/customize.component.html | 3 - .../demo/customize/customize.component.ts | 17 +- .../demo/draggable/draggable.component.html | 14 +- .../demo/draggable/draggable.component.ts | 18 +- .../demo/merge-node/merge-node.component.html | 2 +- .../demo/merge-node/merge-node.component.ts | 11 +- .../operate-btn/operate-btn.component.html | 13 +- .../demo/operate-btn/operate-btn.component.ts | 15 +- .../search-filter.component.html | 10 +- .../search-filter/search-filter.component.ts | 24 +- devui/tree/demo/tree-demo.component.html | 36 +- devui/tree/demo/tree-demo.component.ts | 22 +- devui/tree/demo/tree-demo.module.ts | 12 +- .../virtual-scroll.component.html | 2 - .../virtual-scroll.component.ts | 14 +- .../without-animation.component.html | 15 - .../without-animation.component.ts | 332 ---------- devui/tree/doc/api-cn.md | 55 +- devui/tree/doc/api-en.md | 3 +- devui/tree/operable-tree.component.scss | 14 +- devui/tree/operable-tree.component.ts | 7 +- devui/tree/tree.component.scss | 12 +- devui/tree/tree.component.ts | 3 +- devui/tsconfig.lib.json | 2 +- devui/tsconfig.lib.prod.json | 2 +- .../customize-area-upload.component.html | 2 +- devui/upload/demo/upload-demo.module.ts | 4 +- devui/upload/multiple-upload.component.html | 4 +- devui/upload/single-upload.component.html | 4 +- devui/utils/globalConfig/index.ts | 3 +- devui/utils/globalConfig/public-api.ts | 2 - devui/utils/popper/popper.component.scss | 4 +- devui/utils/public-api.ts | 2 +- devui/version.ts | 2 +- src/app/app.component.html | 5 +- src/app/app.component.ts | 1 + src/app/app.module.ts | 7 +- src/app/component/app-content.module.ts | 20 +- src/app/component/component.route.ts | 14 + .../component/example-panel.component.scss | 1 + src/app/component/getStarted-cn.md | 18 +- src/app/component/getStarted-en.md | 17 +- src/app/component/scope-list.ts | 36 +- .../customize-theme/color-hierarchy.ts | 263 -------- .../customize-theme/custom-theme.service.ts | 282 --------- .../customize-theme.component.html | 17 - .../customize-theme.component.scss | 47 -- .../customize-theme.component.ts | 125 ---- src/app/theme-picker/customize-theme/util.ts | 16 - .../theme-picker/theme-picker.component.html | 87 --- .../theme-picker/theme-picker.component.scss | 154 ----- .../theme-picker/theme-picker.component.ts | 187 ------ src/app/theme-picker/theme-picker.module.ts | 33 - src/assets/galaxy.png | Bin 6158 -> 0 bytes src/assets/i18n/en-us.json | 185 +++--- src/assets/i18n/zh-cn.json | 161 +++-- src/assets/infinity.png | Bin 8740 -> 0 bytes src/assets/provence.png | Bin 8732 -> 0 bytes src/assets/sweet.png | Bin 7869 -> 0 bytes src/main.ts | 2 +- src/tslint.json | 18 - 501 files changed, 5249 insertions(+), 5537 deletions(-) create mode 100644 devui-commons/src/demo-nav/d-demo-nav.component.html create mode 100644 devui-commons/src/demo-nav/d-demo-nav.component.scss create mode 100644 devui-commons/src/demo-nav/d-demo-nav.component.ts create mode 100644 devui-commons/src/demo-nav/d-demo-nav.module.ts rename {src/app => devui-commons/src/header}/theme-picker/theme-data-more.ts (100%) create mode 100644 devui-commons/src/header/theme-picker/theme-picker-i18n.type.ts create mode 100644 devui-commons/src/header/theme-picker/theme-picker-img.ts delete mode 100755 devui/auto-complete/auto-complete-popup.component.theme.scss delete mode 100644 devui/button/demo/groups/groups.component.scss delete mode 100644 devui/dropdown/demo/add-icon/add-icon.component.scss create mode 100644 devui/icon/demo/basic/basic.component.html create mode 100644 devui/icon/demo/basic/basic.component.scss create mode 100644 devui/icon/demo/basic/basic.component.ts create mode 100644 devui/icon/demo/icon-demo.component.html create mode 100644 devui/icon/demo/icon-demo.component.ts create mode 100644 devui/icon/demo/icon-demo.module.ts create mode 100644 devui/icon/demo/icon-group/icon-group.component.html create mode 100644 devui/icon/demo/icon-group/icon-group.component.scss create mode 100644 devui/icon/demo/icon-group/icon-group.component.ts create mode 100644 devui/icon/doc/api-cn.md create mode 100644 devui/icon/doc/api-en.md create mode 100644 devui/icon/icon-group.component.html create mode 100644 devui/icon/icon-group.component.scss create mode 100644 devui/icon/icon-group.component.ts create mode 100644 devui/icon/icon.component.html create mode 100644 devui/icon/icon.component.scss create mode 100644 devui/icon/icon.component.ts create mode 100644 devui/icon/icon.module.ts create mode 100644 devui/icon/index.ts rename devui/{utils/globalConfig => icon}/package.json (100%) create mode 100644 devui/icon/public-api.ts delete mode 100644 devui/modal/demo/basic/modal-test.component.html delete mode 100644 devui/modal/demo/fixed/modal-test.component.ts rename devui/modal/demo/{fixed => }/modal-test.component.html (68%) rename devui/modal/demo/{basic => }/modal-test.component.ts (54%) delete mode 100755 devui/modal/demo/tips/tips.component.css delete mode 100644 devui/modal/demo/warning/warning.component.html delete mode 100644 devui/modal/demo/warning/warning.component.ts create mode 100644 devui/rate/demo/clear/rate-clear.component.html create mode 100644 devui/rate/demo/clear/rate-clear.component.scss create mode 100644 devui/rate/demo/clear/rate-clear.component.ts create mode 100644 devui/tabs/demo/add-delete/add-delete.component.html create mode 100644 devui/tabs/demo/add-delete/add-delete.component.ts delete mode 100755 devui/tabs/demo/basic/basic.component.css create mode 100644 devui/tabs/demo/big-data/big-data.component.html create mode 100644 devui/tabs/demo/big-data/big-data.component.ts delete mode 100644 devui/tabs/demo/configurable-tabs/configurable-tabs.component.html delete mode 100644 devui/tabs/demo/configurable-tabs/configurable-tabs.component.scss delete mode 100644 devui/tabs/demo/configurable-tabs/configurable-tabs.component.ts delete mode 100644 devui/tabs/demo/configurable-tabs/tabs-transfer/tabs-transfer.component.html delete mode 100644 devui/tabs/demo/configurable-tabs/tabs-transfer/tabs-transfer.component.ts delete mode 100644 devui/tabs/demo/custom/custom.component.scss create mode 100644 devui/tabs/demo/size/size.component.html create mode 100644 devui/tabs/demo/size/size.component.ts create mode 100644 devui/theme-collection/theme-custom-components-data.ts create mode 100644 devui/theme-collection/theme-initial-data.ts delete mode 100755 devui/tree/demo/checkable/checkable.component.html delete mode 100755 devui/tree/demo/checkable/checkable.component.ts create mode 100644 devui/tree/demo/custom-key/custom-key.component.html create mode 100644 devui/tree/demo/custom-key/custom-key.component.ts delete mode 100644 devui/tree/demo/custom-title-key/custom-title-key.component.html delete mode 100644 devui/tree/demo/custom-title-key/custom-title-key.component.ts delete mode 100644 devui/tree/demo/without-animation/without-animation.component.html delete mode 100644 devui/tree/demo/without-animation/without-animation.component.ts delete mode 100644 devui/utils/globalConfig/public-api.ts delete mode 100644 src/app/theme-picker/customize-theme/color-hierarchy.ts delete mode 100644 src/app/theme-picker/customize-theme/custom-theme.service.ts delete mode 100644 src/app/theme-picker/customize-theme/customize-theme.component.html delete mode 100644 src/app/theme-picker/customize-theme/customize-theme.component.scss delete mode 100644 src/app/theme-picker/customize-theme/customize-theme.component.ts delete mode 100644 src/app/theme-picker/customize-theme/util.ts delete mode 100644 src/app/theme-picker/theme-picker.component.html delete mode 100644 src/app/theme-picker/theme-picker.component.scss delete mode 100644 src/app/theme-picker/theme-picker.component.ts delete mode 100644 src/app/theme-picker/theme-picker.module.ts delete mode 100644 src/assets/galaxy.png delete mode 100644 src/assets/infinity.png delete mode 100644 src/assets/provence.png delete mode 100644 src/assets/sweet.png delete mode 100755 src/tslint.json diff --git a/devui-commons/src/demo-nav/d-demo-nav.component.html b/devui-commons/src/demo-nav/d-demo-nav.component.html new file mode 100644 index 00000000..af6c9a2a --- /dev/null +++ b/devui-commons/src/demo-nav/d-demo-nav.component.html @@ -0,0 +1,12 @@ +
+ +
+
{{ goToText }}
+
    +
  • + {{ navitem.value }} +
    • +
+
+ +
diff --git a/devui-commons/src/demo-nav/d-demo-nav.component.scss b/devui-commons/src/demo-nav/d-demo-nav.component.scss new file mode 100644 index 00000000..84aff66d --- /dev/null +++ b/devui-commons/src/demo-nav/d-demo-nav.component.scss @@ -0,0 +1,49 @@ +@import '~ng-devui/styles-var/devui-var.scss'; + +.demo-nav { + width: 240px; + position: fixed; + top: 100px; + right: 0; + height: 100%; + z-index: 1; + + .fast-forward { + width: 130px; + font-size: $devui-font-size-card-title; + color: $devui-text; + line-height: 24px; + font-weight: bold; + padding-bottom: 10px; + margin-left: 20px; + border-bottom: 1px solid $devui-dividing-line; + } + + .step-nav { + margin-top: 10px; + + & > li { + list-style: none; + padding-left: 20px; + cursor: pointer; + height: 50px; + line-height: 50px; + font-size: $devui-font-size; + color: $devui-text; + position: relative; + white-space: nowrap; + text-overflow: ellipsis; + overflow: hidden; + + &.active { + color: $devui-link; + } + } + } +} + +@media (max-width: 1400px) { + .demo-nav { + display: none; + } +} diff --git a/devui-commons/src/demo-nav/d-demo-nav.component.ts b/devui-commons/src/demo-nav/d-demo-nav.component.ts new file mode 100644 index 00000000..7b42f2d1 --- /dev/null +++ b/devui-commons/src/demo-nav/d-demo-nav.component.ts @@ -0,0 +1,33 @@ +import { DOCUMENT } from '@angular/common'; +import { Component, Inject, Input, OnInit } from '@angular/core'; +import { Subscription } from 'rxjs'; +import { DevuiCommonsService } from '../../src/devui-commons.service'; +import { I18nUtil } from '../i18n/i18n.util'; + +@Component({ + selector: 'd-demo-nav', + templateUrl: './d-demo-nav.component.html', + styleUrls: ['./d-demo-nav.component.scss'], +}) +export class DDemoNavComponent implements OnInit { + @Input() navItems: any; + demoDocViewerMain; + goToText = 'Go To'; + subs: Subscription = new Subscription(); + + constructor( + @Inject(DOCUMENT) private doc: any, + private commonsService: DevuiCommonsService + ) {} + + ngOnInit(): void { + this.demoDocViewerMain = this.doc.querySelector('.doc-viewer-container .main'); + this.setI18n(); + this.subs = this.commonsService.on('languageEvent').subscribe((term) => this.setI18n(term)); + } + + setI18n(lang?): void { + const curLanguage = lang || I18nUtil.getCurrentLanguage() || 'zh-cn'; + this.goToText = curLanguage === 'zh-cn' ? '快速前往' : 'Go To'; + } +} diff --git a/devui-commons/src/demo-nav/d-demo-nav.module.ts b/devui-commons/src/demo-nav/d-demo-nav.module.ts new file mode 100644 index 00000000..003d318b --- /dev/null +++ b/devui-commons/src/demo-nav/d-demo-nav.module.ts @@ -0,0 +1,22 @@ +import { CommonModule } from '@angular/common'; +import { NgModule } from '@angular/core'; +import { AnchorModule } from 'ng-devui/anchor'; +import { StickyModule } from 'ng-devui/sticky'; +import { DDemoNavComponent } from './d-demo-nav.component'; + +@NgModule({ + imports: [ + CommonModule, + StickyModule, + AnchorModule + ], + declarations: [ + DDemoNavComponent + ], + exports: [ + DDemoNavComponent, + StickyModule, + AnchorModule + ] +}) +export class DDemoNavModule {} diff --git a/src/app/theme-picker/theme-data-more.ts b/devui-commons/src/header/theme-picker/theme-data-more.ts similarity index 100% rename from src/app/theme-picker/theme-data-more.ts rename to devui-commons/src/header/theme-picker/theme-data-more.ts diff --git a/devui-commons/src/header/theme-picker/theme-picker-i18n.type.ts b/devui-commons/src/header/theme-picker/theme-picker-i18n.type.ts new file mode 100644 index 00000000..b999ede9 --- /dev/null +++ b/devui-commons/src/header/theme-picker/theme-picker-i18n.type.ts @@ -0,0 +1,42 @@ +export const themePicker = { + 'zh-cn': { + theme: '主题', + color: '主题颜色', + mode: '主题模式', + light: '浅色模式', + dark: '深色模式', + follow: '跟随系统', + largeSize: '大字号模式', + default: '默认主题', + extend: '扩展主题', + customize: '定制主题', + customizeDark: '深色', + customizeDownloadConfig: '下载主题文件', + customizeDownloadConfigHelp: '使用', + infinity: '无限', + sweet: '蜜糖', + deep: '深邃夜空', + provence: '普罗旺斯', + galaxy: '追光' + }, + 'en-us': { + theme: 'Theme', + color: 'Theme Color', + mode: 'Theme Mode', + light: 'Light Theme', + dark: 'Dark Theme', + follow: 'Follow System', + largeSize: 'Large FontSize', + default: 'Default', + extend: 'Extend', + customize: 'Customize', + customizeDark: 'Dark', + customizeDownloadConfig: 'Download Theme Config', + customizeDownloadConfigHelp: 'Usage', + infinity: 'Infinity', + sweet: 'Sweet', + deep: 'Deep', + provence: 'Provence', + galaxy: 'Galaxy' + } +} \ No newline at end of file diff --git a/devui-commons/src/header/theme-picker/theme-picker-img.ts b/devui-commons/src/header/theme-picker/theme-picker-img.ts new file mode 100644 index 00000000..1ef4b91d --- /dev/null +++ b/devui-commons/src/header/theme-picker/theme-picker-img.ts @@ -0,0 +1,7 @@ +export const themePickerImg = { + deep: 'data:image/png;base64,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', + galaxy: 'data:image/png;base64,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', + infinity: 'data:image/png;base64,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', + provence: 'data:image/png;base64,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', + sweet: 'data:image/png;base64,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' +} \ No newline at end of file diff --git a/devui-commons/src/header/theme-picker/theme-picker.component.html b/devui-commons/src/header/theme-picker/theme-picker.component.html index 1060817b..3fe90bf3 100644 --- a/devui-commons/src/header/theme-picker/theme-picker.component.html +++ b/devui-commons/src/header/theme-picker/theme-picker.component.html @@ -1,22 +1,87 @@
- 主题 + {{ themePicker.theme }}
-
-
主题模式
-
- - {{ '浅色模式' }} - {{ '深色模式' }} - -
-
+ + +
+
{{ themePicker.color }}
+
+
+ + + + + + + +
+
+
+
+
{{ themePicker.mode }}
+
+ + {{ themePicker.light }} + {{ themePicker.dark }} + +
+ + {{ themePicker.follow }} +
+
+ + {{ themePicker.largeSize }} +
+
+
+ + +
+
+ {{ + themePicker[item.value] + }} + +
+
+ +
- - diff --git a/devui-commons/src/header/theme-picker/theme-picker.component.scss b/devui-commons/src/header/theme-picker/theme-picker.component.scss index 2e5eef55..86460a4c 100644 --- a/devui-commons/src/header/theme-picker/theme-picker.component.scss +++ b/devui-commons/src/header/theme-picker/theme-picker.component.scss @@ -6,9 +6,11 @@ } .theme-toggle { - font-size: 16px; + font-size: $devui-font-size-page-title; line-height: 1.5; cursor: pointer; + display: flex; + align-items: center; &:hover { color: $devui-link; @@ -22,6 +24,7 @@ height: 18px; position: relative; border: 1px solid $devui-brand; + margin-left: 8px; .brand-color { position: absolute; @@ -52,13 +55,12 @@ .theme-menu { padding: 8px 12px; - font-size: 12px; + font-size: $devui-font-size; line-height: 1.5; - width: 180px; - height: 110px; + width: 200px; // 根据tab页动态宽度 .title { - font-weight: bold; + font-weight: 600; padding-bottom: 4px; margin: 8px 0 4px 0; line-height: 1.5; @@ -70,6 +72,83 @@ } } +d-toggle, +d-select { + display: inline-block; +} + .theme-select-radio { padding-left: 4px; + padding-right: 0; +} + +.theme-follow-toggle { + transform: scale(0.8); +} + +.theme-follow-toggle + span { + vertical-align: middle; + line-height: 28px; + margin-left: 4px; +} + +.prefers-color-scheme { + display: none; +} + +@media screen and (prefers-color-scheme: light) { + .prefers-color-scheme { + display: inline-block; + } +} + +@media screen and (prefers-color-scheme: dark) { + .prefers-color-scheme { + display: inline-block; + } +} + +.theme-color .theme-brand { + display: block; + width: 20px; + height: 20px; + float: left; + margin: 10px; + cursor: pointer; + border: 1px solid $devui-line; +} + +.theme-color::after { + display: block; + content: ''; + clear: both; +} + +.devui-tick { + fill: $devui-light-text; +} + +.extend-theme-image { + background-repeat: no-repeat; + height: 40px; + margin-bottom: 8px; + border-radius: $devui-border-radius; + cursor: pointer; + display: flex; + justify-content: space-between; + align-items: center; +} + +.extend-theme-title { + margin: 0 8px; + color: $devui-light-text; +} + +.active-theme { + color: $devui-light-text; + margin-right: 8px; + background-color: $devui-brand; + border-radius: 50%; + opacity: 0.6; + padding: 4px; } diff --git a/devui-commons/src/header/theme-picker/theme-picker.component.ts b/devui-commons/src/header/theme-picker/theme-picker.component.ts index 0b1eb20a..8543f636 100644 --- a/devui-commons/src/header/theme-picker/theme-picker.component.ts +++ b/devui-commons/src/header/theme-picker/theme-picker.component.ts @@ -1,33 +1,189 @@ -import { ChangeDetectorRef, Component, OnInit } from '@angular/core'; -import { ThemeService } from 'ng-devui/theme'; +import { ChangeDetectorRef, Component, OnDestroy, OnInit } from '@angular/core'; +import { Theme, ThemeService, ThemeServiceFollowSystemOff, ThemeServiceFollowSystemOn } from 'ng-devui/theme'; +import { Subscription } from 'rxjs'; +import { DevuiCommonsService } from '../../../src/devui-commons.service'; +import { I18nUtil } from '../../i18n/i18n.util'; +import { LargeFontSize } from './theme-data-more'; +import { themePicker } from './theme-picker-i18n.type'; +import { themePickerImg } from './theme-picker-img'; @Component({ selector: 'theme-picker', templateUrl: './theme-picker.component.html', styleUrls: ['./theme-picker.component.scss'], }) -export class ThemePickerComponent implements OnInit { - themeService: ThemeService; - themes; - theme: string; - themeMode: 'light' | 'dark' | string = 'light'; - themePrefix = 'devui'; - +export class ThemePickerComponent implements OnInit, OnDestroy { + themeService!: ThemeService; + themes: Theme[] = []; + theme: string = 'devui-light-theme'; + largeFontTheme: Theme; + fontSize: 'normal' | 'large' = 'normal'; + themeMode: 'light' | 'dark' = 'light'; + themePrefix: 'devui' | 'green' | string = 'devui'; + themePrefersColorScheme: boolean; + sub: Subscription; + largeFontSizeMode = false; + activeThemeType: string | number = 'devuiTheme'; + advancedThemeList = [{ value: 'infinity', url: themePickerImg.infinity }, + { value: 'sweet', url: themePickerImg.sweet }, + { value: 'provence', url: themePickerImg.provence }, + { value: 'deep', url: themePickerImg.deep }, + { value: 'galaxy', url: themePickerImg.galaxy }]; + currentAdvancedTheme = 'infinity'; + subs: Subscription = new Subscription(); + themePicker: any = {}; constructor( - private cdr: ChangeDetectorRef - ) {} - - ngOnInit(): void { - this.themeService = window['devuiThemeService']; - this.themes = window['devuiThemes']; - this.theme = window['devuiCurrentTheme']; - this.themePrefix = this.theme.split('-')[0]; - this.themeMode = this.theme.split('-')[1]; + private cdr: ChangeDetectorRef, + private commonsService: DevuiCommonsService + ) { } + + ngOnInit() { + if (typeof window !== 'undefined') { + this.themeService = window['devuiThemeService']; + this.themes = window['devuiThemes']; + this.theme = window['devuiCurrentTheme']; + } + const themeName = localStorage.getItem('user-custom-theme')?.split('-')[0]; + this.currentAdvancedTheme = this.advancedThemeList.find(theme => theme.value === themeName) ? themeName : 'infinity'; + this.advancedThemeChange(this.currentAdvancedTheme); + this.themePrefix = this.getThemePrefix(); + this.themeMode = this.themes[this.theme]?.isDark ? 'dark' : 'light'; + this.largeFontSizeMode = this.theme === 'devui-large-font-theme'; + this.largeFontTheme = this.themes['devui-large-font-theme']; + this.themePrefersColorScheme = this.getThemePrefersColorSchemeOn(); + this.initTheme(); this.cdr.detectChanges(); + if (this.themePrefersColorScheme) { + this.themePrefersColorSchemeChange(true); + } + this.setI18n(); + this.subs = this.commonsService.on('languageEvent').subscribe((term) => this.setI18n(term)); + } + + setI18n(lang?) { + const curLanguage = lang || I18nUtil.getCurrentLanguage() || 'zh-cn'; + this.themePicker = themePicker[curLanguage]; + } + + getThemePrefix() { + return (this.theme.split('-')[0] !== 'devui' && this.theme.split('-')[0] !== 'green') ? 'devui' : this.theme.split('-')[0]; + } + initTheme() { + if (!this.checkInitThemeType()) { + this.activeThemeType = 'devuiTheme'; + this.themesChange(); + } else { + this.activeThemeType = 'advancedTheme'; + const themeName = localStorage.getItem('user-custom-theme')?.split('-')[0]; + this.currentAdvancedTheme = this.advancedThemeList.find(theme => theme.value === themeName) ? themeName : 'infinity'; + this.advancedThemeChange(this.currentAdvancedTheme); + } + } + + checkInitThemeType() { + const advancedThemePrefixList = ['infinity', 'sweet', 'provence', 'deep', 'galaxy']; + return advancedThemePrefixList.some(item => localStorage.getItem('user-custom-theme').startsWith(item)); + } + + themePrefixChange(prefix: string) { + this.themePrefix = prefix; + if (this.themePrefersColorScheme) { + this.themePrefersColorSchemeChange(true); + } else { + this.themesChange(); + } + } + + themesChange() { + if (this.largeFontSizeMode) { + this.largeFontTheme.data = { ...this.themes[`${this.themePrefix}-${this.themeMode}-theme`].data, ...LargeFontSize}; + this.theme = `devui-large-font-theme`; + } else { + this.theme = `${this.themePrefix}-${this.themeMode}-theme`; + } + this.themeService.applyTheme(this.themes[this.theme]); + } + + advancedThemeChange(theme) { + this.currentAdvancedTheme = theme; + const validTheme = theme + '-theme'; + this.themeService.applyTheme(this.themes[validTheme]); } - themesChange(): void { - this.theme = `${this.themePrefix}-${this.themeMode}-theme`; + themeFontSizeChange() { + if (typeof window !== 'undefined' && this.largeFontSizeMode) { + this.largeFontTheme.data = { ...this.themes[window['devuiCurrentTheme']].data, ...LargeFontSize}; + this.theme = `devui-large-font-theme`; + } else { + this.theme = `${this.themePrefix}-${this.themeMode}-theme`; + } this.themeService.applyTheme(this.themes[this.theme]); } + + themeFontSizeSchemeChange(event: boolean) { + if (event) { + if (this.sub) { + ThemeServiceFollowSystemOff(this.sub); + } + this.sub = ThemeServiceFollowSystemOn({ + lightThemeName: `${this.themePrefix}-light-large-theme`, + darkThemeName: `${this.themePrefix}-dark-large-theme` + }); + this.setThemeFontSizeScheme('on'); + } else { + ThemeServiceFollowSystemOff(this.sub); + this.setThemeFontSizeScheme('off'); + this.sub = undefined; + this.themesChange(); + } + } + + themePrefersColorSchemeChange(event: boolean) { + if (event) { + if (this.sub) { + ThemeServiceFollowSystemOff(this.sub); + } + this.sub = ThemeServiceFollowSystemOn({ + lightThemeName: `${this.themePrefix}-light-theme`, + darkThemeName: `${this.themePrefix}-dark-theme` + }); + this.setThemePrefersColorScheme('on'); + } else { + ThemeServiceFollowSystemOff(this.sub); + this.setThemePrefersColorScheme('off'); + this.sub = undefined; + this.themesChange(); + } + } + + ngOnDestroy(): void { + if (this.themePrefersColorScheme) { + ThemeServiceFollowSystemOff(this.sub); + } + this.subs.unsubscribe(); + } + + getThemeFontSizeSchemeOn() { + return localStorage.getItem('devuiThemeFontSizeScheme') === 'on'; + } + + setThemeFontSizeScheme(value: 'on' | 'off') { + localStorage.setItem('devuiThemeFontSizeScheme', value); + } + + getThemePrefersColorSchemeOn() { + return localStorage.getItem('devuiThemePrefersColorScheme') === 'on'; + } + + setThemePrefersColorScheme(value: 'on' | 'off') { + localStorage.setItem('devuiThemePrefersColorScheme', value); + } + + activeTabChange(tab) { + if (tab === 'advancedTheme') { + this.advancedThemeChange(this.currentAdvancedTheme); + } else { + this.themesChange(); + } + } } diff --git a/devui/accordion/demo/accordion-demo.moudule.ts b/devui/accordion/demo/accordion-demo.moudule.ts index 1ee1812f..1db4906c 100755 --- a/devui/accordion/demo/accordion-demo.moudule.ts +++ b/devui/accordion/demo/accordion-demo.moudule.ts @@ -8,7 +8,7 @@ import { DevUIApiModule } from 'ng-devui/shared/devui-api/devui-api.module'; import { DevUICodeboxModule } from 'ng-devui/shared/devui-codebox'; import { ToggleModule } from 'ng-devui/toggle'; import { TranslateModule } from '@ngx-translate/core'; -import { DDemoNavModule } from 'src/app/component/d-demo-nav.module'; +import { DDemoNavModule } from 'devui-commons/src/demo-nav/d-demo-nav.module'; import { AccordionDemoComponent } from './accordion-demo.component'; import { BasicComponent } from './basic/basic.component'; import { ChangeKeyComponent } from './change-key/change-key.component'; diff --git a/devui/alert/demo/alert-demo.module.ts b/devui/alert/demo/alert-demo.module.ts index 186dba2e..1f948999 100755 --- a/devui/alert/demo/alert-demo.module.ts +++ b/devui/alert/demo/alert-demo.module.ts @@ -7,7 +7,7 @@ import { DevUIApiComponent } from 'ng-devui/shared/devui-api/devui-api.component import { DevUIApiModule } from 'ng-devui/shared/devui-api/devui-api.module'; import { DevUICodeboxModule } from 'ng-devui/shared/devui-codebox/devui-codebox.module'; import { TranslateModule } from '@ngx-translate/core'; -import { DDemoNavModule } from 'src/app/component/d-demo-nav.module'; +import { DDemoNavModule } from 'devui-commons/src/demo-nav/d-demo-nav.module'; import { AlertDemoComponent } from './alert-demo.component'; import { BasicComponent } from './basic/basic.component'; import { CloseComponent } from './close/close.component'; diff --git a/devui/anchor/demo/anchor-demo.module.ts b/devui/anchor/demo/anchor-demo.module.ts index f3398723..41d74725 100755 --- a/devui/anchor/demo/anchor-demo.module.ts +++ b/devui/anchor/demo/anchor-demo.module.ts @@ -10,7 +10,7 @@ import { DevUICodeboxModule } from 'ng-devui/shared/devui-codebox/devui-codebox. import { StickyModule } from 'ng-devui/sticky'; import { ToggleModule } from 'ng-devui/toggle'; import { TranslateModule } from '@ngx-translate/core'; -import { DDemoNavModule } from 'src/app/component/d-demo-nav.module'; +import { DDemoNavModule } from 'devui-commons/src/demo-nav/d-demo-nav.module'; import { AnchorDemoComponent } from './anchor-demo.component'; import { AsyncComponent } from './async/async.component'; import { BasicComponent } from './basic/basic.component'; diff --git a/devui/animations/demo/animations-demo.module.ts b/devui/animations/demo/animations-demo.module.ts index 520e92a7..960b0393 100644 --- a/devui/animations/demo/animations-demo.module.ts +++ b/devui/animations/demo/animations-demo.module.ts @@ -6,7 +6,7 @@ import { DevUIApiComponent } from 'ng-devui/shared/devui-api/devui-api.component import { DevUIApiModule } from 'ng-devui/shared/devui-api/devui-api.module'; import { DevUICodeboxModule } from 'ng-devui/shared/devui-codebox'; import { TranslateModule } from '@ngx-translate/core'; -import { DDemoNavModule } from 'src/app/component/d-demo-nav.module'; +import { DDemoNavModule } from 'devui-commons/src/demo-nav/d-demo-nav.module'; import { AnimationIconComponent } from './animation-icon/animation-icon.component'; import { AnimationsDemoComponent } from './animations-demo.component'; import { CollapseComponent } from './collapse/collapse.component'; diff --git a/devui/auto-complete/auto-complete-popup.component.html b/devui/auto-complete/auto-complete-popup.component.html index e0425b3a..4ca358bd 100755 --- a/devui/auto-complete/auto-complete-popup.component.html +++ b/devui/auto-complete/auto-complete-popup.component.html @@ -32,7 +32,7 @@ [backdrop]="true" >