@porsche-design-system/components-react 3.12.0 → 3.13.0-rc.1

package/ssr/cjs/components-react/projects/react-ssr-wrapper/src/lib/components/select.wrapper.cjs

@@ -0,0 +1,40 @@
+"use client";
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var react = require('react');
+var hooks = require('../../hooks.cjs');
+var utils = require('../../utils.cjs');
+var select = require('../dsr-components/select.cjs');
+
+const PSelect = react.forwardRef(({ description = '', disabled = false, dropdownDirection = 'auto', hideLabel = false, label = '', message = '', name, onUpdate, required = false, state = 'none', theme, value, className, children, ...rest }, ref) => {
+    const elementRef = react.useRef();
+    hooks.useEventCallback(elementRef, 'update', onUpdate);
+    const WebComponentTag = hooks.usePrefix('p-select');
+    const propsToSync = [description, disabled, dropdownDirection, hideLabel, label, message, name, required, state, theme || hooks.useTheme(), value];
+    hooks.useBrowserLayoutEffect(() => {
+        const { current } = elementRef;
+        ['description', 'disabled', 'dropdownDirection', 'hideLabel', 'label', 'message', 'name', 'required', 'state', 'theme', 'value'].forEach((propName, i) => (current[propName] = propsToSync[i]));
+    }, propsToSync);
+    // @ts-ignore
+    if (!process.browser) {
+        className = className ? `${className} ssr` : 'ssr';
+    }
+    const props = {
+        ...rest,
+        // @ts-ignore
+        ...(!process.browser
+            ? {
+                children: (jsxRuntime.jsx(select.DSRSelect, { description, disabled, dropdownDirection, hideLabel, label, message, name, required, state, theme: theme || hooks.useTheme(), value, children })),
+            }
+            : {
+                children,
+                suppressHydrationWarning: true,
+            }),
+        class: hooks.useMergedClass(elementRef, className),
+        ref: utils.syncRef(elementRef, ref)
+    };
+    return jsxRuntime.jsx(WebComponentTag, { ...props });
+});
+
+exports.PSelect = PSelect;

package/ssr/cjs/components-react/projects/react-ssr-wrapper/src/lib/components/spinner.wrapper.cjs

@@ -1,4 +1,4 @@
-'use client';
+"use client";
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/cjs/components-react/projects/react-ssr-wrapper/src/lib/components/stepper-horizontal-item.wrapper.cjs

@@ -1,4 +1,4 @@
-'use client';
+"use client";
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/cjs/components-react/projects/react-ssr-wrapper/src/lib/components/stepper-horizontal.wrapper.cjs

@@ -1,4 +1,4 @@
-'use client';
+"use client";
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

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

@@ -1,4 +1,4 @@
-'use client';
+"use client";
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

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

@@ -1,4 +1,4 @@
-'use client';
+"use client";
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

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

@@ -1,4 +1,4 @@
-'use client';
+"use client";
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

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

@@ -1,4 +1,4 @@
-'use client';
+"use client";
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

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

@@ -1,4 +1,4 @@
-'use client';
+"use client";
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

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

@@ -1,4 +1,4 @@
-'use client';
+"use client";
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

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

@@ -1,4 +1,4 @@
-'use client';
+"use client";
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

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

@@ -1,4 +1,4 @@
-'use client';
+"use client";
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

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

@@ -1,4 +1,4 @@
-'use client';
+"use client";
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

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

@@ -1,4 +1,4 @@
-'use client';
+"use client";
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

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

@@ -1,4 +1,4 @@
-'use client';
+"use client";
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

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

@@ -1,4 +1,4 @@
-'use client';
+"use client";
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

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

@@ -1,4 +1,4 @@
-'use client';
+"use client";
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

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

@@ -1,4 +1,4 @@
-'use client';
+"use client";
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

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

@@ -1,4 +1,4 @@
-'use client';
+"use client";
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

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

@@ -1,4 +1,4 @@
-'use client';
+"use client";
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

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

@@ -1,4 +1,4 @@
-'use client';
+"use client";
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

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

@@ -1,4 +1,4 @@
-'use client';
+"use client";
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

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

@@ -1,4 +1,4 @@
-'use client';
+"use client";
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

package/ssr/cjs/components-react/projects/react-ssr-wrapper/src/lib/components/wordmark.wrapper.cjs

@@ -1,4 +1,4 @@
-'use client';
+"use client";
 'use strict';
 
 var jsxRuntime = require('react/jsx-runtime');

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

@@ -44,6 +44,8 @@ require('../components/radio-button-wrapper.wrapper.cjs');
 require('../components/scroller.wrapper.cjs');
 require('../components/segmented-control.wrapper.cjs');
 require('../components/segmented-control-item.wrapper.cjs');
+require('../components/select.wrapper.cjs');
+require('../components/select-option.wrapper.cjs');
 require('../components/select-wrapper.wrapper.cjs');
 require('../components/spinner.wrapper.cjs');
 require('../components/stepper-horizontal.wrapper.cjs');

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

@@ -44,6 +44,8 @@ require('../components/radio-button-wrapper.wrapper.cjs');
 require('../components/scroller.wrapper.cjs');
 require('../components/segmented-control.wrapper.cjs');
 require('../components/segmented-control-item.wrapper.cjs');
+require('../components/select.wrapper.cjs');
+require('../components/select-option.wrapper.cjs');
 require('../components/select-wrapper.wrapper.cjs');
 require('../components/spinner.wrapper.cjs');
 require('../components/stepper-horizontal.wrapper.cjs');

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

@@ -44,6 +44,8 @@ require('../components/radio-button-wrapper.wrapper.cjs');
 require('../components/scroller.wrapper.cjs');
 require('../components/segmented-control.wrapper.cjs');
 require('../components/segmented-control-item.wrapper.cjs');
+require('../components/select.wrapper.cjs');
+require('../components/select-option.wrapper.cjs');
 require('../components/select-wrapper.wrapper.cjs');
 var spinner_wrapper = require('../components/spinner.wrapper.cjs');
 require('../components/stepper-horizontal.wrapper.cjs');
@@ -78,7 +80,6 @@ var loadingMessage = require('./loading-message.cjs');
 
 class DSRButtonPure extends react.Component {
     host;
-    initialLoading = false;
     get isDisabledOrLoading() {
         return utilsEntry.isDisabledOrLoading(this.props.disabled, this.props.loading);
     }
@@ -92,7 +93,7 @@ class DSRButtonPure extends react.Component {
             theme: this.props.theme,
         };
         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", shadowrootmode: "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, this.props.aria), className: "root", type: this.props.type, name: this.props.name, value: this.props.value, "aria-describedby": this.props.loading ? loadingMessage.loadingId : undefined, children: [this.props.loading ? (jsxRuntime.jsx(spinner_wrapper.PSpinner, { ...iconProps, "aria-hidden": "true" })) : (hasIcon && (jsxRuntime.jsx(icon_wrapper.PIcon, { ...iconProps, name: this.props.icon, source: this.props.iconSource, color: this.isDisabledOrLoading ? 'state-disabled' : 'primary', theme: this.props.theme, "aria-hidden": "true" }))), jsxRuntime.jsx("span", { className: "label", children: jsxRuntime.jsx("slot", {}) })] }), jsxRuntime.jsx(loadingMessage.LoadingMessage, { loading: this.props.loading, initialLoading: this.props.initialLoading })] })] }), this.props.children] }));
+        return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("template", { shadowroot: "open", shadowrootmode: "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, this.props.aria), className: "root", type: this.props.type, name: this.props.name, value: this.props.value, "aria-describedby": this.props.loading ? loadingMessage.loadingId : undefined, children: [this.props.loading ? (jsxRuntime.jsx(spinner_wrapper.PSpinner, { ...iconProps, "aria-hidden": "true" })) : (hasIcon && (jsxRuntime.jsx(icon_wrapper.PIcon, { ...iconProps, name: this.props.icon, source: this.props.iconSource, color: this.isDisabledOrLoading ? 'state-disabled' : 'primary', theme: this.props.theme, "aria-hidden": "true" }))), jsxRuntime.jsx("span", { className: "label", children: jsxRuntime.jsx("slot", {}) })] }), jsxRuntime.jsx(loadingMessage.LoadingMessage, { loading: this.props.loading, initialLoading: false })] })] }), this.props.children] }));
     }
 }
 

package/ssr/cjs/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/button-tile.cjs

@@ -45,6 +45,8 @@ require('../components/radio-button-wrapper.wrapper.cjs');
 require('../components/scroller.wrapper.cjs');
 require('../components/segmented-control.wrapper.cjs');
 require('../components/segmented-control-item.wrapper.cjs');
+require('../components/select.wrapper.cjs');
+require('../components/select-option.wrapper.cjs');
 require('../components/select-wrapper.wrapper.cjs');
 require('../components/spinner.wrapper.cjs');
 require('../components/stepper-horizontal.wrapper.cjs');

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

@@ -44,6 +44,8 @@ require('../components/radio-button-wrapper.wrapper.cjs');
 require('../components/scroller.wrapper.cjs');
 require('../components/segmented-control.wrapper.cjs');
 require('../components/segmented-control-item.wrapper.cjs');
+require('../components/select.wrapper.cjs');
+require('../components/select-option.wrapper.cjs');
 require('../components/select-wrapper.wrapper.cjs');
 var spinner_wrapper = require('../components/spinner.wrapper.cjs');
 require('../components/stepper-horizontal.wrapper.cjs');
@@ -78,11 +80,10 @@ var loadingMessage = require('./loading-message.cjs');
 
 class DSRButton extends react.Component {
     host;
-    initialLoading = false;
     render() {
         splitChildren.splitChildren(this.props.children);
         const style = minifyCss.minifyCss(stripFocusAndHoverStyles.stripFocusAndHoverStyles(stylesEntry.getButtonCss(this.props.icon, this.props.iconSource, this.props.variant, this.props.hideLabel, this.props.disabled, this.props.loading, this.props.theme)));
-        return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("template", { shadowroot: "open", shadowrootmode: "open", shadowrootdelegatesfocus: "true", children: [jsxRuntime.jsx("style", { dangerouslySetInnerHTML: { __html: style } }), jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("button", { ...utilsEntry.getButtonAriaAttributes(this.props.disabled, this.props.loading, this.props.aria), className: "root", type: this.props.type, name: this.props.name, value: this.props.value, "aria-describedby": this.props.loading ? loadingMessage.loadingId : undefined, children: [this.props.loading && (jsxRuntime.jsx(spinner_wrapper.PSpinner, { className: "spinner", size: "inherit", theme: this.props.theme, "aria-hidden": "true" })), utilsEntry.hasVisibleIcon(this.props.icon, this.props.iconSource) && (jsxRuntime.jsx(icon_wrapper.PIcon, { className: "icon", size: "inherit", name: this.props.iconSource ? undefined : this.props.icon, source: this.props.iconSource, color: this.props.disabled ? (this.props.variant === 'primary' ? 'contrast-high' : 'state-disabled') : 'primary', theme: this.props.theme, "aria-hidden": "true" })), jsxRuntime.jsx("span", { className: "label", children: jsxRuntime.jsx("slot", {}) })] }), jsxRuntime.jsx(loadingMessage.LoadingMessage, { loading: this.props.loading, initialLoading: this.props.initialLoading })] })] }), this.props.children] }));
+        return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("template", { shadowroot: "open", shadowrootmode: "open", shadowrootdelegatesfocus: "true", children: [jsxRuntime.jsx("style", { dangerouslySetInnerHTML: { __html: style } }), jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("button", { ...utilsEntry.getButtonAriaAttributes(this.props.disabled, this.props.loading, this.props.aria), className: "root", type: this.props.type, name: this.props.name, value: this.props.value, "aria-describedby": this.props.loading ? loadingMessage.loadingId : undefined, children: [this.props.loading && (jsxRuntime.jsx(spinner_wrapper.PSpinner, { className: "spinner", size: "inherit", theme: this.props.theme, "aria-hidden": "true" })), utilsEntry.hasVisibleIcon(this.props.icon, this.props.iconSource) && (jsxRuntime.jsx(icon_wrapper.PIcon, { className: "icon", size: "inherit", name: this.props.iconSource ? undefined : this.props.icon, source: this.props.iconSource, color: this.props.disabled ? (this.props.variant === 'primary' ? 'contrast-high' : 'state-disabled') : 'primary', theme: this.props.theme, "aria-hidden": "true" })), jsxRuntime.jsx("span", { className: "label", children: jsxRuntime.jsx("slot", {}) })] }), jsxRuntime.jsx(loadingMessage.LoadingMessage, { loading: this.props.loading, initialLoading: false })] })] }), this.props.children] }));
     }
 }
 

package/ssr/cjs/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/carousel.cjs

@@ -44,6 +44,8 @@ require('../components/radio-button-wrapper.wrapper.cjs');
 require('../components/scroller.wrapper.cjs');
 require('../components/segmented-control.wrapper.cjs');
 require('../components/segmented-control-item.wrapper.cjs');
+require('../components/select.wrapper.cjs');
+require('../components/select-option.wrapper.cjs');
 require('../components/select-wrapper.wrapper.cjs');
 require('../components/spinner.wrapper.cjs');
 require('../components/stepper-horizontal.wrapper.cjs');
@@ -110,7 +112,7 @@ class DSRCarousel extends react.Component {
                 ? Object.fromEntries(Object.entries(this.props.disablePagination).map(([key, value]) => [key, !value]))
                 : !this.props.disablePagination
             : this.props.pagination, utilsEntry.isInfinitePagination(this.props.amountOfPages), (alignHeaderDeprecationMap[this.props.alignHeader] || this.props.alignHeader), this.props.theme)));
-        return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("template", { shadowroot: "open", shadowrootmode: "open", children: [jsxRuntime.jsx("style", { dangerouslySetInnerHTML: { __html: style } }), jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("div", { className: "header", children: [hasHeadingPropOrSlot && (this.props.heading ? jsxRuntime.jsx("h2", { id: headingId, children: this.props.heading }) : jsxRuntime.jsx("slot", { name: "heading" })), hasDescriptionPropOrSlot && (this.props.description ? jsxRuntime.jsx("p", { children: this.props.description }) : jsxRuntime.jsx("slot", { name: "description" })), hasControlsSlot && jsxRuntime.jsx("slot", { name: "controls" }), jsxRuntime.jsxs("div", { className: "nav", children: [this.props.skipLinkTarget && (jsxRuntime.jsx(linkPure_wrapper.PLinkPure, { href: this.props.skipLinkTarget, theme: this.props.theme, icon: "arrow-last", className: "btn skip-link", alignLabel: "start", hideLabel: true, "aria-describedby": this.props.heading ? headingId : null, children: "Skip carousel entries" })), (this.props.slidesPerPage === 'auto' || typeof this.props.slidesPerPage === 'object' || this.props.slidesPerPage < otherChildren.length) && (jsxRuntime.jsx(buttonPure_wrapper.PButtonPure, { ...btnProps, icon: "arrow-left" })), (this.props.slidesPerPage === 'auto' || typeof this.props.slidesPerPage === 'object' || this.props.slidesPerPage < otherChildren.length) && (jsxRuntime.jsx(buttonPure_wrapper.PButtonPure, { ...btnProps, icon: "arrow-right" }))] })] }), jsxRuntime.jsx("div", { id: "splide", className: "splide", ...utilsEntry.parseAndGetAriaAttributes({
+        return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("template", { shadowroot: "open", shadowrootmode: "open", children: [jsxRuntime.jsx("style", { dangerouslySetInnerHTML: { __html: style } }), jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("div", { className: "header", children: [hasHeadingPropOrSlot && (this.props.heading ? jsxRuntime.jsx("h2", { id: headingId, children: this.props.heading }) : jsxRuntime.jsx("slot", { name: "heading" })), hasDescriptionPropOrSlot && (this.props.description ? jsxRuntime.jsx("p", { children: this.props.description }) : jsxRuntime.jsx("slot", { name: "description" })), hasControlsSlot && jsxRuntime.jsx("slot", { name: "controls" }), jsxRuntime.jsxs("div", { className: "nav", children: [this.props.skipLinkTarget && (jsxRuntime.jsx(linkPure_wrapper.PLinkPure, { href: this.props.skipLinkTarget, theme: this.props.theme, icon: "arrow-last", className: "btn skip-link", alignLabel: "start", hideLabel: true, children: "Skip carousel entries" })), (this.props.slidesPerPage === 'auto' || typeof this.props.slidesPerPage === 'object' || this.props.slidesPerPage < otherChildren.length) && (jsxRuntime.jsx(buttonPure_wrapper.PButtonPure, { ...btnProps, icon: "arrow-left" })), (this.props.slidesPerPage === 'auto' || typeof this.props.slidesPerPage === 'object' || this.props.slidesPerPage < otherChildren.length) && (jsxRuntime.jsx(buttonPure_wrapper.PButtonPure, { ...btnProps, icon: "arrow-right" }))] })] }), jsxRuntime.jsx("div", { id: "splide", className: "splide", ...utilsEntry.parseAndGetAriaAttributes({
                                         'aria-label': this.props.heading,
                                         ...utilsEntry.parseAndGetAriaAttributes(this.props.aria),
                                     }), children: jsxRuntime.jsx("div", { className: "splide__track", children: jsxRuntime.jsx("div", { className: "splide__list", children: otherChildren.map((_, i) => (jsxRuntime.jsx("div", { className: "splide__slide", children: jsxRuntime.jsx("slot", { name: `slide-${i}` }) }, i))) }) }) }), (this.props.disablePagination ? this.props.disablePagination !== true : this.props.pagination) && (this.props.slidesPerPage === 'auto' || typeof this.props.slidesPerPage === 'object' || this.props.slidesPerPage < otherChildren.length) && (jsxRuntime.jsx("div", { className: "pagination-container", "aria-hidden": "true", children: jsxRuntime.jsx("div", { className: "pagination" }) }))] })] }), this.props.children] }));

package/ssr/cjs/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/checkbox-wrapper.cjs

@@ -44,6 +44,8 @@ require('../components/radio-button-wrapper.wrapper.cjs');
 require('../components/scroller.wrapper.cjs');
 require('../components/segmented-control.wrapper.cjs');
 require('../components/segmented-control-item.wrapper.cjs');
+require('../components/select.wrapper.cjs');
+require('../components/select-option.wrapper.cjs');
 require('../components/select-wrapper.wrapper.cjs');
 var spinner_wrapper = require('../components/spinner.wrapper.cjs');
 require('../components/stepper-horizontal.wrapper.cjs');
@@ -80,12 +82,11 @@ var loadingMessage = require('./loading-message.cjs');
 class DSRCheckboxWrapper extends react.Component {
     host;
     input;
-    initialLoading = false;
     render() {
         const { children, namedSlotChildren, otherChildren } = splitChildren.splitChildren(this.props.children);
         const { disabled } = typeof otherChildren[0] === 'object' && 'props' in otherChildren[0] && otherChildren[0]?.props || {};
         const style = minifyCss.minifyCss(stripFocusAndHoverStyles.stripFocusAndHoverStyles(stylesEntry.getCheckboxWrapperCss(this.props.hideLabel, this.props.state, disabled, this.props.loading, this.props.theme)));
-        return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("template", { shadowroot: "open", shadowrootmode: "open", children: [jsxRuntime.jsx("style", { dangerouslySetInnerHTML: { __html: style } }), jsxRuntime.jsxs("div", { className: "root", children: [jsxRuntime.jsx(label.Label, { hasLabel: this.props.label || namedSlotChildren.filter(({ props: { slot } }) => slot === 'label').length > 0, hasDescription: this.props.description || namedSlotChildren.filter(({ props: { slot } }) => slot === 'description').length > 0, host: null, label: this.props.label, isLoading: this.props.loading, isDisabled: disabled, formElement: typeof otherChildren[0] === 'object' && 'props' in otherChildren[0] && otherChildren[0]?.props }), jsxRuntime.jsxs("div", { className: "wrapper", children: [jsxRuntime.jsx("slot", {}), this.props.loading && (jsxRuntime.jsx(spinner_wrapper.PSpinner, { className: "spinner", size: "inherit", theme: this.props.theme, "aria-hidden": "true" }))] }), jsxRuntime.jsx(stateMessage.StateMessage, { hasMessage: (this.props.message || namedSlotChildren.filter(({ props: { slot } }) => slot === 'message').length > 0) && ['success', 'error'].includes(this.props.state), state: this.props.state, message: this.props.message, theme: this.props.theme, host: null }), jsxRuntime.jsx(loadingMessage.LoadingMessage, { loading: this.props.loading, initialLoading: this.props.initialLoading })] })] }), this.props.children] }));
+        return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("template", { shadowroot: "open", shadowrootmode: "open", children: [jsxRuntime.jsx("style", { dangerouslySetInnerHTML: { __html: style } }), jsxRuntime.jsxs("div", { className: "root", children: [jsxRuntime.jsx(label.Label, { hasLabel: this.props.label || namedSlotChildren.filter(({ props: { slot } }) => slot === 'label').length > 0, hasDescription: this.props.description || namedSlotChildren.filter(({ props: { slot } }) => slot === 'description').length > 0, host: null, label: this.props.label, isLoading: this.props.loading, isDisabled: disabled, formElement: typeof otherChildren[0] === 'object' && 'props' in otherChildren[0] && otherChildren[0]?.props }), jsxRuntime.jsxs("div", { className: "wrapper", children: [jsxRuntime.jsx("slot", {}), this.props.loading && (jsxRuntime.jsx(spinner_wrapper.PSpinner, { className: "spinner", size: "inherit", theme: this.props.theme, "aria-hidden": "true" }))] }), jsxRuntime.jsx(stateMessage.StateMessage, { hasMessage: (this.props.message || namedSlotChildren.filter(({ props: { slot } }) => slot === 'message').length > 0) && ['success', 'error'].includes(this.props.state), state: this.props.state, message: this.props.message, theme: this.props.theme, host: null }), jsxRuntime.jsx(loadingMessage.LoadingMessage, { loading: this.props.loading, initialLoading: false })] })] }), this.props.children] }));
     }
 }
 

package/ssr/cjs/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/flyout-navigation-item.cjs

@@ -44,6 +44,8 @@ require('../components/radio-button-wrapper.wrapper.cjs');
 require('../components/scroller.wrapper.cjs');
 require('../components/segmented-control.wrapper.cjs');
 require('../components/segmented-control-item.wrapper.cjs');
+require('../components/select.wrapper.cjs');
+require('../components/select-option.wrapper.cjs');
 require('../components/select-wrapper.wrapper.cjs');
 require('../components/spinner.wrapper.cjs');
 require('../components/stepper-horizontal.wrapper.cjs');
@@ -87,6 +89,7 @@ class DSRFlyoutNavigationItem extends react.Component {
         splitChildren.splitChildren(this.props.children);
         const style = minifyCss.minifyCss(stripFocusAndHoverStyles.stripFocusAndHoverStyles(stylesEntry.getFlyoutNavigationItemCss(this.open, this.theme)));
         return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("template", { shadowroot: "open", shadowrootmode: "open", children: [jsxRuntime.jsx("style", { dangerouslySetInnerHTML: { __html: style } }), jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(buttonPure_wrapper.PButtonPure, { className: "button", type: "button", size: "medium", alignLabel: "start", stretch: true, icon: "arrow-head-right", active: this.open, aria: { 'aria-expanded': this.open }, theme: this.theme, children: this.props.label }), jsxRuntime.jsxs("div", { className: "scroller", 
+                                    // ignore needed for pipeline
                                     // eslint-disable-next-line @typescript-eslint/ban-ts-comment
                                     /* @ts-ignore */
                                     inert: this.open ? null : '', children: [jsxRuntime.jsxs("div", { className: "header", children: [jsxRuntime.jsx(buttonPure_wrapper.PButtonPure, { className: "back", type: "button", size: "medium", icon: "arrow-head-left", hideLabel: true, theme: this.theme, children: "Back" }), jsxRuntime.jsx("h2", { className: "heading", children: this.props.label })] }), jsxRuntime.jsx("div", { className: "content", children: jsxRuntime.jsx("slot", {}) })] })] })] }), this.props.children] }));

package/ssr/cjs/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/flyout-navigation.cjs

@@ -44,6 +44,8 @@ require('../components/radio-button-wrapper.wrapper.cjs');
 require('../components/scroller.wrapper.cjs');
 require('../components/segmented-control.wrapper.cjs');
 require('../components/segmented-control-item.wrapper.cjs');
+require('../components/select.wrapper.cjs');
+require('../components/select-option.wrapper.cjs');
 require('../components/select-wrapper.wrapper.cjs');
 require('../components/spinner.wrapper.cjs');
 require('../components/stepper-horizontal.wrapper.cjs');
@@ -85,6 +87,7 @@ class DSRFlyoutNavigation extends react.Component {
         splitChildren.splitChildren(this.props.children);
         const style = minifyCss.minifyCss(stripFocusAndHoverStyles.stripFocusAndHoverStyles(stylesEntry.getFlyoutNavigationCss(this.props.open, !!this.props.activeIdentifier, this.props.theme)));
         return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("template", { shadowroot: "open", shadowrootmode: "open", children: [jsxRuntime.jsx("style", { dangerouslySetInnerHTML: { __html: style } }), jsxRuntime.jsxs("dialog", { 
+                            // ignore needed for pipeline
                             // eslint-disable-next-line @typescript-eslint/ban-ts-comment
                             /* @ts-ignore */
                             inert: this.props.open ? null : '', tabIndex: -1, children: [jsxRuntime.jsx("div", { className: "header", children: jsxRuntime.jsx(buttonPure_wrapper.PButtonPure, { className: "dismiss", type: "button", size: "medium", icon: "close", hideLabel: true, theme: this.props.theme, children: "Dismiss flyout" }) }), jsxRuntime.jsx("div", { className: "scroller", children: jsxRuntime.jsx("nav", { className: "content", ...utilsEntry.parseAndGetAriaAttributes(this.props.aria), children: jsxRuntime.jsx("slot", {}) }) })] })] }), this.props.children] }));

package/ssr/cjs/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/flyout.cjs

@@ -44,6 +44,8 @@ require('../components/radio-button-wrapper.wrapper.cjs');
 require('../components/scroller.wrapper.cjs');
 require('../components/segmented-control.wrapper.cjs');
 require('../components/segmented-control-item.wrapper.cjs');
+require('../components/select.wrapper.cjs');
+require('../components/select-option.wrapper.cjs');
 require('../components/select-wrapper.wrapper.cjs');
 require('../components/spinner.wrapper.cjs');
 require('../components/stepper-horizontal.wrapper.cjs');
@@ -77,8 +79,8 @@ var utilsEntry = require('../../../../../../components/dist/utils/esm/utils-entr
 
 class DSRFlyout extends react.Component {
     host;
-    focusedElBeforeOpen;
     dialog;
+    wrapper;
     dismissBtn;
     header;
     footer;
@@ -96,14 +98,11 @@ class DSRFlyout extends react.Component {
         const hasFooter = namedSlotChildren.filter(({ props: { slot } }) => slot === 'footer').length > 0;
         const hasSubFooter = namedSlotChildren.filter(({ props: { slot } }) => slot === 'sub-footer').length > 0;
         const style = minifyCss.minifyCss(stripFocusAndHoverStyles.stripFocusAndHoverStyles(stylesEntry.getFlyoutCss(this.props.open, (positionDeprecationMap[this.props.position] || this.props.position), hasFooter, hasSubFooter, this.props.theme)));
-        return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("template", { shadowroot: "open", shadowrootmode: "open", children: [jsxRuntime.jsx("style", { dangerouslySetInnerHTML: { __html: style } }), jsxRuntime.jsx(jsxRuntime.Fragment, { children: jsxRuntime.jsxs("div", { className: "root", role: "dialog", ...utilsEntry.parseAndGetAriaAttributes({
-                                    'aria-modal': true,
-                                    'aria-hidden': !this.props.open,
-                                    ...utilsEntry.parseAndGetAriaAttributes(this.props.aria),
-                                }), tabIndex: -1, 
-                                // eslint-disable-next-line @typescript-eslint/ban-ts-comment
-                                /* @ts-ignore */
-                                inert: this.props.open ? null : '', ...(hasSubFooter && { onScroll: this.props.onScroll }), children: [jsxRuntime.jsxs("div", { className: "header", children: [jsxRuntime.jsx(buttonPure_wrapper.PButtonPure, { className: "dismiss", type: "button", hideLabel: true, icon: "close", theme: this.props.theme, children: "Dismiss flyout" }), hasHeader && jsxRuntime.jsx("slot", { name: "header" })] }), jsxRuntime.jsx("div", { className: "content", children: jsxRuntime.jsx("slot", {}) }), hasFooter && (jsxRuntime.jsx("div", { className: "footer", children: jsxRuntime.jsx("slot", { name: "footer" }) })), hasSubFooter && (jsxRuntime.jsx("div", { className: "sub-footer", children: jsxRuntime.jsx("slot", { name: "sub-footer" }) }))] }) })] }), this.props.children] }));
+        return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("template", { shadowroot: "open", shadowrootmode: "open", children: [jsxRuntime.jsx("style", { dangerouslySetInnerHTML: { __html: style } }), jsxRuntime.jsx("dialog", { 
+                            // ignore needed for pipeline
+                            // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+                            /* @ts-ignore */
+                            inert: this.props.open ? null : '', tabIndex: -1, ...utilsEntry.parseAndGetAriaAttributes(this.props.aria), children: jsxRuntime.jsxs("div", { className: "wrapper", ...(hasSubFooter && { onScroll: this.props.updateShadow }), children: [jsxRuntime.jsxs("div", { className: "header", children: [jsxRuntime.jsx(buttonPure_wrapper.PButtonPure, { className: "dismiss", type: "button", hideLabel: true, icon: "close", theme: this.props.theme, children: "Dismiss flyout" }), hasHeader && jsxRuntime.jsx("slot", { name: "header" })] }, "header"), jsxRuntime.jsx("div", { className: "content", children: jsxRuntime.jsx("slot", {}) }), hasFooter && (jsxRuntime.jsx("div", { className: "footer", children: jsxRuntime.jsx("slot", { name: "footer" }) }, "footer")), hasSubFooter && (jsxRuntime.jsx("div", { className: "sub-footer", children: jsxRuntime.jsx("slot", { name: "sub-footer" }) }, "sub-footer"))] }) })] }), this.props.children] }));
     }
 }
 

package/ssr/cjs/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/inline-notification.cjs

@@ -44,6 +44,8 @@ require('../components/radio-button-wrapper.wrapper.cjs');
 require('../components/scroller.wrapper.cjs');
 require('../components/segmented-control.wrapper.cjs');
 require('../components/segmented-control-item.wrapper.cjs');
+require('../components/select.wrapper.cjs');
+require('../components/select-option.wrapper.cjs');
 require('../components/select-wrapper.wrapper.cjs');
 require('../components/spinner.wrapper.cjs');
 require('../components/stepper-horizontal.wrapper.cjs');

package/ssr/cjs/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/link-pure.cjs

@@ -44,6 +44,8 @@ require('../components/radio-button-wrapper.wrapper.cjs');
 require('../components/scroller.wrapper.cjs');
 require('../components/segmented-control.wrapper.cjs');
 require('../components/segmented-control-item.wrapper.cjs');
+require('../components/select.wrapper.cjs');
+require('../components/select-option.wrapper.cjs');
 require('../components/select-wrapper.wrapper.cjs');
 require('../components/spinner.wrapper.cjs');
 require('../components/stepper-horizontal.wrapper.cjs');

package/ssr/cjs/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/link-social.cjs

@@ -44,6 +44,8 @@ require('../components/radio-button-wrapper.wrapper.cjs');
 require('../components/scroller.wrapper.cjs');
 require('../components/segmented-control.wrapper.cjs');
 require('../components/segmented-control-item.wrapper.cjs');
+require('../components/select.wrapper.cjs');
+require('../components/select-option.wrapper.cjs');
 require('../components/select-wrapper.wrapper.cjs');
 require('../components/spinner.wrapper.cjs');
 require('../components/stepper-horizontal.wrapper.cjs');

package/ssr/cjs/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/link-tile-model-signature.cjs

@@ -44,6 +44,8 @@ require('../components/radio-button-wrapper.wrapper.cjs');
 require('../components/scroller.wrapper.cjs');
 require('../components/segmented-control.wrapper.cjs');
 require('../components/segmented-control-item.wrapper.cjs');
+require('../components/select.wrapper.cjs');
+require('../components/select-option.wrapper.cjs');
 require('../components/select-wrapper.wrapper.cjs');
 require('../components/spinner.wrapper.cjs');
 require('../components/stepper-horizontal.wrapper.cjs');

package/ssr/cjs/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/link-tile-product.cjs

@@ -44,6 +44,8 @@ require('../components/radio-button-wrapper.wrapper.cjs');
 require('../components/scroller.wrapper.cjs');
 require('../components/segmented-control.wrapper.cjs');
 require('../components/segmented-control-item.wrapper.cjs');
+require('../components/select.wrapper.cjs');
+require('../components/select-option.wrapper.cjs');
 require('../components/select-wrapper.wrapper.cjs');
 require('../components/spinner.wrapper.cjs');
 require('../components/stepper-horizontal.wrapper.cjs');
@@ -84,8 +86,8 @@ class DSRLinkTileProduct extends react.Component {
         const headingId = 'heading';
         const priceId = 'price';
         const descriptionId = 'description';
-        const style = minifyCss.minifyCss(stripFocusAndHoverStyles.stripFocusAndHoverStyles(stylesEntry.getLinkTileProductCss(this.props.likeButton, !this.props.href, this.props.aspectRatio, this.props.theme)));
-        return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("template", { shadowroot: "open", shadowrootmode: "open", shadowrootdelegatesfocus: "true", children: [jsxRuntime.jsx("style", { dangerouslySetInnerHTML: { __html: style } }), jsxRuntime.jsxs("div", { className: "root", children: [this.props.href ? (jsxRuntime.jsx("a", { className: "anchor", href: this.props.href, target: this.props.target, rel: this.props.rel, "aria-labelledby": `${headingId} ${priceId}`, "aria-describedby": `${headerId} ${descriptionId}` })) : (jsxRuntime.jsx("slot", { name: utilsEntry.anchorSlot })), jsxRuntime.jsxs("div", { id: headerId, className: "header", children: [jsxRuntime.jsx("slot", { name: utilsEntry.headerSlot }), this.props.likeButton && (jsxRuntime.jsx(buttonPure_wrapper.PButtonPure, { className: "button", type: "button", icon: this.props.liked ? 'heart-filled' : 'heart', hideLabel: true, theme: this.props.theme, children: this.props.liked ? 'Remove from wishlist' : 'Add to wishlist' }))] }), jsxRuntime.jsx("div", { className: "image", children: jsxRuntime.jsx("slot", {}) }), jsxRuntime.jsxs("div", { className: "wrapper", children: [jsxRuntime.jsx("h3", { id: headingId, className: "heading", children: this.props.heading }), jsxRuntime.jsx("p", { id: priceId, className: "price", children: this.props.price }), jsxRuntime.jsx("p", { id: descriptionId, className: "description", children: this.props.description })] })] })] }), this.props.children] }));
+        const style = minifyCss.minifyCss(stripFocusAndHoverStyles.stripFocusAndHoverStyles(stylesEntry.getLinkTileProductCss(this.props.likeButton, !this.props.href, !!this.props.priceOriginal, !!this.props.description, this.props.aspectRatio, this.props.theme)));
+        return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("template", { shadowroot: "open", shadowrootmode: "open", shadowrootdelegatesfocus: "true", children: [jsxRuntime.jsx("style", { dangerouslySetInnerHTML: { __html: style } }), jsxRuntime.jsxs("div", { className: "root", children: [this.props.href ? (jsxRuntime.jsx("a", { className: "anchor", href: this.props.href, target: this.props.target, rel: this.props.rel, "aria-labelledby": `${headingId} ${priceId}`, "aria-describedby": `${headerId} ${descriptionId}` })) : (jsxRuntime.jsx("slot", { name: utilsEntry.anchorSlot })), jsxRuntime.jsxs("div", { id: headerId, className: "header", children: [jsxRuntime.jsx("slot", { name: utilsEntry.headerSlot }), this.props.likeButton && (jsxRuntime.jsx(buttonPure_wrapper.PButtonPure, { className: "button", type: "button", icon: this.props.liked ? 'heart-filled' : 'heart', hideLabel: true, theme: this.props.theme, children: this.props.liked ? 'Remove from wishlist' : 'Add to wishlist' }))] }), jsxRuntime.jsx("div", { className: "image", children: jsxRuntime.jsx("slot", {}) }), jsxRuntime.jsxs("div", { className: "wrapper", children: [this.props.heading && (jsxRuntime.jsx("h3", { id: headingId, className: "heading", children: this.props.heading })), this.props.price && (jsxRuntime.jsx("p", { id: priceId, className: "price", children: this.props.priceOriginal ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("span", { className: "sr-only", children: "sale price" }), this.props.price, jsxRuntime.jsx("span", { className: "sr-only", children: "original price" }), jsxRuntime.jsx("s", { children: this.props.priceOriginal })] })) : (this.props.price) })), this.props.description && (jsxRuntime.jsx("p", { id: descriptionId, className: "description", children: this.props.description }))] })] })] }), this.props.children] }));
     }
 }
 

package/ssr/cjs/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/link-tile.cjs

@@ -45,6 +45,8 @@ require('../components/radio-button-wrapper.wrapper.cjs');
 require('../components/scroller.wrapper.cjs');
 require('../components/segmented-control.wrapper.cjs');
 require('../components/segmented-control-item.wrapper.cjs');
+require('../components/select.wrapper.cjs');
+require('../components/select-option.wrapper.cjs');
 require('../components/select-wrapper.wrapper.cjs');
 require('../components/spinner.wrapper.cjs');
 require('../components/stepper-horizontal.wrapper.cjs');

package/ssr/cjs/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/link.cjs

@@ -44,6 +44,8 @@ require('../components/radio-button-wrapper.wrapper.cjs');
 require('../components/scroller.wrapper.cjs');
 require('../components/segmented-control.wrapper.cjs');
 require('../components/segmented-control-item.wrapper.cjs');
+require('../components/select.wrapper.cjs');
+require('../components/select-option.wrapper.cjs');
 require('../components/select-wrapper.wrapper.cjs');
 require('../components/spinner.wrapper.cjs');
 require('../components/stepper-horizontal.wrapper.cjs');

package/ssr/cjs/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/modal.cjs

@@ -44,6 +44,8 @@ require('../components/radio-button-wrapper.wrapper.cjs');
 require('../components/scroller.wrapper.cjs');
 require('../components/segmented-control.wrapper.cjs');
 require('../components/segmented-control-item.wrapper.cjs');
+require('../components/select.wrapper.cjs');
+require('../components/select-option.wrapper.cjs');
 require('../components/select-wrapper.wrapper.cjs');
 require('../components/spinner.wrapper.cjs');
 require('../components/stepper-horizontal.wrapper.cjs');
@@ -93,13 +95,14 @@ class DSRModal extends react.Component {
         const hasFooter = namedSlotChildren.filter(({ props: { slot } }) => slot === 'footer').length > 0;
         const hasDismissButton = this.props.disableCloseButton ? false : this.props.dismissButton;
         if (this.props.open) ;
-        const style = minifyCss.minifyCss(stripFocusAndHoverStyles.stripFocusAndHoverStyles(stylesEntry.getModalCss(this.props.open, this.props.fullscreen, hasDismissButton, hasHeader, hasFooter, this.props.theme)));
+        const style = minifyCss.minifyCss(stripFocusAndHoverStyles.stripFocusAndHoverStyles(stylesEntry.getModalCss(this.props.open, this.props.backdrop, this.props.fullscreen, hasDismissButton, hasHeader, hasFooter, this.props.theme)));
         return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("template", { shadowroot: "open", shadowrootmode: "open", children: [jsxRuntime.jsx("style", { dangerouslySetInnerHTML: { __html: style } }), jsxRuntime.jsx(jsxRuntime.Fragment, { children: jsxRuntime.jsx("div", { className: "scroll-container", children: jsxRuntime.jsxs("div", { className: "root", role: "dialog", ...utilsEntry.parseAndGetAriaAttributes({
                                         'aria-modal': true,
                                         'aria-label': this.props.heading,
                                         'aria-hidden': !this.props.open,
                                         ...utilsEntry.parseAndGetAriaAttributes(this.props.aria),
                                     }), tabIndex: -1, 
+                                    // ignore needed for pipeline
                                     // eslint-disable-next-line @typescript-eslint/ban-ts-comment
                                     /* @ts-ignore */
                                     inert: this.props.open ? null : '', children: [hasDismissButton && (jsxRuntime.jsx("div", { className: "controls", children: jsxRuntime.jsx(buttonPure_wrapper.PButtonPure, { className: "dismiss", type: "button", hideLabel: true, icon: "close", theme: this.props.theme, children: "Dismiss modal" }) })), hasHeader && (jsxRuntime.jsx("div", { className: "header", children: this.props.heading ? jsxRuntime.jsx("h2", { children: this.props.heading }) : jsxRuntime.jsx("slot", { name: "heading" }) })), jsxRuntime.jsx("div", { className: "content", children: jsxRuntime.jsx("slot", {}) }), hasFooter && (jsxRuntime.jsx("div", { className: "footer", children: jsxRuntime.jsx("slot", { name: "footer" }) }))] }) }) })] }), this.props.children] }));

package/ssr/cjs/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/multi-select-option.cjs

@@ -44,6 +44,8 @@ require('../components/radio-button-wrapper.wrapper.cjs');
 require('../components/scroller.wrapper.cjs');
 require('../components/segmented-control.wrapper.cjs');
 require('../components/segmented-control-item.wrapper.cjs');
+require('../components/select.wrapper.cjs');
+require('../components/select-option.wrapper.cjs');
 require('../components/select-wrapper.wrapper.cjs');
 require('../components/spinner.wrapper.cjs');
 require('../components/stepper-horizontal.wrapper.cjs');

package/ssr/cjs/components-react/projects/react-ssr-wrapper/src/lib/dsr-components/multi-select.cjs

@@ -44,6 +44,8 @@ require('../components/radio-button-wrapper.wrapper.cjs');
 require('../components/scroller.wrapper.cjs');
 require('../components/segmented-control.wrapper.cjs');
 require('../components/segmented-control-item.wrapper.cjs');
+require('../components/select.wrapper.cjs');
+require('../components/select-option.wrapper.cjs');
 require('../components/select-wrapper.wrapper.cjs');
 require('../components/spinner.wrapper.cjs');
 require('../components/stepper-horizontal.wrapper.cjs');
@@ -99,7 +101,7 @@ class DSRMultiSelect extends react.Component {
         const dropdownId = 'list';
         const inputId = 'filter';
         const style = minifyCss.minifyCss(stripFocusAndHoverStyles.stripFocusAndHoverStyles(stylesEntry.getMultiSelectCss('down', this.props.isOpen, this.props.disabled, this.props.hideLabel, this.props.state, this.props.isWithinForm, this.props.theme)));
-        return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("template", { shadowroot: "open", shadowrootmode: "open", children: [jsxRuntime.jsx("style", { dangerouslySetInnerHTML: { __html: style } }), jsxRuntime.jsxs("div", { className: "root", children: [jsxRuntime.jsx(label.Label, { hasLabel: this.props.label || namedSlotChildren.filter(({ props: { slot } }) => slot === 'label').length > 0, hasDescription: this.props.description || namedSlotChildren.filter(({ props: { slot } }) => slot === 'description').length > 0, host: null, label: this.props.label, description: this.props.description, htmlFor: inputId, isRequired: this.props.required, isDisabled: this.props.disabled }), this.props.currentValue && (jsxRuntime.jsxs("span", { id: optionsSelectedId, className: "sr-only", children: [utilsEntry.getSelectedOptions(this.props.multiSelectOptions).length, " options selected"] })), jsxRuntime.jsxs("div", { className: `wrapper${this.props.disabled ? ' disabled' : ''}`, children: [jsxRuntime.jsx("input", { id: inputId, role: "combobox", autoComplete: "off", disabled: this.props.disabled, required: this.props.required, "aria-invalid": this.props.state === 'error' ? 'true' : null }), jsxRuntime.jsx(icon_wrapper.PIcon, { className: "icon", name: "arrow-head-down", theme: this.props.theme, "aria-hidden": "true" }), this.props.currentValue && (jsxRuntime.jsx(buttonPure_wrapper.PButtonPure, { className: "button", icon: "close", hideLabel: "true", theme: this.props.theme, disabled: this.props.disabled, children: "Reset selection" })), jsxRuntime.jsxs("div", { id: dropdownId, className: "listbox", children: [!this.props.hasFilterResults && (jsxRuntime.jsxs("div", { className: "no-results", "aria-live": "polite", role: "status", children: [jsxRuntime.jsx("span", { "aria-hidden": "true", children: "---" }), jsxRuntime.jsx("span", { className: "sr-only", children: "No results found" })] })), jsxRuntime.jsx("slot", {})] })] }), jsxRuntime.jsx(stateMessage.StateMessage, { hasMessage: (this.props.message || namedSlotChildren.filter(({ props: { slot } }) => slot === 'message').length > 0) && ['success', 'error'].includes(this.props.state), state: this.props.state, message: this.props.message, theme: this.props.theme, host: null }), jsxRuntime.jsx("span", { className: "sr-only", role: "status", "aria-live": "assertive", "aria-relevant": "additions text", children: this.props.srHighlightedOptionText }), this.props.isWithinForm && jsxRuntime.jsx("slot", { name: "internal-select" })] })] }), this.props.children] }));
+        return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("template", { shadowroot: "open", shadowrootmode: "open", children: [jsxRuntime.jsx("style", { dangerouslySetInnerHTML: { __html: style } }), jsxRuntime.jsxs("div", { className: "root", children: [jsxRuntime.jsx(label.Label, { hasLabel: this.props.label || namedSlotChildren.filter(({ props: { slot } }) => slot === 'label').length > 0, hasDescription: this.props.description || namedSlotChildren.filter(({ props: { slot } }) => slot === 'description').length > 0, host: null, label: this.props.label, description: this.props.description, htmlFor: inputId, isRequired: this.props.required, isDisabled: this.props.disabled }), this.props.currentValue && (jsxRuntime.jsxs("span", { id: optionsSelectedId, className: "sr-only", children: [utilsEntry.getSelectedOptions(this.props.multiSelectOptions).length, " options selected"] })), jsxRuntime.jsxs("div", { className: `wrapper${this.props.disabled ? ' disabled' : ''}`, children: [jsxRuntime.jsx("input", { id: inputId, role: "combobox", autoComplete: "off", disabled: this.props.disabled, required: this.props.required, "aria-invalid": this.props.state === 'error' ? 'true' : null }), jsxRuntime.jsx(icon_wrapper.PIcon, { className: "icon", name: "arrow-head-down", theme: this.props.theme, "aria-hidden": "true" }), this.props.currentValue && (jsxRuntime.jsx(buttonPure_wrapper.PButtonPure, { className: "button", icon: "close", hideLabel: "true", theme: this.props.theme, disabled: this.props.disabled, children: "Reset selection" })), jsxRuntime.jsxs("div", { id: dropdownId, className: "listbox", children: [!this.props.hasFilterResults && (jsxRuntime.jsxs("div", { className: "no-results", "aria-live": "polite", role: "status", children: [jsxRuntime.jsx("span", { "aria-hidden": "true", children: "---" }), jsxRuntime.jsx("span", { className: "sr-only", children: "No results found" })] })), jsxRuntime.jsx("slot", {})] })] }), jsxRuntime.jsx(stateMessage.StateMessage, { hasMessage: (this.props.message || namedSlotChildren.filter(({ props: { slot } }) => slot === 'message').length > 0) && ['success', 'error'].includes(this.props.state), state: this.props.state, message: this.props.message, theme: this.props.theme, host: null }), jsxRuntime.jsx("span", { className: "sr-only", role: "status", "aria-live": "assertive", "aria-relevant": "additions text", children: this.props.srHighlightedOptionText }), this.props.isWithinForm && jsxRuntime.jsx("slot", { name: utilsEntry.INTERNAL_MULTI_SELECT_SLOT })] })] }), this.props.children] }));
     }
 }