chore: solve merge conflicts

.changeset/chilly-feet-chew.md

@@ -0,0 +1,5 @@
+---
+'@baloise/ds-core': patch
+---
+
+**angular**: explicit set standalone for all components

.changeset/fluffy-moose-fly.md

@@ -0,0 +1,5 @@
+---
+'@baloise/ds-core': major
+---
+
+**angular**: remove angular-legacy to support treeshaking by angular

.changeset/moody-colts-press.md

@@ -0,0 +1,5 @@
+---
+'@baloise/ds-core': major
+---
+
+**vue**: Direct support of the framework Vue has been dropped, due to less usage inside the company.

.changeset/neat-laws-matter.md

@@ -0,0 +1,5 @@
+---
+'@baloise/ds-core': minor
+---
+
+**angular**: angular v19 support

.changeset/pretty-dots-refuse.md

@@ -0,0 +1,5 @@
+---
+'@baloise/ds-core': major
+---
+
+**styles**: The deprecated `@baloise/ds-css` package has been removed. Please migrate to `@baloise/ds-styles`. 

.eslintrc.base.json

@@ -4,7 +4,7 @@
   "plugins": ["@nx"],
   "overrides": [
     {
-      "files": ["*.ts", "*.tsx", "*.js", "*.jsx", "*.vue"],
+      "files": ["*.ts", "*.tsx", "*.js", "*.jsx"],
       "rules": {
         "@nx/enforce-module-boundaries": [
           "error",

.github/ISSUE_TEMPLATE/bug_report.yml

@@ -10,7 +10,7 @@ body:
 
         > The core team will screen the issues every thursday.
         > If it is a urgent(users in prod are blocked and there are no workarounds) bug needs to be checked before thursday,
-        > then please contact the Teams channel `Web, Frontend - Angular, React, Vue.js, HTML, CSS`.
+        > then please contact the Teams channel `Web, Frontend - Angular, React, HTML, CSS`.
   - type: textarea
     id: current-behavior
     attributes:

.github/workflows/actions/angular-setup/action.yml

@@ -52,12 +52,6 @@ runs:
         path: ./packages/angular/src
         filename: Angular.zip
 
-    - uses: ./.github/workflows/actions/download-archive
-      with:
-        name: angular-legacy
-        path: ./packages/angular-legacy/src
-        filename: AngularLegacy.zip
-
     - uses: ./.github/workflows/actions/download-archive
       with:
         name: angular-module

.github/workflows/actions/build/action.yml

@@ -99,13 +99,6 @@ runs:
         output: packages/angular-module/src/AngularModule.zip
         paths: packages/angular-module/src/generated
 
-    - uses: ./.github/workflows/actions/upload-archive
-      if: inputs.build == 'true'
-      with:
-        name: angular-legacy
-        output: packages/angular-legacy/src/AngularLegacy.zip
-        paths: packages/angular-legacy/src/generated
-
     - uses: ./.github/workflows/actions/upload-archive
       if: inputs.build == 'true'
       with:

.github/workflows/continuous.yml

@@ -69,7 +69,7 @@ jobs:
     strategy:
       fail-fast: false
       matrix:
-        apps: [v16, v17, v18]
+        apps: [v17, v18, v19]
     needs: [build]
     steps:
       - uses: actions/checkout@v4

.gitignore

@@ -44,6 +44,7 @@ testem.log
 Thumbs.db
 
 .nx/cache
+.nx/workspace-data
 .stencil
 
 packages/core/icons
@@ -71,7 +72,6 @@ packages/devkit/src/**/*.d.ts
 
 libs/output-targets-angular/CHANGELOG.md
 libs/output-targets-react/CHANGELOG.md
-libs/output-targets-vue/CHANGELOG.md
 
 e2e/generated
 e2e/downloads
@@ -110,12 +110,10 @@ test/angular/*
 packages/brand-icons/CHANGELOG.md
 packages/devkit/CHANGELOG.md
 packages/angular-common/CHANGELOG.md
-packages/angular-legacy/CHANGELOG.md
 packages/angular-module/CHANGELOG.md
 packages/angular/CHANGELOG.md
 packages/react/CHANGELOG.md
 packages/table/CHANGELOG.md
-packages/vue/CHANGELOG.md
 packages/css/CHANGELOG.md
 packages/styles/CHANGELOG.md
 packages/favicons/CHANGELOG.md
@@ -127,20 +125,17 @@ packages/tokens/CHANGELOG.md
 libs/nx/CHANGELOG.md
 libs/output-targets-angular/CHANGELOG.md
 libs/output-targets-react/CHANGELOG.md
-libs/output-targets-vue/CHANGELOG.md
 docs/CHANGELOG.md
 e2e/CHANGELOG.md
 
 packages/core/README.md
 packages/brand-icons/README.md
 packages/devkit/README.md
 packages/angular-common/README.md
-packages/angular-legacy/README.md
 packages/angular-module/README.md
 packages/angular/README.md
 packages/react/README.md
 packages/table/README.md
-packages/vue/README.md
 packages/css/README.md
 packages/styles/README.md
 packages/favicons/README.md
@@ -152,20 +147,17 @@ packages/tokens/README.md
 libs/nx/README.md
 libs/output-targets-angular/README.md
 libs/output-targets-react/README.md
-libs/output-targets-vue/README.md
 docs/README.md
 e2e/README.md
 
 packages/core/LICENSE
 packages/brand-icons/LICENSE
 packages/devkit/LICENSE
 packages/angular-common/LICENSE
-packages/angular-legacy/LICENSE
 packages/angular-module/LICENSE
 packages/angular/LICENSE
 packages/react/LICENSE
 packages/table/LICENSE
-packages/vue/LICENSE
 packages/css/LICENSE
 packages/styles/LICENSE
 packages/favicons/LICENSE
@@ -177,6 +169,8 @@ packages/tokens/LICENSE
 libs/nx/LICENSE
 libs/output-targets-angular/LICENSE
 libs/output-targets-react/LICENSE
-libs/output-targets-vue/LICENSE
 docs/LICENSE
 e2e/LICENSE
+
+vite.config.*.timestamp*
+vitest.config.*.timestamp*

.prettierignore

@@ -35,3 +35,5 @@ e2e/cypress/downloads
 
 package-lock.json
 *.svg
+
+/.nx/workspace-data

docs/.eslintrc.json

@@ -22,7 +22,6 @@
             "ignoredDependencies": [
               "@baloise/ds-brand-icons",
               "@baloise/ds-icons",
-              "@baloise/ds-css",
               "@baloise/ds-tokens",
               "react-dom",
               "js-beautify",

docs/.storybook/addons/framework/register.js

@@ -19,10 +19,6 @@ const AngularSVG = `<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/200
 </g>
 </svg>
 `
-
-const VueSVG = `<svg version="1.1" viewBox="0 0 261.76 226.69" xmlns="http://www.w3.org/2000/svg"><g transform="matrix(1.3333 0 0 -1.3333 -76.311 313.34)"><g transform="translate(178.06 235.01)"><path d="m0 0-22.669-39.264-22.669 39.264h-75.491l98.16-170.02 98.16 170.02z" fill="#41b883"/></g><g transform="translate(178.06 235.01)"><path d="m0 0-22.669-39.264-22.669 39.264h-36.227l58.896-102.01 58.896 102.01z" fill="#34495e"/></g></g></svg>
-`
-
 const ReactSVG = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="-11.5 -10.23174 23 20.46348">
   <title>React Logo</title>
   <circle cx="0" cy="0" r="2.05" fill="#61dafb"/>
@@ -41,18 +37,16 @@ const JavaScriptSVG = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 630
 const SvgIcons = {
   angular: AngularSVG,
   react: ReactSVG,
-  vue: VueSVG,
   html: JavaScriptSVG,
 }
 
 const labels = {
   angular: 'Angular',
   html: 'HTML & JS',
   react: 'React',
-  vue: 'Vue.js',
 }
 
-const frameworks = ['angular', 'html', 'react', 'vue']
+const frameworks = ['angular', 'html', 'react']
 
 const LOCAL_STORE_ID = 'bal-docs-framework'
 
@@ -154,14 +148,6 @@ addons.register('my/framework', () => {
                     <div className="my-framework__button__icon" dangerouslySetInnerHTML={{ __html: ReactSVG }}></div>
                     React
                   </a>
-                  <a
-                    id="vue"
-                    className={`my-framework__tooltip__item${isActive('vue')}`}
-                    onClick={() => handleItemClick('vue')}
-                  >
-                    <div className="my-framework__button__icon" dangerouslySetInnerHTML={{ __html: VueSVG }}></div>
-                    Vue
-                  </a>
                 </div>
               )
             }}

docs/.storybook/blocks/CodeSandbox.tsx

@@ -41,7 +41,7 @@ export const CodeSandbox = ({ of }) => {
 
   const label = template === '' ? 'Try Online' : `Code Sandbox`
 
-  if (framework === 'vue' || (of && framework !== 'angular')) {
+  if (of && framework !== 'angular') {
     return ''
   }
 

docs/.storybook/blocks/Framework.tsx

@@ -31,16 +31,6 @@ export const ReactFramework = ({ children }) => {
   return null
 }
 
-export const VueFramework = ({ children }) => {
-  const globalFramework = global['__STORYBOOK_PREVIEW__'].storyStore.globals.globals.framework
-
-  if (globalFramework === 'vue') {
-    return <div className="sbdocs-content">{children}</div>
-  }
-
-  return null
-}
-
 export const HTMLFramework = ({ children }) => {
   const globalFramework = global['__STORYBOOK_PREVIEW__'].storyStore.globals.globals.framework
 

docs/.storybook/blocks/PackageTable.tsx

@@ -76,12 +76,6 @@ export const PackageTable = ({ children }) => {
           </td>
           <td>React component proxies based on the the core package.</td>
         </tr>
-        <tr>
-          <td>
-            <strong>Vue</strong>
-          </td>
-          <td>Vue component proxies based on the the core package.</td>
-        </tr>
         <tr>
           <td>
             <strong>Table</strong>

docs/.storybook/blocks/utils/code-sandbox.util.ts

@@ -1,4 +1,4 @@
-export type Frameworks = 'angular' | 'react' | 'html' | 'vue'
+export type Frameworks = 'angular' | 'react' | 'html'
 
 export const parseMarkdown = (content: string) => {
   if (content.startsWith('```')) {
@@ -18,7 +18,7 @@ export const getFramework = (): Frameworks => {
   const urlSearchParams = new URLSearchParams(window.location.search)
   const params = Object.fromEntries(urlSearchParams.entries())
   let paramFramework: string | undefined = params.globals?.replace('framework:', '')
-  const frameworks = ['angular', 'html', 'react', 'vue']
+  const frameworks = ['angular', 'html', 'react']
   paramFramework = frameworks.includes(paramFramework) ? paramFramework : undefined
   if (paramFramework !== undefined) {
     localStorage.setItem('bal-docs-framework', JSON.stringify(paramFramework))

docs/.storybook/blocks/welcome/WelcomeGuide.tsx

@@ -18,7 +18,7 @@ export const WelcomeGuide = ({ children }) => {
         <LinkCard
           pageTitle={'Development/Getting Started'}
           label={'Development'}
-          description={'Getting Started with HTML, Angular, React or Vue.js'}
+          description={'Getting Started with HTML, Angular or React'}
         />
         <LinkCard pageTitle={'Changelog'} description={"What's new?"} />
         <LinkCard pageTitle={'Support'} description={'Ask a question, report a bug or request a feature'} />

docs/package.json

@@ -6,7 +6,6 @@
     "@baloise/ds-brand-icons": "17.3.0",
     "@baloise/ds-core": "17.3.0",
     "@baloise/ds-styles": "17.3.0",
-    "@baloise/ds-css": "17.3.0",
     "@baloise/ds-icons": "17.3.0",
     "@baloise/ds-tokens": "17.3.0",
     "@storybook/addon-essentials": "~7.6.10",

docs/stories/changelog.stories.mdx

@@ -43,7 +43,7 @@ a separate changelog file.
     <LinkCard
       pageTitle={'Development/Getting Started'}
       label={'Development'}
-      description={'Getting Started with HTML, Angular, React or Vue.js'}
+      description={'Getting Started with HTML, Angular or React'}
     />
     <LinkCard
       label={'Contributing'}

docs/stories/components/bal-icon/bal-icon.mdx

@@ -9,7 +9,6 @@ import {
   ButtonCard,
   AngularFramework,
   ReactFramework,
-  VueFramework,
   HTMLFramework,
 } from '../../../.storybook/blocks'
 import * as IconStories from './bal-icon.stories'
@@ -136,43 +135,6 @@ export default function Example() {
 
 </ReactFramework>
 
-<VueFramework>
-
-### Import during initialization
-
-Import the icons form the `@baloise/ds-icons` package and pass them with the BalConfig during the initialization.
-
-```ts
-import { balIconStarFull } from '@baloise/ds-icons'
-
-createApp(App)
-  .use(
-    createBaloiseDesignSystem({
-      defaults: {
-        icons: { balIconStarFull },
-      },
-    }),
-  )
-  .mount('#app')
-```
-
-### Import into the component
-
-When importing an SVG into your component you decrease the initial page load. So you use the SVG only where you needed and at the time you wanted.
-
-```html
-<script lang="ts" setup>
-  import { BalIcon } from '@baloise/ds-vue'
-  import { balIconStarFull } from '@baloise/ds-icons'
-</script>
-
-<template>
-  <BalIcon :svg="balIconStarFull"></BalIcon>
-</template>
-```
-
-</VueFramework>
-
 <HTMLFramework>
 
 ### Import during initialization
@@ -246,21 +208,6 @@ export default function Example() {
 
 </ReactFramework>
 
-<VueFramework>
-
-```html
-<script lang="ts" setup>
-  import { BalIcon } from '@baloise/ds-vue'
-  import { balBrandIconCarCrashWithAnimalGreen } from '@baloise/ds-brand-icons'
-</script>
-
-<template>
-  <BalIcon :svg="balBrandIconCarCrashWithAnimalGreen"></BalIcon>
-</template>
-```
-
-</VueFramework>
-
 <HTMLFramework>
 
 ```js

docs/stories/components/bal-table/bal-table.mdx

@@ -21,7 +21,7 @@ import * as TableStories from './bal-table.stories'
 
 [AG Grid](https://www.ag-grid.com/) is a powerful and feature-rich JavaScript data grid library used for building interactive and performant tables in web applications.
 It provides a wide range of functionalities, including sorting, filtering, grouping, and advanced customization options, making it a popular choice for displaying and
-manipulating large sets of data in a user-friendly manner. AG Grid is widely used in enterprise applications and provides support for various frameworks like Angular, React, and Vue.js.
+manipulating large sets of data in a user-friendly manner. AG Grid is widely used in enterprise applications and provides support for various frameworks like Angular and React.
 
 <CodeSandbox of={TableStories.AgGrid} />
 
@@ -52,7 +52,6 @@ please set the class `ag-theme-alpine` to the AG-Grid element to get the Baloise
 - for [Javascript](https://www.ag-grid.com/javascript-data-grid/getting-started/)
 - for [Angular](https://www.ag-grid.com/angular-data-grid/getting-started/)
 - for [React](https://www.ag-grid.com/react-data-grid/getting-started/)
-- for [Vue](https://www.ag-grid.com/vue-data-grid/getting-started/)
 
 #### Custom Renderer