@porsche-design-system/components-react 2.13.0-rc.3 → 2.13.0

package/CHANGELOG.md

@@ -9,6 +9,22 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 
 ### [Unreleased]
 
+### [2.13.0] - 2022-06-23
+
+### [2.13.0-rc.5] - 2022-06-23
+
+#### Fixed
+
+- `Stepper Horizontal Item` `state` validation
+- `Button` and `Link` with `theme="dark" variant="tertiary"` and `Tag Dismissible` bug on Safari < v15.5 where wrong
+  colors on hover were shown
+
+### [2.13.0-rc.4] - 2022-06-22
+
+#### Added
+
+- `Stepper Horizontal`
+
 ### [2.13.0-rc.3] - 2022-06-22
 
 #### Added

package/esm/public-api.js

@@ -553,6 +553,37 @@ const PSpinner = /*#__PURE__*/ forwardRef(({ aria, size = 'small', theme = 'ligh
     return jsx(Tag, { ...props });
 });
 
+const PStepperHorizontal = /*#__PURE__*/ forwardRef(({ onStepChange, theme = 'light', className, ...rest }, ref) => {
+    const elementRef = useRef();
+    useEventCallback(elementRef, 'stepChange', onStepChange);
+    const Tag = usePrefix('p-stepper-horizontal');
+    useBrowserLayoutEffect(() => {
+        elementRef.current.theme = theme;
+    }, [theme]);
+    const props = {
+        ...rest,
+        class: useMergedClass(elementRef, className),
+        ref: syncRef(elementRef, ref)
+    };
+    return jsx(Tag, { ...props });
+});
+
+const PStepperHorizontalItem = /*#__PURE__*/ forwardRef(({ disabled = false, state, className, ...rest }, ref) => {
+    const elementRef = useRef();
+    const Tag = usePrefix('p-stepper-horizontal-item');
+    const propsToSync = [disabled, state];
+    useBrowserLayoutEffect(() => {
+        const { current } = elementRef;
+        ['disabled', 'state'].forEach((propName, i) => (current[propName] = propsToSync[i]));
+    }, propsToSync);
+    const props = {
+        ...rest,
+        class: useMergedClass(elementRef, className),
+        ref: syncRef(elementRef, ref)
+    };
+    return jsx(Tag, { ...props });
+});
+
 const PSwitch = /*#__PURE__*/ forwardRef(({ alignLabel = 'right', checked = false, disabled = false, hideLabel = false, loading = false, onSwitchChange, stretch = false, tabbable = true, theme = 'light', className, ...rest }, ref) => {
     const elementRef = useRef();
     useEventCallback(elementRef, 'switchChange', onSwitchChange);
@@ -828,4 +859,4 @@ const PToast = /*#__PURE__*/ forwardRef(({ theme = 'light', className, ...rest }
     return jsx(Tag, { ...props });
 });
 
-export { PAccordion, PBanner, PButton, PButtonGroup, PButtonPure, PCheckboxWrapper, PContentWrapper, PDivider, PFieldsetWrapper, PFlex, PFlexItem, PGrid, PGridItem, PHeadline, PIcon, PInlineNotification, PLink, PLinkPure, PLinkSocial, PMarque, PModal, PPagination, PPopover, PRadioButtonWrapper, PSegmentedControl, PSegmentedControlItem, PSelectWrapper, PSpinner, PSwitch, PTable, PTableBody, PTableCell, PTableHead, PTableHeadCell, PTableHeadRow, PTableRow, PTabs, PTabsBar, PTabsItem, PTag, PTagDismissible, PText, PTextFieldWrapper, PTextList, PTextListItem, PTextareaWrapper, PToast, PorscheDesignSystemProvider, skipCheckForPorscheDesignSystemProviderDuringTests, skipPorscheDesignSystemCDNRequestsDuringTests, useToastManager };
+export { PAccordion, PBanner, PButton, PButtonGroup, PButtonPure, PCheckboxWrapper, PContentWrapper, PDivider, PFieldsetWrapper, PFlex, PFlexItem, PGrid, PGridItem, PHeadline, PIcon, PInlineNotification, PLink, PLinkPure, PLinkSocial, PMarque, PModal, PPagination, PPopover, PRadioButtonWrapper, PSegmentedControl, PSegmentedControlItem, PSelectWrapper, PSpinner, PStepperHorizontal, PStepperHorizontalItem, PSwitch, PTable, PTableBody, PTableCell, PTableHead, PTableHeadCell, PTableHeadRow, PTableRow, PTabs, PTabsBar, PTabsItem, PTag, PTagDismissible, PText, PTextFieldWrapper, PTextList, PTextListItem, PTextareaWrapper, PToast, PorscheDesignSystemProvider, skipCheckForPorscheDesignSystemProviderDuringTests, skipPorscheDesignSystemCDNRequestsDuringTests, useToastManager };