@patternfly/documentation-framework 6.0.0-alpha.2 → 6.0.0-alpha.20

package/CHANGELOG.md

@@ -3,6 +3,183 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# 6.0.0-alpha.20 (2024-04-03)
+
+
+### Bug Fixes
+
+* dark theme use v6 classname ([54cdb71](https://github.com/patternfly/patternfly-org/commit/54cdb717052eb00da735b0c7db6a82db4ef5f9de))
+
+
+
+
+
+# 6.0.0-alpha.19 (2024-04-02)
+
+
+### Features
+
+* **misc:** update alpha versions ([#3951](https://github.com/patternfly/patternfly-org/issues/3951)) ([c9c41ab](https://github.com/patternfly/patternfly-org/commit/c9c41abc396347e17d0e5afd5431331b80860ebb))
+
+
+
+
+
+# 6.0.0-alpha.18 (2024-03-29)
+
+**Note:** Version bump only for package @patternfly/documentation-framework
+
+
+
+
+
+# 6.0.0-alpha.17 (2024-03-28)
+
+**Note:** Version bump only for package @patternfly/documentation-framework
+
+
+
+
+
+# 6.0.0-alpha.16 (2024-03-27)
+
+**Note:** Version bump only for package @patternfly/documentation-framework
+
+
+
+
+
+# 6.0.0-alpha.15 (2024-03-26)
+
+
+### Bug Fixes
+
+* **docs:** fixed table of contents expand button cutoff ([#3929](https://github.com/patternfly/patternfly-org/issues/3929)) ([246ded9](https://github.com/patternfly/patternfly-org/commit/246ded97c3e52451ea46ee93638c974760d5e873))
+
+
+
+
+
+# 6.0.0-alpha.14 (2024-03-22)
+
+**Note:** Version bump only for package @patternfly/documentation-framework
+
+
+
+
+
+# 6.0.0-alpha.13 (2024-03-21)
+
+**Note:** Version bump only for package @patternfly/documentation-framework
+
+
+
+
+
+# 6.0.0-alpha.12 (2024-02-27)
+
+**Note:** Version bump only for package @patternfly/documentation-framework
+
+
+
+
+
+# 6.0.0-alpha.11 (2024-02-22)
+
+
+### Features
+
+* pull in latest alpha with new v6 prefixes ([#3899](https://github.com/patternfly/patternfly-org/issues/3899)) ([8e57612](https://github.com/patternfly/patternfly-org/commit/8e57612b00b626a1d5b8d8762139a1499cf46aa3))
+
+
+
+
+
+# 6.0.0-alpha.10 (2024-02-01)
+
+
+### Bug Fixes
+
+* bump docs framework version ([815e094](https://github.com/patternfly/patternfly-org/commit/815e09456987062a9b5d8a17c960698fd0c1c81c))
+
+
+
+
+
+# 6.0.0-alpha.9 (2024-01-23)
+
+
+### Bug Fixes
+
+* Update versions.json to include drag drop alpha ([9d924b7](https://github.com/patternfly/patternfly-org/commit/9d924b747cc3e431dffe438ed41940fbd610aa91))
+
+
+
+
+
+# 6.0.0-alpha.8 (2024-01-15)
+
+**Note:** Version bump only for package @patternfly/documentation-framework
+
+
+
+
+
+# 6.0.0-alpha.7 (2024-01-12)
+
+
+### Bug Fixes
+
+* Update brand svg id to avoid duplicate ids ([55d351b](https://github.com/patternfly/patternfly-org/commit/55d351be1b8d4d4f0b6d5f5090cbedc6629c6d94))
+
+
+
+
+
+# 6.0.0-alpha.6 (2024-01-12)
+
+
+### Bug Fixes
+
+* bump puppeteer ([#3858](https://github.com/patternfly/patternfly-org/issues/3858)) ([2182a0f](https://github.com/patternfly/patternfly-org/commit/2182a0fe4d4d50c866703efe316deafffc44e5a2))
+
+
+
+
+
+# 6.0.0-alpha.5 (2023-12-20)
+
+
+### Bug Fixes
+
+* PF brand logo in masthead to inline svg ([cafef36](https://github.com/patternfly/patternfly-org/commit/cafef363ea6b0912af9c5a1d5a0e10c353b60fd0))
+
+
+
+
+
+# 6.0.0-alpha.4 (2023-12-20)
+
+
+### Bug Fixes
+
+* update white space to test publishing to aws ([4432fbe](https://github.com/patternfly/patternfly-org/commit/4432fbea86ab6f420cef816475718a62c673a870))
+
+
+
+
+
+# 6.0.0-alpha.3 (2023-12-18)
+
+
+### Bug Fixes
+
+* try publish v6 to aws ([#3845](https://github.com/patternfly/patternfly-org/issues/3845)) ([9cc0909](https://github.com/patternfly/patternfly-org/commit/9cc09090ee035ac7087aacd9067b52a146bf3229))
+
+
+
+
+
 # 6.0.0-alpha.2 (2023-12-15)
 
 
@@ -21,6 +198,195 @@ See [Conventional Commits](https://conventionalcommits.org) for commit guideline
 
 * try a v6 release ([7d3150c](https://github.com/patternfly/patternfly-org/commit/7d3150c1195b013001720d1e5161cbb724a0d73b))
 
+# Change Log
+
+All notable changes to this project will be documented in this file.
+See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
+
+# 5.8.0 (2024-03-20)
+
+
+### Features
+
+* **templates:** add templates package to versions.json ([#3902](https://github.com/patternfly/patternfly-org/issues/3902)) ([c7c727c](https://github.com/patternfly/patternfly-org/commit/c7c727c717d5cc3c031f4f3c52070ffc6164e5d6))
+
+
+
+
+
+# 5.7.0 (2024-03-19)
+
+
+### Features
+
+* add pf 6 alpha banner to home page and version switcher ([#3896](https://github.com/patternfly/patternfly-org/issues/3896)) ([f7aaa22](https://github.com/patternfly/patternfly-org/commit/f7aaa22d12310aa62533de4169e1fa70a49a20d9))
+
+
+
+
+
+# 5.6.0 (2024-03-13)
+
+
+### Features
+
+* **deps:** version bump and release notes for 5.2.2 patch release ([#3919](https://github.com/patternfly/patternfly-org/issues/3919)) ([94d3654](https://github.com/patternfly/patternfly-org/commit/94d3654768f42f2ae7b3c0734d1e5f211cd33ff6))
+
+
+
+
+
+## 5.5.1 (2024-03-12)
+
+**Note:** Version bump only for package @patternfly/documentation-framework
+
+
+
+
+
+# 5.5.0 (2024-03-08)
+
+
+### Features
+
+* **deps:** version bump for 5.2.1 release ([#3913](https://github.com/patternfly/patternfly-org/issues/3913)) ([46cc8b7](https://github.com/patternfly/patternfly-org/commit/46cc8b70e06b9bda61067beba57d928e428b73c5))
+
+
+
+
+
+## 5.4.3 (2024-02-27)
+
+**Note:** Version bump only for package @patternfly/documentation-framework
+
+
+
+
+
+## 5.4.2 (2024-02-14)
+
+**Note:** Version bump only for package @patternfly/documentation-framework
+
+
+
+
+
+## 5.4.1 (2024-02-06)
+
+
+### Bug Fixes
+
+* Bump topology to 5.2.1 ([#3881](https://github.com/patternfly/patternfly-org/issues/3881)) ([af13c97](https://github.com/patternfly/patternfly-org/commit/af13c971384aaaa5bd87ce3e98dccee4b1214889))
+
+
+
+
+
+# 5.4.0 (2024-02-03)
+
+
+### Features
+
+* release 5.3 ([#3878](https://github.com/patternfly/patternfly-org/issues/3878)) ([3d1d130](https://github.com/patternfly/patternfly-org/commit/3d1d130c63ac4421ed8a307cd6ef140fa6e1d6f2))
+
+
+
+
+
+## 5.3.27 (2024-02-01)
+
+**Note:** Version bump only for package @patternfly/documentation-framework
+
+
+
+
+
+## 5.3.26 (2024-02-01)
+
+**Note:** Version bump only for package @patternfly/documentation-framework
+
+
+
+
+
+## 5.3.25 (2024-01-30)
+
+**Note:** Version bump only for package @patternfly/documentation-framework
+
+
+
+
+
+## 5.3.24 (2024-01-30)
+
+**Note:** Version bump only for package @patternfly/documentation-framework
+
+
+
+
+
+## 5.3.23 (2024-01-19)
+
+
+### Bug Fixes
+
+* avoid applying beta tags to nav items for next components ([#3868](https://github.com/patternfly/patternfly-org/issues/3868)) ([169c96f](https://github.com/patternfly/patternfly-org/commit/169c96f55b1bfdcb9859dbab27b88f5a180f48ba))
+
+
+
+
+
+## 5.3.22 (2024-01-16)
+
+**Note:** Version bump only for package @patternfly/documentation-framework
+
+
+
+
+
+## 5.3.21 (2024-01-16)
+
+
+### Bug Fixes
+
+* bump to latest release candidates ahead of 5.2 release ([#3862](https://github.com/patternfly/patternfly-org/issues/3862)) ([12eeb78](https://github.com/patternfly/patternfly-org/commit/12eeb782d32c4fa65f6aef64292f1e0d92f0d183))
+
+
+
+
+## 5.3.20 (2024-01-15)
+
+**Note:** Version bump only for package @patternfly/documentation-framework
+
+
+## 5.3.19 (2024-01-15)
+
+**Note:** Version bump only for package @patternfly/documentation-framework
+
+
+## 5.3.18 (2024-01-12)
+
+
+### Bug Fixes
+
+* bump puppeteer to fix core ([#3860](https://github.com/patternfly/patternfly-org/issues/3860)) ([1695209](https://github.com/patternfly/patternfly-org/commit/169520944b7c3dccf69709e6e2075b9153fce059))
+
+
+## 5.3.17 (2024-01-05)
+
+**Note:** Version bump only for package @patternfly/documentation-framework
+
+
+## 5.3.16 (2024-01-03)
+
+**Note:** Version bump only for package @patternfly/documentation-framework
+
+
+
+## 5.3.15 (2023-12-14)
+
+**Note:** Version bump only for package @patternfly/documentation-framework
+
 
 
 

package/components/autoLinkHeader/autoLinkHeader.css

@@ -3,8 +3,8 @@
 }
 
 .ws-heading-anchor {
-  color: var(--pf-v5-global--Color--100);
-  transform: translate(calc(-100% - var(--pf-v5-global--spacer--xs)), -50%);
+  color: var(--pf-v6-global--Color--100);
+  transform: translate(calc(-100% - var(--pf-v6-global--spacer--xs)), -50%);
   opacity: 0;
   position: absolute;
   left: 0;

package/components/cssVariables/cssVariables.css

@@ -2,14 +2,14 @@
   display: inline-block;
   height: 18px;
   width: 18px;
-  border: var(--pf-v5-global--BorderWidth--sm) solid var(--pf-v5-global--BorderColor--200);
-  border-radius: var(--pf-v5-global--BorderRadius--lg);
+  border: var(--pf-v6-global--BorderWidth--sm) solid var(--pf-v6-global--BorderColor--200);
+  border-radius: var(--pf-v6-global--BorderRadius--lg);
 }
 
 .ws-td-text {
-  font-size: var(--pf-v5-global--FontSize--sm) !important;
+  font-size: var(--pf-v6-global--FontSize--sm) !important;
 }
 
 .ws-css-property {
-  padding: var(--pf-v5-global--spacer--xs) var(--pf-v5-global--spacer--md);
+  padding: var(--pf-v6-global--spacer--xs) var(--pf-v6-global--spacer--md);
 }

package/components/cssVariables/cssVariables.js

@@ -62,7 +62,7 @@ const flattenList = files => {
 export class CSSVariables extends React.Component {
   constructor(props) {
     super(props);
-    const prefixToken = props.prefix.replace("pf-v5-", "").replace(/-+/g, "_");
+    const prefixToken = props.prefix.replace("pf-v6-", "").replace(/-+/g, "_");
     const applicableFiles = Object.entries(tokensModule)
       .filter(([key, val]) => prefixToken === key)
       .sort(([key1], [key2]) => key1.localeCompare(key2))
@@ -103,12 +103,12 @@ export class CSSVariables extends React.Component {
           <div key={rowKey}>
             <div
               key={`${rowKey}_1`}
-              className="pf-v5-l-flex pf-m-space-items-sm"
+              className="pf-v6-l-flex pf-m-space-items-sm"
             >
               {isColorRegex.test(value) && (
                 <div
                   key={`${rowKey}_2`}
-                  className="pf-v5-l-flex pf-m-column pf-m-align-self-center"
+                  className="pf-v6-l-flex pf-m-column pf-m-align-self-center"
                 >
                   <span
                     className="ws-color-box"
@@ -118,7 +118,7 @@ export class CSSVariables extends React.Component {
               )}
               <div
                 key={`${rowKey}_3`}
-                className="pf-v5-l-flex pf-m-column pf-m-align-self-center ws-td-text"
+                className="pf-v6-l-flex pf-m-column pf-m-align-self-center ws-td-text"
               >
                 {value}
               </div>
@@ -170,7 +170,7 @@ export class CSSVariables extends React.Component {
   render() {
     return (
       <React.Fragment>
-        {this.props.autoLinkHeader && <AutoLinkHeader size="h3" className="pf-v5-u-mt-lg pf-v5-u-mb-md">{`Prefixed with '${this.props.prefix}'`}</AutoLinkHeader>}
+        {this.props.autoLinkHeader && <AutoLinkHeader size="h3" className="pf-v6-u-mt-lg pf-v6-u-mb-md">{`Prefixed with '${this.props.prefix}'`}</AutoLinkHeader>}
         <CSSSearch getDebouncedFilteredRows={this.getDebouncedFilteredRows} />
         <Table
           variant="compact"

package/components/example/example.css

@@ -3,52 +3,52 @@
 }
 
 .ws-example {
-  margin-top: var(--pf-v5-global--spacer--lg);
-  margin-bottom: var(--pf-v5-global--spacer--lg);
+  margin-top: var(--pf-v6-global--spacer--lg);
+  margin-bottom: var(--pf-v6-global--spacer--lg);
 }
 
 .ws-example > .ws-example-header {
-  padding: var(--pf-v5-global--spacer--md);
+  padding: var(--pf-v6-global--spacer--md);
 }
 
 .ws-example-header > .ws-example-heading:not(:last-child) {
-  margin-bottom: var(--pf-v5-global--spacer--md);
+  margin-bottom: var(--pf-v6-global--spacer--md);
 }
 
-.ws-code-editor:not(.ws-example-code-expanded) > .pf-v5-c-code-editor__header::before {
-  --pf-v5-c-code-editor__header--before--BorderBottomWidth: 0;
+.ws-code-editor:not(.ws-example-code-expanded) > .pf-v6-c-code-editor__header::before {
+  --pf-v6-c-code-editor__header--before--BorderBottomWidth: 0;
 }
 
 .ws-code-editor-control {
-  --pf-v5-c-button--m-control--BackgroundColor: transparent;
-  --pf-v5-c-button--m-control--active--BackgroundColor: transparent;
-  --pf-v5-c-button--m-control--focus--BackgroundColor: transparent;
-  --pf-v5-c-button--m-control--hover--BackgroundColor: transparent;
+  --pf-v6-c-button--m-control--BackgroundColor: transparent;
+  --pf-v6-c-button--m-control--active--BackgroundColor: transparent;
+  --pf-v6-c-button--m-control--focus--BackgroundColor: transparent;
+  --pf-v6-c-button--m-control--hover--BackgroundColor: transparent;
 }
 
-.ws-code-editor-control.pf-v5-c-button {
-  --pf-v5-c-button--after--BorderWidth: 0;
+.ws-code-editor-control.pf-v6-c-button {
+  --pf-v6-c-button--after--BorderWidth: 0;
 }
 
 .ws-preview {
-  padding: var(--pf-v5-global--spacer--md);
-  background-color: var(--pf-v5-global--BackgroundColor--100);
-  border-bottom: var(--pf-v5-global--BorderWidth--sm) solid var(--pf-v5-global--BorderColor--300);
+  padding: var(--pf-v6-global--spacer--md);
+  background-color: var(--pf-v6-global--BackgroundColor--100);
+  border-bottom: var(--pf-v6-global--BorderWidth--sm) solid var(--pf-v6-global--BorderColor--300);
   transition: width .2s ease-in-out;
 }
 
 .ws-core-c-page.ws-preview > .ws-preview-html,
-.ws-react-c-page.ws-preview > .pf-v5-c-page {
+.ws-react-c-page.ws-preview > .pf-v6-c-page {
   overflow: hidden;
 }
 
 .ws-editor {
-  font-size: var(--pf-v5-global--FontSize--md);
+  font-size: var(--pf-v6-global--FontSize--md);
 }
 
 .ws-editor .token.punctuation,
 .ws-editor .token.operator {
-  color: var(--pf-v5-global--danger-color--100);
+  color: var(--pf-v6-global--danger-color--100);
 }
 
 .ws-preview__thumbnail-link {
@@ -100,33 +100,33 @@
   color: rgba(255,255,255,.4);
 }
 
-.pf-v5-c-badge.ws-beta-badge {
-  --pf-v5-c-badge--m-unread--BackgroundColor: var(--pf-v5-global--BackgroundColor--100);
-  --pf-v5-c-badge--m-unread--Color: var(--pf-v5-global--primary-color--100);
-  border: var(--pf-v5-global--BorderWidth--sm) solid var(--pf-v5-global--primary-color--100);
+.pf-v6-c-badge.ws-beta-badge {
+  --pf-v6-c-badge--m-unread--BackgroundColor: var(--pf-v6-global--BackgroundColor--100);
+  --pf-v6-c-badge--m-unread--Color: var(--pf-v6-global--primary-color--100);
+  border: var(--pf-v6-global--BorderWidth--sm) solid var(--pf-v6-global--primary-color--100);
 }
 
 .ws-prop-required {
-  color: var(--pf-v5-global--danger-color--100);
+  color: var(--pf-v6-global--danger-color--100);
 }
 
 .ws-full-page-utils {
   position: fixed;
   right: 0;
   bottom: 0;
-  padding: var(--pf-v5-global--spacer--lg);
-  z-index: var(--pf-v5-global--ZIndex--2xl);
+  padding: var(--pf-v6-global--spacer--lg);
+  z-index: var(--pf-v6-global--ZIndex--2xl);
 }
 
 .ws-full-page-utils::before {
   position: absolute;
   inset: 0;
   content: "";
-  background-color: var(--pf-v5-global--BackgroundColor--100);
+  background-color: var(--pf-v6-global--BackgroundColor--100);
   opacity: 0.8;
-  box-shadow: var(--pf-v5-global--BoxShadow--sm);
+  box-shadow: var(--pf-v6-global--BoxShadow--sm);
 }
 
-.pf-v5-theme-dark .ws-theme-switch-full-page::before {
-  background-color: var(--pf-v5-global--BackgroundColor--300);
+.pf-v6-theme-dark .ws-theme-switch-full-page::before {
+  background-color: var(--pf-v6-global--BackgroundColor--300);
 }

package/components/example/example.js

@@ -131,7 +131,7 @@ export const Example = ({
   if (lang === 'html') {
     livePreview = (
       <div
-        className={css('ws-preview-html', isFullscreenPreview && 'pf-v5-u-h-100')}
+        className={css('ws-preview-html', isFullscreenPreview && 'pf-v6-u-h-100')}
         dangerouslySetInnerHTML={{ __html: editorCode }}
       />
     );
@@ -164,13 +164,13 @@ export const Example = ({
 
   if (isFullscreenPreview) {
     return (
-      <div id={previewId} className={css(className, 'pf-v5-u-h-100')}>
+      <div id={previewId} className={css(className, 'pf-v6-u-h-100')}>
         {livePreview}
         {(hasDarkThemeSwitcher || hasRTLSwitcher) && (
-          <Flex direction={{ default: 'column' }} gap={{ default: 'gapLg' }} className="ws-full-page-utils pf-v5-m-dir-ltr ">
+          <Flex direction={{ default: 'column' }} gap={{ default: 'gapLg' }} className="ws-full-page-utils pf-v6-m-dir-ltr ">
             {hasDarkThemeSwitcher && (
               <Switch id="ws-example-theme-switch" label="Dark theme" defaultChecked={false} onChange={() =>
-              document.querySelector('html').classList.toggle('pf-v5-theme-dark')} />
+              document.querySelector('html').classList.toggle('pf-v6-theme-dark')} />
             )}
             {hasRTLSwitcher && (
               <Switch id="ws-example-rtl-switch" label="RTL" defaultChecked={false} onChange={() => {
@@ -248,7 +248,7 @@ export const Example = ({
             className={css(
               className,
               isFullscreen ? 'ws-preview-fullscreen' : 'ws-preview',
-              isRTL && 'pf-v5-m-dir-rtl')
+              isRTL && 'pf-v6-m-dir-rtl')
             }
           >
             {livePreview}

package/components/example/exampleToolbar.js

@@ -103,7 +103,7 @@ export const ExampleToolbar = ({
             copyCode();
             trackEvent('code_editor_control_click', 'click_event', 'COPY_CODE');
           }}
-          variant="control"
+          variant="plain"
           aria-label={copyAriaLabel}
           className={editorControlProps.className}
         >
@@ -124,7 +124,7 @@ export const ExampleToolbar = ({
           >
             <Button
               aria-label={codesandboxAriaLabel}
-              variant="control"
+              variant="plain"
               type="submit"
               onClick={() => {
                 trackEvent('code_editor_control_click', 'click_event', 'CODESANDBOX_LINK');
@@ -218,6 +218,7 @@ export const ExampleToolbar = ({
       onEditorDidMount={onEditorDidMount}
       isReadOnly={isFullscreen}
       className={`${isEditorOpen ? 'ws-example-code-expanded ' : ''}ws-code-editor`}
+      isHeaderPlain
     />
   );
 }