@wix/design-system 1.165.0 → 1.167.0

package/dist/esm/CardGalleryItem/CardGalleryItem.st.css.js

@@ -7,7 +7,7 @@ import { classesRuntime, statesRuntime } from "./../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "wds_1_165_0_CardGalleryItem";
+var _namespace_ = "wds_1_167_0_CardGalleryItem";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -15,7 +15,7 @@ export var style = _style_;
 export var st = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"wds_1_165_0_CardGalleryItem__root","card":"wds_1_165_0_Card__card","overlay":"wds_1_165_0_CardGalleryItem__overlay","primaryAction":"wds_1_165_0_CardGalleryItem__primaryAction","secondaryAction":"wds_1_165_0_CardGalleryItem__secondaryAction","container":"wds_1_165_0_CardGalleryItem__container","footer":"wds_1_165_0_CardGalleryItem__footer","settingsMenu":"wds_1_165_0_CardGalleryItem__settingsMenu","footerSuffix":"wds_1_165_0_CardGalleryItem__footerSuffix","footerContent":"wds_1_165_0_CardGalleryItem__footerContent","footerImage":"wds_1_165_0_CardGalleryItem__footerImage","badgeWrapper":"wds_1_165_0_CardGalleryItem__badgeWrapper","dragHandleWrapper":"wds_1_165_0_CardGalleryItem__dragHandleWrapper","dragHandleFloatingWrapper":"wds_1_165_0_CardGalleryItem__dragHandleFloatingWrapper","cardContainer":"wds_1_165_0_CardGalleryItem__cardContainer wds_1_165_0_Card__card"};
+export var classes = {"root":"wds_1_167_0_CardGalleryItem__root","card":"wds_1_167_0_Card__card","overlay":"wds_1_167_0_CardGalleryItem__overlay","primaryAction":"wds_1_167_0_CardGalleryItem__primaryAction","secondaryAction":"wds_1_167_0_CardGalleryItem__secondaryAction","container":"wds_1_167_0_CardGalleryItem__container","footer":"wds_1_167_0_CardGalleryItem__footer","settingsMenu":"wds_1_167_0_CardGalleryItem__settingsMenu","footerSuffix":"wds_1_167_0_CardGalleryItem__footerSuffix","footerContent":"wds_1_167_0_CardGalleryItem__footerContent","footerImage":"wds_1_167_0_CardGalleryItem__footerImage","badgeWrapper":"wds_1_167_0_CardGalleryItem__badgeWrapper","dragHandleWrapper":"wds_1_167_0_CardGalleryItem__dragHandleWrapper","dragHandleFloatingWrapper":"wds_1_167_0_CardGalleryItem__dragHandleFloatingWrapper","cardContainer":"wds_1_167_0_CardGalleryItem__cardContainer wds_1_167_0_Card__card"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/dist/esm/Carousel/Carousel.js

@@ -4,7 +4,7 @@ import { ChevronLeftLarge, ChevronRightLarge, ChevronLeftLargeSmall, ChevronRigh
 // This is here and not in the test setup because we don't want consumers to need to run it as well
 import { register } from './utils/match-media-register';
 import Slider from 'react-slick';
-import { st, classes } from './Carousel.st.css.js';
+import { st, classes, vars } from './Carousel.st.css.js';
 import Pagination from './Pagination';
 import SliderArrow from './SliderArrow';
 import Loader from '../Loader';
@@ -20,6 +20,10 @@ const dataHooks = {
     nextButton: 'next-button',
     pageNavigation: index => `page-navigation-${index}`,
 };
+/**
+ * @internal
+ * SliderArrow wrapper that passes `...rest` props.
+ * This is a workaround for react-slick#1195 arrow error */
 const WrappedSliderArrow = ({ currentSlide, slideCount, ...rest }) => (React.createElement(SliderArrow, { ...rest }));
 const isTestEnv = process.env.NODE_ENV === 'test';
 if (isTestEnv && typeof window !== 'undefined' && !window.matchMedia) {
@@ -52,7 +56,7 @@ class Carousel extends React.Component {
         this.slideTo = index => {
             this.sliderRef?.current.slickGoTo(index);
         };
-        this._resolveSliderSettings = ({ infinite, autoplay, dots, variableWidth, buttonSkin, initialSlideIndex, afterChange, beforeChange, controlsPosition, controlsSize, controlsStartEnd, }) => {
+        this._resolveSliderSettings = ({ infinite, autoplay, dots, variableWidth, buttonSkin, initialSlideIndex, afterChange, beforeChange, controlsPosition, controlsSize, gradient, controlsStartEnd, }) => {
             return {
                 // in order to avoid duplicated items bug react-slick@0.30.2 - https://github.com/akiran/react-slick/issues/1171
                 infinite: (this.props.children?.length || this.props.images?.length) >
@@ -69,8 +73,12 @@ class Carousel extends React.Component {
                 variableWidth,
                 afterChange,
                 beforeChange,
-                nextArrow: (React.createElement(WrappedSliderArrow, { dataHook: dataHooks.nextButton, buttonSkin: buttonSkin, arrowSize: controlsSize, icon: this.rightIconByControlSize(controlsSize), controlsStartEnd: controlsStartEnd })),
-                prevArrow: (React.createElement(WrappedSliderArrow, { dataHook: dataHooks.prevButton, buttonSkin: buttonSkin, arrowSize: controlsSize, icon: this.leftIconByControlSize(controlsSize), controlsStartEnd: controlsStartEnd })),
+                prevArrow: (React.createElement(WrappedSliderArrow, { dataHook: dataHooks.prevButton, buttonSkin: buttonSkin, arrowSize: controlsSize, icon: this.leftIconByControlSize(controlsSize), controlsStartEnd: controlsStartEnd, gradientClassName: !!gradient && controlsPosition === 'overlay'
+                        ? classes.arrowPrevBackground
+                        : undefined })),
+                nextArrow: (React.createElement(WrappedSliderArrow, { dataHook: dataHooks.nextButton, buttonSkin: buttonSkin, arrowSize: controlsSize, icon: this.rightIconByControlSize(controlsSize), controlsStartEnd: controlsStartEnd, gradientClassName: !!gradient && controlsPosition === 'overlay'
+                        ? classes.arrowNextBackground
+                        : undefined })),
                 arrows: controlsPosition !== 'none',
                 appendDots: pages => {
                     /*
@@ -102,15 +110,6 @@ class Carousel extends React.Component {
         };
         this.sliderRef = React.createRef();
     }
-    render() {
-        const { dataHook, className, images, children, controlsPosition, controlsSize, showControlsShadow, } = this.props;
-        const { sliderSettings } = this.state;
-        const hasImages = !children && images.length > 0;
-        return (React.createElement("div", { "data-hook": dataHook, className: st(classes.root, { controlsPosition, controlsSize, showControlsShadow }, className) },
-            React.createElement(Slider, { ref: this.sliderRef, ...sliderSettings },
-                children,
-                hasImages && this._renderImages(images))));
-    }
     _onImageLoad(src) {
         this.setState(state => ({
             loadedImages: [...state.loadedImages, src],
@@ -119,6 +118,21 @@ class Carousel extends React.Component {
     _isLoading(src) {
         return !this.state.loadedImages.includes(src);
     }
+    render() {
+        const { dataHook, className, images, children, controlsPosition, controlsSize, showControlsShadow, gradient, gradientColor, dots, } = this.props;
+        const { sliderSettings } = this.state;
+        const hasImages = !children && images.length > 0;
+        return (React.createElement("div", { "data-hook": dataHook, className: st(classes.root, {
+                controlsPosition,
+                controlsSize,
+                showControlsShadow,
+                gradient,
+                dots
+            }, className), style: { [vars['carousel-gradient-color']]: gradientColor } },
+            React.createElement(Slider, { ref: this.sliderRef, ...sliderSettings },
+                children,
+                hasImages && this._renderImages(images))));
+    }
 }
 Carousel.displayName = 'Carousel';
 Carousel.propTypes = {
@@ -166,12 +180,21 @@ Carousel.propTypes = {
     controlsSize: PropTypes.oneOf(['tiny', 'small', 'medium']),
     /** Controls if the next / previous control buttons are visible, hidden or disabled at the start and end of the slideshow */
     controlsStartEnd: PropTypes.oneOf(['disabled', 'hidden']),
+    /** Controls gradient color when controlsPosition set to overlay
+     * @default white
+     */
+    gradientColor: PropTypes.string,
+    /** Enables gradient on when controlsPosition set to overlay
+     * @default false
+     */
+    gradient: PropTypes.bool,
 };
 Carousel.defaultProps = {
     infinite: true,
     dots: true,
     variableWidth: false,
     initialSlideIndex: 0,
+    gradient: false,
     images: [],
     imagesPosition: 'center top',
     imagesFit: 'contain',

package/dist/esm/Carousel/Carousel.js.map

@@ -1 +1 @@
-{"version":3,"file":"Carousel.js","sourceRoot":"","sources":["../../../src/Carousel/Carousel.js"],"names":[],"mappings":"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"}
+{"version":3,"file":"Carousel.js","sourceRoot":"","sources":["../../../src/Carousel/Carousel.js"],"names":[],"mappings":"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"}

package/dist/esm/Carousel/Carousel.st.css.js

@@ -6,7 +6,7 @@ import { classesRuntime, statesRuntime } from "./../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "wds_1_165_0_Carousel";
+var _namespace_ = "wds_1_167_0_Carousel";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -14,12 +14,12 @@ export var style = _style_;
 export var st = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"wds_1_165_0_Carousel__root","controls":"wds_1_165_0_Carousel__controls","imageContainer":"wds_1_165_0_Carousel__imageContainer","image":"wds_1_165_0_Carousel__image","loader":"wds_1_165_0_Carousel__loader","pagination":"wds_1_165_0_Carousel__pagination","pageNavigation":"wds_1_165_0_Carousel__pageNavigation"};
+export var classes = {"root":"wds_1_167_0_Carousel__root","controls":"wds_1_167_0_Carousel__controls","imageContainer":"wds_1_167_0_Carousel__imageContainer","image":"wds_1_167_0_Carousel__image","loader":"wds_1_167_0_Carousel__loader","pagination":"wds_1_167_0_Carousel__pagination","pageNavigation":"wds_1_167_0_Carousel__pageNavigation","arrowPrevBackground":"wds_1_167_0_Carousel__arrowPrevBackground","arrowNextBackground":"wds_1_167_0_Carousel__arrowNextBackground"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};
 export var stVars = {"horizontalSpacingSize":"50px","verticalSpacingSize":"7px"}; 
-export var vars = {"arrow-size":"--wds_1_165_0_Carousel-arrow-size"}; 
+export var vars = {"arrow-size":"--wds_1_167_0_Carousel-arrow-size","carousel-gradient-color":"--carousel-gradient-color"}; 
 
 
 

package/dist/esm/Carousel/Pagination/Pagination.st.css.js

@@ -4,7 +4,7 @@ import { classesRuntime, statesRuntime } from "./../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "wds_1_165_0_CarouselPagination";
+var _namespace_ = "wds_1_167_0_CarouselPagination";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -12,7 +12,7 @@ export var style = _style_;
 export var st = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"wds_1_165_0_CarouselPagination__root","dot":"wds_1_165_0_CarouselPagination__dot"};
+export var classes = {"root":"wds_1_167_0_CarouselPagination__root","dot":"wds_1_167_0_CarouselPagination__dot"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/dist/esm/Carousel/SliderArrow/SliderArrow.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import PropTypes from 'prop-types';
 import IconButton from '../../IconButton/IconButton';
-import { classes } from '../Carousel.st.css.js';
+import { st, classes } from '../Carousel.st.css.js';
 const skinPriorityMap = {
     standard: 'secondary',
     inverted: 'primary',
@@ -9,10 +9,14 @@ const skinPriorityMap = {
     transparent: 'primary',
     premium: 'primary',
 };
-const SliderArrow = ({ dataHook, arrowSize, buttonSkin, icon, className, controlsStartEnd, ...remainingProps }) => {
+const SliderArrow = ({ dataHook, arrowSize, buttonSkin, icon, className, // do not pass - this is overrided by react-slick slider
+gradientClassName, controlsStartEnd, ...remainingProps }) => {
     const isControlOnEdge = className.includes('slick-disabled');
-    return isControlOnEdge && controlsStartEnd === 'hidden' ? null : (React.createElement("div", { ...remainingProps, "data-hook": dataHook, className: className },
-        React.createElement(IconButton, { dataHook: `${dataHook}-element`, className: classes.controls, skin: buttonSkin, size: arrowSize, disabled: isControlOnEdge, priority: skinPriorityMap[buttonSkin] }, icon)));
+    if (isControlOnEdge && controlsStartEnd === 'hidden') {
+        return null;
+    }
+    const arrow = (React.createElement(IconButton, { dataHook: `${dataHook}-element`, className: st(classes.controls), skin: buttonSkin, size: arrowSize, disabled: isControlOnEdge, priority: skinPriorityMap[buttonSkin] }, icon));
+    return (React.createElement("div", { ...remainingProps, className: className, "data-hook": dataHook, style: { height: '100%' } }, !!gradientClassName ? (React.createElement("div", { className: gradientClassName }, arrow)) : (arrow)));
 };
 SliderArrow.propTypes = {
     /** Applied as data-hook HTML attribute that can be used in the tests */

package/dist/esm/Carousel/SliderArrow/SliderArrow.js.map

@@ -1 +1 @@
-{"version":3,"file":"SliderArrow.js","sourceRoot":"","sources":["../../../../src/Carousel/SliderArrow/SliderArrow.js"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,SAAS,MAAM,YAAY,CAAC;AACnC,OAAO,UAAU,MAAM,6BAA6B,CAAC;AACrD,OAAO,EAAE,OAAO,EAAE,MAAM,oBAAoB,CAAC;AAE7C,MAAM,eAAe,GAAG;IACtB,QAAQ,EAAE,WAAW;IACrB,QAAQ,EAAE,SAAS;IACnB,KAAK,EAAE,SAAS;IAChB,WAAW,EAAE,SAAS;IACtB,OAAO,EAAE,SAAS;CACnB,CAAC;AAEF,MAAM,WAAW,GAAG,CAAC,EACnB,QAAQ,EACR,SAAS,EACT,UAAU,EACV,IAAI,EACJ,SAAS,EACT,gBAAgB,EAChB,GAAG,cAAc,EAClB,EAAE,EAAE;IACH,MAAM,eAAe,GAAG,SAAS,CAAC,QAAQ,CAAC,gBAAgB,CAAC,CAAC;IAE7D,OAAO,eAAe,IAAI,gBAAgB,KAAK,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAC/D,gCAAS,cAAc,eAAa,QAAQ,EAAE,SAAS,EAAE,SAAS;QAChE,oBAAC,UAAU,IACT,QAAQ,EAAE,GAAG,QAAQ,UAAU,EAC/B,SAAS,EAAE,OAAO,CAAC,QAAQ,EAC3B,IAAI,EAAE,UAAU,EAChB,IAAI,EAAE,SAAS,EACf,QAAQ,EAAE,eAAe,EACzB,QAAQ,EAAE,eAAe,CAAC,UAAU,CAAC,IAEpC,IAAI,CACM,CACT,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,WAAW,CAAC,SAAS,GAAG;IACtB,wEAAwE;IACxE,QAAQ,EAAE,SAAS,CAAC,MAAM;IAC1B,iDAAiD;IACjD,IAAI,EAAE,SAAS,CAAC,OAAO,CAAC,UAAU;CACnC,CAAC;AAEF,eAAe,WAAW,CAAC"}
+{"version":3,"file":"SliderArrow.js","sourceRoot":"","sources":["../../../../src/Carousel/SliderArrow/SliderArrow.js"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,SAAS,MAAM,YAAY,CAAC;AACnC,OAAO,UAAU,MAAM,6BAA6B,CAAC;AACrD,OAAO,EAAE,EAAE,EAAE,OAAO,EAAE,MAAM,oBAAoB,CAAC;AAEjD,MAAM,eAAe,GAAG;IACtB,QAAQ,EAAE,WAAW;IACrB,QAAQ,EAAE,SAAS;IACnB,KAAK,EAAE,SAAS;IAChB,WAAW,EAAE,SAAS;IACtB,OAAO,EAAE,SAAS;CACnB,CAAC;AAEF,MAAM,WAAW,GAAG,CAAC,EACnB,QAAQ,EACR,SAAS,EACT,UAAU,EACV,IAAI,EACJ,SAAS,EAAE,wDAAwD;AACnE,iBAAiB,EACjB,gBAAgB,EAChB,GAAG,cAAc,EAClB,EAAE,EAAE;IACH,MAAM,eAAe,GAAG,SAAS,CAAC,QAAQ,CAAC,gBAAgB,CAAC,CAAC;IAE7D,IAAI,eAAe,IAAI,gBAAgB,KAAK,QAAQ,EAAE,CAAC;QACrD,OAAO,IAAI,CAAC;IACd,CAAC;IAED,MAAM,KAAK,GAAG,CACZ,oBAAC,UAAU,IACT,QAAQ,EAAE,GAAG,QAAQ,UAAU,EAC/B,SAAS,EAAE,EAAE,CAAC,OAAO,CAAC,QAAQ,CAAC,EAC/B,IAAI,EAAE,UAAU,EAChB,IAAI,EAAE,SAAS,EACf,QAAQ,EAAE,eAAe,EACzB,QAAQ,EAAE,eAAe,CAAC,UAAU,CAAC,IAEpC,IAAI,CACM,CACd,CAAC;IAEF,OAAO,CACL,gCACM,cAAc,EAClB,SAAS,EAAE,SAAS,eACT,QAAQ,EACnB,KAAK,EAAE,EAAE,MAAM,EAAE,MAAM,EAAE,IAExB,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,CACrB,6BAAK,SAAS,EAAE,iBAAiB,IAAG,KAAK,CAAO,CACjD,CAAC,CAAC,CAAC,CACF,KAAK,CACN,CACG,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,WAAW,CAAC,SAAS,GAAG;IACtB,wEAAwE;IACxE,QAAQ,EAAE,SAAS,CAAC,MAAM;IAC1B,iDAAiD;IACjD,IAAI,EAAE,SAAS,CAAC,OAAO,CAAC,UAAU;CACnC,CAAC;AAEF,eAAe,WAAW,CAAC"}

package/dist/esm/CarouselWIP/CarouselWIP.st.css.js

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "./../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "wds_1_165_0_CarouselWIP";
+var _namespace_ = "wds_1_167_0_CarouselWIP";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,12 +13,12 @@ export var style = _style_;
 export var st = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"wds_1_165_0_CarouselWIP__root","carousel":"wds_1_165_0_CarouselWIP__carousel","control":"wds_1_165_0_CarouselWIP__control","prev":"wds_1_165_0_CarouselWIP__prev","next":"wds_1_165_0_CarouselWIP__next","start":"wds_1_165_0_CarouselWIP__start","end":"wds_1_165_0_CarouselWIP__end","dots":"wds_1_165_0_CarouselWIP__dots","dot":"wds_1_165_0_CarouselWIP__dot","loader":"wds_1_165_0_CarouselWIP__loader"};
+export var classes = {"root":"wds_1_167_0_CarouselWIP__root","carousel":"wds_1_167_0_CarouselWIP__carousel","control":"wds_1_167_0_CarouselWIP__control","prev":"wds_1_167_0_CarouselWIP__prev","next":"wds_1_167_0_CarouselWIP__next","start":"wds_1_167_0_CarouselWIP__start","end":"wds_1_167_0_CarouselWIP__end","dots":"wds_1_167_0_CarouselWIP__dots","dot":"wds_1_167_0_CarouselWIP__dot","loader":"wds_1_167_0_CarouselWIP__loader"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};
 export var stVars = {"horizontalSpacingSize":"50px","verticalSpacingSize":"7px"}; 
-export var vars = {"arrow-size":"--wds_1_165_0_CarouselWIP-arrow-size","sidesGradientColor":"--wds_1_165_0_CarouselWIP-sidesGradientColor"}; 
+export var vars = {"arrow-size":"--wds_1_167_0_CarouselWIP-arrow-size","sidesGradientColor":"--wds_1_167_0_CarouselWIP-sidesGradientColor"}; 
 
 
 

package/dist/esm/CheckToggle/CheckToggle.st.css.js

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "./../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "wds_1_165_0_CheckToggle";
+var _namespace_ = "wds_1_167_0_CheckToggle";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style = _style_;
 export var st = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"wds_1_165_0_CheckToggle__root","input":"wds_1_165_0_CheckToggle__input","toggle":"wds_1_165_0_CheckToggle__toggle"};
+export var classes = {"root":"wds_1_167_0_CheckToggle__root","input":"wds_1_167_0_CheckToggle__input","toggle":"wds_1_167_0_CheckToggle__toggle"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/dist/esm/Checkbox/Checkbox.st.css.js

@@ -6,7 +6,7 @@ import { classesRuntime, statesRuntime } from "./../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "wds_1_165_0_Checkbox";
+var _namespace_ = "wds_1_167_0_Checkbox";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -14,7 +14,7 @@ export var style = _style_;
 export var st = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"wds_1_165_0_Checkbox__root","label":"wds_1_165_0_Checkbox__label","labelInner":"wds_1_165_0_Checkbox__labelInner","children":"wds_1_165_0_Checkbox__children","checkbox":"wds_1_165_0_Checkbox__checkbox","inner":"wds_1_165_0_Checkbox__inner","outer":"wds_1_165_0_Checkbox__outer"};
+export var classes = {"root":"wds_1_167_0_Checkbox__root","label":"wds_1_167_0_Checkbox__label","labelInner":"wds_1_167_0_Checkbox__labelInner","children":"wds_1_167_0_Checkbox__children","checkbox":"wds_1_167_0_Checkbox__checkbox","inner":"wds_1_167_0_Checkbox__inner","outer":"wds_1_167_0_Checkbox__outer"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/dist/esm/CircularProgressBar/CircularProgressBar.st.css.js

@@ -8,7 +8,7 @@ import { classesRuntime, statesRuntime } from "./../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "wds_1_165_0_CircularProgressBar";
+var _namespace_ = "wds_1_167_0_CircularProgressBar";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -16,7 +16,7 @@ export var style = _style_;
 export var st = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"wds_1_165_0_CircularProgressBar__root","progressBar":"wds_1_165_0_CircularProgressBar__progressBar","tooltip":"wds_1_165_0_CircularProgressBar__tooltip"};
+export var classes = {"root":"wds_1_167_0_CircularProgressBar__root","progressBar":"wds_1_167_0_CircularProgressBar__progressBar","tooltip":"wds_1_167_0_CircularProgressBar__tooltip"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/dist/esm/CircularProgressBar/CircularProgressBarCore/CircularProgressBarCore.st.css.js

@@ -4,7 +4,7 @@ import { classesRuntime, statesRuntime } from "./../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "wds_1_165_0_CircularProgressBarCore";
+var _namespace_ = "wds_1_167_0_CircularProgressBarCore";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -12,7 +12,7 @@ export var style = _style_;
 export var st = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"wds_1_165_0_CircularProgressBarCore__root","label":"wds_1_165_0_CircularProgressBarCore__label","progressIndicator":"wds_1_165_0_CircularProgressBarCore__progressIndicator","indicationIconContainer":"wds_1_165_0_CircularProgressBarCore__indicationIconContainer","statusIndicator":"wds_1_165_0_CircularProgressBarCore__statusIndicator","arcsContainer":"wds_1_165_0_CircularProgressBarCore__arcsContainer","foreArc":"wds_1_165_0_CircularProgressBarCore__foreArc","backArc":"wds_1_165_0_CircularProgressBarCore__backArc"};
+export var classes = {"root":"wds_1_167_0_CircularProgressBarCore__root","label":"wds_1_167_0_CircularProgressBarCore__label","progressIndicator":"wds_1_167_0_CircularProgressBarCore__progressIndicator","indicationIconContainer":"wds_1_167_0_CircularProgressBarCore__indicationIconContainer","statusIndicator":"wds_1_167_0_CircularProgressBarCore__statusIndicator","arcsContainer":"wds_1_167_0_CircularProgressBarCore__arcsContainer","foreArc":"wds_1_167_0_CircularProgressBarCore__foreArc","backArc":"wds_1_167_0_CircularProgressBarCore__backArc"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/dist/esm/CloseButton/CloseButton.st.css.js

@@ -8,7 +8,7 @@ import { classesRuntime, statesRuntime } from "./../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "wds_1_165_0_CloseButton";
+var _namespace_ = "wds_1_167_0_CloseButton";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -16,7 +16,7 @@ export var style = _style_;
 export var st = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"wds_1_165_0_CloseButton__root"};
+export var classes = {"root":"wds_1_167_0_CloseButton__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/dist/esm/Collapse/Collapse.st.css.js

@@ -4,7 +4,7 @@ import { classesRuntime, statesRuntime } from "./../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "wds_1_165_0_Collapse";
+var _namespace_ = "wds_1_167_0_Collapse";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -12,7 +12,7 @@ export var style = _style_;
 export var st = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"wds_1_165_0_Collapse__root"};
+export var classes = {"root":"wds_1_167_0_Collapse__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/dist/esm/ColorInput/components/ColorViewer.st.css.js

@@ -4,7 +4,7 @@ import { classesRuntime, statesRuntime } from "./../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "wds_1_165_0_ColorViewer";
+var _namespace_ = "wds_1_167_0_ColorViewer";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -12,7 +12,7 @@ export var style = _style_;
 export var st = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"wds_1_165_0_ColorViewer__root","line":"wds_1_165_0_ColorViewer__line"};
+export var classes = {"root":"wds_1_167_0_ColorViewer__root","line":"wds_1_167_0_ColorViewer__line"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/dist/esm/ColorInput/components/Hash.st.css.js

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "./../../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "wds_1_165_0_Hash";
+var _namespace_ = "wds_1_167_0_Hash";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style = _style_;
 export var st = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"wds_1_165_0_Hash__root","text-medium-normal":"wds_1_165_0_StylableTypography__text-medium-normal"};
+export var classes = {"root":"wds_1_167_0_Hash__root","text-medium-normal":"wds_1_167_0_StylableTypography__text-medium-normal"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/dist/esm/ColorPicker/ColorPicker.st.css.js

@@ -1,10 +1,11 @@
 
 import "../Foundation/stylable/colors.st.css.js";
+
 import { classesRuntime, statesRuntime } from "./../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "wds_1_165_0_ColorPicker";
+var _namespace_ = "wds_1_167_0_ColorPicker";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -12,12 +13,12 @@ export var style = _style_;
 export var st = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"wds_1_165_0_ColorPicker__root","children":"wds_1_165_0_ColorPicker__children"};
+export var classes = {"root":"wds_1_167_0_ColorPicker__root","children":"wds_1_167_0_ColorPicker__children"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};
 export var stVars = {}; 
-export var vars = {}; 
+export var vars = {"wds-color-text-standard-primary-light":"--wds-color-text-standard-primary-light","wds-color-picker-width":"--wds-color-picker-width","wds-color-picker-padding-horizontal":"--wds-color-picker-padding-horizontal","wds-color-picker-padding-vertical":"--wds-color-picker-padding-vertical","wds-popover-border":"--wds-popover-border"}; 
 
 
 

package/dist/esm/ColorPicker/ColorPickerActions.st.css.js

@@ -4,7 +4,7 @@ import { classesRuntime, statesRuntime } from "./../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "wds_1_165_0_ColorPickerActions";
+var _namespace_ = "wds_1_167_0_ColorPickerActions";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -12,12 +12,12 @@ export var style = _style_;
 export var st = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"wds_1_165_0_ColorPickerActions__root"};
+export var classes = {"root":"wds_1_167_0_ColorPickerActions__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};
 export var stVars = {}; 
-export var vars = {}; 
+export var vars = {"wds-color-picker-padding-horizontal":"--wds-color-picker-padding-horizontal","wds-color-picker-padding-vertical":"--wds-color-picker-padding-vertical","wds-space-200":"--wds-space-200"}; 
 
 
 

package/dist/esm/ColorPicker/ColorPickerConverter.st.css.js

@@ -1,11 +1,12 @@
 
 import "../common/Focusable/Focusable.st.css.js";
 import "../Foundation/stylable/colors.st.css.js";
+
 import { classesRuntime, statesRuntime } from "./../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "wds_1_165_0_ColorPickerConverter";
+var _namespace_ = "wds_1_167_0_ColorPickerConverter";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,12 +14,12 @@ export var style = _style_;
 export var st = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"wds_1_165_0_ColorPickerConverter__root","colorInput":"wds_1_165_0_ColorPickerConverter__colorInput","preview":"wds_1_165_0_ColorPickerConverter__preview","distribute":"wds_1_165_0_ColorPickerConverter__distribute","distributedItem":"wds_1_165_0_ColorPickerConverter__distributedItem"};
+export var classes = {"root":"wds_1_167_0_ColorPickerConverter__root","colorInput":"wds_1_167_0_ColorPickerConverter__colorInput","preview":"wds_1_167_0_ColorPickerConverter__preview","distribute":"wds_1_167_0_ColorPickerConverter__distribute","distributedItem":"wds_1_167_0_ColorPickerConverter__distributedItem"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};
 export var stVars = {}; 
-export var vars = {}; 
+export var vars = {"wds-color-border-transparent-primary":"--wds-color-border-transparent-primary","wds-shadow-focus-standard":"--wds-shadow-focus-standard","wds-space-200":"--wds-space-200","wds-swatches-swatch-border-radius-medium":"--wds-swatches-swatch-border-radius-medium","wds-swatches-swatch-size-small":"--wds-swatches-swatch-size-small","wds-color-picker-padding-horizontal":"--wds-color-picker-padding-horizontal","wds-color-picker-padding-vertical":"--wds-color-picker-padding-vertical"}; 
 
 
 

package/dist/esm/ColorPicker/ColorPickerHistory.st.css.js

@@ -4,7 +4,7 @@ import { classesRuntime, statesRuntime } from "./../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "wds_1_165_0_ColorPickerHistory";
+var _namespace_ = "wds_1_167_0_ColorPickerHistory";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -12,7 +12,7 @@ export var style = _style_;
 export var st = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"wds_1_165_0_ColorPickerHistory__root"};
+export var classes = {"root":"wds_1_167_0_ColorPickerHistory__root"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/dist/esm/ColorPicker/ColorPickerHsb.st.css.js

@@ -1,10 +1,11 @@
 
 import "../Foundation/stylable/colors.st.css.js";
+
 import { classesRuntime, statesRuntime } from "./../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "wds_1_165_0_ColorPickerHsb";
+var _namespace_ = "wds_1_167_0_ColorPickerHsb";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -12,12 +13,12 @@ export var style = _style_;
 export var st = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"wds_1_165_0_ColorPickerHsb__root","sticky":"wds_1_165_0_ColorPickerHsb__sticky","saturation":"wds_1_165_0_ColorPickerHsb__saturation","brightness":"wds_1_165_0_ColorPickerHsb__brightness","hue":"wds_1_165_0_ColorPickerHsb__hue","handle":"wds_1_165_0_ColorPickerHsb__handle"};
+export var classes = {"root":"wds_1_167_0_ColorPickerHsb__root","sticky":"wds_1_167_0_ColorPickerHsb__sticky","saturation":"wds_1_167_0_ColorPickerHsb__saturation","brightness":"wds_1_167_0_ColorPickerHsb__brightness","hue":"wds_1_167_0_ColorPickerHsb__hue","handle":"wds_1_167_0_ColorPickerHsb__handle"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};
 export var stVars = {}; 
-export var vars = {}; 
+export var vars = {"wds-color-fill-dark-primary":"--wds-color-fill-dark-primary"}; 
 
 
 

package/dist/esm/ColorPicker/ColorPickerHue.st.css.js

@@ -1,11 +1,12 @@
 
 import "../Foundation/stylable/colors.st.css.js";
 import "../Foundation/stylable/shadows.st.css.js";
+
 import { classesRuntime, statesRuntime } from "./../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "wds_1_165_0_ColorPickerHue";
+var _namespace_ = "wds_1_167_0_ColorPickerHue";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,12 +14,12 @@ export var style = _style_;
 export var st = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"wds_1_165_0_ColorPickerHue__root","handle":"wds_1_165_0_ColorPickerHue__handle"};
+export var classes = {"root":"wds_1_167_0_ColorPickerHue__root","handle":"wds_1_167_0_ColorPickerHue__handle"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};
 export var stVars = {}; 
-export var vars = {}; 
+export var vars = {"wds-color-fill-standard-tertiary":"--wds-color-fill-standard-tertiary","wds-shadow-100":"--wds-shadow-100"}; 
 
 
 

package/dist/esm/ComposerButton/ComposerButton.st.css.js

@@ -7,7 +7,7 @@ import { classesRuntime, statesRuntime } from "./../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "wds_1_165_0_ComposerButton";
+var _namespace_ = "wds_1_167_0_ComposerButton";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -15,7 +15,7 @@ export var style = _style_;
 export var st = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"wds_1_165_0_ComposerButton__root","tooltip":"wds_1_165_0_ComposerButton__tooltip","label":"wds_1_165_0_ComposerButton__label","iconContainer":"wds_1_165_0_ComposerButton__iconContainer"};
+export var classes = {"root":"wds_1_167_0_ComposerButton__root","tooltip":"wds_1_167_0_ComposerButton__tooltip","label":"wds_1_167_0_ComposerButton__label","iconContainer":"wds_1_167_0_ComposerButton__iconContainer"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};

package/dist/esm/ComposerHeader/ComposerHeader.st.css.js

@@ -5,7 +5,7 @@ import { classesRuntime, statesRuntime } from "./../stylable-esm-runtime.js";
 
 
 
-var _namespace_ = "wds_1_165_0_ComposerHeader";
+var _namespace_ = "wds_1_167_0_ComposerHeader";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 export var cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ export var style = _style_;
 export var st = _style_;
 
 export var namespace = _namespace_;
-export var classes = {"root":"wds_1_165_0_ComposerHeader__root","container":"wds_1_165_0_ComposerHeader__container","actions":"wds_1_165_0_ComposerHeader__actions","saveStatus":"wds_1_165_0_ComposerHeader__saveStatus","mainActions":"wds_1_165_0_ComposerHeader__mainActions","backButton":"wds_1_165_0_ComposerHeader__backButton","divider":"wds_1_165_0_ComposerHeader__divider"};
+export var classes = {"root":"wds_1_167_0_ComposerHeader__root","container":"wds_1_167_0_ComposerHeader__container","actions":"wds_1_167_0_ComposerHeader__actions","saveStatus":"wds_1_167_0_ComposerHeader__saveStatus","mainActions":"wds_1_167_0_ComposerHeader__mainActions","backButton":"wds_1_167_0_ComposerHeader__backButton","divider":"wds_1_167_0_ComposerHeader__divider"};
 export var keyframes = {}; 
 export var layers = {};
 export var containers = {};