@lunit/oui
Version:
Lunit Oncology UI components
79 lines (78 loc) • 4.05 kB
TypeScript
import { PaletteOptions } from '@mui/material';
type PaletteOptionItem<T extends PropertyKey> = Record<T, React.CSSProperties['color']>;
type LunitTealKey = '5' | '10' | '20' | '30' | '40' | '50' | '60' | '70' | '80' | '90';
type NeutralColorKey = '0' | '5' | '10' | '15' | '20' | '25' | '30' | '35' | '40' | '45' | '50' | '55' | '60' | '65' | '70' | '75' | '80' | '85' | '90' | '95' | '96' | '97' | '100';
type YellowKey = '5' | '10' | '20';
type OrangeKey = '5' | '10' | '20';
type MagentaKey = '5' | '10' | '20' | '30' | '40' | '50' | '60' | '70' | '80' | '90' | '100';
type RedKey = '5' | '10' | '20' | '30' | '40' | '50';
type BlueKey = '5' | '10' | '15' | '20' | '25' | '30' | '35' | '40' | '45' | '50' | '55' | '60' | '65' | '70' | '75';
type GreenKey = '10' | '20' | '30' | '40' | '50';
type PurpleKey = '5' | '10' | '15' | '20' | '30' | '40' | '50' | '60' | '70' | '80';
export type LunitTeal = PaletteOptionItem<LunitTealKey>;
export type NeutralColor = PaletteOptionItem<NeutralColorKey>;
export type Yellow = PaletteOptionItem<YellowKey>;
export type Orange = PaletteOptionItem<OrangeKey>;
export type Magenta = PaletteOptionItem<MagentaKey>;
export type Red = PaletteOptionItem<RedKey>;
export type Blue = PaletteOptionItem<BlueKey>;
export type Green = PaletteOptionItem<GreenKey>;
export type Purple = PaletteOptionItem<PurpleKey>;
type TPSKey = 'Cutoff1' | 'Cutoff49' | 'Cutoff50' | 'PositiveTc' | 'NegativeTc';
type CPSKey = 'Cutoff1' | 'Cutoff10' | 'Ca' | 'Cis' | 'Pch' | 'PcL' | 'PositiveTc' | 'NegativeTc' | 'PositiveIc' | 'NegativeIc';
type IOKey = 'BmrkCutoff1' | 'BmrkCutoff20' | 'Inflamed' | 'ImmuneEx' | 'ImmuneDsrt' | 'Ca' | 'Cs' | 'Lc' | 'Tc';
type TumorPurityKey = 'DensityBar' | 'Ca' | 'Tc' | 'Ntc';
type HER2Key = 'Ca' | 'Cis' | 'Her2_Negative' | 'Her2_1_Positive' | 'Her2_2_Positive' | 'Her2_3_Positive';
type ERPRKey = 'Ca' | 'Cis' | 'Erpr_Negative' | 'Erpr_1_Positive' | 'Erpr_2_Positive' | 'Erpr_3_Positive' | 'Cutoff0' | 'Cutoff1' | 'Cutoff10';
export type TPS = PaletteOptionItem<TPSKey>;
export type CPS = PaletteOptionItem<CPSKey>;
export type IO = PaletteOptionItem<IOKey>;
export type TumorPurity = PaletteOptionItem<TumorPurityKey>;
export type HER2 = PaletteOptionItem<HER2Key>;
export type ERPR = PaletteOptionItem<ERPRKey>;
type OthersKey = 'RowHover' | 'DatePickerHover' | 'Teal50Op20' | 'Teal50Op18' | 'Grn20Op32' | 'Grn30OP32';
export type Others = PaletteOptionItem<OthersKey>;
type AlertKey = 'InfoBG' | 'SuccessBG' | 'ErrorBG' | 'WarningBG';
export type Alert = PaletteOptionItem<AlertKey>;
type AnalysisStatusKey = 'Uploaded' | 'Ready' | 'ReadyHover' | 'ReadySelected' | 'Inferred' | 'InferredHover' | 'InferredSelected' | 'Analyzing' | 'Analyzed' | 'FailedEnabled' | 'FailedHover' | 'FailedSelected' | 'Ready' | 'ReadyHover' | 'ReadySelected' | 'Inferred' | 'InferredHover' | 'InferredSelected' | 'Invalid' | 'InvalidHover' | 'InvalidSelected';
export type AnalysisStatus = PaletteOptionItem<AnalysisStatusKey>;
export interface LunitPalette {
brand: {
primary: React.CSSProperties['color'];
secondary: React.CSSProperties['color'];
};
scope1: React.CSSProperties['color'];
scope2: React.CSSProperties['color'];
scope3: React.CSSProperties['color'];
scope4: React.CSSProperties['color'];
lunitTeal: LunitTeal;
neutralGrey: NeutralColor;
yellow: Yellow;
orange: Orange;
magenta: Magenta;
red: Red;
blue: Blue;
green: Green;
purple: Purple;
pdl1Tps: TPS;
pdl1Cps: CPS;
io: IO;
tumorPurity: TumorPurity;
her2: HER2;
erpr: ERPR;
others: Others;
alert: Alert;
/**
* @todo The dot, text colors for Analysis Status have not yet been determined.
* We will be updated once they are decided in the all-in-one plan. (hjkwon)
*/
analysisStatus: AnalysisStatus;
}
declare module '@mui/material/styles' {
interface Palette extends LunitPalette {
}
interface PaletteOptions extends LunitPalette {
}
}
declare const palette: PaletteOptions;
export default palette;