@zohodesk/dot
Version:
In this Library, we Provide Some Basic Components to Build Your Application
105 lines (99 loc) • 3.1 kB
JavaScript
/**** Libraries ****/
import React, { Component } from 'react';
import { SecondryPanel_defaultProps, SecondryPanelUL_defaultProps, SecondryPanelLI_defaultProps, SecondryPanelItem_defaultProps } from "./props/defaultProps";
import { SecondryPanel_propTypes, SecondryPanelUL_propTypes, SecondryPanelLI_propTypes, SecondryPanelItem_propTypes } from "./props/propTypes";
/**** Components ****/
import { Box } from '@zohodesk/components/lib/Layout';
import Dot from "../Dot/Dot";
import Container from '@zohodesk/components/lib/Layout/Container';
/**** CSS ****/
import style from "./SecondryPanel.module.css";
export default class SecondryPanel extends Component {
render() {
let {
children,
className
} = this.props;
return /*#__PURE__*/React.createElement("div", {
className: className
}, children);
}
}
SecondryPanel.propTypes = SecondryPanel_propTypes;
SecondryPanel.defaultProps = SecondryPanel_defaultProps;
export class SecondryPanelUL extends Component {
render() {
let {
children,
className,
dataId,
align
} = this.props;
return /*#__PURE__*/React.createElement(Container, {
isInline: true,
isCover: false,
alignBox: "row",
align: align,
className: `${style.listItemContainer} ${className}`,
dataId: dataId
}, children);
}
}
SecondryPanelUL.propTypes = SecondryPanelUL_propTypes;
SecondryPanelUL.defaultProps = SecondryPanelUL_defaultProps;
export class SecondryPanelLI extends Component {
render() {
let {
children,
className,
isShrink,
dataId
} = this.props;
return /*#__PURE__*/React.createElement(Box, {
flexible: true,
dataId: dataId // eslint-disable-next-line react/forbid-component-props
,
className: className,
adjust: true,
shrink: isShrink ? true : false
}, children);
}
}
SecondryPanelLI.propTypes = SecondryPanelLI_propTypes;
SecondryPanelLI.defaultProps = SecondryPanelLI_defaultProps;
export class SecondryPanelItem extends Component {
render() {
let {
children,
className,
dotClass,
isDot,
flex,
clipped,
dotSpacingType,
title
} = this.props;
return /*#__PURE__*/React.createElement(Container, {
align: "baseline",
isInline: flex ? false : true,
className: className,
"data-title": title,
alignBox: "row"
}, /*#__PURE__*/React.createElement(Box, {
flexible: true,
shrink: clipped,
className: `${clipped ? style.dottedStyle : ''}`
}, children), isDot ? /*#__PURE__*/React.createElement(Box, null, /*#__PURE__*/React.createElement(Dot // eslint-disable-next-line react/forbid-component-props
, {
className: `${dotClass ? dotClass : ''}`,
spacingType: dotSpacingType
})) : null);
}
}
SecondryPanelItem.propTypes = SecondryPanelItem_propTypes;
SecondryPanelItem.defaultProps = SecondryPanelItem_defaultProps; // if (__DOCS__) {
// SecondryPanel.docs = {
// folderName: 'List',
// componentGroup: 'SecondaryLayout'
// };
// }