aboutsummaryrefslogtreecommitdiffstats
path: root/packages/website/ts/components/ui/multi_select.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'packages/website/ts/components/ui/multi_select.tsx')
-rw-r--r--packages/website/ts/components/ui/multi_select.tsx66
1 files changed, 0 insertions, 66 deletions
diff --git a/packages/website/ts/components/ui/multi_select.tsx b/packages/website/ts/components/ui/multi_select.tsx
deleted file mode 100644
index 2cf44cae1..000000000
--- a/packages/website/ts/components/ui/multi_select.tsx
+++ /dev/null
@@ -1,66 +0,0 @@
-import { colors } from '@0x/react-shared';
-import * as _ from 'lodash';
-import * as React from 'react';
-
-import { Container } from './container';
-
-export interface MultiSelectItemConfig {
- value: string;
- renderItemContent: (isSelected: boolean) => React.ReactNode;
- onClick?: () => void;
-}
-
-export interface MultiSelectProps {
- selectedValues?: string[];
- items: MultiSelectItemConfig[];
- backgroundColor?: string;
- height?: string;
-}
-
-export class MultiSelect extends React.Component<MultiSelectProps> {
- public static defaultProps = {
- backgroundColor: colors.white,
- };
- public render(): React.ReactNode {
- const { items, backgroundColor, selectedValues, height } = this.props;
- return (
- <Container
- backgroundColor={backgroundColor}
- borderRadius="4px"
- width="100%"
- height={height}
- overflowY="scroll"
- >
- {_.map(items, item => (
- <MultiSelectItem
- key={item.value}
- renderItemContent={item.renderItemContent}
- backgroundColor={backgroundColor}
- onClick={item.onClick}
- isSelected={_.isUndefined(selectedValues) || _.includes(selectedValues, item.value)}
- />
- ))}
- </Container>
- );
- }
-}
-
-export interface MultiSelectItemProps {
- renderItemContent: (isSelected: boolean) => React.ReactNode;
- isSelected?: boolean;
- onClick?: () => void;
- backgroundColor?: string;
-}
-
-export const MultiSelectItem: React.StatelessComponent<MultiSelectItemProps> = ({
- renderItemContent,
- isSelected,
- onClick,
- backgroundColor,
-}) => (
- <Container cursor="pointer" shouldDarkenOnHover={true} onClick={onClick} backgroundColor={backgroundColor}>
- <Container borderBottom={`1px solid ${colors.lightestGrey}`} margin="0px 15px" padding="10px 0px">
- {renderItemContent(isSelected)}
- </Container>
- </Container>
-);