Merge remote-tracking branch 'origin/main' into release

telekom · Sep 13, 2023 · 7ce6ce1 · 7ce6ce1
2 parents 8ce3a6e + 442c15e
commit 7ce6ce1
Show file tree

Hide file tree

Showing 22 changed files with 147 additions and 37 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -3,6 +3,22 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [3.0.0-beta.140](https://github.com/telekom/scale/compare/v3.0.0-beta.139...v3.0.0-beta.140) (2023-09-13)
+
+
+### Bug Fixes
+
+* **radio-button:** ensure change event is emitted when clicking input-label gap ([#2123](https://github.com/telekom/scale/issues/2123)) ([5423cb8](https://github.com/telekom/scale/commit/5423cb80520f93aae52eab4ff6a5477dcd072f09))
+
+
+### Features
+
+* **data-grid:** enable localization for flyout menu ([#1411](https://github.com/telekom/scale/issues/1411)) ([053b10d](https://github.com/telekom/scale/commit/053b10d4e75616059a889b6e1d26012645eda97d))
+
+
+
+
+
 # [3.0.0-beta.139](https://github.com/telekom/scale/compare/v3.0.0-beta.138...v3.0.0-beta.139) (2023-09-06)
 
 

diff --git a/CODEOWNERS b/CODEOWNERS
@@ -5,4 +5,4 @@
 # For more details, read the following article on GitHub: https://help.github.com/articles/about-codeowners/.
 
 # These are the default owners for the whole content of this repository. The default owners are automatically added as reviewers when you open a pull request, unless different owners are specified in the file.
-* @acstll @nowseemee
+* @maomaoZH @acstll @felix-ico
diff --git a/lerna.json b/lerna.json
@@ -7,7 +7,7 @@
     "--pure-lockfile"
   ],
   "useWorkspaces": true,
-  "version": "3.0.0-beta.139",
+  "version": "3.0.0-beta.140",
   "command": {
     "version": {
       "allowBranch": "main"

diff --git a/packages/components-angular/CHANGELOG.md b/packages/components-angular/CHANGELOG.md
@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [3.0.0-beta.140](https://github.com/telekom/scale/compare/v3.0.0-beta.139...v3.0.0-beta.140) (2023-09-13)
+
+**Note:** Version bump only for package @telekom/scale-components-angular
+
+
+
+
+
 # [3.0.0-beta.139](https://github.com/telekom/scale/compare/v3.0.0-beta.138...v3.0.0-beta.139) (2023-09-06)
 
 **Note:** Version bump only for package @telekom/scale-components-angular

diff --git a/packages/components-angular/package.json b/packages/components-angular/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@telekom/scale-components-angular",
-  "version": "3.0.0-beta.139",
+  "version": "3.0.0-beta.140",
   "description": "Angular specific wrapper for @telekom/scale-components",
   "license": "MPL-2.0",
   "homepage": "https://github.com/telekom/scale",

diff --git a/packages/components-react/CHANGELOG.md b/packages/components-react/CHANGELOG.md
@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [3.0.0-beta.140](https://github.com/telekom/scale/compare/v3.0.0-beta.139...v3.0.0-beta.140) (2023-09-13)
+
+**Note:** Version bump only for package @telekom/scale-components-react
+
+
+
+
+
 # [3.0.0-beta.139](https://github.com/telekom/scale/compare/v3.0.0-beta.138...v3.0.0-beta.139) (2023-09-06)
 
 **Note:** Version bump only for package @telekom/scale-components-react

diff --git a/packages/components-react/package.json b/packages/components-react/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@telekom/scale-components-react",
   "sideEffects": false,
-  "version": "3.0.0-beta.139",
+  "version": "3.0.0-beta.140",
   "description": "React proxy for @telekom/scale-components",
   "license": "MPL-2.0",
   "homepage": "https://github.com/telekom/scale",

diff --git a/packages/components-vue/CHANGELOG.md b/packages/components-vue/CHANGELOG.md
@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [3.0.0-beta.140](https://github.com/telekom/scale/compare/v3.0.0-beta.139...v3.0.0-beta.140) (2023-09-13)
+
+**Note:** Version bump only for package @telekom/scale-components-vue
+
+
+
+
+
 # [3.0.0-beta.139](https://github.com/telekom/scale/compare/v3.0.0-beta.138...v3.0.0-beta.139) (2023-09-06)
 
 **Note:** Version bump only for package @telekom/scale-components-vue

diff --git a/packages/components-vue/package.json b/packages/components-vue/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@telekom/scale-components-vue",
   "sideEffects": false,
-  "version": "3.0.0-beta.139",
+  "version": "3.0.0-beta.140",
   "description": "Vue specific wrapper for @telekom/scale-components",
   "license": "MPL-2.0",
   "homepage": "https://github.com/telekom/scale",

diff --git a/packages/components/CHANGELOG.md b/packages/components/CHANGELOG.md
@@ -3,6 +3,22 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [3.0.0-beta.140](https://github.com/telekom/scale/compare/v3.0.0-beta.139...v3.0.0-beta.140) (2023-09-13)
+
+
+### Bug Fixes
+
+* **radio-button:** ensure change event is emitted when clicking input-label gap ([#2123](https://github.com/telekom/scale/issues/2123)) ([5423cb8](https://github.com/telekom/scale/commit/5423cb80520f93aae52eab4ff6a5477dcd072f09))
+
+
+### Features
+
+* **data-grid:** enable localization for flyout menu ([#1411](https://github.com/telekom/scale/issues/1411)) ([053b10d](https://github.com/telekom/scale/commit/053b10d4e75616059a889b6e1d26012645eda97d))
+
+
+
+
+
 # [3.0.0-beta.139](https://github.com/telekom/scale/compare/v3.0.0-beta.138...v3.0.0-beta.139) (2023-09-06)
 
 

diff --git a/packages/components/package.json b/packages/components/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@telekom/scale-components",
-  "version": "3.0.0-beta.139",
+  "version": "3.0.0-beta.140",
   "description": "Scale is the digital design system for Telekom products and experiences.",
   "homepage": "https://github.com/telekom/scale",
   "repository": {
@@ -72,7 +72,7 @@
     "@floating-ui/dom": "^0.5.4",
     "@stencil/core": "^2.17.0",
     "@telekom/design-tokens": "1.0.0-beta.8",
-    "@telekom/scale-design-tokens": "^3.0.0-beta.139",
+    "@telekom/scale-design-tokens": "^3.0.0-beta.140",
     "classnames": "^2.2.6",
     "stencil-inline-svg": "^1.0.1"
   }

diff --git a/packages/components/src/components/data-grid/data-grid.tsx b/packages/components/src/components/data-grid/data-grid.tsx
@@ -107,7 +107,15 @@ export class DataGrid {
   @Prop() styles: any;
   /** (optional) Set to false to hide table, used for nested tables to re-render upon toggle */
   @Prop() visible?: boolean = true;
-
+  /**
+   * (optional) set localization for sort, toggle and select/deselect table
+   * Default is English.
+   */
+  @Prop() localization?: {
+    sortBy: string;
+    toggle: string;
+    select: string;
+  };
   /* 4. Events (alphabetical) */
   /** Event triggered every time the editable cells are changed, updating the original rows data */
   @Event({ eventName: 'scale-edit' })
@@ -767,7 +775,7 @@ export class DataGrid {
               onClick={this.handleMenuListClick}
             >
               <scale-icon-action-sort slot="prefix"></scale-icon-action-sort>
-              Sort By
+              {this.localization?.sortBy || 'Sort By'}
               <scale-menu-flyout-list slot="sublist" id="sortByList">
                 {this.fields.map(
                   (
@@ -819,7 +827,7 @@ export class DataGrid {
             onClick={this.handleMenuListClick}
           >
             <scale-icon-action-hide-password slot="prefix"></scale-icon-action-hide-password>
-            Toggle Visibility
+            {this.localization?.toggle || 'Toggle Visibility'}
             <scale-menu-flyout-list
               slot="sublist"
               close-on-select="false"
@@ -863,7 +871,7 @@ export class DataGrid {
                 slot="prefix"
                 path="M20.9328 10.6668C20.5132 10.6668 20.1731 11.0069 20.1731 11.4265V20.3269H1.5194V1.67309H16.5049C16.9245 1.67309 17.2646 1.33292 17.2646 0.913386C17.2646 0.49385 16.9245 0.153687 16.5049 0.153687H0.759699C0.340163 0.153687 0 0.49385 0 0.913386V21.0866C0 21.5062 0.340163 21.8463 0.759699 21.8463H20.9328C21.3523 21.8463 21.6925 21.5062 21.6925 21.0866V11.4265C21.6925 11.0069 21.3524 10.6668 20.9328 10.6668ZM23.7774 0.653387C23.4807 0.356739 22.9997 0.356739 22.703 0.653387L10.3293 13.0272L7.25501 9.9529C6.9583 9.65625 6.47732 9.65625 6.18061 9.9529C5.88396 10.2496 5.88396 10.7306 6.18061 11.0273L9.7921 14.6388C9.94045 14.7871 10.1349 14.8613 10.3293 14.8613C10.5237 14.8613 10.7181 14.7871 10.8665 14.6388L23.7774 1.72778C24.0741 1.43108 24.0741 0.950095 23.7774 0.653387Z"
               ></scale-icon>
-              Select / Deselect All
+              {this.localization?.select || 'Select / Deselect All'}
             </scale-menu-flyout-item>
           )}
           <slot name="menu"></slot>

diff --git a/packages/components/src/components/data-grid/readme.md b/packages/components/src/components/data-grid/readme.md
@@ -5,24 +5,25 @@
 
 ## Properties
 
-| Property         | Attribute         | Description                                                                                  | Type       | Default     |
-| ---------------- | ----------------- | -------------------------------------------------------------------------------------------- | ---------- | ----------- |
-| `fields`         | `fields`          | Input fields config array                                                                    | `any`      | `undefined` |
-| `freezeHeader`   | `freeze-header`   | (optional) Freeze header row from scrolling                                                  | `boolean`  | `false`     |
-| `heading`        | `heading`         | (optional) Heading string                                                                    | `string`   | `''`        |
-| `height`         | `height`          | (optional) Set static table height, by default will auto-resize                              | `string`   | `undefined` |
-| `hideBorder`     | `hide-border`     | (optional) Set to true to remove border                                                      | `boolean`  | `false`     |
-| `hideHeader`     | `hide-header`     | (optional) Set to true to hide header row                                                    | `boolean`  | `false`     |
-| `hideInfo`       | `hide-info`       | (optional) Set to true to remove info footer block including pagination and selection status | `boolean`  | `false`     |
-| `hideMenu`       | `hide-menu`       | (optional) Set to true to hide settings menu                                                 | `boolean`  | `false`     |
-| `numbered`       | `numbered`        | (optional) Set to true to add numbers column                                                 | `boolean`  | `false`     |
-| `pageSize`       | `page-size`       | (optional) Set number of rows to display per pagination page                                 | `number`   | `Infinity`  |
-| `rows`           | `rows`            | Input data array                                                                             | `any`      | `undefined` |
-| `selectable`     | `selectable`      | (optional) Set to true to add selection column                                               | `boolean`  | `false`     |
-| `selection`      | --                | Read-only selection array - populated with raw data from selected rows                       | `string[]` | `[]`        |
-| `shadeAlternate` | `shade-alternate` | (optional) Shade every second row darker                                                     | `boolean`  | `true`      |
-| `styles`         | `styles`          | (optional) Injected css styles                                                               | `any`      | `undefined` |
-| `visible`        | `visible`         | (optional) Set to false to hide table, used for nested tables to re-render upon toggle       | `boolean`  | `true`      |
+| Property         | Attribute         | Description                                                                                  | Type                                                  | Default     |
+| ---------------- | ----------------- | -------------------------------------------------------------------------------------------- | ----------------------------------------------------- | ----------- |
+| `fields`         | `fields`          | Input fields config array                                                                    | `any`                                                 | `undefined` |
+| `freezeHeader`   | `freeze-header`   | (optional) Freeze header row from scrolling                                                  | `boolean`                                             | `false`     |
+| `heading`        | `heading`         | (optional) Heading string                                                                    | `string`                                              | `''`        |
+| `height`         | `height`          | (optional) Set static table height, by default will auto-resize                              | `string`                                              | `undefined` |
+| `hideBorder`     | `hide-border`     | (optional) Set to true to remove border                                                      | `boolean`                                             | `false`     |
+| `hideHeader`     | `hide-header`     | (optional) Set to true to hide header row                                                    | `boolean`                                             | `false`     |
+| `hideInfo`       | `hide-info`       | (optional) Set to true to remove info footer block including pagination and selection status | `boolean`                                             | `false`     |
+| `hideMenu`       | `hide-menu`       | (optional) Set to true to hide settings menu                                                 | `boolean`                                             | `false`     |
+| `localization`   | --                | (optional) set localization for sort, toggle and select/deselect table Default is English.   | `{ sortBy: string; toggle: string; select: string; }` | `undefined` |
+| `numbered`       | `numbered`        | (optional) Set to true to add numbers column                                                 | `boolean`                                             | `false`     |
+| `pageSize`       | `page-size`       | (optional) Set number of rows to display per pagination page                                 | `number`                                              | `Infinity`  |
+| `rows`           | `rows`            | Input data array                                                                             | `any`                                                 | `undefined` |
+| `selectable`     | `selectable`      | (optional) Set to true to add selection column                                               | `boolean`                                             | `false`     |
+| `selection`      | --                | Read-only selection array - populated with raw data from selected rows                       | `string[]`                                            | `[]`        |
+| `shadeAlternate` | `shade-alternate` | (optional) Shade every second row darker                                                     | `boolean`                                             | `true`      |
+| `styles`         | `styles`          | (optional) Injected css styles                                                               | `any`                                                 | `undefined` |
+| `visible`        | `visible`         | (optional) Set to false to hide table, used for nested tables to re-render upon toggle       | `boolean`                                             | `true`      |
 
 
 ## Events

diff --git a/packages/components/src/components/radio-button/radio-button.css b/packages/components/src/components/radio-button/radio-button.css
@@ -40,12 +40,12 @@ scale-radio-button {
   --transition-label: var(--transition);
   --font-weight-label: var(--telekom-typography-font-weight-medium);
   --color-label: var(--color-text);
+  --spacing-label: var(--telekom-spacing-composition-space-04);
 
   /*control*/
   --width-control: var(--telekom-spacing-composition-space-07);
   --height-control: var(--telekom-spacing-composition-space-07);
   --transition-control: var(--transition);
-  --spacing-control: 0 var(--telekom-spacing-composition-space-04) 0 0;
   --background-color-control: var(--telekom-color-ui-base);
   --border-control: var(--telekom-spacing-composition-space-01) solid
     var(--telekom-color-ui-border-standard);
@@ -114,6 +114,7 @@ scale-icon-alert-error {
   font-weight: var(--font-weight-label);
   cursor: pointer;
   line-height: var(--telekom-typography-line-spacing-standard);
+  padding-left: var(--spacing-label);
 }
 .radio-button input {
   width: var(--width-control);
@@ -123,7 +124,7 @@ scale-icon-alert-error {
   -webkit-appearance: none;
   background-color: var(--telekom-color-ui-state-fill-standard);
   border: var(--border-control);
-  margin: var(--spacing-control);
+  margin: 0;
   cursor: pointer;
 }
 

diff --git a/packages/design-tokens/CHANGELOG.md b/packages/design-tokens/CHANGELOG.md
@@ -3,6 +3,14 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [3.0.0-beta.140](https://github.com/telekom/scale/compare/v3.0.0-beta.139...v3.0.0-beta.140) (2023-09-13)
+
+**Note:** Version bump only for package @telekom/scale-design-tokens
+
+
+
+
+
 # [3.0.0-beta.139](https://github.com/telekom/scale/compare/v3.0.0-beta.138...v3.0.0-beta.139) (2023-09-06)
 
 **Note:** Version bump only for package @telekom/scale-design-tokens

diff --git a/packages/design-tokens/package.json b/packages/design-tokens/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@telekom/scale-design-tokens",
-  "version": "3.0.0-beta.139",
+  "version": "3.0.0-beta.140",
   "type": "module",
   "description": "Design Tokens for the Scale Design System",
   "homepage": "https://github.com/telekom/scale",

diff --git a/packages/storybook-vue/CHANGELOG.md b/packages/storybook-vue/CHANGELOG.md
@@ -3,6 +3,22 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [3.0.0-beta.140](https://github.com/telekom/scale/compare/v3.0.0-beta.139...v3.0.0-beta.140) (2023-09-13)
+
+
+### Bug Fixes
+
+* **radio-button:** ensure change event is emitted when clicking input-label gap ([#2123](https://github.com/telekom/scale/issues/2123)) ([5423cb8](https://github.com/telekom/scale/commit/5423cb80520f93aae52eab4ff6a5477dcd072f09))
+
+
+### Features
+
+* **data-grid:** enable localization for flyout menu ([#1411](https://github.com/telekom/scale/issues/1411)) ([053b10d](https://github.com/telekom/scale/commit/053b10d4e75616059a889b6e1d26012645eda97d))
+
+
+
+
+
 # [3.0.0-beta.139](https://github.com/telekom/scale/compare/v3.0.0-beta.138...v3.0.0-beta.139) (2023-09-06)
 
 **Note:** Version bump only for package @telekom/scale-storybook-vue

diff --git a/packages/storybook-vue/package.json b/packages/storybook-vue/package.json
@@ -2,7 +2,7 @@
   "homepage": "https://telekom.github.io/scale",
   "name": "@telekom/scale-storybook-vue",
   "private": true,
-  "version": "3.0.0-beta.139",
+  "version": "3.0.0-beta.140",
   "main": "index.js",
   "license": "MPL-2.0",
   "devDependencies": {
@@ -32,8 +32,8 @@
   "dependencies": {
     "@storybook/addon-viewport": "^6.4.22",
     "@telekom/design-tokens": "^1.0.0-beta.2",
-    "@telekom/scale-components": "^3.0.0-beta.139",
-    "@telekom/scale-components-vue": "^3.0.0-beta.139"
+    "@telekom/scale-components": "^3.0.0-beta.140",
+    "@telekom/scale-components-vue": "^3.0.0-beta.140"
   },
   "scripts": {
     "prestart": "rm -rf node_modules/.cache/ && yes | cp -a ../components/dist/scale-components/fonts/* public/fonts/ && yes | cp -a ../components/dist/scale-components/scale-components.css public/",

diff --git a/packages/storybook-vue/stories/components/data-grid/DataGrid.stories.mdx b/packages/storybook-vue/stories/components/data-grid/DataGrid.stories.mdx
@@ -99,6 +99,13 @@ import ScaleDataGrid from './ScaleDataGrid.vue';
       description: `(optional) Set to true to add selection column`,
       control: { type: null },
     },
+    localization: {
+      table: {
+        type: { summary: 'object' },
+      },
+      description: `(optional) localization object for sort by, toogle visibility and select/deselect all. The default value is English`,
+      control: { type: null },
+    },
     shadeAlternate: {
       table: {
         type: { summary: 'boolean' },
@@ -228,6 +235,11 @@ export const Template = (args, {}) => ({
             [4, 'Heidi', '3:15'],
             [5, 'Muhammad', '21:45'],
         ];
+        dataGrid.localization = {
+          sortBy: 'Sort By',
+          toggle: 'Toogle Visibility',
+          select: 'Select / Deselect All'
+        }
     }
     </script>
 </content>`}

diff --git a/...torybook-vue/stories/components/radio-button-group/RadioButtonGroup.stories.mdx b/...torybook-vue/stories/components/radio-button-group/RadioButtonGroup.stories.mdx
@@ -164,12 +164,12 @@ scale-radio-button {
   --transition-label: var(--transition);
   --font-weight-label: var(--telekom-typography-font-weight-medium);
   --color-label: var(--color-text);
+  --spacing-label: var(--telekom-spacing-composition-space-04);
 
   /*control*/
   --width-control: var(--telekom-spacing-composition-space-07);
   --height-control: var(--telekom-spacing-composition-space-07);
   --transition-control: var(--transition);
-  --spacing-control: 0 var(--telekom-spacing-composition-space-04) 0 0;
   --background-color-control: var(--telekom-color-ui-base);
   --border-control: var(--telekom-spacing-composition-space-01) solid
     var(--telekom-color-ui-border-standard);