@carbon/ibm-products 1.3.0 → 1.6.1
Sign up to get free protection for your applications and to get access to all the features.
- package/css/index-full-carbon.css +5102 -4711
- package/css/index-full-carbon.css.map +1 -1
- package/css/index-full-carbon.min.css +9 -3
- package/css/index-full-carbon.min.css.map +1 -0
- package/css/index-without-carbon-released-only.css +189 -108
- package/css/index-without-carbon-released-only.css.map +1 -1
- package/css/index-without-carbon-released-only.min.css +3 -3
- package/css/index-without-carbon-released-only.min.css.map +1 -0
- package/css/index-without-carbon.css +619 -236
- package/css/index-without-carbon.css.map +1 -1
- package/css/index-without-carbon.min.css +9 -3
- package/css/index-without-carbon.min.css.map +1 -0
- package/css/index.css +950 -567
- package/css/index.css.map +1 -1
- package/css/index.min.css +9 -3
- package/css/index.min.css.map +1 -0
- package/es/components/APIKeyModal/APIKeyModal.js +25 -29
- package/es/components/ActionBar/ActionBar.js +4 -1
- package/es/components/ActionSet/ActionSet.js +22 -10
- package/es/components/ActionSet/actions.js +25 -17
- package/es/components/AddSelect/AddSelect.js +141 -53
- package/es/components/AddSelect/AddSelectBreadcrumbs.js +56 -0
- package/es/components/AddSelect/AddSelectList.js +94 -0
- package/es/components/AddSelect/AddSelectSidebar.js +78 -0
- package/es/components/BreadcrumbWithOverflow/BreadcrumbWithOverflow.js +24 -17
- package/es/components/CancelableTextEdit/CancelableTextEdit.js +62 -24
- package/es/components/Card/Card.js +6 -4
- package/es/components/CreateFullPage/CreateFullPage.js +102 -258
- package/es/components/CreateFullPage/CreateFullPageStep.js +65 -13
- package/es/components/CreateFullPage/index.js +1 -2
- package/es/components/CreateInfluencer/CreateInfluencer.js +40 -220
- package/es/components/CreateTearsheet/CreateTearsheet.js +95 -146
- package/es/components/CreateTearsheet/CreateTearsheetStep.js +70 -20
- package/es/components/CreateTearsheet/index.js +0 -1
- package/es/components/CreateTearsheet/preview-components/MultiStepTearsheet.js +87 -28
- package/es/components/CreateTearsheet/preview-components/MultiStepWithIntro.js +8 -6
- package/es/components/EmptyStates/EmptyState.js +1 -1
- package/es/components/EmptyStates/EmptyStateContent.js +2 -2
- package/es/components/EmptyStates/ErrorEmptyState/ErrorEmptyState.js +1 -1
- package/es/components/EmptyStates/NoDataEmptyState/NoDataEmptyState.js +1 -1
- package/es/components/EmptyStates/NoTagsEmptyState/NoTagsEmptyState.js +1 -1
- package/es/components/EmptyStates/NotFoundEmptyState/NotFoundEmptyState.js +1 -1
- package/es/components/EmptyStates/NotificationsEmptyState/NotificationsEmptyState.js +1 -1
- package/es/components/EmptyStates/UnauthorizedEmptyState/UnauthorizedEmptyState.js +1 -1
- package/es/components/ExportModal/ExportModal.js +41 -12
- package/es/components/ImportModal/ImportModal.js +2 -1
- package/es/components/InlineEdit/InlineEdit.js +397 -0
- package/es/components/InlineEdit/index.js +7 -0
- package/es/components/MultiAddSelect/MultiAddSelect.js +16 -0
- package/es/components/MultiAddSelect/index.js +1 -0
- package/es/components/NotificationsPanel/NotificationsPanel.js +16 -3
- package/es/components/OptionsTile/OptionsTile.js +36 -15
- package/es/components/PageHeader/PageHeader.js +59 -35
- package/es/components/PageHeader/PageHeaderTitle.js +82 -7
- package/es/components/PageHeader/PageHeaderUtils.js +21 -2
- package/es/components/RemoveModal/RemoveModal.js +4 -2
- package/es/components/SidePanel/SidePanel.js +33 -16
- package/es/components/SingleAddSelect/SingleAddSelect.js +15 -0
- package/es/components/SingleAddSelect/index.js +1 -0
- package/es/components/TagSet/TagSet.js +4 -1
- package/es/components/Tearsheet/Tearsheet.js +1 -1
- package/es/components/Tearsheet/TearsheetNarrow.js +1 -1
- package/es/components/Tearsheet/TearsheetShell.js +1 -1
- package/es/components/Toolbar/Toolbar.js +69 -8
- package/es/components/WebTerminal/WebTerminal.js +1 -1
- package/es/components/index.js +4 -2
- package/es/global/js/hooks/index.js +1 -0
- package/es/global/js/hooks/useCreateComponentFocus.js +15 -19
- package/es/global/js/hooks/useCreateComponentStepChange.js +69 -79
- package/es/global/js/hooks/useResetCreateComponent.js +7 -4
- package/es/global/js/hooks/useRetrieveStepData.js +51 -0
- package/es/global/js/hooks/useValidCreateStepCount.js +4 -7
- package/es/global/js/package-settings.js +4 -2
- package/es/global/js/utils/lastIndexInArray.js +26 -0
- package/es/settings.js +0 -5
- package/lib/components/APIKeyModal/APIKeyModal.js +25 -29
- package/lib/components/ActionBar/ActionBar.js +4 -1
- package/lib/components/ActionSet/ActionSet.js +22 -10
- package/lib/components/ActionSet/actions.js +25 -17
- package/lib/components/AddSelect/AddSelect.js +141 -50
- package/lib/components/AddSelect/AddSelectBreadcrumbs.js +71 -0
- package/lib/components/AddSelect/AddSelectList.js +112 -0
- package/lib/components/AddSelect/AddSelectSidebar.js +89 -0
- package/lib/components/BreadcrumbWithOverflow/BreadcrumbWithOverflow.js +23 -16
- package/lib/components/CancelableTextEdit/CancelableTextEdit.js +62 -23
- package/lib/components/Card/Card.js +6 -4
- package/lib/components/CreateFullPage/CreateFullPage.js +102 -258
- package/lib/components/CreateFullPage/CreateFullPageStep.js +68 -13
- package/lib/components/CreateFullPage/index.js +1 -9
- package/lib/components/CreateInfluencer/CreateInfluencer.js +38 -231
- package/lib/components/CreateTearsheet/CreateTearsheet.js +97 -148
- package/lib/components/CreateTearsheet/CreateTearsheetStep.js +72 -19
- package/lib/components/CreateTearsheet/index.js +0 -8
- package/lib/components/CreateTearsheet/preview-components/MultiStepTearsheet.js +86 -34
- package/lib/components/CreateTearsheet/preview-components/MultiStepWithIntro.js +8 -6
- package/lib/components/EmptyStates/EmptyState.js +1 -1
- package/lib/components/EmptyStates/EmptyStateContent.js +2 -2
- package/lib/components/EmptyStates/ErrorEmptyState/ErrorEmptyState.js +1 -1
- package/lib/components/EmptyStates/NoDataEmptyState/NoDataEmptyState.js +1 -1
- package/lib/components/EmptyStates/NoTagsEmptyState/NoTagsEmptyState.js +1 -1
- package/lib/components/EmptyStates/NotFoundEmptyState/NotFoundEmptyState.js +1 -1
- package/lib/components/EmptyStates/NotificationsEmptyState/NotificationsEmptyState.js +1 -1
- package/lib/components/EmptyStates/UnauthorizedEmptyState/UnauthorizedEmptyState.js +1 -1
- package/lib/components/ExportModal/ExportModal.js +38 -11
- package/lib/components/ImportModal/ImportModal.js +2 -1
- package/lib/components/InlineEdit/InlineEdit.js +413 -0
- package/lib/components/InlineEdit/index.js +13 -0
- package/lib/components/MultiAddSelect/MultiAddSelect.js +37 -0
- package/lib/components/MultiAddSelect/index.js +13 -0
- package/lib/components/NotificationsPanel/NotificationsPanel.js +13 -1
- package/lib/components/OptionsTile/OptionsTile.js +36 -15
- package/lib/components/PageHeader/PageHeader.js +59 -35
- package/lib/components/PageHeader/PageHeaderTitle.js +91 -9
- package/lib/components/PageHeader/PageHeaderUtils.js +21 -2
- package/lib/components/RemoveModal/RemoveModal.js +4 -2
- package/lib/components/SidePanel/SidePanel.js +33 -16
- package/lib/components/SingleAddSelect/SingleAddSelect.js +36 -0
- package/lib/components/SingleAddSelect/index.js +13 -0
- package/lib/components/TagSet/TagSet.js +4 -1
- package/lib/components/Tearsheet/Tearsheet.js +1 -1
- package/lib/components/Tearsheet/TearsheetNarrow.js +1 -1
- package/lib/components/Tearsheet/TearsheetShell.js +1 -1
- package/lib/components/Toolbar/Toolbar.js +69 -6
- package/lib/components/WebTerminal/WebTerminal.js +1 -1
- package/lib/components/index.js +25 -9
- package/lib/global/js/hooks/index.js +8 -0
- package/lib/global/js/hooks/useCreateComponentFocus.js +15 -19
- package/lib/global/js/hooks/useCreateComponentStepChange.js +69 -79
- package/lib/global/js/hooks/useResetCreateComponent.js +7 -4
- package/lib/global/js/hooks/useRetrieveStepData.js +62 -0
- package/lib/global/js/hooks/useValidCreateStepCount.js +4 -7
- package/lib/global/js/package-settings.js +4 -2
- package/lib/global/js/utils/lastIndexInArray.js +35 -0
- package/lib/settings.js +0 -6
- package/package.json +24 -24
- package/scss/components/AddSelect/_add-select.scss +53 -8
- package/scss/components/BreadcrumbWithOverflow/_breadcrumb-with-overflow.scss +19 -15
- package/scss/components/BreadcrumbWithOverflow/_index.scss +1 -1
- package/scss/components/CancelableTextEdit/_cancelable-text-edit.scss +142 -70
- package/scss/components/CancelableTextEdit/_storybook-styles.scss +0 -7
- package/scss/components/CreateFullPage/_create-full-page.scss +4 -11
- package/scss/components/CreateInfluencer/_create-influencer.scss +4 -4
- package/scss/components/CreateTearsheet/_create-tearsheet.scss +6 -10
- package/scss/components/CreateTearsheetNarrow/_storybook-styles.scss +0 -6
- package/scss/components/EditSidePanel/_storybook-styles.scss +0 -8
- package/scss/components/InlineEdit/_index.scss +8 -0
- package/scss/components/InlineEdit/_inline-edit.scss +320 -0
- package/scss/components/InlineEdit/_storybook-styles.scss +21 -0
- package/scss/components/LoadingBar/_storybook-styles.scss +0 -5
- package/scss/components/MultiAddSelect/_index.scss +1 -0
- package/scss/components/MultiAddSelect/_multi-add-select.scss +1 -0
- package/scss/components/MultiAddSelect/_storybook-styles.scss +6 -0
- package/scss/components/NotificationsPanel/_notifications-panel.scss +2 -2
- package/scss/components/OptionsTile/_storybook-styles.scss +0 -7
- package/scss/components/PageHeader/_index.scss +1 -1
- package/scss/components/PageHeader/_page-header.scss +18 -5
- package/scss/components/ProductiveCard/_productive-card.scss +0 -4
- package/scss/components/SidePanel/_side-panel.scss +15 -6
- package/scss/components/SingleAddSelect/_index.scss +1 -0
- package/scss/components/SingleAddSelect/_single-add-select.scss +1 -0
- package/scss/components/SingleAddSelect/_storybook-styles.scss +6 -0
- package/scss/components/StatusIcon/_index.scss +1 -1
- package/scss/components/StatusIcon/_status-icon.scss +6 -4
- package/scss/components/TagSet/_index.scss +1 -1
- package/scss/components/UserProfileImage/_index.scss +1 -1
- package/scss/components/UserProfileImage/_user-profile-image.scss +2 -2
- package/scss/components/WebTerminal/_web-terminal.scss +2 -2
- package/scss/components/_index.scss +3 -1
- package/scss/global/styles/_project-settings.scss +5 -1
- package/es/components/CreateFullPage/CreateFullPageSection.js +0 -53
- package/es/components/CreateFullPage/constants.js +0 -8
- package/es/components/CreateTearsheet/CreateTearsheetSection.js +0 -83
- package/es/components/CreateTearsheet/constants.js +0 -8
- package/es/components/CreateTearsheet/preview-components/MultiStepWithSectionsTearsheet.js +0 -327
- package/es/generated/feature-flags/feature-flags.js +0 -15
- package/es/global/js/utils/hasValidType.js +0 -94
- package/lib/components/CreateFullPage/CreateFullPageSection.js +0 -74
- package/lib/components/CreateFullPage/constants.js +0 -16
- package/lib/components/CreateTearsheet/CreateTearsheetSection.js +0 -105
- package/lib/components/CreateTearsheet/constants.js +0 -17
- package/lib/components/CreateTearsheet/preview-components/MultiStepWithSectionsTearsheet.js +0 -354
- package/lib/generated/feature-flags/feature-flags.js +0 -22
- package/lib/global/js/utils/hasValidType.js +0 -110
- package/scss/generated/feature-flags/_feature-flags.scss +0 -19
@@ -2,18 +2,12 @@
|
|
2
2
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
4
4
|
|
5
|
-
var _typeof = require("@babel/runtime/helpers/typeof");
|
6
|
-
|
7
5
|
Object.defineProperty(exports, "__esModule", {
|
8
6
|
value: true
|
9
7
|
});
|
10
8
|
exports.CreateInfluencer = void 0;
|
11
9
|
|
12
|
-
var
|
13
|
-
|
14
|
-
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
|
15
|
-
|
16
|
-
var _react = _interopRequireWildcard(require("react"));
|
10
|
+
var _react = _interopRequireDefault(require("react"));
|
17
11
|
|
18
12
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
19
13
|
|
@@ -21,28 +15,12 @@ var _classnames = _interopRequireDefault(require("classnames"));
|
|
21
15
|
|
22
16
|
var _carbonComponentsReact = require("carbon-components-react");
|
23
17
|
|
24
|
-
var _UIShell = require("carbon-components-react/lib/components/UIShell");
|
25
|
-
|
26
|
-
var _motion = require("@carbon/motion");
|
27
|
-
|
28
|
-
var _hasValidType = require("../../global/js/utils/hasValidType");
|
29
|
-
|
30
18
|
require("../../global/js/utils/props-helper");
|
31
19
|
|
32
20
|
var _settings = require("../../settings");
|
33
21
|
|
34
|
-
var _constants = require("../CreateTearsheet/constants");
|
35
|
-
|
36
|
-
var _constants2 = require("../CreateFullPage/constants");
|
37
|
-
|
38
|
-
var _CreateTearsheet = require("../CreateTearsheet");
|
39
|
-
|
40
|
-
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
41
|
-
|
42
|
-
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
43
|
-
|
44
22
|
/**
|
45
|
-
* Copyright IBM Corp. 2021,
|
23
|
+
* Copyright IBM Corp. 2021, 2022
|
46
24
|
*
|
47
25
|
* This source code is licensed under the Apache-2.0 license found in the
|
48
26
|
* LICENSE file in the root directory of this source tree.
|
@@ -53,153 +31,57 @@ var blockClass = "".concat(_settings.pkg.prefix, "--create-influencer");
|
|
53
31
|
var componentName = 'CreateInfluencer';
|
54
32
|
|
55
33
|
var CreateInfluencer = function CreateInfluencer(_ref) {
|
56
|
-
var
|
57
|
-
className = _ref.className,
|
58
|
-
componentBlockClass = _ref.componentBlockClass,
|
59
|
-
createComponentName = _ref.createComponentName,
|
60
|
-
createComponents = _ref.createComponents,
|
34
|
+
var className = _ref.className,
|
61
35
|
currentStep = _ref.currentStep,
|
62
|
-
|
63
|
-
handleActiveSectionIndex = _ref.handleActiveSectionIndex,
|
64
|
-
includeViewAllToggle = _ref.includeViewAllToggle,
|
65
|
-
open = _ref.open,
|
66
|
-
previousState = _ref.previousState,
|
67
|
-
sideNavAriaLabel = _ref.sideNavAriaLabel,
|
68
|
-
toggleState = _ref.toggleState,
|
69
|
-
viewAllToggleLabelText = _ref.viewAllToggleLabelText,
|
70
|
-
viewAllToggleOffLabelText = _ref.viewAllToggleOffLabelText,
|
71
|
-
viewAllToggleOnLabelText = _ref.viewAllToggleOnLabelText;
|
72
|
-
|
73
|
-
var _useState = (0, _react.useState)(''),
|
74
|
-
_useState2 = (0, _slicedToArray2.default)(_useState, 2),
|
75
|
-
progressIndicatorState = _useState2[0],
|
76
|
-
setProgressIndicatorState = _useState2[1];
|
77
|
-
|
78
|
-
var _useState3 = (0, _react.useState)(''),
|
79
|
-
_useState4 = (0, _slicedToArray2.default)(_useState3, 2),
|
80
|
-
sideNavState = _useState4[0],
|
81
|
-
setSideNavState = _useState4[1]; // Animating states need to be reset here otherwise things won't render
|
82
|
-
// the way they should after the component mounts/unmounts
|
83
|
-
|
84
|
-
/* istanbul ignore next */
|
85
|
-
|
86
|
-
|
87
|
-
(0, _react.useEffect)(function () {
|
88
|
-
if (!(previousState !== null && previousState !== void 0 && previousState.open) && open) {
|
89
|
-
setSideNavState('');
|
90
|
-
setProgressIndicatorState('');
|
91
|
-
}
|
92
|
-
}, [open, previousState]);
|
93
|
-
/* istanbul ignore next */
|
94
|
-
|
95
|
-
var handleViewAllToggle = function handleViewAllToggle(newToggleValue) {
|
96
|
-
if (newToggleValue) {
|
97
|
-
setProgressIndicatorState('closing');
|
98
|
-
setTimeout(function () {
|
99
|
-
handleToggleState(newToggleValue);
|
100
|
-
setSideNavState('opening');
|
101
|
-
}, _motion.moderate02);
|
102
|
-
} else {
|
103
|
-
setSideNavState('closing');
|
104
|
-
setTimeout(function () {
|
105
|
-
handleToggleState(newToggleValue);
|
106
|
-
setProgressIndicatorState('opening');
|
107
|
-
}, _motion.moderate02);
|
108
|
-
}
|
36
|
+
stepData = _ref.stepData;
|
109
37
|
|
110
|
-
|
111
|
-
var
|
38
|
+
var getNumberOfDynamicStepsBeforeCurrentStep = function getNumberOfDynamicStepsBeforeCurrentStep(array, key) {
|
39
|
+
var dynamicSteps = [];
|
40
|
+
array.forEach(function (item, index) {
|
41
|
+
var _array$index;
|
112
42
|
|
113
|
-
|
114
|
-
|
115
|
-
|
116
|
-
};
|
117
|
-
|
118
|
-
var renderViewAllToggle = function renderViewAllToggle() {
|
119
|
-
return /*#__PURE__*/_react.default.createElement(_carbonComponentsReact.Toggle, {
|
120
|
-
id: "".concat(blockClass, "__view-all-toggle"),
|
121
|
-
toggled: toggleState,
|
122
|
-
labelText: viewAllToggleLabelText,
|
123
|
-
labelA: viewAllToggleOffLabelText,
|
124
|
-
labelB: viewAllToggleOnLabelText,
|
125
|
-
onToggle: function onToggle(value) {
|
126
|
-
return handleViewAllToggle(value);
|
127
|
-
},
|
128
|
-
className: "".concat(blockClass, "__view-all-toggle"),
|
129
|
-
defaultToggled: false
|
43
|
+
if (((_array$index = array[index]) === null || _array$index === void 0 ? void 0 : _array$index[key]) === false && index <= currentStep - 1) {
|
44
|
+
dynamicSteps.push(item);
|
45
|
+
}
|
130
46
|
});
|
47
|
+
return dynamicSteps.length;
|
131
48
|
}; // renders the step progression components in the left influencer area
|
132
49
|
|
133
50
|
|
134
51
|
var renderProgressSteps = function renderProgressSteps() {
|
135
|
-
var
|
136
|
-
|
137
|
-
/* istanbul ignore next */
|
138
|
-
if (toggleState) {
|
139
|
-
var _cx, _createComponents$sec;
|
140
|
-
|
141
|
-
return /*#__PURE__*/_react.default.createElement("div", {
|
142
|
-
className: "".concat(blockClass, "__left-nav")
|
143
|
-
}, /*#__PURE__*/_react.default.createElement(_UIShell.SideNav, {
|
144
|
-
expanded: true,
|
145
|
-
isFixedNav: true,
|
146
|
-
"aria-label": sideNavAriaLabel,
|
147
|
-
className: (0, _classnames.default)((_cx = {}, (0, _defineProperty2.default)(_cx, "".concat(blockClass, "__side-nav-opening"), sideNavState === 'opening'), (0, _defineProperty2.default)(_cx, "".concat(blockClass, "__side-nav-closing"), sideNavState === 'closing'), _cx))
|
148
|
-
}, /*#__PURE__*/_react.default.createElement(_UIShell.SideNavItems, null, ((_createComponents$sec = createComponents.sections) === null || _createComponents$sec === void 0 ? void 0 : _createComponents$sec.length) && createComponents.sections.map(function (sectionComponent, sectionIndex) {
|
149
|
-
var _sectionComponent$pro;
|
52
|
+
var _stepData$, _stepData$2;
|
150
53
|
|
151
|
-
|
152
|
-
|
153
|
-
key: sectionIndex,
|
154
|
-
isActive: activeSectionIndex === sectionIndex,
|
155
|
-
onClick: function onClick(event) {
|
156
|
-
event.preventDefault();
|
157
|
-
handleActiveSectionIndex(sectionIndex);
|
158
|
-
|
159
|
-
if (sectionComponent.props.id) {
|
160
|
-
var _scrollTarget$getBoun;
|
161
|
-
|
162
|
-
var scrollTarget = document.querySelector("#".concat(sectionComponent.props.id));
|
163
|
-
var scrollContainer = document.querySelector(".".concat(componentBlockClass, "__content"));
|
164
|
-
var scrollTopValue = createComponentName === 'CreateFullPage' ? (scrollTarget === null || scrollTarget === void 0 ? void 0 : (_scrollTarget$getBoun = scrollTarget.getBoundingClientRect()) === null || _scrollTarget$getBoun === void 0 ? void 0 : _scrollTarget$getBoun.y) + (scrollContainer === null || scrollContainer === void 0 ? void 0 : scrollContainer.scrollTop) : scrollTarget === null || scrollTarget === void 0 ? void 0 : scrollTarget.offsetTop;
|
165
|
-
scrollContainer === null || scrollContainer === void 0 ? void 0 : scrollContainer.scrollTo({
|
166
|
-
top: scrollTopValue,
|
167
|
-
behavior: 'smooth'
|
168
|
-
});
|
169
|
-
} else {
|
170
|
-
console.warn("".concat(createComponentName, ": ").concat(createComponentName, "Section component is missing a required prop of 'id'"));
|
171
|
-
}
|
172
|
-
}
|
173
|
-
}, sectionComponent.props.title);
|
174
|
-
}))));
|
175
|
-
}
|
176
|
-
|
177
|
-
var extractedSteps = (0, _hasValidType.getExtractedSteps)(createComponents.steps, createComponentName === _CreateTearsheet.CreateTearsheet.displayName ? _constants.CREATE_TEARSHEET_STEP : _constants2.CREATE_FULL_PAGE_STEP);
|
178
|
-
var stepsWithoutIntroStep = extractedSteps.filter(function (item) {
|
179
|
-
return !item.props.introStep;
|
54
|
+
var extractedSteps = stepData === null || stepData === void 0 ? void 0 : stepData.filter(function (item) {
|
55
|
+
return !(item !== null && item !== void 0 && item.introStep);
|
180
56
|
});
|
181
|
-
var
|
182
|
-
return item.
|
183
|
-
})
|
57
|
+
var progressSteps = extractedSteps === null || extractedSteps === void 0 ? void 0 : extractedSteps.filter(function (item) {
|
58
|
+
return item === null || item === void 0 ? void 0 : item.shouldIncludeStep;
|
59
|
+
}); // To get the ProgressIndicator's `currentIndex`, accounting for dynamic steps,
|
60
|
+
// we need to subtract the number of !shouldIncludeStep/s before the current step
|
61
|
+
// which we get from `getNumberOfDynamicStepsBeforeCurrentStep()`
|
62
|
+
|
63
|
+
var totalDynamicSteps = getNumberOfDynamicStepsBeforeCurrentStep(stepData, 'shouldIncludeStep') || 0;
|
184
64
|
return /*#__PURE__*/_react.default.createElement("div", {
|
185
65
|
className: "".concat(blockClass, "__left-nav")
|
186
|
-
}, currentStep === 1 && (
|
187
|
-
currentIndex:
|
66
|
+
}, currentStep === 1 && (_stepData$ = stepData[0]) !== null && _stepData$ !== void 0 && _stepData$.introStep ? null : /*#__PURE__*/_react.default.createElement(_carbonComponentsReact.ProgressIndicator, {
|
67
|
+
currentIndex: (_stepData$2 = stepData[0]) !== null && _stepData$2 !== void 0 && _stepData$2.introStep ? currentStep - totalDynamicSteps - 2 // minus 2 because we need to account for the intro step in addition to `currentIndex` being 0 index based and our steps being 1 index based
|
68
|
+
: currentStep - totalDynamicSteps - 1 // minus 1 because ProgressIndicator currentIndex prop is 0 index based, but our steps are 1 index based
|
69
|
+
,
|
188
70
|
spaceEqually: true,
|
189
71
|
vertical: true,
|
190
|
-
className: (0, _classnames.default)("".concat(blockClass, "__progress-indicator")
|
191
|
-
},
|
72
|
+
className: (0, _classnames.default)("".concat(blockClass, "__progress-indicator"))
|
73
|
+
}, progressSteps.map(function (step, stepIndex) {
|
192
74
|
return /*#__PURE__*/_react.default.createElement(_carbonComponentsReact.ProgressStep, {
|
193
|
-
label:
|
75
|
+
label: step.title,
|
194
76
|
key: stepIndex,
|
195
|
-
secondaryLabel:
|
77
|
+
secondaryLabel: step.secondaryLabel
|
196
78
|
});
|
197
79
|
})));
|
198
80
|
};
|
199
81
|
|
200
82
|
return /*#__PURE__*/_react.default.createElement("div", {
|
201
83
|
className: (0, _classnames.default)(blockClass, className)
|
202
|
-
}, renderProgressSteps()
|
84
|
+
}, renderProgressSteps());
|
203
85
|
}; // The display name of the component, used by React. Note that displayName
|
204
86
|
// is used in preference to relying on function.name.
|
205
87
|
|
@@ -207,98 +89,23 @@ var CreateInfluencer = function CreateInfluencer(_ref) {
|
|
207
89
|
exports.CreateInfluencer = CreateInfluencer;
|
208
90
|
CreateInfluencer.displayName = componentName;
|
209
91
|
CreateInfluencer.propTypes = {
|
210
|
-
/**
|
211
|
-
* Sets the active side nav item when toggle is on
|
212
|
-
*/
|
213
|
-
activeSectionIndex: _propTypes.default.number.isRequired,
|
214
|
-
|
215
92
|
/**
|
216
93
|
* Provide an optional class to be applied to the containing node.
|
217
94
|
*/
|
218
95
|
className: _propTypes.default.string,
|
219
96
|
|
220
|
-
/**
|
221
|
-
* The blockClass for the create component (Tearsheet or FullPage)
|
222
|
-
*/
|
223
|
-
componentBlockClass: _propTypes.default.string.isRequired,
|
224
|
-
|
225
|
-
/**
|
226
|
-
* Used to mark the current step on the ProgressIndicator component
|
227
|
-
*/
|
228
|
-
createComponentName: _propTypes.default.string.isRequired,
|
229
|
-
|
230
|
-
/**
|
231
|
-
* An object with section and step components, needed to render the progress steps. This is where the titles are retrieved from.
|
232
|
-
*/
|
233
|
-
createComponents: _propTypes.default.shape({
|
234
|
-
steps: _propTypes.default.arrayOf(_propTypes.default.element),
|
235
|
-
sections: _propTypes.default.arrayOf(_propTypes.default.element)
|
236
|
-
}).isRequired,
|
237
|
-
|
238
97
|
/**
|
239
98
|
* Used to mark the current step on the ProgressIndicator component
|
240
99
|
*/
|
241
100
|
currentStep: _propTypes.default.number.isRequired,
|
242
101
|
|
243
102
|
/**
|
244
|
-
*
|
245
|
-
*/
|
246
|
-
handleActiveSectionIndex: _propTypes.default.func,
|
247
|
-
|
248
|
-
/**
|
249
|
-
* Handler used to track the state of the toggle
|
250
|
-
*/
|
251
|
-
handleToggleState: _propTypes.default.func,
|
252
|
-
|
253
|
-
/**
|
254
|
-
* Used to optionally include view all toggle
|
255
|
-
*/
|
256
|
-
includeViewAllToggle: _propTypes.default.bool,
|
257
|
-
|
258
|
-
/**
|
259
|
-
* This is the open state of the CreateComponent in which the CreateInfluencer is used from
|
260
|
-
*/
|
261
|
-
open: _propTypes.default.bool,
|
262
|
-
|
263
|
-
/**
|
264
|
-
* This is the open state of the CreateComponent in which the CreateInfluencer is used from
|
265
|
-
*/
|
266
|
-
previousState: _propTypes.default.object,
|
267
|
-
|
268
|
-
/**
|
269
|
-
* The aria label to be used for the UI Shell SideNav Carbon component
|
270
|
-
*/
|
271
|
-
sideNavAriaLabel: _propTypes.default.string.isRequired.if(function (_ref2) {
|
272
|
-
var includeViewAllToggle = _ref2.includeViewAllToggle;
|
273
|
-
return includeViewAllToggle;
|
274
|
-
}),
|
275
|
-
|
276
|
-
/**
|
277
|
-
* The current toggled state to be provided to the Toggle component
|
278
|
-
*/
|
279
|
-
toggleState: _propTypes.default.bool,
|
280
|
-
|
281
|
-
/**
|
282
|
-
* Sets the label text for the view all toggle component
|
283
|
-
*/
|
284
|
-
viewAllToggleLabelText: _propTypes.default.string.isRequired.if(function (_ref3) {
|
285
|
-
var includeViewAllToggle = _ref3.includeViewAllToggle;
|
286
|
-
return includeViewAllToggle === true;
|
287
|
-
}),
|
288
|
-
|
289
|
-
/**
|
290
|
-
* Sets the label text for the view all toggle `off` text
|
291
|
-
*/
|
292
|
-
viewAllToggleOffLabelText: _propTypes.default.string.isRequired.if(function (_ref4) {
|
293
|
-
var includeViewAllToggle = _ref4.includeViewAllToggle;
|
294
|
-
return includeViewAllToggle === true;
|
295
|
-
}),
|
296
|
-
|
297
|
-
/**
|
298
|
-
* Sets the label text for the view all toggle `on` text
|
103
|
+
* The step data that renders the progress items
|
299
104
|
*/
|
300
|
-
|
301
|
-
|
302
|
-
|
303
|
-
|
105
|
+
stepData: _propTypes.default.arrayOf(_propTypes.default.shape({
|
106
|
+
introStep: _propTypes.default.bool,
|
107
|
+
secondaryLabel: _propTypes.default.string,
|
108
|
+
shouldIncludeStep: _propTypes.default.bool,
|
109
|
+
title: _propTypes.default.node
|
110
|
+
}))
|
304
111
|
};
|