Nie możesz wybrać więcej, niż 25 tematów Tematy muszą się zaczynać od litery lub cyfry, mogą zawierać myślniki ('-') i mogą mieć do 35 znaków.
 
 
 
 

103 wiersze
3.5 KiB

  1. "use strict";
  2. var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
  3. exports.__esModule = true;
  4. exports.default = void 0;
  5. var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
  6. var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
  7. var _lodash = _interopRequireDefault(require("lodash.isobject"));
  8. var _react = _interopRequireDefault(require("react"));
  9. var _propTypes = _interopRequireDefault(require("prop-types"));
  10. var _classnames = _interopRequireDefault(require("classnames"));
  11. var _utils = require("./utils");
  12. var colWidths = ['xs', 'sm', 'md', 'lg', 'xl'];
  13. var stringOrNumberProp = _propTypes.default.oneOfType([_propTypes.default.number, _propTypes.default.string]);
  14. var columnProps = _propTypes.default.oneOfType([_propTypes.default.bool, _propTypes.default.number, _propTypes.default.string, _propTypes.default.shape({
  15. size: _propTypes.default.oneOfType([_propTypes.default.bool, _propTypes.default.number, _propTypes.default.string]),
  16. push: (0, _utils.deprecated)(stringOrNumberProp, 'Please use the prop "order"'),
  17. pull: (0, _utils.deprecated)(stringOrNumberProp, 'Please use the prop "order"'),
  18. order: stringOrNumberProp,
  19. offset: stringOrNumberProp
  20. })]);
  21. var propTypes = {
  22. tag: _utils.tagPropType,
  23. xs: columnProps,
  24. sm: columnProps,
  25. md: columnProps,
  26. lg: columnProps,
  27. xl: columnProps,
  28. className: _propTypes.default.string,
  29. cssModule: _propTypes.default.object,
  30. widths: _propTypes.default.array
  31. };
  32. var defaultProps = {
  33. tag: 'div',
  34. widths: colWidths
  35. };
  36. var getColumnSizeClass = function getColumnSizeClass(isXs, colWidth, colSize) {
  37. if (colSize === true || colSize === '') {
  38. return isXs ? 'col' : "col-" + colWidth;
  39. } else if (colSize === 'auto') {
  40. return isXs ? 'col-auto' : "col-" + colWidth + "-auto";
  41. }
  42. return isXs ? "col-" + colSize : "col-" + colWidth + "-" + colSize;
  43. };
  44. var Col = function Col(props) {
  45. var className = props.className,
  46. cssModule = props.cssModule,
  47. widths = props.widths,
  48. Tag = props.tag,
  49. attributes = (0, _objectWithoutPropertiesLoose2.default)(props, ["className", "cssModule", "widths", "tag"]);
  50. var colClasses = [];
  51. widths.forEach(function (colWidth, i) {
  52. var columnProp = props[colWidth];
  53. delete attributes[colWidth];
  54. if (!columnProp && columnProp !== '') {
  55. return;
  56. }
  57. var isXs = !i;
  58. if ((0, _lodash.default)(columnProp)) {
  59. var _classNames;
  60. var colSizeInterfix = isXs ? '-' : "-" + colWidth + "-";
  61. var colClass = getColumnSizeClass(isXs, colWidth, columnProp.size);
  62. colClasses.push((0, _utils.mapToCssModules)((0, _classnames.default)((_classNames = {}, _classNames[colClass] = columnProp.size || columnProp.size === '', _classNames["order" + colSizeInterfix + columnProp.order] = columnProp.order || columnProp.order === 0, _classNames["offset" + colSizeInterfix + columnProp.offset] = columnProp.offset || columnProp.offset === 0, _classNames)), cssModule));
  63. } else {
  64. var _colClass = getColumnSizeClass(isXs, colWidth, columnProp);
  65. colClasses.push(_colClass);
  66. }
  67. });
  68. if (!colClasses.length) {
  69. colClasses.push('col');
  70. }
  71. var classes = (0, _utils.mapToCssModules)((0, _classnames.default)(className, colClasses), cssModule);
  72. return _react.default.createElement(Tag, (0, _extends2.default)({}, attributes, {
  73. className: classes
  74. }));
  75. };
  76. Col.propTypes = propTypes;
  77. Col.defaultProps = defaultProps;
  78. var _default = Col;
  79. exports.default = _default;