@eui/showcase 14.0.0-rc.3 → 14.0.0-rc.6

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.
@@ -219,9 +219,9 @@ export class DocPageComponent {
219
219
  return result;
220
220
  }
221
221
  }
222
- /** @nocollapse */ DocPageComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: DocPageComponent, deps: [{ token: i1.Router }, { token: i1.ActivatedRoute }, { token: i2.UxAppShellService }, { token: i3.DomSanitizer }, { token: i4.Location }], target: i0.ɵɵFactoryTarget.Component });
223
- /** @nocollapse */ DocPageComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: DocPageComponent, selector: "eui-showcase-doc-page", inputs: { id: "id", label: "label", subLabel: "subLabel", isNotReady: "isNotReady", isDeprecated: "isDeprecated", codeFolder: "codeFolder", showcase: "showcase" }, queries: [{ propertyName: "samples", predicate: DocSampleComponent, descendants: true }, { propertyName: "sections", predicate: DocSectionComponent, descendants: true }, { propertyName: "pageOverviewContent", predicate: i0.forwardRef(function () { return DocPageOverviewContentDirective; }) }, { propertyName: "pageSamplesContent", predicate: i0.forwardRef(function () { return DocPageSamplesContentDirective; }) }, { propertyName: "pageSectionsContent", predicate: i0.forwardRef(function () { return DocPageSectionsContentDirective; }) }, { propertyName: "pageInteractiveContent", predicate: i0.forwardRef(function () { return DocPageInteractiveContentDirective; }) }, { propertyName: "pageAccessibilityContent", predicate: i0.forwardRef(function () { return DocPageAccessibilityContentDirective; }) }, { propertyName: "pageApiContent", predicate: i0.forwardRef(function () { return DocPageApiContentDirective; }) }, { propertyName: "pageThemingContent", predicate: i0.forwardRef(function () { return DocPageThemingContentDirective; }) }], viewQueries: [{ propertyName: "tabsContent", first: true, predicate: ["tabsContent"], descendants: true }], ngImport: i0, template: "<div class=\"doc-page-navigation-wrapper\" [class.eui-u-hidden]=\"isLoading\">\n <div class=\"doc-page-main-column\">\n <eui-page>\n <eui-page-header label=\"{{label}}\" subLabel=\"{{subLabel}}\">\n <eui-page-header-action-items>\n <eui-showcase-doc-page-code *ngIf=\"codeFolder\" codeFolder=\"{{codeFolder}}\" showcase=\"{{showcase}}\"></eui-showcase-doc-page-code>\n <eui-chip *ngIf=\"stateLabel\" [euiSuccess]=\"stateLabel === 'ACTIVE'\" [euiWarning]=\"stateLabel === 'NOT READY'\" [euiDanger]=\"stateLabel === 'DEPRECATED'\">\n <span euiLabel><strong>{{stateLabel}}</strong></span>\n </eui-chip>\n </eui-page-header-action-items>\n </eui-page-header>\n\n <eui-page-content>\n <ux-alert *ngIf=\"stateLabel === 'NOT READY' || isNotReady\" typeClass=\"warning\">\n <p>\n This component <strong class=\"eui-u-color-warning-darkester-2\">is not ready for production</strong> usage yet, it's API is still subject to change during the coming weeks.\n </p>\n <p>\n For experimentation use only.\n </p>\n </ux-alert>\n\n <ux-alert *ngIf=\"stateLabel === 'DEPRECATED' || isDeprecated\" typeClass=\"danger\">\n <p>\n This component has been <strong class=\"eui-u-color-danger\">deprecated</strong>\n </p>\n <div *ngIf=\"cmp\">\n <div *ngIf=\"cmp.cmpReplacement !== 'NONE'\">\n It has been replaced by : <strong class=\"eui-u-color-success-darkest\">{{cmp.cmpReplacement}}</strong>.\n <!-- <br><br>\n You can find more information on the new component here : <a [routerLink]=\"cmp.cmpReplacementUrl\">{{cmp.cmpReplacementUrl}}</a> -->\n </div>\n <div *ngIf=\"cmp.cmpReplacement === 'NONE'\">\n This component will be <strong>discontinued in future version of eUI</strong>\n </div>\n <div *ngIf=\"cmp.cmpReplacementNote\">\n <strong class=\"eui-u-color-warning\">{{cmp.cmpReplacementNote}}</strong>\n </div>\n </div>\n </ux-alert>\n\n <div *ngIf=\"(stateLabel || isNotReady || isDeprecated) && stateLabel !== 'ACTIVE'\" class=\"mb-5\"></div>\n\n\n <eui-tabs #tabsContent *ngIf=\"pageSectionsContent.length === 0\" (tabSelected)=\"onTabSelected($event)\">\n <eui-tab>\n <euiTabLabel>\n OVERVIEW\n </euiTabLabel>\n <euiTabContent>\n <h4 id=\"overview\" class=\"eui-u-font-bold eui-u-color-info mt-3 mb-2\">Overview</h4>\n <div *ngIf=\"pageOverviewContent.length > 0; else noOverview\">\n <ng-content select=\"docPageOverview\"></ng-content>\n </div>\n <ng-template #noOverview>\n Coming soon...\n </ng-template>\n </euiTabContent>\n </eui-tab>\n\n <eui-tab>\n <euiTabLabel>\n API\n </euiTabLabel>\n <euiTabContent>\n <ng-container *ngIf=\"apiUrlSafe\">\n <div class=\"flex-container\">\n <a href=\"{{apiUrl}}\" target=\"_blank\" class=\"ms-auto pb-2 eui-u-text-link-external\">Open API page</a>\n </div>\n <div class=\"doc-page-api-iframe-wrapper\">\n <iframe id=\"iframe_api\" [width]=\"'100%'\" height=\"700px\" frameBorder=\"0\" [src]=\"apiUrlSafe\"></iframe>\n </div>\n </ng-container>\n </euiTabContent>\n </eui-tab>\n\n <eui-tab>\n <euiTabLabel>\n A11Y\n </euiTabLabel>\n <euiTabContent>\n <h4 id=\"accessibility\" class=\"eui-u-font-bold eui-u-color-info mt-3 mb-2\">Accessibility</h4>\n <ng-content select=\"docPageAccessibility\"></ng-content>\n </euiTabContent>\n </eui-tab>\n\n <eui-tab>\n <euiTabLabel>\n OPTIONS & SAMPLES\n </euiTabLabel>\n <euiTabContent>\n <h4 id=\"samples\" class=\"eui-u-font-bold eui-u-color-info mt-3 mb-2\">Options & samples</h4>\n <ng-content select=\"docPageSamples\"></ng-content>\n </euiTabContent>\n </eui-tab>\n\n\n <eui-tab *ngIf=\"pageThemingContent.length > 0\">\n <euiTabLabel>\n THEMING\n </euiTabLabel>\n <euiTabContent>\n <h4 id=\"theming\" class=\"eui-u-font-bold eui-u-color-info mt-3 mb-2\">Theming</h4>\n <ng-content select=\"docPageTheming\"></ng-content>\n </euiTabContent>\n </eui-tab>\n\n <eui-tab *ngIf=\"pageInteractiveContent.length > 0\">\n <euiTabLabel>\n ADVANCED EXAMPLES\n </euiTabLabel>\n <euiTabContent>\n <h4 id=\"interactive\" class=\"eui-u-font-bold eui-u-color-info mt-3 mb-2\">Advanced use cases</h4>\n <ng-content select=\"docPageInteractive\"></ng-content>\n </euiTabContent>\n </eui-tab>\n </eui-tabs>\n\n <ng-container *ngIf=\"pageSectionsContent.length > 0\">\n <h4 id=\"demo\" *ngIf=\"sections.length === 0\" class=\"eui-u-font-bold eui-u-color-info mt-3 mb-2\">Demo</h4>\n <ng-content select=\"docPageSections\"></ng-content>\n </ng-container>\n </eui-page-content>\n </eui-page>\n </div>\n\n <div class=\"doc-page-navigation-column eui-u-hidden-desktop-down\">\n <div id=\"doc-page-nav\">\n <div class=\"doc-page-navigation-title\">In this page</div>\n <div class=\"doc-page-navigation-content\" tabindex=\"0\">\n <ul class=\"doc-page-navigation\">\n <ng-container *ngIf=\"pageSectionsContent.length === 0\">\n <!-- ALWAYS PRESENT in each page-->\n <li class=\"doc-page-navigation-item\" [class.doc-page-navigation-item--selected]=\"fragmentId === 'overview'\" (click)=\"onNavClick('overview', 0)\"><span>OVERVIEW</span></li>\n <li class=\"doc-page-navigation-item\" [class.doc-page-navigation-item--selected]=\"fragmentId === 'api'\" (click)=\"onNavClick('api', 1)\"><span>API</span></li>\n <li class=\"doc-page-navigation-item\" [class.doc-page-navigation-item--selected]=\"fragmentId === 'a11y'\" (click)=\"onNavClick('a11y', 2)\"><span>A11Y</span></li>\n <li class=\"doc-page-navigation-item\" [class.doc-page-navigation-item--selected]=\"fragmentId === 'samples'\" (click)=\"onNavClick('samples', 3)\"><span>OPTIONS & SAMPLES</span></li>\n <li class=\"doc-page-navigation-item doc-page-navigation-sub\">\n <ul *ngFor=\"let sample of samples\">\n <li class=\"doc-page-navigation-item\" [class.doc-page-navigation-item--selected]=\"fragmentId === sample.id\" (click)=\"onNavClick(sample.id, 3)\"><span>{{sample.label}}</span></li>\n </ul>\n </li>\n\n <!-- OPTIONAL TABS-->\n <li *ngIf=\"pageThemingContent.length > 0\" class=\"doc-page-navigation-item\" [class.doc-page-navigation-item--selected]=\"fragmentId === 'theming'\" (click)=\"onNavClick('theming', 4)\"><span>THEMING</span></li>\n <li *ngIf=\"pageInteractiveContent.length > 0\" class=\"doc-page-navigation-item\" [class.doc-page-navigation-item--selected]=\"fragmentId === 'advanced'\" (click)=\"onNavClick('advanced', 5)\"><span>ADVANCED EXAMPLES</span></li>\n </ng-container>\n\n <ng-container *ngIf=\"pageSectionsContent.length > 0\">\n <li class=\"doc-page-navigation-item\" [class.doc-page-navigation-item--selected]=\"fragmentId === 'sections'\" (click)=\"onNavClick('sections', null)\"><span>Sections</span></li>\n <li *ngIf=\"sections.length === 0\" class=\"doc-page-navigation-item\" [class.doc-page-navigation-item--selected]=\"fragmentId === 'demo'\" (click)=\"onNavClick('demo', null)\"><span>Demo</span></li>\n <li *ngIf=\"sections.length > 0\" class=\"doc-page-navigation-item doc-page-navigation-sub\">\n <ul *ngFor=\"let section of sections\">\n <li class=\"doc-page-navigation-item\" [class.doc-page-navigation-item--selected]=\"fragmentId === section.id\" (click)=\"onNavClick(section.id, null)\"><span>{{section.label}}</span></li>\n </ul>\n </li>\n </ng-container>\n </ul>\n </div>\n </div>\n </div>\n</div>\n", styles: [".doc-page-navigation-wrapper{display:flex;flex-wrap:wrap;width:100%}.doc-page-navigation-wrapper .doc-page-main-column{padding-right:var(--eui-base-spacing-m);width:calc(100% - 400px)}.doc-page-navigation-wrapper .doc-page-navigation-column{background:var(--eui-base-color-white);box-shadow:0 8px 10px #b7c0ce33;position:fixed;right:0;transition:all ease-in-out .25s;width:400px;z-index:99;box-shadow:var(--eui-base-shadow-1)}.doc-page-navigation-wrapper .doc-page-navigation-column:hover{width:400px}.doc-page-navigation-title{font-weight:700;padding:var(--eui-base-spacing-s)}.doc-page-navigation-content{display:block;height:100vh;max-height:calc(100vh - 6rem);overflow-y:auto;width:100%}.doc-page-navigation-content::-webkit-scrollbar{display:inherit;height:6px;width:6px;background-color:var(--eui-base-color-grey-10)}.doc-page-navigation-content::-webkit-scrollbar-thumb{background-color:var(--eui-base-color-grey-20);border-radius:5rem}.doc-page-navigation-content::-webkit-scrollbar-thumb:hover{background-color:var(--eui-base-color-grey-25)}.doc-page-navigation-content::-webkit-scrollbar-track{background-color:var(--eui-base-color-grey-10);border-radius:0}.doc-page-navigation{background-color:transparent;border-left:2px solid transparent;padding-top:var(--eui-base-spacing-xs)}.doc-page-navigation .doc-page-navigation-item{color:var(--eui-base-color-primary-100);cursor:pointer;line-height:1.5;overflow:hidden;padding:var(--eui-base-spacing-2xs);text-overflow:ellipsis;transition:background-color ease-in .2s;white-space:nowrap}.doc-page-navigation .doc-page-navigation-item span{font-weight:700;padding-left:var(--eui-base-spacing-xs)}.doc-page-navigation .doc-page-navigation-item:not(.doc-page-navigation-sub):hover{background-color:var(--eui-base-color-grey-5);border-left:2px solid var(--eui-base-color-info-100)}.doc-page-navigation .doc-page-navigation-item.doc-page-navigation-sub .doc-page-navigation-item span{font-weight:400;padding-left:var(--eui-base-spacing-m)}.doc-page-navigation .doc-page-navigation-item.doc-page-navigation-sub .doc-page-navigation-item:hover{background-color:var(--eui-base-color-grey-5);border-left:2px solid var(--eui-base-color-grey-15)}.doc-page-navigation .doc-page-navigation-item.doc-page-navigation-item--selected{background-color:var(--eui-base-color-grey-5);border-left:2px solid var(--eui-base-color-info-100)}.doc-page-api-iframe-wrapper{display:flex;justify-content:space-around;margin:0}@media screen and (max-width: 767px){.doc-page-navigation-wrapper .doc-page-main-column{padding-right:0;width:100%}.doc-page-navigation-wrapper .doc-page-navigation-column{display:none;width:0}}@media screen and (min-width: 768px) and (max-width: 995px){.doc-page-navigation-wrapper .doc-page-main-column{width:80%}.doc-page-navigation-wrapper .doc-page-navigation-column{width:20%}}@media screen and (max-width: 1550px){.doc-page-api-iframe-wrapper{display:none}}\n"], dependencies: [{ kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i5.UxAlertComponent, selector: "ux-alert", inputs: ["styleClass", "typeClass", "iconClass", "isMuted", "isCloseable", "e2eAttr"], outputs: ["close"] }, { kind: "component", type: i6.EuiPageComponent, selector: "eui-page" }, { kind: "component", type: i6.EuiPageContentComponent, selector: "eui-page-content" }, { kind: "component", type: i6.EuiPageHeaderComponent, selector: "eui-page-header", inputs: ["label", "subLabel", "isCollapsible", "isCollapsed", "collapsedLabel", "expandedLabel"], outputs: ["collapse"] }, { kind: "directive", type: i6.EuiPageHeaderActionItemsContentDirective, selector: "eui-page-header-action-items" }, { kind: "component", type: i7.EuiLabelComponent, selector: "label[euiLabel], span[euiLabel], div[euiLabel], a[euiLabel], eui-label, label[euiSublabel], span[euiSublabel], div[euiSublabel], a[euiSublabel], eui-sublabel", inputs: ["euiRequired", "euiReadonly", "styleClass", "euiSublabel"] }, { kind: "component", type: i8.EuiChipComponent, selector: "eui-chip, span[euiChip], li[euiChip]", inputs: ["euiInternalId", "tooltipMessage", "data", "isChipRemovable", "isSquared"], outputs: ["remove"] }, { kind: "component", type: i9.EuiTabsComponent, selector: "eui-tabs", inputs: ["styleClass", "tabs", "isMainNavigation", "isSubTabs", "activeTabIndex", "isVerticalTabs", "e2eAttr", "pathMatch"], outputs: ["tabClosed", "tabSelected"] }, { kind: "component", type: i9.EuiTabComponent, selector: "eui-tab", inputs: ["isClosable", "url", "e2eAttr", "isVisible", "isActive", "isDisabled", "hasBackgroundFilled", "tooltip"] }, { kind: "component", type: i9.EuiTabLabelComponent, selector: "eui-tab-label, euiTabLabel" }, { kind: "component", type: i9.EuiTabContentComponent, selector: "eui-tab-content, euiTabContent", inputs: ["hasNoContentPadding"] }, { kind: "component", type: i10.DocPageCodeComponent, selector: "eui-showcase-doc-page-code", inputs: ["codeFolder", "showcase"] }], encapsulation: i0.ViewEncapsulation.None });
224
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: DocPageComponent, decorators: [{
222
+ /** @nocollapse */ DocPageComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: DocPageComponent, deps: [{ token: i1.Router }, { token: i1.ActivatedRoute }, { token: i2.UxAppShellService }, { token: i3.DomSanitizer }, { token: i4.Location }], target: i0.ɵɵFactoryTarget.Component });
223
+ /** @nocollapse */ DocPageComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.1", type: DocPageComponent, selector: "eui-showcase-doc-page", inputs: { id: "id", label: "label", subLabel: "subLabel", isNotReady: "isNotReady", isDeprecated: "isDeprecated", codeFolder: "codeFolder", showcase: "showcase" }, queries: [{ propertyName: "samples", predicate: DocSampleComponent, descendants: true }, { propertyName: "sections", predicate: DocSectionComponent, descendants: true }, { propertyName: "pageOverviewContent", predicate: i0.forwardRef(function () { return DocPageOverviewContentDirective; }) }, { propertyName: "pageSamplesContent", predicate: i0.forwardRef(function () { return DocPageSamplesContentDirective; }) }, { propertyName: "pageSectionsContent", predicate: i0.forwardRef(function () { return DocPageSectionsContentDirective; }) }, { propertyName: "pageInteractiveContent", predicate: i0.forwardRef(function () { return DocPageInteractiveContentDirective; }) }, { propertyName: "pageAccessibilityContent", predicate: i0.forwardRef(function () { return DocPageAccessibilityContentDirective; }) }, { propertyName: "pageApiContent", predicate: i0.forwardRef(function () { return DocPageApiContentDirective; }) }, { propertyName: "pageThemingContent", predicate: i0.forwardRef(function () { return DocPageThemingContentDirective; }) }], viewQueries: [{ propertyName: "tabsContent", first: true, predicate: ["tabsContent"], descendants: true }], ngImport: i0, template: "<div class=\"doc-page-navigation-wrapper\" [class.eui-u-hidden]=\"isLoading\">\n <div class=\"doc-page-main-column\">\n <eui-page>\n <eui-page-header label=\"{{label}}\" subLabel=\"{{subLabel}}\">\n <eui-page-header-action-items>\n <eui-showcase-doc-page-code *ngIf=\"codeFolder\" codeFolder=\"{{codeFolder}}\" showcase=\"{{showcase}}\"></eui-showcase-doc-page-code>\n <eui-chip *ngIf=\"stateLabel\" [euiSuccess]=\"stateLabel === 'ACTIVE'\" [euiWarning]=\"stateLabel === 'NOT READY'\" [euiDanger]=\"stateLabel === 'DEPRECATED'\">\n <span euiLabel><strong>{{stateLabel}}</strong></span>\n </eui-chip>\n </eui-page-header-action-items>\n </eui-page-header>\n\n <eui-page-content>\n <ux-alert *ngIf=\"stateLabel === 'NOT READY' || isNotReady\" typeClass=\"warning\">\n <p>\n This component <strong class=\"eui-u-color-warning-darkester-2\">is not ready for production</strong> usage yet, it's API is still subject to change during the coming weeks.\n </p>\n <p>\n For experimentation use only.\n </p>\n </ux-alert>\n\n <ux-alert *ngIf=\"stateLabel === 'DEPRECATED' || isDeprecated\" typeClass=\"danger\">\n <p>\n This component has been <strong class=\"eui-u-color-danger\">deprecated</strong>\n </p>\n <div *ngIf=\"cmp\">\n <div *ngIf=\"cmp.cmpReplacement !== 'NONE'\">\n It has been replaced by : <strong class=\"eui-u-color-success-darkest\">{{cmp.cmpReplacement}}</strong>.\n <!-- <br><br>\n You can find more information on the new component here : <a [routerLink]=\"cmp.cmpReplacementUrl\">{{cmp.cmpReplacementUrl}}</a> -->\n </div>\n <div *ngIf=\"cmp.cmpReplacement === 'NONE'\">\n This component will be <strong>discontinued in future version of eUI</strong>\n </div>\n <div *ngIf=\"cmp.cmpReplacementNote\">\n <strong class=\"eui-u-color-warning\">{{cmp.cmpReplacementNote}}</strong>\n </div>\n </div>\n </ux-alert>\n\n <div *ngIf=\"(stateLabel || isNotReady || isDeprecated) && stateLabel !== 'ACTIVE'\" class=\"mb-5\"></div>\n\n\n <eui-tabs #tabsContent *ngIf=\"pageSectionsContent.length === 0\" (tabSelected)=\"onTabSelected($event)\">\n <eui-tab>\n <euiTabLabel>\n OVERVIEW\n </euiTabLabel>\n <euiTabContent>\n <h4 id=\"overview\" class=\"eui-u-font-bold eui-u-color-info mt-3 mb-2\">Overview</h4>\n <div *ngIf=\"pageOverviewContent.length > 0; else noOverview\">\n <ng-content select=\"docPageOverview\"></ng-content>\n </div>\n <ng-template #noOverview>\n Coming soon...\n </ng-template>\n </euiTabContent>\n </eui-tab>\n\n <eui-tab>\n <euiTabLabel>\n API\n </euiTabLabel>\n <euiTabContent>\n <ng-container *ngIf=\"apiUrlSafe\">\n <div class=\"flex-container\">\n <a href=\"{{apiUrl}}\" target=\"_blank\" class=\"ms-auto pb-2 eui-u-text-link-external\">Open API page</a>\n </div>\n <div class=\"doc-page-api-iframe-wrapper\">\n <iframe id=\"iframe_api\" [width]=\"'100%'\" height=\"700px\" frameBorder=\"0\" [src]=\"apiUrlSafe\"></iframe>\n </div>\n </ng-container>\n </euiTabContent>\n </eui-tab>\n\n <eui-tab>\n <euiTabLabel>\n A11Y\n </euiTabLabel>\n <euiTabContent>\n <h4 id=\"accessibility\" class=\"eui-u-font-bold eui-u-color-info mt-3 mb-2\">Accessibility</h4>\n <ng-content select=\"docPageAccessibility\"></ng-content>\n </euiTabContent>\n </eui-tab>\n\n <eui-tab>\n <euiTabLabel>\n OPTIONS & SAMPLES\n </euiTabLabel>\n <euiTabContent>\n <h4 id=\"samples\" class=\"eui-u-font-bold eui-u-color-info mt-3 mb-2\">Options & samples</h4>\n <ng-content select=\"docPageSamples\"></ng-content>\n </euiTabContent>\n </eui-tab>\n\n\n <eui-tab *ngIf=\"pageThemingContent.length > 0\">\n <euiTabLabel>\n THEMING\n </euiTabLabel>\n <euiTabContent>\n <h4 id=\"theming\" class=\"eui-u-font-bold eui-u-color-info mt-3 mb-2\">Theming</h4>\n <ng-content select=\"docPageTheming\"></ng-content>\n </euiTabContent>\n </eui-tab>\n\n <eui-tab *ngIf=\"pageInteractiveContent.length > 0\">\n <euiTabLabel>\n ADVANCED EXAMPLES\n </euiTabLabel>\n <euiTabContent>\n <h4 id=\"interactive\" class=\"eui-u-font-bold eui-u-color-info mt-3 mb-2\">Advanced use cases</h4>\n <ng-content select=\"docPageInteractive\"></ng-content>\n </euiTabContent>\n </eui-tab>\n </eui-tabs>\n\n <ng-container *ngIf=\"pageSectionsContent.length > 0\">\n <h4 id=\"demo\" *ngIf=\"sections.length === 0\" class=\"eui-u-font-bold eui-u-color-info mt-3 mb-2\">Demo</h4>\n <ng-content select=\"docPageSections\"></ng-content>\n </ng-container>\n </eui-page-content>\n </eui-page>\n </div>\n\n <div class=\"doc-page-navigation-column eui-u-hidden-desktop-down\">\n <div id=\"doc-page-nav\">\n <div class=\"doc-page-navigation-title\">In this page</div>\n <div class=\"doc-page-navigation-content\" tabindex=\"0\">\n <ul class=\"doc-page-navigation\">\n <ng-container *ngIf=\"pageSectionsContent.length === 0\">\n <!-- ALWAYS PRESENT in each page-->\n <li class=\"doc-page-navigation-item\" [class.doc-page-navigation-item--selected]=\"fragmentId === 'overview'\" (click)=\"onNavClick('overview', 0)\"><span>OVERVIEW</span></li>\n <li class=\"doc-page-navigation-item\" [class.doc-page-navigation-item--selected]=\"fragmentId === 'api'\" (click)=\"onNavClick('api', 1)\"><span>API</span></li>\n <li class=\"doc-page-navigation-item\" [class.doc-page-navigation-item--selected]=\"fragmentId === 'a11y'\" (click)=\"onNavClick('a11y', 2)\"><span>A11Y</span></li>\n <li class=\"doc-page-navigation-item\" [class.doc-page-navigation-item--selected]=\"fragmentId === 'samples'\" (click)=\"onNavClick('samples', 3)\"><span>OPTIONS & SAMPLES</span></li>\n <li class=\"doc-page-navigation-item doc-page-navigation-sub\">\n <ul *ngFor=\"let sample of samples\">\n <li class=\"doc-page-navigation-item\" [class.doc-page-navigation-item--selected]=\"fragmentId === sample.id\" (click)=\"onNavClick(sample.id, 3)\"><span>{{sample.label}}</span></li>\n </ul>\n </li>\n\n <!-- OPTIONAL TABS-->\n <li *ngIf=\"pageThemingContent.length > 0\" class=\"doc-page-navigation-item\" [class.doc-page-navigation-item--selected]=\"fragmentId === 'theming'\" (click)=\"onNavClick('theming', 4)\"><span>THEMING</span></li>\n <li *ngIf=\"pageInteractiveContent.length > 0\" class=\"doc-page-navigation-item\" [class.doc-page-navigation-item--selected]=\"fragmentId === 'advanced'\" (click)=\"onNavClick('advanced', 5)\"><span>ADVANCED EXAMPLES</span></li>\n </ng-container>\n\n <ng-container *ngIf=\"pageSectionsContent.length > 0\">\n <li class=\"doc-page-navigation-item\" [class.doc-page-navigation-item--selected]=\"fragmentId === 'sections'\" (click)=\"onNavClick('sections', null)\"><span>Sections</span></li>\n <li *ngIf=\"sections.length === 0\" class=\"doc-page-navigation-item\" [class.doc-page-navigation-item--selected]=\"fragmentId === 'demo'\" (click)=\"onNavClick('demo', null)\"><span>Demo</span></li>\n <li *ngIf=\"sections.length > 0\" class=\"doc-page-navigation-item doc-page-navigation-sub\">\n <ul *ngFor=\"let section of sections\">\n <li class=\"doc-page-navigation-item\" [class.doc-page-navigation-item--selected]=\"fragmentId === section.id\" (click)=\"onNavClick(section.id, null)\"><span>{{section.label}}</span></li>\n </ul>\n </li>\n </ng-container>\n </ul>\n </div>\n </div>\n </div>\n</div>\n", styles: [".doc-page-navigation-wrapper{display:flex;flex-wrap:wrap;width:100%}.doc-page-navigation-wrapper .doc-page-main-column{padding-right:var(--eui-base-spacing-m);width:calc(100% - 400px)}.doc-page-navigation-wrapper .doc-page-navigation-column{background:var(--eui-base-color-white);box-shadow:0 8px 10px #b7c0ce33;position:fixed;right:0;transition:all ease-in-out .25s;width:400px;z-index:99;box-shadow:var(--eui-base-shadow-1)}.doc-page-navigation-wrapper .doc-page-navigation-column:hover{width:400px}.doc-page-navigation-title{font-weight:700;padding:var(--eui-base-spacing-s)}.doc-page-navigation-content{display:block;height:100vh;max-height:calc(100vh - 6rem);overflow-y:auto;width:100%}.doc-page-navigation-content::-webkit-scrollbar{display:inherit;height:6px;width:6px;background-color:var(--eui-base-color-grey-10)}.doc-page-navigation-content::-webkit-scrollbar-thumb{background-color:var(--eui-base-color-grey-20);border-radius:5rem}.doc-page-navigation-content::-webkit-scrollbar-thumb:hover{background-color:var(--eui-base-color-grey-25)}.doc-page-navigation-content::-webkit-scrollbar-track{background-color:var(--eui-base-color-grey-10);border-radius:0}.doc-page-navigation{background-color:transparent;border-left:2px solid transparent;padding-top:var(--eui-base-spacing-xs)}.doc-page-navigation .doc-page-navigation-item{color:var(--eui-base-color-primary-100);cursor:pointer;line-height:1.5;overflow:hidden;padding:var(--eui-base-spacing-2xs);text-overflow:ellipsis;transition:background-color ease-in .2s;white-space:nowrap}.doc-page-navigation .doc-page-navigation-item span{font-weight:700;padding-left:var(--eui-base-spacing-xs)}.doc-page-navigation .doc-page-navigation-item:not(.doc-page-navigation-sub):hover{background-color:var(--eui-base-color-grey-5);border-left:2px solid var(--eui-base-color-info-100)}.doc-page-navigation .doc-page-navigation-item.doc-page-navigation-sub .doc-page-navigation-item span{font-weight:400;padding-left:var(--eui-base-spacing-m)}.doc-page-navigation .doc-page-navigation-item.doc-page-navigation-sub .doc-page-navigation-item:hover{background-color:var(--eui-base-color-grey-5);border-left:2px solid var(--eui-base-color-grey-15)}.doc-page-navigation .doc-page-navigation-item.doc-page-navigation-item--selected{background-color:var(--eui-base-color-grey-5);border-left:2px solid var(--eui-base-color-info-100)}.doc-page-api-iframe-wrapper{display:flex;justify-content:space-around;margin:0}@media screen and (max-width: 767px){.doc-page-navigation-wrapper .doc-page-main-column{padding-right:0;width:100%}.doc-page-navigation-wrapper .doc-page-navigation-column{display:none;width:0}}@media screen and (min-width: 768px) and (max-width: 995px){.doc-page-navigation-wrapper .doc-page-main-column{width:80%}.doc-page-navigation-wrapper .doc-page-navigation-column{width:20%}}@media screen and (max-width: 1550px){.doc-page-api-iframe-wrapper{display:none}}\n"], dependencies: [{ kind: "directive", type: i4.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i5.UxAlertComponent, selector: "ux-alert", inputs: ["styleClass", "typeClass", "iconClass", "isMuted", "isCloseable", "e2eAttr"], outputs: ["close"] }, { kind: "component", type: i6.EuiPageComponent, selector: "eui-page" }, { kind: "component", type: i6.EuiPageContentComponent, selector: "eui-page-content" }, { kind: "component", type: i6.EuiPageHeaderComponent, selector: "eui-page-header", inputs: ["label", "subLabel", "isCollapsible", "isCollapsed", "collapsedLabel", "expandedLabel"], outputs: ["collapse"] }, { kind: "directive", type: i6.EuiPageHeaderActionItemsContentDirective, selector: "eui-page-header-action-items" }, { kind: "component", type: i7.EuiLabelComponent, selector: "label[euiLabel], span[euiLabel], div[euiLabel], a[euiLabel], eui-label, label[euiSublabel], span[euiSublabel], div[euiSublabel], a[euiSublabel], eui-sublabel", inputs: ["euiRequired", "euiReadonly", "styleClass", "euiSublabel"] }, { kind: "component", type: i8.EuiChipComponent, selector: "eui-chip, span[euiChip], li[euiChip]", inputs: ["euiInternalId", "tooltipMessage", "data", "isChipRemovable", "isSquared"], outputs: ["remove"] }, { kind: "component", type: i9.EuiTabsComponent, selector: "eui-tabs", inputs: ["styleClass", "tabs", "isMainNavigation", "isSubTabs", "activeTabIndex", "isVerticalTabs", "e2eAttr", "pathMatch"], outputs: ["tabClosed", "tabSelected"] }, { kind: "component", type: i9.EuiTabComponent, selector: "eui-tab", inputs: ["isClosable", "url", "e2eAttr", "isVisible", "isActive", "isDisabled", "hasBackgroundFilled", "tooltip"] }, { kind: "component", type: i9.EuiTabLabelComponent, selector: "eui-tab-label, euiTabLabel" }, { kind: "component", type: i9.EuiTabContentComponent, selector: "eui-tab-content, euiTabContent", inputs: ["hasNoContentPadding"] }, { kind: "component", type: i10.DocPageCodeComponent, selector: "eui-showcase-doc-page-code", inputs: ["codeFolder", "showcase"] }], encapsulation: i0.ViewEncapsulation.None });
224
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: DocPageComponent, decorators: [{
225
225
  type: Component,
226
226
  args: [{ selector: 'eui-showcase-doc-page', encapsulation: ViewEncapsulation.None, template: "<div class=\"doc-page-navigation-wrapper\" [class.eui-u-hidden]=\"isLoading\">\n <div class=\"doc-page-main-column\">\n <eui-page>\n <eui-page-header label=\"{{label}}\" subLabel=\"{{subLabel}}\">\n <eui-page-header-action-items>\n <eui-showcase-doc-page-code *ngIf=\"codeFolder\" codeFolder=\"{{codeFolder}}\" showcase=\"{{showcase}}\"></eui-showcase-doc-page-code>\n <eui-chip *ngIf=\"stateLabel\" [euiSuccess]=\"stateLabel === 'ACTIVE'\" [euiWarning]=\"stateLabel === 'NOT READY'\" [euiDanger]=\"stateLabel === 'DEPRECATED'\">\n <span euiLabel><strong>{{stateLabel}}</strong></span>\n </eui-chip>\n </eui-page-header-action-items>\n </eui-page-header>\n\n <eui-page-content>\n <ux-alert *ngIf=\"stateLabel === 'NOT READY' || isNotReady\" typeClass=\"warning\">\n <p>\n This component <strong class=\"eui-u-color-warning-darkester-2\">is not ready for production</strong> usage yet, it's API is still subject to change during the coming weeks.\n </p>\n <p>\n For experimentation use only.\n </p>\n </ux-alert>\n\n <ux-alert *ngIf=\"stateLabel === 'DEPRECATED' || isDeprecated\" typeClass=\"danger\">\n <p>\n This component has been <strong class=\"eui-u-color-danger\">deprecated</strong>\n </p>\n <div *ngIf=\"cmp\">\n <div *ngIf=\"cmp.cmpReplacement !== 'NONE'\">\n It has been replaced by : <strong class=\"eui-u-color-success-darkest\">{{cmp.cmpReplacement}}</strong>.\n <!-- <br><br>\n You can find more information on the new component here : <a [routerLink]=\"cmp.cmpReplacementUrl\">{{cmp.cmpReplacementUrl}}</a> -->\n </div>\n <div *ngIf=\"cmp.cmpReplacement === 'NONE'\">\n This component will be <strong>discontinued in future version of eUI</strong>\n </div>\n <div *ngIf=\"cmp.cmpReplacementNote\">\n <strong class=\"eui-u-color-warning\">{{cmp.cmpReplacementNote}}</strong>\n </div>\n </div>\n </ux-alert>\n\n <div *ngIf=\"(stateLabel || isNotReady || isDeprecated) && stateLabel !== 'ACTIVE'\" class=\"mb-5\"></div>\n\n\n <eui-tabs #tabsContent *ngIf=\"pageSectionsContent.length === 0\" (tabSelected)=\"onTabSelected($event)\">\n <eui-tab>\n <euiTabLabel>\n OVERVIEW\n </euiTabLabel>\n <euiTabContent>\n <h4 id=\"overview\" class=\"eui-u-font-bold eui-u-color-info mt-3 mb-2\">Overview</h4>\n <div *ngIf=\"pageOverviewContent.length > 0; else noOverview\">\n <ng-content select=\"docPageOverview\"></ng-content>\n </div>\n <ng-template #noOverview>\n Coming soon...\n </ng-template>\n </euiTabContent>\n </eui-tab>\n\n <eui-tab>\n <euiTabLabel>\n API\n </euiTabLabel>\n <euiTabContent>\n <ng-container *ngIf=\"apiUrlSafe\">\n <div class=\"flex-container\">\n <a href=\"{{apiUrl}}\" target=\"_blank\" class=\"ms-auto pb-2 eui-u-text-link-external\">Open API page</a>\n </div>\n <div class=\"doc-page-api-iframe-wrapper\">\n <iframe id=\"iframe_api\" [width]=\"'100%'\" height=\"700px\" frameBorder=\"0\" [src]=\"apiUrlSafe\"></iframe>\n </div>\n </ng-container>\n </euiTabContent>\n </eui-tab>\n\n <eui-tab>\n <euiTabLabel>\n A11Y\n </euiTabLabel>\n <euiTabContent>\n <h4 id=\"accessibility\" class=\"eui-u-font-bold eui-u-color-info mt-3 mb-2\">Accessibility</h4>\n <ng-content select=\"docPageAccessibility\"></ng-content>\n </euiTabContent>\n </eui-tab>\n\n <eui-tab>\n <euiTabLabel>\n OPTIONS & SAMPLES\n </euiTabLabel>\n <euiTabContent>\n <h4 id=\"samples\" class=\"eui-u-font-bold eui-u-color-info mt-3 mb-2\">Options & samples</h4>\n <ng-content select=\"docPageSamples\"></ng-content>\n </euiTabContent>\n </eui-tab>\n\n\n <eui-tab *ngIf=\"pageThemingContent.length > 0\">\n <euiTabLabel>\n THEMING\n </euiTabLabel>\n <euiTabContent>\n <h4 id=\"theming\" class=\"eui-u-font-bold eui-u-color-info mt-3 mb-2\">Theming</h4>\n <ng-content select=\"docPageTheming\"></ng-content>\n </euiTabContent>\n </eui-tab>\n\n <eui-tab *ngIf=\"pageInteractiveContent.length > 0\">\n <euiTabLabel>\n ADVANCED EXAMPLES\n </euiTabLabel>\n <euiTabContent>\n <h4 id=\"interactive\" class=\"eui-u-font-bold eui-u-color-info mt-3 mb-2\">Advanced use cases</h4>\n <ng-content select=\"docPageInteractive\"></ng-content>\n </euiTabContent>\n </eui-tab>\n </eui-tabs>\n\n <ng-container *ngIf=\"pageSectionsContent.length > 0\">\n <h4 id=\"demo\" *ngIf=\"sections.length === 0\" class=\"eui-u-font-bold eui-u-color-info mt-3 mb-2\">Demo</h4>\n <ng-content select=\"docPageSections\"></ng-content>\n </ng-container>\n </eui-page-content>\n </eui-page>\n </div>\n\n <div class=\"doc-page-navigation-column eui-u-hidden-desktop-down\">\n <div id=\"doc-page-nav\">\n <div class=\"doc-page-navigation-title\">In this page</div>\n <div class=\"doc-page-navigation-content\" tabindex=\"0\">\n <ul class=\"doc-page-navigation\">\n <ng-container *ngIf=\"pageSectionsContent.length === 0\">\n <!-- ALWAYS PRESENT in each page-->\n <li class=\"doc-page-navigation-item\" [class.doc-page-navigation-item--selected]=\"fragmentId === 'overview'\" (click)=\"onNavClick('overview', 0)\"><span>OVERVIEW</span></li>\n <li class=\"doc-page-navigation-item\" [class.doc-page-navigation-item--selected]=\"fragmentId === 'api'\" (click)=\"onNavClick('api', 1)\"><span>API</span></li>\n <li class=\"doc-page-navigation-item\" [class.doc-page-navigation-item--selected]=\"fragmentId === 'a11y'\" (click)=\"onNavClick('a11y', 2)\"><span>A11Y</span></li>\n <li class=\"doc-page-navigation-item\" [class.doc-page-navigation-item--selected]=\"fragmentId === 'samples'\" (click)=\"onNavClick('samples', 3)\"><span>OPTIONS & SAMPLES</span></li>\n <li class=\"doc-page-navigation-item doc-page-navigation-sub\">\n <ul *ngFor=\"let sample of samples\">\n <li class=\"doc-page-navigation-item\" [class.doc-page-navigation-item--selected]=\"fragmentId === sample.id\" (click)=\"onNavClick(sample.id, 3)\"><span>{{sample.label}}</span></li>\n </ul>\n </li>\n\n <!-- OPTIONAL TABS-->\n <li *ngIf=\"pageThemingContent.length > 0\" class=\"doc-page-navigation-item\" [class.doc-page-navigation-item--selected]=\"fragmentId === 'theming'\" (click)=\"onNavClick('theming', 4)\"><span>THEMING</span></li>\n <li *ngIf=\"pageInteractiveContent.length > 0\" class=\"doc-page-navigation-item\" [class.doc-page-navigation-item--selected]=\"fragmentId === 'advanced'\" (click)=\"onNavClick('advanced', 5)\"><span>ADVANCED EXAMPLES</span></li>\n </ng-container>\n\n <ng-container *ngIf=\"pageSectionsContent.length > 0\">\n <li class=\"doc-page-navigation-item\" [class.doc-page-navigation-item--selected]=\"fragmentId === 'sections'\" (click)=\"onNavClick('sections', null)\"><span>Sections</span></li>\n <li *ngIf=\"sections.length === 0\" class=\"doc-page-navigation-item\" [class.doc-page-navigation-item--selected]=\"fragmentId === 'demo'\" (click)=\"onNavClick('demo', null)\"><span>Demo</span></li>\n <li *ngIf=\"sections.length > 0\" class=\"doc-page-navigation-item doc-page-navigation-sub\">\n <ul *ngFor=\"let section of sections\">\n <li class=\"doc-page-navigation-item\" [class.doc-page-navigation-item--selected]=\"fragmentId === section.id\" (click)=\"onNavClick(section.id, null)\"><span>{{section.label}}</span></li>\n </ul>\n </li>\n </ng-container>\n </ul>\n </div>\n </div>\n </div>\n</div>\n", styles: [".doc-page-navigation-wrapper{display:flex;flex-wrap:wrap;width:100%}.doc-page-navigation-wrapper .doc-page-main-column{padding-right:var(--eui-base-spacing-m);width:calc(100% - 400px)}.doc-page-navigation-wrapper .doc-page-navigation-column{background:var(--eui-base-color-white);box-shadow:0 8px 10px #b7c0ce33;position:fixed;right:0;transition:all ease-in-out .25s;width:400px;z-index:99;box-shadow:var(--eui-base-shadow-1)}.doc-page-navigation-wrapper .doc-page-navigation-column:hover{width:400px}.doc-page-navigation-title{font-weight:700;padding:var(--eui-base-spacing-s)}.doc-page-navigation-content{display:block;height:100vh;max-height:calc(100vh - 6rem);overflow-y:auto;width:100%}.doc-page-navigation-content::-webkit-scrollbar{display:inherit;height:6px;width:6px;background-color:var(--eui-base-color-grey-10)}.doc-page-navigation-content::-webkit-scrollbar-thumb{background-color:var(--eui-base-color-grey-20);border-radius:5rem}.doc-page-navigation-content::-webkit-scrollbar-thumb:hover{background-color:var(--eui-base-color-grey-25)}.doc-page-navigation-content::-webkit-scrollbar-track{background-color:var(--eui-base-color-grey-10);border-radius:0}.doc-page-navigation{background-color:transparent;border-left:2px solid transparent;padding-top:var(--eui-base-spacing-xs)}.doc-page-navigation .doc-page-navigation-item{color:var(--eui-base-color-primary-100);cursor:pointer;line-height:1.5;overflow:hidden;padding:var(--eui-base-spacing-2xs);text-overflow:ellipsis;transition:background-color ease-in .2s;white-space:nowrap}.doc-page-navigation .doc-page-navigation-item span{font-weight:700;padding-left:var(--eui-base-spacing-xs)}.doc-page-navigation .doc-page-navigation-item:not(.doc-page-navigation-sub):hover{background-color:var(--eui-base-color-grey-5);border-left:2px solid var(--eui-base-color-info-100)}.doc-page-navigation .doc-page-navigation-item.doc-page-navigation-sub .doc-page-navigation-item span{font-weight:400;padding-left:var(--eui-base-spacing-m)}.doc-page-navigation .doc-page-navigation-item.doc-page-navigation-sub .doc-page-navigation-item:hover{background-color:var(--eui-base-color-grey-5);border-left:2px solid var(--eui-base-color-grey-15)}.doc-page-navigation .doc-page-navigation-item.doc-page-navigation-item--selected{background-color:var(--eui-base-color-grey-5);border-left:2px solid var(--eui-base-color-info-100)}.doc-page-api-iframe-wrapper{display:flex;justify-content:space-around;margin:0}@media screen and (max-width: 767px){.doc-page-navigation-wrapper .doc-page-main-column{padding-right:0;width:100%}.doc-page-navigation-wrapper .doc-page-navigation-column{display:none;width:0}}@media screen and (min-width: 768px) and (max-width: 995px){.doc-page-navigation-wrapper .doc-page-main-column{width:80%}.doc-page-navigation-wrapper .doc-page-navigation-column{width:20%}}@media screen and (max-width: 1550px){.doc-page-api-iframe-wrapper{display:none}}\n"] }]
227
227
  }], ctorParameters: function () { return [{ type: i1.Router }, { type: i1.ActivatedRoute }, { type: i2.UxAppShellService }, { type: i3.DomSanitizer }, { type: i4.Location }]; }, propDecorators: { id: [{
@@ -272,57 +272,57 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImpor
272
272
  /* tslint:disable */
273
273
  export class DocPageOverviewContentDirective {
274
274
  }
275
- /** @nocollapse */ DocPageOverviewContentDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: DocPageOverviewContentDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
276
- /** @nocollapse */ DocPageOverviewContentDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.0.0", type: DocPageOverviewContentDirective, selector: "docPageOverview", ngImport: i0 });
277
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: DocPageOverviewContentDirective, decorators: [{
275
+ /** @nocollapse */ DocPageOverviewContentDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: DocPageOverviewContentDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
276
+ /** @nocollapse */ DocPageOverviewContentDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.0.1", type: DocPageOverviewContentDirective, selector: "docPageOverview", ngImport: i0 });
277
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: DocPageOverviewContentDirective, decorators: [{
278
278
  type: Directive,
279
279
  args: [{ selector: 'docPageOverview' }]
280
280
  }] });
281
281
  export class DocPageInteractiveContentDirective {
282
282
  }
283
- /** @nocollapse */ DocPageInteractiveContentDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: DocPageInteractiveContentDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
284
- /** @nocollapse */ DocPageInteractiveContentDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.0.0", type: DocPageInteractiveContentDirective, selector: "docPageInteractive", ngImport: i0 });
285
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: DocPageInteractiveContentDirective, decorators: [{
283
+ /** @nocollapse */ DocPageInteractiveContentDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: DocPageInteractiveContentDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
284
+ /** @nocollapse */ DocPageInteractiveContentDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.0.1", type: DocPageInteractiveContentDirective, selector: "docPageInteractive", ngImport: i0 });
285
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: DocPageInteractiveContentDirective, decorators: [{
286
286
  type: Directive,
287
287
  args: [{ selector: 'docPageInteractive' }]
288
288
  }] });
289
289
  export class DocPageSamplesContentDirective {
290
290
  }
291
- /** @nocollapse */ DocPageSamplesContentDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: DocPageSamplesContentDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
292
- /** @nocollapse */ DocPageSamplesContentDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.0.0", type: DocPageSamplesContentDirective, selector: "docPageSamples", ngImport: i0 });
293
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: DocPageSamplesContentDirective, decorators: [{
291
+ /** @nocollapse */ DocPageSamplesContentDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: DocPageSamplesContentDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
292
+ /** @nocollapse */ DocPageSamplesContentDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.0.1", type: DocPageSamplesContentDirective, selector: "docPageSamples", ngImport: i0 });
293
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: DocPageSamplesContentDirective, decorators: [{
294
294
  type: Directive,
295
295
  args: [{ selector: 'docPageSamples' }]
296
296
  }] });
297
297
  export class DocPageSectionsContentDirective {
298
298
  }
299
- /** @nocollapse */ DocPageSectionsContentDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: DocPageSectionsContentDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
300
- /** @nocollapse */ DocPageSectionsContentDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.0.0", type: DocPageSectionsContentDirective, selector: "docPageSections", ngImport: i0 });
301
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: DocPageSectionsContentDirective, decorators: [{
299
+ /** @nocollapse */ DocPageSectionsContentDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: DocPageSectionsContentDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
300
+ /** @nocollapse */ DocPageSectionsContentDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.0.1", type: DocPageSectionsContentDirective, selector: "docPageSections", ngImport: i0 });
301
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: DocPageSectionsContentDirective, decorators: [{
302
302
  type: Directive,
303
303
  args: [{ selector: 'docPageSections' }]
304
304
  }] });
305
305
  export class DocPageAccessibilityContentDirective {
306
306
  }
307
- /** @nocollapse */ DocPageAccessibilityContentDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: DocPageAccessibilityContentDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
308
- /** @nocollapse */ DocPageAccessibilityContentDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.0.0", type: DocPageAccessibilityContentDirective, selector: "docPageAccessibility", ngImport: i0 });
309
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: DocPageAccessibilityContentDirective, decorators: [{
307
+ /** @nocollapse */ DocPageAccessibilityContentDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: DocPageAccessibilityContentDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
308
+ /** @nocollapse */ DocPageAccessibilityContentDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.0.1", type: DocPageAccessibilityContentDirective, selector: "docPageAccessibility", ngImport: i0 });
309
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: DocPageAccessibilityContentDirective, decorators: [{
310
310
  type: Directive,
311
311
  args: [{ selector: 'docPageAccessibility' }]
312
312
  }] });
313
313
  export class DocPageApiContentDirective {
314
314
  }
315
- /** @nocollapse */ DocPageApiContentDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: DocPageApiContentDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
316
- /** @nocollapse */ DocPageApiContentDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.0.0", type: DocPageApiContentDirective, selector: "docPageApi", ngImport: i0 });
317
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: DocPageApiContentDirective, decorators: [{
315
+ /** @nocollapse */ DocPageApiContentDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: DocPageApiContentDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
316
+ /** @nocollapse */ DocPageApiContentDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.0.1", type: DocPageApiContentDirective, selector: "docPageApi", ngImport: i0 });
317
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: DocPageApiContentDirective, decorators: [{
318
318
  type: Directive,
319
319
  args: [{ selector: 'docPageApi' }]
320
320
  }] });
321
321
  export class DocPageThemingContentDirective {
322
322
  }
323
- /** @nocollapse */ DocPageThemingContentDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: DocPageThemingContentDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
324
- /** @nocollapse */ DocPageThemingContentDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.0.0", type: DocPageThemingContentDirective, selector: "docPageTheming", ngImport: i0 });
325
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: DocPageThemingContentDirective, decorators: [{
323
+ /** @nocollapse */ DocPageThemingContentDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: DocPageThemingContentDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
324
+ /** @nocollapse */ DocPageThemingContentDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.0.1", type: DocPageThemingContentDirective, selector: "docPageTheming", ngImport: i0 });
325
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: DocPageThemingContentDirective, decorators: [{
326
326
  type: Directive,
327
327
  args: [{ selector: 'docPageTheming' }]
328
328
  }] });
@@ -13,9 +13,9 @@ export class DocPageCodeComponent {
13
13
  window.open(sourceRootPath + this.codeFolder, '_blank');
14
14
  }
15
15
  }
16
- /** @nocollapse */ DocPageCodeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: DocPageCodeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
17
- /** @nocollapse */ DocPageCodeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: DocPageCodeComponent, selector: "eui-showcase-doc-page-code", inputs: { codeFolder: "codeFolder", showcase: "showcase" }, ngImport: i0, template: "<button euiButton euiAccent (click)=\"onOpenCode()\">\n <span euiLabel>Check the code</span>\n <span euiIcon iconClass=\"eui-icon eui-icon-code\"></span>\n</button>\n", dependencies: [{ kind: "component", type: i1.EuiIconComponent, selector: "span[euiIcon], i[euiIcon], eui-icon", inputs: ["iconClass", "isLoading", "aria-label"] }, { kind: "component", type: i1.EuiLabelComponent, selector: "label[euiLabel], span[euiLabel], div[euiLabel], a[euiLabel], eui-label, label[euiSublabel], span[euiSublabel], div[euiSublabel], a[euiSublabel], eui-sublabel", inputs: ["euiRequired", "euiReadonly", "styleClass", "euiSublabel"] }, { kind: "component", type: i2.EuiButtonComponent, selector: "button[euiButton], a[euiButton]", inputs: ["euiBasicButton", "euiButtonCall", "euiBlockButton", "euiRaisedButton", "isLoading", "euiIconButton", "euiLineWrap", "e2eAttr"] }] });
18
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: DocPageCodeComponent, decorators: [{
16
+ /** @nocollapse */ DocPageCodeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: DocPageCodeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
17
+ /** @nocollapse */ DocPageCodeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.1", type: DocPageCodeComponent, selector: "eui-showcase-doc-page-code", inputs: { codeFolder: "codeFolder", showcase: "showcase" }, ngImport: i0, template: "<button euiButton euiAccent (click)=\"onOpenCode()\">\n <span euiLabel>Check the code</span>\n <span euiIcon iconClass=\"eui-icon eui-icon-code\"></span>\n</button>\n", dependencies: [{ kind: "component", type: i1.EuiIconComponent, selector: "span[euiIcon], i[euiIcon], eui-icon", inputs: ["iconClass", "isLoading", "aria-label"] }, { kind: "component", type: i1.EuiLabelComponent, selector: "label[euiLabel], span[euiLabel], div[euiLabel], a[euiLabel], eui-label, label[euiSublabel], span[euiSublabel], div[euiSublabel], a[euiSublabel], eui-sublabel", inputs: ["euiRequired", "euiReadonly", "styleClass", "euiSublabel"] }, { kind: "component", type: i2.EuiButtonComponent, selector: "button[euiButton], a[euiButton]", inputs: ["euiBasicButton", "euiButtonCall", "euiBlockButton", "euiRaisedButton", "isLoading", "euiIconButton", "euiLineWrap", "e2eAttr"] }] });
18
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: DocPageCodeComponent, decorators: [{
19
19
  type: Component,
20
20
  args: [{ selector: 'eui-showcase-doc-page-code', template: "<button euiButton euiAccent (click)=\"onOpenCode()\">\n <span euiLabel>Check the code</span>\n <span euiIcon iconClass=\"eui-icon eui-icon-code\"></span>\n</button>\n" }]
21
21
  }], ctorParameters: function () { return []; }, propDecorators: { codeFolder: [{
@@ -21,9 +21,9 @@ export class DocPageCodeFabComponent {
21
21
  window.open(sourceRootPath + this.codeFolder, '_blank');
22
22
  }
23
23
  }
24
- /** @nocollapse */ DocPageCodeFabComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: DocPageCodeFabComponent, deps: [{ token: i1.UxAppShellService }], target: i0.ɵɵFactoryTarget.Component });
25
- /** @nocollapse */ DocPageCodeFabComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: DocPageCodeFabComponent, selector: "eui-showcase-doc-page-code-fab", inputs: { codeFolder: "codeFolder", showcase: "showcase" }, viewQueries: [{ propertyName: "dialog", first: true, predicate: ["dialog"], descendants: true }], ngImport: i0, template: "<div class=\"eui-button-fixed\">\n <div class=\"eui-button-floating eui-button--size-2xl eui-button--icon-only eui-button--accent\">\n <span class=\"eui-icon eui-icon-code\" (click)=\"toggleCode()\"></span>\n </div>\n</div>\n\n<eui-dialog #dialog title=\"Page source code\" [hasFooter]=\"false\" (close)=\"onClose()\">\n <button euiButton euiAccent (click)=\"onOpenCode()\">\n <span class=\"eui-icon eui-icon-code\"></span> VIEW SOURCE\n </button>\n <br>\n <br>\n <ng-content></ng-content>\n <br>\n <p>Use the <kbd>View source</kbd> button to access the code source of the page.</p>\n</eui-dialog>\n", dependencies: [{ kind: "component", type: i2.EuiButtonComponent, selector: "button[euiButton], a[euiButton]", inputs: ["euiBasicButton", "euiButtonCall", "euiBlockButton", "euiRaisedButton", "isLoading", "euiIconButton", "euiLineWrap", "e2eAttr"] }, { kind: "component", type: i3.EuiDialogComponent, selector: "eui-dialog", inputs: ["e2eAttr", "title", "width", "height", "acceptLabel", "dismissLabel", "typeClass", "hasCloseButton", "hasAcceptButton", "hasDismissButton", "hasMobileCustomSize", "isClosedOnClickOutside", "isClosedOnEscape", "isHandleCloseOnDismiss", "isHandleCloseOnClose", "isHandleCloseOnAccept", "isHandleCloseOnClickOutside", "isHandleCloseOnEscape", "isMessageBox", "isDraggable", "hasNoBodyPadding", "hasFooter"], outputs: ["clickOutside", "escape", "open", "close", "dismiss", "accept"] }] });
26
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: DocPageCodeFabComponent, decorators: [{
24
+ /** @nocollapse */ DocPageCodeFabComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: DocPageCodeFabComponent, deps: [{ token: i1.UxAppShellService }], target: i0.ɵɵFactoryTarget.Component });
25
+ /** @nocollapse */ DocPageCodeFabComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.1", type: DocPageCodeFabComponent, selector: "eui-showcase-doc-page-code-fab", inputs: { codeFolder: "codeFolder", showcase: "showcase" }, viewQueries: [{ propertyName: "dialog", first: true, predicate: ["dialog"], descendants: true }], ngImport: i0, template: "<div class=\"eui-button-fixed\">\n <div class=\"eui-button-floating eui-button--size-2xl eui-button--icon-only eui-button--accent\">\n <span class=\"eui-icon eui-icon-code\" (click)=\"toggleCode()\"></span>\n </div>\n</div>\n\n<eui-dialog #dialog title=\"Page source code\" [hasFooter]=\"false\" (close)=\"onClose()\">\n <button euiButton euiAccent (click)=\"onOpenCode()\">\n <span class=\"eui-icon eui-icon-code\"></span> VIEW SOURCE\n </button>\n <br>\n <br>\n <ng-content></ng-content>\n <br>\n <p>Use the <kbd>View source</kbd> button to access the code source of the page.</p>\n</eui-dialog>\n", dependencies: [{ kind: "component", type: i2.EuiButtonComponent, selector: "button[euiButton], a[euiButton]", inputs: ["euiBasicButton", "euiButtonCall", "euiBlockButton", "euiRaisedButton", "isLoading", "euiIconButton", "euiLineWrap", "e2eAttr"] }, { kind: "component", type: i3.EuiDialogComponent, selector: "eui-dialog", inputs: ["e2eAttr", "title", "width", "height", "acceptLabel", "dismissLabel", "typeClass", "hasCloseButton", "hasAcceptButton", "hasDismissButton", "hasMobileCustomSize", "isClosedOnClickOutside", "isClosedOnEscape", "isHandleCloseOnDismiss", "isHandleCloseOnClose", "isHandleCloseOnAccept", "isHandleCloseOnClickOutside", "isHandleCloseOnEscape", "isMessageBox", "isDraggable", "hasNoBodyPadding", "hasFooter"], outputs: ["clickOutside", "escape", "open", "close", "dismiss", "accept"] }] });
26
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: DocPageCodeFabComponent, decorators: [{
27
27
  type: Component,
28
28
  args: [{ selector: 'eui-showcase-doc-page-code-fab', template: "<div class=\"eui-button-fixed\">\n <div class=\"eui-button-floating eui-button--size-2xl eui-button--icon-only eui-button--accent\">\n <span class=\"eui-icon eui-icon-code\" (click)=\"toggleCode()\"></span>\n </div>\n</div>\n\n<eui-dialog #dialog title=\"Page source code\" [hasFooter]=\"false\" (close)=\"onClose()\">\n <button euiButton euiAccent (click)=\"onOpenCode()\">\n <span class=\"eui-icon eui-icon-code\"></span> VIEW SOURCE\n </button>\n <br>\n <br>\n <ng-content></ng-content>\n <br>\n <p>Use the <kbd>View source</kbd> button to access the code source of the page.</p>\n</eui-dialog>\n" }]
29
29
  }], ctorParameters: function () { return [{ type: i1.UxAppShellService }]; }, propDecorators: { codeFolder: [{
@@ -112,9 +112,9 @@ export class DocSampleComponent {
112
112
  }
113
113
  }
114
114
  }
115
- /** @nocollapse */ DocSampleComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: DocSampleComponent, deps: [{ token: i1.HttpClient }, { token: i2.UxAppShellService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
116
- /** @nocollapse */ DocSampleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: DocSampleComponent, selector: "eui-showcase-doc-sample", inputs: { id: "id", label: "label", styleClass: "styleClass" }, ngImport: i0, template: "<div class=\"doc-sample-title\">\n <div class=\"doc-sample-title__label\"><strong>{{label}}</strong></div>\n <div class=\"doc-sample-title__items\">\n <button euiButton\n [euiOutline]=\"!isCodeExpanded\" euiPrimary euiSizeS (click)=\"onToggleCode()\"\n [isLoading]=\"isCodeLoading\" [euiDisabled]=\"isCodeLoading\">\n <span *ngIf=\"!isCodeExpanded\" euiLabel>Code</span>\n <span *ngIf=\"isCodeExpanded\" euiLabel>Hide Code</span>\n <span euiIcon iconClass=\"eui-icon-code\"></span>\n </button>\n </div>\n</div>\n\n<ng-template [ngIf]=\"isCodeExpanded\">\n <ux-panel [hasTabs]=\"true\" [hasNoContentPadding]=\"true\">\n <ux-tabs>\n <ux-tab label=\"HTML\" [isVisible]=\"htmlContent\">\n <pre><code class=\"language-markup\" euiCode>{{htmlContent}}</code></pre>\n </ux-tab>\n\n <ux-tab label=\"TS\" [isVisible]=\"tsContent\">\n <pre><code class=\"language-javascript\" euiCode>{{tsContent}}</code></pre>\n </ux-tab>\n </ux-tabs>\n </ux-panel>\n</ng-template>\n\n<ng-content></ng-content>\n", styles: [":host{display:block;margin-bottom:var(--eui-base-spacing-2xl);width:100%}.doc-sample-title{align-items:flex-end;display:flex;width:100%;margin-bottom:var(--eui-base-spacing-m);padding-bottom:var(--eui-base-spacing-s);border-bottom:1px solid var(--eui-base-color-grey-15)}.doc-sample-title__label{font-size:var(--eui-base-font-size-xl)}.doc-sample-title__items{display:flex;margin-left:auto}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.UxPanelComponent, selector: "ux-panel", inputs: ["id", "contentId", "styleClass", "contentStyleClass", "headerStyleClass", "label", "subLabel", "labelStyleClass", "labelInfos", "filterInput", "iconClass", "iconTypeClass", "isIconRounded", "isExpandable", "isExpanded", "isVisible", "isSelected", "isCollapsible", "isCollapsed", "tagLabel", "tagTypeClass", "tagCount", "badgeLabel", "badgeTypeClass", "hasTabs", "hasNoHeader", "hasNoContentPadding", "isBlocked", "isBlockedAriaLabel", "maxHeight", "contentHeight", "isFlat", "isTransparent", "isLargeHeader", "isLargeFooter", "isSmallHeader", "hasStatusIndicator", "statusIndicatorTypeClass", "statusIndicatorMessageLabel", "isTogglableStatusIndicatorContent", "isStatusIndicatorContentExpanded", "hasStatusIndicatorHeaderBg", "hasStatusIndicatorHeaderIcon", "isEditModeActive", "isContainerOnly", "isClickable", "isHighlighted", "isAccordionPanel", "customState", "subLabelSizeLimit", "tabindex", "isSticky", "e2eAttr"], outputs: ["panelExpanded", "panelCollapsed"] }, { kind: "component", type: i5.UxTabComponent, selector: "ux-tab", inputs: ["id", "index", "label", "subLabel", "iconClass", "iconTypeClass", "isClosable", "isDisabled", "tag", "tagTypeClass", "hasMarker", "markerTypeClass", "isActive", "url", "isVisible", "hasValidationErrors", "styleClass", "labelStyleClass", "e2eAttr"] }, { kind: "component", type: i5.UxTabsComponent, selector: "ux-tabs", inputs: ["styleClass", "tabs", "isMainNavigation", "isSubTabs", "activeTabIndex", "e2eAttr"], outputs: ["tabSelected", "tabClosed", "activeTabIndexChange"] }, { kind: "component", type: i6.EuiIconComponent, selector: "span[euiIcon], i[euiIcon], eui-icon", inputs: ["iconClass", "isLoading", "aria-label"] }, { kind: "component", type: i6.EuiLabelComponent, selector: "label[euiLabel], span[euiLabel], div[euiLabel], a[euiLabel], eui-label, label[euiSublabel], span[euiSublabel], div[euiSublabel], a[euiSublabel], eui-sublabel", inputs: ["euiRequired", "euiReadonly", "styleClass", "euiSublabel"] }, { kind: "component", type: i7.EuiButtonComponent, selector: "button[euiButton], a[euiButton]", inputs: ["euiBasicButton", "euiButtonCall", "euiBlockButton", "euiRaisedButton", "isLoading", "euiIconButton", "euiLineWrap", "e2eAttr"] }, { kind: "directive", type: i8.EuiCodeHighlighterDirective, selector: "[euiCode]" }] });
117
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: DocSampleComponent, decorators: [{
115
+ /** @nocollapse */ DocSampleComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: DocSampleComponent, deps: [{ token: i1.HttpClient }, { token: i2.UxAppShellService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
116
+ /** @nocollapse */ DocSampleComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.1", type: DocSampleComponent, selector: "eui-showcase-doc-sample", inputs: { id: "id", label: "label", styleClass: "styleClass" }, ngImport: i0, template: "<div class=\"doc-sample-title\">\n <div class=\"doc-sample-title__label\"><strong>{{label}}</strong></div>\n <div class=\"doc-sample-title__items\">\n <button euiButton\n [euiOutline]=\"!isCodeExpanded\" euiPrimary euiSizeS (click)=\"onToggleCode()\"\n [isLoading]=\"isCodeLoading\" [euiDisabled]=\"isCodeLoading\">\n <span *ngIf=\"!isCodeExpanded\" euiLabel>Code</span>\n <span *ngIf=\"isCodeExpanded\" euiLabel>Hide Code</span>\n <span euiIcon iconClass=\"eui-icon-code\"></span>\n </button>\n </div>\n</div>\n\n<ng-template [ngIf]=\"isCodeExpanded\">\n <ux-panel [hasTabs]=\"true\" [hasNoContentPadding]=\"true\">\n <ux-tabs>\n <ux-tab label=\"HTML\" [isVisible]=\"htmlContent\">\n <pre><code class=\"language-markup\" euiCode>{{htmlContent}}</code></pre>\n </ux-tab>\n\n <ux-tab label=\"TS\" [isVisible]=\"tsContent\">\n <pre><code class=\"language-javascript\" euiCode>{{tsContent}}</code></pre>\n </ux-tab>\n </ux-tabs>\n </ux-panel>\n</ng-template>\n\n<ng-content></ng-content>\n", styles: [":host{display:block;margin-bottom:var(--eui-base-spacing-2xl);width:100%}.doc-sample-title{align-items:flex-end;display:flex;width:100%;margin-bottom:var(--eui-base-spacing-m);padding-bottom:var(--eui-base-spacing-s);border-bottom:1px solid var(--eui-base-color-grey-15)}.doc-sample-title__label{font-size:var(--eui-base-font-size-xl)}.doc-sample-title__items{display:flex;margin-left:auto}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.UxPanelComponent, selector: "ux-panel", inputs: ["id", "contentId", "styleClass", "contentStyleClass", "headerStyleClass", "label", "subLabel", "labelStyleClass", "labelInfos", "filterInput", "iconClass", "iconTypeClass", "isIconRounded", "isExpandable", "isExpanded", "isVisible", "isSelected", "isCollapsible", "isCollapsed", "tagLabel", "tagTypeClass", "tagCount", "badgeLabel", "badgeTypeClass", "hasTabs", "hasNoHeader", "hasNoContentPadding", "isBlocked", "isBlockedAriaLabel", "maxHeight", "contentHeight", "isFlat", "isTransparent", "isLargeHeader", "isLargeFooter", "isSmallHeader", "hasStatusIndicator", "statusIndicatorTypeClass", "statusIndicatorMessageLabel", "isTogglableStatusIndicatorContent", "isStatusIndicatorContentExpanded", "hasStatusIndicatorHeaderBg", "hasStatusIndicatorHeaderIcon", "isEditModeActive", "isContainerOnly", "isClickable", "isHighlighted", "isAccordionPanel", "customState", "subLabelSizeLimit", "tabindex", "isSticky", "e2eAttr"], outputs: ["panelExpanded", "panelCollapsed"] }, { kind: "component", type: i5.UxTabComponent, selector: "ux-tab", inputs: ["id", "index", "label", "subLabel", "iconClass", "iconTypeClass", "isClosable", "isDisabled", "tag", "tagTypeClass", "hasMarker", "markerTypeClass", "isActive", "url", "isVisible", "hasValidationErrors", "styleClass", "labelStyleClass", "e2eAttr"] }, { kind: "component", type: i5.UxTabsComponent, selector: "ux-tabs", inputs: ["styleClass", "tabs", "isMainNavigation", "isSubTabs", "activeTabIndex", "e2eAttr"], outputs: ["tabSelected", "tabClosed", "activeTabIndexChange"] }, { kind: "component", type: i6.EuiIconComponent, selector: "span[euiIcon], i[euiIcon], eui-icon", inputs: ["iconClass", "isLoading", "aria-label"] }, { kind: "component", type: i6.EuiLabelComponent, selector: "label[euiLabel], span[euiLabel], div[euiLabel], a[euiLabel], eui-label, label[euiSublabel], span[euiSublabel], div[euiSublabel], a[euiSublabel], eui-sublabel", inputs: ["euiRequired", "euiReadonly", "styleClass", "euiSublabel"] }, { kind: "component", type: i7.EuiButtonComponent, selector: "button[euiButton], a[euiButton]", inputs: ["euiBasicButton", "euiButtonCall", "euiBlockButton", "euiRaisedButton", "isLoading", "euiIconButton", "euiLineWrap", "e2eAttr"] }, { kind: "directive", type: i8.EuiCodeHighlighterDirective, selector: "[euiCode]" }] });
117
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: DocSampleComponent, decorators: [{
118
118
  type: Component,
119
119
  args: [{ selector: 'eui-showcase-doc-sample', template: "<div class=\"doc-sample-title\">\n <div class=\"doc-sample-title__label\"><strong>{{label}}</strong></div>\n <div class=\"doc-sample-title__items\">\n <button euiButton\n [euiOutline]=\"!isCodeExpanded\" euiPrimary euiSizeS (click)=\"onToggleCode()\"\n [isLoading]=\"isCodeLoading\" [euiDisabled]=\"isCodeLoading\">\n <span *ngIf=\"!isCodeExpanded\" euiLabel>Code</span>\n <span *ngIf=\"isCodeExpanded\" euiLabel>Hide Code</span>\n <span euiIcon iconClass=\"eui-icon-code\"></span>\n </button>\n </div>\n</div>\n\n<ng-template [ngIf]=\"isCodeExpanded\">\n <ux-panel [hasTabs]=\"true\" [hasNoContentPadding]=\"true\">\n <ux-tabs>\n <ux-tab label=\"HTML\" [isVisible]=\"htmlContent\">\n <pre><code class=\"language-markup\" euiCode>{{htmlContent}}</code></pre>\n </ux-tab>\n\n <ux-tab label=\"TS\" [isVisible]=\"tsContent\">\n <pre><code class=\"language-javascript\" euiCode>{{tsContent}}</code></pre>\n </ux-tab>\n </ux-tabs>\n </ux-panel>\n</ng-template>\n\n<ng-content></ng-content>\n", styles: [":host{display:block;margin-bottom:var(--eui-base-spacing-2xl);width:100%}.doc-sample-title{align-items:flex-end;display:flex;width:100%;margin-bottom:var(--eui-base-spacing-m);padding-bottom:var(--eui-base-spacing-s);border-bottom:1px solid var(--eui-base-color-grey-15)}.doc-sample-title__label{font-size:var(--eui-base-font-size-xl)}.doc-sample-title__items{display:flex;margin-left:auto}\n"] }]
120
120
  }], ctorParameters: function () { return [{ type: i1.HttpClient }, { type: i2.UxAppShellService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { id: [{
@@ -3,9 +3,9 @@ import * as i0 from "@angular/core";
3
3
  export class DocSampleApiComponent {
4
4
  constructor() { }
5
5
  }
6
- /** @nocollapse */ DocSampleApiComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: DocSampleApiComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
7
- /** @nocollapse */ DocSampleApiComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: DocSampleApiComponent, selector: "eui-showcase-doc-sample-api", ngImport: i0, template: "" });
8
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: DocSampleApiComponent, decorators: [{
6
+ /** @nocollapse */ DocSampleApiComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: DocSampleApiComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
7
+ /** @nocollapse */ DocSampleApiComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.1", type: DocSampleApiComponent, selector: "eui-showcase-doc-sample-api", ngImport: i0, template: "" });
8
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: DocSampleApiComponent, decorators: [{
9
9
  type: Component,
10
10
  args: [{ selector: 'eui-showcase-doc-sample-api', template: "" }]
11
11
  }], ctorParameters: function () { return []; } });
@@ -12,9 +12,9 @@ export class DocSectionComponent {
12
12
  }
13
13
  }
14
14
  }
15
- /** @nocollapse */ DocSectionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: DocSectionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
16
- /** @nocollapse */ DocSectionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: DocSectionComponent, selector: "eui-showcase-doc-section", inputs: { id: "id", label: "label", styleClass: "styleClass" }, ngImport: i0, template: "<h4 id=\"sections\" class=\"eui-u-font-bold eui-u-color-info mb-3\">{{label}}</h4>\n\n<ng-content></ng-content>\n", styles: [":host{display:block;margin-bottom:var(--eui-base-spacing-2xl)}.doc-section-title{align-items:flex-end;display:flex;width:100%;margin-bottom:var(--eui-base-spacing-m);padding-bottom:var(--eui-base-spacing-s);border-bottom:1px solid var(--eui-base-color-grey-15)}\n"] });
17
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: DocSectionComponent, decorators: [{
15
+ /** @nocollapse */ DocSectionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: DocSectionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
16
+ /** @nocollapse */ DocSectionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.1", type: DocSectionComponent, selector: "eui-showcase-doc-section", inputs: { id: "id", label: "label", styleClass: "styleClass" }, ngImport: i0, template: "<h4 id=\"sections\" class=\"eui-u-font-bold eui-u-color-info mb-3\">{{label}}</h4>\n\n<ng-content></ng-content>\n", styles: [":host{display:block;margin-bottom:var(--eui-base-spacing-2xl)}.doc-section-title{align-items:flex-end;display:flex;width:100%;margin-bottom:var(--eui-base-spacing-m);padding-bottom:var(--eui-base-spacing-s);border-bottom:1px solid var(--eui-base-color-grey-15)}\n"] });
17
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: DocSectionComponent, decorators: [{
18
18
  type: Component,
19
19
  args: [{ selector: 'eui-showcase-doc-section', template: "<h4 id=\"sections\" class=\"eui-u-font-bold eui-u-color-info mb-3\">{{label}}</h4>\n\n<ng-content></ng-content>\n", styles: [":host{display:block;margin-bottom:var(--eui-base-spacing-2xl)}.doc-section-title{align-items:flex-end;display:flex;width:100%;margin-bottom:var(--eui-base-spacing-m);padding-bottom:var(--eui-base-spacing-s);border-bottom:1px solid var(--eui-base-color-grey-15)}\n"] }]
20
20
  }], ctorParameters: function () { return []; }, propDecorators: { id: [{
@@ -15,9 +15,9 @@ export class DocSectionCodeComponent {
15
15
  return object;
16
16
  }
17
17
  }
18
- /** @nocollapse */ DocSectionCodeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: DocSectionCodeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
19
- /** @nocollapse */ DocSectionCodeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.0", type: DocSectionCodeComponent, selector: "eui-showcase-doc-section-code", inputs: { label: "label", content: "content", styleClass: "styleClass", versionLabel: "versionLabel", isDeprecated: "isDeprecated", isCodeExpanded: "isCodeExpanded" }, queries: [{ propertyName: "sectionDescription", first: true, predicate: i0.forwardRef(function () { return DocSectionCodeDescriptionTagDirective; }), descendants: true }, { propertyName: "sectionCodeHTML", first: true, predicate: i0.forwardRef(function () { return DocSectionCodeHtmlTagDirective; }), descendants: true }, { propertyName: "sectionCodeTS", first: true, predicate: i0.forwardRef(function () { return DocSectionCodeTsTagDirective; }), descendants: true }, { propertyName: "sectionCodeSERVICE", first: true, predicate: i0.forwardRef(function () { return DocSectionCodeServiceTagDirective; }), descendants: true }, { propertyName: "sectionCodeCSS", first: true, predicate: i0.forwardRef(function () { return DocSectionCodeCssTagDirective; }), descendants: true }, { propertyName: "sectionCodeDOC", first: true, predicate: i0.forwardRef(function () { return DocSectionCodeDocTagDirective; }), descendants: true }], ngImport: i0, template: "<h5 class=\"section-title {{styleClass}}\">\n <div class=\"flex-container\">\n <span [class.app-section-code--deprecated]=\"isDeprecated\">\n {{label}}\n </span>\n <button class=\"ux-button ux-button--small ux-button--accent ux-button--icon-only ml-2\" style=\"margin-top: -7px;\" (click)=\"toggleCode()\">\n <span class=\"eui-icon eui-icon-code\"></span>\n </button>\n <div *ngIf=\"versionLabel\" class=\"ml-auto\">\n <span class=\"eui-u-color-danger\">{{versionLabel}}</span>\n </div>\n </div>\n <div *ngIf=\"isDeprecated\">\n <small class=\"eui-u-color-danger\">Deprecated in 3.x</small>\n </div>\n</h5>\n\n<div class=\"eui-u-mv\" *ngIf=\"sectionDescription\">\n <ng-content select=\"sectionDescription\"></ng-content>\n</div>\n\n<ng-template [ngIf]=\"isCodeExpanded\">\n <ux-tabs>\n <ux-tab label=\"HTML\" [isVisible]=\"isDefined(sectionCodeHTML)\">\n <pre><code class=\"language-markup\" euiCode><ng-content select=\"sectionCodeHTML\"></ng-content></code></pre>\n </ux-tab>\n\n <ux-tab label=\"TS\" [isVisible]=\"isDefined(sectionCodeTS)\">\n <pre><code class=\"language-javascript\" euiCode><ng-content select=\"sectionCodeTS\"></ng-content></code></pre>\n </ux-tab>\n\n <ux-tab label=\"Service\" [isVisible]=\"isDefined(sectionCodeSERVICE)\">\n <pre><code class=\"language-javascript\" euiCode><ng-content select=\"sectionCodeSERVICE\"></ng-content></code></pre>\n </ux-tab>\n\n <ux-tab label=\"CSS\" [isVisible]=\"isDefined(sectionCodeCSS)\">\n <pre><code class=\"language-javascript\" euiCode><ng-content select=\"sectionCodeCSS\"></ng-content></code></pre>\n </ux-tab>\n\n <ux-tab label=\"DOC\" [isVisible]=\"isDefined(sectionCodeDOC)\">\n <div class=\"language-doc\"><ng-content select=\"sectionCodeDOC\"></ng-content></div>\n </ux-tab>\n </ux-tabs>\n\n <ng-template [ngIf]=\"!sectionCodeHTML && !sectionCodeTS && !sectionCodeCSS\">\n <pre class=\"only-html\"><code class=\"language-markup\" euiCode><ng-content></ng-content></code></pre>\n </ng-template>\n</ng-template>\n", styles: [".eui-showcase-doc-section-code--deprecated{color:red;text-decoration:line-through}.language-doc{background-color:#f5f8fb;border-left:10px solid #358ccb;box-shadow:-1px 0 #358ccb,0 0 0 1px #dfdfdf;display:block;height:inherit;max-height:inherit;overflow:auto;padding:1rem;position:relative}.first-section{margin-top:0;padding-top:10px}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.UxTabComponent, selector: "ux-tab", inputs: ["id", "index", "label", "subLabel", "iconClass", "iconTypeClass", "isClosable", "isDisabled", "tag", "tagTypeClass", "hasMarker", "markerTypeClass", "isActive", "url", "isVisible", "hasValidationErrors", "styleClass", "labelStyleClass", "e2eAttr"] }, { kind: "component", type: i2.UxTabsComponent, selector: "ux-tabs", inputs: ["styleClass", "tabs", "isMainNavigation", "isSubTabs", "activeTabIndex", "e2eAttr"], outputs: ["tabSelected", "tabClosed", "activeTabIndexChange"] }, { kind: "directive", type: i3.EuiCodeHighlighterDirective, selector: "[euiCode]" }] });
20
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: DocSectionCodeComponent, decorators: [{
18
+ /** @nocollapse */ DocSectionCodeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: DocSectionCodeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
19
+ /** @nocollapse */ DocSectionCodeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.0.1", type: DocSectionCodeComponent, selector: "eui-showcase-doc-section-code", inputs: { label: "label", content: "content", styleClass: "styleClass", versionLabel: "versionLabel", isDeprecated: "isDeprecated", isCodeExpanded: "isCodeExpanded" }, queries: [{ propertyName: "sectionDescription", first: true, predicate: i0.forwardRef(function () { return DocSectionCodeDescriptionTagDirective; }), descendants: true }, { propertyName: "sectionCodeHTML", first: true, predicate: i0.forwardRef(function () { return DocSectionCodeHtmlTagDirective; }), descendants: true }, { propertyName: "sectionCodeTS", first: true, predicate: i0.forwardRef(function () { return DocSectionCodeTsTagDirective; }), descendants: true }, { propertyName: "sectionCodeSERVICE", first: true, predicate: i0.forwardRef(function () { return DocSectionCodeServiceTagDirective; }), descendants: true }, { propertyName: "sectionCodeCSS", first: true, predicate: i0.forwardRef(function () { return DocSectionCodeCssTagDirective; }), descendants: true }, { propertyName: "sectionCodeDOC", first: true, predicate: i0.forwardRef(function () { return DocSectionCodeDocTagDirective; }), descendants: true }], ngImport: i0, template: "<h5 class=\"section-title {{styleClass}}\">\n <div class=\"flex-container\">\n <span [class.app-section-code--deprecated]=\"isDeprecated\">\n {{label}}\n </span>\n <button class=\"ux-button ux-button--small ux-button--accent ux-button--icon-only ml-2\" style=\"margin-top: -7px;\" (click)=\"toggleCode()\">\n <span class=\"eui-icon eui-icon-code\"></span>\n </button>\n <div *ngIf=\"versionLabel\" class=\"ml-auto\">\n <span class=\"eui-u-color-danger\">{{versionLabel}}</span>\n </div>\n </div>\n <div *ngIf=\"isDeprecated\">\n <small class=\"eui-u-color-danger\">Deprecated in 3.x</small>\n </div>\n</h5>\n\n<div class=\"eui-u-mv\" *ngIf=\"sectionDescription\">\n <ng-content select=\"sectionDescription\"></ng-content>\n</div>\n\n<ng-template [ngIf]=\"isCodeExpanded\">\n <ux-tabs>\n <ux-tab label=\"HTML\" [isVisible]=\"isDefined(sectionCodeHTML)\">\n <pre><code class=\"language-markup\" euiCode><ng-content select=\"sectionCodeHTML\"></ng-content></code></pre>\n </ux-tab>\n\n <ux-tab label=\"TS\" [isVisible]=\"isDefined(sectionCodeTS)\">\n <pre><code class=\"language-javascript\" euiCode><ng-content select=\"sectionCodeTS\"></ng-content></code></pre>\n </ux-tab>\n\n <ux-tab label=\"Service\" [isVisible]=\"isDefined(sectionCodeSERVICE)\">\n <pre><code class=\"language-javascript\" euiCode><ng-content select=\"sectionCodeSERVICE\"></ng-content></code></pre>\n </ux-tab>\n\n <ux-tab label=\"CSS\" [isVisible]=\"isDefined(sectionCodeCSS)\">\n <pre><code class=\"language-javascript\" euiCode><ng-content select=\"sectionCodeCSS\"></ng-content></code></pre>\n </ux-tab>\n\n <ux-tab label=\"DOC\" [isVisible]=\"isDefined(sectionCodeDOC)\">\n <div class=\"language-doc\"><ng-content select=\"sectionCodeDOC\"></ng-content></div>\n </ux-tab>\n </ux-tabs>\n\n <ng-template [ngIf]=\"!sectionCodeHTML && !sectionCodeTS && !sectionCodeCSS\">\n <pre class=\"only-html\"><code class=\"language-markup\" euiCode><ng-content></ng-content></code></pre>\n </ng-template>\n</ng-template>\n", styles: [".eui-showcase-doc-section-code--deprecated{color:red;text-decoration:line-through}.language-doc{background-color:#f5f8fb;border-left:10px solid #358ccb;box-shadow:-1px 0 #358ccb,0 0 0 1px #dfdfdf;display:block;height:inherit;max-height:inherit;overflow:auto;padding:1rem;position:relative}.first-section{margin-top:0;padding-top:10px}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.UxTabComponent, selector: "ux-tab", inputs: ["id", "index", "label", "subLabel", "iconClass", "iconTypeClass", "isClosable", "isDisabled", "tag", "tagTypeClass", "hasMarker", "markerTypeClass", "isActive", "url", "isVisible", "hasValidationErrors", "styleClass", "labelStyleClass", "e2eAttr"] }, { kind: "component", type: i2.UxTabsComponent, selector: "ux-tabs", inputs: ["styleClass", "tabs", "isMainNavigation", "isSubTabs", "activeTabIndex", "e2eAttr"], outputs: ["tabSelected", "tabClosed", "activeTabIndexChange"] }, { kind: "directive", type: i3.EuiCodeHighlighterDirective, selector: "[euiCode]" }] });
20
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: DocSectionCodeComponent, decorators: [{
21
21
  type: Component,
22
22
  args: [{ selector: 'eui-showcase-doc-section-code', template: "<h5 class=\"section-title {{styleClass}}\">\n <div class=\"flex-container\">\n <span [class.app-section-code--deprecated]=\"isDeprecated\">\n {{label}}\n </span>\n <button class=\"ux-button ux-button--small ux-button--accent ux-button--icon-only ml-2\" style=\"margin-top: -7px;\" (click)=\"toggleCode()\">\n <span class=\"eui-icon eui-icon-code\"></span>\n </button>\n <div *ngIf=\"versionLabel\" class=\"ml-auto\">\n <span class=\"eui-u-color-danger\">{{versionLabel}}</span>\n </div>\n </div>\n <div *ngIf=\"isDeprecated\">\n <small class=\"eui-u-color-danger\">Deprecated in 3.x</small>\n </div>\n</h5>\n\n<div class=\"eui-u-mv\" *ngIf=\"sectionDescription\">\n <ng-content select=\"sectionDescription\"></ng-content>\n</div>\n\n<ng-template [ngIf]=\"isCodeExpanded\">\n <ux-tabs>\n <ux-tab label=\"HTML\" [isVisible]=\"isDefined(sectionCodeHTML)\">\n <pre><code class=\"language-markup\" euiCode><ng-content select=\"sectionCodeHTML\"></ng-content></code></pre>\n </ux-tab>\n\n <ux-tab label=\"TS\" [isVisible]=\"isDefined(sectionCodeTS)\">\n <pre><code class=\"language-javascript\" euiCode><ng-content select=\"sectionCodeTS\"></ng-content></code></pre>\n </ux-tab>\n\n <ux-tab label=\"Service\" [isVisible]=\"isDefined(sectionCodeSERVICE)\">\n <pre><code class=\"language-javascript\" euiCode><ng-content select=\"sectionCodeSERVICE\"></ng-content></code></pre>\n </ux-tab>\n\n <ux-tab label=\"CSS\" [isVisible]=\"isDefined(sectionCodeCSS)\">\n <pre><code class=\"language-javascript\" euiCode><ng-content select=\"sectionCodeCSS\"></ng-content></code></pre>\n </ux-tab>\n\n <ux-tab label=\"DOC\" [isVisible]=\"isDefined(sectionCodeDOC)\">\n <div class=\"language-doc\"><ng-content select=\"sectionCodeDOC\"></ng-content></div>\n </ux-tab>\n </ux-tabs>\n\n <ng-template [ngIf]=\"!sectionCodeHTML && !sectionCodeTS && !sectionCodeCSS\">\n <pre class=\"only-html\"><code class=\"language-markup\" euiCode><ng-content></ng-content></code></pre>\n </ng-template>\n</ng-template>\n", styles: [".eui-showcase-doc-section-code--deprecated{color:red;text-decoration:line-through}.language-doc{background-color:#f5f8fb;border-left:10px solid #358ccb;box-shadow:-1px 0 #358ccb,0 0 0 1px #dfdfdf;display:block;height:inherit;max-height:inherit;overflow:auto;padding:1rem;position:relative}.first-section{margin-top:0;padding-top:10px}\n"] }]
23
23
  }], ctorParameters: function () { return []; }, propDecorators: { label: [{
@@ -54,49 +54,49 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImpor
54
54
  /* tslint:disable */
55
55
  export class DocSectionCodeDescriptionTagDirective {
56
56
  }
57
- /** @nocollapse */ DocSectionCodeDescriptionTagDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: DocSectionCodeDescriptionTagDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
58
- /** @nocollapse */ DocSectionCodeDescriptionTagDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.0.0", type: DocSectionCodeDescriptionTagDirective, selector: "sectionDescription", ngImport: i0 });
59
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: DocSectionCodeDescriptionTagDirective, decorators: [{
57
+ /** @nocollapse */ DocSectionCodeDescriptionTagDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: DocSectionCodeDescriptionTagDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
58
+ /** @nocollapse */ DocSectionCodeDescriptionTagDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.0.1", type: DocSectionCodeDescriptionTagDirective, selector: "sectionDescription", ngImport: i0 });
59
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: DocSectionCodeDescriptionTagDirective, decorators: [{
60
60
  type: Directive,
61
61
  args: [{ selector: 'sectionDescription' }]
62
62
  }] });
63
63
  export class DocSectionCodeHtmlTagDirective {
64
64
  }
65
- /** @nocollapse */ DocSectionCodeHtmlTagDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: DocSectionCodeHtmlTagDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
66
- /** @nocollapse */ DocSectionCodeHtmlTagDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.0.0", type: DocSectionCodeHtmlTagDirective, selector: "sectionCodeHTML", ngImport: i0 });
67
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: DocSectionCodeHtmlTagDirective, decorators: [{
65
+ /** @nocollapse */ DocSectionCodeHtmlTagDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: DocSectionCodeHtmlTagDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
66
+ /** @nocollapse */ DocSectionCodeHtmlTagDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.0.1", type: DocSectionCodeHtmlTagDirective, selector: "sectionCodeHTML", ngImport: i0 });
67
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: DocSectionCodeHtmlTagDirective, decorators: [{
68
68
  type: Directive,
69
69
  args: [{ selector: 'sectionCodeHTML' }]
70
70
  }] });
71
71
  export class DocSectionCodeTsTagDirective {
72
72
  }
73
- /** @nocollapse */ DocSectionCodeTsTagDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: DocSectionCodeTsTagDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
74
- /** @nocollapse */ DocSectionCodeTsTagDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.0.0", type: DocSectionCodeTsTagDirective, selector: "sectionCodeTS", ngImport: i0 });
75
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: DocSectionCodeTsTagDirective, decorators: [{
73
+ /** @nocollapse */ DocSectionCodeTsTagDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: DocSectionCodeTsTagDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
74
+ /** @nocollapse */ DocSectionCodeTsTagDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.0.1", type: DocSectionCodeTsTagDirective, selector: "sectionCodeTS", ngImport: i0 });
75
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: DocSectionCodeTsTagDirective, decorators: [{
76
76
  type: Directive,
77
77
  args: [{ selector: 'sectionCodeTS' }]
78
78
  }] });
79
79
  export class DocSectionCodeServiceTagDirective {
80
80
  }
81
- /** @nocollapse */ DocSectionCodeServiceTagDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: DocSectionCodeServiceTagDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
82
- /** @nocollapse */ DocSectionCodeServiceTagDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.0.0", type: DocSectionCodeServiceTagDirective, selector: "sectionCodeSERVICE", ngImport: i0 });
83
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: DocSectionCodeServiceTagDirective, decorators: [{
81
+ /** @nocollapse */ DocSectionCodeServiceTagDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: DocSectionCodeServiceTagDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
82
+ /** @nocollapse */ DocSectionCodeServiceTagDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.0.1", type: DocSectionCodeServiceTagDirective, selector: "sectionCodeSERVICE", ngImport: i0 });
83
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: DocSectionCodeServiceTagDirective, decorators: [{
84
84
  type: Directive,
85
85
  args: [{ selector: 'sectionCodeSERVICE' }]
86
86
  }] });
87
87
  export class DocSectionCodeCssTagDirective {
88
88
  }
89
- /** @nocollapse */ DocSectionCodeCssTagDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: DocSectionCodeCssTagDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
90
- /** @nocollapse */ DocSectionCodeCssTagDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.0.0", type: DocSectionCodeCssTagDirective, selector: "sectionCodeCSS", ngImport: i0 });
91
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: DocSectionCodeCssTagDirective, decorators: [{
89
+ /** @nocollapse */ DocSectionCodeCssTagDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: DocSectionCodeCssTagDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
90
+ /** @nocollapse */ DocSectionCodeCssTagDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.0.1", type: DocSectionCodeCssTagDirective, selector: "sectionCodeCSS", ngImport: i0 });
91
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: DocSectionCodeCssTagDirective, decorators: [{
92
92
  type: Directive,
93
93
  args: [{ selector: 'sectionCodeCSS' }]
94
94
  }] });
95
95
  export class DocSectionCodeDocTagDirective {
96
96
  }
97
- /** @nocollapse */ DocSectionCodeDocTagDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: DocSectionCodeDocTagDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
98
- /** @nocollapse */ DocSectionCodeDocTagDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.0.0", type: DocSectionCodeDocTagDirective, selector: "sectionCodeDOC", ngImport: i0 });
99
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: DocSectionCodeDocTagDirective, decorators: [{
97
+ /** @nocollapse */ DocSectionCodeDocTagDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: DocSectionCodeDocTagDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
98
+ /** @nocollapse */ DocSectionCodeDocTagDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.0.1", type: DocSectionCodeDocTagDirective, selector: "sectionCodeDOC", ngImport: i0 });
99
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: DocSectionCodeDocTagDirective, decorators: [{
100
100
  type: Directive,
101
101
  args: [{ selector: 'sectionCodeDOC' }]
102
102
  }] });
@@ -10,9 +10,9 @@ export class EuiCodeHighlighterDirective {
10
10
  }
11
11
  }
12
12
  }
13
- /** @nocollapse */ EuiCodeHighlighterDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: EuiCodeHighlighterDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
14
- /** @nocollapse */ EuiCodeHighlighterDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.0.0", type: EuiCodeHighlighterDirective, selector: "[euiCode]", ngImport: i0 });
15
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.0", ngImport: i0, type: EuiCodeHighlighterDirective, decorators: [{
13
+ /** @nocollapse */ EuiCodeHighlighterDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: EuiCodeHighlighterDirective, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
14
+ /** @nocollapse */ EuiCodeHighlighterDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.0.1", type: EuiCodeHighlighterDirective, selector: "[euiCode]", ngImport: i0 });
15
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.0.1", ngImport: i0, type: EuiCodeHighlighterDirective, decorators: [{
16
16
  type: Directive,
17
17
  args: [{
18
18
  selector: '[euiCode]'