@eui/ecl 23.0.0-alpha.3 → 23.0.0-alpha.5
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/docs/changelog.html +77 -0
- package/docs/components/EclAddToCalendarComponent.html +7 -62
- package/docs/components/EclAnimatedNumbersComponent.html +0 -39
- package/docs/components/EclAppComponent.html +12 -72
- package/docs/components/EclBannerComponent.html +46 -46
- package/docs/components/EclBlockquoteComponent.html +6 -1
- package/docs/components/EclCarouselComponent.html +5 -0
- package/docs/components/EclCategoryFilterComponent.html +5 -0
- package/docs/components/EclCategoryFilterItemComponent.html +15 -10
- package/docs/components/EclCheckboxLabelComponent.html +1 -1
- package/docs/components/EclContentItemComponent.html +4 -0
- package/docs/components/EclDateBlockComponent.html +43 -18
- package/docs/components/EclExpandableComponent.html +63 -1
- package/docs/components/EclFeaturedComponent.html +46 -37
- package/docs/components/EclFileComponent.html +19 -14
- package/docs/components/EclFileItemsComponent.html +31 -1
- package/docs/components/EclFormLabelComponent.html +1 -1
- package/docs/components/EclGalleryComponent.html +29 -29
- package/docs/components/EclGalleryItemComponent.html +47 -47
- package/docs/components/EclIconComponent.html +158 -48
- package/docs/components/EclInpageNavigationComponent.html +21 -1
- package/docs/components/EclInpageNavigationItemComponent.html +39 -1
- package/docs/components/EclListIllustrationComponent.html +47 -47
- package/docs/components/EclListIllustrationItemComponent.html +1 -1
- package/docs/components/EclMediaContainerComponent.html +20 -20
- package/docs/components/EclMegaMenuFeaturedComponent.html +6 -1
- package/docs/components/EclMegaMenuInfoComponent.html +11 -1
- package/docs/components/EclMegaMenuItemComponent.html +44 -34
- package/docs/components/EclMegaMenuSubitemComponent.html +46 -31
- package/docs/components/EclMenuItemComponent.html +12 -2
- package/docs/components/EclMenuMegaItemComponent.html +8 -3
- package/docs/components/EclMultiselectComponent.html +56 -56
- package/docs/components/EclMultiselectDropdownComponent.html +1 -1
- package/docs/components/EclMultiselectOptgroupComponent.html +6 -1
- package/docs/components/EclNavigationListItemComponent.html +1 -1
- package/docs/components/EclNotificationComponent.html +32 -1
- package/docs/components/EclPaginationItemComponent.html +84 -59
- package/docs/components/EclRatingFieldComponent.html +98 -2
- package/docs/components/EclSearchFormComponent.html +41 -1
- package/docs/components/EclSelectContainerComponent.html +116 -1
- package/docs/components/EclSiteFooterComponent.html +1 -1
- package/docs/components/EclSiteFooterCoreComponent.html +6 -1
- package/docs/components/EclSiteFooterFixedContentEUComponent.html +16 -1
- package/docs/components/EclSiteFooterRowCommonComponent.html +6 -1
- package/docs/components/EclSiteHeaderComponent.html +27 -27
- package/docs/components/EclSiteHeaderLanguagePopoverComponent.html +96 -86
- package/docs/components/EclSiteHeaderLoginComponent.html +1 -1
- package/docs/components/EclSiteHeaderSearchComponent.html +20 -10
- package/docs/components/EclSocialMediaFollowComponent.html +7 -2
- package/docs/components/EclSocialMediaFollowItemComponent.html +40 -25
- package/docs/components/EclSplashPageLanguageCategoryComponent.html +6 -1
- package/docs/components/EclSplashPageLanguageContainerComponent.html +6 -1
- package/docs/components/EclSplashPageLanguageLinkComponent.html +6 -1
- package/docs/components/EclTabComponent.html +50 -20
- package/docs/components/EclTabsComponent.html +1 -1
- package/docs/components/EclTagComponent.html +6 -1
- package/docs/components/EclTimelineComponent.html +4 -169
- package/docs/components/EclTimelineItemComponent.html +104 -1
- package/docs/directives/EclAccordionDirective.html +9 -99
- package/docs/directives/EclFileTitleDirective.html +5 -0
- package/docs/directives/EclFileUploadDirective.html +120 -0
- package/docs/directives/EclGalleryMediaDirective.html +5 -0
- package/docs/directives/EclMediaContainerIframeDirective.html +9 -11
- package/docs/directives/EclMediaContainerItemDirective.html +5 -0
- package/docs/directives/EclMultiselectOptionDirective.html +20 -10
- package/docs/directives/EclRadioDirective.html +18 -13
- package/docs/directives/EclSelectDirective.html +40 -0
- package/docs/directives/EclSiteFooterListDirective.html +5 -104
- package/docs/directives/EclSiteFooterSectionDirective.html +1 -1
- package/docs/directives/EclSiteFooterTitleDirective.html +29 -0
- package/docs/directives/EclTableHeaderDirective.html +5 -0
- package/docs/directives/EclTextMediaMediaAnchorDirective.html +1 -1
- package/docs/js/search/search_index.js +2 -2
- package/docs/json/EclAddToCalendarComponent.md +1 -1
- package/docs/json/EclBannerComponent.md +7 -7
- package/docs/json/EclCategoryFilterItemComponent.md +1 -1
- package/docs/json/EclDateBlockComponent.md +1 -1
- package/docs/json/EclExpandableComponent.md +2 -0
- package/docs/json/EclFeaturedComponent.md +3 -3
- package/docs/json/EclFileComponent.md +1 -1
- package/docs/json/EclFileItemsComponent.md +1 -0
- package/docs/json/EclGalleryComponent.md +4 -4
- package/docs/json/EclGalleryItemComponent.md +2 -2
- package/docs/json/EclIconComponent.md +4 -4
- package/docs/json/EclInpageNavigationItemComponent.md +1 -0
- package/docs/json/EclListIllustrationComponent.md +3 -3
- package/docs/json/EclMediaContainerComponent.md +1 -1
- package/docs/json/EclMediaContainerIframeDirective.md +2 -2
- package/docs/json/EclMegaMenuItemComponent.md +2 -2
- package/docs/json/EclMegaMenuSubitemComponent.md +3 -3
- package/docs/json/EclMenuItemComponent.md +1 -1
- package/docs/json/EclMenuMegaItemComponent.md +1 -1
- package/docs/json/EclMultiselectComponent.md +3 -3
- package/docs/json/EclMultiselectOptionDirective.md +1 -1
- package/docs/json/EclNavigationListItemComponent.md +1 -1
- package/docs/json/EclNotificationComponent.md +1 -0
- package/docs/json/EclPaginationItemComponent.md +3 -3
- package/docs/json/EclRadioDirective.md +1 -1
- package/docs/json/EclRatingFieldComponent.md +1 -0
- package/docs/json/EclSearchFormComponent.md +1 -0
- package/docs/json/EclSelectContainerComponent.md +6 -0
- package/docs/json/EclSiteFooterSectionDirective.md +1 -1
- package/docs/json/EclSiteHeaderComponent.md +2 -2
- package/docs/json/EclSiteHeaderLanguagePopoverComponent.md +6 -6
- package/docs/json/EclSiteHeaderSearchComponent.md +1 -1
- package/docs/json/EclSocialMediaFollowComponent.md +1 -1
- package/docs/json/EclSocialMediaFollowItemComponent.md +4 -4
- package/docs/json/EclTabComponent.md +2 -1
- package/docs/json/EclTagComponent.md +1 -1
- package/docs/json/EclTextMediaMediaAnchorDirective.md +1 -1
- package/docs/json/EclTimelineItemComponent.md +1 -0
- package/docs/json/documentation.json +4188 -2895
- package/docs/llms.txt +152 -136
- package/docs/properties.html +1 -1
- package/fesm2022/eui-ecl-components-ecl-accordion.mjs +5 -15
- package/fesm2022/eui-ecl-components-ecl-accordion.mjs.map +1 -1
- package/fesm2022/eui-ecl-components-ecl-add-to-calendar.mjs +9 -7
- package/fesm2022/eui-ecl-components-ecl-add-to-calendar.mjs.map +1 -1
- package/fesm2022/eui-ecl-components-ecl-animated-numbers.mjs +2 -2
- package/fesm2022/eui-ecl-components-ecl-animated-numbers.mjs.map +1 -1
- package/fesm2022/eui-ecl-components-ecl-app.mjs +13 -14
- package/fesm2022/eui-ecl-components-ecl-app.mjs.map +1 -1
- package/fesm2022/eui-ecl-components-ecl-banner.mjs +27 -37
- package/fesm2022/eui-ecl-components-ecl-banner.mjs.map +1 -1
- package/fesm2022/eui-ecl-components-ecl-blockquote.mjs +11 -7
- package/fesm2022/eui-ecl-components-ecl-blockquote.mjs.map +1 -1
- package/fesm2022/eui-ecl-components-ecl-card.mjs +7 -10
- package/fesm2022/eui-ecl-components-ecl-card.mjs.map +1 -1
- package/fesm2022/eui-ecl-components-ecl-carousel.mjs +14 -18
- package/fesm2022/eui-ecl-components-ecl-carousel.mjs.map +1 -1
- package/fesm2022/eui-ecl-components-ecl-category-filter.mjs +21 -13
- package/fesm2022/eui-ecl-components-ecl-category-filter.mjs.map +1 -1
- package/fesm2022/eui-ecl-components-ecl-checkbox.mjs +5 -8
- package/fesm2022/eui-ecl-components-ecl-checkbox.mjs.map +1 -1
- package/fesm2022/eui-ecl-components-ecl-content-item.mjs +18 -26
- package/fesm2022/eui-ecl-components-ecl-content-item.mjs.map +1 -1
- package/fesm2022/eui-ecl-components-ecl-date-block.mjs +39 -22
- package/fesm2022/eui-ecl-components-ecl-date-block.mjs.map +1 -1
- package/fesm2022/eui-ecl-components-ecl-expandable.mjs +21 -16
- package/fesm2022/eui-ecl-components-ecl-expandable.mjs.map +1 -1
- package/fesm2022/eui-ecl-components-ecl-featured.mjs +17 -18
- package/fesm2022/eui-ecl-components-ecl-featured.mjs.map +1 -1
- package/fesm2022/eui-ecl-components-ecl-file-upload.mjs +25 -23
- package/fesm2022/eui-ecl-components-ecl-file-upload.mjs.map +1 -1
- package/fesm2022/eui-ecl-components-ecl-file.mjs +27 -20
- package/fesm2022/eui-ecl-components-ecl-file.mjs.map +1 -1
- package/fesm2022/eui-ecl-components-ecl-form-label.mjs +6 -12
- package/fesm2022/eui-ecl-components-ecl-form-label.mjs.map +1 -1
- package/fesm2022/eui-ecl-components-ecl-gallery.mjs +44 -71
- package/fesm2022/eui-ecl-components-ecl-gallery.mjs.map +1 -1
- package/fesm2022/eui-ecl-components-ecl-help-block.mjs +5 -8
- package/fesm2022/eui-ecl-components-ecl-help-block.mjs.map +1 -1
- package/fesm2022/eui-ecl-components-ecl-icon.mjs +50 -39
- package/fesm2022/eui-ecl-components-ecl-icon.mjs.map +1 -1
- package/fesm2022/eui-ecl-components-ecl-inpage-navigation.mjs +38 -32
- package/fesm2022/eui-ecl-components-ecl-inpage-navigation.mjs.map +1 -1
- package/fesm2022/eui-ecl-components-ecl-label.mjs +6 -7
- package/fesm2022/eui-ecl-components-ecl-label.mjs.map +1 -1
- package/fesm2022/eui-ecl-components-ecl-list-illustration.mjs +37 -57
- package/fesm2022/eui-ecl-components-ecl-list-illustration.mjs.map +1 -1
- package/fesm2022/eui-ecl-components-ecl-loading-indicator.mjs +13 -21
- package/fesm2022/eui-ecl-components-ecl-loading-indicator.mjs.map +1 -1
- package/fesm2022/eui-ecl-components-ecl-media-container.mjs +22 -27
- package/fesm2022/eui-ecl-components-ecl-media-container.mjs.map +1 -1
- package/fesm2022/eui-ecl-components-ecl-mega-menu.mjs +67 -73
- package/fesm2022/eui-ecl-components-ecl-mega-menu.mjs.map +1 -1
- package/fesm2022/eui-ecl-components-ecl-menu.mjs +46 -51
- package/fesm2022/eui-ecl-components-ecl-menu.mjs.map +1 -1
- package/fesm2022/eui-ecl-components-ecl-multiselect.mjs +52 -43
- package/fesm2022/eui-ecl-components-ecl-multiselect.mjs.map +1 -1
- package/fesm2022/eui-ecl-components-ecl-navigation-list.mjs +13 -19
- package/fesm2022/eui-ecl-components-ecl-navigation-list.mjs.map +1 -1
- package/fesm2022/eui-ecl-components-ecl-news-ticker.mjs +6 -9
- package/fesm2022/eui-ecl-components-ecl-news-ticker.mjs.map +1 -1
- package/fesm2022/eui-ecl-components-ecl-notification.mjs +19 -21
- package/fesm2022/eui-ecl-components-ecl-notification.mjs.map +1 -1
- package/fesm2022/eui-ecl-components-ecl-page-header.mjs +5 -8
- package/fesm2022/eui-ecl-components-ecl-page-header.mjs.map +1 -1
- package/fesm2022/eui-ecl-components-ecl-pagination.mjs +57 -64
- package/fesm2022/eui-ecl-components-ecl-pagination.mjs.map +1 -1
- package/fesm2022/eui-ecl-components-ecl-radio.mjs +8 -7
- package/fesm2022/eui-ecl-components-ecl-radio.mjs.map +1 -1
- package/fesm2022/eui-ecl-components-ecl-rating-field.mjs +35 -27
- package/fesm2022/eui-ecl-components-ecl-rating-field.mjs.map +1 -1
- package/fesm2022/eui-ecl-components-ecl-search-form.mjs +23 -23
- package/fesm2022/eui-ecl-components-ecl-search-form.mjs.map +1 -1
- package/fesm2022/eui-ecl-components-ecl-select.mjs +31 -40
- package/fesm2022/eui-ecl-components-ecl-select.mjs.map +1 -1
- package/fesm2022/eui-ecl-components-ecl-site-footer.mjs +71 -70
- package/fesm2022/eui-ecl-components-ecl-site-footer.mjs.map +1 -1
- package/fesm2022/eui-ecl-components-ecl-site-header.mjs +44 -55
- package/fesm2022/eui-ecl-components-ecl-site-header.mjs.map +1 -1
- package/fesm2022/eui-ecl-components-ecl-social-media-follow.mjs +27 -36
- package/fesm2022/eui-ecl-components-ecl-social-media-follow.mjs.map +1 -1
- package/fesm2022/eui-ecl-components-ecl-splash-page.mjs +38 -18
- package/fesm2022/eui-ecl-components-ecl-splash-page.mjs.map +1 -1
- package/fesm2022/eui-ecl-components-ecl-sticky-container.mjs +11 -16
- package/fesm2022/eui-ecl-components-ecl-sticky-container.mjs.map +1 -1
- package/fesm2022/eui-ecl-components-ecl-table.mjs +16 -15
- package/fesm2022/eui-ecl-components-ecl-table.mjs.map +1 -1
- package/fesm2022/eui-ecl-components-ecl-tabs.mjs +32 -34
- package/fesm2022/eui-ecl-components-ecl-tabs.mjs.map +1 -1
- package/fesm2022/eui-ecl-components-ecl-tag.mjs +14 -12
- package/fesm2022/eui-ecl-components-ecl-tag.mjs.map +1 -1
- package/fesm2022/eui-ecl-components-ecl-text-area.mjs +9 -12
- package/fesm2022/eui-ecl-components-ecl-text-area.mjs.map +1 -1
- package/fesm2022/eui-ecl-components-ecl-text-input.mjs +15 -19
- package/fesm2022/eui-ecl-components-ecl-text-input.mjs.map +1 -1
- package/fesm2022/eui-ecl-components-ecl-text-media.mjs +5 -8
- package/fesm2022/eui-ecl-components-ecl-text-media.mjs.map +1 -1
- package/fesm2022/eui-ecl-components-ecl-timeline.mjs +40 -59
- package/fesm2022/eui-ecl-components-ecl-timeline.mjs.map +1 -1
- package/fesm2022/eui-ecl-core.mjs.map +1 -1
- package/package.json +8 -3
- package/types/eui-ecl-components-ecl-accordion.d.ts +2 -10
- package/types/eui-ecl-components-ecl-accordion.d.ts.map +1 -1
- package/types/eui-ecl-components-ecl-add-to-calendar.d.ts +4 -1
- package/types/eui-ecl-components-ecl-add-to-calendar.d.ts.map +1 -1
- package/types/eui-ecl-components-ecl-animated-numbers.d.ts +1 -1
- package/types/eui-ecl-components-ecl-animated-numbers.d.ts.map +1 -1
- package/types/eui-ecl-components-ecl-app.d.ts +6 -6
- package/types/eui-ecl-components-ecl-app.d.ts.map +1 -1
- package/types/eui-ecl-components-ecl-banner.d.ts +9 -10
- package/types/eui-ecl-components-ecl-banner.d.ts.map +1 -1
- package/types/eui-ecl-components-ecl-blockquote.d.ts +2 -2
- package/types/eui-ecl-components-ecl-blockquote.d.ts.map +1 -1
- package/types/eui-ecl-components-ecl-card.d.ts +2 -3
- package/types/eui-ecl-components-ecl-card.d.ts.map +1 -1
- package/types/eui-ecl-components-ecl-carousel.d.ts +10 -12
- package/types/eui-ecl-components-ecl-carousel.d.ts.map +1 -1
- package/types/eui-ecl-components-ecl-category-filter.d.ts +4 -4
- package/types/eui-ecl-components-ecl-category-filter.d.ts.map +1 -1
- package/types/eui-ecl-components-ecl-checkbox.d.ts +2 -3
- package/types/eui-ecl-components-ecl-checkbox.d.ts.map +1 -1
- package/types/eui-ecl-components-ecl-content-item.d.ts +8 -10
- package/types/eui-ecl-components-ecl-content-item.d.ts.map +1 -1
- package/types/eui-ecl-components-ecl-date-block.d.ts +10 -10
- package/types/eui-ecl-components-ecl-date-block.d.ts.map +1 -1
- package/types/eui-ecl-components-ecl-expandable.d.ts +7 -8
- package/types/eui-ecl-components-ecl-expandable.d.ts.map +1 -1
- package/types/eui-ecl-components-ecl-featured.d.ts +4 -5
- package/types/eui-ecl-components-ecl-featured.d.ts.map +1 -1
- package/types/eui-ecl-components-ecl-file-upload.d.ts +9 -11
- package/types/eui-ecl-components-ecl-file-upload.d.ts.map +1 -1
- package/types/eui-ecl-components-ecl-file.d.ts +7 -8
- package/types/eui-ecl-components-ecl-file.d.ts.map +1 -1
- package/types/eui-ecl-components-ecl-form-label.d.ts +3 -5
- package/types/eui-ecl-components-ecl-form-label.d.ts.map +1 -1
- package/types/eui-ecl-components-ecl-gallery.d.ts +32 -41
- package/types/eui-ecl-components-ecl-gallery.d.ts.map +1 -1
- package/types/eui-ecl-components-ecl-help-block.d.ts +3 -4
- package/types/eui-ecl-components-ecl-help-block.d.ts.map +1 -1
- package/types/eui-ecl-components-ecl-icon.d.ts +17 -12
- package/types/eui-ecl-components-ecl-icon.d.ts.map +1 -1
- package/types/eui-ecl-components-ecl-inpage-navigation.d.ts +18 -19
- package/types/eui-ecl-components-ecl-inpage-navigation.d.ts.map +1 -1
- package/types/eui-ecl-components-ecl-label.d.ts +3 -3
- package/types/eui-ecl-components-ecl-label.d.ts.map +1 -1
- package/types/eui-ecl-components-ecl-list-illustration.d.ts +25 -30
- package/types/eui-ecl-components-ecl-list-illustration.d.ts.map +1 -1
- package/types/eui-ecl-components-ecl-loading-indicator.d.ts +6 -8
- package/types/eui-ecl-components-ecl-loading-indicator.d.ts.map +1 -1
- package/types/eui-ecl-components-ecl-media-container.d.ts +9 -11
- package/types/eui-ecl-components-ecl-media-container.d.ts.map +1 -1
- package/types/eui-ecl-components-ecl-mega-menu.d.ts +25 -28
- package/types/eui-ecl-components-ecl-mega-menu.d.ts.map +1 -1
- package/types/eui-ecl-components-ecl-menu.d.ts +26 -31
- package/types/eui-ecl-components-ecl-menu.d.ts.map +1 -1
- package/types/eui-ecl-components-ecl-multiselect.d.ts +13 -13
- package/types/eui-ecl-components-ecl-multiselect.d.ts.map +1 -1
- package/types/eui-ecl-components-ecl-navigation-list.d.ts +5 -7
- package/types/eui-ecl-components-ecl-navigation-list.d.ts.map +1 -1
- package/types/eui-ecl-components-ecl-news-ticker.d.ts +2 -3
- package/types/eui-ecl-components-ecl-news-ticker.d.ts.map +1 -1
- package/types/eui-ecl-components-ecl-notification.d.ts +17 -19
- package/types/eui-ecl-components-ecl-notification.d.ts.map +1 -1
- package/types/eui-ecl-components-ecl-page-header.d.ts +2 -3
- package/types/eui-ecl-components-ecl-page-header.d.ts.map +1 -1
- package/types/eui-ecl-components-ecl-pagination.d.ts +22 -29
- package/types/eui-ecl-components-ecl-pagination.d.ts.map +1 -1
- package/types/eui-ecl-components-ecl-radio.d.ts +2 -3
- package/types/eui-ecl-components-ecl-radio.d.ts.map +1 -1
- package/types/eui-ecl-components-ecl-rating-field.d.ts +12 -12
- package/types/eui-ecl-components-ecl-rating-field.d.ts.map +1 -1
- package/types/eui-ecl-components-ecl-search-form.d.ts +10 -10
- package/types/eui-ecl-components-ecl-search-form.d.ts.map +1 -1
- package/types/eui-ecl-components-ecl-select.d.ts +13 -17
- package/types/eui-ecl-components-ecl-select.d.ts.map +1 -1
- package/types/eui-ecl-components-ecl-site-footer.d.ts +22 -27
- package/types/eui-ecl-components-ecl-site-footer.d.ts.map +1 -1
- package/types/eui-ecl-components-ecl-site-header.d.ts +16 -18
- package/types/eui-ecl-components-ecl-site-header.d.ts.map +1 -1
- package/types/eui-ecl-components-ecl-social-media-follow.d.ts +21 -23
- package/types/eui-ecl-components-ecl-social-media-follow.d.ts.map +1 -1
- package/types/eui-ecl-components-ecl-splash-page.d.ts +6 -6
- package/types/eui-ecl-components-ecl-splash-page.d.ts.map +1 -1
- package/types/eui-ecl-components-ecl-sticky-container.d.ts +6 -7
- package/types/eui-ecl-components-ecl-sticky-container.d.ts.map +1 -1
- package/types/eui-ecl-components-ecl-table.d.ts +4 -5
- package/types/eui-ecl-components-ecl-table.d.ts.map +1 -1
- package/types/eui-ecl-components-ecl-tabs.d.ts +5 -6
- package/types/eui-ecl-components-ecl-tabs.d.ts.map +1 -1
- package/types/eui-ecl-components-ecl-tag.d.ts +3 -4
- package/types/eui-ecl-components-ecl-tag.d.ts.map +1 -1
- package/types/eui-ecl-components-ecl-text-area.d.ts +5 -6
- package/types/eui-ecl-components-ecl-text-area.d.ts.map +1 -1
- package/types/eui-ecl-components-ecl-text-input.d.ts +6 -7
- package/types/eui-ecl-components-ecl-text-input.d.ts.map +1 -1
- package/types/eui-ecl-components-ecl-text-media.d.ts +2 -2
- package/types/eui-ecl-components-ecl-text-media.d.ts.map +1 -1
- package/types/eui-ecl-components-ecl-timeline.d.ts +8 -17
- package/types/eui-ecl-components-ecl-timeline.d.ts.map +1 -1
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { HostBinding, Directive, booleanAttribute, ContentChild, forwardRef,
|
|
2
|
+
import { HostBinding, Directive, input, booleanAttribute, ContentChild, forwardRef, signal, computed, Component, numberAttribute, inject, afterNextRender, effect, ContentChildren } from '@angular/core';
|
|
3
3
|
import { ECLBaseDirective } from '@eui/ecl/core';
|
|
4
4
|
import { BreakpointObserver } from '@angular/cdk/layout';
|
|
5
5
|
|
|
@@ -40,31 +40,28 @@ class EclListIllustrationPictureDirective extends ECLBaseDirective {
|
|
|
40
40
|
/**
|
|
41
41
|
* If true, image is styled with square dimensions.
|
|
42
42
|
*/
|
|
43
|
-
this.isSquare = false;
|
|
43
|
+
this.isSquare = input(false, { ...(ngDevMode ? { debugName: "isSquare" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
44
44
|
}
|
|
45
45
|
/**
|
|
46
46
|
* Applies the base ECL picture classes for list illustration pictures.
|
|
47
47
|
*/
|
|
48
48
|
get cssClasses() {
|
|
49
49
|
return [super.getCssClasses('ecl-picture ecl-list-illustration__picture'),
|
|
50
|
-
this.isSquare ? 'ecl-list-illustration__picture--square' : '',
|
|
50
|
+
this.isSquare() ? 'ecl-list-illustration__picture--square' : '',
|
|
51
51
|
].join(' ').trim();
|
|
52
52
|
}
|
|
53
53
|
ngAfterContentInit() {
|
|
54
|
-
this.eclIllustrationImage.isSquare = this.isSquare;
|
|
54
|
+
this.eclIllustrationImage.isSquare = this.isSquare();
|
|
55
55
|
}
|
|
56
56
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclListIllustrationPictureDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
|
|
57
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "
|
|
57
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.5", type: EclListIllustrationPictureDirective, isStandalone: true, selector: "picture[eclListIllustrationPicture]", inputs: { isSquare: { classPropertyName: "isSquare", publicName: "isSquare", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "this.cssClasses" } }, queries: [{ propertyName: "eclIllustrationImage", first: true, predicate: i0.forwardRef(() => EclListIllustrationImageDirective), descendants: true }], usesInheritance: true, ngImport: i0 }); }
|
|
58
58
|
}
|
|
59
59
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclListIllustrationPictureDirective, decorators: [{
|
|
60
60
|
type: Directive,
|
|
61
61
|
args: [{
|
|
62
62
|
selector: 'picture[eclListIllustrationPicture]',
|
|
63
63
|
}]
|
|
64
|
-
}], propDecorators: { isSquare: [{
|
|
65
|
-
type: Input,
|
|
66
|
-
args: [{ transform: booleanAttribute }]
|
|
67
|
-
}], eclIllustrationImage: [{
|
|
64
|
+
}], propDecorators: { isSquare: [{ type: i0.Input, args: [{ isSignal: true, alias: "isSquare", required: false }] }], eclIllustrationImage: [{
|
|
68
65
|
type: ContentChild,
|
|
69
66
|
args: [forwardRef(() => EclListIllustrationImageDirective)]
|
|
70
67
|
}], cssClasses: [{
|
|
@@ -87,7 +84,8 @@ class EclListIllustrationImageDirective extends ECLBaseDirective {
|
|
|
87
84
|
* Defines the size variant of the image.
|
|
88
85
|
* Possible values: `'s'`, `'m'`, `'l'`.
|
|
89
86
|
*/
|
|
90
|
-
this.size = 'm'
|
|
87
|
+
this.size = input('m', /* @ts-ignore */
|
|
88
|
+
...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
91
89
|
}
|
|
92
90
|
/**
|
|
93
91
|
* Computes the appropriate ECL CSS classes for the image.
|
|
@@ -96,22 +94,20 @@ class EclListIllustrationImageDirective extends ECLBaseDirective {
|
|
|
96
94
|
return [
|
|
97
95
|
super.getCssClasses('ecl-list-illustration__image'),
|
|
98
96
|
this.isSquare ? 'ecl-list-illustration__image--square' : '',
|
|
99
|
-
this.isSquare ? `ecl-list-illustration__image--${this.size}` : '',
|
|
97
|
+
this.isSquare ? `ecl-list-illustration__image--${this.size()}` : '',
|
|
100
98
|
]
|
|
101
99
|
.join(' ')
|
|
102
100
|
.trim();
|
|
103
101
|
}
|
|
104
102
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclListIllustrationImageDirective, deps: null, target: i0.ɵɵFactoryTarget.Directive }); }
|
|
105
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "
|
|
103
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.1.0", version: "22.0.5", type: EclListIllustrationImageDirective, isStandalone: true, selector: "img[eclListIllustrationImage]", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0 }); }
|
|
106
104
|
}
|
|
107
105
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclListIllustrationImageDirective, decorators: [{
|
|
108
106
|
type: Directive,
|
|
109
107
|
args: [{
|
|
110
108
|
selector: 'img[eclListIllustrationImage]',
|
|
111
109
|
}]
|
|
112
|
-
}], propDecorators: { size: [{
|
|
113
|
-
type: Input
|
|
114
|
-
}], cssClasses: [{
|
|
110
|
+
}], propDecorators: { size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], cssClasses: [{
|
|
115
111
|
type: HostBinding,
|
|
116
112
|
args: ['class']
|
|
117
113
|
}] } });
|
|
@@ -127,11 +123,13 @@ class EclListIllustrationItemComponent extends ECLBaseDirective {
|
|
|
127
123
|
/**
|
|
128
124
|
* Text displayed as the item title.
|
|
129
125
|
*/
|
|
130
|
-
this.eclTitle = ''
|
|
126
|
+
this.eclTitle = input('', /* @ts-ignore */
|
|
127
|
+
...(ngDevMode ? [{ debugName: "eclTitle" }] : /* istanbul ignore next */ []));
|
|
131
128
|
/**
|
|
132
129
|
* Text displayed as the item value.
|
|
133
130
|
*/
|
|
134
|
-
this.eclValue = ''
|
|
131
|
+
this.eclValue = input('', /* @ts-ignore */
|
|
132
|
+
...(ngDevMode ? [{ debugName: "eclValue" }] : /* istanbul ignore next */ []));
|
|
135
133
|
/**
|
|
136
134
|
* Applies ARIA role for list items.
|
|
137
135
|
*/
|
|
@@ -153,25 +151,21 @@ class EclListIllustrationItemComponent extends ECLBaseDirective {
|
|
|
153
151
|
* Returns `true` if the item has a title or any projected icons.
|
|
154
152
|
*/
|
|
155
153
|
get hasTitle() {
|
|
156
|
-
return Boolean(this.eclTitle) || this.eclIllustrationIcon !== undefined;
|
|
154
|
+
return Boolean(this.eclTitle()) || this.eclIllustrationIcon !== undefined;
|
|
157
155
|
}
|
|
158
156
|
/**
|
|
159
157
|
* Returns `true` if the item has a value.
|
|
160
158
|
*/
|
|
161
159
|
get hasValue() {
|
|
162
|
-
return Boolean(this.eclValue);
|
|
160
|
+
return Boolean(this.eclValue());
|
|
163
161
|
}
|
|
164
162
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclListIllustrationItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
165
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: EclListIllustrationItemComponent, isStandalone: true, selector: "ecl-list-illustration-item, li[eclListIllustrationItem]", inputs: { eclTitle: "eclTitle", eclValue: "eclValue" }, host: { properties: { "attr.role": "this.role", "class.ecl-list-illustration__item": "this.className" } }, queries: [{ propertyName: "eclIllustrationIcon", first: true, predicate: i0.forwardRef(() => EclListIllustrationIconDirective), descendants: true }, { propertyName: "eclIllustrationPicture", first: true, predicate: i0.forwardRef(() => EclListIllustrationPictureDirective), descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"ecl-list-illustration__item-content\" [class.ecl-list-illustration__item-content--row]=\"isVerticalPicture()\"\n [class.ecl-list-illustration__divider]=\"hasDivider()\">\n <ng-content select=\"[eclListIllustrationImage],[eclListIllustrationPicture],[eclListIllustrationIcon]\"></ng-content>\n <div class=\"ecl-list-illustration__detail\">\n @if (hasTitle || hasValue) {\n <div class=\"ecl-list-illustration__title-container\">\n @if (hasValue) {\n <div class=\"ecl-list-illustration__value\">{{ eclValue }}</div>\n }\n <div class=\"ecl-list-illustration__title\">{{ eclTitle }}</div>\n </div>\n }\n\n <div class=\"ecl-list-illustration__description\">\n <ng-content></ng-content>\n </div>\n </div>\n</div>" }); }
|
|
163
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.5", type: EclListIllustrationItemComponent, isStandalone: true, selector: "ecl-list-illustration-item, li[eclListIllustrationItem]", inputs: { eclTitle: { classPropertyName: "eclTitle", publicName: "eclTitle", isSignal: true, isRequired: false, transformFunction: null }, eclValue: { classPropertyName: "eclValue", publicName: "eclValue", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.role": "this.role", "class.ecl-list-illustration__item": "this.className" } }, queries: [{ propertyName: "eclIllustrationIcon", first: true, predicate: i0.forwardRef(() => EclListIllustrationIconDirective), descendants: true }, { propertyName: "eclIllustrationPicture", first: true, predicate: i0.forwardRef(() => EclListIllustrationPictureDirective), descendants: true }], usesInheritance: true, ngImport: i0, template: "<div class=\"ecl-list-illustration__item-content\" [class.ecl-list-illustration__item-content--row]=\"isVerticalPicture()\"\n [class.ecl-list-illustration__divider]=\"hasDivider()\">\n <ng-content select=\"[eclListIllustrationImage],[eclListIllustrationPicture],[eclListIllustrationIcon]\"></ng-content>\n <div class=\"ecl-list-illustration__detail\">\n @if (hasTitle || hasValue) {\n <div class=\"ecl-list-illustration__title-container\">\n @if (hasValue) {\n <div class=\"ecl-list-illustration__value\">{{ eclValue() }}</div>\n }\n <div class=\"ecl-list-illustration__title\">{{ eclTitle() }}</div>\n </div>\n }\n\n <div class=\"ecl-list-illustration__description\">\n <ng-content></ng-content>\n </div>\n </div>\n</div>" }); }
|
|
166
164
|
}
|
|
167
165
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclListIllustrationItemComponent, decorators: [{
|
|
168
166
|
type: Component,
|
|
169
|
-
args: [{ selector: 'ecl-list-illustration-item, li[eclListIllustrationItem]', template: "<div class=\"ecl-list-illustration__item-content\" [class.ecl-list-illustration__item-content--row]=\"isVerticalPicture()\"\n [class.ecl-list-illustration__divider]=\"hasDivider()\">\n <ng-content select=\"[eclListIllustrationImage],[eclListIllustrationPicture],[eclListIllustrationIcon]\"></ng-content>\n <div class=\"ecl-list-illustration__detail\">\n @if (hasTitle || hasValue) {\n <div class=\"ecl-list-illustration__title-container\">\n @if (hasValue) {\n <div class=\"ecl-list-illustration__value\">{{ eclValue }}</div>\n }\n <div class=\"ecl-list-illustration__title\">{{ eclTitle }}</div>\n </div>\n }\n\n <div class=\"ecl-list-illustration__description\">\n <ng-content></ng-content>\n </div>\n </div>\n</div>" }]
|
|
170
|
-
}], propDecorators: { eclTitle: [{
|
|
171
|
-
type: Input
|
|
172
|
-
}], eclValue: [{
|
|
173
|
-
type: Input
|
|
174
|
-
}], role: [{
|
|
167
|
+
args: [{ selector: 'ecl-list-illustration-item, li[eclListIllustrationItem]', template: "<div class=\"ecl-list-illustration__item-content\" [class.ecl-list-illustration__item-content--row]=\"isVerticalPicture()\"\n [class.ecl-list-illustration__divider]=\"hasDivider()\">\n <ng-content select=\"[eclListIllustrationImage],[eclListIllustrationPicture],[eclListIllustrationIcon]\"></ng-content>\n <div class=\"ecl-list-illustration__detail\">\n @if (hasTitle || hasValue) {\n <div class=\"ecl-list-illustration__title-container\">\n @if (hasValue) {\n <div class=\"ecl-list-illustration__value\">{{ eclValue() }}</div>\n }\n <div class=\"ecl-list-illustration__title\">{{ eclTitle() }}</div>\n </div>\n }\n\n <div class=\"ecl-list-illustration__description\">\n <ng-content></ng-content>\n </div>\n </div>\n</div>" }]
|
|
168
|
+
}], propDecorators: { eclTitle: [{ type: i0.Input, args: [{ isSignal: true, alias: "eclTitle", required: false }] }], eclValue: [{ type: i0.Input, args: [{ isSignal: true, alias: "eclValue", required: false }] }], role: [{
|
|
175
169
|
type: HostBinding,
|
|
176
170
|
args: ['attr.role']
|
|
177
171
|
}], className: [{
|
|
@@ -197,13 +191,13 @@ class EclListIllustrationComponent extends ECLBaseDirective {
|
|
|
197
191
|
get cssClasses() {
|
|
198
192
|
return [
|
|
199
193
|
super.getCssClasses('ecl-list-illustration'),
|
|
200
|
-
this.isZebra ? 'ecl-list-illustration--zebra' : '',
|
|
194
|
+
this.isZebra() ? 'ecl-list-illustration--zebra' : '',
|
|
201
195
|
this.horizontalColumns() > 0 ? `ecl-list-illustration--col-${this.horizontalColumns()}` : '',
|
|
202
|
-
this.fontSize === 'm' ? 'ecl-list-illustration--font-m' : '',
|
|
203
|
-
this.isCentered ? 'ecl-list-illustration--centered' : '',
|
|
204
|
-
this.isIconInline ? 'ecl-list-illustration--icon-inline' : '',
|
|
205
|
-
this.variant === 'icon-list' ? 'ecl-list-illustration--icon-list' : '',
|
|
206
|
-
this.variant === 'number-list' ? 'ecl-list-illustration--number-list ecl-list-illustration--number-list-reset' : '',
|
|
196
|
+
this.fontSize() === 'm' ? 'ecl-list-illustration--font-m' : '',
|
|
197
|
+
this.isCentered() ? 'ecl-list-illustration--centered' : '',
|
|
198
|
+
this.isIconInline() ? 'ecl-list-illustration--icon-inline' : '',
|
|
199
|
+
this.variant() === 'icon-list' ? 'ecl-list-illustration--icon-list' : '',
|
|
200
|
+
this.variant() === 'number-list' ? 'ecl-list-illustration--number-list ecl-list-illustration--number-list-reset' : '',
|
|
207
201
|
]
|
|
208
202
|
.join(' ')
|
|
209
203
|
.trim();
|
|
@@ -213,7 +207,7 @@ class EclListIllustrationComponent extends ECLBaseDirective {
|
|
|
213
207
|
/**
|
|
214
208
|
* Enables zebra style (alternating background colors for list items).
|
|
215
209
|
*/
|
|
216
|
-
this.isZebra = false;
|
|
210
|
+
this.isZebra = input(false, { ...(ngDevMode ? { debugName: "isZebra" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
217
211
|
/**
|
|
218
212
|
* Number of horizontal columns. If greater than `0`, items are displayed in a grid layout.
|
|
219
213
|
*/
|
|
@@ -224,15 +218,17 @@ class EclListIllustrationComponent extends ECLBaseDirective {
|
|
|
224
218
|
* - `'m'` – medium
|
|
225
219
|
* - `'l'` – large (default)
|
|
226
220
|
*/
|
|
227
|
-
this.fontSize = 'l'
|
|
221
|
+
this.fontSize = input('l', /* @ts-ignore */
|
|
222
|
+
...(ngDevMode ? [{ debugName: "fontSize" }] : /* istanbul ignore next */ []));
|
|
228
223
|
/** If content should be centered */
|
|
229
|
-
this.isCentered = false;
|
|
224
|
+
this.isCentered = input(false, { ...(ngDevMode ? { debugName: "isCentered" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
230
225
|
/** If the icon should be on the same row as title - for list with icons */
|
|
231
|
-
this.isIconInline = false;
|
|
226
|
+
this.isIconInline = input(false, { ...(ngDevMode ? { debugName: "isIconInline" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
232
227
|
/** Two variants available: icon-list and number-list. */
|
|
233
|
-
this.variant = null
|
|
228
|
+
this.variant = input(null, /* @ts-ignore */
|
|
229
|
+
...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
|
|
234
230
|
/** If this is an icon-list, it can have dividers between each item. */
|
|
235
|
-
this.hasDividers = false;
|
|
231
|
+
this.hasDividers = input(false, { ...(ngDevMode ? { debugName: "hasDividers" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
236
232
|
/** If we have a number-list, the user can set the start of the counter. */
|
|
237
233
|
this.counterStart = input(null, /* @ts-ignore */
|
|
238
234
|
...(ngDevMode ? [{ debugName: "counterStart" }] : /* istanbul ignore next */ []));
|
|
@@ -267,7 +263,7 @@ class EclListIllustrationComponent extends ECLBaseDirective {
|
|
|
267
263
|
item.isVerticalPicture.set(true);
|
|
268
264
|
});
|
|
269
265
|
}
|
|
270
|
-
if (this.variant === 'icon-list' && this.hasDividers) {
|
|
266
|
+
if (this.variant() === 'icon-list' && this.hasDividers()) {
|
|
271
267
|
this.eclIllustrationItems?.forEach(item => {
|
|
272
268
|
item.hasDivider.set(true);
|
|
273
269
|
});
|
|
@@ -281,30 +277,14 @@ class EclListIllustrationComponent extends ECLBaseDirective {
|
|
|
281
277
|
});
|
|
282
278
|
}
|
|
283
279
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclListIllustrationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
284
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.5", type: EclListIllustrationComponent, isStandalone: true, selector: "ecl-list-illustration, ul[eclListIllustration], ol[eclListIllustration]", inputs: { isZebra: { classPropertyName: "isZebra", publicName: "isZebra", isSignal:
|
|
280
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.5", type: EclListIllustrationComponent, isStandalone: true, selector: "ecl-list-illustration, ul[eclListIllustration], ol[eclListIllustration]", inputs: { isZebra: { classPropertyName: "isZebra", publicName: "isZebra", isSignal: true, isRequired: false, transformFunction: null }, horizontalColumns: { classPropertyName: "horizontalColumns", publicName: "horizontalColumns", isSignal: true, isRequired: false, transformFunction: null }, fontSize: { classPropertyName: "fontSize", publicName: "fontSize", isSignal: true, isRequired: false, transformFunction: null }, isCentered: { classPropertyName: "isCentered", publicName: "isCentered", isSignal: true, isRequired: false, transformFunction: null }, isIconInline: { classPropertyName: "isIconInline", publicName: "isIconInline", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, hasDividers: { classPropertyName: "hasDividers", publicName: "hasDividers", isSignal: true, isRequired: false, transformFunction: null }, counterStart: { classPropertyName: "counterStart", publicName: "counterStart", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "style.display": "elementDisplayStyle()", "attr.role": "this.role", "class": "this.cssClasses", "style.--ecl-list-illustration-counter-start": "this.counterStartStyle", "attr.start": "this.startAttr" } }, queries: [{ propertyName: "eclIllustrationItems", predicate: i0.forwardRef(() => EclListIllustrationItemComponent) }], usesInheritance: true, ngImport: i0, template: "<ng-content></ng-content>" }); }
|
|
285
281
|
}
|
|
286
282
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclListIllustrationComponent, decorators: [{
|
|
287
283
|
type: Component,
|
|
288
284
|
args: [{ selector: 'ecl-list-illustration, ul[eclListIllustration], ol[eclListIllustration]', host: {
|
|
289
285
|
'[style.display]': 'elementDisplayStyle()',
|
|
290
286
|
}, template: "<ng-content></ng-content>" }]
|
|
291
|
-
}], ctorParameters: () => [], propDecorators: { isZebra: [{
|
|
292
|
-
type: Input,
|
|
293
|
-
args: [{ transform: booleanAttribute }]
|
|
294
|
-
}], horizontalColumns: [{ type: i0.Input, args: [{ isSignal: true, alias: "horizontalColumns", required: false }] }], fontSize: [{
|
|
295
|
-
type: Input
|
|
296
|
-
}], isCentered: [{
|
|
297
|
-
type: Input,
|
|
298
|
-
args: [{ transform: booleanAttribute }]
|
|
299
|
-
}], isIconInline: [{
|
|
300
|
-
type: Input,
|
|
301
|
-
args: [{ transform: booleanAttribute }]
|
|
302
|
-
}], variant: [{
|
|
303
|
-
type: Input
|
|
304
|
-
}], hasDividers: [{
|
|
305
|
-
type: Input,
|
|
306
|
-
args: [{ transform: booleanAttribute }]
|
|
307
|
-
}], counterStart: [{ type: i0.Input, args: [{ isSignal: true, alias: "counterStart", required: false }] }], eclIllustrationItems: [{
|
|
287
|
+
}], ctorParameters: () => [], propDecorators: { isZebra: [{ type: i0.Input, args: [{ isSignal: true, alias: "isZebra", required: false }] }], horizontalColumns: [{ type: i0.Input, args: [{ isSignal: true, alias: "horizontalColumns", required: false }] }], fontSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "fontSize", required: false }] }], isCentered: [{ type: i0.Input, args: [{ isSignal: true, alias: "isCentered", required: false }] }], isIconInline: [{ type: i0.Input, args: [{ isSignal: true, alias: "isIconInline", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], hasDividers: [{ type: i0.Input, args: [{ isSignal: true, alias: "hasDividers", required: false }] }], counterStart: [{ type: i0.Input, args: [{ isSignal: true, alias: "counterStart", required: false }] }], eclIllustrationItems: [{
|
|
308
288
|
type: ContentChildren,
|
|
309
289
|
args: [forwardRef(() => EclListIllustrationItemComponent)]
|
|
310
290
|
}], role: [{
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"eui-ecl-components-ecl-list-illustration.mjs","sources":["../../components/ecl-list-illustration/ecl-list-illustration-icon.directive.ts","../../components/ecl-list-illustration/ecl-list-illustration-picture.directive.ts","../../components/ecl-list-illustration/ecl-list-illustration-item.component.ts","../../components/ecl-list-illustration/ecl-list-illustration-item.component.html","../../components/ecl-list-illustration/ecl-list-illustration.component.ts","../../components/ecl-list-illustration/ecl-list-illustration.component.html","../../components/ecl-list-illustration/index.ts","../../components/ecl-list-illustration/eui-ecl-components-ecl-list-illustration.ts"],"sourcesContent":["import { Directive, HostBinding } from '@angular/core';\nimport { ECLBaseDirective } from '@eui/ecl/core';\n\n/**\n * Directive representing an icon within an ECL illustration list item.\n *\n * Applies the correct ECL class for list item icons.\n */\n@Directive({\n selector: '[eclListIllustrationIcon]',\n})\nexport class EclListIllustrationIconDirective extends ECLBaseDirective {\n /**\n * Applies the ECL class for illustration item icons.\n */\n @HostBinding('class.ecl-list-illustration__icon') className = true;\n}\n","import { ContentChild, Directive, HostBinding, Input, booleanAttribute, forwardRef, AfterContentInit } from '@angular/core';\nimport { ECLBaseDirective } from '@eui/ecl/core';\n\n/**\n * Directive applied to `<picture>` elements within ECL list illustrations.\n *\n * Adds the necessary ECL CSS classes for illustration pictures.\n */\n@Directive({\n selector: 'picture[eclListIllustrationPicture]',\n})\nexport class EclListIllustrationPictureDirective extends ECLBaseDirective implements AfterContentInit {\n\n /**\n * If true, image is styled with square dimensions.\n */\n @Input({ transform: booleanAttribute }) isSquare = false;\n\n @ContentChild(forwardRef(() => EclListIllustrationImageDirective))\n eclIllustrationImage!: EclListIllustrationImageDirective;\n\n /**\n * Applies the base ECL picture classes for list illustration pictures.\n */\n @HostBinding('class')\n get cssClasses(): string {\n return [super.getCssClasses('ecl-picture ecl-list-illustration__picture'),\n this.isSquare ? 'ecl-list-illustration__picture--square' : '',\n ].join(' ').trim();\n }\n\n ngAfterContentInit(): void {\n this.eclIllustrationImage.isSquare = this.isSquare;\n }\n}\n\n/**\n * Directive applied to `<img>` elements within ECL list illustrations.\n *\n * Supports square variant and size options for image styling.\n */\n@Directive({\n selector: 'img[eclListIllustrationImage]',\n})\nexport class EclListIllustrationImageDirective extends ECLBaseDirective {\n /**\n * If true, image is styled with square dimensions.\n */\n isSquare = false;\n\n /**\n * Defines the size variant of the image.\n * Possible values: `'s'`, `'m'`, `'l'`.\n */\n @Input() size: 's' | 'm' | 'l' = 'm';\n\n /**\n * Computes the appropriate ECL CSS classes for the image.\n */\n @HostBinding('class')\n get cssClasses(): string {\n return [\n super.getCssClasses('ecl-list-illustration__image'),\n this.isSquare ? 'ecl-list-illustration__image--square' : '',\n this.isSquare ? `ecl-list-illustration__image--${this.size}` : '',\n ]\n .join(' ')\n .trim();\n }\n}\n","import {\n Component,\n computed,\n ContentChild,\n forwardRef,\n HostBinding,\n Input,\n Signal,\n signal\n} from '@angular/core';\nimport { ECLBaseDirective } from '@eui/ecl/core';\nimport { EclListIllustrationIconDirective } from './ecl-list-illustration-icon.directive';\nimport { EclListIllustrationPictureDirective } from './ecl-list-illustration-picture.directive';\n\n/**\n * Component representing a single item in an ECL illustration list.\n *\n * Displays optional title, value, and one or more illustration icons.\n */\n@Component({\n selector: 'ecl-list-illustration-item, li[eclListIllustrationItem]',\n templateUrl: './ecl-list-illustration-item.component.html',\n})\nexport class EclListIllustrationItemComponent extends ECLBaseDirective {\n /**\n * Text displayed as the item title.\n */\n @Input() eclTitle = '';\n\n /**\n * Text displayed as the item value.\n */\n @Input() eclValue = '';\n\n /**\n * Applies ARIA role for list items.\n */\n @HostBinding('attr.role') role = 'listitem';\n\n /**\n * Applies ECL class for illustration list item.\n */\n @HostBinding('class.ecl-list-illustration__item') className = true;\n\n @ContentChild(forwardRef(() => EclListIllustrationIconDirective))\n eclIllustrationIcon: EclListIllustrationIconDirective;\n\n @ContentChild(forwardRef(() => EclListIllustrationPictureDirective))\n eclIllustrationPicture: EclListIllustrationPictureDirective;\n\n /** A special class needs to be added, for vertical lists with picture. */\n isVerticalPicture = signal(false);\n\n /** A special class needs to be added, if an icon list has dividers between items. */\n hasDivider = signal(false);\n\n hasPicture: Signal<boolean> = computed(() => this.eclIllustrationPicture !== undefined);\n\n /**\n * Returns `true` if the item has a title or any projected icons.\n */\n get hasTitle(): boolean {\n return Boolean(this.eclTitle) || this.eclIllustrationIcon !== undefined;\n }\n\n /**\n * Returns `true` if the item has a value.\n */\n get hasValue(): boolean {\n return Boolean(this.eclValue);\n }\n}\n","<div class=\"ecl-list-illustration__item-content\" [class.ecl-list-illustration__item-content--row]=\"isVerticalPicture()\"\n [class.ecl-list-illustration__divider]=\"hasDivider()\">\n <ng-content select=\"[eclListIllustrationImage],[eclListIllustrationPicture],[eclListIllustrationIcon]\"></ng-content>\n <div class=\"ecl-list-illustration__detail\">\n @if (hasTitle || hasValue) {\n <div class=\"ecl-list-illustration__title-container\">\n @if (hasValue) {\n <div class=\"ecl-list-illustration__value\">{{ eclValue }}</div>\n }\n <div class=\"ecl-list-illustration__title\">{{ eclTitle }}</div>\n </div>\n }\n\n <div class=\"ecl-list-illustration__description\">\n <ng-content></ng-content>\n </div>\n </div>\n</div>","import { Component, HostBinding, Input, booleanAttribute, numberAttribute, afterNextRender, inject, ContentChildren, forwardRef, QueryList, AfterContentInit, Signal, computed, input, effect, signal } from '@angular/core';\nimport { BreakpointObserver } from '@angular/cdk/layout';\nimport { ECLBaseDirective } from '@eui/ecl/core';\nimport { EclListIllustrationItemComponent } from './ecl-list-illustration-item.component';\n\n/**\n * Component representing a list using ECL illustration styles.\n *\n * Supports zebra styling, responsive horizontal layout, and font size options.\n */\n@Component({\n selector: 'ecl-list-illustration, ul[eclListIllustration], ol[eclListIllustration]',\n templateUrl: './ecl-list-illustration.component.html',\n host: {\n '[style.display]': 'elementDisplayStyle()',\n }\n})\nexport class EclListIllustrationComponent extends ECLBaseDirective implements AfterContentInit {\n /**\n * Enables zebra style (alternating background colors for list items).\n */\n @Input({ transform: booleanAttribute }) isZebra = false;\n\n /**\n * Number of horizontal columns. If greater than `0`, items are displayed in a grid layout.\n */\n horizontalColumns = input(0, { transform: numberAttribute });\n\n /**\n * Font size for list content.\n * Possible values:\n * - `'m'` – medium\n * - `'l'` – large (default)\n */\n @Input() fontSize: 'm' | 'l' = 'l';\n\n /** If content should be centered */\n @Input({ transform: booleanAttribute }) isCentered = false;\n\n /** If the icon should be on the same row as title - for list with icons */\n @Input({ transform: booleanAttribute }) isIconInline = false;\n\n /** Two variants available: icon-list and number-list. */\n @Input() variant: 'icon-list' | 'number-list' | null = null;\n\n /** If this is an icon-list, it can have dividers between each item. */\n @Input({ transform: booleanAttribute }) hasDividers = false;\n\n /** If we have a number-list, the user can set the start of the counter. */\n counterStart = input<number | null>(null);\n\n @ContentChildren(forwardRef(() => EclListIllustrationItemComponent))\n eclIllustrationItems: QueryList<EclListIllustrationItemComponent>;\n\n /**\n * Applies ARIA role for list elements.\n */\n @HostBinding('attr.role') role = 'list';\n\n /**\n * Applies the appropriate ECL CSS classes to the host element.\n */\n @HostBinding('class')\n get cssClasses(): string {\n return [\n super.getCssClasses('ecl-list-illustration'),\n this.isZebra ? 'ecl-list-illustration--zebra' : '',\n this.horizontalColumns() > 0 ? `ecl-list-illustration--col-${this.horizontalColumns()}` : '',\n this.fontSize === 'm' ? 'ecl-list-illustration--font-m' : '',\n this.isCentered ? 'ecl-list-illustration--centered' : '',\n this.isIconInline ? 'ecl-list-illustration--icon-inline' : '',\n this.variant === 'icon-list' ? 'ecl-list-illustration--icon-list' : '',\n this.variant === 'number-list' ? 'ecl-list-illustration--number-list ecl-list-illustration--number-list-reset': '',\n ]\n .join(' ')\n .trim();\n }\n\n /**\n * Controls `display` style of the host element based on breakpoint and column count.\n */\n elementDisplayStyle = computed(() =>\n this.horizontalColumns() > 0 && this.isTabletBreakpoint() ? null : 'block'\n );\n\n @HostBinding('style.--ecl-list-illustration-counter-start')\n counterStartStyle = '';\n\n @HostBinding('attr.start')\n startAttr: string | null = null;\n\n private isTabletBreakpoint = signal(false);\n private cdkBreakpointObserver = inject(BreakpointObserver);\n\n constructor() {\n super();\n afterNextRender(() => {\n this.observeBreakpointChanges();\n });\n effect(() => {\n const value = this.counterStart();\n const stringValue = value != null ? `${value}` : null;\n\n this.startAttr = stringValue;\n this.counterStartStyle = stringValue ?? '';\n });\n }\n\n ngAfterContentInit(): void {\n if (this.horizontalColumns() === 0) {\n this.eclIllustrationItems?.forEach(item => {\n if (item.hasPicture()) item.isVerticalPicture.set(true);\n });\n }\n\n if (this.variant === 'icon-list' && this.hasDividers) {\n this.eclIllustrationItems?.forEach(item => {\n item.hasDivider.set(true);\n });\n }\n }\n\n private observeBreakpointChanges(): void {\n this.cdkBreakpointObserver\n .observe(['(min-width: 768px)'])\n .subscribe((result) => {\n this.isTabletBreakpoint.set(result.matches);\n });\n }\n}\n","<ng-content></ng-content>","import { EclListIllustrationIconDirective } from './ecl-list-illustration-icon.directive';\nimport { EclListIllustrationItemComponent } from './ecl-list-illustration-item.component';\nimport { EclListIllustrationImageDirective, EclListIllustrationPictureDirective } from './ecl-list-illustration-picture.directive';\nimport { EclListIllustrationComponent } from './ecl-list-illustration.component';\n\nexport * from './ecl-list-illustration-item.component';\nexport * from './ecl-list-illustration-icon.directive';\nexport * from './ecl-list-illustration-picture.directive';\nexport * from './ecl-list-illustration.component';\n\nexport const EUI_ECL_LIST_ILUSTRATION = [\n EclListIllustrationComponent,\n EclListIllustrationItemComponent,\n EclListIllustrationIconDirective,\n EclListIllustrationPictureDirective,\n EclListIllustrationImageDirective,\n] as const;","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"eui-ecl-components-ecl-list-illustration.mjs","sources":["../../components/ecl-list-illustration/ecl-list-illustration-icon.directive.ts","../../components/ecl-list-illustration/ecl-list-illustration-picture.directive.ts","../../components/ecl-list-illustration/ecl-list-illustration-item.component.ts","../../components/ecl-list-illustration/ecl-list-illustration-item.component.html","../../components/ecl-list-illustration/ecl-list-illustration.component.ts","../../components/ecl-list-illustration/ecl-list-illustration.component.html","../../components/ecl-list-illustration/index.ts","../../components/ecl-list-illustration/eui-ecl-components-ecl-list-illustration.ts"],"sourcesContent":["import { Directive, HostBinding } from '@angular/core';\nimport { ECLBaseDirective } from '@eui/ecl/core';\n\n/**\n * Directive representing an icon within an ECL illustration list item.\n *\n * Applies the correct ECL class for list item icons.\n */\n@Directive({\n selector: '[eclListIllustrationIcon]',\n})\nexport class EclListIllustrationIconDirective extends ECLBaseDirective {\n /**\n * Applies the ECL class for illustration item icons.\n */\n @HostBinding('class.ecl-list-illustration__icon') className = true;\n}\n","import { ContentChild, Directive, HostBinding, booleanAttribute, forwardRef, AfterContentInit, input } from '@angular/core';\nimport { ECLBaseDirective } from '@eui/ecl/core';\n\n/**\n * Directive applied to `<picture>` elements within ECL list illustrations.\n *\n * Adds the necessary ECL CSS classes for illustration pictures.\n */\n@Directive({\n selector: 'picture[eclListIllustrationPicture]',\n})\nexport class EclListIllustrationPictureDirective extends ECLBaseDirective implements AfterContentInit {\n\n /**\n * If true, image is styled with square dimensions.\n */\n readonly isSquare = input(false, { transform: booleanAttribute });\n\n @ContentChild(forwardRef(() => EclListIllustrationImageDirective))\n eclIllustrationImage!: EclListIllustrationImageDirective;\n\n /**\n * Applies the base ECL picture classes for list illustration pictures.\n */\n @HostBinding('class')\n get cssClasses(): string {\n return [super.getCssClasses('ecl-picture ecl-list-illustration__picture'),\n this.isSquare() ? 'ecl-list-illustration__picture--square' : '',\n ].join(' ').trim();\n }\n\n ngAfterContentInit(): void {\n this.eclIllustrationImage.isSquare = this.isSquare();\n }\n}\n\n/**\n * Directive applied to `<img>` elements within ECL list illustrations.\n *\n * Supports square variant and size options for image styling.\n */\n@Directive({\n selector: 'img[eclListIllustrationImage]',\n})\nexport class EclListIllustrationImageDirective extends ECLBaseDirective {\n /**\n * If true, image is styled with square dimensions.\n */\n isSquare = false;\n\n /**\n * Defines the size variant of the image.\n * Possible values: `'s'`, `'m'`, `'l'`.\n */\n readonly size = input<'s' | 'm' | 'l'>('m');\n\n /**\n * Computes the appropriate ECL CSS classes for the image.\n */\n @HostBinding('class')\n get cssClasses(): string {\n return [\n super.getCssClasses('ecl-list-illustration__image'),\n this.isSquare ? 'ecl-list-illustration__image--square' : '',\n this.isSquare ? `ecl-list-illustration__image--${this.size()}` : '',\n ]\n .join(' ')\n .trim();\n }\n}\n","import {\n Component,\n computed,\n ContentChild,\n forwardRef,\n HostBinding,\n Signal,\n signal,\n input,\n} from '@angular/core';\nimport { ECLBaseDirective } from '@eui/ecl/core';\nimport { EclListIllustrationIconDirective } from './ecl-list-illustration-icon.directive';\nimport { EclListIllustrationPictureDirective } from './ecl-list-illustration-picture.directive';\n\n/**\n * Component representing a single item in an ECL illustration list.\n *\n * Displays optional title, value, and one or more illustration icons.\n */\n@Component({\n selector: 'ecl-list-illustration-item, li[eclListIllustrationItem]',\n templateUrl: './ecl-list-illustration-item.component.html',\n})\nexport class EclListIllustrationItemComponent extends ECLBaseDirective {\n /**\n * Text displayed as the item title.\n */\n readonly eclTitle = input('');\n\n /**\n * Text displayed as the item value.\n */\n readonly eclValue = input('');\n\n /**\n * Applies ARIA role for list items.\n */\n @HostBinding('attr.role') role = 'listitem';\n\n /**\n * Applies ECL class for illustration list item.\n */\n @HostBinding('class.ecl-list-illustration__item') className = true;\n\n @ContentChild(forwardRef(() => EclListIllustrationIconDirective))\n eclIllustrationIcon: EclListIllustrationIconDirective;\n\n @ContentChild(forwardRef(() => EclListIllustrationPictureDirective))\n eclIllustrationPicture: EclListIllustrationPictureDirective;\n\n /** A special class needs to be added, for vertical lists with picture. */\n isVerticalPicture = signal(false);\n\n /** A special class needs to be added, if an icon list has dividers between items. */\n hasDivider = signal(false);\n\n hasPicture: Signal<boolean> = computed(() => this.eclIllustrationPicture !== undefined);\n\n /**\n * Returns `true` if the item has a title or any projected icons.\n */\n get hasTitle(): boolean {\n return Boolean(this.eclTitle()) || this.eclIllustrationIcon !== undefined;\n }\n\n /**\n * Returns `true` if the item has a value.\n */\n get hasValue(): boolean {\n return Boolean(this.eclValue());\n }\n}\n","<div class=\"ecl-list-illustration__item-content\" [class.ecl-list-illustration__item-content--row]=\"isVerticalPicture()\"\n [class.ecl-list-illustration__divider]=\"hasDivider()\">\n <ng-content select=\"[eclListIllustrationImage],[eclListIllustrationPicture],[eclListIllustrationIcon]\"></ng-content>\n <div class=\"ecl-list-illustration__detail\">\n @if (hasTitle || hasValue) {\n <div class=\"ecl-list-illustration__title-container\">\n @if (hasValue) {\n <div class=\"ecl-list-illustration__value\">{{ eclValue() }}</div>\n }\n <div class=\"ecl-list-illustration__title\">{{ eclTitle() }}</div>\n </div>\n }\n\n <div class=\"ecl-list-illustration__description\">\n <ng-content></ng-content>\n </div>\n </div>\n</div>","import { Component, HostBinding, booleanAttribute, numberAttribute, afterNextRender, inject, ContentChildren, forwardRef, QueryList, AfterContentInit, Signal, computed, input, effect, signal } from '@angular/core';\nimport { BreakpointObserver } from '@angular/cdk/layout';\nimport { ECLBaseDirective } from '@eui/ecl/core';\nimport { EclListIllustrationItemComponent } from './ecl-list-illustration-item.component';\n\n/**\n * Component representing a list using ECL illustration styles.\n *\n * Supports zebra styling, responsive horizontal layout, and font size options.\n */\n@Component({\n selector: 'ecl-list-illustration, ul[eclListIllustration], ol[eclListIllustration]',\n templateUrl: './ecl-list-illustration.component.html',\n host: {\n '[style.display]': 'elementDisplayStyle()',\n }\n})\nexport class EclListIllustrationComponent extends ECLBaseDirective implements AfterContentInit {\n /**\n * Enables zebra style (alternating background colors for list items).\n */\n readonly isZebra = input(false, { transform: booleanAttribute });\n\n /**\n * Number of horizontal columns. If greater than `0`, items are displayed in a grid layout.\n */\n horizontalColumns = input(0, { transform: numberAttribute });\n\n /**\n * Font size for list content.\n * Possible values:\n * - `'m'` – medium\n * - `'l'` – large (default)\n */\n readonly fontSize = input<'m' | 'l'>('l');\n\n /** If content should be centered */\n readonly isCentered = input(false, { transform: booleanAttribute });\n\n /** If the icon should be on the same row as title - for list with icons */\n readonly isIconInline = input(false, { transform: booleanAttribute });\n\n /** Two variants available: icon-list and number-list. */\n readonly variant = input<'icon-list' | 'number-list' | null>(null);\n\n /** If this is an icon-list, it can have dividers between each item. */\n readonly hasDividers = input(false, { transform: booleanAttribute });\n\n /** If we have a number-list, the user can set the start of the counter. */\n counterStart = input<number | null>(null);\n\n @ContentChildren(forwardRef(() => EclListIllustrationItemComponent))\n eclIllustrationItems: QueryList<EclListIllustrationItemComponent>;\n\n /**\n * Applies ARIA role for list elements.\n */\n @HostBinding('attr.role') role = 'list';\n\n /**\n * Applies the appropriate ECL CSS classes to the host element.\n */\n @HostBinding('class')\n get cssClasses(): string {\n return [\n super.getCssClasses('ecl-list-illustration'),\n this.isZebra() ? 'ecl-list-illustration--zebra' : '',\n this.horizontalColumns() > 0 ? `ecl-list-illustration--col-${this.horizontalColumns()}` : '',\n this.fontSize() === 'm' ? 'ecl-list-illustration--font-m' : '',\n this.isCentered() ? 'ecl-list-illustration--centered' : '',\n this.isIconInline() ? 'ecl-list-illustration--icon-inline' : '',\n this.variant() === 'icon-list' ? 'ecl-list-illustration--icon-list' : '',\n this.variant() === 'number-list' ? 'ecl-list-illustration--number-list ecl-list-illustration--number-list-reset': '',\n ]\n .join(' ')\n .trim();\n }\n\n /**\n * Controls `display` style of the host element based on breakpoint and column count.\n */\n elementDisplayStyle = computed(() =>\n this.horizontalColumns() > 0 && this.isTabletBreakpoint() ? null : 'block'\n );\n\n @HostBinding('style.--ecl-list-illustration-counter-start')\n counterStartStyle = '';\n\n @HostBinding('attr.start')\n startAttr: string | null = null;\n\n private isTabletBreakpoint = signal(false);\n private cdkBreakpointObserver = inject(BreakpointObserver);\n\n constructor() {\n super();\n afterNextRender(() => {\n this.observeBreakpointChanges();\n });\n effect(() => {\n const value = this.counterStart();\n const stringValue = value != null ? `${value}` : null;\n\n this.startAttr = stringValue;\n this.counterStartStyle = stringValue ?? '';\n });\n }\n\n ngAfterContentInit(): void {\n if (this.horizontalColumns() === 0) {\n this.eclIllustrationItems?.forEach(item => {\n if (item.hasPicture()) item.isVerticalPicture.set(true);\n });\n }\n\n if (this.variant() === 'icon-list' && this.hasDividers()) {\n this.eclIllustrationItems?.forEach(item => {\n item.hasDivider.set(true);\n });\n }\n }\n\n private observeBreakpointChanges(): void {\n this.cdkBreakpointObserver\n .observe(['(min-width: 768px)'])\n .subscribe((result) => {\n this.isTabletBreakpoint.set(result.matches);\n });\n }\n}\n","<ng-content></ng-content>","import { EclListIllustrationIconDirective } from './ecl-list-illustration-icon.directive';\nimport { EclListIllustrationItemComponent } from './ecl-list-illustration-item.component';\nimport { EclListIllustrationImageDirective, EclListIllustrationPictureDirective } from './ecl-list-illustration-picture.directive';\nimport { EclListIllustrationComponent } from './ecl-list-illustration.component';\n\nexport * from './ecl-list-illustration-item.component';\nexport * from './ecl-list-illustration-icon.directive';\nexport * from './ecl-list-illustration-picture.directive';\nexport * from './ecl-list-illustration.component';\n\nexport const EUI_ECL_LIST_ILUSTRATION = [\n EclListIllustrationComponent,\n EclListIllustrationItemComponent,\n EclListIllustrationIconDirective,\n EclListIllustrationPictureDirective,\n EclListIllustrationImageDirective,\n] as const;","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { booleanAttribute, HostBinding,
|
|
2
|
+
import { input, booleanAttribute, HostBinding, Component, Directive } from '@angular/core';
|
|
3
3
|
import { ECLBaseDirective } from '@eui/ecl/core';
|
|
4
4
|
|
|
5
5
|
/**
|
|
@@ -18,7 +18,8 @@ class EclLoadingIndicatorComponent extends ECLBaseDirective {
|
|
|
18
18
|
* - `'m'` – medium (default)
|
|
19
19
|
* - `'l'` – large
|
|
20
20
|
*/
|
|
21
|
-
this.size = 'm'
|
|
21
|
+
this.size = input('m', /* @ts-ignore */
|
|
22
|
+
...(ngDevMode ? [{ debugName: "size" }] : /* istanbul ignore next */ []));
|
|
22
23
|
/**
|
|
23
24
|
* Variant of the spinner color.
|
|
24
25
|
*
|
|
@@ -26,13 +27,14 @@ class EclLoadingIndicatorComponent extends ECLBaseDirective {
|
|
|
26
27
|
* - `'primary'` – default appearance
|
|
27
28
|
* - `'inverted'` – used on dark backgrounds
|
|
28
29
|
*/
|
|
29
|
-
this.variant = 'primary'
|
|
30
|
+
this.variant = input('primary', /* @ts-ignore */
|
|
31
|
+
...(ngDevMode ? [{ debugName: "variant" }] : /* istanbul ignore next */ []));
|
|
30
32
|
/**
|
|
31
33
|
* Controls whether the spinner should be centered.
|
|
32
34
|
*
|
|
33
35
|
* Defaults to `true`.
|
|
34
36
|
*/
|
|
35
|
-
this.isCentered = true;
|
|
37
|
+
this.isCentered = input(true, { ...(ngDevMode ? { debugName: "isCentered" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
36
38
|
/**
|
|
37
39
|
* Controls visibility of the spinner.
|
|
38
40
|
*
|
|
@@ -40,7 +42,7 @@ class EclLoadingIndicatorComponent extends ECLBaseDirective {
|
|
|
40
42
|
*
|
|
41
43
|
* Defaults to `true`.
|
|
42
44
|
*/
|
|
43
|
-
this.isVisible = true;
|
|
45
|
+
this.isVisible = input(true, { ...(ngDevMode ? { debugName: "isVisible" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
44
46
|
/**
|
|
45
47
|
* Applies ARIA role for accessibility.
|
|
46
48
|
*/
|
|
@@ -52,31 +54,21 @@ class EclLoadingIndicatorComponent extends ECLBaseDirective {
|
|
|
52
54
|
get cssClasses() {
|
|
53
55
|
return [
|
|
54
56
|
super.getCssClasses('ecl-spinner'),
|
|
55
|
-
`ecl-spinner--${this.size}`,
|
|
56
|
-
`ecl-spinner--${this.variant}`,
|
|
57
|
-
this.isCentered ? 'ecl-spinner--centered' : '',
|
|
58
|
-
this.isVisible ? 'ecl-spinner--visible' : '',
|
|
57
|
+
`ecl-spinner--${this.size()}`,
|
|
58
|
+
`ecl-spinner--${this.variant()}`,
|
|
59
|
+
this.isCentered() ? 'ecl-spinner--centered' : '',
|
|
60
|
+
this.isVisible() ? 'ecl-spinner--visible' : '',
|
|
59
61
|
]
|
|
60
62
|
.join(' ')
|
|
61
63
|
.trim();
|
|
62
64
|
}
|
|
63
65
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclLoadingIndicatorComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
64
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
66
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "22.0.5", type: EclLoadingIndicatorComponent, isStandalone: true, selector: "ecl-loading-indicator", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, isCentered: { classPropertyName: "isCentered", publicName: "isCentered", isSignal: true, isRequired: false, transformFunction: null }, isVisible: { classPropertyName: "isVisible", publicName: "isVisible", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.role": "this.role", "class": "this.cssClasses" } }, usesInheritance: true, ngImport: i0, template: "<svg class=\"ecl-spinner__loader\" viewBox=\"25 25 50 50\">\n <circle\n class=\"ecl-spinner__circle\"\n cx=\"50\"\n cy=\"50\"\n r=\"20\"\n fill=\"none\"\n stroke-width=\"4px\"\n stroke-miterlimit=\"10\"\n vector-effect=\"non-scaling-stroke\"></circle>\n</svg>\n<ng-content></ng-content>\n" }); }
|
|
65
67
|
}
|
|
66
68
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.5", ngImport: i0, type: EclLoadingIndicatorComponent, decorators: [{
|
|
67
69
|
type: Component,
|
|
68
70
|
args: [{ selector: 'ecl-loading-indicator', template: "<svg class=\"ecl-spinner__loader\" viewBox=\"25 25 50 50\">\n <circle\n class=\"ecl-spinner__circle\"\n cx=\"50\"\n cy=\"50\"\n r=\"20\"\n fill=\"none\"\n stroke-width=\"4px\"\n stroke-miterlimit=\"10\"\n vector-effect=\"non-scaling-stroke\"></circle>\n</svg>\n<ng-content></ng-content>\n" }]
|
|
69
|
-
}], propDecorators: { size: [{
|
|
70
|
-
type: Input
|
|
71
|
-
}], variant: [{
|
|
72
|
-
type: Input
|
|
73
|
-
}], isCentered: [{
|
|
74
|
-
type: Input,
|
|
75
|
-
args: [{ transform: booleanAttribute }]
|
|
76
|
-
}], isVisible: [{
|
|
77
|
-
type: Input,
|
|
78
|
-
args: [{ transform: booleanAttribute }]
|
|
79
|
-
}], role: [{
|
|
71
|
+
}], propDecorators: { size: [{ type: i0.Input, args: [{ isSignal: true, alias: "size", required: false }] }], variant: [{ type: i0.Input, args: [{ isSignal: true, alias: "variant", required: false }] }], isCentered: [{ type: i0.Input, args: [{ isSignal: true, alias: "isCentered", required: false }] }], isVisible: [{ type: i0.Input, args: [{ isSignal: true, alias: "isVisible", required: false }] }], role: [{
|
|
80
72
|
type: HostBinding,
|
|
81
73
|
args: ['attr.role']
|
|
82
74
|
}], cssClasses: [{
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"eui-ecl-components-ecl-loading-indicator.mjs","sources":["../../components/ecl-loading-indicator/ecl-loading-indicator.component.ts","../../components/ecl-loading-indicator/ecl-loading-indicator.component.html","../../components/ecl-loading-indicator/ecl-loading-indicator-label.directive.ts","../../components/ecl-loading-indicator/ecl-loading-indicator-overlay.directive.ts","../../components/ecl-loading-indicator/index.ts","../../components/ecl-loading-indicator/eui-ecl-components-ecl-loading-indicator.ts"],"sourcesContent":["import { Component, HostBinding,
|
|
1
|
+
{"version":3,"file":"eui-ecl-components-ecl-loading-indicator.mjs","sources":["../../components/ecl-loading-indicator/ecl-loading-indicator.component.ts","../../components/ecl-loading-indicator/ecl-loading-indicator.component.html","../../components/ecl-loading-indicator/ecl-loading-indicator-label.directive.ts","../../components/ecl-loading-indicator/ecl-loading-indicator-overlay.directive.ts","../../components/ecl-loading-indicator/index.ts","../../components/ecl-loading-indicator/eui-ecl-components-ecl-loading-indicator.ts"],"sourcesContent":["import { Component, HostBinding, booleanAttribute, input } from '@angular/core';\nimport { ECLBaseDirective } from '@eui/ecl/core';\n\n/**\n * Component representing a loading indicator (spinner) using ECL styles.\n *\n * Supports different sizes, color variants, centering and visibility options.\n */\n@Component({\n selector: 'ecl-loading-indicator',\n templateUrl: './ecl-loading-indicator.component.html',\n})\nexport class EclLoadingIndicatorComponent extends ECLBaseDirective {\n /**\n * Size of the spinner.\n *\n * Possible values:\n * - `'s'` – small\n * - `'m'` – medium (default)\n * - `'l'` – large\n */\n readonly size = input<'s' | 'm' | 'l'>('m');\n\n /**\n * Variant of the spinner color.\n *\n * Possible values:\n * - `'primary'` – default appearance\n * - `'inverted'` – used on dark backgrounds\n */\n readonly variant = input<'primary' | 'inverted'>('primary');\n\n /**\n * Controls whether the spinner should be centered.\n *\n * Defaults to `true`.\n */\n readonly isCentered = input(true, { transform: booleanAttribute });\n\n /**\n * Controls visibility of the spinner.\n *\n * When set to `false`, the spinner will be hidden via CSS.\n *\n * Defaults to `true`.\n */\n readonly isVisible = input(true, { transform: booleanAttribute });\n\n /**\n * Applies ARIA role for accessibility.\n */\n @HostBinding('attr.role') role = 'alert';\n\n /**\n * Applies CSS classes based on size, variant and visibility settings.\n */\n @HostBinding('class')\n get cssClasses(): string {\n return [\n super.getCssClasses('ecl-spinner'),\n `ecl-spinner--${this.size()}`,\n `ecl-spinner--${this.variant()}`,\n this.isCentered() ? 'ecl-spinner--centered' : '',\n this.isVisible() ? 'ecl-spinner--visible' : '',\n ]\n .join(' ')\n .trim();\n }\n}\n","<svg class=\"ecl-spinner__loader\" viewBox=\"25 25 50 50\">\n <circle\n class=\"ecl-spinner__circle\"\n cx=\"50\"\n cy=\"50\"\n r=\"20\"\n fill=\"none\"\n stroke-width=\"4px\"\n stroke-miterlimit=\"10\"\n vector-effect=\"non-scaling-stroke\"></circle>\n</svg>\n<ng-content></ng-content>\n","import { Directive, HostBinding } from '@angular/core';\n\n/**\n * Directive for styling the label text of an ECL loading indicator.\n *\n * Adds the `ecl-spinner__text` class to the host element.\n */\n@Directive({\n selector: '[eclLoadingIndicatorLabel]',\n})\nexport class EclLoadingIndicatorLabelDirective {\n /**\n * Applies the ECL class for spinner label text.\n */\n @HostBinding('class.ecl-spinner__text') className = true;\n}\n","import { Directive, HostBinding } from '@angular/core';\nimport { ECLBaseDirective } from '@eui/ecl/core';\n\n/**\n * Directive that adds an overlay layer to an ECL loading indicator.\n *\n * Automatically applies the ECL spinner overlay classes.\n */\n@Directive({\n selector: '[eclLoadingIndicatorOverlay]',\n})\nexport class EclLoadingIndicatorOverlayDirective extends ECLBaseDirective {\n /**\n * Applies the CSS classes for the spinner overlay.\n */\n @HostBinding('class')\n get cssClasses(): string {\n return [super.getCssClasses('ecl-spinner__overlay ecl-spinner__overlay--visible')].join(' ').trim();\n }\n}\n","import { EclLoadingIndicatorComponent } from './ecl-loading-indicator.component';\nimport { EclLoadingIndicatorLabelDirective } from './ecl-loading-indicator-label.directive';\nimport { EclLoadingIndicatorOverlayDirective } from './ecl-loading-indicator-overlay.directive';\n\nexport * from './ecl-loading-indicator.component';\nexport * from './ecl-loading-indicator-label.directive';\nexport * from './ecl-loading-indicator-overlay.directive';\n\nexport const EUI_ECL_LOADING_INDICATOR = [\n EclLoadingIndicatorComponent,\n EclLoadingIndicatorLabelDirective,\n EclLoadingIndicatorOverlayDirective,\n] as const;\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|