Merge branch 'main' into eui+/welcome-banner

.buildkite/scripts/pipelines/pipeline_deploy_new_docs.sh

@@ -28,8 +28,10 @@ yarn
 
 echo "+++ :yarn: Building @elastic/eui-website and its local dependencies"
 
+analytics_vault="secret/ci/elastic-eui/analytics"
 # Pass base url to docusaurus. It must have a leading and trailing slash included.
 export DOCS_BASE_URL="/${bucket_directory}"
+export DOCS_GOOGLE_TAG_MANAGER_ID="$(retry 5 vault read -field=google_tag_manager_id "${analytics_vault}")"
 
 yarn workspaces foreach -Rpt --from @elastic/eui-website run build
 

packages/eui/src/components/combo_box/combo_box.spec.tsx

@@ -58,7 +58,7 @@ describe('EuiComboBox', () => {
       cy.get('[data-test-subj="comboBoxSearchInput"]').should(
         'have.attr',
         'style',
-        'inline-size: 121px;'
+        'inline-size: 122px;'
       );
     });
 
@@ -70,7 +70,7 @@ describe('EuiComboBox', () => {
       cy.get('[data-test-subj="comboBoxSearchInput"]').should(
         'have.attr',
         'style',
-        'inline-size: 67px;'
+        'inline-size: 65px;'
       );
 
       cy.realPress('{downarrow}');
@@ -92,7 +92,7 @@ describe('EuiComboBox', () => {
       cy.get('[data-test-subj="comboBoxSearchInput"]').should(
         'have.attr',
         'style',
-        'inline-size: 387px;'
+        'inline-size: 388px;'
       );
       cy.get('[data-test-subj="comboBoxSearchInput"]')
         .invoke('width')
@@ -156,7 +156,7 @@ describe('EuiComboBox', () => {
       cy.get('.euiTextTruncate').should('exist');
       cy.get('[data-test-subj="truncatedText"]').should(
         'have.text',
-        'Lorem ipsum …piscing elit.'
+        'Lorem ipsum …iscing elit.'
       );
     });
 

packages/eui/src/components/datagrid/body/cell/data_grid_cell_popover.spec.tsx

@@ -248,10 +248,10 @@ describe('EuiDataGridCellPopover', () => {
       cy.get('[data-test-subj="euiDataGridExpansionPopover"]')
         .should('have.css', 'top', '73px')
         .should('have.css', 'left')
-        .and('match', /^254[.\d]+px$/);
+        .and('match', /^255[.\d]+px$/);
       cy.get('[data-test-subj="euiDataGridExpansionPopover"]')
         .should('have.css', 'width')
-        .and('match', /^144[.\d]+px$/);
+        .and('match', /^143[.\d]+px$/);
     });
 
     describe('max popover dimensions', () => {

packages/eui/src/components/form/range/range.spec.tsx

@@ -34,8 +34,8 @@ const sharedProps = {
     },
   ],
 };
-const firstExpectedLevel = /^0px 255[.0-9]+px$/;
-const secondExpectedLevel = /^71[.0-9]+px 0px$/;
+const firstExpectedLevel = /^0px 256[.0-9]+px$/;
+const secondExpectedLevel = /^72[.0-9]+px 0px$/;
 
 describe('EuiRange', () => {
   const props = {
@@ -59,7 +59,7 @@ describe('EuiRange', () => {
     cy.get('.euiRangeTick')
       .last()
       .should('have.css', 'inset-inline-start')
-      .and('match', /^319[.0-9]+px$/);
+      .and('match', /^320[.0-9]+px$/);
 
     // Levels - present in both EuiRangeLevels and EuiHighlight
     cy.get('.euiRangeLevel')
@@ -84,12 +84,12 @@ describe('EuiRange', () => {
     cy.get('.euiRangeHighlight > div')
       .should('have.css', 'margin-inline-start', '0px')
       .should('have.css', 'inline-size')
-      .and('match', /^163[.0-9]+px$/);
+      .and('match', /^164[.0-9]+px$/);
 
     // Tooltip
     cy.get('.euiRangeTooltip > output')
       .should('have.css', 'inset-inline-start')
-      .and('match', /^155[.0-9]+px$/);
+      .and('match', /^156[.0-9]+px$/);
   };
 
   it('renders ticks, levels, highlights, and tooltips in their correct positions', () => {

packages/eui/src/components/selectable/selectable.spec.tsx

@@ -296,7 +296,7 @@ describe('EuiSelectable', () => {
         cy.get('.euiTextTruncate').should('exist');
         cy.get('[data-test-subj="truncatedText"]').should(
           'have.text',
-          'Lorem ipsum d…ipiscing elit.'
+          'Lorem ipsum d…piscing elit.'
         );
       });
 
@@ -354,7 +354,7 @@ describe('EuiSelectable', () => {
         cy.viewport(100, 100);
         cy.get('[data-test-subj="truncatedText"]').should(
           'have.text',
-          'Lor…lit.'
+          'Lor…it.'
         );
       });
 

packages/eui/src/components/text_truncate/text_truncate.spec.tsx

@@ -42,7 +42,7 @@ describe('EuiTextTruncate', () => {
   });
 
   describe('truncation', () => {
-    const expectedMiddleOutput = 'Lorem ipsum d…adipiscing elit';
+    const expectedMiddleOutput = 'Lorem ipsum d…dipiscing elit';
     const expectedStartOutput = '…t, consectetur adipiscing elit';
     const expectedEndOutput = 'Lorem ipsum dolor sit amet, …';
     const expectedStartEndOutput = '…lor sit amet, consectetur a…';

packages/eui/src/components/text_truncate/utils.spec.tsx

@@ -28,7 +28,7 @@ describe('Truncation utils', () => {
     start: '...t, consectetur adipiscing elit',
     end: 'Lorem ipsum dolor sit amet, ...',
     startEnd: '...lor sit amet, consectetur a...',
-    middle: 'Lorem ipsum d...adipiscing elit',
+    middle: 'Lorem ipsum d...dipiscing elit',
   };
 
   describe('truncation types logic', () => {

packages/website/docusaurus.config.ts

@@ -11,6 +11,7 @@ import type { Config } from '@docusaurus/types';
 import type * as Preset from '@docusaurus/preset-classic';
 
 const baseUrl = process.env.DOCS_BASE_URL || '/';
+const googleTagManagerId = process.env.DOCS_GOOGLE_TAG_MANAGER_ID || undefined;
 
 const config: Config = {
   title: 'Elastic UI Framework',
@@ -49,6 +50,9 @@ const config: Config = {
           showReadingTime: true,
           editUrl: 'https://github.com/elastic/eui/tree/main/website/',
         },
+        googleTagManager: {
+          containerId: googleTagManagerId,
+        }
       } satisfies Preset.Options,
     ],
   ],