Skip to content

Commit 9308848

Browse files
Merge branch 'patternfly:main' into main
2 parents 5e2276a + 6f848e8 commit 9308848

File tree

12 files changed

+758
-491
lines changed

12 files changed

+758
-491
lines changed

packages/module/package.json

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@patternfly/react-catalog-view-extension",
3-
"version": "6.0.0-prerelease.0",
3+
"version": "6.1.0-prerelease.0",
44
"description": "This library provides catalog view extensions for PatternFly 4 React.",
55
"main": "dist/js/index.js",
66
"module": "dist/esm/index.js",
@@ -40,18 +40,18 @@
4040
"patternfly"
4141
],
4242
"dependencies": {
43-
"@patternfly/react-core": "^6.0.0",
44-
"@patternfly/react-styles": "^6.0.0"
43+
"@patternfly/react-core": "^6.1.0",
44+
"@patternfly/react-styles": "^6.1.0"
4545
},
4646
"peerDependencies": {
4747
"react": "^17 || ^18",
4848
"react-dom": "^17 || ^18"
4949
},
5050
"devDependencies": {
51-
"@patternfly/patternfly": "^6.0.0",
52-
"@patternfly/documentation-framework": "6.0.0-alpha.120",
53-
"@patternfly/react-table": "^6.0.0",
54-
"@patternfly/react-code-editor": "^6.0.0",
51+
"@patternfly/patternfly": "^6.1.0",
52+
"@patternfly/documentation-framework": "6.5.14",
53+
"@patternfly/react-table": "^6.1.0",
54+
"@patternfly/react-code-editor": "^6.1.0",
5555
"@octokit/rest": "^18.0.0",
5656
"surge": "^0.23.1",
5757
"react-monaco-editor": "0.51.0",

packages/module/patternfly-docs/content/examples/catalogItemHeader.css

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,6 @@
1717
margin-inline-start: var(--pf-t--global--spacer--md);
1818
}
1919
.ws-react-e-catalog-item-header .catalog-item-header-pf-title {
20-
font-weight: var(--pf-t--global--font--weight--body);
2120
margin-block-end: 0;
2221
margin-block-start: 0;
2322
}

packages/module/patternfly-docs/content/examples/catalogTile.css

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,9 @@
22
color: var(--pf-t--global--text--color--regular);
33
text-decoration: none;
44
}
5+
.ws-react-e-catalog-tile .pf-v6-c-card__header-main {
6+
display: flex;
7+
}
58
.ws-react-e-catalog-tile .catalog-tile-pf-header .catalog-tile-pf-subtitle {
69
color: var(--pf-t--global--text--color--subtle);
710
font-size: var(--pf-t--global--font--size--body--sm);

packages/module/patternfly-docs/content/examples/verticalTab.css

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -18,6 +18,7 @@
1818
}
1919
.ws-react-e-vertical-tabs .vertical-tabs-pf-tab > a {
2020
color: var(--pf-t--global--text--color--regular);
21+
text-decoration: none;
2122
display: inline-block;
2223
font-size: var(--pf-t--global--font--size--body--default);
2324
padding-block: var(--pf-t--global--spacer--xs);
@@ -30,7 +31,6 @@
3031
margin-inline-start: var(--pf-t--global--spacer--md);
3132
}
3233
.ws-react-e-vertical-tabs .vertical-tabs-pf-tab > a:hover, .ws-react-e-vertical-tabs .vertical-tabs-pf-tab > a:focus {
33-
color: var(--pf-t--global--text--color--regular);
3434
background-color: var(--pf-t--global--background--color--action--plain--hover);
3535
text-decoration: none;
3636
}

packages/module/sass/react-catalog-view-extension/_catalog-item.scss

Lines changed: 0 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -13,12 +13,6 @@
1313
margin-left: 20px;
1414
}
1515

16-
.catalog-item-header-pf-title {
17-
font-weight: 400;
18-
margin-bottom: 0;
19-
margin-top: 0;
20-
}
21-
2216
.catalog-item-header-pf-subtitle {
2317
color: var(--pf-t--global--text--color--subtle);
2418
margin-bottom: 0;

packages/module/sass/react-catalog-view-extension/_catalog-tile.scss

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,10 @@
1111
text-decoration: none;
1212
}
1313

14+
.pf-v6-c-card__header-main {
15+
display: flex;
16+
}
17+
1418
.pf-v6-c-card__actions {
1519
padding-left: 5px;
1620
}

packages/module/sass/react-catalog-view-extension/_vertical-tabs.scss

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@
1414

1515
> a {
1616
color: var( --pf-t--global--text--color--regular);
17+
text-decoration: none;
1718
display: inline-block;
1819
font-size: 13px;
1920
padding: 3px 6px 3px 15px;
@@ -23,7 +24,7 @@
2324

2425
&:hover,
2526
&:focus {
26-
color: var(--pf-t--global--text--color--brand--hover);
27+
background-color: var(--pf-t--global--background--color--action--plain--hover);
2728
text-decoration: none;
2829
}
2930

packages/module/src/components/CatalogItemHeader/CatalogItemHeader.tsx

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
import * as React from 'react';
2+
import { Content, Title } from '@patternfly/react-core';
23
import { css } from '@patternfly/react-styles';
34

45
export interface CatalogItemHeaderProps extends Omit<React.HTMLProps<HTMLElement>, 'title'> {
@@ -26,8 +27,8 @@ export const CatalogItemHeader: React.FunctionComponent<CatalogItemHeaderProps>
2627
{iconImg && <img className="catalog-item-header-pf-icon" src={iconImg} alt="" />}
2728
{!iconImg && iconClass && <span className={`catalog-item-header-pf-icon ${iconClass}`} />}
2829
<div className="catalog-item-header-pf-text">
29-
<h1 className="catalog-item-header-pf-title">{title}</h1>
30-
{vendor && <h5 className="catalog-item-header-pf-subtitle">{vendor}</h5>}
30+
<Title headingLevel="h1" className="catalog-item-header-pf-title">{title}</Title>
31+
{vendor && <Content component="p" className="catalog-item-header-pf-subtitle">{vendor}</Content>}
3132
</div>
3233
</header>
3334
);

packages/module/src/components/CatalogItemHeader/__snapshots__/CatalogItemHeader.test.tsx.snap

Lines changed: 11 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -9,12 +9,19 @@ exports[`simple catalog item header 1`] = `
99
class="catalog-item-header-pf-text"
1010
>
1111
<h1
12-
class="catalog-item-header-pf-title"
12+
class="pf-v6-c-title pf-m-h1 catalog-item-header-pf-title"
13+
data-ouia-component-id="OUIA-Generated-Title-1"
14+
data-ouia-component-type="PF6/Title"
15+
data-ouia-safe="true"
1316
>
1417
PatternFly
1518
</h1>
16-
<h5
17-
class="catalog-item-header-pf-subtitle"
19+
<p
20+
class="pf-v6-c-content--p catalog-item-header-pf-subtitle"
21+
data-ouia-component-id="OUIA-Generated-Content-1"
22+
data-ouia-component-type="PF6/Content"
23+
data-ouia-safe="true"
24+
data-pf-content="true"
1825
>
1926
<span>
2027
provided by
@@ -24,7 +31,7 @@ exports[`simple catalog item header 1`] = `
2431
Red Hat
2532
</a>
2633
</span>
27-
</h5>
34+
</p>
2835
</div>
2936
</header>
3037
</DocumentFragment>

packages/module/src/components/CatalogTile/CatalogTile.tsx

Lines changed: 15 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -63,14 +63,24 @@ export class CatalogTile extends React.Component<CatalogTileProps> {
6363
private handleClick = (e: React.FormEvent<HTMLInputElement> | React.MouseEvent<Element, MouseEvent>) => {
6464
const { onClick, href } = this.props;
6565

66-
if (!href) {
67-
e.preventDefault();
68-
} else {
66+
if ("type" in e && e.type === "click" && onClick) {
67+
// It's a MouseEvent
68+
const mouseEvent = e as React.MouseEvent<Element, MouseEvent>;
69+
if (
70+
mouseEvent.metaKey || // Cmd key (Mac)
71+
mouseEvent.ctrlKey || // Ctrl key
72+
mouseEvent.shiftKey // Shift key
73+
) {
74+
window.open(href, '_blank');
75+
return;
76+
}
77+
} else if (href){
6978
window.open(href, '_blank');
7079
}
80+
7181
if (onClick) {
7282
onClick(e);
73-
}
83+
}
7484
};
7585

7686
private renderBadges = (badges: React.ReactNode[]) => {
@@ -119,7 +129,6 @@ export class CatalogTile extends React.Component<CatalogTileProps> {
119129
>
120130
{(badges.length > 0 || iconImg || iconClass || icon || onClick || href) && (
121131
<CardHeader
122-
actions={{ actions: badges.length > 0 && this.renderBadges(badges), hasNoOffset: true }}
123132
selectableActions={ (onClick || href) && {
124133
selectableActionId: id + '-input',
125134
onClickAction: (e) => this.handleClick(e),
@@ -129,6 +138,7 @@ export class CatalogTile extends React.Component<CatalogTileProps> {
129138
>
130139
{iconImg && <img className="catalog-tile-pf-icon" src={iconImg} alt={iconAlt} />}
131140
{!iconImg && (iconClass || icon) && <span className={`catalog-tile-pf-icon ${iconClass}`}>{icon}</span>}
141+
{badges.length > 0 && this.renderBadges(badges)}
132142
</CardHeader>
133143
)}
134144
<CardTitle className="catalog-tile-pf-header">

0 commit comments

Comments
 (0)