@carbon/ibm-products 2.5.0 → 2.6.0
Sign up to get free protection for your applications and to get access to all the features.
- package/es/components/CreateTearsheet/CreateTearsheetStep.js +18 -5
- package/es/components/CreateTearsheet/preview-components/MultiStepTearsheet.js +7 -4
- package/lib/components/CreateTearsheet/CreateTearsheetStep.js +17 -4
- package/lib/components/CreateTearsheet/preview-components/MultiStepTearsheet.js +6 -3
- package/package.json +2 -2
@@ -10,7 +10,7 @@ var _excluded = ["children", "className", "description", "disableSubmit", "field
|
|
10
10
|
* LICENSE file in the root directory of this source tree.
|
11
11
|
*/
|
12
12
|
|
13
|
-
import React, { forwardRef, useContext, useEffect, useState } from 'react';
|
13
|
+
import React, { forwardRef, useContext, useEffect, useState, isValidElement } from 'react';
|
14
14
|
import PropTypes from 'prop-types';
|
15
15
|
import cx from 'classnames';
|
16
16
|
import { Column, FormGroup, Grid } from '@carbon/react';
|
@@ -83,6 +83,21 @@ export var CreateTearsheetStep = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
83
83
|
stepsContext === null || stepsContext === void 0 ? void 0 : stepsContext.setOnNext(onNext); // needs to be updated here otherwise there could be stale state values from only initially setting onNext
|
84
84
|
}
|
85
85
|
}, [stepsContext, stepNumber, disableSubmit, onNext]);
|
86
|
+
var renderDescription = function renderDescription() {
|
87
|
+
if (description) {
|
88
|
+
if (typeof description === 'string') {
|
89
|
+
return /*#__PURE__*/React.createElement("p", {
|
90
|
+
className: "".concat(blockClass, "--description")
|
91
|
+
}, description);
|
92
|
+
}
|
93
|
+
if ( /*#__PURE__*/isValidElement(description)) {
|
94
|
+
return /*#__PURE__*/React.createElement("div", {
|
95
|
+
className: "".concat(blockClass, "--description")
|
96
|
+
}, description);
|
97
|
+
}
|
98
|
+
}
|
99
|
+
return null;
|
100
|
+
};
|
86
101
|
return stepsContext ? /*#__PURE__*/React.createElement(Grid, _extends({}, rest, {
|
87
102
|
className: cx(blockClass, className, (_cx = {}, _defineProperty(_cx, "".concat(blockClass, "__step--hidden-step"), stepNumber !== (stepsContext === null || stepsContext === void 0 ? void 0 : stepsContext.currentStep)), _defineProperty(_cx, "".concat(blockClass, "__step--visible-step"), stepNumber === (stepsContext === null || stepsContext === void 0 ? void 0 : stepsContext.currentStep)), _cx)),
|
88
103
|
ref: ref
|
@@ -95,9 +110,7 @@ export var CreateTearsheetStep = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
95
110
|
className: "".concat(blockClass, "--title")
|
96
111
|
}, title), subtitle && /*#__PURE__*/React.createElement("h6", {
|
97
112
|
className: "".concat(blockClass, "--subtitle")
|
98
|
-
}, subtitle),
|
99
|
-
className: "".concat(blockClass, "--description")
|
100
|
-
}, description)), /*#__PURE__*/React.createElement(Column, {
|
113
|
+
}, subtitle), renderDescription()), /*#__PURE__*/React.createElement(Column, {
|
101
114
|
span: 100
|
102
115
|
}, hasFieldset ? /*#__PURE__*/React.createElement(FormGroup, {
|
103
116
|
legendText: fieldsetLegendText,
|
@@ -119,7 +132,7 @@ CreateTearsheetStep.propTypes = {
|
|
119
132
|
/**
|
120
133
|
* Sets an optional description on the step component
|
121
134
|
*/
|
122
|
-
description: PropTypes.
|
135
|
+
description: PropTypes.node,
|
123
136
|
/**
|
124
137
|
* This will conditionally disable the submit button in the multi step Tearsheet
|
125
138
|
*/
|
@@ -11,7 +11,7 @@ var _excluded = ["value1", "setValue1"];
|
|
11
11
|
*/
|
12
12
|
|
13
13
|
import React, { useState } from 'react';
|
14
|
-
import { Button, Column, Grid, InlineNotification, RadioButtonGroup, RadioButton, TextInput, Toggle, NumberInput, Checkbox } from '@carbon/react';
|
14
|
+
import { Button, Column, Grid, InlineNotification, RadioButtonGroup, RadioButton, TextInput, Toggle, NumberInput, Checkbox, Link } from '@carbon/react';
|
15
15
|
import cx from 'classnames';
|
16
16
|
import { pkg } from '../../../settings';
|
17
17
|
import { CreateTearsheet } from '../CreateTearsheet';
|
@@ -152,7 +152,9 @@ export var MultiStepTearsheet = function MultiStepTearsheet(_ref2) {
|
|
152
152
|
fieldsetLegendText: "Topic information",
|
153
153
|
disableSubmit: !stepOneTextInputValue,
|
154
154
|
subtitle: "This is the unique name used to recognize your topic",
|
155
|
-
description: "It will also be used by your producers and consumers as part of the connection information, so make it something easy to recognize."
|
155
|
+
description: /*#__PURE__*/React.createElement("div", null, "It will also be used by your producers and consumers as part of the connection information, so make it something easy to recognize. ", /*#__PURE__*/React.createElement(Link, {
|
156
|
+
href: "#"
|
157
|
+
}, "Learn more."))
|
156
158
|
}, /*#__PURE__*/React.createElement(Grid, null, /*#__PURE__*/React.createElement(Column, {
|
157
159
|
xlg: 8,
|
158
160
|
lg: 8,
|
@@ -206,8 +208,9 @@ export var MultiStepTearsheet = function MultiStepTearsheet(_ref2) {
|
|
206
208
|
}), /*#__PURE__*/React.createElement(Checkbox, {
|
207
209
|
labelText: "Include additional step",
|
208
210
|
id: "include-additional-step-checkbox",
|
209
|
-
onChange: function onChange(
|
210
|
-
|
211
|
+
onChange: function onChange(event, _ref3) {
|
212
|
+
var checked = _ref3.checked;
|
213
|
+
return setShouldIncludeAdditionalStep(checked);
|
211
214
|
},
|
212
215
|
checked: shouldIncludeAdditionalStep
|
213
216
|
})))), /*#__PURE__*/React.createElement(CreateTearsheetStep, {
|
@@ -92,6 +92,21 @@ var CreateTearsheetStep = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, re
|
|
92
92
|
stepsContext === null || stepsContext === void 0 ? void 0 : stepsContext.setOnNext(onNext); // needs to be updated here otherwise there could be stale state values from only initially setting onNext
|
93
93
|
}
|
94
94
|
}, [stepsContext, stepNumber, disableSubmit, onNext]);
|
95
|
+
var renderDescription = function renderDescription() {
|
96
|
+
if (description) {
|
97
|
+
if (typeof description === 'string') {
|
98
|
+
return /*#__PURE__*/_react.default.createElement("p", {
|
99
|
+
className: "".concat(blockClass, "--description")
|
100
|
+
}, description);
|
101
|
+
}
|
102
|
+
if ( /*#__PURE__*/(0, _react.isValidElement)(description)) {
|
103
|
+
return /*#__PURE__*/_react.default.createElement("div", {
|
104
|
+
className: "".concat(blockClass, "--description")
|
105
|
+
}, description);
|
106
|
+
}
|
107
|
+
}
|
108
|
+
return null;
|
109
|
+
};
|
95
110
|
return stepsContext ? /*#__PURE__*/_react.default.createElement(_react2.Grid, (0, _extends2.default)({}, rest, {
|
96
111
|
className: (0, _classnames.default)(blockClass, className, (_cx = {}, (0, _defineProperty2.default)(_cx, "".concat(blockClass, "__step--hidden-step"), stepNumber !== (stepsContext === null || stepsContext === void 0 ? void 0 : stepsContext.currentStep)), (0, _defineProperty2.default)(_cx, "".concat(blockClass, "__step--visible-step"), stepNumber === (stepsContext === null || stepsContext === void 0 ? void 0 : stepsContext.currentStep)), _cx)),
|
97
112
|
ref: ref
|
@@ -104,9 +119,7 @@ var CreateTearsheetStep = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, re
|
|
104
119
|
className: "".concat(blockClass, "--title")
|
105
120
|
}, title), subtitle && /*#__PURE__*/_react.default.createElement("h6", {
|
106
121
|
className: "".concat(blockClass, "--subtitle")
|
107
|
-
}, subtitle),
|
108
|
-
className: "".concat(blockClass, "--description")
|
109
|
-
}, description)), /*#__PURE__*/_react.default.createElement(_react2.Column, {
|
122
|
+
}, subtitle), renderDescription()), /*#__PURE__*/_react.default.createElement(_react2.Column, {
|
110
123
|
span: 100
|
111
124
|
}, hasFieldset ? /*#__PURE__*/_react.default.createElement(_react2.FormGroup, {
|
112
125
|
legendText: fieldsetLegendText,
|
@@ -129,7 +142,7 @@ CreateTearsheetStep.propTypes = {
|
|
129
142
|
/**
|
130
143
|
* Sets an optional description on the step component
|
131
144
|
*/
|
132
|
-
description: _propTypes.default.
|
145
|
+
description: _propTypes.default.node,
|
133
146
|
/**
|
134
147
|
* This will conditionally disable the submit button in the multi step Tearsheet
|
135
148
|
*/
|
@@ -161,7 +161,9 @@ var MultiStepTearsheet = function MultiStepTearsheet(_ref2) {
|
|
161
161
|
fieldsetLegendText: "Topic information",
|
162
162
|
disableSubmit: !stepOneTextInputValue,
|
163
163
|
subtitle: "This is the unique name used to recognize your topic",
|
164
|
-
description: "It will also be used by your producers and consumers as part of the connection information, so make it something easy to recognize."
|
164
|
+
description: /*#__PURE__*/_react.default.createElement("div", null, "It will also be used by your producers and consumers as part of the connection information, so make it something easy to recognize. ", /*#__PURE__*/_react.default.createElement(_react2.Link, {
|
165
|
+
href: "#"
|
166
|
+
}, "Learn more."))
|
165
167
|
}, /*#__PURE__*/_react.default.createElement(_react2.Grid, null, /*#__PURE__*/_react.default.createElement(_react2.Column, {
|
166
168
|
xlg: 8,
|
167
169
|
lg: 8,
|
@@ -215,8 +217,9 @@ var MultiStepTearsheet = function MultiStepTearsheet(_ref2) {
|
|
215
217
|
}), /*#__PURE__*/_react.default.createElement(_react2.Checkbox, {
|
216
218
|
labelText: "Include additional step",
|
217
219
|
id: "include-additional-step-checkbox",
|
218
|
-
onChange: function onChange(
|
219
|
-
|
220
|
+
onChange: function onChange(event, _ref3) {
|
221
|
+
var checked = _ref3.checked;
|
222
|
+
return setShouldIncludeAdditionalStep(checked);
|
220
223
|
},
|
221
224
|
checked: shouldIncludeAdditionalStep
|
222
225
|
})))), /*#__PURE__*/_react.default.createElement(_CreateTearsheetStep.CreateTearsheetStep, {
|
package/package.json
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
{
|
2
2
|
"name": "@carbon/ibm-products",
|
3
3
|
"description": "Carbon for IBM Products",
|
4
|
-
"version": "2.
|
4
|
+
"version": "2.6.0",
|
5
5
|
"license": "Apache-2.0",
|
6
6
|
"main": "lib/index.js",
|
7
7
|
"module": "es/index.js",
|
@@ -94,5 +94,5 @@
|
|
94
94
|
"react": "^16.8.6 || ^17.0.1",
|
95
95
|
"react-dom": "^16.8.6 || ^17.0.1"
|
96
96
|
},
|
97
|
-
"gitHead": "
|
97
|
+
"gitHead": "f1e9562497e15c834c38b7b9bcd330102523d468"
|
98
98
|
}
|