styled-bug.ts

import * as React from "react";
type Simplify<T> = Pick<T, keyof T>;
export type Omit<T, K extends keyof T> = Pick<T, Exclude<keyof T, K>>;

export type ClassNameMap<ClassKey extends string = string> = Record<
  ClassKey,
  string
>;

export interface StyledComponentProps<ClassKey extends string = string> {
  classes?: Partial<ClassNameMap<ClassKey>>;
  innerRef?: React.Ref<any> | React.RefObject<any>;
}

export namespace PropTypes {
  export type Alignment = "inherit" | "left" | "center" | "right" | "justify";
  export type Color = "inherit" | "primary" | "secondary" | "default";
  export type Margin = "none" | "dense" | "normal";
}

export type StandardProps<
  C,
  ClassKey extends string,
  Removals extends keyof C = never
> = Omit<C, Removals> &
  StyledComponentProps<ClassKey> & {
    className?: string;
    style?: React.CSSProperties;
  };

export interface ButtonBaseActions {
  focusVisible(): void;
}

export type ButtonBaseClassKey = "root" | "disabled" | "focusVisible";

export interface ButtonBaseProps
  extends StandardProps<
    React.AnchorHTMLAttributes<HTMLElement> &
      React.ButtonHTMLAttributes<HTMLElement>,
    ButtonBaseClassKey
  > {
  action?: (actions: ButtonBaseActions) => void;
  buttonRef?: React.Ref<any> | React.RefObject<any>;
  centerRipple?: boolean;
  component?: React.ReactType<ButtonBaseProps>;
  disableRipple?: boolean;
  disableTouchRipple?: boolean;
  focusRipple?: boolean;
  focusVisibleClassName?: string;
  onFocusVisible?: React.FocusEventHandler<any>;
}

export interface ButtonProps
  extends StandardProps<ButtonBaseProps, ButtonClassKey, "component"> {
  color?: PropTypes.Color;
  component?: React.ReactType<ButtonProps>;
  disabled?: boolean;
  disableFocusRipple?: boolean;
  disableRipple?: boolean;
  fullWidth?: boolean;
  href?: string;
  mini?: boolean;
  size?: "small" | "medium" | "large";
  type?: string;
  variant?:
    | "text"
    | "flat"
    | "outlined"
    | "contained"
    | "raised"
    | "fab"
    | "extendedFab";
}

type W = Simplify<ButtonProps>;

export type ButtonClassKey =
  | "root"
  | "label"
  | "text"
  | "textPrimary"
  | "textSecondary"
  | "flat"
  | "flatPrimary"
  | "flatSecondary"
  | "outlined"
  | "outlinedPrimary"
  | "outlinedSecondary"
  | "colorInherit"
  | "contained"
  | "containedPrimary"
  | "containedSecondary"
  | "raised"
  | "raisedPrimary"
  | "raisedSecondary"
  | "focusVisible"
  | "disabled"
  | "fab"
  | "extendedFab"
  | "mini"
  | "sizeSmall"
  | "sizeLarge"
  | "fullWidth";

export type StyledComponentProps2<
  // The Component from whose props are derived
  C extends keyof JSX.IntrinsicElements | React.ComponentType<any>,
  // The Theme from the current context
  T extends object,
  // The other props added by the template
  O extends object,
  // The props that are made optional by .attrs
  A extends keyof any
> = Omit<React.ComponentPropsWithRef<C> & O, A> &
  Partial<Pick<React.ComponentPropsWithRef<C> & O, A>>;

type Wat = StyledComponentProps2<typeof Button, {}, {}, never>;
type K = Simplify<Wat>;
type SimpleButtonProps = Simplify<ButtonProps>;

type Wat2 = StyledComponentProps2<typeof Test, {}, {}, never>;

const k: K = {
  color: "inherit"
};

const k2: Wat = {
  color: "inherit"
};

const a: Wat2 = {
  thisIsOk: "ok"
};

declare var Test: React.ComponentType<{ thisIsOk: string }>;

declare var Button: React.ComponentType<SimpleButtonProps>;