@patternfly/quickstarts 6.1.0-prerelease.2 → 6.1.0-prerelease.4
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/dist/QuickStartContainer.d.ts +55 -0
- package/dist/QuickStartDrawer.d.ts +2 -51
- package/dist/QuickStartDrawerContent.d.ts +12 -0
- package/dist/index.d.ts +3 -0
- package/dist/index.es.js +53 -45
- package/dist/index.es.js.map +1 -1
- package/dist/index.js +52 -43
- package/dist/index.js.map +1 -1
- package/dist/patternfly-docs/quick-starts/examples/WithCustomDrawer.jsx +158 -0
- package/dist/patternfly-docs/quick-starts/examples/basic.md +16 -3
- package/dist/quickstarts-base.css +2 -2
- package/dist/quickstarts-full.es.js +52 -44
- package/dist/quickstarts-full.es.js.map +1 -1
- package/dist/quickstarts-standalone.css +2 -2
- package/dist/quickstarts-standalone.min.css +1 -1
- package/dist/quickstarts.css +2 -2
- package/dist/quickstarts.min.css +1 -1
- package/package.json +1 -1
- package/src/QuickStartContainer.tsx +142 -0
- package/src/QuickStartDrawer.tsx +18 -158
- package/src/QuickStartDrawerContent.tsx +54 -0
- package/src/QuickStartPanelContent.scss +2 -2
- package/src/catalog/QuickStartTileHeader.tsx +4 -6
- package/src/index.ts +3 -0
package/dist/index.js
CHANGED
|
@@ -1617,8 +1617,7 @@ const QuickStartTileFooterExternal = ({ link, quickStartId, }) => {
|
|
|
1617
1617
|
};
|
|
1618
1618
|
|
|
1619
1619
|
const QuickStartTileHeader = ({ name, quickStartId, onSelect, }) => (React__namespace.createElement(reactCore.Flex, { flexWrap: { default: 'nowrap' } },
|
|
1620
|
-
React__namespace.createElement(reactCore.
|
|
1621
|
-
React__namespace.createElement(reactCore.Button, { variant: "link", isInline: true, onClick: onSelect }, name))));
|
|
1620
|
+
React__namespace.createElement(reactCore.Button, { "data-test": "title", id: quickStartId, variant: "link", isInline: true, onClick: onSelect }, name)));
|
|
1622
1621
|
|
|
1623
1622
|
const QuickStartTile = ({ quickStart, status, isActive, onClick = () => { }, action, }) => {
|
|
1624
1623
|
const { metadata: { name: id }, spec: { icon, tasks, displayName, description, durationMinutes, prerequisites, link, type }, } = quickStart;
|
|
@@ -2161,39 +2160,26 @@ const QuickStartPanelContent = (_a) => {
|
|
|
2161
2160
|
return content;
|
|
2162
2161
|
};
|
|
2163
2162
|
|
|
2164
|
-
const
|
|
2165
|
-
var { quickStarts
|
|
2166
|
-
const
|
|
2167
|
-
|
|
2168
|
-
|
|
2169
|
-
|
|
2170
|
-
|
|
2171
|
-
|
|
2172
|
-
|
|
2173
|
-
|
|
2174
|
-
|
|
2175
|
-
|
|
2176
|
-
React__namespace.useEffect(() => {
|
|
2177
|
-
if (quickStarts &&
|
|
2178
|
-
JSON.stringify(quickStarts) !== JSON.stringify(valuesForQuickstartContext.allQuickStarts)) {
|
|
2179
|
-
valuesForQuickstartContext.setAllQuickStarts(quickStarts);
|
|
2180
|
-
}
|
|
2181
|
-
}, [quickStarts, valuesForQuickstartContext]);
|
|
2182
|
-
React__namespace.useEffect(() => {
|
|
2183
|
-
if (loading !== valuesForQuickstartContext.loading) {
|
|
2184
|
-
valuesForQuickstartContext.setLoading(loading);
|
|
2163
|
+
const QuickStartDrawerContent = (_a) => {
|
|
2164
|
+
var { quickStarts = [], appendTo, fullWidth, handleDrawerClose } = _a, props = tslib.__rest(_a, ["quickStarts", "appendTo", "fullWidth", "handleDrawerClose"]);
|
|
2165
|
+
const { activeQuickStartID, allQuickStarts = [], activeQuickStartState, } = React__namespace.useContext(QuickStartContext);
|
|
2166
|
+
const combinedQuickStarts = allQuickStarts.concat(quickStarts);
|
|
2167
|
+
const handleClose = () => {
|
|
2168
|
+
handleDrawerClose && handleDrawerClose(activeQuickStartState === null || activeQuickStartState === void 0 ? void 0 : activeQuickStartState.status);
|
|
2169
|
+
};
|
|
2170
|
+
const fullWidthPanelStyle = fullWidth
|
|
2171
|
+
? {
|
|
2172
|
+
style: {
|
|
2173
|
+
flex: 1,
|
|
2174
|
+
},
|
|
2185
2175
|
}
|
|
2186
|
-
|
|
2187
|
-
|
|
2188
|
-
fullWidth,
|
|
2189
|
-
onCloseInProgress,
|
|
2190
|
-
onCloseNotInProgress }, props);
|
|
2191
|
-
return (React__namespace.createElement(QuickStartContext.Provider, { value: valuesForQuickstartContext },
|
|
2192
|
-
React__namespace.createElement(QuickStartDrawer, Object.assign({}, drawerProps), children)));
|
|
2176
|
+
: {};
|
|
2177
|
+
return (React__namespace.createElement(QuickStartPanelContent, Object.assign({ quickStarts: combinedQuickStarts, handleClose: handleClose, activeQuickStartID: activeQuickStartID, appendTo: appendTo, isResizable: !fullWidth }, fullWidthPanelStyle, props)));
|
|
2193
2178
|
};
|
|
2179
|
+
|
|
2194
2180
|
const QuickStartDrawer = (_a) => {
|
|
2195
2181
|
var { quickStarts = [], children, appendTo, fullWidth, onCloseInProgress, onCloseNotInProgress } = _a, props = tslib.__rest(_a, ["quickStarts", "children", "appendTo", "fullWidth", "onCloseInProgress", "onCloseNotInProgress"]);
|
|
2196
|
-
const { activeQuickStartID, setActiveQuickStart, allQuickStarts = [],
|
|
2182
|
+
const { activeQuickStartID, setActiveQuickStart, allQuickStarts = [], allQuickStartStates, setAllQuickStartStates, } = React__namespace.useContext(QuickStartContext);
|
|
2197
2183
|
const combinedQuickStarts = allQuickStarts.concat(quickStarts);
|
|
2198
2184
|
React__namespace.useEffect(() => {
|
|
2199
2185
|
const params = new URLSearchParams(window.location.search);
|
|
@@ -2215,9 +2201,8 @@ const QuickStartDrawer = (_a) => {
|
|
|
2215
2201
|
}
|
|
2216
2202
|
}, [activeQuickStartID, allQuickStartStates, setAllQuickStartStates]);
|
|
2217
2203
|
const [modalOpen, setModalOpen] = React__namespace.useState(false);
|
|
2218
|
-
const activeQuickStartStatus = activeQuickStartState === null || activeQuickStartState === void 0 ? void 0 : activeQuickStartState.status;
|
|
2219
2204
|
const onClose = () => setActiveQuickStart('');
|
|
2220
|
-
const handleClose = () => {
|
|
2205
|
+
const handleClose = (activeQuickStartStatus) => {
|
|
2221
2206
|
if (activeQuickStartStatus === exports.QuickStartStatus.IN_PROGRESS) {
|
|
2222
2207
|
if (onCloseInProgress) {
|
|
2223
2208
|
onCloseInProgress();
|
|
@@ -2238,13 +2223,6 @@ const QuickStartDrawer = (_a) => {
|
|
|
2238
2223
|
onClose();
|
|
2239
2224
|
};
|
|
2240
2225
|
const onModalCancel = () => setModalOpen(false);
|
|
2241
|
-
const fullWidthPanelStyle = fullWidth
|
|
2242
|
-
? {
|
|
2243
|
-
style: {
|
|
2244
|
-
flex: 1,
|
|
2245
|
-
},
|
|
2246
|
-
}
|
|
2247
|
-
: {};
|
|
2248
2226
|
const fullWidthBodyStyle = fullWidth
|
|
2249
2227
|
? {
|
|
2250
2228
|
style: {
|
|
@@ -2252,13 +2230,43 @@ const QuickStartDrawer = (_a) => {
|
|
|
2252
2230
|
},
|
|
2253
2231
|
}
|
|
2254
2232
|
: {};
|
|
2255
|
-
const panelContent = (React__namespace.createElement(QuickStartPanelContent, Object.assign({ quickStarts: combinedQuickStarts, handleClose: handleClose, activeQuickStartID: activeQuickStartID, appendTo: appendTo, isResizable: !fullWidth }, fullWidthPanelStyle)));
|
|
2256
2233
|
return (React__namespace.createElement(React__namespace.Fragment, null,
|
|
2257
|
-
React__namespace.createElement(reactCore.Drawer, Object.assign({ isExpanded: !!activeQuickStartID, isInline: true }, props),
|
|
2258
|
-
React__namespace.createElement(reactCore.
|
|
2234
|
+
React__namespace.createElement(reactCore.Drawer, Object.assign({ isExpanded: !!activeQuickStartID, isInline: true }, props),
|
|
2235
|
+
React__namespace.createElement(reactCore.DrawerContent, Object.assign({ panelContent: React__namespace.createElement(QuickStartDrawerContent, { quickStarts: combinedQuickStarts, handleDrawerClose: handleClose, appendTo: appendTo, fullWidth: fullWidth }) }, fullWidthBodyStyle),
|
|
2236
|
+
React__namespace.createElement(reactCore.DrawerContentBody, null, children))),
|
|
2259
2237
|
React__namespace.createElement(QuickStartCloseModal, { isOpen: modalOpen, onConfirm: onModalConfirm, onCancel: onModalCancel })));
|
|
2260
2238
|
};
|
|
2261
2239
|
|
|
2240
|
+
const QuickStartContainer = (_a) => {
|
|
2241
|
+
var { quickStarts, children, activeQuickStartID, allQuickStartStates, setActiveQuickStartID, setAllQuickStartStates, appendTo, fullWidth, onCloseInProgress, onCloseNotInProgress, resourceBundle, showCardFooters, useLegacyHeaderColors, language, loading = false, useQueryParams = true, markdown, contextProps, alwaysShowTaskReview = true, isManagedDrawer = true } = _a, props = tslib.__rest(_a, ["quickStarts", "children", "activeQuickStartID", "allQuickStartStates", "setActiveQuickStartID", "setAllQuickStartStates", "appendTo", "fullWidth", "onCloseInProgress", "onCloseNotInProgress", "resourceBundle", "showCardFooters", "useLegacyHeaderColors", "language", "loading", "useQueryParams", "markdown", "contextProps", "alwaysShowTaskReview", "isManagedDrawer"]);
|
|
2242
|
+
const valuesForQuickstartContext = useValuesForQuickStartContext(Object.assign({ allQuickStarts: quickStarts, activeQuickStartID,
|
|
2243
|
+
setActiveQuickStartID,
|
|
2244
|
+
allQuickStartStates,
|
|
2245
|
+
setAllQuickStartStates, footer: {
|
|
2246
|
+
show: showCardFooters,
|
|
2247
|
+
}, useLegacyHeaderColors,
|
|
2248
|
+
language, resourceBundle: Object.assign({}, resourceBundle), loading,
|
|
2249
|
+
useQueryParams,
|
|
2250
|
+
markdown,
|
|
2251
|
+
alwaysShowTaskReview }, contextProps));
|
|
2252
|
+
React__namespace.useEffect(() => {
|
|
2253
|
+
if (quickStarts &&
|
|
2254
|
+
JSON.stringify(quickStarts) !== JSON.stringify(valuesForQuickstartContext.allQuickStarts)) {
|
|
2255
|
+
valuesForQuickstartContext.setAllQuickStarts(quickStarts);
|
|
2256
|
+
}
|
|
2257
|
+
}, [quickStarts, valuesForQuickstartContext]);
|
|
2258
|
+
React__namespace.useEffect(() => {
|
|
2259
|
+
if (loading !== valuesForQuickstartContext.loading) {
|
|
2260
|
+
valuesForQuickstartContext.setLoading(loading);
|
|
2261
|
+
}
|
|
2262
|
+
}, [loading, valuesForQuickstartContext]);
|
|
2263
|
+
const drawerProps = Object.assign({ appendTo,
|
|
2264
|
+
fullWidth,
|
|
2265
|
+
onCloseInProgress,
|
|
2266
|
+
onCloseNotInProgress }, props);
|
|
2267
|
+
return (React__namespace.createElement(QuickStartContext.Provider, { value: valuesForQuickstartContext }, isManagedDrawer ? (React__namespace.createElement(QuickStartDrawer, Object.assign({}, drawerProps), children)) : (children)));
|
|
2268
|
+
};
|
|
2269
|
+
|
|
2262
2270
|
const HelpTopicContextDefaults = {
|
|
2263
2271
|
helpTopics: [],
|
|
2264
2272
|
setHelpTopics: () => { },
|
|
@@ -2532,6 +2540,7 @@ exports.QuickStartContext = QuickStartContext;
|
|
|
2532
2540
|
exports.QuickStartContextDefaults = QuickStartContextDefaults;
|
|
2533
2541
|
exports.QuickStartContextProvider = QuickStartContextProvider;
|
|
2534
2542
|
exports.QuickStartDrawer = QuickStartDrawer;
|
|
2543
|
+
exports.QuickStartDrawerContent = QuickStartDrawerContent;
|
|
2535
2544
|
exports.QuickStartPanelContent = QuickStartPanelContent;
|
|
2536
2545
|
exports.QuickStartTile = QuickStartTile;
|
|
2537
2546
|
exports.QuickStartTileDescription = QuickStartTileDescription;
|