@eui/components 15.0.0-rc.20 → 15.0.0-rc.21

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.
@@ -1532,7 +1532,7 @@
1532
1532
  <script src="../js/libs/htmlparser.js"></script>
1533
1533
  <script src="../js/libs/deep-iterator.js"></script>
1534
1534
  <script>
1535
- var COMPONENT_TEMPLATE = '<div><ul class="ux-tree"> <cdk-tree [dataSource]="cdkArrayDataSource" [treeControl]="cdkTreeControl" [trackBy]="trackBy" *ngIf="renderTree"> <!-- There are two states of generic cdk-nested-tree-node declarations. First one is without child. No sub rendering. --> <cdk-nested-tree-node *cdkTreeNodeDef="let treeItemModel"> <li class="ux-tree__node" *ngIf="treeItemModel" title="{{getTreeItem(treeItemModel?.path)?.node?.treeContentBlock?.tooltipLabel|| getTreeItem(treeItemModel?.path)?.node?.treeContentBlock?.label}}" > <div class="ux-tree__node-wrapper"> <div (click)="onNodeClick(treeItemModel)"> <!-- Renders node in default or provided template\'s context. Generates onSelect with onSelectFn for developers to send the events from their custom check events. Provides id to be used on generic template --> <ng-container [ngTemplateOutlet]="nodeTemplateRef||nodeTemplateDefault" [ngTemplateOutletContext]="{ $implicit: getTreeItem(treeItemModel?.path)?.node, onSelect:onSelectFn(treeItemModel.path,treeItemModel), id:uid+treeItemModel.path }"> </ng-container> </div> </div> </li> </cdk-nested-tree-node> <!-- This is the tree node template for expandable nodes --> <cdk-nested-tree-node *cdkTreeNodeDef="let treeItemModel when: hasChild"> <li class="ux-tree__node" *ngIf="treeItemModel" title="{{getTreeItem(treeItemModel?.path)?.node?.treeContentBlock?.tooltipLabel|| getTreeItem(treeItemModel?.path)?.node?.treeContentBlock?.label}}"> <div class="ux-tree__node-wrapper"> <button euiButton euiIconButton euiBasicButton [attr.aria-label]="\'Toggle \' + treeItemModel?.node?.treeContentBlock?.label" (click)="onNodeToggle(treeItemModel)" cdkTreeNodeToggle> <span euiIcon *ngIf="!cdkTreeControl.isExpanded(treeItemModel)&&collapsedIconClass" [iconClass]="collapsedIconClass"></span> <span euiIcon *ngIf="cdkTreeControl.isExpanded(treeItemModel)&&expandedIconClass" [iconClass]="expandedIconClass" ></span> <eui-icon-svg *ngIf="!cdkTreeControl.isExpanded(treeItemModel)&&!collapsedIconClass" set="sharp" size="m" icon="chevron-forward"></eui-icon-svg> <eui-icon-svg *ngIf="cdkTreeControl.isExpanded(treeItemModel)&&!expandedIconClass" set="sharp" size="m" icon="chevron-down" ></eui-icon-svg> </button> <!--Here wraps the node, and listen for node clicks.--> <div (click)="onNodeClick(treeItemModel)"> <!-- Renders node in default or provided template\'s context. Generates onSelect with onSelectFn for developers to send the events from their custom check events. Provides id to be used on generic template --> <ng-container [ngTemplateOutlet]="nodeTemplateRef||nodeTemplateDefault" [ngTemplateOutletContext]="{ $implicit: getTreeItem(treeItemModel?.path)?.node, onSelect:onSelectFn(treeItemModel?.path,treeItemModel), id:uid+treeItemModel.path }"> </ng-container> </div> </div> <!--uses cdkTreeNodeOutlet to render children nodes, CdkTreeControl is used to control isExpanded state.--> <ul class="ux-tree__node" *ngIf="cdkTreeControl.isExpanded(treeItemModel)"> <ng-container cdkTreeNodeOutlet></ng-container> </ul> </li> </cdk-nested-tree-node> </cdk-tree></ul><ng-template #nodeTemplateDefault let-node let-onSelect="onSelect" let-id=id> <ng-container *ngIf="node"> <!--input checkbox area--> <input euiInputCheckBox *ngIf="node && node.selectable" type="checkbox" id="{{id}}" [checked]="node && node.isSelected" (change)="onSelect($event)" > <!--type (typeLabel & typeClass) area--> <ng-container *ngIf="node?.treeContentBlock?.typeLabel" [ngSwitch]="node?.treeContentBlock?.typeClass"> <eui-badge euiSizeM [euiVariant]="node?.treeContentBlock?.typeClass||\'primary\'"> {{node?.treeContentBlock?.typeLabel}} </eui-badge> </ng-container> <!--icon area--> <ng-container *ngIf="node?.treeContentBlock?.iconClass"> <eui-icon euiSizeM [euiVariant]="node?.treeContentBlock?.iconTypeClass||\'primary\'" iconClass="{{node?.treeContentBlock?.iconClass}}"> </eui-icon> </ng-container> <!--label area--> <label *ngIf="!node?.treeContentBlock?.urlExternal" euiLabel for="{{id}}">{{autoTranslate ? (node?.treeContentBlock?.label|translate) : node?.treeContentBlock?.label}}</label> <label *ngIf="node?.treeContentBlock?.urlExternal" euiLabel for="{{id}}"> <a href="{{node?.treeContentBlock?.urlExternal}}" target="{{node?.treeContentBlock?.urlExternalTarget || \'blank\'}}"> {{autoTranslate ? (node?.treeContentBlock?.label|translate) : node?.treeContentBlock?.label}} </a> </label> <!--badges area--> <ng-container *ngFor="let badge of node?.treeContentBlock?.badges"> <eui-badge euiSizeM [euiVariant]="badge.typeClass||\'secondary\'"> {{badge.label}} </eui-badge> </ng-container> <!--metadata, uses the help of ng template to generate dynamic expand variable without handling state --> <ng-container *ngIf="node?.treeContentBlock?.metadata && nodeContentMetadataTemplateRef" [ngTemplateOutlet]="nodeContentMetadataContainer" [ngTemplateOutletContext]="{ $implicit: {expanded:false} }"> </ng-container> <ng-template #nodeContentMetadataContainer let-metaDataContainer> <span class="ux-tree__node-metacontent-toggle ux-tree__node-clickable" (click)="metaDataContainer.expanded=!metaDataContainer.expanded"> <span class="eui-icon" [ngClass]="metaDataContainer.expanded ? \'eui-icon eui-icon-angle-down\' : \'eui-icon eui-icon-angle-right\'"> </span> </span> <div *ngIf="metaDataContainer.expanded" class="ux-tree__node-metacontent"> <!--passing metadata of the node content to provided template-ref:nodeContentMetadataTemplateRef--> <ng-template [ngTemplateOutlet]="nodeContentMetadataTemplateRef" [ngTemplateOutletContext]="{ $implicit: node?.treeContentBlock?.metadata,metadata: node?.treeContentBlock?.metadata}"></ng-template> </div> </ng-template> </ng-container></ng-template></div>'
1535
+ var COMPONENT_TEMPLATE = '<div><ul class="eui-tree"> <cdk-tree [dataSource]="cdkArrayDataSource" [treeControl]="cdkTreeControl" [trackBy]="trackBy" *ngIf="renderTree"> <!-- There are two states of generic cdk-nested-tree-node declarations. First one is without child. No sub rendering. --> <cdk-nested-tree-node *cdkTreeNodeDef="let treeItemModel"> <li class="eui-tree-node" *ngIf="treeItemModel" title="{{getTreeItem(treeItemModel?.path)?.node?.treeContentBlock?.tooltipLabel|| getTreeItem(treeItemModel?.path)?.node?.treeContentBlock?.label}}" > <div class="eui-tree-node-wrapper"> <div (click)="onNodeClick(treeItemModel)"> <!-- Renders node in default or provided template\'s context. Generates onSelect with onSelectFn for developers to send the events from their custom check events. Provides id to be used on generic template --> <ng-container [ngTemplateOutlet]="nodeTemplateRef||nodeTemplateDefault" [ngTemplateOutletContext]="{ $implicit: getTreeItem(treeItemModel?.path)?.node, onSelect:onSelectFn(treeItemModel.path,treeItemModel), id:uid+treeItemModel.path }"> </ng-container> </div> </div> </li> </cdk-nested-tree-node> <!-- This is the tree node template for expandable nodes --> <cdk-nested-tree-node *cdkTreeNodeDef="let treeItemModel when: hasChild"> <li class="eui-tree-node" *ngIf="treeItemModel" title="{{getTreeItem(treeItemModel?.path)?.node?.treeContentBlock?.tooltipLabel|| getTreeItem(treeItemModel?.path)?.node?.treeContentBlock?.label}}"> <div class="eui-tree-node-wrapper"> <button euiButton euiIconButton euiBasicButton euiSizeS [attr.aria-label]="\'Toggle \' + treeItemModel?.node?.treeContentBlock?.label" (click)="onNodeToggle(treeItemModel)" cdkTreeNodeToggle> <span euiIcon *ngIf="!cdkTreeControl.isExpanded(treeItemModel)&&collapsedIconClass" [iconClass]="collapsedIconClass"></span> <span euiIcon *ngIf="cdkTreeControl.isExpanded(treeItemModel)&&expandedIconClass" [iconClass]="expandedIconClass" ></span> <eui-icon-svg *ngIf="!cdkTreeControl.isExpanded(treeItemModel)&&!collapsedIconClass" icon="eui-chevron-forward"></eui-icon-svg> <eui-icon-svg *ngIf="cdkTreeControl.isExpanded(treeItemModel)&&!expandedIconClass" icon="eui-chevron-down"></eui-icon-svg> </button> <!--Here wraps the node, and listen for node clicks.--> <div (click)="onNodeClick(treeItemModel)" class="eui-u-flex"> <!-- Renders node in default or provided template\'s context. Generates onSelect with onSelectFn for developers to send the events from their custom check events. Provides id to be used on generic template --> <ng-container [ngTemplateOutlet]="nodeTemplateRef||nodeTemplateDefault" [ngTemplateOutletContext]="{ $implicit: getTreeItem(treeItemModel?.path)?.node, onSelect:onSelectFn(treeItemModel?.path,treeItemModel), id:uid+treeItemModel.path }"> </ng-container> </div> </div> <!--uses cdkTreeNodeOutlet to render children nodes, CdkTreeControl is used to control isExpanded state.--> <ul class="eui-tree-node" *ngIf="cdkTreeControl.isExpanded(treeItemModel)"> <ng-container cdkTreeNodeOutlet></ng-container> </ul> </li> </cdk-nested-tree-node> </cdk-tree></ul><ng-template #nodeTemplateDefault let-node let-onSelect="onSelect" let-id=id> <ng-container *ngIf="node"> <!--input checkbox area--> <input euiInputCheckBox *ngIf="node && node.selectable" type="checkbox" id="{{id}}" [checked]="node && node.isSelected" (change)="onSelect($event)" class="eui-u-mr-s" > <!--type (typeLabel & typeClass) area--> <ng-container *ngIf="node?.treeContentBlock?.typeLabel" [ngSwitch]="node?.treeContentBlock?.typeClass"> <eui-badge euiSizeM [euiVariant]="node?.treeContentBlock?.typeClass||\'primary\'" class="eui-u-mr-s"> {{node?.treeContentBlock?.typeLabel}} </eui-badge> </ng-container> <!--icon area--> <ng-container *ngIf="node?.treeContentBlock?.iconClass"> <eui-icon euiSizeM [euiVariant]="node?.treeContentBlock?.iconTypeClass||\'primary\'" iconClass="{{node?.treeContentBlock?.iconClass}}" class="eui-u-mr-s"> </eui-icon> </ng-container> <!--label area--> <label *ngIf="!node?.treeContentBlock?.urlExternal" euiLabel class="eui-u-mr-s" for="{{id}}">{{autoTranslate ? (node?.treeContentBlock?.label|translate) : node?.treeContentBlock?.label}}</label> <label *ngIf="node?.treeContentBlock?.urlExternal" euiLabel for="{{id}}" class="eui-u-mr-s"> <a href="{{node?.treeContentBlock?.urlExternal}}" target="{{node?.treeContentBlock?.urlExternalTarget || \'blank\'}}"> {{autoTranslate ? (node?.treeContentBlock?.label|translate) : node?.treeContentBlock?.label}} </a> </label> <!--badges area--> <ng-container *ngFor="let badge of node?.treeContentBlock?.badges"> <eui-badge euiSizeM [euiVariant]="badge.typeClass||\'secondary\'" class="eui-u-ml-s"> {{badge.label}} </eui-badge> </ng-container> <!--metadata, uses the help of ng template to generate dynamic expand variable without handling state --> <ng-container *ngIf="node?.treeContentBlock?.metadata && nodeContentMetadataTemplateRef" [ngTemplateOutlet]="nodeContentMetadataContainer" [ngTemplateOutletContext]="{ $implicit: {expanded:false} }"> </ng-container> <ng-template #nodeContentMetadataContainer let-metaDataContainer> <button euiButton euiBasicButton euiIconButton euiSizeS (click)="metaDataContainer.expanded=!metaDataContainer.expanded"> <eui-icon-svg [icon]="metaDataContainer.expanded ? \'eui-chevron-down\' : \'eui-chevron-forward\'"></eui-icon-svg> </button> <div *ngIf="metaDataContainer.expanded" class="eui-tree-node__metacontent"> <!--passing metadata of the node content to provided template-ref:nodeContentMetadataTemplateRef--> <ng-template [ngTemplateOutlet]="nodeContentMetadataTemplateRef" [ngTemplateOutletContext]="{ $implicit: node?.treeContentBlock?.metadata,metadata: node?.treeContentBlock?.metadata}"></ng-template> </div> </ng-template> </ng-container></ng-template></div>'
1536
1536
  var COMPONENTS = [{'name': 'ChartComponent', 'selector': 'eui-apex-chart'},{'name': 'CollapsedBreadcrumbComponent', 'selector': 'eui-collapsed-breadcrumb'},{'name': 'EuiAlertComponent', 'selector': 'div[euiAlert], eui-alert'},{'name': 'EuiAppBreadcrumbComponent', 'selector': 'eui-app-breadcrumb'},{'name': 'EuiAppComponent', 'selector': 'eui-app'},{'name': 'EuiAppFooterComponent', 'selector': 'eui-app-footer'},{'name': 'EuiAppHeaderComponent', 'selector': 'eui-app-header'},{'name': 'EuiAppSidebarBodyComponent', 'selector': 'eui-app-sidebar-body'},{'name': 'EuiAppSidebarComponent', 'selector': 'eui-app-sidebar'},{'name': 'EuiAppSidebarDrawerComponent', 'selector': 'eui-app-sidebar-drawer'},{'name': 'EuiAppSidebarFooterComponent', 'selector': 'eui-app-sidebar-footer'},{'name': 'EuiAppSidebarHeaderComponent', 'selector': 'eui-app-sidebar-header'},{'name': 'EuiAppSidebarHeaderUserProfileComponent', 'selector': 'eui-app-sidebar-header-user-profile'},{'name': 'EuiAppSidebarMenuComponent', 'selector': 'eui-app-sidebar-menu'},{'name': 'EuiAppToolbarComponent', 'selector': 'eui-app-toolbar'},{'name': 'EuiAppTopMessageComponent', 'selector': 'eui-app-top-message'},{'name': 'EuiAutocompleteAsyncTestComponent', 'selector': 'eui-autocomplete-test-component'},{'name': 'EuiAutocompleteChipsAsyncTestComponent', 'selector': 'eui-autocomplete-test-component'},{'name': 'EuiAutocompleteChipsTestComponent', 'selector': 'eui-autocomplete-test-component'},{'name': 'EuiAutocompleteComponent', 'selector': 'eui-autocomplete, input[euiAutocomplete]'},{'name': 'EuiAutocompleteTestComponent', 'selector': 'eui-autocomplete-test-component'},{'name': 'EuiBadgeComponent', 'selector': 'div[euiBadge], span[euiBadge], eui-badge'},{'name': 'EuiBlockContentComponent', 'selector': 'eui-block-content'},{'name': 'EuiBlockDocumentComponent', 'selector': 'eui-block-document'},{'name': 'EuiBreadcrumbComponent', 'selector': 'eui-breadcrumb'},{'name': 'EuiBreadcrumbItemComponent', 'selector': 'eui-breadcrumb-item'},{'name': 'EuiButtonComponent', 'selector': 'button[euiButton], a[euiButton]'},{'name': 'EuiButtonGroupComponent', 'selector': 'eui-button-group'},{'name': 'EuiButtonsComponent', 'selector': 'eui-buttons'},{'name': 'EuiCardComponent', 'selector': 'eui-card'},{'name': 'EuiCardContentComponent', 'selector': 'eui-card-content'},{'name': 'EuiCardFooterActionButtonsComponent', 'selector': 'eui-card-footer-action-buttons'},{'name': 'EuiCardFooterActionIconsComponent', 'selector': 'eui-card-footer-action-icons'},{'name': 'EuiCardFooterComponent', 'selector': 'eui-card-footer'},{'name': 'EuiCardFooterMenuContentComponent', 'selector': 'eui-card-footer-menu-content'},{'name': 'EuiCardHeaderBodyComponent', 'selector': 'eui-card-header-body'},{'name': 'EuiCardHeaderComponent', 'selector': 'eui-card-header'},{'name': 'EuiCardHeaderLeftContentComponent', 'selector': 'eui-card-header-left-content'},{'name': 'EuiCardHeaderRightContentComponent', 'selector': 'eui-card-header-right-content'},{'name': 'EuiCardHeaderSubtitleComponent', 'selector': 'eui-card-header-subtitle'},{'name': 'EuiCardHeaderTitleComponent', 'selector': 'eui-card-header-title'},{'name': 'EuiCardMediaComponent', 'selector': 'eui-card-media'},{'name': 'EuiChipComponent', 'selector': 'eui-chip, span[euiChip], li[euiChip]'},{'name': 'EuiChipListComponent', 'selector': 'eui-chip-list, div[euiChipList], ul[euiChipList]'},{'name': 'EuiCommonHeaderComponent', 'selector': 'eui-common-header'},{'name': 'EuiDashboardButtonComponent', 'selector': 'eui-dashboard-button'},{'name': 'EuiDashboardCardComponent', 'selector': 'eui-dashboard-card'},{'name': 'EuiDatepickerComponent', 'selector': 'eui-datepicker'},{'name': 'EuiDateRangeSelectorComponent', 'selector': 'eui-date-range-selector'},{'name': 'EuiDialogComponent', 'selector': 'eui-dialog'},{'name': 'EuiDialogContainerComponent', 'selector': 'eui-dialog-container'},{'name': 'EuiDimmerComponent', 'selector': 'eui-dimmer'},{'name': 'EuiDisableContentComponent', 'selector': 'eui-disable-content'},{'name': 'EuiDiscussionThreadComponent', 'selector': 'eui-discussion-thread'},{'name': 'EuiDiscussionThreadItemComponent', 'selector': 'eui-discussion-thread-item'},{'name': 'EuiDropdownButtonChildMenuComponent', 'selector': 'eui-dropdown-button-child-menu'},{'name': 'EuiDropdownButtonMenuComponent', 'selector': 'eui-dropdown-button-menu'},{'name': 'EuiDropdownComponent', 'selector': 'eui-dropdown'},{'name': 'EuiDropdownItemComponent', 'selector': 'eui-dropdown-item, [euiDropdownItem]'},{'name': 'EuiEditorComponent', 'selector': 'eui-editor'},{'name': 'EuiEditorCountersComponent', 'selector': 'eui-editor-counters'},{'name': 'EuiEditorHtmlViewComponent', 'selector': 'eui-editor-html-view'},{'name': 'EuiEditorImageDialogComponent', 'selector': ''},{'name': 'EuiEditorJsonViewComponent', 'selector': 'eui-editor-json-view'},{'name': 'EuiExpandContentComponent', 'selector': 'eui-expand-content'},{'name': 'EuiFeedbackMessageComponent', 'selector': 'eui-feedback-message'},{'name': 'EuiFieldsetComponent', 'selector': 'eui-fieldset'},{'name': 'EuiFilePreviewComponent', 'selector': 'eui-file-preview'},{'name': 'EuiFileUploadComponent', 'selector': 'eui-file-upload'},{'name': 'EuiFileUploadProgressComponent', 'selector': 'eui-file-upload-progress'},{'name': 'EuiFooterComponent', 'selector': 'eui-footer'},{'name': 'EuiGrowlComponent', 'selector': 'eui-growl'},{'name': 'EuiHeaderAppComponent', 'selector': 'eui-header-app'},{'name': 'EuiHeaderAppNameComponent', 'selector': 'eui-header-app-name'},{'name': 'EuiHeaderAppSubtitleComponent', 'selector': 'eui-header-app-subtitle'},{'name': 'EuiHeaderComponent', 'selector': 'eui-header'},{'name': 'EuiHeaderEnvironmentComponent', 'selector': 'eui-header-environment'},{'name': 'EuiHeaderLogoComponent', 'selector': 'eui-header-logo'},{'name': 'EuiHeaderUserProfileComponent', 'selector': 'eui-header-user-profile'},{'name': 'EuiIconColorComponent', 'selector': 'eui-icon-colored, span[euiIconColored], [euiIconColored]'},{'name': 'EuiIconComponent', 'selector': 'div[euiIcon], span[euiIcon], i[euiIcon], eui-icon'},{'name': 'EuiIconSvgComponent', 'selector': 'eui-icon-svg, span[euiIconSvg], i[euiIconSvg]'},{'name': 'EuiIconToggleComponent', 'selector': 'eui-icon-toggle'},{'name': 'EuiInputCheckboxComponent', 'selector': 'input[euiInputCheckBox]'},{'name': 'EuiInputGroupComponent', 'selector': 'div[euiInputGroup]'},{'name': 'EuiInputNumberComponent', 'selector': 'input[euiInputNumber]:not([euiInputCheckBox])'},{'name': 'EuiInputRadioComponent', 'selector': 'input[euiInputRadio]'},{'name': 'EuiInputTextComponent', 'selector': 'input[euiInputText]'},{'name': 'EuiLabelComponent', 'selector': 'label[euiLabel], span[euiLabel], div[euiLabel], a[euiLabel], eui-label,
1537
1537
  label[euiSublabel], span[euiSublabel], div[euiSublabel], a[euiSublabel], eui-sublabel'},{'name': 'EuiLanguageSelectorComponent', 'selector': 'eui-language-selector'},{'name': 'EuiListComponent', 'selector': '[euiList], eui-list'},{'name': 'EuiListItemComponent', 'selector': '[euiListItem], eui-list-item'},{'name': 'EuiMenuComponent', 'selector': 'eui-menu'},{'name': 'EuiMenuItemComponent', 'selector': 'eui-menu-item'},{'name': 'EuiMessageBoxComponent', 'selector': 'eui-message-box'},{'name': 'EuiModalPickerComponent', 'selector': ''},{'name': 'EuiModalSelectorComponent', 'selector': 'eui-modal-selector'},{'name': 'EuiNotificationItemComponent', 'selector': 'eui-notification-item'},{'name': 'EuiNotificationsComponent', 'selector': 'eui-notifications'},{'name': 'EuiOverlayBodyComponent', 'selector': 'eui-overlay-body'},{'name': 'EuiOverlayComponent', 'selector': 'eui-overlay'},{'name': 'EuiOverlayFooterComponent', 'selector': 'eui-overlay-footer'},{'name': 'EuiOverlayHeaderComponent', 'selector': 'eui-overlay-header'},{'name': 'EuiPageBreadcrumbComponent', 'selector': 'eui-page-breadcrumb'},{'name': 'EuiPageColumnComponent', 'selector': 'eui-page-column'},{'name': 'EuiPageColumnsComponent', 'selector': 'eui-page-columns'},{'name': 'EuiPageComponent', 'selector': 'eui-page'},{'name': 'EuiPageContentComponent', 'selector': 'eui-page-content'},{'name': 'EuiPageFooterComponent', 'selector': 'eui-page-footer'},{'name': 'EuiPageHeaderComponent', 'selector': 'eui-page-header'},{'name': 'EuiPageHeroHeaderComponent', 'selector': 'eui-page-hero-header'},{'name': 'EuiPageTopContentComponent', 'selector': 'eui-page-top-content'},{'name': 'EuiPaginatorComponent', 'selector': 'eui-paginator'},{'name': 'EuiPickerComponent', 'selector': 'eui-picker'},{'name': 'EuiPopoverComponent', 'selector': 'eui-popover'},{'name': 'EuiProgressCircleComponent', 'selector': 'eui-progress-circle'},{'name': 'EuiSearchComponent', 'selector': 'eui-search'},{'name': 'EuiSelectComponent', 'selector': 'select[euiSelect]'},{'name': 'EuiSidebarMenuComponent', 'selector': 'eui-sidebar-menu'},{'name': 'EuiSidebarToggleComponent', 'selector': 'eui-sidebar-toggle'},{'name': 'EuiSlideToggleComponent', 'selector': 'eui-slide-toggle'},{'name': 'EuiSlideToggleTestComponent', 'selector': 'eui-slide-toggle-test-component'},{'name': 'EuiTabComponent', 'selector': 'eui-tab'},{'name': 'EuiTabContentComponent', 'selector': 'eui-tab-content, euiTabContent'},{'name': 'EuiTabLabelComponent', 'selector': 'eui-tab-label, euiTabLabel'},{'name': 'EuiTableComponent', 'selector': 'eui-table, table[euiTable]'},{'name': 'EuiTableExpandableRowComponent', 'selector': 'tr[euiTableExpandableRow]'},{'name': 'EuiTableFilterComponent', 'selector': 'eui-table-filter'},{'name': 'EuiTableSelectableHeaderComponent', 'selector': 'tr[isSelectableHeader]'},{'name': 'EuiTableSelectableRowComponent', 'selector': 'tr[isSelectable]'},{'name': 'EuiTableSortableColComponent', 'selector': 'th[sortable]'},{'name': 'EuiTabsComponent', 'selector': 'eui-tabs'},{'name': 'EuiTextareaComponent', 'selector': 'textarea[euiTextArea]'},{'name': 'EuiTimebarComponent', 'selector': 'eui-timebar'},{'name': 'EuiTimelineComponent', 'selector': 'eui-timeline'},{'name': 'EuiTimelineItemComponent', 'selector': 'eui-timeline-item'},{'name': 'EuiTimepickerComponent', 'selector': 'eui-timepicker'},{'name': 'EuiToolbarAppComponent', 'selector': 'eui-toolbar-app'},{'name': 'EuiToolbarComponent', 'selector': 'eui-toolbar'},{'name': 'EuiToolbarEnvironmentComponent', 'selector': 'eui-toolbar-environment'},{'name': 'EuiToolbarItemComponent', 'selector': 'eui-toolbar-item'},{'name': 'EuiToolbarItemNotificationsComponent', 'selector': 'eui-toolbar-item-notifications'},{'name': 'EuiToolbarItemsComponent', 'selector': 'eui-toolbar-items'},{'name': 'EuiToolbarItemSearchComponent', 'selector': 'eui-toolbar-item-search'},{'name': 'EuiToolbarItemUserProfileComponent', 'selector': 'eui-toolbar-item-user-profile'},{'name': 'EuiToolbarLogoComponent', 'selector': 'eui-toolbar-logo'},{'name': 'EuiToolbarMenuComponent', 'selector': 'eui-toolbar-menu'},{'name': 'EuiTooltipContainerComponent', 'selector': 'eui-tooltip-container.component'},{'name': 'EuiTreeComponent', 'selector': 'eui-tree'},{'name': 'EuiUploadedFileComponent', 'selector': 'eui-uploaded-file'},{'name': 'EuiUserProfileComponent', 'selector': 'eui-user-profile'},{'name': 'EuiUserProfileMenuComponent', 'selector': 'eui-user-profile-menu'},{'name': 'EuiUserProfileMenuItemComponent', 'selector': 'eui-user-profile-menu-item'},{'name': 'EuiWizardComponent', 'selector': 'eui-wizard'},{'name': 'EuiWizardStepComponent', 'selector': 'eui-wizard-step'},{'name': 'QuillEditorComponent', 'selector': 'quill-editor'},{'name': 'UxActionBoxComponent', 'selector': 'ux-action-box'},{'name': 'UxAlertComponent', 'selector': 'ux-alert'},{'name': 'UxBadgeComponent', 'selector': 'ux-badge'},{'name': 'UxBadgeGroupComponent', 'selector': 'ux-badge-group'},{'name': 'UxButtonComponent', 'selector': 'ux-button'},{'name': 'UxButtonGroupComponent', 'selector': 'ux-button-group'},{'name': 'UxButtonGroupItemComponent', 'selector': 'ux-button-group-item'},{'name': 'UxCardComponent', 'selector': 'ux-card'},{'name': 'UxChipComponent', 'selector': 'ux-chip'},{'name': 'UxChipsListComponent', 'selector': 'ux-chips-list'},{'name': 'UxChipsListDroppableAreaComponent', 'selector': 'ux-chips-list-droppable-area'},{'name': 'UxControlFeedbackComponent', 'selector': 'ux-control-feedback'},{'name': 'UxDashboardButtonComponent', 'selector': 'ux-dashboard-button'},{'name': 'UxDashboardButtonsComponent', 'selector': 'ux-dashboard-buttons'},{'name': 'UxDashboardCardComponent', 'selector': 'ux-dashboard-card'},{'name': 'UxDatepickerComponent', 'selector': 'ux-datepicker'},{'name': 'UxDateRangeSelectorComponent', 'selector': 'ux-date-range-selector'},{'name': 'UxDisableContentComponent', 'selector': 'ux-disable-content'},{'name': 'UxDiscussionThreadComponent', 'selector': 'ux-discussion-thread'},{'name': 'UxDiscussionThreadItemComponent', 'selector': 'ux-discussion-thread-item'},{'name': 'UxDocumentViewerComponent', 'selector': 'ux-document-viewer'},{'name': 'UxDropdownButtonComponent', 'selector': 'ux-dropdown-button'},{'name': 'UxDropdownButtonItemComponent', 'selector': 'ux-dropdown-button-item'},{'name': 'UxDropdownComponent', 'selector': 'ux-dropdown'},{'name': 'UxDropdownTreeComponent', 'selector': 'ux-dropdown-tree'},{'name': 'UxDynamicMessageBoxComponent', 'selector': 'ux-dynamic-message-box'},{'name': 'UxDynamicModalComponent', 'selector': 'ux-dynamic-modal'},{'name': 'UxDynamicPopoverComponent', 'selector': 'ux-dynamic-popover'},{'name': 'UxEditorComponent', 'selector': 'ux-editor'},{'name': 'UxEditorCountersComponent', 'selector': 'ux-editor-counters'},{'name': 'UxEditorViewComponent', 'selector': 'ux-editor-view'},{'name': 'UxEditorViewHTMLComponent', 'selector': 'ux-editor-view-html'},{'name': 'UxErrorGroupItemComponent', 'selector': 'ux-error-group-item'},{'name': 'UxErrorGroupOutputComponent', 'selector': 'ux-error-group-output'},{'name': 'UxErrorOutputComponent', 'selector': 'ux-error-output'},{'name': 'UxFieldSearchComponent', 'selector': 'ux-field-search'},{'name': 'UxFieldsetComponent', 'selector': 'ux-fieldset'},{'name': 'UxFileUploadComponent', 'selector': 'ux-file-upload'},{'name': 'UxFormControlComponent', 'selector': 'ux-form-control'},{'name': 'UxFormGroupComponent', 'selector': 'ux-form-group'},{'name': 'UxIconComponent', 'selector': 'ux-a-icon'},{'name': 'UxIconToggleComponent', 'selector': 'ux-a-icon-toggle'},{'name': 'UxLabelComponent', 'selector': 'ux-a-label'},{'name': 'UxLayoutHorizontalComponent', 'selector': 'ux-layout-horizontal'},{'name': 'UxLayoutOverlayPanelComponent', 'selector': 'ux-layout-overlay-panel'},{'name': 'UxListItemComponent', 'selector': 'ux-list-item'},{'name': 'UxListItemsComponent', 'selector': 'ux-list-items'},{'name': 'UxLoadingIndicatorComponent', 'selector': 'ux-loading-indicator'},{'name': 'UxMessageBoxComponent', 'selector': 'ux-message-box'},{'name': 'UxMFileUploadComponent', 'selector': 'ux-m-file-upload'},{'name': 'UxMFileUploadQueueComponent', 'selector': 'ux-m-file-upload-queue'},{'name': 'UxModalComponent', 'selector': 'ux-modal'},{'name': 'UxOverlayComponent', 'selector': 'ux-overlay'},{'name': 'UxPanelComponent', 'selector': 'ux-panel'},{'name': 'UxPanelsComponent', 'selector': 'ux-panels'},{'name': 'UxPopoverComponent', 'selector': 'ux-popover'},{'name': 'UxProgressCircleComponent', 'selector': 'ux-progress-circle'},{'name': 'UxSplitButtonComponent', 'selector': 'ux-split-button'},{'name': 'UxStaticTabsComponent', 'selector': 'ux-static-tabs'},{'name': 'UxSwitchComponent', 'selector': 'ux-switch'},{'name': 'UxTabComponent', 'selector': 'ux-tab'},{'name': 'UxTabsBarComponent', 'selector': 'ux-tabs-bar'},{'name': 'UxTabsComponent', 'selector': 'ux-tabs'},{'name': 'UxTagComponent', 'selector': 'ux-a-tag'},{'name': 'UxTimebarComponent', 'selector': 'ux-timebar'},{'name': 'UxTimelineItemComponent', 'selector': 'ux-timeline-item'},{'name': 'UxTimelineItemsComponent', 'selector': 'ux-timeline-items'},{'name': 'UxTimepickerComponent', 'selector': 'ux-timepicker'},{'name': 'UxTreeComponent', 'selector': 'ux-tree'},{'name': 'UxTreeListComponent', 'selector': 'ux-tree-list'},{'name': 'UxTreeListItemComponent', 'selector': 'ux-tree-list-item'},{'name': 'UxTreeNodeComponent', 'selector': 'ux-tree-node'},{'name': 'UxWizardStepComponent', 'selector': 'ux-wizard-step'},{'name': 'UxWizardStepsComponent', 'selector': 'ux-wizard-steps'}];
1538
1538
  var DIRECTIVES = [{'name': 'AutoResizeDirective', 'selector': 'textarea[autoResize]'},{'name': 'BaseDirective', 'selector': '[euiBase]'},{'name': 'CollapsedButtonDirective', 'selector': 'collapsed-button'},{'name': 'EuiActionButtonsDirective', 'selector': 'eui-action-buttons'},{'name': 'EuiAppPageWrapperDirective', 'selector': 'eui-app-page-wrapper'},{'name': 'EuiButtonsActionsContentTagDirective', 'selector': 'euiButtonsActionsContent'},{'name': 'EuiButtonsLocalMenuContentTagDirective', 'selector': 'euiButtonsLocalMenuContent'},{'name': 'EuiChipListAppendContentDirective', 'selector': 'euiChipListAppendContent'},{'name': 'EuiDashboardButtonIconDirective', 'selector': 'eui-dashboard-button-icon'},{'name': 'EuiDashboardButtonLabelDirective', 'selector': 'eui-dashboard-button-label'},{'name': 'EuiDialogFooterDirective', 'selector': 'eui-dialog-footer'},{'name': 'EuiDialogHeaderDirective', 'selector': 'eui-dialog-header'},{'name': 'EuiDropdownContentDirective', 'selector': 'eui-dropdown-content'},{'name': 'EuiEditorCustomToolbarTagDirective', 'selector': 'euiEditorCustomToolbar'},{'name': 'EuiEditorMaxlengthDirective', 'selector': '[formControlName][euiEditorMaxlength]'},{'name': 'EuiFieldsetLabelExtraContentTagDirective', 'selector': 'euiFieldsetLabelExtraContent'},{'name': 'EuiFieldsetLabelRightContentTagDirective', 'selector': 'euiFieldsetLabelRightContent'},{'name': 'EuiHasPermissionDirective', 'selector': '[euiHasPermission]'},{'name': 'EuiHeaderAppNameDirective', 'selector': 'eui-header-app-name'},{'name': 'EuiHeaderAppSubtitleDirective', 'selector': 'eui-header-app-subtitle'},{'name': 'EuiLetterFormatDirective', 'selector': '[euiLetterFormat]'},{'name': 'EuiMaxLengthDirective', 'selector': '
@@ -249,9 +249,9 @@
249
249
  <li>
250
250
  <b>@stackblitz/sdk</b> : 1.8.0</li>
251
251
  <li>
252
- <b>@eui/ecl</b> : 15.0.0-rc.19</li>
252
+ <b>@eui/ecl</b> : 15.0.0-rc.20</li>
253
253
  <li>
254
- <b>@eui/styles-base</b> : 15.0.0-rc.19</li>
254
+ <b>@eui/styles-base</b> : 15.0.0-rc.20</li>
255
255
  <li>
256
256
  <b>@eui/tools</b> : ^6.0.0</li>
257
257
  </ul>