@nutui/nutui-react/dist/esm/Col.js

京东风格的轻量级移动端 React 组件库，支持一套代码生成 H5 和小程序

import React__default, { useState, useContext, useEffect } from "react";
import classNames from "classnames";
import { D as DataContext } from "./UserContext.js";
import { C as ComponentDefaults } from "./typings.js";
const defaultProps = Object.assign(Object.assign({}, ComponentDefaults), { span: "24", offset: "0", gutter: "0" });
const Col = (props) => {
  const { className, style, span, offset, children, onClick } = Object.assign(Object.assign({}, defaultProps), props);
  const [colName, setColName] = useState("");
  const [colStyle, setColStyle] = useState({});
  const { gutter } = useContext(DataContext);
  const classs = () => {
    const prefixCls = "nut-col";
    return `${prefixCls} ${prefixCls}-${span} ${gutter ? `${prefixCls}-gutter` : ""} ${prefixCls}-offset-${offset}`;
  };
  const getStyle = () => {
    const style2 = {};
    style2.paddingLeft = `${gutter / 2}px`;
    style2.paddingRight = `${gutter / 2}px`;
    return style2;
  };
  useEffect(() => {
    setColName(classs);
    setColStyle(getStyle);
  }, [span, offset, gutter]);
  return React__default.createElement("div", { className: classNames(colName, className), style: Object.assign(Object.assign({}, style), colStyle), onClick: (e) => {
    onClick && onClick(e, "col");
  } }, children);
};
Col.displayName = "NutCol";
export {
  Col as default
};