@salutejs/plasma-new-hope 0.78.0-canary.1185.8915022482.0 → 0.78.0-canary.1195.8913931601.0

package/styled-components/cjs/components/Dropdown/utils/index.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.getValidComponent = exports.getPlacements = exports.getPlacement = exports.getCorrectHeight = exports.childrenWithProps = void 0;
+exports.getValidComponent = exports.getPlacements = exports.getPlacement = void 0;
 var _react = /*#__PURE__*/_interopRequireWildcard( /*#__PURE__*/require("react"));
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
 function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
@@ -23,20 +23,6 @@ var getPlacements = exports.getPlacements = function getPlacements(placements) {
     return getPlacement(placement);
   });
 };
-var getCorrectHeight = exports.getCorrectHeight = function getCorrectHeight(listHeight) {
-  if (Number.isNaN(Number(listHeight))) {
-    return listHeight.toString();
-  }
-  return "".concat(listHeight, "rem");
-};
-var childrenWithProps = exports.childrenWithProps = function childrenWithProps(children, additionalProps) {
-  return _react.Children.map(children, function (child) {
-    if ( /*#__PURE__*/_react["default"].isValidElement(child)) {
-      return /*#__PURE__*/_react["default"].cloneElement(child, additionalProps);
-    }
-    return child;
-  });
-};
 var isReactObject = function isReactObject(element) {
   return _typeof(element) === 'object' || typeof element === 'function';
 };

package/styled-components/cjs/components/Dropdown/variations/_size/tokens.json

@@ -1 +1,9 @@
-[]
+[
+    " --plasma-dropdown-width",
+    " --plasma-dropdown-height",
+    " --plasma-dropdown-border-radius",
+    " --plasma-dropdown-padding-top",
+    " --plasma-dropdown-padding-right",
+    " --plasma-dropdown-padding-bottom",
+    " --plasma-dropdown-padding-left"
+]

package/styled-components/cjs/components/Dropdown/variations/_view/tokens.json

@@ -1 +1 @@
-[]
+["--plasma-dropdown-background", "--plasma-dropdown-box-shadow"]

package/styled-components/cjs/components/IconButton/IconButton.js

@@ -0,0 +1,86 @@
+"use strict";
+
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.iconButtonRoot = exports.iconButtonConfig = void 0;
+var _react = /*#__PURE__*/_interopRequireWildcard( /*#__PURE__*/require("react"));
+var _utils = /*#__PURE__*/require("../../utils");
+var _IconButton = /*#__PURE__*/require("./IconButton.styles");
+var _IconButton2 = /*#__PURE__*/require("./IconButton.tokens");
+var _base = /*#__PURE__*/require("./variations/_view/base");
+var _base2 = /*#__PURE__*/require("./variations/_size/base");
+var _base3 = /*#__PURE__*/require("./variations/_disabled/base");
+var _base4 = /*#__PURE__*/require("./variations/_focused/base");
+var _excluded = ["children", "view", "size", "icon", "isLoading", "loader", "pin", "disabled", "focused", "outlined", "className", "style"];
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+var iconButtonRoot = exports.iconButtonRoot = function iconButtonRoot(Root) {
+  return /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
+    var children = props.children,
+      view = props.view,
+      size = props.size,
+      icon = props.icon,
+      isLoading = props.isLoading,
+      loader = props.loader,
+      pin = props.pin,
+      disabled = props.disabled,
+      focused = props.focused,
+      outlined = props.outlined,
+      className = props.className,
+      style = props.style,
+      rest = _objectWithoutProperties(props, _excluded);
+    return /*#__PURE__*/_react["default"].createElement(Root, {
+      view: view,
+      size: size,
+      focused: focused,
+      disabled: disabled,
+      className: _IconButton2.classes.iconButtonItem
+    }, /*#__PURE__*/_react["default"].createElement(_IconButton.IconButtonStyled, _extends({
+      view: view,
+      size: size,
+      loader: loader,
+      isLoading: isLoading,
+      pin: pin,
+      disabled: disabled,
+      focused: focused,
+      outlined: outlined,
+      ref: ref,
+      square: true // Временное решение
+      ,
+      stretching: "fixed" // Не работает не понятное почему
+      ,
+      className: (0, _utils.cx)(className),
+      style: style
+    }, rest), icon || children));
+  });
+};
+var iconButtonConfig = exports.iconButtonConfig = {
+  name: 'Button',
+  tag: 'div',
+  layout: iconButtonRoot,
+  base: _IconButton.base,
+  variations: {
+    view: {
+      css: _base.base
+    },
+    size: {
+      css: _base2.base
+    },
+    disabled: {
+      css: _base3.base,
+      attrs: true
+    },
+    focused: {
+      css: _base4.base
+    }
+  },
+  defaults: {
+    view: 'secondary',
+    size: 'm'
+  }
+};

package/styled-components/cjs/components/IconButton/IconButton.styles.js

@@ -0,0 +1,19 @@
+"use strict";
+
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.base = exports.IconButtonStyled = void 0;
+var _styledComponents = /*#__PURE__*/_interopRequireWildcard( /*#__PURE__*/require("styled-components"));
+var _engines = /*#__PURE__*/require("../../engines");
+var _Button = /*#__PURE__*/require("../Button");
+var _IconButton = /*#__PURE__*/require("./IconButton.tokens");
+function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
+function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
+var mergedConfig = /*#__PURE__*/(0, _engines.mergeConfig)(_Button.buttonConfig);
+var Button = /*#__PURE__*/(0, _engines.component)(mergedConfig);
+var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(["&&.", "{display:inline-flex;}"], _IconButton.classes.iconButtonItem);
+var IconButtonStyled = exports.IconButtonStyled = /*#__PURE__*/(0, _styledComponents["default"])(Button).withConfig({
+  componentId: "plasma-new-hope__sc-bil9m7-0"
+})(["", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");", ":var(", ");"], _Button.buttonTokens.buttonColor, _IconButton.tokens.iconButtonColor, _Button.buttonTokens.buttonBackgroundColor, _IconButton.tokens.iconButtonBackgroundColor, _Button.buttonTokens.buttonColorHover, _IconButton.tokens.iconButtonColorHover, _Button.buttonTokens.buttonBackgroundColorHover, _IconButton.tokens.iconButtonBackgroundColorHover, _Button.buttonTokens.buttonColorActive, _IconButton.tokens.iconButtonColorActive, _Button.buttonTokens.buttonBackgroundColorActive, _IconButton.tokens.iconButtonBackgroundColorActive, _Button.buttonTokens.buttonFontFamily, _IconButton.tokens.iconButtonFontFamily, _Button.buttonTokens.buttonFontSize, _IconButton.tokens.iconButtonFontSize, _Button.buttonTokens.buttonFontStyle, _IconButton.tokens.iconButtonFontStyle, _Button.buttonTokens.buttonFontWeight, _IconButton.tokens.iconButtonFontWeight, _Button.buttonTokens.buttonLetterSpacing, _IconButton.tokens.iconButtonLetterSpacing, _Button.buttonTokens.buttonLineHeight, _IconButton.tokens.iconButtonLineHeight, _Button.buttonTokens.buttonWidth, _IconButton.tokens.iconButtonWidth, _Button.buttonTokens.buttonHeight, _IconButton.tokens.iconButtonHeight, _Button.buttonTokens.buttonRadius, _IconButton.tokens.iconButtonRadius, _Button.buttonTokens.buttonDisabledOpacity, _IconButton.tokens.iconButtonDisabledOpacity, _Button.buttonTokens.buttonFocusColor, _IconButton.tokens.iconButtonFocusColor, _Button.buttonTokens.buttonSpinnerSize, _IconButton.tokens.iconButtonSpinnerSize, _Button.buttonTokens.buttonSpinnerColor, _IconButton.tokens.iconButtonSpinnerColor);

package/styled-components/cjs/components/IconButton/IconButton.tokens.js

@@ -0,0 +1,34 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.tokens = exports.classes = void 0;
+var classes = exports.classes = {
+  iconButtonItem: 'icon-button-item'
+};
+var tokens = exports.tokens = {
+  iconButtonColor: '--plasma-icon-button-color',
+  iconButtonBackgroundColor: '--plasma-icon-button-background-color',
+  iconButtonColorHover: '--plasma-icon-button-color-hover',
+  iconButtonBackgroundColorHover: '--plasma-icon-button-background-color-hover',
+  iconButtonColorActive: '--plasma-icon-button-color-active',
+  iconButtonBackgroundColorActive: '--plasma-icon-button-background-color-active',
+  iconButtonScaleHover: '--plasma-icon-button-scale-hover',
+  iconButtonScaleActive: '---plasma-icon-button-scale-active',
+  iconButtonHeight: '--plasma-icon-button-height',
+  iconButtonWidth: '--plasma-icon-button-width',
+  iconButtonPadding: '--plasma-icon-button-padding',
+  iconButtonRadius: '--plasma-icon-button-radius',
+  iconButtonRadiusCircle: '--plasma-icon-button-radius-circle',
+  iconButtonFontFamily: '--plasma-icon-button-font-family',
+  iconButtonFontSize: '--plasma-icon-button-font-size',
+  iconButtonFontStyle: '--plasma-icon-button-font-style',
+  iconButtonFontWeight: '--plasma-icon-button-font-weight',
+  iconButtonLetterSpacing: '--plasma-icon-button-letter-spacing',
+  iconButtonLineHeight: '--plasma-icon-button-line-height',
+  iconButtonDisabledOpacity: '--plasma-icon-button-disabled-opacity',
+  iconButtonFocusColor: '--plasma-icon-button-focus-color',
+  iconButtonSpinnerColor: '--plasma-icon-button-spinner-color',
+  iconButtonSpinnerSize: '--plasma-icon-button-spinner-size'
+};

package/styled-components/cjs/components/IconButton/index.js

@@ -0,0 +1,31 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "iconButtonClasses", {
+  enumerable: true,
+  get: function get() {
+    return _IconButton2.classes;
+  }
+});
+Object.defineProperty(exports, "iconButtonConfig", {
+  enumerable: true,
+  get: function get() {
+    return _IconButton.iconButtonConfig;
+  }
+});
+Object.defineProperty(exports, "iconButtonRoot", {
+  enumerable: true,
+  get: function get() {
+    return _IconButton.iconButtonRoot;
+  }
+});
+Object.defineProperty(exports, "iconButtonTokens", {
+  enumerable: true,
+  get: function get() {
+    return _IconButton2.tokens;
+  }
+});
+var _IconButton = /*#__PURE__*/require("./IconButton");
+var _IconButton2 = /*#__PURE__*/require("./IconButton.tokens");

package/styled-components/cjs/components/IconButton/variations/_disabled/base.js

@@ -0,0 +1,8 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.base = void 0;
+var _styledComponents = /*#__PURE__*/require("styled-components");
+var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)([""]);

package/styled-components/cjs/components/IconButton/variations/_disabled/tokens.json

@@ -0,0 +1 @@
+{}

package/styled-components/cjs/components/IconButton/variations/_focused/base.js

@@ -0,0 +1,8 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.base = void 0;
+var _styledComponents = /*#__PURE__*/require("styled-components");
+var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)([""]);

package/styled-components/cjs/components/IconButton/variations/_focused/tokens.json

@@ -0,0 +1 @@
+{}

package/styled-components/cjs/components/IconButton/variations/_size/base.js

@@ -0,0 +1,8 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.base = void 0;
+var _styledComponents = /*#__PURE__*/require("styled-components");
+var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)([""]);

package/styled-components/cjs/components/IconButton/variations/_size/tokens.json

@@ -0,0 +1 @@
+{}

package/styled-components/cjs/components/IconButton/variations/_view/base.js

@@ -0,0 +1,8 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.base = void 0;
+var _styledComponents = /*#__PURE__*/require("styled-components");
+var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)([""]);

package/styled-components/cjs/components/IconButton/variations/_view/tokens.json

@@ -0,0 +1 @@
+{}

package/styled-components/cjs/components/Select/ui/SelectItem/SelectItem.js

@@ -8,7 +8,7 @@ var _Dropdown = /*#__PURE__*/require("../../../Dropdown");
 var _base = /*#__PURE__*/require("./variations/_view/base");
 var _base2 = /*#__PURE__*/require("./variations/_size/base");
 var _SelectItem = /*#__PURE__*/require("./SelectItem.styles");
-var selectItemRoot = exports.selectItemRoot = _Dropdown.dropdownItemOldRoot;
+var selectItemRoot = exports.selectItemRoot = _Dropdown.dropdownItemRoot;
 var selectItemConfig = exports.selectItemConfig = {
   name: 'SelectItem',
   tag: 'div',

package/styled-components/cjs/components/Select/ui/SelectItem/SelectItem.styles.js

@@ -7,7 +7,7 @@ exports.mappingOverride = exports.base = void 0;
 var _styledComponents = /*#__PURE__*/require("styled-components");
 var _Select = /*#__PURE__*/require("../../Select.tokens");
 var _Dropdown = /*#__PURE__*/require("../../../Dropdown");
-var _DropdownItem = /*#__PURE__*/require("../../../Dropdown/ui/DropdownItemOld/DropdownItem.styles");
+var _DropdownItem = /*#__PURE__*/require("../../../Dropdown/ui/DropdownItem/DropdownItem.styles");
 // NOTE: Необходимое переопределение токенов из компонента DropdownItem т.к. используются его части
 var mappingOverride = exports.mappingOverride = /*#__PURE__*/"\n    ".concat(_Dropdown.dropdownTokens.itemBackground, ": var(").concat(_Select.tokens.itemBackground, ");\n    ").concat(_Dropdown.dropdownTokens.itemColor, ": var(").concat(_Select.tokens.itemColor, ");\n    ").concat(_Dropdown.dropdownTokens.itemBackgroundHover, ": var(").concat(_Select.tokens.itemBackgroundHover, ");\n    ").concat(_Dropdown.dropdownTokens.itemBackgroundSelected, ": var(").concat(_Select.tokens.itemBackgroundSelected, ");\n    ").concat(_Dropdown.dropdownTokens.itemColorSelected, ": var(").concat(_Select.tokens.itemColorSelected, ");\n    ").concat(_Dropdown.dropdownTokens.itemBackgroundSelectedHover, ": var(").concat(_Select.tokens.itemBackgroundSelectedHover, ");\n    ").concat(_Dropdown.dropdownTokens.itemColorSelectedHover, ": var(").concat(_Select.tokens.itemColorSelectedHover, ");\n    ").concat(_Dropdown.dropdownTokens.itemContentLeftColor, ": var(").concat(_Select.tokens.itemContentLeftColor, ");\n    ").concat(_Dropdown.dropdownTokens.itemContentRightColor, ": var(").concat(_Select.tokens.itemContentRightColor, ");\n    ").concat(_Dropdown.dropdownTokens.disabledOpacity, ": var(").concat(_Select.tokens.disabledOpacity, ");\n    ").concat(_Dropdown.dropdownTokens.focusColor, ": var(").concat(_Select.tokens.focusColor, ");\n    ").concat(_Dropdown.dropdownTokens.itemWidth, ": var(").concat(_Select.tokens.itemWidth, ");\n    ").concat(_Dropdown.dropdownTokens.itemHeight, ": var(").concat(_Select.tokens.itemHeight, ");\n    ").concat(_Dropdown.dropdownTokens.itemBorderRadius, ": var(").concat(_Select.tokens.itemBorderRadius, ");\n    ").concat(_Dropdown.dropdownTokens.itemPaddingTop, ": var(").concat(_Select.tokens.itemPaddingTop, ");\n    ").concat(_Dropdown.dropdownTokens.itemPaddingRight, ": var(").concat(_Select.tokens.itemPaddingRight, ");\n    ").concat(_Dropdown.dropdownTokens.itemPaddingBottom, ": var(").concat(_Select.tokens.itemPaddingBottom, ");\n    ").concat(_Dropdown.dropdownTokens.itemPaddingLeft, ": var(").concat(_Select.tokens.itemPaddingLeft, ");\n    ").concat(_Dropdown.dropdownTokens.itemMarginTop, ": var(").concat(_Select.tokens.itemMarginTop, ");\n    ").concat(_Dropdown.dropdownTokens.itemMarginRight, ": var(").concat(_Select.tokens.itemMarginRight, ");\n    ").concat(_Dropdown.dropdownTokens.itemMarginBottom, ": var(").concat(_Select.tokens.itemMarginBottom, ");\n    ").concat(_Dropdown.dropdownTokens.itemMarginLeft, ": var(").concat(_Select.tokens.itemMarginLeft, ");\n    ").concat(_Dropdown.dropdownTokens.itemFontFamily, ": var(").concat(_Select.tokens.itemFontFamily, ");\n    ").concat(_Dropdown.dropdownTokens.itemFontSize, ": var(").concat(_Select.tokens.itemFontSize, ");\n    ").concat(_Dropdown.dropdownTokens.itemFontStyle, ": var(").concat(_Select.tokens.itemFontStyle, ");\n    ").concat(_Dropdown.dropdownTokens.itemFontWeightBold, ": var(").concat(_Select.tokens.itemFontWeightBold, ");\n    ").concat(_Dropdown.dropdownTokens.itemFontLetterSpacing, ": var(").concat(_Select.tokens.itemFontLetterSpacing, ");\n    ").concat(_Dropdown.dropdownTokens.itemFontLineHeight, ": var(").concat(_Select.tokens.itemFontLineHeight, ");\n    ").concat(_Dropdown.dropdownTokens.itemContentLeftWidth, ": var(").concat(_Select.tokens.itemContentLeftWidth, ");\n    ").concat(_Dropdown.dropdownTokens.itemContentRightWidth, ": var(").concat(_Select.tokens.itemContentRightWidth, ");\n");
 var base = exports.base = /*#__PURE__*/(0, _styledComponents.css)(["", ";", ";"], _DropdownItem.baseContent, mappingOverride);

package/styled-components/cjs/components/_Icon/Icon.assets/DisclosureRight.js

@@ -18,7 +18,8 @@ var DisclosureRight = exports.DisclosureRight = function DisclosureRight(props)
       fillRule: "evenodd",
       clipRule: "evenodd",
       d: "M9.883 4.707a1 1 0 011.414-1.414L16.004 8l-4.707 4.707a1 1 0 01-1.414-1.414L13.176 8 9.883 4.707z",
-      fill: "currentColor"
+      fill: "currentColor",
+      fillOpacity: 0.56
     })));
   }
   return /*#__PURE__*/_react["default"].createElement("svg", _extends({

package/styled-components/cjs/examples/plasma_b2c/components/Dropdown/Normal/Dropdown.config.js

@@ -0,0 +1,27 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.config = void 0;
+var _styledComponents = /*#__PURE__*/require("styled-components");
+var _Dropdown = /*#__PURE__*/require("../../../../../components/Dropdown");
+var dropdownSizeCommon = /*#__PURE__*/"\n    ".concat(_Dropdown.dropdownTokens.width, ": 12.5rem;\n    ").concat(_Dropdown.dropdownTokens.height, ": auto;\n    ").concat(_Dropdown.dropdownTokens.borderRadius, ": 0.5rem;\n    ").concat(_Dropdown.dropdownTokens.paddingTop, ": 0.125rem;\n    ").concat(_Dropdown.dropdownTokens.paddingRight, ": 0.0625rem;\n    ").concat(_Dropdown.dropdownTokens.paddingBottom, ": 0.125rem;\n    ").concat(_Dropdown.dropdownTokens.paddingLeft, ": 0.125rem;\n");
+var dropdownItemSizeCommon = /*#__PURE__*/"\n    ".concat(_Dropdown.dropdownTokens.itemWidth, ": auto;\n    ").concat(_Dropdown.dropdownTokens.itemHeight, ": auto;\n    ").concat(_Dropdown.dropdownTokens.itemMarginTop, ": 0;\n    ").concat(_Dropdown.dropdownTokens.itemMarginRight, ": 0;\n    ").concat(_Dropdown.dropdownTokens.itemMarginBottom, ": 0;\n    ").concat(_Dropdown.dropdownTokens.itemMarginLeft, ": 0;\n");
+var config = exports.config = {
+  defaults: {
+    view: 'default',
+    size: 'm'
+  },
+  variations: {
+    size: {
+      xs: /*#__PURE__*/(0, _styledComponents.css)(["", ";", ";", ":0.5625rem;", ":0.5rem;", ":0.5625rem;", ":0.5rem;", ":0.375rem;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);"], dropdownSizeCommon, dropdownItemSizeCommon, _Dropdown.dropdownTokens.itemPaddingTop, _Dropdown.dropdownTokens.itemPaddingRight, _Dropdown.dropdownTokens.itemPaddingBottom, _Dropdown.dropdownTokens.itemPaddingLeft, _Dropdown.dropdownTokens.itemBorderRadius, _Dropdown.dropdownTokens.itemFontFamily, _Dropdown.dropdownTokens.itemFontSize, _Dropdown.dropdownTokens.itemFontStyle, _Dropdown.dropdownTokens.itemFontWeightBold, _Dropdown.dropdownTokens.itemFontLetterSpacing, _Dropdown.dropdownTokens.itemFontLineHeight),
+      s: /*#__PURE__*/(0, _styledComponents.css)(["", ";", ";", ":0.6875rem;", ":0.75rem;", ":0.6875rem;", ":0.75rem;", ":0.5rem;", ":var(--plasma-typo-body-s-font-family);", ":var(--plasma-typo-body-s-font-size);", ":var(--plasma-typo-body-s-font-style);", ":var(--plasma-typo-body-s-font-weight);", ":var(--plasma-typo-body-s-letter-spacing);", ":var(--plasma-typo-body-s-line-height);"], dropdownSizeCommon, dropdownItemSizeCommon, _Dropdown.dropdownTokens.itemPaddingTop, _Dropdown.dropdownTokens.itemPaddingRight, _Dropdown.dropdownTokens.itemPaddingBottom, _Dropdown.dropdownTokens.itemPaddingLeft, _Dropdown.dropdownTokens.itemBorderRadius, _Dropdown.dropdownTokens.itemFontFamily, _Dropdown.dropdownTokens.itemFontSize, _Dropdown.dropdownTokens.itemFontStyle, _Dropdown.dropdownTokens.itemFontWeightBold, _Dropdown.dropdownTokens.itemFontLetterSpacing, _Dropdown.dropdownTokens.itemFontLineHeight),
+      m: /*#__PURE__*/(0, _styledComponents.css)(["", ";", ";", ":0.875rem;", ":0.875rem;", ":0.875rem;", ":0.875rem;", ":0.625rem;", ":var(--plasma-typo-body-m-font-family);", ":var(--plasma-typo-body-m-font-size);", ":var(--plasma-typo-body-m-font-style);", ":var(--plasma-typo-body-m-font-weight);", ":var(--plasma-typo-body-m-letter-spacing);", ":var(--plasma-typo-body-m-line-height);"], dropdownSizeCommon, dropdownItemSizeCommon, _Dropdown.dropdownTokens.itemPaddingTop, _Dropdown.dropdownTokens.itemPaddingRight, _Dropdown.dropdownTokens.itemPaddingBottom, _Dropdown.dropdownTokens.itemPaddingLeft, _Dropdown.dropdownTokens.itemBorderRadius, _Dropdown.dropdownTokens.itemFontFamily, _Dropdown.dropdownTokens.itemFontSize, _Dropdown.dropdownTokens.itemFontStyle, _Dropdown.dropdownTokens.itemFontWeightBold, _Dropdown.dropdownTokens.itemFontLetterSpacing, _Dropdown.dropdownTokens.itemFontLineHeight),
+      l: /*#__PURE__*/(0, _styledComponents.css)(["", ";", ";", ":1.0625rem;", ":1rem;", ":1.0625rem;", ":1rem;", ":0.75rem;", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);"], dropdownSizeCommon, dropdownItemSizeCommon, _Dropdown.dropdownTokens.itemPaddingTop, _Dropdown.dropdownTokens.itemPaddingRight, _Dropdown.dropdownTokens.itemPaddingBottom, _Dropdown.dropdownTokens.itemPaddingLeft, _Dropdown.dropdownTokens.itemBorderRadius, _Dropdown.dropdownTokens.itemFontFamily, _Dropdown.dropdownTokens.itemFontSize, _Dropdown.dropdownTokens.itemFontStyle, _Dropdown.dropdownTokens.itemFontWeightBold, _Dropdown.dropdownTokens.itemFontLetterSpacing, _Dropdown.dropdownTokens.itemFontLineHeight)
+    },
+    view: {
+      "default": /*#__PURE__*/(0, _styledComponents.css)(["", ":0.4;", ":var(--surface-solid-card);", ":var(--shadow-down-soft-s);", ":var(--plasma-colors-transparent);", ":var(--surface-transparent-secondary);", ":inherit;", ":inherit;", ":inherit;", ":inherit;", ":var(--text-primary);"], _Dropdown.dropdownTokens.disabledOpacity, _Dropdown.dropdownTokens.background, _Dropdown.dropdownTokens.boxShadow, _Dropdown.dropdownTokens.itemBackground, _Dropdown.dropdownTokens.itemBackgroundHover, _Dropdown.dropdownTokens.itemBackgroundSelected, _Dropdown.dropdownTokens.itemColorSelected, _Dropdown.dropdownTokens.itemBackgroundSelectedHover, _Dropdown.dropdownTokens.itemColorSelectedHover, _Dropdown.dropdownTokens.itemColor)
+    }
+  }
+};

package/styled-components/cjs/examples/plasma_b2c/components/Dropdown/Normal/Dropdown.js

@@ -0,0 +1,13 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.DropdownItem = exports.Dropdown = void 0;
+var _Dropdown = /*#__PURE__*/require("../../../../../components/Dropdown");
+var _engines = /*#__PURE__*/require("../../../../../engines");
+var _Dropdown2 = /*#__PURE__*/require("./Dropdown.config");
+var mergedConfig = /*#__PURE__*/(0, _engines.mergeConfig)(_Dropdown.dropdownConfig, _Dropdown2.config);
+var Dropdown = exports.Dropdown = /*#__PURE__*/(0, _engines.component)(mergedConfig);
+var mergedItemConfig = /*#__PURE__*/(0, _engines.mergeConfig)(_Dropdown.dropdownItemConfig);
+var DropdownItem = exports.DropdownItem = /*#__PURE__*/(0, _engines.component)(mergedItemConfig);

package/styled-components/cjs/examples/plasma_b2c/components/Dropdown/Normal/Dropdown.stories.tsx

@@ -0,0 +1,194 @@
+import React, { useState } from 'react';
+import type { ComponentProps } from 'react';
+import type { Meta, StoryObj } from '@storybook/react';
+import { action } from '@storybook/addon-actions';
+import styled from 'styled-components';
+
+import { WithTheme, argTypesFromConfig } from '../../../../_helpers';
+import { mergeConfig } from '../../../../../engines';
+import { dropdownConfig } from '../../../../../components/Dropdown';
+import { Button } from '../../Button/Button';
+import { Radiobox } from '../../Radiobox/Radiobox';
+import { Checkbox } from '../../Checkbox/Checkbox';
+import type { DropdownPlacement, DropdownTrigger } from '../../../../../components/Dropdown/Dropdown.types';
+
+import { Dropdown, DropdownItem } from './Dropdown';
+import { config } from './Dropdown.config';
+
+const placements: Array<DropdownPlacement> = ['top', 'bottom', 'right', 'left', 'auto'];
+const triggers: Array<DropdownTrigger> = ['click', 'hover'];
+
+type StoryDropdownPropsCustom = {
+    skidding?: number;
+    distance?: number;
+};
+
+type StoryDropdownProps = ComponentProps<typeof Dropdown> & StoryDropdownPropsCustom;
+
+const meta: Meta<StoryDropdownProps> = {
+    title: 'plasma_b2c/Dropdown',
+    decorators: [WithTheme],
+    component: Dropdown,
+    argTypes: {
+        placement: {
+            options: placements,
+            control: {
+                type: 'select',
+            },
+        },
+        trigger: {
+            options: triggers,
+            control: {
+                type: 'select',
+            },
+        },
+        ...argTypesFromConfig(mergeConfig(dropdownConfig, config)),
+    },
+    args: {
+        placement: 'bottom',
+        trigger: 'click',
+        closeOnOverlayClick: false,
+        closeOnEsc: true,
+        isFocusTrapped: true,
+        skidding: 0,
+        distance: 0,
+    },
+};
+
+export default meta;
+
+const onSelect = action('onSelect');
+const onClick = action('onClick');
+const onChange = action('onChange');
+
+const getDropdownItems = (slug: string, elemCount: number) =>
+    [...Array(elemCount).keys()].map((num) => ({
+        value: `${slug}_${num}`,
+        child: `${slug} ${num}`,
+    }));
+
+const StyledRadiobox = styled(Radiobox)`
+    margin-right: 0.5rem;
+`;
+
+const StyledCheckbox = styled(Checkbox)`
+    margin-left: auto;
+`;
+
+const StyledDisclosureRightIcon = styled.div`
+    width: 1.25rem;
+    height: 1.25rem;
+    margin-left: auto;
+`;
+
+const DisclosureRightIcon = (props) => (
+    <StyledDisclosureRightIcon>
+        <svg width="100%" viewBox="0 0 24 24" fill="none" {...props}>
+            <path
+                d="M9.883 8.707a1 1 0 011.414-1.414L16.004 12l-4.707 4.707a1 1 0 01-1.414-1.414L13.176 12 9.883 8.707z"
+                fill="currentColor"
+            />
+        </svg>
+    </StyledDisclosureRightIcon>
+);
+
+const StoryNormal = (args: StoryDropdownProps) => {
+    const [selected, setSelected] = useState('');
+    const [isOpen, setIsOpen] = useState(false);
+    const [isOpenDropdown2, setIsOpenDropdown2] = useState(false);
+
+    const { skidding, distance, placement, ...rest } = args;
+
+    const onMainClose = () => {
+        setIsOpen(false);
+        setIsOpenDropdown2(false);
+    };
+
+    const onMainToggle = (openValue: boolean) => {
+        setIsOpen(openValue);
+
+        if (!openValue) {
+            onMainClose();
+        }
+    };
+
+    const handleSelect = (value: string, text: string) => {
+        setSelected(value);
+        onSelect(value, text);
+        setIsOpen(false);
+    };
+
+    return (
+        <div>
+            <h3>This is header</h3>
+            <Dropdown
+                target={<Button>Target</Button>}
+                isOpen={isOpen}
+                onToggle={onMainToggle}
+                offset={[Number(skidding), Number(distance)]}
+                placement={placement}
+                {...rest}
+            >
+                {getDropdownItems('item', 6).map((item) => (
+                    <DropdownItem
+                        key={item.value}
+                        isSelected={Boolean(item.value === selected)}
+                        onSelect={() => handleSelect(item.value, item.child)}
+                        onClick={onClick}
+                        value={item.value}
+                    >
+                        {item.child}
+                    </DropdownItem>
+                ))}
+                <Dropdown
+                    target={<DropdownItem contentRight={DisclosureRightIcon} name="test" text="Nested dropdown" />}
+                    onToggle={(is) => setIsOpenDropdown2(is)}
+                    isOpen={isOpenDropdown2}
+                    offset={[0, 0]}
+                    {...rest}
+                >
+                    <DropdownItem contentRight={StyledCheckbox} value="checked" onChange={onChange} text="Checkbox" />
+                    {getDropdownItems('nested', 4).map((item) => (
+                        <DropdownItem
+                            key={item.value}
+                            isSelected={Boolean(item.value === selected)}
+                            onSelect={() => handleSelect(item.value, item.child)}
+                            onClick={onClick}
+                            value={item.value}
+                        >
+                            {item.child}
+                        </DropdownItem>
+                    ))}
+                    <DropdownItem
+                        contentLeft={StyledRadiobox}
+                        name="radio"
+                        value="1"
+                        onChange={onChange}
+                        text="Radiobox 1"
+                    />
+                    <DropdownItem
+                        contentLeft={StyledRadiobox}
+                        name="radio"
+                        value="2"
+                        onChange={onChange}
+                        text="Radiobox 2"
+                    />
+                </Dropdown>
+
+                <DropdownItem
+                    isSelected={selected === 'disabled'}
+                    onSelect={() => handleSelect('disabled', 'disabled')}
+                    onClick={onClick}
+                    value="disabled"
+                    disabled
+                >
+                    disabled
+                </DropdownItem>
+            </Dropdown>
+        </div>
+    );
+};
+
+export const Normal: StoryObj<StoryDropdownProps> = {
+    render: (args) => <StoryNormal {...args} />,
+};

package/styled-components/cjs/examples/plasma_b2c/components/Dropdown/Tight/Dropdown.config.js

@@ -0,0 +1,27 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.config = void 0;
+var _styledComponents = /*#__PURE__*/require("styled-components");
+var _Dropdown = /*#__PURE__*/require("../../../../../components/Dropdown");
+var dropdownSizeCommon = /*#__PURE__*/"\n    ".concat(_Dropdown.dropdownTokens.width, ": 12.5rem;\n    ").concat(_Dropdown.dropdownTokens.height, ": auto;\n    ").concat(_Dropdown.dropdownTokens.borderRadius, ": 0.5rem;\n    ").concat(_Dropdown.dropdownTokens.paddingTop, ": 0.125rem;\n    ").concat(_Dropdown.dropdownTokens.paddingRight, ": 0.0625rem;\n    ").concat(_Dropdown.dropdownTokens.paddingBottom, ": 0.125rem;\n    ").concat(_Dropdown.dropdownTokens.paddingLeft, ": 0.125rem;\n");
+var dropdownItemSizeCommon = /*#__PURE__*/"\n    ".concat(_Dropdown.dropdownTokens.itemWidth, ": auto;\n    ").concat(_Dropdown.dropdownTokens.itemHeight, ": auto;\n    ").concat(_Dropdown.dropdownTokens.itemMarginTop, ": 0;\n    ").concat(_Dropdown.dropdownTokens.itemMarginRight, ": 0;\n    ").concat(_Dropdown.dropdownTokens.itemMarginBottom, ": 0;\n    ").concat(_Dropdown.dropdownTokens.itemMarginLeft, ": 0;\n");
+var config = exports.config = {
+  defaults: {
+    view: 'default',
+    size: 'm'
+  },
+  variations: {
+    size: {
+      xs: /*#__PURE__*/(0, _styledComponents.css)(["", ";", ";", ":0.3125rem;", ":0.5rem;", ":0.3125rem;", ":0.5rem;", ":0.375rem;", ":var(--plasma-typo-body-xs-font-family);", ":var(--plasma-typo-body-xs-font-size);", ":var(--plasma-typo-body-xs-font-style);", ":var(--plasma-typo-body-xs-font-weight);", ":var(--plasma-typo-body-xs-letter-spacing);", ":var(--plasma-typo-body-xs-line-height);"], dropdownSizeCommon, dropdownItemSizeCommon, _Dropdown.dropdownTokens.itemPaddingTop, _Dropdown.dropdownTokens.itemPaddingRight, _Dropdown.dropdownTokens.itemPaddingBottom, _Dropdown.dropdownTokens.itemPaddingLeft, _Dropdown.dropdownTokens.itemBorderRadius, _Dropdown.dropdownTokens.itemFontFamily, _Dropdown.dropdownTokens.itemFontSize, _Dropdown.dropdownTokens.itemFontStyle, _Dropdown.dropdownTokens.itemFontWeightBold, _Dropdown.dropdownTokens.itemFontLetterSpacing, _Dropdown.dropdownTokens.itemFontLineHeight),
+      s: /*#__PURE__*/(0, _styledComponents.css)(["", ";", ";", ":0.4375rem;", ":0.75rem;", ":0.4375rem;", ":0.75rem;", ":0.5rem;", ":var(--plasma-typo-body-s-font-family);", ":var(--plasma-typo-body-s-font-size);", ":var(--plasma-typo-body-s-font-style);", ":var(--plasma-typo-body-s-font-weight);", ":var(--plasma-typo-body-s-letter-spacing);", ":var(--plasma-typo-body-s-line-height);"], dropdownSizeCommon, dropdownItemSizeCommon, _Dropdown.dropdownTokens.itemPaddingTop, _Dropdown.dropdownTokens.itemPaddingRight, _Dropdown.dropdownTokens.itemPaddingBottom, _Dropdown.dropdownTokens.itemPaddingLeft, _Dropdown.dropdownTokens.itemBorderRadius, _Dropdown.dropdownTokens.itemFontFamily, _Dropdown.dropdownTokens.itemFontSize, _Dropdown.dropdownTokens.itemFontStyle, _Dropdown.dropdownTokens.itemFontWeightBold, _Dropdown.dropdownTokens.itemFontLetterSpacing, _Dropdown.dropdownTokens.itemFontLineHeight),
+      m: /*#__PURE__*/(0, _styledComponents.css)(["", ";", ";", ":0.625rem;", ":0.875rem;", ":0.625rem;", ":0.875rem;", ":0.625rem;", ":var(--plasma-typo-body-m-font-family);", ":var(--plasma-typo-body-m-font-size);", ":var(--plasma-typo-body-m-font-style);", ":var(--plasma-typo-body-m-font-weight);", ":var(--plasma-typo-body-m-letter-spacing);", ":var(--plasma-typo-body-m-line-height);"], dropdownSizeCommon, dropdownItemSizeCommon, _Dropdown.dropdownTokens.itemPaddingTop, _Dropdown.dropdownTokens.itemPaddingRight, _Dropdown.dropdownTokens.itemPaddingBottom, _Dropdown.dropdownTokens.itemPaddingLeft, _Dropdown.dropdownTokens.itemBorderRadius, _Dropdown.dropdownTokens.itemFontFamily, _Dropdown.dropdownTokens.itemFontSize, _Dropdown.dropdownTokens.itemFontStyle, _Dropdown.dropdownTokens.itemFontWeightBold, _Dropdown.dropdownTokens.itemFontLetterSpacing, _Dropdown.dropdownTokens.itemFontLineHeight),
+      l: /*#__PURE__*/(0, _styledComponents.css)(["", ";", ";", ":0.8125rem;", ":1rem;", ":0.8125rem;", ":1rem;", ":0.75rem;", ":var(--plasma-typo-body-l-font-family);", ":var(--plasma-typo-body-l-font-size);", ":var(--plasma-typo-body-l-font-style);", ":var(--plasma-typo-body-l-font-weight);", ":var(--plasma-typo-body-l-letter-spacing);", ":var(--plasma-typo-body-l-line-height);"], dropdownSizeCommon, dropdownItemSizeCommon, _Dropdown.dropdownTokens.itemPaddingTop, _Dropdown.dropdownTokens.itemPaddingRight, _Dropdown.dropdownTokens.itemPaddingBottom, _Dropdown.dropdownTokens.itemPaddingLeft, _Dropdown.dropdownTokens.itemBorderRadius, _Dropdown.dropdownTokens.itemFontFamily, _Dropdown.dropdownTokens.itemFontSize, _Dropdown.dropdownTokens.itemFontStyle, _Dropdown.dropdownTokens.itemFontWeightBold, _Dropdown.dropdownTokens.itemFontLetterSpacing, _Dropdown.dropdownTokens.itemFontLineHeight)
+    },
+    view: {
+      "default": /*#__PURE__*/(0, _styledComponents.css)(["", ":0.4;", ":var(--surface-solid-card);", ":var(--shadow-down-soft-s);", ":var(--plasma-colors-transparent);", ":var(--surface-transparent-secondary);", ":inherit;", ":inherit;", ":inherit;", ":inherit;", ":var(--text-primary);"], _Dropdown.dropdownTokens.disabledOpacity, _Dropdown.dropdownTokens.background, _Dropdown.dropdownTokens.boxShadow, _Dropdown.dropdownTokens.itemBackground, _Dropdown.dropdownTokens.itemBackgroundHover, _Dropdown.dropdownTokens.itemBackgroundSelected, _Dropdown.dropdownTokens.itemColorSelected, _Dropdown.dropdownTokens.itemBackgroundSelectedHover, _Dropdown.dropdownTokens.itemColorSelectedHover, _Dropdown.dropdownTokens.itemColor)
+    }
+  }
+};

package/styled-components/cjs/examples/plasma_b2c/components/Dropdown/Tight/Dropdown.js

@@ -0,0 +1,13 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.DropdownItem = exports.Dropdown = void 0;
+var _Dropdown = /*#__PURE__*/require("../../../../../components/Dropdown");
+var _engines = /*#__PURE__*/require("../../../../../engines");
+var _Dropdown2 = /*#__PURE__*/require("./Dropdown.config");
+var mergedConfig = /*#__PURE__*/(0, _engines.mergeConfig)(_Dropdown.dropdownConfig, _Dropdown2.config);
+var Dropdown = exports.Dropdown = /*#__PURE__*/(0, _engines.component)(mergedConfig);
+var mergedItemConfig = /*#__PURE__*/(0, _engines.mergeConfig)(_Dropdown.dropdownItemConfig);
+var DropdownItem = exports.DropdownItem = /*#__PURE__*/(0, _engines.component)(mergedItemConfig);