diff --git a/.changeset/loud-days-burn.md b/.changeset/loud-days-burn.md new file mode 100644 index 0000000000..548939b463 --- /dev/null +++ b/.changeset/loud-days-burn.md @@ -0,0 +1,5 @@ +--- +'@siemens/ix': patch +--- + +fix(core/group-item): allow clicks on supress click event diff --git a/.changeset/many-singers-exercise.md b/.changeset/many-singers-exercise.md new file mode 100644 index 0000000000..2da6d96d1c --- /dev/null +++ b/.changeset/many-singers-exercise.md @@ -0,0 +1,5 @@ +--- +'@siemens/ix': patch +--- + +fix(core/application-header): increase font diff --git a/.changeset/rare-frogs-marry.md b/.changeset/rare-frogs-marry.md new file mode 100644 index 0000000000..fd77f4865f --- /dev/null +++ b/.changeset/rare-frogs-marry.md @@ -0,0 +1,5 @@ +--- +'@siemens/ix-aggrid': patch +--- + +fix(core/aggrid): align colors diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index 4f0ee28d3f..81de06dde9 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -73,7 +73,7 @@ Once it's filed: #### Before Submitting an Enhancement -- Read the [documentation](https://ix.siemens.io/version-dev/docs/getting-started/) carefully and find out if the functionality is already covered, maybe by an individual configuration. +- Read the [documentation](https://ix.siemens.io/docs/getting-started/) carefully and find out if the functionality is already covered, maybe by an individual configuration. - Perform a [search](https://github.com/siemens/ix/issues) to see if the enhancement has already been suggested. If it has, add a comment to the existing issue instead of opening a new one. - Find out whether your idea fits with the scope and aims of the project. It's up to you to make a strong case to convince the project's developers of the merits of this feature. Keep in mind that we want features that will be useful to the majority of our users and not just a small subset. If you're just targeting a minority of users, consider writing an add-on/plugin library. diff --git a/packages/aggrid/scss/ix-aggrid.scss b/packages/aggrid/scss/ix-aggrid.scss index 2396761ef2..d79f694c66 100644 --- a/packages/aggrid/scss/ix-aggrid.scss +++ b/packages/aggrid/scss/ix-aggrid.scss @@ -18,6 +18,7 @@ --ag-odd-row-background-color: transparent; --ag-row-hover-color: var(--theme-table-data-row--background--hover); --ag-selected-row-background-color: var(--theme-table-data-row--background--selected); + --ag-selected-hover-row-background-color: var(--theme-table-data-row--background--selected-hover); --ag-range-selection-background-color: var(--theme-table-data-row--background--selected); --ag-range-selection-border-color: var(--theme-input--border-color--focus); @@ -44,6 +45,11 @@ } } + .ag-row-hover.ag-row-selected::before { + background-color: var(--ag-selected-hover-row-background-color); + background-image: unset; + } + .ag-root-wrapper { border: none; } @@ -94,6 +100,10 @@ background-color: var(--theme-table-header-splitter--background--hover); } + .ag-row-hover.ag-row-selected { + background-color: unset; + } + .ag-row-focus::before { border: 1px solid var(--theme-color-input--focus); } @@ -102,10 +112,6 @@ background-color: var(--theme-table-data-row--background--active); } - .ag-row-hover.ag-row-selected { - background-color: var(--theme-table-data-row--background--selected-hover); - } - .ag-row-hover.ag-row-selected:active { background-color: var(--theme-table-data-row--background--selected-active); } diff --git a/packages/core/component-doc.json b/packages/core/component-doc.json index b7d261f528..5cf638e57a 100644 --- a/packages/core/component-doc.json +++ b/packages/core/component-doc.json @@ -402,12 +402,14 @@ "dependencies": [ "ix-menu-expand-icon", "ix-icon-button", + "ix-typography", "ix-dropdown" ], "dependencyGraph": { "ix-application-header": [ "ix-menu-expand-icon", "ix-icon-button", + "ix-typography", "ix-dropdown" ], "ix-menu-expand-icon": [ @@ -443,7 +445,7 @@ "type": "string" } ], - "optional": false, + "optional": true, "required": false } ], @@ -622,6 +624,7 @@ "ix-application-header": [ "ix-menu-expand-icon", "ix-icon-button", + "ix-typography", "ix-dropdown" ], "ix-menu-expand-icon": [ @@ -6987,7 +6990,7 @@ "type": "string" } ], - "optional": false, + "optional": true, "required": false }, { @@ -7008,7 +7011,7 @@ "type": "number" } ], - "optional": false, + "optional": true, "required": false }, { @@ -7024,6 +7027,7 @@ "reflectToAttr": true, "docs": "Whether the group is selected.", "docsTags": [], + "default": "false", "values": [ { "type": "boolean" @@ -7050,7 +7054,7 @@ "type": "string" } ], - "optional": false, + "optional": true, "required": false }, { @@ -7225,7 +7229,7 @@ "type": "string" } ], - "optional": false, + "optional": true, "required": false }, { @@ -7246,7 +7250,7 @@ "type": "number" } ], - "optional": false, + "optional": true, "required": false }, { @@ -7267,7 +7271,7 @@ "type": "string" } ], - "optional": false, + "optional": true, "required": false }, { @@ -7283,6 +7287,7 @@ "reflectToAttr": false, "docs": "Show selected state", "docsTags": [], + "default": "false", "values": [ { "type": "boolean" @@ -7331,7 +7336,7 @@ "type": "string" } ], - "optional": false, + "optional": true, "required": false } ], @@ -8690,6 +8695,7 @@ "ix-application-header": [ "ix-menu-expand-icon", "ix-icon-button", + "ix-typography", "ix-dropdown" ], "ix-menu-expand-icon": [ @@ -16509,6 +16515,7 @@ "encapsulation": "shadow", "dependents": [ "ix-action-card", + "ix-application-header", "ix-application-switch-modal", "ix-avatar", "ix-blind", @@ -16531,6 +16538,9 @@ "ix-action-card": [ "ix-typography" ], + "ix-application-header": [ + "ix-typography" + ], "ix-application-switch-modal": [ "ix-typography" ], diff --git a/packages/core/src/components.d.ts b/packages/core/src/components.d.ts index 2917109392..cfe3b94633 100644 --- a/packages/core/src/components.d.ts +++ b/packages/core/src/components.d.ts @@ -142,7 +142,7 @@ export namespace Components { /** * Application name */ - "name": string; + "name"?: string; } interface IxApplicationSidebar { } @@ -1064,11 +1064,11 @@ export namespace Components { /** * Group header */ - "header": string; + "header"?: string; /** * The index of the selected group entry. If undefined no group item is selected. */ - "index": number; + "index"?: number; /** * Whether the group is selected. */ @@ -1076,7 +1076,7 @@ export namespace Components { /** * Group header subtitle */ - "subHeader": string; + "subHeader"?: string; /** * Prevent header from being selectable */ @@ -1092,15 +1092,15 @@ export namespace Components { /** * Group item icon */ - "icon": string; + "icon"?: string; /** * Index */ - "index": number; + "index"?: number; /** * Group item secondary text */ - "secondaryText": string; + "secondaryText"?: string; /** * Show selected state */ @@ -1112,7 +1112,7 @@ export namespace Components { /** * Group item text */ - "text": string; + "text"?: string; } interface IxIconButton { /** diff --git a/packages/core/src/components/application-header/application-header.tsx b/packages/core/src/components/application-header/application-header.tsx index efc32479f6..f8aa4d3cfa 100644 --- a/packages/core/src/components/application-header/application-header.tsx +++ b/packages/core/src/components/application-header/application-header.tsx @@ -43,7 +43,7 @@ export class ApplicationHeader { /** * Application name */ - @Prop() name: string; + @Prop() name?: string; @State() breakpoint: Breakpoint = 'lg'; @State() menuExpanded = false; @@ -200,7 +200,9 @@ export class ApplicationHeader { -
{this.name}
+ + {this.name} +
{this.breakpoint === 'sm' ? ( diff --git a/packages/core/src/components/group-item/group-item.scss b/packages/core/src/components/group-item/group-item.scss index ac1044815c..2d230e68bc 100644 --- a/packages/core/src/components/group-item/group-item.scss +++ b/packages/core/src/components/group-item/group-item.scss @@ -73,10 +73,6 @@ $focusBorderWidth: 1px; } } -:host(.suppress-selection) { - pointer-events: none; -} - :host(.selected) { border-top-width: 0.062rem !important; background-color: var(--theme-color-ghost--selected); diff --git a/packages/core/src/components/group-item/group-item.tsx b/packages/core/src/components/group-item/group-item.tsx index 469905c1e6..8bb717e59a 100644 --- a/packages/core/src/components/group-item/group-item.tsx +++ b/packages/core/src/components/group-item/group-item.tsx @@ -29,17 +29,17 @@ export class GroupItem { /** * Group item icon */ - @Prop() icon: string; + @Prop() icon?: string; /** * Group item text */ - @Prop() text: string; + @Prop() text?: string; /** * Group item secondary text */ - @Prop() secondaryText: string; + @Prop() secondaryText?: string; /** * Supress the selection of the group @@ -49,7 +49,7 @@ export class GroupItem { /** * Show selected state */ - @Prop() selected: boolean; + @Prop() selected: boolean = false; /** * The elements tabindex attribute will get set accordingly. @@ -60,18 +60,15 @@ export class GroupItem { /** * Selection changed */ - @Event() selectedChanged: EventEmitter; + @Event() selectedChanged!: EventEmitter; /** * Index */ - @Prop() index: number; + @Prop() index?: number; @Listen('click', { passive: true }) clickListen() { - if (this.suppressSelection) { - return; - } this.selectedChanged.emit(this.hostElement); } @@ -80,7 +77,6 @@ export class GroupItem {