@wix/design-system 1.160.1 → 1.161.0

package/dist/cjs/Thumbnail/Thumbnail.js

@@ -12,6 +12,7 @@ var _Focusable = require("../common/Focusable");
 var _constants = require("./constants");
 var _Box = _interopRequireDefault(require("../Box"));
 var _context = require("../WixDesignSystemProvider/context");
+var _TooltipCommon = require("../common/PropTypes/TooltipCommon");
 var _jsxFileName = "/home/builduser/work/b60d7defec63c7cc/packages/wix-design-system/dist/cjs/Thumbnail/Thumbnail.js";
 var isString = a => typeof a === 'string';
 
@@ -39,7 +40,7 @@ class Thumbnail extends _react.default.PureComponent {
         __self: this,
         __source: {
           fileName: _jsxFileName,
-          lineNumber: 101,
+          lineNumber: 108,
           columnNumber: 7
         }
       }) : this.props.backgroundImage;
@@ -49,14 +50,15 @@ class Thumbnail extends _react.default.PureComponent {
         size,
         title,
         selected,
-        disabled
+        disabled,
+        tooltipProps = {}
       } = this.props;
       return /*#__PURE__*/_react.default.createElement(_Box.default, {
         align: "center",
         __self: this,
         __source: {
           fileName: _jsxFileName,
-          lineNumber: 115,
+          lineNumber: 122,
           columnNumber: 7
         }
       }, /*#__PURE__*/_react.default.createElement(_Text.default, {
@@ -70,10 +72,11 @@ class Thumbnail extends _react.default.PureComponent {
         weight: "thin",
         ellipsis: true,
         children: title,
+        tooltipProps: tooltipProps,
         __self: this,
         __source: {
           fileName: _jsxFileName,
-          lineNumber: 116,
+          lineNumber: 123,
           columnNumber: 9
         }
       }));
@@ -91,7 +94,7 @@ class Thumbnail extends _react.default.PureComponent {
         __self: this,
         __source: {
           fileName: _jsxFileName,
-          lineNumber: 133,
+          lineNumber: 141,
           columnNumber: 7
         }
       }, isString(image) ? /*#__PURE__*/_react.default.createElement("img", {
@@ -102,7 +105,7 @@ class Thumbnail extends _react.default.PureComponent {
         __self: this,
         __source: {
           fileName: _jsxFileName,
-          lineNumber: 138,
+          lineNumber: 146,
           columnNumber: 11
         }
       }) : image);
@@ -115,7 +118,8 @@ class Thumbnail extends _react.default.PureComponent {
         ellipsis,
         maxLines,
         description,
-        textPosition
+        textPosition,
+        tooltipProps = {}
       } = this.props;
       return /*#__PURE__*/_react.default.createElement("div", {
         className: (0, _ThumbnailSt.st)(_ThumbnailSt.classes.thumbnailTextContent, {
@@ -125,7 +129,7 @@ class Thumbnail extends _react.default.PureComponent {
         __self: this,
         __source: {
           fileName: _jsxFileName,
-          lineNumber: 158,
+          lineNumber: 167,
           columnNumber: 7
         }
       }, title && /*#__PURE__*/_react.default.createElement(_Text.default, {
@@ -140,10 +144,11 @@ class Thumbnail extends _react.default.PureComponent {
         skin: disabled ? 'disabled' : undefined,
         ellipsis: ellipsis,
         maxLines: maxLines,
+        tooltipProps: tooltipProps,
         __self: this,
         __source: {
           fileName: _jsxFileName,
-          lineNumber: 160,
+          lineNumber: 169,
           columnNumber: 11
         }
       }), description && /*#__PURE__*/_react.default.createElement(_Text.default, {
@@ -156,10 +161,11 @@ class Thumbnail extends _react.default.PureComponent {
         skin: disabled ? 'disabled' : undefined,
         ellipsis: ellipsis,
         maxLines: maxLines,
+        tooltipProps: tooltipProps,
         __self: this,
         __source: {
           fileName: _jsxFileName,
-          lineNumber: 172,
+          lineNumber: 182,
           columnNumber: 11
         }
       }));
@@ -170,7 +176,7 @@ class Thumbnail extends _react.default.PureComponent {
       __self: this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 189,
+        lineNumber: 200,
         columnNumber: 5
       }
     }, /*#__PURE__*/_react.default.createElement(_system.CheckboxChecked, {
@@ -179,7 +185,7 @@ class Thumbnail extends _react.default.PureComponent {
       __self: this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 193,
+        lineNumber: 204,
         columnNumber: 7
       }
     }));
@@ -212,7 +218,7 @@ class Thumbnail extends _react.default.PureComponent {
             __self: this,
             __source: {
               fileName: _jsxFileName,
-              lineNumber: 222,
+              lineNumber: 233,
               columnNumber: 11
             }
           }, children);
@@ -231,7 +237,7 @@ class Thumbnail extends _react.default.PureComponent {
           __self: this,
           __source: {
             fileName: _jsxFileName,
-            lineNumber: 236,
+            lineNumber: 247,
             columnNumber: 9
           }
         }, image && this._renderThumbnailImage(), textPosition === 'inside' && this._renderTitleAndDescription());
@@ -258,7 +264,7 @@ class Thumbnail extends _react.default.PureComponent {
         __self: this,
         __source: {
           fileName: _jsxFileName,
-          lineNumber: 244,
+          lineNumber: 255,
           columnNumber: 7
         }
       }, !this.props.hideSelectedIcon && selected && this._renderSelectedIcon(), getThumbnailContent());
@@ -284,7 +290,7 @@ class Thumbnail extends _react.default.PureComponent {
       __self: this,
       __source: {
         fileName: _jsxFileName,
-        lineNumber: 291,
+        lineNumber: 302,
         columnNumber: 7
       }
     }, _ref => {
@@ -304,7 +310,7 @@ class Thumbnail extends _react.default.PureComponent {
         __self: this,
         __source: {
           fileName: _jsxFileName,
-          lineNumber: 293,
+          lineNumber: 304,
           columnNumber: 11
         }
       }, this._renderThumbnail(), textPosition === 'outside' && this._renderTitleAndDescription(), showBottomTitle ? this._renderBottomTitle() : null);
@@ -356,7 +362,12 @@ Thumbnail.propTypes = {
   /** Controls text position whether it is outside or inside of a thumbnail */
   textPosition: _propTypes.default.oneOf(['inside', 'outside']),
   /** Turns off padding for thumbnail with textPosition='inside' */
-  noPadding: _propTypes.default.bool
+  noPadding: _propTypes.default.bool,
+  /** Allows to pass tooltip common props.
+   * @linkTypeTo components-overlays--tooltip
+   * @setTypeName TooltipCommonProps
+   */
+  tooltipProps: _propTypes.default.shape(_TooltipCommon.TooltipCommonProps)
 };
 Thumbnail.defaultProps = {
   size: 'medium',

package/dist/cjs/Thumbnail/Thumbnail.js.map

@@ -1 +1 @@
-{"version":3,"names":["_react","_interopRequireDefault","require","_propTypes","_ThumbnailSt","_system","_Text","_Focusable","_constants","_Box","_context","_jsxFileName","isString","a","Thumbnail","React","PureComponent","constructor","arguments","_renderBackgroundLayout","disabled","props","backgroundImage","default","createElement","className","st","classes","dataHooks","thumbnailBackgroundImage","style","concat","__self","__source","fileName","lineNumber","columnNumber","_renderBottomTitle","size","title","selected","align","bottomTitle","dataHook","thumbnailBottomTitle","tagName","weight","ellipsis","children","_renderThumbnailImage","textPosition","image","imageContainer","thumbnailImage","src","_renderTitleAndDescription","maxLines","description","thumbnailTextContent","thumbnailTitle","skin","undefined","thumbnailDescription","secondary","_renderSelectedIcon","selectedIcon","thumbnailSelectedIcon","CheckboxChecked","height","width","_renderThumbnail","contentAlignment","newColorsBranding","noPadding","hasChildren","hasBackground","getThumbnailContent","customChild","contentContainer","thumbnail","tabIndex","thumbnailWrapper","hideSelectedIcon","_onKeyDown","event","onClick","some","key","keyCode","render","showBottomTitle","WixDesignSystemContext","Consumer","_ref","root","onKeyDown","displayName","propTypes","PropTypes","string","node","oneOf","bool","func","oneOfType","number","defaultProps","_default","exports","withFocusable"],"sources":["../../../src/Thumbnail/Thumbnail.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { st, classes } from './Thumbnail.st.css';\nimport { CheckboxChecked } from '@wix/wix-ui-icons-common/system';\nimport Text from '../Text';\nimport { withFocusable } from '../common/Focusable';\nimport { dataHooks } from './constants';\nimport Box from '../Box';\nimport { WixDesignSystemContext } from '../WixDesignSystemProvider/context';\n\nconst isString = a => typeof a === 'string';\n\n/**\n * # Thumbnail\n * Component for showing thumbnails\n *\n * It takes full space of parent component, works well together with `<Proportion/>`\n * */\nclass Thumbnail extends React.PureComponent {\n  static displayName = 'Thumbnail';\n\n  static propTypes = {\n    /** Applies a data-hook HTML attribute that can be used in the tests. */\n    dataHook: PropTypes.string,\n\n    /** Specifies a CSS class name to be appended to the component’s root element.\n     * @internal\n     */\n\n    className: PropTypes.string,\n\n    /** Renders specified children items inside of the thumbnail. Accepts any kind of content. When passed, title will be rendered below a thumbnail. */\n    children: PropTypes.node,\n\n    /** Sets the title of a thumbnail. */\n    title: PropTypes.node,\n\n    /** Sets thumbnail description. */\n    description: PropTypes.node,\n\n    /** Specifies an image to be displayed inside of a thumbnail.\n     * If given as string, it will be used within `<img/>`.\n     * Otherwise can be given as React.Node\n     */\n    image: PropTypes.node,\n\n    /** Controls the size of a thumbnail. */\n    size: PropTypes.oneOf(['tiny', 'small', 'medium']),\n\n    /** Specifies whether a thumbnail is selected. */\n    selected: PropTypes.bool,\n\n    /** Specifies whether thumbnail interactions are disabled. */\n    disabled: PropTypes.bool,\n\n    /** Hides a checkmark icon that indicates selected thumbnail. Selected option will be highlighted with border only. */\n    hideSelectedIcon: PropTypes.bool,\n\n    /** Render image as a background of a thumbnail. As a result, title is rendered below the image thumbnail. */\n    backgroundImage: PropTypes.node,\n\n    /** Defines a callback function which is called every time a thumbnail is clicked. */\n    onClick: PropTypes.func,\n\n    /** Controls the width of a thumbnail. */\n    width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n\n    /** Controls the height of a thumbnail. */\n    height: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n\n    /** Controls vertical alignment of content. */\n    contentAlignment: PropTypes.oneOf(['top', 'center']),\n\n    /** Enables ellipsis text truncation. */\n    ellipsis: PropTypes.bool,\n\n    /** Controls maximum lines that is allowed before ellipsis text truncation is applied */\n    maxLines: PropTypes.number,\n\n    /** Controls text position whether it is outside or inside of a thumbnail */\n    textPosition: PropTypes.oneOf(['inside', 'outside']),\n\n    /** Turns off padding for thumbnail with textPosition='inside' */\n    noPadding: PropTypes.bool,\n  };\n\n  static defaultProps = {\n    size: 'medium',\n    selected: false,\n    disabled: false,\n    contentAlignment: 'center',\n    textPosition: 'inside',\n    ellipsis: false,\n    noPadding: false,\n  };\n\n  _renderBackgroundLayout = () => {\n    const { disabled } = this.props;\n\n    return isString(this.props.backgroundImage) ? (\n      <div\n        className={st(classes.backgroundImage, { disabled })}\n        data-hook={dataHooks.thumbnailBackgroundImage}\n        style={{ backgroundImage: `url(${this.props.backgroundImage})` }}\n      />\n    ) : (\n      this.props.backgroundImage\n    );\n  };\n\n  _renderBottomTitle = () => {\n    const { size, title, selected, disabled } = this.props;\n\n    return (\n      <Box align=\"center\">\n        <Text\n          className={st(classes.bottomTitle, { selected, disabled })}\n          dataHook={dataHooks.thumbnailBottomTitle}\n          size={size}\n          tagName=\"div\"\n          weight=\"thin\"\n          ellipsis\n          children={title}\n        />\n      </Box>\n    );\n  };\n\n  _renderThumbnailImage = () => {\n    const { textPosition, image } = this.props;\n\n    return (\n      <div\n        className={st(classes.imageContainer, { textPosition })}\n        data-hook={dataHooks.thumbnailImage}\n      >\n        {isString(image) ? (\n          <img src={image} className={st(classes.image, { textPosition })} />\n        ) : (\n          image\n        )}\n      </div>\n    );\n  };\n\n  _renderTitleAndDescription = () => {\n    const {\n      size,\n      title,\n      disabled,\n      ellipsis,\n      maxLines,\n      description,\n      textPosition,\n    } = this.props;\n\n    return (\n      <div className={st(classes.thumbnailTextContent, { textPosition, size })}>\n        {title && (\n          <Text\n            className={st(classes.title, { size, textPosition })}\n            dataHook={dataHooks.thumbnailTitle}\n            size={size}\n            weight={size === 'tiny' ? 'thin' : 'normal'}\n            children={title}\n            skin={disabled ? 'disabled' : undefined}\n            ellipsis={ellipsis}\n            maxLines={maxLines}\n          />\n        )}\n        {description && (\n          <Text\n            className={classes.description}\n            dataHook={dataHooks.thumbnailDescription}\n            size={size}\n            weight=\"thin\"\n            secondary\n            children={description}\n            skin={disabled ? 'disabled' : undefined}\n            ellipsis={ellipsis}\n            maxLines={maxLines}\n          />\n        )}\n      </div>\n    );\n  };\n\n  _renderSelectedIcon = () => (\n    <div\n      className={classes.selectedIcon}\n      data-hook={dataHooks.thumbnailSelectedIcon}\n    >\n      <CheckboxChecked height=\"7.8\" width=\"10\" />\n    </div>\n  );\n\n  _renderThumbnail = () => {\n    const {\n      selected,\n      disabled,\n      size,\n      width,\n      height,\n      textPosition,\n      children,\n      backgroundImage,\n      image,\n      contentAlignment,\n      newColorsBranding,\n      noPadding,\n    } = this.props;\n\n    const hasChildren = !!this.props.children;\n    const hasBackground = !!backgroundImage;\n\n    const getThumbnailContent = () => {\n      /**\n       * Ignores the rest of the properties and just renders children\n       */\n      if (hasChildren) {\n        return (\n          <div className={st(classes.customChild, { disabled })}>\n            {children}\n          </div>\n        );\n      }\n\n      /**\n       * @deprecated flow\n       */\n      if (hasBackground) {\n        return this._renderBackgroundLayout();\n      }\n\n      return (\n        <div className={st(classes.contentContainer, { textPosition })}>\n          {image && this._renderThumbnailImage()}\n          {textPosition === 'inside' && this._renderTitleAndDescription()}\n        </div>\n      );\n    };\n\n    return (\n      <div\n        style={{ height }}\n        className={st(classes.thumbnail, {\n          selected,\n          disabled,\n          size,\n          hasBackground,\n          hasChildren,\n          textPosition,\n          contentAlignment,\n          newColorsBranding,\n          noPadding,\n        })}\n        data-selected={selected}\n        data-disabled={disabled}\n        tabIndex={disabled ? null : 0}\n        data-hook={dataHooks.thumbnailWrapper}\n      >\n        {!this.props.hideSelectedIcon && selected && this._renderSelectedIcon()}\n        {getThumbnailContent()}\n      </div>\n    );\n  };\n\n  _onKeyDown = event =>\n    this.props.onClick &&\n    [13 /* enter */, 32 /* space */].some(key => event.keyCode === key) &&\n    this.props.onClick(event);\n\n  render() {\n    const {\n      children,\n      backgroundImage,\n      title,\n      width,\n      disabled,\n      className,\n      onClick,\n      dataHook,\n      textPosition,\n    } = this.props;\n\n    const hasChildren = !!children;\n    const hasBackground = !!backgroundImage;\n    const showBottomTitle = (hasChildren || hasBackground) && title;\n\n    return (\n      <WixDesignSystemContext.Consumer>\n        {({ newColorsBranding }) => (\n          <div\n            style={{ width }}\n            className={st(classes.root, { disabled }, className)}\n            onClick={disabled ? null : onClick}\n            onKeyDown={disabled ? null : this._onKeyDown}\n            data-hook={dataHook}\n          >\n            {this._renderThumbnail()}\n            {textPosition === 'outside' && this._renderTitleAndDescription()}\n            {showBottomTitle ? this._renderBottomTitle() : null}\n          </div>\n        )}\n      </WixDesignSystemContext.Consumer>\n    );\n  }\n}\n\nexport default withFocusable(Thumbnail);\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["_react","_interopRequireDefault","require","_propTypes","_ThumbnailSt","_system","_Text","_Focusable","_constants","_Box","_context","_TooltipCommon","_jsxFileName","isString","a","Thumbnail","React","PureComponent","constructor","arguments","_renderBackgroundLayout","disabled","props","backgroundImage","default","createElement","className","st","classes","dataHooks","thumbnailBackgroundImage","style","concat","__self","__source","fileName","lineNumber","columnNumber","_renderBottomTitle","size","title","selected","tooltipProps","align","bottomTitle","dataHook","thumbnailBottomTitle","tagName","weight","ellipsis","children","_renderThumbnailImage","textPosition","image","imageContainer","thumbnailImage","src","_renderTitleAndDescription","maxLines","description","thumbnailTextContent","thumbnailTitle","skin","undefined","thumbnailDescription","secondary","_renderSelectedIcon","selectedIcon","thumbnailSelectedIcon","CheckboxChecked","height","width","_renderThumbnail","contentAlignment","newColorsBranding","noPadding","hasChildren","hasBackground","getThumbnailContent","customChild","contentContainer","thumbnail","tabIndex","thumbnailWrapper","hideSelectedIcon","_onKeyDown","event","onClick","some","key","keyCode","render","showBottomTitle","WixDesignSystemContext","Consumer","_ref","root","onKeyDown","displayName","propTypes","PropTypes","string","node","oneOf","bool","func","oneOfType","number","shape","TooltipCommonProps","defaultProps","_default","exports","withFocusable"],"sources":["../../../src/Thumbnail/Thumbnail.js"],"sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { st, classes } from './Thumbnail.st.css';\nimport { CheckboxChecked } from '@wix/wix-ui-icons-common/system';\nimport Text from '../Text';\nimport { withFocusable } from '../common/Focusable';\nimport { dataHooks } from './constants';\nimport Box from '../Box';\nimport { WixDesignSystemContext } from '../WixDesignSystemProvider/context';\nimport { TooltipCommonProps } from '../common/PropTypes/TooltipCommon';\n\nconst isString = a => typeof a === 'string';\n\n/**\n * # Thumbnail\n * Component for showing thumbnails\n *\n * It takes full space of parent component, works well together with `<Proportion/>`\n * */\nclass Thumbnail extends React.PureComponent {\n  static displayName = 'Thumbnail';\n\n  static propTypes = {\n    /** Applies a data-hook HTML attribute that can be used in the tests. */\n    dataHook: PropTypes.string,\n\n    /** Specifies a CSS class name to be appended to the component’s root element.\n     * @internal\n     */\n\n    className: PropTypes.string,\n\n    /** Renders specified children items inside of the thumbnail. Accepts any kind of content. When passed, title will be rendered below a thumbnail. */\n    children: PropTypes.node,\n\n    /** Sets the title of a thumbnail. */\n    title: PropTypes.node,\n\n    /** Sets thumbnail description. */\n    description: PropTypes.node,\n\n    /** Specifies an image to be displayed inside of a thumbnail.\n     * If given as string, it will be used within `<img/>`.\n     * Otherwise can be given as React.Node\n     */\n    image: PropTypes.node,\n\n    /** Controls the size of a thumbnail. */\n    size: PropTypes.oneOf(['tiny', 'small', 'medium']),\n\n    /** Specifies whether a thumbnail is selected. */\n    selected: PropTypes.bool,\n\n    /** Specifies whether thumbnail interactions are disabled. */\n    disabled: PropTypes.bool,\n\n    /** Hides a checkmark icon that indicates selected thumbnail. Selected option will be highlighted with border only. */\n    hideSelectedIcon: PropTypes.bool,\n\n    /** Render image as a background of a thumbnail. As a result, title is rendered below the image thumbnail. */\n    backgroundImage: PropTypes.node,\n\n    /** Defines a callback function which is called every time a thumbnail is clicked. */\n    onClick: PropTypes.func,\n\n    /** Controls the width of a thumbnail. */\n    width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n\n    /** Controls the height of a thumbnail. */\n    height: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),\n\n    /** Controls vertical alignment of content. */\n    contentAlignment: PropTypes.oneOf(['top', 'center']),\n\n    /** Enables ellipsis text truncation. */\n    ellipsis: PropTypes.bool,\n\n    /** Controls maximum lines that is allowed before ellipsis text truncation is applied */\n    maxLines: PropTypes.number,\n\n    /** Controls text position whether it is outside or inside of a thumbnail */\n    textPosition: PropTypes.oneOf(['inside', 'outside']),\n\n    /** Turns off padding for thumbnail with textPosition='inside' */\n    noPadding: PropTypes.bool,\n\n    /** Allows to pass tooltip common props.\n     * @linkTypeTo components-overlays--tooltip\n     * @setTypeName TooltipCommonProps\n     */\n    tooltipProps: PropTypes.shape(TooltipCommonProps),\n  };\n\n  static defaultProps = {\n    size: 'medium',\n    selected: false,\n    disabled: false,\n    contentAlignment: 'center',\n    textPosition: 'inside',\n    ellipsis: false,\n    noPadding: false,\n  };\n\n  _renderBackgroundLayout = () => {\n    const { disabled } = this.props;\n\n    return isString(this.props.backgroundImage) ? (\n      <div\n        className={st(classes.backgroundImage, { disabled })}\n        data-hook={dataHooks.thumbnailBackgroundImage}\n        style={{ backgroundImage: `url(${this.props.backgroundImage})` }}\n      />\n    ) : (\n      this.props.backgroundImage\n    );\n  };\n\n  _renderBottomTitle = () => {\n    const { size, title, selected, disabled, tooltipProps = {} } = this.props;\n\n    return (\n      <Box align=\"center\">\n        <Text\n          className={st(classes.bottomTitle, { selected, disabled })}\n          dataHook={dataHooks.thumbnailBottomTitle}\n          size={size}\n          tagName=\"div\"\n          weight=\"thin\"\n          ellipsis\n          children={title}\n          tooltipProps={tooltipProps}\n        />\n      </Box>\n    );\n  };\n\n  _renderThumbnailImage = () => {\n    const { textPosition, image } = this.props;\n\n    return (\n      <div\n        className={st(classes.imageContainer, { textPosition })}\n        data-hook={dataHooks.thumbnailImage}\n      >\n        {isString(image) ? (\n          <img src={image} className={st(classes.image, { textPosition })} />\n        ) : (\n          image\n        )}\n      </div>\n    );\n  };\n\n  _renderTitleAndDescription = () => {\n    const {\n      size,\n      title,\n      disabled,\n      ellipsis,\n      maxLines,\n      description,\n      textPosition,\n      tooltipProps = {},\n    } = this.props;\n\n    return (\n      <div className={st(classes.thumbnailTextContent, { textPosition, size })}>\n        {title && (\n          <Text\n            className={st(classes.title, { size, textPosition })}\n            dataHook={dataHooks.thumbnailTitle}\n            size={size}\n            weight={size === 'tiny' ? 'thin' : 'normal'}\n            children={title}\n            skin={disabled ? 'disabled' : undefined}\n            ellipsis={ellipsis}\n            maxLines={maxLines}\n            tooltipProps={tooltipProps}\n          />\n        )}\n        {description && (\n          <Text\n            className={classes.description}\n            dataHook={dataHooks.thumbnailDescription}\n            size={size}\n            weight=\"thin\"\n            secondary\n            children={description}\n            skin={disabled ? 'disabled' : undefined}\n            ellipsis={ellipsis}\n            maxLines={maxLines}\n            tooltipProps={tooltipProps}\n          />\n        )}\n      </div>\n    );\n  };\n\n  _renderSelectedIcon = () => (\n    <div\n      className={classes.selectedIcon}\n      data-hook={dataHooks.thumbnailSelectedIcon}\n    >\n      <CheckboxChecked height=\"7.8\" width=\"10\" />\n    </div>\n  );\n\n  _renderThumbnail = () => {\n    const {\n      selected,\n      disabled,\n      size,\n      width,\n      height,\n      textPosition,\n      children,\n      backgroundImage,\n      image,\n      contentAlignment,\n      newColorsBranding,\n      noPadding,\n    } = this.props;\n\n    const hasChildren = !!this.props.children;\n    const hasBackground = !!backgroundImage;\n\n    const getThumbnailContent = () => {\n      /**\n       * Ignores the rest of the properties and just renders children\n       */\n      if (hasChildren) {\n        return (\n          <div className={st(classes.customChild, { disabled })}>\n            {children}\n          </div>\n        );\n      }\n\n      /**\n       * @deprecated flow\n       */\n      if (hasBackground) {\n        return this._renderBackgroundLayout();\n      }\n\n      return (\n        <div className={st(classes.contentContainer, { textPosition })}>\n          {image && this._renderThumbnailImage()}\n          {textPosition === 'inside' && this._renderTitleAndDescription()}\n        </div>\n      );\n    };\n\n    return (\n      <div\n        style={{ height }}\n        className={st(classes.thumbnail, {\n          selected,\n          disabled,\n          size,\n          hasBackground,\n          hasChildren,\n          textPosition,\n          contentAlignment,\n          newColorsBranding,\n          noPadding,\n        })}\n        data-selected={selected}\n        data-disabled={disabled}\n        tabIndex={disabled ? null : 0}\n        data-hook={dataHooks.thumbnailWrapper}\n      >\n        {!this.props.hideSelectedIcon && selected && this._renderSelectedIcon()}\n        {getThumbnailContent()}\n      </div>\n    );\n  };\n\n  _onKeyDown = event =>\n    this.props.onClick &&\n    [13 /* enter */, 32 /* space */].some(key => event.keyCode === key) &&\n    this.props.onClick(event);\n\n  render() {\n    const {\n      children,\n      backgroundImage,\n      title,\n      width,\n      disabled,\n      className,\n      onClick,\n      dataHook,\n      textPosition,\n    } = this.props;\n\n    const hasChildren = !!children;\n    const hasBackground = !!backgroundImage;\n    const showBottomTitle = (hasChildren || hasBackground) && title;\n\n    return (\n      <WixDesignSystemContext.Consumer>\n        {({ newColorsBranding }) => (\n          <div\n            style={{ width }}\n            className={st(classes.root, { disabled }, className)}\n            onClick={disabled ? null : onClick}\n            onKeyDown={disabled ? null : this._onKeyDown}\n            data-hook={dataHook}\n          >\n            {this._renderThumbnail()}\n            {textPosition === 'outside' && this._renderTitleAndDescription()}\n            {showBottomTitle ? this._renderBottomTitle() : null}\n          </div>\n        )}\n      </WixDesignSystemContext.Consumer>\n    );\n  }\n}\n\nexport default withFocusable(Thumbnail);\n"],"mappings":"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","ignoreList":[]}

package/dist/cjs/Thumbnail/Thumbnail.st.css.js

@@ -8,7 +8,7 @@ const { classesRuntime, statesRuntime } = require("./../stylable-cjs-runtime.js"
 
 
 
-var _namespace_ = "wds_1_160_1_Thumbnail";
+var _namespace_ = "wds_1_161_0_Thumbnail";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 module.exports.cssStates = statesRuntime.bind(null, _namespace_);
@@ -16,7 +16,7 @@ module.exports.style = _style_;
 module.exports.st = _style_;
 
 module.exports.namespace = _namespace_;
-module.exports.classes = {"root":"wds_1_160_1_Thumbnail__root","thumbnail":"wds_1_160_1_Thumbnail__thumbnail","imageContainer":"wds_1_160_1_Thumbnail__imageContainer","selectedIcon":"wds_1_160_1_Thumbnail__selectedIcon","customChild":"wds_1_160_1_Thumbnail__customChild","contentContainer":"wds_1_160_1_Thumbnail__contentContainer","thumbnailTextContent":"wds_1_160_1_Thumbnail__thumbnailTextContent","title":"wds_1_160_1_Thumbnail__title","description":"wds_1_160_1_Thumbnail__description","bottomTitle":"wds_1_160_1_Thumbnail__bottomTitle","image":"wds_1_160_1_Thumbnail__image","backgroundImage":"wds_1_160_1_Thumbnail__backgroundImage"};
+module.exports.classes = {"root":"wds_1_161_0_Thumbnail__root","thumbnail":"wds_1_161_0_Thumbnail__thumbnail","imageContainer":"wds_1_161_0_Thumbnail__imageContainer","selectedIcon":"wds_1_161_0_Thumbnail__selectedIcon","customChild":"wds_1_161_0_Thumbnail__customChild","contentContainer":"wds_1_161_0_Thumbnail__contentContainer","thumbnailTextContent":"wds_1_161_0_Thumbnail__thumbnailTextContent","title":"wds_1_161_0_Thumbnail__title","description":"wds_1_161_0_Thumbnail__description","bottomTitle":"wds_1_161_0_Thumbnail__bottomTitle","image":"wds_1_161_0_Thumbnail__image","backgroundImage":"wds_1_161_0_Thumbnail__backgroundImage"};
 module.exports.keyframes = {}; 
 module.exports.layers = {};
 module.exports.containers = {};

package/dist/cjs/Thumbnail/index.d.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","_interopRequireWildcard","require","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","Thumbnail","PureComponent","exports"],"sources":["../../../src/Thumbnail/index.d.ts"],"sourcesContent":["import * as React from 'react';\n\nexport interface ThumbnailProps {\n  children?: React.ReactNode;\n  dataHook?: string;\n  className?: string;\n  title?: React.ReactNode;\n  description?: React.ReactNode;\n  image?: React.ReactNode;\n  size?: ThumbnailSize;\n  selected?: boolean;\n  disabled?: boolean;\n  hideSelectedIcon?: boolean;\n  backgroundImage?: React.ReactNode;\n  onClick?: (\n    event: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>,\n  ) => void;\n  width?: string | number;\n  height?: string | number;\n  contentAlignment?: ThumbnailContentAlignment;\n  ellipsis?: boolean;\n  maxLines?: number;\n  textPosition?: 'inside' | 'outside';\n  noPadding?: boolean;\n}\n\nexport default class Thumbnail extends React.PureComponent<ThumbnailProps> {}\n\nexport type ThumbnailSize = 'tiny' | 'small' | 'medium';\n\nexport type ThumbnailContentAlignment = 'top' | 'center';\n"],"mappings":";;;;AAAA,IAAAA,KAAA,GAAAC,uBAAA,CAAAC,OAAA;AAA+B,SAAAC,yBAAAC,CAAA,6BAAAC,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,yBAAAC,CAAA,WAAAA,CAAA,GAAAG,CAAA,GAAAD,CAAA,KAAAF,CAAA;AAAA,SAAAH,wBAAAG,CAAA,EAAAE,CAAA,SAAAA,CAAA,IAAAF,CAAA,IAAAA,CAAA,CAAAI,UAAA,SAAAJ,CAAA,eAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,WAAAK,OAAA,EAAAL,CAAA,QAAAG,CAAA,GAAAJ,wBAAA,CAAAG,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAG,GAAA,CAAAN,CAAA,UAAAG,CAAA,CAAAI,GAAA,CAAAP,CAAA,OAAAQ,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAd,CAAA,oBAAAc,CAAA,OAAAC,cAAA,CAAAC,IAAA,CAAAhB,CAAA,EAAAc,CAAA,SAAAG,CAAA,GAAAP,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAb,CAAA,EAAAc,CAAA,UAAAG,CAAA,KAAAA,CAAA,CAAAV,GAAA,IAAAU,CAAA,CAAAC,GAAA,IAAAP,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAG,CAAA,IAAAT,CAAA,CAAAM,CAAA,IAAAd,CAAA,CAAAc,CAAA,YAAAN,CAAA,CAAAH,OAAA,GAAAL,CAAA,EAAAG,CAAA,IAAAA,CAAA,CAAAe,GAAA,CAAAlB,CAAA,EAAAQ,CAAA,GAAAA,CAAA;AA0BhB,MAAMW,SAAS,SAASvB,KAAK,CAACwB,aAAa,CAAiB;AAAEC,OAAA,CAAAhB,OAAA,GAAAc,SAAA","ignoreList":[]}
+{"version":3,"names":["React","_interopRequireWildcard","require","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","Thumbnail","PureComponent","exports"],"sources":["../../../src/Thumbnail/index.d.ts"],"sourcesContent":["import * as React from 'react';\nimport { TooltipCommonProps } from '../common';\n\nexport interface ThumbnailProps {\n  children?: React.ReactNode;\n  dataHook?: string;\n  className?: string;\n  title?: React.ReactNode;\n  description?: React.ReactNode;\n  image?: React.ReactNode;\n  size?: ThumbnailSize;\n  selected?: boolean;\n  disabled?: boolean;\n  hideSelectedIcon?: boolean;\n  backgroundImage?: React.ReactNode;\n  onClick?: (\n    event: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>,\n  ) => void;\n  width?: string | number;\n  height?: string | number;\n  contentAlignment?: ThumbnailContentAlignment;\n  ellipsis?: boolean;\n  maxLines?: number;\n  textPosition?: 'inside' | 'outside';\n  noPadding?: boolean;\n  /** Allows to pass all common tooltip props.\n   * @linkTypeTo components-overlays--tooltip\n   * @setTypeName TooltipCommonProps\n   */\n  tooltipProps?: TooltipCommonProps;\n}\n\nexport default class Thumbnail extends React.PureComponent<ThumbnailProps> {}\n\nexport type ThumbnailSize = 'tiny' | 'small' | 'medium';\n\nexport type ThumbnailContentAlignment = 'top' | 'center';\n"],"mappings":";;;;AAAA,IAAAA,KAAA,GAAAC,uBAAA,CAAAC,OAAA;AAA+B,SAAAC,yBAAAC,CAAA,6BAAAC,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,yBAAAC,CAAA,WAAAA,CAAA,GAAAG,CAAA,GAAAD,CAAA,KAAAF,CAAA;AAAA,SAAAH,wBAAAG,CAAA,EAAAE,CAAA,SAAAA,CAAA,IAAAF,CAAA,IAAAA,CAAA,CAAAI,UAAA,SAAAJ,CAAA,eAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,WAAAK,OAAA,EAAAL,CAAA,QAAAG,CAAA,GAAAJ,wBAAA,CAAAG,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAG,GAAA,CAAAN,CAAA,UAAAG,CAAA,CAAAI,GAAA,CAAAP,CAAA,OAAAQ,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAd,CAAA,oBAAAc,CAAA,OAAAC,cAAA,CAAAC,IAAA,CAAAhB,CAAA,EAAAc,CAAA,SAAAG,CAAA,GAAAP,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAb,CAAA,EAAAc,CAAA,UAAAG,CAAA,KAAAA,CAAA,CAAAV,GAAA,IAAAU,CAAA,CAAAC,GAAA,IAAAP,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAG,CAAA,IAAAT,CAAA,CAAAM,CAAA,IAAAd,CAAA,CAAAc,CAAA,YAAAN,CAAA,CAAAH,OAAA,GAAAL,CAAA,EAAAG,CAAA,IAAAA,CAAA,CAAAe,GAAA,CAAAlB,CAAA,EAAAQ,CAAA,GAAAA,CAAA;AAgChB,MAAMW,SAAS,SAASvB,KAAK,CAACwB,aAAa,CAAiB;AAAEC,OAAA,CAAAhB,OAAA,GAAAc,SAAA","ignoreList":[]}

package/dist/cjs/TimeInput/TimeInput.st.css.js

@@ -4,7 +4,7 @@ const { classesRuntime, statesRuntime } = require("./../stylable-cjs-runtime.js"
 
 
 
-var _namespace_ = "wds_1_160_1_TimeInput";
+var _namespace_ = "wds_1_161_0_TimeInput";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 module.exports.cssStates = statesRuntime.bind(null, _namespace_);
@@ -12,7 +12,7 @@ module.exports.style = _style_;
 module.exports.st = _style_;
 
 module.exports.namespace = _namespace_;
-module.exports.classes = {"root":"wds_1_160_1_TimeInput__root"};
+module.exports.classes = {"root":"wds_1_161_0_TimeInput__root"};
 module.exports.keyframes = {}; 
 module.exports.layers = {};
 module.exports.containers = {};

package/dist/cjs/TimeTable/TimeTable.st.css.js

@@ -7,7 +7,7 @@ const { classesRuntime, statesRuntime } = require("./../stylable-cjs-runtime.js"
 
 
 
-var _namespace_ = "wds_1_160_1_TimeTable";
+var _namespace_ = "wds_1_161_0_TimeTable";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 module.exports.cssStates = statesRuntime.bind(null, _namespace_);
@@ -15,7 +15,7 @@ module.exports.style = _style_;
 module.exports.st = _style_;
 
 module.exports.namespace = _namespace_;
-module.exports.classes = {"root":"wds_1_160_1_TimeTable__root","text-medium-thin":"wds_1_160_1_StylableTypography__text-medium-thin","text-medium-normal":"wds_1_160_1_StylableTypography__text-medium-normal","text-medium-bold":"wds_1_160_1_StylableTypography__text-medium-bold","text-tiny-normal":"wds_1_160_1_StylableTypography__text-tiny-normal","text-tiny-thin":"wds_1_160_1_StylableTypography__text-tiny-thin","text-tiny-bold":"wds_1_160_1_StylableTypography__text-tiny-bold","defaultScrollBar":"wds_1_160_1_defaultscrollbar__defaultScrollBar","column":"wds_1_160_1_TimeTable__column","header":"wds_1_160_1_TimeTable__header","title":"wds_1_160_1_TimeTable__title","subtitle":"wds_1_160_1_TimeTable__subtitle","item":"wds_1_160_1_TimeTable__item","actionsContainer":"wds_1_160_1_TimeTable__actionsContainer","addItemButton":"wds_1_160_1_TimeTable__addItemButton","addItemLabel":"wds_1_160_1_TimeTable__addItemLabel","headerContainer":"wds_1_160_1_TimeTable__headerContainer","contentContainer":"wds_1_160_1_TimeTable__contentContainer","content":"wds_1_160_1_TimeTable__content"};
+module.exports.classes = {"root":"wds_1_161_0_TimeTable__root","text-medium-thin":"wds_1_161_0_StylableTypography__text-medium-thin","text-medium-normal":"wds_1_161_0_StylableTypography__text-medium-normal","text-medium-bold":"wds_1_161_0_StylableTypography__text-medium-bold","text-tiny-normal":"wds_1_161_0_StylableTypography__text-tiny-normal","text-tiny-thin":"wds_1_161_0_StylableTypography__text-tiny-thin","text-tiny-bold":"wds_1_161_0_StylableTypography__text-tiny-bold","defaultScrollBar":"wds_1_161_0_defaultscrollbar__defaultScrollBar","column":"wds_1_161_0_TimeTable__column","header":"wds_1_161_0_TimeTable__header","title":"wds_1_161_0_TimeTable__title","subtitle":"wds_1_161_0_TimeTable__subtitle","item":"wds_1_161_0_TimeTable__item","actionsContainer":"wds_1_161_0_TimeTable__actionsContainer","addItemButton":"wds_1_161_0_TimeTable__addItemButton","addItemLabel":"wds_1_161_0_TimeTable__addItemLabel","headerContainer":"wds_1_161_0_TimeTable__headerContainer","contentContainer":"wds_1_161_0_TimeTable__contentContainer","content":"wds_1_161_0_TimeTable__content"};
 module.exports.keyframes = {}; 
 module.exports.layers = {};
 module.exports.containers = {};

package/dist/cjs/TimeTable/components/Item.st.css.js

@@ -5,7 +5,7 @@ const { classesRuntime, statesRuntime } = require("./../../stylable-cjs-runtime.
 
 
 
-var _namespace_ = "wds_1_160_1_TimeTableItem";
+var _namespace_ = "wds_1_161_0_TimeTableItem";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 module.exports.cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ module.exports.style = _style_;
 module.exports.st = _style_;
 
 module.exports.namespace = _namespace_;
-module.exports.classes = {"root":"wds_1_160_1_TimeTableItem__root","text-tiny-thin":"wds_1_160_1_StylableTypography__text-tiny-thin"};
+module.exports.classes = {"root":"wds_1_161_0_TimeTableItem__root","text-tiny-thin":"wds_1_161_0_StylableTypography__text-tiny-thin"};
 module.exports.keyframes = {}; 
 module.exports.layers = {};
 module.exports.containers = {};

package/dist/cjs/Timeline/Timeline.st.css.js

@@ -4,7 +4,7 @@ const { classesRuntime, statesRuntime } = require("./../stylable-cjs-runtime.js"
 
 
 
-var _namespace_ = "wds_1_160_1_Timeline";
+var _namespace_ = "wds_1_161_0_Timeline";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 module.exports.cssStates = statesRuntime.bind(null, _namespace_);
@@ -12,7 +12,7 @@ module.exports.style = _style_;
 module.exports.st = _style_;
 
 module.exports.namespace = _namespace_;
-module.exports.classes = {"root":"wds_1_160_1_Timeline__root"};
+module.exports.classes = {"root":"wds_1_161_0_Timeline__root"};
 module.exports.keyframes = {}; 
 module.exports.layers = {};
 module.exports.containers = {};

package/dist/cjs/Timeline/TimelineItem.st.css.js

@@ -4,7 +4,7 @@ const { classesRuntime, statesRuntime } = require("./../stylable-cjs-runtime.js"
 
 
 
-var _namespace_ = "wds_1_160_1_TimelineItem";
+var _namespace_ = "wds_1_161_0_TimelineItem";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 module.exports.cssStates = statesRuntime.bind(null, _namespace_);
@@ -12,12 +12,12 @@ module.exports.style = _style_;
 module.exports.st = _style_;
 
 module.exports.namespace = _namespace_;
-module.exports.classes = {"root":"wds_1_160_1_TimelineItem__root","event":"wds_1_160_1_TimelineItem__event","prefix":"wds_1_160_1_TimelineItem__prefix","line":"wds_1_160_1_TimelineItem__line","defaultIndicator":"wds_1_160_1_TimelineItem__defaultIndicator","label":"wds_1_160_1_TimelineItem__label","labelText":"wds_1_160_1_TimelineItem__labelText","suffix":"wds_1_160_1_TimelineItem__suffix","labelAction":"wds_1_160_1_TimelineItem__labelAction"};
+module.exports.classes = {"root":"wds_1_161_0_TimelineItem__root","event":"wds_1_161_0_TimelineItem__event","prefix":"wds_1_161_0_TimelineItem__prefix","line":"wds_1_161_0_TimelineItem__line","defaultIndicator":"wds_1_161_0_TimelineItem__defaultIndicator","label":"wds_1_161_0_TimelineItem__label","labelText":"wds_1_161_0_TimelineItem__labelText","suffix":"wds_1_161_0_TimelineItem__suffix","labelAction":"wds_1_161_0_TimelineItem__labelAction"};
 module.exports.keyframes = {}; 
 module.exports.layers = {};
 module.exports.containers = {};
 module.exports.stVars = {"listItemHeight":"18px","inidicatorSize":"7px"}; 
-module.exports.vars = {"listItemHeight":"--wds_1_160_1_TimelineItem-listItemHeight","marginBottom":"--wds_1_160_1_TimelineItem-marginBottom"}; 
+module.exports.vars = {"listItemHeight":"--wds_1_161_0_TimelineItem-listItemHeight","marginBottom":"--wds_1_161_0_TimelineItem-marginBottom"}; 
 
 
 

package/dist/cjs/Toast/Toast.st.css.js

@@ -6,7 +6,7 @@ const { classesRuntime, statesRuntime } = require("./../stylable-cjs-runtime.js"
 
 
 
-var _namespace_ = "wds_1_160_1_Toast";
+var _namespace_ = "wds_1_161_0_Toast";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 module.exports.cssStates = statesRuntime.bind(null, _namespace_);
@@ -14,7 +14,7 @@ module.exports.style = _style_;
 module.exports.st = _style_;
 
 module.exports.namespace = _namespace_;
-module.exports.classes = {"root":"wds_1_160_1_Toast__root","content":"wds_1_160_1_Toast__content","dismiss":"wds_1_160_1_Toast__dismiss"};
+module.exports.classes = {"root":"wds_1_161_0_Toast__root","content":"wds_1_161_0_Toast__content","dismiss":"wds_1_161_0_Toast__dismiss"};
 module.exports.keyframes = {}; 
 module.exports.layers = {};
 module.exports.containers = {};

package/dist/cjs/ToastContainer/ToastContainer.st.css.js

@@ -4,7 +4,7 @@ const { classesRuntime, statesRuntime } = require("./../stylable-cjs-runtime.js"
 
 
 
-var _namespace_ = "wds_1_160_1_ToastContainer";
+var _namespace_ = "wds_1_161_0_ToastContainer";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 module.exports.cssStates = statesRuntime.bind(null, _namespace_);
@@ -12,7 +12,7 @@ module.exports.style = _style_;
 module.exports.st = _style_;
 
 module.exports.namespace = _namespace_;
-module.exports.classes = {"root":"wds_1_160_1_ToastContainer__root"};
+module.exports.classes = {"root":"wds_1_161_0_ToastContainer__root"};
 module.exports.keyframes = {}; 
 module.exports.layers = {};
 module.exports.containers = {};

package/dist/cjs/ToggleButton/ToggleButton.st.css.js

@@ -9,7 +9,7 @@ const { classesRuntime, statesRuntime } = require("./../stylable-cjs-runtime.js"
 
 
 
-var _namespace_ = "wds_1_160_1_ToggleButton";
+var _namespace_ = "wds_1_161_0_ToggleButton";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 module.exports.cssStates = statesRuntime.bind(null, _namespace_);
@@ -17,7 +17,7 @@ module.exports.style = _style_;
 module.exports.st = _style_;
 
 module.exports.namespace = _namespace_;
-module.exports.classes = {"root":"wds_1_160_1_ToggleButton__root","label":"wds_1_160_1_ToggleButton__label","icon":"wds_1_160_1_ToggleButton__icon","labelContainer":"wds_1_160_1_ToggleButton__labelContainer","tooltip":"wds_1_160_1_ToggleButton__tooltip"};
+module.exports.classes = {"root":"wds_1_161_0_ToggleButton__root","label":"wds_1_161_0_ToggleButton__label","icon":"wds_1_161_0_ToggleButton__icon","labelContainer":"wds_1_161_0_ToggleButton__labelContainer","tooltip":"wds_1_161_0_ToggleButton__tooltip"};
 module.exports.keyframes = {}; 
 module.exports.layers = {};
 module.exports.containers = {};

package/dist/cjs/ToggleSwitch/ToggleSwitch.st.css.js

@@ -10,7 +10,7 @@ const { classesRuntime, statesRuntime } = require("./../stylable-cjs-runtime.js"
 
 
 
-var _namespace_ = "wds_1_160_1_ToggleSwitch";
+var _namespace_ = "wds_1_161_0_ToggleSwitch";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 module.exports.cssStates = statesRuntime.bind(null, _namespace_);
@@ -18,7 +18,7 @@ module.exports.style = _style_;
 module.exports.st = _style_;
 
 module.exports.namespace = _namespace_;
-module.exports.classes = {"root":"wds_1_160_1_ToggleSwitch__root"};
+module.exports.classes = {"root":"wds_1_161_0_ToggleSwitch__root"};
 module.exports.keyframes = {}; 
 module.exports.layers = {};
 module.exports.containers = {};

package/dist/cjs/ToggleSwitch/ToggleSwitchCore/ToggleSwitchCore.st.css.js

@@ -4,7 +4,7 @@ const { classesRuntime, statesRuntime } = require("./../../stylable-cjs-runtime.
 
 
 
-var _namespace_ = "wds_1_160_1_ToggleSwitchCore";
+var _namespace_ = "wds_1_161_0_ToggleSwitchCore";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 module.exports.cssStates = statesRuntime.bind(null, _namespace_);
@@ -12,7 +12,7 @@ module.exports.style = _style_;
 module.exports.st = _style_;
 
 module.exports.namespace = _namespace_;
-module.exports.classes = {"root":"wds_1_160_1_ToggleSwitchCore__root","input":"wds_1_160_1_ToggleSwitchCore__input","track":"wds_1_160_1_ToggleSwitchCore__track","knob":"wds_1_160_1_ToggleSwitchCore__knob","knobIcon":"wds_1_160_1_ToggleSwitchCore__knobIcon"};
+module.exports.classes = {"root":"wds_1_161_0_ToggleSwitchCore__root","input":"wds_1_161_0_ToggleSwitchCore__input","track":"wds_1_161_0_ToggleSwitchCore__track","knob":"wds_1_161_0_ToggleSwitchCore__knob","knobIcon":"wds_1_161_0_ToggleSwitchCore__knobIcon"};
 module.exports.keyframes = {}; 
 module.exports.layers = {};
 module.exports.containers = {};

package/dist/cjs/ToggleSwitch/ToggleSwitchCore/ToggleSwitchCoreColor.st.css.js

@@ -5,7 +5,7 @@ const { classesRuntime, statesRuntime } = require("./../../stylable-cjs-runtime.
 
 
 
-var _namespace_ = "wds_1_160_1_ToggleSwitchCoreColor";
+var _namespace_ = "wds_1_161_0_ToggleSwitchCoreColor";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 module.exports.cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ module.exports.style = _style_;
 module.exports.st = _style_;
 
 module.exports.namespace = _namespace_;
-module.exports.classes = {"root":"wds_1_160_1_ToggleSwitchCoreColor__root"};
+module.exports.classes = {"root":"wds_1_161_0_ToggleSwitchCoreColor__root"};
 module.exports.keyframes = {}; 
 module.exports.layers = {};
 module.exports.containers = {};

package/dist/cjs/ToggleSwitch/ToggleSwitchCore/ToggleSwitchCoreLayout.st.css.js

@@ -5,7 +5,7 @@ const { classesRuntime, statesRuntime } = require("./../../stylable-cjs-runtime.
 
 
 
-var _namespace_ = "wds_1_160_1_ToggleSwitchCoreLayout";
+var _namespace_ = "wds_1_161_0_ToggleSwitchCoreLayout";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 module.exports.cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ module.exports.style = _style_;
 module.exports.st = _style_;
 
 module.exports.namespace = _namespace_;
-module.exports.classes = {"root":"wds_1_160_1_ToggleSwitchCoreLayout__root"};
+module.exports.classes = {"root":"wds_1_161_0_ToggleSwitchCoreLayout__root"};
 module.exports.keyframes = {}; 
 module.exports.layers = {};
 module.exports.containers = {};

package/dist/cjs/ToggleSwitch/ToggleSwitchCore/ToggleSwitchCoreStyle.st.css.js

@@ -5,7 +5,7 @@ const { classesRuntime, statesRuntime } = require("./../../stylable-cjs-runtime.
 
 
 
-var _namespace_ = "wds_1_160_1_ToggleSwitchCoreStyle";
+var _namespace_ = "wds_1_161_0_ToggleSwitchCoreStyle";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 module.exports.cssStates = statesRuntime.bind(null, _namespace_);
@@ -13,7 +13,7 @@ module.exports.style = _style_;
 module.exports.st = _style_;
 
 module.exports.namespace = _namespace_;
-module.exports.classes = {"root":"wds_1_160_1_ToggleSwitchCoreStyle__root"};
+module.exports.classes = {"root":"wds_1_161_0_ToggleSwitchCoreStyle__root"};
 module.exports.keyframes = {}; 
 module.exports.layers = {};
 module.exports.containers = {};

package/dist/cjs/Tooltip/Tooltip.st.css.js

@@ -7,7 +7,7 @@ const { classesRuntime, statesRuntime } = require("./../stylable-cjs-runtime.js"
 
 
 
-var _namespace_ = "wds_1_160_1_Tooltip";
+var _namespace_ = "wds_1_161_0_Tooltip";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 module.exports.cssStates = statesRuntime.bind(null, _namespace_);
@@ -15,7 +15,7 @@ module.exports.style = _style_;
 module.exports.st = _style_;
 
 module.exports.namespace = _namespace_;
-module.exports.classes = {"root":"wds_1_160_1_Tooltip__root","text-small-normal":"wds_1_160_1_StylableTypography__text-small-normal","text-tiny-thin":"wds_1_160_1_StylableTypography__text-tiny-thin","text":"wds_1_160_1_Tooltip__text"};
+module.exports.classes = {"root":"wds_1_161_0_Tooltip__root","text-small-normal":"wds_1_161_0_StylableTypography__text-small-normal","text-tiny-thin":"wds_1_161_0_StylableTypography__text-tiny-thin","text":"wds_1_161_0_Tooltip__text"};
 module.exports.keyframes = {}; 
 module.exports.layers = {};
 module.exports.containers = {};

package/dist/cjs/TopBanner/TopBanner.st.css.js

@@ -6,7 +6,7 @@ const { classesRuntime, statesRuntime } = require("./../stylable-cjs-runtime.js"
 
 
 
-var _namespace_ = "wds_1_160_1_TopBanner";
+var _namespace_ = "wds_1_161_0_TopBanner";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 module.exports.cssStates = statesRuntime.bind(null, _namespace_);
@@ -14,7 +14,7 @@ module.exports.style = _style_;
 module.exports.st = _style_;
 
 module.exports.namespace = _namespace_;
-module.exports.classes = {"root":"wds_1_160_1_TopBanner__root","contentContainer":"wds_1_160_1_TopBanner__contentContainer","action":"wds_1_160_1_TopBanner__action"};
+module.exports.classes = {"root":"wds_1_161_0_TopBanner__root","contentContainer":"wds_1_161_0_TopBanner__contentContainer","action":"wds_1_161_0_TopBanner__action"};
 module.exports.keyframes = {}; 
 module.exports.layers = {};
 module.exports.containers = {};

package/dist/cjs/TrendIndicator/TrendIndicator.st.css.js

@@ -6,7 +6,7 @@ const { classesRuntime, statesRuntime } = require("./../stylable-cjs-runtime.js"
 
 
 
-var _namespace_ = "wds_1_160_1_TrendIndicator";
+var _namespace_ = "wds_1_161_0_TrendIndicator";
 var _style_ = classesRuntime.bind(null, _namespace_);
 
 module.exports.cssStates = statesRuntime.bind(null, _namespace_);
@@ -14,7 +14,7 @@ module.exports.style = _style_;
 module.exports.st = _style_;
 
 module.exports.namespace = _namespace_;
-module.exports.classes = {"root":"wds_1_160_1_TrendIndicator__root","caption":"wds_1_160_1_TrendIndicator__caption","icon":"wds_1_160_1_TrendIndicator__icon"};
+module.exports.classes = {"root":"wds_1_161_0_TrendIndicator__root","caption":"wds_1_161_0_TrendIndicator__caption","icon":"wds_1_161_0_TrendIndicator__icon"};
 module.exports.keyframes = {}; 
 module.exports.layers = {};
 module.exports.containers = {};