@wix/design-system/dist/cjs/Layout/Layout.js

@wix/design-system

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
exports.__esModule = true;
exports.default = void 0;
var _react = _interopRequireWildcard(require("react"));
var _propTypes = _interopRequireDefault(require("prop-types"));
var _spacingSt = require("../Foundation/stylable/spacing.st.css.js");
var _LayoutSt = require("./Layout.st.css.js");
var _jsxFileName = "/home/builduser/work/57e038ea7326c1ec/packages/wix-design-system/dist/cjs/Layout/Layout.tsx";
function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function _interopRequireWildcard(e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (var _t in e) "default" !== _t && {}.hasOwnProperty.call(e, _t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, _t)) && (i.get || i.set) ? o(f, _t, i) : f[_t] = e[_t]); return f; })(e, t); }
var formatSpacingValue = value => {
  if (typeof value === 'number') {
    return "".concat(value, "px");
  }
  return _spacingSt.stVars[value] || "".concat(value);
};
var Layout = _ref => {
  var {
    children,
    gap = '24px',
    cols,
    justifyItems,
    alignItems,
    rowHeight = 'auto',
    dataHook,
    height,
    className
  } = _ref;
  var smartGap = (0, _react.useMemo)(() => formatSpacingValue(gap), [gap]);
  return /*#__PURE__*/_react.default.createElement("div", {
    "data-hook": dataHook,
    "data-gap": smartGap,
    style: {
      height,
      gap: smartGap,
      justifyItems,
      alignItems,
      gridAutoRows: rowHeight,
      gridTemplateColumns: cols ? "repeat(".concat(cols, ", minmax(0, 1fr))") : undefined
    },
    className: (0, _LayoutSt.st)(_LayoutSt.classes.root, className),
    children: children,
    __self: void 0,
    __source: {
      fileName: _jsxFileName,
      lineNumber: 28,
      columnNumber: 5
    }
  });
};
Layout.displayName = 'Layout';
Layout.propTypes = {
  dataHook: _propTypes.default.any,
  children: _propTypes.default.any,
  className: _propTypes.default.any,
  gap: _propTypes.default.any,
  cols: _propTypes.default.any,
  justifyItems: _propTypes.default.any,
  alignItems: _propTypes.default.any,
  rowHeight: _propTypes.default.any,
  height: _propTypes.default.any
};
var _default = exports.default = Layout;
//# sourceMappingURL=Layout.js.map