react-cm-ui
Version:
React UI for Healthy Church
83 lines (79 loc) • 2.01 kB
TypeScript
import React from 'react';
import { ColorType } from './models';
export interface IconPropTypes {
/**
* Changes the margin from left or right.
*/
align?: 'left' | 'right';
/**
* Additional classes.
*/
className?: string;
/**
* Color of the icon.
*/
color?: ColorType,
/**
* If `true`, removes the margin.
*/
compact?: boolean;
/**
* Used for DOM testing. https://testing-library.com/docs/queries/bytestid/
*/
dataTestId?: string;
/**
* If `true`, an icon can be disabled.
*/
disable?: boolean;
/**
* If defined, `color` will be overriden and the `gradient.linearGradient` will be used.
* Note: `id` needs to be defined on the `<linearGradient>` element.
*/
gradient: React.ReactNode;
/**
* The `id` of the icon.
*/
id?: string;
/**
* If `true`, a icon can be formatted to appear on dark backgrounds.
*/
inverse?: boolean;
/**
* Event handler for onClick
*/
onClick?: () => void;
/**
* Event handler for onKeyDown
*/
onKeyDown?: (event) => void;
/**
* Transforms the rotation of the icon with the given number.
*/
rotate?: number;
/**
* Changes the height and width of the icon with the given number.
*/
size?: 'xxlarge' | 'xlarge' | 'large' | 'medium' | 'small' | 'xsmall' | 'xxsmall' | number;
/**
* If `true`, endlessly spins the icon counter-clockwise
*/
spin?: boolean;
/**
* Supply any inline styles to the icon.
*/
style?: React.CSSProperties;
/**
* Indicates whether or not the Icon can be focused.
*/
tabIndex?: number;
/**
* Provides a human-readable title for the element that contains it.
*/
title?: string | boolean;
/**
* The string for the icon you want to display.
*/
type: string;
}
declare const Icon: React.ComponentType<IconPropTypes>;
export default Icon;