@taiga-ui/core 4.52.0-canary.aaf153c → 4.52.0-canary.ae38a1e
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/README.md +1 -1
- package/classes/accessors.d.ts +2 -2
- package/components/calendar/calendar-sheet.component.d.ts +1 -1
- package/components/calendar/calendar-sheet.options.d.ts +1 -3
- package/{pipes/calendar-sheet → components/calendar}/calendar-sheet.pipe.d.ts +2 -2
- package/components/calendar/calendar-spin.component.d.ts +1 -0
- package/components/calendar/calendar-year.component.d.ts +1 -1
- package/components/calendar/calendar.options.d.ts +9 -0
- package/components/calendar/index.d.ts +3 -0
- package/{pipes/order-week-days → components/calendar}/order-week-days.pipe.d.ts +1 -1
- package/components/data-list/data-list.component.d.ts +7 -11
- package/components/data-list/data-list.d.ts +3 -4
- package/components/data-list/data-list.tokens.d.ts +1 -23
- package/components/data-list/index.d.ts +3 -4
- package/components/data-list/opt-group.directive.d.ts +2 -2
- package/components/data-list/option-content.directive.d.ts +14 -0
- package/components/data-list/option-with-value.directive.d.ts +9 -0
- package/components/data-list/option.directive.d.ts +19 -0
- package/components/icon/icon.component.d.ts +2 -2
- package/components/index.d.ts +2 -4
- package/components/input/index.d.ts +2 -0
- package/components/input/input.d.ts +5 -0
- package/components/input/input.directive.d.ts +29 -0
- package/components/label/label.directive.d.ts +1 -1
- package/components/link/index.d.ts +0 -1
- package/components/link/link.directive.d.ts +8 -6
- package/components/loader/loader.options.d.ts +1 -3
- package/components/notification/index.d.ts +3 -0
- package/components/notification/notification.component.d.ts +14 -0
- package/components/notification/notification.d.ts +3 -0
- package/components/notification/notification.directive.d.ts +5 -6
- package/components/notification/notification.options.d.ts +10 -7
- package/components/notification/notification.service.d.ts +17 -0
- package/components/root/root.component.d.ts +1 -1
- package/components/scrollbar/scroll-into-view.directive.d.ts +3 -2
- package/components/scrollbar/scroll-ref.directive.d.ts +2 -0
- package/components/scrollbar/scrollbar.component.d.ts +1 -5
- package/components/scrollbar/scrollbar.directive.d.ts +2 -2
- package/components/spin-button/spin-button.component.d.ts +1 -1
- package/components/textfield/index.d.ts +0 -1
- package/components/textfield/textfield-multi/textfield-item.component.d.ts +3 -2
- package/components/textfield/textfield-multi/textfield-multi.component.d.ts +8 -13
- package/components/textfield/textfield.component.d.ts +20 -33
- package/components/textfield/textfield.d.ts +2 -3
- package/directives/appearance/appearance.directive.d.ts +1 -1
- package/directives/appearance/appearance.options.d.ts +1 -2
- package/directives/button-x/button-x.directive.d.ts +6 -0
- package/directives/button-x/index.d.ts +1 -0
- package/directives/date-format/date-format.directive.d.ts +3 -7
- package/directives/group/group.directive.d.ts +7 -7
- package/directives/group/group.options.d.ts +1 -3
- package/directives/index.d.ts +1 -5
- package/directives/items-handlers/items-handlers.directive.d.ts +5 -9
- package/directives/items-handlers/items-handlers.tokens.d.ts +4 -4
- package/directives/number-format/number-format.directive.d.ts +3 -7
- package/fesm2022/taiga-ui-core-classes.mjs +9 -11
- package/fesm2022/taiga-ui-core-classes.mjs.map +1 -1
- package/fesm2022/taiga-ui-core-components-button.mjs +7 -7
- package/fesm2022/taiga-ui-core-components-button.mjs.map +1 -1
- package/fesm2022/taiga-ui-core-components-calendar.mjs +138 -37
- package/fesm2022/taiga-ui-core-components-calendar.mjs.map +1 -1
- package/fesm2022/taiga-ui-core-components-cell.mjs +7 -7
- package/fesm2022/taiga-ui-core-components-cell.mjs.map +1 -1
- package/fesm2022/taiga-ui-core-components-data-list.mjs +110 -279
- package/fesm2022/taiga-ui-core-components-data-list.mjs.map +1 -1
- package/fesm2022/taiga-ui-core-components-error.mjs +12 -11
- package/fesm2022/taiga-ui-core-components-error.mjs.map +1 -1
- package/fesm2022/taiga-ui-core-components-expand.mjs +3 -3
- package/fesm2022/taiga-ui-core-components-icon.mjs +10 -11
- package/fesm2022/taiga-ui-core-components-icon.mjs.map +1 -1
- package/fesm2022/taiga-ui-core-components-input.mjs +103 -0
- package/fesm2022/taiga-ui-core-components-input.mjs.map +1 -0
- package/fesm2022/taiga-ui-core-components-label.mjs +11 -13
- package/fesm2022/taiga-ui-core-components-label.mjs.map +1 -1
- package/fesm2022/taiga-ui-core-components-link.mjs +13 -28
- package/fesm2022/taiga-ui-core-components-link.mjs.map +1 -1
- package/fesm2022/taiga-ui-core-components-loader.mjs +7 -12
- package/fesm2022/taiga-ui-core-components-loader.mjs.map +1 -1
- package/fesm2022/taiga-ui-core-components-notification.mjs +99 -29
- package/fesm2022/taiga-ui-core-components-notification.mjs.map +1 -1
- package/fesm2022/taiga-ui-core-components-root.mjs +9 -13
- package/fesm2022/taiga-ui-core-components-root.mjs.map +1 -1
- package/fesm2022/taiga-ui-core-components-scrollbar.mjs +69 -83
- package/fesm2022/taiga-ui-core-components-scrollbar.mjs.map +1 -1
- package/fesm2022/taiga-ui-core-components-spin-button.mjs +6 -6
- package/fesm2022/taiga-ui-core-components-spin-button.mjs.map +1 -1
- package/fesm2022/taiga-ui-core-components-textfield.mjs +104 -266
- package/fesm2022/taiga-ui-core-components-textfield.mjs.map +1 -1
- package/fesm2022/{taiga-ui-core-directives-title.mjs → taiga-ui-core-components-title.mjs} +8 -8
- package/fesm2022/{taiga-ui-core-directives-title.mjs.map → taiga-ui-core-components-title.mjs.map} +1 -1
- package/fesm2022/taiga-ui-core-components.mjs +2 -4
- package/fesm2022/taiga-ui-core-components.mjs.map +1 -1
- package/fesm2022/taiga-ui-core-directives-appearance.mjs +16 -16
- package/fesm2022/taiga-ui-core-directives-appearance.mjs.map +1 -1
- package/fesm2022/taiga-ui-core-directives-button-x.mjs +51 -0
- package/fesm2022/taiga-ui-core-directives-button-x.mjs.map +1 -0
- package/fesm2022/taiga-ui-core-directives-date-format.mjs +26 -20
- package/fesm2022/taiga-ui-core-directives-date-format.mjs.map +1 -1
- package/fesm2022/taiga-ui-core-directives-group.mjs +23 -35
- package/fesm2022/taiga-ui-core-directives-group.mjs.map +1 -1
- package/fesm2022/taiga-ui-core-directives-icons.mjs +12 -12
- package/fesm2022/taiga-ui-core-directives-icons.mjs.map +1 -1
- package/fesm2022/taiga-ui-core-directives-items-handlers.mjs +16 -40
- package/fesm2022/taiga-ui-core-directives-items-handlers.mjs.map +1 -1
- package/fesm2022/taiga-ui-core-directives-number-format.mjs +32 -20
- package/fesm2022/taiga-ui-core-directives-number-format.mjs.map +1 -1
- package/fesm2022/taiga-ui-core-directives.mjs +1 -5
- package/fesm2022/taiga-ui-core-directives.mjs.map +1 -1
- package/fesm2022/taiga-ui-core-pipes-format-number.mjs +21 -15
- package/fesm2022/taiga-ui-core-pipes-format-number.mjs.map +1 -1
- package/fesm2022/taiga-ui-core-pipes.mjs +0 -7
- package/fesm2022/taiga-ui-core-pipes.mjs.map +1 -1
- package/fesm2022/taiga-ui-core-portals-alert.mjs +73 -0
- package/fesm2022/taiga-ui-core-portals-alert.mjs.map +1 -0
- package/fesm2022/taiga-ui-core-portals-dialog.mjs +159 -0
- package/fesm2022/taiga-ui-core-portals-dialog.mjs.map +1 -0
- package/fesm2022/{taiga-ui-core-directives-dropdown.mjs → taiga-ui-core-portals-dropdown.mjs} +214 -348
- package/fesm2022/taiga-ui-core-portals-dropdown.mjs.map +1 -0
- package/fesm2022/{taiga-ui-core-directives-hint.mjs → taiga-ui-core-portals-hint.mjs} +73 -132
- package/fesm2022/taiga-ui-core-portals-hint.mjs.map +1 -0
- package/fesm2022/taiga-ui-core-portals-modal.mjs +89 -0
- package/fesm2022/taiga-ui-core-portals-modal.mjs.map +1 -0
- package/fesm2022/{taiga-ui-core-directives-popup.mjs → taiga-ui-core-portals-popup.mjs} +11 -11
- package/fesm2022/taiga-ui-core-portals-popup.mjs.map +1 -0
- package/fesm2022/taiga-ui-core-portals.mjs +11 -0
- package/fesm2022/taiga-ui-core-portals.mjs.map +1 -0
- package/fesm2022/taiga-ui-core-services.mjs +15 -79
- package/fesm2022/taiga-ui-core-services.mjs.map +1 -1
- package/fesm2022/taiga-ui-core-tokens.mjs +51 -60
- package/fesm2022/taiga-ui-core-tokens.mjs.map +1 -1
- package/fesm2022/taiga-ui-core-utils-format.mjs +1 -22
- package/fesm2022/taiga-ui-core-utils-format.mjs.map +1 -1
- package/fesm2022/taiga-ui-core-utils-miscellaneous.mjs +19 -19
- package/fesm2022/taiga-ui-core-utils-miscellaneous.mjs.map +1 -1
- package/fesm2022/taiga-ui-core.mjs +1 -1
- package/index.d.ts +1 -1
- package/package.json +72 -98
- package/pipes/format-number/format-number.pipe.d.ts +6 -4
- package/pipes/index.d.ts +0 -7
- package/{directives/notification/notification.directive.d.ts → portals/alert/alert.directive.d.ts} +3 -3
- package/{directives/notification/notification.service.d.ts → portals/alert/alert.service.d.ts} +3 -3
- package/portals/alert/index.d.ts +2 -0
- package/{components → portals}/dialog/dialog.component.d.ts +2 -3
- package/{components → portals}/dialog/dialog.options.d.ts +2 -3
- package/{components → portals}/dialog/dialog.providers.d.ts +1 -2
- package/{components → portals}/dialog/dialog.service.d.ts +1 -1
- package/{components → portals}/dialog/index.d.ts +0 -1
- package/portals/dropdown/dropdown-close.directive.d.ts +15 -0
- package/{directives → portals}/dropdown/dropdown-context.directive.d.ts +0 -1
- package/{directives → portals}/dropdown/dropdown-hover.directive.d.ts +5 -10
- package/{directives → portals}/dropdown/dropdown-hover.options.d.ts +1 -3
- package/{directives → portals}/dropdown/dropdown-manual.directive.d.ts +2 -2
- package/portals/dropdown/dropdown-open.directive.d.ts +29 -0
- package/{directives → portals}/dropdown/dropdown-options.directive.d.ts +0 -4
- package/{directives → portals}/dropdown/dropdown-position-sided.directive.d.ts +3 -3
- package/{directives → portals}/dropdown/dropdown-position.directive.d.ts +5 -5
- package/{directives → portals}/dropdown/dropdown-selection.directive.d.ts +4 -5
- package/{directives → portals}/dropdown/dropdown.bindings.d.ts +0 -1
- package/{directives → portals}/dropdown/dropdown.d.ts +1 -2
- package/{directives → portals}/dropdown/dropdown.directive.d.ts +5 -6
- package/{directives → portals}/dropdown/index.d.ts +1 -1
- package/portals/hint/hint-options.directive.d.ts +17 -0
- package/{directives → portals}/hint/hint-position.directive.d.ts +5 -5
- package/{directives → portals}/hint/hint.d.ts +1 -2
- package/{directives → portals}/hint/hint.directive.d.ts +2 -2
- package/portals/index.d.ts +6 -0
- package/{components → portals}/modal/modal.component.d.ts +3 -3
- package/{components → portals}/modal/modal.service.d.ts +3 -3
- package/services/index.d.ts +0 -3
- package/styles/components/appearance.less +5 -0
- package/styles/components/button.less +10 -20
- package/styles/components/icon.less +11 -0
- package/styles/components/icons.less +2 -1
- package/styles/components/label.less +3 -12
- package/styles/components/link.less +9 -24
- package/styles/components/notification.less +31 -65
- package/styles/components/textfield.less +129 -211
- package/styles/components/title.less +8 -8
- package/styles/mixins/appearance.less +10 -26
- package/styles/mixins/appearance.scss +8 -24
- package/styles/mixins/date-picker.less +1 -1
- package/styles/mixins/mixins.less +0 -5
- package/styles/mixins/mixins.scss +0 -5
- package/styles/mixins/picker.less +1 -1
- package/styles/mixins/picker.scss +1 -1
- package/styles/mixins/slider.less +4 -10
- package/styles/mixins/slider.scss +23 -22
- package/styles/taiga-ui-local.less +0 -1
- package/styles/taiga-ui-local.scss +0 -1
- package/styles/taiga-ui-theme.less +0 -1
- package/styles/theme/appearance/outline.less +9 -18
- package/styles/theme/appearance/primary.less +2 -4
- package/styles/theme/appearance/secondary.less +6 -14
- package/styles/theme/appearance/status.less +0 -4
- package/styles/theme/appearance/table.less +36 -35
- package/styles/theme/appearance/textfield.less +30 -27
- package/styles/theme/appearance.less +0 -1
- package/styles/theme/variables.less +16 -19
- package/styles/variables/media.less +13 -18
- package/styles/variables/media.scss +13 -13
- package/tokens/breakpoint.d.ts +4 -0
- package/tokens/common-icons.d.ts +3 -3
- package/tokens/date-format.d.ts +2 -3
- package/tokens/icons.d.ts +0 -4
- package/tokens/index.d.ts +1 -4
- package/tokens/number-format.d.ts +2 -3
- package/types/index.d.ts +0 -2
- package/types/point.d.ts +1 -1
- package/types/size.d.ts +0 -11
- package/utils/format/index.d.ts +0 -1
- package/utils/miscellaneous/font-scaling.d.ts +2 -1
- package/utils/miscellaneous/get-duration.d.ts +2 -0
- package/utils/miscellaneous/index.d.ts +1 -1
- package/animations/animations.d.ts +0 -109
- package/animations/index.d.ts +0 -1
- package/components/alert/alert.component.d.ts +0 -14
- package/components/alert/alert.directive.d.ts +0 -8
- package/components/alert/alert.interfaces.d.ts +0 -13
- package/components/alert/alert.service.d.ts +0 -11
- package/components/alert/alert.tokens.d.ts +0 -6
- package/components/alert/index.d.ts +0 -5
- package/components/data-list/data-list.directive.d.ts +0 -7
- package/components/data-list/option/option-content.d.ts +0 -16
- package/components/data-list/option/option-legacy.component.d.ts +0 -24
- package/components/data-list/option/option.directive.d.ts +0 -27
- package/components/dialog/active-zone-adapter.directive.d.ts +0 -11
- package/components/dialog/dialogs.component.d.ts +0 -8
- package/components/header/header.directive.d.ts +0 -17
- package/components/header/index.d.ts +0 -1
- package/components/link/link.options.d.ts +0 -12
- package/components/textfield/textfield.directive.d.ts +0 -35
- package/directives/dropdown/dropdown-open-legacy.directive.d.ts +0 -12
- package/directives/dropdown/dropdown-open.directive.d.ts +0 -33
- package/directives/hint/hint-options.directive.d.ts +0 -36
- package/directives/notification/index.d.ts +0 -2
- package/fesm2022/taiga-ui-core-animations.mjs +0 -370
- package/fesm2022/taiga-ui-core-animations.mjs.map +0 -1
- package/fesm2022/taiga-ui-core-components-alert.mjs +0 -110
- package/fesm2022/taiga-ui-core-components-alert.mjs.map +0 -1
- package/fesm2022/taiga-ui-core-components-dialog.mjs +0 -227
- package/fesm2022/taiga-ui-core-components-dialog.mjs.map +0 -1
- package/fesm2022/taiga-ui-core-components-header.mjs +0 -42
- package/fesm2022/taiga-ui-core-components-header.mjs.map +0 -1
- package/fesm2022/taiga-ui-core-components-modal.mjs +0 -89
- package/fesm2022/taiga-ui-core-components-modal.mjs.map +0 -1
- package/fesm2022/taiga-ui-core-directives-dropdown.mjs.map +0 -1
- package/fesm2022/taiga-ui-core-directives-hint.mjs.map +0 -1
- package/fesm2022/taiga-ui-core-directives-notification.mjs +0 -73
- package/fesm2022/taiga-ui-core-directives-notification.mjs.map +0 -1
- package/fesm2022/taiga-ui-core-directives-popup.mjs.map +0 -1
- package/fesm2022/taiga-ui-core-pipes-auto-color.mjs +0 -25
- package/fesm2022/taiga-ui-core-pipes-auto-color.mjs.map +0 -1
- package/fesm2022/taiga-ui-core-pipes-calendar-sheet.mjs +0 -94
- package/fesm2022/taiga-ui-core-pipes-calendar-sheet.mjs.map +0 -1
- package/fesm2022/taiga-ui-core-pipes-flag.mjs +0 -32
- package/fesm2022/taiga-ui-core-pipes-flag.mjs.map +0 -1
- package/fesm2022/taiga-ui-core-pipes-format-date.mjs +0 -28
- package/fesm2022/taiga-ui-core-pipes-format-date.mjs.map +0 -1
- package/fesm2022/taiga-ui-core-pipes-initials.mjs +0 -29
- package/fesm2022/taiga-ui-core-pipes-initials.mjs.map +0 -1
- package/fesm2022/taiga-ui-core-pipes-month.mjs +0 -30
- package/fesm2022/taiga-ui-core-pipes-month.mjs.map +0 -1
- package/fesm2022/taiga-ui-core-pipes-order-week-days.mjs +0 -36
- package/fesm2022/taiga-ui-core-pipes-order-week-days.mjs.map +0 -1
- package/pipes/auto-color/auto-color.pipe.d.ts +0 -7
- package/pipes/auto-color/index.d.ts +0 -1
- package/pipes/calendar-sheet/index.d.ts +0 -1
- package/pipes/calendar-sheet/utils.d.ts +0 -20
- package/pipes/flag/flag.pipe.d.ts +0 -14
- package/pipes/flag/index.d.ts +0 -1
- package/pipes/format-date/format-date.pipe.d.ts +0 -9
- package/pipes/format-date/index.d.ts +0 -1
- package/pipes/initials/index.d.ts +0 -1
- package/pipes/initials/initials.pipe.d.ts +0 -7
- package/pipes/month/index.d.ts +0 -1
- package/pipes/month/month.pipe.d.ts +0 -10
- package/pipes/order-week-days/index.d.ts +0 -1
- package/services/breakpoint.service.d.ts +0 -16
- package/services/dark-theme.service.d.ts +0 -10
- package/services/format-date.service.d.ts +0 -8
- package/styles/mixins/wrapper.less +0 -64
- package/styles/mixins/wrapper.scss +0 -61
- package/styles/theme/appearance/opposite.less +0 -17
- package/styles/theme/wrapper.less +0 -211
- package/tokens/day-type-handler.d.ts +0 -7
- package/tokens/first-day-of-week.d.ts +0 -5
- package/tokens/scroll-ref.d.ts +0 -2
- package/tokens/spin-icons.d.ts +0 -6
- package/types/range-state.d.ts +0 -4
- package/types/value-content-context.d.ts +0 -4
- package/utils/format/string-hash-to-hsl.d.ts +0 -6
- package/utils/miscellaneous/to-animation-options.d.ts +0 -4
- /package/{directives → components}/title/index.d.ts +0 -0
- /package/{directives → components}/title/title.directive.d.ts +0 -0
- /package/{components → portals}/dialog/dialog.directive.d.ts +0 -0
- /package/{components → portals}/dialog/dialog.factory.d.ts +0 -0
- /package/{directives → portals}/dropdown/dropdown-content.directive.d.ts +0 -0
- /package/{directives → portals}/dropdown/dropdown-limit-width.d.ts +0 -0
- /package/{directives → portals}/dropdown/dropdown.component.d.ts +0 -0
- /package/{directives → portals}/dropdown/dropdown.driver.d.ts +0 -0
- /package/{directives → portals}/dropdown/dropdown.providers.d.ts +0 -0
- /package/{directives → portals}/dropdown/with-dropdown-open.directive.d.ts +0 -0
- /package/{directives → portals}/hint/hint-describe.directive.d.ts +0 -0
- /package/{directives → portals}/hint/hint-driver.directive.d.ts +0 -0
- /package/{directives → portals}/hint/hint-host.directive.d.ts +0 -0
- /package/{directives → portals}/hint/hint-hover.directive.d.ts +0 -0
- /package/{directives → portals}/hint/hint-manual.directive.d.ts +0 -0
- /package/{directives → portals}/hint/hint-overflow.directive.d.ts +0 -0
- /package/{directives → portals}/hint/hint-pointer.directive.d.ts +0 -0
- /package/{directives → portals}/hint/hint-unstyled.component.d.ts +0 -0
- /package/{directives → portals}/hint/hint.component.d.ts +0 -0
- /package/{directives → portals}/hint/hint.providers.d.ts +0 -0
- /package/{directives → portals}/hint/index.d.ts +0 -0
- /package/{components → portals}/modal/index.d.ts +0 -0
- /package/{directives → portals}/popup/index.d.ts +0 -0
- /package/{directives → portals}/popup/popup.directive.d.ts +0 -0
- /package/{directives → portals}/popup/popup.service.d.ts +0 -0
- /package/{directives → portals}/popup/popups.component.d.ts +0 -0
package/fesm2022/{taiga-ui-core-directives-dropdown.mjs → taiga-ui-core-portals-dropdown.mjs}
RENAMED
|
@@ -1,42 +1,41 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { Injectable, Directive, InjectionToken, Optional, Self, SkipSelf, inject,
|
|
3
|
-
import { takeUntilDestroyed, toObservable } from '@angular/core/rxjs-interop';
|
|
2
|
+
import { Injectable, Directive, InjectionToken, Optional, Self, SkipSelf, inject, ChangeDetectorRef, effect, signal, INJECTOR, input, computed, TemplateRef, forwardRef, ChangeDetectionStrategy, Component, PLATFORM_ID, contentChild, ElementRef, model, ViewContainerRef } from '@angular/core';
|
|
3
|
+
import { outputFromObservable, takeUntilDestroyed, toObservable } from '@angular/core/rxjs-interop';
|
|
4
4
|
import { EMPTY_CLIENT_RECT, TUI_TRUE_HANDLER, CHAR_ZERO_WIDTH_SPACE, CHAR_NO_BREAK_SPACE } from '@taiga-ui/cdk/constants';
|
|
5
5
|
import * as i1 from '@taiga-ui/cdk/directives/active-zone';
|
|
6
6
|
import { TuiActiveZone } from '@taiga-ui/cdk/directives/active-zone';
|
|
7
7
|
import * as i2 from '@taiga-ui/cdk/directives/animated';
|
|
8
8
|
import { TuiAnimated } from '@taiga-ui/cdk/directives/animated';
|
|
9
|
-
import { tuiInjectElement, tuiGetActualTarget, tuiPointToClientRect, tuiIsElement,
|
|
9
|
+
import { tuiInjectElement, tuiGetActualTarget, tuiPointToClientRect, tuiIsElement, tuiIsElementEditable, tuiIsHTMLElement, tuiIsTextNode, tuiIsTextfield } from '@taiga-ui/cdk/utils/dom';
|
|
10
10
|
import { tuiClamp } from '@taiga-ui/cdk/utils/math';
|
|
11
|
-
import {
|
|
12
|
-
import { TuiDriverDirective, TuiPositionAccessor, tuiFallbackAccessor, TuiRectAccessor,
|
|
11
|
+
import { tuiPx, tuiSetSignal, tuiIsString } from '@taiga-ui/cdk/utils/miscellaneous';
|
|
12
|
+
import { TuiDriverDirective, TuiPositionAccessor, tuiFallbackAccessor, TuiRectAccessor, tuiAsVehicle, tuiPositionAccessorFor, tuiRectAccessorFor, tuiAsDriver, tuiAsRectAccessor, TuiDriver, tuiAsPositionAccessor } from '@taiga-ui/core/classes';
|
|
13
13
|
import { TuiScrollbar } from '@taiga-ui/core/components/scrollbar';
|
|
14
14
|
import { TuiVisualViewportService, TuiPositionService } from '@taiga-ui/core/services';
|
|
15
15
|
import { TUI_VIEWPORT, TUI_DARK_MODE, TUI_SELECTION_STREAM } from '@taiga-ui/core/tokens';
|
|
16
16
|
import { PolymorpheusComponent, PolymorpheusTemplate, PolymorpheusOutlet } from '@taiga-ui/polymorpheus';
|
|
17
|
-
import { BehaviorSubject, Subject, throttleTime, takeWhile, map, merge, filter,
|
|
17
|
+
import { BehaviorSubject, Subject, distinctUntilChanged, throttleTime, takeWhile, map, merge, filter, EMPTY, switchMap, delay, startWith, takeUntil, fromEvent, of, tap, share, combineLatest } from 'rxjs';
|
|
18
18
|
import { coerceArray } from '@angular/cdk/coercion';
|
|
19
|
-
import { tuiZonefreeScheduler, tuiTypedFromEvent,
|
|
20
|
-
import { TuiPopupService } from '@taiga-ui/core/
|
|
21
|
-
import {
|
|
22
|
-
import {
|
|
19
|
+
import { tuiZonefreeScheduler, tuiTypedFromEvent, tuiZoneOptimized, tuiIfMap, tuiCloseWatcher, tuiStopPropagation } from '@taiga-ui/cdk/observables';
|
|
20
|
+
import { TuiPopupService } from '@taiga-ui/core/portals/popup';
|
|
21
|
+
import { tuiCheckFixedPosition, tuiGetWordRange } from '@taiga-ui/core/utils/dom';
|
|
22
|
+
import { tuiProvide, tuiCreateOptions, tuiDirectiveBinding } from '@taiga-ui/cdk/utils/di';
|
|
23
|
+
import { tuiOverrideOptions, tuiIsEditingKey } from '@taiga-ui/core/utils/miscellaneous';
|
|
23
24
|
import { isPlatformBrowser, DOCUMENT } from '@angular/common';
|
|
24
|
-
import { TUI_IS_TOUCH
|
|
25
|
-
import { shouldCall } from '@taiga-ui/event-plugins';
|
|
25
|
+
import { TUI_IS_TOUCH } from '@taiga-ui/cdk/tokens';
|
|
26
26
|
import * as i1$1 from '@taiga-ui/cdk/directives/obscured';
|
|
27
27
|
import { TuiObscured } from '@taiga-ui/cdk/directives/obscured';
|
|
28
|
-
import {
|
|
29
|
-
import { tuiIsEditingKey, tuiOverrideOptions as tuiOverrideOptions$1 } from '@taiga-ui/core/utils/miscellaneous';
|
|
28
|
+
import { tuiIsFocusable, tuiGetClosestFocusable, tuiIsFocusedIn, tuiGetFocused } from '@taiga-ui/cdk/utils/focus';
|
|
30
29
|
|
|
31
30
|
class TuiDropdownDriver extends BehaviorSubject {
|
|
32
31
|
constructor() {
|
|
33
32
|
super(false);
|
|
34
33
|
this.type = 'dropdown';
|
|
35
34
|
}
|
|
36
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
37
|
-
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.
|
|
35
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownDriver, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
36
|
+
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownDriver }); }
|
|
38
37
|
}
|
|
39
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
38
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownDriver, decorators: [{
|
|
40
39
|
type: Injectable
|
|
41
40
|
}], ctorParameters: () => [] });
|
|
42
41
|
class TuiDropdownDriverDirective extends TuiDriverDirective {
|
|
@@ -44,14 +43,11 @@ class TuiDropdownDriverDirective extends TuiDriverDirective {
|
|
|
44
43
|
super(...arguments);
|
|
45
44
|
this.type = 'dropdown';
|
|
46
45
|
}
|
|
47
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
48
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.
|
|
46
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownDriverDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
|
|
47
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.17", type: TuiDropdownDriverDirective, isStandalone: true, usesInheritance: true, ngImport: i0 }); }
|
|
49
48
|
}
|
|
50
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
51
|
-
type: Directive
|
|
52
|
-
args: [{
|
|
53
|
-
standalone: true,
|
|
54
|
-
}]
|
|
49
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownDriverDirective, decorators: [{
|
|
50
|
+
type: Directive
|
|
55
51
|
}] });
|
|
56
52
|
|
|
57
53
|
/**
|
|
@@ -62,7 +58,6 @@ const TUI_DROPDOWN_COMPONENT = new InjectionToken(ngDevMode ? 'TUI_DROPDOWN_COMP
|
|
|
62
58
|
});
|
|
63
59
|
const TUI_DROPDOWN_CONTEXT = new InjectionToken(ngDevMode ? 'TUI_DROPDOWN_CONTEXT' : '');
|
|
64
60
|
|
|
65
|
-
/** Default values for dropdown options */
|
|
66
61
|
const TUI_DROPDOWN_DEFAULT_OPTIONS = {
|
|
67
62
|
align: 'left',
|
|
68
63
|
direction: null,
|
|
@@ -72,9 +67,6 @@ const TUI_DROPDOWN_DEFAULT_OPTIONS = {
|
|
|
72
67
|
offset: 4,
|
|
73
68
|
appearance: '',
|
|
74
69
|
};
|
|
75
|
-
/**
|
|
76
|
-
* Default parameters for dropdown directive
|
|
77
|
-
*/
|
|
78
70
|
const TUI_DROPDOWN_OPTIONS = new InjectionToken(ngDevMode ? 'TUI_DROPDOWN_OPTIONS' : '', {
|
|
79
71
|
factory: () => TUI_DROPDOWN_DEFAULT_OPTIONS,
|
|
80
72
|
});
|
|
@@ -97,38 +89,25 @@ class TuiDropdownOptionsDirective {
|
|
|
97
89
|
this.maxHeight = this.options.maxHeight;
|
|
98
90
|
this.offset = this.options.offset;
|
|
99
91
|
}
|
|
100
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
101
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.
|
|
92
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownOptionsDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
93
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.17", type: TuiDropdownOptionsDirective, isStandalone: true, selector: "[tuiDropdownAlign], [tuiDropdownAppearance], [tuiDropdownDirection], [tuiDropdownLimitWidth], [tuiDropdownMinHeight], [tuiDropdownMaxHeight], [tuiDropdownOffset]", inputs: { align: ["tuiDropdownAlign", "align"], appearance: ["tuiDropdownAppearance", "appearance"], direction: ["tuiDropdownDirection", "direction"], limitWidth: ["tuiDropdownLimitWidth", "limitWidth"], minHeight: ["tuiDropdownMinHeight", "minHeight"], maxHeight: ["tuiDropdownMaxHeight", "maxHeight"], offset: ["tuiDropdownOffset", "offset"] }, providers: [tuiProvide(TUI_DROPDOWN_OPTIONS, TuiDropdownOptionsDirective)], ngImport: i0 }); }
|
|
102
94
|
}
|
|
103
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
95
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownOptionsDirective, decorators: [{
|
|
104
96
|
type: Directive,
|
|
105
97
|
args: [{
|
|
106
|
-
standalone: true,
|
|
107
98
|
selector: '[tuiDropdownAlign], [tuiDropdownAppearance], [tuiDropdownDirection], [tuiDropdownLimitWidth], [tuiDropdownMinHeight], [tuiDropdownMaxHeight], [tuiDropdownOffset]',
|
|
99
|
+
inputs: [
|
|
100
|
+
'align: tuiDropdownAlign',
|
|
101
|
+
'appearance: tuiDropdownAppearance',
|
|
102
|
+
'direction: tuiDropdownDirection',
|
|
103
|
+
'limitWidth: tuiDropdownLimitWidth',
|
|
104
|
+
'minHeight: tuiDropdownMinHeight',
|
|
105
|
+
'maxHeight: tuiDropdownMaxHeight',
|
|
106
|
+
'offset: tuiDropdownOffset',
|
|
107
|
+
],
|
|
108
108
|
providers: [tuiProvide(TUI_DROPDOWN_OPTIONS, TuiDropdownOptionsDirective)],
|
|
109
109
|
}]
|
|
110
|
-
}]
|
|
111
|
-
type: Input,
|
|
112
|
-
args: ['tuiDropdownAlign']
|
|
113
|
-
}], appearance: [{
|
|
114
|
-
type: Input,
|
|
115
|
-
args: ['tuiDropdownAppearance']
|
|
116
|
-
}], direction: [{
|
|
117
|
-
type: Input,
|
|
118
|
-
args: ['tuiDropdownDirection']
|
|
119
|
-
}], limitWidth: [{
|
|
120
|
-
type: Input,
|
|
121
|
-
args: ['tuiDropdownLimitWidth']
|
|
122
|
-
}], minHeight: [{
|
|
123
|
-
type: Input,
|
|
124
|
-
args: ['tuiDropdownMinHeight']
|
|
125
|
-
}], maxHeight: [{
|
|
126
|
-
type: Input,
|
|
127
|
-
args: ['tuiDropdownMaxHeight']
|
|
128
|
-
}], offset: [{
|
|
129
|
-
type: Input,
|
|
130
|
-
args: ['tuiDropdownOffset']
|
|
131
|
-
}] } });
|
|
110
|
+
}] });
|
|
132
111
|
|
|
133
112
|
class TuiDropdownPosition extends TuiPositionAccessor {
|
|
134
113
|
constructor() {
|
|
@@ -136,18 +115,16 @@ class TuiDropdownPosition extends TuiPositionAccessor {
|
|
|
136
115
|
this.el = tuiInjectElement();
|
|
137
116
|
this.options = inject(TUI_DROPDOWN_OPTIONS);
|
|
138
117
|
this.viewport = inject(TUI_VIEWPORT);
|
|
139
|
-
this.
|
|
118
|
+
this.direction = new Subject();
|
|
140
119
|
this.type = 'dropdown';
|
|
141
|
-
this.accessor = tuiFallbackAccessor('dropdown')(inject(TuiRectAccessor
|
|
142
|
-
|
|
143
|
-
emitDirection(direction) {
|
|
144
|
-
this.directionChange.emit(direction);
|
|
120
|
+
this.accessor = tuiFallbackAccessor('dropdown')(inject(TuiRectAccessor, { optional: true }), { getClientRect: () => this.el.getBoundingClientRect() });
|
|
121
|
+
this.tuiDropdownDirectionChange = outputFromObservable(this.direction.pipe(distinctUntilChanged()));
|
|
145
122
|
}
|
|
146
123
|
getPosition({ width, height }) {
|
|
147
124
|
if (!width && !height) {
|
|
148
125
|
this.previous = undefined;
|
|
149
126
|
}
|
|
150
|
-
const hostRect = this.accessor
|
|
127
|
+
const hostRect = this.accessor.getClientRect();
|
|
151
128
|
const viewportRect = this.viewport.getClientRect();
|
|
152
129
|
const { minHeight, direction, offset, limitWidth } = this.options;
|
|
153
130
|
const align = this.getAlign(this.options.align);
|
|
@@ -177,12 +154,12 @@ class TuiDropdownPosition extends TuiPositionAccessor {
|
|
|
177
154
|
const better = available.top > available.bottom ? 'top' : 'bottom';
|
|
178
155
|
if ((available[previous] > minHeight && direction) ||
|
|
179
156
|
available[previous] > height) {
|
|
180
|
-
this.
|
|
181
|
-
return [position[
|
|
157
|
+
this.direction.next(previous);
|
|
158
|
+
return [position[align], position[previous]];
|
|
182
159
|
}
|
|
183
160
|
this.previous = better;
|
|
184
|
-
this.
|
|
185
|
-
return [position[
|
|
161
|
+
this.direction.next(better);
|
|
162
|
+
return [position[align], position[better]];
|
|
186
163
|
}
|
|
187
164
|
getAlign(align) {
|
|
188
165
|
const rtl = this.el.matches('[dir="rtl"] :scope');
|
|
@@ -191,28 +168,18 @@ class TuiDropdownPosition extends TuiPositionAccessor {
|
|
|
191
168
|
}
|
|
192
169
|
return rtl && align === 'right' ? 'left' : align;
|
|
193
170
|
}
|
|
194
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
195
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.
|
|
171
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownPosition, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
|
|
172
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.17", type: TuiDropdownPosition, isStandalone: true, outputs: { tuiDropdownDirectionChange: "tuiDropdownDirectionChange" }, usesInheritance: true, ngImport: i0 }); }
|
|
196
173
|
}
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
]
|
|
200
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiDropdownPosition, decorators: [{
|
|
201
|
-
type: Directive,
|
|
202
|
-
args: [{
|
|
203
|
-
standalone: true,
|
|
204
|
-
}]
|
|
205
|
-
}], propDecorators: { directionChange: [{
|
|
206
|
-
type: Output,
|
|
207
|
-
args: ['tuiDropdownDirectionChange']
|
|
208
|
-
}], emitDirection: [] } });
|
|
174
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownPosition, decorators: [{
|
|
175
|
+
type: Directive
|
|
176
|
+
}] });
|
|
209
177
|
|
|
210
178
|
class TuiDropdownDirective {
|
|
211
179
|
constructor() {
|
|
212
180
|
this.refresh$ = new Subject();
|
|
213
181
|
this.service = inject(TuiPopupService);
|
|
214
182
|
this.cdr = inject(ChangeDetectorRef);
|
|
215
|
-
// TODO: think of a better solution later
|
|
216
183
|
this.drivers = coerceArray(inject(TuiDropdownDriver, { self: true, optional: true }));
|
|
217
184
|
this.sub = this.refresh$
|
|
218
185
|
.pipe(throttleTime(0, tuiZonefreeScheduler()), takeUntilDestroyed())
|
|
@@ -220,33 +187,25 @@ class TuiDropdownDirective {
|
|
|
220
187
|
this.ref()?.changeDetectorRef.detectChanges();
|
|
221
188
|
this.ref()?.changeDetectorRef.markForCheck();
|
|
222
189
|
});
|
|
190
|
+
this.autoClose = effect(() => {
|
|
191
|
+
if (!this.content()) {
|
|
192
|
+
this.toggle(false);
|
|
193
|
+
}
|
|
194
|
+
});
|
|
195
|
+
this.ref = signal(null);
|
|
223
196
|
this.el = tuiInjectElement();
|
|
224
197
|
this.type = 'dropdown';
|
|
225
198
|
this.component = new PolymorpheusComponent(inject(TUI_DROPDOWN_COMPONENT), inject(INJECTOR));
|
|
226
|
-
this.
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
this._content.set(content instanceof TemplateRef
|
|
233
|
-
? new PolymorpheusTemplate(content, this.cdr)
|
|
234
|
-
: content);
|
|
235
|
-
if (!this._content()) {
|
|
236
|
-
this.toggle(false);
|
|
237
|
-
}
|
|
199
|
+
this.tuiDropdown = input();
|
|
200
|
+
this.content = computed((content = this.tuiDropdown()) => {
|
|
201
|
+
return content instanceof TemplateRef
|
|
202
|
+
? new PolymorpheusTemplate(content, this.cdr)
|
|
203
|
+
: content;
|
|
204
|
+
});
|
|
238
205
|
}
|
|
239
206
|
get position() {
|
|
240
207
|
return tuiCheckFixedPosition(this.el) ? 'fixed' : 'absolute';
|
|
241
208
|
}
|
|
242
|
-
// TODO(v5): delete
|
|
243
|
-
get content() {
|
|
244
|
-
return this._content();
|
|
245
|
-
}
|
|
246
|
-
// TODO(v5): delete
|
|
247
|
-
set content(x) {
|
|
248
|
-
this._content.set(x);
|
|
249
|
-
}
|
|
250
209
|
ngAfterViewChecked() {
|
|
251
210
|
this.refresh$.next();
|
|
252
211
|
}
|
|
@@ -258,32 +217,25 @@ class TuiDropdownDirective {
|
|
|
258
217
|
}
|
|
259
218
|
toggle(show) {
|
|
260
219
|
const ref = this.ref();
|
|
261
|
-
if (show && this.
|
|
220
|
+
if (show && this.content() && !ref) {
|
|
262
221
|
this.ref.set(this.service.add(this.component));
|
|
263
222
|
}
|
|
264
223
|
else if (!show && ref) {
|
|
265
224
|
this.ref.set(null);
|
|
266
225
|
ref.destroy();
|
|
267
226
|
}
|
|
268
|
-
this.drivers.forEach((driver) => driver?.next(show));
|
|
269
227
|
// TODO: Remove in v5, only needed in Angular 16
|
|
270
228
|
this.cdr.markForCheck();
|
|
229
|
+
this.drivers.forEach((driver) => driver?.next(show));
|
|
271
230
|
}
|
|
272
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
273
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "
|
|
274
|
-
tuiAsRectAccessor(TuiDropdownDirective),
|
|
275
|
-
tuiAsVehicle(TuiDropdownDirective),
|
|
276
|
-
], exportAs: ["tuiDropdown"], hostDirectives: [{ directive: TuiDropdownDriverDirective }, { directive: TuiDropdownPosition, outputs: ["tuiDropdownDirectionChange", "tuiDropdownDirectionChange"] }], ngImport: i0 }); }
|
|
231
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
232
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.17", type: TuiDropdownDirective, isStandalone: true, selector: "[tuiDropdown]:not(ng-container):not(ng-template)", inputs: { tuiDropdown: { classPropertyName: "tuiDropdown", publicName: "tuiDropdown", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class.tui-dropdown-open": "ref()" } }, providers: [tuiAsVehicle(TuiDropdownDirective)], exportAs: ["tuiDropdown"], hostDirectives: [{ directive: TuiDropdownDriverDirective }, { directive: TuiDropdownPosition, outputs: ["tuiDropdownDirectionChange", "tuiDropdownDirectionChange"] }], ngImport: i0 }); }
|
|
277
233
|
}
|
|
278
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
234
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownDirective, decorators: [{
|
|
279
235
|
type: Directive,
|
|
280
236
|
args: [{
|
|
281
|
-
standalone: true,
|
|
282
237
|
selector: '[tuiDropdown]:not(ng-container):not(ng-template)',
|
|
283
|
-
providers: [
|
|
284
|
-
tuiAsRectAccessor(TuiDropdownDirective),
|
|
285
|
-
tuiAsVehicle(TuiDropdownDirective),
|
|
286
|
-
],
|
|
238
|
+
providers: [tuiAsVehicle(TuiDropdownDirective)],
|
|
287
239
|
exportAs: 'tuiDropdown',
|
|
288
240
|
hostDirectives: [
|
|
289
241
|
TuiDropdownDriverDirective,
|
|
@@ -296,9 +248,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImpo
|
|
|
296
248
|
'[class.tui-dropdown-open]': 'ref()',
|
|
297
249
|
},
|
|
298
250
|
}]
|
|
299
|
-
}]
|
|
300
|
-
type: Input
|
|
301
|
-
}] } });
|
|
251
|
+
}] });
|
|
302
252
|
|
|
303
253
|
/**
|
|
304
254
|
* @description:
|
|
@@ -312,7 +262,7 @@ class TuiDropdownComponent {
|
|
|
312
262
|
this.viewport = inject(TUI_VIEWPORT);
|
|
313
263
|
this.vvs = inject(TuiVisualViewportService);
|
|
314
264
|
this.styles$ = inject(TuiPositionService).pipe(takeWhile(() => this.directive.el.isConnected &&
|
|
315
|
-
!!this.directive.el.getBoundingClientRect().height), map((v) => (this.position === 'fixed' ? this.vvs.correct(v) : v)), map((
|
|
265
|
+
!!this.directive.el.getBoundingClientRect().height), map((v) => (this.position === 'fixed' ? this.vvs.correct(v) : v)), map((point) => this.getStyles(...point)), takeUntilDestroyed());
|
|
316
266
|
this.options = inject(TUI_DROPDOWN_OPTIONS);
|
|
317
267
|
this.directive = inject(TuiDropdownDirective);
|
|
318
268
|
this.context = inject(TUI_DROPDOWN_CONTEXT, { optional: true });
|
|
@@ -351,52 +301,47 @@ class TuiDropdownComponent {
|
|
|
351
301
|
maxWidth: tuiPx(Math.round(viewport.width) - 16), // 8px min gap from each side
|
|
352
302
|
};
|
|
353
303
|
}
|
|
354
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
355
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.
|
|
304
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
305
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.17", type: TuiDropdownComponent, isStandalone: true, selector: "tui-dropdown", host: { properties: { "attr.data-appearance": "options.appearance", "attr.tuiTheme": "theme()" } }, providers: [
|
|
356
306
|
TuiPositionService,
|
|
357
307
|
tuiPositionAccessorFor('dropdown', TuiDropdownPosition),
|
|
358
|
-
tuiRectAccessorFor('dropdown', TuiDropdownDirective),
|
|
359
|
-
], hostDirectives: [{ directive: i1.TuiActiveZone }, { directive: i2.TuiAnimated }], ngImport: i0, template: "<tui-scrollbar class=\"t-scroll\">\n <div\n *polymorpheusOutlet=\"directive.
|
|
308
|
+
tuiRectAccessorFor('dropdown', forwardRef(() => TuiDropdownDirective)),
|
|
309
|
+
], hostDirectives: [{ directive: i1.TuiActiveZone }, { directive: i2.TuiAnimated }], ngImport: i0, template: "<tui-scrollbar class=\"t-scroll\">\n <div\n *polymorpheusOutlet=\"directive.content() as text; context: {$implicit: close}\"\n class=\"t-primitive\"\n >\n {{ text }}\n </div>\n</tui-scrollbar>\n", styles: [":host{position:absolute;display:flex;box-shadow:var(--tui-shadow-medium);color:var(--tui-text-primary);background:var(--tui-background-elevation-3);border-radius:var(--tui-radius-m);overflow:hidden;border:1px solid var(--tui-border-normal);box-sizing:border-box;isolation:isolate;pointer-events:auto;--tui-from: translateY(-1rem)}:host.tui-enter,:host.tui-leave{animation-name:tuiFade,tuiSlide}:host:not([style*=top]){visibility:hidden}.t-scroll{flex-grow:1;max-inline-size:100%;inline-size:max-content;overscroll-behavior:none}.t-primitive{padding:1rem}\n"], dependencies: [{ kind: "directive", type: PolymorpheusOutlet, selector: "[polymorpheusOutlet]", inputs: ["polymorpheusOutlet", "polymorpheusOutletContext"] }, { kind: "component", type: TuiScrollbar, selector: "tui-scrollbar" }], changeDetection: i0.ChangeDetectionStrategy.Default }); }
|
|
360
310
|
}
|
|
361
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
311
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownComponent, decorators: [{
|
|
362
312
|
type: Component,
|
|
363
313
|
args: [{ selector: 'tui-dropdown', imports: [PolymorpheusOutlet, TuiScrollbar], changeDetection: ChangeDetectionStrategy.Default, providers: [
|
|
364
314
|
TuiPositionService,
|
|
365
315
|
tuiPositionAccessorFor('dropdown', TuiDropdownPosition),
|
|
366
|
-
tuiRectAccessorFor('dropdown', TuiDropdownDirective),
|
|
316
|
+
tuiRectAccessorFor('dropdown', forwardRef(() => TuiDropdownDirective)),
|
|
367
317
|
], hostDirectives: [TuiActiveZone, TuiAnimated], host: {
|
|
368
318
|
'[attr.data-appearance]': 'options.appearance',
|
|
369
319
|
'[attr.tuiTheme]': 'theme()',
|
|
370
|
-
}, template: "<tui-scrollbar class=\"t-scroll\">\n <div\n *polymorpheusOutlet=\"directive.
|
|
320
|
+
}, template: "<tui-scrollbar class=\"t-scroll\">\n <div\n *polymorpheusOutlet=\"directive.content() as text; context: {$implicit: close}\"\n class=\"t-primitive\"\n >\n {{ text }}\n </div>\n</tui-scrollbar>\n", styles: [":host{position:absolute;display:flex;box-shadow:var(--tui-shadow-medium);color:var(--tui-text-primary);background:var(--tui-background-elevation-3);border-radius:var(--tui-radius-m);overflow:hidden;border:1px solid var(--tui-border-normal);box-sizing:border-box;isolation:isolate;pointer-events:auto;--tui-from: translateY(-1rem)}:host.tui-enter,:host.tui-leave{animation-name:tuiFade,tuiSlide}:host:not([style*=top]){visibility:hidden}.t-scroll{flex-grow:1;max-inline-size:100%;inline-size:max-content;overscroll-behavior:none}.t-primitive{padding:1rem}\n"] }]
|
|
371
321
|
}] });
|
|
372
322
|
|
|
373
323
|
class TuiDropdownContent {
|
|
374
324
|
constructor() {
|
|
375
325
|
this.directive = inject(TuiDropdownDirective);
|
|
376
|
-
this.directive.tuiDropdown
|
|
326
|
+
tuiSetSignal(this.directive.tuiDropdown, inject(TemplateRef));
|
|
377
327
|
if (isPlatformBrowser(inject(PLATFORM_ID)) &&
|
|
378
328
|
this.directive.el.matches(':focus-within')) {
|
|
379
329
|
this.directive.toggle(true);
|
|
380
330
|
}
|
|
381
331
|
}
|
|
382
332
|
ngOnDestroy() {
|
|
383
|
-
this.directive.tuiDropdown
|
|
333
|
+
tuiSetSignal(this.directive.tuiDropdown, null);
|
|
384
334
|
}
|
|
385
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
386
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.
|
|
335
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownContent, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
336
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.17", type: TuiDropdownContent, isStandalone: true, selector: "ng-template[tuiDropdown]", ngImport: i0 }); }
|
|
387
337
|
}
|
|
388
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
338
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownContent, decorators: [{
|
|
389
339
|
type: Directive,
|
|
390
340
|
args: [{
|
|
391
|
-
standalone: true,
|
|
392
341
|
selector: 'ng-template[tuiDropdown]',
|
|
393
342
|
}]
|
|
394
343
|
}], ctorParameters: () => [] });
|
|
395
344
|
|
|
396
|
-
function activeZoneFilter(event) {
|
|
397
|
-
return (!event ||
|
|
398
|
-
(this.driver.value && !this.activeZone.contains(tuiGetActualTarget(event))));
|
|
399
|
-
}
|
|
400
345
|
class TuiDropdownContext extends TuiRectAccessor {
|
|
401
346
|
constructor() {
|
|
402
347
|
super(...arguments);
|
|
@@ -406,37 +351,33 @@ class TuiDropdownContext extends TuiRectAccessor {
|
|
|
406
351
|
this.activeZone = inject(TuiActiveZone);
|
|
407
352
|
this.driver = inject(TuiDropdownDriver);
|
|
408
353
|
this.doc = inject(DOCUMENT);
|
|
409
|
-
this.sub = merge(tuiTypedFromEvent(this.doc, 'pointerdown'), tuiTypedFromEvent(this.doc, 'contextmenu', { capture: true }))
|
|
410
|
-
.pipe(
|
|
411
|
-
.
|
|
354
|
+
this.sub = merge(tuiTypedFromEvent(this.doc, 'pointerdown'), tuiTypedFromEvent(this.doc, 'keydown').pipe(filter(({ key }) => key === 'Escape')), tuiTypedFromEvent(this.doc, 'contextmenu', { capture: true }))
|
|
355
|
+
.pipe(filter((event) => this.driver.value &&
|
|
356
|
+
!this.activeZone.contains(tuiGetActualTarget(event))), tuiZoneOptimized(), takeUntilDestroyed())
|
|
357
|
+
.subscribe(() => {
|
|
358
|
+
this.driver.next(false);
|
|
359
|
+
this.currentRect = EMPTY_CLIENT_RECT;
|
|
360
|
+
});
|
|
412
361
|
this.type = 'dropdown';
|
|
413
362
|
}
|
|
414
363
|
getClientRect() {
|
|
415
364
|
return this.currentRect;
|
|
416
365
|
}
|
|
417
|
-
closeDropdown(_event) {
|
|
418
|
-
this.driver.next(false);
|
|
419
|
-
this.currentRect = EMPTY_CLIENT_RECT;
|
|
420
|
-
}
|
|
421
366
|
onContextMenu(x, y) {
|
|
422
367
|
this.currentRect = tuiPointToClientRect(x, y);
|
|
423
368
|
this.driver.next(true);
|
|
424
369
|
}
|
|
425
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
426
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.
|
|
370
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownContext, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
|
|
371
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.17", type: TuiDropdownContext, isStandalone: true, selector: "[tuiDropdownContext]", host: { listeners: { "longtap": "onContextMenu($event.detail.clientX, $event.detail.clientY)" }, properties: { "style.user-select": "userSelect()", "style.-webkit-user-select": "userSelect()", "style.-webkit-touch-callout": "userSelect()" } }, providers: [
|
|
427
372
|
TuiActiveZone,
|
|
428
373
|
TuiDropdownDriver,
|
|
429
374
|
tuiAsDriver(TuiDropdownDriver),
|
|
430
375
|
tuiAsRectAccessor(TuiDropdownContext),
|
|
431
376
|
], usesInheritance: true, ngImport: i0 }); }
|
|
432
377
|
}
|
|
433
|
-
|
|
434
|
-
shouldCall(activeZoneFilter)
|
|
435
|
-
], TuiDropdownContext.prototype, "closeDropdown", null);
|
|
436
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiDropdownContext, decorators: [{
|
|
378
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownContext, decorators: [{
|
|
437
379
|
type: Directive,
|
|
438
380
|
args: [{
|
|
439
|
-
standalone: true,
|
|
440
381
|
selector: '[tuiDropdownContext]',
|
|
441
382
|
providers: [
|
|
442
383
|
TuiActiveZone,
|
|
@@ -448,11 +389,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImpo
|
|
|
448
389
|
'[style.user-select]': 'userSelect()',
|
|
449
390
|
'[style.-webkit-user-select]': 'userSelect()',
|
|
450
391
|
'[style.-webkit-touch-callout]': 'userSelect()',
|
|
451
|
-
'(document:keydown.esc)': 'closeDropdown()',
|
|
452
392
|
'(longtap)': 'onContextMenu($event.detail.clientX, $event.detail.clientY)',
|
|
453
393
|
},
|
|
454
394
|
}]
|
|
455
|
-
}]
|
|
395
|
+
}] });
|
|
456
396
|
|
|
457
397
|
/** Default values for hint options */
|
|
458
398
|
const TUI_DROPDOWN_HOVER_DEFAULT_OPTIONS = {
|
|
@@ -462,48 +402,58 @@ const TUI_DROPDOWN_HOVER_DEFAULT_OPTIONS = {
|
|
|
462
402
|
/**
|
|
463
403
|
* Default parameters for dropdown hover directive
|
|
464
404
|
*/
|
|
465
|
-
const TUI_DROPDOWN_HOVER_OPTIONS =
|
|
466
|
-
factory: () => TUI_DROPDOWN_HOVER_DEFAULT_OPTIONS,
|
|
467
|
-
});
|
|
468
|
-
function tuiDropdownHoverOptionsProvider(options) {
|
|
469
|
-
return tuiProvideOptions(TUI_DROPDOWN_HOVER_OPTIONS, options, TUI_DROPDOWN_HOVER_DEFAULT_OPTIONS);
|
|
470
|
-
}
|
|
405
|
+
const [TUI_DROPDOWN_HOVER_OPTIONS, tuiDropdownHoverOptionsProvider] = tuiCreateOptions(TUI_DROPDOWN_HOVER_DEFAULT_OPTIONS);
|
|
471
406
|
|
|
472
|
-
|
|
473
|
-
|
|
474
|
-
|
|
475
|
-
|
|
476
|
-
|
|
477
|
-
|
|
478
|
-
this.
|
|
479
|
-
|
|
480
|
-
|
|
407
|
+
class TuiDropdownClose {
|
|
408
|
+
constructor() {
|
|
409
|
+
this.el = tuiInjectElement();
|
|
410
|
+
this.ref = inject(TuiDropdownDirective).ref;
|
|
411
|
+
this.open = inject(TuiDropdownOpen);
|
|
412
|
+
this.obscured = inject(TuiObscured);
|
|
413
|
+
this.activeZone = inject(TuiActiveZone);
|
|
414
|
+
this.tuiDropdownClose = outputFromObservable(merge(inject(TuiDropdownDriver).pipe(tuiIfMap(() => merge(tuiCloseWatcher(), this.obscured.tuiObscured$.pipe(filter(Boolean)), this.activeZone.tuiActiveZoneChange.pipe(filter((a) => !a)), tuiTypedFromEvent(this.el, 'focusin').pipe(filter((event) => !this.open.host.contains(tuiGetActualTarget(event)) ||
|
|
415
|
+
!this.ref()))))),
|
|
416
|
+
// @ts-ignore
|
|
417
|
+
typeof CloseWatcher === 'undefined'
|
|
418
|
+
? tuiTypedFromEvent(inject(DOCUMENT), 'keydown', { capture: true }).pipe(filter(({ key }) => key === 'Escape' &&
|
|
419
|
+
this.open.open() &&
|
|
420
|
+
!this.ref()?.location.nativeElement?.nextElementSibling), tuiStopPropagation())
|
|
421
|
+
: EMPTY));
|
|
422
|
+
}
|
|
423
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownClose, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
424
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.17", type: TuiDropdownClose, isStandalone: true, outputs: { tuiDropdownClose: "tuiDropdownClose" }, ngImport: i0 }); }
|
|
481
425
|
}
|
|
426
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownClose, decorators: [{
|
|
427
|
+
type: Directive
|
|
428
|
+
}] });
|
|
429
|
+
|
|
482
430
|
class TuiDropdownOpen {
|
|
483
431
|
constructor() {
|
|
432
|
+
this.dropdownHost = contentChild('tuiDropdownHost', {
|
|
433
|
+
descendants: true,
|
|
434
|
+
read: ElementRef,
|
|
435
|
+
});
|
|
484
436
|
this.directive = inject(TuiDropdownDirective);
|
|
485
437
|
this.el = tuiInjectElement();
|
|
486
438
|
this.obscured = inject(TuiObscured);
|
|
487
|
-
this.activeZone = inject(TuiActiveZone);
|
|
488
|
-
this.dropdown = computed(() => this.directive.ref()?.location.nativeElement);
|
|
489
|
-
this.tuiDropdownEnabled = true;
|
|
490
|
-
this.tuiDropdownOpen = false;
|
|
491
|
-
this.tuiDropdownOpenChange = new EventEmitter();
|
|
492
|
-
// TODO: make it private when all legacy controls will be deleted from @taiga-ui/legacy (5.0)
|
|
493
439
|
this.driver = inject(TuiDropdownDriver);
|
|
494
|
-
this.
|
|
495
|
-
|
|
496
|
-
|
|
497
|
-
|
|
498
|
-
this.
|
|
499
|
-
|
|
500
|
-
|
|
501
|
-
|
|
502
|
-
|
|
440
|
+
this.dropdown = computed(() => this.directive.ref()?.location.nativeElement);
|
|
441
|
+
this.enabled = input(true, { alias: 'tuiDropdownEnabled' });
|
|
442
|
+
this.open = model(false, { alias: 'tuiDropdownOpen' });
|
|
443
|
+
this.driveEffect = effect(() => this.drive(this.open()));
|
|
444
|
+
this.syncSub = this.driver
|
|
445
|
+
.pipe(filter((open) => open !== this.open()), takeUntilDestroyed())
|
|
446
|
+
.subscribe((open) => this.update(open));
|
|
447
|
+
this.keydownSub = tuiTypedFromEvent(inject(DOCUMENT), 'keydown')
|
|
448
|
+
.pipe(takeUntilDestroyed())
|
|
449
|
+
.subscribe((event) => this.onKeydown(event));
|
|
503
450
|
}
|
|
504
|
-
|
|
505
|
-
this.
|
|
506
|
-
|
|
451
|
+
get host() {
|
|
452
|
+
const initial = this.dropdownHost()?.nativeElement || this.el;
|
|
453
|
+
const focusable = tuiIsFocusable(initial)
|
|
454
|
+
? initial
|
|
455
|
+
: tuiGetClosestFocusable({ initial, root: this.el });
|
|
456
|
+
return this.dropdownHost()?.nativeElement || focusable || this.el;
|
|
507
457
|
}
|
|
508
458
|
toggle(open) {
|
|
509
459
|
if (this.focused && !open) {
|
|
@@ -511,25 +461,27 @@ class TuiDropdownOpen {
|
|
|
511
461
|
}
|
|
512
462
|
this.update(open);
|
|
513
463
|
}
|
|
514
|
-
onEsc(event) {
|
|
515
|
-
event.preventDefault();
|
|
516
|
-
this.toggle(false);
|
|
517
|
-
}
|
|
518
464
|
onClick(target) {
|
|
519
465
|
if (!this.editable && this.host.contains(target)) {
|
|
520
|
-
this.update(!this.
|
|
466
|
+
this.update(!this.open());
|
|
521
467
|
}
|
|
522
468
|
}
|
|
523
469
|
onArrow(event, up) {
|
|
524
470
|
if (!tuiIsElement(event.target) ||
|
|
525
471
|
!this.host.contains(event.target) ||
|
|
526
|
-
!this.
|
|
527
|
-
!this.directive.
|
|
472
|
+
!this.enabled() ||
|
|
473
|
+
!this.directive.content()) {
|
|
528
474
|
return;
|
|
529
475
|
}
|
|
530
476
|
event.preventDefault();
|
|
531
477
|
this.focusDropdown(up);
|
|
532
478
|
}
|
|
479
|
+
get editable() {
|
|
480
|
+
return tuiIsElementEditable(this.host);
|
|
481
|
+
}
|
|
482
|
+
get focused() {
|
|
483
|
+
return tuiIsFocusedIn(this.host) || tuiIsFocusedIn(this.dropdown());
|
|
484
|
+
}
|
|
533
485
|
onKeydown(event) {
|
|
534
486
|
const target = tuiGetActualTarget(event);
|
|
535
487
|
if (!event.defaultPrevented &&
|
|
@@ -541,29 +493,15 @@ class TuiDropdownOpen {
|
|
|
541
493
|
this.host.focus({ preventScroll: true });
|
|
542
494
|
}
|
|
543
495
|
}
|
|
544
|
-
get host() {
|
|
545
|
-
const initial = this.dropdownHost?.nativeElement || this.el;
|
|
546
|
-
const focusable = tuiIsKeyboardFocusable(initial)
|
|
547
|
-
? initial
|
|
548
|
-
: tuiGetClosestFocusable({ initial, root: this.el });
|
|
549
|
-
return this.dropdownHost?.nativeElement || focusable || this.el;
|
|
550
|
-
}
|
|
551
|
-
get editable() {
|
|
552
|
-
return tuiIsElementEditable(this.host);
|
|
553
|
-
}
|
|
554
|
-
get focused() {
|
|
555
|
-
return tuiIsFocusedIn(this.host) || tuiIsFocusedIn(this.dropdown());
|
|
556
|
-
}
|
|
557
496
|
update(open) {
|
|
558
|
-
if (open && !this.
|
|
497
|
+
if (open && !this.enabled()) {
|
|
559
498
|
return this.drive();
|
|
560
499
|
}
|
|
561
|
-
this.
|
|
562
|
-
this.tuiDropdownOpenChange.emit(open);
|
|
500
|
+
this.open.set(open);
|
|
563
501
|
this.drive();
|
|
564
502
|
}
|
|
565
|
-
drive(open =
|
|
566
|
-
this.obscured.tuiObscuredEnabled
|
|
503
|
+
drive(open = this.open() && this.enabled()) {
|
|
504
|
+
tuiSetSignal(this.obscured.tuiObscuredEnabled, open);
|
|
567
505
|
this.driver.next(open);
|
|
568
506
|
}
|
|
569
507
|
focusDropdown(previous) {
|
|
@@ -579,20 +517,20 @@ class TuiDropdownOpen {
|
|
|
579
517
|
child.remove();
|
|
580
518
|
focusable?.focus();
|
|
581
519
|
}
|
|
582
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
583
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "
|
|
520
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownOpen, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
521
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "19.2.17", type: TuiDropdownOpen, isStandalone: true, selector: "[tuiDropdown][tuiDropdownAuto],[tuiDropdown][tuiDropdownOpen],[tuiDropdown][tuiDropdownOpenChange]", inputs: { enabled: { classPropertyName: "enabled", publicName: "tuiDropdownEnabled", isSignal: true, isRequired: false, transformFunction: null }, open: { classPropertyName: "open", publicName: "tuiDropdownOpen", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "tuiDropdownOpenChange" }, host: { listeners: { "click": "onClick($event.target)", "keydown.arrowDown": "onArrow($event, false)", "keydown.arrowUp": "onArrow($event, true)", "tuiActiveZoneChange": "0", "tuiDropdownClose": "toggle(false)" } }, providers: [TuiDropdownDriver, tuiAsDriver(TuiDropdownDriver)], queries: [{ propertyName: "dropdownHost", first: true, predicate: ["tuiDropdownHost"], descendants: true, read: ElementRef, isSignal: true }], hostDirectives: [{ directive: i1$1.TuiObscured }, { directive: TuiDropdownClose, outputs: ["tuiDropdownClose", "tuiDropdownClose"] }, { directive: i1.TuiActiveZone, inputs: ["tuiActiveZoneParent", "tuiActiveZoneParent"], outputs: ["tuiActiveZoneChange", "tuiActiveZoneChange"] }], ngImport: i0 }); }
|
|
584
522
|
}
|
|
585
|
-
|
|
586
|
-
shouldCall(shouldClose)
|
|
587
|
-
], TuiDropdownOpen.prototype, "onEsc", null);
|
|
588
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiDropdownOpen, decorators: [{
|
|
523
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownOpen, decorators: [{
|
|
589
524
|
type: Directive,
|
|
590
525
|
args: [{
|
|
591
|
-
|
|
592
|
-
selector: '[tuiDropdown][tuiDropdownOpen],[tuiDropdown][tuiDropdownOpenChange]',
|
|
526
|
+
selector: '[tuiDropdown][tuiDropdownAuto],[tuiDropdown][tuiDropdownOpen],[tuiDropdown][tuiDropdownOpenChange]',
|
|
593
527
|
providers: [TuiDropdownDriver, tuiAsDriver(TuiDropdownDriver)],
|
|
594
528
|
hostDirectives: [
|
|
595
529
|
TuiObscured,
|
|
530
|
+
{
|
|
531
|
+
directive: TuiDropdownClose,
|
|
532
|
+
outputs: ['tuiDropdownClose'],
|
|
533
|
+
},
|
|
596
534
|
{
|
|
597
535
|
directive: TuiActiveZone,
|
|
598
536
|
inputs: ['tuiActiveZoneParent'],
|
|
@@ -603,43 +541,37 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImpo
|
|
|
603
541
|
'(click)': 'onClick($event.target)',
|
|
604
542
|
'(keydown.arrowDown)': 'onArrow($event, false)',
|
|
605
543
|
'(keydown.arrowUp)': 'onArrow($event, true)',
|
|
606
|
-
'(document:keydown.zoneless.capture)': 'onEsc($event)',
|
|
607
|
-
'(document:keydown.zoneless)': 'onKeydown($event)',
|
|
608
544
|
// TODO: Necessary because startWith(false) + distinctUntilChanged() in TuiActiveZone, think of better solution
|
|
609
545
|
'(tuiActiveZoneChange)': '0',
|
|
546
|
+
'(tuiDropdownClose)': 'toggle(false)',
|
|
610
547
|
},
|
|
611
548
|
}]
|
|
612
|
-
}]
|
|
613
|
-
type: ContentChild,
|
|
614
|
-
args: ['tuiDropdownHost', { descendants: true, read: ElementRef }]
|
|
615
|
-
}], tuiDropdownEnabled: [{
|
|
616
|
-
type: Input
|
|
617
|
-
}], tuiDropdownOpen: [{
|
|
618
|
-
type: Input
|
|
619
|
-
}], tuiDropdownOpenChange: [{
|
|
620
|
-
type: Output
|
|
621
|
-
}], onEsc: [] } });
|
|
549
|
+
}] });
|
|
622
550
|
|
|
623
551
|
class TuiDropdownHover extends TuiDriver {
|
|
624
552
|
constructor() {
|
|
625
553
|
super((subscriber) => this.stream$.subscribe(subscriber));
|
|
554
|
+
this.dropdownHost = contentChild('tuiDropdownHost', {
|
|
555
|
+
descendants: true,
|
|
556
|
+
read: ElementRef,
|
|
557
|
+
});
|
|
558
|
+
this.hovered = false;
|
|
626
559
|
this.el = tuiInjectElement();
|
|
627
560
|
this.doc = inject(DOCUMENT);
|
|
628
561
|
this.options = inject(TUI_DROPDOWN_HOVER_OPTIONS);
|
|
629
562
|
this.activeZone = inject(TuiActiveZone);
|
|
630
563
|
this.open = inject(TuiDropdownOpen, { optional: true });
|
|
564
|
+
this.stream$ = merge(
|
|
631
565
|
/**
|
|
632
566
|
* Dropdown can be removed not only via click/touch –
|
|
633
567
|
* swipe on mobile devices removes dropdown sheet without triggering new mouseover / mouseout events.
|
|
634
568
|
*/
|
|
635
|
-
|
|
636
|
-
this.stream$ = merge(this.dropdownExternalRemoval$.pipe(switchMap(() => tuiTypedFromEvent(this.doc, 'pointerdown').pipe(map(tuiGetActualTarget), delay(this.hideDelay), startWith(null), takeUntil(fromEvent(this.doc, 'mouseover'))))), tuiTypedFromEvent(this.doc, 'mouseover').pipe(map(tuiGetActualTarget)), tuiTypedFromEvent(this.doc, 'mouseout').pipe(map((e) => e.relatedTarget))).pipe(map((element) => tuiIsElement(element) && this.isHovered(element)), distinctUntilChanged(), switchMap((v) => of(v).pipe(delay(v ? this.showDelay : this.hideDelay))), tuiZoneOptimized(), tap((hovered) => {
|
|
569
|
+
toObservable(inject(TuiDropdownDirective).ref).pipe(filter((x) => !x && this.hovered), switchMap(() => tuiTypedFromEvent(this.doc, 'pointerdown').pipe(map(tuiGetActualTarget), delay(this.tuiDropdownHideDelay()), startWith(null), takeUntil(fromEvent(this.doc, 'mouseover'))))), tuiTypedFromEvent(this.doc, 'mouseover').pipe(map(tuiGetActualTarget)), tuiTypedFromEvent(this.doc, 'mouseout').pipe(map((e) => e.relatedTarget))).pipe(map((element) => tuiIsElement(element) && this.isHovered(element)), distinctUntilChanged(), switchMap((v) => of(v).pipe(delay(v ? this.tuiDropdownShowDelay() : this.tuiDropdownHideDelay()))), tuiZoneOptimized(), tap((hovered) => {
|
|
637
570
|
this.hovered = hovered;
|
|
638
571
|
this.open?.toggle(hovered);
|
|
639
572
|
}), share());
|
|
640
|
-
this.
|
|
641
|
-
this.
|
|
642
|
-
this.hovered = false;
|
|
573
|
+
this.tuiDropdownShowDelay = input(this.options.showDelay);
|
|
574
|
+
this.tuiDropdownHideDelay = input(this.options.hideDelay);
|
|
643
575
|
this.type = 'dropdown';
|
|
644
576
|
}
|
|
645
577
|
onClick(event) {
|
|
@@ -648,85 +580,43 @@ class TuiDropdownHover extends TuiDriver {
|
|
|
648
580
|
}
|
|
649
581
|
}
|
|
650
582
|
isHovered(element) {
|
|
651
|
-
const host = this.dropdownHost?.nativeElement || this.el;
|
|
583
|
+
const host = this.dropdownHost()?.nativeElement || this.el;
|
|
652
584
|
const hovered = host.contains(element);
|
|
653
585
|
const child = !this.el.contains(element) && this.activeZone.contains(element);
|
|
654
586
|
return hovered || child;
|
|
655
587
|
}
|
|
656
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
657
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "
|
|
588
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownHover, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
589
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "19.2.17", type: TuiDropdownHover, isStandalone: true, selector: "[tuiDropdownHover]", inputs: { tuiDropdownShowDelay: { classPropertyName: "tuiDropdownShowDelay", publicName: "tuiDropdownShowDelay", isSignal: true, isRequired: false, transformFunction: null }, tuiDropdownHideDelay: { classPropertyName: "tuiDropdownHideDelay", publicName: "tuiDropdownHideDelay", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "click.capture": "onClick($event)" } }, providers: [TuiActiveZone, tuiAsDriver(TuiDropdownHover)], queries: [{ propertyName: "dropdownHost", first: true, predicate: ["tuiDropdownHost"], descendants: true, read: ElementRef, isSignal: true }], usesInheritance: true, ngImport: i0 }); }
|
|
658
590
|
}
|
|
659
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
591
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownHover, decorators: [{
|
|
660
592
|
type: Directive,
|
|
661
593
|
args: [{
|
|
662
|
-
standalone: true,
|
|
663
594
|
selector: '[tuiDropdownHover]',
|
|
664
595
|
providers: [TuiActiveZone, tuiAsDriver(TuiDropdownHover)],
|
|
665
596
|
host: {
|
|
666
597
|
'(click.capture)': 'onClick($event)',
|
|
667
598
|
},
|
|
668
599
|
}]
|
|
669
|
-
}], ctorParameters: () => []
|
|
670
|
-
type: ContentChild,
|
|
671
|
-
args: ['tuiDropdownHost', { descendants: true, read: ElementRef }]
|
|
672
|
-
}], showDelay: [{
|
|
673
|
-
type: Input,
|
|
674
|
-
args: ['tuiDropdownShowDelay']
|
|
675
|
-
}], hideDelay: [{
|
|
676
|
-
type: Input,
|
|
677
|
-
args: ['tuiDropdownHideDelay']
|
|
678
|
-
}] } });
|
|
600
|
+
}], ctorParameters: () => [] });
|
|
679
601
|
|
|
680
602
|
class TuiDropdownManual {
|
|
681
603
|
constructor() {
|
|
682
604
|
this.driver = inject(TuiDropdownDriver);
|
|
683
|
-
this.tuiDropdownManual = false;
|
|
605
|
+
this.tuiDropdownManual = input(false);
|
|
684
606
|
}
|
|
685
607
|
ngOnChanges() {
|
|
686
|
-
this.driver.next(!!this.tuiDropdownManual);
|
|
608
|
+
this.driver.next(!!this.tuiDropdownManual());
|
|
687
609
|
}
|
|
688
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
689
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "
|
|
610
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownManual, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
611
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.17", type: TuiDropdownManual, isStandalone: true, selector: "[tuiDropdownManual]", inputs: { tuiDropdownManual: { classPropertyName: "tuiDropdownManual", publicName: "tuiDropdownManual", isSignal: true, isRequired: false, transformFunction: null } }, providers: [TuiDropdownDriver, tuiAsDriver(TuiDropdownDriver)], usesOnChanges: true, ngImport: i0 }); }
|
|
690
612
|
}
|
|
691
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
613
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownManual, decorators: [{
|
|
692
614
|
type: Directive,
|
|
693
615
|
args: [{
|
|
694
|
-
standalone: true,
|
|
695
616
|
selector: '[tuiDropdownManual]',
|
|
696
617
|
providers: [TuiDropdownDriver, tuiAsDriver(TuiDropdownDriver)],
|
|
697
618
|
}]
|
|
698
|
-
}]
|
|
699
|
-
type: Input
|
|
700
|
-
}] } });
|
|
701
|
-
|
|
702
|
-
/**
|
|
703
|
-
* @deprecated TODO: remove in v.5 when legacy controls are dropped
|
|
704
|
-
*/
|
|
705
|
-
class TuiDropdownOpenLegacy {
|
|
706
|
-
constructor() {
|
|
707
|
-
this.openStateSub = new Subject();
|
|
708
|
-
this.tuiDropdownOpenChange = this.openStateSub.pipe(distinctUntilChanged());
|
|
709
|
-
}
|
|
710
|
-
set tuiDropdownOpen(open) {
|
|
711
|
-
this.emitOpenChange(open);
|
|
712
|
-
}
|
|
713
|
-
emitOpenChange(open) {
|
|
714
|
-
this.openStateSub.next(open);
|
|
715
|
-
}
|
|
716
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiDropdownOpenLegacy, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
717
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.15", type: TuiDropdownOpenLegacy, isStandalone: true, selector: "[tuiDropdownOpen]:not([tuiDropdown]),[tuiDropdownOpenChange]:not([tuiDropdown])", inputs: { tuiDropdownOpen: "tuiDropdownOpen" }, outputs: { tuiDropdownOpenChange: "tuiDropdownOpenChange" }, ngImport: i0 }); }
|
|
718
|
-
}
|
|
719
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: TuiDropdownOpenLegacy, decorators: [{
|
|
720
|
-
type: Directive,
|
|
721
|
-
args: [{
|
|
722
|
-
standalone: true,
|
|
723
|
-
selector: '[tuiDropdownOpen]:not([tuiDropdown]),[tuiDropdownOpenChange]:not([tuiDropdown])',
|
|
724
|
-
}]
|
|
725
|
-
}], propDecorators: { tuiDropdownOpenChange: [{
|
|
726
|
-
type: Output
|
|
727
|
-
}], tuiDropdownOpen: [{
|
|
728
|
-
type: Input
|
|
729
|
-
}] } });
|
|
619
|
+
}] });
|
|
730
620
|
|
|
731
621
|
class TuiDropdownPositionSided extends TuiPositionAccessor {
|
|
732
622
|
constructor() {
|
|
@@ -735,12 +625,12 @@ class TuiDropdownPositionSided extends TuiPositionAccessor {
|
|
|
735
625
|
this.viewport = inject(TUI_VIEWPORT);
|
|
736
626
|
this.vertical = inject(TuiDropdownPosition);
|
|
737
627
|
this.previous = this.options.direction || 'bottom';
|
|
738
|
-
this.tuiDropdownSided = '';
|
|
739
|
-
this.tuiDropdownSidedOffset = 4;
|
|
628
|
+
this.tuiDropdownSided = input('');
|
|
629
|
+
this.tuiDropdownSidedOffset = input(4);
|
|
740
630
|
this.type = 'dropdown';
|
|
741
631
|
}
|
|
742
632
|
getPosition(rect) {
|
|
743
|
-
if (this.tuiDropdownSided === false) {
|
|
633
|
+
if (this.tuiDropdownSided() === false) {
|
|
744
634
|
return this.vertical.getPosition(rect);
|
|
745
635
|
}
|
|
746
636
|
const { height, width } = rect;
|
|
@@ -756,38 +646,33 @@ class TuiDropdownPositionSided extends TuiPositionAccessor {
|
|
|
756
646
|
bottom: viewport.bottom - hostRect.top,
|
|
757
647
|
};
|
|
758
648
|
const position = {
|
|
759
|
-
top: hostRect.bottom - height + this.tuiDropdownSidedOffset + 1, // 1 for border
|
|
649
|
+
top: hostRect.bottom - height + this.tuiDropdownSidedOffset() + 1, // 1 for border
|
|
760
650
|
left: hostRect.left - width - offset,
|
|
761
651
|
right: hostRect.right + offset,
|
|
762
|
-
bottom: hostRect.top - this.tuiDropdownSidedOffset - 1, // 1 for border
|
|
652
|
+
bottom: hostRect.top - this.tuiDropdownSidedOffset() - 1, // 1 for border
|
|
763
653
|
};
|
|
764
654
|
const better = available.top > available.bottom ? 'top' : 'bottom';
|
|
765
655
|
const maxLeft = available.left > available.right ? position.left : position.right;
|
|
766
656
|
const left = available[align] > width ? position[align] : maxLeft;
|
|
767
657
|
if ((available[this.previous] > height && direction) ||
|
|
768
658
|
this.previous === better) {
|
|
769
|
-
this.vertical.
|
|
770
|
-
return [position[this.previous]
|
|
659
|
+
this.vertical.direction.next(this.previous);
|
|
660
|
+
return [left, position[this.previous]];
|
|
771
661
|
}
|
|
772
662
|
this.previous = better;
|
|
773
|
-
this.vertical.
|
|
774
|
-
return [position[better]
|
|
663
|
+
this.vertical.direction.next(better);
|
|
664
|
+
return [left, position[better]];
|
|
775
665
|
}
|
|
776
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
777
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "
|
|
666
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownPositionSided, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
|
|
667
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.17", type: TuiDropdownPositionSided, isStandalone: true, selector: "[tuiDropdownSided]", inputs: { tuiDropdownSided: { classPropertyName: "tuiDropdownSided", publicName: "tuiDropdownSided", isSignal: true, isRequired: false, transformFunction: null }, tuiDropdownSidedOffset: { classPropertyName: "tuiDropdownSidedOffset", publicName: "tuiDropdownSidedOffset", isSignal: true, isRequired: false, transformFunction: null } }, providers: [TuiDropdownPosition, tuiAsPositionAccessor(TuiDropdownPositionSided)], usesInheritance: true, ngImport: i0 }); }
|
|
778
668
|
}
|
|
779
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
669
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownPositionSided, decorators: [{
|
|
780
670
|
type: Directive,
|
|
781
671
|
args: [{
|
|
782
|
-
standalone: true,
|
|
783
672
|
selector: '[tuiDropdownSided]',
|
|
784
673
|
providers: [TuiDropdownPosition, tuiAsPositionAccessor(TuiDropdownPositionSided)],
|
|
785
674
|
}]
|
|
786
|
-
}]
|
|
787
|
-
type: Input
|
|
788
|
-
}], tuiDropdownSidedOffset: [{
|
|
789
|
-
type: Input
|
|
790
|
-
}] } });
|
|
675
|
+
}] });
|
|
791
676
|
|
|
792
677
|
class TuiDropdownSelection extends TuiDriver {
|
|
793
678
|
constructor() {
|
|
@@ -796,9 +681,9 @@ class TuiDropdownSelection extends TuiDriver {
|
|
|
796
681
|
this.vcr = inject(ViewContainerRef);
|
|
797
682
|
this.dropdown = inject(TuiDropdownDirective);
|
|
798
683
|
this.el = tuiInjectElement();
|
|
799
|
-
this.handler
|
|
684
|
+
this.handler = computed((visible = this.tuiDropdownSelection()) => tuiIsString(visible) ? TUI_TRUE_HANDLER : visible);
|
|
800
685
|
this.stream$ = combineLatest([
|
|
801
|
-
this.handler
|
|
686
|
+
toObservable(this.handler),
|
|
802
687
|
inject(TUI_SELECTION_STREAM).pipe(map(() => this.getRange()), filter((range) => this.isValid(range)), distinctUntilChanged((x, y) => x.startOffset === y.startOffset &&
|
|
803
688
|
x.endOffset === y.endOffset &&
|
|
804
689
|
x.commonAncestorContainer === y.commonAncestorContainer)),
|
|
@@ -810,17 +695,15 @@ class TuiDropdownSelection extends TuiDriver {
|
|
|
810
695
|
: this.range;
|
|
811
696
|
return (contained && handler(this.range)) || this.inDropdown(range);
|
|
812
697
|
}));
|
|
813
|
-
this.range = inject(
|
|
814
|
-
|
|
698
|
+
this.range = isPlatformBrowser(inject(PLATFORM_ID))
|
|
699
|
+
? new Range()
|
|
700
|
+
: {};
|
|
815
701
|
this.type = 'dropdown';
|
|
816
|
-
|
|
817
|
-
|
|
818
|
-
if (!tuiIsString(visible)) {
|
|
819
|
-
this.handler$.next(visible);
|
|
820
|
-
}
|
|
702
|
+
this.tuiDropdownSelection = input('');
|
|
703
|
+
this.tuiDropdownSelectionPosition = input('selection');
|
|
821
704
|
}
|
|
822
705
|
getClientRect() {
|
|
823
|
-
switch (this.
|
|
706
|
+
switch (this.tuiDropdownSelectionPosition()) {
|
|
824
707
|
case 'tag': {
|
|
825
708
|
const { commonAncestorContainer } = this.range;
|
|
826
709
|
const element = tuiIsElement(commonAncestorContainer)
|
|
@@ -911,28 +794,22 @@ class TuiDropdownSelection extends TuiDriver {
|
|
|
911
794
|
this.ghost = ghost;
|
|
912
795
|
return ghost;
|
|
913
796
|
}
|
|
914
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
915
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "
|
|
797
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownSelection, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
798
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "19.2.17", type: TuiDropdownSelection, isStandalone: true, selector: "[tuiDropdownSelection]", inputs: { tuiDropdownSelection: { classPropertyName: "tuiDropdownSelection", publicName: "tuiDropdownSelection", isSignal: true, isRequired: false, transformFunction: null }, tuiDropdownSelectionPosition: { classPropertyName: "tuiDropdownSelectionPosition", publicName: "tuiDropdownSelectionPosition", isSignal: true, isRequired: false, transformFunction: null } }, providers: [
|
|
916
799
|
tuiAsDriver(TuiDropdownSelection),
|
|
917
800
|
tuiAsRectAccessor(TuiDropdownSelection),
|
|
918
801
|
], usesInheritance: true, ngImport: i0 }); }
|
|
919
802
|
}
|
|
920
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
803
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownSelection, decorators: [{
|
|
921
804
|
type: Directive,
|
|
922
805
|
args: [{
|
|
923
|
-
standalone: true,
|
|
924
806
|
selector: '[tuiDropdownSelection]',
|
|
925
807
|
providers: [
|
|
926
808
|
tuiAsDriver(TuiDropdownSelection),
|
|
927
809
|
tuiAsRectAccessor(TuiDropdownSelection),
|
|
928
810
|
],
|
|
929
811
|
}]
|
|
930
|
-
}], ctorParameters: () => []
|
|
931
|
-
type: Input,
|
|
932
|
-
args: ['tuiDropdownSelectionPosition']
|
|
933
|
-
}], tuiDropdownSelection: [{
|
|
934
|
-
type: Input
|
|
935
|
-
}] } });
|
|
812
|
+
}], ctorParameters: () => [] });
|
|
936
813
|
|
|
937
814
|
const TuiDropdown = [
|
|
938
815
|
TuiDropdownOptionsDirective,
|
|
@@ -940,7 +817,6 @@ const TuiDropdown = [
|
|
|
940
817
|
TuiDropdownDirective,
|
|
941
818
|
TuiDropdownComponent,
|
|
942
819
|
TuiDropdownOpen,
|
|
943
|
-
TuiDropdownOpenLegacy,
|
|
944
820
|
TuiDropdownManual,
|
|
945
821
|
TuiDropdownHover,
|
|
946
822
|
TuiDropdownContent,
|
|
@@ -954,28 +830,20 @@ function tuiDropdown(value) {
|
|
|
954
830
|
return tuiDirectiveBinding(TuiDropdownDirective, 'tuiDropdown', value, {});
|
|
955
831
|
}
|
|
956
832
|
function tuiDropdownEnabled(value) {
|
|
957
|
-
return tuiDirectiveBinding(TuiDropdownOpen, '
|
|
958
|
-
}
|
|
959
|
-
function tuiDropdownOpen() {
|
|
960
|
-
const open = tuiDirectiveBinding(TuiDropdownOpen, 'tuiDropdownOpen', false, {});
|
|
961
|
-
inject(TuiDropdownOpen)
|
|
962
|
-
.tuiDropdownOpenChange.pipe(takeUntilDestroyed())
|
|
963
|
-
.subscribe((value) => open.set(value));
|
|
964
|
-
return open;
|
|
833
|
+
return tuiDirectiveBinding(TuiDropdownOpen, 'enabled', value, {});
|
|
965
834
|
}
|
|
966
835
|
|
|
967
836
|
class TuiDropdownFixed {
|
|
968
837
|
constructor() {
|
|
969
|
-
const override = tuiOverrideOptions
|
|
838
|
+
const override = tuiOverrideOptions({ limitWidth: 'fixed' }, TUI_DROPDOWN_DEFAULT_OPTIONS);
|
|
970
839
|
override(inject(TUI_DROPDOWN_OPTIONS, { self: true, optional: true }), null);
|
|
971
840
|
}
|
|
972
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
973
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.
|
|
841
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownFixed, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
842
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.17", type: TuiDropdownFixed, isStandalone: true, providers: [tuiDropdownOptionsProvider({})], ngImport: i0 }); }
|
|
974
843
|
}
|
|
975
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
844
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownFixed, decorators: [{
|
|
976
845
|
type: Directive,
|
|
977
846
|
args: [{
|
|
978
|
-
standalone: true,
|
|
979
847
|
providers: [tuiDropdownOptionsProvider({})],
|
|
980
848
|
}]
|
|
981
849
|
}], ctorParameters: () => [] });
|
|
@@ -987,22 +855,20 @@ class TuiDropdownAuto {
|
|
|
987
855
|
*/
|
|
988
856
|
inject(TUI_DROPDOWN_OPTIONS).limitWidth = 'auto';
|
|
989
857
|
}
|
|
990
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
991
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.
|
|
858
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownAuto, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
859
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.17", type: TuiDropdownAuto, isStandalone: true, ngImport: i0 }); }
|
|
992
860
|
}
|
|
993
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
994
|
-
type: Directive
|
|
995
|
-
args: [{ standalone: true }]
|
|
861
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiDropdownAuto, decorators: [{
|
|
862
|
+
type: Directive
|
|
996
863
|
}], ctorParameters: () => [] });
|
|
997
864
|
|
|
998
865
|
class TuiWithDropdownOpen {
|
|
999
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.
|
|
1000
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.
|
|
866
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiWithDropdownOpen, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
867
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.17", type: TuiWithDropdownOpen, isStandalone: true, hostDirectives: [{ directive: TuiDropdownOpen, inputs: ["tuiDropdownOpen", "open", "tuiDropdownEnabled", "tuiDropdownEnabled"], outputs: ["tuiDropdownOpenChange", "openChange"] }], ngImport: i0 }); }
|
|
1001
868
|
}
|
|
1002
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.
|
|
869
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: TuiWithDropdownOpen, decorators: [{
|
|
1003
870
|
type: Directive,
|
|
1004
871
|
args: [{
|
|
1005
|
-
standalone: true,
|
|
1006
872
|
hostDirectives: [
|
|
1007
873
|
{
|
|
1008
874
|
directive: TuiDropdownOpen,
|
|
@@ -1017,5 +883,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImpo
|
|
|
1017
883
|
* Generated bundle index. Do not edit.
|
|
1018
884
|
*/
|
|
1019
885
|
|
|
1020
|
-
export { TUI_DROPDOWN_COMPONENT, TUI_DROPDOWN_CONTEXT, TUI_DROPDOWN_DEFAULT_OPTIONS, TUI_DROPDOWN_HOVER_DEFAULT_OPTIONS, TUI_DROPDOWN_HOVER_OPTIONS, TUI_DROPDOWN_OPTIONS, TuiDropdown, TuiDropdownAuto, TuiDropdownComponent, TuiDropdownContent, TuiDropdownContext, TuiDropdownDirective, TuiDropdownDriver, TuiDropdownDriverDirective, TuiDropdownFixed, TuiDropdownHover, TuiDropdownManual, TuiDropdownOpen,
|
|
1021
|
-
//# sourceMappingURL=taiga-ui-core-
|
|
886
|
+
export { TUI_DROPDOWN_COMPONENT, TUI_DROPDOWN_CONTEXT, TUI_DROPDOWN_DEFAULT_OPTIONS, TUI_DROPDOWN_HOVER_DEFAULT_OPTIONS, TUI_DROPDOWN_HOVER_OPTIONS, TUI_DROPDOWN_OPTIONS, TuiDropdown, TuiDropdownAuto, TuiDropdownClose, TuiDropdownComponent, TuiDropdownContent, TuiDropdownContext, TuiDropdownDirective, TuiDropdownDriver, TuiDropdownDriverDirective, TuiDropdownFixed, TuiDropdownHover, TuiDropdownManual, TuiDropdownOpen, TuiDropdownOptionsDirective, TuiDropdownPosition, TuiDropdownPositionSided, TuiDropdownSelection, TuiWithDropdownOpen, tuiDropdown, tuiDropdownEnabled, tuiDropdownHoverOptionsProvider, tuiDropdownOptionsProvider };
|
|
887
|
+
//# sourceMappingURL=taiga-ui-core-portals-dropdown.mjs.map
|