@ant-design/compatible/lib/form/style/layout.js

Ant Design v3 to v4 compatible package

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.genFormLayoutStyle = void 0;

function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }

function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }

function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }

var genVerticalLayoutLabel = function genVerticalLayoutLabel(token) {
  var lineHeight = token.lineHeight;
  return {
    display: 'block',
    margin: 0,
    padding: '0 0 8px',
    lineHeight: lineHeight,
    whiteSpace: 'initial',
    textAlign: 'left',
    flexBasis: '100%',
    'label::after': {
      display: 'none'
    }
  };
};

var genVerticalLayoutControlWrapper = function genVerticalLayoutControlWrapper() {
  return {
    flexBasis: '100%'
  };
};

var genVerticalLayout = function genVerticalLayout(token) {
  var _ref;

  var componentCls = token.componentCls;
  return _ref = {}, _defineProperty(_ref, "".concat(componentCls, "-item-label, ").concat(componentCls, "-item-control-wrapper"), {
    display: 'block',
    width: '100%'
  }), _defineProperty(_ref, "".concat(componentCls, "-item-label"), _objectSpread({}, genVerticalLayoutLabel(token))), _defineProperty(_ref, "".concat(componentCls, "-item-control-wrapper"), _objectSpread({}, genVerticalLayoutControlWrapper())), _ref;
};

var genFormLayoutStyle = function genFormLayoutStyle(token) {
  var _$concat, _componentCls, _ref2, _$concat3;

  var antCls = token.antCls,
      componentCls = token.componentCls,
      lineHeight = token.lineHeight,
      formExplainPrecision = token.formExplainPrecision,
      marginLG = token.marginLG;
  return [(_ref2 = {}, _defineProperty(_ref2, componentCls, (_componentCls = {}, _defineProperty(_componentCls, "\n        &".concat(componentCls, "-vertical ").concat(componentCls, "-item-label,\n        ").concat(antCls, "-col-24").concat(componentCls, "-item-label,\n        ").concat(antCls, "-col-xl-24").concat(componentCls, "-item-label\n      "), _objectSpread({}, genVerticalLayoutLabel(token))), _defineProperty(_componentCls, "".concat(componentCls, "-vertical"), (_$concat = {}, _defineProperty(_$concat, "".concat(componentCls, "-item"), {
    paddingBottom: '8px'
  }), _defineProperty(_$concat, "".concat(componentCls, "-item-control"), {
    lineHeight: lineHeight
  }), _defineProperty(_$concat, "".concat(componentCls, "-explain"), {
    marginTop: 2,
    marginBottom: "-4px -".concat(formExplainPrecision, "px")
  }), _defineProperty(_$concat, "".concat(componentCls, "-extra"), {
    marginTop: 2,
    marginBottom: -4
  }), _$concat)), _componentCls)), _defineProperty(_ref2, "@media (max-width: ".concat(token.screenXSMax, ")"), _objectSpread(_objectSpread({}, genVerticalLayout(token)), {}, _defineProperty({}, "".concat(antCls, "-col-xs-24").concat(componentCls, "-item-label"), _objectSpread({}, genVerticalLayoutLabel(token))))), _defineProperty(_ref2, "@media (max-width: ".concat(token.screenSMMax, ")"), _defineProperty({}, "".concat(antCls, "-col-sm-24").concat(componentCls, "-item-label"), _objectSpread({}, genVerticalLayoutLabel(token)))), _defineProperty(_ref2, "@media (max-width: ".concat(token.screenMDMax, ")"), _defineProperty({}, "".concat(antCls, "-col-md-24").concat(componentCls, "-item-label"), _objectSpread({}, genVerticalLayoutLabel(token)))), _defineProperty(_ref2, "@media (max-width: ".concat(token.screenLGMax, ")"), _defineProperty({}, "".concat(antCls, "-col-lg-24").concat(componentCls, "-item-label"), _objectSpread({}, genVerticalLayoutLabel(token)))), _defineProperty(_ref2, "@media (max-width: ".concat(token.screenXLMax, ")"), _defineProperty({}, "".concat(antCls, "-col-xl-24").concat(componentCls, "-item-label"), _objectSpread({}, genVerticalLayoutLabel(token)))), _ref2), // ================================ Inline ================================
  _defineProperty({}, "".concat(componentCls, "-inline"), (_$concat3 = {}, _defineProperty(_$concat3, "".concat(componentCls, "-item"), _defineProperty({
    display: 'inline-block',
    marginRight: '16px',
    marginBottom: '0',
    '&-with-help': {
      marginBottom: marginLG
    }
  }, "> ".concat(componentCls, "-item-control-wrapper, > ").concat(componentCls, "-item-label"), {
    display: 'inline-block',
    verticalAlign: 'top'
  })), _defineProperty(_$concat3, "".concat(componentCls, "-text"), {
    display: 'inline-block'
  }), _defineProperty(_$concat3, '.has-feedback', {
    display: 'inline-block'
  }), _$concat3))];
};

exports.genFormLayoutStyle = genFormLayoutStyle;