@porsche-design-system/components-react 2.20.0 → 3.0.0-alpha.1

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/switch.wrapper.js

@@ -6,14 +6,14 @@ var hooks = require('../../hooks.js');
 var utils = require('../../utils.js');
 var _switch = require('../dsr-components/switch.js');
 
-const PSwitch = /*#__PURE__*/ react.forwardRef(({ alignLabel = 'right', checked = false, disabled = false, hideLabel = false, loading = false, onSwitchChange, stretch = false, tabbable = true, theme = 'light', className, children, ...rest }, ref) => {
+const PSwitch = react.forwardRef(({ alignLabel = 'right', checked = false, disabled = false, hideLabel = false, loading = false, onSwitchChange, stretch = false, theme = 'light', className, children, ...rest }, ref) => {
     const elementRef = react.useRef();
     hooks.useEventCallback(elementRef, 'switchChange', onSwitchChange);
     const WebComponentTag = hooks.usePrefix('p-switch');
-    const propsToSync = [alignLabel, checked, disabled, hideLabel, loading, stretch, tabbable, theme];
+    const propsToSync = [alignLabel, checked, disabled, hideLabel, loading, stretch, theme];
     hooks.useBrowserLayoutEffect(() => {
         const { current } = elementRef;
-        ['alignLabel', 'checked', 'disabled', 'hideLabel', 'loading', 'stretch', 'tabbable', 'theme'].forEach((propName, i) => (current[propName] = propsToSync[i]));
+        ['alignLabel', 'checked', 'disabled', 'hideLabel', 'loading', 'stretch', 'theme'].forEach((propName, i) => (current[propName] = propsToSync[i]));
     }, propsToSync);
     // @ts-ignore
     if (!process.browser) {
@@ -24,7 +24,7 @@ const PSwitch = /*#__PURE__*/ react.forwardRef(({ alignLabel = 'right', checked
         // @ts-ignore
         ...(!process.browser
             ? {
-                children: (jsxRuntime.jsx(_switch.DSRSwitch, { ...{ alignLabel, checked, disabled, hideLabel, loading, stretch, tabbable, theme, children } })),
+                children: (jsxRuntime.jsx(_switch.DSRSwitch, { ...{ alignLabel, checked, disabled, hideLabel, loading, stretch, theme, children } })),
             }
             : {
                 children,

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/table-body.wrapper.js

@@ -6,7 +6,7 @@ var hooks = require('../../hooks.js');
 var utils = require('../../utils.js');
 var tableBody = require('../dsr-components/table-body.js');
 
-const PTableBody = /*#__PURE__*/ react.forwardRef(({ className, children, ...rest }, ref) => {
+const PTableBody = react.forwardRef(({ className, children, ...rest }, ref) => {
     const elementRef = react.useRef();
     const WebComponentTag = hooks.usePrefix('p-table-body');
     // @ts-ignore

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/table-cell.wrapper.js

@@ -6,7 +6,7 @@ var hooks = require('../../hooks.js');
 var utils = require('../../utils.js');
 var tableCell = require('../dsr-components/table-cell.js');
 
-const PTableCell = /*#__PURE__*/ react.forwardRef(({ multiline = false, className, children, ...rest }, ref) => {
+const PTableCell = react.forwardRef(({ multiline = false, className, children, ...rest }, ref) => {
     const elementRef = react.useRef();
     const WebComponentTag = hooks.usePrefix('p-table-cell');
     hooks.useBrowserLayoutEffect(() => {

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/table-head-cell.wrapper.js

@@ -6,7 +6,7 @@ var hooks = require('../../hooks.js');
 var utils = require('../../utils.js');
 var tableHeadCell = require('../dsr-components/table-head-cell.js');
 
-const PTableHeadCell = /*#__PURE__*/ react.forwardRef(({ hideLabel = false, multiline = false, sort, className, children, ...rest }, ref) => {
+const PTableHeadCell = react.forwardRef(({ hideLabel = false, multiline = false, sort, className, children, ...rest }, ref) => {
     const elementRef = react.useRef();
     const WebComponentTag = hooks.usePrefix('p-table-head-cell');
     const propsToSync = [hideLabel, multiline, sort];

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/table-head-row.wrapper.js

@@ -6,7 +6,7 @@ var hooks = require('../../hooks.js');
 var utils = require('../../utils.js');
 var tableHeadRow = require('../dsr-components/table-head-row.js');
 
-const PTableHeadRow = /*#__PURE__*/ react.forwardRef(({ className, children, ...rest }, ref) => {
+const PTableHeadRow = react.forwardRef(({ className, children, ...rest }, ref) => {
     const elementRef = react.useRef();
     const WebComponentTag = hooks.usePrefix('p-table-head-row');
     // @ts-ignore

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/table-head.wrapper.js

@@ -6,7 +6,7 @@ var hooks = require('../../hooks.js');
 var utils = require('../../utils.js');
 var tableHead = require('../dsr-components/table-head.js');
 
-const PTableHead = /*#__PURE__*/ react.forwardRef(({ className, children, ...rest }, ref) => {
+const PTableHead = react.forwardRef(({ className, children, ...rest }, ref) => {
     const elementRef = react.useRef();
     const WebComponentTag = hooks.usePrefix('p-table-head');
     // @ts-ignore

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/table-row.wrapper.js

@@ -6,7 +6,7 @@ var hooks = require('../../hooks.js');
 var utils = require('../../utils.js');
 var tableRow = require('../dsr-components/table-row.js');
 
-const PTableRow = /*#__PURE__*/ react.forwardRef(({ className, children, ...rest }, ref) => {
+const PTableRow = react.forwardRef(({ className, children, ...rest }, ref) => {
     const elementRef = react.useRef();
     const WebComponentTag = hooks.usePrefix('p-table-row');
     // @ts-ignore

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/table.wrapper.js

@@ -6,7 +6,7 @@ var hooks = require('../../hooks.js');
 var utils = require('../../utils.js');
 var table = require('../dsr-components/table.js');
 
-const PTable = /*#__PURE__*/ react.forwardRef(({ caption, onSortingChange, className, children, ...rest }, ref) => {
+const PTable = react.forwardRef(({ caption, onSortingChange, className, children, ...rest }, ref) => {
     const elementRef = react.useRef();
     hooks.useEventCallback(elementRef, 'sortingChange', onSortingChange);
     const WebComponentTag = hooks.usePrefix('p-table');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/tabs-bar.wrapper.js

@@ -6,7 +6,7 @@ var hooks = require('../../hooks.js');
 var utils = require('../../utils.js');
 var tabsBar = require('../dsr-components/tabs-bar.js');
 
-const PTabsBar = /*#__PURE__*/ react.forwardRef(({ activeTabIndex, gradientColorScheme = 'default', onTabChange, size = 'small', theme = 'light', weight = 'regular', className, children, ...rest }, ref) => {
+const PTabsBar = react.forwardRef(({ activeTabIndex, gradientColorScheme = 'default', onTabChange, size = 'small', theme = 'light', weight = 'regular', className, children, ...rest }, ref) => {
     const elementRef = react.useRef();
     hooks.useEventCallback(elementRef, 'tabChange', onTabChange);
     const WebComponentTag = hooks.usePrefix('p-tabs-bar');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/tabs-item.wrapper.js

@@ -6,7 +6,7 @@ var hooks = require('../../hooks.js');
 var utils = require('../../utils.js');
 var tabsItem = require('../dsr-components/tabs-item.js');
 
-const PTabsItem = /*#__PURE__*/ react.forwardRef((
+const PTabsItem = react.forwardRef((
 // @ts-ignore
 { label, className, children, theme = 'light', ...rest }, ref) => {
     const elementRef = react.useRef();

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/tabs.wrapper.js

@@ -6,7 +6,7 @@ var hooks = require('../../hooks.js');
 var utils = require('../../utils.js');
 var tabs = require('../dsr-components/tabs.js');
 
-const PTabs = /*#__PURE__*/ react.forwardRef(({ activeTabIndex = 0, gradientColorScheme = 'default', onTabChange, size = 'small', theme = 'light', weight = 'regular', className, children, ...rest }, ref) => {
+const PTabs = react.forwardRef(({ activeTabIndex = 0, gradientColorScheme = 'default', onTabChange, size = 'small', theme = 'light', weight = 'regular', className, children, ...rest }, ref) => {
     const elementRef = react.useRef();
     hooks.useEventCallback(elementRef, 'tabChange', onTabChange);
     const WebComponentTag = hooks.usePrefix('p-tabs');

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/tag-dismissible.wrapper.js

@@ -6,13 +6,13 @@ var hooks = require('../../hooks.js');
 var utils = require('../../utils.js');
 var tagDismissible = require('../dsr-components/tag-dismissible.js');
 
-const PTagDismissible = /*#__PURE__*/ react.forwardRef(({ aria, color = 'background-surface', label, className, children, ...rest }, ref) => {
+const PTagDismissible = react.forwardRef(({ aria, color = 'background-surface', label, theme = 'light', className, children, ...rest }, ref) => {
     const elementRef = react.useRef();
     const WebComponentTag = hooks.usePrefix('p-tag-dismissible');
-    const propsToSync = [aria, color, label];
+    const propsToSync = [aria, color, label, theme];
     hooks.useBrowserLayoutEffect(() => {
         const { current } = elementRef;
-        ['aria', 'color', 'label'].forEach((propName, i) => (current[propName] = propsToSync[i]));
+        ['aria', 'color', 'label', 'theme'].forEach((propName, i) => (current[propName] = propsToSync[i]));
     }, propsToSync);
     // @ts-ignore
     if (!process.browser) {
@@ -23,7 +23,7 @@ const PTagDismissible = /*#__PURE__*/ react.forwardRef(({ aria, color = 'backgro
         // @ts-ignore
         ...(!process.browser
             ? {
-                children: (jsxRuntime.jsx(tagDismissible.DSRTagDismissible, { ...{ aria, color, label, children } })),
+                children: (jsxRuntime.jsx(tagDismissible.DSRTagDismissible, { ...{ aria, color, label, theme, children } })),
             }
             : {
                 children,

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/tag.wrapper.js

@@ -6,7 +6,7 @@ var hooks = require('../../hooks.js');
 var utils = require('../../utils.js');
 var tag = require('../dsr-components/tag.js');
 
-const PTag = /*#__PURE__*/ react.forwardRef(({ color = 'background-surface', icon, iconSource, theme = 'light', className, children, ...rest }, ref) => {
+const PTag = react.forwardRef(({ color = 'background-surface', icon, iconSource, theme = 'light', className, children, ...rest }, ref) => {
     const elementRef = react.useRef();
     const WebComponentTag = hooks.usePrefix('p-tag');
     const propsToSync = [color, icon, iconSource, theme];

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/text-field-wrapper.wrapper.js

@@ -6,14 +6,14 @@ var hooks = require('../../hooks.js');
 var utils = require('../../utils.js');
 var textFieldWrapper = require('../dsr-components/text-field-wrapper.js');
 
-const PTextFieldWrapper = /*#__PURE__*/ react.forwardRef(({ actionIcon, actionLoading = false, description = '', hideLabel = false, label = '', message = '', onAction, showCharacterCount = true, state = 'none', unit = '', unitPosition = 'prefix', className, children, ...rest }, ref) => {
+const PTextFieldWrapper = react.forwardRef(({ actionIcon, actionLoading = false, description = '', hideLabel = false, label = '', message = '', onAction, showCharacterCount = true, state = 'none', theme = 'light', unit = '', unitPosition = 'prefix', className, children, ...rest }, ref) => {
     const elementRef = react.useRef();
     hooks.useEventCallback(elementRef, 'action', onAction);
     const WebComponentTag = hooks.usePrefix('p-text-field-wrapper');
-    const propsToSync = [actionIcon, actionLoading, description, hideLabel, label, message, showCharacterCount, state, unit, unitPosition];
+    const propsToSync = [actionIcon, actionLoading, description, hideLabel, label, message, showCharacterCount, state, theme, unit, unitPosition];
     hooks.useBrowserLayoutEffect(() => {
         const { current } = elementRef;
-        ['actionIcon', 'actionLoading', 'description', 'hideLabel', 'label', 'message', 'showCharacterCount', 'state', 'unit', 'unitPosition'].forEach((propName, i) => (current[propName] = propsToSync[i]));
+        ['actionIcon', 'actionLoading', 'description', 'hideLabel', 'label', 'message', 'showCharacterCount', 'state', 'theme', 'unit', 'unitPosition'].forEach((propName, i) => (current[propName] = propsToSync[i]));
     }, propsToSync);
     // @ts-ignore
     if (!process.browser) {
@@ -24,7 +24,7 @@ const PTextFieldWrapper = /*#__PURE__*/ react.forwardRef(({ actionIcon, actionLo
         // @ts-ignore
         ...(!process.browser
             ? {
-                children: (jsxRuntime.jsx(textFieldWrapper.DSRTextFieldWrapper, { ...{ actionIcon, actionLoading, description, hideLabel, label, message, showCharacterCount, state, unit, unitPosition, children } })),
+                children: (jsxRuntime.jsx(textFieldWrapper.DSRTextFieldWrapper, { ...{ actionIcon, actionLoading, description, hideLabel, label, message, showCharacterCount, state, theme, unit, unitPosition, children } })),
             }
             : {
                 children,

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/text-list-item.wrapper.js

@@ -6,7 +6,7 @@ var hooks = require('../../hooks.js');
 var utils = require('../../utils.js');
 var textListItem = require('../dsr-components/text-list-item.js');
 
-const PTextListItem = /*#__PURE__*/ react.forwardRef((
+const PTextListItem = react.forwardRef((
 // @ts-ignore
 { className, children, listType = 'unordered', orderType = 'numbered', ...rest }, ref) => {
     const elementRef = react.useRef();

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/text-list.wrapper.js

@@ -6,7 +6,7 @@ var hooks = require('../../hooks.js');
 var utils = require('../../utils.js');
 var textList = require('../dsr-components/text-list.js');
 
-const PTextList = /*#__PURE__*/ react.forwardRef(({ listType = 'unordered', orderType = 'numbered', theme = 'light', className, children, ...rest }, ref) => {
+const PTextList = react.forwardRef(({ listType = 'unordered', orderType = 'numbered', theme = 'light', className, children, ...rest }, ref) => {
     const elementRef = react.useRef();
     const WebComponentTag = hooks.usePrefix('p-text-list');
     const propsToSync = [listType, orderType, theme];

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/text.wrapper.js

@@ -6,7 +6,7 @@ var hooks = require('../../hooks.js');
 var utils = require('../../utils.js');
 var text = require('../dsr-components/text.js');
 
-const PText = /*#__PURE__*/ react.forwardRef(({ align = 'left', color = 'default', ellipsis = false, size = 'small', tag = 'p', theme = 'light', weight = 'regular', className, children, ...rest }, ref) => {
+const PText = react.forwardRef(({ align = 'left', color = 'primary', ellipsis = false, size = 'small', tag = 'p', theme = 'light', weight = 'regular', className, children, ...rest }, ref) => {
     const elementRef = react.useRef();
     const WebComponentTag = hooks.usePrefix('p-text');
     const propsToSync = [align, color, ellipsis, size, tag, theme, weight];

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/textarea-wrapper.wrapper.js

@@ -6,13 +6,13 @@ var hooks = require('../../hooks.js');
 var utils = require('../../utils.js');
 var textareaWrapper = require('../dsr-components/textarea-wrapper.js');
 
-const PTextareaWrapper = /*#__PURE__*/ react.forwardRef(({ description = '', hideLabel = false, label = '', message = '', showCharacterCount = true, state = 'none', className, children, ...rest }, ref) => {
+const PTextareaWrapper = react.forwardRef(({ description = '', hideLabel = false, label = '', message = '', showCharacterCount = true, state = 'none', theme = 'light', className, children, ...rest }, ref) => {
     const elementRef = react.useRef();
     const WebComponentTag = hooks.usePrefix('p-textarea-wrapper');
-    const propsToSync = [description, hideLabel, label, message, showCharacterCount, state];
+    const propsToSync = [description, hideLabel, label, message, showCharacterCount, state, theme];
     hooks.useBrowserLayoutEffect(() => {
         const { current } = elementRef;
-        ['description', 'hideLabel', 'label', 'message', 'showCharacterCount', 'state'].forEach((propName, i) => (current[propName] = propsToSync[i]));
+        ['description', 'hideLabel', 'label', 'message', 'showCharacterCount', 'state', 'theme'].forEach((propName, i) => (current[propName] = propsToSync[i]));
     }, propsToSync);
     // @ts-ignore
     if (!process.browser) {
@@ -23,7 +23,7 @@ const PTextareaWrapper = /*#__PURE__*/ react.forwardRef(({ description = '', hid
         // @ts-ignore
         ...(!process.browser
             ? {
-                children: (jsxRuntime.jsx(textareaWrapper.DSRTextareaWrapper, { ...{ description, hideLabel, label, message, showCharacterCount, state, children } })),
+                children: (jsxRuntime.jsx(textareaWrapper.DSRTextareaWrapper, { ...{ description, hideLabel, label, message, showCharacterCount, state, theme, children } })),
             }
             : {
                 children,

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/components/toast.wrapper.js

@@ -6,7 +6,7 @@ var hooks = require('../../hooks.js');
 var utils = require('../../utils.js');
 var toast = require('../dsr-components/toast.js');
 
-const PToast = /*#__PURE__*/ react.forwardRef(({ theme = 'light', className, ...rest }, ref) => {
+const PToast = react.forwardRef(({ theme = 'light', className, ...rest }, ref) => {
     const elementRef = react.useRef();
     const WebComponentTag = hooks.usePrefix('p-toast');
     hooks.useBrowserLayoutEffect(() => {

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/accordion.js

@@ -1,13 +1,65 @@
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');
-var react = require('react');
-require('../../provider.js');
+require('../components/accordion.wrapper.js');
+require('../components/banner.wrapper.js');
+require('../components/button.wrapper.js');
+require('../components/button-group.wrapper.js');
+require('../components/button-pure.wrapper.js');
+require('../components/carousel.wrapper.js');
+require('../components/checkbox-wrapper.wrapper.js');
+require('../components/content-wrapper.wrapper.js');
+require('../components/display.wrapper.js');
+require('../components/divider.wrapper.js');
+require('../components/fieldset-wrapper.wrapper.js');
+require('../components/flex.wrapper.js');
+require('../components/flex-item.wrapper.js');
+require('../components/grid.wrapper.js');
+require('../components/grid-item.wrapper.js');
+require('../components/heading.wrapper.js');
+require('../components/headline.wrapper.js');
+var icon_wrapper = require('../components/icon.wrapper.js');
+require('../components/inline-notification.wrapper.js');
+require('../components/link.wrapper.js');
+require('../components/link-pure.wrapper.js');
+require('../components/link-social.wrapper.js');
+require('../components/link-tile.wrapper.js');
+require('../components/marque.wrapper.js');
+require('../components/modal.wrapper.js');
+require('../components/pagination.wrapper.js');
+require('../components/popover.wrapper.js');
+require('../components/radio-button-wrapper.wrapper.js');
+require('../components/scroller.wrapper.js');
+require('../components/segmented-control.wrapper.js');
+require('../components/segmented-control-item.wrapper.js');
+require('../components/select-wrapper.wrapper.js');
+require('../components/spinner.wrapper.js');
+require('../components/stepper-horizontal.wrapper.js');
+require('../components/stepper-horizontal-item.wrapper.js');
+require('../components/switch.wrapper.js');
+require('../components/table.wrapper.js');
+require('../components/table-body.wrapper.js');
+require('../components/table-cell.wrapper.js');
+require('../components/table-head.wrapper.js');
+require('../components/table-head-cell.wrapper.js');
+require('../components/table-head-row.wrapper.js');
+require('../components/table-row.wrapper.js');
+require('../components/tabs.wrapper.js');
+require('../components/tabs-bar.wrapper.js');
+require('../components/tabs-item.wrapper.js');
+require('../components/tag.wrapper.js');
+require('../components/tag-dismissible.wrapper.js');
+require('../components/text.wrapper.js');
+require('../components/text-field-wrapper.wrapper.js');
+require('../components/text-list.wrapper.js');
+require('../components/text-list-item.wrapper.js');
+require('../components/textarea-wrapper.wrapper.js');
+require('../components/toast.wrapper.js');
 var splitChildren = require('../../splitChildren.js');
+var react = require('react');
 var minifyCss = require('../../minifyCss.js');
 var stripFocusAndHoverStyles = require('../../stripFocusAndHoverStyles.js');
 var stylesEntry = require('../../../../../../components/dist/styles/esm/styles-entry.js');
-var icon_wrapper = require('../components/icon.wrapper.js');
 
 class DSRAccordion extends react.Component {
     render() {
@@ -15,8 +67,9 @@ class DSRAccordion extends react.Component {
         const buttonId = 'accordion-control';
         const contentId = 'accordion-panel';
         const Heading = this.props.tag;
+        // TODO: why .root div for a condition border-bottom style? could be applied on :host directly
         const style = minifyCss.minifyCss(stripFocusAndHoverStyles.stripFocusAndHoverStyles(stylesEntry.getAccordionCss(this.props.size, this.props.compact, this.props.open, this.props.theme)));
-        return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("template", { shadowroot: "open", children: [jsxRuntime.jsx("style", { dangerouslySetInnerHTML: { __html: style } }), jsxRuntime.jsxs("div", { className: "root", children: [jsxRuntime.jsx(Heading, { className: "heading", children: jsxRuntime.jsxs("button", { id: buttonId, type: "button", "aria-expanded": this.props.open ? 'true' : 'false', "aria-controls": contentId, children: [this.props.heading || jsxRuntime.jsx("slot", { name: "heading" }), jsxRuntime.jsx(icon_wrapper.PIcon, { className: "icon", color: "inherit", name: "arrow-head-down", theme: this.props.theme, size: "inherit", "aria-hidden": "true" })] }) }), jsxRuntime.jsx("div", { id: contentId, className: "collapsible", role: "region", "aria-labelledby": buttonId, children: jsxRuntime.jsx("div", { children: jsxRuntime.jsx("slot", {}) }) })] })] }), this.props.children] }));
+        return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("template", { shadowroot: "open", children: [jsxRuntime.jsx("style", { dangerouslySetInnerHTML: { __html: style } }), jsxRuntime.jsxs("div", { className: "root", children: [jsxRuntime.jsx(Heading, { className: "heading", children: jsxRuntime.jsxs("button", { id: buttonId, type: "button", "aria-expanded": this.props.open ? 'true' : 'false', "aria-controls": contentId, children: [this.props.heading || jsxRuntime.jsx("slot", { name: "heading" }), jsxRuntime.jsx(icon_wrapper.PIcon, { className: "icon", name: this.props.open ? 'minus' : 'plus', theme: this.props.theme, size: "inherit", "aria-hidden": "true" })] }) }), jsxRuntime.jsx("div", { id: contentId, className: "collapsible", role: "region", "aria-labelledby": buttonId, children: jsxRuntime.jsx("div", { children: jsxRuntime.jsx("slot", {}) }) })] })] }), this.props.children] }));
     }
 }
 

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/banner.js

@@ -1,20 +1,71 @@
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');
-var react = require('react');
-require('../../provider.js');
+require('../components/accordion.wrapper.js');
+require('../components/banner.wrapper.js');
+require('../components/button.wrapper.js');
+require('../components/button-group.wrapper.js');
+require('../components/button-pure.wrapper.js');
+require('../components/carousel.wrapper.js');
+require('../components/checkbox-wrapper.wrapper.js');
+require('../components/content-wrapper.wrapper.js');
+require('../components/display.wrapper.js');
+require('../components/divider.wrapper.js');
+require('../components/fieldset-wrapper.wrapper.js');
+require('../components/flex.wrapper.js');
+require('../components/flex-item.wrapper.js');
+require('../components/grid.wrapper.js');
+require('../components/grid-item.wrapper.js');
+require('../components/heading.wrapper.js');
+require('../components/headline.wrapper.js');
+require('../components/icon.wrapper.js');
+var inlineNotification_wrapper = require('../components/inline-notification.wrapper.js');
+require('../components/link.wrapper.js');
+require('../components/link-pure.wrapper.js');
+require('../components/link-social.wrapper.js');
+require('../components/link-tile.wrapper.js');
+require('../components/marque.wrapper.js');
+require('../components/modal.wrapper.js');
+require('../components/pagination.wrapper.js');
+require('../components/popover.wrapper.js');
+require('../components/radio-button-wrapper.wrapper.js');
+require('../components/scroller.wrapper.js');
+require('../components/segmented-control.wrapper.js');
+require('../components/segmented-control-item.wrapper.js');
+require('../components/select-wrapper.wrapper.js');
+require('../components/spinner.wrapper.js');
+require('../components/stepper-horizontal.wrapper.js');
+require('../components/stepper-horizontal-item.wrapper.js');
+require('../components/switch.wrapper.js');
+require('../components/table.wrapper.js');
+require('../components/table-body.wrapper.js');
+require('../components/table-cell.wrapper.js');
+require('../components/table-head.wrapper.js');
+require('../components/table-head-cell.wrapper.js');
+require('../components/table-head-row.wrapper.js');
+require('../components/table-row.wrapper.js');
+require('../components/tabs.wrapper.js');
+require('../components/tabs-bar.wrapper.js');
+require('../components/tabs-item.wrapper.js');
+require('../components/tag.wrapper.js');
+require('../components/tag-dismissible.wrapper.js');
+require('../components/text.wrapper.js');
+require('../components/text-field-wrapper.wrapper.js');
+require('../components/text-list.wrapper.js');
+require('../components/text-list-item.wrapper.js');
+require('../components/textarea-wrapper.wrapper.js');
+require('../components/toast.wrapper.js');
 var splitChildren = require('../../splitChildren.js');
+var react = require('react');
 var minifyCss = require('../../minifyCss.js');
 var stripFocusAndHoverStyles = require('../../stripFocusAndHoverStyles.js');
 var stylesEntry = require('../../../../../../components/dist/styles/esm/styles-entry.js');
-var contentWrapper_wrapper = require('../components/content-wrapper.wrapper.js');
-var inlineNotification_wrapper = require('../components/inline-notification.wrapper.js');
 
 class DSRBanner extends react.Component {
     render() {
         const { children, namedSlotChildren, otherChildren } = splitChildren.splitChildren(this.props.children);
-        const style = minifyCss.minifyCss(stripFocusAndHoverStyles.stripFocusAndHoverStyles(stylesEntry.getBannerCss()));
-        return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("template", { shadowroot: "open", children: [jsxRuntime.jsx("style", { dangerouslySetInnerHTML: { __html: style } }), jsxRuntime.jsx(contentWrapper_wrapper.PContentWrapper, { width: this.props.width, children: jsxRuntime.jsxs(inlineNotification_wrapper.PInlineNotification, { className: "root", state: this.props.state, persistent: this.props.persistent, theme: this.props.theme, children: [namedSlotChildren.filter(({ props: { slot } }) => slot === 'title').length > 0 && jsxRuntime.jsx("slot", { name: "title", slot: "heading" }), namedSlotChildren.filter(({ props: { slot } }) => slot === 'description').length > 0 && jsxRuntime.jsx("slot", { name: "description" })] }) })] }), this.props.children] }));
+        const style = minifyCss.minifyCss(stripFocusAndHoverStyles.stripFocusAndHoverStyles(stylesEntry.getBannerCss(this.props.width)));
+        return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("template", { shadowroot: "open", children: [jsxRuntime.jsx("style", { dangerouslySetInnerHTML: { __html: style } }), jsxRuntime.jsxs(inlineNotification_wrapper.PInlineNotification, { className: "root", state: this.props.state, persistent: this.props.persistent, theme: this.props.theme, children: [namedSlotChildren.filter(({ props: { slot } }) => slot === 'title').length > 0 && jsxRuntime.jsx("slot", { name: "title", slot: "heading" }), namedSlotChildren.filter(({ props: { slot } }) => slot === 'description').length > 0 && jsxRuntime.jsx("slot", { name: "description" })] })] }), this.props.children] }));
     }
 }
 

package/ssr/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/button-pure.js

@@ -1,15 +1,66 @@
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');
-var react = require('react');
-require('../../provider.js');
+require('../components/accordion.wrapper.js');
+require('../components/banner.wrapper.js');
+require('../components/button.wrapper.js');
+require('../components/button-group.wrapper.js');
+require('../components/button-pure.wrapper.js');
+require('../components/carousel.wrapper.js');
+require('../components/checkbox-wrapper.wrapper.js');
+require('../components/content-wrapper.wrapper.js');
+require('../components/display.wrapper.js');
+require('../components/divider.wrapper.js');
+require('../components/fieldset-wrapper.wrapper.js');
+require('../components/flex.wrapper.js');
+require('../components/flex-item.wrapper.js');
+require('../components/grid.wrapper.js');
+require('../components/grid-item.wrapper.js');
+require('../components/heading.wrapper.js');
+require('../components/headline.wrapper.js');
+var icon_wrapper = require('../components/icon.wrapper.js');
+require('../components/inline-notification.wrapper.js');
+require('../components/link.wrapper.js');
+require('../components/link-pure.wrapper.js');
+require('../components/link-social.wrapper.js');
+require('../components/link-tile.wrapper.js');
+require('../components/marque.wrapper.js');
+require('../components/modal.wrapper.js');
+require('../components/pagination.wrapper.js');
+require('../components/popover.wrapper.js');
+require('../components/radio-button-wrapper.wrapper.js');
+require('../components/scroller.wrapper.js');
+require('../components/segmented-control.wrapper.js');
+require('../components/segmented-control-item.wrapper.js');
+require('../components/select-wrapper.wrapper.js');
+var spinner_wrapper = require('../components/spinner.wrapper.js');
+require('../components/stepper-horizontal.wrapper.js');
+require('../components/stepper-horizontal-item.wrapper.js');
+require('../components/switch.wrapper.js');
+require('../components/table.wrapper.js');
+require('../components/table-body.wrapper.js');
+require('../components/table-cell.wrapper.js');
+require('../components/table-head.wrapper.js');
+require('../components/table-head-cell.wrapper.js');
+require('../components/table-head-row.wrapper.js');
+require('../components/table-row.wrapper.js');
+require('../components/tabs.wrapper.js');
+require('../components/tabs-bar.wrapper.js');
+require('../components/tabs-item.wrapper.js');
+require('../components/tag.wrapper.js');
+require('../components/tag-dismissible.wrapper.js');
+require('../components/text.wrapper.js');
+require('../components/text-field-wrapper.wrapper.js');
+require('../components/text-list.wrapper.js');
+require('../components/text-list-item.wrapper.js');
+require('../components/textarea-wrapper.wrapper.js');
+require('../components/toast.wrapper.js');
 var splitChildren = require('../../splitChildren.js');
+var react = require('react');
 var minifyCss = require('../../minifyCss.js');
 var stripFocusAndHoverStyles = require('../../stripFocusAndHoverStyles.js');
 var stylesEntry = require('../../../../../../components/dist/styles/esm/styles-entry.js');
 var utilsEntry = require('../../../../../../components/dist/utils/esm/utils-entry.js');
-var icon_wrapper = require('../components/icon.wrapper.js');
-var spinner_wrapper = require('../components/spinner.wrapper.js');
 
 class DSRButtonPure extends react.Component {
     get isDisabledOrLoading() {
@@ -17,17 +68,15 @@ class DSRButtonPure extends react.Component {
     }
     // this stops click events when button is disabled
     render() {
-        const { children, namedSlotChildren, otherChildren } = splitChildren.splitChildren(this.props.children);
-        const hasIcon = utilsEntry.hasVisibleIcon(this.props.icon);
-        const hasSubline = namedSlotChildren.filter(({ props: { slot } }) => slot === 'subline').length > 0;
+        splitChildren.splitChildren(this.props.children);
+        const hasIcon = utilsEntry.hasVisibleIcon(this.props.icon, this.props.iconSource);
         const iconProps = {
             className: 'icon',
             size: 'inherit',
             theme: this.props.theme,
         };
-        const style = minifyCss.minifyCss(stripFocusAndHoverStyles.stripFocusAndHoverStyles(stylesEntry.getButtonPureCss(this.props.icon, this.props.active, this.isDisabledOrLoading, this.props.stretch, this.props.size, this.props.weight, this.props.hideLabel, this.props.alignLabel, namedSlotChildren.filter(({ props: { slot } }) => slot === 'subline').length > 0, this.props.theme)));
-        return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("template", { shadowroot: "open", shadowrootdelegatesfocus: "true", children: [jsxRuntime.jsx("style", { dangerouslySetInnerHTML: { __html: style } }), jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("button", { ...utilsEntry.getButtonPureAriaAttributes(this.props.disabled, this.props.loading, hasSubline, this.props.aria), className: "root", type: this.props.type, tabIndex: this.props.tabbable ? parseInt(null, 10) || null : -1, children: [hasIcon &&
-                                            (this.props.loading ? (jsxRuntime.jsx(spinner_wrapper.PSpinner, { aria: { 'aria-label': 'Loading state' }, ...iconProps })) : (jsxRuntime.jsx(icon_wrapper.PIcon, { ...iconProps, color: "inherit", name: this.props.icon, source: this.props.iconSource, "aria-hidden": "true" }))), jsxRuntime.jsx("span", { className: "label", children: jsxRuntime.jsx("slot", {}) })] }), hasSubline && (jsxRuntime.jsx("div", { id: "subline", className: "subline", children: jsxRuntime.jsx("slot", { name: "subline" }) }))] })] }), this.props.children] }));
+        const style = minifyCss.minifyCss(stripFocusAndHoverStyles.stripFocusAndHoverStyles(stylesEntry.getButtonPureCss(this.props.icon, this.props.iconSource, this.props.active, this.props.loading, this.isDisabledOrLoading, this.props.stretch, this.props.size, this.props.hideLabel, this.props.alignLabel, this.props.theme)));
+        return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("template", { shadowroot: "open", shadowrootdelegatesfocus: "true", children: [jsxRuntime.jsx("style", { dangerouslySetInnerHTML: { __html: style } }), jsxRuntime.jsxs("button", { ...utilsEntry.getButtonPureAriaAttributes(this.props.disabled, this.props.loading, this.props.aria), className: "root", type: this.props.type, children: [this.props.loading ? (jsxRuntime.jsx(spinner_wrapper.PSpinner, { aria: { 'aria-label': 'Loading state' }, ...iconProps })) : (hasIcon && (jsxRuntime.jsx(icon_wrapper.PIcon, { ...iconProps, name: this.props.icon, source: this.props.iconSource, color: this.isDisabledOrLoading ? 'disabled' : 'primary', theme: this.props.theme, "aria-hidden": "true" }))), jsxRuntime.jsx("span", { className: "label", children: jsxRuntime.jsx("slot", {}) })] })] }), this.props.children] }));
     }
 }