fix(core/application-switch-modal): add border-radius to app icon

packages/core/component-doc.json

@@ -17291,6 +17291,26 @@
       "docstring": "",
       "path": "src/components/card/card.tsx"
     },
+    "src/components/typography/typography.tsx::TypographyVariants": {
+      "declaration": "export type TypographyVariants =\n  | 'x-small'\n  | 'small'\n  | 'caption'\n  | 'caption-single'\n  | 'default'\n  | 'default-single'\n  | 'default-title'\n  | 'default-title-single'\n  | 'large'\n  | 'large-single'\n  | 'large-title'\n  | 'large-title-single'\n  | 'h2'\n  | 'display-large';",
+      "docstring": "",
+      "path": "src/components/typography/typography.tsx"
+    },
+    "src/components/typography/typography.tsx::TypographyFormat": {
+      "declaration": "export type TypographyFormat =\n  | TypographyFormatLabel\n  | TypographyFormatBody\n  | TypographyFormatDisplay\n  | TypographyFormatHeading\n  | TypographyFormatCode;",
+      "docstring": "",
+      "path": "src/components/typography/typography.tsx"
+    },
+    "src/components/typography/typography.tsx::TypographyColors": {
+      "declaration": "export type TypographyColors =\n  | 'contrast'\n  | 'std'\n  | 'soft'\n  | 'weak'\n  | 'inv-contrast'\n  | 'inv-std'\n  | 'inv-soft'\n  | 'inv-weak'\n  | 'alarm';",
+      "docstring": "",
+      "path": "src/components/typography/typography.tsx"
+    },
+    "src/components/typography/typography.tsx::TextDecoration": {
+      "declaration": "export type TextDecoration = 'none' | 'underline' | 'line-through';",
+      "docstring": "",
+      "path": "src/components/typography/typography.tsx"
+    },
     "src/components/action-card/action-card.tsx::ActionCardVariant": {
       "declaration": "export type CardVariant =\n  | 'insight'\n  | 'notification'\n  | 'alarm'\n  | 'critical'\n  | 'warning'\n  | 'info'\n  | 'neutral'\n  | 'success'\n  | 'primary';",
       "docstring": "",
@@ -17421,26 +17441,6 @@
       "docstring": "",
       "path": "src/components/pane/pane.tsx"
     },
-    "src/components/typography/typography.tsx::TypographyVariants": {
-      "declaration": "export type TypographyVariants =\n  | 'x-small'\n  | 'small'\n  | 'caption'\n  | 'caption-single'\n  | 'default'\n  | 'default-single'\n  | 'default-title'\n  | 'default-title-single'\n  | 'large'\n  | 'large-single'\n  | 'large-title'\n  | 'large-title-single'\n  | 'h2'\n  | 'display-large';",
-      "docstring": "",
-      "path": "src/components/typography/typography.tsx"
-    },
-    "src/components/typography/typography.tsx::TypographyFormat": {
-      "declaration": "export type TypographyFormat =\n  | TypographyFormatLabel\n  | TypographyFormatBody\n  | TypographyFormatDisplay\n  | TypographyFormatHeading\n  | TypographyFormatCode;",
-      "docstring": "",
-      "path": "src/components/typography/typography.tsx"
-    },
-    "src/components/typography/typography.tsx::TypographyColors": {
-      "declaration": "export type TypographyColors =\n  | 'contrast'\n  | 'std'\n  | 'soft'\n  | 'weak'\n  | 'inv-contrast'\n  | 'inv-std'\n  | 'inv-soft'\n  | 'inv-weak'\n  | 'alarm';",
-      "docstring": "",
-      "path": "src/components/typography/typography.tsx"
-    },
-    "src/components/typography/typography.tsx::TextDecoration": {
-      "declaration": "export type TextDecoration = 'none' | 'underline' | 'line-through';",
-      "docstring": "",
-      "path": "src/components/typography/typography.tsx"
-    },
     "src/components/push-card/push-card.tsx::PushCardVariant": {
       "declaration": "export type CardVariant =\n  | 'insight'\n  | 'notification'\n  | 'alarm'\n  | 'critical'\n  | 'warning'\n  | 'info'\n  | 'neutral'\n  | 'success'\n  | 'primary';",
       "docstring": "",

packages/core/src/components/application-header/application-switch-modal/application-switch-modal.scss

@@ -77,5 +77,6 @@
   .AppIcon {
     width: 3rem;
     height: 3rem;
+    border-radius: 0.25rem;
   }
 }

packages/core/src/tests/application/application-switch/index.html

@@ -0,0 +1,61 @@
+<!--
+SPDX-FileCopyrightText: 2023 Siemens AG
+
+SPDX-License-Identifier: MIT
+-->
+
+<html>
+  <head>
+    <meta charset="utf-8" />
+    <meta
+      name="viewport"
+      content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=5.0"
+    />
+    <title>Stencil Component Starter</title>
+  </head>
+  <body>
+    <ix-application>
+      <ix-application-header name="My Application">
+        <div class="placeholder-logo" slot="logo"></div>
+      </ix-application-header>
+      <ix-menu>
+        <ix-menu-item>Item 1</ix-menu-item>
+        <ix-menu-item>Item 2</ix-menu-item>
+      </ix-menu>
+
+      <ix-content>
+        <ix-content-header
+          slot="header"
+          header-title="My Content Page"
+        >
+        </ix-content-header>
+      </ix-content>
+    </ix-application>
+    <script type="module">
+      const application = document.querySelector('ix-application');
+      application.appSwitchConfig = {
+        i18nAppSwitch: 'Switch to Application',
+        currentAppId: 'demo-app-2',
+        apps: [
+          {
+            id: 'demo-app-1',
+            name: 'Floor App',
+            iconSrc: './genetic-data.svg',
+            url: 'https://ix.siemens.io/',
+            description: 'Example description for Floor app',
+            target: '_self',
+          },
+          {
+            id: 'demo-app-2',
+            name: 'Calculator App',
+            iconSrc: './square-play.svg',
+            url: 'https://ix.siemens.io/',
+            description: 'Example description for Calculator app',
+            target: '_self',
+          },
+        ],
+      };
+    </script>
+    <script src="http://127.0.0.1:8080/scripts/e2e/load-e2e-runtime.js"></script>
+  </body>
+</html>

packages/core/src/tests/application/application.e2e.ts

@@ -221,3 +221,21 @@ regressionTest.describe('basic navigation mobile', () => {
     });
   });
 });
+
+regressionTest.describe('application-switch', () => {
+  regressionTest('modal', async ({ page }) => {
+    await page.goto('application/application-switch');
+
+    const appSwitchButton = page.getByRole('button', { name: 'Apps' });
+    await appSwitchButton.click();
+
+    await page.waitForTimeout(1000);
+    const modal = page.locator('ix-modal');
+    await expect(modal).toHaveClass(/hydrated/);
+
+    await expect(page).toHaveScreenshot({
+      fullPage: true,
+      animations: 'disabled',
+    });
+  });
+});