@patternfly/react-core 6.0.0-alpha.100 → 6.0.0-alpha.101
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 +6 -0
- package/components/package.json +1 -1
- package/deprecated/package.json +1 -1
- package/dist/dynamic/components/AboutModal/package.json +1 -1
- package/dist/dynamic/components/Accordion/package.json +1 -1
- package/dist/dynamic/components/ActionList/package.json +1 -1
- package/dist/dynamic/components/Alert/package.json +1 -1
- package/dist/dynamic/components/Avatar/package.json +1 -1
- package/dist/dynamic/components/BackToTop/package.json +1 -1
- package/dist/dynamic/components/Backdrop/package.json +1 -1
- package/dist/dynamic/components/BackgroundImage/package.json +1 -1
- package/dist/dynamic/components/Badge/package.json +1 -1
- package/dist/dynamic/components/Banner/package.json +1 -1
- package/dist/dynamic/components/Brand/package.json +1 -1
- package/dist/dynamic/components/Breadcrumb/package.json +1 -1
- package/dist/dynamic/components/Button/package.json +1 -1
- package/dist/dynamic/components/CalendarMonth/package.json +1 -1
- package/dist/dynamic/components/Card/package.json +1 -1
- package/dist/dynamic/components/Checkbox/package.json +1 -1
- package/dist/dynamic/components/ClipboardCopy/package.json +1 -1
- package/dist/dynamic/components/CodeBlock/package.json +1 -1
- package/dist/dynamic/components/Content/package.json +1 -1
- package/dist/dynamic/components/DataList/package.json +1 -1
- package/dist/dynamic/components/DatePicker/package.json +1 -1
- package/dist/dynamic/components/DescriptionList/package.json +1 -1
- package/dist/dynamic/components/Divider/package.json +1 -1
- package/dist/dynamic/components/Drawer/package.json +1 -1
- package/dist/dynamic/components/Dropdown/package.json +1 -1
- package/dist/dynamic/components/DualListSelector/package.json +1 -1
- package/dist/dynamic/components/EmptyState/package.json +1 -1
- package/dist/dynamic/components/ExpandableSection/package.json +1 -1
- package/dist/dynamic/components/FileUpload/package.json +1 -1
- package/dist/dynamic/components/Form/package.json +1 -1
- package/dist/dynamic/components/FormSelect/package.json +1 -1
- package/dist/dynamic/components/HelperText/package.json +1 -1
- package/dist/dynamic/components/Hint/package.json +1 -1
- package/dist/dynamic/components/Icon/package.json +1 -1
- package/dist/dynamic/components/InputGroup/package.json +1 -1
- package/dist/dynamic/components/JumpLinks/package.json +1 -1
- package/dist/dynamic/components/Label/package.json +1 -1
- package/dist/dynamic/components/List/package.json +1 -1
- package/dist/dynamic/components/LoginPage/package.json +1 -1
- package/dist/dynamic/components/Masthead/package.json +1 -1
- package/dist/dynamic/components/Menu/package.json +1 -1
- package/dist/dynamic/components/MenuToggle/package.json +1 -1
- package/dist/dynamic/components/Modal/package.json +1 -1
- package/dist/dynamic/components/MultipleFileUpload/package.json +1 -1
- package/dist/dynamic/components/Nav/package.json +1 -1
- package/dist/dynamic/components/NotificationBadge/package.json +1 -1
- package/dist/dynamic/components/NotificationDrawer/package.json +1 -1
- package/dist/dynamic/components/NumberInput/package.json +1 -1
- package/dist/dynamic/components/OverflowMenu/package.json +1 -1
- package/dist/dynamic/components/Page/package.json +1 -1
- package/dist/dynamic/components/Pagination/package.json +1 -1
- package/dist/dynamic/components/Panel/package.json +1 -1
- package/dist/dynamic/components/Popover/package.json +1 -1
- package/dist/dynamic/components/Progress/package.json +1 -1
- package/dist/dynamic/components/ProgressStepper/package.json +1 -1
- package/dist/dynamic/components/Radio/package.json +1 -1
- package/dist/dynamic/components/SearchInput/package.json +1 -1
- package/dist/dynamic/components/Select/package.json +1 -1
- package/dist/dynamic/components/Sidebar/package.json +1 -1
- package/dist/dynamic/components/SimpleList/package.json +1 -1
- package/dist/dynamic/components/Skeleton/package.json +1 -1
- package/dist/dynamic/components/SkipToContent/package.json +1 -1
- package/dist/dynamic/components/Slider/package.json +1 -1
- package/dist/dynamic/components/Spinner/package.json +1 -1
- package/dist/dynamic/components/Switch/package.json +1 -1
- package/dist/dynamic/components/Tabs/package.json +1 -1
- package/dist/dynamic/components/TextArea/package.json +1 -1
- package/dist/dynamic/components/TextInput/package.json +1 -1
- package/dist/dynamic/components/TextInputGroup/package.json +1 -1
- package/dist/dynamic/components/Tile/package.json +1 -1
- package/dist/dynamic/components/TimePicker/package.json +1 -1
- package/dist/dynamic/components/Timestamp/package.json +1 -1
- package/dist/dynamic/components/Title/package.json +1 -1
- package/dist/dynamic/components/ToggleGroup/package.json +1 -1
- package/dist/dynamic/components/Toolbar/package.json +1 -1
- package/dist/dynamic/components/Tooltip/package.json +1 -1
- package/dist/dynamic/components/TreeView/package.json +1 -1
- package/dist/dynamic/components/Truncate/package.json +1 -1
- package/dist/dynamic/components/Wizard/hooks/package.json +1 -1
- package/dist/dynamic/components/Wizard/package.json +1 -1
- package/dist/dynamic/deprecated/components/Chip/package.json +1 -1
- package/dist/dynamic/deprecated/components/DragDrop/package.json +1 -1
- package/dist/dynamic/deprecated/components/DualListSelector/package.json +1 -1
- package/dist/dynamic/deprecated/components/Modal/package.json +1 -1
- package/dist/dynamic/deprecated/components/Wizard/package.json +1 -1
- package/dist/dynamic/deprecated/components/package.json +1 -1
- package/dist/dynamic/helpers/FocusTrap/FocusTrap/package.json +1 -1
- package/dist/dynamic/helpers/GenerateId/GenerateId/package.json +1 -1
- package/dist/dynamic/helpers/KeyboardHandler/package.json +1 -1
- package/dist/dynamic/helpers/OUIA/ouia/package.json +1 -1
- package/dist/dynamic/helpers/Popper/Popper/package.json +1 -1
- package/dist/dynamic/helpers/constants/package.json +1 -1
- package/dist/dynamic/helpers/datetimeUtils/package.json +1 -1
- package/dist/dynamic/helpers/fileUtils/package.json +1 -1
- package/dist/dynamic/helpers/htmlConstants/package.json +1 -1
- package/dist/dynamic/helpers/package.json +1 -1
- package/dist/dynamic/helpers/resizeObserver/package.json +1 -1
- package/dist/dynamic/helpers/typeUtils/package.json +1 -1
- package/dist/dynamic/helpers/useInterval/package.json +1 -1
- package/dist/dynamic/helpers/useIsomorphicLayout/package.json +1 -1
- package/dist/dynamic/helpers/useUnmountEffect/package.json +1 -1
- package/dist/dynamic/helpers/util/package.json +1 -1
- package/dist/dynamic/layouts/Bullseye/package.json +1 -1
- package/dist/dynamic/layouts/Flex/package.json +1 -1
- package/dist/dynamic/layouts/Gallery/package.json +1 -1
- package/dist/dynamic/layouts/Grid/package.json +1 -1
- package/dist/dynamic/layouts/Level/package.json +1 -1
- package/dist/dynamic/layouts/Split/package.json +1 -1
- package/dist/dynamic/layouts/Stack/package.json +1 -1
- package/dist/dynamic/styles/package.json +1 -1
- package/dist/esm/components/Card/CardHeader.d.ts +16 -10
- package/dist/esm/components/Card/CardHeader.d.ts.map +1 -1
- package/dist/esm/components/Card/CardHeader.js +25 -29
- package/dist/esm/components/Card/CardHeader.js.map +1 -1
- package/dist/js/components/Card/CardHeader.d.ts +16 -10
- package/dist/js/components/Card/CardHeader.d.ts.map +1 -1
- package/dist/js/components/Card/CardHeader.js +25 -29
- package/dist/js/components/Card/CardHeader.js.map +1 -1
- package/dist/umd/assets/{output-BFvJVM-B.css → output-RbvW58uu.css} +3237 -3222
- package/dist/umd/react-core.min.js +3 -3
- package/helpers/package.json +1 -1
- package/layouts/package.json +1 -1
- package/next/package.json +1 -1
- package/package.json +6 -6
- package/src/components/Card/CardHeader.tsx +115 -93
- package/src/components/Card/__tests__/CardHeader.test.tsx +330 -1
- package/src/components/Card/examples/CardClickable.tsx +11 -21
- package/src/components/Card/examples/CardClickableSelectable.tsx +6 -3
- package/src/components/Card/examples/CardSelectable.tsx +6 -3
- package/src/components/Card/examples/CardSingleSelectable.tsx +6 -3
- package/dist/styles/assets/pficon/pf-v5-pficon.woff2 +0 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"name":"@patternfly/react-core-keyboardhandler.js-dynamic","main":"../../../js/helpers/KeyboardHandler.js","module":"../../../esm/helpers/KeyboardHandler.js","typings":"../../../esm/helpers/KeyboardHandler.d.ts","version":"6.0.0-alpha.
|
|
1
|
+
{"name":"@patternfly/react-core-keyboardhandler.js-dynamic","main":"../../../js/helpers/KeyboardHandler.js","module":"../../../esm/helpers/KeyboardHandler.js","typings":"../../../esm/helpers/KeyboardHandler.d.ts","version":"6.0.0-alpha.100","private":true}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"name":"@patternfly/react-core-ouia.js-dynamic","main":"../../../../js/helpers/OUIA/ouia.js","module":"../../../../esm/helpers/OUIA/ouia.js","typings":"../../../../esm/helpers/OUIA/ouia.d.ts","version":"6.0.0-alpha.
|
|
1
|
+
{"name":"@patternfly/react-core-ouia.js-dynamic","main":"../../../../js/helpers/OUIA/ouia.js","module":"../../../../esm/helpers/OUIA/ouia.js","typings":"../../../../esm/helpers/OUIA/ouia.d.ts","version":"6.0.0-alpha.100","private":true}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"name":"@patternfly/react-core-popper.js-dynamic","main":"../../../../js/helpers/Popper/Popper.js","module":"../../../../esm/helpers/Popper/Popper.js","typings":"../../../../esm/helpers/Popper/Popper.d.ts","version":"6.0.0-alpha.
|
|
1
|
+
{"name":"@patternfly/react-core-popper.js-dynamic","main":"../../../../js/helpers/Popper/Popper.js","module":"../../../../esm/helpers/Popper/Popper.js","typings":"../../../../esm/helpers/Popper/Popper.d.ts","version":"6.0.0-alpha.100","private":true}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"name":"@patternfly/react-core-constants.js-dynamic","main":"../../../js/helpers/constants.js","module":"../../../esm/helpers/constants.js","typings":"../../../esm/helpers/constants.d.ts","version":"6.0.0-alpha.
|
|
1
|
+
{"name":"@patternfly/react-core-constants.js-dynamic","main":"../../../js/helpers/constants.js","module":"../../../esm/helpers/constants.js","typings":"../../../esm/helpers/constants.d.ts","version":"6.0.0-alpha.100","private":true}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"name":"@patternfly/react-core-datetimeutils.js-dynamic","main":"../../../js/helpers/datetimeUtils.js","module":"../../../esm/helpers/datetimeUtils.js","typings":"../../../esm/helpers/datetimeUtils.d.ts","version":"6.0.0-alpha.
|
|
1
|
+
{"name":"@patternfly/react-core-datetimeutils.js-dynamic","main":"../../../js/helpers/datetimeUtils.js","module":"../../../esm/helpers/datetimeUtils.js","typings":"../../../esm/helpers/datetimeUtils.d.ts","version":"6.0.0-alpha.100","private":true}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"name":"@patternfly/react-core-fileutils.js-dynamic","main":"../../../js/helpers/fileUtils.js","module":"../../../esm/helpers/fileUtils.js","typings":"../../../esm/helpers/fileUtils.d.ts","version":"6.0.0-alpha.
|
|
1
|
+
{"name":"@patternfly/react-core-fileutils.js-dynamic","main":"../../../js/helpers/fileUtils.js","module":"../../../esm/helpers/fileUtils.js","typings":"../../../esm/helpers/fileUtils.d.ts","version":"6.0.0-alpha.100","private":true}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"name":"@patternfly/react-core-htmlconstants.js-dynamic","main":"../../../js/helpers/htmlConstants.js","module":"../../../esm/helpers/htmlConstants.js","typings":"../../../esm/helpers/htmlConstants.d.ts","version":"6.0.0-alpha.
|
|
1
|
+
{"name":"@patternfly/react-core-htmlconstants.js-dynamic","main":"../../../js/helpers/htmlConstants.js","module":"../../../esm/helpers/htmlConstants.js","typings":"../../../esm/helpers/htmlConstants.d.ts","version":"6.0.0-alpha.100","private":true}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"name":"@patternfly/react-core-helpers-dynamic","main":"../../js/helpers/index.js","module":"../../esm/helpers/index.js","typings":"../../esm/helpers/index.d.ts","version":"6.0.0-alpha.
|
|
1
|
+
{"name":"@patternfly/react-core-helpers-dynamic","main":"../../js/helpers/index.js","module":"../../esm/helpers/index.js","typings":"../../esm/helpers/index.d.ts","version":"6.0.0-alpha.100","private":true}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"name":"@patternfly/react-core-resizeobserver.js-dynamic","main":"../../../js/helpers/resizeObserver.js","module":"../../../esm/helpers/resizeObserver.js","typings":"../../../esm/helpers/resizeObserver.d.ts","version":"6.0.0-alpha.
|
|
1
|
+
{"name":"@patternfly/react-core-resizeobserver.js-dynamic","main":"../../../js/helpers/resizeObserver.js","module":"../../../esm/helpers/resizeObserver.js","typings":"../../../esm/helpers/resizeObserver.d.ts","version":"6.0.0-alpha.100","private":true}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"name":"@patternfly/react-core-typeutils.js-dynamic","main":"../../../js/helpers/typeUtils.js","module":"../../../esm/helpers/typeUtils.js","typings":"../../../esm/helpers/typeUtils.d.ts","version":"6.0.0-alpha.
|
|
1
|
+
{"name":"@patternfly/react-core-typeutils.js-dynamic","main":"../../../js/helpers/typeUtils.js","module":"../../../esm/helpers/typeUtils.js","typings":"../../../esm/helpers/typeUtils.d.ts","version":"6.0.0-alpha.100","private":true}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"name":"@patternfly/react-core-useinterval.js-dynamic","main":"../../../js/helpers/useInterval.js","module":"../../../esm/helpers/useInterval.js","typings":"../../../esm/helpers/useInterval.d.ts","version":"6.0.0-alpha.
|
|
1
|
+
{"name":"@patternfly/react-core-useinterval.js-dynamic","main":"../../../js/helpers/useInterval.js","module":"../../../esm/helpers/useInterval.js","typings":"../../../esm/helpers/useInterval.d.ts","version":"6.0.0-alpha.100","private":true}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"name":"@patternfly/react-core-useisomorphiclayout.js-dynamic","main":"../../../js/helpers/useIsomorphicLayout.js","module":"../../../esm/helpers/useIsomorphicLayout.js","typings":"../../../esm/helpers/useIsomorphicLayout.d.ts","version":"6.0.0-alpha.
|
|
1
|
+
{"name":"@patternfly/react-core-useisomorphiclayout.js-dynamic","main":"../../../js/helpers/useIsomorphicLayout.js","module":"../../../esm/helpers/useIsomorphicLayout.js","typings":"../../../esm/helpers/useIsomorphicLayout.d.ts","version":"6.0.0-alpha.100","private":true}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"name":"@patternfly/react-core-useunmounteffect.js-dynamic","main":"../../../js/helpers/useUnmountEffect.js","module":"../../../esm/helpers/useUnmountEffect.js","typings":"../../../esm/helpers/useUnmountEffect.d.ts","version":"6.0.0-alpha.
|
|
1
|
+
{"name":"@patternfly/react-core-useunmounteffect.js-dynamic","main":"../../../js/helpers/useUnmountEffect.js","module":"../../../esm/helpers/useUnmountEffect.js","typings":"../../../esm/helpers/useUnmountEffect.d.ts","version":"6.0.0-alpha.100","private":true}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"name":"@patternfly/react-core-util.js-dynamic","main":"../../../js/helpers/util.js","module":"../../../esm/helpers/util.js","typings":"../../../esm/helpers/util.d.ts","version":"6.0.0-alpha.
|
|
1
|
+
{"name":"@patternfly/react-core-util.js-dynamic","main":"../../../js/helpers/util.js","module":"../../../esm/helpers/util.js","typings":"../../../esm/helpers/util.d.ts","version":"6.0.0-alpha.100","private":true}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"name":"@patternfly/react-core-bullseye-dynamic","main":"../../../js/layouts/Bullseye/index.js","module":"../../../esm/layouts/Bullseye/index.js","typings":"../../../esm/layouts/Bullseye/index.d.ts","version":"6.0.0-alpha.
|
|
1
|
+
{"name":"@patternfly/react-core-bullseye-dynamic","main":"../../../js/layouts/Bullseye/index.js","module":"../../../esm/layouts/Bullseye/index.js","typings":"../../../esm/layouts/Bullseye/index.d.ts","version":"6.0.0-alpha.100","private":true}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"name":"@patternfly/react-core-flex-dynamic","main":"../../../js/layouts/Flex/index.js","module":"../../../esm/layouts/Flex/index.js","typings":"../../../esm/layouts/Flex/index.d.ts","version":"6.0.0-alpha.
|
|
1
|
+
{"name":"@patternfly/react-core-flex-dynamic","main":"../../../js/layouts/Flex/index.js","module":"../../../esm/layouts/Flex/index.js","typings":"../../../esm/layouts/Flex/index.d.ts","version":"6.0.0-alpha.100","private":true}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"name":"@patternfly/react-core-gallery-dynamic","main":"../../../js/layouts/Gallery/index.js","module":"../../../esm/layouts/Gallery/index.js","typings":"../../../esm/layouts/Gallery/index.d.ts","version":"6.0.0-alpha.
|
|
1
|
+
{"name":"@patternfly/react-core-gallery-dynamic","main":"../../../js/layouts/Gallery/index.js","module":"../../../esm/layouts/Gallery/index.js","typings":"../../../esm/layouts/Gallery/index.d.ts","version":"6.0.0-alpha.100","private":true}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"name":"@patternfly/react-core-grid-dynamic","main":"../../../js/layouts/Grid/index.js","module":"../../../esm/layouts/Grid/index.js","typings":"../../../esm/layouts/Grid/index.d.ts","version":"6.0.0-alpha.
|
|
1
|
+
{"name":"@patternfly/react-core-grid-dynamic","main":"../../../js/layouts/Grid/index.js","module":"../../../esm/layouts/Grid/index.js","typings":"../../../esm/layouts/Grid/index.d.ts","version":"6.0.0-alpha.100","private":true}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"name":"@patternfly/react-core-level-dynamic","main":"../../../js/layouts/Level/index.js","module":"../../../esm/layouts/Level/index.js","typings":"../../../esm/layouts/Level/index.d.ts","version":"6.0.0-alpha.
|
|
1
|
+
{"name":"@patternfly/react-core-level-dynamic","main":"../../../js/layouts/Level/index.js","module":"../../../esm/layouts/Level/index.js","typings":"../../../esm/layouts/Level/index.d.ts","version":"6.0.0-alpha.100","private":true}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"name":"@patternfly/react-core-split-dynamic","main":"../../../js/layouts/Split/index.js","module":"../../../esm/layouts/Split/index.js","typings":"../../../esm/layouts/Split/index.d.ts","version":"6.0.0-alpha.
|
|
1
|
+
{"name":"@patternfly/react-core-split-dynamic","main":"../../../js/layouts/Split/index.js","module":"../../../esm/layouts/Split/index.js","typings":"../../../esm/layouts/Split/index.d.ts","version":"6.0.0-alpha.100","private":true}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"name":"@patternfly/react-core-stack-dynamic","main":"../../../js/layouts/Stack/index.js","module":"../../../esm/layouts/Stack/index.js","typings":"../../../esm/layouts/Stack/index.d.ts","version":"6.0.0-alpha.
|
|
1
|
+
{"name":"@patternfly/react-core-stack-dynamic","main":"../../../js/layouts/Stack/index.js","module":"../../../esm/layouts/Stack/index.js","typings":"../../../esm/layouts/Stack/index.d.ts","version":"6.0.0-alpha.100","private":true}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"name":"@patternfly/react-core-styles-dynamic","main":"../../js/styles/index.js","module":"../../esm/styles/index.js","typings":"../../esm/styles/index.d.ts","version":"6.0.0-alpha.
|
|
1
|
+
{"name":"@patternfly/react-core-styles-dynamic","main":"../../js/styles/index.js","module":"../../esm/styles/index.js","typings":"../../esm/styles/index.d.ts","version":"6.0.0-alpha.100","private":true}
|
|
@@ -14,23 +14,29 @@ export interface CardHeaderSelectableActionsObject {
|
|
|
14
14
|
hasNoOffset?: boolean;
|
|
15
15
|
/** Additional classes added to the selectable actions wrapper */
|
|
16
16
|
className?: string;
|
|
17
|
-
/** ID passed to the selectable or clickable
|
|
18
|
-
|
|
19
|
-
|
|
17
|
+
/** Custom ID passed to the selectable card's input or a clickable-only card's button/anchor.
|
|
18
|
+
* If omitted, a random unique ID will be assigned to a selectable card's input. */
|
|
19
|
+
selectableActionId?: string;
|
|
20
|
+
/** Adds an accessible name to the input of a selectable card or clickable button/anchor of a clickable-only card.
|
|
21
|
+
* This or selectableActionAriaLabelledby is required for clickable-only cards.
|
|
22
|
+
*/
|
|
20
23
|
selectableActionAriaLabel?: string;
|
|
21
|
-
/**
|
|
22
|
-
*
|
|
24
|
+
/** A single or list of space-delimited ID's that provide an accessible name to the input of a selectable card
|
|
25
|
+
* or clickable button/anchor of a clickable-only card. This or selectableActionAriaLabelledby is required
|
|
26
|
+
* for clickable-only cards.
|
|
23
27
|
*/
|
|
24
28
|
selectableActionAriaLabelledby?: string;
|
|
25
29
|
/** Callback for when a selectable card input changes */
|
|
26
30
|
onChange?: (event: React.FormEvent<HTMLInputElement>, checked: boolean) => void;
|
|
27
|
-
/** Action to call when clickable card is clicked */
|
|
28
|
-
onClickAction?: (event: React.
|
|
29
|
-
/** Link to navigate to when clickable card is clicked */
|
|
31
|
+
/** Action to call when a clickable-only card is clicked. This cannot be combined with the to prop. */
|
|
32
|
+
onClickAction?: (event: React.MouseEvent) => void;
|
|
33
|
+
/** Link to navigate to when a clickable-only card is clicked. This cannot be combined with the onClickAction prop. */
|
|
30
34
|
to?: string;
|
|
31
|
-
/**
|
|
35
|
+
/** Additional props spread to a selectable card input or clickable-only card's button/anchor. */
|
|
36
|
+
selectableActionProps?: any;
|
|
37
|
+
/** Flag to indicate whether a clickable-only card's link should open in a new tab/window. */
|
|
32
38
|
isExternalLink?: boolean;
|
|
33
|
-
/** Name for the input element of a
|
|
39
|
+
/** Name for the input element of a selectable card. */
|
|
34
40
|
name?: string;
|
|
35
41
|
/** @deprecated Flag indicating whether the selectable card input is checked. We recommend using
|
|
36
42
|
* the isSelected prop on the card component instead.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CardHeader.d.ts","sourceRoot":"","sources":["../../../../src/components/Card/CardHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAY/B,MAAM,WAAW,uBAAuB;IACtC,iCAAiC;IACjC,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,sDAAsD;IACtD,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,sDAAsD;IACtD,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,WAAW,iCAAiC;IAChD,qEAAqE;IACrE,OAAO,CAAC,EAAE,QAAQ,GAAG,UAAU,CAAC;IAChC,sDAAsD;IACtD,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,iEAAiE;IACjE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB
|
|
1
|
+
{"version":3,"file":"CardHeader.d.ts","sourceRoot":"","sources":["../../../../src/components/Card/CardHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAY/B,MAAM,WAAW,uBAAuB;IACtC,iCAAiC;IACjC,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,sDAAsD;IACtD,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,sDAAsD;IACtD,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,WAAW,iCAAiC;IAChD,qEAAqE;IACrE,OAAO,CAAC,EAAE,QAAQ,GAAG,UAAU,CAAC;IAChC,sDAAsD;IACtD,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,iEAAiE;IACjE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;uFACmF;IACnF,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B;;OAEG;IACH,yBAAyB,CAAC,EAAE,MAAM,CAAC;IACnC;;;OAGG;IACH,8BAA8B,CAAC,EAAE,MAAM,CAAC;IACxC,wDAAwD;IACxD,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC,gBAAgB,CAAC,EAAE,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IAChF,sGAAsG;IACtG,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAClD,sHAAsH;IACtH,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,iGAAiG;IACjG,qBAAqB,CAAC,EAAE,GAAG,CAAC;IAC5B,6FAA6F;IAC7F,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,uDAAuD;IACvD,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,MAAM,WAAW,eAAgB,SAAQ,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC;IACtE,8CAA8C;IAC9C,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,kDAAkD;IAClD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,iCAAiC;IACjC,OAAO,CAAC,EAAE,uBAAuB,CAAC;IAClC,4CAA4C;IAC5C,iBAAiB,CAAC,EAAE,iCAAiC,CAAC;IACtD,6BAA6B;IAC7B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,+BAA+B;IAC/B,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,EAAE,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACzD,oDAAoD;IACpD,iBAAiB,CAAC,EAAE,GAAG,CAAC;IACxB,sDAAsD;IACtD,oBAAoB,CAAC,EAAE,OAAO,CAAC;CAChC;AAED,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,iBAAiB,CAAC,eAAe,CA0H/D,CAAC"}
|
|
@@ -12,7 +12,8 @@ import { Radio } from '../Radio';
|
|
|
12
12
|
import { Checkbox } from '../Checkbox';
|
|
13
13
|
export const CardHeader = (_a) => {
|
|
14
14
|
var { children, className, actions, selectableActions, id, onExpand, toggleButtonProps, isToggleRightAligned } = _a, props = __rest(_a, ["children", "className", "actions", "selectableActions", "id", "onExpand", "toggleButtonProps", "isToggleRightAligned"]);
|
|
15
|
-
|
|
15
|
+
const uniqueId = React.useId();
|
|
16
|
+
return (React.createElement(CardContext.Consumer, null, ({ cardId, isClickable, isSelectable, isSelected, isDisabled: isCardDisabled }) => {
|
|
16
17
|
const cardHeaderToggle = (React.createElement("div", { className: css(styles.cardHeaderToggle) },
|
|
17
18
|
React.createElement(Button, Object.assign({ variant: "plain", type: "button", onClick: (evt) => {
|
|
18
19
|
onExpand(evt, cardId);
|
|
@@ -21,42 +22,37 @@ export const CardHeader = (_a) => {
|
|
|
21
22
|
const isClickableOrSelectableOnly = (isClickable && !isSelectable) || (isSelectable && !isClickable);
|
|
22
23
|
if ((actions === null || actions === void 0 ? void 0 : actions.actions) && isClickableOrSelectableOnly) {
|
|
23
24
|
// eslint-disable-next-line no-console
|
|
24
|
-
console.
|
|
25
|
+
console.error(`Card: ${isClickable ? 'Clickable' : 'Selectable'} only cards should not contain any other actions. If you wish to include additional actions, use a clickable and selectable card.`);
|
|
25
26
|
}
|
|
26
|
-
const
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
27
|
+
const isClickableOnlyCard = isClickable && !isSelectable;
|
|
28
|
+
if ((isClickableOnlyCard || isSelectable) &&
|
|
29
|
+
!(selectableActions === null || selectableActions === void 0 ? void 0 : selectableActions.selectableActionAriaLabel) &&
|
|
30
|
+
!(selectableActions === null || selectableActions === void 0 ? void 0 : selectableActions.selectableActionAriaLabelledby)) {
|
|
31
|
+
// eslint-disable-next-line no-console
|
|
32
|
+
console.error(`Card: ${isClickableOnlyCard ? 'Clickable-only cards' : 'Cards with a selectable input'} must have either the selectableActions.selectableActionAriaLabel or selectableActions.selectableActionAriaLabelledby prop passed in order to provide an accessible name to the clickable element.`);
|
|
33
|
+
}
|
|
34
|
+
const SelectableCardInput = (selectableActions === null || selectableActions === void 0 ? void 0 : selectableActions.variant) === 'single' ? Radio : Checkbox;
|
|
35
|
+
const getSelectableProps = () => {
|
|
36
|
+
var _a, _b;
|
|
37
|
+
return (Object.assign({ className: 'pf-m-standalone', label: React.createElement(React.Fragment, null), 'aria-label': selectableActions.selectableActionAriaLabel, 'aria-labelledby': selectableActions.selectableActionAriaLabelledby, id: (_a = selectableActions.selectableActionId) !== null && _a !== void 0 ? _a : `card-selectable-${uniqueId}`, name: selectableActions.name, isDisabled: isCardDisabled, onChange: selectableActions.onChange, isChecked: (_b = selectableActions.isChecked) !== null && _b !== void 0 ? _b : isSelected }, selectableActions.selectableActionProps));
|
|
33
38
|
};
|
|
34
|
-
const
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
'aria-
|
|
41
|
-
'aria-labelledby': selectableActions.selectableActionAriaLabelledby,
|
|
42
|
-
id: selectableActions.selectableActionId,
|
|
43
|
-
name: selectableActions.name,
|
|
44
|
-
isDisabled: isCardDisabled
|
|
45
|
-
};
|
|
46
|
-
const isSelectableInputChecked = (_a = selectableActions.isChecked) !== null && _a !== void 0 ? _a : isSelected;
|
|
47
|
-
if (isClickable && !isSelectable) {
|
|
48
|
-
return Object.assign(Object.assign({}, baseProps), { onClick: handleActionClick, isChecked: isClicked });
|
|
49
|
-
}
|
|
50
|
-
if (isSelectable) {
|
|
51
|
-
return Object.assign(Object.assign({}, baseProps), { onChange: selectableActions.onChange, isChecked: isSelectableInputChecked });
|
|
39
|
+
const isClickableLinkCard = (selectableActions === null || selectableActions === void 0 ? void 0 : selectableActions.to) !== undefined;
|
|
40
|
+
const ClickableCardComponent = isClickableLinkCard ? 'a' : 'button';
|
|
41
|
+
const getClickableProps = () => {
|
|
42
|
+
const isDisabledLinkCard = isCardDisabled && isClickableLinkCard;
|
|
43
|
+
const baseProps = Object.assign({ className: css('pf-v6-c-card__clickable-action', isDisabledLinkCard && styles.modifiers.disabled), id: selectableActions.selectableActionId, 'aria-label': selectableActions.selectableActionAriaLabel, 'aria-labelledby': selectableActions.selectableActionAriaLabelledby }, selectableActions.selectableActionProps);
|
|
44
|
+
if (isClickableLinkCard) {
|
|
45
|
+
return Object.assign(Object.assign(Object.assign(Object.assign({}, baseProps), { href: selectableActions.to }), (isCardDisabled && { tabIndex: -1, 'aria-disabled': true })), (selectableActions.isExternalLink && { target: '_blank' }));
|
|
52
46
|
}
|
|
53
|
-
return baseProps;
|
|
47
|
+
return Object.assign(Object.assign({}, baseProps), { type: 'button', disabled: isCardDisabled, onClick: selectableActions.onClickAction });
|
|
54
48
|
};
|
|
55
49
|
return (React.createElement("div", Object.assign({ className: css(styles.cardHeader, isToggleRightAligned && styles.modifiers.toggleRight, className), id: id }, props),
|
|
56
50
|
onExpand && !isToggleRightAligned && cardHeaderToggle,
|
|
57
51
|
(actions || (selectableActions && (isClickable || isSelectable))) && (React.createElement(CardActions, { className: actions === null || actions === void 0 ? void 0 : actions.className, hasNoOffset: (actions === null || actions === void 0 ? void 0 : actions.hasNoOffset) || (selectableActions === null || selectableActions === void 0 ? void 0 : selectableActions.hasNoOffset) }, actions === null || actions === void 0 ? void 0 :
|
|
58
52
|
actions.actions,
|
|
59
|
-
selectableActions && (isClickable || isSelectable) && (React.createElement(CardSelectableActions, { className: selectableActions === null || selectableActions === void 0 ? void 0 : selectableActions.className },
|
|
53
|
+
selectableActions && (isClickable || isSelectable) && (React.createElement(CardSelectableActions, { className: selectableActions === null || selectableActions === void 0 ? void 0 : selectableActions.className },
|
|
54
|
+
isSelectable && React.createElement(SelectableCardInput, Object.assign({}, getSelectableProps())),
|
|
55
|
+
isClickableOnlyCard && React.createElement(ClickableCardComponent, Object.assign({}, getClickableProps())))))),
|
|
60
56
|
children && React.createElement(CardHeaderMain, null, children),
|
|
61
57
|
onExpand && isToggleRightAligned && cardHeaderToggle));
|
|
62
58
|
}));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CardHeader.js","sourceRoot":"","sources":["../../../../src/components/Card/CardHeader.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,GAAG,EAAE,MAAM,0BAA0B,CAAC;AAC/C,OAAO,MAAM,8DAA0D;AACvE,OAAO,EAAE,WAAW,EAAE,MAAM,QAAQ,CAAC;AACrC,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAC5C,OAAO,EAAE,qBAAqB,EAAE,MAAM,yBAAyB,CAAC;AAChE,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAC;AACnC,OAAO,cAAc,MAAM,yDAAyD,CAAC;AACrF,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAC;AACjC,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;
|
|
1
|
+
{"version":3,"file":"CardHeader.js","sourceRoot":"","sources":["../../../../src/components/Card/CardHeader.tsx"],"names":[],"mappings":"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"}
|
|
@@ -14,23 +14,29 @@ export interface CardHeaderSelectableActionsObject {
|
|
|
14
14
|
hasNoOffset?: boolean;
|
|
15
15
|
/** Additional classes added to the selectable actions wrapper */
|
|
16
16
|
className?: string;
|
|
17
|
-
/** ID passed to the selectable or clickable
|
|
18
|
-
|
|
19
|
-
|
|
17
|
+
/** Custom ID passed to the selectable card's input or a clickable-only card's button/anchor.
|
|
18
|
+
* If omitted, a random unique ID will be assigned to a selectable card's input. */
|
|
19
|
+
selectableActionId?: string;
|
|
20
|
+
/** Adds an accessible name to the input of a selectable card or clickable button/anchor of a clickable-only card.
|
|
21
|
+
* This or selectableActionAriaLabelledby is required for clickable-only cards.
|
|
22
|
+
*/
|
|
20
23
|
selectableActionAriaLabel?: string;
|
|
21
|
-
/**
|
|
22
|
-
*
|
|
24
|
+
/** A single or list of space-delimited ID's that provide an accessible name to the input of a selectable card
|
|
25
|
+
* or clickable button/anchor of a clickable-only card. This or selectableActionAriaLabelledby is required
|
|
26
|
+
* for clickable-only cards.
|
|
23
27
|
*/
|
|
24
28
|
selectableActionAriaLabelledby?: string;
|
|
25
29
|
/** Callback for when a selectable card input changes */
|
|
26
30
|
onChange?: (event: React.FormEvent<HTMLInputElement>, checked: boolean) => void;
|
|
27
|
-
/** Action to call when clickable card is clicked */
|
|
28
|
-
onClickAction?: (event: React.
|
|
29
|
-
/** Link to navigate to when clickable card is clicked */
|
|
31
|
+
/** Action to call when a clickable-only card is clicked. This cannot be combined with the to prop. */
|
|
32
|
+
onClickAction?: (event: React.MouseEvent) => void;
|
|
33
|
+
/** Link to navigate to when a clickable-only card is clicked. This cannot be combined with the onClickAction prop. */
|
|
30
34
|
to?: string;
|
|
31
|
-
/**
|
|
35
|
+
/** Additional props spread to a selectable card input or clickable-only card's button/anchor. */
|
|
36
|
+
selectableActionProps?: any;
|
|
37
|
+
/** Flag to indicate whether a clickable-only card's link should open in a new tab/window. */
|
|
32
38
|
isExternalLink?: boolean;
|
|
33
|
-
/** Name for the input element of a
|
|
39
|
+
/** Name for the input element of a selectable card. */
|
|
34
40
|
name?: string;
|
|
35
41
|
/** @deprecated Flag indicating whether the selectable card input is checked. We recommend using
|
|
36
42
|
* the isSelected prop on the card component instead.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CardHeader.d.ts","sourceRoot":"","sources":["../../../../src/components/Card/CardHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAY/B,MAAM,WAAW,uBAAuB;IACtC,iCAAiC;IACjC,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,sDAAsD;IACtD,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,sDAAsD;IACtD,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,WAAW,iCAAiC;IAChD,qEAAqE;IACrE,OAAO,CAAC,EAAE,QAAQ,GAAG,UAAU,CAAC;IAChC,sDAAsD;IACtD,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,iEAAiE;IACjE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB
|
|
1
|
+
{"version":3,"file":"CardHeader.d.ts","sourceRoot":"","sources":["../../../../src/components/Card/CardHeader.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAY/B,MAAM,WAAW,uBAAuB;IACtC,iCAAiC;IACjC,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC;IACzB,sDAAsD;IACtD,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,sDAAsD;IACtD,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,WAAW,iCAAiC;IAChD,qEAAqE;IACrE,OAAO,CAAC,EAAE,QAAQ,GAAG,UAAU,CAAC;IAChC,sDAAsD;IACtD,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,iEAAiE;IACjE,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;uFACmF;IACnF,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B;;OAEG;IACH,yBAAyB,CAAC,EAAE,MAAM,CAAC;IACnC;;;OAGG;IACH,8BAA8B,CAAC,EAAE,MAAM,CAAC;IACxC,wDAAwD;IACxD,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC,gBAAgB,CAAC,EAAE,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IAChF,sGAAsG;IACtG,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAClD,sHAAsH;IACtH,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,iGAAiG;IACjG,qBAAqB,CAAC,EAAE,GAAG,CAAC;IAC5B,6FAA6F;IAC7F,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,uDAAuD;IACvD,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,MAAM,WAAW,eAAgB,SAAQ,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC;IACtE,8CAA8C;IAC9C,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC3B,kDAAkD;IAClD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,iCAAiC;IACjC,OAAO,CAAC,EAAE,uBAAuB,CAAC;IAClC,4CAA4C;IAC5C,iBAAiB,CAAC,EAAE,iCAAiC,CAAC;IACtD,6BAA6B;IAC7B,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,+BAA+B;IAC/B,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,UAAU,EAAE,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACzD,oDAAoD;IACpD,iBAAiB,CAAC,EAAE,GAAG,CAAC;IACxB,sDAAsD;IACtD,oBAAoB,CAAC,EAAE,OAAO,CAAC;CAChC;AAED,eAAO,MAAM,UAAU,EAAE,KAAK,CAAC,iBAAiB,CAAC,eAAe,CA0H/D,CAAC"}
|
|
@@ -15,7 +15,8 @@ const Radio_1 = require("../Radio");
|
|
|
15
15
|
const Checkbox_1 = require("../Checkbox");
|
|
16
16
|
const CardHeader = (_a) => {
|
|
17
17
|
var { children, className, actions, selectableActions, id, onExpand, toggleButtonProps, isToggleRightAligned } = _a, props = tslib_1.__rest(_a, ["children", "className", "actions", "selectableActions", "id", "onExpand", "toggleButtonProps", "isToggleRightAligned"]);
|
|
18
|
-
|
|
18
|
+
const uniqueId = React.useId();
|
|
19
|
+
return (React.createElement(Card_1.CardContext.Consumer, null, ({ cardId, isClickable, isSelectable, isSelected, isDisabled: isCardDisabled }) => {
|
|
19
20
|
const cardHeaderToggle = (React.createElement("div", { className: (0, react_styles_1.css)(card_1.default.cardHeaderToggle) },
|
|
20
21
|
React.createElement(Button_1.Button, Object.assign({ variant: "plain", type: "button", onClick: (evt) => {
|
|
21
22
|
onExpand(evt, cardId);
|
|
@@ -24,42 +25,37 @@ const CardHeader = (_a) => {
|
|
|
24
25
|
const isClickableOrSelectableOnly = (isClickable && !isSelectable) || (isSelectable && !isClickable);
|
|
25
26
|
if ((actions === null || actions === void 0 ? void 0 : actions.actions) && isClickableOrSelectableOnly) {
|
|
26
27
|
// eslint-disable-next-line no-console
|
|
27
|
-
console.
|
|
28
|
+
console.error(`Card: ${isClickable ? 'Clickable' : 'Selectable'} only cards should not contain any other actions. If you wish to include additional actions, use a clickable and selectable card.`);
|
|
28
29
|
}
|
|
29
|
-
const
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
30
|
+
const isClickableOnlyCard = isClickable && !isSelectable;
|
|
31
|
+
if ((isClickableOnlyCard || isSelectable) &&
|
|
32
|
+
!(selectableActions === null || selectableActions === void 0 ? void 0 : selectableActions.selectableActionAriaLabel) &&
|
|
33
|
+
!(selectableActions === null || selectableActions === void 0 ? void 0 : selectableActions.selectableActionAriaLabelledby)) {
|
|
34
|
+
// eslint-disable-next-line no-console
|
|
35
|
+
console.error(`Card: ${isClickableOnlyCard ? 'Clickable-only cards' : 'Cards with a selectable input'} must have either the selectableActions.selectableActionAriaLabel or selectableActions.selectableActionAriaLabelledby prop passed in order to provide an accessible name to the clickable element.`);
|
|
36
|
+
}
|
|
37
|
+
const SelectableCardInput = (selectableActions === null || selectableActions === void 0 ? void 0 : selectableActions.variant) === 'single' ? Radio_1.Radio : Checkbox_1.Checkbox;
|
|
38
|
+
const getSelectableProps = () => {
|
|
39
|
+
var _a, _b;
|
|
40
|
+
return (Object.assign({ className: 'pf-m-standalone', label: React.createElement(React.Fragment, null), 'aria-label': selectableActions.selectableActionAriaLabel, 'aria-labelledby': selectableActions.selectableActionAriaLabelledby, id: (_a = selectableActions.selectableActionId) !== null && _a !== void 0 ? _a : `card-selectable-${uniqueId}`, name: selectableActions.name, isDisabled: isCardDisabled, onChange: selectableActions.onChange, isChecked: (_b = selectableActions.isChecked) !== null && _b !== void 0 ? _b : isSelected }, selectableActions.selectableActionProps));
|
|
36
41
|
};
|
|
37
|
-
const
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
'aria-
|
|
44
|
-
'aria-labelledby': selectableActions.selectableActionAriaLabelledby,
|
|
45
|
-
id: selectableActions.selectableActionId,
|
|
46
|
-
name: selectableActions.name,
|
|
47
|
-
isDisabled: isCardDisabled
|
|
48
|
-
};
|
|
49
|
-
const isSelectableInputChecked = (_a = selectableActions.isChecked) !== null && _a !== void 0 ? _a : isSelected;
|
|
50
|
-
if (isClickable && !isSelectable) {
|
|
51
|
-
return Object.assign(Object.assign({}, baseProps), { onClick: handleActionClick, isChecked: isClicked });
|
|
52
|
-
}
|
|
53
|
-
if (isSelectable) {
|
|
54
|
-
return Object.assign(Object.assign({}, baseProps), { onChange: selectableActions.onChange, isChecked: isSelectableInputChecked });
|
|
42
|
+
const isClickableLinkCard = (selectableActions === null || selectableActions === void 0 ? void 0 : selectableActions.to) !== undefined;
|
|
43
|
+
const ClickableCardComponent = isClickableLinkCard ? 'a' : 'button';
|
|
44
|
+
const getClickableProps = () => {
|
|
45
|
+
const isDisabledLinkCard = isCardDisabled && isClickableLinkCard;
|
|
46
|
+
const baseProps = Object.assign({ className: (0, react_styles_1.css)('pf-v6-c-card__clickable-action', isDisabledLinkCard && card_1.default.modifiers.disabled), id: selectableActions.selectableActionId, 'aria-label': selectableActions.selectableActionAriaLabel, 'aria-labelledby': selectableActions.selectableActionAriaLabelledby }, selectableActions.selectableActionProps);
|
|
47
|
+
if (isClickableLinkCard) {
|
|
48
|
+
return Object.assign(Object.assign(Object.assign(Object.assign({}, baseProps), { href: selectableActions.to }), (isCardDisabled && { tabIndex: -1, 'aria-disabled': true })), (selectableActions.isExternalLink && { target: '_blank' }));
|
|
55
49
|
}
|
|
56
|
-
return baseProps;
|
|
50
|
+
return Object.assign(Object.assign({}, baseProps), { type: 'button', disabled: isCardDisabled, onClick: selectableActions.onClickAction });
|
|
57
51
|
};
|
|
58
52
|
return (React.createElement("div", Object.assign({ className: (0, react_styles_1.css)(card_1.default.cardHeader, isToggleRightAligned && card_1.default.modifiers.toggleRight, className), id: id }, props),
|
|
59
53
|
onExpand && !isToggleRightAligned && cardHeaderToggle,
|
|
60
54
|
(actions || (selectableActions && (isClickable || isSelectable))) && (React.createElement(CardActions_1.CardActions, { className: actions === null || actions === void 0 ? void 0 : actions.className, hasNoOffset: (actions === null || actions === void 0 ? void 0 : actions.hasNoOffset) || (selectableActions === null || selectableActions === void 0 ? void 0 : selectableActions.hasNoOffset) }, actions === null || actions === void 0 ? void 0 :
|
|
61
55
|
actions.actions,
|
|
62
|
-
selectableActions && (isClickable || isSelectable) && (React.createElement(CardSelectableActions_1.CardSelectableActions, { className: selectableActions === null || selectableActions === void 0 ? void 0 : selectableActions.className },
|
|
56
|
+
selectableActions && (isClickable || isSelectable) && (React.createElement(CardSelectableActions_1.CardSelectableActions, { className: selectableActions === null || selectableActions === void 0 ? void 0 : selectableActions.className },
|
|
57
|
+
isSelectable && React.createElement(SelectableCardInput, Object.assign({}, getSelectableProps())),
|
|
58
|
+
isClickableOnlyCard && React.createElement(ClickableCardComponent, Object.assign({}, getClickableProps())))))),
|
|
63
59
|
children && React.createElement(CardHeaderMain_1.CardHeaderMain, null, children),
|
|
64
60
|
onExpand && isToggleRightAligned && cardHeaderToggle));
|
|
65
61
|
}));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CardHeader.js","sourceRoot":"","sources":["../../../../src/components/Card/CardHeader.tsx"],"names":[],"mappings":";;;;AAAA,qDAA+B;AAC/B,2DAA+C;AAC/C,qGAAuE;AACvE,iCAAqC;AACrC,qDAAkD;AAClD,+CAA4C;AAC5C,mEAAgE;AAChE,sCAAmC;;AAEnC,oCAAiC;AACjC,0CAAuC;
|
|
1
|
+
{"version":3,"file":"CardHeader.js","sourceRoot":"","sources":["../../../../src/components/Card/CardHeader.tsx"],"names":[],"mappings":"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"}
|