Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 | 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x | /**** 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 <div className={className}>{children}</div>;
}
}
SecondryPanel.propTypes = SecondryPanel_propTypes;
SecondryPanel.defaultProps = SecondryPanel_defaultProps;
export class SecondryPanelUL extends Component {
render() {
let { children, className, dataId, align } = this.props;
return (
<Container
isInline
isCover={false}
alignBox='row'
align={align}
className={`${style.listItemContainer} ${className}`}
dataId={dataId}
>
{children}
</Container>
);
}
}
SecondryPanelUL.propTypes = SecondryPanelUL_propTypes;
SecondryPanelUL.defaultProps = SecondryPanelUL_defaultProps;
export class SecondryPanelLI extends Component {
render() {
let { children, className, isShrink, dataId } = this.props;
return (
<Box
flexible
dataId={dataId}
// eslint-disable-next-line react/forbid-component-props
className={className}
adjust
shrink={isShrink ? true : false}
>
{children}
</Box>
);
}
}
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 (
<Container
align='baseline'
isInline={flex ? false : true}
className={className}
data-title={title}
alignBox='row'
>
<Box flexible shrink={clipped} className={`${clipped ? style.dottedStyle : ''}`}>
{children}
</Box>
{isDot ? (
<Box>
<Dot
// eslint-disable-next-line react/forbid-component-props
className={`${dotClass ? dotClass : ''}`}
spacingType={dotSpacingType}
/>
</Box>
) : null}
</Container>
);
}
}
SecondryPanelItem.propTypes = SecondryPanelItem_propTypes;
SecondryPanelItem.defaultProps = SecondryPanelItem_defaultProps;
// if (__DOCS__) {
// SecondryPanel.docs = {
// folderName: 'List',
// componentGroup: 'SecondaryLayout'
// };
// }
|