@patternfly/quickstarts 2.2.4 → 2.3.0

package/dist/patternfly-docs/quick-starts/design-guidelines/design-guidelines.md

@@ -21,14 +21,14 @@ Quick starts are usually surfaced within a [catalog](https://www.patternfly.org/
 2. **Title:** The title briefly communicates what the quick start covers.
 3. **Labels:** [Filled labels](https://www.patternfly.org/v4/components/label) communicate the estimated completion time and status. If the quick start is presented in a mixed catalog of resources, a label can indicate the type of resource.
 4. **Description:** The description summarizes the quick start outcome in four lines or fewer.
-5. **Prerequisites (optional):** Prerequisites communicate user requirements prior to starting the quick start. They’re displayed in a popover, and they’re organized into a bulleted list. The total number of prerequisites is listed in parentheses on the quick start card.
+5. **Prerequisites (optional):** Prerequisites communicate user requirements before starting the quick start. They’re displayed in a popover, and they’re organized into a bulleted list. The total number of prerequisites is listed in parentheses on the quick start card.
 
 <img src="./img/prerequisites.png" alt="Example of prerequisites" width="395"/>
 
 ### Catalog
 Multiple quick starts are often presented to users in a catalog.
 
-<img src="./img/catalog-elements.png" alt="Quick start catalog" width="1680"/>
+<img src="./img/catalog-elements.png" alt="quick start catalog" width="1680"/>
 
 Catalogs with 14 or fewer quick starts should  include a simple toolbar with the following elements:
 1. Keyword filter
@@ -76,7 +76,7 @@ Tasks consist of 2-10 steps, which walk the user through the UI to complete the
 <img src="./img/task.png" alt="Example task" width="449"/>
 
 #### Check your work
-The check your work module is shown at the bottom of the side panel for each task and helps the user validate that they have successfully completed the task. You can choose to make the check your work module required or optional. Validation questions should be yes/no questions, allowing the user to select the radio button with the appropriate response.
+The check your work module is shown at the bottom of the side panel for each task and helps the user validate that they have completed the task. You can choose to make the check your work module required or optional. Validation questions should be yes/no questions, allowing the user to select the radio button with the appropriate response.
 
 <img src="./img/check-your-work.png" alt="Check your work module" width="431"/>
 
@@ -98,7 +98,7 @@ Here are some general guidelines to follow when authoring quick start content:
   * Provide links at the end of quick starts if the user is likely to need or want additional technical  information upon completion.
   * Provide links in the check your work module when a user answers **No** if more robust information can help the user understand what actions they must take to complete the task.  
 
-For more specific quick start content guidelines, refer to the [Red Hat OpenShift documentation](https://docs.openshift.com/container-platform/4.7/web_console/creating-quick-start-tutorials.html). While these guidelines are geared towards Red Hat OpenShift, they can apply to quick starts in any products.
+For more specific quick start content guidelines, refer to the [Red Hat OpenShift documentation](https://docs.openshift.com/container-platform/4.7/web_console/creating-quick-start-tutorials.html). While these guidelines are geared toward Red Hat OpenShift, they can apply to quick starts in any product.
 
 ## Quick starts in context
 

package/dist/patternfly-docs/quick-starts/examples/about.md

@@ -9,15 +9,15 @@ id: Quick Starts
 source: about
 ---
 # About
-The **@patternfly/quickstarts** extension is made up of two parts: `Quick starts` and `In App Documentation` product documentation tools.
+The **@patternfly/quickstarts** extension is made up of two parts: `Quick starts` and `in-app documentation` product documentation tools.
 
 ## Full live demo application
-A live demo of **Quick starts and In App Documentation** can be found [here](https://quickstarts.netlify.app/), or view the [demo code](https://github.com/patternfly/patternfly-quickstarts/tree/main/packages/dev).
+A live demo of **quick starts and in-app Documentation** can be found [here](https://quickstarts.netlify.app/), or view the [demo code](https://github.com/patternfly/patternfly-quickstarts/tree/main/packages/dev).
 
 A few key concepts are outlined below.
 
 ## Quick starts
-A `Quick start` is a set of step-by-step instructions and tasks presented in a side panel embedded in a product’s UI. Quick starts can help users get started with a product, and they often provide guidance around installation and setup.
+A `Quick start` is a set of step-by-step instructions and tasks presented in a side panel embedded in a product’s UI. Quick starts can help users get started with a product, and they often guide installation and setup.
 
 Each task in a quick start has multiple steps, and each quick start has multiple tasks. The outcome of the quick start includes the artifacts or state needed to successfully use the product, specific features, or add-ons.
 
@@ -46,16 +46,16 @@ const { setActiveQuickStart } = React.useContext<QuickStartContextValues>(
 ```
 
 #### Quick start catalog
-By providing a set of quick starts to the `QuickStartContainer`, a full page catalog view will be generated. Clicking on a catalog card will open its respective `Quick start` in the side panel. 
+By providing a set of quick starts to the `QuickStartContainer`, a full-page catalog view will be generated. Clicking on a catalog card will open its respective `quick start` in the side panel. 
 
 <img src="./img/catalog.png" alt="Quick start catalog" width="1680"/>
 
 ## In-app documentation
-In App Documentation is used to provide definitions for a set of topics relevant to your product. A single unit of In App Documentation can be called a `HelpTopic`, which is also the name used in code. `HelpTopic`'s essential sections are a **content** section that contains a definition of the term or topic, and an optional list of **links** to provide the user with other relevant information.
+In-app documentation is used to provide definitions for a set of topics relevant to your product. A single unit of in-app documentation can be called a `HelpTopic`, which is also the name used in code. `HelpTopic`'s essential sections are a **content** section that contains a definition of the term or topic, and an optional list of **links** to provide the user with other relevant information.
 
-`HelpTopics` are displayed in a side panel just like `Quick starts`:
+`HelpTopics` are displayed in a side panel just like `quick starts`:
 
-<img src="./img/help-topic.png" alt="Quick start catalog" width="449"/>
+<img src="./img/help-topic.png" alt="quick start catalog" width="449"/>
 
 ### Help Topic format
 
@@ -74,4 +74,4 @@ Open the side panel by calling `setActiveHelpTopicByName` (available from `HelpT
 const { setActiveHelpTopicByName } = React.useContext<HelpTopicContextValues>(HelpTopicContext);
 ```
 
-Close it by calling `setActiveHelpTopicByName` with an empty string. There is no prebuilt `HelpTopic` catalog. simply attach a handler with `setActiveHelpTopicByName` to the appropriate DOM element. See the [basic example](/extensions/quick-starts/In-App-Documentation), or [live demo code](https://github.com/patternfly/patternfly-quickstarts/tree/main/packages/dev) for more details.
+Close it by calling `setActiveHelpTopicByName` with an empty string. There is no prebuilt `HelpTopic` catalog. simply attach a handler with `setActiveHelpTopicByName` to the appropriate DOM element. See the [basic example](/extensions/quick-starts/In-App-Documentation) or [live demo code](https://github.com/patternfly/patternfly-quickstarts/tree/main/packages/dev) for more details.

package/dist/quickstarts-full.es.js

@@ -14718,7 +14718,7 @@ const useInlineCopyClipboardShowdownExtension = () => {
     const { getResource } = React.useContext(QuickStartContext);
     return React.useMemo(() => ({
         type: 'lang',
-        regex: /`([^`](.*?)[^`])`{{copy}}/g,
+        regex: /```[\n]\s*((((?!```).)*?\n)+)\s*```{{copy}}/g,
         replace: (text, group, subGroup, groupType, groupId) => {
             if (!group || !subGroup || !groupType || !groupId) {
                 return text;
@@ -14818,7 +14818,7 @@ const useAdmonitionShowdownExtension = () => {
     // const { getResource } = React.useContext<QuickStartContextValues>(QuickStartContext);
     return React.useMemo(() => ({
         type: 'lang',
-        regex: /\[([\d\w\s-()$!]+)]{{(admonition) ([\w-]+)}}/g,
+        regex: /\[(.+)]{{(admonition) ([\w-]+)}}/g,
         replace: (text, content, admonitionLabel, admonitionType, groupId) => {
             if (!content || !admonitionLabel || !admonitionType || !groupId) {
                 return text;
@@ -20448,7 +20448,7 @@ const HelpTopicPanelContent = (_a) => {
     const paddingContainer = (children) => React.createElement("div", { style: { padding: '24px' } }, children);
     const panelBodyItems = (React.createElement(React.Fragment, null,
         paddingContainer(React.createElement(QuickStartMarkdownView, { content: activeHelpTopic === null || activeHelpTopic === void 0 ? void 0 : activeHelpTopic.content })),
-        ((_b = activeHelpTopic === null || activeHelpTopic === void 0 ? void 0 : activeHelpTopic.links) === null || _b === void 0 ? void 0 : _b.length) && React.createElement(Divider, null),
+        !!((_b = activeHelpTopic === null || activeHelpTopic === void 0 ? void 0 : activeHelpTopic.links) === null || _b === void 0 ? void 0 : _b.length) && React.createElement(Divider, null),
         paddingContainer(React.createElement(Stack, { hasGutter: true }, (_c = activeHelpTopic === null || activeHelpTopic === void 0 ? void 0 : activeHelpTopic.links) === null || _c === void 0 ? void 0 : _c.map(({ href, text, newTab, isExternal }, index) => {
             return (React.createElement(StackItem, { key: index },
                 React.createElement(Button$1, { component: "a", href: href, target: newTab ? '_blank' : '', rel: "noopener noreferrer", variant: "link", "aria-label": `Open documentation in new window`, isInline: true, icon: isExternal ? React.createElement(ExternalLinkAltIcon, null) : null, iconPosition: "right", style: { fontSize: 'inherit' } }, text || href)));