Merge remote-tracking branch 'origin/main' into tokens/v2-2024-11

swisspost · Nov 19, 2024 · 460983c · 460983c
2 parents 69a845b + 6664047
commit 460983c
Show file tree

Hide file tree

Showing 69 changed files with 237 additions and 251 deletions.
diff --git a/.changeset/pre.json b/.changeset/pre.json
@@ -27,6 +27,7 @@
     "2024-11-10-update-icons",
     "beige-jobs-do",
     "big-frogs-admire",
+    "big-socks-dress",
     "breezy-cups-add",
     "brown-badgers-dream",
     "clean-icons-complain",
@@ -35,6 +36,7 @@
     "cuddly-bears-check",
     "cuddly-gifts-film",
     "dirty-mayflies-taste",
+    "dry-moons-walk",
     "eight-turkeys-matter",
     "eleven-keys-work",
     "empty-islands-kneel",
@@ -60,16 +62,19 @@
     "loud-dingos-remember",
     "lovely-deers-itch",
     "lovely-mirrors-travel",
+    "metal-rivers-look",
     "neat-suits-provide",
     "nervous-rocks-shop",
     "new-goats-impress",
     "ninety-nails-float",
     "pink-weeks-relate",
     "plenty-apricots-raise",
     "popular-games-rush",
+    "popular-mirrors-cross",
     "proud-actors-knock",
     "proud-cheetahs-act",
     "proud-moons-impress",
+    "quick-buses-give",
     "quick-eagles-watch",
     "quiet-apes-rhyme",
     "rare-dryers-count",

diff --git a/packages/components-angular/CHANGELOG.md b/packages/components-angular/CHANGELOG.md
@@ -1,5 +1,13 @@
 # @swisspost/design-system-components-angular-workspace
 
+## 1.1.10-next.5
+
+### Patch Changes
+
+- Updated dependencies:
+  - @swisspost/design-system-styles@9.0.0-next.5
+  - @swisspost/design-system-components@9.0.0-next.5
+
 ## 1.1.10-next.4
 
 ### Patch Changes

diff --git a/packages/components-angular/package.json b/packages/components-angular/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@swisspost/design-system-components-angular-workspace",
-  "version": "1.1.10-next.4",
+  "version": "1.1.10-next.5",
   "scripts": {
     "start": "ng serve --port 9210",
     "build": "ng build components",
@@ -18,8 +18,8 @@
     "@angular/platform-browser": "18.2.10",
     "@angular/platform-browser-dynamic": "18.2.10",
     "@angular/router": "18.2.10",
-    "@swisspost/design-system-components": "workspace:9.0.0-next.4",
-    "@swisspost/design-system-styles": "workspace:9.0.0-next.4",
+    "@swisspost/design-system-components": "workspace:9.0.0-next.5",
+    "@swisspost/design-system-styles": "workspace:9.0.0-next.5",
     "rxjs": "7.8.1",
     "tslib": "2.6.3",
     "zone.js": "0.14.8"

diff --git a/packages/components-angular/projects/components/CHANGELOG.md b/packages/components-angular/projects/components/CHANGELOG.md
@@ -1,5 +1,16 @@
 # @swisspost/design-system-components-angular
 
+## 9.0.0-next.5
+
+### Minor Changes
+
+- Added a provisional post-header component with some basic functionality in place. This component is not finished in this state. (by [@gfellerph](https://github.com/gfellerph) with [#3837](https://github.com/swisspost/design-system/pull/3837))
+
+### Patch Changes
+
+- Updated dependencies:
+  - @swisspost/design-system-components@9.0.0-next.5
+
 ## 9.0.0-next.4
 
 ### Patch Changes

diff --git a/packages/components-angular/projects/components/package.json b/packages/components-angular/projects/components/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@swisspost/design-system-components-angular",
-  "version": "9.0.0-next.4",
+  "version": "9.0.0-next.5",
   "description": "Swiss Post Design System - Angular Wrapper Components",
   "author": "Swiss Post <[email protected]>",
   "license": "Apache-2.0",
@@ -19,7 +19,7 @@
   },
   "dependencies": {
     "tslib": "2.6.3",
-    "@swisspost/design-system-components": "workspace:9.0.0-next.4"
+    "@swisspost/design-system-components": "workspace:9.0.0-next.5"
   },
   "peerDependencies": {
     "@angular/common": "^16.0.0 || ^17.0.0 || ^18.0.0",

diff --git a/packages/components-react/CHANGELOG.md b/packages/components-react/CHANGELOG.md
@@ -1,5 +1,16 @@
 # @swisspost/design-system-components-react
 
+## 9.0.0-next.5
+
+### Minor Changes
+
+- Added a provisional post-header component with some basic functionality in place. This component is not finished in this state. (by [@gfellerph](https://github.com/gfellerph) with [#3837](https://github.com/swisspost/design-system/pull/3837))
+
+### Patch Changes
+
+- Updated dependencies:
+  - @swisspost/design-system-components@9.0.0-next.5
+
 ## 9.0.0-next.4
 
 ### Patch Changes

diff --git a/packages/components-react/package.json b/packages/components-react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@swisspost/design-system-components-react",
-  "version": "9.0.0-next.4",
+  "version": "9.0.0-next.5",
   "description": "Design System React Components for easy integration with the React ecosystem",
   "author": "Swiss Post <[email protected]>",
   "license": "Apache-2.0",
@@ -29,7 +29,7 @@
     "lint": "eslint src/**/*.ts"
   },
   "dependencies": {
-    "@swisspost/design-system-components": "workspace:9.0.0-next.4"
+    "@swisspost/design-system-components": "workspace:9.0.0-next.5"
   },
   "devDependencies": {
     "@types/node": "20.14.14",

diff --git a/packages/components/CHANGELOG.md b/packages/components/CHANGELOG.md
@@ -1,5 +1,18 @@
 # @swisspost/design-system-components
 
+## 9.0.0-next.5
+
+### Minor Changes
+
+- Added a provisional post-header component with some basic functionality in place. This component is not finished in this state. (by [@gfellerph](https://github.com/gfellerph) with [#3837](https://github.com/swisspost/design-system/pull/3837))
+
+- Added new Menu Button components (post-menu-button, post-menu-trigger, and post-menu-item) for creating accessible dropdown menus. (by [@alionazherdetska](https://github.com/alionazherdetska) with [#3795](https://github.com/swisspost/design-system/pull/3795))
+
+### Patch Changes
+
+- Updated dependencies:
+  - @swisspost/design-system-styles@9.0.0-next.5
+
 ## 9.0.0-next.4
 
 ### Major Changes

diff --git a/packages/components/package.json b/packages/components/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@swisspost/design-system-components",
-  "version": "9.0.0-next.4",
+  "version": "9.0.0-next.5",
   "description": "A collection of web components built with Stencil JS for the Swiss Post Design System.",
   "license": "Apache-2.0",
   "main": "dist/index.cjs.js",
@@ -40,7 +40,7 @@
   "dependencies": {
     "@floating-ui/dom": "1.6.8",
     "@oddbird/popover-polyfill": "0.3.7",
-    "@swisspost/design-system-styles": "workspace:9.0.0-next.4",
+    "@swisspost/design-system-styles": "workspace:9.0.0-next.5",
     "ally.js": "1.4.1",
     "long-press-event": "2.5.0"
   },

diff --git a/packages/documentation/.storybook/blocks/footer.tsx b/packages/documentation/.storybook/blocks/footer.tsx
@@ -115,7 +115,7 @@ export default (params: { pathToStoryFile?: String }) => (
               ))}
             </ul>
             <div className="row mt-regular-r">
-              <div className="col-12 col-rg-auto mt-regular-r">
+              <div className="col-12 col-sm-auto mt-regular-r">
                 <a
                   className="btn-primary btn"
                   href="https://github.com/swisspost/design-system/issues"

diff --git a/packages/documentation/.storybook/blocks/layout/layout.scss b/packages/documentation/.storybook/blocks/layout/layout.scss
@@ -12,12 +12,6 @@
   }
 
   @include post.media-breakpoint-up(sm) {
-    .container {
-      padding-right: 30vw;
-    }
-  }
-
-  @include post.media-breakpoint-up(rg) {
     .container {
       padding-right: 35vw;
     }
@@ -26,12 +20,6 @@
   @include post.media-breakpoint-up(xl) {
     background-position: center right;
   }
-
-  @include post.media-breakpoint-up(xxl) {
-    .container {
-      padding-right: 30%;
-    }
-  }
 }
 
 .docs-alert {

diff --git a/packages/documentation/CHANGELOG.md b/packages/documentation/CHANGELOG.md
@@ -1,5 +1,20 @@
 # @swisspost/design-system-documentation
 
+## 6.0.0-next.6
+
+### Minor Changes
+
+- Added new Menu Button components (post-menu-button, post-menu-trigger, and post-menu-item) for creating accessible dropdown menus. (by [@alionazherdetska](https://github.com/alionazherdetska) with [#3795](https://github.com/swisspost/design-system/pull/3795))
+
+### Patch Changes
+
+- Updated dependencies:
+  - @swisspost/design-system-styles@9.0.0-next.5
+  - @swisspost/design-system-components@9.0.0-next.5
+  - @swisspost/design-system-components-react@9.0.0-next.5
+  - @swisspost/internet-header@2.0.0-next.5
+  - @swisspost/design-system-icons@9.0.0-next.5
+
 ## 6.0.0-next.5
 
 ### Minor Changes

diff --git a/packages/documentation/package.json b/packages/documentation/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@swisspost/design-system-documentation",
-  "version": "6.0.0-next.5",
+  "version": "6.0.0-next.6",
   "description": "Swiss Post Design System Documentation.",
   "author": "Swiss Post <[email protected]>",
   "license": "Apache-2.0",
@@ -28,11 +28,11 @@
     "lint": "eslint **/*.{ts,tsx,mdx}"
   },
   "dependencies": {
-    "@swisspost/design-system-components": "workspace:9.0.0-next.4",
-    "@swisspost/design-system-components-react": "workspace:9.0.0-next.4",
-    "@swisspost/design-system-icons": "workspace:9.0.0-next.4",
-    "@swisspost/design-system-styles": "workspace:9.0.0-next.4",
-    "@swisspost/internet-header": "workspace:2.0.0-next.4",
+    "@swisspost/design-system-components": "workspace:9.0.0-next.5",
+    "@swisspost/design-system-components-react": "workspace:9.0.0-next.5",
+    "@swisspost/design-system-icons": "workspace:9.0.0-next.5",
+    "@swisspost/design-system-styles": "workspace:9.0.0-next.5",
+    "@swisspost/internet-header": "workspace:2.0.0-next.5",
     "bootstrap": "5.3.3"
   },
   "devDependencies": {
@@ -53,8 +53,8 @@
     "@storybook/types": "8.3.6",
     "@storybook/web-components": "8.3.6",
     "@storybook/web-components-vite": "8.3.6",
-    "@swisspost/design-system-components-angular": "workspace:9.0.0-next.4",
-    "@swisspost/design-system-intranet-header": "workspace:9.0.0-next.4",
+    "@swisspost/design-system-components-angular": "workspace:9.0.0-next.5",
+    "@swisspost/design-system-intranet-header": "workspace:9.0.0-next.5",
     "@types/css-modules": "1.0.5",
     "@types/mdx": "2.0.13",
     "@types/react": "18.3.3",

diff --git a/packages/documentation/src/stories/components/buttons/button/button.docs.mdx b/packages/documentation/src/stories/components/buttons/button/button.docs.mdx
@@ -42,7 +42,7 @@ for example when the button is displayed on mobile and stacked vertically with o
 To achieve that, you can use classes in the format:
 
 - `.w-{size}` for the xs breakpoint,
-- `.w-{breakpoint}-{size}` for breakpoints from sm to xxl.
+- `.w-{breakpoint}-{size}` for breakpoints from sm to xl.
 
 For example, a button with classes `w-100 w-lg-auto` will use all available space only when the viewport size is smaller than `lg`.
 

diff --git a/packages/documentation/src/stories/components/cards/card/card.stories.ts b/packages/documentation/src/stories/components/cards/card/card.stories.ts
@@ -219,7 +219,7 @@ function paddedContainer(story: StoryFn, context: StoryContext) {
 function gridContainer(story: StoryFn, context: StoryContext) {
   return html`
     <div class="row">
-      <div class="col-lg-4 col-rg-6 col-12">${story(context.args, context)}</div>
+      <div class="col-lg-4 col-sm-6 col-12">${story(context.args, context)}</div>
     </div>
   `;
 }

diff --git a/packages/documentation/src/stories/components/list-group/list-group.stories.ts b/packages/documentation/src/stories/components/list-group/list-group.stories.ts
@@ -48,7 +48,7 @@ export default meta;
 function gridDecorator(story: StoryFn, context: StoryContext) {
   return html`
     <div class="row">
-      <div class="col-lg-4 col-rg-6 col-12">${story(context.args, context)}</div>
+      <div class="col-lg-4 col-sm-6 col-12">${story(context.args, context)}</div>
     </div>
   `;
 }

diff --git a/packages/documentation/src/stories/foundation/icons/search-icons.styles.scss b/packages/documentation/src/stories/foundation/icons/search-icons.styles.scss
@@ -43,7 +43,7 @@
     }
   }
 
-  @include post.media-breakpoint-down(rg) {
+  @include post.media-breakpoint-down(sm) {
     .icon-search--results {
       grid-template-columns: repeat(auto-fit, minmax(100px, 1fr));
     }
@@ -99,7 +99,7 @@
     }
   }
 
-  @include post.media-breakpoint-down(rg) {
+  @include post.media-breakpoint-down(sm) {
     .icon--tile {
       height: 60px;
 

diff --git a/packages/documentation/src/stories/foundation/layout/shared.module.scss b/packages/documentation/src/stories/foundation/layout/shared.module.scss
@@ -9,7 +9,6 @@ $breakpointNames: (
   md: Medium,
   lg: Large,
   xl: Extra large,
-  xxl: Extra extra large,
 );
 
 :export {

diff --git a/packages/documentation/src/stories/getting-started/angular/angular.styles.scss b/packages/documentation/src/stories/getting-started/angular/angular.styles.scss
@@ -7,7 +7,7 @@
   list-style-type: none;
   gap: post.$size-big;
 
-  @include post.media-breakpoint-down(rg) {
+  @include post.media-breakpoint-down(sm) {
     gap: post.$size-regular;
   }
 }
diff --git a/packages/documentation/src/stories/getting-started/migration-guide/shared.component.scss b/packages/documentation/src/stories/getting-started/migration-guide/shared.component.scss
@@ -25,7 +25,7 @@ migration-global-state {
       border-left: 4px solid var(--post-light);
       min-height: 5rem;
 
-      @include post.media-breakpoint-down(rg) {
+      @include post.media-breakpoint-down(sm) {
         margin-left: 1rem;
         padding-bottom: 1rem;
         padding-left: 2rem;
@@ -53,7 +53,7 @@ migration-global-state {
         font-weight: bold;
         font-size: 1.2em;
 
-        @include post.media-breakpoint-down(rg) {
+        @include post.media-breakpoint-down(sm) {
           width: 3rem;
           height: 3rem;
           font-size: 1em;

diff --git a/...tion/src/stories/getting-started/packages/components-angular/angular-app-module.sample.ts b/...tion/src/stories/getting-started/packages/components-angular/angular-app-module.sample.ts
@@ -4,8 +4,8 @@ import { NgModule } from '@angular/core';
 import { PostComponentsModule } from '@swisspost/design-system-components-angular';
 
 @NgModule({
-  ...
+  // ...
   imports: [PostComponentsModule],
-  ...
+  // ...
 })
 export class AppModule {}
diff --git a/packages/documentation/src/stories/home.styles.scss b/packages/documentation/src/stories/home.styles.scss
@@ -37,7 +37,7 @@
   justify-content: center;
   gap: post.$size-big;
 
-  @include post.media-breakpoint-down(rg) {
+  @include post.media-breakpoint-down(sm) {
     gap: post.$size-regular;
   }
 }

diff --git a/packages/documentation/src/stories/templates/error-page/error-page.stories.ts b/packages/documentation/src/stories/templates/error-page/error-page.stories.ts
@@ -15,7 +15,7 @@ function render() {
     <div class="bg-light error-container">
       <div class="container">
         <div class="row">
-          <div class="col-rg-8 py-56">
+          <div class="col-sm-8 py-56">
             <h2>
               This page could not be found.
               <br />
@@ -40,7 +40,7 @@ function render() {
               </a>
             </div>
           </div>
-          <div class="col-6 offset-3 offset-rg-0 col-rg-4 align-self-end">
+          <div class="col-6 offset-3 offset-sm-0 col-sm-4 align-self-end">
             <img class="error-container--image" src="/images/content/404.png" alt="" />
           </div>
         </div>

diff --git a/packages/documentation/src/stories/utilities/float/float.docs.mdx b/packages/documentation/src/stories/utilities/float/float.docs.mdx
@@ -26,7 +26,6 @@ import * as FloatStories from './float.stories';
 > - `float-md-{start|end|none}`
 > - `float-lg-{start|end|none}`
 > - `float-xl-{start|end|none}`
-> - `float-xxl-{start|end|none}`
 
 #### Example
 

diff --git a/packages/documentation/src/stories/utilities/float/float.stories.ts b/packages/documentation/src/stories/utilities/float/float.stories.ts
@@ -26,7 +26,7 @@ const meta: MetaExtended = {
       control: {
         type: 'select',
       },
-      options: ['xs', 'sm', 'md', 'lg', 'xl', 'xxl'],
+      options: ['xs', 'sm', 'md', 'lg', 'xl'],
       table: {
         category: 'Add float',
       },