if you want all css properties as a type in typescript what do you put?-CodePudding

StyleProps is used for size and colour.

I would prefer it was all styles.

This is so I can hand down the styles directly into the specific part of the component.

what do I put in to mean the types of all CSS properties?

how do I change the styles to be all styles?

interface StyleProps{
  color?: string;
  size?: string;
}

interface TextButtonProps {
  buttonStyle?: styleProps;
  click: () => void;
  text: string;
}

const TextButton = ({ buttonStyle, text, click }: TextButtonProps) => {

CodePudding user response：

You can extend the built-in type CSSStyleDeclaration (ES6 lib typings):

interface StyleProps extends Partial<CSSStyleDeclaration> {
  color?: string; // ! not necessary
  size?: string;
}

interface TextButtonProps {
  buttonStyle?: StyleProps;
  click: () => void;
  text: string;
}

const TextButton = ({ buttonStyle, text, click }: TextButtonProps) => {

Partial is used because the built-in type's properties are all required.

Playground