npm - @patternfly/react-core - Versions diffs - 5.0.0-alpha.47 → 5.0.0-alpha.48 - Mend

@patternfly/react-core 5.0.0-alpha.47 → 5.0.0-alpha.48

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.

Files changed (484) hide show

package/src/components/DataList/examples/DataListCheckboxes.tsx CHANGED Viewed

@@ -7,12 +7,14 @@ import {
   DataListItemRow,
   DataListCell,
   DataListCheck,
-  DataListAction,
-  Dropdown,
-  DropdownItem,
+  DataListAction
+} from '@patternfly/react-core';
+import {
+  Dropdown as DropdownDeprecated,
+  DropdownItem as DropdownItemDeprecated,
   DropdownPosition,
   KebabToggle
-} from '@patternfly/react-core';
+} from '@patternfly/react-core/deprecated';
 export const DataListCheckboxes: React.FunctionComponent = () => {
   const [isOpen1, setIsOpen1] = React.useState(false);
@@ -72,20 +74,20 @@ export const DataListCheckboxes: React.FunctionComponent = () => {
             aria-label="Actions"
             isPlainButtonAction
           >
-            <Dropdown
+            <DropdownDeprecated
               isPlain
               position={DropdownPosition.right}
               isOpen={isOpen1}
               onSelect={onSelect1}
               toggle={<KebabToggle onToggle={onToggle1} />}
               dropdownItems={[
-                <DropdownItem key="link">Link</DropdownItem>,
-                <DropdownItem key="action" component="button">
+                <DropdownItemDeprecated key="link">Link</DropdownItemDeprecated>,
+                <DropdownItemDeprecated key="action" component="button">
                   Action
-                </DropdownItem>,
-                <DropdownItem key="disabled link" isDisabled>
+                </DropdownItemDeprecated>,
+                <DropdownItemDeprecated key="disabled link" isDisabled>
                   Disabled Link
-                </DropdownItem>
+                </DropdownItemDeprecated>
               ]}
             />
           </DataListAction>
@@ -112,19 +114,19 @@ export const DataListCheckboxes: React.FunctionComponent = () => {
             aria-label="Actions"
             isPlainButtonAction
           >
-            <Dropdown
+            <DropdownDeprecated
               isPlain
               position={DropdownPosition.right}
               isOpen={isOpen2}
               onSelect={onSelect2}
               toggle={<KebabToggle onToggle={onToggle2} />}
               dropdownItems={[
-                <DropdownItem key="pri-action2" component="button">
+                <DropdownItemDeprecated key="pri-action2" component="button">
                   Primary
-                </DropdownItem>,
-                <DropdownItem key="sec-action2" component="button">
+                </DropdownItemDeprecated>,
+                <DropdownItemDeprecated key="sec-action2" component="button">
                   Secondary
-                </DropdownItem>
+                </DropdownItemDeprecated>
               ]}
             />
           </DataListAction>
@@ -160,25 +162,25 @@ export const DataListCheckboxes: React.FunctionComponent = () => {
             aria-label="Actions"
             isPlainButtonAction
           >
-            <Dropdown
+            <DropdownDeprecated
               isPlain
               position={DropdownPosition.right}
               isOpen={isOpen3}
               onSelect={onSelect3}
               toggle={<KebabToggle onToggle={onToggle3} />}
               dropdownItems={[
-                <DropdownItem key="pri-action3" component="button">
+                <DropdownItemDeprecated key="pri-action3" component="button">
                   Primary
-                </DropdownItem>,
-                <DropdownItem key="sec1-action3" component="button">
+                </DropdownItemDeprecated>,
+                <DropdownItemDeprecated key="sec1-action3" component="button">
                   Secondary
-                </DropdownItem>,
-                <DropdownItem key="sec2-action3" component="button">
+                </DropdownItemDeprecated>,
+                <DropdownItemDeprecated key="sec2-action3" component="button">
                   Secondary
-                </DropdownItem>,
-                <DropdownItem key="sec3-action3" component="button">
+                </DropdownItemDeprecated>,
+                <DropdownItemDeprecated key="sec3-action3" component="button">
                   Secondary
-                </DropdownItem>
+                </DropdownItemDeprecated>
               ]}
             />
           </DataListAction>

package/src/components/DataList/examples/DataListExpandable.tsx CHANGED Viewed

@@ -7,12 +7,14 @@ import {
   DataListAction,
   DataListToggle,
   DataListContent,
-  DataListItemCells,
-  Dropdown,
-  DropdownItem,
+  DataListItemCells
+} from '@patternfly/react-core';
+import {
+  Dropdown as DropdownDeprecated,
+  DropdownItem as DropdownItemDeprecated,
   DropdownPosition,
   KebabToggle
-} from '@patternfly/react-core';
+} from '@patternfly/react-core/deprecated';
 import CodeBranchIcon from '@patternfly/react-icons/dist/esm/icons/code-branch-icon';
 export const DataListExpandable: React.FunctionComponent = () => {
@@ -44,7 +46,7 @@ export const DataListExpandable: React.FunctionComponent = () => {
     setIsOpen3(!isOpen3);
   };
-  const toggle = id => {
+  const toggle = (id) => {
     const index = expanded.indexOf(id);
     const newExpanded =
       index >= 0 ? [...expanded.slice(0, index), ...expanded.slice(index + 1, expanded.length)] : [...expanded, id];
@@ -85,20 +87,20 @@ export const DataListExpandable: React.FunctionComponent = () => {
               aria-label="Actions"
               isPlainButtonAction
             >
-              <Dropdown
+              <DropdownDeprecated
                 isPlain
                 position={DropdownPosition.right}
                 isOpen={isOpen1}
                 onSelect={onSelect1}
                 toggle={<KebabToggle onToggle={onToggle1} />}
                 dropdownItems={[
-                  <DropdownItem key="link">Link</DropdownItem>,
-                  <DropdownItem key="action" component="button">
+                  <DropdownItemDeprecated key="link">Link</DropdownItemDeprecated>,
+                  <DropdownItemDeprecated key="action" component="button">
                     Action
-                  </DropdownItem>,
-                  <DropdownItem key="disabled link" isDisabled>
+                  </DropdownItemDeprecated>,
+                  <DropdownItemDeprecated key="disabled link" isDisabled>
                     Disabled Link
-                  </DropdownItem>
+                  </DropdownItemDeprecated>
                 ]}
               />
             </DataListAction>
@@ -145,20 +147,20 @@ export const DataListExpandable: React.FunctionComponent = () => {
               aria-label="Actions"
               isPlainButtonAction
             >
-              <Dropdown
+              <DropdownDeprecated
                 isPlain
                 position={DropdownPosition.right}
                 isOpen={isOpen2}
                 onSelect={onSelect2}
                 toggle={<KebabToggle onToggle={onToggle2} />}
                 dropdownItems={[
-                  <DropdownItem key="link">Link</DropdownItem>,
-                  <DropdownItem key="action" component="button">
+                  <DropdownItemDeprecated key="link">Link</DropdownItemDeprecated>,
+                  <DropdownItemDeprecated key="action" component="button">
                     Action
-                  </DropdownItem>,
-                  <DropdownItem key="disabled link" isDisabled>
+                  </DropdownItemDeprecated>,
+                  <DropdownItemDeprecated key="disabled link" isDisabled>
                     Disabled Link
-                  </DropdownItem>
+                  </DropdownItemDeprecated>
                 ]}
               />
             </DataListAction>
@@ -205,20 +207,20 @@ export const DataListExpandable: React.FunctionComponent = () => {
               aria-label="Actions"
               isPlainButtonAction
             >
-              <Dropdown
+              <DropdownDeprecated
                 isPlain
                 position={DropdownPosition.right}
                 isOpen={isOpen3}
                 onSelect={onSelect3}
                 toggle={<KebabToggle onToggle={onToggle3} />}
                 dropdownItems={[
-                  <DropdownItem key="link">Link</DropdownItem>,
-                  <DropdownItem key="action" component="button">
+                  <DropdownItemDeprecated key="link">Link</DropdownItemDeprecated>,
+                  <DropdownItemDeprecated key="action" component="button">
                     Action
-                  </DropdownItem>,
-                  <DropdownItem key="disabled link" isDisabled>
+                  </DropdownItemDeprecated>,
+                  <DropdownItemDeprecated key="disabled link" isDisabled>
                     Disabled Link
-                  </DropdownItem>
+                  </DropdownItemDeprecated>
                 ]}
               />
             </DataListAction>

package/src/components/DataList/examples/DataListMixedExpandable.tsx CHANGED Viewed

@@ -7,12 +7,14 @@ import {
   DataListAction,
   DataListToggle,
   DataListContent,
-  DataListItemCells,
-  Dropdown,
-  DropdownItem,
+  DataListItemCells
+} from '@patternfly/react-core';
+import {
+  Dropdown as DropdownDeprecated,
+  DropdownItem as DropdownItemDeprecated,
   DropdownPosition,
   KebabToggle
-} from '@patternfly/react-core';
+} from '@patternfly/react-core/deprecated';
 import CodeBranchIcon from '@patternfly/react-icons/dist/esm/icons/code-branch-icon';
 export const DataListMixedExpandable: React.FunctionComponent = () => {
@@ -45,7 +47,7 @@ export const DataListMixedExpandable: React.FunctionComponent = () => {
     setIsOpen3(!isOpen3);
   };
-  const toggle = id => {
+  const toggle = (id) => {
     const index = expanded.indexOf(id);
     const newExpanded =
       index >= 0 ? [...expanded.slice(0, index), ...expanded.slice(index + 1, expanded.length)] : [...expanded, id];
@@ -87,20 +89,20 @@ export const DataListMixedExpandable: React.FunctionComponent = () => {
               aria-label="Actions"
               isPlainButtonAction
             >
-              <Dropdown
+              <DropdownDeprecated
                 isPlain
                 position={DropdownPosition.right}
                 isOpen={isOpen1}
                 onSelect={onSelect1}
                 toggle={<KebabToggle onToggle={onToggle1} />}
                 dropdownItems={[
-                  <DropdownItem key="link">Link</DropdownItem>,
-                  <DropdownItem key="action" component="button">
+                  <DropdownItemDeprecated key="link">Link</DropdownItemDeprecated>,
+                  <DropdownItemDeprecated key="action" component="button">
                     Action
-                  </DropdownItem>,
-                  <DropdownItem key="disabled link" isDisabled>
+                  </DropdownItemDeprecated>,
+                  <DropdownItemDeprecated key="disabled link" isDisabled>
                     Disabled Link
-                  </DropdownItem>
+                  </DropdownItemDeprecated>
                 ]}
               />
             </DataListAction>
@@ -149,20 +151,20 @@ export const DataListMixedExpandable: React.FunctionComponent = () => {
               aria-label="Actions"
               isPlainButtonAction
             >
-              <Dropdown
+              <DropdownDeprecated
                 isPlain
                 position={DropdownPosition.right}
                 isOpen={isOpen2}
                 onSelect={onSelect2}
                 toggle={<KebabToggle onToggle={onToggle2} />}
                 dropdownItems={[
-                  <DropdownItem key="link">Link</DropdownItem>,
-                  <DropdownItem key="action" component="button">
+                  <DropdownItemDeprecated key="link">Link</DropdownItemDeprecated>,
+                  <DropdownItemDeprecated key="action" component="button">
                     Action
-                  </DropdownItem>,
-                  <DropdownItem key="disabled link" isDisabled>
+                  </DropdownItemDeprecated>,
+                  <DropdownItemDeprecated key="disabled link" isDisabled>
                     Disabled Link
-                  </DropdownItem>
+                  </DropdownItemDeprecated>
                 ]}
               />
             </DataListAction>
@@ -199,20 +201,20 @@ export const DataListMixedExpandable: React.FunctionComponent = () => {
               aria-label="Actions"
               isPlainButtonAction
             >
-              <Dropdown
+              <DropdownDeprecated
                 isPlain
                 position={DropdownPosition.right}
                 isOpen={isOpen3}
                 onSelect={onSelect3}
                 toggle={<KebabToggle onToggle={onToggle3} />}
                 dropdownItems={[
-                  <DropdownItem key="link">Link</DropdownItem>,
-                  <DropdownItem key="action" component="button">
+                  <DropdownItemDeprecated key="link">Link</DropdownItemDeprecated>,
+                  <DropdownItemDeprecated key="action" component="button">
                     Action
-                  </DropdownItem>,
-                  <DropdownItem key="disabled link" isDisabled>
+                  </DropdownItemDeprecated>,
+                  <DropdownItemDeprecated key="disabled link" isDisabled>
                     Disabled Link
-                  </DropdownItem>
+                  </DropdownItemDeprecated>
                 ]}
               />
             </DataListAction>

package/src/components/DataList/examples/DataListSelectableRows.tsx CHANGED Viewed

@@ -1,9 +1,5 @@
 import React from 'react';
 import {
-  Dropdown,
-  DropdownItem,
-  DropdownPosition,
-  KebabToggle,
   DataList,
   DataListItem,
   DataListCell,
@@ -11,6 +7,12 @@ import {
   DataListItemCells,
   DataListAction
 } from '@patternfly/react-core';
+import {
+  Dropdown as DropdownDeprecated,
+  DropdownItem as DropdownItemDeprecated,
+  DropdownPosition,
+  KebabToggle
+} from '@patternfly/react-core/deprecated';
 export const DataListSelectableRows: React.FunctionComponent = () => {
   const [isOpen1, setIsOpen1] = React.useState(false);
@@ -65,20 +67,20 @@ export const DataListSelectableRows: React.FunctionComponent = () => {
               aria-label="Actions"
               isPlainButtonAction
             >
-              <Dropdown
+              <DropdownDeprecated
                 isPlain
                 position={DropdownPosition.right}
                 isOpen={isOpen1}
                 onSelect={onSelect1}
                 toggle={<KebabToggle onToggle={onToggle1} />}
                 dropdownItems={[
-                  <DropdownItem key="link">Link</DropdownItem>,
-                  <DropdownItem key="action" component="button">
+                  <DropdownItemDeprecated key="link">Link</DropdownItemDeprecated>,
+                  <DropdownItemDeprecated key="action" component="button">
                     Action
-                  </DropdownItem>,
-                  <DropdownItem key="disabled link" isDisabled>
+                  </DropdownItemDeprecated>,
+                  <DropdownItemDeprecated key="disabled link" isDisabled>
                     Disabled Link
-                  </DropdownItem>
+                  </DropdownItemDeprecated>
                 ]}
               />
             </DataListAction>
@@ -100,20 +102,20 @@ export const DataListSelectableRows: React.FunctionComponent = () => {
               aria-label="Actions"
               isPlainButtonAction
             >
-              <Dropdown
+              <DropdownDeprecated
                 isPlain
                 position={DropdownPosition.right}
                 isOpen={isOpen2}
                 onSelect={onSelect2}
                 toggle={<KebabToggle onToggle={onToggle2} />}
                 dropdownItems={[
-                  <DropdownItem key="link">Link</DropdownItem>,
-                  <DropdownItem key="action" component="button">
+                  <DropdownItemDeprecated key="link">Link</DropdownItemDeprecated>,
+                  <DropdownItemDeprecated key="action" component="button">
                     Action
-                  </DropdownItem>,
-                  <DropdownItem key="disabled link" isDisabled>
+                  </DropdownItemDeprecated>,
+                  <DropdownItemDeprecated key="disabled link" isDisabled>
                     Disabled Link
-                  </DropdownItem>
+                  </DropdownItemDeprecated>
                 ]}
               />
             </DataListAction>

package/src/components/DataList/examples/DataListWidthModifiers.tsx CHANGED Viewed

@@ -9,14 +9,16 @@ import {
   DataListContent,
   DataListItemCells,
   DataListItemRow,
-  Dropdown,
-  DropdownItem,
-  KebabToggle,
-  DropdownPosition,
   Text,
   TextVariants,
   TextContent
 } from '@patternfly/react-core';
+import {
+  Dropdown as DropdownDeprecated,
+  DropdownItem as DropdownItemDeprecated,
+  KebabToggle,
+  DropdownPosition
+} from '@patternfly/react-core/deprecated';
 export const DataListWidthModifiers: React.FunctionComponent = () => {
   const [show, setShow] = React.useState(true);
@@ -112,20 +114,20 @@ export const DataListWidthModifiers: React.FunctionComponent = () => {
                 aria-label="Actions"
                 isPlainButtonAction
               >
-                <Dropdown
+                <DropdownDeprecated
                   isPlain
                   position={DropdownPosition.right}
                   isOpen={isOpen1}
                   onSelect={onSelect1}
                   toggle={<KebabToggle onToggle={onToggle1} />}
                   dropdownItems={[
-                    <DropdownItem key="link">Link</DropdownItem>,
-                    <DropdownItem key="action" component="button">
+                    <DropdownItemDeprecated key="link">Link</DropdownItemDeprecated>,
+                    <DropdownItemDeprecated key="action" component="button">
                       Action
-                    </DropdownItem>,
-                    <DropdownItem key="disabled link" isDisabled>
+                    </DropdownItemDeprecated>,
+                    <DropdownItemDeprecated key="disabled link" isDisabled>
                       Disabled Link
-                    </DropdownItem>
+                    </DropdownItemDeprecated>
                   ]}
                 />
               </DataListAction>
@@ -172,20 +174,20 @@ export const DataListWidthModifiers: React.FunctionComponent = () => {
                 aria-label="Actions"
                 isPlainButtonAction
               >
-                <Dropdown
+                <DropdownDeprecated
                   isPlain
                   position={DropdownPosition.right}
                   isOpen={isOpen2}
                   onSelect={onSelect2}
                   toggle={<KebabToggle onToggle={onToggle2} />}
                   dropdownItems={[
-                    <DropdownItem key="link">Link</DropdownItem>,
-                    <DropdownItem key="action" component="button">
+                    <DropdownItemDeprecated key="link">Link</DropdownItemDeprecated>,
+                    <DropdownItemDeprecated key="action" component="button">
                       Action
-                    </DropdownItem>,
-                    <DropdownItem key="disabled link" isDisabled>
+                    </DropdownItemDeprecated>,
+                    <DropdownItemDeprecated key="disabled link" isDisabled>
                       Disabled Link
-                    </DropdownItem>
+                    </DropdownItemDeprecated>
                   ]}
                 />
               </DataListAction>