@slotted/angular 0.1.0-beta.1 → 0.1.0-beta.11
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 +4 -0
- package/docs/AGENTS.snippet.md +12 -0
- package/docs/action-bar.json +4 -4
- package/docs/action-bar.md +3 -3
- package/docs/alert.json +7 -1
- package/docs/alert.md +3 -3
- package/docs/app-shell.examples.md +1 -1
- package/docs/app-shell.json +5 -5
- package/docs/app-shell.md +2 -2
- package/docs/avatar.json +22 -1
- package/docs/avatar.md +5 -3
- package/docs/badge.json +7 -1
- package/docs/badge.md +3 -3
- package/docs/button-group.json +2 -0
- package/docs/button-group.md +1 -1
- package/docs/button.json +51 -11
- package/docs/button.md +10 -6
- package/docs/calendar.json +8 -1
- package/docs/calendar.md +3 -2
- package/docs/cascader.json +1 -0
- package/docs/cascader.md +1 -1
- package/docs/chart.examples.md +1 -1
- package/docs/chart.json +10 -1
- package/docs/chart.md +3 -2
- package/docs/checkbox.json +7 -0
- package/docs/checkbox.md +1 -0
- package/docs/code-block.json +92 -92
- package/docs/code-block.md +69 -69
- package/docs/combobox.json +1 -0
- package/docs/combobox.md +1 -1
- package/docs/command-palette.json +1 -0
- package/docs/command-palette.md +1 -1
- package/docs/currency-field.json +40 -1
- package/docs/currency-field.md +5 -1
- package/docs/data-grid.examples.md +2 -2
- package/docs/data-grid.json +45 -7
- package/docs/data-grid.md +3 -1
- package/docs/data-grid.props.md +7 -4
- package/docs/data-list.json +2 -1
- package/docs/data-list.md +1 -1
- package/docs/date-field.json +9 -1
- package/docs/date-field.md +3 -2
- package/docs/date-picker.examples.md +36 -0
- package/docs/date-picker.json +20 -5
- package/docs/date-picker.md +5 -4
- package/docs/datetime-field.json +1 -0
- package/docs/datetime-field.md +1 -1
- package/docs/detail-panel.json +4 -2
- package/docs/detail-panel.md +8 -3
- package/docs/dialog.examples.md +158 -136
- package/docs/dialog.json +36 -11
- package/docs/dialog.md +4 -2
- package/docs/dialog.props.md +1 -1
- package/docs/drawer.json +11 -4
- package/docs/drawer.md +4 -3
- package/docs/entity-picker.json +19 -4
- package/docs/entity-picker.md +8 -6
- package/docs/event-calendar.json +7 -0
- package/docs/event-calendar.md +3 -2
- package/docs/filter-bar.json +118 -118
- package/docs/filter-bar.md +79 -79
- package/docs/form.json +2 -1
- package/docs/form.md +1 -1
- package/docs/guidelines/README.md +27 -0
- package/docs/guidelines/async-feedback.md +129 -0
- package/docs/guidelines/browsing.md +74 -0
- package/docs/guidelines/builders.md +97 -0
- package/docs/guidelines/composition.md +143 -0
- package/docs/guidelines/conversations.md +59 -0
- package/docs/guidelines/errors-and-conflicts.md +71 -0
- package/docs/guidelines/forms.md +202 -0
- package/docs/guidelines/index.md +130 -0
- package/docs/guidelines/layout-alignment.md +105 -0
- package/docs/guidelines/ledgers.md +45 -0
- package/docs/guidelines/list-pages.md +206 -0
- package/docs/guidelines/overviews.md +76 -0
- package/docs/guidelines/own-elements.md +115 -0
- package/docs/guidelines/reading-permissions.md +55 -0
- package/docs/guidelines/record-pages.md +178 -0
- package/docs/guidelines/reports.md +123 -0
- package/docs/guidelines/shell-composition.md +94 -0
- package/docs/guidelines/workspaces.md +46 -0
- package/docs/icon.json +3 -1
- package/docs/icon.md +3 -3
- package/docs/index.md +12 -0
- package/docs/inline-message.json +14 -2
- package/docs/inline-message.md +4 -3
- package/docs/list-item.json +9 -1
- package/docs/list-item.md +3 -3
- package/docs/list.json +19 -1
- package/docs/list.md +3 -1
- package/docs/markdown.json +79 -79
- package/docs/markdown.md +65 -65
- package/docs/menu.json +12 -0
- package/docs/menu.md +2 -0
- package/docs/message.json +7 -1
- package/docs/message.md +3 -3
- package/docs/multi-select.json +1 -0
- package/docs/multi-select.md +1 -1
- package/docs/notification-center.json +4 -0
- package/docs/notification-center.md +2 -2
- package/docs/number-field.json +1 -0
- package/docs/number-field.md +1 -1
- package/docs/otp-input.json +1 -0
- package/docs/otp-input.md +1 -1
- package/docs/page-header.json +22 -5
- package/docs/page-header.md +6 -4
- package/docs/page.json +2 -0
- package/docs/page.md +2 -1
- package/docs/popover.json +1 -1
- package/docs/progress-indicator.json +4 -3
- package/docs/progress-indicator.md +4 -4
- package/docs/prompt-composer.json +41 -1
- package/docs/prompt-composer.md +5 -1
- package/docs/rating.json +5 -3
- package/docs/rating.md +6 -6
- package/docs/section.json +28 -16
- package/docs/section.md +12 -10
- package/docs/segmented-control.json +36 -12
- package/docs/segmented-control.md +17 -1
- package/docs/select.json +1 -0
- package/docs/select.md +1 -1
- package/docs/side-navigation.json +1 -0
- package/docs/side-navigation.md +1 -1
- package/docs/skills/build-own-element/SKILL.md +90 -0
- package/docs/skills/compose-screen/SKILL.md +103 -0
- package/docs/skills/index.md +9 -0
- package/docs/skills/review-screen/SKILL.md +79 -0
- package/docs/skills/theme-app/SKILL.md +98 -0
- package/docs/skills/waiting-states/SKILL.md +143 -0
- package/docs/sparkline.json +5 -2
- package/docs/sparkline.md +4 -4
- package/docs/split-button.json +4 -1
- package/docs/split-button.md +3 -3
- package/docs/stat-card.json +5 -1
- package/docs/stat-card.md +3 -3
- package/docs/table.examples.md +3 -3
- package/docs/table.json +85 -3
- package/docs/table.md +12 -1
- package/docs/tabs.json +17 -7
- package/docs/tabs.md +3 -2
- package/docs/tag.json +14 -4
- package/docs/tag.md +6 -6
- package/docs/tags-input.json +29 -2
- package/docs/tags-input.md +4 -1
- package/docs/text-field.json +2 -1
- package/docs/text-field.md +2 -2
- package/docs/textarea.json +1 -0
- package/docs/textarea.md +1 -1
- package/docs/time-field.json +1 -0
- package/docs/time-field.md +1 -1
- package/docs/timeline.json +138 -132
- package/docs/timeline.md +125 -125
- package/docs/toast.json +8 -1
- package/docs/toast.md +3 -3
- package/docs/toggle-group.json +14 -3
- package/docs/toggle-group.md +3 -3
- package/docs/toggle.json +12 -3
- package/docs/toggle.md +3 -3
- package/docs/tokens.md +467 -0
- package/docs/toolbar.json +1 -1
- package/docs/toolbar.md +1 -1
- package/docs/tour.json +1 -1
- package/docs/typography.json +4 -2
- package/docs/typography.md +5 -5
- package/fesm2022/slotted-angular-accordion.mjs +4 -2
- package/fesm2022/slotted-angular-accordion.mjs.map +1 -1
- package/fesm2022/slotted-angular-action-bar.mjs +27 -12
- package/fesm2022/slotted-angular-action-bar.mjs.map +1 -1
- package/fesm2022/slotted-angular-action-sheet.mjs +48 -29
- package/fesm2022/slotted-angular-action-sheet.mjs.map +1 -1
- package/fesm2022/slotted-angular-alert.mjs +18 -11
- package/fesm2022/slotted-angular-alert.mjs.map +1 -1
- package/fesm2022/slotted-angular-app-shell.mjs +111 -61
- package/fesm2022/slotted-angular-app-shell.mjs.map +1 -1
- package/fesm2022/slotted-angular-aspect-ratio.mjs +4 -2
- package/fesm2022/slotted-angular-aspect-ratio.mjs.map +1 -1
- package/fesm2022/slotted-angular-attachment.mjs +31 -20
- package/fesm2022/slotted-angular-attachment.mjs.map +1 -1
- package/fesm2022/slotted-angular-avatar-group.mjs +9 -6
- package/fesm2022/slotted-angular-avatar-group.mjs.map +1 -1
- package/fesm2022/slotted-angular-avatar.mjs +14 -7
- package/fesm2022/slotted-angular-avatar.mjs.map +1 -1
- package/fesm2022/slotted-angular-badge.mjs +14 -10
- package/fesm2022/slotted-angular-badge.mjs.map +1 -1
- package/fesm2022/slotted-angular-breadcrumb.mjs +26 -18
- package/fesm2022/slotted-angular-breadcrumb.mjs.map +1 -1
- package/fesm2022/slotted-angular-button-group.mjs +7 -4
- package/fesm2022/slotted-angular-button-group.mjs.map +1 -1
- package/fesm2022/slotted-angular-button.mjs +120 -29
- package/fesm2022/slotted-angular-button.mjs.map +1 -1
- package/fesm2022/slotted-angular-calendar.mjs +235 -58
- package/fesm2022/slotted-angular-calendar.mjs.map +1 -1
- package/fesm2022/slotted-angular-card.mjs +18 -16
- package/fesm2022/slotted-angular-card.mjs.map +1 -1
- package/fesm2022/slotted-angular-carousel.mjs +22 -11
- package/fesm2022/slotted-angular-carousel.mjs.map +1 -1
- package/fesm2022/slotted-angular-cascader.mjs +180 -66
- package/fesm2022/slotted-angular-cascader.mjs.map +1 -1
- package/fesm2022/slotted-angular-chart.mjs +53 -20
- package/fesm2022/slotted-angular-chart.mjs.map +1 -1
- package/fesm2022/slotted-angular-checkbox-group.mjs +5 -3
- package/fesm2022/slotted-angular-checkbox-group.mjs.map +1 -1
- package/fesm2022/slotted-angular-checkbox.mjs +23 -9
- package/fesm2022/slotted-angular-checkbox.mjs.map +1 -1
- package/fesm2022/slotted-angular-code-block.mjs +29 -15
- package/fesm2022/slotted-angular-code-block.mjs.map +1 -1
- package/fesm2022/slotted-angular-collapsible.mjs +20 -15
- package/fesm2022/slotted-angular-collapsible.mjs.map +1 -1
- package/fesm2022/slotted-angular-color-picker.mjs +77 -22
- package/fesm2022/slotted-angular-color-picker.mjs.map +1 -1
- package/fesm2022/slotted-angular-column-manager.mjs +68 -31
- package/fesm2022/slotted-angular-column-manager.mjs.map +1 -1
- package/fesm2022/slotted-angular-combobox.mjs +118 -39
- package/fesm2022/slotted-angular-combobox.mjs.map +1 -1
- package/fesm2022/slotted-angular-command-palette.mjs +162 -54
- package/fesm2022/slotted-angular-command-palette.mjs.map +1 -1
- package/fesm2022/slotted-angular-container.mjs +6 -4
- package/fesm2022/slotted-angular-container.mjs.map +1 -1
- package/fesm2022/slotted-angular-context-menu.mjs +5 -4
- package/fesm2022/slotted-angular-context-menu.mjs.map +1 -1
- package/fesm2022/slotted-angular-currency-field.mjs +149 -32
- package/fesm2022/slotted-angular-currency-field.mjs.map +1 -1
- package/fesm2022/slotted-angular-dashboard-grid.mjs +142 -63
- package/fesm2022/slotted-angular-dashboard-grid.mjs.map +1 -1
- package/fesm2022/slotted-angular-data-grid.mjs +480 -129
- package/fesm2022/slotted-angular-data-grid.mjs.map +1 -1
- package/fesm2022/slotted-angular-data-list.mjs +83 -50
- package/fesm2022/slotted-angular-data-list.mjs.map +1 -1
- package/fesm2022/slotted-angular-date-field.mjs +74 -25
- package/fesm2022/slotted-angular-date-field.mjs.map +1 -1
- package/fesm2022/slotted-angular-date-picker.mjs +112 -40
- package/fesm2022/slotted-angular-date-picker.mjs.map +1 -1
- package/fesm2022/slotted-angular-date-range-picker.mjs +45 -22
- package/fesm2022/slotted-angular-date-range-picker.mjs.map +1 -1
- package/fesm2022/slotted-angular-datetime-field.mjs +48 -16
- package/fesm2022/slotted-angular-datetime-field.mjs.map +1 -1
- package/fesm2022/slotted-angular-datetime-picker.mjs +41 -29
- package/fesm2022/slotted-angular-datetime-picker.mjs.map +1 -1
- package/fesm2022/slotted-angular-datetime-range-picker.mjs +115 -48
- package/fesm2022/slotted-angular-datetime-range-picker.mjs.map +1 -1
- package/fesm2022/slotted-angular-description-list.mjs +33 -19
- package/fesm2022/slotted-angular-description-list.mjs.map +1 -1
- package/fesm2022/slotted-angular-detail-panel.mjs +48 -30
- package/fesm2022/slotted-angular-detail-panel.mjs.map +1 -1
- package/fesm2022/slotted-angular-dialog.mjs +72 -30
- package/fesm2022/slotted-angular-dialog.mjs.map +1 -1
- package/fesm2022/slotted-angular-divider.mjs +7 -5
- package/fesm2022/slotted-angular-divider.mjs.map +1 -1
- package/fesm2022/slotted-angular-drawer.mjs +91 -37
- package/fesm2022/slotted-angular-drawer.mjs.map +1 -1
- package/fesm2022/slotted-angular-entity-picker.mjs +474 -75
- package/fesm2022/slotted-angular-entity-picker.mjs.map +1 -1
- package/fesm2022/slotted-angular-event-calendar.mjs +275 -108
- package/fesm2022/slotted-angular-event-calendar.mjs.map +1 -1
- package/fesm2022/slotted-angular-field-group.mjs +14 -7
- package/fesm2022/slotted-angular-field-group.mjs.map +1 -1
- package/fesm2022/slotted-angular-field.mjs +35 -15
- package/fesm2022/slotted-angular-field.mjs.map +1 -1
- package/fesm2022/slotted-angular-filter-bar.mjs +118 -51
- package/fesm2022/slotted-angular-filter-bar.mjs.map +1 -1
- package/fesm2022/slotted-angular-form.mjs +18 -10
- package/fesm2022/slotted-angular-form.mjs.map +1 -1
- package/fesm2022/slotted-angular-fullscreen.mjs +14 -8
- package/fesm2022/slotted-angular-fullscreen.mjs.map +1 -1
- package/fesm2022/slotted-angular-grid.mjs +4 -2
- package/fesm2022/slotted-angular-grid.mjs.map +1 -1
- package/fesm2022/slotted-angular-highlight.mjs +5 -3
- package/fesm2022/slotted-angular-highlight.mjs.map +1 -1
- package/fesm2022/slotted-angular-hover-card.mjs +5 -4
- package/fesm2022/slotted-angular-hover-card.mjs.map +1 -1
- package/fesm2022/slotted-angular-icon.mjs +6 -3
- package/fesm2022/slotted-angular-icon.mjs.map +1 -1
- package/fesm2022/slotted-angular-image.mjs +13 -10
- package/fesm2022/slotted-angular-image.mjs.map +1 -1
- package/fesm2022/slotted-angular-import-export-center.mjs +175 -99
- package/fesm2022/slotted-angular-import-export-center.mjs.map +1 -1
- package/fesm2022/slotted-angular-inline-message.mjs +88 -13
- package/fesm2022/slotted-angular-inline-message.mjs.map +1 -1
- package/fesm2022/slotted-angular-inline.mjs +4 -2
- package/fesm2022/slotted-angular-inline.mjs.map +1 -1
- package/fesm2022/slotted-angular-kbd.mjs +11 -7
- package/fesm2022/slotted-angular-kbd.mjs.map +1 -1
- package/fesm2022/slotted-angular-link.mjs +5 -3
- package/fesm2022/slotted-angular-link.mjs.map +1 -1
- package/fesm2022/slotted-angular-list-item.mjs +21 -18
- package/fesm2022/slotted-angular-list-item.mjs.map +1 -1
- package/fesm2022/slotted-angular-list.mjs +37 -22
- package/fesm2022/slotted-angular-list.mjs.map +1 -1
- package/fesm2022/slotted-angular-listbox.mjs +39 -21
- package/fesm2022/slotted-angular-listbox.mjs.map +1 -1
- package/fesm2022/slotted-angular-loading-overlay.mjs +59 -22
- package/fesm2022/slotted-angular-loading-overlay.mjs.map +1 -1
- package/fesm2022/slotted-angular-markdown.mjs +31 -19
- package/fesm2022/slotted-angular-markdown.mjs.map +1 -1
- package/fesm2022/slotted-angular-menu.mjs +51 -29
- package/fesm2022/slotted-angular-menu.mjs.map +1 -1
- package/fesm2022/slotted-angular-menubar.mjs +4 -2
- package/fesm2022/slotted-angular-menubar.mjs.map +1 -1
- package/fesm2022/slotted-angular-message-scroller.mjs +34 -15
- package/fesm2022/slotted-angular-message-scroller.mjs.map +1 -1
- package/fesm2022/slotted-angular-message.mjs +119 -51
- package/fesm2022/slotted-angular-message.mjs.map +1 -1
- package/fesm2022/slotted-angular-multi-select.mjs +195 -87
- package/fesm2022/slotted-angular-multi-select.mjs.map +1 -1
- package/fesm2022/slotted-angular-navigation-menu.mjs +34 -26
- package/fesm2022/slotted-angular-navigation-menu.mjs.map +1 -1
- package/fesm2022/slotted-angular-notification-center.mjs +108 -65
- package/fesm2022/slotted-angular-notification-center.mjs.map +1 -1
- package/fesm2022/slotted-angular-number-field.mjs +23 -11
- package/fesm2022/slotted-angular-number-field.mjs.map +1 -1
- package/fesm2022/slotted-angular-otp-input.mjs +13 -8
- package/fesm2022/slotted-angular-otp-input.mjs.map +1 -1
- package/fesm2022/slotted-angular-page-header.mjs +90 -48
- package/fesm2022/slotted-angular-page-header.mjs.map +1 -1
- package/fesm2022/slotted-angular-page.mjs +38 -10
- package/fesm2022/slotted-angular-page.mjs.map +1 -1
- package/fesm2022/slotted-angular-pagination.mjs +35 -22
- package/fesm2022/slotted-angular-pagination.mjs.map +1 -1
- package/fesm2022/slotted-angular-popover.mjs +32 -19
- package/fesm2022/slotted-angular-popover.mjs.map +1 -1
- package/fesm2022/slotted-angular-progress-indicator.mjs +236 -52
- package/fesm2022/slotted-angular-progress-indicator.mjs.map +1 -1
- package/fesm2022/slotted-angular-prompt-composer.mjs +57 -20
- package/fesm2022/slotted-angular-prompt-composer.mjs.map +1 -1
- package/fesm2022/slotted-angular-prose.mjs +14 -11
- package/fesm2022/slotted-angular-prose.mjs.map +1 -1
- package/fesm2022/slotted-angular-radio-group.mjs +15 -9
- package/fesm2022/slotted-angular-radio-group.mjs.map +1 -1
- package/fesm2022/slotted-angular-rating.mjs +138 -82
- package/fesm2022/slotted-angular-rating.mjs.map +1 -1
- package/fesm2022/slotted-angular-result-state.mjs +16 -12
- package/fesm2022/slotted-angular-result-state.mjs.map +1 -1
- package/fesm2022/slotted-angular-saved-views.mjs +43 -16
- package/fesm2022/slotted-angular-saved-views.mjs.map +1 -1
- package/fesm2022/slotted-angular-scroll-area.mjs +13 -5
- package/fesm2022/slotted-angular-scroll-area.mjs.map +1 -1
- package/fesm2022/slotted-angular-section.mjs +53 -18
- package/fesm2022/slotted-angular-section.mjs.map +1 -1
- package/fesm2022/slotted-angular-segmented-control.mjs +37 -11
- package/fesm2022/slotted-angular-segmented-control.mjs.map +1 -1
- package/fesm2022/slotted-angular-select.mjs +190 -94
- package/fesm2022/slotted-angular-select.mjs.map +1 -1
- package/fesm2022/slotted-angular-side-navigation.mjs +46 -35
- package/fesm2022/slotted-angular-side-navigation.mjs.map +1 -1
- package/fesm2022/slotted-angular-skeleton.mjs +32 -16
- package/fesm2022/slotted-angular-skeleton.mjs.map +1 -1
- package/fesm2022/slotted-angular-slider.mjs +31 -11
- package/fesm2022/slotted-angular-slider.mjs.map +1 -1
- package/fesm2022/slotted-angular-sparkline.mjs +41 -14
- package/fesm2022/slotted-angular-sparkline.mjs.map +1 -1
- package/fesm2022/slotted-angular-split-button.mjs +37 -11
- package/fesm2022/slotted-angular-split-button.mjs.map +1 -1
- package/fesm2022/slotted-angular-splitter.mjs +11 -9
- package/fesm2022/slotted-angular-splitter.mjs.map +1 -1
- package/fesm2022/slotted-angular-stack.mjs +4 -2
- package/fesm2022/slotted-angular-stack.mjs.map +1 -1
- package/fesm2022/slotted-angular-stat-card.mjs +35 -28
- package/fesm2022/slotted-angular-stat-card.mjs.map +1 -1
- package/fesm2022/slotted-angular-status-indicator.mjs +22 -8
- package/fesm2022/slotted-angular-status-indicator.mjs.map +1 -1
- package/fesm2022/slotted-angular-stepper.mjs +40 -15
- package/fesm2022/slotted-angular-stepper.mjs.map +1 -1
- package/fesm2022/slotted-angular-switch.mjs +15 -10
- package/fesm2022/slotted-angular-switch.mjs.map +1 -1
- package/fesm2022/slotted-angular-table-of-contents.mjs +29 -21
- package/fesm2022/slotted-angular-table-of-contents.mjs.map +1 -1
- package/fesm2022/slotted-angular-table.mjs +243 -73
- package/fesm2022/slotted-angular-table.mjs.map +1 -1
- package/fesm2022/slotted-angular-tabs.mjs +42 -18
- package/fesm2022/slotted-angular-tabs.mjs.map +1 -1
- package/fesm2022/slotted-angular-tag.mjs +19 -12
- package/fesm2022/slotted-angular-tag.mjs.map +1 -1
- package/fesm2022/slotted-angular-tags-input.mjs +253 -28
- package/fesm2022/slotted-angular-tags-input.mjs.map +1 -1
- package/fesm2022/slotted-angular-text-field.mjs +55 -15
- package/fesm2022/slotted-angular-text-field.mjs.map +1 -1
- package/fesm2022/slotted-angular-textarea.mjs +5 -3
- package/fesm2022/slotted-angular-textarea.mjs.map +1 -1
- package/fesm2022/slotted-angular-time-field.mjs +48 -14
- package/fesm2022/slotted-angular-time-field.mjs.map +1 -1
- package/fesm2022/slotted-angular-time-picker.mjs +32 -20
- package/fesm2022/slotted-angular-time-picker.mjs.map +1 -1
- package/fesm2022/slotted-angular-time-range-picker.mjs +113 -46
- package/fesm2022/slotted-angular-time-range-picker.mjs.map +1 -1
- package/fesm2022/slotted-angular-timeline.mjs +147 -64
- package/fesm2022/slotted-angular-timeline.mjs.map +1 -1
- package/fesm2022/slotted-angular-toast.mjs +43 -31
- package/fesm2022/slotted-angular-toast.mjs.map +1 -1
- package/fesm2022/slotted-angular-toggle-group.mjs +25 -8
- package/fesm2022/slotted-angular-toggle-group.mjs.map +1 -1
- package/fesm2022/slotted-angular-toggle.mjs +9 -4
- package/fesm2022/slotted-angular-toggle.mjs.map +1 -1
- package/fesm2022/slotted-angular-toolbar.mjs +27 -12
- package/fesm2022/slotted-angular-toolbar.mjs.map +1 -1
- package/fesm2022/slotted-angular-tooltip.mjs +15 -6
- package/fesm2022/slotted-angular-tooltip.mjs.map +1 -1
- package/fesm2022/slotted-angular-top-navigation.mjs +64 -44
- package/fesm2022/slotted-angular-top-navigation.mjs.map +1 -1
- package/fesm2022/slotted-angular-tour.mjs +47 -22
- package/fesm2022/slotted-angular-tour.mjs.map +1 -1
- package/fesm2022/slotted-angular-transfer.mjs +69 -30
- package/fesm2022/slotted-angular-transfer.mjs.map +1 -1
- package/fesm2022/slotted-angular-tree.mjs +80 -26
- package/fesm2022/slotted-angular-tree.mjs.map +1 -1
- package/fesm2022/slotted-angular-typography.mjs +8 -4
- package/fesm2022/slotted-angular-typography.mjs.map +1 -1
- package/fesm2022/slotted-angular-upload.mjs +125 -57
- package/fesm2022/slotted-angular-upload.mjs.map +1 -1
- package/fesm2022/slotted-angular-visually-hidden.mjs +4 -2
- package/fesm2022/slotted-angular-visually-hidden.mjs.map +1 -1
- package/fesm2022/slotted-angular-wizard.mjs +163 -65
- package/fesm2022/slotted-angular-wizard.mjs.map +1 -1
- package/package.json +3 -3
- package/types/slotted-angular-accordion.d.ts.map +1 -1
- package/types/slotted-angular-action-bar.d.ts +2 -0
- package/types/slotted-angular-action-bar.d.ts.map +1 -1
- package/types/slotted-angular-action-sheet.d.ts.map +1 -1
- package/types/slotted-angular-alert.d.ts +2 -2
- package/types/slotted-angular-alert.d.ts.map +1 -1
- package/types/slotted-angular-app-shell.d.ts +11 -3
- package/types/slotted-angular-app-shell.d.ts.map +1 -1
- package/types/slotted-angular-aspect-ratio.d.ts.map +1 -1
- package/types/slotted-angular-attachment.d.ts +1 -1
- package/types/slotted-angular-attachment.d.ts.map +1 -1
- package/types/slotted-angular-avatar-group.d.ts.map +1 -1
- package/types/slotted-angular-avatar.d.ts +11 -3
- package/types/slotted-angular-avatar.d.ts.map +1 -1
- package/types/slotted-angular-badge.d.ts +1 -1
- package/types/slotted-angular-badge.d.ts.map +1 -1
- package/types/slotted-angular-breadcrumb.d.ts.map +1 -1
- package/types/slotted-angular-button-group.d.ts +1 -1
- package/types/slotted-angular-button-group.d.ts.map +1 -1
- package/types/slotted-angular-button.d.ts +33 -13
- package/types/slotted-angular-button.d.ts.map +1 -1
- package/types/slotted-angular-calendar.d.ts +30 -2
- package/types/slotted-angular-calendar.d.ts.map +1 -1
- package/types/slotted-angular-card.d.ts.map +1 -1
- package/types/slotted-angular-carousel.d.ts.map +1 -1
- package/types/slotted-angular-cascader.d.ts.map +1 -1
- package/types/slotted-angular-chart.d.ts +10 -0
- package/types/slotted-angular-chart.d.ts.map +1 -1
- package/types/slotted-angular-checkbox-group.d.ts.map +1 -1
- package/types/slotted-angular-checkbox.d.ts +7 -1
- package/types/slotted-angular-checkbox.d.ts.map +1 -1
- package/types/slotted-angular-code-block.d.ts +1 -1
- package/types/slotted-angular-code-block.d.ts.map +1 -1
- package/types/slotted-angular-collapsible.d.ts +1 -1
- package/types/slotted-angular-collapsible.d.ts.map +1 -1
- package/types/slotted-angular-color-picker.d.ts.map +1 -1
- package/types/slotted-angular-column-manager.d.ts.map +1 -1
- package/types/slotted-angular-combobox.d.ts +5 -1
- package/types/slotted-angular-combobox.d.ts.map +1 -1
- package/types/slotted-angular-command-palette.d.ts +10 -1
- package/types/slotted-angular-command-palette.d.ts.map +1 -1
- package/types/slotted-angular-container.d.ts.map +1 -1
- package/types/slotted-angular-context-menu.d.ts.map +1 -1
- package/types/slotted-angular-currency-field.d.ts +63 -15
- package/types/slotted-angular-currency-field.d.ts.map +1 -1
- package/types/slotted-angular-dashboard-grid.d.ts.map +1 -1
- package/types/slotted-angular-data-grid.d.ts +72 -4
- package/types/slotted-angular-data-grid.d.ts.map +1 -1
- package/types/slotted-angular-data-list.d.ts.map +1 -1
- package/types/slotted-angular-date-field.d.ts +11 -1
- package/types/slotted-angular-date-field.d.ts.map +1 -1
- package/types/slotted-angular-date-picker.d.ts +38 -12
- package/types/slotted-angular-date-picker.d.ts.map +1 -1
- package/types/slotted-angular-date-range-picker.d.ts +0 -1
- package/types/slotted-angular-date-range-picker.d.ts.map +1 -1
- package/types/slotted-angular-datetime-field.d.ts.map +1 -1
- package/types/slotted-angular-datetime-picker.d.ts +0 -1
- package/types/slotted-angular-datetime-picker.d.ts.map +1 -1
- package/types/slotted-angular-datetime-range-picker.d.ts +0 -1
- package/types/slotted-angular-datetime-range-picker.d.ts.map +1 -1
- package/types/slotted-angular-description-list.d.ts.map +1 -1
- package/types/slotted-angular-detail-panel.d.ts.map +1 -1
- package/types/slotted-angular-dialog.d.ts +10 -3
- package/types/slotted-angular-dialog.d.ts.map +1 -1
- package/types/slotted-angular-divider.d.ts.map +1 -1
- package/types/slotted-angular-drawer.d.ts +12 -1
- package/types/slotted-angular-drawer.d.ts.map +1 -1
- package/types/slotted-angular-entity-picker.d.ts +63 -15
- package/types/slotted-angular-entity-picker.d.ts.map +1 -1
- package/types/slotted-angular-event-calendar.d.ts +9 -2
- package/types/slotted-angular-event-calendar.d.ts.map +1 -1
- package/types/slotted-angular-field-group.d.ts.map +1 -1
- package/types/slotted-angular-field.d.ts.map +1 -1
- package/types/slotted-angular-filter-bar.d.ts.map +1 -1
- package/types/slotted-angular-form.d.ts.map +1 -1
- package/types/slotted-angular-fullscreen.d.ts.map +1 -1
- package/types/slotted-angular-grid.d.ts.map +1 -1
- package/types/slotted-angular-highlight.d.ts.map +1 -1
- package/types/slotted-angular-hover-card.d.ts.map +1 -1
- package/types/slotted-angular-icon.d.ts +2 -2
- package/types/slotted-angular-icon.d.ts.map +1 -1
- package/types/slotted-angular-image.d.ts.map +1 -1
- package/types/slotted-angular-import-export-center.d.ts.map +1 -1
- package/types/slotted-angular-inline-message.d.ts +25 -25
- package/types/slotted-angular-inline-message.d.ts.map +1 -1
- package/types/slotted-angular-inline.d.ts.map +1 -1
- package/types/slotted-angular-kbd.d.ts.map +1 -1
- package/types/slotted-angular-link.d.ts.map +1 -1
- package/types/slotted-angular-list-item.d.ts +1 -1
- package/types/slotted-angular-list-item.d.ts.map +1 -1
- package/types/slotted-angular-list.d.ts +42 -27
- package/types/slotted-angular-list.d.ts.map +1 -1
- package/types/slotted-angular-listbox.d.ts.map +1 -1
- package/types/slotted-angular-loading-overlay.d.ts.map +1 -1
- package/types/slotted-angular-markdown.d.ts.map +1 -1
- package/types/slotted-angular-menu.d.ts +11 -2
- package/types/slotted-angular-menu.d.ts.map +1 -1
- package/types/slotted-angular-menubar.d.ts.map +1 -1
- package/types/slotted-angular-message-scroller.d.ts.map +1 -1
- package/types/slotted-angular-message.d.ts +1 -1
- package/types/slotted-angular-message.d.ts.map +1 -1
- package/types/slotted-angular-multi-select.d.ts +15 -1
- package/types/slotted-angular-multi-select.d.ts.map +1 -1
- package/types/slotted-angular-navigation-menu.d.ts.map +1 -1
- package/types/slotted-angular-notification-center.d.ts +1 -1
- package/types/slotted-angular-notification-center.d.ts.map +1 -1
- package/types/slotted-angular-number-field.d.ts.map +1 -1
- package/types/slotted-angular-otp-input.d.ts.map +1 -1
- package/types/slotted-angular-page-header.d.ts +15 -6
- package/types/slotted-angular-page-header.d.ts.map +1 -1
- package/types/slotted-angular-page.d.ts.map +1 -1
- package/types/slotted-angular-pagination.d.ts.map +1 -1
- package/types/slotted-angular-popover.d.ts.map +1 -1
- package/types/slotted-angular-progress-indicator.d.ts +8 -1
- package/types/slotted-angular-progress-indicator.d.ts.map +1 -1
- package/types/slotted-angular-prompt-composer.d.ts +11 -2
- package/types/slotted-angular-prompt-composer.d.ts.map +1 -1
- package/types/slotted-angular-prose.d.ts.map +1 -1
- package/types/slotted-angular-radio-group.d.ts.map +1 -1
- package/types/slotted-angular-rating.d.ts +1 -1
- package/types/slotted-angular-rating.d.ts.map +1 -1
- package/types/slotted-angular-result-state.d.ts.map +1 -1
- package/types/slotted-angular-saved-views.d.ts.map +1 -1
- package/types/slotted-angular-scroll-area.d.ts.map +1 -1
- package/types/slotted-angular-section.d.ts +11 -3
- package/types/slotted-angular-section.d.ts.map +1 -1
- package/types/slotted-angular-segmented-control.d.ts +15 -2
- package/types/slotted-angular-segmented-control.d.ts.map +1 -1
- package/types/slotted-angular-select.d.ts +12 -2
- package/types/slotted-angular-select.d.ts.map +1 -1
- package/types/slotted-angular-side-navigation.d.ts.map +1 -1
- package/types/slotted-angular-skeleton.d.ts.map +1 -1
- package/types/slotted-angular-slider.d.ts.map +1 -1
- package/types/slotted-angular-sparkline.d.ts +7 -1
- package/types/slotted-angular-sparkline.d.ts.map +1 -1
- package/types/slotted-angular-split-button.d.ts +2 -2
- package/types/slotted-angular-split-button.d.ts.map +1 -1
- package/types/slotted-angular-splitter.d.ts.map +1 -1
- package/types/slotted-angular-stack.d.ts.map +1 -1
- package/types/slotted-angular-stat-card.d.ts +1 -1
- package/types/slotted-angular-stat-card.d.ts.map +1 -1
- package/types/slotted-angular-status-indicator.d.ts +1 -1
- package/types/slotted-angular-status-indicator.d.ts.map +1 -1
- package/types/slotted-angular-stepper.d.ts +1 -1
- package/types/slotted-angular-stepper.d.ts.map +1 -1
- package/types/slotted-angular-switch.d.ts.map +1 -1
- package/types/slotted-angular-table-of-contents.d.ts.map +1 -1
- package/types/slotted-angular-table.d.ts +63 -6
- package/types/slotted-angular-table.d.ts.map +1 -1
- package/types/slotted-angular-tabs.d.ts +3 -4
- package/types/slotted-angular-tabs.d.ts.map +1 -1
- package/types/slotted-angular-tag.d.ts +1 -1
- package/types/slotted-angular-tag.d.ts.map +1 -1
- package/types/slotted-angular-tags-input.d.ts +33 -1
- package/types/slotted-angular-tags-input.d.ts.map +1 -1
- package/types/slotted-angular-text-field.d.ts.map +1 -1
- package/types/slotted-angular-textarea.d.ts.map +1 -1
- package/types/slotted-angular-theme.d.ts +1 -1
- package/types/slotted-angular-time-field.d.ts.map +1 -1
- package/types/slotted-angular-time-picker.d.ts +0 -1
- package/types/slotted-angular-time-picker.d.ts.map +1 -1
- package/types/slotted-angular-time-range-picker.d.ts +0 -1
- package/types/slotted-angular-time-range-picker.d.ts.map +1 -1
- package/types/slotted-angular-timeline.d.ts +1 -1
- package/types/slotted-angular-timeline.d.ts.map +1 -1
- package/types/slotted-angular-toast.d.ts +3 -3
- package/types/slotted-angular-toast.d.ts.map +1 -1
- package/types/slotted-angular-toggle-group.d.ts +8 -2
- package/types/slotted-angular-toggle-group.d.ts.map +1 -1
- package/types/slotted-angular-toggle.d.ts +1 -1
- package/types/slotted-angular-toggle.d.ts.map +1 -1
- package/types/slotted-angular-toolbar.d.ts +2 -0
- package/types/slotted-angular-toolbar.d.ts.map +1 -1
- package/types/slotted-angular-tooltip.d.ts.map +1 -1
- package/types/slotted-angular-top-navigation.d.ts.map +1 -1
- package/types/slotted-angular-tour.d.ts.map +1 -1
- package/types/slotted-angular-transfer.d.ts.map +1 -1
- package/types/slotted-angular-tree.d.ts.map +1 -1
- package/types/slotted-angular-typography.d.ts +1 -1
- package/types/slotted-angular-typography.d.ts.map +1 -1
- package/types/slotted-angular-upload.d.ts +2 -2
- package/types/slotted-angular-upload.d.ts.map +1 -1
- package/types/slotted-angular-visually-hidden.d.ts.map +1 -1
- package/types/slotted-angular-wizard.d.ts.map +1 -1
|
@@ -12,6 +12,7 @@ import { createPresence } from '@slotted/core/presence';
|
|
|
12
12
|
import { tourMessages } from '@slotted/core/i18n';
|
|
13
13
|
import { createControllable } from '@slotted/core/state';
|
|
14
14
|
import { compactSide, tourProgress, createTourController, stageStep, cardFits, writeTargetRect, watchTarget, isCompactViewport, keepOverTarget, isTextEntry, tourKey } from '@slotted/core/tour';
|
|
15
|
+
import { writeSelectorKey } from '@slotted/core/selector-key';
|
|
15
16
|
import { SlGlyph, SlIcon } from '@slotted/angular/icon';
|
|
16
17
|
|
|
17
18
|
const SL_TOUR = new InjectionToken('slotted tour');
|
|
@@ -119,7 +120,7 @@ class SlTourContent {
|
|
|
119
120
|
role = inject(new HostAttributeToken('role'), { optional: true });
|
|
120
121
|
label = inject(new HostAttributeToken('aria-label'), { optional: true });
|
|
121
122
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlTourContent, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
122
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: SlTourContent, isStandalone: true, selector: "[slTourContent]", host: { attributes: { "data-part": "content", "tabindex": "-1" }, listeners: { "keydown": "tour.onKeyDown($event)" }, properties: { "attr.role": "role ?? \"dialog\"", "attr.aria-labelledby": "label === null ? tour.titleId : null", "attr.aria-describedby": "tour.hasDescription() ? tour.descriptionId : null", "attr.aria-modal": "tour.modal() ? \"true\" : null" } }, ngImport: i0 });
|
|
123
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: SlTourContent, isStandalone: true, selector: "[slTourContent]", host: { attributes: { "data-part": "content", "data-part-content": "", "tabindex": "-1" }, listeners: { "keydown": "tour.onKeyDown($event)" }, properties: { "attr.role": "role ?? \"dialog\"", "attr.aria-labelledby": "label === null ? tour.titleId : null", "attr.aria-describedby": "tour.hasDescription() ? tour.descriptionId : null", "attr.aria-modal": "tour.modal() ? \"true\" : null" } }, ngImport: i0 });
|
|
123
124
|
}
|
|
124
125
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlTourContent, decorators: [{
|
|
125
126
|
type: Directive,
|
|
@@ -128,6 +129,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImpor
|
|
|
128
129
|
standalone: true,
|
|
129
130
|
host: {
|
|
130
131
|
'data-part': 'content',
|
|
132
|
+
'data-part-content': '',
|
|
131
133
|
tabindex: '-1',
|
|
132
134
|
'[attr.role]': 'role ?? "dialog"',
|
|
133
135
|
'[attr.aria-labelledby]': 'label === null ? tour.titleId : null',
|
|
@@ -148,7 +150,7 @@ class SlTourMedia {
|
|
|
148
150
|
shown = computed(() => this.tour.mediaTemplate() !== null || this.url() !== null, /* @ts-ignore */
|
|
149
151
|
...(ngDevMode ? [{ debugName: "shown" }] : /* istanbul ignore next */ []));
|
|
150
152
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlTourMedia, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
151
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: SlTourMedia, isStandalone: true, selector: "[slTourMedia]", host: { attributes: { "data-part": "media" }, properties: { "attr.hidden": "shown() ? null : \"\"" } }, ngImport: i0, template: `@if (tour.mediaTemplate(); as media) {
|
|
153
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: SlTourMedia, isStandalone: true, selector: "[slTourMedia]", host: { attributes: { "data-part": "media", "data-part-media": "" }, properties: { "attr.hidden": "shown() ? null : \"\"" } }, ngImport: i0, template: `@if (tour.mediaTemplate(); as media) {
|
|
152
154
|
<ng-container [ngTemplateOutlet]="media" />
|
|
153
155
|
} @else if (url(); as src) {
|
|
154
156
|
<img alt="" [src]="src" />
|
|
@@ -169,23 +171,28 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImpor
|
|
|
169
171
|
encapsulation: ViewEncapsulation.None,
|
|
170
172
|
host: {
|
|
171
173
|
'data-part': 'media',
|
|
174
|
+
'data-part-media': '',
|
|
172
175
|
'[attr.hidden]': 'shown() ? null : ""',
|
|
173
176
|
},
|
|
174
177
|
}]
|
|
175
178
|
}] });
|
|
176
179
|
class SlTourHeader {
|
|
177
180
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlTourHeader, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
178
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: SlTourHeader, isStandalone: true, selector: "[slTourHeader]", host: { attributes: { "data-part": "header" } }, ngImport: i0 });
|
|
181
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: SlTourHeader, isStandalone: true, selector: "[slTourHeader]", host: { attributes: { "data-part": "header", "data-part-header": "" } }, ngImport: i0 });
|
|
179
182
|
}
|
|
180
183
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlTourHeader, decorators: [{
|
|
181
184
|
type: Directive,
|
|
182
|
-
args: [{
|
|
185
|
+
args: [{
|
|
186
|
+
selector: '[slTourHeader]',
|
|
187
|
+
standalone: true,
|
|
188
|
+
host: { 'data-part': 'header', 'data-part-header': '' },
|
|
189
|
+
}]
|
|
183
190
|
}] });
|
|
184
191
|
/** “2 of 5”, counting the steps available now; hidden in a tour of one step. */
|
|
185
192
|
class SlTourProgress {
|
|
186
193
|
tour = inject(SL_TOUR);
|
|
187
194
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlTourProgress, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
188
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.7", type: SlTourProgress, isStandalone: true, selector: "[slTourProgress]", host: { attributes: { "data-part": "progress" }, properties: { "attr.hidden": "tour.total() > 1 ? null : \"\"" } }, ngImport: i0, template: `{{ tour.t('progress', { position: tour.position(), total: tour.total() }) }}`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
195
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.7", type: SlTourProgress, isStandalone: true, selector: "[slTourProgress]", host: { attributes: { "data-part": "progress", "data-part-progress": "" }, properties: { "attr.hidden": "tour.total() > 1 ? null : \"\"" } }, ngImport: i0, template: `{{ tour.t('progress', { position: tour.position(), total: tour.total() }) }}`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
189
196
|
}
|
|
190
197
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlTourProgress, decorators: [{
|
|
191
198
|
type: Component,
|
|
@@ -197,6 +204,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImpor
|
|
|
197
204
|
encapsulation: ViewEncapsulation.None,
|
|
198
205
|
host: {
|
|
199
206
|
'data-part': 'progress',
|
|
207
|
+
'data-part-progress': '',
|
|
200
208
|
'[attr.hidden]': 'tour.total() > 1 ? null : ""',
|
|
201
209
|
},
|
|
202
210
|
}]
|
|
@@ -206,7 +214,7 @@ class SlTourClose {
|
|
|
206
214
|
tour = inject(SL_TOUR);
|
|
207
215
|
label = inject(new HostAttributeToken('aria-label'), { optional: true });
|
|
208
216
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlTourClose, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
209
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.7", type: SlTourClose, isStandalone: true, selector: "button[slTourClose]", host: { attributes: { "data-part": "close", "type": "button" }, listeners: { "click": "tour.close(\"close\", $event, true)" }, properties: { "attr.aria-label": "label ?? tour.t('close')", "attr.hidden": "tour.showClose() ? null : \"\"" } }, ngImport: i0, template: `<ng-content
|
|
217
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.7", type: SlTourClose, isStandalone: true, selector: "button[slTourClose]", host: { attributes: { "data-part": "close", "data-part-close": "", "type": "button" }, listeners: { "click": "tour.close(\"close\", $event, true)" }, properties: { "attr.aria-label": "label ?? tour.t('close')", "attr.hidden": "tour.showClose() ? null : \"\"" } }, ngImport: i0, template: `<ng-content
|
|
210
218
|
><span slIcon size="sm"><svg slGlyph name="x"></svg></span
|
|
211
219
|
></ng-content>`, isInline: true, dependencies: [{ kind: "component", type: SlGlyph, selector: "svg[slGlyph]", inputs: ["name", "solid"] }, { kind: "component", type: SlIcon, selector: "[slIcon]", inputs: ["directional", "label", "size", "tone"], exportAs: ["slIcon"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
212
220
|
}
|
|
@@ -223,6 +231,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImpor
|
|
|
223
231
|
encapsulation: ViewEncapsulation.None,
|
|
224
232
|
host: {
|
|
225
233
|
'data-part': 'close',
|
|
234
|
+
'data-part-close': '',
|
|
226
235
|
type: 'button',
|
|
227
236
|
'[attr.aria-label]': "label ?? tour.t('close')",
|
|
228
237
|
'[attr.hidden]': 'tour.showClose() ? null : ""',
|
|
@@ -234,7 +243,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImpor
|
|
|
234
243
|
class SlTourTitle {
|
|
235
244
|
tour = inject(SL_TOUR);
|
|
236
245
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlTourTitle, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
237
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.7", type: SlTourTitle, isStandalone: true, selector: "[slTourTitle]", host: { attributes: { "data-part": "title" }, properties: { "id": "tour.titleId" } }, ngImport: i0, template: `<ng-content>{{ tour.current()?.title }}</ng-content>`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
246
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.7", type: SlTourTitle, isStandalone: true, selector: "[slTourTitle]", host: { attributes: { "data-part": "title", "data-part-title": "" }, properties: { "id": "tour.titleId" } }, ngImport: i0, template: `<ng-content>{{ tour.current()?.title }}</ng-content>`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
238
247
|
}
|
|
239
248
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlTourTitle, decorators: [{
|
|
240
249
|
type: Component,
|
|
@@ -244,14 +253,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImpor
|
|
|
244
253
|
template: `<ng-content>{{ tour.current()?.title }}</ng-content>`,
|
|
245
254
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
246
255
|
encapsulation: ViewEncapsulation.None,
|
|
247
|
-
host: { 'data-part': 'title', '[id]': 'tour.titleId' },
|
|
256
|
+
host: { 'data-part': 'title', 'data-part-title': '', '[id]': 'tour.titleId' },
|
|
248
257
|
}]
|
|
249
258
|
}] });
|
|
250
259
|
/** The step's description, and the card's accessible description; hidden when it has none. */
|
|
251
260
|
class SlTourDescription {
|
|
252
261
|
tour = inject(SL_TOUR);
|
|
253
262
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlTourDescription, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
254
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.7", type: SlTourDescription, isStandalone: true, selector: "[slTourDescription]", host: { attributes: { "data-part": "description" }, properties: { "id": "tour.descriptionId", "attr.hidden": "tour.hasDescription() ? null : \"\"" } }, ngImport: i0, template: `{{ tour.current()?.description }}`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
263
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "22.1.7", type: SlTourDescription, isStandalone: true, selector: "[slTourDescription]", host: { attributes: { "data-part": "description", "data-part-description": "" }, properties: { "id": "tour.descriptionId", "attr.hidden": "tour.hasDescription() ? null : \"\"" } }, ngImport: i0, template: `{{ tour.current()?.description }}`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
255
264
|
}
|
|
256
265
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlTourDescription, decorators: [{
|
|
257
266
|
type: Component,
|
|
@@ -263,6 +272,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImpor
|
|
|
263
272
|
encapsulation: ViewEncapsulation.None,
|
|
264
273
|
host: {
|
|
265
274
|
'data-part': 'description',
|
|
275
|
+
'data-part-description': '',
|
|
266
276
|
'[id]': 'tour.descriptionId',
|
|
267
277
|
'[attr.hidden]': 'tour.hasDescription() ? null : ""',
|
|
268
278
|
},
|
|
@@ -279,7 +289,7 @@ class SlTourBody {
|
|
|
279
289
|
shown = computed(() => this.tour.bodyTemplate() !== null || this.text() !== '', /* @ts-ignore */
|
|
280
290
|
...(ngDevMode ? [{ debugName: "shown" }] : /* istanbul ignore next */ []));
|
|
281
291
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlTourBody, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
282
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: SlTourBody, isStandalone: true, selector: "[slTourBody]", host: { attributes: { "data-part": "body" }, properties: { "attr.hidden": "shown() ? null : \"\"" } }, ngImport: i0, template: `@if (tour.bodyTemplate(); as body) {
|
|
292
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: SlTourBody, isStandalone: true, selector: "[slTourBody]", host: { attributes: { "data-part": "body", "data-part-body": "" }, properties: { "attr.hidden": "shown() ? null : \"\"" } }, ngImport: i0, template: `@if (tour.bodyTemplate(); as body) {
|
|
283
293
|
<ng-container [ngTemplateOutlet]="body" />
|
|
284
294
|
} @else {
|
|
285
295
|
{{ text() }}
|
|
@@ -300,17 +310,22 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImpor
|
|
|
300
310
|
encapsulation: ViewEncapsulation.None,
|
|
301
311
|
host: {
|
|
302
312
|
'data-part': 'body',
|
|
313
|
+
'data-part-body': '',
|
|
303
314
|
'[attr.hidden]': 'shown() ? null : ""',
|
|
304
315
|
},
|
|
305
316
|
}]
|
|
306
317
|
}] });
|
|
307
318
|
class SlTourFooter {
|
|
308
319
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlTourFooter, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
309
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: SlTourFooter, isStandalone: true, selector: "[slTourFooter]", host: { attributes: { "data-part": "footer" } }, ngImport: i0 });
|
|
320
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "22.1.7", type: SlTourFooter, isStandalone: true, selector: "[slTourFooter]", host: { attributes: { "data-part": "footer", "data-part-footer": "" } }, ngImport: i0 });
|
|
310
321
|
}
|
|
311
322
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlTourFooter, decorators: [{
|
|
312
323
|
type: Directive,
|
|
313
|
-
args: [{
|
|
324
|
+
args: [{
|
|
325
|
+
selector: '[slTourFooter]',
|
|
326
|
+
standalone: true,
|
|
327
|
+
host: { 'data-part': 'footer', 'data-part-footer': '' },
|
|
328
|
+
}]
|
|
314
329
|
}] });
|
|
315
330
|
/**
|
|
316
331
|
* The three actions go on the consumer's own `button slButton`. `slButton`
|
|
@@ -322,7 +337,7 @@ class TourAction {
|
|
|
322
337
|
tour = inject(SL_TOUR);
|
|
323
338
|
constructor(part) {
|
|
324
339
|
const host = inject(ElementRef).nativeElement;
|
|
325
|
-
afterNextRender(() => host
|
|
340
|
+
afterNextRender(() => writeSelectorKey(host, 'part', part));
|
|
326
341
|
}
|
|
327
342
|
}
|
|
328
343
|
/** Closes with the outcome `skip`. Hidden on the last step and in a tour of one. */
|
|
@@ -439,7 +454,9 @@ class SlTourFrame {
|
|
|
439
454
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlTourFrame, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
440
455
|
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.1.7", type: SlTourFrame, isStandalone: true, selector: "sl-tour-frame", host: { styleAttribute: "display: contents" }, ngImport: i0, template: `<div
|
|
441
456
|
data-ui="tour"
|
|
457
|
+
data-ui-tour=""
|
|
442
458
|
data-part="root"
|
|
459
|
+
data-part-root=""
|
|
443
460
|
[attr.data-open]="tour.visible() && tour.arrived() ? '' : null"
|
|
444
461
|
[attr.data-modal]="tour.modal() ? '' : null"
|
|
445
462
|
[attr.data-spot]="tour.spot().move"
|
|
@@ -451,14 +468,15 @@ class SlTourFrame {
|
|
|
451
468
|
[attr.data-align]="tour.anchored() ? tour.resolvedAlign() : null"
|
|
452
469
|
>
|
|
453
470
|
@if (tour.modal() || tour.spotlightOn()) {
|
|
454
|
-
<div data-part="backdrop" aria-hidden="true">
|
|
471
|
+
<div data-part="backdrop" data-part-backdrop="" aria-hidden="true">
|
|
455
472
|
@if (tour.spotlightOn()) {
|
|
456
|
-
<div data-part="spotlight"></div>
|
|
473
|
+
<div data-part="spotlight" data-part-spotlight=""></div>
|
|
457
474
|
}
|
|
458
475
|
</div>
|
|
459
476
|
}
|
|
460
477
|
<div
|
|
461
478
|
data-part="surface"
|
|
479
|
+
data-part-surface=""
|
|
462
480
|
[attr.data-placement]="tour.anchored() ? 'anchored' : 'centered'"
|
|
463
481
|
[attr.data-ready]="tour.ready() ? '' : null"
|
|
464
482
|
[attr.data-leaving]="tour.leaving() ? '' : null"
|
|
@@ -466,13 +484,14 @@ class SlTourFrame {
|
|
|
466
484
|
@if (!tour.modal()) {
|
|
467
485
|
<span
|
|
468
486
|
data-part="focus-guard"
|
|
487
|
+
data-part-focus-guard=""
|
|
469
488
|
tabindex="0"
|
|
470
489
|
aria-hidden="true"
|
|
471
490
|
(focus)="tour.onGuardFocus()"
|
|
472
491
|
></span>
|
|
473
492
|
}
|
|
474
493
|
@if (tour.anchored() && tour.resolvedArrow()) {
|
|
475
|
-
<div data-part="arrow"></div>
|
|
494
|
+
<div data-part="arrow" data-part-arrow=""></div>
|
|
476
495
|
}
|
|
477
496
|
@if (tour.card(); as custom) {
|
|
478
497
|
<ng-container [ngTemplateOutlet]="custom.template" />
|
|
@@ -510,13 +529,14 @@ class SlTourFrame {
|
|
|
510
529
|
@if (!tour.modal()) {
|
|
511
530
|
<span
|
|
512
531
|
data-part="focus-guard"
|
|
532
|
+
data-part-focus-guard=""
|
|
513
533
|
tabindex="0"
|
|
514
534
|
aria-hidden="true"
|
|
515
535
|
(focus)="tour.onGuardFocus()"
|
|
516
536
|
></span>
|
|
517
537
|
}
|
|
518
538
|
</div>
|
|
519
|
-
</div>`, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SlButton, selector: "button[slButton]", inputs: ["disabled", "focusableWhenDisabled", "fullWidth", "loading", "loadingDelay", "messages", "size", "tone", "type", "variant"], exportAs: ["slButton"] }, { kind: "component", type: SlTourBody, selector: "[slTourBody]" }, { kind: "component", type: SlTourClose, selector: "button[slTourClose]" }, { kind: "directive", type: SlTourContent, selector: "[slTourContent]" }, { kind: "component", type: SlTourDescription, selector: "[slTourDescription]" }, { kind: "directive", type: SlTourFooter, selector: "[slTourFooter]" }, { kind: "directive", type: SlTourHeader, selector: "[slTourHeader]" }, { kind: "component", type: SlTourMedia, selector: "[slTourMedia]" }, { kind: "directive", type: SlTourNext, selector: "button[slTourNext]" }, { kind: "directive", type: SlTourPrev, selector: "button[slTourPrev]" }, { kind: "component", type: SlTourProgress, selector: "[slTourProgress]" }, { kind: "directive", type: SlTourSkip, selector: "button[slTourSkip]" }, { kind: "component", type: SlTourTitle, selector: "[slTourTitle]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
539
|
+
</div>`, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: SlButton, selector: "button[slButton]", inputs: ["disabled", "focusableWhenDisabled", "fullWidth", "justify", "loading", "loadingDelay", "messages", "size", "tone", "type", "variant"], exportAs: ["slButton"] }, { kind: "component", type: SlTourBody, selector: "[slTourBody]" }, { kind: "component", type: SlTourClose, selector: "button[slTourClose]" }, { kind: "directive", type: SlTourContent, selector: "[slTourContent]" }, { kind: "component", type: SlTourDescription, selector: "[slTourDescription]" }, { kind: "directive", type: SlTourFooter, selector: "[slTourFooter]" }, { kind: "directive", type: SlTourHeader, selector: "[slTourHeader]" }, { kind: "component", type: SlTourMedia, selector: "[slTourMedia]" }, { kind: "directive", type: SlTourNext, selector: "button[slTourNext]" }, { kind: "directive", type: SlTourPrev, selector: "button[slTourPrev]" }, { kind: "component", type: SlTourProgress, selector: "[slTourProgress]" }, { kind: "directive", type: SlTourSkip, selector: "button[slTourSkip]" }, { kind: "component", type: SlTourTitle, selector: "[slTourTitle]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
520
540
|
}
|
|
521
541
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlTourFrame, decorators: [{
|
|
522
542
|
type: Component,
|
|
@@ -544,7 +564,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImpor
|
|
|
544
564
|
host: { style: 'display: contents' },
|
|
545
565
|
template: `<div
|
|
546
566
|
data-ui="tour"
|
|
567
|
+
data-ui-tour=""
|
|
547
568
|
data-part="root"
|
|
569
|
+
data-part-root=""
|
|
548
570
|
[attr.data-open]="tour.visible() && tour.arrived() ? '' : null"
|
|
549
571
|
[attr.data-modal]="tour.modal() ? '' : null"
|
|
550
572
|
[attr.data-spot]="tour.spot().move"
|
|
@@ -556,14 +578,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImpor
|
|
|
556
578
|
[attr.data-align]="tour.anchored() ? tour.resolvedAlign() : null"
|
|
557
579
|
>
|
|
558
580
|
@if (tour.modal() || tour.spotlightOn()) {
|
|
559
|
-
<div data-part="backdrop" aria-hidden="true">
|
|
581
|
+
<div data-part="backdrop" data-part-backdrop="" aria-hidden="true">
|
|
560
582
|
@if (tour.spotlightOn()) {
|
|
561
|
-
<div data-part="spotlight"></div>
|
|
583
|
+
<div data-part="spotlight" data-part-spotlight=""></div>
|
|
562
584
|
}
|
|
563
585
|
</div>
|
|
564
586
|
}
|
|
565
587
|
<div
|
|
566
588
|
data-part="surface"
|
|
589
|
+
data-part-surface=""
|
|
567
590
|
[attr.data-placement]="tour.anchored() ? 'anchored' : 'centered'"
|
|
568
591
|
[attr.data-ready]="tour.ready() ? '' : null"
|
|
569
592
|
[attr.data-leaving]="tour.leaving() ? '' : null"
|
|
@@ -571,13 +594,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImpor
|
|
|
571
594
|
@if (!tour.modal()) {
|
|
572
595
|
<span
|
|
573
596
|
data-part="focus-guard"
|
|
597
|
+
data-part-focus-guard=""
|
|
574
598
|
tabindex="0"
|
|
575
599
|
aria-hidden="true"
|
|
576
600
|
(focus)="tour.onGuardFocus()"
|
|
577
601
|
></span>
|
|
578
602
|
}
|
|
579
603
|
@if (tour.anchored() && tour.resolvedArrow()) {
|
|
580
|
-
<div data-part="arrow"></div>
|
|
604
|
+
<div data-part="arrow" data-part-arrow=""></div>
|
|
581
605
|
}
|
|
582
606
|
@if (tour.card(); as custom) {
|
|
583
607
|
<ng-container [ngTemplateOutlet]="custom.template" />
|
|
@@ -615,6 +639,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImpor
|
|
|
615
639
|
@if (!tour.modal()) {
|
|
616
640
|
<span
|
|
617
641
|
data-part="focus-guard"
|
|
642
|
+
data-part-focus-guard=""
|
|
618
643
|
tabindex="0"
|
|
619
644
|
aria-hidden="true"
|
|
620
645
|
(focus)="tour.onGuardFocus()"
|
|
@@ -1315,11 +1340,11 @@ class SlTour {
|
|
|
1315
1340
|
destination.focus();
|
|
1316
1341
|
}
|
|
1317
1342
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlTour, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1318
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.1.7", type: SlTour, isStandalone: true, selector: "sl-tour", inputs: { steps: { classPropertyName: "steps", publicName: "steps", isSignal: true, isRequired: true, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, step: { classPropertyName: "step", publicName: "step", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, layout: { classPropertyName: "layout", publicName: "layout", isSignal: true, isRequired: false, transformFunction: null }, side: { classPropertyName: "side", publicName: "side", isSignal: true, isRequired: false, transformFunction: null }, align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null }, missing: { classPropertyName: "missing", publicName: "missing", isSignal: true, isRequired: false, transformFunction: null }, messages: { classPropertyName: "messages", publicName: "messages", isSignal: true, isRequired: false, transformFunction: null }, finalFocus: { classPropertyName: "finalFocus", publicName: "finalFocus", isSignal: true, isRequired: false, transformFunction: null }, arrow: { classPropertyName: "arrow", publicName: "arrow", isSignal: true, isRequired: false, transformFunction: null }, modalInput: { classPropertyName: "modalInput", publicName: "modal", isSignal: true, isRequired: false, transformFunction: null }, spotlight: { classPropertyName: "spotlight", publicName: "spotlight", isSignal: true, isRequired: false, transformFunction: null }, autoFocus: { classPropertyName: "autoFocus", publicName: "autoFocus", isSignal: true, isRequired: false, transformFunction: null }, closeOnEscape: { classPropertyName: "closeOnEscape", publicName: "closeOnEscape", isSignal: true, isRequired: false, transformFunction: null }, closeOnOutsidePress: { classPropertyName: "closeOnOutsidePress", publicName: "closeOnOutsidePress", isSignal: true, isRequired: false, transformFunction: null }, scrollIntoView: { classPropertyName: "scrollIntoView", publicName: "scrollIntoView", isSignal: true, isRequired: false, transformFunction: null }, keyboardNavigation: { classPropertyName: "keyboardNavigation", publicName: "keyboardNavigation", isSignal: true, isRequired: false, transformFunction: null }, targetTimeout: { classPropertyName: "targetTimeout", publicName: "targetTimeout", isSignal: true, isRequired: false, transformFunction: null }, sideOffset: { classPropertyName: "sideOffset", publicName: "sideOffset", isSignal: true, isRequired: false, transformFunction: null }, alignOffset: { classPropertyName: "alignOffset", publicName: "alignOffset", isSignal: true, isRequired: false, transformFunction: null }, collisionPadding: { classPropertyName: "collisionPadding", publicName: "collisionPadding", isSignal: true, isRequired: false, transformFunction: null }, arrowPadding: { classPropertyName: "arrowPadding", publicName: "arrowPadding", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "openChange", step: "stepChange", openChangeRequest: "openChangeRequest", stepChangeRequest: "stepChangeRequest" }, providers: [{ provide: SL_TOUR, useExisting: forwardRef(() => SlTour) }], queries: [{ propertyName: "card", first: true, predicate: SlTourCard, descendants: true, isSignal: true }, { propertyName: "stepTemplates", predicate: SlTourStep, isSignal: true }], viewQueries: [{ propertyName: "outlet", first: true, predicate: ["outlet"], descendants: true, read: ViewContainerRef, isSignal: true }], exportAs: ["slTour"], ngImport: i0, template: `<ng-container #outlet></ng-container>`, isInline: true, styles: ["@layer slotted.components{[data-ui=tour]{--_scrim: var(--slotted-tour-scrim, var(--slotted-scrim, Canvas));--_spotlight-padding: var(--slotted-tour-spotlight-padding, var(--slotted-space-3, .375rem));--_spotlight-radius: var(--slotted-tour-spotlight-radius, var(--slotted-radius-md, 6px));--_gap: var( --slotted-tour-gap, calc(var(--_spotlight-padding) + var(--slotted-space-4, .5rem)) );--_surface: var(--slotted-tour-surface, var(--slotted-surface-raised, #ffffff));--_text: var(--slotted-tour-text, var(--slotted-text, #0f172a));--_border-color: var(--slotted-tour-border-color, var(--slotted-border-subtle, #e2e8f0));--_border-width: var(--slotted-border-width-thin, 1px);--_radius: var(--slotted-tour-radius, var(--slotted-radius-lg, 8px));--_shadow: var(--slotted-tour-shadow, var(--slotted-shadow-lg));--_arrow-size: var(--slotted-tour-arrow-size, .625rem);--_arrow-tip-radius: var(--slotted-tour-arrow-tip-radius, var(--slotted-radius-xs, 2px));--_inset-block: var(--slotted-tour-padding-block, var(--slotted-space-6, 1rem));--_inset-inline: var(--slotted-tour-padding-inline, var(--slotted-space-6, 1rem));--_row-gap: var(--slotted-control-gap-md, .5rem);--_title-font-size: var(--slotted-font-size-lg, 1rem);--_font-size: var(--slotted-font-size-md, .875rem);--_measure: var(--slotted-tour-measure, 20rem);position:fixed;inset:0;z-index:calc(var(--slotted-z-index-overlay, 1000) + var(--slotted-layer-depth, 0));isolation:isolate;overflow:clip;pointer-events:none;visibility:hidden;transition:visibility var(--slotted-duration-short) var(--slotted-easing-exit)}[data-ui=tour][data-open]{visibility:visible;transition:none}[data-ui=tour][data-size=sm]{--_inset-block: var(--slotted-tour-padding-block-sm, var(--slotted-space-5, .75rem));--_inset-inline: var(--slotted-tour-padding-inline-sm, var(--slotted-space-5, .75rem));--_title-font-size: var(--slotted-font-size-md, .875rem);--_font-size: var(--slotted-font-size-sm, .8125rem);--_measure: var(--slotted-tour-measure-sm, 16rem)}[data-ui=tour][data-size=lg]{--_inset-block: var(--slotted-tour-padding-block-lg, var(--slotted-space-7, 1.25rem));--_inset-inline: var(--slotted-tour-padding-inline-lg, var(--slotted-space-7, 1.25rem));--_title-font-size: var(--slotted-font-size-xl, 1.125rem);--_measure: var(--slotted-tour-measure-lg, 24rem)}[data-ui=tour]>[data-part=backdrop]{position:absolute;inset:0;overflow:clip;background:var(--_scrim);opacity:0;transition:opacity var(--slotted-duration-short) var(--slotted-easing-exit)}[data-ui=tour][data-open]>[data-part=backdrop]{opacity:1;transition:opacity var(--slotted-duration-long) var(--slotted-easing-standard)}[data-ui=tour][data-spotlight]>[data-part=backdrop]{background:transparent}[data-ui=tour][data-modal]>[data-part=backdrop]{pointer-events:auto}[data-ui=tour]>[data-part=backdrop]>[data-part=spotlight]{position:absolute;left:calc(var(--slotted-tour-target-x, 0px) - var(--_spotlight-padding));top:calc(var(--slotted-tour-target-y, 0px) - var(--_spotlight-padding));width:calc(var(--slotted-tour-target-width, 0px) + 2 * var(--_spotlight-padding));height:calc(var(--slotted-tour-target-height, 0px) + 2 * var(--_spotlight-padding));border-radius:var(--_spotlight-radius);box-shadow:0 0 0 200vmax var(--_scrim);background-color:transparent}[data-ui=tour][data-spot=travel]>[data-part=backdrop]>[data-part=spotlight]{transition-property:left,top,width,height;transition-duration:var(--slotted-duration-long);transition-timing-function:var(--slotted-easing-standard)}[data-ui=tour][data-spot=light]>[data-part=backdrop]>[data-part=spotlight]{animation:slotted-tour-light var(--slotted-duration-long) var(--slotted-easing-standard)}[data-ui=tour][data-spot=close]>[data-part=backdrop]>[data-part=spotlight]{background-color:var(--_scrim);transition:background-color var(--slotted-duration-long) var(--slotted-easing-standard)}@keyframes slotted-tour-light{0%{background-color:var(--_scrim)}}[data-ui=tour]>[data-part=surface]{position:absolute;inset-block-start:0;box-sizing:border-box;padding:var(--_gap);inline-size:max-content;max-inline-size:min(var(--_measure),var(--slotted-positioner-available-width, 100vw));pointer-events:none;opacity:0;transition:opacity var(--slotted-duration-short) var(--slotted-easing-exit)}[data-ui=tour][data-open]>[data-part=surface][data-ready]:not([data-leaving]){opacity:1;transition:opacity var(--slotted-duration-long) var(--slotted-easing-standard)}[data-ui=tour]>[data-part=surface][data-detached]{visibility:hidden}[data-ui=tour]>[data-part=surface][data-placement=centered]{inset:0;margin:auto;block-size:max-content;max-inline-size:min(var(--_measure),100%);max-block-size:100%}@supports (inset: env(safe-area-inset-top)){[data-ui=tour]>[data-part=surface][data-placement=centered]{inset:env(safe-area-inset-top,0) env(safe-area-inset-right,0) env(safe-area-inset-bottom,0) env(safe-area-inset-left,0)}}[data-ui=tour][data-compact]>[data-part=surface][data-placement=anchored]{--_compact-measure: var(--slotted-tour-measure-compact, 32rem);inline-size:min(var(--slotted-positioner-available-width, 100vw),var(--_compact-measure));max-inline-size:min(var(--slotted-positioner-available-width, 100vw),var(--_compact-measure))}[data-ui=tour]>[data-part=surface][data-placement=centered]>[data-part=arrow]{display:none}[data-ui=tour]>[data-part=surface]>[data-part=focus-guard]{position:absolute;inline-size:1px;block-size:1px;padding:0;overflow:hidden;opacity:0;outline:none;pointer-events:none}[data-ui=tour]>[data-part=surface]>[data-part=content]{box-sizing:border-box;display:flex;flex-direction:column;max-inline-size:100%;max-block-size:calc(var(--slotted-positioner-available-height, 100vh) - 2 * var(--_gap));border:var(--_border-width) solid var(--_border-color);border-radius:var(--_radius);background:var(--_surface);color:var(--_text);box-shadow:var(--_shadow);overflow:clip;font-family:var(--slotted-font-family-sans, ui-sans-serif, system-ui, sans-serif);font-size:var(--_font-size);line-height:var(--slotted-line-height-md, 1.5);text-align:start;pointer-events:auto;outline:none}[data-ui=tour]>[data-part=surface][data-placement=centered]>[data-part=content]{max-block-size:calc(100vh - 2 * var(--_gap))}[data-ui=tour]>[data-part=surface]>[data-part=content]:focus-visible{outline:var(--slotted-focus-ring-width, 2px) solid var(--slotted-focus-ring-color, currentColor);outline-offset:calc(-1 * var(--slotted-focus-ring-width, 2px))}[data-ui=tour] [data-part=content]>[data-part=media]{display:block;flex:none;inline-size:100%;max-inline-size:100%;block-size:auto;object-fit:cover;border-block-end:var(--_border-width) solid var(--_border-color)}[data-ui=tour] [data-part=content]>[data-part=media]>:is(img,video,svg){display:block;inline-size:100%;block-size:auto}[data-ui=tour] [data-part=content]>[data-part=header]{display:flex;flex:none;align-items:flex-start;gap:var(--_row-gap);min-block-size:var(--slotted-control-height-sm, 30px);padding-block-start:calc(var(--_inset-block) - var(--slotted-space-3, .375rem));padding-inline:var(--_inset-inline) calc(var(--_inset-inline) - var(--slotted-space-3, .375rem))}[data-ui=tour] [data-part=content]>[data-part=header]>[data-part=progress]{flex:1 1 auto;min-inline-size:0;margin:0;font-size:var(--slotted-font-size-xs, .75rem);font-weight:var(--slotted-font-weight-medium, 500);line-height:var(--slotted-line-height-xs, 1.4);color:var(--slotted-text-muted, #5b6b7f);font-variant-numeric:tabular-nums;padding-block:calc((var(--slotted-control-height-sm, 30px) - 1lh) / 2);unicode-bidi:plaintext}[data-ui=tour] [data-part=content]>[data-part=header]>[data-part=close]{flex:none;display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;inline-size:var(--slotted-control-height-sm, 30px);block-size:var(--slotted-control-height-sm, 30px);margin-inline-start:auto;padding:0;border:0;border-radius:var(--slotted-control-radius, var(--slotted-radius-sm, 4px));background:transparent;color:var(--slotted-text-muted, #5b6b7f);cursor:pointer;transition:background-color var(--slotted-control-transition-duration, var(--slotted-duration-short)) var(--slotted-control-transition-easing, var(--slotted-easing-standard)),color var(--slotted-control-transition-duration, var(--slotted-duration-short)) var(--slotted-control-transition-easing, var(--slotted-easing-standard))}[data-ui=tour] [data-part=content]>[data-part=header]>[data-part=close]:enabled:hover{background:var(--slotted-tone-secondary-subtle-hover, rgb(15 23 42 / .06));color:var(--_text)}[data-ui=tour] [data-part=content]>[data-part=header]>[data-part=close]:enabled:active{background:var(--slotted-tone-secondary-subtle-active, rgb(15 23 42 / .1))}[data-ui=tour] [data-part=content]>[data-part=header]>[data-part=close]:focus-visible{outline:var(--slotted-focus-ring-width, 2px) solid var(--slotted-focus-ring-color, currentColor);outline-offset:calc(-1 * var(--slotted-focus-ring-width, 2px))}[data-ui=tour] [data-part=content]>[data-part=title]{flex:none;margin:0;padding-inline:var(--_inset-inline);padding-block-start:var(--slotted-space-2, .25rem);font-family:var( --slotted-font-family-heading, var(--slotted-font-family-sans, ui-sans-serif, system-ui, sans-serif) );font-size:var(--_title-font-size);font-weight:var(--slotted-font-weight-semibold, 600);line-height:var(--slotted-line-height-lg, 1.5);color:var(--_text);overflow-wrap:anywhere;unicode-bidi:plaintext}[data-ui=tour] [data-part=content]>[data-part=title]:first-child,[data-ui=tour] [data-part=content]>[data-part=media]+[data-part=title]{padding-block-start:var(--_inset-block)}[data-ui=tour] [data-part=content]>[data-part=description]{flex:none;margin:0;padding-inline:var(--_inset-inline);padding-block-start:var(--slotted-space-2, .25rem);color:var(--slotted-text-muted, #5b6b7f);overflow-wrap:anywhere;unicode-bidi:plaintext}[data-ui=tour] [data-part=content]>[data-part=body]{flex:1 1 auto;min-block-size:0;overflow-x:hidden;overflow-y:auto;overflow-inline:hidden;overflow-block:auto;overscroll-behavior:contain;overflow-wrap:anywhere;unicode-bidi:plaintext;margin-block-start:var(--_row-gap);padding-inline:var(--_inset-inline);background:linear-gradient(var(--_surface) 30%,transparent) center top / 100% var(--slotted-space-4, .5rem) no-repeat local,linear-gradient(transparent,var(--_surface) 70%) center bottom / 100% var(--slotted-space-4, .5rem) no-repeat local,radial-gradient(farthest-side at 50% 0,color-mix(in oklab,var(--_text) 12%,transparent),transparent) center top / 100% var(--slotted-space-3, .375rem) no-repeat scroll,radial-gradient(farthest-side at 50% 100%,color-mix(in oklab,var(--_text) 12%,transparent),transparent) center bottom / 100% var(--slotted-space-3, .375rem) no-repeat scroll}[data-ui=tour] [data-part=content]>[data-part=footer]{display:flex;flex:none;flex-direction:row-reverse;flex-wrap:wrap-reverse;align-items:center;justify-content:flex-start;gap:var(--_row-gap);padding-block:var(--_inset-block);padding-inline:var(--_inset-inline)}[data-ui=tour] [data-part=content]>[data-part=footer]>[data-part=next]{order:1}[data-ui=tour] [data-part=content]>[data-part=footer]>[data-part=prev]{order:2}[data-ui=tour] [data-part=content]>[data-part=footer]>[data-part=skip]{order:3;margin-inline-end:auto;margin-inline-start:calc(-1 * var(--slotted-control-padding-inline-sm, 10px))}[data-ui=tour]>[data-part=surface]>[data-part=arrow]{--_arrow-min: calc(var(--_gap) + var(--_radius));--_arrow-max-x: calc(100% - var(--_gap) - var(--_radius) - var(--_arrow-size));--_arrow-x: clamp( var(--_arrow-min), var(--slotted-positioner-arrow-x, 0px), var(--_arrow-max-x) );--_arrow-y: clamp( var(--_arrow-min), var(--slotted-positioner-arrow-y, 0px), calc(100% - var(--_gap) - var(--_radius) - var(--_arrow-size)) );position:absolute;z-index:1;inline-size:var(--_arrow-size);block-size:var(--_arrow-size);rotate:45deg;background:var(--_surface);border:0 solid var(--_border-color)}[data-ui=tour]>[data-part=surface][data-side=top]>[data-part=arrow]{left:var(--_arrow-x);top:auto;bottom:calc(var(--_gap) - var(--_arrow-size) / 2);border-right-width:var(--_border-width);border-bottom-width:var(--_border-width);border-bottom-right-radius:var(--_arrow-tip-radius)}[data-ui=tour]>[data-part=surface][data-side=bottom]>[data-part=arrow]{left:var(--_arrow-x);top:calc(var(--_gap) - var(--_arrow-size) / 2);bottom:auto;border-top-width:var(--_border-width);border-left-width:var(--_border-width);border-top-left-radius:var(--_arrow-tip-radius)}[data-ui=tour]>[data-part=surface][data-side=left]>[data-part=arrow]{top:var(--_arrow-y);left:auto;right:calc(var(--_gap) - var(--_arrow-size) / 2);border-top-width:var(--_border-width);border-right-width:var(--_border-width);border-top-right-radius:var(--_arrow-tip-radius)}[data-ui=tour]>[data-part=surface][data-side=right]>[data-part=arrow]{top:var(--_arrow-y);left:calc(var(--_gap) - var(--_arrow-size) / 2);right:auto;border-bottom-width:var(--_border-width);border-left-width:var(--_border-width);border-bottom-left-radius:var(--_arrow-tip-radius)}[data-ui=tour]>[data-part=surface]:has(>[data-part=content]:focus-visible)>[data-part=arrow]{--_border-width: var(--slotted-focus-ring-width, 2px);border-color:var(--slotted-focus-ring-color, currentColor)}[data-ui=tour] [data-part=content] [data-part][hidden]{display:none}@media(forced-colors:active){[data-ui=tour]>[data-part=backdrop]>[data-part=spotlight]{outline:var(--slotted-focus-ring-width, 2px) solid Highlight}[data-ui=tour][data-spotlight]>[data-part=backdrop]{background:transparent}}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
1343
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "22.1.7", type: SlTour, isStandalone: true, selector: "sl-tour", inputs: { steps: { classPropertyName: "steps", publicName: "steps", isSignal: true, isRequired: true, transformFunction: null }, open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, step: { classPropertyName: "step", publicName: "step", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, layout: { classPropertyName: "layout", publicName: "layout", isSignal: true, isRequired: false, transformFunction: null }, side: { classPropertyName: "side", publicName: "side", isSignal: true, isRequired: false, transformFunction: null }, align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null }, missing: { classPropertyName: "missing", publicName: "missing", isSignal: true, isRequired: false, transformFunction: null }, messages: { classPropertyName: "messages", publicName: "messages", isSignal: true, isRequired: false, transformFunction: null }, finalFocus: { classPropertyName: "finalFocus", publicName: "finalFocus", isSignal: true, isRequired: false, transformFunction: null }, arrow: { classPropertyName: "arrow", publicName: "arrow", isSignal: true, isRequired: false, transformFunction: null }, modalInput: { classPropertyName: "modalInput", publicName: "modal", isSignal: true, isRequired: false, transformFunction: null }, spotlight: { classPropertyName: "spotlight", publicName: "spotlight", isSignal: true, isRequired: false, transformFunction: null }, autoFocus: { classPropertyName: "autoFocus", publicName: "autoFocus", isSignal: true, isRequired: false, transformFunction: null }, closeOnEscape: { classPropertyName: "closeOnEscape", publicName: "closeOnEscape", isSignal: true, isRequired: false, transformFunction: null }, closeOnOutsidePress: { classPropertyName: "closeOnOutsidePress", publicName: "closeOnOutsidePress", isSignal: true, isRequired: false, transformFunction: null }, scrollIntoView: { classPropertyName: "scrollIntoView", publicName: "scrollIntoView", isSignal: true, isRequired: false, transformFunction: null }, keyboardNavigation: { classPropertyName: "keyboardNavigation", publicName: "keyboardNavigation", isSignal: true, isRequired: false, transformFunction: null }, targetTimeout: { classPropertyName: "targetTimeout", publicName: "targetTimeout", isSignal: true, isRequired: false, transformFunction: null }, sideOffset: { classPropertyName: "sideOffset", publicName: "sideOffset", isSignal: true, isRequired: false, transformFunction: null }, alignOffset: { classPropertyName: "alignOffset", publicName: "alignOffset", isSignal: true, isRequired: false, transformFunction: null }, collisionPadding: { classPropertyName: "collisionPadding", publicName: "collisionPadding", isSignal: true, isRequired: false, transformFunction: null }, arrowPadding: { classPropertyName: "arrowPadding", publicName: "arrowPadding", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "openChange", step: "stepChange", openChangeRequest: "openChangeRequest", stepChangeRequest: "stepChangeRequest" }, providers: [{ provide: SL_TOUR, useExisting: forwardRef(() => SlTour) }], queries: [{ propertyName: "card", first: true, predicate: SlTourCard, descendants: true, isSignal: true }, { propertyName: "stepTemplates", predicate: SlTourStep, isSignal: true }], viewQueries: [{ propertyName: "outlet", first: true, predicate: ["outlet"], descendants: true, read: ViewContainerRef, isSignal: true }], exportAs: ["slTour"], ngImport: i0, template: `<ng-container #outlet></ng-container>`, isInline: true, styles: ["@layer slotted.components{[data-ui-tour]{--_scrim: var(--slotted-tour-scrim, var(--slotted-scrim, Canvas));--_spotlight-padding: var(--slotted-tour-spotlight-padding, var(--slotted-space-3, .375rem));--_spotlight-radius: var(--slotted-tour-spotlight-radius, var(--slotted-radius-md, 6px));--_gap: var( --slotted-tour-gap, calc(var(--_spotlight-padding) + var(--slotted-space-4, .5rem)) );--_surface: var(--slotted-tour-surface, var(--slotted-surface-raised, #ffffff));--_text: var(--slotted-tour-text, var(--slotted-text, #0f172a));--_border-color: var(--slotted-tour-border-color, var(--slotted-border-subtle, #e2e8f0));--_border-width: var(--slotted-border-width-thin, 1px);--_radius: var(--slotted-tour-radius, var(--slotted-radius-lg, 8px));--_shadow: var(--slotted-tour-shadow, var(--slotted-shadow-lg));--_arrow-size: var(--slotted-tour-arrow-size, .625rem);--_arrow-tip-radius: var(--slotted-tour-arrow-tip-radius, var(--slotted-radius-xs, 2px));--_inset-block: var(--slotted-tour-padding-block, var(--slotted-space-6, 1rem));--_inset-inline: var(--slotted-tour-padding-inline, var(--slotted-space-6, 1rem));--_row-gap: var(--slotted-control-gap-md, .5rem);--_title-font-size: var(--slotted-font-size-lg, 1rem);--_font-size: var(--slotted-font-size-md, .875rem);--_measure: var(--slotted-tour-measure, 20rem);position:fixed;inset:0;z-index:calc(var(--slotted-z-index-overlay, 1000) + var(--slotted-layer-depth, 0));isolation:isolate;overflow:clip;pointer-events:none;visibility:hidden;transition:visibility var(--slotted-duration-short) var(--slotted-easing-exit)}[data-ui-tour][data-open]{visibility:visible;transition:none}[data-ui-tour][data-size=sm]{--_inset-block: var(--slotted-tour-padding-block-sm, var(--slotted-space-5, .75rem));--_inset-inline: var(--slotted-tour-padding-inline-sm, var(--slotted-space-5, .75rem));--_title-font-size: var(--slotted-font-size-md, .875rem);--_font-size: var(--slotted-font-size-sm, .8125rem);--_measure: var(--slotted-tour-measure-sm, 16rem)}[data-ui-tour][data-size=lg]{--_inset-block: var(--slotted-tour-padding-block-lg, var(--slotted-space-7, 1.25rem));--_inset-inline: var(--slotted-tour-padding-inline-lg, var(--slotted-space-7, 1.25rem));--_title-font-size: var(--slotted-font-size-xl, 1.125rem);--_measure: var(--slotted-tour-measure-lg, 24rem)}[data-ui-tour]>[data-part-backdrop]{position:absolute;inset:0;overflow:clip;background:var(--_scrim);opacity:0;transition:opacity var(--slotted-duration-short) var(--slotted-easing-exit)}[data-ui-tour][data-open]>[data-part-backdrop]{opacity:1;transition:opacity var(--slotted-duration-long) var(--slotted-easing-standard)}[data-ui-tour][data-spotlight]>[data-part-backdrop]{background:transparent}[data-ui-tour][data-modal]>[data-part-backdrop]{pointer-events:auto}[data-ui-tour]>[data-part-backdrop]>[data-part-spotlight]{position:absolute;left:calc(var(--slotted-tour-target-x, 0px) - var(--_spotlight-padding));top:calc(var(--slotted-tour-target-y, 0px) - var(--_spotlight-padding));width:calc(var(--slotted-tour-target-width, 0px) + 2 * var(--_spotlight-padding));height:calc(var(--slotted-tour-target-height, 0px) + 2 * var(--_spotlight-padding));border-radius:var(--_spotlight-radius);box-shadow:0 0 0 200vmax var(--_scrim);background-color:transparent}[data-ui-tour][data-spot=travel]>[data-part-backdrop]>[data-part-spotlight]{transition-property:left,top,width,height;transition-duration:var(--slotted-duration-long);transition-timing-function:var(--slotted-easing-standard)}[data-ui-tour][data-spot=light]>[data-part-backdrop]>[data-part-spotlight]{animation:slotted-tour-light var(--slotted-duration-long) var(--slotted-easing-standard)}[data-ui-tour][data-spot=close]>[data-part-backdrop]>[data-part-spotlight]{background-color:var(--_scrim);transition:background-color var(--slotted-duration-long) var(--slotted-easing-standard)}@keyframes slotted-tour-light{0%{background-color:var(--_scrim)}}[data-ui-tour]>[data-part-surface]{position:absolute;inset-block-start:0;box-sizing:border-box;padding:var(--_gap);inline-size:max-content;max-inline-size:min(var(--_measure),var(--slotted-positioner-available-width, 100vw));pointer-events:none;opacity:0;transition:opacity var(--slotted-duration-short) var(--slotted-easing-exit)}[data-ui-tour][data-open]>[data-part-surface][data-ready]:not([data-leaving]){opacity:1;transition:opacity var(--slotted-duration-long) var(--slotted-easing-standard)}[data-ui-tour]>[data-part-surface][data-detached]{visibility:hidden}[data-ui-tour]>[data-part-surface][data-placement=centered]{inset:0;margin:auto;block-size:max-content;max-inline-size:min(var(--_measure),100%);max-block-size:100%}@supports (inset: env(safe-area-inset-top)){[data-ui-tour]>[data-part-surface][data-placement=centered]{inset:env(safe-area-inset-top,0) env(safe-area-inset-right,0) env(safe-area-inset-bottom,0) env(safe-area-inset-left,0)}}[data-ui-tour][data-compact]>[data-part-surface][data-placement=anchored]{--_compact-measure: var(--slotted-tour-measure-compact, 32rem);inline-size:min(var(--slotted-positioner-available-width, 100vw),var(--_compact-measure));max-inline-size:min(var(--slotted-positioner-available-width, 100vw),var(--_compact-measure))}[data-ui-tour]>[data-part-surface][data-placement=centered]>[data-part-arrow]{display:none}[data-ui-tour]>[data-part-surface]>[data-part-focus-guard]{position:absolute;inline-size:1px;block-size:1px;padding:0;overflow:hidden;opacity:0;outline:none;pointer-events:none}[data-ui-tour]>[data-part-surface]>[data-part-content]{box-sizing:border-box;display:flex;flex-direction:column;max-inline-size:100%;max-block-size:calc(var(--slotted-positioner-available-height, 100vh) - 2 * var(--_gap));border:var(--_border-width) solid var(--_border-color);border-radius:var(--_radius);background:var(--_surface);color:var(--_text);box-shadow:var(--_shadow);overflow:clip;font-family:var(--slotted-font-family-sans, ui-sans-serif, system-ui, sans-serif);font-size:var(--_font-size);line-height:var(--slotted-line-height-md, 1.5);text-align:start;pointer-events:auto;outline:none}[data-ui-tour]>[data-part-surface][data-placement=centered]>[data-part-content]{max-block-size:calc(100vh - 2 * var(--_gap))}[data-ui-tour]>[data-part-surface]>[data-part-content]:focus-visible{outline:var(--slotted-focus-ring-width, 2px) solid var(--slotted-focus-ring-color, currentColor);outline-offset:calc(-1 * var(--slotted-focus-ring-width, 2px))}[data-ui-tour] [data-part-content]>[data-part-media]{display:block;flex:none;inline-size:100%;max-inline-size:100%;block-size:auto;object-fit:cover;border-block-end:var(--_border-width) solid var(--_border-color)}[data-ui-tour] [data-part-content]>[data-part-media]>:is(img,video,svg){display:block;inline-size:100%;block-size:auto}[data-ui-tour] [data-part-content]>[data-part-header]{display:flex;flex:none;align-items:flex-start;gap:var(--_row-gap);min-block-size:var(--slotted-control-height-sm, 30px);padding-block-start:calc(var(--_inset-block) - var(--slotted-space-3, .375rem));padding-inline:var(--_inset-inline) calc(var(--_inset-inline) - var(--slotted-space-3, .375rem))}[data-ui-tour] [data-part-content]>[data-part-header]>[data-part-progress]{flex:1 1 auto;min-inline-size:0;margin:0;font-size:var(--slotted-font-size-xs, .75rem);font-weight:var(--slotted-font-weight-medium, 500);line-height:var(--slotted-line-height-xs, 1.4);color:var(--slotted-text-muted, #5b6b7f);font-variant-numeric:tabular-nums;padding-block:calc((var(--slotted-control-height-sm, 30px) - 1lh) / 2);unicode-bidi:plaintext}[data-ui-tour] [data-part-content]>[data-part-header]>[data-part-close]{flex:none;display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;inline-size:var(--slotted-control-height-sm, 30px);block-size:var(--slotted-control-height-sm, 30px);margin-inline-start:auto;padding:0;border:0;border-radius:var(--slotted-control-radius, var(--slotted-radius-sm, 4px));background:transparent;color:var(--slotted-text-muted, #5b6b7f);cursor:pointer;transition:background-color var(--slotted-control-transition-duration, var(--slotted-duration-short)) var(--slotted-control-transition-easing, var(--slotted-easing-standard)),color var(--slotted-control-transition-duration, var(--slotted-duration-short)) var(--slotted-control-transition-easing, var(--slotted-easing-standard))}[data-ui-tour] [data-part-content]>[data-part-header]>[data-part-close]:enabled:hover{background:var(--slotted-tone-secondary-subtle-hover, rgb(15 23 42 / .06));color:var(--_text)}[data-ui-tour] [data-part-content]>[data-part-header]>[data-part-close]:enabled:active{background:var(--slotted-tone-secondary-subtle-active, rgb(15 23 42 / .1))}[data-ui-tour] [data-part-content]>[data-part-header]>[data-part-close]:focus-visible{outline:var(--slotted-focus-ring-width, 2px) solid var(--slotted-focus-ring-color, currentColor);outline-offset:calc(-1 * var(--slotted-focus-ring-width, 2px))}[data-ui-tour] [data-part-content]>[data-part-title]{flex:none;margin:0;padding-inline:var(--_inset-inline);padding-block-start:var(--slotted-space-2, .25rem);font-family:var( --slotted-font-family-heading, var(--slotted-font-family-sans, ui-sans-serif, system-ui, sans-serif) );font-size:var(--_title-font-size);font-weight:var(--slotted-font-weight-semibold, 600);line-height:var(--slotted-line-height-lg, 1.5);color:var(--_text);overflow-wrap:anywhere;unicode-bidi:plaintext}[data-ui-tour] [data-part-content]>[data-part-title]:first-child,[data-ui-tour] [data-part-content]>[data-part-media]+[data-part-title]{padding-block-start:var(--_inset-block)}[data-ui-tour] [data-part-content]>[data-part-description]{flex:none;margin:0;padding-inline:var(--_inset-inline);padding-block-start:var(--slotted-space-2, .25rem);color:var(--slotted-text-muted, #5b6b7f);overflow-wrap:anywhere;unicode-bidi:plaintext}[data-ui-tour] [data-part-content]>[data-part-body]{flex:1 1 auto;min-block-size:0;overflow-x:hidden;overflow-y:auto;overflow-inline:hidden;overflow-block:auto;overscroll-behavior:contain;overflow-wrap:anywhere;unicode-bidi:plaintext;margin-block-start:var(--_row-gap);padding-inline:var(--_inset-inline);background:linear-gradient(var(--_surface) 30%,transparent) center top / 100% var(--slotted-space-4, .5rem) no-repeat local,linear-gradient(transparent,var(--_surface) 70%) center bottom / 100% var(--slotted-space-4, .5rem) no-repeat local,radial-gradient(farthest-side at 50% 0,color-mix(in oklab,var(--_text) 12%,transparent),transparent) center top / 100% var(--slotted-space-3, .375rem) no-repeat scroll,radial-gradient(farthest-side at 50% 100%,color-mix(in oklab,var(--_text) 12%,transparent),transparent) center bottom / 100% var(--slotted-space-3, .375rem) no-repeat scroll}[data-ui-tour] [data-part-content]>[data-part-footer]{display:flex;flex:none;flex-direction:row-reverse;flex-wrap:wrap-reverse;align-items:center;justify-content:flex-start;gap:var(--_row-gap);padding-block:var(--_inset-block);padding-inline:var(--_inset-inline)}[data-ui-tour] [data-part-content]>[data-part-footer]>[data-part-next]{order:1}[data-ui-tour] [data-part-content]>[data-part-footer]>[data-part-prev]{order:2}[data-ui-tour] [data-part-content]>[data-part-footer]>[data-part-skip]{order:3;margin-inline-end:auto;margin-inline-start:calc(-1 * var(--slotted-control-padding-inline-sm, 10px))}[data-ui-tour]>[data-part-surface]>[data-part-arrow]{--_arrow-min: calc(var(--_gap) + var(--_radius));--_arrow-max-x: calc(100% - var(--_gap) - var(--_radius) - var(--_arrow-size));--_arrow-x: clamp( var(--_arrow-min), var(--slotted-positioner-arrow-x, 0px), var(--_arrow-max-x) );--_arrow-y: clamp( var(--_arrow-min), var(--slotted-positioner-arrow-y, 0px), calc(100% - var(--_gap) - var(--_radius) - var(--_arrow-size)) );position:absolute;z-index:1;inline-size:var(--_arrow-size);block-size:var(--_arrow-size);rotate:45deg;background:var(--_surface);border:0 solid var(--_border-color)}[data-ui-tour]>[data-part-surface][data-side=top]>[data-part-arrow]{left:var(--_arrow-x);top:auto;bottom:calc(var(--_gap) - var(--_arrow-size) / 2);border-right-width:var(--_border-width);border-bottom-width:var(--_border-width);border-bottom-right-radius:var(--_arrow-tip-radius)}[data-ui-tour]>[data-part-surface][data-side=bottom]>[data-part-arrow]{left:var(--_arrow-x);top:calc(var(--_gap) - var(--_arrow-size) / 2);bottom:auto;border-top-width:var(--_border-width);border-left-width:var(--_border-width);border-top-left-radius:var(--_arrow-tip-radius)}[data-ui-tour]>[data-part-surface][data-side=left]>[data-part-arrow]{top:var(--_arrow-y);left:auto;right:calc(var(--_gap) - var(--_arrow-size) / 2);border-top-width:var(--_border-width);border-right-width:var(--_border-width);border-top-right-radius:var(--_arrow-tip-radius)}[data-ui-tour]>[data-part-surface][data-side=right]>[data-part-arrow]{top:var(--_arrow-y);left:calc(var(--_gap) - var(--_arrow-size) / 2);right:auto;border-bottom-width:var(--_border-width);border-left-width:var(--_border-width);border-bottom-left-radius:var(--_arrow-tip-radius)}[data-ui-tour]>[data-part-surface]:has(>[data-part-content]:focus-visible)>[data-part-arrow]{--_border-width: var(--slotted-focus-ring-width, 2px);border-color:var(--slotted-focus-ring-color, currentColor)}[data-ui-tour] [data-part-content] [data-part][hidden]{display:none}@media(forced-colors:active){[data-ui-tour]>[data-part-backdrop]>[data-part-spotlight]{outline:var(--slotted-focus-ring-width, 2px) solid Highlight}[data-ui-tour][data-spotlight]>[data-part-backdrop]{background:transparent}}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
1319
1344
|
}
|
|
1320
1345
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.1.7", ngImport: i0, type: SlTour, decorators: [{
|
|
1321
1346
|
type: Component,
|
|
1322
|
-
args: [{ selector: 'sl-tour', standalone: true, exportAs: 'slTour', imports: [SlTourFrame], providers: [{ provide: SL_TOUR, useExisting: forwardRef(() => SlTour) }], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: `<ng-container #outlet></ng-container>`, styles: ["@layer slotted.components{[data-ui=tour]{--_scrim: var(--slotted-tour-scrim, var(--slotted-scrim, Canvas));--_spotlight-padding: var(--slotted-tour-spotlight-padding, var(--slotted-space-3, .375rem));--_spotlight-radius: var(--slotted-tour-spotlight-radius, var(--slotted-radius-md, 6px));--_gap: var( --slotted-tour-gap, calc(var(--_spotlight-padding) + var(--slotted-space-4, .5rem)) );--_surface: var(--slotted-tour-surface, var(--slotted-surface-raised, #ffffff));--_text: var(--slotted-tour-text, var(--slotted-text, #0f172a));--_border-color: var(--slotted-tour-border-color, var(--slotted-border-subtle, #e2e8f0));--_border-width: var(--slotted-border-width-thin, 1px);--_radius: var(--slotted-tour-radius, var(--slotted-radius-lg, 8px));--_shadow: var(--slotted-tour-shadow, var(--slotted-shadow-lg));--_arrow-size: var(--slotted-tour-arrow-size, .625rem);--_arrow-tip-radius: var(--slotted-tour-arrow-tip-radius, var(--slotted-radius-xs, 2px));--_inset-block: var(--slotted-tour-padding-block, var(--slotted-space-6, 1rem));--_inset-inline: var(--slotted-tour-padding-inline, var(--slotted-space-6, 1rem));--_row-gap: var(--slotted-control-gap-md, .5rem);--_title-font-size: var(--slotted-font-size-lg, 1rem);--_font-size: var(--slotted-font-size-md, .875rem);--_measure: var(--slotted-tour-measure, 20rem);position:fixed;inset:0;z-index:calc(var(--slotted-z-index-overlay, 1000) + var(--slotted-layer-depth, 0));isolation:isolate;overflow:clip;pointer-events:none;visibility:hidden;transition:visibility var(--slotted-duration-short) var(--slotted-easing-exit)}[data-ui=tour][data-open]{visibility:visible;transition:none}[data-ui=tour][data-size=sm]{--_inset-block: var(--slotted-tour-padding-block-sm, var(--slotted-space-5, .75rem));--_inset-inline: var(--slotted-tour-padding-inline-sm, var(--slotted-space-5, .75rem));--_title-font-size: var(--slotted-font-size-md, .875rem);--_font-size: var(--slotted-font-size-sm, .8125rem);--_measure: var(--slotted-tour-measure-sm, 16rem)}[data-ui=tour][data-size=lg]{--_inset-block: var(--slotted-tour-padding-block-lg, var(--slotted-space-7, 1.25rem));--_inset-inline: var(--slotted-tour-padding-inline-lg, var(--slotted-space-7, 1.25rem));--_title-font-size: var(--slotted-font-size-xl, 1.125rem);--_measure: var(--slotted-tour-measure-lg, 24rem)}[data-ui=tour]>[data-part=backdrop]{position:absolute;inset:0;overflow:clip;background:var(--_scrim);opacity:0;transition:opacity var(--slotted-duration-short) var(--slotted-easing-exit)}[data-ui=tour][data-open]>[data-part=backdrop]{opacity:1;transition:opacity var(--slotted-duration-long) var(--slotted-easing-standard)}[data-ui=tour][data-spotlight]>[data-part=backdrop]{background:transparent}[data-ui=tour][data-modal]>[data-part=backdrop]{pointer-events:auto}[data-ui=tour]>[data-part=backdrop]>[data-part=spotlight]{position:absolute;left:calc(var(--slotted-tour-target-x, 0px) - var(--_spotlight-padding));top:calc(var(--slotted-tour-target-y, 0px) - var(--_spotlight-padding));width:calc(var(--slotted-tour-target-width, 0px) + 2 * var(--_spotlight-padding));height:calc(var(--slotted-tour-target-height, 0px) + 2 * var(--_spotlight-padding));border-radius:var(--_spotlight-radius);box-shadow:0 0 0 200vmax var(--_scrim);background-color:transparent}[data-ui=tour][data-spot=travel]>[data-part=backdrop]>[data-part=spotlight]{transition-property:left,top,width,height;transition-duration:var(--slotted-duration-long);transition-timing-function:var(--slotted-easing-standard)}[data-ui=tour][data-spot=light]>[data-part=backdrop]>[data-part=spotlight]{animation:slotted-tour-light var(--slotted-duration-long) var(--slotted-easing-standard)}[data-ui=tour][data-spot=close]>[data-part=backdrop]>[data-part=spotlight]{background-color:var(--_scrim);transition:background-color var(--slotted-duration-long) var(--slotted-easing-standard)}@keyframes slotted-tour-light{0%{background-color:var(--_scrim)}}[data-ui=tour]>[data-part=surface]{position:absolute;inset-block-start:0;box-sizing:border-box;padding:var(--_gap);inline-size:max-content;max-inline-size:min(var(--_measure),var(--slotted-positioner-available-width, 100vw));pointer-events:none;opacity:0;transition:opacity var(--slotted-duration-short) var(--slotted-easing-exit)}[data-ui=tour][data-open]>[data-part=surface][data-ready]:not([data-leaving]){opacity:1;transition:opacity var(--slotted-duration-long) var(--slotted-easing-standard)}[data-ui=tour]>[data-part=surface][data-detached]{visibility:hidden}[data-ui=tour]>[data-part=surface][data-placement=centered]{inset:0;margin:auto;block-size:max-content;max-inline-size:min(var(--_measure),100%);max-block-size:100%}@supports (inset: env(safe-area-inset-top)){[data-ui=tour]>[data-part=surface][data-placement=centered]{inset:env(safe-area-inset-top,0) env(safe-area-inset-right,0) env(safe-area-inset-bottom,0) env(safe-area-inset-left,0)}}[data-ui=tour][data-compact]>[data-part=surface][data-placement=anchored]{--_compact-measure: var(--slotted-tour-measure-compact, 32rem);inline-size:min(var(--slotted-positioner-available-width, 100vw),var(--_compact-measure));max-inline-size:min(var(--slotted-positioner-available-width, 100vw),var(--_compact-measure))}[data-ui=tour]>[data-part=surface][data-placement=centered]>[data-part=arrow]{display:none}[data-ui=tour]>[data-part=surface]>[data-part=focus-guard]{position:absolute;inline-size:1px;block-size:1px;padding:0;overflow:hidden;opacity:0;outline:none;pointer-events:none}[data-ui=tour]>[data-part=surface]>[data-part=content]{box-sizing:border-box;display:flex;flex-direction:column;max-inline-size:100%;max-block-size:calc(var(--slotted-positioner-available-height, 100vh) - 2 * var(--_gap));border:var(--_border-width) solid var(--_border-color);border-radius:var(--_radius);background:var(--_surface);color:var(--_text);box-shadow:var(--_shadow);overflow:clip;font-family:var(--slotted-font-family-sans, ui-sans-serif, system-ui, sans-serif);font-size:var(--_font-size);line-height:var(--slotted-line-height-md, 1.5);text-align:start;pointer-events:auto;outline:none}[data-ui=tour]>[data-part=surface][data-placement=centered]>[data-part=content]{max-block-size:calc(100vh - 2 * var(--_gap))}[data-ui=tour]>[data-part=surface]>[data-part=content]:focus-visible{outline:var(--slotted-focus-ring-width, 2px) solid var(--slotted-focus-ring-color, currentColor);outline-offset:calc(-1 * var(--slotted-focus-ring-width, 2px))}[data-ui=tour] [data-part=content]>[data-part=media]{display:block;flex:none;inline-size:100%;max-inline-size:100%;block-size:auto;object-fit:cover;border-block-end:var(--_border-width) solid var(--_border-color)}[data-ui=tour] [data-part=content]>[data-part=media]>:is(img,video,svg){display:block;inline-size:100%;block-size:auto}[data-ui=tour] [data-part=content]>[data-part=header]{display:flex;flex:none;align-items:flex-start;gap:var(--_row-gap);min-block-size:var(--slotted-control-height-sm, 30px);padding-block-start:calc(var(--_inset-block) - var(--slotted-space-3, .375rem));padding-inline:var(--_inset-inline) calc(var(--_inset-inline) - var(--slotted-space-3, .375rem))}[data-ui=tour] [data-part=content]>[data-part=header]>[data-part=progress]{flex:1 1 auto;min-inline-size:0;margin:0;font-size:var(--slotted-font-size-xs, .75rem);font-weight:var(--slotted-font-weight-medium, 500);line-height:var(--slotted-line-height-xs, 1.4);color:var(--slotted-text-muted, #5b6b7f);font-variant-numeric:tabular-nums;padding-block:calc((var(--slotted-control-height-sm, 30px) - 1lh) / 2);unicode-bidi:plaintext}[data-ui=tour] [data-part=content]>[data-part=header]>[data-part=close]{flex:none;display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;inline-size:var(--slotted-control-height-sm, 30px);block-size:var(--slotted-control-height-sm, 30px);margin-inline-start:auto;padding:0;border:0;border-radius:var(--slotted-control-radius, var(--slotted-radius-sm, 4px));background:transparent;color:var(--slotted-text-muted, #5b6b7f);cursor:pointer;transition:background-color var(--slotted-control-transition-duration, var(--slotted-duration-short)) var(--slotted-control-transition-easing, var(--slotted-easing-standard)),color var(--slotted-control-transition-duration, var(--slotted-duration-short)) var(--slotted-control-transition-easing, var(--slotted-easing-standard))}[data-ui=tour] [data-part=content]>[data-part=header]>[data-part=close]:enabled:hover{background:var(--slotted-tone-secondary-subtle-hover, rgb(15 23 42 / .06));color:var(--_text)}[data-ui=tour] [data-part=content]>[data-part=header]>[data-part=close]:enabled:active{background:var(--slotted-tone-secondary-subtle-active, rgb(15 23 42 / .1))}[data-ui=tour] [data-part=content]>[data-part=header]>[data-part=close]:focus-visible{outline:var(--slotted-focus-ring-width, 2px) solid var(--slotted-focus-ring-color, currentColor);outline-offset:calc(-1 * var(--slotted-focus-ring-width, 2px))}[data-ui=tour] [data-part=content]>[data-part=title]{flex:none;margin:0;padding-inline:var(--_inset-inline);padding-block-start:var(--slotted-space-2, .25rem);font-family:var( --slotted-font-family-heading, var(--slotted-font-family-sans, ui-sans-serif, system-ui, sans-serif) );font-size:var(--_title-font-size);font-weight:var(--slotted-font-weight-semibold, 600);line-height:var(--slotted-line-height-lg, 1.5);color:var(--_text);overflow-wrap:anywhere;unicode-bidi:plaintext}[data-ui=tour] [data-part=content]>[data-part=title]:first-child,[data-ui=tour] [data-part=content]>[data-part=media]+[data-part=title]{padding-block-start:var(--_inset-block)}[data-ui=tour] [data-part=content]>[data-part=description]{flex:none;margin:0;padding-inline:var(--_inset-inline);padding-block-start:var(--slotted-space-2, .25rem);color:var(--slotted-text-muted, #5b6b7f);overflow-wrap:anywhere;unicode-bidi:plaintext}[data-ui=tour] [data-part=content]>[data-part=body]{flex:1 1 auto;min-block-size:0;overflow-x:hidden;overflow-y:auto;overflow-inline:hidden;overflow-block:auto;overscroll-behavior:contain;overflow-wrap:anywhere;unicode-bidi:plaintext;margin-block-start:var(--_row-gap);padding-inline:var(--_inset-inline);background:linear-gradient(var(--_surface) 30%,transparent) center top / 100% var(--slotted-space-4, .5rem) no-repeat local,linear-gradient(transparent,var(--_surface) 70%) center bottom / 100% var(--slotted-space-4, .5rem) no-repeat local,radial-gradient(farthest-side at 50% 0,color-mix(in oklab,var(--_text) 12%,transparent),transparent) center top / 100% var(--slotted-space-3, .375rem) no-repeat scroll,radial-gradient(farthest-side at 50% 100%,color-mix(in oklab,var(--_text) 12%,transparent),transparent) center bottom / 100% var(--slotted-space-3, .375rem) no-repeat scroll}[data-ui=tour] [data-part=content]>[data-part=footer]{display:flex;flex:none;flex-direction:row-reverse;flex-wrap:wrap-reverse;align-items:center;justify-content:flex-start;gap:var(--_row-gap);padding-block:var(--_inset-block);padding-inline:var(--_inset-inline)}[data-ui=tour] [data-part=content]>[data-part=footer]>[data-part=next]{order:1}[data-ui=tour] [data-part=content]>[data-part=footer]>[data-part=prev]{order:2}[data-ui=tour] [data-part=content]>[data-part=footer]>[data-part=skip]{order:3;margin-inline-end:auto;margin-inline-start:calc(-1 * var(--slotted-control-padding-inline-sm, 10px))}[data-ui=tour]>[data-part=surface]>[data-part=arrow]{--_arrow-min: calc(var(--_gap) + var(--_radius));--_arrow-max-x: calc(100% - var(--_gap) - var(--_radius) - var(--_arrow-size));--_arrow-x: clamp( var(--_arrow-min), var(--slotted-positioner-arrow-x, 0px), var(--_arrow-max-x) );--_arrow-y: clamp( var(--_arrow-min), var(--slotted-positioner-arrow-y, 0px), calc(100% - var(--_gap) - var(--_radius) - var(--_arrow-size)) );position:absolute;z-index:1;inline-size:var(--_arrow-size);block-size:var(--_arrow-size);rotate:45deg;background:var(--_surface);border:0 solid var(--_border-color)}[data-ui=tour]>[data-part=surface][data-side=top]>[data-part=arrow]{left:var(--_arrow-x);top:auto;bottom:calc(var(--_gap) - var(--_arrow-size) / 2);border-right-width:var(--_border-width);border-bottom-width:var(--_border-width);border-bottom-right-radius:var(--_arrow-tip-radius)}[data-ui=tour]>[data-part=surface][data-side=bottom]>[data-part=arrow]{left:var(--_arrow-x);top:calc(var(--_gap) - var(--_arrow-size) / 2);bottom:auto;border-top-width:var(--_border-width);border-left-width:var(--_border-width);border-top-left-radius:var(--_arrow-tip-radius)}[data-ui=tour]>[data-part=surface][data-side=left]>[data-part=arrow]{top:var(--_arrow-y);left:auto;right:calc(var(--_gap) - var(--_arrow-size) / 2);border-top-width:var(--_border-width);border-right-width:var(--_border-width);border-top-right-radius:var(--_arrow-tip-radius)}[data-ui=tour]>[data-part=surface][data-side=right]>[data-part=arrow]{top:var(--_arrow-y);left:calc(var(--_gap) - var(--_arrow-size) / 2);right:auto;border-bottom-width:var(--_border-width);border-left-width:var(--_border-width);border-bottom-left-radius:var(--_arrow-tip-radius)}[data-ui=tour]>[data-part=surface]:has(>[data-part=content]:focus-visible)>[data-part=arrow]{--_border-width: var(--slotted-focus-ring-width, 2px);border-color:var(--slotted-focus-ring-color, currentColor)}[data-ui=tour] [data-part=content] [data-part][hidden]{display:none}@media(forced-colors:active){[data-ui=tour]>[data-part=backdrop]>[data-part=spotlight]{outline:var(--slotted-focus-ring-width, 2px) solid Highlight}[data-ui=tour][data-spotlight]>[data-part=backdrop]{background:transparent}}}\n"] }]
|
|
1347
|
+
args: [{ selector: 'sl-tour', standalone: true, exportAs: 'slTour', imports: [SlTourFrame], providers: [{ provide: SL_TOUR, useExisting: forwardRef(() => SlTour) }], changeDetection: ChangeDetectionStrategy.OnPush, encapsulation: ViewEncapsulation.None, template: `<ng-container #outlet></ng-container>`, styles: ["@layer slotted.components{[data-ui-tour]{--_scrim: var(--slotted-tour-scrim, var(--slotted-scrim, Canvas));--_spotlight-padding: var(--slotted-tour-spotlight-padding, var(--slotted-space-3, .375rem));--_spotlight-radius: var(--slotted-tour-spotlight-radius, var(--slotted-radius-md, 6px));--_gap: var( --slotted-tour-gap, calc(var(--_spotlight-padding) + var(--slotted-space-4, .5rem)) );--_surface: var(--slotted-tour-surface, var(--slotted-surface-raised, #ffffff));--_text: var(--slotted-tour-text, var(--slotted-text, #0f172a));--_border-color: var(--slotted-tour-border-color, var(--slotted-border-subtle, #e2e8f0));--_border-width: var(--slotted-border-width-thin, 1px);--_radius: var(--slotted-tour-radius, var(--slotted-radius-lg, 8px));--_shadow: var(--slotted-tour-shadow, var(--slotted-shadow-lg));--_arrow-size: var(--slotted-tour-arrow-size, .625rem);--_arrow-tip-radius: var(--slotted-tour-arrow-tip-radius, var(--slotted-radius-xs, 2px));--_inset-block: var(--slotted-tour-padding-block, var(--slotted-space-6, 1rem));--_inset-inline: var(--slotted-tour-padding-inline, var(--slotted-space-6, 1rem));--_row-gap: var(--slotted-control-gap-md, .5rem);--_title-font-size: var(--slotted-font-size-lg, 1rem);--_font-size: var(--slotted-font-size-md, .875rem);--_measure: var(--slotted-tour-measure, 20rem);position:fixed;inset:0;z-index:calc(var(--slotted-z-index-overlay, 1000) + var(--slotted-layer-depth, 0));isolation:isolate;overflow:clip;pointer-events:none;visibility:hidden;transition:visibility var(--slotted-duration-short) var(--slotted-easing-exit)}[data-ui-tour][data-open]{visibility:visible;transition:none}[data-ui-tour][data-size=sm]{--_inset-block: var(--slotted-tour-padding-block-sm, var(--slotted-space-5, .75rem));--_inset-inline: var(--slotted-tour-padding-inline-sm, var(--slotted-space-5, .75rem));--_title-font-size: var(--slotted-font-size-md, .875rem);--_font-size: var(--slotted-font-size-sm, .8125rem);--_measure: var(--slotted-tour-measure-sm, 16rem)}[data-ui-tour][data-size=lg]{--_inset-block: var(--slotted-tour-padding-block-lg, var(--slotted-space-7, 1.25rem));--_inset-inline: var(--slotted-tour-padding-inline-lg, var(--slotted-space-7, 1.25rem));--_title-font-size: var(--slotted-font-size-xl, 1.125rem);--_measure: var(--slotted-tour-measure-lg, 24rem)}[data-ui-tour]>[data-part-backdrop]{position:absolute;inset:0;overflow:clip;background:var(--_scrim);opacity:0;transition:opacity var(--slotted-duration-short) var(--slotted-easing-exit)}[data-ui-tour][data-open]>[data-part-backdrop]{opacity:1;transition:opacity var(--slotted-duration-long) var(--slotted-easing-standard)}[data-ui-tour][data-spotlight]>[data-part-backdrop]{background:transparent}[data-ui-tour][data-modal]>[data-part-backdrop]{pointer-events:auto}[data-ui-tour]>[data-part-backdrop]>[data-part-spotlight]{position:absolute;left:calc(var(--slotted-tour-target-x, 0px) - var(--_spotlight-padding));top:calc(var(--slotted-tour-target-y, 0px) - var(--_spotlight-padding));width:calc(var(--slotted-tour-target-width, 0px) + 2 * var(--_spotlight-padding));height:calc(var(--slotted-tour-target-height, 0px) + 2 * var(--_spotlight-padding));border-radius:var(--_spotlight-radius);box-shadow:0 0 0 200vmax var(--_scrim);background-color:transparent}[data-ui-tour][data-spot=travel]>[data-part-backdrop]>[data-part-spotlight]{transition-property:left,top,width,height;transition-duration:var(--slotted-duration-long);transition-timing-function:var(--slotted-easing-standard)}[data-ui-tour][data-spot=light]>[data-part-backdrop]>[data-part-spotlight]{animation:slotted-tour-light var(--slotted-duration-long) var(--slotted-easing-standard)}[data-ui-tour][data-spot=close]>[data-part-backdrop]>[data-part-spotlight]{background-color:var(--_scrim);transition:background-color var(--slotted-duration-long) var(--slotted-easing-standard)}@keyframes slotted-tour-light{0%{background-color:var(--_scrim)}}[data-ui-tour]>[data-part-surface]{position:absolute;inset-block-start:0;box-sizing:border-box;padding:var(--_gap);inline-size:max-content;max-inline-size:min(var(--_measure),var(--slotted-positioner-available-width, 100vw));pointer-events:none;opacity:0;transition:opacity var(--slotted-duration-short) var(--slotted-easing-exit)}[data-ui-tour][data-open]>[data-part-surface][data-ready]:not([data-leaving]){opacity:1;transition:opacity var(--slotted-duration-long) var(--slotted-easing-standard)}[data-ui-tour]>[data-part-surface][data-detached]{visibility:hidden}[data-ui-tour]>[data-part-surface][data-placement=centered]{inset:0;margin:auto;block-size:max-content;max-inline-size:min(var(--_measure),100%);max-block-size:100%}@supports (inset: env(safe-area-inset-top)){[data-ui-tour]>[data-part-surface][data-placement=centered]{inset:env(safe-area-inset-top,0) env(safe-area-inset-right,0) env(safe-area-inset-bottom,0) env(safe-area-inset-left,0)}}[data-ui-tour][data-compact]>[data-part-surface][data-placement=anchored]{--_compact-measure: var(--slotted-tour-measure-compact, 32rem);inline-size:min(var(--slotted-positioner-available-width, 100vw),var(--_compact-measure));max-inline-size:min(var(--slotted-positioner-available-width, 100vw),var(--_compact-measure))}[data-ui-tour]>[data-part-surface][data-placement=centered]>[data-part-arrow]{display:none}[data-ui-tour]>[data-part-surface]>[data-part-focus-guard]{position:absolute;inline-size:1px;block-size:1px;padding:0;overflow:hidden;opacity:0;outline:none;pointer-events:none}[data-ui-tour]>[data-part-surface]>[data-part-content]{box-sizing:border-box;display:flex;flex-direction:column;max-inline-size:100%;max-block-size:calc(var(--slotted-positioner-available-height, 100vh) - 2 * var(--_gap));border:var(--_border-width) solid var(--_border-color);border-radius:var(--_radius);background:var(--_surface);color:var(--_text);box-shadow:var(--_shadow);overflow:clip;font-family:var(--slotted-font-family-sans, ui-sans-serif, system-ui, sans-serif);font-size:var(--_font-size);line-height:var(--slotted-line-height-md, 1.5);text-align:start;pointer-events:auto;outline:none}[data-ui-tour]>[data-part-surface][data-placement=centered]>[data-part-content]{max-block-size:calc(100vh - 2 * var(--_gap))}[data-ui-tour]>[data-part-surface]>[data-part-content]:focus-visible{outline:var(--slotted-focus-ring-width, 2px) solid var(--slotted-focus-ring-color, currentColor);outline-offset:calc(-1 * var(--slotted-focus-ring-width, 2px))}[data-ui-tour] [data-part-content]>[data-part-media]{display:block;flex:none;inline-size:100%;max-inline-size:100%;block-size:auto;object-fit:cover;border-block-end:var(--_border-width) solid var(--_border-color)}[data-ui-tour] [data-part-content]>[data-part-media]>:is(img,video,svg){display:block;inline-size:100%;block-size:auto}[data-ui-tour] [data-part-content]>[data-part-header]{display:flex;flex:none;align-items:flex-start;gap:var(--_row-gap);min-block-size:var(--slotted-control-height-sm, 30px);padding-block-start:calc(var(--_inset-block) - var(--slotted-space-3, .375rem));padding-inline:var(--_inset-inline) calc(var(--_inset-inline) - var(--slotted-space-3, .375rem))}[data-ui-tour] [data-part-content]>[data-part-header]>[data-part-progress]{flex:1 1 auto;min-inline-size:0;margin:0;font-size:var(--slotted-font-size-xs, .75rem);font-weight:var(--slotted-font-weight-medium, 500);line-height:var(--slotted-line-height-xs, 1.4);color:var(--slotted-text-muted, #5b6b7f);font-variant-numeric:tabular-nums;padding-block:calc((var(--slotted-control-height-sm, 30px) - 1lh) / 2);unicode-bidi:plaintext}[data-ui-tour] [data-part-content]>[data-part-header]>[data-part-close]{flex:none;display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;inline-size:var(--slotted-control-height-sm, 30px);block-size:var(--slotted-control-height-sm, 30px);margin-inline-start:auto;padding:0;border:0;border-radius:var(--slotted-control-radius, var(--slotted-radius-sm, 4px));background:transparent;color:var(--slotted-text-muted, #5b6b7f);cursor:pointer;transition:background-color var(--slotted-control-transition-duration, var(--slotted-duration-short)) var(--slotted-control-transition-easing, var(--slotted-easing-standard)),color var(--slotted-control-transition-duration, var(--slotted-duration-short)) var(--slotted-control-transition-easing, var(--slotted-easing-standard))}[data-ui-tour] [data-part-content]>[data-part-header]>[data-part-close]:enabled:hover{background:var(--slotted-tone-secondary-subtle-hover, rgb(15 23 42 / .06));color:var(--_text)}[data-ui-tour] [data-part-content]>[data-part-header]>[data-part-close]:enabled:active{background:var(--slotted-tone-secondary-subtle-active, rgb(15 23 42 / .1))}[data-ui-tour] [data-part-content]>[data-part-header]>[data-part-close]:focus-visible{outline:var(--slotted-focus-ring-width, 2px) solid var(--slotted-focus-ring-color, currentColor);outline-offset:calc(-1 * var(--slotted-focus-ring-width, 2px))}[data-ui-tour] [data-part-content]>[data-part-title]{flex:none;margin:0;padding-inline:var(--_inset-inline);padding-block-start:var(--slotted-space-2, .25rem);font-family:var( --slotted-font-family-heading, var(--slotted-font-family-sans, ui-sans-serif, system-ui, sans-serif) );font-size:var(--_title-font-size);font-weight:var(--slotted-font-weight-semibold, 600);line-height:var(--slotted-line-height-lg, 1.5);color:var(--_text);overflow-wrap:anywhere;unicode-bidi:plaintext}[data-ui-tour] [data-part-content]>[data-part-title]:first-child,[data-ui-tour] [data-part-content]>[data-part-media]+[data-part-title]{padding-block-start:var(--_inset-block)}[data-ui-tour] [data-part-content]>[data-part-description]{flex:none;margin:0;padding-inline:var(--_inset-inline);padding-block-start:var(--slotted-space-2, .25rem);color:var(--slotted-text-muted, #5b6b7f);overflow-wrap:anywhere;unicode-bidi:plaintext}[data-ui-tour] [data-part-content]>[data-part-body]{flex:1 1 auto;min-block-size:0;overflow-x:hidden;overflow-y:auto;overflow-inline:hidden;overflow-block:auto;overscroll-behavior:contain;overflow-wrap:anywhere;unicode-bidi:plaintext;margin-block-start:var(--_row-gap);padding-inline:var(--_inset-inline);background:linear-gradient(var(--_surface) 30%,transparent) center top / 100% var(--slotted-space-4, .5rem) no-repeat local,linear-gradient(transparent,var(--_surface) 70%) center bottom / 100% var(--slotted-space-4, .5rem) no-repeat local,radial-gradient(farthest-side at 50% 0,color-mix(in oklab,var(--_text) 12%,transparent),transparent) center top / 100% var(--slotted-space-3, .375rem) no-repeat scroll,radial-gradient(farthest-side at 50% 100%,color-mix(in oklab,var(--_text) 12%,transparent),transparent) center bottom / 100% var(--slotted-space-3, .375rem) no-repeat scroll}[data-ui-tour] [data-part-content]>[data-part-footer]{display:flex;flex:none;flex-direction:row-reverse;flex-wrap:wrap-reverse;align-items:center;justify-content:flex-start;gap:var(--_row-gap);padding-block:var(--_inset-block);padding-inline:var(--_inset-inline)}[data-ui-tour] [data-part-content]>[data-part-footer]>[data-part-next]{order:1}[data-ui-tour] [data-part-content]>[data-part-footer]>[data-part-prev]{order:2}[data-ui-tour] [data-part-content]>[data-part-footer]>[data-part-skip]{order:3;margin-inline-end:auto;margin-inline-start:calc(-1 * var(--slotted-control-padding-inline-sm, 10px))}[data-ui-tour]>[data-part-surface]>[data-part-arrow]{--_arrow-min: calc(var(--_gap) + var(--_radius));--_arrow-max-x: calc(100% - var(--_gap) - var(--_radius) - var(--_arrow-size));--_arrow-x: clamp( var(--_arrow-min), var(--slotted-positioner-arrow-x, 0px), var(--_arrow-max-x) );--_arrow-y: clamp( var(--_arrow-min), var(--slotted-positioner-arrow-y, 0px), calc(100% - var(--_gap) - var(--_radius) - var(--_arrow-size)) );position:absolute;z-index:1;inline-size:var(--_arrow-size);block-size:var(--_arrow-size);rotate:45deg;background:var(--_surface);border:0 solid var(--_border-color)}[data-ui-tour]>[data-part-surface][data-side=top]>[data-part-arrow]{left:var(--_arrow-x);top:auto;bottom:calc(var(--_gap) - var(--_arrow-size) / 2);border-right-width:var(--_border-width);border-bottom-width:var(--_border-width);border-bottom-right-radius:var(--_arrow-tip-radius)}[data-ui-tour]>[data-part-surface][data-side=bottom]>[data-part-arrow]{left:var(--_arrow-x);top:calc(var(--_gap) - var(--_arrow-size) / 2);bottom:auto;border-top-width:var(--_border-width);border-left-width:var(--_border-width);border-top-left-radius:var(--_arrow-tip-radius)}[data-ui-tour]>[data-part-surface][data-side=left]>[data-part-arrow]{top:var(--_arrow-y);left:auto;right:calc(var(--_gap) - var(--_arrow-size) / 2);border-top-width:var(--_border-width);border-right-width:var(--_border-width);border-top-right-radius:var(--_arrow-tip-radius)}[data-ui-tour]>[data-part-surface][data-side=right]>[data-part-arrow]{top:var(--_arrow-y);left:calc(var(--_gap) - var(--_arrow-size) / 2);right:auto;border-bottom-width:var(--_border-width);border-left-width:var(--_border-width);border-bottom-left-radius:var(--_arrow-tip-radius)}[data-ui-tour]>[data-part-surface]:has(>[data-part-content]:focus-visible)>[data-part-arrow]{--_border-width: var(--slotted-focus-ring-width, 2px);border-color:var(--slotted-focus-ring-color, currentColor)}[data-ui-tour] [data-part-content] [data-part][hidden]{display:none}@media(forced-colors:active){[data-ui-tour]>[data-part-backdrop]>[data-part-spotlight]{outline:var(--slotted-focus-ring-width, 2px) solid Highlight}[data-ui-tour][data-spotlight]>[data-part-backdrop]{background:transparent}}}\n"] }]
|
|
1323
1348
|
}], ctorParameters: () => [], propDecorators: { steps: [{ type: i0.Input, args: [{ isSignal: true, alias: "steps", required: true }] }], open: [{ type: i0.Input, args: [{ isSignal: true, alias: "open", required: false }] }, { type: i0.Output, args: ["openChange"] }], step: [{ type: i0.Input, args: [{ isSignal: true, alias: "step", required: false }] }, { type: i0.Output, args: ["stepChange"] }], size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], layout: [{ type: i0.Input, args: [{ isSignal: true, alias: "layout", required: false }] }], side: [{ type: i0.Input, args: [{ isSignal: true, alias: "side", required: false }] }], align: [{ type: i0.Input, args: [{ isSignal: true, alias: "align", required: false }] }], missing: [{ type: i0.Input, args: [{ isSignal: true, alias: "missing", required: false }] }], messages: [{ type: i0.Input, args: [{ isSignal: true, alias: "messages", required: false }] }], finalFocus: [{ type: i0.Input, args: [{ isSignal: true, alias: "finalFocus", required: false }] }], arrow: [{ type: i0.Input, args: [{ isSignal: true, alias: "arrow", required: false }] }], modalInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "modal", required: false }] }], spotlight: [{ type: i0.Input, args: [{ isSignal: true, alias: "spotlight", required: false }] }], autoFocus: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoFocus", required: false }] }], closeOnEscape: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnEscape", required: false }] }], closeOnOutsidePress: [{ type: i0.Input, args: [{ isSignal: true, alias: "closeOnOutsidePress", required: false }] }], scrollIntoView: [{ type: i0.Input, args: [{ isSignal: true, alias: "scrollIntoView", required: false }] }], keyboardNavigation: [{ type: i0.Input, args: [{ isSignal: true, alias: "keyboardNavigation", required: false }] }], targetTimeout: [{ type: i0.Input, args: [{ isSignal: true, alias: "targetTimeout", required: false }] }], sideOffset: [{ type: i0.Input, args: [{ isSignal: true, alias: "sideOffset", required: false }] }], alignOffset: [{ type: i0.Input, args: [{ isSignal: true, alias: "alignOffset", required: false }] }], collisionPadding: [{ type: i0.Input, args: [{ isSignal: true, alias: "collisionPadding", required: false }] }], arrowPadding: [{ type: i0.Input, args: [{ isSignal: true, alias: "arrowPadding", required: false }] }], openChangeRequest: [{ type: i0.Output, args: ["openChangeRequest"] }], stepChangeRequest: [{ type: i0.Output, args: ["stepChangeRequest"] }], card: [{ type: i0.ContentChild, args: [i0.forwardRef(() => SlTourCard), { isSignal: true }] }], stepTemplates: [{ type: i0.ContentChildren, args: [i0.forwardRef(() => SlTourStep), { isSignal: true }] }], outlet: [{ type: i0.ViewChild, args: ['outlet', { ...{ read: ViewContainerRef }, isSignal: true }] }] } });
|
|
1324
1349
|
|
|
1325
1350
|
/**
|