lucid-ui
Version:
A UI component library from Xandr.
117 lines (115 loc) • 4.02 kB
TypeScript
import React from 'react';
import PropTypes from 'prop-types';
import { StandardProps } from '../../util/component-types';
export interface ILegendProps extends StandardProps, React.DetailedHTMLProps<React.HTMLAttributes<HTMLUListElement>, HTMLUListElement> {
/** Custom Item element (alias for `Legend.Item`) */
Item?: React.ReactNode;
/** Determines if the legend is vertical or horizontal */
orient?: 'vertical' | 'horizontal';
/** Determines if the legend has borders */
hasBorders?: boolean;
/** Determines if the sort order of legend items is reversed or not */
isReversed?: boolean;
}
export interface ILegendItemProps extends StandardProps {
/** Determines if the legend item has points */
hasPoint?: boolean;
/** Determines if the legend item has a line */
hasLine?: boolean;
/** Strings should match an existing color class unless they start with a '#'
for specific colors. E.g.:
- \`COLOR_0\`
- \`COLOR_GOOD\`
- \`'#123abc'\`
*/
color?: string;
/** Determines the kind of point */
pointKind?: number;
/** Called when a user clicks a legend \`Item\`. */
onClick?: (index: number, { event, props, }: {
event: React.MouseEvent<HTMLLIElement>;
props: ILegendItemProps;
}) => void;
}
export declare const Legend: {
(props: ILegendProps): React.ReactElement;
defaultProps: {
orient: string;
hasBorders: boolean;
isReversed: boolean;
};
displayName: string;
peek: {
description: string;
categories: string[];
};
HEIGHT: number;
propTypes: {
/**
Child element whose children represent content to be shown inside Legend.
*/
Item: PropTypes.Requireable<PropTypes.ReactNodeLike>;
/**
Appended to the component-specific class names set on the root element.
*/
className: PropTypes.Requireable<string>;
/**
Determine orientation of the legend.
*/
orient: PropTypes.Requireable<string>;
/**
Show the legend borders. Turn this off if you want to put the legend in a
\`ToolTip\` for example.
*/
hasBorders: PropTypes.Requireable<boolean>;
/**
Reverse the order of items in the legend.
*/
isReversed: PropTypes.Requireable<boolean>;
};
Item: {
(_props: ILegendItemProps): null;
displayName: string;
peek: {
description: string;
};
propName: string;
propTypes: {
children: PropTypes.Requireable<any>;
hasPoint?: undefined;
hasLine?: undefined;
/**
Strings should match an existing color class unless they start with a '#' for specific colors. E.g.:
- \`COLOR_0\`
- \`COLOR_GOOD\`
- \`'#123abc'\`
*/
color?: undefined;
pointKind?: undefined;
onClick?: undefined;
/**
Class names that are appended to the defaults.
*/
className?: undefined;
} | {
hasPoint: PropTypes.Requireable<boolean>;
hasLine: PropTypes.Requireable<boolean>;
/**
Strings should match an existing color class unless they start with a '#' for specific colors. E.g.:
- \`COLOR_0\`
- \`COLOR_GOOD\`
- \`'#123abc'\`
*/
color: PropTypes.Requireable<string>;
pointKind: PropTypes.Requireable<number>;
onClick: PropTypes.Requireable<(...args: any[]) => any>;
/**
Class names that are appended to the defaults.
*/
className: PropTypes.Requireable<string>;
children?: undefined;
};
};
};
export default Legend;
//# sourceMappingURL=Legend.d.ts.map