@wix/design-system/dist/cjs/utils/ButtonHelpers/index.js

@wix/design-system

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
exports.__esModule = true;
exports.renderButtonBlock = exports.getSkinBackground = void 0;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _react = _interopRequireDefault(require("react"));
var _Layout = require("../../Layout");
var _Box = _interopRequireDefault(require("../../Box"));
var _jsxFileName = "/home/builduser/work/57e038ea7326c1ec/packages/wix-design-system/dist/cjs/utils/ButtonHelpers/index.jsx",
  _this = void 0;
var skinBackgroundRules = [{
  when: function when(skin) {
    return skin === 'standard';
  },
  output: ''
}, {
  when: function when(skin) {
    return skin === 'inverted';
  },
  output: ''
}, {
  when: function when(skin) {
    return skin === 'destructive';
  },
  output: ''
}, {
  when: function when(skin) {
    return skin === 'premium';
  },
  output: ''
}, {
  when: function when(skin) {
    return skin === 'ai';
  },
  output: ''
}, {
  when: function when(skin) {
    return skin === 'light';
  },
  output: '#162d3d'
}, {
  when: function when(skin) {
    return skin === 'transparent';
  },
  output: '#4eb7f5'
}, {
  when: function when(skin) {
    return skin === 'dark';
  },
  output: '#fef0ba'
}, {
  when: function when(skin) {
    return skin === 'premium-light';
  },
  output: '#162d3d'
}, {
  when: function when(skin) {
    return skin === 'standard-light';
  },
  output: '#162d3d'
}, {
  when: function when() {
    return true;
  },
  output: ''
}];
var getSkinBackground = exports.getSkinBackground = function getSkinBackground(skin) {
  return skinBackgroundRules.find(function (_ref) {
    var when = _ref.when;
    return when(skin);
  }).output;
};
var renderButtonBlock = exports.renderButtonBlock = function renderButtonBlock(_ref2) {
  var Component = _ref2.Component,
    _ref2$props = _ref2.props,
    props = _ref2$props === void 0 ? {} : _ref2$props,
    skins = _ref2.skins;
  return /*#__PURE__*/_react["default"].createElement("div", {
    style: {
      position: 'absolute',
      top: 0,
      left: 0,
      width: '100%',
      height: '100%',
      backgroundColor: '#f0f4f7'
    },
    __self: _this,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 56,
      columnNumber: 3
    }
  }, /*#__PURE__*/_react["default"].createElement(_Box["default"], {
    width: "400px",
    __self: _this,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 66,
      columnNumber: 5
    }
  }, /*#__PURE__*/_react["default"].createElement(_Layout.Layout, {
    __self: _this,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 67,
      columnNumber: 7
    }
  }, /*#__PURE__*/_react["default"].createElement(_Layout.Cell, {
    span: 6,
    __self: _this,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 68,
      columnNumber: 9
    }
  }, skins.map(function (_ref3, index) {
    var skin = _ref3.skin,
      background = _ref3.background;
    return /*#__PURE__*/_react["default"].createElement("div", {
      key: index,
      style: {
        background: background,
        margin: '5px 0'
      },
      __self: _this,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 70,
        columnNumber: 13
      }
    }, /*#__PURE__*/_react["default"].createElement(Component, (0, _extends2["default"])({
      children: skin + ' skin'
    }, props, {
      fullWidth: true,
      skin: skin,
      __self: _this,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 71,
        columnNumber: 15
      }
    })));
  })), /*#__PURE__*/_react["default"].createElement(_Layout.Cell, {
    span: 6,
    __self: _this,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 80,
      columnNumber: 9
    }
  }, skins.map(function (_ref4, index) {
    var skin = _ref4.skin,
      background = _ref4.background;
    return /*#__PURE__*/_react["default"].createElement("div", {
      key: index,
      style: {
        background: background,
        margin: '5px 0'
      },
      __self: _this,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 82,
        columnNumber: 13
      }
    }, /*#__PURE__*/_react["default"].createElement(Component, (0, _extends2["default"])({
      children: skin + ' skin'
    }, props, {
      fullWidth: true,
      skin: skin,
      disabled: true,
      __self: _this,
      __source: {
        fileName: _jsxFileName,
        lineNumber: 83,
        columnNumber: 15
      }
    })));
  })))));
};