@patternfly/react-core 4.224.6 → 4.224.9
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +24 -0
- package/dist/esm/components/NotificationDrawer/NotificationDrawerGroup.d.ts +2 -0
- package/dist/esm/components/NotificationDrawer/NotificationDrawerGroup.d.ts.map +1 -1
- package/dist/esm/components/NotificationDrawer/NotificationDrawerGroup.js +2 -2
- package/dist/esm/components/NotificationDrawer/NotificationDrawerGroup.js.map +1 -1
- package/dist/esm/components/NotificationDrawer/NotificationDrawerListItemHeader.d.ts +2 -0
- package/dist/esm/components/NotificationDrawer/NotificationDrawerListItemHeader.d.ts.map +1 -1
- package/dist/esm/components/NotificationDrawer/NotificationDrawerListItemHeader.js +2 -2
- package/dist/esm/components/NotificationDrawer/NotificationDrawerListItemHeader.js.map +1 -1
- package/dist/js/components/NotificationDrawer/NotificationDrawerGroup.d.ts +2 -0
- package/dist/js/components/NotificationDrawer/NotificationDrawerGroup.d.ts.map +1 -1
- package/dist/js/components/NotificationDrawer/NotificationDrawerGroup.js +2 -2
- package/dist/js/components/NotificationDrawer/NotificationDrawerGroup.js.map +1 -1
- package/dist/js/components/NotificationDrawer/NotificationDrawerListItemHeader.d.ts +2 -0
- package/dist/js/components/NotificationDrawer/NotificationDrawerListItemHeader.d.ts.map +1 -1
- package/dist/js/components/NotificationDrawer/NotificationDrawerListItemHeader.js +2 -2
- package/dist/js/components/NotificationDrawer/NotificationDrawerListItemHeader.js.map +1 -1
- package/dist/umd/react-core.js +4 -4
- package/dist/umd/react-core.min.css +102 -102
- package/dist/umd/react-core.min.js +1 -1
- package/package.json +6 -6
- package/src/components/NotificationDrawer/NotificationDrawerGroup.tsx +5 -2
- package/src/components/NotificationDrawer/NotificationDrawerListItemHeader.tsx +5 -2
- package/src/components/NotificationDrawer/__tests__/NotificationDrawerGroup.test.tsx +5 -0
- package/src/components/NotificationDrawer/__tests__/NotificationDrawerListItemHeader.test.tsx +5 -0
- package/src/components/NotificationDrawer/__tests__/__snapshots__/NotificationDrawerGroup.test.tsx.snap +47 -0
- package/src/components/NotificationDrawer/__tests__/__snapshots__/NotificationDrawerListItemHeader.test.tsx.snap +31 -0
- package/src/components/Tabs/examples/Tabs.md +131 -111
- package/src/components/Tabs/examples/TabsDynamic.tsx +1 -0
- package/src/components/Toolbar/examples/Toolbar.md +2 -2
- package/src/components/Toolbar/examples/ToolbarCustomChipGroupContent.tsx +1 -1
- package/src/components/Wizard/examples/Wizard.md +11 -11
- package/src/demos/CardDemos.md +27 -26
- package/src/demos/Masthead.md +1 -1
- package/src/demos/TileDemo.md +8 -8
- package/src/layouts/Grid/examples/Grid.md +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,30 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
## 4.224.9 (2022-07-07)
|
|
7
|
+
|
|
8
|
+
**Note:** Version bump only for package @patternfly/react-core
|
|
9
|
+
|
|
10
|
+
|
|
11
|
+
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
## 4.224.8 (2022-07-07)
|
|
15
|
+
|
|
16
|
+
**Note:** Version bump only for package @patternfly/react-core
|
|
17
|
+
|
|
18
|
+
|
|
19
|
+
|
|
20
|
+
|
|
21
|
+
|
|
22
|
+
## 4.224.7 (2022-07-07)
|
|
23
|
+
|
|
24
|
+
**Note:** Version bump only for package @patternfly/react-core
|
|
25
|
+
|
|
26
|
+
|
|
27
|
+
|
|
28
|
+
|
|
29
|
+
|
|
6
30
|
## 4.224.6 (2022-07-06)
|
|
7
31
|
|
|
8
32
|
**Note:** Version bump only for package @patternfly/react-core
|
|
@@ -19,6 +19,8 @@ export interface NotificationDrawerGroupProps extends Omit<React.HTMLProps<HTMLD
|
|
|
19
19
|
truncateTitle?: number;
|
|
20
20
|
/** Position of the tooltip which is displayed if text is truncated */
|
|
21
21
|
tooltipPosition?: TooltipPosition | 'auto' | 'top' | 'bottom' | 'left' | 'right' | 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end' | 'left-start' | 'left-end' | 'right-start' | 'right-end';
|
|
22
|
+
/** Sets the heading level to use for the group title. Default is h1. */
|
|
23
|
+
headingLevel?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
|
|
22
24
|
}
|
|
23
25
|
export declare const NotificationDrawerGroup: React.FunctionComponent<NotificationDrawerGroupProps>;
|
|
24
26
|
//# sourceMappingURL=NotificationDrawerGroup.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NotificationDrawerGroup.d.ts","sourceRoot":"","sources":["../../../../src/components/NotificationDrawer/NotificationDrawerGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAQ/B,OAAO,EAAW,eAAe,EAAE,MAAM,YAAY,CAAC;AAEtD,MAAM,WAAW,4BAA6B,SAAQ,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC;IAClG,yCAAyC;IACzC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,6CAA6C;IAC7C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,uCAAuC;IACvC,KAAK,EAAE,MAAM,CAAC;IACd,4DAA4D;IAC5D,UAAU,EAAE,OAAO,CAAC;IACpB,sEAAsE;IACtE,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,2DAA2D;IAC3D,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,GAAG,EAAE,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;IAChD,uCAAuC;IACvC,KAAK,EAAE,MAAM,GAAG,KAAK,CAAC,SAAS,CAAC;IAChC,wCAAwC;IACxC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,sEAAsE;IACtE,eAAe,CAAC,EACZ,eAAe,GACf,MAAM,GACN,KAAK,GACL,QAAQ,GACR,MAAM,GACN,OAAO,GACP,WAAW,GACX,SAAS,GACT,cAAc,GACd,YAAY,GACZ,YAAY,GACZ,UAAU,GACV,aAAa,GACb,WAAW,CAAC;
|
|
1
|
+
{"version":3,"file":"NotificationDrawerGroup.d.ts","sourceRoot":"","sources":["../../../../src/components/NotificationDrawer/NotificationDrawerGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAQ/B,OAAO,EAAW,eAAe,EAAE,MAAM,YAAY,CAAC;AAEtD,MAAM,WAAW,4BAA6B,SAAQ,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC;IAClG,yCAAyC;IACzC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,6CAA6C;IAC7C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,uCAAuC;IACvC,KAAK,EAAE,MAAM,CAAC;IACd,4DAA4D;IAC5D,UAAU,EAAE,OAAO,CAAC;IACpB,sEAAsE;IACtE,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,2DAA2D;IAC3D,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,GAAG,EAAE,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;IAChD,uCAAuC;IACvC,KAAK,EAAE,MAAM,GAAG,KAAK,CAAC,SAAS,CAAC;IAChC,wCAAwC;IACxC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,sEAAsE;IACtE,eAAe,CAAC,EACZ,eAAe,GACf,MAAM,GACN,KAAK,GACL,QAAQ,GACR,MAAM,GACN,OAAO,GACP,WAAW,GACX,SAAS,GACT,cAAc,GACd,YAAY,GACZ,YAAY,GACZ,UAAU,GACV,aAAa,GACb,WAAW,CAAC;IAChB,wEAAwE;IACxE,YAAY,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;CACxD;AAED,eAAO,MAAM,uBAAuB,EAAE,KAAK,CAAC,iBAAiB,CAAC,4BAA4B,CA0EzF,CAAC"}
|
|
@@ -9,7 +9,7 @@ import { Tooltip } from '../Tooltip';
|
|
|
9
9
|
export const NotificationDrawerGroup = (_a) => {
|
|
10
10
|
var { children, className = '', count, isExpanded, isRead = false,
|
|
11
11
|
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
12
|
-
onExpand = (event, expanded) => undefined, title, truncateTitle = 0, tooltipPosition } = _a, props = __rest(_a, ["children", "className", "count", "isExpanded", "isRead", "onExpand", "title", "truncateTitle", "tooltipPosition"]);
|
|
12
|
+
onExpand = (event, expanded) => undefined, title, truncateTitle = 0, tooltipPosition, headingLevel: HeadingLevel = 'h1' } = _a, props = __rest(_a, ["children", "className", "count", "isExpanded", "isRead", "onExpand", "title", "truncateTitle", "tooltipPosition", "headingLevel"]);
|
|
13
13
|
const titleRef = React.useRef(null);
|
|
14
14
|
const [isTooltipVisible, setIsTooltipVisible] = React.useState(false);
|
|
15
15
|
React.useEffect(() => {
|
|
@@ -25,7 +25,7 @@ export const NotificationDrawerGroup = (_a) => {
|
|
|
25
25
|
}, [titleRef, truncateTitle, isTooltipVisible]);
|
|
26
26
|
const Title = (React.createElement("div", Object.assign({}, (isTooltipVisible && { tabIndex: 0 }), { ref: titleRef, className: css(styles.notificationDrawerGroupToggleTitle) }), title));
|
|
27
27
|
return (React.createElement("section", Object.assign({}, props, { className: css(styles.notificationDrawerGroup, isExpanded && styles.modifiers.expanded, className) }),
|
|
28
|
-
React.createElement(
|
|
28
|
+
React.createElement(HeadingLevel, null,
|
|
29
29
|
React.createElement("button", { className: css(styles.notificationDrawerGroupToggle), "aria-expanded": isExpanded, onClick: e => onExpand(e, !isExpanded), onKeyDown: e => {
|
|
30
30
|
if (e.key === 'Enter' || e.key === ' ') {
|
|
31
31
|
e.preventDefault();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NotificationDrawerGroup.js","sourceRoot":"","sources":["../../../../src/components/NotificationDrawer/NotificationDrawerGroup.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,cAAc,MAAM,yDAAyD,CAAC;AACrF,OAAO,EAAE,GAAG,EAAE,MAAM,0BAA0B,CAAC;AAC/C,OAAO,MAAM,MAAM,gFAAgF,CAAC;AACpG,OAAO,QAAQ,MAAM,uFAAuF,CAAC;AAE7G,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AACjC,OAAO,EAAE,OAAO,EAAmB,MAAM,YAAY,CAAC;
|
|
1
|
+
{"version":3,"file":"NotificationDrawerGroup.js","sourceRoot":"","sources":["../../../../src/components/NotificationDrawer/NotificationDrawerGroup.tsx"],"names":[],"mappings":"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"}
|
|
@@ -24,6 +24,8 @@ export interface NotificationDrawerListItemHeaderProps extends React.HTMLProps<H
|
|
|
24
24
|
truncateTitle?: number;
|
|
25
25
|
/** Position of the tooltip which is displayed if text is truncated */
|
|
26
26
|
tooltipPosition?: TooltipPosition | 'auto' | 'top' | 'bottom' | 'left' | 'right' | 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end' | 'left-start' | 'left-end' | 'right-start' | 'right-end';
|
|
27
|
+
/** Sets the heading level to use for the list item header title. Default is h2. */
|
|
28
|
+
headingLevel?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
|
|
27
29
|
}
|
|
28
30
|
export declare const NotificationDrawerListItemHeader: React.FunctionComponent<NotificationDrawerListItemHeaderProps>;
|
|
29
31
|
//# sourceMappingURL=NotificationDrawerListItemHeader.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NotificationDrawerListItemHeader.d.ts","sourceRoot":"","sources":["../../../../src/components/NotificationDrawer/NotificationDrawerListItemHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAa/B,OAAO,EAAW,eAAe,EAAE,MAAM,YAAY,CAAC;AAEtD,eAAO,MAAM,YAAY;;;;;;CAMxB,CAAC;AAEF,MAAM,WAAW,qCAAsC,SAAQ,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC;IAC5F,wEAAwE;IACxE,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,oEAAoE;IACpE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,gEAAgE;IAChE,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,gEAAgE;IAChE,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,2CAA2C;IAC3C,KAAK,EAAE,MAAM,CAAC;IACd,4CAA4C;IAC5C,OAAO,CAAC,EAAE,SAAS,GAAG,QAAQ,GAAG,SAAS,GAAG,MAAM,GAAG,SAAS,CAAC;IAChE,wCAAwC;IACxC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,sEAAsE;IACtE,eAAe,CAAC,EACZ,eAAe,GACf,MAAM,GACN,KAAK,GACL,QAAQ,GACR,MAAM,GACN,OAAO,GACP,WAAW,GACX,SAAS,GACT,cAAc,GACd,YAAY,GACZ,YAAY,GACZ,UAAU,GACV,aAAa,GACb,WAAW,CAAC;
|
|
1
|
+
{"version":3,"file":"NotificationDrawerListItemHeader.d.ts","sourceRoot":"","sources":["../../../../src/components/NotificationDrawer/NotificationDrawerListItemHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAa/B,OAAO,EAAW,eAAe,EAAE,MAAM,YAAY,CAAC;AAEtD,eAAO,MAAM,YAAY;;;;;;CAMxB,CAAC;AAEF,MAAM,WAAW,qCAAsC,SAAQ,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC;IAC5F,wEAAwE;IACxE,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,oEAAoE;IACpE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,gEAAgE;IAChE,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,gEAAgE;IAChE,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,2CAA2C;IAC3C,KAAK,EAAE,MAAM,CAAC;IACd,4CAA4C;IAC5C,OAAO,CAAC,EAAE,SAAS,GAAG,QAAQ,GAAG,SAAS,GAAG,MAAM,GAAG,SAAS,CAAC;IAChE,wCAAwC;IACxC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,sEAAsE;IACtE,eAAe,CAAC,EACZ,eAAe,GACf,MAAM,GACN,KAAK,GACL,QAAQ,GACR,MAAM,GACN,OAAO,GACP,WAAW,GACX,SAAS,GACT,cAAc,GACd,YAAY,GACZ,YAAY,GACZ,UAAU,GACV,aAAa,GACb,WAAW,CAAC;IAChB,mFAAmF;IACnF,YAAY,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;CACxD;AAED,eAAO,MAAM,gCAAgC,EAAE,KAAK,CAAC,iBAAiB,CAAC,qCAAqC,CAmD3G,CAAC"}
|
|
@@ -18,7 +18,7 @@ export const variantIcons = {
|
|
|
18
18
|
default: BellIcon
|
|
19
19
|
};
|
|
20
20
|
export const NotificationDrawerListItemHeader = (_a) => {
|
|
21
|
-
var { children, className = '', icon = null, srTitle, title, variant = 'default', truncateTitle = 0, tooltipPosition } = _a, props = __rest(_a, ["children", "className", "icon", "srTitle", "title", "variant", "truncateTitle", "tooltipPosition"]);
|
|
21
|
+
var { children, className = '', icon = null, srTitle, title, variant = 'default', truncateTitle = 0, tooltipPosition, headingLevel: HeadingLevel = 'h2' } = _a, props = __rest(_a, ["children", "className", "icon", "srTitle", "title", "variant", "truncateTitle", "tooltipPosition", "headingLevel"]);
|
|
22
22
|
const titleRef = React.useRef(null);
|
|
23
23
|
const [isTooltipVisible, setIsTooltipVisible] = React.useState(false);
|
|
24
24
|
React.useEffect(() => {
|
|
@@ -32,7 +32,7 @@ export const NotificationDrawerListItemHeader = (_a) => {
|
|
|
32
32
|
}
|
|
33
33
|
}, [titleRef, truncateTitle, isTooltipVisible]);
|
|
34
34
|
const Icon = variantIcons[variant];
|
|
35
|
-
const Title = (React.createElement(
|
|
35
|
+
const Title = (React.createElement(HeadingLevel, Object.assign({}, (isTooltipVisible && { tabIndex: 0 }), { ref: titleRef, className: css(styles.notificationDrawerListItemHeaderTitle, truncateTitle && styles.modifiers.truncate) }),
|
|
36
36
|
srTitle && React.createElement("span", { className: css(a11yStyles.screenReader) }, srTitle),
|
|
37
37
|
title));
|
|
38
38
|
return (React.createElement(React.Fragment, null,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NotificationDrawerListItemHeader.js","sourceRoot":"","sources":["../../../../src/components/NotificationDrawer/NotificationDrawerListItemHeader.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,QAAQ,MAAM,kDAAkD,CAAC;AACxE,OAAO,eAAe,MAAM,0DAA0D,CAAC;AACvF,OAAO,qBAAqB,MAAM,gEAAgE,CAAC;AACnG,OAAO,uBAAuB,MAAM,kEAAkE,CAAC;AACvG,OAAO,cAAc,MAAM,yDAAyD,CAAC;AACrF,OAAO,EAAE,GAAG,EAAE,MAAM,0BAA0B,CAAC;AAC/C,OAAO,MAAM,MAAM,gFAAgF,CAAC;AACpG,OAAO,UAAU,MAAM,oEAAoE,CAAC;AAE5F,OAAO,QAAQ,MAAM,2FAA2F,CAAC;AAEjH,OAAO,EAAE,OAAO,EAAmB,MAAM,YAAY,CAAC;AAEtD,MAAM,CAAC,MAAM,YAAY,GAAG;IAC1B,OAAO,EAAE,eAAe;IACxB,MAAM,EAAE,qBAAqB;IAC7B,OAAO,EAAE,uBAAuB;IAChC,IAAI,EAAE,cAAc;IACpB,OAAO,EAAE,QAAQ;CAClB,CAAC;
|
|
1
|
+
{"version":3,"file":"NotificationDrawerListItemHeader.js","sourceRoot":"","sources":["../../../../src/components/NotificationDrawer/NotificationDrawerListItemHeader.tsx"],"names":[],"mappings":"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"}
|
|
@@ -19,6 +19,8 @@ export interface NotificationDrawerGroupProps extends Omit<React.HTMLProps<HTMLD
|
|
|
19
19
|
truncateTitle?: number;
|
|
20
20
|
/** Position of the tooltip which is displayed if text is truncated */
|
|
21
21
|
tooltipPosition?: TooltipPosition | 'auto' | 'top' | 'bottom' | 'left' | 'right' | 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end' | 'left-start' | 'left-end' | 'right-start' | 'right-end';
|
|
22
|
+
/** Sets the heading level to use for the group title. Default is h1. */
|
|
23
|
+
headingLevel?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
|
|
22
24
|
}
|
|
23
25
|
export declare const NotificationDrawerGroup: React.FunctionComponent<NotificationDrawerGroupProps>;
|
|
24
26
|
//# sourceMappingURL=NotificationDrawerGroup.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NotificationDrawerGroup.d.ts","sourceRoot":"","sources":["../../../../src/components/NotificationDrawer/NotificationDrawerGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAQ/B,OAAO,EAAW,eAAe,EAAE,MAAM,YAAY,CAAC;AAEtD,MAAM,WAAW,4BAA6B,SAAQ,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC;IAClG,yCAAyC;IACzC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,6CAA6C;IAC7C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,uCAAuC;IACvC,KAAK,EAAE,MAAM,CAAC;IACd,4DAA4D;IAC5D,UAAU,EAAE,OAAO,CAAC;IACpB,sEAAsE;IACtE,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,2DAA2D;IAC3D,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,GAAG,EAAE,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;IAChD,uCAAuC;IACvC,KAAK,EAAE,MAAM,GAAG,KAAK,CAAC,SAAS,CAAC;IAChC,wCAAwC;IACxC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,sEAAsE;IACtE,eAAe,CAAC,EACZ,eAAe,GACf,MAAM,GACN,KAAK,GACL,QAAQ,GACR,MAAM,GACN,OAAO,GACP,WAAW,GACX,SAAS,GACT,cAAc,GACd,YAAY,GACZ,YAAY,GACZ,UAAU,GACV,aAAa,GACb,WAAW,CAAC;
|
|
1
|
+
{"version":3,"file":"NotificationDrawerGroup.d.ts","sourceRoot":"","sources":["../../../../src/components/NotificationDrawer/NotificationDrawerGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAQ/B,OAAO,EAAW,eAAe,EAAE,MAAM,YAAY,CAAC;AAEtD,MAAM,WAAW,4BAA6B,SAAQ,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,EAAE,OAAO,CAAC;IAClG,yCAAyC;IACzC,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,6CAA6C;IAC7C,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,uCAAuC;IACvC,KAAK,EAAE,MAAM,CAAC;IACd,4DAA4D;IAC5D,UAAU,EAAE,OAAO,CAAC;IACpB,sEAAsE;IACtE,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,2DAA2D;IAC3D,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,GAAG,EAAE,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;IAChD,uCAAuC;IACvC,KAAK,EAAE,MAAM,GAAG,KAAK,CAAC,SAAS,CAAC;IAChC,wCAAwC;IACxC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,sEAAsE;IACtE,eAAe,CAAC,EACZ,eAAe,GACf,MAAM,GACN,KAAK,GACL,QAAQ,GACR,MAAM,GACN,OAAO,GACP,WAAW,GACX,SAAS,GACT,cAAc,GACd,YAAY,GACZ,YAAY,GACZ,UAAU,GACV,aAAa,GACb,WAAW,CAAC;IAChB,wEAAwE;IACxE,YAAY,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;CACxD;AAED,eAAO,MAAM,uBAAuB,EAAE,KAAK,CAAC,iBAAiB,CAAC,4BAA4B,CA0EzF,CAAC"}
|
|
@@ -12,7 +12,7 @@ const Tooltip_1 = require("../Tooltip");
|
|
|
12
12
|
const NotificationDrawerGroup = (_a) => {
|
|
13
13
|
var { children, className = '', count, isExpanded, isRead = false,
|
|
14
14
|
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
15
|
-
onExpand = (event, expanded) => undefined, title, truncateTitle = 0, tooltipPosition } = _a, props = tslib_1.__rest(_a, ["children", "className", "count", "isExpanded", "isRead", "onExpand", "title", "truncateTitle", "tooltipPosition"]);
|
|
15
|
+
onExpand = (event, expanded) => undefined, title, truncateTitle = 0, tooltipPosition, headingLevel: HeadingLevel = 'h1' } = _a, props = tslib_1.__rest(_a, ["children", "className", "count", "isExpanded", "isRead", "onExpand", "title", "truncateTitle", "tooltipPosition", "headingLevel"]);
|
|
16
16
|
const titleRef = React.useRef(null);
|
|
17
17
|
const [isTooltipVisible, setIsTooltipVisible] = React.useState(false);
|
|
18
18
|
React.useEffect(() => {
|
|
@@ -28,7 +28,7 @@ const NotificationDrawerGroup = (_a) => {
|
|
|
28
28
|
}, [titleRef, truncateTitle, isTooltipVisible]);
|
|
29
29
|
const Title = (React.createElement("div", Object.assign({}, (isTooltipVisible && { tabIndex: 0 }), { ref: titleRef, className: react_styles_1.css(notification_drawer_1.default.notificationDrawerGroupToggleTitle) }), title));
|
|
30
30
|
return (React.createElement("section", Object.assign({}, props, { className: react_styles_1.css(notification_drawer_1.default.notificationDrawerGroup, isExpanded && notification_drawer_1.default.modifiers.expanded, className) }),
|
|
31
|
-
React.createElement(
|
|
31
|
+
React.createElement(HeadingLevel, null,
|
|
32
32
|
React.createElement("button", { className: react_styles_1.css(notification_drawer_1.default.notificationDrawerGroupToggle), "aria-expanded": isExpanded, onClick: e => onExpand(e, !isExpanded), onKeyDown: e => {
|
|
33
33
|
if (e.key === 'Enter' || e.key === ' ') {
|
|
34
34
|
e.preventDefault();
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NotificationDrawerGroup.js","sourceRoot":"","sources":["../../../../src/components/NotificationDrawer/NotificationDrawerGroup.tsx"],"names":[],"mappings":";;;;AAAA,qDAA+B;AAE/B,sHAAqF;AACrF,2DAA+C;AAC/C,iJAAoG;AACpG,uLAA6G;AAE7G,oCAAiC;AACjC,wCAAsD;
|
|
1
|
+
{"version":3,"file":"NotificationDrawerGroup.js","sourceRoot":"","sources":["../../../../src/components/NotificationDrawer/NotificationDrawerGroup.tsx"],"names":[],"mappings":"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"}
|
|
@@ -24,6 +24,8 @@ export interface NotificationDrawerListItemHeaderProps extends React.HTMLProps<H
|
|
|
24
24
|
truncateTitle?: number;
|
|
25
25
|
/** Position of the tooltip which is displayed if text is truncated */
|
|
26
26
|
tooltipPosition?: TooltipPosition | 'auto' | 'top' | 'bottom' | 'left' | 'right' | 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end' | 'left-start' | 'left-end' | 'right-start' | 'right-end';
|
|
27
|
+
/** Sets the heading level to use for the list item header title. Default is h2. */
|
|
28
|
+
headingLevel?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
|
|
27
29
|
}
|
|
28
30
|
export declare const NotificationDrawerListItemHeader: React.FunctionComponent<NotificationDrawerListItemHeaderProps>;
|
|
29
31
|
//# sourceMappingURL=NotificationDrawerListItemHeader.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NotificationDrawerListItemHeader.d.ts","sourceRoot":"","sources":["../../../../src/components/NotificationDrawer/NotificationDrawerListItemHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAa/B,OAAO,EAAW,eAAe,EAAE,MAAM,YAAY,CAAC;AAEtD,eAAO,MAAM,YAAY;;;;;;CAMxB,CAAC;AAEF,MAAM,WAAW,qCAAsC,SAAQ,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC;IAC5F,wEAAwE;IACxE,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,oEAAoE;IACpE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,gEAAgE;IAChE,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,gEAAgE;IAChE,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,2CAA2C;IAC3C,KAAK,EAAE,MAAM,CAAC;IACd,4CAA4C;IAC5C,OAAO,CAAC,EAAE,SAAS,GAAG,QAAQ,GAAG,SAAS,GAAG,MAAM,GAAG,SAAS,CAAC;IAChE,wCAAwC;IACxC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,sEAAsE;IACtE,eAAe,CAAC,EACZ,eAAe,GACf,MAAM,GACN,KAAK,GACL,QAAQ,GACR,MAAM,GACN,OAAO,GACP,WAAW,GACX,SAAS,GACT,cAAc,GACd,YAAY,GACZ,YAAY,GACZ,UAAU,GACV,aAAa,GACb,WAAW,CAAC;
|
|
1
|
+
{"version":3,"file":"NotificationDrawerListItemHeader.d.ts","sourceRoot":"","sources":["../../../../src/components/NotificationDrawer/NotificationDrawerListItemHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAa/B,OAAO,EAAW,eAAe,EAAE,MAAM,YAAY,CAAC;AAEtD,eAAO,MAAM,YAAY;;;;;;CAMxB,CAAC;AAEF,MAAM,WAAW,qCAAsC,SAAQ,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC;IAC5F,wEAAwE;IACxE,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,oEAAoE;IACpE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,gEAAgE;IAChE,IAAI,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACvB,gEAAgE;IAChE,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,2CAA2C;IAC3C,KAAK,EAAE,MAAM,CAAC;IACd,4CAA4C;IAC5C,OAAO,CAAC,EAAE,SAAS,GAAG,QAAQ,GAAG,SAAS,GAAG,MAAM,GAAG,SAAS,CAAC;IAChE,wCAAwC;IACxC,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,sEAAsE;IACtE,eAAe,CAAC,EACZ,eAAe,GACf,MAAM,GACN,KAAK,GACL,QAAQ,GACR,MAAM,GACN,OAAO,GACP,WAAW,GACX,SAAS,GACT,cAAc,GACd,YAAY,GACZ,YAAY,GACZ,UAAU,GACV,aAAa,GACb,WAAW,CAAC;IAChB,mFAAmF;IACnF,YAAY,CAAC,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;CACxD;AAED,eAAO,MAAM,gCAAgC,EAAE,KAAK,CAAC,iBAAiB,CAAC,qCAAqC,CAmD3G,CAAC"}
|
|
@@ -21,7 +21,7 @@ exports.variantIcons = {
|
|
|
21
21
|
default: bell_icon_1.default
|
|
22
22
|
};
|
|
23
23
|
const NotificationDrawerListItemHeader = (_a) => {
|
|
24
|
-
var { children, className = '', icon = null, srTitle, title, variant = 'default', truncateTitle = 0, tooltipPosition } = _a, props = tslib_1.__rest(_a, ["children", "className", "icon", "srTitle", "title", "variant", "truncateTitle", "tooltipPosition"]);
|
|
24
|
+
var { children, className = '', icon = null, srTitle, title, variant = 'default', truncateTitle = 0, tooltipPosition, headingLevel: HeadingLevel = 'h2' } = _a, props = tslib_1.__rest(_a, ["children", "className", "icon", "srTitle", "title", "variant", "truncateTitle", "tooltipPosition", "headingLevel"]);
|
|
25
25
|
const titleRef = React.useRef(null);
|
|
26
26
|
const [isTooltipVisible, setIsTooltipVisible] = React.useState(false);
|
|
27
27
|
React.useEffect(() => {
|
|
@@ -35,7 +35,7 @@ const NotificationDrawerListItemHeader = (_a) => {
|
|
|
35
35
|
}
|
|
36
36
|
}, [titleRef, truncateTitle, isTooltipVisible]);
|
|
37
37
|
const Icon = exports.variantIcons[variant];
|
|
38
|
-
const Title = (React.createElement(
|
|
38
|
+
const Title = (React.createElement(HeadingLevel, Object.assign({}, (isTooltipVisible && { tabIndex: 0 }), { ref: titleRef, className: react_styles_1.css(notification_drawer_1.default.notificationDrawerListItemHeaderTitle, truncateTitle && notification_drawer_1.default.modifiers.truncate) }),
|
|
39
39
|
srTitle && React.createElement("span", { className: react_styles_1.css(accessibility_1.default.screenReader) }, srTitle),
|
|
40
40
|
title));
|
|
41
41
|
return (React.createElement(React.Fragment, null,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NotificationDrawerListItemHeader.js","sourceRoot":"","sources":["../../../../src/components/NotificationDrawer/NotificationDrawerListItemHeader.tsx"],"names":[],"mappings":";;;;AAAA,qDAA+B;AAE/B,wGAAwE;AACxE,wHAAuF;AACvF,oIAAmG;AACnG,wIAAuG;AACvG,sHAAqF;AACrF,2DAA+C;AAC/C,iJAAoG;AACpG,+HAA4F;AAE5F,+LAAiH;AAEjH,wCAAsD;AAEzC,QAAA,YAAY,GAAG;IAC1B,OAAO,EAAE,2BAAe;IACxB,MAAM,EAAE,iCAAqB;IAC7B,OAAO,EAAE,mCAAuB;IAChC,IAAI,EAAE,0BAAc;IACpB,OAAO,EAAE,mBAAQ;CAClB,CAAC;
|
|
1
|
+
{"version":3,"file":"NotificationDrawerListItemHeader.js","sourceRoot":"","sources":["../../../../src/components/NotificationDrawer/NotificationDrawerListItemHeader.tsx"],"names":[],"mappings":"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"}
|
package/dist/umd/react-core.js
CHANGED
|
@@ -17077,7 +17077,7 @@
|
|
|
17077
17077
|
const NotificationDrawerGroup = (_a) => {
|
|
17078
17078
|
var { children, className = '', count, isExpanded, isRead = false,
|
|
17079
17079
|
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
17080
|
-
onExpand = (event, expanded) => undefined, title, truncateTitle = 0, tooltipPosition } = _a, props = __rest$1(_a, ["children", "className", "count", "isExpanded", "isRead", "onExpand", "title", "truncateTitle", "tooltipPosition"]);
|
|
17080
|
+
onExpand = (event, expanded) => undefined, title, truncateTitle = 0, tooltipPosition, headingLevel: HeadingLevel = 'h1' } = _a, props = __rest$1(_a, ["children", "className", "count", "isExpanded", "isRead", "onExpand", "title", "truncateTitle", "tooltipPosition", "headingLevel"]);
|
|
17081
17081
|
const titleRef = React__namespace.useRef(null);
|
|
17082
17082
|
const [isTooltipVisible, setIsTooltipVisible] = React__namespace.useState(false);
|
|
17083
17083
|
React__namespace.useEffect(() => {
|
|
@@ -17093,7 +17093,7 @@
|
|
|
17093
17093
|
}, [titleRef, truncateTitle, isTooltipVisible]);
|
|
17094
17094
|
const Title = (React__namespace.createElement("div", Object.assign({}, (isTooltipVisible && { tabIndex: 0 }), { ref: titleRef, className: css(styles$t.notificationDrawerGroupToggleTitle) }), title));
|
|
17095
17095
|
return (React__namespace.createElement("section", Object.assign({}, props, { className: css(styles$t.notificationDrawerGroup, isExpanded && styles$t.modifiers.expanded, className) }),
|
|
17096
|
-
React__namespace.createElement(
|
|
17096
|
+
React__namespace.createElement(HeadingLevel, null,
|
|
17097
17097
|
React__namespace.createElement("button", { className: css(styles$t.notificationDrawerGroupToggle), "aria-expanded": isExpanded, onClick: e => onExpand(e, !isExpanded), onKeyDown: e => {
|
|
17098
17098
|
if (e.key === 'Enter' || e.key === ' ') {
|
|
17099
17099
|
e.preventDefault();
|
|
@@ -17225,7 +17225,7 @@
|
|
|
17225
17225
|
default: BellIcon$1
|
|
17226
17226
|
};
|
|
17227
17227
|
const NotificationDrawerListItemHeader = (_a) => {
|
|
17228
|
-
var { children, className = '', icon = null, srTitle, title, variant = 'default', truncateTitle = 0, tooltipPosition } = _a, props = __rest$1(_a, ["children", "className", "icon", "srTitle", "title", "variant", "truncateTitle", "tooltipPosition"]);
|
|
17228
|
+
var { children, className = '', icon = null, srTitle, title, variant = 'default', truncateTitle = 0, tooltipPosition, headingLevel: HeadingLevel = 'h2' } = _a, props = __rest$1(_a, ["children", "className", "icon", "srTitle", "title", "variant", "truncateTitle", "tooltipPosition", "headingLevel"]);
|
|
17229
17229
|
const titleRef = React__namespace.useRef(null);
|
|
17230
17230
|
const [isTooltipVisible, setIsTooltipVisible] = React__namespace.useState(false);
|
|
17231
17231
|
React__namespace.useEffect(() => {
|
|
@@ -17239,7 +17239,7 @@
|
|
|
17239
17239
|
}
|
|
17240
17240
|
}, [titleRef, truncateTitle, isTooltipVisible]);
|
|
17241
17241
|
const Icon = variantIcons$1[variant];
|
|
17242
|
-
const Title = (React__namespace.createElement(
|
|
17242
|
+
const Title = (React__namespace.createElement(HeadingLevel, Object.assign({}, (isTooltipVisible && { tabIndex: 0 }), { ref: titleRef, className: css(styles$t.notificationDrawerListItemHeaderTitle, truncateTitle && styles$t.modifiers.truncate) }),
|
|
17243
17243
|
srTitle && React__namespace.createElement("span", { className: css(a11yStyles.screenReader) }, srTitle),
|
|
17244
17244
|
title));
|
|
17245
17245
|
return (React__namespace.createElement(React__namespace.Fragment, null,
|
|
@@ -9335,108 +9335,6 @@ label.pf-c-check, .pf-c-check__label,
|
|
|
9335
9335
|
--pf-c-hint--BorderColor: var(--pf-global--BorderColor--300);
|
|
9336
9336
|
}
|
|
9337
9337
|
|
|
9338
|
-
.pf-c-input-group {
|
|
9339
|
-
--pf-global--Color--100: var(--pf-global--Color--dark-100);
|
|
9340
|
-
--pf-global--Color--200: var(--pf-global--Color--dark-200);
|
|
9341
|
-
--pf-global--BorderColor--100: var(--pf-global--BorderColor--dark-100);
|
|
9342
|
-
--pf-global--primary-color--100: var(--pf-global--primary-color--dark-100);
|
|
9343
|
-
--pf-global--link--Color: var(--pf-global--link--Color--dark);
|
|
9344
|
-
--pf-global--link--Color--hover: var(--pf-global--link--Color--dark--hover);
|
|
9345
|
-
--pf-global--BackgroundColor--100: var(--pf-global--BackgroundColor--light-100);
|
|
9346
|
-
}
|
|
9347
|
-
|
|
9348
|
-
.pf-c-input-group {
|
|
9349
|
-
--pf-c-input-group--BackgroundColor: var(--pf-global--BackgroundColor--100);
|
|
9350
|
-
--pf-c-input-group--child--ZIndex: var(--pf-global--ZIndex--xs);
|
|
9351
|
-
--pf-c-input-group__text--FontSize: var(--pf-global--FontSize--md);
|
|
9352
|
-
--pf-c-input-group__text--PaddingRight: var(--pf-global--spacer--sm);
|
|
9353
|
-
--pf-c-input-group__text--PaddingLeft: var(--pf-global--spacer--sm);
|
|
9354
|
-
--pf-c-input-group__text--Color: var(--pf-global--Color--dark-200);
|
|
9355
|
-
--pf-c-input-group__text--BorderWidth: var(--pf-global--BorderWidth--sm);
|
|
9356
|
-
--pf-c-input-group__text--BorderTopColor: var(--pf-global--BorderColor--300);
|
|
9357
|
-
--pf-c-input-group__text--BorderRightColor: var(--pf-global--BorderColor--300);
|
|
9358
|
-
--pf-c-input-group__text--BorderBottomColor: var(--pf-global--BorderColor--200);
|
|
9359
|
-
--pf-c-input-group__text--BorderLeftColor: var(--pf-global--BorderColor--300);
|
|
9360
|
-
--pf-c-input-group__text--BackgroundColor: var(--pf-global--BackgroundColor--100);
|
|
9361
|
-
--pf-c-input-group__textarea--MinHeight: var(--pf-global--spacer--xl);
|
|
9362
|
-
--pf-c-input-group--c-form-control--invalid--ZIndex: var(--pf-global--ZIndex--xs);
|
|
9363
|
-
--pf-c-input-group--c-form-control--MarginRight: 0;
|
|
9364
|
-
color: var(--pf-global--Color--100);
|
|
9365
|
-
display: flex;
|
|
9366
|
-
width: 100%;
|
|
9367
|
-
background-color: var(--pf-c-input-group--BackgroundColor);
|
|
9368
|
-
}
|
|
9369
|
-
|
|
9370
|
-
.pf-c-input-group > * + * {
|
|
9371
|
-
margin-left: -1px;
|
|
9372
|
-
}
|
|
9373
|
-
|
|
9374
|
-
.pf-c-input-group > :focus,
|
|
9375
|
-
.pf-c-input-group > :focus-within {
|
|
9376
|
-
z-index: var(--pf-c-input-group--child--ZIndex);
|
|
9377
|
-
}
|
|
9378
|
-
|
|
9379
|
-
.pf-c-input-group .pf-c-form-control[aria-invalid=true]:not(:last-child) {
|
|
9380
|
-
margin-right: var(--pf-c-input-group--c-form-control--MarginRight);
|
|
9381
|
-
}
|
|
9382
|
-
|
|
9383
|
-
.pf-c-input-group input:not([type=checkbox]):not([type=radio]),
|
|
9384
|
-
.pf-c-input-group textarea {
|
|
9385
|
-
flex: 2;
|
|
9386
|
-
min-width: 0;
|
|
9387
|
-
}
|
|
9388
|
-
|
|
9389
|
-
.pf-c-input-group textarea {
|
|
9390
|
-
min-height: var(--pf-c-input-group__textarea--MinHeight);
|
|
9391
|
-
}
|
|
9392
|
-
|
|
9393
|
-
.pf-c-input-group__text {
|
|
9394
|
-
display: flex;
|
|
9395
|
-
align-items: center;
|
|
9396
|
-
padding-right: var(--pf-c-input-group__text--PaddingRight);
|
|
9397
|
-
padding-left: var(--pf-c-input-group__text--PaddingLeft);
|
|
9398
|
-
font-size: var(--pf-c-input-group__text--FontSize);
|
|
9399
|
-
color: var(--pf-c-input-group__text--Color);
|
|
9400
|
-
text-align: center;
|
|
9401
|
-
background-color: var(--pf-c-input-group__text--BackgroundColor);
|
|
9402
|
-
border: var(--pf-c-input-group__text--BorderWidth) solid;
|
|
9403
|
-
border-color: var(--pf-c-input-group__text--BorderTopColor) var(--pf-c-input-group__text--BorderRightColor) var(--pf-c-input-group__text--BorderBottomColor) var(--pf-c-input-group__text--BorderLeftColor);
|
|
9404
|
-
}
|
|
9405
|
-
|
|
9406
|
-
label.pf-c-input-group__text {
|
|
9407
|
-
cursor: pointer;
|
|
9408
|
-
}
|
|
9409
|
-
|
|
9410
|
-
.pf-c-input-group__text.pf-m-plain {
|
|
9411
|
-
--pf-c-input-group__text--BorderWidth: 0;
|
|
9412
|
-
margin-left: 0;
|
|
9413
|
-
}
|
|
9414
|
-
|
|
9415
|
-
:where(.pf-theme-dark) .pf-c-input-group {
|
|
9416
|
-
--pf-c-input-group--BackgroundColor: transparent;
|
|
9417
|
-
--pf-c-input-group__text--BorderTopColor: transparent;
|
|
9418
|
-
--pf-c-input-group__text--BorderRightColor: transparent;
|
|
9419
|
-
--pf-c-input-group__text--BorderBottomColor: var(--pf-global--BorderColor--400);
|
|
9420
|
-
--pf-c-input-group__text--BorderLeftColor: transparent;
|
|
9421
|
-
--pf-c-input-group__text--BackgroundColor: var(--pf-global--palette--black-600);
|
|
9422
|
-
}
|
|
9423
|
-
|
|
9424
|
-
:where(.pf-theme-dark) .pf-c-input-group > * + * {
|
|
9425
|
-
margin-left: 0;
|
|
9426
|
-
border-left: 1px solid var(--pf-global--palette--black-700);
|
|
9427
|
-
}
|
|
9428
|
-
|
|
9429
|
-
:where(.pf-theme-dark) .pf-c-input-group__text {
|
|
9430
|
-
--pf-c-input-group__text--BorderTopColor: transparent;
|
|
9431
|
-
--pf-c-input-group__text--BorderRightColor: transparent;
|
|
9432
|
-
--pf-c-input-group__text--BorderBottomColor: var(--pf-global--BorderColor--400);
|
|
9433
|
-
--pf-c-input-group__text--BorderLeftColor: transparent;
|
|
9434
|
-
}
|
|
9435
|
-
|
|
9436
|
-
:where(.pf-theme-dark) .pf-c-input-group__text.pf-m-plain {
|
|
9437
|
-
--pf-c-input-group__text--BackgroundColor: transparent;
|
|
9438
|
-
}
|
|
9439
|
-
|
|
9440
9338
|
.pf-c-jump-links {
|
|
9441
9339
|
--pf-c-jump-links__list--Display: flex;
|
|
9442
9340
|
--pf-c-jump-links__list--Visibility: visible;
|
|
@@ -27476,6 +27374,108 @@ svg.pf-c-spinner.pf-m-xl {
|
|
|
27476
27374
|
margin-bottom: var(--pf-l-stack--m-gutter--MarginBottom);
|
|
27477
27375
|
}
|
|
27478
27376
|
|
|
27377
|
+
.pf-c-input-group {
|
|
27378
|
+
--pf-global--Color--100: var(--pf-global--Color--dark-100);
|
|
27379
|
+
--pf-global--Color--200: var(--pf-global--Color--dark-200);
|
|
27380
|
+
--pf-global--BorderColor--100: var(--pf-global--BorderColor--dark-100);
|
|
27381
|
+
--pf-global--primary-color--100: var(--pf-global--primary-color--dark-100);
|
|
27382
|
+
--pf-global--link--Color: var(--pf-global--link--Color--dark);
|
|
27383
|
+
--pf-global--link--Color--hover: var(--pf-global--link--Color--dark--hover);
|
|
27384
|
+
--pf-global--BackgroundColor--100: var(--pf-global--BackgroundColor--light-100);
|
|
27385
|
+
}
|
|
27386
|
+
|
|
27387
|
+
.pf-c-input-group {
|
|
27388
|
+
--pf-c-input-group--BackgroundColor: var(--pf-global--BackgroundColor--100);
|
|
27389
|
+
--pf-c-input-group--child--ZIndex: var(--pf-global--ZIndex--xs);
|
|
27390
|
+
--pf-c-input-group__text--FontSize: var(--pf-global--FontSize--md);
|
|
27391
|
+
--pf-c-input-group__text--PaddingRight: var(--pf-global--spacer--sm);
|
|
27392
|
+
--pf-c-input-group__text--PaddingLeft: var(--pf-global--spacer--sm);
|
|
27393
|
+
--pf-c-input-group__text--Color: var(--pf-global--Color--dark-200);
|
|
27394
|
+
--pf-c-input-group__text--BorderWidth: var(--pf-global--BorderWidth--sm);
|
|
27395
|
+
--pf-c-input-group__text--BorderTopColor: var(--pf-global--BorderColor--300);
|
|
27396
|
+
--pf-c-input-group__text--BorderRightColor: var(--pf-global--BorderColor--300);
|
|
27397
|
+
--pf-c-input-group__text--BorderBottomColor: var(--pf-global--BorderColor--200);
|
|
27398
|
+
--pf-c-input-group__text--BorderLeftColor: var(--pf-global--BorderColor--300);
|
|
27399
|
+
--pf-c-input-group__text--BackgroundColor: var(--pf-global--BackgroundColor--100);
|
|
27400
|
+
--pf-c-input-group__textarea--MinHeight: var(--pf-global--spacer--xl);
|
|
27401
|
+
--pf-c-input-group--c-form-control--invalid--ZIndex: var(--pf-global--ZIndex--xs);
|
|
27402
|
+
--pf-c-input-group--c-form-control--MarginRight: 0;
|
|
27403
|
+
color: var(--pf-global--Color--100);
|
|
27404
|
+
display: flex;
|
|
27405
|
+
width: 100%;
|
|
27406
|
+
background-color: var(--pf-c-input-group--BackgroundColor);
|
|
27407
|
+
}
|
|
27408
|
+
|
|
27409
|
+
.pf-c-input-group > * + * {
|
|
27410
|
+
margin-left: -1px;
|
|
27411
|
+
}
|
|
27412
|
+
|
|
27413
|
+
.pf-c-input-group > :focus,
|
|
27414
|
+
.pf-c-input-group > :focus-within {
|
|
27415
|
+
z-index: var(--pf-c-input-group--child--ZIndex);
|
|
27416
|
+
}
|
|
27417
|
+
|
|
27418
|
+
.pf-c-input-group .pf-c-form-control[aria-invalid=true]:not(:last-child) {
|
|
27419
|
+
margin-right: var(--pf-c-input-group--c-form-control--MarginRight);
|
|
27420
|
+
}
|
|
27421
|
+
|
|
27422
|
+
.pf-c-input-group input:not([type=checkbox]):not([type=radio]),
|
|
27423
|
+
.pf-c-input-group textarea {
|
|
27424
|
+
flex: 2;
|
|
27425
|
+
min-width: 0;
|
|
27426
|
+
}
|
|
27427
|
+
|
|
27428
|
+
.pf-c-input-group textarea {
|
|
27429
|
+
min-height: var(--pf-c-input-group__textarea--MinHeight);
|
|
27430
|
+
}
|
|
27431
|
+
|
|
27432
|
+
.pf-c-input-group__text {
|
|
27433
|
+
display: flex;
|
|
27434
|
+
align-items: center;
|
|
27435
|
+
padding-right: var(--pf-c-input-group__text--PaddingRight);
|
|
27436
|
+
padding-left: var(--pf-c-input-group__text--PaddingLeft);
|
|
27437
|
+
font-size: var(--pf-c-input-group__text--FontSize);
|
|
27438
|
+
color: var(--pf-c-input-group__text--Color);
|
|
27439
|
+
text-align: center;
|
|
27440
|
+
background-color: var(--pf-c-input-group__text--BackgroundColor);
|
|
27441
|
+
border: var(--pf-c-input-group__text--BorderWidth) solid;
|
|
27442
|
+
border-color: var(--pf-c-input-group__text--BorderTopColor) var(--pf-c-input-group__text--BorderRightColor) var(--pf-c-input-group__text--BorderBottomColor) var(--pf-c-input-group__text--BorderLeftColor);
|
|
27443
|
+
}
|
|
27444
|
+
|
|
27445
|
+
label.pf-c-input-group__text {
|
|
27446
|
+
cursor: pointer;
|
|
27447
|
+
}
|
|
27448
|
+
|
|
27449
|
+
.pf-c-input-group__text.pf-m-plain {
|
|
27450
|
+
--pf-c-input-group__text--BorderWidth: 0;
|
|
27451
|
+
margin-left: 0;
|
|
27452
|
+
}
|
|
27453
|
+
|
|
27454
|
+
:where(.pf-theme-dark) .pf-c-input-group {
|
|
27455
|
+
--pf-c-input-group--BackgroundColor: transparent;
|
|
27456
|
+
--pf-c-input-group__text--BorderTopColor: transparent;
|
|
27457
|
+
--pf-c-input-group__text--BorderRightColor: transparent;
|
|
27458
|
+
--pf-c-input-group__text--BorderBottomColor: var(--pf-global--BorderColor--400);
|
|
27459
|
+
--pf-c-input-group__text--BorderLeftColor: transparent;
|
|
27460
|
+
--pf-c-input-group__text--BackgroundColor: var(--pf-global--palette--black-600);
|
|
27461
|
+
}
|
|
27462
|
+
|
|
27463
|
+
:where(.pf-theme-dark) .pf-c-input-group > * + * {
|
|
27464
|
+
margin-left: 0;
|
|
27465
|
+
border-left: 1px solid var(--pf-global--palette--black-700);
|
|
27466
|
+
}
|
|
27467
|
+
|
|
27468
|
+
:where(.pf-theme-dark) .pf-c-input-group__text {
|
|
27469
|
+
--pf-c-input-group__text--BorderTopColor: transparent;
|
|
27470
|
+
--pf-c-input-group__text--BorderRightColor: transparent;
|
|
27471
|
+
--pf-c-input-group__text--BorderBottomColor: var(--pf-global--BorderColor--400);
|
|
27472
|
+
--pf-c-input-group__text--BorderLeftColor: transparent;
|
|
27473
|
+
}
|
|
27474
|
+
|
|
27475
|
+
:where(.pf-theme-dark) .pf-c-input-group__text.pf-m-plain {
|
|
27476
|
+
--pf-c-input-group__text--BackgroundColor: transparent;
|
|
27477
|
+
}
|
|
27478
|
+
|
|
27479
27479
|
.pf-c-alert-group {
|
|
27480
27480
|
--pf-c-alert-group__item--MarginTop: var(--pf-global--spacer--sm);
|
|
27481
27481
|
--pf-c-alert-group--m-toast--Top: var(--pf-global--spacer--2xl);
|