@carbon/ibm-products 2.39.0 → 2.40.1-canary.6
Sign up to get free protection for your applications and to get access to all the features.
- package/css/index-full-carbon.css +45 -37
- package/css/index-full-carbon.css.map +1 -1
- package/css/index-full-carbon.min.css +1 -1
- package/css/index-full-carbon.min.css.map +1 -1
- package/css/index-without-carbon-released-only.css +5 -0
- package/css/index-without-carbon-released-only.css.map +1 -1
- package/css/index-without-carbon-released-only.min.css +1 -1
- package/css/index-without-carbon-released-only.min.css.map +1 -1
- package/css/index-without-carbon.css +45 -37
- package/css/index-without-carbon.css.map +1 -1
- package/css/index-without-carbon.min.css +1 -1
- package/css/index-without-carbon.min.css.map +1 -1
- package/css/index.css +708 -37
- package/css/index.css.map +1 -1
- package/css/index.min.css +1 -1
- package/css/index.min.css.map +1 -1
- package/es/components/AddSelect/AddSelect.d.ts +44 -2
- package/es/components/AddSelect/AddSelect.js +8 -4
- package/es/components/AddSelect/AddSelectBody.d.ts +44 -2
- package/es/components/AddSelect/AddSelectBody.js +10 -12
- package/es/components/AddSelect/AddSelectSort.d.ts +16 -17
- package/es/components/AddSelect/AddSelectSort.js +5 -5
- package/es/components/AddSelect/types/index.d.ts +44 -0
- package/es/components/BreadcrumbWithOverflow/BreadcrumbWithOverflow.d.ts +5 -1
- package/es/components/BreadcrumbWithOverflow/BreadcrumbWithOverflow.js +12 -6
- package/es/components/Card/Card.js +1 -1
- package/es/components/ConditionBuilder/ConditionBlock/ConditionBlock.js +3 -3
- package/es/components/ConditionBuilder/ConditionBuilder.js +6 -1
- package/es/components/ConditionBuilder/ConditionBuilderAdd/ConditionBuilderAdd.js +3 -3
- package/es/components/ConditionBuilder/ConditionBuilderButton/ConditionBuilderButton.js +1 -1
- package/es/components/ConditionBuilder/ConditionBuilderContent/ConditionBuilderContent.js +2 -2
- package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItem.js +3 -3
- package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemDate/ConditionBuilderItemDate.js +1 -1
- package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemNumber/ConditionBuilderItemNumber.js +1 -1
- package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemOption/ConditionBuilderItemOption.js +30 -18
- package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemText/ConditionBuilderItemText.js +3 -3
- package/es/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemTime/ConditionBuilderItemTime.js +7 -7
- package/es/components/ConditionBuilder/ConditionConnector/ConditionConnector.js +6 -6
- package/es/components/ConditionBuilder/ConditionGroupBuilder/ConditionGroupBuilder.js +11 -11
- package/es/components/ConditionBuilder/utils/checkForHoldingKey.d.ts +1 -0
- package/es/components/ConditionBuilder/utils/checkForHoldingKey.js +16 -0
- package/es/components/ConditionBuilder/utils/handleKeyboardEvents.d.ts +1 -0
- package/es/components/ConditionBuilder/utils/handleKeyboardEvents.js +125 -0
- package/es/components/ConditionBuilder/utils/util.d.ts +1 -1
- package/es/components/ConditionBuilder/utils/util.js +34 -5
- package/es/components/CreateInfluencer/CreateInfluencer.js +1 -1
- package/es/components/CreateTearsheet/CreateTearsheetStep.d.ts +95 -2
- package/es/components/CreateTearsheet/CreateTearsheetStep.js +7 -5
- package/es/components/DataSpreadsheet/DataSpreadsheet.js +4 -3
- package/es/components/DataSpreadsheet/DataSpreadsheetHeader.js +5 -0
- package/es/components/Datagrid/Datagrid/DatagridHeaderRow.js +3 -4
- package/es/components/Datagrid/Datagrid/DatagridVirtualBody.js +5 -1
- package/es/components/ExpressiveCard/ExpressiveCard.d.ts +2 -1
- package/es/components/Guidebanner/Guidebanner.d.ts +62 -2
- package/es/components/Guidebanner/Guidebanner.js +8 -7
- package/es/components/Guidebanner/GuidebannerElement.d.ts +30 -17
- package/es/components/Guidebanner/GuidebannerElement.js +4 -4
- package/es/components/Guidebanner/GuidebannerElementButton.d.ts +29 -15
- package/es/components/Guidebanner/GuidebannerElementButton.js +10 -4
- package/es/components/Guidebanner/GuidebannerElementLink.d.ts +20 -13
- package/es/components/Guidebanner/GuidebannerElementLink.js +3 -3
- package/es/components/InterstitialScreen/InterstitialScreen.js +3 -1
- package/es/components/MultiAddSelect/MultiAddSelect.d.ts +134 -2
- package/es/components/MultiAddSelect/MultiAddSelect.js +2 -1
- package/es/components/NotificationsPanel/NotificationsPanel.js +0 -1
- package/es/components/PageHeader/PageHeader.d.ts +298 -5
- package/es/components/PageHeader/PageHeader.js +98 -47
- package/es/components/PageHeader/PageHeaderUtils.d.ts +1 -1
- package/es/components/PageHeader/PageHeaderUtils.js +4 -1
- package/es/components/SidePanel/SidePanel.d.ts +6 -2
- package/es/components/SidePanel/SidePanel.js +17 -2
- package/es/components/SidePanel/constants.d.ts +1 -0
- package/es/components/SidePanel/constants.js +1 -0
- package/es/components/SingleAddSelect/SingleAddSelect.d.ts +69 -2
- package/es/components/SingleAddSelect/SingleAddSelect.js +2 -1
- package/es/components/TagOverflow/TagOverflow.js +35 -20
- package/es/components/TagOverflow/TagOverflowModal.d.ts +3 -1
- package/es/components/TagOverflow/TagOverflowModal.js +14 -20
- package/es/components/TagOverflow/TagOverflowPopover.js +19 -4
- package/es/components/Tearsheet/Tearsheet.d.ts +132 -6
- package/es/components/Tearsheet/Tearsheet.js +25 -13
- package/es/components/Tearsheet/TearsheetShell.d.ts +5 -1
- package/es/components/Tearsheet/TearsheetShell.js +26 -4
- package/es/components/WebTerminal/WebTerminal.d.ts +4 -0
- package/es/components/WebTerminal/WebTerminal.js +11 -3
- package/es/global/js/hooks/useFocus.d.ts +3 -1
- package/es/global/js/hooks/useFocus.js +6 -3
- package/es/global/js/hooks/useRetrieveStepData.d.ts +1 -1
- package/es/global/js/hooks/useRetrieveStepData.js +1 -1
- package/lib/components/AddSelect/AddSelect.d.ts +44 -2
- package/lib/components/AddSelect/AddSelect.js +7 -3
- package/lib/components/AddSelect/AddSelectBody.d.ts +44 -2
- package/lib/components/AddSelect/AddSelectBody.js +10 -12
- package/lib/components/AddSelect/AddSelectSort.d.ts +16 -17
- package/lib/components/AddSelect/AddSelectSort.js +5 -5
- package/lib/components/AddSelect/types/index.d.ts +44 -0
- package/lib/components/BreadcrumbWithOverflow/BreadcrumbWithOverflow.d.ts +5 -1
- package/lib/components/BreadcrumbWithOverflow/BreadcrumbWithOverflow.js +12 -6
- package/lib/components/Card/Card.js +1 -1
- package/lib/components/ConditionBuilder/ConditionBlock/ConditionBlock.js +3 -3
- package/lib/components/ConditionBuilder/ConditionBuilder.js +6 -1
- package/lib/components/ConditionBuilder/ConditionBuilderAdd/ConditionBuilderAdd.js +3 -3
- package/lib/components/ConditionBuilder/ConditionBuilderButton/ConditionBuilderButton.js +1 -1
- package/lib/components/ConditionBuilder/ConditionBuilderContent/ConditionBuilderContent.js +2 -2
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItem.js +3 -3
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemDate/ConditionBuilderItemDate.js +1 -1
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemNumber/ConditionBuilderItemNumber.js +1 -1
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemOption/ConditionBuilderItemOption.js +29 -17
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemText/ConditionBuilderItemText.js +3 -3
- package/lib/components/ConditionBuilder/ConditionBuilderItem/ConditionBuilderItemTime/ConditionBuilderItemTime.js +7 -7
- package/lib/components/ConditionBuilder/ConditionConnector/ConditionConnector.js +6 -6
- package/lib/components/ConditionBuilder/ConditionGroupBuilder/ConditionGroupBuilder.js +11 -11
- package/lib/components/ConditionBuilder/utils/checkForHoldingKey.d.ts +1 -0
- package/lib/components/ConditionBuilder/utils/checkForHoldingKey.js +20 -0
- package/lib/components/ConditionBuilder/utils/handleKeyboardEvents.d.ts +1 -0
- package/lib/components/ConditionBuilder/utils/handleKeyboardEvents.js +129 -0
- package/lib/components/ConditionBuilder/utils/util.d.ts +1 -1
- package/lib/components/ConditionBuilder/utils/util.js +36 -4
- package/lib/components/CreateInfluencer/CreateInfluencer.js +1 -1
- package/lib/components/CreateTearsheet/CreateTearsheetStep.d.ts +95 -2
- package/lib/components/CreateTearsheet/CreateTearsheetStep.js +7 -5
- package/lib/components/DataSpreadsheet/DataSpreadsheet.js +4 -3
- package/lib/components/DataSpreadsheet/DataSpreadsheetHeader.js +5 -0
- package/lib/components/Datagrid/Datagrid/DatagridHeaderRow.js +3 -4
- package/lib/components/Datagrid/Datagrid/DatagridVirtualBody.js +5 -1
- package/lib/components/ExpressiveCard/ExpressiveCard.d.ts +2 -1
- package/lib/components/Guidebanner/Guidebanner.d.ts +62 -2
- package/lib/components/Guidebanner/Guidebanner.js +8 -7
- package/lib/components/Guidebanner/GuidebannerElement.d.ts +30 -17
- package/lib/components/Guidebanner/GuidebannerElement.js +4 -4
- package/lib/components/Guidebanner/GuidebannerElementButton.d.ts +29 -15
- package/lib/components/Guidebanner/GuidebannerElementButton.js +10 -4
- package/lib/components/Guidebanner/GuidebannerElementLink.d.ts +20 -13
- package/lib/components/Guidebanner/GuidebannerElementLink.js +3 -3
- package/lib/components/InterstitialScreen/InterstitialScreen.js +3 -1
- package/lib/components/MultiAddSelect/MultiAddSelect.d.ts +134 -2
- package/lib/components/MultiAddSelect/MultiAddSelect.js +2 -1
- package/lib/components/NotificationsPanel/NotificationsPanel.js +0 -1
- package/lib/components/PageHeader/PageHeader.d.ts +298 -5
- package/lib/components/PageHeader/PageHeader.js +98 -47
- package/lib/components/PageHeader/PageHeaderUtils.d.ts +1 -1
- package/lib/components/PageHeader/PageHeaderUtils.js +4 -1
- package/lib/components/SidePanel/SidePanel.d.ts +6 -2
- package/lib/components/SidePanel/SidePanel.js +17 -2
- package/lib/components/SidePanel/constants.d.ts +1 -0
- package/lib/components/SidePanel/constants.js +1 -0
- package/lib/components/SingleAddSelect/SingleAddSelect.d.ts +69 -2
- package/lib/components/SingleAddSelect/SingleAddSelect.js +2 -1
- package/lib/components/TagOverflow/TagOverflow.js +34 -19
- package/lib/components/TagOverflow/TagOverflowModal.d.ts +3 -1
- package/lib/components/TagOverflow/TagOverflowModal.js +14 -20
- package/lib/components/TagOverflow/TagOverflowPopover.js +19 -4
- package/lib/components/Tearsheet/Tearsheet.d.ts +132 -6
- package/lib/components/Tearsheet/Tearsheet.js +25 -13
- package/lib/components/Tearsheet/TearsheetShell.d.ts +5 -1
- package/lib/components/Tearsheet/TearsheetShell.js +26 -4
- package/lib/components/WebTerminal/WebTerminal.d.ts +4 -0
- package/lib/components/WebTerminal/WebTerminal.js +11 -3
- package/lib/global/js/hooks/useFocus.d.ts +3 -1
- package/lib/global/js/hooks/useFocus.js +6 -3
- package/lib/global/js/hooks/useRetrieveStepData.d.ts +1 -1
- package/lib/global/js/hooks/useRetrieveStepData.js +1 -1
- package/package.json +3 -3
- package/scss/components/CoachmarkStack/_coachmark-stack.scss +4 -2
- package/scss/components/ConditionBuilder/styles/_conditionBuilderCondition.scss +4 -4
- package/scss/components/ConditionBuilder/styles/_conditionBuilderItem.scss +34 -34
- package/scss/components/SidePanel/_side-panel-variables.scss +1 -0
- package/scss/components/StringFormatter/_string-formatter.scss +1 -1
- package/scss/components/TagOverflow/_tag-overflow.scss +5 -2
- package/scss/components/_index-with-carbon.scss +1 -0
- package/telemetry.yml +2 -0
@@ -57,8 +57,8 @@ var Guidebanner = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
|
57
57
|
previousIconDescription = _ref$previousIconDesc === void 0 ? defaults.previousIconDescription : _ref$previousIconDesc,
|
58
58
|
title = _ref.title,
|
59
59
|
rest = _objectWithoutProperties(_ref, _excluded);
|
60
|
-
var scrollRef = useRef();
|
61
|
-
var toggleRef = useRef();
|
60
|
+
var scrollRef = useRef(null);
|
61
|
+
var toggleRef = useRef(null);
|
62
62
|
var _useState = useState(0),
|
63
63
|
_useState2 = _slicedToArray(_useState, 2),
|
64
64
|
scrollPosition = _useState2[0],
|
@@ -77,6 +77,7 @@ var Guidebanner = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
|
77
77
|
});
|
78
78
|
};
|
79
79
|
return /*#__PURE__*/React__default.createElement("div", _extends({}, rest, {
|
80
|
+
"aria-expanded": !isCollapsed,
|
80
81
|
className: cx(blockClass, className, collapsible && "".concat(blockClass, "__collapsible"), isCollapsed && "".concat(blockClass, "__collapsible-collapsed"), withLeftGutter && "".concat(blockClass, "__with-left-gutter")),
|
81
82
|
ref: ref
|
82
83
|
}, getDevtoolsProps(componentName)), /*#__PURE__*/React__default.createElement(Idea, {
|
@@ -107,8 +108,7 @@ var Guidebanner = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
|
107
108
|
size: "md",
|
108
109
|
className: "".concat(blockClass, "__toggle-button"),
|
109
110
|
onClick: handleClickToggle,
|
110
|
-
ref: toggleRef
|
111
|
-
"aria-expanded": !isCollapsed
|
111
|
+
ref: toggleRef
|
112
112
|
}, isCollapsed ? expandButtonLabel : collapseButtonLabel), showNavigation && /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("span", {
|
113
113
|
className: cx("".concat(blockClass, "__back-button"), [scrollPosition === 0 ? "".concat(blockClass, "__back-button--disabled") : null])
|
114
114
|
}, /*#__PURE__*/React__default.createElement(IconButton, {
|
@@ -172,9 +172,10 @@ Guidebanner.propTypes = {
|
|
172
172
|
React__default.Children.forEach(prop, function (child) {
|
173
173
|
if (child.type.displayName !== 'GuidebannerElement') {
|
174
174
|
var _child$type, _child$type2;
|
175
|
-
// If not GuidebannerElement
|
176
|
-
//
|
177
|
-
//
|
175
|
+
// If child element is not `GuidebannerElement`, then show:
|
176
|
+
// Carbon Products component's `displayName` (child.type.displayName) or
|
177
|
+
// React component's `name` (child.type.name) or
|
178
|
+
// HTML element's tag name (child.type).
|
178
179
|
error = new Error("`Guidebanner` only accepts children of type `GuidebannerElement`, found `".concat(((_child$type = child.type) === null || _child$type === void 0 ? void 0 : _child$type.displayName) || ((_child$type2 = child.type) === null || _child$type2 === void 0 ? void 0 : _child$type2.name) || child.type, "` instead."));
|
179
180
|
}
|
180
181
|
});
|
@@ -1,19 +1,32 @@
|
|
1
|
-
|
2
|
-
|
3
|
-
|
4
|
-
|
5
|
-
|
6
|
-
|
7
|
-
}
|
8
|
-
|
9
|
-
|
10
|
-
|
11
|
-
|
12
|
-
|
13
|
-
|
14
|
-
|
15
|
-
|
1
|
+
/**
|
2
|
+
* Copyright IBM Corp. 2023, 2024
|
3
|
+
*
|
4
|
+
* This source code is licensed under the Apache-2.0 license found in the
|
5
|
+
* LICENSE file in the root directory of this source tree.
|
6
|
+
*/
|
7
|
+
import React, { ReactNode } from 'react';
|
8
|
+
interface GuidebannerElementProps {
|
9
|
+
/**
|
10
|
+
* An optional button can be rendered below the description.
|
11
|
+
* This can be a link, button, Coachmark button, etc.
|
12
|
+
*/
|
13
|
+
button?: ReactNode;
|
14
|
+
/**
|
15
|
+
* Provide an optional class to be applied to the containing node.
|
16
|
+
*/
|
17
|
+
className?: string;
|
18
|
+
/**
|
19
|
+
* The description of the element.
|
20
|
+
*/
|
21
|
+
description: ReactNode;
|
22
|
+
/**
|
23
|
+
* The title of the element.
|
24
|
+
*/
|
25
|
+
title?: string;
|
16
26
|
}
|
17
|
-
|
18
|
-
|
27
|
+
/**
|
28
|
+
* The GuidebannerElement is a required child component of the Guidebanner,
|
29
|
+
* and acts as a container for a CarouselItem.
|
30
|
+
*/
|
31
|
+
export declare let GuidebannerElement: React.ForwardRefExoticComponent<GuidebannerElementProps & React.RefAttributes<HTMLDivElement>>;
|
19
32
|
export {};
|
@@ -17,19 +17,19 @@ var _excluded = ["button", "className", "description", "title"];
|
|
17
17
|
// The block part of our conventional BEM class names (blockClass__E--M).
|
18
18
|
var blockClass = "".concat(pkg.prefix, "--guidebanner__element");
|
19
19
|
var componentName = 'GuidebannerElement';
|
20
|
-
|
21
20
|
/**
|
22
21
|
* The GuidebannerElement is a required child component of the Guidebanner,
|
23
22
|
* and acts as a container for a CarouselItem.
|
24
23
|
*/
|
25
|
-
var GuidebannerElement = function
|
24
|
+
var GuidebannerElement = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
26
25
|
var button = _ref.button,
|
27
26
|
className = _ref.className,
|
28
27
|
description = _ref.description,
|
29
28
|
title = _ref.title,
|
30
29
|
rest = _objectWithoutProperties(_ref, _excluded);
|
31
30
|
return /*#__PURE__*/React__default.createElement("div", _extends({}, rest, {
|
32
|
-
className: cx(blockClass, className)
|
31
|
+
className: cx(blockClass, className),
|
32
|
+
ref: ref
|
33
33
|
}, getDevtoolsProps(componentName)), title && /*#__PURE__*/React__default.createElement("h2", {
|
34
34
|
className: "".concat(blockClass, "-title")
|
35
35
|
}, title), description && /*#__PURE__*/React__default.createElement("p", {
|
@@ -37,7 +37,7 @@ var GuidebannerElement = function GuidebannerElement(_ref) {
|
|
37
37
|
}, description), button && /*#__PURE__*/React__default.createElement("div", {
|
38
38
|
className: "".concat(blockClass, "-buttons")
|
39
39
|
}, button));
|
40
|
-
};
|
40
|
+
});
|
41
41
|
|
42
42
|
// Return a placeholder if not released and not enabled by feature flag
|
43
43
|
GuidebannerElement = pkg.checkComponentEnabled(GuidebannerElement, componentName);
|
@@ -1,17 +1,31 @@
|
|
1
|
-
|
2
|
-
|
3
|
-
|
4
|
-
|
5
|
-
|
6
|
-
|
7
|
-
|
8
|
-
|
9
|
-
|
10
|
-
|
11
|
-
|
12
|
-
|
13
|
-
|
1
|
+
/**
|
2
|
+
* Copyright IBM Corp. 2023, 2024
|
3
|
+
*
|
4
|
+
* This source code is licensed under the Apache-2.0 license found in the
|
5
|
+
* LICENSE file in the root directory of this source tree.
|
6
|
+
*/
|
7
|
+
import React, { ReactNode } from 'react';
|
8
|
+
interface GuidebannerElementButtonProps {
|
9
|
+
/**
|
10
|
+
* Provide the contents of the GuidebannerElementLink.
|
11
|
+
*/
|
12
|
+
children: ReactNode;
|
13
|
+
/**
|
14
|
+
* Provide an optional class to be applied to the containing node.
|
15
|
+
*/
|
16
|
+
className?: string;
|
17
|
+
/**
|
18
|
+
* Provide a description for the icon.
|
19
|
+
*/
|
20
|
+
iconDescription?: string;
|
21
|
+
/**
|
22
|
+
* If type is "primary", then return a tertiary button with the "crossroads" icon,
|
23
|
+
* else return a ghost button.
|
24
|
+
*/
|
25
|
+
type?: string;
|
14
26
|
}
|
15
|
-
|
16
|
-
|
27
|
+
/**
|
28
|
+
* One of two buttons styled specifically for the GuidebannerElement.
|
29
|
+
*/
|
30
|
+
export declare let GuidebannerElementButton: React.ForwardRefExoticComponent<GuidebannerElementButtonProps & React.RefAttributes<Button>>;
|
17
31
|
export {};
|
@@ -15,25 +15,31 @@ import { getDevtoolsProps } from '../../global/js/utils/devtools.js';
|
|
15
15
|
import { pkg } from '../../settings.js';
|
16
16
|
|
17
17
|
var _Crossroads;
|
18
|
-
var _excluded = ["children", "className", "type"];
|
18
|
+
var _excluded = ["children", "className", "iconDescription", "type"];
|
19
19
|
|
20
20
|
// The block part of our conventional BEM class names (blockClass__E--M).
|
21
21
|
var blockClass = "".concat(pkg.prefix, "--guidebanner__element-button");
|
22
22
|
var componentName = 'GuidebannerElementButton';
|
23
|
+
var defaults = {
|
24
|
+
iconDescription: 'Crossroads'
|
25
|
+
};
|
23
26
|
|
24
27
|
/**
|
25
28
|
* One of two buttons styled specifically for the GuidebannerElement.
|
26
29
|
*/
|
27
|
-
var GuidebannerElementButton = function
|
30
|
+
var GuidebannerElementButton = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
28
31
|
var children = _ref.children,
|
29
32
|
className = _ref.className,
|
33
|
+
_ref$iconDescription = _ref.iconDescription,
|
34
|
+
iconDescription = _ref$iconDescription === void 0 ? defaults.iconDescription : _ref$iconDescription,
|
30
35
|
type = _ref.type,
|
31
36
|
rest = _objectWithoutProperties(_ref, _excluded);
|
32
37
|
if (type === 'primary') {
|
33
38
|
return /*#__PURE__*/React__default.createElement(Button, _extends({}, rest, {
|
34
39
|
className: cx(blockClass, className),
|
35
|
-
iconDescription:
|
40
|
+
iconDescription: iconDescription,
|
36
41
|
kind: "tertiary",
|
42
|
+
ref: ref,
|
37
43
|
renderIcon: function renderIcon() {
|
38
44
|
return _Crossroads || (_Crossroads = /*#__PURE__*/React__default.createElement(Crossroads, {
|
39
45
|
size: 16
|
@@ -49,7 +55,7 @@ var GuidebannerElementButton = function GuidebannerElementButton(_ref) {
|
|
49
55
|
role: "button",
|
50
56
|
size: "md"
|
51
57
|
}, getDevtoolsProps(componentName)), children);
|
52
|
-
};
|
58
|
+
});
|
53
59
|
|
54
60
|
// Return a placeholder if not released and not enabled by feature flag
|
55
61
|
GuidebannerElementButton = pkg.checkComponentEnabled(GuidebannerElementButton, componentName);
|
@@ -1,15 +1,22 @@
|
|
1
|
-
|
2
|
-
|
3
|
-
|
4
|
-
|
5
|
-
|
6
|
-
|
7
|
-
|
8
|
-
|
9
|
-
|
10
|
-
|
11
|
-
|
1
|
+
/**
|
2
|
+
* Copyright IBM Corp. 2023, 2024
|
3
|
+
*
|
4
|
+
* This source code is licensed under the Apache-2.0 license found in the
|
5
|
+
* LICENSE file in the root directory of this source tree.
|
6
|
+
*/
|
7
|
+
import React, { ReactNode } from 'react';
|
8
|
+
interface GuidebannerElementLinkProps {
|
9
|
+
/**
|
10
|
+
* Provide the contents of the GuidebannerElementLink.
|
11
|
+
*/
|
12
|
+
children: ReactNode;
|
13
|
+
/**
|
14
|
+
* Provide an optional class to be applied to the containing node.
|
15
|
+
*/
|
16
|
+
className?: string;
|
12
17
|
}
|
13
|
-
|
14
|
-
|
18
|
+
/**
|
19
|
+
* A link styled specifically for the GuidebannerElement.
|
20
|
+
*/
|
21
|
+
export declare let GuidebannerElementLink: React.ForwardRefExoticComponent<GuidebannerElementLinkProps & React.RefAttributes<Link>>;
|
15
22
|
export {};
|
@@ -18,21 +18,21 @@ var _excluded = ["children", "className"];
|
|
18
18
|
// The block part of our conventional BEM class names (blockClass__E--M).
|
19
19
|
var blockClass = "".concat(pkg.prefix, "--guidebanner__element-link");
|
20
20
|
var componentName = 'GuidebannerElementLink';
|
21
|
-
|
22
21
|
/**
|
23
22
|
* A link styled specifically for the GuidebannerElement.
|
24
23
|
*/
|
25
|
-
var GuidebannerElementLink = function
|
24
|
+
var GuidebannerElementLink = /*#__PURE__*/React__default.forwardRef(function (_ref, ref) {
|
26
25
|
var children = _ref.children,
|
27
26
|
className = _ref.className,
|
28
27
|
rest = _objectWithoutProperties(_ref, _excluded);
|
29
28
|
return /*#__PURE__*/React__default.createElement(Link, _extends({}, rest, {
|
30
29
|
className: cx(blockClass, className),
|
31
30
|
kind: "ghost",
|
31
|
+
ref: ref,
|
32
32
|
role: "link",
|
33
33
|
size: "md"
|
34
34
|
}, getDevtoolsProps(componentName)), children);
|
35
|
-
};
|
35
|
+
});
|
36
36
|
|
37
37
|
// Return a placeholder if not released and not enabled by feature flag
|
38
38
|
GuidebannerElementLink = pkg.checkComponentEnabled(GuidebannerElementLink, componentName);
|
@@ -214,6 +214,7 @@ var InterstitialScreen = /*#__PURE__*/React__default.forwardRef(function (_ref,
|
|
214
214
|
className,
|
215
215
|
// Apply any supplied class names to the main HTML element.
|
216
216
|
variantClass, isVisibleClass),
|
217
|
+
role: "main",
|
217
218
|
"aria-label": interstitialAriaLabel,
|
218
219
|
ref: ref
|
219
220
|
}, getDevtoolsProps(componentName)), /*#__PURE__*/React__default.createElement("div", {
|
@@ -239,7 +240,8 @@ var InterstitialScreen = /*#__PURE__*/React__default.forwardRef(function (_ref,
|
|
239
240
|
var renderBody = function renderBody() {
|
240
241
|
return /*#__PURE__*/React__default.createElement("div", {
|
241
242
|
className: cx("".concat(blockClass, "--body")),
|
242
|
-
ref: bodyScrollRef
|
243
|
+
ref: bodyScrollRef,
|
244
|
+
tabIndex: 0
|
243
245
|
}, mediaIsDefined ? /*#__PURE__*/React__default.createElement(FlexGrid, {
|
244
246
|
fullWidth: true,
|
245
247
|
className: cx("".concat(blockClass, "--body-grid"))
|
@@ -1,5 +1,137 @@
|
|
1
|
+
import React, { ReactNode } from 'react';
|
2
|
+
type Filter = {
|
3
|
+
id?: string;
|
4
|
+
label?: string;
|
5
|
+
};
|
6
|
+
type Modifier = {
|
7
|
+
label?: string;
|
8
|
+
options?: string[];
|
9
|
+
};
|
10
|
+
interface Entry {
|
11
|
+
avatar?: {
|
12
|
+
alt?: string;
|
13
|
+
icon?: () => void;
|
14
|
+
src?: string;
|
15
|
+
theme?: 'light' | 'dark';
|
16
|
+
};
|
17
|
+
children?: ReactNode;
|
18
|
+
icon?: () => void;
|
19
|
+
id: string;
|
20
|
+
subtitle?: string;
|
21
|
+
title: string;
|
22
|
+
value: string;
|
23
|
+
}
|
24
|
+
type Theme = 'light' | 'dark';
|
25
|
+
type ItemType = {
|
26
|
+
entries?: Entry[];
|
27
|
+
modifiers: Modifier;
|
28
|
+
sortBy: string[];
|
29
|
+
filterBy: string[];
|
30
|
+
};
|
31
|
+
interface MultiAddSelectProps {
|
32
|
+
/**
|
33
|
+
* optional class name
|
34
|
+
*/
|
35
|
+
className?: string;
|
36
|
+
/**
|
37
|
+
* placeholder for column input filter
|
38
|
+
*/
|
39
|
+
columnInputPlaceholder?: string;
|
40
|
+
/**
|
41
|
+
* text description that appears under the title
|
42
|
+
*/
|
43
|
+
description?: string;
|
44
|
+
/**
|
45
|
+
* options to display in the global filter box. values are generated
|
46
|
+
* from the id which should correlate with a specific property in an
|
47
|
+
* item entry
|
48
|
+
*/
|
49
|
+
globalFilters?: Filter[];
|
50
|
+
globalFiltersIconDescription?: string;
|
51
|
+
/**
|
52
|
+
* placeholder text for the global filter dropdown
|
53
|
+
*/
|
54
|
+
globalFiltersPlaceholderText?: string;
|
55
|
+
/**
|
56
|
+
* text for the global filter primary button
|
57
|
+
*/
|
58
|
+
globalFiltersPrimaryButtonText?: string;
|
59
|
+
/**
|
60
|
+
* text for the global filter secondary button
|
61
|
+
*/
|
62
|
+
globalFiltersSecondaryButtonText?: string;
|
63
|
+
/**
|
64
|
+
* label for global search input
|
65
|
+
*/
|
66
|
+
globalSearchLabel?: string;
|
67
|
+
/**
|
68
|
+
* placeholder for global search input
|
69
|
+
*/
|
70
|
+
globalSearchPlaceholder?: string;
|
71
|
+
/**
|
72
|
+
* the theme for the empty state illustration
|
73
|
+
*/
|
74
|
+
illustrationTheme?: Theme;
|
75
|
+
/**
|
76
|
+
* title that displays in the sidebar / influencer
|
77
|
+
*/
|
78
|
+
influencerTitle?: string;
|
79
|
+
/**
|
80
|
+
* object that contains the item data. for more information reference the
|
81
|
+
* "Structuring items" section in the docs tab
|
82
|
+
*/
|
83
|
+
items?: ItemType;
|
84
|
+
/**
|
85
|
+
* label that display above the list of items
|
86
|
+
*/
|
87
|
+
itemsLabel?: string;
|
88
|
+
/**
|
89
|
+
* text to display when no results are found from the global search
|
90
|
+
*/
|
91
|
+
noResultsDescription?: string;
|
92
|
+
/**
|
93
|
+
* title to display when no results are found from the global search
|
94
|
+
*/
|
95
|
+
noResultsTitle?: string;
|
96
|
+
/**
|
97
|
+
* text body that displays in the sidebar when nothing is selected
|
98
|
+
*/
|
99
|
+
noSelectionDescription?: string;
|
100
|
+
/**
|
101
|
+
* title that displays in the sidebar when nothing is selected
|
102
|
+
*/
|
103
|
+
noSelectionTitle?: string;
|
104
|
+
/**
|
105
|
+
* function to call when the close button clicked
|
106
|
+
*/
|
107
|
+
onClose?: () => void;
|
108
|
+
/**
|
109
|
+
* text for close button
|
110
|
+
*/
|
111
|
+
onCloseButtonText?: string;
|
112
|
+
/**
|
113
|
+
* function to call when the submit button is clicked. returns a selection
|
114
|
+
*/
|
115
|
+
onSubmit?: () => void;
|
116
|
+
/**
|
117
|
+
* text for the submit button
|
118
|
+
*/
|
119
|
+
onSubmitButtonText?: string;
|
120
|
+
/**
|
121
|
+
* specifies if the component is open or not
|
122
|
+
*/
|
123
|
+
open?: boolean;
|
124
|
+
/**
|
125
|
+
* text that displays when displaying filtered items
|
126
|
+
*/
|
127
|
+
searchResultsTitle?: string;
|
128
|
+
/**
|
129
|
+
* header text
|
130
|
+
*/
|
131
|
+
title?: string;
|
132
|
+
}
|
1
133
|
/**
|
2
134
|
* Used to add or select multiple or more items from larger lists or hierarchies.
|
3
135
|
*/
|
4
|
-
export let MultiAddSelect: React.ForwardRefExoticComponent<React.RefAttributes<
|
5
|
-
|
136
|
+
export declare let MultiAddSelect: React.ForwardRefExoticComponent<MultiAddSelectProps & React.RefAttributes<HTMLDivElement>>;
|
137
|
+
export {};
|
@@ -13,7 +13,6 @@ import { pkg } from '../../settings.js';
|
|
13
13
|
import { AddSelect } from '../AddSelect/AddSelect.js';
|
14
14
|
|
15
15
|
var componentName = 'MultiAddSelect';
|
16
|
-
|
17
16
|
/**
|
18
17
|
* Used to add or select multiple or more items from larger lists or hierarchies.
|
19
18
|
*/
|
@@ -42,6 +41,7 @@ MultiAddSelect.propTypes = {
|
|
42
41
|
* from the id which should correlate with a specific property in an
|
43
42
|
* item entry
|
44
43
|
*/
|
44
|
+
/**@ts-ignore */
|
45
45
|
globalFilters: PropTypes.arrayOf(PropTypes.shape({
|
46
46
|
id: PropTypes.string,
|
47
47
|
label: PropTypes.string
|
@@ -79,6 +79,7 @@ MultiAddSelect.propTypes = {
|
|
79
79
|
* object that contains the item data. for more information reference the
|
80
80
|
* "Structuring items" section in the docs tab
|
81
81
|
*/
|
82
|
+
/**@ts-ignore */
|
82
83
|
items: PropTypes.shape({
|
83
84
|
modifiers: PropTypes.shape({
|
84
85
|
label: PropTypes.string,
|
@@ -243,7 +243,6 @@ var NotificationsPanel = /*#__PURE__*/React__default.forwardRef(function (_ref,
|
|
243
243
|
var notificationClassName = cx(["".concat(blockClass, "__notification"), "".concat(blockClass, "__notification-").concat(group)]);
|
244
244
|
var notificationHeaderClassName = cx(["".concat(blockClass, "__notification-title"), _defineProperty({}, "".concat(blockClass, "__notification-title-unread"), notification.unread)]);
|
245
245
|
return /*#__PURE__*/React__default.createElement("div", {
|
246
|
-
"aria-label": notification.title,
|
247
246
|
key: "".concat(notification.timestamp, "-").concat(notification.title, "-").concat(index),
|
248
247
|
className: notificationClassName,
|
249
248
|
role: "button",
|