@ng-nest/ui 12.0.8 → 12.1.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/alert/alert.component.d.ts +2 -1
- package/auto-complete/auto-complete-portal.component.d.ts +1 -3
- package/auto-complete/auto-complete.component.d.ts +1 -1
- package/back-top/back-top.component.d.ts +1 -2
- package/bundles/ng-nest-ui-alert.umd.js +6 -1
- package/bundles/ng-nest-ui-alert.umd.js.map +1 -1
- package/bundles/ng-nest-ui-anchor.umd.js +1 -1
- package/bundles/ng-nest-ui-anchor.umd.js.map +1 -1
- package/bundles/ng-nest-ui-auto-complete.umd.js +7 -6
- package/bundles/ng-nest-ui-auto-complete.umd.js.map +1 -1
- package/bundles/ng-nest-ui-back-top.umd.js +2 -2
- package/bundles/ng-nest-ui-back-top.umd.js.map +1 -1
- package/bundles/ng-nest-ui-badge.umd.js +2 -1
- package/bundles/ng-nest-ui-badge.umd.js.map +1 -1
- package/bundles/ng-nest-ui-button.umd.js +4 -3
- package/bundles/ng-nest-ui-button.umd.js.map +1 -1
- package/bundles/ng-nest-ui-calendar.umd.js +4 -3
- package/bundles/ng-nest-ui-calendar.umd.js.map +1 -1
- package/bundles/ng-nest-ui-carousel.umd.js +13 -12
- package/bundles/ng-nest-ui-carousel.umd.js.map +1 -1
- package/bundles/ng-nest-ui-cascade.umd.js +9 -9
- package/bundles/ng-nest-ui-cascade.umd.js.map +1 -1
- package/bundles/ng-nest-ui-checkbox.umd.js +3 -2
- package/bundles/ng-nest-ui-checkbox.umd.js.map +1 -1
- package/bundles/ng-nest-ui-color-picker.umd.js +9 -10
- package/bundles/ng-nest-ui-color-picker.umd.js.map +1 -1
- package/bundles/ng-nest-ui-color.umd.js +1 -1
- package/bundles/ng-nest-ui-color.umd.js.map +1 -1
- package/bundles/ng-nest-ui-comment.umd.js +3 -2
- package/bundles/ng-nest-ui-comment.umd.js.map +1 -1
- package/bundles/ng-nest-ui-container.umd.js.map +1 -1
- package/bundles/ng-nest-ui-core.umd.js +3 -3
- package/bundles/ng-nest-ui-core.umd.js.map +1 -1
- package/bundles/ng-nest-ui-crumb.umd.js +3 -2
- package/bundles/ng-nest-ui-crumb.umd.js.map +1 -1
- package/bundles/ng-nest-ui-date-picker.umd.js +34 -44
- package/bundles/ng-nest-ui-date-picker.umd.js.map +1 -1
- package/bundles/ng-nest-ui-description.umd.js +5 -6
- package/bundles/ng-nest-ui-description.umd.js.map +1 -1
- package/bundles/ng-nest-ui-dialog.umd.js +285 -32
- package/bundles/ng-nest-ui-dialog.umd.js.map +1 -1
- package/bundles/ng-nest-ui-drawer.umd.js +247 -15
- package/bundles/ng-nest-ui-drawer.umd.js.map +1 -1
- package/bundles/ng-nest-ui-dropdown.umd.js +4 -3
- package/bundles/ng-nest-ui-dropdown.umd.js.map +1 -1
- package/bundles/ng-nest-ui-find.umd.js +33 -8
- package/bundles/ng-nest-ui-find.umd.js.map +1 -1
- package/bundles/ng-nest-ui-form.umd.js +6 -10
- package/bundles/ng-nest-ui-form.umd.js.map +1 -1
- package/bundles/ng-nest-ui-highlight.umd.js +2 -1
- package/bundles/ng-nest-ui-highlight.umd.js.map +1 -1
- package/bundles/ng-nest-ui-i18n.umd.js +2 -1
- package/bundles/ng-nest-ui-i18n.umd.js.map +1 -1
- package/bundles/ng-nest-ui-icon.umd.js +3 -2
- package/bundles/ng-nest-ui-icon.umd.js.map +1 -1
- package/bundles/ng-nest-ui-inner.umd.js +1 -1
- package/bundles/ng-nest-ui-inner.umd.js.map +1 -1
- package/bundles/ng-nest-ui-input.umd.js +9 -7
- package/bundles/ng-nest-ui-input.umd.js.map +1 -1
- package/bundles/ng-nest-ui-list.umd.js +4 -3
- package/bundles/ng-nest-ui-list.umd.js.map +1 -1
- package/bundles/ng-nest-ui-loading.umd.js +2 -1
- package/bundles/ng-nest-ui-loading.umd.js.map +1 -1
- package/bundles/ng-nest-ui-menu.umd.js +6 -6
- package/bundles/ng-nest-ui-menu.umd.js.map +1 -1
- package/bundles/ng-nest-ui-message-box.umd.js +28 -26
- package/bundles/ng-nest-ui-message-box.umd.js.map +1 -1
- package/bundles/ng-nest-ui-message.umd.js +53 -17
- package/bundles/ng-nest-ui-message.umd.js.map +1 -1
- package/bundles/ng-nest-ui-notification.umd.js +1 -1
- package/bundles/ng-nest-ui-notification.umd.js.map +1 -1
- package/bundles/ng-nest-ui-pagination.umd.js +3 -2
- package/bundles/ng-nest-ui-pagination.umd.js.map +1 -1
- package/bundles/ng-nest-ui-popconfirm.umd.js +33 -4
- package/bundles/ng-nest-ui-popconfirm.umd.js.map +1 -1
- package/bundles/ng-nest-ui-popover.umd.js +15 -3
- package/bundles/ng-nest-ui-popover.umd.js.map +1 -1
- package/bundles/ng-nest-ui-portal.umd.js +8 -8
- package/bundles/ng-nest-ui-portal.umd.js.map +1 -1
- package/bundles/ng-nest-ui-progress.umd.js +236 -20
- package/bundles/ng-nest-ui-progress.umd.js.map +1 -1
- package/bundles/ng-nest-ui-radio.umd.js +3 -2
- package/bundles/ng-nest-ui-radio.umd.js.map +1 -1
- package/bundles/ng-nest-ui-rate.umd.js +5 -5
- package/bundles/ng-nest-ui-rate.umd.js.map +1 -1
- package/bundles/ng-nest-ui-ripple.umd.js.map +1 -1
- package/bundles/ng-nest-ui-select.umd.js +7 -6
- package/bundles/ng-nest-ui-select.umd.js.map +1 -1
- package/bundles/ng-nest-ui-skeleton.umd.js +2 -1
- package/bundles/ng-nest-ui-skeleton.umd.js.map +1 -1
- package/bundles/ng-nest-ui-slider.umd.js +7 -8
- package/bundles/ng-nest-ui-slider.umd.js.map +1 -1
- package/bundles/ng-nest-ui-statistic.umd.js +6 -4
- package/bundles/ng-nest-ui-statistic.umd.js.map +1 -1
- package/bundles/ng-nest-ui-steps.umd.js +23 -10
- package/bundles/ng-nest-ui-steps.umd.js.map +1 -1
- package/bundles/ng-nest-ui-table.umd.js +13 -10
- package/bundles/ng-nest-ui-table.umd.js.map +1 -1
- package/bundles/ng-nest-ui-tabs.umd.js +5 -4
- package/bundles/ng-nest-ui-tabs.umd.js.map +1 -1
- package/bundles/ng-nest-ui-tag.umd.js +2 -1
- package/bundles/ng-nest-ui-tag.umd.js.map +1 -1
- package/bundles/ng-nest-ui-text-retract.umd.js +2 -1
- package/bundles/ng-nest-ui-text-retract.umd.js.map +1 -1
- package/bundles/ng-nest-ui-textarea.umd.js +3 -12
- package/bundles/ng-nest-ui-textarea.umd.js.map +1 -1
- package/bundles/ng-nest-ui-theme.umd.js +2 -2
- package/bundles/ng-nest-ui-theme.umd.js.map +1 -1
- package/bundles/ng-nest-ui-time-picker.umd.js +32 -15
- package/bundles/ng-nest-ui-time-picker.umd.js.map +1 -1
- package/bundles/ng-nest-ui-timeline.umd.js +3 -2
- package/bundles/ng-nest-ui-timeline.umd.js.map +1 -1
- package/bundles/ng-nest-ui-tooltip.umd.js +3 -2
- package/bundles/ng-nest-ui-tooltip.umd.js.map +1 -1
- package/bundles/ng-nest-ui-transfer.umd.js +3 -2
- package/bundles/ng-nest-ui-transfer.umd.js.map +1 -1
- package/bundles/ng-nest-ui-tree.umd.js +8 -7
- package/bundles/ng-nest-ui-tree.umd.js.map +1 -1
- package/bundles/ng-nest-ui-upload.umd.js +5 -4
- package/bundles/ng-nest-ui-upload.umd.js.map +1 -1
- package/button/buttons.component.d.ts +1 -1
- package/calendar/calendar.component.d.ts +2 -2
- package/carousel/carousel-panel.component.d.ts +2 -3
- package/carousel/carousel.component.d.ts +1 -1
- package/cascade/cascade-portal.component.d.ts +4 -7
- package/cascade/cascade.component.d.ts +1 -1
- package/checkbox/checkbox.component.d.ts +1 -1
- package/color/color.component.d.ts +2 -2
- package/color-picker/color-picker-portal.component.d.ts +1 -3
- package/color-picker/color-picker.component.d.ts +2 -3
- package/comment/comment.component.d.ts +1 -1
- package/core/config/config.d.ts +7 -0
- package/core/interfaces/layout.type.d.ts +1 -1
- package/core/services/reuse-strategy.service.d.ts +1 -1
- package/crumb/crumb.component.d.ts +1 -1
- package/date-picker/date-picker-portal.component.d.ts +1 -3
- package/date-picker/date-picker.component.d.ts +3 -4
- package/date-picker/date-picker.property.d.ts +1 -16
- package/date-picker/date-range-portal.component.d.ts +1 -3
- package/date-picker/date-range.component.d.ts +2 -3
- package/date-picker/picker-date.component.d.ts +1 -1
- package/date-picker/picker-month.component.d.ts +1 -1
- package/date-picker/picker-year.component.d.ts +1 -1
- package/description/description.component.d.ts +2 -4
- package/dialog/dialog-container.component.d.ts +18 -0
- package/dialog/dialog-container.directives.d.ts +24 -0
- package/dialog/dialog-ref.d.ts +9 -0
- package/dialog/dialog.module.d.ts +13 -11
- package/dialog/dialog.property.d.ts +84 -6
- package/dialog/dialog.service.d.ts +19 -0
- package/dialog/public-api.d.ts +4 -0
- package/drawer/drawer-container.component.d.ts +18 -0
- package/drawer/drawer-container.directives.d.ts +19 -0
- package/drawer/drawer-ref.d.ts +9 -0
- package/drawer/drawer.module.d.ts +8 -6
- package/drawer/drawer.property.d.ts +83 -2
- package/drawer/drawer.service.d.ts +19 -0
- package/drawer/public-api.d.ts +5 -0
- package/dropdown/dropdown-portal.component.d.ts +1 -3
- package/dropdown/dropdown.component.d.ts +2 -2
- package/esm2015/alert/alert.component.js +8 -3
- package/esm2015/anchor/anchor.component.js +2 -2
- package/esm2015/anchor/anchor.property.js +1 -1
- package/esm2015/auto-complete/auto-complete-portal.component.js +4 -4
- package/esm2015/auto-complete/auto-complete.component.js +5 -4
- package/esm2015/auto-complete/auto-complete.property.js +1 -1
- package/esm2015/back-top/back-top.component.js +3 -3
- package/esm2015/badge/badge.component.js +3 -2
- package/esm2015/button/button.component.js +5 -4
- package/esm2015/button/buttons.component.js +1 -1
- package/esm2015/calendar/calendar.component.js +5 -4
- package/esm2015/carousel/carousel-panel.component.js +12 -11
- package/esm2015/carousel/carousel.component.js +4 -3
- package/esm2015/cascade/cascade-portal.component.js +6 -7
- package/esm2015/cascade/cascade.component.js +5 -4
- package/esm2015/checkbox/checkbox.component.js +4 -3
- package/esm2015/checkbox/checkbox.property.js +1 -1
- package/esm2015/color/color.component.js +2 -2
- package/esm2015/color-picker/color-picker-portal.component.js +3 -3
- package/esm2015/color-picker/color-picker.component.js +8 -9
- package/esm2015/comment/comment.component.js +4 -3
- package/esm2015/container/container.component.js +2 -2
- package/esm2015/core/animation/fade.js +1 -1
- package/esm2015/core/config/config.js +1 -1
- package/esm2015/core/interfaces/layout.type.js +1 -1
- package/esm2015/core/services/http.service.js +2 -2
- package/esm2015/core/services/preloading-strategy.service.js +2 -2
- package/esm2015/core/services/reuse-strategy.service.js +2 -2
- package/esm2015/crumb/crumb.component.js +4 -3
- package/esm2015/date-picker/date-picker-portal.component.js +4 -4
- package/esm2015/date-picker/date-picker.component.js +9 -13
- package/esm2015/date-picker/date-picker.property.js +8 -17
- package/esm2015/date-picker/date-range-portal.component.js +2 -2
- package/esm2015/date-picker/date-range.component.js +7 -7
- package/esm2015/date-picker/picker-date.component.js +4 -3
- package/esm2015/date-picker/picker-month.component.js +4 -3
- package/esm2015/date-picker/picker-year.component.js +4 -3
- package/esm2015/description/description.component.js +6 -7
- package/esm2015/dialog/dialog-container.component.js +59 -0
- package/esm2015/dialog/dialog-container.directives.js +73 -0
- package/esm2015/dialog/dialog-ref.js +17 -0
- package/esm2015/dialog/dialog.component.js +4 -3
- package/esm2015/dialog/dialog.module.js +37 -7
- package/esm2015/dialog/dialog.property.js +17 -16
- package/esm2015/dialog/dialog.service.js +67 -0
- package/esm2015/dialog/public-api.js +5 -1
- package/esm2015/drawer/drawer-container.component.js +59 -0
- package/esm2015/drawer/drawer-container.directives.js +57 -0
- package/esm2015/drawer/drawer-ref.js +17 -0
- package/esm2015/drawer/drawer.component.js +4 -3
- package/esm2015/drawer/drawer.module.js +22 -6
- package/esm2015/drawer/drawer.property.js +22 -6
- package/esm2015/drawer/drawer.service.js +65 -0
- package/esm2015/drawer/public-api.js +6 -1
- package/esm2015/dropdown/dropdown-portal.component.js +2 -2
- package/esm2015/dropdown/dropdown.component.js +4 -3
- package/esm2015/find/find.component.js +18 -8
- package/esm2015/find/find.property.js +18 -2
- package/esm2015/form/control.component.js +1 -1
- package/esm2015/form/form.component.js +6 -5
- package/esm2015/form/form.property.js +3 -8
- package/esm2015/highlight/highlight.component.js +3 -2
- package/esm2015/highlight/highlight.property.js +1 -1
- package/esm2015/i18n/i18n.directive.js +3 -2
- package/esm2015/icon/icon.component.js +4 -3
- package/esm2015/inner/inner.component.js +2 -2
- package/esm2015/input/input-group.component.js +2 -4
- package/esm2015/input/input.component.js +9 -5
- package/esm2015/input/input.property.js +1 -1
- package/esm2015/list/list.component.js +5 -4
- package/esm2015/list/list.property.js +1 -1
- package/esm2015/loading/loading.component.js +3 -2
- package/esm2015/menu/menu-node.component.js +1 -1
- package/esm2015/menu/menu.component.js +7 -7
- package/esm2015/message/message-ref.js +12 -0
- package/esm2015/message/message.component.js +4 -4
- package/esm2015/message/message.property.js +2 -2
- package/esm2015/message/message.service.js +37 -15
- package/esm2015/message/public-api.js +2 -1
- package/esm2015/message-box/message-box.component.js +17 -21
- package/esm2015/message-box/message-box.service.js +7 -5
- package/esm2015/notification/notification.component.js +2 -2
- package/esm2015/notification/notification.property.js +1 -1
- package/esm2015/pagination/pagination.component.js +4 -3
- package/esm2015/popconfirm/popconfirm.component.js +25 -4
- package/esm2015/popconfirm/popconfirm.property.js +10 -3
- package/esm2015/popover/popover.directive.js +10 -3
- package/esm2015/popover/popover.property.js +7 -2
- package/esm2015/portal/portal.module.js +4 -3
- package/esm2015/portal/portal.service.js +8 -9
- package/esm2015/progress/progress.component.js +178 -15
- package/esm2015/progress/progress.property.js +50 -3
- package/esm2015/radio/radio.component.js +4 -3
- package/esm2015/radio/radio.property.js +1 -1
- package/esm2015/rate/rate.component.js +6 -6
- package/esm2015/ripple/ripple.directive.js +1 -1
- package/esm2015/ripple/ripple.property.js +1 -1
- package/esm2015/select/select-portal.component.js +3 -3
- package/esm2015/select/select.component.js +6 -5
- package/esm2015/skeleton/skeleton.component.js +3 -2
- package/esm2015/slider/slider.component.js +8 -9
- package/esm2015/statistic/countdown.component.js +5 -4
- package/esm2015/statistic/statistic.component.js +3 -2
- package/esm2015/steps/steps.component.js +18 -10
- package/esm2015/steps/steps.property.js +8 -3
- package/esm2015/table/drag.directive.js +2 -2
- package/esm2015/table/table-body.component.js +4 -3
- package/esm2015/table/table-foot.component.js +1 -1
- package/esm2015/table/table-head.component.js +5 -4
- package/esm2015/table/table.component.js +6 -5
- package/esm2015/table/table.property.js +1 -1
- package/esm2015/tabs/tab.component.js +1 -1
- package/esm2015/tabs/tabs.component.js +6 -5
- package/esm2015/tag/tag.component.js +3 -2
- package/esm2015/text-retract/text-retract.component.js +3 -2
- package/esm2015/textarea/textarea.component.js +3 -2
- package/esm2015/textarea/textarea.property.js +2 -12
- package/esm2015/theme/theme.component.js +3 -3
- package/esm2015/theme/theme.property.js +1 -1
- package/esm2015/time-picker/time-picker-frame.component.js +9 -5
- package/esm2015/time-picker/time-picker-portal.component.js +2 -2
- package/esm2015/time-picker/time-picker.component.js +25 -12
- package/esm2015/timeline/timeline.component.js +4 -3
- package/esm2015/tooltip/tooltip.directive.js +4 -3
- package/esm2015/tooltip/tooltip.property.js +1 -1
- package/esm2015/transfer/transfer.component.js +4 -3
- package/esm2015/tree/tree-node.component.js +2 -2
- package/esm2015/tree/tree.component.js +8 -7
- package/esm2015/tree/tree.property.js +1 -1
- package/esm2015/upload/upload-portal.component.js +2 -2
- package/esm2015/upload/upload.component.js +5 -4
- package/fesm2015/ng-nest-ui-alert.js +7 -2
- package/fesm2015/ng-nest-ui-alert.js.map +1 -1
- package/fesm2015/ng-nest-ui-anchor.js +1 -1
- package/fesm2015/ng-nest-ui-anchor.js.map +1 -1
- package/fesm2015/ng-nest-ui-auto-complete.js +7 -6
- package/fesm2015/ng-nest-ui-auto-complete.js.map +1 -1
- package/fesm2015/ng-nest-ui-back-top.js +2 -2
- package/fesm2015/ng-nest-ui-back-top.js.map +1 -1
- package/fesm2015/ng-nest-ui-badge.js +2 -1
- package/fesm2015/ng-nest-ui-badge.js.map +1 -1
- package/fesm2015/ng-nest-ui-button.js +4 -3
- package/fesm2015/ng-nest-ui-button.js.map +1 -1
- package/fesm2015/ng-nest-ui-calendar.js +4 -3
- package/fesm2015/ng-nest-ui-calendar.js.map +1 -1
- package/fesm2015/ng-nest-ui-carousel.js +12 -11
- package/fesm2015/ng-nest-ui-carousel.js.map +1 -1
- package/fesm2015/ng-nest-ui-cascade.js +9 -9
- package/fesm2015/ng-nest-ui-cascade.js.map +1 -1
- package/fesm2015/ng-nest-ui-checkbox.js +3 -2
- package/fesm2015/ng-nest-ui-checkbox.js.map +1 -1
- package/fesm2015/ng-nest-ui-color-picker.js +9 -10
- package/fesm2015/ng-nest-ui-color-picker.js.map +1 -1
- package/fesm2015/ng-nest-ui-color.js +1 -1
- package/fesm2015/ng-nest-ui-color.js.map +1 -1
- package/fesm2015/ng-nest-ui-comment.js +3 -2
- package/fesm2015/ng-nest-ui-comment.js.map +1 -1
- package/fesm2015/ng-nest-ui-container.js +1 -1
- package/fesm2015/ng-nest-ui-container.js.map +1 -1
- package/fesm2015/ng-nest-ui-core.js +3 -3
- package/fesm2015/ng-nest-ui-core.js.map +1 -1
- package/fesm2015/ng-nest-ui-crumb.js +3 -2
- package/fesm2015/ng-nest-ui-crumb.js.map +1 -1
- package/fesm2015/ng-nest-ui-date-picker.js +34 -44
- package/fesm2015/ng-nest-ui-date-picker.js.map +1 -1
- package/fesm2015/ng-nest-ui-description.js +5 -6
- package/fesm2015/ng-nest-ui-description.js.map +1 -1
- package/fesm2015/ng-nest-ui-dialog.js +256 -26
- package/fesm2015/ng-nest-ui-dialog.js.map +1 -1
- package/fesm2015/ng-nest-ui-drawer.js +226 -14
- package/fesm2015/ng-nest-ui-drawer.js.map +1 -1
- package/fesm2015/ng-nest-ui-dropdown.js +4 -3
- package/fesm2015/ng-nest-ui-dropdown.js.map +1 -1
- package/fesm2015/ng-nest-ui-find.js +34 -8
- package/fesm2015/ng-nest-ui-find.js.map +1 -1
- package/fesm2015/ng-nest-ui-form.js +7 -11
- package/fesm2015/ng-nest-ui-form.js.map +1 -1
- package/fesm2015/ng-nest-ui-highlight.js +2 -1
- package/fesm2015/ng-nest-ui-highlight.js.map +1 -1
- package/fesm2015/ng-nest-ui-i18n.js +2 -1
- package/fesm2015/ng-nest-ui-i18n.js.map +1 -1
- package/fesm2015/ng-nest-ui-icon.js +3 -2
- package/fesm2015/ng-nest-ui-icon.js.map +1 -1
- package/fesm2015/ng-nest-ui-inner.js +1 -1
- package/fesm2015/ng-nest-ui-inner.js.map +1 -1
- package/fesm2015/ng-nest-ui-input.js +9 -7
- package/fesm2015/ng-nest-ui-input.js.map +1 -1
- package/fesm2015/ng-nest-ui-list.js +4 -3
- package/fesm2015/ng-nest-ui-list.js.map +1 -1
- package/fesm2015/ng-nest-ui-loading.js +2 -1
- package/fesm2015/ng-nest-ui-loading.js.map +1 -1
- package/fesm2015/ng-nest-ui-menu.js +6 -6
- package/fesm2015/ng-nest-ui-menu.js.map +1 -1
- package/fesm2015/ng-nest-ui-message-box.js +22 -24
- package/fesm2015/ng-nest-ui-message-box.js.map +1 -1
- package/fesm2015/ng-nest-ui-message.js +51 -18
- package/fesm2015/ng-nest-ui-message.js.map +1 -1
- package/fesm2015/ng-nest-ui-notification.js +1 -1
- package/fesm2015/ng-nest-ui-notification.js.map +1 -1
- package/fesm2015/ng-nest-ui-pagination.js +3 -2
- package/fesm2015/ng-nest-ui-pagination.js.map +1 -1
- package/fesm2015/ng-nest-ui-popconfirm.js +33 -5
- package/fesm2015/ng-nest-ui-popconfirm.js.map +1 -1
- package/fesm2015/ng-nest-ui-popover.js +15 -3
- package/fesm2015/ng-nest-ui-popover.js.map +1 -1
- package/fesm2015/ng-nest-ui-portal.js +10 -10
- package/fesm2015/ng-nest-ui-portal.js.map +1 -1
- package/fesm2015/ng-nest-ui-progress.js +226 -17
- package/fesm2015/ng-nest-ui-progress.js.map +1 -1
- package/fesm2015/ng-nest-ui-radio.js +3 -2
- package/fesm2015/ng-nest-ui-radio.js.map +1 -1
- package/fesm2015/ng-nest-ui-rate.js +5 -5
- package/fesm2015/ng-nest-ui-rate.js.map +1 -1
- package/fesm2015/ng-nest-ui-ripple.js.map +1 -1
- package/fesm2015/ng-nest-ui-select.js +7 -6
- package/fesm2015/ng-nest-ui-select.js.map +1 -1
- package/fesm2015/ng-nest-ui-skeleton.js +2 -1
- package/fesm2015/ng-nest-ui-skeleton.js.map +1 -1
- package/fesm2015/ng-nest-ui-slider.js +7 -8
- package/fesm2015/ng-nest-ui-slider.js.map +1 -1
- package/fesm2015/ng-nest-ui-statistic.js +6 -4
- package/fesm2015/ng-nest-ui-statistic.js.map +1 -1
- package/fesm2015/ng-nest-ui-steps.js +24 -11
- package/fesm2015/ng-nest-ui-steps.js.map +1 -1
- package/fesm2015/ng-nest-ui-table.js +13 -10
- package/fesm2015/ng-nest-ui-table.js.map +1 -1
- package/fesm2015/ng-nest-ui-tabs.js +5 -4
- package/fesm2015/ng-nest-ui-tabs.js.map +1 -1
- package/fesm2015/ng-nest-ui-tag.js +2 -1
- package/fesm2015/ng-nest-ui-tag.js.map +1 -1
- package/fesm2015/ng-nest-ui-text-retract.js +2 -1
- package/fesm2015/ng-nest-ui-text-retract.js.map +1 -1
- package/fesm2015/ng-nest-ui-textarea.js +3 -12
- package/fesm2015/ng-nest-ui-textarea.js.map +1 -1
- package/fesm2015/ng-nest-ui-theme.js +2 -2
- package/fesm2015/ng-nest-ui-theme.js.map +1 -1
- package/fesm2015/ng-nest-ui-time-picker.js +33 -16
- package/fesm2015/ng-nest-ui-time-picker.js.map +1 -1
- package/fesm2015/ng-nest-ui-timeline.js +3 -2
- package/fesm2015/ng-nest-ui-timeline.js.map +1 -1
- package/fesm2015/ng-nest-ui-tooltip.js +3 -2
- package/fesm2015/ng-nest-ui-tooltip.js.map +1 -1
- package/fesm2015/ng-nest-ui-transfer.js +3 -2
- package/fesm2015/ng-nest-ui-transfer.js.map +1 -1
- package/fesm2015/ng-nest-ui-tree.js +8 -7
- package/fesm2015/ng-nest-ui-tree.js.map +1 -1
- package/fesm2015/ng-nest-ui-upload.js +5 -4
- package/fesm2015/ng-nest-ui-upload.js.map +1 -1
- package/find/find.component.d.ts +1 -1
- package/find/find.property.d.ts +31 -1
- package/form/control.component.d.ts +1 -1
- package/form/form.component.d.ts +1 -1
- package/form/form.property.d.ts +6 -6
- package/inner/inner.component.d.ts +1 -1
- package/input/input-group.component.d.ts +2 -4
- package/list/list.component.d.ts +2 -2
- package/menu/menu.component.d.ts +1 -1
- package/message/message-ref.d.ts +8 -0
- package/message/message.component.d.ts +3 -3
- package/message/message.property.d.ts +24 -4
- package/message/message.service.d.ts +4 -1
- package/message/public-api.d.ts +1 -0
- package/message-box/message-box.component.d.ts +2 -1
- package/notification/notification.component.d.ts +1 -1
- package/package.json +1 -1
- package/pagination/pagination.component.d.ts +1 -1
- package/popconfirm/popconfirm.component.d.ts +6 -2
- package/popconfirm/popconfirm.property.d.ts +13 -2
- package/popover/popover.property.d.ts +6 -1
- package/portal/portal.module.d.ts +1 -1
- package/portal/portal.service.d.ts +2 -3
- package/progress/progress.component.d.ts +31 -3
- package/progress/progress.property.d.ts +80 -5
- package/radio/radio.component.d.ts +1 -1
- package/rate/rate.component.d.ts +5 -5
- package/select/select-portal.component.d.ts +1 -3
- package/select/select.component.d.ts +1 -1
- package/slider/slider.component.d.ts +1 -1
- package/steps/steps.component.d.ts +1 -1
- package/steps/steps.property.d.ts +7 -2
- package/table/table-body.component.d.ts +1 -1
- package/table/table-head.component.d.ts +1 -1
- package/table/table.component.d.ts +1 -1
- package/table/table.property.d.ts +11 -1
- package/textarea/textarea.property.d.ts +1 -6
- package/theme/theme.component.d.ts +1 -1
- package/time-picker/time-picker-frame.component.d.ts +1 -0
- package/time-picker/time-picker-portal.component.d.ts +1 -3
- package/time-picker/time-picker.component.d.ts +5 -3
- package/timeline/timeline.component.d.ts +1 -1
- package/transfer/transfer.component.d.ts +1 -1
- package/tree/tree-node.component.d.ts +1 -1
- package/tree/tree.component.d.ts +1 -1
- package/upload/upload.component.d.ts +3 -3
|
@@ -1,8 +1,8 @@
|
|
|
1
|
+
import { __decorate, __rest } from 'tslib';
|
|
1
2
|
import * as i0 from '@angular/core';
|
|
2
3
|
import { Component, Input, ViewEncapsulation, ChangeDetectionStrategy, NgModule } from '@angular/core';
|
|
3
|
-
import { __decorate } from 'tslib';
|
|
4
4
|
import * as i1 from '@ng-nest/ui/core';
|
|
5
|
-
import { XProperty, XInputNumber, XWithConfig, XInputBoolean, XIsChange, XIsEmpty, XIsString, XIsObjectArray, XIsFunction } from '@ng-nest/ui/core';
|
|
5
|
+
import { XProperty, XInputNumber, XWithConfig, XInputBoolean, XIsNumber, XIsChange, XIsEmpty, XIsString, XIsObjectArray, XIsFunction } from '@ng-nest/ui/core';
|
|
6
6
|
import * as i2 from '@ng-nest/ui/icon';
|
|
7
7
|
import { XIconModule } from '@ng-nest/ui/icon';
|
|
8
8
|
import * as i3 from '@angular/common';
|
|
@@ -22,6 +22,11 @@ const X_CONFIG_NAME = 'progress';
|
|
|
22
22
|
class XProgressProperty extends XProperty {
|
|
23
23
|
constructor() {
|
|
24
24
|
super(...arguments);
|
|
25
|
+
/**
|
|
26
|
+
* @zh_CN 进度条类型
|
|
27
|
+
* @en_US Progress bar type
|
|
28
|
+
*/
|
|
29
|
+
this.type = 'line';
|
|
25
30
|
/**
|
|
26
31
|
* @zh_CN 显示进度 0-100
|
|
27
32
|
* @en_US Show progress 0-100
|
|
@@ -37,10 +42,25 @@ class XProgressProperty extends XProperty {
|
|
|
37
42
|
* @en_US Whether to display percentage text
|
|
38
43
|
*/
|
|
39
44
|
this.info = true;
|
|
45
|
+
/**
|
|
46
|
+
* @zh_CN 圆环/仪表盘厚度
|
|
47
|
+
* @en_US Ring thickness
|
|
48
|
+
*/
|
|
49
|
+
this.thickness = '0.5rem';
|
|
50
|
+
/**
|
|
51
|
+
* @zh_CN 圆环/仪表盘尺寸
|
|
52
|
+
* @en_US Ring size
|
|
53
|
+
*/
|
|
54
|
+
this.size = '5rem';
|
|
55
|
+
/**
|
|
56
|
+
* @zh_CN 仪表盘缺口角度 0~300
|
|
57
|
+
* @en_US Dashboard notch angle
|
|
58
|
+
*/
|
|
59
|
+
this.notchAngle = 80;
|
|
40
60
|
}
|
|
41
61
|
}
|
|
42
62
|
/** @nocollapse */ XProgressProperty.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: XProgressProperty, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
43
|
-
/** @nocollapse */ XProgressProperty.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.0.5", type: XProgressProperty, selector: "ng-component", inputs: { percent: "percent", height: "height", status: "status", info: "info", inside: "inside", format: "format", color: "color" }, usesInheritance: true, ngImport: i0, template: '', isInline: true });
|
|
63
|
+
/** @nocollapse */ XProgressProperty.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.0.5", type: XProgressProperty, selector: "ng-component", inputs: { type: "type", percent: "percent", height: "height", status: "status", info: "info", inside: "inside", format: "format", color: "color", gradient: "gradient", steps: "steps", stepWidth: "stepWidth", stepFlex: "stepFlex", thickness: "thickness", size: "size", notchAngle: "notchAngle", subsection: "subsection" }, usesInheritance: true, ngImport: i0, template: '', isInline: true });
|
|
44
64
|
__decorate([
|
|
45
65
|
XInputNumber()
|
|
46
66
|
], XProgressProperty.prototype, "percent", void 0);
|
|
@@ -53,10 +73,21 @@ __decorate([
|
|
|
53
73
|
__decorate([
|
|
54
74
|
XInputBoolean()
|
|
55
75
|
], XProgressProperty.prototype, "inside", void 0);
|
|
76
|
+
__decorate([
|
|
77
|
+
XWithConfig(X_CONFIG_NAME, '1rem')
|
|
78
|
+
], XProgressProperty.prototype, "stepWidth", void 0);
|
|
79
|
+
__decorate([
|
|
80
|
+
XInputBoolean()
|
|
81
|
+
], XProgressProperty.prototype, "stepFlex", void 0);
|
|
82
|
+
__decorate([
|
|
83
|
+
XInputBoolean()
|
|
84
|
+
], XProgressProperty.prototype, "subsection", void 0);
|
|
56
85
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: XProgressProperty, decorators: [{
|
|
57
86
|
type: Component,
|
|
58
87
|
args: [{ template: '' }]
|
|
59
|
-
}], propDecorators: {
|
|
88
|
+
}], propDecorators: { type: [{
|
|
89
|
+
type: Input
|
|
90
|
+
}], percent: [{
|
|
60
91
|
type: Input
|
|
61
92
|
}], height: [{
|
|
62
93
|
type: Input
|
|
@@ -70,6 +101,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.5", ngImpor
|
|
|
70
101
|
type: Input
|
|
71
102
|
}], color: [{
|
|
72
103
|
type: Input
|
|
104
|
+
}], gradient: [{
|
|
105
|
+
type: Input
|
|
106
|
+
}], steps: [{
|
|
107
|
+
type: Input
|
|
108
|
+
}], stepWidth: [{
|
|
109
|
+
type: Input
|
|
110
|
+
}], stepFlex: [{
|
|
111
|
+
type: Input
|
|
112
|
+
}], thickness: [{
|
|
113
|
+
type: Input
|
|
114
|
+
}], size: [{
|
|
115
|
+
type: Input
|
|
116
|
+
}], notchAngle: [{
|
|
117
|
+
type: Input
|
|
118
|
+
}], subsection: [{
|
|
119
|
+
type: Input
|
|
73
120
|
}] } });
|
|
74
121
|
|
|
75
122
|
class XProgressComponent extends XProgressProperty {
|
|
@@ -79,29 +126,42 @@ class XProgressComponent extends XProgressProperty {
|
|
|
79
126
|
this.elementRef = elementRef;
|
|
80
127
|
this.cdr = cdr;
|
|
81
128
|
this.configService = configService;
|
|
129
|
+
this.stepsArray = [];
|
|
130
|
+
}
|
|
131
|
+
get maskWidth() {
|
|
132
|
+
return XIsNumber(this.percent) ? 100 - Number(this.percent) : 100;
|
|
82
133
|
}
|
|
83
|
-
ngOnInit() { }
|
|
84
134
|
ngOnChanges(simples) {
|
|
85
|
-
|
|
86
|
-
XIsChange(
|
|
135
|
+
const { status, percent, gradient, steps, type, notchAngle } = simples;
|
|
136
|
+
XIsChange(type, status) && this.setClassMap();
|
|
137
|
+
XIsChange(percent) && this.setColor();
|
|
138
|
+
XIsChange(gradient) && this.setGradient();
|
|
139
|
+
XIsChange(steps, percent) && this.setSteps();
|
|
140
|
+
XIsChange(type, percent, notchAngle) && this.setType();
|
|
87
141
|
}
|
|
88
142
|
setClassMap() {
|
|
89
143
|
this.classMap = {
|
|
90
144
|
[`${XProgressPrefix}-${this.status}`]: true,
|
|
145
|
+
[`${XProgressPrefix}-${this.type}`]: true,
|
|
91
146
|
[`${XProgressPrefix}-inside`]: Boolean(this.inside)
|
|
92
147
|
};
|
|
93
148
|
}
|
|
94
149
|
setColor() {
|
|
95
|
-
if (
|
|
96
|
-
|
|
97
|
-
if (XIsString(this.color)) {
|
|
98
|
-
this.currentColor = this.color;
|
|
150
|
+
if (this.subsection) {
|
|
151
|
+
this.setSubLinearGradient();
|
|
99
152
|
}
|
|
100
|
-
else
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
153
|
+
else {
|
|
154
|
+
if (XIsEmpty(this.color))
|
|
155
|
+
return;
|
|
156
|
+
if (XIsString(this.color)) {
|
|
157
|
+
this.currentColor = this.color;
|
|
158
|
+
}
|
|
159
|
+
else if (XIsObjectArray(this.color)) {
|
|
160
|
+
this.currentColor = this.getLevelColor(this.percent);
|
|
161
|
+
}
|
|
162
|
+
else if (XIsFunction(this.color)) {
|
|
163
|
+
this.currentColor = this.color(this.percent);
|
|
164
|
+
}
|
|
105
165
|
}
|
|
106
166
|
}
|
|
107
167
|
getLevelColor(percent) {
|
|
@@ -113,12 +173,161 @@ class XProgressComponent extends XProgressProperty {
|
|
|
113
173
|
}
|
|
114
174
|
return colors[colors.length - 1].color;
|
|
115
175
|
}
|
|
176
|
+
setGradient() {
|
|
177
|
+
if (this.subsection)
|
|
178
|
+
return;
|
|
179
|
+
if (XIsEmpty(this.gradient)) {
|
|
180
|
+
this.linearGradient = '';
|
|
181
|
+
}
|
|
182
|
+
else {
|
|
183
|
+
const _a = this.gradient || {}, { from, to, direction = 'to right' } = _a, percents = __rest(_a, ["from", "to", "direction"]);
|
|
184
|
+
if (Object.keys(percents).length !== 0) {
|
|
185
|
+
this.linearGradient = `linear-gradient(${direction}, ${this.sortGradient(percents).map(({ key, value }) => `${value} ${key}%`)})`;
|
|
186
|
+
return;
|
|
187
|
+
}
|
|
188
|
+
this.linearGradient = `linear-gradient(${direction}, ${from}, ${to})`;
|
|
189
|
+
}
|
|
190
|
+
}
|
|
191
|
+
sortGradient(percents) {
|
|
192
|
+
let arr = [];
|
|
193
|
+
Object.keys(percents).forEach((key) => {
|
|
194
|
+
const value = percents[key];
|
|
195
|
+
const numKey = +key.replace('%', '');
|
|
196
|
+
if (!isNaN(numKey)) {
|
|
197
|
+
arr.push({ key: numKey, value });
|
|
198
|
+
}
|
|
199
|
+
});
|
|
200
|
+
return arr.sort((a, b) => a.key - b.key);
|
|
201
|
+
}
|
|
202
|
+
setSubLinearGradient() {
|
|
203
|
+
let colors = this.color;
|
|
204
|
+
if (!colors || colors.length <= 0) {
|
|
205
|
+
this.subLinearGradient = `linear-gradient(to right, var(--x-primary) 0%, var(--x-primary) 100%)`;
|
|
206
|
+
return;
|
|
207
|
+
}
|
|
208
|
+
else if (colors.length === 1) {
|
|
209
|
+
colors.push({ percent: 100, color: 'var(--x-primary)' });
|
|
210
|
+
}
|
|
211
|
+
colors = colors.sort((a, b) => a.percent - b.percent);
|
|
212
|
+
let lgs = [];
|
|
213
|
+
colors.reduce((a, b, index) => {
|
|
214
|
+
if (index === 1 && a.percent > 0) {
|
|
215
|
+
lgs.push(`${a.color} 0%, ${a.color} ${a.percent}%`);
|
|
216
|
+
}
|
|
217
|
+
lgs.push(`${b.color} ${a.percent}%, ${b.color} ${b.percent}%`);
|
|
218
|
+
if (index === colors.length - 1 && b.percent < 100) {
|
|
219
|
+
lgs.push(`var(--x-primary) ${b.percent}%, var(--x-primary) 100%`);
|
|
220
|
+
}
|
|
221
|
+
return b;
|
|
222
|
+
});
|
|
223
|
+
this.subLinearGradient = `linear-gradient(to right,${lgs.join(',')})`;
|
|
224
|
+
}
|
|
225
|
+
setSteps() {
|
|
226
|
+
if (XIsEmpty(this.steps)) {
|
|
227
|
+
this.stepsArray = [];
|
|
228
|
+
}
|
|
229
|
+
else {
|
|
230
|
+
const critical = Math.ceil((Number(this.percent) / 100) * this.steps);
|
|
231
|
+
this.stepsArray = Array.from({ length: this.steps }).map((_, index) => index + 1 <= critical);
|
|
232
|
+
}
|
|
233
|
+
}
|
|
234
|
+
setType() {
|
|
235
|
+
if (this.type === 'circle') {
|
|
236
|
+
this.setCircleClipPath();
|
|
237
|
+
}
|
|
238
|
+
else if (this.type === 'dashboard') {
|
|
239
|
+
this.setDashboardClipPath();
|
|
240
|
+
}
|
|
241
|
+
}
|
|
242
|
+
/**
|
|
243
|
+
* circle �е� 100% ���� clip-path �е� 400%
|
|
244
|
+
*/
|
|
245
|
+
setCircleClipPath() {
|
|
246
|
+
let value = Number(this.percent) * 4;
|
|
247
|
+
let k1 = 'polygon(50% 50%,50% 0%,';
|
|
248
|
+
let k2 = k1 + '100% 0%,';
|
|
249
|
+
let k3 = k2 + '100% 100%,';
|
|
250
|
+
let k4 = k3 + '0% 100%,';
|
|
251
|
+
let k5 = k4 + '0% 0%,';
|
|
252
|
+
if (value <= 50) {
|
|
253
|
+
value += 50;
|
|
254
|
+
this.circleClipPath = `${k1}${value}% 0%)`;
|
|
255
|
+
}
|
|
256
|
+
else if (value > 50 && value <= 150) {
|
|
257
|
+
value -= 50;
|
|
258
|
+
this.circleClipPath = `${k2}100% ${value}%)`;
|
|
259
|
+
}
|
|
260
|
+
else if (value > 150 && value <= 250) {
|
|
261
|
+
value = 250 - value;
|
|
262
|
+
this.circleClipPath = `${k3}${value}% 100%)`;
|
|
263
|
+
}
|
|
264
|
+
else if (value > 250 && value <= 350) {
|
|
265
|
+
value = 350 - value;
|
|
266
|
+
this.circleClipPath = `${k4}0% ${value}%)`;
|
|
267
|
+
}
|
|
268
|
+
else if (value > 350 && value <= 400) {
|
|
269
|
+
value -= 350;
|
|
270
|
+
this.circleClipPath = `${k5}${value}% 0%)`;
|
|
271
|
+
}
|
|
272
|
+
}
|
|
273
|
+
/**
|
|
274
|
+
*
|
|
275
|
+
* 90 polygon(50% 50%, 0% 100%, 0% 0%, 100% 0%, 100% 100%);
|
|
276
|
+
* 180 polygon(50% 50%, 0% 50%, 0% 0%, 100% 0%, 100% 50%);
|
|
277
|
+
* 270 polygon(50% 50%, 0% 0%, 100% 0%);
|
|
278
|
+
*/
|
|
279
|
+
setDashboardClipPath() {
|
|
280
|
+
let railValue = (Number(this.notchAngle) / 360) * 50 * 4;
|
|
281
|
+
let k1 = `polygon(50% 50%,`;
|
|
282
|
+
let start = '';
|
|
283
|
+
let per = 0;
|
|
284
|
+
if (railValue <= 50) {
|
|
285
|
+
per = 50 - railValue;
|
|
286
|
+
start = `${k1} ${per}% 100%`;
|
|
287
|
+
this.dashboardRailClipPath = `${start}, 0% 100%, 0% 0%, 100% 0%, 100% 100%, ${100 - per}% 100%)`;
|
|
288
|
+
}
|
|
289
|
+
else if (railValue > 50 && railValue <= 150) {
|
|
290
|
+
per = 150 - railValue;
|
|
291
|
+
start = `${k1} 0% ${per}%`;
|
|
292
|
+
this.dashboardRailClipPath = `${start}, 0% 0%, 100% 0%, 100% ${per}%)`;
|
|
293
|
+
}
|
|
294
|
+
else if (railValue > 150 && railValue <= 250) {
|
|
295
|
+
per = railValue - 150;
|
|
296
|
+
start = `${k1} ${per}% 0%`;
|
|
297
|
+
this.dashboardRailClipPath = `${start}, ${100 - per}% 0%)`;
|
|
298
|
+
}
|
|
299
|
+
this.setCircleClipPathValue(start, railValue);
|
|
300
|
+
}
|
|
301
|
+
setCircleClipPathValue(start, railValue) {
|
|
302
|
+
let value = ((400 - railValue * 2) / 100) * Number(this.percent);
|
|
303
|
+
let val = value + railValue;
|
|
304
|
+
if (val <= 50) {
|
|
305
|
+
val = 50 - val;
|
|
306
|
+
this.dashboardClipPath = `${start}, ${val}% 100%)`;
|
|
307
|
+
}
|
|
308
|
+
else if (val > 50 && val <= 150) {
|
|
309
|
+
val = 150 - val;
|
|
310
|
+
this.dashboardClipPath = `${start}, 0% 100%, 0% ${val}%)`;
|
|
311
|
+
}
|
|
312
|
+
else if (val > 150 && val <= 250) {
|
|
313
|
+
val = val - 150;
|
|
314
|
+
this.dashboardClipPath = `${start}, 0% 100%, 0% 0%, ${val}% 0%)`;
|
|
315
|
+
}
|
|
316
|
+
else if (val > 250 && val <= 350) {
|
|
317
|
+
val = val - 250;
|
|
318
|
+
this.dashboardClipPath = `${start}, 0% 100%, 0% 0%, 100% 0%, 100% ${val}%)`;
|
|
319
|
+
}
|
|
320
|
+
else if (val > 350 && val <= 400) {
|
|
321
|
+
val = 100 - (val - 350);
|
|
322
|
+
this.dashboardClipPath = `${start}, 0% 100%, 0% 0%, 100% 0%, 100% 100%, ${val}% 100%)`;
|
|
323
|
+
}
|
|
324
|
+
}
|
|
116
325
|
onFormat(percent) {
|
|
117
326
|
return this.format && this.format(percent);
|
|
118
327
|
}
|
|
119
328
|
}
|
|
120
329
|
/** @nocollapse */ XProgressComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: XProgressComponent, deps: [{ token: i0.Renderer2 }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: i1.XConfigService }], target: i0.ɵɵFactoryTarget.Component });
|
|
121
|
-
/** @nocollapse */ XProgressComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.0.5", type: XProgressComponent, selector: "x-progress", usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div
|
|
330
|
+
/** @nocollapse */ XProgressComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "12.0.5", type: XProgressComponent, selector: "x-progress", usesInheritance: true, usesOnChanges: true, ngImport: i0, template: "<div\r\n class=\"x-progress\"\r\n [ngClass]=\"classMap\"\r\n [class.x-progress-steps]=\"stepsArray.length > 0\"\r\n [class.x-progress-steps-flex]=\"stepFlex\"\r\n [ngSwitch]=\"type\"\r\n>\r\n <ng-container *ngSwitchCase=\"'circle'\">\r\n <ng-container *ngTemplateOutlet=\"circleTpl\"> </ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'dashboard'\">\r\n <ng-container *ngTemplateOutlet=\"dashboardTpl\"> </ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchDefault>\r\n <ng-container *ngTemplateOutlet=\"lineTpl\"> </ng-container>\r\n </ng-container>\r\n</div>\r\n\r\n<ng-template #lineTpl>\r\n <ng-container *ngIf=\"stepsArray.length === 0\">\r\n <ng-container *ngTemplateOutlet=\"trackTpl\"></ng-container>\r\n </ng-container>\r\n <ng-container *ngIf=\"stepsArray.length > 0\">\r\n <ng-container *ngTemplateOutlet=\"stepsTpl\"></ng-container>\r\n </ng-container>\r\n <ng-container *ngIf=\"info && !inside\">\r\n <ng-container *ngTemplateOutlet=\"textTpl\"></ng-container>\r\n </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #circleTpl>\r\n <div class=\"x-progress-ring\" [style.width]=\"size\" [style.height]=\"size\">\r\n <div class=\"x-progress-ring-rail\" [style.border-width]=\"thickness\"></div>\r\n <div\r\n class=\"x-progress-ring-bg\"\r\n [style.clip-path]=\"circleClipPath\"\r\n [style.background-color]=\"currentColor\"\r\n [style.border-width]=\"thickness\"\r\n ></div>\r\n <ng-container *ngTemplateOutlet=\"textTpl\"></ng-container>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #dashboardTpl>\r\n <div class=\"x-progress-ring\" [style.width]=\"size\" [style.height]=\"size\">\r\n <div class=\"x-progress-ring-rail\" [style.clip-path]=\"dashboardRailClipPath\" [style.border-width]=\"thickness\"></div>\r\n <div\r\n class=\"x-progress-ring-bg\"\r\n [style.clip-path]=\"dashboardClipPath\"\r\n [style.background-color]=\"currentColor\"\r\n [style.border-width]=\"thickness\"\r\n ></div>\r\n <ng-container *ngTemplateOutlet=\"textTpl\"></ng-container>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #trackTpl>\r\n <div class=\"x-progress-track\">\r\n <div class=\"x-progress-rail\" [class.x-progress-mask]=\"subsection\" [style.background-image]=\"subsection ? subLinearGradient : 'none'\">\r\n <div\r\n class=\"x-progress-bg\"\r\n [style.width.%]=\"percent\"\r\n [style.background-color]=\"currentColor\"\r\n [style.background-image]=\"linearGradient\"\r\n [style.height]=\"height\"\r\n [style.line-height]=\"height\"\r\n >\r\n <ng-container *ngIf=\"info && inside\">\r\n <ng-container *ngTemplateOutlet=\"textTpl\"></ng-container>\r\n </ng-container>\r\n </div>\r\n <div\r\n *ngIf=\"subsection\"\r\n class=\"x-progress-bg-mask\"\r\n [style.width.%]=\"maskWidth\"\r\n [style.height]=\"height\"\r\n [style.line-height]=\"height\"\r\n ></div>\r\n </div>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #stepsTpl>\r\n <div\r\n *ngFor=\"let step of stepsArray\"\r\n class=\"x-progress-step\"\r\n [class.x-progress-step-active]=\"step\"\r\n [style.background-color]=\"currentColor\"\r\n [style.width]=\"stepWidth\"\r\n [style.flex]=\"stepFlex ? 1 : 'none'\"\r\n [style.height]=\"height\"\r\n [style.line-height]=\"height\"\r\n ></div>\r\n</ng-template>\r\n\r\n<ng-template #textTpl>\r\n <span class=\"x-progress-text\" [ngSwitch]=\"status\">\r\n <ng-container *ngSwitchCase=\"'success'\">\r\n <x-icon type=\"fto-check-circle\"></x-icon>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'exception'\">\r\n <x-icon type=\"fto-x-circle\"></x-icon>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'warning'\">\r\n <x-icon type=\"fto-help-circle\"></x-icon>\r\n </ng-container>\r\n <ng-container *ngSwitchDefault>\r\n <ng-container *ngIf=\"format; else defaultTemp\">{{ onFormat(percent) }}</ng-container>\r\n <ng-template #defaultTemp>{{ percent }}%</ng-template>\r\n </ng-container>\r\n </span>\r\n</ng-template>\r\n", styles: ["@keyframes x-progress-active{0%{width:0;opacity:.1}20%{width:0;opacity:.5}to{width:100%;opacity:0}}x-progress{display:initial}.x-progress{margin:0;padding:0;display:inline-flex;align-items:center;width:100%}.x-progress-track{width:100%;display:inline-flex;align-items:center}.x-progress-rail{position:relative;display:inline-flex;width:100%;overflow:hidden;vertical-align:middle;background-color:var(--x-border-100);border-radius:var(--x-border-radius)}.x-progress-bg{position:relative;background-color:var(--x-primary);transition:width .3s cubic-bezier(.08,.82,.17,1) 0s;border-radius:var(--x-border-radius);text-align:right;color:#fff}.x-progress-bg>span{margin:0 .325rem}.x-progress-circle,.x-progress-dashboard,.x-progress-steps:not(.x-progress-steps-flex){width:initial}.x-progress-ring{position:relative;display:inline-flex;align-items:center;justify-content:center}.x-progress-ring-rail{position:absolute;width:100%;height:100%;border-style:solid;border-color:var(--x-border-100);border-radius:100%}.x-progress-ring-bg{position:absolute;width:100%;height:100%;border-style:solid;border-color:var(--x-primary);border-radius:100%;transition:-webkit-clip-path .3s cubic-bezier(.08,.82,.17,1) 0s;transition:clip-path .3s cubic-bezier(.08,.82,.17,1) 0s;transition:clip-path .3s cubic-bezier(.08,.82,.17,1) 0s,-webkit-clip-path .3s cubic-bezier(.08,.82,.17,1) 0s}.x-progress-ring .x-progress-text{margin-left:0;justify-content:center;font-size:var(--x-font-size-large)}.x-progress-mask .x-progress-bg{background:transparent}.x-progress-bg-mask{transition:width .3s cubic-bezier(.08,.82,.17,1) 0s;background-color:var(--x-border-100);border-top-right-radius:var(--x-border-radius);border-bottom-right-radius:var(--x-border-radius)}.x-progress-step{background-color:var(--x-border-100);border-radius:var(--x-border-radius)}.x-progress-step:not(:first-child){margin-left:.125rem}.x-progress-step-active{background-color:var(--x-primary)}.x-progress-text{margin-left:.5rem;width:3.25rem;display:inline-flex;align-items:center;white-space:nowrap}.x-progress-active .x-progress-bg:before{position:absolute;top:0;right:0;bottom:0;left:0;background:var(--x-background-100);border-radius:var(--x-border-radius);opacity:0;animation:x-progress-active 2s cubic-bezier(.23,1,.32,1) infinite;content:\"\"}.x-progress-exception .x-progress-text{color:var(--x-danger)}.x-progress-exception .x-progress-bg,.x-progress-exception .x-progress-step-active{background-color:var(--x-danger)}.x-progress-exception .x-progress-ring-bg{border-color:var(--x-danger)}.x-progress-success .x-progress-text{color:var(--x-success)}.x-progress-success .x-progress-bg,.x-progress-success .x-progress-step-active{background-color:var(--x-success)}.x-progress-success .x-progress-ring-bg{border-color:var(--x-success)}.x-progress-warning .x-progress-text{color:var(--x-warning)}.x-progress-warning .x-progress-bg,.x-progress-warning .x-progress-step-active{background-color:var(--x-warning)}.x-progress-warning .x-progress-ring-bg{border-color:var(--x-warning)}\n"], components: [{ type: i2.XIconComponent, selector: "x-icon" }], directives: [{ type: i3.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i3.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i3.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: i3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i3.NgSwitchDefault, selector: "[ngSwitchDefault]" }, { type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
122
331
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "12.0.5", ngImport: i0, type: XProgressComponent, decorators: [{
|
|
123
332
|
type: Component,
|
|
124
333
|
args: [{
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ng-nest-ui-progress.js","sources":["../../../../lib/ng-nest/ui/progress/progress.property.ts","../../../../lib/ng-nest/ui/progress/progress.component.ts","../../../../lib/ng-nest/ui/progress/progress.component.html","../../../../lib/ng-nest/ui/progress/progress.module.ts","../../../../lib/ng-nest/ui/progress/ng-nest-ui-progress.ts"],"sourcesContent":["import { Input, Component } from '@angular/core';\r\nimport { XInputNumber, XProperty, XInputBoolean, XNumber, XBoolean, XWithConfig } from '@ng-nest/ui/core';\r\n\r\n/**\r\n * Progress\r\n * @selector x-progress\r\n * @decorator component\r\n */\r\nexport const XProgressPrefix = 'x-progress';\r\nconst X_CONFIG_NAME = 'progress';\r\n\r\n/**\r\n * Progress Property\r\n */\r\n@Component({ template: '' })\r\nexport class XProgressProperty extends XProperty {\r\n /**\r\n * @zh_CN 显示进度 0-100\r\n * @en_US Show progress 0-100\r\n */\r\n @Input() @XInputNumber() percent: XNumber = 0;\r\n /**\r\n * @zh_CN 进度条高度\r\n * @en_US Height of progress bar\r\n */\r\n @Input() @XWithConfig<string>(X_CONFIG_NAME, '0.5rem') height?: string;\r\n /**\r\n * @zh_CN 状态\r\n * @en_US Status\r\n */\r\n @Input() status: XProgressStatus = 'normal';\r\n /**\r\n * @zh_CN 是否显示百分比文本\r\n * @en_US Whether to display percentage text\r\n */\r\n @Input() @XInputBoolean() info: XBoolean = true;\r\n /**\r\n * @zh_CN 百分比文本是否显示在进度条里面\r\n * @en_US Whether the percentage text is displayed in the progress bar\r\n */\r\n @Input() @XInputBoolean() inside?: XBoolean;\r\n /**\r\n * @zh_CN 自定义百分比文本内容\r\n * @en_US Custom percentage text content\r\n */\r\n @Input() format?: Function;\r\n /**\r\n * @zh_CN 自定义颜色\r\n * @en_US Custom color\r\n */\r\n @Input() color?: string | { color: string; percent: number }[] | Function;\r\n}\r\n\r\n/**\r\n * @zh_CN 进度条类型\r\n * @en_US Progress bar type\r\n */\r\nexport type XProgressType = 'line' | 'circle' | 'dashboard';\r\n\r\n/**\r\n * @zh_CN 状态\r\n * @en_US Status\r\n */\r\nexport type XProgressStatus = 'normal' | 'active' | 'success' | 'exception' | 'warning';\r\n","import {\r\n Component,\r\n OnInit,\r\n ViewEncapsulation,\r\n Renderer2,\r\n ElementRef,\r\n ChangeDetectorRef,\r\n ChangeDetectionStrategy,\r\n SimpleChanges,\r\n OnChanges\r\n} from '@angular/core';\r\nimport { XProgressPrefix, XProgressProperty } from './progress.property';\r\nimport { XIsFunction, XIsString, XIsObjectArray, XIsEmpty, XIsChange, XNumber, XConfigService } from '@ng-nest/ui/core';\r\n\r\n@Component({\r\n selector: `${XProgressPrefix}`,\r\n templateUrl: './progress.component.html',\r\n styleUrls: ['./progress.component.scss'],\r\n encapsulation: ViewEncapsulation.None,\r\n changeDetection: ChangeDetectionStrategy.OnPush\r\n})\r\nexport class XProgressComponent extends XProgressProperty implements OnInit, OnChanges {\r\n currentColor!: string;\r\n\r\n constructor(\r\n public renderer: Renderer2,\r\n public elementRef: ElementRef,\r\n public cdr: ChangeDetectorRef,\r\n public configService: XConfigService\r\n ) {\r\n super();\r\n }\r\n\r\n ngOnInit() {}\r\n\r\n ngOnChanges(simples: SimpleChanges) {\r\n XIsChange(simples.status) && this.setClassMap();\r\n XIsChange(simples.percent) && this.setColor();\r\n }\r\n\r\n setClassMap() {\r\n this.classMap = {\r\n [`${XProgressPrefix}-${this.status}`]: true,\r\n [`${XProgressPrefix}-inside`]: Boolean(this.inside)\r\n };\r\n }\r\n\r\n setColor() {\r\n if (XIsEmpty(this.color)) return;\r\n if (XIsString(this.color)) {\r\n this.currentColor = this.color as string;\r\n } else if (XIsObjectArray(this.color)) {\r\n this.currentColor = this.getLevelColor(this.percent);\r\n } else if (XIsFunction(this.color)) {\r\n this.currentColor = (this.color as Function)(this.percent);\r\n }\r\n }\r\n\r\n getLevelColor(percent: XNumber) {\r\n let colors = (this.color as { color: string; percent: number }[]).sort((a, b) => a.percent - b.percent);\r\n for (let i = 0; i < colors.length; i++) {\r\n if (colors[i].percent > Number(percent)) {\r\n return colors[i].color;\r\n }\r\n }\r\n return colors[colors.length - 1].color;\r\n }\r\n\r\n onFormat(percent: XNumber) {\r\n return this.format && this.format(percent);\r\n }\r\n}\r\n","<div class=\"x-progress\" [ngClass]=\"classMap\">\r\n <div class=\"x-progress-track\">\r\n <div class=\"x-progress-rail\">\r\n <div\r\n class=\"x-progress-bg\"\r\n [style.width.%]=\"percent\"\r\n [style.background-color]=\"currentColor\"\r\n [style.height]=\"height\"\r\n [style.line-height]=\"height\"\r\n >\r\n <span *ngIf=\"inside\">{{ percent }}%</span>\r\n </div>\r\n </div>\r\n </div>\r\n <span class=\"x-progress-text\" *ngIf=\"info && !inside\" [ngSwitch]=\"status\">\r\n <ng-container *ngSwitchCase=\"'success'\">\r\n <x-icon type=\"fto-check-circle\"></x-icon>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'exception'\">\r\n <x-icon type=\"fto-x-circle\"></x-icon>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'warning'\">\r\n <x-icon type=\"fto-help-circle\"></x-icon>\r\n </ng-container>\r\n <ng-container *ngSwitchDefault>\r\n <ng-container *ngIf=\"format; else defaultTemp\">{{ onFormat(percent) }}</ng-container>\r\n <ng-template #defaultTemp>{{ percent }}%</ng-template>\r\n </ng-container>\r\n </span>\r\n</div>\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { XProgressComponent } from './progress.component';\r\nimport { FormsModule } from '@angular/forms';\r\nimport { XIconModule } from '@ng-nest/ui/icon';\r\nimport { XProgressProperty } from './progress.property';\r\n\r\n@NgModule({\r\n declarations: [XProgressComponent, XProgressProperty],\r\n exports: [XProgressComponent],\r\n imports: [CommonModule, FormsModule, XIconModule]\r\n})\r\nexport class XProgressModule {}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"ng-nest-ui-progress.js","sources":["../../../../lib/ng-nest/ui/progress/progress.property.ts","../../../../lib/ng-nest/ui/progress/progress.component.ts","../../../../lib/ng-nest/ui/progress/progress.component.html","../../../../lib/ng-nest/ui/progress/progress.module.ts","../../../../lib/ng-nest/ui/progress/ng-nest-ui-progress.ts"],"sourcesContent":["import { Input, Component } from '@angular/core';\r\nimport { XInputNumber, XProperty, XInputBoolean, XNumber, XBoolean, XWithConfig } from '@ng-nest/ui/core';\r\n\r\n/**\r\n * Progress\r\n * @selector x-progress\r\n * @decorator component\r\n */\r\nexport const XProgressPrefix = 'x-progress';\r\nconst X_CONFIG_NAME = 'progress';\r\n\r\n/**\r\n * Progress Property\r\n */\r\n@Component({ template: '' })\r\nexport class XProgressProperty extends XProperty {\r\n /**\r\n * @zh_CN 进度条类型\r\n * @en_US Progress bar type\r\n */\r\n @Input() type: XProgressType = 'line';\r\n /**\r\n * @zh_CN 显示进度 0-100\r\n * @en_US Show progress 0-100\r\n */\r\n @Input() @XInputNumber() percent: XNumber = 0;\r\n /**\r\n * @zh_CN 进度条高度\r\n * @en_US Height of progress bar\r\n */\r\n @Input() @XWithConfig<string>(X_CONFIG_NAME, '0.5rem') height?: string;\r\n /**\r\n * @zh_CN 状态\r\n * @en_US Status\r\n */\r\n @Input() status: XProgressStatus = 'normal';\r\n /**\r\n * @zh_CN 是否显示百分比文本\r\n * @en_US Whether to display percentage text\r\n */\r\n @Input() @XInputBoolean() info: XBoolean = true;\r\n /**\r\n * @zh_CN 百分比文本是否显示在进度条里面\r\n * @en_US Whether the percentage text is displayed in the progress bar\r\n */\r\n @Input() @XInputBoolean() inside?: XBoolean;\r\n /**\r\n * @zh_CN 自定义百分比文本内容\r\n * @en_US Custom percentage text content\r\n */\r\n @Input() format?: Function;\r\n /**\r\n * @zh_CN 自定义颜色\r\n * @en_US Custom color\r\n */\r\n @Input() color?: XProgressColor;\r\n /**\r\n * @zh_CN 渐变颜色\r\n * @en_US Gradient color\r\n */\r\n @Input() gradient?: XProgressGradient;\r\n /**\r\n * @zh_CN 步骤进度条\r\n * @en_US Steps progress bar\r\n */\r\n @Input() steps?: number;\r\n /**\r\n * @zh_CN 单个步骤的宽度\r\n * @en_US Single step width\r\n */\r\n @Input() @XWithConfig<string>(X_CONFIG_NAME, '1rem') stepWidth?: string;\r\n /**\r\n * @zh_CN 单个步骤的宽度自适应\r\n * @en_US Single step width flex\r\n */\r\n @Input() @XInputBoolean() stepFlex?: XBoolean;\r\n /**\r\n * @zh_CN 圆环/仪表盘厚度\r\n * @en_US Ring thickness\r\n */\r\n @Input() thickness?: string = '0.5rem';\r\n /**\r\n * @zh_CN 圆环/仪表盘尺寸\r\n * @en_US Ring size\r\n */\r\n @Input() size?: string = '5rem';\r\n /**\r\n * @zh_CN 仪表盘缺口角度 0~300\r\n * @en_US Dashboard notch angle\r\n */\r\n @Input() notchAngle?: number = 80;\r\n /**\r\n * @zh_CN 分段显示颜色,只适用 type = 'line'\r\n * @en_US Segmentation display color, only use of type = 'line'\r\n */\r\n @Input() @XInputBoolean() subsection?: XBoolean;\r\n}\r\n\r\n/**\r\n * @zh_CN 进度条类型\r\n * @en_US Progress bar type\r\n */\r\nexport type XProgressType = 'line' | 'circle' | 'dashboard';\r\n\r\n/**\r\n * @zh_CN 进度条颜色\r\n * @en_US Progress bar color\r\n */\r\nexport type XProgressColor = string | XProgressColorNode[] | Function;\r\n\r\n/**\r\n * @zh_CN 进度条节点颜色\r\n * @en_US Progress bar node color\r\n */\r\nexport interface XProgressColorNode {\r\n /**\r\n * @zh_CN 颜色\r\n * @en_US Color\r\n */\r\n color: string;\r\n /**\r\n * @zh_CN 百分比\r\n * @en_US Percent\r\n */\r\n percent: number;\r\n}\r\n/**\r\n * @zh_CN 状态\r\n * @en_US Status\r\n */\r\nexport type XProgressStatus = 'normal' | 'active' | 'success' | 'exception' | 'warning';\r\n\r\n/**\r\n * @zh_CN 渐变颜色\r\n * @en_US Gradient color\r\n */\r\nexport type XProgressGradient = { direction?: string } & ({ from: string; to: string } | { [percent: string]: string });\r\n","import {\r\n Component,\r\n ViewEncapsulation,\r\n Renderer2,\r\n ElementRef,\r\n ChangeDetectorRef,\r\n ChangeDetectionStrategy,\r\n SimpleChanges,\r\n OnChanges\r\n} from '@angular/core';\r\nimport { XProgressPrefix, XProgressProperty } from './progress.property';\r\nimport {\r\n XIsFunction,\r\n XIsString,\r\n XIsObjectArray,\r\n XIsEmpty,\r\n XIsChange,\r\n XNumber,\r\n XConfigService,\r\n XIsNumber\r\n} from '@ng-nest/ui/core';\r\nimport { XProgressColorNode } from './progress.property';\r\n\r\n@Component({\r\n selector: `${XProgressPrefix}`,\r\n templateUrl: './progress.component.html',\r\n styleUrls: ['./progress.component.scss'],\r\n encapsulation: ViewEncapsulation.None,\r\n changeDetection: ChangeDetectionStrategy.OnPush\r\n})\r\nexport class XProgressComponent extends XProgressProperty implements OnChanges {\r\n currentColor!: string;\r\n linearGradient!: string;\r\n stepsArray: Array<boolean> = [];\r\n circleClipPath!: string;\r\n dashboardClipPath!: string;\r\n dashboardRailClipPath!: string;\r\n subLinearGradient!: string;\r\n\r\n get maskWidth() {\r\n return XIsNumber(this.percent) ? 100 - Number(this.percent) : 100;\r\n }\r\n\r\n constructor(\r\n public renderer: Renderer2,\r\n public elementRef: ElementRef,\r\n public cdr: ChangeDetectorRef,\r\n public configService: XConfigService\r\n ) {\r\n super();\r\n }\r\n\r\n ngOnChanges(simples: SimpleChanges) {\r\n const { status, percent, gradient, steps, type, notchAngle } = simples;\r\n XIsChange(type, status) && this.setClassMap();\r\n XIsChange(percent) && this.setColor();\r\n XIsChange(gradient) && this.setGradient();\r\n XIsChange(steps, percent) && this.setSteps();\r\n XIsChange(type, percent, notchAngle) && this.setType();\r\n }\r\n\r\n setClassMap() {\r\n this.classMap = {\r\n [`${XProgressPrefix}-${this.status}`]: true,\r\n [`${XProgressPrefix}-${this.type}`]: true,\r\n [`${XProgressPrefix}-inside`]: Boolean(this.inside)\r\n };\r\n }\r\n\r\n setColor() {\r\n if (this.subsection) {\r\n this.setSubLinearGradient();\r\n } else {\r\n if (XIsEmpty(this.color)) return;\r\n if (XIsString(this.color)) {\r\n this.currentColor = this.color as string;\r\n } else if (XIsObjectArray(this.color)) {\r\n this.currentColor = this.getLevelColor(this.percent);\r\n } else if (XIsFunction(this.color)) {\r\n this.currentColor = (this.color as Function)(this.percent);\r\n }\r\n }\r\n }\r\n\r\n getLevelColor(percent: XNumber) {\r\n let colors = (this.color as XProgressColorNode[]).sort((a, b) => a.percent - b.percent);\r\n for (let i = 0; i < colors.length; i++) {\r\n if (colors[i].percent > Number(percent)) {\r\n return colors[i].color;\r\n }\r\n }\r\n return colors[colors.length - 1].color;\r\n }\r\n\r\n setGradient() {\r\n if (this.subsection) return;\r\n if (XIsEmpty(this.gradient)) {\r\n this.linearGradient = '';\r\n } else {\r\n const { from, to, direction = 'to right', ...percents } = this.gradient || {};\r\n if (Object.keys(percents).length !== 0) {\r\n this.linearGradient = `linear-gradient(${direction}, ${this.sortGradient(percents as { [percent: string]: string }).map(\r\n ({ key, value }) => `${value} ${key}%`\r\n )})`;\r\n return;\r\n }\r\n this.linearGradient = `linear-gradient(${direction}, ${from}, ${to})`;\r\n }\r\n }\r\n\r\n sortGradient(percents: { [percent: string]: string }) {\r\n let arr: { key: number; value: string }[] = [];\r\n Object.keys(percents).forEach((key) => {\r\n const value = percents[key];\r\n const numKey = +key.replace('%', '');\r\n if (!isNaN(numKey)) {\r\n arr.push({ key: numKey, value });\r\n }\r\n });\r\n return arr.sort((a, b) => a.key - b.key);\r\n }\r\n\r\n setSubLinearGradient() {\r\n let colors = this.color as XProgressColorNode[];\r\n if (!colors || colors.length <= 0) {\r\n this.subLinearGradient = `linear-gradient(to right, var(--x-primary) 0%, var(--x-primary) 100%)`;\r\n return;\r\n } else if (colors.length === 1) {\r\n colors.push({ percent: 100, color: 'var(--x-primary)' });\r\n }\r\n colors = colors.sort((a, b) => a.percent - b.percent);\r\n let lgs: string[] = [];\r\n colors.reduce((a, b, index) => {\r\n if (index === 1 && a.percent > 0) {\r\n lgs.push(`${a.color} 0%, ${a.color} ${a.percent}%`);\r\n }\r\n lgs.push(`${b.color} ${a.percent}%, ${b.color} ${b.percent}%`);\r\n if (index === colors.length - 1 && b.percent < 100) {\r\n lgs.push(`var(--x-primary) ${b.percent}%, var(--x-primary) 100%`);\r\n }\r\n return b;\r\n });\r\n this.subLinearGradient = `linear-gradient(to right,${lgs.join(',')})`;\r\n }\r\n\r\n setSteps() {\r\n if (XIsEmpty(this.steps)) {\r\n this.stepsArray = [];\r\n } else {\r\n const critical = Math.ceil((Number(this.percent) / 100) * this.steps!);\r\n this.stepsArray = Array.from({ length: this.steps as number }).map((_, index) => index + 1 <= critical);\r\n }\r\n }\r\n\r\n setType() {\r\n if (this.type === 'circle') {\r\n this.setCircleClipPath();\r\n } else if (this.type === 'dashboard') {\r\n this.setDashboardClipPath();\r\n }\r\n }\r\n\r\n /**\r\n * circle �е� 100% ���� clip-path �е� 400%\r\n */\r\n setCircleClipPath() {\r\n let value = Number(this.percent) * 4;\r\n let k1 = 'polygon(50% 50%,50% 0%,';\r\n let k2 = k1 + '100% 0%,';\r\n let k3 = k2 + '100% 100%,';\r\n let k4 = k3 + '0% 100%,';\r\n let k5 = k4 + '0% 0%,';\r\n if (value <= 50) {\r\n value += 50;\r\n this.circleClipPath = `${k1}${value}% 0%)`;\r\n } else if (value > 50 && value <= 150) {\r\n value -= 50;\r\n this.circleClipPath = `${k2}100% ${value}%)`;\r\n } else if (value > 150 && value <= 250) {\r\n value = 250 - value;\r\n this.circleClipPath = `${k3}${value}% 100%)`;\r\n } else if (value > 250 && value <= 350) {\r\n value = 350 - value;\r\n this.circleClipPath = `${k4}0% ${value}%)`;\r\n } else if (value > 350 && value <= 400) {\r\n value -= 350;\r\n this.circleClipPath = `${k5}${value}% 0%)`;\r\n }\r\n }\r\n\r\n /**\r\n *\r\n * 90 polygon(50% 50%, 0% 100%, 0% 0%, 100% 0%, 100% 100%);\r\n * 180 polygon(50% 50%, 0% 50%, 0% 0%, 100% 0%, 100% 50%);\r\n * 270 polygon(50% 50%, 0% 0%, 100% 0%);\r\n */\r\n setDashboardClipPath() {\r\n let railValue = (Number(this.notchAngle) / 360) * 50 * 4;\r\n let k1 = `polygon(50% 50%,`;\r\n let start = '';\r\n let per = 0;\r\n if (railValue <= 50) {\r\n per = 50 - railValue;\r\n start = `${k1} ${per}% 100%`;\r\n this.dashboardRailClipPath = `${start}, 0% 100%, 0% 0%, 100% 0%, 100% 100%, ${100 - per}% 100%)`;\r\n } else if (railValue > 50 && railValue <= 150) {\r\n per = 150 - railValue;\r\n start = `${k1} 0% ${per}%`;\r\n this.dashboardRailClipPath = `${start}, 0% 0%, 100% 0%, 100% ${per}%)`;\r\n } else if (railValue > 150 && railValue <= 250) {\r\n per = railValue - 150;\r\n start = `${k1} ${per}% 0%`;\r\n this.dashboardRailClipPath = `${start}, ${100 - per}% 0%)`;\r\n }\r\n\r\n this.setCircleClipPathValue(start, railValue);\r\n }\r\n\r\n setCircleClipPathValue(start: string, railValue: number) {\r\n let value = ((400 - railValue * 2) / 100) * Number(this.percent);\r\n let val = value + railValue;\r\n if (val <= 50) {\r\n val = 50 - val;\r\n this.dashboardClipPath = `${start}, ${val}% 100%)`;\r\n } else if (val > 50 && val <= 150) {\r\n val = 150 - val;\r\n this.dashboardClipPath = `${start}, 0% 100%, 0% ${val}%)`;\r\n } else if (val > 150 && val <= 250) {\r\n val = val - 150;\r\n this.dashboardClipPath = `${start}, 0% 100%, 0% 0%, ${val}% 0%)`;\r\n } else if (val > 250 && val <= 350) {\r\n val = val - 250;\r\n this.dashboardClipPath = `${start}, 0% 100%, 0% 0%, 100% 0%, 100% ${val}%)`;\r\n } else if (val > 350 && val <= 400) {\r\n val = 100 - (val - 350);\r\n this.dashboardClipPath = `${start}, 0% 100%, 0% 0%, 100% 0%, 100% 100%, ${val}% 100%)`;\r\n }\r\n }\r\n\r\n onFormat(percent: XNumber) {\r\n return this.format && this.format(percent);\r\n }\r\n}\r\n","<div\r\n class=\"x-progress\"\r\n [ngClass]=\"classMap\"\r\n [class.x-progress-steps]=\"stepsArray.length > 0\"\r\n [class.x-progress-steps-flex]=\"stepFlex\"\r\n [ngSwitch]=\"type\"\r\n>\r\n <ng-container *ngSwitchCase=\"'circle'\">\r\n <ng-container *ngTemplateOutlet=\"circleTpl\"> </ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'dashboard'\">\r\n <ng-container *ngTemplateOutlet=\"dashboardTpl\"> </ng-container>\r\n </ng-container>\r\n <ng-container *ngSwitchDefault>\r\n <ng-container *ngTemplateOutlet=\"lineTpl\"> </ng-container>\r\n </ng-container>\r\n</div>\r\n\r\n<ng-template #lineTpl>\r\n <ng-container *ngIf=\"stepsArray.length === 0\">\r\n <ng-container *ngTemplateOutlet=\"trackTpl\"></ng-container>\r\n </ng-container>\r\n <ng-container *ngIf=\"stepsArray.length > 0\">\r\n <ng-container *ngTemplateOutlet=\"stepsTpl\"></ng-container>\r\n </ng-container>\r\n <ng-container *ngIf=\"info && !inside\">\r\n <ng-container *ngTemplateOutlet=\"textTpl\"></ng-container>\r\n </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #circleTpl>\r\n <div class=\"x-progress-ring\" [style.width]=\"size\" [style.height]=\"size\">\r\n <div class=\"x-progress-ring-rail\" [style.border-width]=\"thickness\"></div>\r\n <div\r\n class=\"x-progress-ring-bg\"\r\n [style.clip-path]=\"circleClipPath\"\r\n [style.background-color]=\"currentColor\"\r\n [style.border-width]=\"thickness\"\r\n ></div>\r\n <ng-container *ngTemplateOutlet=\"textTpl\"></ng-container>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #dashboardTpl>\r\n <div class=\"x-progress-ring\" [style.width]=\"size\" [style.height]=\"size\">\r\n <div class=\"x-progress-ring-rail\" [style.clip-path]=\"dashboardRailClipPath\" [style.border-width]=\"thickness\"></div>\r\n <div\r\n class=\"x-progress-ring-bg\"\r\n [style.clip-path]=\"dashboardClipPath\"\r\n [style.background-color]=\"currentColor\"\r\n [style.border-width]=\"thickness\"\r\n ></div>\r\n <ng-container *ngTemplateOutlet=\"textTpl\"></ng-container>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #trackTpl>\r\n <div class=\"x-progress-track\">\r\n <div class=\"x-progress-rail\" [class.x-progress-mask]=\"subsection\" [style.background-image]=\"subsection ? subLinearGradient : 'none'\">\r\n <div\r\n class=\"x-progress-bg\"\r\n [style.width.%]=\"percent\"\r\n [style.background-color]=\"currentColor\"\r\n [style.background-image]=\"linearGradient\"\r\n [style.height]=\"height\"\r\n [style.line-height]=\"height\"\r\n >\r\n <ng-container *ngIf=\"info && inside\">\r\n <ng-container *ngTemplateOutlet=\"textTpl\"></ng-container>\r\n </ng-container>\r\n </div>\r\n <div\r\n *ngIf=\"subsection\"\r\n class=\"x-progress-bg-mask\"\r\n [style.width.%]=\"maskWidth\"\r\n [style.height]=\"height\"\r\n [style.line-height]=\"height\"\r\n ></div>\r\n </div>\r\n </div>\r\n</ng-template>\r\n\r\n<ng-template #stepsTpl>\r\n <div\r\n *ngFor=\"let step of stepsArray\"\r\n class=\"x-progress-step\"\r\n [class.x-progress-step-active]=\"step\"\r\n [style.background-color]=\"currentColor\"\r\n [style.width]=\"stepWidth\"\r\n [style.flex]=\"stepFlex ? 1 : 'none'\"\r\n [style.height]=\"height\"\r\n [style.line-height]=\"height\"\r\n ></div>\r\n</ng-template>\r\n\r\n<ng-template #textTpl>\r\n <span class=\"x-progress-text\" [ngSwitch]=\"status\">\r\n <ng-container *ngSwitchCase=\"'success'\">\r\n <x-icon type=\"fto-check-circle\"></x-icon>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'exception'\">\r\n <x-icon type=\"fto-x-circle\"></x-icon>\r\n </ng-container>\r\n <ng-container *ngSwitchCase=\"'warning'\">\r\n <x-icon type=\"fto-help-circle\"></x-icon>\r\n </ng-container>\r\n <ng-container *ngSwitchDefault>\r\n <ng-container *ngIf=\"format; else defaultTemp\">{{ onFormat(percent) }}</ng-container>\r\n <ng-template #defaultTemp>{{ percent }}%</ng-template>\r\n </ng-container>\r\n </span>\r\n</ng-template>\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { XProgressComponent } from './progress.component';\r\nimport { FormsModule } from '@angular/forms';\r\nimport { XIconModule } from '@ng-nest/ui/icon';\r\nimport { XProgressProperty } from './progress.property';\r\n\r\n@NgModule({\r\n declarations: [XProgressComponent, XProgressProperty],\r\n exports: [XProgressComponent],\r\n imports: [CommonModule, FormsModule, XIconModule]\r\n})\r\nexport class XProgressModule {}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
|
@@ -80,7 +80,8 @@ class XRadioComponent extends XRadioProperty {
|
|
|
80
80
|
this.setClassMap();
|
|
81
81
|
}
|
|
82
82
|
ngOnChanges(changes) {
|
|
83
|
-
|
|
83
|
+
const { data } = changes;
|
|
84
|
+
XIsChange(data) && this.setData();
|
|
84
85
|
}
|
|
85
86
|
ngOnDestroy() {
|
|
86
87
|
this._unSubject.next();
|
|
@@ -109,7 +110,7 @@ class XRadioComponent extends XRadioProperty {
|
|
|
109
110
|
this.cdr.detectChanges();
|
|
110
111
|
});
|
|
111
112
|
}
|
|
112
|
-
trackByItem(
|
|
113
|
+
trackByItem(_index, item) {
|
|
113
114
|
return item.id;
|
|
114
115
|
}
|
|
115
116
|
formControlChanges() {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ng-nest-ui-radio.js","sources":["../../../../lib/ng-nest/ui/radio/radio.property.ts","../../../../lib/ng-nest/ui/radio/radio.component.ts","../../../../lib/ng-nest/ui/radio/radio.component.html","../../../../lib/ng-nest/ui/radio/radio.module.ts","../../../../lib/ng-nest/ui/radio/ng-nest-ui-radio.ts"],"sourcesContent":["import {
|
|
1
|
+
{"version":3,"file":"ng-nest-ui-radio.js","sources":["../../../../lib/ng-nest/ui/radio/radio.property.ts","../../../../lib/ng-nest/ui/radio/radio.component.ts","../../../../lib/ng-nest/ui/radio/radio.component.html","../../../../lib/ng-nest/ui/radio/radio.module.ts","../../../../lib/ng-nest/ui/radio/ng-nest-ui-radio.ts"],"sourcesContent":["import { XData, XIdentityProperty, XDataConvert, XInputBoolean, XSize, XBoolean, XWithConfig } from '@ng-nest/ui/core';\r\nimport { Input, Component } from '@angular/core';\r\nimport { XButtonType } from '@ng-nest/ui/button';\r\nimport { XControlValueAccessor, XFormOption } from '@ng-nest/ui/base-form';\r\n\r\n/**\r\n * Radio\r\n * @selector x-radio\r\n * @decorator component\r\n */\r\nexport const XRadioPrefix = 'x-radio';\r\nconst X_CONFIG_NAME = 'radio';\r\n\r\n/**\r\n * Radio Property\r\n */\r\n@Component({ template: '' })\r\nexport class XRadioProperty extends XControlValueAccessor<any> implements XRadioOption {\r\n /**\r\n * @zh_CN 单选框数据\r\n * @en_US Radio data\r\n */\r\n @Input() @XDataConvert() data: XData<XRadioNode> = [];\r\n /**\r\n * @zh_CN 按钮样式\r\n * @en_US Button style\r\n */\r\n @Input() @XInputBoolean() button?: XBoolean;\r\n /**\r\n * @zh_CN 图标样式\r\n * @en_US Icon style\r\n */\r\n @Input() @XInputBoolean() icon?: XBoolean;\r\n /**\r\n * @zh_CN 尺寸\r\n * @en_US Size\r\n */\r\n @Input() @XWithConfig<XSize>(X_CONFIG_NAME, 'medium') size?: XSize;\r\n /**\r\n * @zh_CN 按钮样式时生效\r\n * @en_US Take effect when button style\r\n */\r\n @Input() type: XButtonType = 'initial';\r\n}\r\n\r\n/**\r\n * Radio Option\r\n * @undocument true\r\n */\r\nexport interface XRadioOption extends XFormOption {\r\n /**\r\n * @zh_CN 单选框数据\r\n * @en_US Radio data\r\n */\r\n data?: XData<XRadioNode>;\r\n /**\r\n * @zh_CN 按钮样式\r\n * @en_US Button style\r\n */\r\n button?: XBoolean;\r\n /**\r\n * @zh_CN 图标样式\r\n * @en_US Icon style\r\n */\r\n icon?: XBoolean;\r\n /**\r\n * @zh_CN 尺寸\r\n * @en_US Size\r\n */\r\n size?: XSize;\r\n /**\r\n * @zh_CN 按钮样式时生效\r\n * @en_US Take effect when button style\r\n */\r\n type?: XButtonType;\r\n}\r\n\r\n/**\r\n * @zh_CN Radio 数据对象\r\n * @en_US Radio data object\r\n */\r\nexport interface XRadioNode extends XIdentityProperty {\r\n /**\r\n * @zh_CN 禁用\r\n * @en_US Disabled\r\n */\r\n disabled?: boolean;\r\n /**\r\n * @zh_CN 图标\r\n * @en_US Icon\r\n */\r\n icon?: string;\r\n /**\r\n * @zh_CN 图标的提示信息\r\n * @en_US Icon message\r\n */\r\n title?: string;\r\n}\r\n","import {\r\n Component,\r\n ViewEncapsulation,\r\n ChangeDetectionStrategy,\r\n Renderer2,\r\n ElementRef,\r\n ChangeDetectorRef,\r\n OnChanges,\r\n SimpleChanges,\r\n ViewChild\r\n} from '@angular/core';\r\nimport { XRadioPrefix, XRadioNode, XRadioProperty } from './radio.property';\r\nimport { Subject } from 'rxjs';\r\nimport { XIsChange, XSetData, XClearClass, XConfigService } from '@ng-nest/ui/core';\r\nimport { XValueAccessor } from '@ng-nest/ui/base-form';\r\n\r\n@Component({\r\n selector: `${XRadioPrefix}`,\r\n templateUrl: './radio.component.html',\r\n styleUrls: ['./radio.component.scss'],\r\n encapsulation: ViewEncapsulation.None,\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n providers: [XValueAccessor(XRadioComponent)]\r\n})\r\nexport class XRadioComponent extends XRadioProperty implements OnChanges {\r\n @ViewChild('radio', { static: true }) radio!: ElementRef;\r\n nodes: XRadioNode[] = [];\r\n private _unSubject = new Subject<void>();\r\n\r\n constructor(\r\n public renderer: Renderer2,\r\n public elementRef: ElementRef,\r\n public cdr: ChangeDetectorRef,\r\n public configService: XConfigService\r\n ) {\r\n super();\r\n }\r\n\r\n ngOnInit() {\r\n this.setFlex(this.radio.nativeElement, this.renderer, this.justify, this.align, this.direction);\r\n this.setClassMap();\r\n }\r\n\r\n ngOnChanges(changes: SimpleChanges): void {\r\n const { data } = changes;\r\n XIsChange(data) && this.setData();\r\n }\r\n\r\n ngOnDestroy(): void {\r\n this._unSubject.next();\r\n this._unSubject.unsubscribe();\r\n }\r\n\r\n writeValue(value: any) {\r\n this.value = value;\r\n this.cdr.detectChanges();\r\n }\r\n\r\n setClassMap() {\r\n XClearClass(this.labelMap);\r\n this.labelMap[`x-text-align-${this.labelAlign}`] = this.labelAlign ? true : false;\r\n }\r\n\r\n radioClick(event: Event, node: XRadioNode) {\r\n event.preventDefault();\r\n if (this.disabled || node.disabled || node.id === this.value) return;\r\n this.value = node.id;\r\n this.cdr.detectChanges();\r\n if (this.onChange) this.onChange(this.value);\r\n }\r\n\r\n private setData() {\r\n XSetData<XRadioNode>(this.data, this._unSubject).subscribe((x) => {\r\n this.nodes = x;\r\n this.cdr.detectChanges();\r\n });\r\n }\r\n\r\n trackByItem(_index: number, item: XRadioNode) {\r\n return item.id;\r\n }\r\n\r\n formControlChanges() {\r\n this.setData();\r\n this.ngOnInit();\r\n this.cdr.detectChanges();\r\n }\r\n}\r\n","<div\r\n #radio\r\n class=\"x-radio\"\r\n [class.x-flex]=\"justify || align || direction\"\r\n [class.x-disabled]=\"disabled\"\r\n [class.x-required]=\"requiredIsEmpty\"\r\n [class.x-invalid]=\"invalid\"\r\n>\r\n <label *ngIf=\"label\" [style.width]=\"labelWidth\" [ngClass]=\"labelMap\">{{ label }}</label>\r\n <ng-container *ngIf=\"button || icon; else default\">\r\n <x-buttons>\r\n <x-button\r\n *ngFor=\"let item of nodes; trackBy: trackByItem\"\r\n [icon]=\"item.icon\"\r\n [size]=\"size\"\r\n [type]=\"type\"\r\n [activated]=\"item.id === value\"\r\n [disabled]=\"disabled || item.disabled\"\r\n (click)=\"radioClick($event, item)\"\r\n >{{ item.label }}</x-button\r\n >\r\n </x-buttons>\r\n </ng-container>\r\n</div>\r\n\r\n<ng-template #default>\r\n <div class=\"x-radio-row\">\r\n <div\r\n class=\"x-radio-item\"\r\n *ngFor=\"let item of nodes; trackBy: trackByItem\"\r\n [class.x-checked]=\"item.id === value\"\r\n [class.x-disabled]=\"item.disabled\"\r\n (click)=\"radioClick($event, item)\"\r\n >\r\n <span class=\"x-radio-box\"></span>\r\n <span class=\"x-radio-label\">{{ item.label }}</span>\r\n </div>\r\n </div>\r\n</ng-template>\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { XRadioComponent } from './radio.component';\r\nimport { FormsModule } from '@angular/forms';\r\nimport { XButtonModule } from '@ng-nest/ui/button';\r\nimport { XRadioProperty } from './radio.property';\r\nimport { XBaseFormModule } from '@ng-nest/ui/base-form';\r\n\r\n@NgModule({\r\n declarations: [XRadioComponent, XRadioProperty],\r\n exports: [XRadioComponent],\r\n imports: [CommonModule, FormsModule, XButtonModule, XBaseFormModule]\r\n})\r\nexport class XRadioModule {}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
|
@@ -83,7 +83,7 @@ class XRateComponent extends XRateProperty {
|
|
|
83
83
|
.fill(0)
|
|
84
84
|
.map((_, i) => i + 1);
|
|
85
85
|
}
|
|
86
|
-
rateHover(rate,
|
|
86
|
+
rateHover(rate, _event) {
|
|
87
87
|
if (this.disabled)
|
|
88
88
|
return;
|
|
89
89
|
this.hoverActivated = rate;
|
|
@@ -97,28 +97,28 @@ class XRateComponent extends XRateProperty {
|
|
|
97
97
|
this.hoverHalfActivated = Math.ceil(activited);
|
|
98
98
|
this.cdr.detectChanges();
|
|
99
99
|
}
|
|
100
|
-
rateClick(rate,
|
|
100
|
+
rateClick(rate, _event) {
|
|
101
101
|
if (this.disabled)
|
|
102
102
|
return;
|
|
103
103
|
this.value = this.value === rate ? 0 : rate;
|
|
104
104
|
if (this.onChange)
|
|
105
105
|
this.onChange(this.value);
|
|
106
106
|
}
|
|
107
|
-
rateHalfHover(rate,
|
|
107
|
+
rateHalfHover(rate, _event) {
|
|
108
108
|
if (this.disabled)
|
|
109
109
|
return;
|
|
110
110
|
this.hoverActivated = rate - 1;
|
|
111
111
|
this.hoverHalfActivated = rate;
|
|
112
112
|
this.cdr.detectChanges();
|
|
113
113
|
}
|
|
114
|
-
rateHalfClick(rate,
|
|
114
|
+
rateHalfClick(rate, _event) {
|
|
115
115
|
if (this.disabled)
|
|
116
116
|
return;
|
|
117
117
|
this.value = rate - 0.5;
|
|
118
118
|
if (this.onChange)
|
|
119
119
|
this.onChange(this.value);
|
|
120
120
|
}
|
|
121
|
-
trackByItem(
|
|
121
|
+
trackByItem(_index, item) {
|
|
122
122
|
return item;
|
|
123
123
|
}
|
|
124
124
|
formControlChanges() {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ng-nest-ui-rate.js","sources":["../../../../lib/ng-nest/ui/rate/rate.property.ts","../../../../lib/ng-nest/ui/rate/rate.component.ts","../../../../lib/ng-nest/ui/rate/rate.component.html","../../../../lib/ng-nest/ui/rate/rate.module.ts","../../../../lib/ng-nest/ui/rate/ng-nest-ui-rate.ts"],"sourcesContent":["import { XInputNumber, XNumber, XInputBoolean, XBoolean, XTemplate } from '@ng-nest/ui/core';\r\nimport { Input, Component, TemplateRef } from '@angular/core';\r\nimport { XControlValueAccessor, XFormOption } from '@ng-nest/ui/base-form';\r\n\r\n/**\r\n * Rate\r\n * @selector x-rate\r\n * @decorator component\r\n */\r\nexport const XRatePrefix = 'x-rate';\r\n\r\n/**\r\n * Rate Property\r\n */\r\n@Component({ template: '' })\r\nexport class XRateProperty extends XControlValueAccessor<any> implements XRateOption {\r\n /**\r\n * @zh_CN 评分个数\r\n * @en_US Number of ratings\r\n */\r\n @Input() @XInputNumber() count: XNumber = 5;\r\n /**\r\n * @zh_CN 半星模式\r\n * @en_US Number of ratings\r\n */\r\n @Input() @XInputBoolean() half?: XBoolean;\r\n /**\r\n * @zh_CN 自定义模板\r\n * @en_US Custom template\r\n */\r\n @Input() customTemp!: TemplateRef<any>;\r\n}\r\n\r\n/**\r\n * Rate Option\r\n * @undocument true\r\n */\r\nexport interface XRateOption extends XFormOption {\r\n /**\r\n * @zh_CN 评分个数\r\n * @en_US Number of ratings\r\n */\r\n count?: XNumber;\r\n /**\r\n * @zh_CN 半星模式\r\n * @en_US Number of ratings\r\n */\r\n half?: XBoolean;\r\n /**\r\n * @zh_CN 自定义模板\r\n * @en_US Custom template\r\n */\r\n customTemp?: XTemplate;\r\n}\r\n","import {\r\n Component,\r\n ViewEncapsulation,\r\n ChangeDetectionStrategy,\r\n Renderer2,\r\n ElementRef,\r\n ChangeDetectorRef,\r\n Input,\r\n ViewChild\r\n} from '@angular/core';\r\nimport { XIsEmpty, XNumber, XClearClass, XConfigService } from '@ng-nest/ui/core';\r\nimport { XRatePrefix, XRateProperty } from './rate.property';\r\nimport { XValueAccessor } from '@ng-nest/ui/base-form';\r\n\r\n@Component({\r\n selector: `${XRatePrefix}`,\r\n templateUrl: './rate.component.html',\r\n styleUrls: ['./rate.component.scss'],\r\n encapsulation: ViewEncapsulation.None,\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n providers: [XValueAccessor(XRateComponent)]\r\n})\r\nexport class XRateComponent extends XRateProperty {\r\n @ViewChild('rate', { static: true }) rate!: ElementRef;\r\n rates: number[] = [];\r\n\r\n hoverActivated = 0;\r\n hoverHalfActivated = 0;\r\n\r\n writeValue(value: any) {\r\n if (XIsEmpty(value)) value = 0;\r\n this.value = value;\r\n this.hoverActivated = value;\r\n this.hoverHalfActivated = Math.ceil(value);\r\n this.cdr.detectChanges();\r\n }\r\n\r\n rateNodes: any = [];\r\n constructor(\r\n public renderer: Renderer2,\r\n public elementRef: ElementRef,\r\n public cdr: ChangeDetectorRef,\r\n public configService: XConfigService\r\n ) {\r\n super();\r\n }\r\n\r\n ngOnInit() {\r\n this.setRates();\r\n this.setFlex(this.rate.nativeElement, this.renderer, this.justify, this.align, this.direction);\r\n this.setClassMap();\r\n }\r\n\r\n setClassMap() {\r\n XClearClass(this.labelMap);\r\n this.labelMap[`x-text-align-${this.labelAlign}`] = this.labelAlign ? true : false;\r\n }\r\n\r\n setRates() {\r\n this.rates = Array(this.count)\r\n .fill(0)\r\n .map((_, i) => i + 1);\r\n }\r\n\r\n rateHover(rate: number, event: MouseEvent) {\r\n if (this.disabled) return;\r\n this.hoverActivated = rate;\r\n this.cdr.detectChanges();\r\n }\r\n\r\n leaveRates() {\r\n if (this.disabled) return;\r\n const activited = this.value;\r\n this.hoverActivated = activited;\r\n this.hoverHalfActivated = Math.ceil(activited);\r\n this.cdr.detectChanges();\r\n }\r\n\r\n rateClick(rate: number, event: MouseEvent) {\r\n if (this.disabled) return;\r\n this.value = this.value === rate ? 0 : rate;\r\n if (this.onChange) this.onChange(this.value);\r\n }\r\n\r\n rateHalfHover(rate: number, event: MouseEvent) {\r\n if (this.disabled) return;\r\n this.hoverActivated = rate - 1;\r\n this.hoverHalfActivated = rate;\r\n this.cdr.detectChanges();\r\n }\r\n\r\n rateHalfClick(rate: number, event: MouseEvent) {\r\n if (this.disabled) return;\r\n this.value = rate - 0.5;\r\n if (this.onChange) this.onChange(this.value);\r\n }\r\n\r\n trackByItem(index: number, item: number) {\r\n return item;\r\n }\r\n\r\n formControlChanges() {\r\n this.ngOnInit();\r\n this.cdr.detectChanges();\r\n }\r\n}\r\n","<div\r\n #rate\r\n class=\"x-rate\"\r\n [class.x-flex]=\"justify || align || direction\"\r\n [class.x-disabled]=\"disabled\"\r\n [class.x-required]=\"requiredIsEmpty\"\r\n [class.x-invalid]=\"invalid\"\r\n>\r\n <label *ngIf=\"label\" [style.width]=\"labelWidth\" [ngClass]=\"labelMap\">{{ label }}</label>\r\n <div class=\"x-rate-icons\" (mouseleave)=\"leaveRates()\">\r\n <div\r\n class=\"x-rate-icon\"\r\n [class.activated]=\"rate <= hoverActivated\"\r\n [class.half-activated]=\"rate <= hoverHalfActivated\"\r\n *ngFor=\"let rate of rates; index as i; trackBy: trackByItem\"\r\n >\r\n <div *ngIf=\"half\" class=\"x-rate-half\" (mouseenter)=\"rateHalfHover(rate, $event)\" (click)=\"rateHalfClick(rate, $event)\">\r\n <ng-container *ngIf=\"customTemp; else iconTpl\">\r\n <ng-container *ngTemplateOutlet=\"customTemp\"></ng-container>\r\n </ng-container>\r\n </div>\r\n <div class=\"x-rate-back\" (mouseenter)=\"rateHover(rate, $event)\" (click)=\"rateClick(rate, $event)\">\r\n <ng-container *ngIf=\"customTemp; else iconTpl\">\r\n <ng-container *ngTemplateOutlet=\"customTemp\"></ng-container>\r\n </ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<ng-template #iconTpl>\r\n <x-icon type=\"adf-star\"></x-icon>\r\n</ng-template>\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { XRateComponent } from './rate.component';\r\nimport { FormsModule } from '@angular/forms';\r\nimport { XButtonModule } from '@ng-nest/ui/button';\r\nimport { XRateProperty } from './rate.property';\r\nimport { XIconModule } from '@ng-nest/ui/icon';\r\nimport { XBaseFormModule } from '@ng-nest/ui/base-form';\r\n\r\n@NgModule({\r\n declarations: [XRateComponent, XRateProperty],\r\n exports: [XRateComponent],\r\n imports: [CommonModule, FormsModule, XButtonModule, XIconModule, XBaseFormModule]\r\n})\r\nexport class XRateModule {}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"ng-nest-ui-rate.js","sources":["../../../../lib/ng-nest/ui/rate/rate.property.ts","../../../../lib/ng-nest/ui/rate/rate.component.ts","../../../../lib/ng-nest/ui/rate/rate.component.html","../../../../lib/ng-nest/ui/rate/rate.module.ts","../../../../lib/ng-nest/ui/rate/ng-nest-ui-rate.ts"],"sourcesContent":["import { XInputNumber, XNumber, XInputBoolean, XBoolean, XTemplate } from '@ng-nest/ui/core';\r\nimport { Input, Component, TemplateRef } from '@angular/core';\r\nimport { XControlValueAccessor, XFormOption } from '@ng-nest/ui/base-form';\r\n\r\n/**\r\n * Rate\r\n * @selector x-rate\r\n * @decorator component\r\n */\r\nexport const XRatePrefix = 'x-rate';\r\n\r\n/**\r\n * Rate Property\r\n */\r\n@Component({ template: '' })\r\nexport class XRateProperty extends XControlValueAccessor<any> implements XRateOption {\r\n /**\r\n * @zh_CN 评分个数\r\n * @en_US Number of ratings\r\n */\r\n @Input() @XInputNumber() count: XNumber = 5;\r\n /**\r\n * @zh_CN 半星模式\r\n * @en_US Number of ratings\r\n */\r\n @Input() @XInputBoolean() half?: XBoolean;\r\n /**\r\n * @zh_CN 自定义模板\r\n * @en_US Custom template\r\n */\r\n @Input() customTemp!: TemplateRef<any>;\r\n}\r\n\r\n/**\r\n * Rate Option\r\n * @undocument true\r\n */\r\nexport interface XRateOption extends XFormOption {\r\n /**\r\n * @zh_CN 评分个数\r\n * @en_US Number of ratings\r\n */\r\n count?: XNumber;\r\n /**\r\n * @zh_CN 半星模式\r\n * @en_US Number of ratings\r\n */\r\n half?: XBoolean;\r\n /**\r\n * @zh_CN 自定义模板\r\n * @en_US Custom template\r\n */\r\n customTemp?: XTemplate;\r\n}\r\n","import { Component, ViewEncapsulation, ChangeDetectionStrategy, Renderer2, ElementRef, ChangeDetectorRef, ViewChild } from '@angular/core';\r\nimport { XIsEmpty, XClearClass, XConfigService } from '@ng-nest/ui/core';\r\nimport { XRatePrefix, XRateProperty } from './rate.property';\r\nimport { XValueAccessor } from '@ng-nest/ui/base-form';\r\n\r\n@Component({\r\n selector: `${XRatePrefix}`,\r\n templateUrl: './rate.component.html',\r\n styleUrls: ['./rate.component.scss'],\r\n encapsulation: ViewEncapsulation.None,\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n providers: [XValueAccessor(XRateComponent)]\r\n})\r\nexport class XRateComponent extends XRateProperty {\r\n @ViewChild('rate', { static: true }) rate!: ElementRef;\r\n rates: number[] = [];\r\n\r\n hoverActivated = 0;\r\n hoverHalfActivated = 0;\r\n\r\n writeValue(value: any) {\r\n if (XIsEmpty(value)) value = 0;\r\n this.value = value;\r\n this.hoverActivated = value;\r\n this.hoverHalfActivated = Math.ceil(value);\r\n this.cdr.detectChanges();\r\n }\r\n\r\n rateNodes: any = [];\r\n constructor(\r\n public renderer: Renderer2,\r\n public elementRef: ElementRef,\r\n public cdr: ChangeDetectorRef,\r\n public configService: XConfigService\r\n ) {\r\n super();\r\n }\r\n\r\n ngOnInit() {\r\n this.setRates();\r\n this.setFlex(this.rate.nativeElement, this.renderer, this.justify, this.align, this.direction);\r\n this.setClassMap();\r\n }\r\n\r\n setClassMap() {\r\n XClearClass(this.labelMap);\r\n this.labelMap[`x-text-align-${this.labelAlign}`] = this.labelAlign ? true : false;\r\n }\r\n\r\n setRates() {\r\n this.rates = Array(this.count)\r\n .fill(0)\r\n .map((_, i) => i + 1);\r\n }\r\n\r\n rateHover(rate: number, _event: MouseEvent) {\r\n if (this.disabled) return;\r\n this.hoverActivated = rate;\r\n this.cdr.detectChanges();\r\n }\r\n\r\n leaveRates() {\r\n if (this.disabled) return;\r\n const activited = this.value;\r\n this.hoverActivated = activited;\r\n this.hoverHalfActivated = Math.ceil(activited);\r\n this.cdr.detectChanges();\r\n }\r\n\r\n rateClick(rate: number, _event: MouseEvent) {\r\n if (this.disabled) return;\r\n this.value = this.value === rate ? 0 : rate;\r\n if (this.onChange) this.onChange(this.value);\r\n }\r\n\r\n rateHalfHover(rate: number, _event: MouseEvent) {\r\n if (this.disabled) return;\r\n this.hoverActivated = rate - 1;\r\n this.hoverHalfActivated = rate;\r\n this.cdr.detectChanges();\r\n }\r\n\r\n rateHalfClick(rate: number, _event: MouseEvent) {\r\n if (this.disabled) return;\r\n this.value = rate - 0.5;\r\n if (this.onChange) this.onChange(this.value);\r\n }\r\n\r\n trackByItem(_index: number, item: number) {\r\n return item;\r\n }\r\n\r\n formControlChanges() {\r\n this.ngOnInit();\r\n this.cdr.detectChanges();\r\n }\r\n}\r\n","<div\r\n #rate\r\n class=\"x-rate\"\r\n [class.x-flex]=\"justify || align || direction\"\r\n [class.x-disabled]=\"disabled\"\r\n [class.x-required]=\"requiredIsEmpty\"\r\n [class.x-invalid]=\"invalid\"\r\n>\r\n <label *ngIf=\"label\" [style.width]=\"labelWidth\" [ngClass]=\"labelMap\">{{ label }}</label>\r\n <div class=\"x-rate-icons\" (mouseleave)=\"leaveRates()\">\r\n <div\r\n class=\"x-rate-icon\"\r\n [class.activated]=\"rate <= hoverActivated\"\r\n [class.half-activated]=\"rate <= hoverHalfActivated\"\r\n *ngFor=\"let rate of rates; index as i; trackBy: trackByItem\"\r\n >\r\n <div *ngIf=\"half\" class=\"x-rate-half\" (mouseenter)=\"rateHalfHover(rate, $event)\" (click)=\"rateHalfClick(rate, $event)\">\r\n <ng-container *ngIf=\"customTemp; else iconTpl\">\r\n <ng-container *ngTemplateOutlet=\"customTemp\"></ng-container>\r\n </ng-container>\r\n </div>\r\n <div class=\"x-rate-back\" (mouseenter)=\"rateHover(rate, $event)\" (click)=\"rateClick(rate, $event)\">\r\n <ng-container *ngIf=\"customTemp; else iconTpl\">\r\n <ng-container *ngTemplateOutlet=\"customTemp\"></ng-container>\r\n </ng-container>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<ng-template #iconTpl>\r\n <x-icon type=\"adf-star\"></x-icon>\r\n</ng-template>\r\n","import { NgModule } from '@angular/core';\r\nimport { CommonModule } from '@angular/common';\r\nimport { XRateComponent } from './rate.component';\r\nimport { FormsModule } from '@angular/forms';\r\nimport { XButtonModule } from '@ng-nest/ui/button';\r\nimport { XRateProperty } from './rate.property';\r\nimport { XIconModule } from '@ng-nest/ui/icon';\r\nimport { XBaseFormModule } from '@ng-nest/ui/base-form';\r\n\r\n@NgModule({\r\n declarations: [XRateComponent, XRateProperty],\r\n exports: [XRateComponent],\r\n imports: [CommonModule, FormsModule, XButtonModule, XIconModule, XBaseFormModule]\r\n})\r\nexport class XRateModule {}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './public-api';\n"],"names":[],"mappings":";;;;;;;;;;;;;AAIA;;;;;MAKa,WAAW,GAAG,SAAS;AAEpC;;;MAIa,aAAc,SAAQ,qBAA0B;IAD7D;;;;;;QAM2B,UAAK,GAAY,CAAC,CAAC;KAW7C;;6HAhBY,aAAa;iHAAb,aAAa,+IADH,EAAE;AAME;IAAf,YAAY,EAAE;4CAAoB;AAKlB;IAAhB,aAAa,EAAE;2CAAiB;2FAV/B,aAAa;kBADzB,SAAS;mBAAC,EAAE,QAAQ,EAAE,EAAE,EAAE;8BAMA,KAAK;sBAA7B,KAAK;gBAKoB,IAAI;sBAA7B,KAAK;gBAKG,UAAU;sBAAlB,KAAK;;;MCjBK,cAAe,SAAQ,aAAa;IAgB/C,YACS,QAAmB,EACnB,UAAsB,EACtB,GAAsB,EACtB,aAA6B;QAEpC,KAAK,EAAE,CAAC;QALD,aAAQ,GAAR,QAAQ,CAAW;QACnB,eAAU,GAAV,UAAU,CAAY;QACtB,QAAG,GAAH,GAAG,CAAmB;QACtB,kBAAa,GAAb,aAAa,CAAgB;QAlBtC,UAAK,GAAa,EAAE,CAAC;QAErB,mBAAc,GAAG,CAAC,CAAC;QACnB,uBAAkB,GAAG,CAAC,CAAC;QAUvB,cAAS,GAAQ,EAAE,CAAC;KAQnB;IAhBD,UAAU,CAAC,KAAU;QACnB,IAAI,QAAQ,CAAC,KAAK,CAAC;YAAE,KAAK,GAAG,CAAC,CAAC;QAC/B,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC;QACnB,IAAI,CAAC,cAAc,GAAG,KAAK,CAAC;QAC5B,IAAI,CAAC,kBAAkB,GAAG,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QAC3C,IAAI,CAAC,GAAG,CAAC,aAAa,EAAE,CAAC;KAC1B;IAYD,QAAQ;QACN,IAAI,CAAC,QAAQ,EAAE,CAAC;QAChB,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC,OAAO,EAAE,IAAI,CAAC,KAAK,EAAE,IAAI,CAAC,SAAS,CAAC,CAAC;QAC/F,IAAI,CAAC,WAAW,EAAE,CAAC;KACpB;IAED,WAAW;QACT,WAAW,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;QAC3B,IAAI,CAAC,QAAQ,CAAC,gBAAgB,IAAI,CAAC,UAAU,EAAE,CAAC,GAAG,IAAI,CAAC,UAAU,GAAG,IAAI,GAAG,KAAK,CAAC;KACnF;IAED,QAAQ;QACN,IAAI,CAAC,KAAK,GAAG,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC;aAC3B,IAAI,CAAC,CAAC,CAAC;aACP,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC;KACzB;IAED,SAAS,CAAC,IAAY,EAAE,MAAkB;QACxC,IAAI,IAAI,CAAC,QAAQ;YAAE,OAAO;QAC1B,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC;QAC3B,IAAI,CAAC,GAAG,CAAC,aAAa,EAAE,CAAC;KAC1B;IAED,UAAU;QACR,IAAI,IAAI,CAAC,QAAQ;YAAE,OAAO;QAC1B,MAAM,SAAS,GAAG,IAAI,CAAC,KAAK,CAAC;QAC7B,IAAI,CAAC,cAAc,GAAG,SAAS,CAAC;QAChC,IAAI,CAAC,kBAAkB,GAAG,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;QAC/C,IAAI,CAAC,GAAG,CAAC,aAAa,EAAE,CAAC;KAC1B;IAED,SAAS,CAAC,IAAY,EAAE,MAAkB;QACxC,IAAI,IAAI,CAAC,QAAQ;YAAE,OAAO;QAC1B,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,KAAK,KAAK,IAAI,GAAG,CAAC,GAAG,IAAI,CAAC;QAC5C,IAAI,IAAI,CAAC,QAAQ;YAAE,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;KAC9C;IAED,aAAa,CAAC,IAAY,EAAE,MAAkB;QAC5C,IAAI,IAAI,CAAC,QAAQ;YAAE,OAAO;QAC1B,IAAI,CAAC,cAAc,GAAG,IAAI,GAAG,CAAC,CAAC;QAC/B,IAAI,CAAC,kBAAkB,GAAG,IAAI,CAAC;QAC/B,IAAI,CAAC,GAAG,CAAC,aAAa,EAAE,CAAC;KAC1B;IAED,aAAa,CAAC,IAAY,EAAE,MAAkB;QAC5C,IAAI,IAAI,CAAC,QAAQ;YAAE,OAAO;QAC1B,IAAI,CAAC,KAAK,GAAG,IAAI,GAAG,GAAG,CAAC;QACxB,IAAI,IAAI,CAAC,QAAQ;YAAE,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;KAC9C;IAED,WAAW,CAAC,MAAc,EAAE,IAAY;QACtC,OAAO,IAAI,CAAC;KACb;IAED,kBAAkB;QAChB,IAAI,CAAC,QAAQ,EAAE,CAAC;QAChB,IAAI,CAAC,GAAG,CAAC,aAAa,EAAE,CAAC;KAC1B;;8HAlFU,cAAc;kHAAd,cAAc,iCAFd,CAAC,cAAc,CAAC,cAAc,CAAC,CAAC,6JCX7C,+0CAiCA;2FDpBa,cAAc;kBAR1B,SAAS;mBAAC;oBACT,QAAQ,EAAE,GAAG,WAAW,EAAE;oBAC1B,WAAW,EAAE,uBAAuB;oBACpC,SAAS,EAAE,CAAC,uBAAuB,CAAC;oBACpC,aAAa,EAAE,iBAAiB,CAAC,IAAI;oBACrC,eAAe,EAAE,uBAAuB,CAAC,MAAM;oBAC/C,SAAS,EAAE,CAAC,cAAc,gBAAgB,CAAC;iBAC5C;sLAEsC,IAAI;sBAAxC,SAAS;uBAAC,MAAM,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE;;;MEAxB,WAAW;;2HAAX,WAAW;4HAAX,WAAW,iBAJP,cAAc,EAAE,aAAa,aAElC,YAAY,EAAE,WAAW,EAAE,aAAa,EAAE,WAAW,EAAE,eAAe,aADtE,cAAc;4HAGb,WAAW,YAFb,CAAC,YAAY,EAAE,WAAW,EAAE,aAAa,EAAE,WAAW,EAAE,eAAe,CAAC;2FAEtE,WAAW;kBALvB,QAAQ;mBAAC;oBACR,YAAY,EAAE,CAAC,cAAc,EAAE,aAAa,CAAC;oBAC7C,OAAO,EAAE,CAAC,cAAc,CAAC;oBACzB,OAAO,EAAE,CAAC,YAAY,EAAE,WAAW,EAAE,aAAa,EAAE,WAAW,EAAE,eAAe,CAAC;iBAClF;;;ACbD;;;;;;"}
|