@zohodesk/dot/lib/v1/list/ListLayout/ListLayout.js

In this Library, we Provide Some Basic Components to Build Your Application

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.Column = Column;
exports["default"] = ListLayout;

var _react = _interopRequireDefault(require("react"));

var _defaultProps = require("./props/defaultProps");

var _propTypes = require("./props/propTypes");

var _Layout = require("@zohodesk/components/es/v1/Layout");

var _ListLayoutModule = _interopRequireDefault(require("../../../list/ListLayout/ListLayout.module.css"));

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }

function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }

function ListLayout(props) {
  var children = props.children,
      className = props.className,
      needHover = props.needHover,
      align = props.align,
      view = props.view,
      containerClass = props.containerClass,
      isActive = props.isActive,
      onClick = props.onClick,
      onMouseLeave = props.onMouseLeave,
      dataId = props.dataId,
      dataTitle = props.dataTitle,
      a11y = props.a11y,
      isHovered = props.isHovered,
      onMouseEnter = props.onMouseEnter,
      needPointer = props.needPointer,
      isKeyboardActive = props.isKeyboardActive;
  var _a11y$role = a11y.role,
      role = _a11y$role === void 0 ? 'listitem' : _a11y$role,
      ariaLabel = a11y.ariaLabel,
      ariaPosinset = a11y.ariaPosinset,
      ariaSetsize = a11y.ariaSetsize;
  return /*#__PURE__*/_react["default"].createElement("div", {
    className: "".concat(_ListLayoutModule["default"].container, " ").concat(containerClass, " ").concat(needHover ? _ListLayoutModule["default"].listHover : '', " ").concat(isActive ? _ListLayoutModule["default"].active : '', " ").concat(_ListLayoutModule["default"][view], " ").concat(onClick && needPointer ? _ListLayoutModule["default"].cursorPointer : '', " ").concat(isHovered ? _ListLayoutModule["default"].hoveredStyle : '', " ").concat(isKeyboardActive ? _ListLayoutModule["default"].keyboardActive : '', " "),
    onClick: onClick,
    onMouseEnter: onMouseEnter,
    onMouseLeave: onMouseLeave,
    "data-id": dataId,
    "data-test-id": dataId,
    "data-title": dataTitle,
    tabIndex: onClick ? '0' : null,
    role: role,
    "data-a11y-inset-focus": true,
    "aria-label": ariaLabel,
    "aria-setsize": ariaSetsize,
    "aria-posinset": ariaPosinset
  }, /*#__PURE__*/_react["default"].createElement(_Layout.Container, {
    alignBox: "row",
    align: align,
    className: "".concat(_ListLayoutModule["default"].innerContainer, " ").concat(className ? className : '')
  }, children));
}

ListLayout.propTypes = _propTypes.ListLayout_propTypes;
ListLayout.defaultProps = _defaultProps.ListLayout_defaultProps;

function Column(props) {
  var children = props.children,
      className = props.className;
  return /*#__PURE__*/_react["default"].createElement(_Layout.Box, _extends({
    className: "".concat(className ? className : '')
  }, props), children);
}

Column.propTypes = _propTypes.Column_propTypes; // if (__DOCS__) {
//   ListLayout.docs = {
//     folderName: 'List',
//     componentGroup: 'ListLayout'
//   };
// }