From abfcea9c52ec1ca5650ffffc73293e687f6134af Mon Sep 17 00:00:00 2001 From: Tommmaso Menga Date: Tue, 14 May 2024 10:39:11 +0200 Subject: [PATCH 01/17] refactor: create '@lyne-esta/elements-experimental' library --- package.json | 4 +- scripts/docs_generate.ts | 2 +- src/elements-experimental/package.json | 22 +++++ src/elements-experimental/tsconfig.json | 13 +++ src/elements-experimental/tsconfig.spec.json | 4 + src/elements-experimental/vite.config.ts | 82 +++++++++++++++++++ .../custom-elements-manifest.config.js | 2 +- tsconfig.json | 2 + vite.config.ts | 8 ++ 9 files changed, 136 insertions(+), 3 deletions(-) create mode 100644 src/elements-experimental/package.json create mode 100644 src/elements-experimental/tsconfig.json create mode 100644 src/elements-experimental/tsconfig.spec.json create mode 100644 src/elements-experimental/vite.config.ts diff --git a/package.json b/package.json index e97ca5f55c..a7e8ecf8aa 100644 --- a/package.json +++ b/package.json @@ -21,9 +21,11 @@ "private": true, "scripts": { "postinstall": "yarn playwright install", - "build:components": "npm-run-all --sequential build:components:*", + "build:components": "npm-run-all --sequential build:components:* build:components-experimental:*", "build:components:production": "vite build --config src/components/vite.config.ts", "build:components:development": "NODE_ENV=development vite build --mode development --config src/components/vite.config.ts", + "build:components-experimental:production": "vite build --config src/elements-experimental/vite.config.ts", + "build:components-experimental:development": "NODE_ENV=development vite build --mode development --config src/elements-experimental/vite.config.ts", "build:react": "npm-run-all --sequential build:react:*", "build:react:production": "vite build --config src/react/vite.config.ts", "build:react:development": "NODE_ENV=development vite build --mode development --config src/react/vite.config.ts", diff --git a/scripts/docs_generate.ts b/scripts/docs_generate.ts index 24e29fae2b..66b806d1c7 100644 --- a/scripts/docs_generate.ts +++ b/scripts/docs_generate.ts @@ -20,7 +20,7 @@ import componentAnalyzerConfig from '../tools/manifest/custom-elements-manifest. const manifestFilePath = `${componentAnalyzerConfig.outdir}/custom-elements.json`; const tempFolderPath = './dist/docs'; -const componentsFolder = './src/components'; +const componentsFolder = './src'; const inheritedFromColumnIndex = 6; const propertyColumnIndex = 1; const attributeColumnIndex = 2; diff --git a/src/elements-experimental/package.json b/src/elements-experimental/package.json new file mode 100644 index 0000000000..32927386fe --- /dev/null +++ b/src/elements-experimental/package.json @@ -0,0 +1,22 @@ +{ + "name": "@sbb-esta/lyne-experimental", + "version": "0.0.0-PLACEHOLDER", + "description": "Lyne Design System", + "keywords": [ + "design system", + "web components", + "lit", + "storybook" + ], + "type": "module", + "customElements": "custom-elements.json", + "peerDependencies": { + "@sbb-esta/lyne-components": "0.0.0-PLACEHOLDER" + }, + "dependencies": { + "lit": "0.0.0-LIT" + }, + "publishConfig": { + "access": "public" + } +} diff --git a/src/elements-experimental/tsconfig.json b/src/elements-experimental/tsconfig.json new file mode 100644 index 0000000000..6a66232074 --- /dev/null +++ b/src/elements-experimental/tsconfig.json @@ -0,0 +1,13 @@ +{ + "extends": "../../tsconfig.json", + "compilerOptions": { + "rootDir": "../..", + "baseUrl": ".", + "paths": { + "@sbb-esta/lyne-components/*": ["../components/*"], + "@sbb-esta/lyne-elements-experimental/*": ["./*"] + } + }, + "include": ["./**/*.ts", "../vite-env.d.ts"], + "exclude": ["./**/*.chromatic.stories.ts"] +} diff --git a/src/elements-experimental/tsconfig.spec.json b/src/elements-experimental/tsconfig.spec.json new file mode 100644 index 0000000000..50b03ae86d --- /dev/null +++ b/src/elements-experimental/tsconfig.spec.json @@ -0,0 +1,4 @@ +{ + "extends": "../../tsconfig.json", + "include": ["**/*.spec.ts", "**/*.e2e.ts", "../vite-env.d.ts"] +} diff --git a/src/elements-experimental/vite.config.ts b/src/elements-experimental/vite.config.ts new file mode 100644 index 0000000000..7383584e98 --- /dev/null +++ b/src/elements-experimental/vite.config.ts @@ -0,0 +1,82 @@ +import { join } from 'path'; + +import { defineConfig, mergeConfig, type UserConfig } from 'vite'; + +import { + copyAssets, + customElementsManifest, + distDir, + dts, + resolveEntryPoints, + isProdBuild, + packageJsonTemplate, + generateRootEntryPoint, +} from '../../tools/vite/index.js'; +import rootConfig from '../../vite.config.js'; + +const packageRoot = new URL('.', import.meta.url); +// Include all directories containing an index.ts +const entryPoints = resolveEntryPoints(packageRoot, ['core', 'core/styles/**/']); +const barrelExports = Object.keys(entryPoints) + .map((e) => join(packageRoot.pathname, e)) + .sort() + .filter((v, _i, a) => a.some((e) => e.startsWith(`${v}/`))) + .map((e) => `${e}.ts`); + +export default defineConfig((config) => + mergeConfig(rootConfig, { + root: packageRoot.pathname, + plugins: [ + ...(config.command === 'build' ? [dts()] : []), + ...(isProdBuild(config) + ? [ + customElementsManifest(), + generateRootEntryPoint(), + packageJsonTemplate({ + exports: { + '.': { + types: './index.d.ts', + default: './index.js', + }, + }, + }), + copyAssets(['../../README.md']), + // verifyEntryPoints(), // TODO Must exclude @sbb-esta/lyne-components imports. Not sure it's possible + ] + : []), + ], + build: { + cssMinify: isProdBuild(config), + lib: { + entry: entryPoints, + formats: ['es'], + }, + minify: isProdBuild(config), + outDir: new URL( + `./elements-experimental/${isProdBuild(config) ? '' : 'development/'}`, + distDir, + ).pathname, + emptyOutDir: true, + sourcemap: isProdBuild(config) ? false : 'inline', + rollupOptions: { + external: (source: string, importer: string | undefined) => { + if ( + source.match(/(^lit$|^lit\/|^@lit\/|^@lit-labs\/)/) || + source.match(/^@sbb-esta\/lyne-components\/?/) || + (!!importer && source.startsWith('../') && !importer.includes('/node_modules/')) || + (!!importer && barrelExports.includes(importer) && source.match(/\.\/[a-z-]+/)) + ) { + if (source.includes('.scss')) { + throw Error(`Do not import scss from another directory. + Re export sass via barrel export (index.ts). See button/common.ts. + Source: ${source}. + Importer: ${importer}.`); + } + return true; + } + }, + }, + }, + assetsInclude: ['README.md'], + }), +); diff --git a/tools/manifest/custom-elements-manifest.config.js b/tools/manifest/custom-elements-manifest.config.js index c1c3c51599..f5ef46326e 100644 --- a/tools/manifest/custom-elements-manifest.config.js +++ b/tools/manifest/custom-elements-manifest.config.js @@ -3,7 +3,7 @@ */ export default { litelement: true, - globs: ['src/components/**/*.ts'], + globs: ['src/components/**/*.ts', 'src/elements-experimental/**/*.ts'], exclude: [ '**/*[.-]{stories,spec,e2e,test-utils}.ts', '**/private/*', diff --git a/tsconfig.json b/tsconfig.json index a395a42683..034e2e764c 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -19,6 +19,8 @@ "paths": { "@sbb-esta/lyne-components": ["src/components"], "@sbb-esta/lyne-components/*": ["src/components/*"], + "@sbb-esta/lyne-elements-experimental": ["src/elements-experimental"], + "@sbb-esta/lyne-elements-experimental/*": ["src/elements-experimental/*"], "@sbb-esta/lyne-components-react": ["src/react"], "@sbb-esta/lyne-components-react/*": ["src/react/*"] }, diff --git a/vite.config.ts b/vite.config.ts index 3e6504f849..e0707464c3 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -1,3 +1,5 @@ +import { resolve } from 'path'; + import postcssLit from 'rollup-plugin-postcss-lit'; import { defineConfig } from 'vite'; @@ -7,4 +9,10 @@ export default defineConfig({ // css tagged templates) as this should apply in almost all cases. postcssLit({ exclude: ['**/core/styles/**/*', '**/storybook/**/*'] }), ], + resolve: { + // Alias used for test and storybook environments + alias: [ + { find: '@sbb-esta/lyne-components', replacement: resolve(__dirname, 'src/components') }, + ], + }, }); From ba328055615eebb0c54de505b0b8834f881fbef2 Mon Sep 17 00:00:00 2001 From: Tommmaso Menga Date: Tue, 14 May 2024 11:08:17 +0200 Subject: [PATCH 02/17] refactor(timetable-duration): move to '@lyne-esta/elements-experimental' library --- .../timetable-duration.ts | 0 .../timetable-duration/readme.md | 0 .../timetable-duration/timetable-duration.e2e.ts | 3 +-- .../timetable-duration/timetable-duration.sample-data.ts | 0 .../timetable-duration/timetable-duration.scss | 2 +- .../timetable-duration/timetable-duration.spec.ts | 3 +-- .../timetable-duration/timetable-duration.stories.ts | 3 +-- .../timetable-duration/timetable-duration.ts | 5 ++--- 8 files changed, 6 insertions(+), 10 deletions(-) rename src/{components => elements-experimental}/timetable-duration.ts (100%) rename src/{components => elements-experimental}/timetable-duration/readme.md (100%) rename src/{components => elements-experimental}/timetable-duration/timetable-duration.e2e.ts (88%) rename src/{components => elements-experimental}/timetable-duration/timetable-duration.sample-data.ts (100%) rename src/{components => elements-experimental}/timetable-duration/timetable-duration.scss (87%) rename src/{components => elements-experimental}/timetable-duration/timetable-duration.spec.ts (93%) rename src/{components => elements-experimental}/timetable-duration/timetable-duration.stories.ts (92%) rename src/{components => elements-experimental}/timetable-duration/timetable-duration.ts (91%) diff --git a/src/components/timetable-duration.ts b/src/elements-experimental/timetable-duration.ts similarity index 100% rename from src/components/timetable-duration.ts rename to src/elements-experimental/timetable-duration.ts diff --git a/src/components/timetable-duration/readme.md b/src/elements-experimental/timetable-duration/readme.md similarity index 100% rename from src/components/timetable-duration/readme.md rename to src/elements-experimental/timetable-duration/readme.md diff --git a/src/components/timetable-duration/timetable-duration.e2e.ts b/src/elements-experimental/timetable-duration/timetable-duration.e2e.ts similarity index 88% rename from src/components/timetable-duration/timetable-duration.e2e.ts rename to src/elements-experimental/timetable-duration/timetable-duration.e2e.ts index ceef154e2c..fd681e00f2 100644 --- a/src/components/timetable-duration/timetable-duration.e2e.ts +++ b/src/elements-experimental/timetable-duration/timetable-duration.e2e.ts @@ -1,8 +1,7 @@ import { assert } from '@open-wc/testing'; +import { fixture } from '@sbb-esta/lyne-components/core/testing/private/fixture'; import { html } from 'lit/static-html.js'; -import { fixture } from '../core/testing/private.js'; - import { SbbTimetableDurationElement } from './timetable-duration.js'; import sampleData from './timetable-duration.sample-data.js'; diff --git a/src/components/timetable-duration/timetable-duration.sample-data.ts b/src/elements-experimental/timetable-duration/timetable-duration.sample-data.ts similarity index 100% rename from src/components/timetable-duration/timetable-duration.sample-data.ts rename to src/elements-experimental/timetable-duration/timetable-duration.sample-data.ts diff --git a/src/components/timetable-duration/timetable-duration.scss b/src/elements-experimental/timetable-duration/timetable-duration.scss similarity index 87% rename from src/components/timetable-duration/timetable-duration.scss rename to src/elements-experimental/timetable-duration/timetable-duration.scss index 0af58416ea..289bbf019e 100644 --- a/src/components/timetable-duration/timetable-duration.scss +++ b/src/elements-experimental/timetable-duration/timetable-duration.scss @@ -1,4 +1,4 @@ -@use '../core/styles' as sbb; +@use '@sbb-esta/lyne-components/core/styles' as sbb; // Box-sizing rules contained in typography are not traversing Shadow DOM boundaries. We need to include box-sizing mixin in every component. @include sbb.box-sizing; diff --git a/src/components/timetable-duration/timetable-duration.spec.ts b/src/elements-experimental/timetable-duration/timetable-duration.spec.ts similarity index 93% rename from src/components/timetable-duration/timetable-duration.spec.ts rename to src/elements-experimental/timetable-duration/timetable-duration.spec.ts index 4fa2c6a909..9c3414fba9 100644 --- a/src/components/timetable-duration/timetable-duration.spec.ts +++ b/src/elements-experimental/timetable-duration/timetable-duration.spec.ts @@ -1,8 +1,7 @@ import { expect } from '@open-wc/testing'; +import { fixture } from '@sbb-esta/lyne-components/core/testing/private/fixture'; import { html } from 'lit/static-html.js'; -import { fixture } from '../core/testing/private.js'; - import sampleData from './timetable-duration.sample-data.js'; import './timetable-duration.js'; diff --git a/src/components/timetable-duration/timetable-duration.stories.ts b/src/elements-experimental/timetable-duration/timetable-duration.stories.ts similarity index 92% rename from src/components/timetable-duration/timetable-duration.stories.ts rename to src/elements-experimental/timetable-duration/timetable-duration.stories.ts index 27cf666a2b..79445328b5 100644 --- a/src/components/timetable-duration/timetable-duration.stories.ts +++ b/src/elements-experimental/timetable-duration/timetable-duration.stories.ts @@ -49,9 +49,8 @@ const meta: Meta = { docs: { extractComponentDescription: () => readme, }, - chromatic: { disableSnapshot: true }, }, - title: 'internals/sbb-timetable-duration', + title: 'experimental/sbb-timetable-duration', }; export default meta; diff --git a/src/components/timetable-duration/timetable-duration.ts b/src/elements-experimental/timetable-duration/timetable-duration.ts similarity index 91% rename from src/components/timetable-duration/timetable-duration.ts rename to src/elements-experimental/timetable-duration/timetable-duration.ts index b369ea3453..5f7943fc92 100644 --- a/src/components/timetable-duration/timetable-duration.ts +++ b/src/elements-experimental/timetable-duration/timetable-duration.ts @@ -1,10 +1,9 @@ +import { SbbLanguageController } from '@sbb-esta/lyne-components/core/controllers/language-controller.js'; +import { i18nDurationHour, i18nDurationMinute } from '@sbb-esta/lyne-components/core/i18n/i18n.js'; import type { CSSResultGroup, TemplateResult } from 'lit'; import { html, LitElement } from 'lit'; import { customElement, property } from 'lit/decorators.js'; -import { SbbLanguageController } from '../core/controllers.js'; -import { i18nDurationHour, i18nDurationMinute } from '../core/i18n.js'; - import style from './timetable-duration.scss?lit&inline'; /** From 323898ed5eeda3765bf55025a080cf780cdfa59e Mon Sep 17 00:00:00 2001 From: Tommmaso Menga Date: Tue, 14 May 2024 16:04:14 +0200 Subject: [PATCH 03/17] refactor(timetable, journey, pearl, chain): move to '@lyne-esta/elements-experimental' library --- .storybook/preview.ts | 2 +- package.json | 8 +++-- scripts/docs_generate.ts | 2 +- .../timetable-occupancy-icon.stories.ts | 2 +- .../timetable-occupancy.stories.ts | 2 +- .../train-blocked-passage.stories.ts | 2 +- .../train-formation.stories.ts | 2 +- .../train/train-wagon/train-wagon.stories.ts | 2 +- src/components/train/train/train.stories.ts | 2 +- .../core/timetable.ts | 0 .../core/timetable/access-leg-helper.spec.ts | 0 .../core/timetable/access-leg-helper.ts | 8 +++-- .../core/timetable/timetable-helper.spec.ts | 0 .../core/timetable/timetable-helper.ts | 0 .../core/timetable/timetable-properties.ts | 0 .../journey-summary.ts | 0 .../journey-summary.spec.snap.js | 0 .../journey-summary/journey-summary.e2e.ts | 3 +- .../journey-summary/journey-summary.scss | 2 +- .../journey-summary/journey-summary.spec.ts | 5 ++- .../journey-summary.stories.ts | 6 ++-- .../journey-summary/journey-summary.ts | 24 +++++++------- .../journey-summary/readme.md | 0 .../pearl-chain-time.ts | 0 .../pearl-chain-time/pearl-chain-time.scss | 2 +- .../pearl-chain-time/pearl-chain-time.spec.ts | 4 +-- .../pearl-chain-time.stories.ts | 2 +- .../pearl-chain-time/pearl-chain-time.ts | 13 ++++++-- .../pearl-chain-time/readme.md | 2 +- .../pearl-chain-vertical-item.ts | 0 .../pearl-chain-vertical-item.scss | 2 +- .../pearl-chain-vertical-item.spec.ts | 5 ++- .../pearl-chain-vertical-item.stories.ts | 2 +- .../pearl-chain-vertical-item.ts | 0 .../pearl-chain-vertical-item/readme.md | 2 +- .../pearl-chain-vertical.ts | 0 .../pearl-chain-vertical.e2e.ts | 3 +- .../pearl-chain-vertical.scss | 2 +- .../pearl-chain-vertical.spec.ts | 5 ++- .../pearl-chain-vertical.stories.ts | 4 +-- .../pearl-chain-vertical.ts | 0 .../pearl-chain-vertical/readme.md | 2 +- .../pearl-chain.ts | 0 .../pearl-chain/pearl-chain.e2e.ts | 3 +- .../pearl-chain/pearl-chain.sample-data.ts | 0 .../pearl-chain/pearl-chain.scss | 2 +- .../pearl-chain/pearl-chain.spec.ts | 4 +-- .../pearl-chain/pearl-chain.stories.ts | 2 +- .../pearl-chain/pearl-chain.ts | 5 ++- .../pearl-chain/readme.md | 0 .../timetable-row.ts | 0 .../timetable-row/readme.md | 0 .../timetable-row/timetable-row.e2e.ts | 7 ++-- .../timetable-row.sample-data.ts | 0 .../timetable-row/timetable-row.scss | 2 +- .../timetable-row/timetable-row.spec.ts | 4 +-- .../timetable-row/timetable-row.stories.ts | 2 +- .../timetable-row/timetable-row.ts | 32 +++++++++++-------- .../pages/home/home--logged-in.stories.ts | 8 +++-- vite.config.ts | 4 +++ 60 files changed, 108 insertions(+), 89 deletions(-) rename src/{components => elements-experimental}/core/timetable.ts (100%) rename src/{components => elements-experimental}/core/timetable/access-leg-helper.spec.ts (100%) rename src/{components => elements-experimental}/core/timetable/access-leg-helper.ts (98%) rename src/{components => elements-experimental}/core/timetable/timetable-helper.spec.ts (100%) rename src/{components => elements-experimental}/core/timetable/timetable-helper.ts (100%) rename src/{components => elements-experimental}/core/timetable/timetable-properties.ts (100%) rename src/{components => elements-experimental}/journey-summary.ts (100%) rename src/{components => elements-experimental}/journey-summary/__snapshots__/journey-summary.spec.snap.js (100%) rename src/{components => elements-experimental}/journey-summary/journey-summary.e2e.ts (85%) rename src/{components => elements-experimental}/journey-summary/journey-summary.scss (93%) rename src/{components => elements-experimental}/journey-summary/journey-summary.spec.ts (93%) rename src/{components => elements-experimental}/journey-summary/journey-summary.stories.ts (97%) rename src/{components => elements-experimental}/journey-summary/journey-summary.ts (92%) rename src/{components => elements-experimental}/journey-summary/readme.md (100%) rename src/{components => elements-experimental}/pearl-chain-time.ts (100%) rename src/{components => elements-experimental}/pearl-chain-time/pearl-chain-time.scss (97%) rename src/{components => elements-experimental}/pearl-chain-time/pearl-chain-time.spec.ts (98%) rename src/{components => elements-experimental}/pearl-chain-time/pearl-chain-time.stories.ts (98%) rename src/{components => elements-experimental}/pearl-chain-time/pearl-chain-time.ts (92%) rename src/{components => elements-experimental}/pearl-chain-time/readme.md (97%) rename src/{components => elements-experimental}/pearl-chain-vertical-item.ts (100%) rename src/{components => elements-experimental}/pearl-chain-vertical-item/pearl-chain-vertical-item.scss (99%) rename src/{components => elements-experimental}/pearl-chain-vertical-item/pearl-chain-vertical-item.spec.ts (98%) rename src/{components => elements-experimental}/pearl-chain-vertical-item/pearl-chain-vertical-item.stories.ts (96%) rename src/{components => elements-experimental}/pearl-chain-vertical-item/pearl-chain-vertical-item.ts (100%) rename src/{components => elements-experimental}/pearl-chain-vertical-item/readme.md (95%) rename src/{components => elements-experimental}/pearl-chain-vertical.ts (100%) rename src/{components => elements-experimental}/pearl-chain-vertical/pearl-chain-vertical.e2e.ts (86%) rename src/{components => elements-experimental}/pearl-chain-vertical/pearl-chain-vertical.scss (86%) rename src/{components => elements-experimental}/pearl-chain-vertical/pearl-chain-vertical.spec.ts (81%) rename src/{components => elements-experimental}/pearl-chain-vertical/pearl-chain-vertical.stories.ts (99%) rename src/{components => elements-experimental}/pearl-chain-vertical/pearl-chain-vertical.ts (100%) rename src/{components => elements-experimental}/pearl-chain-vertical/readme.md (90%) rename src/{components => elements-experimental}/pearl-chain.ts (100%) rename src/{components => elements-experimental}/pearl-chain/pearl-chain.e2e.ts (85%) rename src/{components => elements-experimental}/pearl-chain/pearl-chain.sample-data.ts (100%) rename src/{components => elements-experimental}/pearl-chain/pearl-chain.scss (99%) rename src/{components => elements-experimental}/pearl-chain/pearl-chain.spec.ts (97%) rename src/{components => elements-experimental}/pearl-chain/pearl-chain.stories.ts (98%) rename src/{components => elements-experimental}/pearl-chain/pearl-chain.ts (98%) rename src/{components => elements-experimental}/pearl-chain/readme.md (100%) rename src/{components => elements-experimental}/timetable-row.ts (100%) rename src/{components => elements-experimental}/timetable-row/readme.md (100%) rename src/{components => elements-experimental}/timetable-row/timetable-row.e2e.ts (78%) rename src/{components => elements-experimental}/timetable-row/timetable-row.sample-data.ts (100%) rename src/{components => elements-experimental}/timetable-row/timetable-row.scss (98%) rename src/{components => elements-experimental}/timetable-row/timetable-row.spec.ts (98%) rename src/{components => elements-experimental}/timetable-row/timetable-row.stories.ts (99%) rename src/{components => elements-experimental}/timetable-row/timetable-row.ts (97%) diff --git a/.storybook/preview.ts b/.storybook/preview.ts index a1b2185129..6ddd083016 100644 --- a/.storybook/preview.ts +++ b/.storybook/preview.ts @@ -66,7 +66,7 @@ const parameters: Parameters = { storySort: { // Story section order. // https://storybook.js.org/docs/react/writing-stories/naming-components-and-hierarchy#sorting-stories - order: ['introduction', 'pages', 'components', 'styles', 'timetable', 'internals'], + order: ['introduction', 'pages', 'components', 'experimental', 'styles', 'internals'], }, }, }; diff --git a/package.json b/package.json index a7e8ecf8aa..e45b98115d 100644 --- a/package.json +++ b/package.json @@ -21,11 +21,11 @@ "private": true, "scripts": { "postinstall": "yarn playwright install", - "build:components": "npm-run-all --sequential build:components:* build:components-experimental:*", + "build:components": "npm-run-all --sequential build:components:* build:elements-experimental:*", "build:components:production": "vite build --config src/components/vite.config.ts", "build:components:development": "NODE_ENV=development vite build --mode development --config src/components/vite.config.ts", - "build:components-experimental:production": "vite build --config src/elements-experimental/vite.config.ts", - "build:components-experimental:development": "NODE_ENV=development vite build --mode development --config src/elements-experimental/vite.config.ts", + "build:elements-experimental:production": "vite build --config src/elements-experimental/vite.config.ts", + "build:elements-experimental:development": "NODE_ENV=development vite build --mode development --config src/elements-experimental/vite.config.ts", "build:react": "npm-run-all --sequential build:react:*", "build:react:production": "vite build --config src/react/vite.config.ts", "build:react:development": "NODE_ENV=development vite build --mode development --config src/react/vite.config.ts", @@ -50,6 +50,8 @@ "lint:tsc": "npm-run-all --sequential lint:tsc:*", "lint:tsc:components": "tsc --noEmit --project src/components/tsconfig.json", "lint:tsc:components-spec": "tsc --noEmit --project src/components/tsconfig.spec.json", + "lint:tsc:experimental": "tsc --noEmit --project src/elements-experimental/tsconfig.json", + "lint:tsc:experimental-spec": "tsc --noEmit --project src/elements-experimental/tsconfig.spec.json", "lint:tsc:visual-regression-app": "tsc --noEmit --project src/visual-regression-app/tsconfig.json", "start": "storybook dev -p 6006", "start:visual-regression-app": "vite --config src/visual-regression-app/vite.config.ts", diff --git a/scripts/docs_generate.ts b/scripts/docs_generate.ts index 66b806d1c7..20467b5924 100644 --- a/scripts/docs_generate.ts +++ b/scripts/docs_generate.ts @@ -26,7 +26,7 @@ const propertyColumnIndex = 1; const attributeColumnIndex = 2; function getAttributeName(propertyName: string, attributes: Attribute[]): string { - const name = propertyName.replace(/'|`/g, '').trim(); + const name = propertyName.replace(/['`]/g, '').trim(); const attr = attributes.find((a) => a.fieldName === name)?.name; return attr ? `\`${attr}\`` : '-'; } diff --git a/src/components/timetable-occupancy-icon/timetable-occupancy-icon.stories.ts b/src/components/timetable-occupancy-icon/timetable-occupancy-icon.stories.ts index 327beb6804..fb5339dd74 100644 --- a/src/components/timetable-occupancy-icon/timetable-occupancy-icon.stories.ts +++ b/src/components/timetable-occupancy-icon/timetable-occupancy-icon.stories.ts @@ -93,7 +93,7 @@ const meta: Meta = { extractComponentDescription: () => readme, }, }, - title: 'timetable/sbb-timetable-occupancy-icon', + title: 'components/timetable/sbb-timetable-occupancy-icon', }; export default meta; diff --git a/src/components/timetable-occupancy/timetable-occupancy.stories.ts b/src/components/timetable-occupancy/timetable-occupancy.stories.ts index a6f1db4739..86ee10d359 100644 --- a/src/components/timetable-occupancy/timetable-occupancy.stories.ts +++ b/src/components/timetable-occupancy/timetable-occupancy.stories.ts @@ -220,7 +220,7 @@ const meta: Meta = { }, chromatic: { disableSnapshot: true }, }, - title: 'timetable/sbb-timetable-occupancy', + title: 'components/timetable/sbb-timetable-occupancy', }; export default meta; diff --git a/src/components/train/train-blocked-passage/train-blocked-passage.stories.ts b/src/components/train/train-blocked-passage/train-blocked-passage.stories.ts index 695ffd6beb..4331ba7add 100644 --- a/src/components/train/train-blocked-passage/train-blocked-passage.stories.ts +++ b/src/components/train/train-blocked-passage/train-blocked-passage.stories.ts @@ -21,7 +21,7 @@ const meta: Meta = { extractComponentDescription: () => readme, }, }, - title: 'timetable/sbb-train-blocked-passage', + title: 'components/timetable/sbb-train-blocked-passage', }; export default meta; diff --git a/src/components/train/train-formation/train-formation.stories.ts b/src/components/train/train-formation/train-formation.stories.ts index ce739fce6d..77583708fb 100644 --- a/src/components/train/train-formation/train-formation.stories.ts +++ b/src/components/train/train-formation/train-formation.stories.ts @@ -370,7 +370,7 @@ const meta: Meta = { extractComponentDescription: () => readme, }, }, - title: 'timetable/sbb-train-formation', + title: 'components/timetable/sbb-train-formation', }; export default meta; diff --git a/src/components/train/train-wagon/train-wagon.stories.ts b/src/components/train/train-wagon/train-wagon.stories.ts index a9c0fac97e..f7a31b040d 100644 --- a/src/components/train/train-wagon/train-wagon.stories.ts +++ b/src/components/train/train-wagon/train-wagon.stories.ts @@ -178,7 +178,7 @@ const meta: Meta = { extractComponentDescription: () => readme, }, }, - title: 'timetable/sbb-train-wagon', + title: 'components/timetable/sbb-train-wagon', }; export default meta; diff --git a/src/components/train/train/train.stories.ts b/src/components/train/train/train.stories.ts index 443cec1f67..24b057d0ec 100644 --- a/src/components/train/train/train.stories.ts +++ b/src/components/train/train/train.stories.ts @@ -92,7 +92,7 @@ const meta: Meta = { extractComponentDescription: () => readme, }, }, - title: 'timetable/sbb-train', + title: 'components/timetable/sbb-train', }; export default meta; diff --git a/src/components/core/timetable.ts b/src/elements-experimental/core/timetable.ts similarity index 100% rename from src/components/core/timetable.ts rename to src/elements-experimental/core/timetable.ts diff --git a/src/components/core/timetable/access-leg-helper.spec.ts b/src/elements-experimental/core/timetable/access-leg-helper.spec.ts similarity index 100% rename from src/components/core/timetable/access-leg-helper.spec.ts rename to src/elements-experimental/core/timetable/access-leg-helper.spec.ts diff --git a/src/components/core/timetable/access-leg-helper.ts b/src/elements-experimental/core/timetable/access-leg-helper.ts similarity index 98% rename from src/components/core/timetable/access-leg-helper.ts rename to src/elements-experimental/core/timetable/access-leg-helper.ts index ad287de2ab..15dabd9c4d 100644 --- a/src/components/core/timetable/access-leg-helper.ts +++ b/src/elements-experimental/core/timetable/access-leg-helper.ts @@ -1,10 +1,12 @@ // This helper file contains several functions related to accessing attributes for the connections. +import { + i18nWalkingDistanceArrival, + i18nWalkingDistanceDeparture, +} from '@sbb-esta/lyne-components/core/i18n.js'; import type { TemplateResult } from 'lit'; import { html, nothing } from 'lit'; -import { i18nWalkingDistanceArrival, i18nWalkingDistanceDeparture } from '../i18n.js'; - import { extractTimeAndStringFromNoticeText, isConnectionLeg, @@ -12,7 +14,7 @@ import { } from './timetable-helper.js'; import type { Leg, PtConnectionLeg, PtRideLeg } from './timetable-properties.js'; -import '../../icon.js'; +import '@sbb-esta/lyne-components/icon.js'; interface IAccessAttribute { duration: number; diff --git a/src/components/core/timetable/timetable-helper.spec.ts b/src/elements-experimental/core/timetable/timetable-helper.spec.ts similarity index 100% rename from src/components/core/timetable/timetable-helper.spec.ts rename to src/elements-experimental/core/timetable/timetable-helper.spec.ts diff --git a/src/components/core/timetable/timetable-helper.ts b/src/elements-experimental/core/timetable/timetable-helper.ts similarity index 100% rename from src/components/core/timetable/timetable-helper.ts rename to src/elements-experimental/core/timetable/timetable-helper.ts diff --git a/src/components/core/timetable/timetable-properties.ts b/src/elements-experimental/core/timetable/timetable-properties.ts similarity index 100% rename from src/components/core/timetable/timetable-properties.ts rename to src/elements-experimental/core/timetable/timetable-properties.ts diff --git a/src/components/journey-summary.ts b/src/elements-experimental/journey-summary.ts similarity index 100% rename from src/components/journey-summary.ts rename to src/elements-experimental/journey-summary.ts diff --git a/src/components/journey-summary/__snapshots__/journey-summary.spec.snap.js b/src/elements-experimental/journey-summary/__snapshots__/journey-summary.spec.snap.js similarity index 100% rename from src/components/journey-summary/__snapshots__/journey-summary.spec.snap.js rename to src/elements-experimental/journey-summary/__snapshots__/journey-summary.spec.snap.js diff --git a/src/components/journey-summary/journey-summary.e2e.ts b/src/elements-experimental/journey-summary/journey-summary.e2e.ts similarity index 85% rename from src/components/journey-summary/journey-summary.e2e.ts rename to src/elements-experimental/journey-summary/journey-summary.e2e.ts index 7b9a9590a7..4681abba24 100644 --- a/src/components/journey-summary/journey-summary.e2e.ts +++ b/src/elements-experimental/journey-summary/journey-summary.e2e.ts @@ -1,8 +1,7 @@ import { assert } from '@open-wc/testing'; +import { fixture } from '@sbb-esta/lyne-components/core/testing/private.js'; import { html } from 'lit/static-html.js'; -import { fixture } from '../core/testing/private.js'; - import { SbbJourneySummaryElement } from './journey-summary.js'; describe(`sbb-journey-summary with ${fixture.name}`, () => { diff --git a/src/components/journey-summary/journey-summary.scss b/src/elements-experimental/journey-summary/journey-summary.scss similarity index 93% rename from src/components/journey-summary/journey-summary.scss rename to src/elements-experimental/journey-summary/journey-summary.scss index 08407d8958..128579cf50 100644 --- a/src/components/journey-summary/journey-summary.scss +++ b/src/elements-experimental/journey-summary/journey-summary.scss @@ -1,4 +1,4 @@ -@use '../core/styles' as sbb; +@use '@sbb-esta/lyne-components/core/styles' as sbb; // Box-sizing rules contained in typography are not traversing Shadow DOM boundaries. We need to include box-sizing mixin in every component. @include sbb.box-sizing; diff --git a/src/components/journey-summary/journey-summary.spec.ts b/src/elements-experimental/journey-summary/journey-summary.spec.ts similarity index 93% rename from src/components/journey-summary/journey-summary.spec.ts rename to src/elements-experimental/journey-summary/journey-summary.spec.ts index 93162f8863..fca3372592 100644 --- a/src/components/journey-summary/journey-summary.spec.ts +++ b/src/elements-experimental/journey-summary/journey-summary.spec.ts @@ -1,9 +1,8 @@ import { expect } from '@open-wc/testing'; +import { fixture } from '@sbb-esta/lyne-components/core/testing/private.js'; +import { waitForLitRender } from '@sbb-esta/lyne-components/core/testing.js'; import { html } from 'lit/static-html.js'; -import { fixture } from '../core/testing/private.js'; -import { waitForLitRender } from '../core/testing.js'; - import type { SbbJourneySummaryElement, InterfaceSbbJourneySummaryAttributes, diff --git a/src/components/journey-summary/journey-summary.stories.ts b/src/elements-experimental/journey-summary/journey-summary.stories.ts similarity index 97% rename from src/components/journey-summary/journey-summary.stories.ts rename to src/elements-experimental/journey-summary/journey-summary.stories.ts index 46087dd575..db3562416d 100644 --- a/src/components/journey-summary/journey-summary.stories.ts +++ b/src/elements-experimental/journey-summary/journey-summary.stories.ts @@ -16,8 +16,8 @@ import { import readme from './readme.md?raw'; import './journey-summary.js'; -import '../button/button.js'; -import '../button/secondary-button.js'; +import '@sbb-esta/lyne-components/button/button.js'; +import '@sbb-esta/lyne-components/button/secondary-button.js'; const disableAnimation: InputType = { control: { @@ -261,7 +261,7 @@ const meta: Meta = { extractComponentDescription: () => readme, }, }, - title: 'timetable/sbb-journey-summary', + title: 'experimental/sbb-journey-summary', }; export default meta; diff --git a/src/components/journey-summary/journey-summary.ts b/src/elements-experimental/journey-summary/journey-summary.ts similarity index 92% rename from src/components/journey-summary/journey-summary.ts rename to src/elements-experimental/journey-summary/journey-summary.ts index 643f648592..d9c7c7565f 100644 --- a/src/components/journey-summary/journey-summary.ts +++ b/src/elements-experimental/journey-summary/journey-summary.ts @@ -1,25 +1,25 @@ -import { format, isValid } from 'date-fns'; -import type { CSSResultGroup, TemplateResult } from 'lit'; -import { html, LitElement, nothing } from 'lit'; -import { customElement, property } from 'lit/decorators.js'; - -import { SbbLanguageController } from '../core/controllers.js'; +import { SbbLanguageController } from '@sbb-esta/lyne-components/core/controllers.js'; import { defaultDateAdapter, durationToTime, removeTimezoneFromISOTimeString, readDataNow, -} from '../core/datetime.js'; -import { i18nTripDuration } from '../core/i18n.js'; +} from '@sbb-esta/lyne-components/core/datetime.js'; +import { i18nTripDuration } from '@sbb-esta/lyne-components/core/i18n.js'; +import type { SbbTitleLevel } from '@sbb-esta/lyne-components/title.js'; +import { format, isValid } from 'date-fns'; +import type { CSSResultGroup, TemplateResult } from 'lit'; +import { html, LitElement, nothing } from 'lit'; +import { customElement, property } from 'lit/decorators.js'; + import type { Leg } from '../core/timetable.js'; -import type { SbbTitleLevel } from '../title.js'; import style from './journey-summary.scss?lit&inline'; -import '../divider.js'; -import '../journey-header.js'; +import '@sbb-esta/lyne-components/divider.js'; +import '@sbb-esta/lyne-components/screen-reader-only.js'; +import '@sbb-esta/lyne-components/journey-header.js'; import '../pearl-chain-time.js'; -import '../screen-reader-only.js'; export interface InterfaceSbbJourneySummaryAttributes { legs: Leg[]; diff --git a/src/components/journey-summary/readme.md b/src/elements-experimental/journey-summary/readme.md similarity index 100% rename from src/components/journey-summary/readme.md rename to src/elements-experimental/journey-summary/readme.md diff --git a/src/components/pearl-chain-time.ts b/src/elements-experimental/pearl-chain-time.ts similarity index 100% rename from src/components/pearl-chain-time.ts rename to src/elements-experimental/pearl-chain-time.ts diff --git a/src/components/pearl-chain-time/pearl-chain-time.scss b/src/elements-experimental/pearl-chain-time/pearl-chain-time.scss similarity index 97% rename from src/components/pearl-chain-time/pearl-chain-time.scss rename to src/elements-experimental/pearl-chain-time/pearl-chain-time.scss index 06235f6136..2beeb1ac11 100644 --- a/src/components/pearl-chain-time/pearl-chain-time.scss +++ b/src/elements-experimental/pearl-chain-time/pearl-chain-time.scss @@ -1,4 +1,4 @@ -@use '../core/styles' as sbb; +@use '@sbb-esta/lyne-components/core/styles' as sbb; // Box-sizing rules contained in typography are not traversing Shadow DOM boundaries. We need to include box-sizing mixin in every component. @include sbb.box-sizing; diff --git a/src/components/pearl-chain-time/pearl-chain-time.spec.ts b/src/elements-experimental/pearl-chain-time/pearl-chain-time.spec.ts similarity index 98% rename from src/components/pearl-chain-time/pearl-chain-time.spec.ts rename to src/elements-experimental/pearl-chain-time/pearl-chain-time.spec.ts index 55c8e19f52..b7a8ec6c36 100644 --- a/src/components/pearl-chain-time/pearl-chain-time.spec.ts +++ b/src/elements-experimental/pearl-chain-time/pearl-chain-time.spec.ts @@ -1,8 +1,8 @@ import { expect } from '@open-wc/testing'; +import { fixture } from '@sbb-esta/lyne-components/core/testing/private.js'; +import { waitForLitRender } from '@sbb-esta/lyne-components/core/testing.js'; import { html } from 'lit/static-html.js'; -import { fixture } from '../core/testing/private.js'; -import { waitForLitRender } from '../core/testing.js'; import type { PtRideLeg } from '../core/timetable.js'; import type { SbbPearlChainTimeElement } from './pearl-chain-time.js'; diff --git a/src/components/pearl-chain-time/pearl-chain-time.stories.ts b/src/elements-experimental/pearl-chain-time/pearl-chain-time.stories.ts similarity index 98% rename from src/components/pearl-chain-time/pearl-chain-time.stories.ts rename to src/elements-experimental/pearl-chain-time/pearl-chain-time.stories.ts index 89091ce40b..221613c85b 100644 --- a/src/components/pearl-chain-time/pearl-chain-time.stories.ts +++ b/src/elements-experimental/pearl-chain-time/pearl-chain-time.stories.ts @@ -123,7 +123,7 @@ const meta: Meta = { extractComponentDescription: () => readme, }, }, - title: 'timetable/sbb-pearl-chain-time', + title: 'experimental/sbb-pearl-chain-time', }; export default meta; diff --git a/src/components/pearl-chain-time/pearl-chain-time.ts b/src/elements-experimental/pearl-chain-time/pearl-chain-time.ts similarity index 92% rename from src/components/pearl-chain-time/pearl-chain-time.ts rename to src/elements-experimental/pearl-chain-time/pearl-chain-time.ts index 5f8f26355a..7c8c07fcbe 100644 --- a/src/components/pearl-chain-time/pearl-chain-time.ts +++ b/src/elements-experimental/pearl-chain-time/pearl-chain-time.ts @@ -1,11 +1,18 @@ +import { SbbLanguageController } from '@sbb-esta/lyne-components/core/controllers.js'; +import { + readDataNow, + removeTimezoneFromISOTimeString, +} from '@sbb-esta/lyne-components/core/datetime.js'; +import { + i18nArrival, + i18nDeparture, + i18nTransferProcedures, +} from '@sbb-esta/lyne-components/core/i18n.js'; import { format } from 'date-fns'; import type { CSSResultGroup, TemplateResult } from 'lit'; import { html, LitElement, nothing } from 'lit'; import { customElement, property } from 'lit/decorators.js'; -import { SbbLanguageController } from '../core/controllers.js'; -import { readDataNow, removeTimezoneFromISOTimeString } from '../core/datetime.js'; -import { i18nArrival, i18nDeparture, i18nTransferProcedures } from '../core/i18n.js'; import type { Leg, PtRideLeg } from '../core/timetable.js'; import { getDepartureArrivalTimeAttribute, isRideLeg } from '../core/timetable.js'; diff --git a/src/components/pearl-chain-time/readme.md b/src/elements-experimental/pearl-chain-time/readme.md similarity index 97% rename from src/components/pearl-chain-time/readme.md rename to src/elements-experimental/pearl-chain-time/readme.md index c943e428c2..33468db92f 100644 --- a/src/components/pearl-chain-time/readme.md +++ b/src/elements-experimental/pearl-chain-time/readme.md @@ -1,5 +1,5 @@ The `sbb-pearl-chain-time` component adds an optional walk icon and a duration in minutes -before and/or after the [sbb-pearl-chain](/docs/timetable-sbb-pearl-chain--docs). +before and/or after the [sbb-pearl-chain](/docs/experimental-sbb-pearl-chain--docs). The walk time indicates that the user has to walk to get to the destination, or to the station to begin the journey. diff --git a/src/components/pearl-chain-vertical-item.ts b/src/elements-experimental/pearl-chain-vertical-item.ts similarity index 100% rename from src/components/pearl-chain-vertical-item.ts rename to src/elements-experimental/pearl-chain-vertical-item.ts diff --git a/src/components/pearl-chain-vertical-item/pearl-chain-vertical-item.scss b/src/elements-experimental/pearl-chain-vertical-item/pearl-chain-vertical-item.scss similarity index 99% rename from src/components/pearl-chain-vertical-item/pearl-chain-vertical-item.scss rename to src/elements-experimental/pearl-chain-vertical-item/pearl-chain-vertical-item.scss index 2e681dce64..c14eeb7ffd 100644 --- a/src/components/pearl-chain-vertical-item/pearl-chain-vertical-item.scss +++ b/src/elements-experimental/pearl-chain-vertical-item/pearl-chain-vertical-item.scss @@ -1,4 +1,4 @@ -@use '../core/styles' as sbb; +@use '@sbb-esta/lyne-components/core/styles' as sbb; // Box-sizing rules contained in typography are not traversing Shadow DOM boundaries. We need to include box-sizing mixin in every component. @include sbb.box-sizing; diff --git a/src/components/pearl-chain-vertical-item/pearl-chain-vertical-item.spec.ts b/src/elements-experimental/pearl-chain-vertical-item/pearl-chain-vertical-item.spec.ts similarity index 98% rename from src/components/pearl-chain-vertical-item/pearl-chain-vertical-item.spec.ts rename to src/elements-experimental/pearl-chain-vertical-item/pearl-chain-vertical-item.spec.ts index c6fe5ab794..9945d3a1d9 100644 --- a/src/components/pearl-chain-vertical-item/pearl-chain-vertical-item.spec.ts +++ b/src/elements-experimental/pearl-chain-vertical-item/pearl-chain-vertical-item.spec.ts @@ -1,9 +1,8 @@ import { expect } from '@open-wc/testing'; +import { fixture } from '@sbb-esta/lyne-components/core/testing/private.js'; +import { waitForLitRender } from '@sbb-esta/lyne-components/core/testing.js'; import { html } from 'lit/static-html.js'; -import { fixture } from '../core/testing/private.js'; -import { waitForLitRender } from '../core/testing.js'; - import type { LineColor, SbbPearlChainVerticalItemElement } from './pearl-chain-vertical-item.js'; import './pearl-chain-vertical-item.js'; diff --git a/src/components/pearl-chain-vertical-item/pearl-chain-vertical-item.stories.ts b/src/elements-experimental/pearl-chain-vertical-item/pearl-chain-vertical-item.stories.ts similarity index 96% rename from src/components/pearl-chain-vertical-item/pearl-chain-vertical-item.stories.ts rename to src/elements-experimental/pearl-chain-vertical-item/pearl-chain-vertical-item.stories.ts index 281f2c0c67..d8f60109e9 100644 --- a/src/components/pearl-chain-vertical-item/pearl-chain-vertical-item.stories.ts +++ b/src/elements-experimental/pearl-chain-vertical-item/pearl-chain-vertical-item.stories.ts @@ -62,7 +62,7 @@ const meta: Meta = { control: { type: 'select' }, }, }, - title: 'timetable/sbb-pearl-chain-vertical-item', + title: 'experimental/sbb-pearl-chain-vertical-item', }; export default meta; diff --git a/src/components/pearl-chain-vertical-item/pearl-chain-vertical-item.ts b/src/elements-experimental/pearl-chain-vertical-item/pearl-chain-vertical-item.ts similarity index 100% rename from src/components/pearl-chain-vertical-item/pearl-chain-vertical-item.ts rename to src/elements-experimental/pearl-chain-vertical-item/pearl-chain-vertical-item.ts diff --git a/src/components/pearl-chain-vertical-item/readme.md b/src/elements-experimental/pearl-chain-vertical-item/readme.md similarity index 95% rename from src/components/pearl-chain-vertical-item/readme.md rename to src/elements-experimental/pearl-chain-vertical-item/readme.md index 3218e7c56f..3943bc94ba 100644 --- a/src/components/pearl-chain-vertical-item/readme.md +++ b/src/elements-experimental/pearl-chain-vertical-item/readme.md @@ -1,5 +1,5 @@ The `sbb-pearl-chain-vertical-item` is intended to be used -with the [sbb-pearl-chain-vertical](/docs/timetable-sbb-pearl-chain-vertical--docs)` component. +with the [sbb-pearl-chain-vertical](/docs/experimental-sbb-pearl-chain-vertical--docs)` component. It renders a table-row with three table-cells, and it is used to display the dots and line of the pearl-chain. There are two slots named `left` and `right` which make it possible to display content on the component sides. diff --git a/src/components/pearl-chain-vertical.ts b/src/elements-experimental/pearl-chain-vertical.ts similarity index 100% rename from src/components/pearl-chain-vertical.ts rename to src/elements-experimental/pearl-chain-vertical.ts diff --git a/src/components/pearl-chain-vertical/pearl-chain-vertical.e2e.ts b/src/elements-experimental/pearl-chain-vertical/pearl-chain-vertical.e2e.ts similarity index 86% rename from src/components/pearl-chain-vertical/pearl-chain-vertical.e2e.ts rename to src/elements-experimental/pearl-chain-vertical/pearl-chain-vertical.e2e.ts index ab5f83c04f..7d2ced97ed 100644 --- a/src/components/pearl-chain-vertical/pearl-chain-vertical.e2e.ts +++ b/src/elements-experimental/pearl-chain-vertical/pearl-chain-vertical.e2e.ts @@ -1,8 +1,7 @@ import { assert } from '@open-wc/testing'; +import { fixture } from '@sbb-esta/lyne-components/core/testing/private.js'; import { html } from 'lit/static-html.js'; -import { fixture } from '../core/testing/private.js'; - import { SbbPearlChainVerticalElement } from './pearl-chain-vertical.js'; describe(`sbb-pearl-chain with ${fixture.name}`, () => { diff --git a/src/components/pearl-chain-vertical/pearl-chain-vertical.scss b/src/elements-experimental/pearl-chain-vertical/pearl-chain-vertical.scss similarity index 86% rename from src/components/pearl-chain-vertical/pearl-chain-vertical.scss rename to src/elements-experimental/pearl-chain-vertical/pearl-chain-vertical.scss index f3547d701e..f799a5f934 100644 --- a/src/components/pearl-chain-vertical/pearl-chain-vertical.scss +++ b/src/elements-experimental/pearl-chain-vertical/pearl-chain-vertical.scss @@ -1,4 +1,4 @@ -@use '../core/styles' as sbb; +@use '@sbb-esta/lyne-components/core/styles' as sbb; // Box-sizing rules contained in typography are not traversing Shadow DOM boundaries. We need to include box-sizing mixin in every component. @include sbb.box-sizing; diff --git a/src/components/pearl-chain-vertical/pearl-chain-vertical.spec.ts b/src/elements-experimental/pearl-chain-vertical/pearl-chain-vertical.spec.ts similarity index 81% rename from src/components/pearl-chain-vertical/pearl-chain-vertical.spec.ts rename to src/elements-experimental/pearl-chain-vertical/pearl-chain-vertical.spec.ts index 7bc94a3fcc..c2208add3d 100644 --- a/src/components/pearl-chain-vertical/pearl-chain-vertical.spec.ts +++ b/src/elements-experimental/pearl-chain-vertical/pearl-chain-vertical.spec.ts @@ -1,9 +1,8 @@ import { expect } from '@open-wc/testing'; +import { fixture } from '@sbb-esta/lyne-components/core/testing/private.js'; +import { waitForLitRender } from '@sbb-esta/lyne-components/core/testing.js'; import { html } from 'lit/static-html.js'; -import { fixture } from '../core/testing/private.js'; -import { waitForLitRender } from '../core/testing.js'; - import type { SbbPearlChainVerticalElement } from './pearl-chain-vertical.js'; import './pearl-chain-vertical.js'; diff --git a/src/components/pearl-chain-vertical/pearl-chain-vertical.stories.ts b/src/elements-experimental/pearl-chain-vertical/pearl-chain-vertical.stories.ts similarity index 99% rename from src/components/pearl-chain-vertical/pearl-chain-vertical.stories.ts rename to src/elements-experimental/pearl-chain-vertical/pearl-chain-vertical.stories.ts index a6ff5133fc..37d2cd1791 100644 --- a/src/components/pearl-chain-vertical/pearl-chain-vertical.stories.ts +++ b/src/elements-experimental/pearl-chain-vertical/pearl-chain-vertical.stories.ts @@ -7,7 +7,7 @@ import { html } from 'lit'; import readme from './readme.md?raw'; import './pearl-chain-vertical.js'; import '../pearl-chain-vertical-item.js'; -import '../icon.js'; +import '@sbb-esta/lyne-components/icon.js'; const lineType: InputType = { options: ['dotted', 'standard', 'thin'], @@ -626,7 +626,7 @@ const meta: Meta = { extractComponentDescription: () => readme, }, }, - title: 'timetable/sbb-pearl-chain-vertical', + title: 'experimental/sbb-pearl-chain-vertical', }; export default meta; diff --git a/src/components/pearl-chain-vertical/pearl-chain-vertical.ts b/src/elements-experimental/pearl-chain-vertical/pearl-chain-vertical.ts similarity index 100% rename from src/components/pearl-chain-vertical/pearl-chain-vertical.ts rename to src/elements-experimental/pearl-chain-vertical/pearl-chain-vertical.ts diff --git a/src/components/pearl-chain-vertical/readme.md b/src/elements-experimental/pearl-chain-vertical/readme.md similarity index 90% rename from src/components/pearl-chain-vertical/readme.md rename to src/elements-experimental/pearl-chain-vertical/readme.md index da26f187e1..475a5732f5 100644 --- a/src/components/pearl-chain-vertical/readme.md +++ b/src/elements-experimental/pearl-chain-vertical/readme.md @@ -1,5 +1,5 @@ The `sbb-pearl-chain-vertical` is a wrapper component for a -[sbb-pearl-chain-vertical-item](/docs/timetable-sbb-pearl-chain-vertical-item--docs) component, +[sbb-pearl-chain-vertical-item](/docs/experimental-sbb-pearl-chain-vertical-item--docs) component, which is projected within an unnamed slot. Please refer to its documentation for more details. diff --git a/src/components/pearl-chain.ts b/src/elements-experimental/pearl-chain.ts similarity index 100% rename from src/components/pearl-chain.ts rename to src/elements-experimental/pearl-chain.ts diff --git a/src/components/pearl-chain/pearl-chain.e2e.ts b/src/elements-experimental/pearl-chain/pearl-chain.e2e.ts similarity index 85% rename from src/components/pearl-chain/pearl-chain.e2e.ts rename to src/elements-experimental/pearl-chain/pearl-chain.e2e.ts index 6039201bf0..26d09e9369 100644 --- a/src/components/pearl-chain/pearl-chain.e2e.ts +++ b/src/elements-experimental/pearl-chain/pearl-chain.e2e.ts @@ -1,8 +1,7 @@ import { assert } from '@open-wc/testing'; +import { fixture } from '@sbb-esta/lyne-components/core/testing/private.js'; import { html } from 'lit/static-html.js'; -import { fixture } from '../core/testing/private.js'; - import { SbbPearlChainElement } from './pearl-chain.js'; describe(`sbb-pearl-chain with ${fixture.name}`, () => { diff --git a/src/components/pearl-chain/pearl-chain.sample-data.ts b/src/elements-experimental/pearl-chain/pearl-chain.sample-data.ts similarity index 100% rename from src/components/pearl-chain/pearl-chain.sample-data.ts rename to src/elements-experimental/pearl-chain/pearl-chain.sample-data.ts diff --git a/src/components/pearl-chain/pearl-chain.scss b/src/elements-experimental/pearl-chain/pearl-chain.scss similarity index 99% rename from src/components/pearl-chain/pearl-chain.scss rename to src/elements-experimental/pearl-chain/pearl-chain.scss index 31b8c261d5..3293654d8f 100644 --- a/src/components/pearl-chain/pearl-chain.scss +++ b/src/elements-experimental/pearl-chain/pearl-chain.scss @@ -1,4 +1,4 @@ -@use '../core/styles' as sbb; +@use '@sbb-esta/lyne-components/core/styles' as sbb; @mixin sbb-pearl-chain-dotted { background-color: unset; diff --git a/src/components/pearl-chain/pearl-chain.spec.ts b/src/elements-experimental/pearl-chain/pearl-chain.spec.ts similarity index 97% rename from src/components/pearl-chain/pearl-chain.spec.ts rename to src/elements-experimental/pearl-chain/pearl-chain.spec.ts index c49508799b..3cfd582f17 100644 --- a/src/components/pearl-chain/pearl-chain.spec.ts +++ b/src/elements-experimental/pearl-chain/pearl-chain.spec.ts @@ -1,8 +1,8 @@ import { expect } from '@open-wc/testing'; +import { fixture } from '@sbb-esta/lyne-components/core/testing/private.js'; +import { waitForLitRender } from '@sbb-esta/lyne-components/core/testing.js'; import { html } from 'lit/static-html.js'; -import { fixture } from '../core/testing/private.js'; -import { waitForLitRender } from '../core/testing.js'; import type { PtRideLeg } from '../core/timetable.js'; import type { SbbPearlChainElement } from './pearl-chain.js'; diff --git a/src/components/pearl-chain/pearl-chain.stories.ts b/src/elements-experimental/pearl-chain/pearl-chain.stories.ts similarity index 98% rename from src/components/pearl-chain/pearl-chain.stories.ts rename to src/elements-experimental/pearl-chain/pearl-chain.stories.ts index 8e41921982..22eea67c4b 100644 --- a/src/components/pearl-chain/pearl-chain.stories.ts +++ b/src/elements-experimental/pearl-chain/pearl-chain.stories.ts @@ -157,7 +157,7 @@ const meta: Meta = { extractComponentDescription: () => readme, }, }, - title: 'timetable/sbb-pearl-chain', + title: 'experimental/sbb-pearl-chain', }; export default meta; diff --git a/src/components/pearl-chain/pearl-chain.ts b/src/elements-experimental/pearl-chain/pearl-chain.ts similarity index 98% rename from src/components/pearl-chain/pearl-chain.ts rename to src/elements-experimental/pearl-chain/pearl-chain.ts index 46c5a00606..3fb7f14b08 100644 --- a/src/components/pearl-chain/pearl-chain.ts +++ b/src/elements-experimental/pearl-chain/pearl-chain.ts @@ -1,10 +1,13 @@ +import { + readDataNow, + removeTimezoneFromISOTimeString, +} from '@sbb-esta/lyne-components/core/datetime.js'; import { differenceInMinutes, isAfter, isBefore } from 'date-fns'; import type { CSSResultGroup, TemplateResult } from 'lit'; import { html, LitElement, nothing } from 'lit'; import { customElement, property } from 'lit/decorators.js'; import { styleMap } from 'lit/directives/style-map.js'; -import { readDataNow, removeTimezoneFromISOTimeString } from '../core/datetime.js'; import type { Leg, PtRideLeg } from '../core/timetable.js'; import { isRideLeg } from '../core/timetable.js'; diff --git a/src/components/pearl-chain/readme.md b/src/elements-experimental/pearl-chain/readme.md similarity index 100% rename from src/components/pearl-chain/readme.md rename to src/elements-experimental/pearl-chain/readme.md diff --git a/src/components/timetable-row.ts b/src/elements-experimental/timetable-row.ts similarity index 100% rename from src/components/timetable-row.ts rename to src/elements-experimental/timetable-row.ts diff --git a/src/components/timetable-row/readme.md b/src/elements-experimental/timetable-row/readme.md similarity index 100% rename from src/components/timetable-row/readme.md rename to src/elements-experimental/timetable-row/readme.md diff --git a/src/components/timetable-row/timetable-row.e2e.ts b/src/elements-experimental/timetable-row/timetable-row.e2e.ts similarity index 78% rename from src/components/timetable-row/timetable-row.e2e.ts rename to src/elements-experimental/timetable-row/timetable-row.e2e.ts index 0044d03cf8..3ddf904ecb 100644 --- a/src/components/timetable-row/timetable-row.e2e.ts +++ b/src/elements-experimental/timetable-row/timetable-row.e2e.ts @@ -1,10 +1,9 @@ import { assert, expect } from '@open-wc/testing'; +import { EventSpy, waitForCondition } from '@sbb-esta/lyne-components//core/testing.js'; +import type { SbbCardElement } from '@sbb-esta/lyne-components/card.js'; +import { fixture } from '@sbb-esta/lyne-components/core/testing/private.js'; import { html } from 'lit/static-html.js'; -import type { SbbCardElement } from '../card.js'; -import { fixture } from '../core/testing/private.js'; -import { EventSpy, waitForCondition } from '../core/testing.js'; - import { SbbTimetableRowElement } from './timetable-row.js'; describe(`sbb-timetable-row with ${fixture.name}`, () => { diff --git a/src/components/timetable-row/timetable-row.sample-data.ts b/src/elements-experimental/timetable-row/timetable-row.sample-data.ts similarity index 100% rename from src/components/timetable-row/timetable-row.sample-data.ts rename to src/elements-experimental/timetable-row/timetable-row.sample-data.ts diff --git a/src/components/timetable-row/timetable-row.scss b/src/elements-experimental/timetable-row/timetable-row.scss similarity index 98% rename from src/components/timetable-row/timetable-row.scss rename to src/elements-experimental/timetable-row/timetable-row.scss index 9a0d4b0966..40503ba66d 100644 --- a/src/components/timetable-row/timetable-row.scss +++ b/src/elements-experimental/timetable-row/timetable-row.scss @@ -1,4 +1,4 @@ -@use '../core/styles' as sbb; +@use '@sbb-esta/lyne-components/core/styles' as sbb; // Box-sizing rules contained in typography are not traversing Shadow DOM boundaries. We need to include box-sizing mixin in every component. @include sbb.box-sizing; diff --git a/src/components/timetable-row/timetable-row.spec.ts b/src/elements-experimental/timetable-row/timetable-row.spec.ts similarity index 98% rename from src/components/timetable-row/timetable-row.spec.ts rename to src/elements-experimental/timetable-row/timetable-row.spec.ts index 8fff9830e8..15cbe1920e 100644 --- a/src/components/timetable-row/timetable-row.spec.ts +++ b/src/elements-experimental/timetable-row/timetable-row.spec.ts @@ -1,8 +1,8 @@ import { expect } from '@open-wc/testing'; +import { fixture } from '@sbb-esta/lyne-components/core/testing/private.js'; +import { waitForLitRender } from '@sbb-esta/lyne-components/core/testing.js'; import { html } from 'lit/static-html.js'; -import { fixture } from '../core/testing/private.js'; -import { waitForLitRender } from '../core/testing.js'; import type { ITripItem, Notice, PtSituation } from '../core/timetable.js'; import type { SbbTimetableRowElement } from './timetable-row.js'; diff --git a/src/components/timetable-row/timetable-row.stories.ts b/src/elements-experimental/timetable-row/timetable-row.stories.ts similarity index 99% rename from src/components/timetable-row/timetable-row.stories.ts rename to src/elements-experimental/timetable-row/timetable-row.stories.ts index 544f6bcf0a..4c1ae2690c 100644 --- a/src/components/timetable-row/timetable-row.stories.ts +++ b/src/elements-experimental/timetable-row/timetable-row.stories.ts @@ -376,7 +376,7 @@ const meta: Meta = { extractComponentDescription: () => readme, }, }, - title: 'timetable/sbb-timetable-row', + title: 'experimental/sbb-timetable-row', }; export default meta; diff --git a/src/components/timetable-row/timetable-row.ts b/src/elements-experimental/timetable-row/timetable-row.ts similarity index 97% rename from src/components/timetable-row/timetable-row.ts rename to src/elements-experimental/timetable-row/timetable-row.ts index d183fd3ac2..6fc71aeb37 100644 --- a/src/components/timetable-row/timetable-row.ts +++ b/src/elements-experimental/timetable-row/timetable-row.ts @@ -1,11 +1,10 @@ -import { format } from 'date-fns'; -import type { CSSResultGroup, PropertyValues, TemplateResult } from 'lit'; -import { html, LitElement, nothing } from 'lit'; -import { customElement, property } from 'lit/decorators.js'; - -import { SbbLanguageController } from '../core/controllers.js'; -import { readDataNow, removeTimezoneFromISOTimeString, durationToTime } from '../core/datetime.js'; -import { setOrRemoveAttribute } from '../core/dom.js'; +import { SbbLanguageController } from '@sbb-esta/lyne-components/core/controllers.js'; +import { + readDataNow, + removeTimezoneFromISOTimeString, + durationToTime, +} from '@sbb-esta/lyne-components/core/datetime.js'; +import { setOrRemoveAttribute } from '@sbb-esta/lyne-components/core/dom.js'; import { i18nArrival, i18nClass, @@ -23,17 +22,22 @@ import { i18nTravelhints, i18nTripDuration, i18nTripQuayChange, -} from '../core/i18n.js'; -import type { SbbOccupancy } from '../core/interfaces.js'; -import type { ITripItem, Notice, PtRideLeg, PtSituation } from '../core/timetable.js'; +} from '@sbb-esta/lyne-components/core/i18n.js'; +import type { SbbOccupancy } from '@sbb-esta/lyne-components/core/interfaces.js'; +import { format } from 'date-fns'; +import { html, LitElement, nothing } from 'lit'; +import type { CSSResultGroup, PropertyValues, TemplateResult } from 'lit'; +import { customElement, property } from 'lit/decorators.js'; + import { getDepartureArrivalTimeAttribute, isRideLeg } from '../core/timetable.js'; +import type { ITripItem, Notice, PtRideLeg, PtSituation } from '../core/timetable.js'; import style from './timetable-row.scss?lit&inline'; -import '../card.js'; -import '../icon.js'; +import '@sbb-esta/lyne-components/card.js'; +import '@sbb-esta/lyne-components/icon.js'; +import '@sbb-esta/lyne-components/timetable-occupancy.js'; import '../pearl-chain-time.js'; -import '../timetable-occupancy.js'; /** HimCus interface for mapped icon name and text */ export interface HimCus { diff --git a/src/storybook/pages/home/home--logged-in.stories.ts b/src/storybook/pages/home/home--logged-in.stories.ts index 7022354635..b4d87a138f 100644 --- a/src/storybook/pages/home/home--logged-in.stories.ts +++ b/src/storybook/pages/home/home--logged-in.stories.ts @@ -4,7 +4,10 @@ import type { TemplateResult } from 'lit'; import { html } from 'lit'; import type { SbbDialogElement } from '../../../components/dialog.js'; -import { futureLeg, pastLeg } from '../../../components/pearl-chain/pearl-chain.sample-data.js'; +import { + futureLeg, + pastLeg, +} from '../../../elements-experimental/pearl-chain/pearl-chain.sample-data.js'; import { bikeProduct, @@ -17,9 +20,10 @@ import { timetableInput, } from './home.common.js'; import readme from './readme.md?raw'; + import '../../../components/dialog.js'; import '../../../components/journey-header.js'; -import '../../../components/pearl-chain.js'; +import '../../../elements-experimental/pearl-chain.js'; import './home.scss'; const negative: InputType = { diff --git a/vite.config.ts b/vite.config.ts index e0707464c3..595e7d7c6a 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -13,6 +13,10 @@ export default defineConfig({ // Alias used for test and storybook environments alias: [ { find: '@sbb-esta/lyne-components', replacement: resolve(__dirname, 'src/components') }, + { + find: '@sbb-esta/lyne-elements-experimental', + replacement: resolve(__dirname, 'src/elements-experimental'), + }, ], }, }); From 8792d49e6408be4bee9c0040d809ec3855b94c31 Mon Sep 17 00:00:00 2001 From: Tommmaso Menga Date: Tue, 14 May 2024 17:38:50 +0200 Subject: [PATCH 04/17] refactor(custom-elements-manifest): split manifest for each library --- src/components/vite.config.ts | 2 +- src/elements-experimental/vite.config.ts | 2 +- ...ponents-custom-elements-manifest.config.js | 3 + .../custom-elements-manifest.config.js | 109 ++++++++++++++++++ ...imental-custom-elements-manifest.config.js | 3 + tools/vite/custom-elements-manifest.ts | 4 +- 6 files changed, 119 insertions(+), 4 deletions(-) create mode 100644 tools/manifest/components-custom-elements-manifest.config.js create mode 100644 tools/manifest/elements-experimental-custom-elements-manifest.config.js diff --git a/src/components/vite.config.ts b/src/components/vite.config.ts index 94b82d04b4..f792e402a9 100644 --- a/src/components/vite.config.ts +++ b/src/components/vite.config.ts @@ -45,7 +45,7 @@ export default defineConfig((config) => ...(config.command === 'build' ? [dts()] : []), ...(isProdBuild(config) ? [ - customElementsManifest(), + customElementsManifest('components'), generateRootEntryPoint(), packageJsonTemplate({ exports: { diff --git a/src/elements-experimental/vite.config.ts b/src/elements-experimental/vite.config.ts index 7383584e98..e2fea0cfb0 100644 --- a/src/elements-experimental/vite.config.ts +++ b/src/elements-experimental/vite.config.ts @@ -30,7 +30,7 @@ export default defineConfig((config) => ...(config.command === 'build' ? [dts()] : []), ...(isProdBuild(config) ? [ - customElementsManifest(), + customElementsManifest('elements-experimental'), generateRootEntryPoint(), packageJsonTemplate({ exports: { diff --git a/tools/manifest/components-custom-elements-manifest.config.js b/tools/manifest/components-custom-elements-manifest.config.js new file mode 100644 index 0000000000..8f565cd550 --- /dev/null +++ b/tools/manifest/components-custom-elements-manifest.config.js @@ -0,0 +1,3 @@ +import { createManifestConfig } from './custom-elements-manifest.config.js'; + +export default createManifestConfig('components'); diff --git a/tools/manifest/custom-elements-manifest.config.js b/tools/manifest/custom-elements-manifest.config.js index f5ef46326e..ecb969def8 100644 --- a/tools/manifest/custom-elements-manifest.config.js +++ b/tools/manifest/custom-elements-manifest.config.js @@ -1,6 +1,115 @@ /** * Docs: https://custom-elements-manifest.open-wc.org/analyzer/getting-started/ */ +export function createManifestConfig(library = '') { + return { + litelement: true, + globs: [`src/${library}/**/*.ts`], + exclude: [ + '**/*[.-]{stories,spec,e2e,test-utils}.ts', + '**/private/*', + '**/private.ts', + 'vite.config.ts', + ], + outdir: `dist/${library}`, + dependencies: false, + packagejson: false, + /** @type {import('@custom-elements-manifest/analyzer').Plugin[]} */ + plugins: [ + { + analyzePhase({ ts, node, moduleDoc }) { + if ( + ts.isNewExpression(node) && + node.expression.getText() === 'NamedSlotStateController' + ) { + let classNode = node; + while (classNode) { + if (ts.isClassDeclaration(classNode)) { + const className = classNode.name.getText(); + const classDoc = moduleDoc.declarations.find( + (declaration) => declaration.name === className, + ); + classDoc['_ssrslotstate'] = true; + } + classNode = classNode.parent; + } + } + }, + packageLinkPhase({ customElementsManifest }) { + function fixModulePaths(node, pathAction) { + for (const [key, value] of Object.entries(node)) { + if (Array.isArray(value)) { + value.forEach((v) => fixModulePaths(v, pathAction)); + } else if (typeof value === 'object') { + fixModulePaths(value, pathAction); + } else if (key === 'module' || key === 'path') { + node[key] = pathAction(value); + } + } + } + const fixTsPathsReg = new RegExp(`^\\/?src\\/${library}\\/`); + const fixTsPaths = (value) => value.replace(fixTsPathsReg, '').replace(/.ts$/, '.js'); + for (const module of customElementsManifest.modules) { + fixModulePaths(module, fixTsPaths); + for (const declaration of module.declarations.filter((d) => d.kind === 'class')) { + if (declaration.name === 'SbbIconBase') { + delete declaration.customElement; + } + for (const member of declaration.members) { + if (member.name.startsWith('_') && member.default) { + const publicName = member.name.replace(/^_/, ''); + const publicMember = declaration.members.find((m) => m.name === publicName); + if (publicMember) { + publicMember.default = member.default; + } + } + } + } + } + const reexportModules = []; + const moduleMapping = new Map(); + for (const moduleEntry of customElementsManifest.modules) { + if ( + !reexportModules.includes(moduleEntry) && + moduleEntry.exports?.length && + moduleEntry.exports.some((e) => e.name !== '*') + ) { + const reexportPath = moduleEntry.path.replace(/\/[\w-]+\.js/, '.js'); + const reexportModule = customElementsManifest.modules.find( + (m) => m.path === reexportPath, + ); + if (reexportModule) { + moduleMapping.set(moduleEntry.path, reexportModule.path); + reexportModules.push(reexportModule); + reexportModule.declarations.push(...moduleEntry.declarations); + for (const entry of moduleEntry.exports) { + entry.declaration.module = reexportModule.path; + } + reexportModule.exports = reexportModule.exports.filter( + (e) => + e.name !== '*' || + moduleEntry.path === + reexportModule.path.replace(/\/[\w-]+\.js/, '') + + e.declaration.package.substring(2), + ); + reexportModule.exports.push(...moduleEntry.exports); + customElementsManifest.modules = customElementsManifest.modules.filter( + (m) => m !== moduleEntry, + ); + } + } + } + fixModulePaths(customElementsManifest, (value) => moduleMapping.get(value) ?? value); + }, + }, + ], + }; +} + +/** + * Docs: https://custom-elements-manifest.open-wc.org/analyzer/getting-started/ + */ +// TODO generate a single custom element manifest for both libraries. Only used by the docs command for now export default { litelement: true, globs: ['src/components/**/*.ts', 'src/elements-experimental/**/*.ts'], diff --git a/tools/manifest/elements-experimental-custom-elements-manifest.config.js b/tools/manifest/elements-experimental-custom-elements-manifest.config.js new file mode 100644 index 0000000000..5318917b84 --- /dev/null +++ b/tools/manifest/elements-experimental-custom-elements-manifest.config.js @@ -0,0 +1,3 @@ +import { createManifestConfig } from './custom-elements-manifest.config.js'; + +export default createManifestConfig('elements-experimental'); diff --git a/tools/vite/custom-elements-manifest.ts b/tools/vite/custom-elements-manifest.ts index 7dd9bf8888..9d349ce80c 100644 --- a/tools/vite/custom-elements-manifest.ts +++ b/tools/vite/custom-elements-manifest.ts @@ -4,7 +4,7 @@ import type { PluginOption } from 'vite'; import { root } from './build-meta.js'; -export function customElementsManifest(): PluginOption { +export function customElementsManifest(library: string): PluginOption { return { name: 'custom-elements-definition', closeBundle() { @@ -13,7 +13,7 @@ export function customElementsManifest(): PluginOption { argv: [ 'analyze', '--config', - new URL('./tools/manifest/custom-elements-manifest.config.js', root).pathname, + new URL(`./tools/manifest/${library}-custom-elements-manifest.config.js`, root).pathname, ], cwd: root.pathname, }); From fdb24a9599b9d2c78b9ec1c5a0d7afbc82514414 Mon Sep 17 00:00:00 2001 From: Tommmaso Menga Date: Mon, 20 May 2024 11:29:55 +0200 Subject: [PATCH 05/17] refactor: create '@sbb-esta/lyne-react-experimental' library --- package.json | 4 ++- src/react/experimental-vite.config.ts | 49 +++++++++++++++++++++++++++ src/react/experimental.package.json | 18 ++++++++++ src/react/package.json | 6 ++-- src/react/tsconfig.json | 4 ++- src/react/vite.config.ts | 2 +- tools/vite/generate-react-wrappers.ts | 20 +++++------ tools/vite/package-json-template.ts | 16 ++++++--- tsconfig.json | 4 +-- 9 files changed, 101 insertions(+), 22 deletions(-) create mode 100644 src/react/experimental-vite.config.ts create mode 100644 src/react/experimental.package.json diff --git a/package.json b/package.json index e45b98115d..3b4c08fcc8 100644 --- a/package.json +++ b/package.json @@ -26,9 +26,11 @@ "build:components:development": "NODE_ENV=development vite build --mode development --config src/components/vite.config.ts", "build:elements-experimental:production": "vite build --config src/elements-experimental/vite.config.ts", "build:elements-experimental:development": "NODE_ENV=development vite build --mode development --config src/elements-experimental/vite.config.ts", - "build:react": "npm-run-all --sequential build:react:*", + "build:react": "npm-run-all --sequential build:react:* build:react-experimental:*", "build:react:production": "vite build --config src/react/vite.config.ts", "build:react:development": "NODE_ENV=development vite build --mode development --config src/react/vite.config.ts", + "build:react-experimental:production": "vite build --config src/react/experimental-vite.config.ts", + "build:react-experimental:development": "NODE_ENV=development vite build --mode development --config src/react/experimental-vite.config.ts", "build:storybook": "storybook build --quiet --output-dir dist/storybook --stats-json", "build:visual-regression-app": "vite build --config src/visual-regression-app/vite.config.ts", "build": "npm-run-all --sequential build:components build:react build:storybook", diff --git a/src/react/experimental-vite.config.ts b/src/react/experimental-vite.config.ts new file mode 100644 index 0000000000..b61423e93e --- /dev/null +++ b/src/react/experimental-vite.config.ts @@ -0,0 +1,49 @@ +import { defineConfig, mergeConfig, type UserConfig } from 'vite'; + +import { + distDir, + dts, + generateReactWrappers, + isProdBuild, + packageJsonTemplate, +} from '../../tools/vite/index.js'; +import rootConfig from '../../vite.config.js'; + +export default defineConfig((config) => + mergeConfig(rootConfig, { + root: new URL('.', import.meta.url).pathname, + plugins: [ + generateReactWrappers( + '@sbb-esta/lyne-elements-experimental', + './elements-experimental/custom-elements.json', + ), + ...(config.command === 'build' ? [dts()] : []), + ...(isProdBuild(config) + ? [ + packageJsonTemplate({ + templatePath: './experimental.package.json', + exportsExtensions: ['', '.js'], + }), + ] + : []), + ], + build: { + lib: { + formats: ['es'], + }, + minify: isProdBuild(config), + outDir: new URL(`./react-experimental/${isProdBuild(config) ? '' : 'development/'}`, distDir) + .pathname, + emptyOutDir: true, + rollupOptions: { + external: [ + /^@sbb-esta\/lyne-elements-experimental\/?/, + /^@sbb-esta\/lyne-components\/?/, + /^@lit\/react\/?/, + /^lit\/?/, + /^react/, + ], + }, + }, + }), +); diff --git a/src/react/experimental.package.json b/src/react/experimental.package.json new file mode 100644 index 0000000000..bcff98396a --- /dev/null +++ b/src/react/experimental.package.json @@ -0,0 +1,18 @@ +{ + "name": "@sbb-esta/lyne-react-experimental", + "version": "0.0.0-PLACEHOLDER", + "description": "Lyne Design System React Library", + "keywords": ["design system", "web components", "lit", "react"], + "type": "module", + "peerDependencies": { + "@sbb-esta/lyne-components": "0.0.0-PLACEHOLDER", + "@sbb-esta/lyne-elements-experimental": "0.0.0-PLACEHOLDER" + }, + "dependencies": { + "@lit/react": "0.0.0-LITREACT", + "react": "0.0.0-REACT" + }, + "publishConfig": { + "access": "public" + } +} diff --git a/src/react/package.json b/src/react/package.json index 1d2a45187a..0d031ec423 100644 --- a/src/react/package.json +++ b/src/react/package.json @@ -1,5 +1,5 @@ { - "name": "@sbb-esta/lyne-components-react", + "name": "@sbb-esta/lyne-react", "version": "0.0.0-PLACEHOLDER", "description": "Lyne Design System React Library", "keywords": [ @@ -9,9 +9,11 @@ "react" ], "type": "module", + "peerDependencies": { + "@sbb-esta/lyne-components": "0.0.0-PLACEHOLDER" + }, "dependencies": { "@lit/react": "0.0.0-LITREACT", - "@sbb-esta/lyne-components": "0.0.0-PLACEHOLDER", "react": "0.0.0-REACT" }, "publishConfig": { diff --git a/src/react/tsconfig.json b/src/react/tsconfig.json index e7bb96c730..6727b1908a 100644 --- a/src/react/tsconfig.json +++ b/src/react/tsconfig.json @@ -6,7 +6,9 @@ "paths": { "@sbb-esta/lyne-components": ["../components"], "@sbb-esta/lyne-components/*": ["../components/*"], - "@sbb-esta/lyne-components-react/*": ["./*"] + "@sbb-esta/lyne-elements-experimental": ["../elements-experimental"], + "@sbb-esta/lyne-elements-experimental/*": ["../elements-experimental/*"], + "@sbb-esta/lyne-react/*": ["./*"] } }, "include": ["./**/*.ts", "../vite-env.d.ts"] diff --git a/src/react/vite.config.ts b/src/react/vite.config.ts index 3509c44529..ef79baedcb 100644 --- a/src/react/vite.config.ts +++ b/src/react/vite.config.ts @@ -13,7 +13,7 @@ export default defineConfig((config) => mergeConfig(rootConfig, { root: new URL('.', import.meta.url).pathname, plugins: [ - generateReactWrappers(), + generateReactWrappers('@sbb-esta/lyne-components', './components/custom-elements.json'), ...(config.command === 'build' ? [dts()] : []), ...(isProdBuild(config) ? [packageJsonTemplate({ exportsExtensions: ['', '.js'] })] : []), ], diff --git a/tools/vite/generate-react-wrappers.ts b/tools/vite/generate-react-wrappers.ts index 4455c1adc5..419c9a0bdc 100644 --- a/tools/vite/generate-react-wrappers.ts +++ b/tools/vite/generate-react-wrappers.ts @@ -24,14 +24,14 @@ import type { PluginOption } from 'vite'; import { distDir } from './build-meta.js'; -export function generateReactWrappers(): PluginOption { - const manifestPath = new URL('./components/custom-elements.json', distDir); +export function generateReactWrappers(library: string, manifestPath: string): PluginOption { + const fullManifestPath = new URL(manifestPath, distDir); let manifest: Package; try { - manifest = JSON.parse(readFileSync(manifestPath, 'utf8')); + manifest = JSON.parse(readFileSync(fullManifestPath, 'utf8')); } catch (e) { console.error( - `Failed to read manifest at ${manifestPath}. Please run 'yarn build:components' or 'yarn docs:manifest' first!`, + `Failed to read manifest at ${fullManifestPath}. Please run 'yarn build:components' or 'yarn docs:manifest' first!`, ); process.exit(1); } @@ -64,7 +64,7 @@ export function generateReactWrappers(): PluginOption { entryPoints[entryPoint.replace(/.ts$/, '')] = entryPoint; const targetPath = new URL(`./${entryPoint}`, packageRoot); createDir(new URL('.', targetPath)); - const reactTemplate = renderTemplate(declaration, declarations, module, exports); + const reactTemplate = renderTemplate(declaration, declarations, module, exports, library); generatedPaths.push(targetPath); writeFileSync(targetPath, reactTemplate, 'utf8'); } @@ -114,6 +114,7 @@ function renderTemplate( declarations: Declaration[], module: Module, exports: Export[], + library: string, ): string { const extensions = findExtensionUsage(declaration, declarations); const dirDepth = module.path.split('/').length - 1; @@ -121,7 +122,7 @@ function renderTemplate( const extensionImport = !extensions.size ? '' : ` - + import { ${Array.from(extensions.keys()).join(', ')} } from '${relativeCoreImportPath}';`; const extension = [...extensions.values()].reduce( (current, next) => (v) => current(next(v)), @@ -167,13 +168,10 @@ function renderTemplate( const reactTemplate = `/* autogenerated */ import { createComponent${declaration.events?.length ? ', type EventName' : ''} } from '${relativeCoreImportPath}'; ${Array.from(componentsImports) - .map( - ([key, imports]) => - `import { ${imports.join(', ')} } from '@sbb-esta/lyne-components/${key}';`, - ) + .map(([key, imports]) => `import { ${imports.join(', ')} } from '${library}/${key}';`) .join('\n')} import react from 'react';${extensionImport} - + // eslint-disable-next-line @typescript-eslint/naming-convention export const ${declaration.name.replace(/Element$/, '')} = ${extension(`createComponent({ tagName: '${ diff --git a/tools/vite/package-json-template.ts b/tools/vite/package-json-template.ts index 0ac3566f7e..56327d96b1 100644 --- a/tools/vite/package-json-template.ts +++ b/tools/vite/package-json-template.ts @@ -6,7 +6,11 @@ import type { PluginOption, ResolvedConfig } from 'vite'; import { root } from './build-meta.js'; export function packageJsonTemplate( - options: { exports?: Record>; exportsExtensions?: string[] } = {}, + options: { + templatePath?: string; + exports?: Record>; + exportsExtensions?: string[]; + } = {}, ): PluginOption { options.exportsExtensions ??= ['.js']; let viteConfig: ResolvedConfig; @@ -19,12 +23,16 @@ export function packageJsonTemplate( if (viteConfig.command !== 'build') { return; } - const packageJsonPath = './package.json'; - const rootPackageJson = JSON.parse(readFileSync(new URL(packageJsonPath, root), 'utf8')); + const rootPackageJsonPath = './package.json'; + const packageJsonTemplatePath = options.templatePath ?? './package.json'; + const rootPackageJson = JSON.parse(readFileSync(new URL(rootPackageJsonPath, root), 'utf8')); const litMajorVersion = +rootPackageJson.dependencies.lit.match(/\d+/); const reactMajorVersion = +rootPackageJson.devDependencies.react.match(/\d+/); const litReactMajorVersion = +rootPackageJson.devDependencies['@lit/react'].match(/\d+/); - const packageJsonTemplate = readFileSync(join(viteConfig.root, packageJsonPath), 'utf8'); + const packageJsonTemplate = readFileSync( + join(viteConfig.root, packageJsonTemplatePath), + 'utf8', + ); const packageJsonContent = packageJsonTemplate .replaceAll('0.0.0-PLACEHOLDER', rootPackageJson.version) .replaceAll('0.0.0-LITREACT', `^${litReactMajorVersion}.0.0`) diff --git a/tsconfig.json b/tsconfig.json index 034e2e764c..a3253d8102 100644 --- a/tsconfig.json +++ b/tsconfig.json @@ -21,8 +21,8 @@ "@sbb-esta/lyne-components/*": ["src/components/*"], "@sbb-esta/lyne-elements-experimental": ["src/elements-experimental"], "@sbb-esta/lyne-elements-experimental/*": ["src/elements-experimental/*"], - "@sbb-esta/lyne-components-react": ["src/react"], - "@sbb-esta/lyne-components-react/*": ["src/react/*"] + "@sbb-esta/lyne-react": ["src/react"], + "@sbb-esta/lyne-react/*": ["src/react/*"] }, "verbatimModuleSyntax": true, "strict": true, From 86ec5f3977be299ede0fed79d30e71a9618d4190 Mon Sep 17 00:00:00 2001 From: Tommmaso Menga Date: Mon, 20 May 2024 14:19:23 +0200 Subject: [PATCH 06/17] refactor: rename '@sbb-esta/lyne-components' => '@sbb-esta/lyne-elements' --- .github/workflows/continuous-integration.yml | 2 +- .storybook/preview.ts | 4 +- docs/CODING_STANDARDS.md | 4 +- docs/CONTRIBUTING.md | 6 +- docs/DEVELOPER.md | 10 +-- docs/GETTING_STARTED.md | 58 +++++++++--------- package.json | 18 +++--- scripts/docs_generate.ts | 2 +- scripts/migrate-index.ts | 2 +- scripts/migrate-ssr-e2e.ts | 6 +- scripts/migrate-toggle-data-entry.ts | 2 +- .../core/timetable/access-leg-helper.ts | 4 +- .../journey-summary/journey-summary.e2e.ts | 2 +- .../journey-summary/journey-summary.scss | 2 +- .../journey-summary/journey-summary.spec.ts | 4 +- .../journey-summary.stories.ts | 4 +- .../journey-summary/journey-summary.ts | 14 ++--- src/elements-experimental/package.json | 2 +- .../pearl-chain-time/pearl-chain-time.scss | 2 +- .../pearl-chain-time/pearl-chain-time.spec.ts | 4 +- .../pearl-chain-time/pearl-chain-time.ts | 6 +- .../pearl-chain-vertical-item.scss | 2 +- .../pearl-chain-vertical-item.spec.ts | 4 +- .../pearl-chain-vertical.e2e.ts | 2 +- .../pearl-chain-vertical.scss | 2 +- .../pearl-chain-vertical.spec.ts | 4 +- .../pearl-chain-vertical.stories.ts | 2 +- .../pearl-chain/pearl-chain.e2e.ts | 2 +- .../pearl-chain/pearl-chain.scss | 2 +- .../pearl-chain/pearl-chain.spec.ts | 4 +- .../pearl-chain/pearl-chain.ts | 2 +- .../timetable-duration.e2e.ts | 2 +- .../timetable-duration.scss | 2 +- .../timetable-duration.spec.ts | 2 +- .../timetable-duration/timetable-duration.ts | 4 +- .../timetable-row/timetable-row.e2e.ts | 6 +- .../timetable-row/timetable-row.scss | 2 +- .../timetable-row/timetable-row.spec.ts | 4 +- .../timetable-row/timetable-row.ts | 16 ++--- src/elements-experimental/tsconfig.json | 2 +- src/elements-experimental/vite.config.ts | 4 +- src/{components => elements}/_index.scss | 0 src/{components => elements}/accordion.ts | 0 .../__snapshots__/accordion.spec.snap.js | 0 .../accordion/accordion.e2e.ts | 0 .../accordion/accordion.scss | 0 .../accordion/accordion.spec.ts | 0 .../accordion/accordion.stories.ts | 2 +- .../accordion/accordion.ts | 0 .../accordion/readme.md | 2 +- src/{components => elements}/action-group.ts | 0 .../__snapshots__/action-group.spec.snap.js | 0 .../action-group/action-group.e2e.ts | 0 .../action-group/action-group.scss | 0 .../action-group/action-group.spec.ts | 0 .../action-group/action-group.stories.ts | 2 +- .../action-group/action-group.ts | 0 .../action-group/readme.md | 2 +- src/{components => elements}/alert.ts | 0 .../alert/alert-group.ts | 0 .../__snapshots__/alert-group.spec.snap.js | 0 .../alert/alert-group/alert-group.e2e.ts | 0 .../alert/alert-group/alert-group.scss | 0 .../alert/alert-group/alert-group.spec.ts | 0 .../alert/alert-group/alert-group.stories.ts | 2 +- .../alert/alert-group/alert-group.ts | 0 .../alert/alert-group/readme.md | 2 +- src/{components => elements}/alert/alert.ts | 0 .../alert/__snapshots__/alert.spec.snap.js | 0 .../alert/alert/alert.e2e.ts | 0 .../alert/alert/alert.scss | 0 .../alert/alert/alert.spec.ts | 0 .../alert/alert/alert.stories.ts | 2 +- .../alert/alert/alert.ts | 0 .../alert/alert/readme.md | 4 +- src/{components => elements}/autocomplete.ts | 0 .../__snapshots__/autocomplete.spec.snap.js | 0 .../autocomplete/autocomplete.e2e.ts | 0 .../autocomplete/autocomplete.scss | 0 .../autocomplete/autocomplete.spec.ts | 0 .../autocomplete/autocomplete.stories.ts | 2 +- .../autocomplete/autocomplete.ts | 0 .../autocomplete/readme.md | 4 +- src/{components => elements}/breadcrumb.ts | 0 .../breadcrumb/breadcrumb-group.ts | 0 .../breadcrumb-group.spec.snap.js | 0 .../breadcrumb-group/breadcrumb-group.e2e.ts | 0 .../breadcrumb-group/breadcrumb-group.scss | 0 .../breadcrumb-group/breadcrumb-group.spec.ts | 0 .../breadcrumb-group.stories.ts | 2 +- .../breadcrumb-group/breadcrumb-group.ts | 0 .../breadcrumb/breadcrumb-group/readme.md | 2 +- .../breadcrumb/breadcrumb.ts | 0 .../__snapshots__/breadcrumb.spec.snap.js | 0 .../breadcrumb/breadcrumb/breadcrumb.e2e.ts | 0 .../breadcrumb/breadcrumb/breadcrumb.scss | 0 .../breadcrumb/breadcrumb/breadcrumb.spec.ts | 0 .../breadcrumb/breadcrumb.stories.ts | 2 +- .../breadcrumb/breadcrumb/breadcrumb.ts | 0 .../breadcrumb/breadcrumb/readme.md | 2 +- src/{components => elements}/button.ts | 0 .../button/button-link.ts | 0 .../__snapshots__/button-link.spec.snap.js | 0 .../button/button-link/button-link.e2e.ts | 0 .../button/button-link/button-link.spec.ts | 0 .../button/button-link/button-link.stories.ts | 2 +- .../button/button-link/button-link.ts | 0 .../button/button-link/readme.md | 0 .../button/button-static.ts | 0 .../__snapshots__/button-static.spec.snap.js | 0 .../button/button-static/button-static.e2e.ts | 0 .../button-static/button-static.spec.ts | 0 .../button-static/button-static.stories.ts | 2 +- .../button/button-static/button-static.ts | 0 .../button/button-static/readme.md | 0 src/{components => elements}/button/button.ts | 0 .../button/__snapshots__/button.spec.snap.js | 0 .../button/button/button.e2e.ts | 0 .../button/button/button.snapshot.spec.ts | 0 .../button/button/button.spec.ts | 0 .../button/button/button.stories.ts | 2 +- .../button/button/button.ts | 0 .../button/button/readme.md | 0 src/{components => elements}/button/common.ts | 0 .../button/common/button-common-stories.ts | 0 .../button/common/button-common.scss | 0 .../button/common/button-common.ts | 0 .../common/button-link-common-stories.ts | 0 .../button/common/button-test-utils.ts | 0 .../button/common/common-stories.ts | 0 .../button/common/primary-button.scss | 0 .../button/common/secondary-button.scss | 0 .../button/common/tertiary-button.scss | 0 .../button/common/transparent-button.scss | 0 .../button/mini-button.ts | 0 .../button/mini-button/mini-button.scss | 0 .../button/mini-button/mini-button.stories.ts | 2 +- .../button/mini-button/mini-button.ts | 0 .../button/mini-button/readme.md | 2 +- .../button/secondary-button-link.ts | 0 .../secondary-button-link.spec.snap.js | 0 .../button/secondary-button-link/readme.md | 0 .../secondary-button-link.spec.ts | 0 .../secondary-button-link.stories.ts | 2 +- .../secondary-button-link.ts | 0 .../button/secondary-button-static.ts | 0 .../secondary-button-static.spec.snap.js | 0 .../button/secondary-button-static/readme.md | 0 .../secondary-button-static.spec.ts | 0 .../secondary-button-static.stories.ts | 2 +- .../secondary-button-static.ts | 0 .../button/secondary-button.ts | 0 .../secondary-button.spec.snap.js | 0 .../button/secondary-button/readme.md | 0 .../secondary-button/secondary-button.spec.ts | 0 .../secondary-button.stories.ts | 2 +- .../secondary-button/secondary-button.ts | 0 .../button/tertiary-button-link.ts | 0 .../tertiary-button-link.spec.snap.js | 0 .../button/tertiary-button-link/readme.md | 0 .../tertiary-button-link.spec.ts | 0 .../tertiary-button-link.stories.ts | 2 +- .../tertiary-button-link.ts | 0 .../button/tertiary-button-static.ts | 0 .../tertiary-button-static.spec.snap.js | 0 .../button/tertiary-button-static/readme.md | 0 .../tertiary-button-static.spec.ts | 0 .../tertiary-button-static.stories.ts | 2 +- .../tertiary-button-static.ts | 0 .../button/tertiary-button.ts | 0 .../tertiary-button.spec.snap.js | 0 .../button/tertiary-button/readme.md | 0 .../tertiary-button/tertiary-button.spec.ts | 0 .../tertiary-button.stories.ts | 2 +- .../button/tertiary-button/tertiary-button.ts | 0 .../button/transparent-button-link.ts | 0 .../transparent-button-link.spec.snap.js | 0 .../button/transparent-button-link/readme.md | 0 .../transparent-button-link.spec.ts | 0 .../transparent-button-link.stories.ts | 2 +- .../transparent-button-link.ts | 0 .../button/transparent-button-static.ts | 0 .../transparent-button-static.spec.snap.js | 0 .../transparent-button-static/readme.md | 0 .../transparent-button-static.spec.ts | 0 .../transparent-button-static.stories.ts | 2 +- .../transparent-button-static.ts | 0 .../button/transparent-button.ts | 0 .../transparent-button.spec.snap.js | 0 .../button/transparent-button/readme.md | 0 .../transparent-button.spec.ts | 0 .../transparent-button.stories.ts | 2 +- .../transparent-button/transparent-button.ts | 0 src/{components => elements}/calendar.ts | 0 .../__snapshots__/calendar.spec.snap.js | 0 .../calendar/calendar.e2e.ts | 0 .../calendar/calendar.scss | 0 .../calendar/calendar.spec.ts | 0 .../calendar/calendar.stories.ts | 2 +- .../calendar/calendar.ts | 0 .../calendar/readme.md | 2 +- src/{components => elements}/card.ts | 0 .../card/card-badge.ts | 0 .../__snapshots__/card-badge.spec.snap.js | 0 .../card/card-badge/card-badge.e2e.ts | 0 .../card/card-badge/card-badge.scss | 0 .../card/card-badge/card-badge.spec.ts | 0 .../card/card-badge/card-badge.stories.ts | 2 +- .../card/card-badge/card-badge.ts | 0 .../card/card-badge/readme.md | 4 +- .../card/card-button.ts | 0 .../__snapshots__/card-button.e2e.snap.js | 0 .../card/card-button/card-button.e2e.ts | 0 .../card/card-button/card-button.stories.ts | 2 +- .../card/card-button/card-button.ts | 0 .../card/card-button/readme.md | 0 .../card/card-link.ts | 0 .../__snapshots__/card-link.e2e.snap.js | 0 .../card/card-link/card-link.e2e.ts | 0 .../card/card-link/card-link.stories.ts | 2 +- .../card/card-link/card-link.ts | 0 .../card/card-link/readme.md | 0 src/{components => elements}/card/card.ts | 0 .../card/card/__snapshots__/card.spec.snap.js | 0 .../card/card/card.e2e.ts | 0 .../card/card/card.scss | 0 .../card/card/card.spec.ts | 0 .../card/card/card.stories.ts | 2 +- .../card/card/card.ts | 0 .../card/card/readme.md | 6 +- src/{components => elements}/card/common.ts | 0 .../card/common/card-action-common.ts | 0 .../card/common/card-action.scss | 0 src/{components => elements}/checkbox.ts | 0 .../checkbox/checkbox-group.ts | 0 .../__snapshots__/checkbox-group.spec.snap.js | 0 .../checkbox-group/checkbox-group.e2e.ts | 0 .../checkbox-group/checkbox-group.scss | 0 .../checkbox-group/checkbox-group.spec.ts | 0 .../checkbox-group/checkbox-group.stories.ts | 2 +- .../checkbox/checkbox-group/checkbox-group.ts | 0 .../checkbox/checkbox-group/readme.md | 6 +- .../checkbox/checkbox.ts | 0 .../__snapshots__/checkbox.spec.snap.js | 0 .../checkbox/checkbox/checkbox.e2e.ts | 0 .../checkbox/checkbox/checkbox.scss | 0 .../checkbox/checkbox/checkbox.spec.ts | 0 .../checkbox/checkbox/checkbox.stories.ts | 2 +- .../checkbox/checkbox/checkbox.ts | 0 .../checkbox/checkbox/readme.md | 0 src/{components => elements}/chip.ts | 0 .../chip/__snapshots__/chip.spec.snap.js | 0 src/{components => elements}/chip/chip.e2e.ts | 0 src/{components => elements}/chip/chip.scss | 0 .../chip/chip.spec.ts | 0 .../chip/chip.stories.ts | 2 +- src/{components => elements}/chip/chip.ts | 0 src/{components => elements}/chip/readme.md | 0 src/{components => elements}/clock.ts | 0 .../clock/__snapshots__/clock.spec.snap.js | 0 .../clock/assets/sbb_clock_face.svg | 0 .../clock/assets/sbb_clock_hours.svg | 0 .../clock/assets/sbb_clock_minutes.svg | 0 .../clock/assets/sbb_clock_seconds.svg | 0 src/{components => elements}/clock/clock.scss | 0 .../clock/clock.spec.ts | 0 .../clock/clock.stories.ts | 2 +- src/{components => elements}/clock/clock.ts | 0 src/{components => elements}/clock/readme.md | 0 src/{components => elements}/container.ts | 0 .../container/container.ts | 0 .../__snapshots__/container.spec.snap.js | 0 .../container/container/container.e2e.ts | 0 .../container/container/container.scss | 0 .../container/container/container.spec.ts | 0 .../container/container/container.stories.ts | 2 +- .../container/container/container.ts | 0 .../container/container/readme.md | 0 .../container/sticky-bar.ts | 0 .../__snapshots__/sticky-bar.spec.snap.js | 0 .../container/sticky-bar/readme.md | 0 .../container/sticky-bar/sticky-bar.e2e.ts | 0 .../container/sticky-bar/sticky-bar.scss | 0 .../container/sticky-bar/sticky-bar.spec.ts | 0 .../sticky-bar/sticky-bar.stories.ts | 2 +- .../container/sticky-bar/sticky-bar.ts | 0 src/{components => elements}/core/a11y.ts | 0 .../core/a11y/arrow-navigation.spec.ts | 0 .../core/a11y/arrow-navigation.ts | 0 .../core/a11y/fake-event-detection.ts | 0 .../a11y/focus-visible-within-controller.ts | 0 .../core/a11y/focus.spec.ts | 0 .../core/a11y/focus.ts | 0 .../core/a11y/input-modality-detector.ts | 0 .../core/a11y/interactivity-checker.spec.ts | 0 .../core/a11y/interactivity-checker.ts | 0 .../core/base-elements.ts | 0 .../base-elements/action-base-element.e2e.ts | 0 .../core/base-elements/action-base-element.ts | 0 .../base-elements/button-base-element.e2e.ts | 0 .../core/base-elements/button-base-element.ts | 0 .../base-elements/link-base-element.e2e.ts | 0 .../core/base-elements/link-base-element.ts | 0 src/{components => elements}/core/config.ts | 0 .../core/config/config.ts | 0 .../core/controllers.ts | 0 .../controllers/connected-abort-controller.ts | 0 .../controllers/language-controller.spec.ts | 0 .../core/controllers/language-controller.ts | 0 .../core/controllers/slot-state-controller.ts | 0 src/{components => elements}/core/datetime.ts | 0 .../core/datetime/data-now.ts | 0 .../core/datetime/date-adapter.ts | 0 .../core/datetime/date-helper.spec.ts | 0 .../core/datetime/date-helper.ts | 0 .../core/datetime/native-date-adapter.spec.ts | 0 .../core/datetime/native-date-adapter.ts | 0 .../core/decorators.ts | 0 .../core/decorators/host-attributes.ts | 0 src/{components => elements}/core/dom.ts | 0 .../core/dom/breakpoint.ts | 0 .../core/dom/find-referenced-element.ts | 0 .../core/dom/get-document-writing-mode.ts | 0 .../core/dom/host-context.spec.ts | 0 .../core/dom/host-context.ts | 0 .../core/dom/input-element.ts | 0 .../core/dom/platform.ts | 0 .../core/dom/scroll.ts | 0 .../core/dom/set-or-remove-attribute.ts | 0 src/{components => elements}/core/dom/ssr.ts | 0 src/{components => elements}/core/eventing.ts | 0 .../eventing/composed-path-has-attribute.ts | 0 .../core/eventing/event-emitter.ts | 0 .../core/eventing/event-target.ts | 0 .../core/eventing/form-element-handlers.ts | 0 .../core/eventing/forward-event.ts | 0 .../core/eventing/handler-repository.ts | 0 .../core/eventing/is-event-prevented.ts | 0 .../core/eventing/throttle.ts | 0 src/{components => elements}/core/i18n.ts | 0 .../core/i18n/i18n.ts | 0 src/{components => elements}/core/images.ts | 0 .../core/interfaces.ts | 0 .../core/interfaces/types.ts | 0 .../core/interfaces/validation-change.ts | 0 src/{components => elements}/core/mixins.ts | 0 .../core/mixins/constructor.ts | 0 .../core/mixins/disabled-mixin.ts | 0 .../mixins/form-associated-checkbox-mixin.ts | 0 .../core/mixins/form-associated-mixin.ts | 0 .../core/mixins/hydration-mixin.ts | 0 .../core/mixins/named-slot-list-mixin.ts | 0 .../core/mixins/negative-mixin.ts | 0 .../core/mixins/required-mixin.ts | 0 .../core/mixins/update-scheduler-mixin.ts | 0 .../core/observers.ts | 0 .../core/observers/intersection-observer.ts | 0 .../core/observers/mutation-observer.ts | 0 .../core/observers/resize-observer.ts | 0 src/{components => elements}/core/overlay.ts | 0 .../core/overlay/overlay-option-panel.ts | 0 .../overlay/overlay-trigger-attributes.ts | 0 .../core/overlay/overlay.ts | 0 .../core/overlay/position.spec.ts | 0 .../core/overlay/position.ts | 0 .../core/styles/_index.scss | 0 .../core/styles/a11y.scss | 0 .../core/styles/animation.scss | 0 .../core/styles/core.scss | 0 .../core/styles/core/functions.scss | 0 .../core/styles/core/mediaqueries.scss | 0 .../styles/font-characters-extension.scss | 0 .../core/styles/layout.scss | 0 .../core/styles/lists.scss | 0 .../core/styles/mixins/a11y.scss | 0 .../core/styles/mixins/animation.scss | 0 .../core/styles/mixins/badge.scss | 0 .../core/styles/mixins/buttons.scss | 0 .../core/styles/mixins/card.scss | 0 .../core/styles/mixins/chip.scss | 0 .../core/styles/mixins/dev_and_debug.scss | 0 .../core/styles/mixins/font-face.scss | 0 .../core/styles/mixins/helpers.scss | 0 .../core/styles/mixins/inputs.scss | 0 .../core/styles/mixins/layout.scss | 0 .../core/styles/mixins/link.scss | 0 .../core/styles/mixins/lists.scss | 0 .../core/styles/mixins/overlay.scss | 0 .../core/styles/mixins/panel.scss | 0 .../styles/mixins/pearl-chain-bullet.scss | 0 .../core/styles/mixins/scrollbar.scss | 0 .../core/styles/mixins/shadows.scss | 0 .../core/styles/mixins/typo.scss | 0 .../core/styles/normalize.scss | 0 .../core/styles/standard-theme.scss | 0 .../core/styles/typography.scss | 0 src/{components => elements}/core/testing.ts | 0 .../core/testing/event-spy.ts | 0 .../core/testing/mocha-extensions.ts | 0 .../core/testing/private.ts | 0 .../testing/private/a11y-tree-snapshot.ts | 0 .../core/testing/private/describe-each.ts | 0 .../testing/private/describe-viewports.ts | 0 .../core/testing/private/dispatch-events.ts | 0 .../core/testing/private/event-objects.ts | 0 .../core/testing/private/fixture.ts | 2 +- .../core/testing/private/platform.ts | 0 .../core/testing/private/type-in-element.ts | 0 .../private/visual-regression-snapshot.ts | 0 .../core/testing/scroll.ts | 0 .../core/testing/test-setup-ssr.ts | 0 .../core/testing/test-setup.ts | 0 .../core/testing/wait-for-condition.ts | 0 .../core/testing/wait-for-render.ts | 0 src/{components => elements}/datepicker.ts | 0 .../datepicker/common.ts | 0 .../datepicker/common/datepicker-button.ts | 0 .../datepicker/datepicker-next-day.ts | 0 .../datepicker-next-day.spec.snap.js | 0 .../datepicker-next-day.e2e.ts | 0 .../datepicker-next-day.scss | 0 .../datepicker-next-day.spec.ts | 0 .../datepicker-next-day.stories.ts | 2 +- .../datepicker-next-day.ts | 0 .../datepicker/datepicker-next-day/readme.md | 4 +- .../datepicker/datepicker-previous-day.ts | 0 .../datepicker-previous-day.spec.snap.js | 0 .../datepicker-previous-day.e2e.ts | 0 .../datepicker-previous-day.scss | 0 .../datepicker-previous-day.spec.ts | 0 .../datepicker-previous-day.stories.ts | 2 +- .../datepicker-previous-day.ts | 0 .../datepicker-previous-day/readme.md | 4 +- .../datepicker/datepicker-toggle.ts | 0 .../datepicker-toggle.spec.snap.js | 0 .../datepicker-toggle.e2e.ts | 0 .../datepicker-toggle/datepicker-toggle.scss | 0 .../datepicker-toggle.spec.ts | 0 .../datepicker-toggle.stories.ts | 2 +- .../datepicker-toggle/datepicker-toggle.ts | 0 .../datepicker/datepicker-toggle/readme.md | 6 +- .../datepicker/datepicker.ts | 0 .../__snapshots__/datepicker.spec.snap.js | 0 .../datepicker/datepicker/datepicker.e2e.ts | 0 .../datepicker/datepicker/datepicker.scss | 0 .../datepicker/datepicker/datepicker.spec.ts | 0 .../datepicker/datepicker.stories.ts | 2 +- .../datepicker/datepicker/datepicker.ts | 0 .../datepicker/datepicker/readme.md | 2 +- src/{components => elements}/dialog.ts | 0 .../dialog/dialog-actions.ts | 0 .../__snapshots__/dialog-actions.spec.snap.js | 0 .../dialog/dialog-actions/dialog-actions.scss | 0 .../dialog-actions/dialog-actions.spec.ts | 0 .../dialog-actions/dialog-actions.stories.ts | 2 +- .../dialog/dialog-actions/dialog-actions.ts | 0 .../dialog/dialog-actions/readme.md | 2 +- .../dialog/dialog-content.ts | 0 .../dialog/dialog-content/dialog-content.scss | 0 .../dialog-content/dialog-content.spec.ts | 0 .../dialog-content/dialog-content.stories.ts | 2 +- .../dialog/dialog-content/dialog-content.ts | 0 .../dialog/dialog-content/readme.md | 2 +- .../dialog/dialog-title.ts | 0 .../__snapshots__/dialog-title.spec.snap.js | 0 .../dialog/dialog-title/dialog-title.e2e.ts | 0 .../dialog/dialog-title/dialog-title.scss | 0 .../dialog/dialog-title/dialog-title.spec.ts | 0 .../dialog-title/dialog-title.stories.ts | 2 +- .../dialog/dialog-title/dialog-title.ts | 0 .../dialog/dialog-title/readme.md | 2 +- src/{components => elements}/dialog/dialog.ts | 0 .../dialog/__snapshots__/dialog.spec.snap.js | 0 .../dialog/dialog/dialog.e2e.ts | 0 .../dialog/dialog/dialog.scss | 0 .../dialog/dialog/dialog.spec.ts | 0 .../dialog/dialog/dialog.stories.ts | 2 +- .../dialog/dialog/dialog.ts | 0 .../dialog/dialog/readme.md | 4 +- src/{components => elements}/divider.ts | 0 .../__snapshots__/divider.spec.snap.js | 0 .../divider/divider.e2e.ts | 0 .../divider/divider.scss | 0 .../divider/divider.spec.ts | 0 .../divider/divider.stories.ts | 2 +- .../divider/divider.ts | 0 .../divider/readme.md | 0 .../expansion-panel.ts | 0 .../expansion-panel-content.ts | 0 .../expansion-panel-content.spec.snap.js | 0 .../expansion-panel-content.e2e.ts | 0 .../expansion-panel-content.scss | 0 .../expansion-panel-content.spec.ts | 0 .../expansion-panel-content.stories.ts | 2 +- .../expansion-panel-content.ts | 0 .../expansion-panel-content/readme.md | 2 +- .../expansion-panel/expansion-panel-header.ts | 0 .../expansion-panel-header.spec.snap.js | 0 .../expansion-panel-header.e2e.ts | 0 .../expansion-panel-header.scss | 0 .../expansion-panel-header.spec.ts | 0 .../expansion-panel-header.stories.ts | 2 +- .../expansion-panel-header.ts | 0 .../expansion-panel-header/readme.md | 2 +- .../expansion-panel/expansion-panel.ts | 0 .../expansion-panel.spec.snap.js | 0 .../expansion-panel/expansion-panel.e2e.ts | 0 .../expansion-panel/expansion-panel.scss | 0 .../expansion-panel/expansion-panel.spec.ts | 0 .../expansion-panel.stories.ts | 2 +- .../expansion-panel/expansion-panel.ts | 0 .../expansion-panel/expansion-panel/readme.md | 6 +- src/{components => elements}/file-selector.ts | 0 .../__snapshots__/file-selector.spec.snap.js | 0 .../file-selector/file-selector.e2e.ts | 0 .../file-selector/file-selector.scss | 0 .../file-selector/file-selector.spec.ts | 0 .../file-selector/file-selector.stories.ts | 2 +- .../file-selector/file-selector.ts | 0 .../file-selector/readme.md | 0 src/{components => elements}/footer.ts | 0 .../footer/__snapshots__/footer.spec.snap.js | 0 .../footer/footer.e2e.ts | 0 .../footer/footer.scss | 0 .../footer/footer.spec.ts | 0 .../footer/footer.stories.ts | 2 +- src/{components => elements}/footer/footer.ts | 0 src/{components => elements}/footer/readme.md | 2 +- src/{components => elements}/form-error.ts | 0 .../__snapshots__/form-error.spec.snap.js | 0 .../form-error/form-error.e2e.ts | 0 .../form-error/form-error.scss | 0 .../form-error/form-error.spec.ts | 0 .../form-error/form-error.stories.ts | 2 +- .../form-error/form-error.ts | 0 .../form-error/readme.md | 6 +- src/{components => elements}/form-field.ts | 0 .../form-field/form-field-clear.ts | 0 .../form-field-clear.spec.snap.js | 0 .../form-field-clear/form-field-clear.e2e.ts | 0 .../form-field-clear/form-field-clear.scss | 0 .../form-field-clear/form-field-clear.spec.ts | 0 .../form-field-clear.stories.ts | 2 +- .../form-field-clear/form-field-clear.ts | 0 .../form-field/form-field-clear/readme.md | 2 +- .../form-field/form-field.ts | 0 .../__snapshots__/form-field.spec.snap.js | 0 .../form-field/form-field/form-field.e2e.ts | 0 .../form-field/form-field/form-field.scss | 0 .../form-field/form-field/form-field.spec.ts | 0 .../form-field/form-field.stories.ts | 2 +- .../form-field/form-field/form-field.ts | 0 .../form-field/form-field/readme.md | 18 +++--- src/{components => elements}/header.ts | 0 src/{components => elements}/header/common.ts | 0 .../header/common/header-action-common.ts | 0 .../header/common/header-action.scss | 0 .../header/header-button.ts | 0 .../__snapshots__/header-button.spec.snap.js | 0 .../header/header-button/header-button.e2e.ts | 0 .../header-button/header-button.spec.ts | 0 .../header-button/header-button.stories.ts | 2 +- .../header/header-button/header-button.ts | 0 .../header/header-button/readme.md | 2 +- .../header/header-link.ts | 0 .../__snapshots__/header-link.spec.snap.js | 0 .../header/header-link/header-link.e2e.ts | 0 .../header/header-link/header-link.spec.ts | 0 .../header/header-link/header-link.stories.ts | 2 +- .../header/header-link/header-link.ts | 0 .../header/header-link/readme.md | 2 +- src/{components => elements}/header/header.ts | 0 .../header/__snapshots__/header.spec.snap.js | 0 .../header/header/header.e2e.ts | 0 .../header/header/header.scss | 0 .../header/header/header.spec.ts | 0 .../header/header/header.stories.ts | 2 +- .../header/header/header.ts | 0 .../header/header/readme.md | 10 +-- src/{components => elements}/icon.ts | 0 .../icon/__snapshots__/icon.spec.snap.js | 0 .../icon/icon-base.ts | 0 .../icon/icon-name-mixin.ts | 0 .../icon/icon-request.ts | 0 .../icon/icon-validate.spec.ts | 0 .../icon/icon-validate.ts | 0 src/{components => elements}/icon/icon.e2e.ts | 0 src/{components => elements}/icon/icon.scss | 0 .../icon/icon.spec.ts | 2 +- .../icon/icon.stories.ts | 2 +- src/{components => elements}/icon/icon.ts | 0 src/{components => elements}/icon/readme.md | 0 src/{components => elements}/image.ts | 0 .../image/image.e2e.ts | 2 +- .../image/image.helper.ts | 0 src/{components => elements}/image/image.scss | 0 .../image/image.stories.ts | 2 +- src/{components => elements}/image/image.ts | 0 src/{components => elements}/image/readme.md | 0 .../journey-header.ts | 0 .../__snapshots__/journey-header.spec.snap.js | 0 .../journey-header/journey-header.e2e.ts | 0 .../journey-header/journey-header.scss | 0 .../journey-header/journey-header.spec.ts | 0 .../journey-header/journey-header.stories.ts | 2 +- .../journey-header/journey-header.ts | 0 .../journey-header/readme.md | 0 src/{components => elements}/link-list.ts | 0 .../__snapshots__/link-list.spec.snap.js | 0 .../link-list/link-list.e2e.ts | 0 .../link-list/link-list.scss | 0 .../link-list/link-list.spec.ts | 0 .../link-list/link-list.stories.ts | 2 +- .../link-list/link-list.ts | 0 .../link-list/readme.md | 4 +- src/{components => elements}/link.ts | 0 .../link/block-link-button.ts | 0 .../block-link-button.spec.snap.js | 0 .../block-link-button.spec.ts | 0 .../block-link-button.stories.ts | 2 +- .../block-link-button/block-link-button.ts | 0 .../link/block-link-button/readme.md | 0 .../link/block-link-static.ts | 0 .../block-link-static.spec.snap.js | 0 .../block-link-static.spec.ts | 0 .../block-link-static.stories.ts | 2 +- .../block-link-static/block-link-static.ts | 0 .../link/block-link-static/readme.md | 0 .../link/block-link.ts | 0 .../__snapshots__/block-link.spec.snap.js | 0 .../link/block-link/block-link.spec.ts | 0 .../link/block-link/block-link.stories.ts | 2 +- .../link/block-link/block-link.ts | 0 .../link/block-link/readme.md | 0 src/{components => elements}/link/common.ts | 0 .../link/common/block-link-common.ts | 0 .../link/common/block-link.scss | 0 .../link/common/inline-link-common.ts | 0 .../link/common/inline-link.scss | 0 .../link/common/link-common-stories.ts | 0 .../link/common/link-common.ts | 0 .../link/common/link.scss | 0 .../link/link-button.ts | 0 .../__snapshots__/link-button.spec.snap.js | 0 .../link/link-button/link-button.e2e.ts | 0 .../link/link-button/link-button.spec.ts | 0 .../link/link-button/link-button.stories.ts | 2 +- .../link/link-button/link-button.ts | 0 .../link/link-button/readme.md | 0 .../link/link-static.ts | 0 .../__snapshots__/link-static.spec.snap.js | 0 .../link/link-static/link-static.e2e.ts | 0 .../link/link-static/link-static.spec.ts | 0 .../link/link-static/link-static.stories.ts | 2 +- .../link/link-static/link-static.ts | 0 .../link/link-static/readme.md | 0 src/{components => elements}/link/link.ts | 0 .../link/link/__snapshots__/link.spec.snap.js | 0 .../link/link/link.e2e.ts | 0 .../link/link/link.spec.ts | 0 .../link/link/link.stories.ts | 2 +- .../link/link/link.ts | 0 .../link/link/readme.md | 0 .../loading-indicator.ts | 0 .../loading-indicator.spec.snap.js | 0 .../loading-indicator.e2e.ts | 0 .../loading-indicator/loading-indicator.scss | 0 .../loading-indicator.spec.ts | 0 .../loading-indicator.stories.ts | 2 +- .../loading-indicator/loading-indicator.ts | 0 .../loading-indicator/readme.md | 0 src/{components => elements}/logo.ts | 0 src/{components => elements}/logo/logo.scss | 0 .../logo/logo.stories.ts | 2 +- src/{components => elements}/logo/logo.ts | 0 src/{components => elements}/logo/readme.md | 0 src/{components => elements}/map-container.ts | 0 .../__snapshots__/map-container.spec.snap.js | 0 .../map-container/map-container.e2e.ts | 0 .../map-container/map-container.scss | 0 .../map-container/map-container.spec.ts | 0 .../map-container/map-container.stories.ts | 2 +- .../map-container/map-container.ts | 0 .../map-container/readme.md | 0 src/{components => elements}/menu.ts | 0 src/{components => elements}/menu/common.ts | 0 .../menu/common/menu-action-common.ts | 0 .../menu/common/menu-action.scss | 0 .../menu/menu-button.ts | 0 .../menu/menu-button/menu-button.e2e.ts | 0 .../menu/menu-button/menu-button.spec.ts | 0 .../menu/menu-button/menu-button.stories.ts | 2 +- .../menu/menu-button/menu-button.ts | 0 .../menu/menu-button/readme.md | 2 +- .../menu/menu-link.ts | 0 .../menu/menu-link/menu-link.e2e.ts | 0 .../menu/menu-link/menu-link.spec.ts | 0 .../menu/menu-link/menu-link.stories.ts | 2 +- .../menu/menu-link/menu-link.ts | 0 .../menu/menu-link/readme.md | 2 +- src/{components => elements}/menu/menu.ts | 0 .../menu/menu/__snapshots__/menu.spec.snap.js | 0 .../menu/menu/menu.e2e.ts | 0 .../menu/menu/menu.scss | 0 .../menu/menu/menu.spec.ts | 0 .../menu/menu/menu.stories.ts | 2 +- .../menu/menu/menu.ts | 0 .../menu/menu/readme.md | 4 +- src/{components => elements}/message.ts | 0 .../__snapshots__/message.spec.snap.js | 0 .../message/message.e2e.ts | 0 .../message/message.scss | 0 .../message/message.spec.ts | 0 .../message/message.stories.ts | 2 +- .../message/message.ts | 0 .../message/readme.md | 6 +- src/{components => elements}/navigation.ts | 0 .../navigation/common.ts | 0 .../common/navigation-action-common.ts | 0 .../navigation/common/navigation-action.scss | 0 .../navigation/navigation-button.ts | 0 .../navigation-button.spec.snap.js | 0 .../navigation-button.e2e.ts | 0 .../navigation-button.spec.ts | 0 .../navigation-button.stories.ts | 2 +- .../navigation-button/navigation-button.ts | 0 .../navigation/navigation-button/readme.md | 4 +- .../navigation/navigation-link.ts | 0 .../navigation-link.spec.snap.js | 0 .../navigation-link/navigation-link.e2e.ts | 0 .../navigation-link/navigation-link.spec.ts | 0 .../navigation-link.stories.ts | 2 +- .../navigation-link/navigation-link.ts | 0 .../navigation/navigation-link/readme.md | 4 +- .../navigation/navigation-list.ts | 0 .../navigation-list.spec.snap.js | 0 .../navigation-list/navigation-list.e2e.ts | 0 .../navigation-list/navigation-list.scss | 0 .../navigation-list/navigation-list.spec.ts | 0 .../navigation-list.stories.ts | 2 +- .../navigation-list/navigation-list.ts | 0 .../navigation/navigation-list/readme.md | 6 +- .../navigation/navigation-marker.ts | 0 .../navigation-marker.spec.snap.js | 0 .../navigation-marker.e2e.ts | 0 .../navigation-marker/navigation-marker.scss | 0 .../navigation-marker.spec.ts | 0 .../navigation-marker.stories.ts | 2 +- .../navigation-marker/navigation-marker.ts | 0 .../navigation/navigation-marker/readme.md | 6 +- .../navigation/navigation-section.ts | 0 .../navigation-section.spec.snap.js | 0 .../navigation-section.e2e.ts | 0 .../navigation-section.scss | 0 .../navigation-section.spec.ts | 0 .../navigation-section.stories.ts | 2 +- .../navigation-section/navigation-section.ts | 0 .../navigation/navigation-section/readme.md | 4 +- .../navigation/navigation.ts | 0 .../__snapshots__/navigation.spec.snap.js | 0 .../navigation/navigation/navigation.e2e.ts | 0 .../navigation/navigation/navigation.scss | 0 .../navigation/navigation/navigation.spec.ts | 0 .../navigation/navigation.stories.ts | 2 +- .../navigation/navigation/navigation.ts | 0 .../navigation/navigation/readme.md | 6 +- src/{components => elements}/notification.ts | 0 .../__snapshots__/notification.spec.snap.js | 0 .../notification/notification.e2e.ts | 0 .../notification/notification.scss | 0 .../notification/notification.spec.ts | 0 .../notification/notification.stories.ts | 2 +- .../notification/notification.ts | 0 .../notification/readme.md | 0 src/{components => elements}/option.ts | 0 .../option/optgroup.ts | 0 .../__snapshots__/optgroup.spec.snap.js | 0 .../option/optgroup/optgroup.e2e.ts | 0 .../option/optgroup/optgroup.scss | 0 .../option/optgroup/optgroup.spec.ts | 0 .../option/optgroup/optgroup.stories.ts | 2 +- .../option/optgroup/optgroup.ts | 0 .../option/optgroup/readme.md | 8 +-- src/{components => elements}/option/option.ts | 0 .../option/__snapshots__/option.spec.snap.js | 0 .../option/option/option.e2e.ts | 0 .../option/option/option.scss | 0 .../option/option/option.spec.ts | 0 .../option/option/option.stories.ts | 2 +- .../option/option/option.ts | 0 .../option/option/readme.md | 2 +- src/{components => elements}/overlay.ts | 0 .../__snapshots__/overlay.spec.snap.js | 0 .../overlay/overlay.e2e.ts | 0 .../overlay/overlay.scss | 0 .../overlay/overlay.spec.ts | 0 .../overlay/overlay.stories.ts | 2 +- .../overlay/overlay.ts | 0 .../overlay/readme.md | 2 +- src/{components => elements}/package.json | 2 +- src/{components => elements}/popover.ts | 0 .../popover/popover-trigger.ts | 0 .../popover-trigger.spec.snap.js | 0 .../popover-trigger/popover-trigger.e2e.ts | 0 .../popover-trigger/popover-trigger.scss | 0 .../popover-trigger/popover-trigger.spec.ts | 0 .../popover-trigger.stories.ts | 2 +- .../popover-trigger/popover-trigger.ts | 0 .../popover/popover-trigger/readme.md | 2 +- .../popover/popover.ts | 0 .../__snapshots__/popover.spec.snap.js | 0 .../popover/popover/popover.e2e.ts | 0 .../popover/popover/popover.scss | 0 .../popover/popover/popover.spec.ts | 0 .../popover/popover/popover.stories.ts | 2 +- .../popover/popover/popover.ts | 0 .../popover/popover/readme.md | 2 +- src/{components => elements}/radio-button.ts | 0 .../radio-button/radio-button-group.ts | 0 .../radio-button-group.spec.snap.js | 0 .../radio-button-group.e2e.ts | 0 .../radio-button-group.scss | 0 .../radio-button-group.spec.ts | 0 .../radio-button-group.stories.ts | 2 +- .../radio-button-group/radio-button-group.ts | 0 .../radio-button/radio-button-group/readme.md | 4 +- .../radio-button/radio-button.ts | 0 .../__snapshots__/radio-button.spec.snap.js | 0 .../radio-button/radio-button.e2e.ts | 0 .../radio-button/radio-button.scss | 0 .../radio-button/radio-button.spec.ts | 0 .../radio-button/radio-button.stories.ts | 2 +- .../radio-button/radio-button/radio-button.ts | 0 .../radio-button/radio-button/readme.md | 6 +- .../screen-reader-only.ts | 0 .../screen-reader-only.spec.snap.js | 0 .../screen-reader-only/readme.md | 0 .../screen-reader-only.e2e.ts | 0 .../screen-reader-only.scss | 0 .../screen-reader-only.spec.ts | 0 .../screen-reader-only.stories.ts | 0 .../screen-reader-only/screen-reader-only.ts | 0 src/{components => elements}/select.ts | 0 .../select/__snapshots__/select.spec.snap.js | 0 src/{components => elements}/select/readme.md | 4 +- .../select/select.e2e.ts | 0 .../select/select.scss | 0 .../select/select.spec.ts | 0 .../select/select.stories.ts | 2 +- src/{components => elements}/select/select.ts | 0 .../selection-panel.ts | 0 .../selection-panel.spec.snap.js | 0 .../selection-panel/readme.md | 8 +-- .../selection-panel/selection-panel.e2e.ts | 0 .../selection-panel/selection-panel.scss | 0 .../selection-panel/selection-panel.spec.ts | 0 .../selection-panel.stories.ts | 2 +- .../selection-panel/selection-panel.ts | 0 src/{components => elements}/signet.ts | 0 src/{components => elements}/signet/readme.md | 0 .../signet/signet.scss | 0 .../signet/signet.stories.ts | 2 +- src/{components => elements}/signet/signet.ts | 0 src/{components => elements}/skiplink-list.ts | 0 .../__snapshots__/skiplink-list.spec.snap.js | 0 .../skiplink-list/readme.md | 2 +- .../skiplink-list/skiplink-list.e2e.ts | 0 .../skiplink-list/skiplink-list.scss | 0 .../skiplink-list/skiplink-list.spec.ts | 0 .../skiplink-list/skiplink-list.stories.ts | 2 +- .../skiplink-list/skiplink-list.ts | 0 src/{components => elements}/slider.ts | 0 .../slider/__snapshots__/slider.spec.snap.js | 0 src/{components => elements}/slider/readme.md | 0 .../slider/slider.e2e.ts | 0 .../slider/slider.scss | 0 .../slider/slider.spec.ts | 0 .../slider/slider.stories.ts | 2 +- src/{components => elements}/slider/slider.ts | 0 src/{components => elements}/status.ts | 0 .../status/__snapshots__/status.spec.snap.js | 0 src/{components => elements}/status/readme.md | 0 .../status/status.e2e.ts | 0 .../status/status.scss | 0 .../status/status.spec.ts | 0 .../status/status.stories.ts | 2 +- src/{components => elements}/status/status.ts | 0 src/{components => elements}/tabs.ts | 0 .../tabs/tab-group.ts | 0 .../__snapshots__/tab-group.spec.snap.js | 0 .../tabs/tab-group/readme.md | 2 +- .../tabs/tab-group/tab-group.e2e.ts | 0 .../tabs/tab-group/tab-group.scss | 0 .../tabs/tab-group/tab-group.spec.ts | 0 .../tabs/tab-group/tab-group.stories.ts | 2 +- .../tabs/tab-group/tab-group.ts | 0 .../tabs/tab-title.ts | 0 .../__snapshots__/tab-title.spec.snap.js | 0 .../tabs/tab-title/readme.md | 2 +- .../tabs/tab-title/tab-title.e2e.ts | 0 .../tabs/tab-title/tab-title.scss | 0 .../tabs/tab-title/tab-title.spec.ts | 0 .../tabs/tab-title/tab-title.stories.ts | 2 +- .../tabs/tab-title/tab-title.ts | 0 src/{components => elements}/tag.ts | 0 src/{components => elements}/tag/tag-group.ts | 0 .../__snapshots__/tag-group.spec.snap.js | 0 .../tag/tag-group/readme.md | 2 +- .../tag/tag-group/tag-group.e2e.ts | 0 .../tag/tag-group/tag-group.scss | 0 .../tag/tag-group/tag-group.spec.ts | 0 .../tag/tag-group/tag-group.stories.ts | 2 +- .../tag/tag-group/tag-group.ts | 0 src/{components => elements}/tag/tag.ts | 0 .../tag/tag/__snapshots__/tag.spec.snap.js | 0 .../tag/tag/readme.md | 2 +- .../tag/tag/tag.e2e.ts | 0 src/{components => elements}/tag/tag/tag.scss | 0 .../tag/tag/tag.spec.ts | 0 .../tag/tag/tag.stories.ts | 2 +- src/{components => elements}/tag/tag/tag.ts | 0 src/{components => elements}/teaser-hero.ts | 0 .../__snapshots__/teaser-hero.spec.snap.js | 0 .../teaser-hero/readme.md | 0 .../teaser-hero/teaser-hero.e2e.ts | 0 .../teaser-hero/teaser-hero.scss | 0 .../teaser-hero/teaser-hero.spec.ts | 0 .../teaser-hero/teaser-hero.stories.ts | 2 +- .../teaser-hero/teaser-hero.ts | 0 src/{components => elements}/teaser-paid.ts | 0 .../__snapshots__/teaser-paid.spec.snap.js | 0 .../teaser-paid/readme.md | 0 .../teaser-paid/teaser-paid.e2e.ts | 0 .../teaser-paid/teaser-paid.scss | 0 .../teaser-paid/teaser-paid.spec.ts | 0 .../teaser-paid/teaser-paid.stories.ts | 2 +- .../teaser-paid/teaser-paid.ts | 0 src/{components => elements}/teaser.ts | 0 .../teaser/__snapshots__/teaser.spec.snap.js | 0 .../teaser/assets/placeholder.png | Bin src/{components => elements}/teaser/readme.md | 2 +- .../teaser/teaser.e2e.ts | 0 .../teaser/teaser.scss | 0 .../teaser/teaser.spec.ts | 0 .../teaser/teaser.stories.ts | 2 +- src/{components => elements}/teaser/teaser.ts | 0 src/{components => elements}/time-input.ts | 0 .../__snapshots__/time-input.spec.snap.js | 0 .../time-input/readme.md | 0 .../time-input/time-input.e2e.ts | 0 .../time-input/time-input.scss | 0 .../time-input/time-input.spec.ts | 0 .../time-input/time-input.stories.ts | 2 +- .../time-input/time-input.ts | 0 .../timetable-occupancy-icon.ts | 0 .../timetable-occupancy-icon.spec.snap.js | 0 .../timetable-occupancy-icon/readme.md | 0 .../timetable-occupancy-icon.e2e.ts | 0 .../timetable-occupancy-icon.scss | 0 .../timetable-occupancy-icon.spec.ts | 0 .../timetable-occupancy-icon.stories.ts | 2 +- .../timetable-occupancy-icon.ts | 0 .../timetable-occupancy.ts | 0 .../timetable-occupancy.spec.snap.js | 0 .../timetable-occupancy/readme.md | 0 .../timetable-occupancy.e2e.ts | 0 .../timetable-occupancy.scss | 0 .../timetable-occupancy.spec.ts | 0 .../timetable-occupancy.stories.ts | 2 +- .../timetable-occupancy.ts | 0 src/{components => elements}/title.ts | 0 .../title/__snapshots__/title.spec.snap.js | 0 src/{components => elements}/title/readme.md | 0 .../title/title-base.ts | 0 .../title/title-common.scss | 0 .../title/title.e2e.ts | 0 src/{components => elements}/title/title.scss | 0 .../title/title.spec.ts | 0 .../title/title.stories.ts | 2 +- src/{components => elements}/title/title.ts | 0 src/{components => elements}/toast.ts | 0 .../toast/__snapshots__/toast.spec.snap.js | 0 src/{components => elements}/toast/readme.md | 0 .../toast/toast.e2e.ts | 0 src/{components => elements}/toast/toast.scss | 0 .../toast/toast.spec.ts | 0 .../toast/toast.stories.ts | 2 +- src/{components => elements}/toast/toast.ts | 0 src/{components => elements}/toggle-check.ts | 0 .../__snapshots__/toggle-check.spec.snap.js | 0 .../toggle-check/readme.md | 0 .../toggle-check/toggle-check.e2e.ts | 0 .../toggle-check/toggle-check.scss | 0 .../toggle-check/toggle-check.spec.ts | 0 .../toggle-check/toggle-check.stories.ts | 2 +- .../toggle-check/toggle-check.ts | 0 src/{components => elements}/toggle.ts | 0 .../toggle/toggle-option.ts | 0 .../__snapshots__/toggle-option.spec.snap.js | 0 .../toggle/toggle-option/readme.md | 2 +- .../toggle/toggle-option/toggle-option.e2e.ts | 0 .../toggle/toggle-option/toggle-option.scss | 0 .../toggle-option/toggle-option.spec.ts | 0 .../toggle-option/toggle-option.stories.ts | 2 +- .../toggle/toggle-option/toggle-option.ts | 0 src/{components => elements}/toggle/toggle.ts | 0 .../toggle/__snapshots__/toggle.spec.snap.js | 0 .../toggle/toggle/readme.md | 6 +- .../toggle/toggle/toggle.e2e.ts | 0 .../toggle/toggle/toggle.scss | 0 .../toggle/toggle/toggle.spec.ts | 0 .../toggle/toggle/toggle.stories.ts | 2 +- .../toggle/toggle/toggle.ts | 0 src/{components => elements}/train.ts | 0 .../train/train-blocked-passage.ts | 0 .../train/train-blocked-passage/readme.md | 0 .../train-blocked-passage.e2e.ts | 0 .../train-blocked-passage.scss | 0 .../train-blocked-passage.spec.ts | 0 .../train-blocked-passage.stories.ts | 2 +- .../train-blocked-passage.ts | 0 .../train/train-formation.ts | 0 .../train-formation.spec.snap.js | 0 .../train/train-formation/readme.md | 0 .../train-formation/train-formation.e2e.ts | 0 .../train-formation/train-formation.scss | 0 .../train-formation/train-formation.spec.ts | 0 .../train-formation.stories.ts | 2 +- .../train/train-formation/train-formation.ts | 0 .../train/train-wagon.ts | 0 .../__snapshots__/train-wagon.spec.snap.js | 0 .../train/train-wagon/readme.md | 0 .../train/train-wagon/train-wagon.e2e.ts | 0 .../train/train-wagon/train-wagon.scss | 0 .../train/train-wagon/train-wagon.spec.ts | 0 .../train/train-wagon/train-wagon.stories.ts | 2 +- .../train/train-wagon/train-wagon.ts | 0 src/{components => elements}/train/train.ts | 0 .../train/__snapshots__/train.spec.snap.js | 0 .../train/train/readme.md | 0 .../train/train/train.e2e.ts | 0 .../train/train/train.scss | 0 .../train/train/train.spec.ts | 0 .../train/train/train.stories.ts | 2 +- .../train/train/train.ts | 0 src/{components => elements}/tsconfig.json | 2 +- .../tsconfig.spec.json | 0 .../visual-checkbox.ts | 0 .../visual-checkbox.spec.snap.js | 0 .../visual-checkbox/readme.md | 6 +- .../visual-checkbox/visual-checkbox.e2e.ts | 0 .../visual-checkbox/visual-checkbox.scss | 0 .../visual-checkbox/visual-checkbox.spec.ts | 0 .../visual-checkbox.stories.ts | 0 .../visual-checkbox/visual-checkbox.ts | 0 src/{components => elements}/vite.config.ts | 3 +- src/react/experimental-vite.config.ts | 2 +- src/react/experimental.package.json | 2 +- src/react/package.json | 2 +- src/react/tsconfig.json | 4 +- src/react/vite.config.ts | 4 +- .../pages/home/home--logged-in.stories.ts | 7 +-- src/storybook/pages/home/home.common.ts | 30 ++++----- src/storybook/pages/home/home.scss | 2 +- src/storybook/pages/home/home.stories.ts | 4 +- src/storybook/styles/layout/layout.scss | 2 +- src/storybook/styles/layout/layout.stories.ts | 2 +- src/storybook/styles/layout/readme.md | 4 +- src/storybook/styles/list/list.stories.ts | 2 +- .../styles/scrollbar/scrollbar-internal.scss | 2 +- .../styles/typography/typo-internal.scss | 2 +- .../styles/typography/typography.stories.ts | 2 +- src/storybook/testing/chromatic.ts | 2 +- .../boilerplate/component.spec.ts | 2 +- .../boilerplate/component.stories.ts | 2 +- tools/generate-component/index.mts | 4 +- ...ponents-custom-elements-manifest.config.js | 2 +- .../custom-elements-manifest.config.js | 6 +- tools/vite/generate-react-wrappers.ts | 2 +- tsconfig.json | 4 +- vite.config.ts | 2 +- web-test-runner.config.js | 4 +- 1082 files changed, 392 insertions(+), 394 deletions(-) rename src/{components => elements}/_index.scss (100%) rename src/{components => elements}/accordion.ts (100%) rename src/{components => elements}/accordion/__snapshots__/accordion.spec.snap.js (100%) rename src/{components => elements}/accordion/accordion.e2e.ts (100%) rename src/{components => elements}/accordion/accordion.scss (100%) rename src/{components => elements}/accordion/accordion.spec.ts (100%) rename src/{components => elements}/accordion/accordion.stories.ts (99%) rename src/{components => elements}/accordion/accordion.ts (100%) rename src/{components => elements}/accordion/readme.md (96%) rename src/{components => elements}/action-group.ts (100%) rename src/{components => elements}/action-group/__snapshots__/action-group.spec.snap.js (100%) rename src/{components => elements}/action-group/action-group.e2e.ts (100%) rename src/{components => elements}/action-group/action-group.scss (100%) rename src/{components => elements}/action-group/action-group.spec.ts (100%) rename src/{components => elements}/action-group/action-group.stories.ts (99%) rename src/{components => elements}/action-group/action-group.ts (100%) rename src/{components => elements}/action-group/readme.md (97%) rename src/{components => elements}/alert.ts (100%) rename src/{components => elements}/alert/alert-group.ts (100%) rename src/{components => elements}/alert/alert-group/__snapshots__/alert-group.spec.snap.js (100%) rename src/{components => elements}/alert/alert-group/alert-group.e2e.ts (100%) rename src/{components => elements}/alert/alert-group/alert-group.scss (100%) rename src/{components => elements}/alert/alert-group/alert-group.spec.ts (100%) rename src/{components => elements}/alert/alert-group/alert-group.stories.ts (97%) rename src/{components => elements}/alert/alert-group/alert-group.ts (100%) rename src/{components => elements}/alert/alert-group/readme.md (97%) rename src/{components => elements}/alert/alert.ts (100%) rename src/{components => elements}/alert/alert/__snapshots__/alert.spec.snap.js (100%) rename src/{components => elements}/alert/alert/alert.e2e.ts (100%) rename src/{components => elements}/alert/alert/alert.scss (100%) rename src/{components => elements}/alert/alert/alert.spec.ts (100%) rename src/{components => elements}/alert/alert/alert.stories.ts (99%) rename src/{components => elements}/alert/alert/alert.ts (100%) rename src/{components => elements}/alert/alert/readme.md (98%) rename src/{components => elements}/autocomplete.ts (100%) rename src/{components => elements}/autocomplete/__snapshots__/autocomplete.spec.snap.js (100%) rename src/{components => elements}/autocomplete/autocomplete.e2e.ts (100%) rename src/{components => elements}/autocomplete/autocomplete.scss (100%) rename src/{components => elements}/autocomplete/autocomplete.spec.ts (100%) rename src/{components => elements}/autocomplete/autocomplete.stories.ts (99%) rename src/{components => elements}/autocomplete/autocomplete.ts (100%) rename src/{components => elements}/autocomplete/readme.md (97%) rename src/{components => elements}/breadcrumb.ts (100%) rename src/{components => elements}/breadcrumb/breadcrumb-group.ts (100%) rename src/{components => elements}/breadcrumb/breadcrumb-group/__snapshots__/breadcrumb-group.spec.snap.js (100%) rename src/{components => elements}/breadcrumb/breadcrumb-group/breadcrumb-group.e2e.ts (100%) rename src/{components => elements}/breadcrumb/breadcrumb-group/breadcrumb-group.scss (100%) rename src/{components => elements}/breadcrumb/breadcrumb-group/breadcrumb-group.spec.ts (100%) rename src/{components => elements}/breadcrumb/breadcrumb-group/breadcrumb-group.stories.ts (98%) rename src/{components => elements}/breadcrumb/breadcrumb-group/breadcrumb-group.ts (100%) rename src/{components => elements}/breadcrumb/breadcrumb-group/readme.md (94%) rename src/{components => elements}/breadcrumb/breadcrumb.ts (100%) rename src/{components => elements}/breadcrumb/breadcrumb/__snapshots__/breadcrumb.spec.snap.js (100%) rename src/{components => elements}/breadcrumb/breadcrumb/breadcrumb.e2e.ts (100%) rename src/{components => elements}/breadcrumb/breadcrumb/breadcrumb.scss (100%) rename src/{components => elements}/breadcrumb/breadcrumb/breadcrumb.spec.ts (100%) rename src/{components => elements}/breadcrumb/breadcrumb/breadcrumb.stories.ts (98%) rename src/{components => elements}/breadcrumb/breadcrumb/breadcrumb.ts (100%) rename src/{components => elements}/breadcrumb/breadcrumb/readme.md (96%) rename src/{components => elements}/button.ts (100%) rename src/{components => elements}/button/button-link.ts (100%) rename src/{components => elements}/button/button-link/__snapshots__/button-link.spec.snap.js (100%) rename src/{components => elements}/button/button-link/button-link.e2e.ts (100%) rename src/{components => elements}/button/button-link/button-link.spec.ts (100%) rename src/{components => elements}/button/button-link/button-link.stories.ts (97%) rename src/{components => elements}/button/button-link/button-link.ts (100%) rename src/{components => elements}/button/button-link/readme.md (100%) rename src/{components => elements}/button/button-static.ts (100%) rename src/{components => elements}/button/button-static/__snapshots__/button-static.spec.snap.js (100%) rename src/{components => elements}/button/button-static/button-static.e2e.ts (100%) rename src/{components => elements}/button/button-static/button-static.spec.ts (100%) rename src/{components => elements}/button/button-static/button-static.stories.ts (97%) rename src/{components => elements}/button/button-static/button-static.ts (100%) rename src/{components => elements}/button/button-static/readme.md (100%) rename src/{components => elements}/button/button.ts (100%) rename src/{components => elements}/button/button/__snapshots__/button.spec.snap.js (100%) rename src/{components => elements}/button/button/button.e2e.ts (100%) rename src/{components => elements}/button/button/button.snapshot.spec.ts (100%) rename src/{components => elements}/button/button/button.spec.ts (100%) rename src/{components => elements}/button/button/button.stories.ts (97%) rename src/{components => elements}/button/button/button.ts (100%) rename src/{components => elements}/button/button/readme.md (100%) rename src/{components => elements}/button/common.ts (100%) rename src/{components => elements}/button/common/button-common-stories.ts (100%) rename src/{components => elements}/button/common/button-common.scss (100%) rename src/{components => elements}/button/common/button-common.ts (100%) rename src/{components => elements}/button/common/button-link-common-stories.ts (100%) rename src/{components => elements}/button/common/button-test-utils.ts (100%) rename src/{components => elements}/button/common/common-stories.ts (100%) rename src/{components => elements}/button/common/primary-button.scss (100%) rename src/{components => elements}/button/common/secondary-button.scss (100%) rename src/{components => elements}/button/common/tertiary-button.scss (100%) rename src/{components => elements}/button/common/transparent-button.scss (100%) rename src/{components => elements}/button/mini-button.ts (100%) rename src/{components => elements}/button/mini-button/mini-button.scss (100%) rename src/{components => elements}/button/mini-button/mini-button.stories.ts (98%) rename src/{components => elements}/button/mini-button/mini-button.ts (100%) rename src/{components => elements}/button/mini-button/readme.md (98%) rename src/{components => elements}/button/secondary-button-link.ts (100%) rename src/{components => elements}/button/secondary-button-link/__snapshots__/secondary-button-link.spec.snap.js (100%) rename src/{components => elements}/button/secondary-button-link/readme.md (100%) rename src/{components => elements}/button/secondary-button-link/secondary-button-link.spec.ts (100%) rename src/{components => elements}/button/secondary-button-link/secondary-button-link.stories.ts (97%) rename src/{components => elements}/button/secondary-button-link/secondary-button-link.ts (100%) rename src/{components => elements}/button/secondary-button-static.ts (100%) rename src/{components => elements}/button/secondary-button-static/__snapshots__/secondary-button-static.spec.snap.js (100%) rename src/{components => elements}/button/secondary-button-static/readme.md (100%) rename src/{components => elements}/button/secondary-button-static/secondary-button-static.spec.ts (100%) rename src/{components => elements}/button/secondary-button-static/secondary-button-static.stories.ts (97%) rename src/{components => elements}/button/secondary-button-static/secondary-button-static.ts (100%) rename src/{components => elements}/button/secondary-button.ts (100%) rename src/{components => elements}/button/secondary-button/__snapshots__/secondary-button.spec.snap.js (100%) rename src/{components => elements}/button/secondary-button/readme.md (100%) rename src/{components => elements}/button/secondary-button/secondary-button.spec.ts (100%) rename src/{components => elements}/button/secondary-button/secondary-button.stories.ts (97%) rename src/{components => elements}/button/secondary-button/secondary-button.ts (100%) rename src/{components => elements}/button/tertiary-button-link.ts (100%) rename src/{components => elements}/button/tertiary-button-link/__snapshots__/tertiary-button-link.spec.snap.js (100%) rename src/{components => elements}/button/tertiary-button-link/readme.md (100%) rename src/{components => elements}/button/tertiary-button-link/tertiary-button-link.spec.ts (100%) rename src/{components => elements}/button/tertiary-button-link/tertiary-button-link.stories.ts (97%) rename src/{components => elements}/button/tertiary-button-link/tertiary-button-link.ts (100%) rename src/{components => elements}/button/tertiary-button-static.ts (100%) rename src/{components => elements}/button/tertiary-button-static/__snapshots__/tertiary-button-static.spec.snap.js (100%) rename src/{components => elements}/button/tertiary-button-static/readme.md (100%) rename src/{components => elements}/button/tertiary-button-static/tertiary-button-static.spec.ts (100%) rename src/{components => elements}/button/tertiary-button-static/tertiary-button-static.stories.ts (97%) rename src/{components => elements}/button/tertiary-button-static/tertiary-button-static.ts (100%) rename src/{components => elements}/button/tertiary-button.ts (100%) rename src/{components => elements}/button/tertiary-button/__snapshots__/tertiary-button.spec.snap.js (100%) rename src/{components => elements}/button/tertiary-button/readme.md (100%) rename src/{components => elements}/button/tertiary-button/tertiary-button.spec.ts (100%) rename src/{components => elements}/button/tertiary-button/tertiary-button.stories.ts (97%) rename src/{components => elements}/button/tertiary-button/tertiary-button.ts (100%) rename src/{components => elements}/button/transparent-button-link.ts (100%) rename src/{components => elements}/button/transparent-button-link/__snapshots__/transparent-button-link.spec.snap.js (100%) rename src/{components => elements}/button/transparent-button-link/readme.md (100%) rename src/{components => elements}/button/transparent-button-link/transparent-button-link.spec.ts (100%) rename src/{components => elements}/button/transparent-button-link/transparent-button-link.stories.ts (97%) rename src/{components => elements}/button/transparent-button-link/transparent-button-link.ts (100%) rename src/{components => elements}/button/transparent-button-static.ts (100%) rename src/{components => elements}/button/transparent-button-static/__snapshots__/transparent-button-static.spec.snap.js (100%) rename src/{components => elements}/button/transparent-button-static/readme.md (100%) rename src/{components => elements}/button/transparent-button-static/transparent-button-static.spec.ts (100%) rename src/{components => elements}/button/transparent-button-static/transparent-button-static.stories.ts (97%) rename src/{components => elements}/button/transparent-button-static/transparent-button-static.ts (100%) rename src/{components => elements}/button/transparent-button.ts (100%) rename src/{components => elements}/button/transparent-button/__snapshots__/transparent-button.spec.snap.js (100%) rename src/{components => elements}/button/transparent-button/readme.md (100%) rename src/{components => elements}/button/transparent-button/transparent-button.spec.ts (100%) rename src/{components => elements}/button/transparent-button/transparent-button.stories.ts (97%) rename src/{components => elements}/button/transparent-button/transparent-button.ts (100%) rename src/{components => elements}/calendar.ts (100%) rename src/{components => elements}/calendar/__snapshots__/calendar.spec.snap.js (100%) rename src/{components => elements}/calendar/calendar.e2e.ts (100%) rename src/{components => elements}/calendar/calendar.scss (100%) rename src/{components => elements}/calendar/calendar.spec.ts (100%) rename src/{components => elements}/calendar/calendar.stories.ts (98%) rename src/{components => elements}/calendar/calendar.ts (100%) rename src/{components => elements}/calendar/readme.md (98%) rename src/{components => elements}/card.ts (100%) rename src/{components => elements}/card/card-badge.ts (100%) rename src/{components => elements}/card/card-badge/__snapshots__/card-badge.spec.snap.js (100%) rename src/{components => elements}/card/card-badge/card-badge.e2e.ts (100%) rename src/{components => elements}/card/card-badge/card-badge.scss (100%) rename src/{components => elements}/card/card-badge/card-badge.spec.ts (100%) rename src/{components => elements}/card/card-badge/card-badge.stories.ts (96%) rename src/{components => elements}/card/card-badge/card-badge.ts (100%) rename src/{components => elements}/card/card-badge/readme.md (90%) rename src/{components => elements}/card/card-button.ts (100%) rename src/{components => elements}/card/card-button/__snapshots__/card-button.e2e.snap.js (100%) rename src/{components => elements}/card/card-button/card-button.e2e.ts (100%) rename src/{components => elements}/card/card-button/card-button.stories.ts (92%) rename src/{components => elements}/card/card-button/card-button.ts (100%) rename src/{components => elements}/card/card-button/readme.md (100%) rename src/{components => elements}/card/card-link.ts (100%) rename src/{components => elements}/card/card-link/__snapshots__/card-link.e2e.snap.js (100%) rename src/{components => elements}/card/card-link/card-link.e2e.ts (100%) rename src/{components => elements}/card/card-link/card-link.stories.ts (92%) rename src/{components => elements}/card/card-link/card-link.ts (100%) rename src/{components => elements}/card/card-link/readme.md (100%) rename src/{components => elements}/card/card.ts (100%) rename src/{components => elements}/card/card/__snapshots__/card.spec.snap.js (100%) rename src/{components => elements}/card/card/card.e2e.ts (100%) rename src/{components => elements}/card/card/card.scss (100%) rename src/{components => elements}/card/card/card.spec.ts (100%) rename src/{components => elements}/card/card/card.stories.ts (99%) rename src/{components => elements}/card/card/card.ts (100%) rename src/{components => elements}/card/card/readme.md (94%) rename src/{components => elements}/card/common.ts (100%) rename src/{components => elements}/card/common/card-action-common.ts (100%) rename src/{components => elements}/card/common/card-action.scss (100%) rename src/{components => elements}/checkbox.ts (100%) rename src/{components => elements}/checkbox/checkbox-group.ts (100%) rename src/{components => elements}/checkbox/checkbox-group/__snapshots__/checkbox-group.spec.snap.js (100%) rename src/{components => elements}/checkbox/checkbox-group/checkbox-group.e2e.ts (100%) rename src/{components => elements}/checkbox/checkbox-group/checkbox-group.scss (100%) rename src/{components => elements}/checkbox/checkbox-group/checkbox-group.spec.ts (100%) rename src/{components => elements}/checkbox/checkbox-group/checkbox-group.stories.ts (99%) rename src/{components => elements}/checkbox/checkbox-group/checkbox-group.ts (100%) rename src/{components => elements}/checkbox/checkbox-group/readme.md (94%) rename src/{components => elements}/checkbox/checkbox.ts (100%) rename src/{components => elements}/checkbox/checkbox/__snapshots__/checkbox.spec.snap.js (100%) rename src/{components => elements}/checkbox/checkbox/checkbox.e2e.ts (100%) rename src/{components => elements}/checkbox/checkbox/checkbox.scss (100%) rename src/{components => elements}/checkbox/checkbox/checkbox.spec.ts (100%) rename src/{components => elements}/checkbox/checkbox/checkbox.stories.ts (99%) rename src/{components => elements}/checkbox/checkbox/checkbox.ts (100%) rename src/{components => elements}/checkbox/checkbox/readme.md (100%) rename src/{components => elements}/chip.ts (100%) rename src/{components => elements}/chip/__snapshots__/chip.spec.snap.js (100%) rename src/{components => elements}/chip/chip.e2e.ts (100%) rename src/{components => elements}/chip/chip.scss (100%) rename src/{components => elements}/chip/chip.spec.ts (100%) rename src/{components => elements}/chip/chip.stories.ts (98%) rename src/{components => elements}/chip/chip.ts (100%) rename src/{components => elements}/chip/readme.md (100%) rename src/{components => elements}/clock.ts (100%) rename src/{components => elements}/clock/__snapshots__/clock.spec.snap.js (100%) rename src/{components => elements}/clock/assets/sbb_clock_face.svg (100%) rename src/{components => elements}/clock/assets/sbb_clock_hours.svg (100%) rename src/{components => elements}/clock/assets/sbb_clock_minutes.svg (100%) rename src/{components => elements}/clock/assets/sbb_clock_seconds.svg (100%) rename src/{components => elements}/clock/clock.scss (100%) rename src/{components => elements}/clock/clock.spec.ts (100%) rename src/{components => elements}/clock/clock.stories.ts (97%) rename src/{components => elements}/clock/clock.ts (100%) rename src/{components => elements}/clock/readme.md (100%) rename src/{components => elements}/container.ts (100%) rename src/{components => elements}/container/container.ts (100%) rename src/{components => elements}/container/container/__snapshots__/container.spec.snap.js (100%) rename src/{components => elements}/container/container/container.e2e.ts (100%) rename src/{components => elements}/container/container/container.scss (100%) rename src/{components => elements}/container/container/container.spec.ts (100%) rename src/{components => elements}/container/container/container.stories.ts (98%) rename src/{components => elements}/container/container/container.ts (100%) rename src/{components => elements}/container/container/readme.md (100%) rename src/{components => elements}/container/sticky-bar.ts (100%) rename src/{components => elements}/container/sticky-bar/__snapshots__/sticky-bar.spec.snap.js (100%) rename src/{components => elements}/container/sticky-bar/readme.md (100%) rename src/{components => elements}/container/sticky-bar/sticky-bar.e2e.ts (100%) rename src/{components => elements}/container/sticky-bar/sticky-bar.scss (100%) rename src/{components => elements}/container/sticky-bar/sticky-bar.spec.ts (100%) rename src/{components => elements}/container/sticky-bar/sticky-bar.stories.ts (99%) rename src/{components => elements}/container/sticky-bar/sticky-bar.ts (100%) rename src/{components => elements}/core/a11y.ts (100%) rename src/{components => elements}/core/a11y/arrow-navigation.spec.ts (100%) rename src/{components => elements}/core/a11y/arrow-navigation.ts (100%) rename src/{components => elements}/core/a11y/fake-event-detection.ts (100%) rename src/{components => elements}/core/a11y/focus-visible-within-controller.ts (100%) rename src/{components => elements}/core/a11y/focus.spec.ts (100%) rename src/{components => elements}/core/a11y/focus.ts (100%) rename src/{components => elements}/core/a11y/input-modality-detector.ts (100%) rename src/{components => elements}/core/a11y/interactivity-checker.spec.ts (100%) rename src/{components => elements}/core/a11y/interactivity-checker.ts (100%) rename src/{components => elements}/core/base-elements.ts (100%) rename src/{components => elements}/core/base-elements/action-base-element.e2e.ts (100%) rename src/{components => elements}/core/base-elements/action-base-element.ts (100%) rename src/{components => elements}/core/base-elements/button-base-element.e2e.ts (100%) rename src/{components => elements}/core/base-elements/button-base-element.ts (100%) rename src/{components => elements}/core/base-elements/link-base-element.e2e.ts (100%) rename src/{components => elements}/core/base-elements/link-base-element.ts (100%) rename src/{components => elements}/core/config.ts (100%) rename src/{components => elements}/core/config/config.ts (100%) rename src/{components => elements}/core/controllers.ts (100%) rename src/{components => elements}/core/controllers/connected-abort-controller.ts (100%) rename src/{components => elements}/core/controllers/language-controller.spec.ts (100%) rename src/{components => elements}/core/controllers/language-controller.ts (100%) rename src/{components => elements}/core/controllers/slot-state-controller.ts (100%) rename src/{components => elements}/core/datetime.ts (100%) rename src/{components => elements}/core/datetime/data-now.ts (100%) rename src/{components => elements}/core/datetime/date-adapter.ts (100%) rename src/{components => elements}/core/datetime/date-helper.spec.ts (100%) rename src/{components => elements}/core/datetime/date-helper.ts (100%) rename src/{components => elements}/core/datetime/native-date-adapter.spec.ts (100%) rename src/{components => elements}/core/datetime/native-date-adapter.ts (100%) rename src/{components => elements}/core/decorators.ts (100%) rename src/{components => elements}/core/decorators/host-attributes.ts (100%) rename src/{components => elements}/core/dom.ts (100%) rename src/{components => elements}/core/dom/breakpoint.ts (100%) rename src/{components => elements}/core/dom/find-referenced-element.ts (100%) rename src/{components => elements}/core/dom/get-document-writing-mode.ts (100%) rename src/{components => elements}/core/dom/host-context.spec.ts (100%) rename src/{components => elements}/core/dom/host-context.ts (100%) rename src/{components => elements}/core/dom/input-element.ts (100%) rename src/{components => elements}/core/dom/platform.ts (100%) rename src/{components => elements}/core/dom/scroll.ts (100%) rename src/{components => elements}/core/dom/set-or-remove-attribute.ts (100%) rename src/{components => elements}/core/dom/ssr.ts (100%) rename src/{components => elements}/core/eventing.ts (100%) rename src/{components => elements}/core/eventing/composed-path-has-attribute.ts (100%) rename src/{components => elements}/core/eventing/event-emitter.ts (100%) rename src/{components => elements}/core/eventing/event-target.ts (100%) rename src/{components => elements}/core/eventing/form-element-handlers.ts (100%) rename src/{components => elements}/core/eventing/forward-event.ts (100%) rename src/{components => elements}/core/eventing/handler-repository.ts (100%) rename src/{components => elements}/core/eventing/is-event-prevented.ts (100%) rename src/{components => elements}/core/eventing/throttle.ts (100%) rename src/{components => elements}/core/i18n.ts (100%) rename src/{components => elements}/core/i18n/i18n.ts (100%) rename src/{components => elements}/core/images.ts (100%) rename src/{components => elements}/core/interfaces.ts (100%) rename src/{components => elements}/core/interfaces/types.ts (100%) rename src/{components => elements}/core/interfaces/validation-change.ts (100%) rename src/{components => elements}/core/mixins.ts (100%) rename src/{components => elements}/core/mixins/constructor.ts (100%) rename src/{components => elements}/core/mixins/disabled-mixin.ts (100%) rename src/{components => elements}/core/mixins/form-associated-checkbox-mixin.ts (100%) rename src/{components => elements}/core/mixins/form-associated-mixin.ts (100%) rename src/{components => elements}/core/mixins/hydration-mixin.ts (100%) rename src/{components => elements}/core/mixins/named-slot-list-mixin.ts (100%) rename src/{components => elements}/core/mixins/negative-mixin.ts (100%) rename src/{components => elements}/core/mixins/required-mixin.ts (100%) rename src/{components => elements}/core/mixins/update-scheduler-mixin.ts (100%) rename src/{components => elements}/core/observers.ts (100%) rename src/{components => elements}/core/observers/intersection-observer.ts (100%) rename src/{components => elements}/core/observers/mutation-observer.ts (100%) rename src/{components => elements}/core/observers/resize-observer.ts (100%) rename src/{components => elements}/core/overlay.ts (100%) rename src/{components => elements}/core/overlay/overlay-option-panel.ts (100%) rename src/{components => elements}/core/overlay/overlay-trigger-attributes.ts (100%) rename src/{components => elements}/core/overlay/overlay.ts (100%) rename src/{components => elements}/core/overlay/position.spec.ts (100%) rename src/{components => elements}/core/overlay/position.ts (100%) rename src/{components => elements}/core/styles/_index.scss (100%) rename src/{components => elements}/core/styles/a11y.scss (100%) rename src/{components => elements}/core/styles/animation.scss (100%) rename src/{components => elements}/core/styles/core.scss (100%) rename src/{components => elements}/core/styles/core/functions.scss (100%) rename src/{components => elements}/core/styles/core/mediaqueries.scss (100%) rename src/{components => elements}/core/styles/font-characters-extension.scss (100%) rename src/{components => elements}/core/styles/layout.scss (100%) rename src/{components => elements}/core/styles/lists.scss (100%) rename src/{components => elements}/core/styles/mixins/a11y.scss (100%) rename src/{components => elements}/core/styles/mixins/animation.scss (100%) rename src/{components => elements}/core/styles/mixins/badge.scss (100%) rename src/{components => elements}/core/styles/mixins/buttons.scss (100%) rename src/{components => elements}/core/styles/mixins/card.scss (100%) rename src/{components => elements}/core/styles/mixins/chip.scss (100%) rename src/{components => elements}/core/styles/mixins/dev_and_debug.scss (100%) rename src/{components => elements}/core/styles/mixins/font-face.scss (100%) rename src/{components => elements}/core/styles/mixins/helpers.scss (100%) rename src/{components => elements}/core/styles/mixins/inputs.scss (100%) rename src/{components => elements}/core/styles/mixins/layout.scss (100%) rename src/{components => elements}/core/styles/mixins/link.scss (100%) rename src/{components => elements}/core/styles/mixins/lists.scss (100%) rename src/{components => elements}/core/styles/mixins/overlay.scss (100%) rename src/{components => elements}/core/styles/mixins/panel.scss (100%) rename src/{components => elements}/core/styles/mixins/pearl-chain-bullet.scss (100%) rename src/{components => elements}/core/styles/mixins/scrollbar.scss (100%) rename src/{components => elements}/core/styles/mixins/shadows.scss (100%) rename src/{components => elements}/core/styles/mixins/typo.scss (100%) rename src/{components => elements}/core/styles/normalize.scss (100%) rename src/{components => elements}/core/styles/standard-theme.scss (100%) rename src/{components => elements}/core/styles/typography.scss (100%) rename src/{components => elements}/core/testing.ts (100%) rename src/{components => elements}/core/testing/event-spy.ts (100%) rename src/{components => elements}/core/testing/mocha-extensions.ts (100%) rename src/{components => elements}/core/testing/private.ts (100%) rename src/{components => elements}/core/testing/private/a11y-tree-snapshot.ts (100%) rename src/{components => elements}/core/testing/private/describe-each.ts (100%) rename src/{components => elements}/core/testing/private/describe-viewports.ts (100%) rename src/{components => elements}/core/testing/private/dispatch-events.ts (100%) rename src/{components => elements}/core/testing/private/event-objects.ts (100%) rename src/{components => elements}/core/testing/private/fixture.ts (97%) rename src/{components => elements}/core/testing/private/platform.ts (100%) rename src/{components => elements}/core/testing/private/type-in-element.ts (100%) rename src/{components => elements}/core/testing/private/visual-regression-snapshot.ts (100%) rename src/{components => elements}/core/testing/scroll.ts (100%) rename src/{components => elements}/core/testing/test-setup-ssr.ts (100%) rename src/{components => elements}/core/testing/test-setup.ts (100%) rename src/{components => elements}/core/testing/wait-for-condition.ts (100%) rename src/{components => elements}/core/testing/wait-for-render.ts (100%) rename src/{components => elements}/datepicker.ts (100%) rename src/{components => elements}/datepicker/common.ts (100%) rename src/{components => elements}/datepicker/common/datepicker-button.ts (100%) rename src/{components => elements}/datepicker/datepicker-next-day.ts (100%) rename src/{components => elements}/datepicker/datepicker-next-day/__snapshots__/datepicker-next-day.spec.snap.js (100%) rename src/{components => elements}/datepicker/datepicker-next-day/datepicker-next-day.e2e.ts (100%) rename src/{components => elements}/datepicker/datepicker-next-day/datepicker-next-day.scss (100%) rename src/{components => elements}/datepicker/datepicker-next-day/datepicker-next-day.spec.ts (100%) rename src/{components => elements}/datepicker/datepicker-next-day/datepicker-next-day.stories.ts (97%) rename src/{components => elements}/datepicker/datepicker-next-day/datepicker-next-day.ts (100%) rename src/{components => elements}/datepicker/datepicker-next-day/readme.md (93%) rename src/{components => elements}/datepicker/datepicker-previous-day.ts (100%) rename src/{components => elements}/datepicker/datepicker-previous-day/__snapshots__/datepicker-previous-day.spec.snap.js (100%) rename src/{components => elements}/datepicker/datepicker-previous-day/datepicker-previous-day.e2e.ts (100%) rename src/{components => elements}/datepicker/datepicker-previous-day/datepicker-previous-day.scss (100%) rename src/{components => elements}/datepicker/datepicker-previous-day/datepicker-previous-day.spec.ts (100%) rename src/{components => elements}/datepicker/datepicker-previous-day/datepicker-previous-day.stories.ts (97%) rename src/{components => elements}/datepicker/datepicker-previous-day/datepicker-previous-day.ts (100%) rename src/{components => elements}/datepicker/datepicker-previous-day/readme.md (93%) rename src/{components => elements}/datepicker/datepicker-toggle.ts (100%) rename src/{components => elements}/datepicker/datepicker-toggle/__snapshots__/datepicker-toggle.spec.snap.js (100%) rename src/{components => elements}/datepicker/datepicker-toggle/datepicker-toggle.e2e.ts (100%) rename src/{components => elements}/datepicker/datepicker-toggle/datepicker-toggle.scss (100%) rename src/{components => elements}/datepicker/datepicker-toggle/datepicker-toggle.spec.ts (100%) rename src/{components => elements}/datepicker/datepicker-toggle/datepicker-toggle.stories.ts (98%) rename src/{components => elements}/datepicker/datepicker-toggle/datepicker-toggle.ts (100%) rename src/{components => elements}/datepicker/datepicker-toggle/readme.md (88%) rename src/{components => elements}/datepicker/datepicker.ts (100%) rename src/{components => elements}/datepicker/datepicker/__snapshots__/datepicker.spec.snap.js (100%) rename src/{components => elements}/datepicker/datepicker/datepicker.e2e.ts (100%) rename src/{components => elements}/datepicker/datepicker/datepicker.scss (100%) rename src/{components => elements}/datepicker/datepicker/datepicker.spec.ts (100%) rename src/{components => elements}/datepicker/datepicker/datepicker.stories.ts (99%) rename src/{components => elements}/datepicker/datepicker/datepicker.ts (100%) rename src/{components => elements}/datepicker/datepicker/readme.md (99%) rename src/{components => elements}/dialog.ts (100%) rename src/{components => elements}/dialog/dialog-actions.ts (100%) rename src/{components => elements}/dialog/dialog-actions/__snapshots__/dialog-actions.spec.snap.js (100%) rename src/{components => elements}/dialog/dialog-actions/dialog-actions.scss (100%) rename src/{components => elements}/dialog/dialog-actions/dialog-actions.spec.ts (100%) rename src/{components => elements}/dialog/dialog-actions/dialog-actions.stories.ts (95%) rename src/{components => elements}/dialog/dialog-actions/dialog-actions.ts (100%) rename src/{components => elements}/dialog/dialog-actions/readme.md (92%) rename src/{components => elements}/dialog/dialog-content.ts (100%) rename src/{components => elements}/dialog/dialog-content/dialog-content.scss (100%) rename src/{components => elements}/dialog/dialog-content/dialog-content.spec.ts (100%) rename src/{components => elements}/dialog/dialog-content/dialog-content.stories.ts (92%) rename src/{components => elements}/dialog/dialog-content/dialog-content.ts (100%) rename src/{components => elements}/dialog/dialog-content/readme.md (81%) rename src/{components => elements}/dialog/dialog-title.ts (100%) rename src/{components => elements}/dialog/dialog-title/__snapshots__/dialog-title.spec.snap.js (100%) rename src/{components => elements}/dialog/dialog-title/dialog-title.e2e.ts (100%) rename src/{components => elements}/dialog/dialog-title/dialog-title.scss (100%) rename src/{components => elements}/dialog/dialog-title/dialog-title.spec.ts (100%) rename src/{components => elements}/dialog/dialog-title/dialog-title.stories.ts (97%) rename src/{components => elements}/dialog/dialog-title/dialog-title.ts (100%) rename src/{components => elements}/dialog/dialog-title/readme.md (94%) rename src/{components => elements}/dialog/dialog.ts (100%) rename src/{components => elements}/dialog/dialog/__snapshots__/dialog.spec.snap.js (100%) rename src/{components => elements}/dialog/dialog/dialog.e2e.ts (100%) rename src/{components => elements}/dialog/dialog/dialog.scss (100%) rename src/{components => elements}/dialog/dialog/dialog.spec.ts (100%) rename src/{components => elements}/dialog/dialog/dialog.stories.ts (99%) rename src/{components => elements}/dialog/dialog/dialog.ts (100%) rename src/{components => elements}/dialog/dialog/readme.md (94%) rename src/{components => elements}/divider.ts (100%) rename src/{components => elements}/divider/__snapshots__/divider.spec.snap.js (100%) rename src/{components => elements}/divider/divider.e2e.ts (100%) rename src/{components => elements}/divider/divider.scss (100%) rename src/{components => elements}/divider/divider.spec.ts (100%) rename src/{components => elements}/divider/divider.stories.ts (97%) rename src/{components => elements}/divider/divider.ts (100%) rename src/{components => elements}/divider/readme.md (100%) rename src/{components => elements}/expansion-panel.ts (100%) rename src/{components => elements}/expansion-panel/expansion-panel-content.ts (100%) rename src/{components => elements}/expansion-panel/expansion-panel-content/__snapshots__/expansion-panel-content.spec.snap.js (100%) rename src/{components => elements}/expansion-panel/expansion-panel-content/expansion-panel-content.e2e.ts (100%) rename src/{components => elements}/expansion-panel/expansion-panel-content/expansion-panel-content.scss (100%) rename src/{components => elements}/expansion-panel/expansion-panel-content/expansion-panel-content.spec.ts (100%) rename src/{components => elements}/expansion-panel/expansion-panel-content/expansion-panel-content.stories.ts (91%) rename src/{components => elements}/expansion-panel/expansion-panel-content/expansion-panel-content.ts (100%) rename src/{components => elements}/expansion-panel/expansion-panel-content/readme.md (90%) rename src/{components => elements}/expansion-panel/expansion-panel-header.ts (100%) rename src/{components => elements}/expansion-panel/expansion-panel-header/__snapshots__/expansion-panel-header.spec.snap.js (100%) rename src/{components => elements}/expansion-panel/expansion-panel-header/expansion-panel-header.e2e.ts (100%) rename src/{components => elements}/expansion-panel/expansion-panel-header/expansion-panel-header.scss (100%) rename src/{components => elements}/expansion-panel/expansion-panel-header/expansion-panel-header.spec.ts (100%) rename src/{components => elements}/expansion-panel/expansion-panel-header/expansion-panel-header.stories.ts (91%) rename src/{components => elements}/expansion-panel/expansion-panel-header/expansion-panel-header.ts (100%) rename src/{components => elements}/expansion-panel/expansion-panel-header/readme.md (97%) rename src/{components => elements}/expansion-panel/expansion-panel.ts (100%) rename src/{components => elements}/expansion-panel/expansion-panel/__snapshots__/expansion-panel.spec.snap.js (100%) rename src/{components => elements}/expansion-panel/expansion-panel/expansion-panel.e2e.ts (100%) rename src/{components => elements}/expansion-panel/expansion-panel/expansion-panel.scss (100%) rename src/{components => elements}/expansion-panel/expansion-panel/expansion-panel.spec.ts (100%) rename src/{components => elements}/expansion-panel/expansion-panel/expansion-panel.stories.ts (98%) rename src/{components => elements}/expansion-panel/expansion-panel/expansion-panel.ts (100%) rename src/{components => elements}/expansion-panel/expansion-panel/readme.md (94%) rename src/{components => elements}/file-selector.ts (100%) rename src/{components => elements}/file-selector/__snapshots__/file-selector.spec.snap.js (100%) rename src/{components => elements}/file-selector/file-selector.e2e.ts (100%) rename src/{components => elements}/file-selector/file-selector.scss (100%) rename src/{components => elements}/file-selector/file-selector.spec.ts (100%) rename src/{components => elements}/file-selector/file-selector.stories.ts (99%) rename src/{components => elements}/file-selector/file-selector.ts (100%) rename src/{components => elements}/file-selector/readme.md (100%) rename src/{components => elements}/footer.ts (100%) rename src/{components => elements}/footer/__snapshots__/footer.spec.snap.js (100%) rename src/{components => elements}/footer/footer.e2e.ts (100%) rename src/{components => elements}/footer/footer.scss (100%) rename src/{components => elements}/footer/footer.spec.ts (100%) rename src/{components => elements}/footer/footer.stories.ts (99%) rename src/{components => elements}/footer/footer.ts (100%) rename src/{components => elements}/footer/readme.md (98%) rename src/{components => elements}/form-error.ts (100%) rename src/{components => elements}/form-error/__snapshots__/form-error.spec.snap.js (100%) rename src/{components => elements}/form-error/form-error.e2e.ts (100%) rename src/{components => elements}/form-error/form-error.scss (100%) rename src/{components => elements}/form-error/form-error.spec.ts (100%) rename src/{components => elements}/form-error/form-error.stories.ts (98%) rename src/{components => elements}/form-error/form-error.ts (100%) rename src/{components => elements}/form-error/readme.md (80%) rename src/{components => elements}/form-field.ts (100%) rename src/{components => elements}/form-field/form-field-clear.ts (100%) rename src/{components => elements}/form-field/form-field-clear/__snapshots__/form-field-clear.spec.snap.js (100%) rename src/{components => elements}/form-field/form-field-clear/form-field-clear.e2e.ts (100%) rename src/{components => elements}/form-field/form-field-clear/form-field-clear.scss (100%) rename src/{components => elements}/form-field/form-field-clear/form-field-clear.spec.ts (100%) rename src/{components => elements}/form-field/form-field-clear/form-field-clear.stories.ts (97%) rename src/{components => elements}/form-field/form-field-clear/form-field-clear.ts (100%) rename src/{components => elements}/form-field/form-field-clear/readme.md (94%) rename src/{components => elements}/form-field/form-field.ts (100%) rename src/{components => elements}/form-field/form-field/__snapshots__/form-field.spec.snap.js (100%) rename src/{components => elements}/form-field/form-field/form-field.e2e.ts (100%) rename src/{components => elements}/form-field/form-field/form-field.scss (100%) rename src/{components => elements}/form-field/form-field/form-field.spec.ts (100%) rename src/{components => elements}/form-field/form-field/form-field.stories.ts (99%) rename src/{components => elements}/form-field/form-field/form-field.ts (100%) rename src/{components => elements}/form-field/form-field/readme.md (92%) rename src/{components => elements}/header.ts (100%) rename src/{components => elements}/header/common.ts (100%) rename src/{components => elements}/header/common/header-action-common.ts (100%) rename src/{components => elements}/header/common/header-action.scss (100%) rename src/{components => elements}/header/header-button.ts (100%) rename src/{components => elements}/header/header-button/__snapshots__/header-button.spec.snap.js (100%) rename src/{components => elements}/header/header-button/header-button.e2e.ts (100%) rename src/{components => elements}/header/header-button/header-button.spec.ts (100%) rename src/{components => elements}/header/header-button/header-button.stories.ts (98%) rename src/{components => elements}/header/header-button/header-button.ts (100%) rename src/{components => elements}/header/header-button/readme.md (98%) rename src/{components => elements}/header/header-link.ts (100%) rename src/{components => elements}/header/header-link/__snapshots__/header-link.spec.snap.js (100%) rename src/{components => elements}/header/header-link/header-link.e2e.ts (100%) rename src/{components => elements}/header/header-link/header-link.spec.ts (100%) rename src/{components => elements}/header/header-link/header-link.stories.ts (98%) rename src/{components => elements}/header/header-link/header-link.ts (100%) rename src/{components => elements}/header/header-link/readme.md (98%) rename src/{components => elements}/header/header.ts (100%) rename src/{components => elements}/header/header/__snapshots__/header.spec.snap.js (100%) rename src/{components => elements}/header/header/header.e2e.ts (100%) rename src/{components => elements}/header/header/header.scss (100%) rename src/{components => elements}/header/header/header.spec.ts (100%) rename src/{components => elements}/header/header/header.stories.ts (99%) rename src/{components => elements}/header/header/header.ts (100%) rename src/{components => elements}/header/header/readme.md (94%) rename src/{components => elements}/icon.ts (100%) rename src/{components => elements}/icon/__snapshots__/icon.spec.snap.js (100%) rename src/{components => elements}/icon/icon-base.ts (100%) rename src/{components => elements}/icon/icon-name-mixin.ts (100%) rename src/{components => elements}/icon/icon-request.ts (100%) rename src/{components => elements}/icon/icon-validate.spec.ts (100%) rename src/{components => elements}/icon/icon-validate.ts (100%) rename src/{components => elements}/icon/icon.e2e.ts (100%) rename src/{components => elements}/icon/icon.scss (100%) rename src/{components => elements}/icon/icon.spec.ts (98%) rename src/{components => elements}/icon/icon.stories.ts (96%) rename src/{components => elements}/icon/icon.ts (100%) rename src/{components => elements}/icon/readme.md (100%) rename src/{components => elements}/image.ts (100%) rename src/{components => elements}/image/image.e2e.ts (96%) rename src/{components => elements}/image/image.helper.ts (100%) rename src/{components => elements}/image/image.scss (100%) rename src/{components => elements}/image/image.stories.ts (99%) rename src/{components => elements}/image/image.ts (100%) rename src/{components => elements}/image/readme.md (100%) rename src/{components => elements}/journey-header.ts (100%) rename src/{components => elements}/journey-header/__snapshots__/journey-header.spec.snap.js (100%) rename src/{components => elements}/journey-header/journey-header.e2e.ts (100%) rename src/{components => elements}/journey-header/journey-header.scss (100%) rename src/{components => elements}/journey-header/journey-header.spec.ts (100%) rename src/{components => elements}/journey-header/journey-header.stories.ts (98%) rename src/{components => elements}/journey-header/journey-header.ts (100%) rename src/{components => elements}/journey-header/readme.md (100%) rename src/{components => elements}/link-list.ts (100%) rename src/{components => elements}/link-list/__snapshots__/link-list.spec.snap.js (100%) rename src/{components => elements}/link-list/link-list.e2e.ts (100%) rename src/{components => elements}/link-list/link-list.scss (100%) rename src/{components => elements}/link-list/link-list.spec.ts (100%) rename src/{components => elements}/link-list/link-list.stories.ts (98%) rename src/{components => elements}/link-list/link-list.ts (100%) rename src/{components => elements}/link-list/readme.md (96%) rename src/{components => elements}/link.ts (100%) rename src/{components => elements}/link/block-link-button.ts (100%) rename src/{components => elements}/link/block-link-button/__snapshots__/block-link-button.spec.snap.js (100%) rename src/{components => elements}/link/block-link-button/block-link-button.spec.ts (100%) rename src/{components => elements}/link/block-link-button/block-link-button.stories.ts (96%) rename src/{components => elements}/link/block-link-button/block-link-button.ts (100%) rename src/{components => elements}/link/block-link-button/readme.md (100%) rename src/{components => elements}/link/block-link-static.ts (100%) rename src/{components => elements}/link/block-link-static/__snapshots__/block-link-static.spec.snap.js (100%) rename src/{components => elements}/link/block-link-static/block-link-static.spec.ts (100%) rename src/{components => elements}/link/block-link-static/block-link-static.stories.ts (96%) rename src/{components => elements}/link/block-link-static/block-link-static.ts (100%) rename src/{components => elements}/link/block-link-static/readme.md (100%) rename src/{components => elements}/link/block-link.ts (100%) rename src/{components => elements}/link/block-link/__snapshots__/block-link.spec.snap.js (100%) rename src/{components => elements}/link/block-link/block-link.spec.ts (100%) rename src/{components => elements}/link/block-link/block-link.stories.ts (97%) rename src/{components => elements}/link/block-link/block-link.ts (100%) rename src/{components => elements}/link/block-link/readme.md (100%) rename src/{components => elements}/link/common.ts (100%) rename src/{components => elements}/link/common/block-link-common.ts (100%) rename src/{components => elements}/link/common/block-link.scss (100%) rename src/{components => elements}/link/common/inline-link-common.ts (100%) rename src/{components => elements}/link/common/inline-link.scss (100%) rename src/{components => elements}/link/common/link-common-stories.ts (100%) rename src/{components => elements}/link/common/link-common.ts (100%) rename src/{components => elements}/link/common/link.scss (100%) rename src/{components => elements}/link/link-button.ts (100%) rename src/{components => elements}/link/link-button/__snapshots__/link-button.spec.snap.js (100%) rename src/{components => elements}/link/link-button/link-button.e2e.ts (100%) rename src/{components => elements}/link/link-button/link-button.spec.ts (100%) rename src/{components => elements}/link/link-button/link-button.stories.ts (95%) rename src/{components => elements}/link/link-button/link-button.ts (100%) rename src/{components => elements}/link/link-button/readme.md (100%) rename src/{components => elements}/link/link-static.ts (100%) rename src/{components => elements}/link/link-static/__snapshots__/link-static.spec.snap.js (100%) rename src/{components => elements}/link/link-static/link-static.e2e.ts (100%) rename src/{components => elements}/link/link-static/link-static.spec.ts (100%) rename src/{components => elements}/link/link-static/link-static.stories.ts (95%) rename src/{components => elements}/link/link-static/link-static.ts (100%) rename src/{components => elements}/link/link-static/readme.md (100%) rename src/{components => elements}/link/link.ts (100%) rename src/{components => elements}/link/link/__snapshots__/link.spec.snap.js (100%) rename src/{components => elements}/link/link/link.e2e.ts (100%) rename src/{components => elements}/link/link/link.spec.ts (100%) rename src/{components => elements}/link/link/link.stories.ts (96%) rename src/{components => elements}/link/link/link.ts (100%) rename src/{components => elements}/link/link/readme.md (100%) rename src/{components => elements}/loading-indicator.ts (100%) rename src/{components => elements}/loading-indicator/__snapshots__/loading-indicator.spec.snap.js (100%) rename src/{components => elements}/loading-indicator/loading-indicator.e2e.ts (100%) rename src/{components => elements}/loading-indicator/loading-indicator.scss (100%) rename src/{components => elements}/loading-indicator/loading-indicator.spec.ts (100%) rename src/{components => elements}/loading-indicator/loading-indicator.stories.ts (99%) rename src/{components => elements}/loading-indicator/loading-indicator.ts (100%) rename src/{components => elements}/loading-indicator/readme.md (100%) rename src/{components => elements}/logo.ts (100%) rename src/{components => elements}/logo/logo.scss (100%) rename src/{components => elements}/logo/logo.stories.ts (98%) rename src/{components => elements}/logo/logo.ts (100%) rename src/{components => elements}/logo/readme.md (100%) rename src/{components => elements}/map-container.ts (100%) rename src/{components => elements}/map-container/__snapshots__/map-container.spec.snap.js (100%) rename src/{components => elements}/map-container/map-container.e2e.ts (100%) rename src/{components => elements}/map-container/map-container.scss (100%) rename src/{components => elements}/map-container/map-container.spec.ts (100%) rename src/{components => elements}/map-container/map-container.stories.ts (98%) rename src/{components => elements}/map-container/map-container.ts (100%) rename src/{components => elements}/map-container/readme.md (100%) rename src/{components => elements}/menu.ts (100%) rename src/{components => elements}/menu/common.ts (100%) rename src/{components => elements}/menu/common/menu-action-common.ts (100%) rename src/{components => elements}/menu/common/menu-action.scss (100%) rename src/{components => elements}/menu/menu-button.ts (100%) rename src/{components => elements}/menu/menu-button/menu-button.e2e.ts (100%) rename src/{components => elements}/menu/menu-button/menu-button.spec.ts (100%) rename src/{components => elements}/menu/menu-button/menu-button.stories.ts (98%) rename src/{components => elements}/menu/menu-button/menu-button.ts (100%) rename src/{components => elements}/menu/menu-button/readme.md (98%) rename src/{components => elements}/menu/menu-link.ts (100%) rename src/{components => elements}/menu/menu-link/menu-link.e2e.ts (100%) rename src/{components => elements}/menu/menu-link/menu-link.spec.ts (100%) rename src/{components => elements}/menu/menu-link/menu-link.stories.ts (98%) rename src/{components => elements}/menu/menu-link/menu-link.ts (100%) rename src/{components => elements}/menu/menu-link/readme.md (98%) rename src/{components => elements}/menu/menu.ts (100%) rename src/{components => elements}/menu/menu/__snapshots__/menu.spec.snap.js (100%) rename src/{components => elements}/menu/menu/menu.e2e.ts (100%) rename src/{components => elements}/menu/menu/menu.scss (100%) rename src/{components => elements}/menu/menu/menu.spec.ts (100%) rename src/{components => elements}/menu/menu/menu.stories.ts (99%) rename src/{components => elements}/menu/menu/menu.ts (100%) rename src/{components => elements}/menu/menu/readme.md (97%) rename src/{components => elements}/message.ts (100%) rename src/{components => elements}/message/__snapshots__/message.spec.snap.js (100%) rename src/{components => elements}/message/message.e2e.ts (100%) rename src/{components => elements}/message/message.scss (100%) rename src/{components => elements}/message/message.spec.ts (100%) rename src/{components => elements}/message/message.stories.ts (99%) rename src/{components => elements}/message/message.ts (100%) rename src/{components => elements}/message/readme.md (88%) rename src/{components => elements}/navigation.ts (100%) rename src/{components => elements}/navigation/common.ts (100%) rename src/{components => elements}/navigation/common/navigation-action-common.ts (100%) rename src/{components => elements}/navigation/common/navigation-action.scss (100%) rename src/{components => elements}/navigation/navigation-button.ts (100%) rename src/{components => elements}/navigation/navigation-button/__snapshots__/navigation-button.spec.snap.js (100%) rename src/{components => elements}/navigation/navigation-button/navigation-button.e2e.ts (100%) rename src/{components => elements}/navigation/navigation-button/navigation-button.spec.ts (100%) rename src/{components => elements}/navigation/navigation-button/navigation-button.stories.ts (97%) rename src/{components => elements}/navigation/navigation-button/navigation-button.ts (100%) rename src/{components => elements}/navigation/navigation-button/readme.md (93%) rename src/{components => elements}/navigation/navigation-link.ts (100%) rename src/{components => elements}/navigation/navigation-link/__snapshots__/navigation-link.spec.snap.js (100%) rename src/{components => elements}/navigation/navigation-link/navigation-link.e2e.ts (100%) rename src/{components => elements}/navigation/navigation-link/navigation-link.spec.ts (100%) rename src/{components => elements}/navigation/navigation-link/navigation-link.stories.ts (97%) rename src/{components => elements}/navigation/navigation-link/navigation-link.ts (100%) rename src/{components => elements}/navigation/navigation-link/readme.md (94%) rename src/{components => elements}/navigation/navigation-list.ts (100%) rename src/{components => elements}/navigation/navigation-list/__snapshots__/navigation-list.spec.snap.js (100%) rename src/{components => elements}/navigation/navigation-list/navigation-list.e2e.ts (100%) rename src/{components => elements}/navigation/navigation-list/navigation-list.scss (100%) rename src/{components => elements}/navigation/navigation-list/navigation-list.spec.ts (100%) rename src/{components => elements}/navigation/navigation-list/navigation-list.stories.ts (96%) rename src/{components => elements}/navigation/navigation-list/navigation-list.ts (100%) rename src/{components => elements}/navigation/navigation-list/readme.md (80%) rename src/{components => elements}/navigation/navigation-marker.ts (100%) rename src/{components => elements}/navigation/navigation-marker/__snapshots__/navigation-marker.spec.snap.js (100%) rename src/{components => elements}/navigation/navigation-marker/navigation-marker.e2e.ts (100%) rename src/{components => elements}/navigation/navigation-marker/navigation-marker.scss (100%) rename src/{components => elements}/navigation/navigation-marker/navigation-marker.spec.ts (100%) rename src/{components => elements}/navigation/navigation-marker/navigation-marker.stories.ts (97%) rename src/{components => elements}/navigation/navigation-marker/navigation-marker.ts (100%) rename src/{components => elements}/navigation/navigation-marker/readme.md (87%) rename src/{components => elements}/navigation/navigation-section.ts (100%) rename src/{components => elements}/navigation/navigation-section/__snapshots__/navigation-section.spec.snap.js (100%) rename src/{components => elements}/navigation/navigation-section/navigation-section.e2e.ts (100%) rename src/{components => elements}/navigation/navigation-section/navigation-section.scss (100%) rename src/{components => elements}/navigation/navigation-section/navigation-section.spec.ts (100%) rename src/{components => elements}/navigation/navigation-section/navigation-section.stories.ts (98%) rename src/{components => elements}/navigation/navigation-section/navigation-section.ts (100%) rename src/{components => elements}/navigation/navigation-section/readme.md (91%) rename src/{components => elements}/navigation/navigation.ts (100%) rename src/{components => elements}/navigation/navigation/__snapshots__/navigation.spec.snap.js (100%) rename src/{components => elements}/navigation/navigation/navigation.e2e.ts (100%) rename src/{components => elements}/navigation/navigation/navigation.scss (100%) rename src/{components => elements}/navigation/navigation/navigation.spec.ts (100%) rename src/{components => elements}/navigation/navigation/navigation.stories.ts (99%) rename src/{components => elements}/navigation/navigation/navigation.ts (100%) rename src/{components => elements}/navigation/navigation/readme.md (96%) rename src/{components => elements}/notification.ts (100%) rename src/{components => elements}/notification/__snapshots__/notification.spec.snap.js (100%) rename src/{components => elements}/notification/notification.e2e.ts (100%) rename src/{components => elements}/notification/notification.scss (100%) rename src/{components => elements}/notification/notification.spec.ts (100%) rename src/{components => elements}/notification/notification.stories.ts (99%) rename src/{components => elements}/notification/notification.ts (100%) rename src/{components => elements}/notification/readme.md (100%) rename src/{components => elements}/option.ts (100%) rename src/{components => elements}/option/optgroup.ts (100%) rename src/{components => elements}/option/optgroup/__snapshots__/optgroup.spec.snap.js (100%) rename src/{components => elements}/option/optgroup/optgroup.e2e.ts (100%) rename src/{components => elements}/option/optgroup/optgroup.scss (100%) rename src/{components => elements}/option/optgroup/optgroup.spec.ts (100%) rename src/{components => elements}/option/optgroup/optgroup.stories.ts (98%) rename src/{components => elements}/option/optgroup/optgroup.ts (100%) rename src/{components => elements}/option/optgroup/readme.md (83%) rename src/{components => elements}/option/option.ts (100%) rename src/{components => elements}/option/option/__snapshots__/option.spec.snap.js (100%) rename src/{components => elements}/option/option/option.e2e.ts (100%) rename src/{components => elements}/option/option/option.scss (100%) rename src/{components => elements}/option/option/option.spec.ts (100%) rename src/{components => elements}/option/option/option.stories.ts (99%) rename src/{components => elements}/option/option/option.ts (100%) rename src/{components => elements}/option/option/readme.md (97%) rename src/{components => elements}/overlay.ts (100%) rename src/{components => elements}/overlay/__snapshots__/overlay.spec.snap.js (100%) rename src/{components => elements}/overlay/overlay.e2e.ts (100%) rename src/{components => elements}/overlay/overlay.scss (100%) rename src/{components => elements}/overlay/overlay.spec.ts (100%) rename src/{components => elements}/overlay/overlay.stories.ts (99%) rename src/{components => elements}/overlay/overlay.ts (100%) rename src/{components => elements}/overlay/readme.md (98%) rename src/{components => elements}/package.json (89%) rename src/{components => elements}/popover.ts (100%) rename src/{components => elements}/popover/popover-trigger.ts (100%) rename src/{components => elements}/popover/popover-trigger/__snapshots__/popover-trigger.spec.snap.js (100%) rename src/{components => elements}/popover/popover-trigger/popover-trigger.e2e.ts (100%) rename src/{components => elements}/popover/popover-trigger/popover-trigger.scss (100%) rename src/{components => elements}/popover/popover-trigger/popover-trigger.spec.ts (100%) rename src/{components => elements}/popover/popover-trigger/popover-trigger.stories.ts (98%) rename src/{components => elements}/popover/popover-trigger/popover-trigger.ts (100%) rename src/{components => elements}/popover/popover-trigger/readme.md (98%) rename src/{components => elements}/popover/popover.ts (100%) rename src/{components => elements}/popover/popover/__snapshots__/popover.spec.snap.js (100%) rename src/{components => elements}/popover/popover/popover.e2e.ts (100%) rename src/{components => elements}/popover/popover/popover.scss (100%) rename src/{components => elements}/popover/popover/popover.spec.ts (100%) rename src/{components => elements}/popover/popover/popover.stories.ts (99%) rename src/{components => elements}/popover/popover/popover.ts (100%) rename src/{components => elements}/popover/popover/readme.md (98%) rename src/{components => elements}/radio-button.ts (100%) rename src/{components => elements}/radio-button/radio-button-group.ts (100%) rename src/{components => elements}/radio-button/radio-button-group/__snapshots__/radio-button-group.spec.snap.js (100%) rename src/{components => elements}/radio-button/radio-button-group/radio-button-group.e2e.ts (100%) rename src/{components => elements}/radio-button/radio-button-group/radio-button-group.scss (100%) rename src/{components => elements}/radio-button/radio-button-group/radio-button-group.spec.ts (100%) rename src/{components => elements}/radio-button/radio-button-group/radio-button-group.stories.ts (98%) rename src/{components => elements}/radio-button/radio-button-group/radio-button-group.ts (100%) rename src/{components => elements}/radio-button/radio-button-group/readme.md (97%) rename src/{components => elements}/radio-button/radio-button.ts (100%) rename src/{components => elements}/radio-button/radio-button/__snapshots__/radio-button.spec.snap.js (100%) rename src/{components => elements}/radio-button/radio-button/radio-button.e2e.ts (100%) rename src/{components => elements}/radio-button/radio-button/radio-button.scss (100%) rename src/{components => elements}/radio-button/radio-button/radio-button.spec.ts (100%) rename src/{components => elements}/radio-button/radio-button/radio-button.stories.ts (98%) rename src/{components => elements}/radio-button/radio-button/radio-button.ts (100%) rename src/{components => elements}/radio-button/radio-button/readme.md (92%) rename src/{components => elements}/screen-reader-only.ts (100%) rename src/{components => elements}/screen-reader-only/__snapshots__/screen-reader-only.spec.snap.js (100%) rename src/{components => elements}/screen-reader-only/readme.md (100%) rename src/{components => elements}/screen-reader-only/screen-reader-only.e2e.ts (100%) rename src/{components => elements}/screen-reader-only/screen-reader-only.scss (100%) rename src/{components => elements}/screen-reader-only/screen-reader-only.spec.ts (100%) rename src/{components => elements}/screen-reader-only/screen-reader-only.stories.ts (100%) rename src/{components => elements}/screen-reader-only/screen-reader-only.ts (100%) rename src/{components => elements}/select.ts (100%) rename src/{components => elements}/select/__snapshots__/select.spec.snap.js (100%) rename src/{components => elements}/select/readme.md (98%) rename src/{components => elements}/select/select.e2e.ts (100%) rename src/{components => elements}/select/select.scss (100%) rename src/{components => elements}/select/select.spec.ts (100%) rename src/{components => elements}/select/select.stories.ts (99%) rename src/{components => elements}/select/select.ts (100%) rename src/{components => elements}/selection-panel.ts (100%) rename src/{components => elements}/selection-panel/__snapshots__/selection-panel.spec.snap.js (100%) rename src/{components => elements}/selection-panel/readme.md (92%) rename src/{components => elements}/selection-panel/selection-panel.e2e.ts (100%) rename src/{components => elements}/selection-panel/selection-panel.scss (100%) rename src/{components => elements}/selection-panel/selection-panel.spec.ts (100%) rename src/{components => elements}/selection-panel/selection-panel.stories.ts (99%) rename src/{components => elements}/selection-panel/selection-panel.ts (100%) rename src/{components => elements}/signet.ts (100%) rename src/{components => elements}/signet/readme.md (100%) rename src/{components => elements}/signet/signet.scss (100%) rename src/{components => elements}/signet/signet.stories.ts (97%) rename src/{components => elements}/signet/signet.ts (100%) rename src/{components => elements}/skiplink-list.ts (100%) rename src/{components => elements}/skiplink-list/__snapshots__/skiplink-list.spec.snap.js (100%) rename src/{components => elements}/skiplink-list/readme.md (96%) rename src/{components => elements}/skiplink-list/skiplink-list.e2e.ts (100%) rename src/{components => elements}/skiplink-list/skiplink-list.scss (100%) rename src/{components => elements}/skiplink-list/skiplink-list.spec.ts (100%) rename src/{components => elements}/skiplink-list/skiplink-list.stories.ts (98%) rename src/{components => elements}/skiplink-list/skiplink-list.ts (100%) rename src/{components => elements}/slider.ts (100%) rename src/{components => elements}/slider/__snapshots__/slider.spec.snap.js (100%) rename src/{components => elements}/slider/readme.md (100%) rename src/{components => elements}/slider/slider.e2e.ts (100%) rename src/{components => elements}/slider/slider.scss (100%) rename src/{components => elements}/slider/slider.spec.ts (100%) rename src/{components => elements}/slider/slider.stories.ts (99%) rename src/{components => elements}/slider/slider.ts (100%) rename src/{components => elements}/status.ts (100%) rename src/{components => elements}/status/__snapshots__/status.spec.snap.js (100%) rename src/{components => elements}/status/readme.md (100%) rename src/{components => elements}/status/status.e2e.ts (100%) rename src/{components => elements}/status/status.scss (100%) rename src/{components => elements}/status/status.spec.ts (100%) rename src/{components => elements}/status/status.stories.ts (98%) rename src/{components => elements}/status/status.ts (100%) rename src/{components => elements}/tabs.ts (100%) rename src/{components => elements}/tabs/tab-group.ts (100%) rename src/{components => elements}/tabs/tab-group/__snapshots__/tab-group.spec.snap.js (100%) rename src/{components => elements}/tabs/tab-group/readme.md (97%) rename src/{components => elements}/tabs/tab-group/tab-group.e2e.ts (100%) rename src/{components => elements}/tabs/tab-group/tab-group.scss (100%) rename src/{components => elements}/tabs/tab-group/tab-group.spec.ts (100%) rename src/{components => elements}/tabs/tab-group/tab-group.stories.ts (99%) rename src/{components => elements}/tabs/tab-group/tab-group.ts (100%) rename src/{components => elements}/tabs/tab-title.ts (100%) rename src/{components => elements}/tabs/tab-title/__snapshots__/tab-title.spec.snap.js (100%) rename src/{components => elements}/tabs/tab-title/readme.md (97%) rename src/{components => elements}/tabs/tab-title/tab-title.e2e.ts (100%) rename src/{components => elements}/tabs/tab-title/tab-title.scss (100%) rename src/{components => elements}/tabs/tab-title/tab-title.spec.ts (100%) rename src/{components => elements}/tabs/tab-title/tab-title.stories.ts (98%) rename src/{components => elements}/tabs/tab-title/tab-title.ts (100%) rename src/{components => elements}/tag.ts (100%) rename src/{components => elements}/tag/tag-group.ts (100%) rename src/{components => elements}/tag/tag-group/__snapshots__/tag-group.spec.snap.js (100%) rename src/{components => elements}/tag/tag-group/readme.md (98%) rename src/{components => elements}/tag/tag-group/tag-group.e2e.ts (100%) rename src/{components => elements}/tag/tag-group/tag-group.scss (100%) rename src/{components => elements}/tag/tag-group/tag-group.spec.ts (100%) rename src/{components => elements}/tag/tag-group/tag-group.stories.ts (99%) rename src/{components => elements}/tag/tag-group/tag-group.ts (100%) rename src/{components => elements}/tag/tag.ts (100%) rename src/{components => elements}/tag/tag/__snapshots__/tag.spec.snap.js (100%) rename src/{components => elements}/tag/tag/readme.md (97%) rename src/{components => elements}/tag/tag/tag.e2e.ts (100%) rename src/{components => elements}/tag/tag/tag.scss (100%) rename src/{components => elements}/tag/tag/tag.spec.ts (100%) rename src/{components => elements}/tag/tag/tag.stories.ts (98%) rename src/{components => elements}/tag/tag/tag.ts (100%) rename src/{components => elements}/teaser-hero.ts (100%) rename src/{components => elements}/teaser-hero/__snapshots__/teaser-hero.spec.snap.js (100%) rename src/{components => elements}/teaser-hero/readme.md (100%) rename src/{components => elements}/teaser-hero/teaser-hero.e2e.ts (100%) rename src/{components => elements}/teaser-hero/teaser-hero.scss (100%) rename src/{components => elements}/teaser-hero/teaser-hero.spec.ts (100%) rename src/{components => elements}/teaser-hero/teaser-hero.stories.ts (98%) rename src/{components => elements}/teaser-hero/teaser-hero.ts (100%) rename src/{components => elements}/teaser-paid.ts (100%) rename src/{components => elements}/teaser-paid/__snapshots__/teaser-paid.spec.snap.js (100%) rename src/{components => elements}/teaser-paid/readme.md (100%) rename src/{components => elements}/teaser-paid/teaser-paid.e2e.ts (100%) rename src/{components => elements}/teaser-paid/teaser-paid.scss (100%) rename src/{components => elements}/teaser-paid/teaser-paid.spec.ts (100%) rename src/{components => elements}/teaser-paid/teaser-paid.stories.ts (97%) rename src/{components => elements}/teaser-paid/teaser-paid.ts (100%) rename src/{components => elements}/teaser.ts (100%) rename src/{components => elements}/teaser/__snapshots__/teaser.spec.snap.js (100%) rename src/{components => elements}/teaser/assets/placeholder.png (100%) rename src/{components => elements}/teaser/readme.md (97%) rename src/{components => elements}/teaser/teaser.e2e.ts (100%) rename src/{components => elements}/teaser/teaser.scss (100%) rename src/{components => elements}/teaser/teaser.spec.ts (100%) rename src/{components => elements}/teaser/teaser.stories.ts (99%) rename src/{components => elements}/teaser/teaser.ts (100%) rename src/{components => elements}/time-input.ts (100%) rename src/{components => elements}/time-input/__snapshots__/time-input.spec.snap.js (100%) rename src/{components => elements}/time-input/readme.md (100%) rename src/{components => elements}/time-input/time-input.e2e.ts (100%) rename src/{components => elements}/time-input/time-input.scss (100%) rename src/{components => elements}/time-input/time-input.spec.ts (100%) rename src/{components => elements}/time-input/time-input.stories.ts (99%) rename src/{components => elements}/time-input/time-input.ts (100%) rename src/{components => elements}/timetable-occupancy-icon.ts (100%) rename src/{components => elements}/timetable-occupancy-icon/__snapshots__/timetable-occupancy-icon.spec.snap.js (100%) rename src/{components => elements}/timetable-occupancy-icon/readme.md (100%) rename src/{components => elements}/timetable-occupancy-icon/timetable-occupancy-icon.e2e.ts (100%) rename src/{components => elements}/timetable-occupancy-icon/timetable-occupancy-icon.scss (100%) rename src/{components => elements}/timetable-occupancy-icon/timetable-occupancy-icon.spec.ts (100%) rename src/{components => elements}/timetable-occupancy-icon/timetable-occupancy-icon.stories.ts (97%) rename src/{components => elements}/timetable-occupancy-icon/timetable-occupancy-icon.ts (100%) rename src/{components => elements}/timetable-occupancy.ts (100%) rename src/{components => elements}/timetable-occupancy/__snapshots__/timetable-occupancy.spec.snap.js (100%) rename src/{components => elements}/timetable-occupancy/readme.md (100%) rename src/{components => elements}/timetable-occupancy/timetable-occupancy.e2e.ts (100%) rename src/{components => elements}/timetable-occupancy/timetable-occupancy.scss (100%) rename src/{components => elements}/timetable-occupancy/timetable-occupancy.spec.ts (100%) rename src/{components => elements}/timetable-occupancy/timetable-occupancy.stories.ts (98%) rename src/{components => elements}/timetable-occupancy/timetable-occupancy.ts (100%) rename src/{components => elements}/title.ts (100%) rename src/{components => elements}/title/__snapshots__/title.spec.snap.js (100%) rename src/{components => elements}/title/readme.md (100%) rename src/{components => elements}/title/title-base.ts (100%) rename src/{components => elements}/title/title-common.scss (100%) rename src/{components => elements}/title/title.e2e.ts (100%) rename src/{components => elements}/title/title.scss (100%) rename src/{components => elements}/title/title.spec.ts (100%) rename src/{components => elements}/title/title.stories.ts (98%) rename src/{components => elements}/title/title.ts (100%) rename src/{components => elements}/toast.ts (100%) rename src/{components => elements}/toast/__snapshots__/toast.spec.snap.js (100%) rename src/{components => elements}/toast/readme.md (100%) rename src/{components => elements}/toast/toast.e2e.ts (100%) rename src/{components => elements}/toast/toast.scss (100%) rename src/{components => elements}/toast/toast.spec.ts (100%) rename src/{components => elements}/toast/toast.stories.ts (99%) rename src/{components => elements}/toast/toast.ts (100%) rename src/{components => elements}/toggle-check.ts (100%) rename src/{components => elements}/toggle-check/__snapshots__/toggle-check.spec.snap.js (100%) rename src/{components => elements}/toggle-check/readme.md (100%) rename src/{components => elements}/toggle-check/toggle-check.e2e.ts (100%) rename src/{components => elements}/toggle-check/toggle-check.scss (100%) rename src/{components => elements}/toggle-check/toggle-check.spec.ts (100%) rename src/{components => elements}/toggle-check/toggle-check.stories.ts (99%) rename src/{components => elements}/toggle-check/toggle-check.ts (100%) rename src/{components => elements}/toggle.ts (100%) rename src/{components => elements}/toggle/toggle-option.ts (100%) rename src/{components => elements}/toggle/toggle-option/__snapshots__/toggle-option.spec.snap.js (100%) rename src/{components => elements}/toggle/toggle-option/readme.md (96%) rename src/{components => elements}/toggle/toggle-option/toggle-option.e2e.ts (100%) rename src/{components => elements}/toggle/toggle-option/toggle-option.scss (100%) rename src/{components => elements}/toggle/toggle-option/toggle-option.spec.ts (100%) rename src/{components => elements}/toggle/toggle-option/toggle-option.stories.ts (98%) rename src/{components => elements}/toggle/toggle-option/toggle-option.ts (100%) rename src/{components => elements}/toggle/toggle.ts (100%) rename src/{components => elements}/toggle/toggle/__snapshots__/toggle.spec.snap.js (100%) rename src/{components => elements}/toggle/toggle/readme.md (92%) rename src/{components => elements}/toggle/toggle/toggle.e2e.ts (100%) rename src/{components => elements}/toggle/toggle/toggle.scss (100%) rename src/{components => elements}/toggle/toggle/toggle.spec.ts (100%) rename src/{components => elements}/toggle/toggle/toggle.stories.ts (99%) rename src/{components => elements}/toggle/toggle/toggle.ts (100%) rename src/{components => elements}/train.ts (100%) rename src/{components => elements}/train/train-blocked-passage.ts (100%) rename src/{components => elements}/train/train-blocked-passage/readme.md (100%) rename src/{components => elements}/train/train-blocked-passage/train-blocked-passage.e2e.ts (100%) rename src/{components => elements}/train/train-blocked-passage/train-blocked-passage.scss (100%) rename src/{components => elements}/train/train-blocked-passage/train-blocked-passage.spec.ts (100%) rename src/{components => elements}/train/train-blocked-passage/train-blocked-passage.stories.ts (91%) rename src/{components => elements}/train/train-blocked-passage/train-blocked-passage.ts (100%) rename src/{components => elements}/train/train-formation.ts (100%) rename src/{components => elements}/train/train-formation/__snapshots__/train-formation.spec.snap.js (100%) rename src/{components => elements}/train/train-formation/readme.md (100%) rename src/{components => elements}/train/train-formation/train-formation.e2e.ts (100%) rename src/{components => elements}/train/train-formation/train-formation.scss (100%) rename src/{components => elements}/train/train-formation/train-formation.spec.ts (100%) rename src/{components => elements}/train/train-formation/train-formation.stories.ts (99%) rename src/{components => elements}/train/train-formation/train-formation.ts (100%) rename src/{components => elements}/train/train-wagon.ts (100%) rename src/{components => elements}/train/train-wagon/__snapshots__/train-wagon.spec.snap.js (100%) rename src/{components => elements}/train/train-wagon/readme.md (100%) rename src/{components => elements}/train/train-wagon/train-wagon.e2e.ts (100%) rename src/{components => elements}/train/train-wagon/train-wagon.scss (100%) rename src/{components => elements}/train/train-wagon/train-wagon.spec.ts (100%) rename src/{components => elements}/train/train-wagon/train-wagon.stories.ts (98%) rename src/{components => elements}/train/train-wagon/train-wagon.ts (100%) rename src/{components => elements}/train/train.ts (100%) rename src/{components => elements}/train/train/__snapshots__/train.spec.snap.js (100%) rename src/{components => elements}/train/train/readme.md (100%) rename src/{components => elements}/train/train/train.e2e.ts (100%) rename src/{components => elements}/train/train/train.scss (100%) rename src/{components => elements}/train/train/train.spec.ts (100%) rename src/{components => elements}/train/train/train.stories.ts (97%) rename src/{components => elements}/train/train/train.ts (100%) rename src/{components => elements}/tsconfig.json (88%) rename src/{components => elements}/tsconfig.spec.json (100%) rename src/{components => elements}/visual-checkbox.ts (100%) rename src/{components => elements}/visual-checkbox/__snapshots__/visual-checkbox.spec.snap.js (100%) rename src/{components => elements}/visual-checkbox/readme.md (83%) rename src/{components => elements}/visual-checkbox/visual-checkbox.e2e.ts (100%) rename src/{components => elements}/visual-checkbox/visual-checkbox.scss (100%) rename src/{components => elements}/visual-checkbox/visual-checkbox.spec.ts (100%) rename src/{components => elements}/visual-checkbox/visual-checkbox.stories.ts (100%) rename src/{components => elements}/visual-checkbox/visual-checkbox.ts (100%) rename src/{components => elements}/vite.config.ts (96%) diff --git a/.github/workflows/continuous-integration.yml b/.github/workflows/continuous-integration.yml index 5c749390fd..d5664b017e 100644 --- a/.github/workflows/continuous-integration.yml +++ b/.github/workflows/continuous-integration.yml @@ -154,7 +154,7 @@ jobs: exitZeroOnChanges: true zip: true onlyChanged: true - externals: '**/components/core/styles/**/*.scss' + externals: '**/elements/core/styles/**/*.scss' visual-regression: runs-on: ubuntu-latest diff --git a/.storybook/preview.ts b/.storybook/preview.ts index 6ddd083016..926a317294 100644 --- a/.storybook/preview.ts +++ b/.storybook/preview.ts @@ -6,7 +6,7 @@ import { html } from 'lit'; import { withBackgroundDecorator } from '../src/storybook/testing/with-background-decorator.js'; -import '../src/components/core/styles/standard-theme.scss'; +import '../src/elements/core/styles/standard-theme.scss'; const getViewportName = (key: string): string => key.replace(/(^SbbBreakpoint|Min$)/g, '').toLowerCase(); @@ -66,7 +66,7 @@ const parameters: Parameters = { storySort: { // Story section order. // https://storybook.js.org/docs/react/writing-stories/naming-components-and-hierarchy#sorting-stories - order: ['introduction', 'pages', 'components', 'experimental', 'styles', 'internals'], + order: ['introduction', 'pages', 'elements', 'experimental', 'styles', 'internals'], }, }, }; diff --git a/docs/CODING_STANDARDS.md b/docs/CODING_STANDARDS.md index 6be5400d46..53dd51f417 100644 --- a/docs/CODING_STANDARDS.md +++ b/docs/CODING_STANDARDS.md @@ -443,7 +443,7 @@ For this purpose we provide the `hostContext(selector: string, base: Element): E function, which returns the closest match or null, if no match is found. This can be used in the `connectedCallback()` (see -[Lit Lifecycle](https://lit.dev/docs/components/lifecycle/)) method of a component, +[Lit Lifecycle](https://lit.dev/docs/elements/lifecycle/)) method of a component, which should minimize the performance impact of this detection. **Usages of this functionality should be carefully considered. If a component has too many variants @@ -507,7 +507,7 @@ Also define CSS variables in :host. #### Use/Check existing CSS variables and SCSS mixins/functions The `@sbb-esta/lyne-design-tokens` package provides global design tokens/CSS variables, -which are used/configured in our code base (see `src/components/core/styles/core/variables.scss`). +which are used/configured in our code base (see `src/elements/core/styles/core/variables.scss`). Use these variables instead of the original ones and only define new variables for components. If a global variable is missing, create an issue or pull request in diff --git a/docs/CONTRIBUTING.md b/docs/CONTRIBUTING.md index 4499e98374..d378138180 100644 --- a/docs/CONTRIBUTING.md +++ b/docs/CONTRIBUTING.md @@ -39,12 +39,12 @@ Providing the following information will increase the chances of your issue being dealt with quickly: - **Overview of the Issue** - if an error is being thrown a non-minified stack trace helps -- **@sbb-esta/lyne-components Version** - which version is affected +- **@sbb-esta/lyne-elements Version** - which version is affected - **Motivation for or Use Case** - explain what are you trying to do and why the current behavior is a bug for you - **Browsers and Operating System** - is this a problem with all browsers? - **Reproduce the Error** - provide a live example (using StackBlitz or similar) or an unambiguous set of steps -- **Screenshots** - Due to the visual nature of @sbb-esta/lyne-components, screenshots can help the team +- **Screenshots** - Due to the visual nature of @sbb-esta/lyne-elements, screenshots can help the team triage issues far more quickly than a text description. - **Related Issues** - has a similar issue been reported before? - **Suggest a Fix** - if you can't fix the bug yourself, perhaps you can point to what might be @@ -172,7 +172,7 @@ The rest of the commit message is then used for this. This project publishes the following package: -- @sbb-esta/lyne-components +- @sbb-esta/lyne-elements ### Styling diff --git a/docs/DEVELOPER.md b/docs/DEVELOPER.md index 10c12f61e2..a8def72b76 100644 --- a/docs/DEVELOPER.md +++ b/docs/DEVELOPER.md @@ -21,11 +21,11 @@ Run `yarn lint --fix` to fix any automatically fixable lint issues and report th ## Outputs -| Folder | Explanation | -| ----------------- | ------------------------------------- | -| ./dist/components | main output target for web-components | -| ./dist/react | output target for the react library | -| ./dist/storybook | rendered static storybook site | +| Folder | Explanation | +| ---------------- | ------------------------------------- | +| ./dist/elements | main output target for web-components | +| ./dist/react | output target for the react library | +| ./dist/storybook | rendered static storybook site | ## Running tests diff --git a/docs/GETTING_STARTED.md b/docs/GETTING_STARTED.md index 7d3d2befbe..7a424ea564 100644 --- a/docs/GETTING_STARTED.md +++ b/docs/GETTING_STARTED.md @@ -7,29 +7,29 @@ Select your technology to get started.
Plain Javascript -1. Install the `@sbb-esta/lyne-components` package: +1. Install the `@sbb-esta/lyne-elements` package: ```sh - npm install --save @sbb-esta/lyne-components + npm install --save @sbb-esta/lyne-elements ``` or, if using yarn: ```sh - yarn add @sbb-esta/lyne-components + yarn add @sbb-esta/lyne-elements ``` 2. Including global styles is strongly recommended to apply all SBB styles to your application. See [styles](#styles) section if you prefer more granularity on what to import. ```css - @import 'node_modules/@sbb-esta/lyne-components/standard-theme.css'; + @import 'node_modules/@sbb-esta/lyne-elements/standard-theme.css'; ``` 3. Import the desired element and add it to globalThis: ```ts - import { SbbButtonElement } from '@sbb-esta/lyne-components/button.js'; + import { SbbButtonElement } from '@sbb-esta/lyne-elements/button.js'; globalThis.SbbButtonElement = SbbButtonElement; ``` @@ -43,16 +43,16 @@ Select your technology to get started. > However, it's already possible to use Lyne Components in Angular. 1. Install Angular CLI, see [Angular CLI documentation](https://cli.angular.io/) -2. Install the `@sbb-esta/lyne-components` package: +2. Install the `@sbb-esta/lyne-elements` package: ```sh - npm install --save @sbb-esta/lyne-components + npm install --save @sbb-esta/lyne-elements ``` or, if using yarn: ```sh - yarn add @sbb-esta/lyne-components + yarn add @sbb-esta/lyne-elements ``` 3. Including global styles is strongly recommended to apply all SBB styles to your application. @@ -60,7 +60,7 @@ Select your technology to get started. Importing stylsheets is doable by editing the `styles.(s)css`: ```css - @import 'node_modules/@sbb-esta/lyne-components/standard-theme.css'; + @import 'node_modules/@sbb-esta/lyne-elements/standard-theme.css'; ``` or editing your `angular.json`: @@ -69,7 +69,7 @@ Select your technology to get started. ... "styles": [ "src/styles.scss", - "node_modules/@sbb-esta/lyne-components/standard-theme.css" + "node_modules/@sbb-esta/lyne-elements/standard-theme.css" ], ... ``` @@ -82,7 +82,7 @@ Select your technology to get started. import { CUSTOM_ELEMENTS_SCHEMA, Component } from '@angular/core'; import { bootstrapApplication } from '@angular/platform-browser'; -import '@sbb-esta/lyne-components/button.js'; +import '@sbb-esta/lyne-elements/button.js'; @Component({ selector: 'my-app', @@ -101,23 +101,23 @@ bootstrapApplication(App).catch((err) => console.error(err)); React/Next.js 1. Prepare a React and Next.js setup. -2. Install the `@sbb-esta/lyne-components-react` package: +2. Install the `@sbb-esta/lyne-react` package: ```sh - npm install --save @sbb-esta/lyne-components-react + npm install --save @sbb-esta/lyne-react ``` or, if using yarn: ```sh - yarn add @sbb-esta/lyne-components-react + yarn add @sbb-esta/lyne-react ``` 3. Including global styles is strongly recommended to apply all SBB styles to your application. See [styles](#styles) section if you prefer more granularity on what to import. ```css - @import '~@sbb-esta/lyne-components/standard-theme.css'; + @import '~@sbb-esta/lyne-elements/standard-theme.css'; ``` 4. Enhance the `transpilePackages` array in Next.Js config. @@ -126,8 +126,8 @@ bootstrapApplication(App).catch((err) => console.error(err)); module.exports = { ..., transpilePackages: [ - '@sbb-esta/lyne-components-react', - '@sbb-esta/lyne-components', + '@sbb-esta/lyne-react', + '@sbb-esta/lyne-elements', '@lit/react', '@lit/reactive-element', 'lit', @@ -147,8 +147,8 @@ bootstrapApplication(App).catch((err) => console.error(err)); module.exports = withLitSSR({ ..., transpilePackages: [ - '@sbb-esta/lyne-components', - '@sbb-esta/lyne-components-react', + '@sbb-esta/lyne-elements', + '@sbb-esta/lyne-react', '@sbb-esta/lyne-design-tokens', '@lit-labs/nextjs', '@lit-labs/ssr', @@ -165,18 +165,18 @@ bootstrapApplication(App).catch((err) => console.error(err)); 6. Import and use lyne component: ```tsx - import { SbbButton } from '@sbb-esta/lyne-components-react/button'; + import { SbbButton } from '@sbb-esta/lyne-react/button'; export default function MyComponent() { return {}}>; } ``` - Whenever e.g. types are needed, they can be imported directly from the `@sbb-esta/lyne-components` package: + Whenever e.g. types are needed, they can be imported directly from the `@sbb-esta/lyne-elements` package: ```tsx - import type { SbbButtonSize } from '@sbb-esta/lyne-components/button.js'; - import { SbbButton } from '@sbb-esta/lyne-components-react/button'; + import type { SbbButtonSize } from '@sbb-esta/lyne-elements/button.js'; + import { SbbButton } from '@sbb-esta/lyne-react/button'; export default function MyComponent() { const size: SbbButtonSize = 'm'; @@ -219,19 +219,19 @@ The `standard-theme.css` (or `core.css`) file only contains a subset of the `SBB For including the full fontset, we provide the `font-characters-extension.css` file which can be added after the `standard-theme.css` (or `core.css`) file. ```css -@import '@sbb-esta/lyne-components/standard-theme.css'; -@import '@sbb-esta/lyne-components/font-characters-extension.css'; +@import '@sbb-esta/lyne-elements/standard-theme.css'; +@import '@sbb-esta/lyne-elements/font-characters-extension.css'; ``` ### Design Tokens -The `@sbb-esta/lyne-components` package provides the CSS variable design tokens +The `@sbb-esta/lyne-elements` package provides the CSS variable design tokens from `@sbb-esta/lyne-design-tokens` in the `standard-theme.css` (or `core.css`). > If you have to use design tokens within a javascript context, > please also add `@sbb-esta/lyne-design-tokens` package to your project. -Please check `node_modules/@sbb-esta/lyne-components/standard-theme.css` for available design tokens. +Please check `node_modules/@sbb-esta/lyne-elements/standard-theme.css` for available design tokens. #### How to work with design tokens @@ -248,7 +248,7 @@ Lyne Components provides various SASS mixins which can be used by consumers. For available SASS mixins, check [SASS Mixins](https://github.com/sbb-design-systems/lyne-components/tree/main/src/components/core/styles/mixins). ```scss -@use '@sbb-esta/lyne-components' as sbb; +@use '@sbb-esta/lyne-elements' as sbb; .my-class { @include sbb.grid-base; @@ -352,7 +352,7 @@ See [Text styles](https://lyne-storybook.app.sbb.ch/?path=/docs/styles-typograph ``` ```scss -@use '@sbb-esta/lyne-components' as sbb; +@use '@sbb-esta/lyne-elements' as sbb; p { @include sbb.text-s--bold; diff --git a/package.json b/package.json index 3b4c08fcc8..ef650d6676 100644 --- a/package.json +++ b/package.json @@ -1,5 +1,5 @@ { - "name": "@sbb-esta/lyne-components", + "name": "@sbb-esta/lyne-elements", "version": "0.51.1", "description": "Lyne Design System", "keywords": [ @@ -21,9 +21,9 @@ "private": true, "scripts": { "postinstall": "yarn playwright install", - "build:components": "npm-run-all --sequential build:components:* build:elements-experimental:*", - "build:components:production": "vite build --config src/components/vite.config.ts", - "build:components:development": "NODE_ENV=development vite build --mode development --config src/components/vite.config.ts", + "build:elements": "npm-run-all --sequential build:elements:* build:elements-experimental:*", + "build:elements:production": "vite build --config src/elements/vite.config.ts", + "build:elements:development": "NODE_ENV=development vite build --mode development --config src/elements/vite.config.ts", "build:elements-experimental:production": "vite build --config src/elements-experimental/vite.config.ts", "build:elements-experimental:development": "NODE_ENV=development vite build --mode development --config src/elements-experimental/vite.config.ts", "build:react": "npm-run-all --sequential build:react:* build:react-experimental:*", @@ -33,7 +33,7 @@ "build:react-experimental:development": "NODE_ENV=development vite build --mode development --config src/react/experimental-vite.config.ts", "build:storybook": "storybook build --quiet --output-dir dist/storybook --stats-json", "build:visual-regression-app": "vite build --config src/visual-regression-app/vite.config.ts", - "build": "npm-run-all --sequential build:components build:react build:storybook", + "build": "npm-run-all --sequential build:elements build:react build:storybook", "docs": "npm-run-all --sequential docs:manifest docs:to-md", "docs:manifest": "custom-elements-manifest analyze --config tools/manifest/custom-elements-manifest.config.js", "docs:to-md": "tsx scripts/docs_generate.ts", @@ -50,10 +50,10 @@ "lint:lit": "yarn lit-analyzer \"src/**/*.ts\"", "lint:circular-imports": "madge --circular --ts-config ./tsconfig.json --extensions ts ./src", "lint:tsc": "npm-run-all --sequential lint:tsc:*", - "lint:tsc:components": "tsc --noEmit --project src/components/tsconfig.json", - "lint:tsc:components-spec": "tsc --noEmit --project src/components/tsconfig.spec.json", - "lint:tsc:experimental": "tsc --noEmit --project src/elements-experimental/tsconfig.json", - "lint:tsc:experimental-spec": "tsc --noEmit --project src/elements-experimental/tsconfig.spec.json", + "lint:tsc:components": "tsc --noEmit --project src/elements/tsconfig.json", + "lint:tsc:components-spec": "tsc --noEmit --project src/elements/tsconfig.spec.json", + "lint:tsc:components-experimental": "tsc --noEmit --project src/elements-experimental/tsconfig.json", + "lint:tsc:components-experimental-spec": "tsc --noEmit --project src/elements-experimental/tsconfig.spec.json", "lint:tsc:visual-regression-app": "tsc --noEmit --project src/visual-regression-app/tsconfig.json", "start": "storybook dev -p 6006", "start:visual-regression-app": "vite --config src/visual-regression-app/vite.config.ts", diff --git a/scripts/docs_generate.ts b/scripts/docs_generate.ts index 20467b5924..0c8108f853 100644 --- a/scripts/docs_generate.ts +++ b/scripts/docs_generate.ts @@ -20,7 +20,7 @@ import componentAnalyzerConfig from '../tools/manifest/custom-elements-manifest. const manifestFilePath = `${componentAnalyzerConfig.outdir}/custom-elements.json`; const tempFolderPath = './dist/docs'; -const componentsFolder = './src'; +const componentsFolder = './src/elements'; const inheritedFromColumnIndex = 6; const propertyColumnIndex = 1; const attributeColumnIndex = 2; diff --git a/scripts/migrate-index.ts b/scripts/migrate-index.ts index 0ccbcd4de0..45a01ef453 100644 --- a/scripts/migrate-index.ts +++ b/scripts/migrate-index.ts @@ -4,7 +4,7 @@ import { basename, dirname } from 'path'; import * as glob from 'glob'; const indexFiles = glob.sync('**/index.ts', { - cwd: dirname(import.meta.resolve('../src/components')), + cwd: dirname(import.meta.resolve('../src/elements')), absolute: true, }); for (const indexFile of indexFiles) { diff --git a/scripts/migrate-ssr-e2e.ts b/scripts/migrate-ssr-e2e.ts index a3e1e8a6c3..63fd9641c0 100644 --- a/scripts/migrate-ssr-e2e.ts +++ b/scripts/migrate-ssr-e2e.ts @@ -22,11 +22,11 @@ function* iterate(node: ts.Node): Generator { } } -const testingDir = new URL('../src/components/core/testing', import.meta.url).pathname; +const testingDir = new URL('../src/elements/core/testing', import.meta.url).pathname; const e2eFiles = glob.sync('**/*.e2e.ts', { cwd: new URL('..', import.meta.url), absolute: true }); const componentIndexes = glob - .sync('src/components/**/index.ts', { cwd: new URL('..', import.meta.url), absolute: true }) - .filter((f) => !f.includes('/components/core/')) + .sync('src/elements/**/index.ts', { cwd: new URL('..', import.meta.url), absolute: true }) + .filter((f) => !f.includes('/elements/core/')) .sort() .sort((a, b) => b.length - a.length); for (const file of e2eFiles) { diff --git a/scripts/migrate-toggle-data-entry.ts b/scripts/migrate-toggle-data-entry.ts index e47405b523..320f072a6e 100644 --- a/scripts/migrate-toggle-data-entry.ts +++ b/scripts/migrate-toggle-data-entry.ts @@ -25,7 +25,7 @@ function toKebabCase(str: string): string { // custom ignores can be done like this, for example by saying // you'll ignore all markdown files, and all folders named 'docs' -const sources = glob.sync('src/components/**/*.ts', { +const sources = glob.sync('src/elements/**/*.ts', { cwd: new URL('..', import.meta.url), absolute: true, ignore: { diff --git a/src/elements-experimental/core/timetable/access-leg-helper.ts b/src/elements-experimental/core/timetable/access-leg-helper.ts index 15dabd9c4d..fe638ffa10 100644 --- a/src/elements-experimental/core/timetable/access-leg-helper.ts +++ b/src/elements-experimental/core/timetable/access-leg-helper.ts @@ -3,7 +3,7 @@ import { i18nWalkingDistanceArrival, i18nWalkingDistanceDeparture, -} from '@sbb-esta/lyne-components/core/i18n.js'; +} from '@sbb-esta/lyne-elements/core/i18n.js'; import type { TemplateResult } from 'lit'; import { html, nothing } from 'lit'; @@ -14,7 +14,7 @@ import { } from './timetable-helper.js'; import type { Leg, PtConnectionLeg, PtRideLeg } from './timetable-properties.js'; -import '@sbb-esta/lyne-components/icon.js'; +import '@sbb-esta/lyne-elements/icon.js'; interface IAccessAttribute { duration: number; diff --git a/src/elements-experimental/journey-summary/journey-summary.e2e.ts b/src/elements-experimental/journey-summary/journey-summary.e2e.ts index 4681abba24..15b14182da 100644 --- a/src/elements-experimental/journey-summary/journey-summary.e2e.ts +++ b/src/elements-experimental/journey-summary/journey-summary.e2e.ts @@ -1,5 +1,5 @@ import { assert } from '@open-wc/testing'; -import { fixture } from '@sbb-esta/lyne-components/core/testing/private.js'; +import { fixture } from '@sbb-esta/lyne-elements/core/testing/private.js'; import { html } from 'lit/static-html.js'; import { SbbJourneySummaryElement } from './journey-summary.js'; diff --git a/src/elements-experimental/journey-summary/journey-summary.scss b/src/elements-experimental/journey-summary/journey-summary.scss index 128579cf50..c9ccadd89e 100644 --- a/src/elements-experimental/journey-summary/journey-summary.scss +++ b/src/elements-experimental/journey-summary/journey-summary.scss @@ -1,4 +1,4 @@ -@use '@sbb-esta/lyne-components/core/styles' as sbb; +@use '@sbb-esta/lyne-elements/core/styles' as sbb; // Box-sizing rules contained in typography are not traversing Shadow DOM boundaries. We need to include box-sizing mixin in every component. @include sbb.box-sizing; diff --git a/src/elements-experimental/journey-summary/journey-summary.spec.ts b/src/elements-experimental/journey-summary/journey-summary.spec.ts index fca3372592..9a6a19fe9f 100644 --- a/src/elements-experimental/journey-summary/journey-summary.spec.ts +++ b/src/elements-experimental/journey-summary/journey-summary.spec.ts @@ -1,6 +1,6 @@ import { expect } from '@open-wc/testing'; -import { fixture } from '@sbb-esta/lyne-components/core/testing/private.js'; -import { waitForLitRender } from '@sbb-esta/lyne-components/core/testing.js'; +import { fixture } from '@sbb-esta/lyne-elements/core/testing/private.js'; +import { waitForLitRender } from '@sbb-esta/lyne-elements/core/testing.js'; import { html } from 'lit/static-html.js'; import type { diff --git a/src/elements-experimental/journey-summary/journey-summary.stories.ts b/src/elements-experimental/journey-summary/journey-summary.stories.ts index db3562416d..204f27cae6 100644 --- a/src/elements-experimental/journey-summary/journey-summary.stories.ts +++ b/src/elements-experimental/journey-summary/journey-summary.stories.ts @@ -16,8 +16,8 @@ import { import readme from './readme.md?raw'; import './journey-summary.js'; -import '@sbb-esta/lyne-components/button/button.js'; -import '@sbb-esta/lyne-components/button/secondary-button.js'; +import '@sbb-esta/lyne-elements/button/button.js'; +import '@sbb-esta/lyne-elements/button/secondary-button.js'; const disableAnimation: InputType = { control: { diff --git a/src/elements-experimental/journey-summary/journey-summary.ts b/src/elements-experimental/journey-summary/journey-summary.ts index d9c7c7565f..a3a9373dab 100644 --- a/src/elements-experimental/journey-summary/journey-summary.ts +++ b/src/elements-experimental/journey-summary/journey-summary.ts @@ -1,12 +1,12 @@ -import { SbbLanguageController } from '@sbb-esta/lyne-components/core/controllers.js'; +import { SbbLanguageController } from '@sbb-esta/lyne-elements/core/controllers.js'; import { defaultDateAdapter, durationToTime, removeTimezoneFromISOTimeString, readDataNow, -} from '@sbb-esta/lyne-components/core/datetime.js'; -import { i18nTripDuration } from '@sbb-esta/lyne-components/core/i18n.js'; -import type { SbbTitleLevel } from '@sbb-esta/lyne-components/title.js'; +} from '@sbb-esta/lyne-elements/core/datetime.js'; +import { i18nTripDuration } from '@sbb-esta/lyne-elements/core/i18n.js'; +import type { SbbTitleLevel } from '@sbb-esta/lyne-elements/title.js'; import { format, isValid } from 'date-fns'; import type { CSSResultGroup, TemplateResult } from 'lit'; import { html, LitElement, nothing } from 'lit'; @@ -16,9 +16,9 @@ import type { Leg } from '../core/timetable.js'; import style from './journey-summary.scss?lit&inline'; -import '@sbb-esta/lyne-components/divider.js'; -import '@sbb-esta/lyne-components/screen-reader-only.js'; -import '@sbb-esta/lyne-components/journey-header.js'; +import '@sbb-esta/lyne-elements/divider.js'; +import '@sbb-esta/lyne-elements/screen-reader-only.js'; +import '@sbb-esta/lyne-elements/journey-header.js'; import '../pearl-chain-time.js'; export interface InterfaceSbbJourneySummaryAttributes { diff --git a/src/elements-experimental/package.json b/src/elements-experimental/package.json index 32927386fe..c16d372b29 100644 --- a/src/elements-experimental/package.json +++ b/src/elements-experimental/package.json @@ -11,7 +11,7 @@ "type": "module", "customElements": "custom-elements.json", "peerDependencies": { - "@sbb-esta/lyne-components": "0.0.0-PLACEHOLDER" + "@sbb-esta/lyne-elements": "0.0.0-PLACEHOLDER" }, "dependencies": { "lit": "0.0.0-LIT" diff --git a/src/elements-experimental/pearl-chain-time/pearl-chain-time.scss b/src/elements-experimental/pearl-chain-time/pearl-chain-time.scss index 2beeb1ac11..81f8405e6a 100644 --- a/src/elements-experimental/pearl-chain-time/pearl-chain-time.scss +++ b/src/elements-experimental/pearl-chain-time/pearl-chain-time.scss @@ -1,4 +1,4 @@ -@use '@sbb-esta/lyne-components/core/styles' as sbb; +@use '@sbb-esta/lyne-elements/core/styles' as sbb; // Box-sizing rules contained in typography are not traversing Shadow DOM boundaries. We need to include box-sizing mixin in every component. @include sbb.box-sizing; diff --git a/src/elements-experimental/pearl-chain-time/pearl-chain-time.spec.ts b/src/elements-experimental/pearl-chain-time/pearl-chain-time.spec.ts index b7a8ec6c36..0d5d9b730d 100644 --- a/src/elements-experimental/pearl-chain-time/pearl-chain-time.spec.ts +++ b/src/elements-experimental/pearl-chain-time/pearl-chain-time.spec.ts @@ -1,6 +1,6 @@ import { expect } from '@open-wc/testing'; -import { fixture } from '@sbb-esta/lyne-components/core/testing/private.js'; -import { waitForLitRender } from '@sbb-esta/lyne-components/core/testing.js'; +import { fixture } from '@sbb-esta/lyne-elements/core/testing/private.js'; +import { waitForLitRender } from '@sbb-esta/lyne-elements/core/testing.js'; import { html } from 'lit/static-html.js'; import type { PtRideLeg } from '../core/timetable.js'; diff --git a/src/elements-experimental/pearl-chain-time/pearl-chain-time.ts b/src/elements-experimental/pearl-chain-time/pearl-chain-time.ts index 7c8c07fcbe..509795939e 100644 --- a/src/elements-experimental/pearl-chain-time/pearl-chain-time.ts +++ b/src/elements-experimental/pearl-chain-time/pearl-chain-time.ts @@ -1,13 +1,13 @@ -import { SbbLanguageController } from '@sbb-esta/lyne-components/core/controllers.js'; +import { SbbLanguageController } from '@sbb-esta/lyne-elements/core/controllers.js'; import { readDataNow, removeTimezoneFromISOTimeString, -} from '@sbb-esta/lyne-components/core/datetime.js'; +} from '@sbb-esta/lyne-elements/core/datetime.js'; import { i18nArrival, i18nDeparture, i18nTransferProcedures, -} from '@sbb-esta/lyne-components/core/i18n.js'; +} from '@sbb-esta/lyne-elements/core/i18n.js'; import { format } from 'date-fns'; import type { CSSResultGroup, TemplateResult } from 'lit'; import { html, LitElement, nothing } from 'lit'; diff --git a/src/elements-experimental/pearl-chain-vertical-item/pearl-chain-vertical-item.scss b/src/elements-experimental/pearl-chain-vertical-item/pearl-chain-vertical-item.scss index c14eeb7ffd..f7d3a98850 100644 --- a/src/elements-experimental/pearl-chain-vertical-item/pearl-chain-vertical-item.scss +++ b/src/elements-experimental/pearl-chain-vertical-item/pearl-chain-vertical-item.scss @@ -1,4 +1,4 @@ -@use '@sbb-esta/lyne-components/core/styles' as sbb; +@use '@sbb-esta/lyne-elements/core/styles' as sbb; // Box-sizing rules contained in typography are not traversing Shadow DOM boundaries. We need to include box-sizing mixin in every component. @include sbb.box-sizing; diff --git a/src/elements-experimental/pearl-chain-vertical-item/pearl-chain-vertical-item.spec.ts b/src/elements-experimental/pearl-chain-vertical-item/pearl-chain-vertical-item.spec.ts index 9945d3a1d9..6e5553b26d 100644 --- a/src/elements-experimental/pearl-chain-vertical-item/pearl-chain-vertical-item.spec.ts +++ b/src/elements-experimental/pearl-chain-vertical-item/pearl-chain-vertical-item.spec.ts @@ -1,6 +1,6 @@ import { expect } from '@open-wc/testing'; -import { fixture } from '@sbb-esta/lyne-components/core/testing/private.js'; -import { waitForLitRender } from '@sbb-esta/lyne-components/core/testing.js'; +import { fixture } from '@sbb-esta/lyne-elements/core/testing/private.js'; +import { waitForLitRender } from '@sbb-esta/lyne-elements/core/testing.js'; import { html } from 'lit/static-html.js'; import type { LineColor, SbbPearlChainVerticalItemElement } from './pearl-chain-vertical-item.js'; diff --git a/src/elements-experimental/pearl-chain-vertical/pearl-chain-vertical.e2e.ts b/src/elements-experimental/pearl-chain-vertical/pearl-chain-vertical.e2e.ts index 7d2ced97ed..8f5ec92eaf 100644 --- a/src/elements-experimental/pearl-chain-vertical/pearl-chain-vertical.e2e.ts +++ b/src/elements-experimental/pearl-chain-vertical/pearl-chain-vertical.e2e.ts @@ -1,5 +1,5 @@ import { assert } from '@open-wc/testing'; -import { fixture } from '@sbb-esta/lyne-components/core/testing/private.js'; +import { fixture } from '@sbb-esta/lyne-elements/core/testing/private.js'; import { html } from 'lit/static-html.js'; import { SbbPearlChainVerticalElement } from './pearl-chain-vertical.js'; diff --git a/src/elements-experimental/pearl-chain-vertical/pearl-chain-vertical.scss b/src/elements-experimental/pearl-chain-vertical/pearl-chain-vertical.scss index f799a5f934..476ab27f70 100644 --- a/src/elements-experimental/pearl-chain-vertical/pearl-chain-vertical.scss +++ b/src/elements-experimental/pearl-chain-vertical/pearl-chain-vertical.scss @@ -1,4 +1,4 @@ -@use '@sbb-esta/lyne-components/core/styles' as sbb; +@use '@sbb-esta/lyne-elements/core/styles' as sbb; // Box-sizing rules contained in typography are not traversing Shadow DOM boundaries. We need to include box-sizing mixin in every component. @include sbb.box-sizing; diff --git a/src/elements-experimental/pearl-chain-vertical/pearl-chain-vertical.spec.ts b/src/elements-experimental/pearl-chain-vertical/pearl-chain-vertical.spec.ts index c2208add3d..06f015e91c 100644 --- a/src/elements-experimental/pearl-chain-vertical/pearl-chain-vertical.spec.ts +++ b/src/elements-experimental/pearl-chain-vertical/pearl-chain-vertical.spec.ts @@ -1,6 +1,6 @@ import { expect } from '@open-wc/testing'; -import { fixture } from '@sbb-esta/lyne-components/core/testing/private.js'; -import { waitForLitRender } from '@sbb-esta/lyne-components/core/testing.js'; +import { fixture } from '@sbb-esta/lyne-elements/core/testing/private.js'; +import { waitForLitRender } from '@sbb-esta/lyne-elements/core/testing.js'; import { html } from 'lit/static-html.js'; import type { SbbPearlChainVerticalElement } from './pearl-chain-vertical.js'; diff --git a/src/elements-experimental/pearl-chain-vertical/pearl-chain-vertical.stories.ts b/src/elements-experimental/pearl-chain-vertical/pearl-chain-vertical.stories.ts index 37d2cd1791..e891d264b3 100644 --- a/src/elements-experimental/pearl-chain-vertical/pearl-chain-vertical.stories.ts +++ b/src/elements-experimental/pearl-chain-vertical/pearl-chain-vertical.stories.ts @@ -7,7 +7,7 @@ import { html } from 'lit'; import readme from './readme.md?raw'; import './pearl-chain-vertical.js'; import '../pearl-chain-vertical-item.js'; -import '@sbb-esta/lyne-components/icon.js'; +import '@sbb-esta/lyne-elements/icon.js'; const lineType: InputType = { options: ['dotted', 'standard', 'thin'], diff --git a/src/elements-experimental/pearl-chain/pearl-chain.e2e.ts b/src/elements-experimental/pearl-chain/pearl-chain.e2e.ts index 26d09e9369..cb69d71adf 100644 --- a/src/elements-experimental/pearl-chain/pearl-chain.e2e.ts +++ b/src/elements-experimental/pearl-chain/pearl-chain.e2e.ts @@ -1,5 +1,5 @@ import { assert } from '@open-wc/testing'; -import { fixture } from '@sbb-esta/lyne-components/core/testing/private.js'; +import { fixture } from '@sbb-esta/lyne-elements/core/testing/private.js'; import { html } from 'lit/static-html.js'; import { SbbPearlChainElement } from './pearl-chain.js'; diff --git a/src/elements-experimental/pearl-chain/pearl-chain.scss b/src/elements-experimental/pearl-chain/pearl-chain.scss index 3293654d8f..31b394c782 100644 --- a/src/elements-experimental/pearl-chain/pearl-chain.scss +++ b/src/elements-experimental/pearl-chain/pearl-chain.scss @@ -1,4 +1,4 @@ -@use '@sbb-esta/lyne-components/core/styles' as sbb; +@use '@sbb-esta/lyne-elements/core/styles' as sbb; @mixin sbb-pearl-chain-dotted { background-color: unset; diff --git a/src/elements-experimental/pearl-chain/pearl-chain.spec.ts b/src/elements-experimental/pearl-chain/pearl-chain.spec.ts index 3cfd582f17..ab6268fe3c 100644 --- a/src/elements-experimental/pearl-chain/pearl-chain.spec.ts +++ b/src/elements-experimental/pearl-chain/pearl-chain.spec.ts @@ -1,6 +1,6 @@ import { expect } from '@open-wc/testing'; -import { fixture } from '@sbb-esta/lyne-components/core/testing/private.js'; -import { waitForLitRender } from '@sbb-esta/lyne-components/core/testing.js'; +import { fixture } from '@sbb-esta/lyne-elements/core/testing/private.js'; +import { waitForLitRender } from '@sbb-esta/lyne-elements/core/testing.js'; import { html } from 'lit/static-html.js'; import type { PtRideLeg } from '../core/timetable.js'; diff --git a/src/elements-experimental/pearl-chain/pearl-chain.ts b/src/elements-experimental/pearl-chain/pearl-chain.ts index 3fb7f14b08..6986ad226d 100644 --- a/src/elements-experimental/pearl-chain/pearl-chain.ts +++ b/src/elements-experimental/pearl-chain/pearl-chain.ts @@ -1,7 +1,7 @@ import { readDataNow, removeTimezoneFromISOTimeString, -} from '@sbb-esta/lyne-components/core/datetime.js'; +} from '@sbb-esta/lyne-elements/core/datetime.js'; import { differenceInMinutes, isAfter, isBefore } from 'date-fns'; import type { CSSResultGroup, TemplateResult } from 'lit'; import { html, LitElement, nothing } from 'lit'; diff --git a/src/elements-experimental/timetable-duration/timetable-duration.e2e.ts b/src/elements-experimental/timetable-duration/timetable-duration.e2e.ts index fd681e00f2..0851e386ca 100644 --- a/src/elements-experimental/timetable-duration/timetable-duration.e2e.ts +++ b/src/elements-experimental/timetable-duration/timetable-duration.e2e.ts @@ -1,5 +1,5 @@ import { assert } from '@open-wc/testing'; -import { fixture } from '@sbb-esta/lyne-components/core/testing/private/fixture'; +import { fixture } from '@sbb-esta/lyne-elements/core/testing/private/fixture'; import { html } from 'lit/static-html.js'; import { SbbTimetableDurationElement } from './timetable-duration.js'; diff --git a/src/elements-experimental/timetable-duration/timetable-duration.scss b/src/elements-experimental/timetable-duration/timetable-duration.scss index 289bbf019e..484b659873 100644 --- a/src/elements-experimental/timetable-duration/timetable-duration.scss +++ b/src/elements-experimental/timetable-duration/timetable-duration.scss @@ -1,4 +1,4 @@ -@use '@sbb-esta/lyne-components/core/styles' as sbb; +@use '@sbb-esta/lyne-elements/core/styles' as sbb; // Box-sizing rules contained in typography are not traversing Shadow DOM boundaries. We need to include box-sizing mixin in every component. @include sbb.box-sizing; diff --git a/src/elements-experimental/timetable-duration/timetable-duration.spec.ts b/src/elements-experimental/timetable-duration/timetable-duration.spec.ts index 9c3414fba9..05001ebe98 100644 --- a/src/elements-experimental/timetable-duration/timetable-duration.spec.ts +++ b/src/elements-experimental/timetable-duration/timetable-duration.spec.ts @@ -1,5 +1,5 @@ import { expect } from '@open-wc/testing'; -import { fixture } from '@sbb-esta/lyne-components/core/testing/private/fixture'; +import { fixture } from '@sbb-esta/lyne-elements/core/testing/private/fixture'; import { html } from 'lit/static-html.js'; import sampleData from './timetable-duration.sample-data.js'; diff --git a/src/elements-experimental/timetable-duration/timetable-duration.ts b/src/elements-experimental/timetable-duration/timetable-duration.ts index 5f7943fc92..c6dcc0e03a 100644 --- a/src/elements-experimental/timetable-duration/timetable-duration.ts +++ b/src/elements-experimental/timetable-duration/timetable-duration.ts @@ -1,5 +1,5 @@ -import { SbbLanguageController } from '@sbb-esta/lyne-components/core/controllers/language-controller.js'; -import { i18nDurationHour, i18nDurationMinute } from '@sbb-esta/lyne-components/core/i18n/i18n.js'; +import { SbbLanguageController } from '@sbb-esta/lyne-elements/core/controllers/language-controller.js'; +import { i18nDurationHour, i18nDurationMinute } from '@sbb-esta/lyne-elements/core/i18n/i18n.js'; import type { CSSResultGroup, TemplateResult } from 'lit'; import { html, LitElement } from 'lit'; import { customElement, property } from 'lit/decorators.js'; diff --git a/src/elements-experimental/timetable-row/timetable-row.e2e.ts b/src/elements-experimental/timetable-row/timetable-row.e2e.ts index 3ddf904ecb..f2e81b3642 100644 --- a/src/elements-experimental/timetable-row/timetable-row.e2e.ts +++ b/src/elements-experimental/timetable-row/timetable-row.e2e.ts @@ -1,7 +1,7 @@ import { assert, expect } from '@open-wc/testing'; -import { EventSpy, waitForCondition } from '@sbb-esta/lyne-components//core/testing.js'; -import type { SbbCardElement } from '@sbb-esta/lyne-components/card.js'; -import { fixture } from '@sbb-esta/lyne-components/core/testing/private.js'; +import type { SbbCardElement } from '@sbb-esta/lyne-elements/card.js'; +import { fixture } from '@sbb-esta/lyne-elements/core/testing/private.js'; +import { EventSpy, waitForCondition } from '@sbb-esta/lyne-elements/core/testing.js'; import { html } from 'lit/static-html.js'; import { SbbTimetableRowElement } from './timetable-row.js'; diff --git a/src/elements-experimental/timetable-row/timetable-row.scss b/src/elements-experimental/timetable-row/timetable-row.scss index 40503ba66d..d3bed41590 100644 --- a/src/elements-experimental/timetable-row/timetable-row.scss +++ b/src/elements-experimental/timetable-row/timetable-row.scss @@ -1,4 +1,4 @@ -@use '@sbb-esta/lyne-components/core/styles' as sbb; +@use '@sbb-esta/lyne-elements/core/styles' as sbb; // Box-sizing rules contained in typography are not traversing Shadow DOM boundaries. We need to include box-sizing mixin in every component. @include sbb.box-sizing; diff --git a/src/elements-experimental/timetable-row/timetable-row.spec.ts b/src/elements-experimental/timetable-row/timetable-row.spec.ts index 15cbe1920e..4098f3d001 100644 --- a/src/elements-experimental/timetable-row/timetable-row.spec.ts +++ b/src/elements-experimental/timetable-row/timetable-row.spec.ts @@ -1,6 +1,6 @@ import { expect } from '@open-wc/testing'; -import { fixture } from '@sbb-esta/lyne-components/core/testing/private.js'; -import { waitForLitRender } from '@sbb-esta/lyne-components/core/testing.js'; +import { fixture } from '@sbb-esta/lyne-elements/core/testing/private.js'; +import { waitForLitRender } from '@sbb-esta/lyne-elements/core/testing.js'; import { html } from 'lit/static-html.js'; import type { ITripItem, Notice, PtSituation } from '../core/timetable.js'; diff --git a/src/elements-experimental/timetable-row/timetable-row.ts b/src/elements-experimental/timetable-row/timetable-row.ts index 6fc71aeb37..943e377f32 100644 --- a/src/elements-experimental/timetable-row/timetable-row.ts +++ b/src/elements-experimental/timetable-row/timetable-row.ts @@ -1,10 +1,10 @@ -import { SbbLanguageController } from '@sbb-esta/lyne-components/core/controllers.js'; +import { SbbLanguageController } from '@sbb-esta/lyne-elements/core/controllers.js'; import { readDataNow, removeTimezoneFromISOTimeString, durationToTime, -} from '@sbb-esta/lyne-components/core/datetime.js'; -import { setOrRemoveAttribute } from '@sbb-esta/lyne-components/core/dom.js'; +} from '@sbb-esta/lyne-elements/core/datetime.js'; +import { setOrRemoveAttribute } from '@sbb-esta/lyne-elements/core/dom.js'; import { i18nArrival, i18nClass, @@ -22,8 +22,8 @@ import { i18nTravelhints, i18nTripDuration, i18nTripQuayChange, -} from '@sbb-esta/lyne-components/core/i18n.js'; -import type { SbbOccupancy } from '@sbb-esta/lyne-components/core/interfaces.js'; +} from '@sbb-esta/lyne-elements/core/i18n.js'; +import type { SbbOccupancy } from '@sbb-esta/lyne-elements/core/interfaces.js'; import { format } from 'date-fns'; import { html, LitElement, nothing } from 'lit'; import type { CSSResultGroup, PropertyValues, TemplateResult } from 'lit'; @@ -34,9 +34,9 @@ import type { ITripItem, Notice, PtRideLeg, PtSituation } from '../core/timetabl import style from './timetable-row.scss?lit&inline'; -import '@sbb-esta/lyne-components/card.js'; -import '@sbb-esta/lyne-components/icon.js'; -import '@sbb-esta/lyne-components/timetable-occupancy.js'; +import '@sbb-esta/lyne-elements/card.js'; +import '@sbb-esta/lyne-elements/icon.js'; +import '@sbb-esta/lyne-elements/timetable-occupancy.js'; import '../pearl-chain-time.js'; /** HimCus interface for mapped icon name and text */ diff --git a/src/elements-experimental/tsconfig.json b/src/elements-experimental/tsconfig.json index 6a66232074..a984026acb 100644 --- a/src/elements-experimental/tsconfig.json +++ b/src/elements-experimental/tsconfig.json @@ -4,7 +4,7 @@ "rootDir": "../..", "baseUrl": ".", "paths": { - "@sbb-esta/lyne-components/*": ["../components/*"], + "@sbb-esta/lyne-elements/*": ["../elements/*"], "@sbb-esta/lyne-elements-experimental/*": ["./*"] } }, diff --git a/src/elements-experimental/vite.config.ts b/src/elements-experimental/vite.config.ts index e2fea0cfb0..43037d9ea7 100644 --- a/src/elements-experimental/vite.config.ts +++ b/src/elements-experimental/vite.config.ts @@ -41,7 +41,7 @@ export default defineConfig((config) => }, }), copyAssets(['../../README.md']), - // verifyEntryPoints(), // TODO Must exclude @sbb-esta/lyne-components imports. Not sure it's possible + // verifyEntryPoints(), // TODO Must exclude @sbb-esta/lyne-elements imports. Not sure it's possible ] : []), ], @@ -62,7 +62,7 @@ export default defineConfig((config) => external: (source: string, importer: string | undefined) => { if ( source.match(/(^lit$|^lit\/|^@lit\/|^@lit-labs\/)/) || - source.match(/^@sbb-esta\/lyne-components\/?/) || + source.match(/^@sbb-esta\/lyne-elements\/?/) || (!!importer && source.startsWith('../') && !importer.includes('/node_modules/')) || (!!importer && barrelExports.includes(importer) && source.match(/\.\/[a-z-]+/)) ) { diff --git a/src/components/_index.scss b/src/elements/_index.scss similarity index 100% rename from src/components/_index.scss rename to src/elements/_index.scss diff --git a/src/components/accordion.ts b/src/elements/accordion.ts similarity index 100% rename from src/components/accordion.ts rename to src/elements/accordion.ts diff --git a/src/components/accordion/__snapshots__/accordion.spec.snap.js b/src/elements/accordion/__snapshots__/accordion.spec.snap.js similarity index 100% rename from src/components/accordion/__snapshots__/accordion.spec.snap.js rename to src/elements/accordion/__snapshots__/accordion.spec.snap.js diff --git a/src/components/accordion/accordion.e2e.ts b/src/elements/accordion/accordion.e2e.ts similarity index 100% rename from src/components/accordion/accordion.e2e.ts rename to src/elements/accordion/accordion.e2e.ts diff --git a/src/components/accordion/accordion.scss b/src/elements/accordion/accordion.scss similarity index 100% rename from src/components/accordion/accordion.scss rename to src/elements/accordion/accordion.scss diff --git a/src/components/accordion/accordion.spec.ts b/src/elements/accordion/accordion.spec.ts similarity index 100% rename from src/components/accordion/accordion.spec.ts rename to src/elements/accordion/accordion.spec.ts diff --git a/src/components/accordion/accordion.stories.ts b/src/elements/accordion/accordion.stories.ts similarity index 99% rename from src/components/accordion/accordion.stories.ts rename to src/elements/accordion/accordion.stories.ts index a8785ea0a4..f1451d0844 100644 --- a/src/components/accordion/accordion.stories.ts +++ b/src/elements/accordion/accordion.stories.ts @@ -256,7 +256,7 @@ const meta: Meta = { extractComponentDescription: () => readme, }, }, - title: 'components/sbb-accordion/sbb-accordion', + title: 'elements/sbb-accordion/sbb-accordion', }; export default meta; diff --git a/src/components/accordion/accordion.ts b/src/elements/accordion/accordion.ts similarity index 100% rename from src/components/accordion/accordion.ts rename to src/elements/accordion/accordion.ts diff --git a/src/components/accordion/readme.md b/src/elements/accordion/readme.md similarity index 96% rename from src/components/accordion/readme.md rename to src/elements/accordion/readme.md index 2176d3cb03..9f66cc4ea8 100644 --- a/src/components/accordion/readme.md +++ b/src/elements/accordion/readme.md @@ -1,5 +1,5 @@ The `sbb-accordion` is a component which acts as a container -for one or more [sbb-expansion-panel](/docs/components-sbb-accordion-sbb-expansion-panel--docs). +for one or more [sbb-expansion-panel](/docs/elements-sbb-accordion-sbb-expansion-panel--docs). ```html diff --git a/src/components/action-group.ts b/src/elements/action-group.ts similarity index 100% rename from src/components/action-group.ts rename to src/elements/action-group.ts diff --git a/src/components/action-group/__snapshots__/action-group.spec.snap.js b/src/elements/action-group/__snapshots__/action-group.spec.snap.js similarity index 100% rename from src/components/action-group/__snapshots__/action-group.spec.snap.js rename to src/elements/action-group/__snapshots__/action-group.spec.snap.js diff --git a/src/components/action-group/action-group.e2e.ts b/src/elements/action-group/action-group.e2e.ts similarity index 100% rename from src/components/action-group/action-group.e2e.ts rename to src/elements/action-group/action-group.e2e.ts diff --git a/src/components/action-group/action-group.scss b/src/elements/action-group/action-group.scss similarity index 100% rename from src/components/action-group/action-group.scss rename to src/elements/action-group/action-group.scss diff --git a/src/components/action-group/action-group.spec.ts b/src/elements/action-group/action-group.spec.ts similarity index 100% rename from src/components/action-group/action-group.spec.ts rename to src/elements/action-group/action-group.spec.ts diff --git a/src/components/action-group/action-group.stories.ts b/src/elements/action-group/action-group.stories.ts similarity index 99% rename from src/components/action-group/action-group.stories.ts rename to src/elements/action-group/action-group.stories.ts index df14d06a45..a7d463266b 100644 --- a/src/components/action-group/action-group.stories.ts +++ b/src/elements/action-group/action-group.stories.ts @@ -299,7 +299,7 @@ const meta: Meta = { extractComponentDescription: () => readme, }, }, - title: 'components/sbb-action-group', + title: 'elements/sbb-action-group', }; export default meta; diff --git a/src/components/action-group/action-group.ts b/src/elements/action-group/action-group.ts similarity index 100% rename from src/components/action-group/action-group.ts rename to src/elements/action-group/action-group.ts diff --git a/src/components/action-group/readme.md b/src/elements/action-group/readme.md similarity index 97% rename from src/components/action-group/readme.md rename to src/elements/action-group/readme.md index 1563c83b3d..b595fd7fa2 100644 --- a/src/components/action-group/readme.md +++ b/src/elements/action-group/readme.md @@ -1,5 +1,5 @@ The `sbb-action-group` component is a generic content container which can contain up to three action items -([sbb-button](/docs/components-sbb-button--docs) or [sbb-block-link](/docs/components-sbb-link-sbb-block-link--docs) or other HTML elements) +([sbb-button](/docs/elements-sbb-button--docs) or [sbb-block-link](/docs/elements-sbb-link-sbb-block-link--docs) or other HTML elements) in various [allocations](#allocations). ## Style diff --git a/src/components/alert.ts b/src/elements/alert.ts similarity index 100% rename from src/components/alert.ts rename to src/elements/alert.ts diff --git a/src/components/alert/alert-group.ts b/src/elements/alert/alert-group.ts similarity index 100% rename from src/components/alert/alert-group.ts rename to src/elements/alert/alert-group.ts diff --git a/src/components/alert/alert-group/__snapshots__/alert-group.spec.snap.js b/src/elements/alert/alert-group/__snapshots__/alert-group.spec.snap.js similarity index 100% rename from src/components/alert/alert-group/__snapshots__/alert-group.spec.snap.js rename to src/elements/alert/alert-group/__snapshots__/alert-group.spec.snap.js diff --git a/src/components/alert/alert-group/alert-group.e2e.ts b/src/elements/alert/alert-group/alert-group.e2e.ts similarity index 100% rename from src/components/alert/alert-group/alert-group.e2e.ts rename to src/elements/alert/alert-group/alert-group.e2e.ts diff --git a/src/components/alert/alert-group/alert-group.scss b/src/elements/alert/alert-group/alert-group.scss similarity index 100% rename from src/components/alert/alert-group/alert-group.scss rename to src/elements/alert/alert-group/alert-group.scss diff --git a/src/components/alert/alert-group/alert-group.spec.ts b/src/elements/alert/alert-group/alert-group.spec.ts similarity index 100% rename from src/components/alert/alert-group/alert-group.spec.ts rename to src/elements/alert/alert-group/alert-group.spec.ts diff --git a/src/components/alert/alert-group/alert-group.stories.ts b/src/elements/alert/alert-group/alert-group.stories.ts similarity index 97% rename from src/components/alert/alert-group/alert-group.stories.ts rename to src/elements/alert/alert-group/alert-group.stories.ts index a2280316a7..b6a93f7f89 100644 --- a/src/components/alert/alert-group/alert-group.stories.ts +++ b/src/elements/alert/alert-group/alert-group.stories.ts @@ -84,7 +84,7 @@ const meta: Meta = { extractComponentDescription: () => readme, }, }, - title: 'components/sbb-alert/sbb-alert-group', + title: 'elements/sbb-alert/sbb-alert-group', }; export default meta; diff --git a/src/components/alert/alert-group/alert-group.ts b/src/elements/alert/alert-group/alert-group.ts similarity index 100% rename from src/components/alert/alert-group/alert-group.ts rename to src/elements/alert/alert-group/alert-group.ts diff --git a/src/components/alert/alert-group/readme.md b/src/elements/alert/alert-group/readme.md similarity index 97% rename from src/components/alert/alert-group/readme.md rename to src/elements/alert/alert-group/readme.md index 85e1e9d2d3..8bd609bf86 100644 --- a/src/components/alert/alert-group/readme.md +++ b/src/elements/alert/alert-group/readme.md @@ -1,5 +1,5 @@ The `sbb-alert-group` manages the dismissal and accessibility of one or multiple -[sbb-alert](/docs/components-sbb-alert-sbb-alert--docs) and also its visual gap between each other. +[sbb-alert](/docs/elements-sbb-alert-sbb-alert--docs) and also its visual gap between each other. ```html diff --git a/src/components/alert/alert.ts b/src/elements/alert/alert.ts similarity index 100% rename from src/components/alert/alert.ts rename to src/elements/alert/alert.ts diff --git a/src/components/alert/alert/__snapshots__/alert.spec.snap.js b/src/elements/alert/alert/__snapshots__/alert.spec.snap.js similarity index 100% rename from src/components/alert/alert/__snapshots__/alert.spec.snap.js rename to src/elements/alert/alert/__snapshots__/alert.spec.snap.js diff --git a/src/components/alert/alert/alert.e2e.ts b/src/elements/alert/alert/alert.e2e.ts similarity index 100% rename from src/components/alert/alert/alert.e2e.ts rename to src/elements/alert/alert/alert.e2e.ts diff --git a/src/components/alert/alert/alert.scss b/src/elements/alert/alert/alert.scss similarity index 100% rename from src/components/alert/alert/alert.scss rename to src/elements/alert/alert/alert.scss diff --git a/src/components/alert/alert/alert.spec.ts b/src/elements/alert/alert/alert.spec.ts similarity index 100% rename from src/components/alert/alert/alert.spec.ts rename to src/elements/alert/alert/alert.spec.ts diff --git a/src/components/alert/alert/alert.stories.ts b/src/elements/alert/alert/alert.stories.ts similarity index 99% rename from src/components/alert/alert/alert.stories.ts rename to src/elements/alert/alert/alert.stories.ts index 65046a0b5f..334561110d 100644 --- a/src/components/alert/alert/alert.stories.ts +++ b/src/elements/alert/alert/alert.stories.ts @@ -224,7 +224,7 @@ const meta: Meta = { extractComponentDescription: () => readme, }, }, - title: 'components/sbb-alert/sbb-alert', + title: 'elements/sbb-alert/sbb-alert', }; export default meta; diff --git a/src/components/alert/alert/alert.ts b/src/elements/alert/alert/alert.ts similarity index 100% rename from src/components/alert/alert/alert.ts rename to src/elements/alert/alert/alert.ts diff --git a/src/components/alert/alert/readme.md b/src/elements/alert/alert/readme.md similarity index 98% rename from src/components/alert/alert/readme.md rename to src/elements/alert/alert/readme.md index 787b4abba4..de66215a96 100644 --- a/src/components/alert/alert/readme.md +++ b/src/elements/alert/alert/readme.md @@ -1,7 +1,7 @@ The `sbb-alert` is a component which should be used to display important messages to a client. Multiple instances of this component can be used within -the [sbb-alert-group](/docs/components-sbb-alert-sbb-alert-group--docs) component. +the [sbb-alert-group](/docs/elements-sbb-alert-sbb-alert-group--docs) component. ## Slots @@ -44,7 +44,7 @@ The `target` and `rel` properties are also configurable via the self-named prope The `sbb-alert` can optionally be hidden by a user, if the `readonly` prop is not set. Please note that clicking on the close button does not remove it from the DOM, this would be the responsibility of the library consumer to do it by reacting to the specific event. -See also the [sbb-alert-group](/docs/components-sbb-alert-sbb-alert-group--docs) +See also the [sbb-alert-group](/docs/elements-sbb-alert-sbb-alert-group--docs) which automatically removes an alert after clicking the close button. ```html diff --git a/src/components/autocomplete.ts b/src/elements/autocomplete.ts similarity index 100% rename from src/components/autocomplete.ts rename to src/elements/autocomplete.ts diff --git a/src/components/autocomplete/__snapshots__/autocomplete.spec.snap.js b/src/elements/autocomplete/__snapshots__/autocomplete.spec.snap.js similarity index 100% rename from src/components/autocomplete/__snapshots__/autocomplete.spec.snap.js rename to src/elements/autocomplete/__snapshots__/autocomplete.spec.snap.js diff --git a/src/components/autocomplete/autocomplete.e2e.ts b/src/elements/autocomplete/autocomplete.e2e.ts similarity index 100% rename from src/components/autocomplete/autocomplete.e2e.ts rename to src/elements/autocomplete/autocomplete.e2e.ts diff --git a/src/components/autocomplete/autocomplete.scss b/src/elements/autocomplete/autocomplete.scss similarity index 100% rename from src/components/autocomplete/autocomplete.scss rename to src/elements/autocomplete/autocomplete.scss diff --git a/src/components/autocomplete/autocomplete.spec.ts b/src/elements/autocomplete/autocomplete.spec.ts similarity index 100% rename from src/components/autocomplete/autocomplete.spec.ts rename to src/elements/autocomplete/autocomplete.spec.ts diff --git a/src/components/autocomplete/autocomplete.stories.ts b/src/elements/autocomplete/autocomplete.stories.ts similarity index 99% rename from src/components/autocomplete/autocomplete.stories.ts rename to src/elements/autocomplete/autocomplete.stories.ts index 083f5b1795..0c862b80a1 100644 --- a/src/components/autocomplete/autocomplete.stories.ts +++ b/src/elements/autocomplete/autocomplete.stories.ts @@ -503,7 +503,7 @@ const meta: Meta = { extractComponentDescription: () => readme, }, }, - title: 'components/sbb-autocomplete', + title: 'elements/sbb-autocomplete', }; export default meta; diff --git a/src/components/autocomplete/autocomplete.ts b/src/elements/autocomplete/autocomplete.ts similarity index 100% rename from src/components/autocomplete/autocomplete.ts rename to src/elements/autocomplete/autocomplete.ts diff --git a/src/components/autocomplete/readme.md b/src/elements/autocomplete/readme.md similarity index 97% rename from src/components/autocomplete/readme.md rename to src/elements/autocomplete/readme.md index f5c190da5b..859ae98ceb 100644 --- a/src/components/autocomplete/readme.md +++ b/src/elements/autocomplete/readme.md @@ -20,7 +20,7 @@ Both accept an id or an element reference. ## In `sbb-form-field` -If the component is used within a [sbb-form-field](/docs/components-sbb-form-field-sbb-form-field--docs), +If the component is used within a [sbb-form-field](/docs/elements-sbb-form-field-sbb-form-field--docs), it will automatically connect to the native `` as trigger and will display the option panel above or below the `sbb-form-field`. ```html @@ -43,7 +43,7 @@ it will automatically connect to the native `` as trigger and will displa ### Option highlight By default, the autocomplete will highlight the label of the `sbb-option` in the panel, if it matches the typed text. -See the [sbb-option](/docs/components-sbb-option-sbb-option--docs) for more details. +See the [sbb-option](/docs/elements-sbb-option-sbb-option--docs) for more details. ### Option grouping diff --git a/src/components/breadcrumb.ts b/src/elements/breadcrumb.ts similarity index 100% rename from src/components/breadcrumb.ts rename to src/elements/breadcrumb.ts diff --git a/src/components/breadcrumb/breadcrumb-group.ts b/src/elements/breadcrumb/breadcrumb-group.ts similarity index 100% rename from src/components/breadcrumb/breadcrumb-group.ts rename to src/elements/breadcrumb/breadcrumb-group.ts diff --git a/src/components/breadcrumb/breadcrumb-group/__snapshots__/breadcrumb-group.spec.snap.js b/src/elements/breadcrumb/breadcrumb-group/__snapshots__/breadcrumb-group.spec.snap.js similarity index 100% rename from src/components/breadcrumb/breadcrumb-group/__snapshots__/breadcrumb-group.spec.snap.js rename to src/elements/breadcrumb/breadcrumb-group/__snapshots__/breadcrumb-group.spec.snap.js diff --git a/src/components/breadcrumb/breadcrumb-group/breadcrumb-group.e2e.ts b/src/elements/breadcrumb/breadcrumb-group/breadcrumb-group.e2e.ts similarity index 100% rename from src/components/breadcrumb/breadcrumb-group/breadcrumb-group.e2e.ts rename to src/elements/breadcrumb/breadcrumb-group/breadcrumb-group.e2e.ts diff --git a/src/components/breadcrumb/breadcrumb-group/breadcrumb-group.scss b/src/elements/breadcrumb/breadcrumb-group/breadcrumb-group.scss similarity index 100% rename from src/components/breadcrumb/breadcrumb-group/breadcrumb-group.scss rename to src/elements/breadcrumb/breadcrumb-group/breadcrumb-group.scss diff --git a/src/components/breadcrumb/breadcrumb-group/breadcrumb-group.spec.ts b/src/elements/breadcrumb/breadcrumb-group/breadcrumb-group.spec.ts similarity index 100% rename from src/components/breadcrumb/breadcrumb-group/breadcrumb-group.spec.ts rename to src/elements/breadcrumb/breadcrumb-group/breadcrumb-group.spec.ts diff --git a/src/components/breadcrumb/breadcrumb-group/breadcrumb-group.stories.ts b/src/elements/breadcrumb/breadcrumb-group/breadcrumb-group.stories.ts similarity index 98% rename from src/components/breadcrumb/breadcrumb-group/breadcrumb-group.stories.ts rename to src/elements/breadcrumb/breadcrumb-group/breadcrumb-group.stories.ts index 9b811060ed..3cf9c59390 100644 --- a/src/components/breadcrumb/breadcrumb-group/breadcrumb-group.stories.ts +++ b/src/elements/breadcrumb/breadcrumb-group/breadcrumb-group.stories.ts @@ -171,7 +171,7 @@ const meta: Meta = { extractComponentDescription: () => readme, }, }, - title: 'components/sbb-breadcrumb/sbb-breadcrumb-group', + title: 'elements/sbb-breadcrumb/sbb-breadcrumb-group', }; export default meta; diff --git a/src/components/breadcrumb/breadcrumb-group/breadcrumb-group.ts b/src/elements/breadcrumb/breadcrumb-group/breadcrumb-group.ts similarity index 100% rename from src/components/breadcrumb/breadcrumb-group/breadcrumb-group.ts rename to src/elements/breadcrumb/breadcrumb-group/breadcrumb-group.ts diff --git a/src/components/breadcrumb/breadcrumb-group/readme.md b/src/elements/breadcrumb/breadcrumb-group/readme.md similarity index 94% rename from src/components/breadcrumb/breadcrumb-group/readme.md rename to src/elements/breadcrumb/breadcrumb-group/readme.md index 978bdeff29..75f0d4ab35 100644 --- a/src/components/breadcrumb/breadcrumb-group/readme.md +++ b/src/elements/breadcrumb/breadcrumb-group/readme.md @@ -1,4 +1,4 @@ -The `sbb-breadcrumb-group` component is a container for one or more [sbb-breadcrumb](/docs/components-sbb-breadcrumb-sbb-breadcrumb--docs), +The `sbb-breadcrumb-group` component is a container for one or more [sbb-breadcrumb](/docs/elements-sbb-breadcrumb-sbb-breadcrumb--docs), which are meant to represent the hierarchy of visited pages before arriving to the current one. ```html diff --git a/src/components/breadcrumb/breadcrumb.ts b/src/elements/breadcrumb/breadcrumb.ts similarity index 100% rename from src/components/breadcrumb/breadcrumb.ts rename to src/elements/breadcrumb/breadcrumb.ts diff --git a/src/components/breadcrumb/breadcrumb/__snapshots__/breadcrumb.spec.snap.js b/src/elements/breadcrumb/breadcrumb/__snapshots__/breadcrumb.spec.snap.js similarity index 100% rename from src/components/breadcrumb/breadcrumb/__snapshots__/breadcrumb.spec.snap.js rename to src/elements/breadcrumb/breadcrumb/__snapshots__/breadcrumb.spec.snap.js diff --git a/src/components/breadcrumb/breadcrumb/breadcrumb.e2e.ts b/src/elements/breadcrumb/breadcrumb/breadcrumb.e2e.ts similarity index 100% rename from src/components/breadcrumb/breadcrumb/breadcrumb.e2e.ts rename to src/elements/breadcrumb/breadcrumb/breadcrumb.e2e.ts diff --git a/src/components/breadcrumb/breadcrumb/breadcrumb.scss b/src/elements/breadcrumb/breadcrumb/breadcrumb.scss similarity index 100% rename from src/components/breadcrumb/breadcrumb/breadcrumb.scss rename to src/elements/breadcrumb/breadcrumb/breadcrumb.scss diff --git a/src/components/breadcrumb/breadcrumb/breadcrumb.spec.ts b/src/elements/breadcrumb/breadcrumb/breadcrumb.spec.ts similarity index 100% rename from src/components/breadcrumb/breadcrumb/breadcrumb.spec.ts rename to src/elements/breadcrumb/breadcrumb/breadcrumb.spec.ts diff --git a/src/components/breadcrumb/breadcrumb/breadcrumb.stories.ts b/src/elements/breadcrumb/breadcrumb/breadcrumb.stories.ts similarity index 98% rename from src/components/breadcrumb/breadcrumb/breadcrumb.stories.ts rename to src/elements/breadcrumb/breadcrumb/breadcrumb.stories.ts index 69dfe70ef5..57ea356bda 100644 --- a/src/components/breadcrumb/breadcrumb/breadcrumb.stories.ts +++ b/src/elements/breadcrumb/breadcrumb/breadcrumb.stories.ts @@ -146,7 +146,7 @@ const meta: Meta = { extractComponentDescription: () => readme, }, }, - title: 'components/sbb-breadcrumb/sbb-breadcrumb', + title: 'elements/sbb-breadcrumb/sbb-breadcrumb', }; export default meta; diff --git a/src/components/breadcrumb/breadcrumb/breadcrumb.ts b/src/elements/breadcrumb/breadcrumb/breadcrumb.ts similarity index 100% rename from src/components/breadcrumb/breadcrumb/breadcrumb.ts rename to src/elements/breadcrumb/breadcrumb/breadcrumb.ts diff --git a/src/components/breadcrumb/breadcrumb/readme.md b/src/elements/breadcrumb/breadcrumb/readme.md similarity index 96% rename from src/components/breadcrumb/breadcrumb/readme.md rename to src/elements/breadcrumb/breadcrumb/readme.md index 5b940d3294..72968e9ffc 100644 --- a/src/components/breadcrumb/breadcrumb/readme.md +++ b/src/elements/breadcrumb/breadcrumb/readme.md @@ -1,6 +1,6 @@ The `sbb-breadcrumb` is a component used to display a link to a page. -When it's used within the [sbb-breadcrumb-group](/docs/components-sbb-breadcrumb-sbb-breadcrumb-group--docs) component, +When it's used within the [sbb-breadcrumb-group](/docs/elements-sbb-breadcrumb-sbb-breadcrumb-group--docs) component, it can display the list of the links the user visited to arrive at the current page. ## Slots diff --git a/src/components/button.ts b/src/elements/button.ts similarity index 100% rename from src/components/button.ts rename to src/elements/button.ts diff --git a/src/components/button/button-link.ts b/src/elements/button/button-link.ts similarity index 100% rename from src/components/button/button-link.ts rename to src/elements/button/button-link.ts diff --git a/src/components/button/button-link/__snapshots__/button-link.spec.snap.js b/src/elements/button/button-link/__snapshots__/button-link.spec.snap.js similarity index 100% rename from src/components/button/button-link/__snapshots__/button-link.spec.snap.js rename to src/elements/button/button-link/__snapshots__/button-link.spec.snap.js diff --git a/src/components/button/button-link/button-link.e2e.ts b/src/elements/button/button-link/button-link.e2e.ts similarity index 100% rename from src/components/button/button-link/button-link.e2e.ts rename to src/elements/button/button-link/button-link.e2e.ts diff --git a/src/components/button/button-link/button-link.spec.ts b/src/elements/button/button-link/button-link.spec.ts similarity index 100% rename from src/components/button/button-link/button-link.spec.ts rename to src/elements/button/button-link/button-link.spec.ts diff --git a/src/components/button/button-link/button-link.stories.ts b/src/elements/button/button-link/button-link.stories.ts similarity index 97% rename from src/components/button/button-link/button-link.stories.ts rename to src/elements/button/button-link/button-link.stories.ts index 09a08a953a..3016c26983 100644 --- a/src/components/button/button-link/button-link.stories.ts +++ b/src/elements/button/button-link/button-link.stories.ts @@ -69,7 +69,7 @@ const meta: Meta = { extractComponentDescription: () => readme, }, }, - title: 'components/sbb-button/sbb-button-link', + title: 'elements/sbb-button/sbb-button-link', }; export default meta; diff --git a/src/components/button/button-link/button-link.ts b/src/elements/button/button-link/button-link.ts similarity index 100% rename from src/components/button/button-link/button-link.ts rename to src/elements/button/button-link/button-link.ts diff --git a/src/components/button/button-link/readme.md b/src/elements/button/button-link/readme.md similarity index 100% rename from src/components/button/button-link/readme.md rename to src/elements/button/button-link/readme.md diff --git a/src/components/button/button-static.ts b/src/elements/button/button-static.ts similarity index 100% rename from src/components/button/button-static.ts rename to src/elements/button/button-static.ts diff --git a/src/components/button/button-static/__snapshots__/button-static.spec.snap.js b/src/elements/button/button-static/__snapshots__/button-static.spec.snap.js similarity index 100% rename from src/components/button/button-static/__snapshots__/button-static.spec.snap.js rename to src/elements/button/button-static/__snapshots__/button-static.spec.snap.js diff --git a/src/components/button/button-static/button-static.e2e.ts b/src/elements/button/button-static/button-static.e2e.ts similarity index 100% rename from src/components/button/button-static/button-static.e2e.ts rename to src/elements/button/button-static/button-static.e2e.ts diff --git a/src/components/button/button-static/button-static.spec.ts b/src/elements/button/button-static/button-static.spec.ts similarity index 100% rename from src/components/button/button-static/button-static.spec.ts rename to src/elements/button/button-static/button-static.spec.ts diff --git a/src/components/button/button-static/button-static.stories.ts b/src/elements/button/button-static/button-static.stories.ts similarity index 97% rename from src/components/button/button-static/button-static.stories.ts rename to src/elements/button/button-static/button-static.stories.ts index a3a5eec489..1e3470a698 100644 --- a/src/components/button/button-static/button-static.stories.ts +++ b/src/elements/button/button-static/button-static.stories.ts @@ -81,7 +81,7 @@ const meta: Meta = { extractComponentDescription: () => readme, }, }, - title: 'components/sbb-button/sbb-button-static', + title: 'elements/sbb-button/sbb-button-static', }; export default meta; diff --git a/src/components/button/button-static/button-static.ts b/src/elements/button/button-static/button-static.ts similarity index 100% rename from src/components/button/button-static/button-static.ts rename to src/elements/button/button-static/button-static.ts diff --git a/src/components/button/button-static/readme.md b/src/elements/button/button-static/readme.md similarity index 100% rename from src/components/button/button-static/readme.md rename to src/elements/button/button-static/readme.md diff --git a/src/components/button/button.ts b/src/elements/button/button.ts similarity index 100% rename from src/components/button/button.ts rename to src/elements/button/button.ts diff --git a/src/components/button/button/__snapshots__/button.spec.snap.js b/src/elements/button/button/__snapshots__/button.spec.snap.js similarity index 100% rename from src/components/button/button/__snapshots__/button.spec.snap.js rename to src/elements/button/button/__snapshots__/button.spec.snap.js diff --git a/src/components/button/button/button.e2e.ts b/src/elements/button/button/button.e2e.ts similarity index 100% rename from src/components/button/button/button.e2e.ts rename to src/elements/button/button/button.e2e.ts diff --git a/src/components/button/button/button.snapshot.spec.ts b/src/elements/button/button/button.snapshot.spec.ts similarity index 100% rename from src/components/button/button/button.snapshot.spec.ts rename to src/elements/button/button/button.snapshot.spec.ts diff --git a/src/components/button/button/button.spec.ts b/src/elements/button/button/button.spec.ts similarity index 100% rename from src/components/button/button/button.spec.ts rename to src/elements/button/button/button.spec.ts diff --git a/src/components/button/button/button.stories.ts b/src/elements/button/button/button.stories.ts similarity index 97% rename from src/components/button/button/button.stories.ts rename to src/elements/button/button/button.stories.ts index b26219b84c..015a13a472 100644 --- a/src/components/button/button/button.stories.ts +++ b/src/elements/button/button/button.stories.ts @@ -71,7 +71,7 @@ const meta: Meta = { extractComponentDescription: () => readme, }, }, - title: 'components/sbb-button/sbb-button', + title: 'elements/sbb-button/sbb-button', }; export default meta; diff --git a/src/components/button/button/button.ts b/src/elements/button/button/button.ts similarity index 100% rename from src/components/button/button/button.ts rename to src/elements/button/button/button.ts diff --git a/src/components/button/button/readme.md b/src/elements/button/button/readme.md similarity index 100% rename from src/components/button/button/readme.md rename to src/elements/button/button/readme.md diff --git a/src/components/button/common.ts b/src/elements/button/common.ts similarity index 100% rename from src/components/button/common.ts rename to src/elements/button/common.ts diff --git a/src/components/button/common/button-common-stories.ts b/src/elements/button/common/button-common-stories.ts similarity index 100% rename from src/components/button/common/button-common-stories.ts rename to src/elements/button/common/button-common-stories.ts diff --git a/src/components/button/common/button-common.scss b/src/elements/button/common/button-common.scss similarity index 100% rename from src/components/button/common/button-common.scss rename to src/elements/button/common/button-common.scss diff --git a/src/components/button/common/button-common.ts b/src/elements/button/common/button-common.ts similarity index 100% rename from src/components/button/common/button-common.ts rename to src/elements/button/common/button-common.ts diff --git a/src/components/button/common/button-link-common-stories.ts b/src/elements/button/common/button-link-common-stories.ts similarity index 100% rename from src/components/button/common/button-link-common-stories.ts rename to src/elements/button/common/button-link-common-stories.ts diff --git a/src/components/button/common/button-test-utils.ts b/src/elements/button/common/button-test-utils.ts similarity index 100% rename from src/components/button/common/button-test-utils.ts rename to src/elements/button/common/button-test-utils.ts diff --git a/src/components/button/common/common-stories.ts b/src/elements/button/common/common-stories.ts similarity index 100% rename from src/components/button/common/common-stories.ts rename to src/elements/button/common/common-stories.ts diff --git a/src/components/button/common/primary-button.scss b/src/elements/button/common/primary-button.scss similarity index 100% rename from src/components/button/common/primary-button.scss rename to src/elements/button/common/primary-button.scss diff --git a/src/components/button/common/secondary-button.scss b/src/elements/button/common/secondary-button.scss similarity index 100% rename from src/components/button/common/secondary-button.scss rename to src/elements/button/common/secondary-button.scss diff --git a/src/components/button/common/tertiary-button.scss b/src/elements/button/common/tertiary-button.scss similarity index 100% rename from src/components/button/common/tertiary-button.scss rename to src/elements/button/common/tertiary-button.scss diff --git a/src/components/button/common/transparent-button.scss b/src/elements/button/common/transparent-button.scss similarity index 100% rename from src/components/button/common/transparent-button.scss rename to src/elements/button/common/transparent-button.scss diff --git a/src/components/button/mini-button.ts b/src/elements/button/mini-button.ts similarity index 100% rename from src/components/button/mini-button.ts rename to src/elements/button/mini-button.ts diff --git a/src/components/button/mini-button/mini-button.scss b/src/elements/button/mini-button/mini-button.scss similarity index 100% rename from src/components/button/mini-button/mini-button.scss rename to src/elements/button/mini-button/mini-button.scss diff --git a/src/components/button/mini-button/mini-button.stories.ts b/src/elements/button/mini-button/mini-button.stories.ts similarity index 98% rename from src/components/button/mini-button/mini-button.stories.ts rename to src/elements/button/mini-button/mini-button.stories.ts index 0f5f1f76ad..77ddfedbae 100644 --- a/src/components/button/mini-button/mini-button.stories.ts +++ b/src/elements/button/mini-button/mini-button.stories.ts @@ -111,7 +111,7 @@ const meta: Meta = { extractComponentDescription: () => readme, }, }, - title: 'components/sbb-button/sbb-mini-button', + title: 'elements/sbb-button/sbb-mini-button', }; export default meta; diff --git a/src/components/button/mini-button/mini-button.ts b/src/elements/button/mini-button/mini-button.ts similarity index 100% rename from src/components/button/mini-button/mini-button.ts rename to src/elements/button/mini-button/mini-button.ts diff --git a/src/components/button/mini-button/readme.md b/src/elements/button/mini-button/readme.md similarity index 98% rename from src/components/button/mini-button/readme.md rename to src/elements/button/mini-button/readme.md index 399bc96817..2914661af0 100644 --- a/src/components/button/mini-button/readme.md +++ b/src/elements/button/mini-button/readme.md @@ -1,5 +1,5 @@ The `sbb-mini-button` component provides the same functionality as a native icon-only `