mirror of
https://github.com/FlipsideCrypto/DefinitelyTyped.git
synced 2026-02-06 10:56:53 +00:00
🤖 Merge PR #44867 [react-color] Fixed typings and added missing properties by @alexandercerutti
* Added missin styling properties for CustomPickerProps * Removed unused imports from react * Added className and styles also to ColorPickerProps * Fixed Chrome Component interface to be coherent to the code * Removed optionals from ChromePickerStylesProps as they are optionals for Classes from reactcss * Adapted AlphaPicker Component to be coherent with code * Adapted BlockPicker to be coherent with code * Adapted CirclePicker to be coherent with code * Adapted CompactPicker to be coherent with code * Adapted GithubPickerStyles to be coherent with code * Adapted HuePicker to be coherent with code * Adapted Material component to be coherent with code * Adapted PhotoshopPicker to be coherent with code * Adapted SketchPicker to be coherent with code * Adapted SliderPicker to be coherent with code * Adapted SwatchedPicker to be coherent with code * Adapted TwitterPicker to be coherent with code * Changed all styles props to be Partial * Updated react-color version and updated contributors * Added tests for className * Reverted react-color version to most recent * Replaced tab indentation with spaces * Applied the changes also to v2 * Applied changes from #44685 (was opened at the same time)
This commit is contained in:
parent
26bfa8065c
commit
d1013f6013
10
types/react-color/index.d.ts
vendored
10
types/react-color/index.d.ts
vendored
@ -6,11 +6,13 @@
|
||||
// Nokogiri <https://github.com/nkgrnkgr>,
|
||||
// 0815Strohhut <https://github.com/0815Strohhut>,
|
||||
// Daniel Fürst <https://github.com/dnlfrst>,
|
||||
// Erick Tamayo <https://github.com/ericktamayo>
|
||||
// Erick Tamayo <https://github.com/ericktamayo>,
|
||||
// Alexander P. Cerutti <https://github.com/alexandercerutti>
|
||||
// Definitions: https://github.com/DefinitelyTyped/DefinitelyTyped
|
||||
// TypeScript Version: 2.8
|
||||
|
||||
import { ComponentClass, ClassAttributes, StatelessComponent, ReactNode } from "react";
|
||||
import { ClassAttributes, ReactNode } from "react";
|
||||
import { Classes } from "reactcss";
|
||||
|
||||
export interface HSLColor {
|
||||
a?: number;
|
||||
@ -38,6 +40,8 @@ export type ColorChangeHandler = (color: ColorResult, event: React.ChangeEvent<H
|
||||
|
||||
export interface ColorPickerProps<A> extends ClassAttributes<A> {
|
||||
color?: Color;
|
||||
className?: string;
|
||||
styles?: Partial<Classes<any>>;
|
||||
onChange?: ColorChangeHandler;
|
||||
onChangeComplete?: ColorChangeHandler;
|
||||
}
|
||||
@ -45,6 +49,8 @@ export interface ColorPickerProps<A> extends ClassAttributes<A> {
|
||||
export interface CustomPickerProps<A> extends ClassAttributes<A> {
|
||||
color?: Color;
|
||||
pointer?: ReactNode;
|
||||
className?: string;
|
||||
styles?: Partial<Classes<any>>;
|
||||
onChange: ColorChangeHandler;
|
||||
}
|
||||
|
||||
|
||||
@ -1,9 +1,16 @@
|
||||
import { Component } from "react";
|
||||
import { Component, CSSProperties } from "react";
|
||||
import { ColorPickerProps } from "../../..";
|
||||
import { Classes } from "reactcss";
|
||||
|
||||
export interface AlphaPickerStylesProps {
|
||||
picker: CSSProperties;
|
||||
alpha: CSSProperties;
|
||||
}
|
||||
|
||||
export interface AlphaPickerProps extends ColorPickerProps<AlphaPicker> {
|
||||
height?: string;
|
||||
width?: string;
|
||||
styles?: Partial<Classes<AlphaPickerStylesProps>>;
|
||||
}
|
||||
|
||||
export default class AlphaPicker extends Component<AlphaPickerProps> {}
|
||||
export default class AlphaPicker extends Component<AlphaPickerProps> { }
|
||||
|
||||
@ -1,11 +1,22 @@
|
||||
import { Component } from "react";
|
||||
import { Component, CSSProperties } from "react";
|
||||
import { ColorPickerProps, ColorResult } from "../../..";
|
||||
import { Classes } from "reactcss";
|
||||
|
||||
export interface BlockPickerStylesProps {
|
||||
card: CSSProperties;
|
||||
head: CSSProperties;
|
||||
body: CSSProperties;
|
||||
label: CSSProperties;
|
||||
triangle: CSSProperties;
|
||||
input: CSSProperties;
|
||||
}
|
||||
|
||||
export interface BlockPickerProps extends ColorPickerProps<BlockPicker> {
|
||||
colors?: string[];
|
||||
width?: string;
|
||||
triangle?: 'hide' | 'top';
|
||||
styles?: Partial<Classes<BlockPickerStylesProps>>;
|
||||
onSwatchHover?(color: ColorResult, event: MouseEvent): void;
|
||||
}
|
||||
|
||||
export default class BlockPicker extends Component<BlockPickerProps> {}
|
||||
export default class BlockPicker extends Component<BlockPickerProps> { }
|
||||
|
||||
@ -1,37 +1,26 @@
|
||||
import { Component, CSSProperties } from "react";
|
||||
import { ColorPickerProps } from "../../..";
|
||||
import { Classes } from "reactcss";
|
||||
|
||||
export interface ChromePickerDefaultStyles {
|
||||
picker?: CSSProperties;
|
||||
saturation?: CSSProperties;
|
||||
Saturation?: CSSProperties;
|
||||
body?: CSSProperties;
|
||||
controls?: CSSProperties;
|
||||
color?: CSSProperties;
|
||||
swatch?: CSSProperties;
|
||||
active?: CSSProperties;
|
||||
toggles?: CSSProperties;
|
||||
hue?: CSSProperties;
|
||||
Hue?: CSSProperties;
|
||||
alpha?: CSSProperties;
|
||||
Alpha?: CSSProperties;
|
||||
}
|
||||
|
||||
export interface ChromePickerDisableAlphaStyles {
|
||||
color?: CSSProperties;
|
||||
alpha?: CSSProperties;
|
||||
hue?: CSSProperties;
|
||||
swatch?: CSSProperties;
|
||||
}
|
||||
|
||||
export interface ChromePickerStyles {
|
||||
default?: ChromePickerDefaultStyles;
|
||||
disableAlpha?: ChromePickerDisableAlphaStyles;
|
||||
export interface ChromePickerStylesProps {
|
||||
picker: CSSProperties;
|
||||
saturation: CSSProperties;
|
||||
Saturation: CSSProperties;
|
||||
body: CSSProperties;
|
||||
controls: CSSProperties;
|
||||
color: CSSProperties;
|
||||
swatch: CSSProperties;
|
||||
active: CSSProperties;
|
||||
toggles: CSSProperties;
|
||||
hue: CSSProperties;
|
||||
Hue: CSSProperties;
|
||||
alpha: CSSProperties;
|
||||
Alpha: CSSProperties;
|
||||
}
|
||||
|
||||
export interface ChromePickerProps extends ColorPickerProps<ChromePicker> {
|
||||
disableAlpha?: boolean;
|
||||
styles?: ChromePickerStyles;
|
||||
styles?: Partial<Classes<ChromePickerStylesProps>>;
|
||||
}
|
||||
|
||||
export default class ChromePicker extends Component<ChromePickerProps> {}
|
||||
export default class ChromePicker extends Component<ChromePickerProps> { }
|
||||
|
||||
@ -1,12 +1,18 @@
|
||||
import { Component } from "react";
|
||||
import { Component, CSSProperties } from "react";
|
||||
import { ColorPickerProps, ColorResult } from "../../..";
|
||||
import { Classes } from "reactcss";
|
||||
|
||||
export interface CirclePickerStylesProps {
|
||||
card: CSSProperties;
|
||||
}
|
||||
|
||||
export interface CirclePickerProps extends ColorPickerProps<CirclePicker> {
|
||||
colors?: string[];
|
||||
width?: string;
|
||||
circleSize?: number;
|
||||
circleSpacing?: number;
|
||||
styles?: Partial<Classes<CirclePickerStylesProps>>;
|
||||
onSwatchHover?(color: ColorResult, event: MouseEvent): void;
|
||||
}
|
||||
|
||||
export default class CirclePicker extends Component<CirclePickerProps> {}
|
||||
export default class CirclePicker extends Component<CirclePickerProps> { }
|
||||
|
||||
@ -1,9 +1,17 @@
|
||||
import { Component } from "react";
|
||||
import { Component, CSSProperties } from "react";
|
||||
import { ColorPickerProps, ColorResult } from "../../..";
|
||||
import { Classes } from "reactcss";
|
||||
|
||||
export interface CompactPickerStylesProps {
|
||||
Compact: CSSProperties;
|
||||
compact: CSSProperties;
|
||||
clear: CSSProperties;
|
||||
}
|
||||
|
||||
export interface CompactPickerProps extends ColorPickerProps<CompactPicker> {
|
||||
colors?: string[];
|
||||
styles?: Partial<Classes<CompactPickerStylesProps>>;
|
||||
onSwatchHover?(color: ColorResult, event: MouseEvent): void;
|
||||
}
|
||||
|
||||
export default class CompactPicker extends Component<CompactPickerProps> {}
|
||||
export default class CompactPicker extends Component<CompactPickerProps> { }
|
||||
|
||||
@ -1,11 +1,19 @@
|
||||
import { Component } from "react";
|
||||
import { Component, CSSProperties } from "react";
|
||||
import { ColorPickerProps, ColorResult } from "../../..";
|
||||
import { Classes } from "reactcss";
|
||||
|
||||
export interface GithubPickerStylesProps {
|
||||
card: CSSProperties;
|
||||
triangle: CSSProperties;
|
||||
triangleShadow: CSSProperties;
|
||||
}
|
||||
|
||||
export interface GithubPickerProps extends ColorPickerProps<GithubPicker> {
|
||||
colors?: string[];
|
||||
width?: string;
|
||||
triangle?: 'hide' | 'top-left' | 'top-right';
|
||||
styles?: Partial<Classes<GithubPickerStylesProps>>;
|
||||
onSwatchHover?(color: ColorResult, event: MouseEvent): void;
|
||||
}
|
||||
|
||||
export default class GithubPicker extends Component<GithubPickerProps> {}
|
||||
export default class GithubPicker extends Component<GithubPickerProps> { }
|
||||
|
||||
11
types/react-color/lib/components/hue/Hue.d.ts
vendored
11
types/react-color/lib/components/hue/Hue.d.ts
vendored
@ -1,9 +1,16 @@
|
||||
import { Component } from "react";
|
||||
import { Component, CSSProperties } from "react";
|
||||
import { ColorPickerProps } from "../../..";
|
||||
import { Classes } from "reactcss";
|
||||
|
||||
export interface HuePickerStylesProps {
|
||||
picker: CSSProperties;
|
||||
hue: CSSProperties;
|
||||
}
|
||||
|
||||
export interface HuePickerProps extends ColorPickerProps<HuePicker> {
|
||||
height?: string;
|
||||
width?: string;
|
||||
styles?: Partial<Classes<HuePickerStylesProps>>;
|
||||
}
|
||||
|
||||
export default class HuePicker extends Component<HuePickerProps> {}
|
||||
export default class HuePicker extends Component<HuePickerProps> { }
|
||||
|
||||
@ -1,6 +1,22 @@
|
||||
import { Component } from "react";
|
||||
import { Component, CSSProperties } from "react";
|
||||
import { ColorPickerProps } from "../../..";
|
||||
import { Classes } from "reactcss";
|
||||
|
||||
export type MaterialPickerProps = ColorPickerProps<MaterialPicker>;
|
||||
export interface MaterialPickerStylesProps {
|
||||
material: CSSProperties;
|
||||
HEXwrap: CSSProperties;
|
||||
HEXinput: CSSProperties;
|
||||
HEXlabel: CSSProperties;
|
||||
Hex: CSSProperties;
|
||||
RGBwrap: CSSProperties;
|
||||
RGBinput: CSSProperties;
|
||||
RGBlabel: CSSProperties;
|
||||
split: CSSProperties;
|
||||
third: CSSProperties;
|
||||
}
|
||||
|
||||
export default class MaterialPicker extends Component<MaterialPickerProps> {}
|
||||
export interface MaterialPickerProps extends ColorPickerProps<MaterialPicker> {
|
||||
styles?: Partial<Classes<MaterialPickerStylesProps>>;
|
||||
}
|
||||
|
||||
export default class MaterialPicker extends Component<MaterialPickerProps> { }
|
||||
|
||||
@ -1,10 +1,24 @@
|
||||
import { Component } from "react";
|
||||
import { Component, CSSProperties } from "react";
|
||||
import { ColorChangeHandler, ColorPickerProps } from "../../..";
|
||||
import { Classes } from "reactcss";
|
||||
|
||||
export interface PhotoshopPickerStylesProps {
|
||||
picker: CSSProperties;
|
||||
head: CSSProperties;
|
||||
body: CSSProperties;
|
||||
saturation: CSSProperties;
|
||||
hue: CSSProperties;
|
||||
controls: CSSProperties;
|
||||
top: CSSProperties;
|
||||
previews: CSSProperties;
|
||||
actions: CSSProperties;
|
||||
}
|
||||
|
||||
export interface PhotoshopPickerProps extends ColorPickerProps<PhotoshopPicker> {
|
||||
header?: string;
|
||||
styles?: Partial<Classes<PhotoshopPickerStylesProps>>;
|
||||
onAccept?: ColorChangeHandler;
|
||||
onCancel?: ColorChangeHandler;
|
||||
}
|
||||
|
||||
export default class PhotoshopPicker extends Component<PhotoshopPickerProps> {}
|
||||
export default class PhotoshopPicker extends Component<PhotoshopPickerProps> { }
|
||||
|
||||
@ -1,11 +1,27 @@
|
||||
import { Component } from "react";
|
||||
import { Component, CSSProperties } from "react";
|
||||
import { ColorPickerProps, ColorResult } from "../../..";
|
||||
import { Classes } from "reactcss";
|
||||
|
||||
export interface SketchPickerStylesProps {
|
||||
picker: CSSProperties;
|
||||
saturation: CSSProperties;
|
||||
Saturation: CSSProperties;
|
||||
controls: CSSProperties;
|
||||
sliders: CSSProperties;
|
||||
color: CSSProperties;
|
||||
activeColor: CSSProperties;
|
||||
hue: CSSProperties;
|
||||
Hue: CSSProperties;
|
||||
alpha: CSSProperties;
|
||||
Alpha: CSSProperties;
|
||||
}
|
||||
|
||||
export interface SketchPickerProps extends ColorPickerProps<SketchPicker> {
|
||||
disableAlpha?: boolean;
|
||||
presetColors?: string[];
|
||||
width?: string;
|
||||
styles?: Partial<Classes<SketchPickerStylesProps>>;
|
||||
onSwatchHover?(color: ColorResult, event: MouseEvent): void;
|
||||
}
|
||||
|
||||
export default class SketchPicker extends Component<SketchPickerProps> {}
|
||||
export default class SketchPicker extends Component<SketchPickerProps> { }
|
||||
|
||||
@ -1,6 +1,14 @@
|
||||
import { Component } from "react";
|
||||
import { Component, CSSProperties } from "react";
|
||||
import { ColorPickerProps } from "../../..";
|
||||
import { Classes } from "reactcss";
|
||||
|
||||
export type SliderPickerProps = ColorPickerProps<SliderPicker>;
|
||||
export interface SliderPickerStylesProps {
|
||||
hue: CSSProperties;
|
||||
Hue: CSSProperties;
|
||||
}
|
||||
|
||||
export default class SliderPicker extends Component<SliderPickerProps> {}
|
||||
export interface SliderPickerProps extends ColorPickerProps<SliderPicker> {
|
||||
styles?: Partial<Classes<SliderPickerStylesProps>>;
|
||||
}
|
||||
|
||||
export default class SliderPicker extends Component<SliderPickerProps> { }
|
||||
|
||||
@ -1,11 +1,20 @@
|
||||
import { Component } from "react";
|
||||
import { Component, CSSProperties } from "react";
|
||||
import { ColorPickerProps, ColorResult } from "../../..";
|
||||
import { Classes } from "reactcss";
|
||||
|
||||
export interface SwatchesPickerStylesProps {
|
||||
picker: CSSProperties;
|
||||
overflow: CSSProperties;
|
||||
body: CSSProperties;
|
||||
clear: CSSProperties;
|
||||
}
|
||||
|
||||
export interface SwatchesPickerProps extends ColorPickerProps<SwatchesPicker> {
|
||||
colors?: string[][];
|
||||
height?: number;
|
||||
width?: number;
|
||||
styles?: Partial<Classes<SwatchesPickerStylesProps>>;
|
||||
onSwatchHover?(color: ColorResult, event: MouseEvent): void;
|
||||
}
|
||||
|
||||
export default class SwatchesPicker extends Component<SwatchesPickerProps> {}
|
||||
export default class SwatchesPicker extends Component<SwatchesPickerProps> { }
|
||||
|
||||
@ -1,11 +1,25 @@
|
||||
import { Component } from "react";
|
||||
import { Component, CSSProperties } from "react";
|
||||
import { ColorPickerProps, ColorResult } from "../../..";
|
||||
import { Classes } from "reactcss";
|
||||
|
||||
export interface TwitterPickerStylesProps {
|
||||
card: CSSProperties;
|
||||
body: CSSProperties;
|
||||
label: CSSProperties;
|
||||
triangle: CSSProperties;
|
||||
triangleShadow: CSSProperties;
|
||||
hash: CSSProperties;
|
||||
input: CSSProperties;
|
||||
swatch: CSSProperties;
|
||||
clear: CSSProperties;
|
||||
}
|
||||
|
||||
export interface TwitterPickerProps extends ColorPickerProps<TwitterPicker> {
|
||||
colors?: string[];
|
||||
width?: string;
|
||||
triangle?: 'hide' | 'top-left' | 'top-right';
|
||||
styles?: Partial<Classes<TwitterPickerStylesProps>>;
|
||||
onSwatchHover?(color: ColorResult, event: MouseEvent): void;
|
||||
}
|
||||
|
||||
export default class TwitterPicker extends Component<TwitterPickerProps> {}
|
||||
export default class TwitterPicker extends Component<TwitterPickerProps> { }
|
||||
|
||||
@ -21,11 +21,11 @@ const CustomComponent: StatelessComponent<CustomProps> = (props: CustomProps) =>
|
||||
|
||||
return (
|
||||
<div>
|
||||
<Alpha color={ props.color } onChange={ onChange } />
|
||||
<Checkboard size={ 10 } white="transparent" grey="#333" />
|
||||
<EditableInput value={ props.color } label="Test" onChange={ onChange } />
|
||||
<Hue color={ props.color } direction="horizontal" onChange={ onChange } />
|
||||
<Saturation color={ props.color } onChange={ onChange } />
|
||||
<Alpha color={props.color} onChange={onChange} />
|
||||
<Checkboard size={10} white="transparent" grey="#333" />
|
||||
<EditableInput value={props.color} label="Test" onChange={onChange} />
|
||||
<Hue color={props.color} direction="horizontal" onChange={onChange} />
|
||||
<Saturation color={props.color} onChange={onChange} />
|
||||
</div>
|
||||
);
|
||||
};
|
||||
@ -33,17 +33,17 @@ const Custom = CustomPicker(CustomComponent);
|
||||
|
||||
const colors = ["#000", "#333"];
|
||||
|
||||
render(<AlphaPicker height="100px" width="100px" />, document.getElementById("main"));
|
||||
render(<BlockPicker colors={ colors } width="100px" />, document.getElementById("main"));
|
||||
render(<ChromePicker disableAlpha styles={{ default: { picker: { width: 200 }}}} />, document.getElementById("main"));
|
||||
render(<CirclePicker colors={ colors } width="100px" />, document.getElementById("main"));
|
||||
render(<CompactPicker colors={ colors } />, document.getElementById("main"));
|
||||
render(<GithubPicker colors={ colors } width="100px" />, document.getElementById("main"));
|
||||
render(<HuePicker height="100px" width="100px" />, document.getElementById("main"));
|
||||
render(<MaterialPicker />, document.getElementById("main"));
|
||||
render(<PhotoshopPicker header="Test" />, document.getElementById("main"));
|
||||
render(<SketchPicker disableAlpha presetColors={ colors } />, document.getElementById("main"));
|
||||
render(<SliderPicker />, document.getElementById("main"));
|
||||
render(<SwatchesPicker colors={ [colors] } height={ 100 } width={ 100 } />, document.getElementById("main"));
|
||||
render(<TwitterPicker />, document.getElementById("main"));
|
||||
render(<AlphaPicker className="custom-cn" height="100px" width="100px" />, document.getElementById("main"));
|
||||
render(<BlockPicker className="custom-cn" colors={colors} width="100px" />, document.getElementById("main"));
|
||||
render(<ChromePicker className="custom-cn" disableAlpha styles={{ default: { picker: { width: 200 } } }} />, document.getElementById("main"));
|
||||
render(<CirclePicker className="custom-cn" colors={colors} width="100px" />, document.getElementById("main"));
|
||||
render(<CompactPicker className="custom-cn" colors={colors} />, document.getElementById("main"));
|
||||
render(<GithubPicker className="custom-cn" colors={colors} width="100px" />, document.getElementById("main"));
|
||||
render(<HuePicker className="custom-cn" height="100px" width="100px" />, document.getElementById("main"));
|
||||
render(<MaterialPicker className="custom-cn" />, document.getElementById("main"));
|
||||
render(<PhotoshopPicker className="custom-cn" header="Test" />, document.getElementById("main"));
|
||||
render(<SketchPicker className="custom-cn" disableAlpha presetColors={colors} />, document.getElementById("main"));
|
||||
render(<SliderPicker className="custom-cn" />, document.getElementById("main"));
|
||||
render(<SwatchesPicker className="custom-cn" colors={[colors]} height={100} width={100} />, document.getElementById("main"));
|
||||
render(<TwitterPicker className="custom-cn" />, document.getElementById("main"));
|
||||
render(<Custom />, document.getElementById("main"));
|
||||
|
||||
@ -1,5 +1,6 @@
|
||||
import { Component, ComponentType } from "react";
|
||||
import { Component, ComponentType, CSSProperties } from "react";
|
||||
import { RenderersProps, CustomPickerProps } from "../../..";
|
||||
import { Classes } from "reactcss";
|
||||
|
||||
export interface AlphaPickerProps extends RenderersProps, CustomPickerProps {
|
||||
width?: string;
|
||||
@ -7,7 +8,13 @@ export interface AlphaPickerProps extends RenderersProps, CustomPickerProps {
|
||||
direction?: "horizontal" | "vertical";
|
||||
style?: any;
|
||||
pointer?: ComponentType;
|
||||
styles?: Partial<Classes<AlphaPickerStylesProps>>;
|
||||
className?: string;
|
||||
}
|
||||
|
||||
export default class AlphaPicker extends Component<AlphaPickerProps> {}
|
||||
export default class AlphaPicker extends Component<AlphaPickerProps> { }
|
||||
|
||||
export interface AlphaPickerStylesProps {
|
||||
picker: CSSProperties;
|
||||
alpha: CSSProperties;
|
||||
}
|
||||
|
||||
@ -1,17 +1,14 @@
|
||||
import { Component, CSSProperties } from "react";
|
||||
import { CustomPickerProps, ColorState } from "../../..";
|
||||
import { Classes } from "reactcss";
|
||||
|
||||
export interface BlockPickerDefaultStyles {
|
||||
card?: CSSProperties;
|
||||
head?: CSSProperties;
|
||||
body?: CSSProperties;
|
||||
label?: CSSProperties;
|
||||
triangle?: CSSProperties;
|
||||
input?: CSSProperties;
|
||||
}
|
||||
|
||||
export interface BlockPickerStyles {
|
||||
default?: BlockPickerDefaultStyles;
|
||||
export interface BlockPickerStylesProps {
|
||||
card: CSSProperties;
|
||||
head: CSSProperties;
|
||||
body: CSSProperties;
|
||||
label: CSSProperties;
|
||||
triangle: CSSProperties;
|
||||
input: CSSProperties;
|
||||
}
|
||||
|
||||
export interface BlockPickerProps extends CustomPickerProps {
|
||||
@ -19,8 +16,8 @@ export interface BlockPickerProps extends CustomPickerProps {
|
||||
colors?: string[];
|
||||
width?: string;
|
||||
triangle?: "hide" | "top";
|
||||
styles?: BlockPickerStyles;
|
||||
styles?: Partial<Classes<BlockPickerStylesProps>>;
|
||||
className?: string;
|
||||
}
|
||||
|
||||
export default class BlockPicker extends Component<BlockPickerProps> {}
|
||||
export default class BlockPicker extends Component<BlockPickerProps> { }
|
||||
|
||||
@ -1,20 +1,21 @@
|
||||
import { Component, CSSProperties } from "react";
|
||||
import { RenderersProps, CustomPickerProps } from "../../..";
|
||||
import { Classes } from "reactcss";
|
||||
|
||||
export interface ChromePickerDefaultStyles {
|
||||
picker?: CSSProperties;
|
||||
saturation?: CSSProperties;
|
||||
Saturation?: CSSProperties;
|
||||
body?: CSSProperties;
|
||||
controls?: CSSProperties;
|
||||
color?: CSSProperties;
|
||||
swatch?: CSSProperties;
|
||||
active?: CSSProperties;
|
||||
toggles?: CSSProperties;
|
||||
hue?: CSSProperties;
|
||||
Hue?: CSSProperties;
|
||||
alpha?: CSSProperties;
|
||||
Alpha?: CSSProperties;
|
||||
export interface ChromePickerStylesProps {
|
||||
picker: CSSProperties;
|
||||
saturation: CSSProperties;
|
||||
Saturation: CSSProperties;
|
||||
body: CSSProperties;
|
||||
controls: CSSProperties;
|
||||
color: CSSProperties;
|
||||
swatch: CSSProperties;
|
||||
active: CSSProperties;
|
||||
toggles: CSSProperties;
|
||||
hue: CSSProperties;
|
||||
Hue: CSSProperties;
|
||||
alpha: CSSProperties;
|
||||
Alpha: CSSProperties;
|
||||
}
|
||||
|
||||
export interface ChromePickerDisableAlphaStyles {
|
||||
@ -24,16 +25,11 @@ export interface ChromePickerDisableAlphaStyles {
|
||||
swatch?: CSSProperties;
|
||||
}
|
||||
|
||||
export interface ChromePickerStyles {
|
||||
default?: ChromePickerDefaultStyles;
|
||||
disableAlpha?: ChromePickerDisableAlphaStyles;
|
||||
}
|
||||
|
||||
export interface ChromePickerProps extends RenderersProps, CustomPickerProps {
|
||||
width?: string;
|
||||
disableAlpha?: boolean;
|
||||
styles?: ChromePickerStyles;
|
||||
styles?: Partial<Classes<ChromePickerStylesProps>>;
|
||||
className?: string;
|
||||
}
|
||||
|
||||
export default class ChromePicker extends Component<ChromePickerProps> {}
|
||||
export default class ChromePicker extends Component<ChromePickerProps> { }
|
||||
|
||||
@ -1,12 +1,9 @@
|
||||
import { Component, CSSProperties } from "react";
|
||||
import { CustomPickerProps, ColorState } from "../../..";
|
||||
import { Classes } from "reactcss";
|
||||
|
||||
export interface CirclePickerDefaultStyles {
|
||||
card?: CSSProperties;
|
||||
}
|
||||
|
||||
export interface CirclePickerStyles {
|
||||
default?: CirclePickerDefaultStyles;
|
||||
export interface CirclePickerStylesProps {
|
||||
card: CSSProperties;
|
||||
}
|
||||
|
||||
export interface CirclePickerProps extends CustomPickerProps {
|
||||
@ -15,8 +12,7 @@ export interface CirclePickerProps extends CustomPickerProps {
|
||||
circleSize?: number;
|
||||
circleSpacing?: number;
|
||||
onSwatchHover?: (color: ColorState, event: MouseEvent) => void;
|
||||
styles?: CirclePickerStyles;
|
||||
className?: string;
|
||||
styles?: Partial<Classes<CirclePickerStylesProps>>;
|
||||
}
|
||||
|
||||
export default class CirclePicker extends Component<CirclePickerProps> {}
|
||||
export default class CirclePicker extends Component<CirclePickerProps> { }
|
||||
|
||||
@ -1,5 +1,6 @@
|
||||
import { ComponentType } from "react";
|
||||
import { Color, ColorState, ColorChangeHandler } from "../../..";
|
||||
import { Classes } from "reactcss";
|
||||
|
||||
type SetDifference<A, B> = A extends B ? never : A;
|
||||
|
||||
@ -13,6 +14,8 @@ export interface CustomPickerInjectedProps extends Partial<ColorState> {
|
||||
|
||||
export interface CustomPickerProps {
|
||||
color?: Color;
|
||||
className?: string;
|
||||
styles?: Partial<Classes<any>>;
|
||||
onChange?: OnChangeHandler;
|
||||
onChangeComplete?: OnChangeHandler;
|
||||
}
|
||||
@ -21,4 +24,4 @@ export default function CustomPicker<A>(
|
||||
component: ComponentType<A & CustomPickerInjectedProps>
|
||||
): ComponentType<Diff<A, CustomPickerProps> & CustomPickerProps>;
|
||||
|
||||
export {};
|
||||
export { };
|
||||
|
||||
@ -1,20 +1,17 @@
|
||||
import { Component, CSSProperties } from "react";
|
||||
import { CustomPickerProps, ColorState } from "../../..";
|
||||
import { Classes } from "reactcss";
|
||||
|
||||
export interface CompactPickerDefaultStyles {
|
||||
export interface CompactPickerStylesProps {
|
||||
Compact?: CSSProperties;
|
||||
compact?: CSSProperties;
|
||||
clear?: CSSProperties;
|
||||
}
|
||||
export interface CompactPickerStyles {
|
||||
default?: CompactPickerDefaultStyles;
|
||||
}
|
||||
|
||||
export interface CompactPickerProps extends CustomPickerProps {
|
||||
colors?: string[];
|
||||
styles?: Partial<Classes<CompactPickerStylesProps>>;
|
||||
onSwatchHover?(color: ColorState, event: MouseEvent): void;
|
||||
styles?: CompactPickerStyles;
|
||||
className?: string;
|
||||
}
|
||||
|
||||
export default class CompactPicker extends Component<CompactPickerProps> {}
|
||||
export default class CompactPicker extends Component<CompactPickerProps> { }
|
||||
|
||||
@ -1,27 +1,11 @@
|
||||
import { Component, CSSProperties } from "react";
|
||||
import { CustomPickerProps, ColorState } from "../../..";
|
||||
import { Classes } from "reactcss";
|
||||
|
||||
export interface GithubPickerDefaultStyles {
|
||||
card?: CSSProperties;
|
||||
triangle?: CSSProperties;
|
||||
triangleShadow?: CSSProperties;
|
||||
}
|
||||
|
||||
export interface GithubPickerTriangleStyles {
|
||||
triangle?: CSSProperties;
|
||||
triangleShadow?: CSSProperties;
|
||||
}
|
||||
|
||||
export interface GithubPickerHideTriangleStyles {
|
||||
triangle?: CSSProperties;
|
||||
"top-left-triangle"?: GithubPickerTriangleStyles;
|
||||
"top-right-triangle"?: GithubPickerTriangleStyles;
|
||||
"bottom-left-triangle"?: GithubPickerTriangleStyles;
|
||||
"bottom-right-triangle"?: GithubPickerTriangleStyles;
|
||||
}
|
||||
|
||||
export interface GithubPickerStyles {
|
||||
default?: GithubPickerDefaultStyles;
|
||||
export interface GithubPickerStylesProps {
|
||||
card: CSSProperties;
|
||||
triangle: CSSProperties;
|
||||
triangleShadow: CSSProperties;
|
||||
}
|
||||
|
||||
export interface GithubPickerProps extends CustomPickerProps {
|
||||
@ -29,8 +13,7 @@ export interface GithubPickerProps extends CustomPickerProps {
|
||||
width?: string;
|
||||
triangle?: "hide" | "top-left" | "top-right" | "bottom-left" | "bottom-right";
|
||||
onSwatchHover?(color: ColorState, event: MouseEvent): void;
|
||||
className?: string;
|
||||
styles?: GithubPickerStyles;
|
||||
styles?: Partial<Classes<GithubPickerStylesProps>>;
|
||||
}
|
||||
|
||||
export default class GithubPicker extends Component<GithubPickerProps> {}
|
||||
export default class GithubPicker extends Component<GithubPickerProps> { }
|
||||
|
||||
16
types/react-color/v2/lib/components/hue/Hue.d.ts
vendored
16
types/react-color/v2/lib/components/hue/Hue.d.ts
vendored
@ -1,13 +1,10 @@
|
||||
import { Component, ComponentType, CSSProperties } from "react";
|
||||
import { CustomPickerProps } from "../../..";
|
||||
import { Classes } from "reactcss";
|
||||
|
||||
export interface HuePickerDefaultStyle {
|
||||
picker?: CSSProperties;
|
||||
hue?: CSSProperties;
|
||||
}
|
||||
|
||||
export interface HuePickerStyle {
|
||||
default?: HuePickerDefaultStyle;
|
||||
export interface HuePickerStylesProps {
|
||||
picker: CSSProperties;
|
||||
hue: CSSProperties;
|
||||
}
|
||||
|
||||
export interface HuePickerProps extends CustomPickerProps {
|
||||
@ -15,8 +12,7 @@ export interface HuePickerProps extends CustomPickerProps {
|
||||
width?: string;
|
||||
direction?: "vertical" | "horizontal";
|
||||
pointer?: ComponentType;
|
||||
styles?: HuePickerStyle;
|
||||
className?: string;
|
||||
styles?: Partial<Classes<HuePickerStylesProps>>;
|
||||
}
|
||||
|
||||
export default class HuePicker extends Component<HuePickerProps> {}
|
||||
export default class HuePicker extends Component<HuePickerProps> { }
|
||||
|
||||
@ -1,26 +1,22 @@
|
||||
import { Component, CSSProperties } from "react";
|
||||
import { CustomPickerProps } from "../../..";
|
||||
import { Classes } from "reactcss";
|
||||
|
||||
export interface MaterialPickerDefaultStyles {
|
||||
material?: CSSProperties;
|
||||
HEXwrap?: CSSProperties;
|
||||
HEXinput?: CSSProperties;
|
||||
HEXlabel?: CSSProperties;
|
||||
Hex?: CSSProperties;
|
||||
RGBwrap?: CSSProperties;
|
||||
RGBinput?: CSSProperties;
|
||||
RGBlabel?: CSSProperties;
|
||||
split?: CSSProperties;
|
||||
third?: CSSProperties;
|
||||
}
|
||||
|
||||
export interface MaterialPickerStyles {
|
||||
default?: MaterialPickerDefaultStyles;
|
||||
export interface MaterialPickerStylesProps {
|
||||
material: CSSProperties;
|
||||
HEXwrap: CSSProperties;
|
||||
HEXinput: CSSProperties;
|
||||
HEXlabel: CSSProperties;
|
||||
Hex: CSSProperties;
|
||||
RGBwrap: CSSProperties;
|
||||
RGBinput: CSSProperties;
|
||||
RGBlabel: CSSProperties;
|
||||
split: CSSProperties;
|
||||
third: CSSProperties;
|
||||
}
|
||||
|
||||
export interface MaterialPickerProps extends CustomPickerProps {
|
||||
styles?: MaterialPickerStyles;
|
||||
className?: string;
|
||||
styles?: Partial<Classes<MaterialPickerStylesProps>>;
|
||||
}
|
||||
|
||||
export default class MaterialPicker extends Component<MaterialPickerProps> {}
|
||||
export default class MaterialPicker extends Component<MaterialPickerProps> { }
|
||||
|
||||
@ -1,28 +1,25 @@
|
||||
import { Component, MouseEvent, CSSProperties } from "react";
|
||||
import { CustomPickerProps } from "../../..";
|
||||
import { Classes } from "reactcss";
|
||||
|
||||
export interface PhotoshopPickerDefaultStyles {
|
||||
picker?: CSSProperties;
|
||||
head?: CSSProperties;
|
||||
body?: CSSProperties;
|
||||
saturation?: CSSProperties;
|
||||
hue?: CSSProperties;
|
||||
controls?: CSSProperties;
|
||||
top?: CSSProperties;
|
||||
preview?: CSSProperties;
|
||||
actions?: CSSProperties;
|
||||
}
|
||||
|
||||
export interface PhotoshopPickerStyles {
|
||||
default?: PhotoshopPickerDefaultStyles;
|
||||
export interface PhotoshopPickerStylesProps {
|
||||
picker: CSSProperties;
|
||||
head: CSSProperties;
|
||||
body: CSSProperties;
|
||||
saturation: CSSProperties;
|
||||
hue: CSSProperties;
|
||||
controls: CSSProperties;
|
||||
top: CSSProperties;
|
||||
preview: CSSProperties;
|
||||
actions: CSSProperties;
|
||||
}
|
||||
|
||||
export interface PhotoshopPickerProps extends CustomPickerProps {
|
||||
header?: string;
|
||||
onAccept?: (event: MouseEvent<HTMLDivElement, MouseEvent>) => void;
|
||||
onCancel?: (event: MouseEvent<HTMLDivElement, MouseEvent>) => void;
|
||||
styles?: PhotoshopPickerStyles;
|
||||
styles?: Partial<Classes<PhotoshopPickerStylesProps>>;
|
||||
className?: string;
|
||||
}
|
||||
|
||||
export default class PhotoshopPicker extends Component<PhotoshopPickerProps> {}
|
||||
export default class PhotoshopPicker extends Component<PhotoshopPickerProps> { }
|
||||
|
||||
@ -1,23 +1,19 @@
|
||||
import { Component, CSSProperties } from "react";
|
||||
|
||||
import { CustomPickerProps, ColorState, RenderersProps } from "../../..";
|
||||
import { Classes } from "reactcss";
|
||||
|
||||
export interface SketchPickerDefaultStyles {
|
||||
picker?: CSSProperties;
|
||||
saturation?: CSSProperties;
|
||||
Saturation?: CSSProperties;
|
||||
controls?: CSSProperties;
|
||||
sliders?: CSSProperties;
|
||||
color?: CSSProperties;
|
||||
activeColor?: CSSProperties;
|
||||
hue?: CSSProperties;
|
||||
Hue?: CSSProperties;
|
||||
alpha?: CSSProperties;
|
||||
Alpha?: CSSProperties;
|
||||
}
|
||||
|
||||
export interface SketchPickerStyles {
|
||||
default?: SketchPickerDefaultStyles;
|
||||
export interface SketchPickerStylesProps {
|
||||
picker: CSSProperties;
|
||||
saturation: CSSProperties;
|
||||
Saturation: CSSProperties;
|
||||
controls: CSSProperties;
|
||||
sliders: CSSProperties;
|
||||
color: CSSProperties;
|
||||
activeColor: CSSProperties;
|
||||
hue: CSSProperties;
|
||||
Hue: CSSProperties;
|
||||
alpha: CSSProperties;
|
||||
Alpha: CSSProperties;
|
||||
}
|
||||
|
||||
type PresetColor = { color: string; title: string } | string;
|
||||
@ -25,11 +21,10 @@ export interface SketchPickerProps extends RenderersProps, CustomPickerProps {
|
||||
disableAlpha?: boolean;
|
||||
presetColors?: PresetColor[];
|
||||
width?: string;
|
||||
styles?: Partial<Classes<SketchPickerStylesProps>>;
|
||||
onSwatchHover?: (color: ColorState, event: MouseEvent) => void;
|
||||
styles?: SketchPickerStyles;
|
||||
className?: string;
|
||||
}
|
||||
|
||||
export default class SketchPicker extends Component<SketchPickerProps> {}
|
||||
export default class SketchPicker extends Component<SketchPickerProps> { }
|
||||
|
||||
export {};
|
||||
export { };
|
||||
|
||||
@ -1,19 +1,15 @@
|
||||
import { Component, ComponentType, CSSProperties } from "react";
|
||||
import { CustomPickerProps } from "../../..";
|
||||
import { Classes } from "reactcss";
|
||||
|
||||
export interface SliderPickerDefaultStyles {
|
||||
hue?: CSSProperties;
|
||||
Hue?: CSSProperties;
|
||||
}
|
||||
|
||||
export interface SliderPickerStyles {
|
||||
default?: SliderPickerDefaultStyles;
|
||||
export interface SliderPickerStylesProps {
|
||||
hue: CSSProperties;
|
||||
Hue: CSSProperties;
|
||||
}
|
||||
|
||||
export interface SliderPickerProps extends CustomPickerProps {
|
||||
pointer?: ComponentType;
|
||||
styles?: SliderPickerStyles;
|
||||
className?: string;
|
||||
styles?: Partial<Classes<SliderPickerStylesProps>>;
|
||||
}
|
||||
|
||||
export default class SliderPicker extends Component<SliderPickerProps> {}
|
||||
export default class SliderPicker extends Component<SliderPickerProps> { }
|
||||
|
||||
@ -1,24 +1,20 @@
|
||||
import { Component, CSSProperties } from "react";
|
||||
import { CustomPickerProps, ColorState } from "../../..";
|
||||
import { Classes } from "reactcss";
|
||||
|
||||
export interface SwatchesPickerDefaultStyles {
|
||||
export interface SwatchesPickerStylesProps {
|
||||
picker?: CSSProperties;
|
||||
overflow?: CSSProperties;
|
||||
body?: CSSProperties;
|
||||
clear?: CSSProperties;
|
||||
}
|
||||
|
||||
export interface SwatchesPickerStyles {
|
||||
default?: SwatchesPickerDefaultStyles;
|
||||
}
|
||||
|
||||
export interface SwatchesPickerProps extends CustomPickerProps {
|
||||
colors?: string[][];
|
||||
height?: string;
|
||||
width?: string;
|
||||
onSwatchHover?(color: ColorState, event: MouseEvent): void;
|
||||
styles?: SwatchesPickerStyles;
|
||||
className?: string;
|
||||
styles?: Partial<Classes<SwatchesPickerStylesProps>>;
|
||||
}
|
||||
|
||||
export default class SwatchesPicker extends Component<SwatchesPickerProps> {}
|
||||
export default class SwatchesPicker extends Component<SwatchesPickerProps> { }
|
||||
|
||||
@ -1,7 +1,8 @@
|
||||
import { Component, CSSProperties } from "react";
|
||||
import { CustomPickerProps, ColorState } from "../../..";
|
||||
import { Classes } from "reactcss";
|
||||
|
||||
export interface TwitterPickerDefaultStyle {
|
||||
export interface TwitterPickerStylesProps {
|
||||
card?: CSSProperties;
|
||||
body?: CSSProperties;
|
||||
label?: CSSProperties;
|
||||
@ -13,24 +14,12 @@ export interface TwitterPickerDefaultStyle {
|
||||
clear?: CSSProperties;
|
||||
}
|
||||
|
||||
export interface TwitterPickerTriangleStyle {
|
||||
triangle?: CSSProperties;
|
||||
triangleShadow?: CSSProperties;
|
||||
}
|
||||
|
||||
export interface TwitterPickerStyle {
|
||||
default?: TwitterPickerDefaultStyle;
|
||||
"top-left-triangle"?: TwitterPickerTriangleStyle;
|
||||
"top-right-triangle"?: TwitterPickerTriangleStyle;
|
||||
}
|
||||
|
||||
export interface TwitterPickerProps extends CustomPickerProps {
|
||||
colors?: string[];
|
||||
width?: string;
|
||||
triangle?: "hide" | "top-left" | "top-right";
|
||||
styles?: Partial<Classes<TwitterPickerStylesProps>>;
|
||||
onSwatchHover?(color: ColorState, event: MouseEvent): void;
|
||||
styles?: TwitterPickerStyle;
|
||||
className?: string;
|
||||
}
|
||||
|
||||
export default class TwitterPicker extends Component<TwitterPickerProps> {}
|
||||
export default class TwitterPicker extends Component<TwitterPickerProps> { }
|
||||
|
||||
Loading…
Reference in New Issue
Block a user