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

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

import { _ as __rest } from "./tslib.es6.js";
import React__default, { useContext } from "react";
import classNames from "classnames";
import { C as ComponentDefaults } from "./typings.js";
import CellGroup__default from "./CellGroup.js";
import { C as CellGroupContext } from "./context.js";
const defaultProps = Object.assign(Object.assign({}, ComponentDefaults), { title: null, description: null, extra: null, radius: "6px", align: "flex-start", clickable: false, onClick: (event) => {
} });
const classPrefix = "nut-cell";
const Cell = (props) => {
  const ctx = useContext(CellGroupContext);
  const _a = Object.assign(Object.assign({}, defaultProps), props), { children, clickable, onClick, title, description, extra, radius, align, className, style } = _a, rest = __rest(_a, ["children", "clickable", "onClick", "title", "description", "extra", "radius", "align", "className", "style"]);
  const handleClick = (event) => {
    onClick(event);
  };
  const baseStyle = Object.assign(Object.assign({}, style), { borderRadius: Number.isNaN(Number(radius)) ? String(radius) : `${radius}px`, alignItems: align });
  const styles = title || description ? {} : {
    flex: 1
  };
  return React__default.createElement(
    "div",
    Object.assign({ className: `${classNames(classPrefix, className, clickable ? `${classPrefix}-clickable` : "")}`, onClick: (event) => handleClick(event), style: baseStyle }, rest),
    children || React__default.createElement(
      React__default.Fragment,
      null,
      title || description ? React__default.createElement(
        "div",
        { className: `${classPrefix}-left` },
        title ? React__default.createElement("div", { className: `${classPrefix}-title` }, title) : null,
        description ? React__default.createElement("div", { className: `${classPrefix}-description` }, description) : null
      ) : null,
      extra ? React__default.createElement("div", { className: `${classPrefix}-extra`, style: styles }, extra) : null
    ),
    (ctx === null || ctx === void 0 ? void 0 : ctx.divider) ? React__default.createElement("div", { className: `${classPrefix}-divider` }) : null
  );
};
Cell.displayName = "NutCell";
Cell.Group = CellGroup__default;
export {
  Cell as default
};