@instructure/ui-buttons 8.8.1-snapshot.3 → 8.8.1-snapshot.63

package/src/index.ts

@@ -29,9 +29,9 @@ export { CondensedButton } from './CondensedButton'
 export { IconButton } from './IconButton'
 export { ToggleButton } from './ToggleButton'
 
-export type { BaseButtonProps } from './BaseButton/types'
-export type { ButtonProps } from './Button/types'
-export type { CloseButtonProps } from './CloseButton/types'
-export type { CondensedButtonProps } from './CondensedButton/types'
-export type { IconButtonProps } from './IconButton/types'
-export type { ToggleButtonProps } from './ToggleButton/types'
+export type { BaseButtonProps } from './BaseButton/props'
+export type { ButtonProps } from './Button/props'
+export type { CloseButtonProps } from './CloseButton/props'
+export type { CondensedButtonProps } from './CondensedButton/props'
+export type { IconButtonProps } from './IconButton/props'
+export type { ToggleButtonProps } from './ToggleButton/props'

package/types/BaseButton/index.d.ts

@@ -1,8 +1,7 @@
 /** @jsx jsx */
 import { Component } from 'react';
-import PropTypes from 'prop-types';
 import { jsx } from '@instructure/emotion';
-import { BaseButtonProps, BaseButtonStyleProps } from './types';
+import type { BaseButtonProps, BaseButtonStyleProps } from './props';
 /**
 ---
 category: components/utilities
@@ -10,128 +9,75 @@ category: components/utilities
 **/
 declare class BaseButton extends Component<BaseButtonProps> {
     static readonly componentId = "BaseButton";
-    static propTypes: {
-        makeStyles: PropTypes.Requireable<(...args: any[]) => any>;
-        styles: PropTypes.Requireable<object>;
-        /**
-         * Specifies the `Button` children.
-         */
-        children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-        /**
-         * Specifies the type of the `Button`'s underlying html element.
-         */
-        type: PropTypes.Requireable<string>;
-        /**
-         * The size of the `Button`
-         */
-        size: PropTypes.Requireable<string>;
-        /**
-         * Provides a reference to the `Button`'s underlying html element.
-         */
-        elementRef: PropTypes.Requireable<(...args: any[]) => any>;
-        /**
-         * The element to render as the component root, `Button` by default.
-         */
-        as: PropTypes.Requireable<PropTypes.ReactComponentLike>;
-        /**
-         * Specifies if interaction with the `Button` is enabled, disabled, or readonly.
-         */
-        interaction: PropTypes.Requireable<string>;
-        /**
-         * Specifies the color for the `Button`.
-         */
-        color: PropTypes.Requireable<string>;
-        /**
-         * Override the `Button`'s default focus outline color.
-         */
-        focusColor: PropTypes.Requireable<string>;
-        /**
-         * The `Button` display property. When set to `inline-block`, the `Button` displays inline with other elements.
-         * When set to block, the `Button` expands to fill the width of the container.
-         */
-        display: PropTypes.Requireable<string>;
-        /**
-         * Sets the alignment of the `Button` children and/or icon.
-         */
-        textAlign: PropTypes.Requireable<string>;
-        /**
-         * Specifies if the `Button` shape should be a circle or rectangle.
-         */
-        shape: PropTypes.Requireable<string>;
-        /**
-         * Specifies if the `Button` should render with a solid background. When false, the background is transparent.
-         */
-        withBackground: PropTypes.Requireable<boolean>;
-        /**
-         * Specifies if the `Button` should render with a border.
-         */
-        withBorder: PropTypes.Requireable<boolean>;
-        /**
-         * Designates if the `Button` should render without padding. This option should only be set when `withBorder` and
-         * `withBackground` are also set to false.
-         */
-        isCondensed: PropTypes.Requireable<boolean>;
-        /**
-         * Valid values are `0`, `none`, `auto`, `xxx-small`, `xx-small`, `x-small`,
-         * `small`, `medium`, `large`, `x-large`, `xx-large`. Apply these values via
-         * familiar CSS-like shorthand. For example: `margin="small auto large"`.
-         */
-        margin: (props: any, propName: any, componentName: any, location: any) => any;
-        /**
-         * Specify a mouse cursor to use when hovering over the button.
-         * The `pointer` cursor is used by default.
-         */
-        cursor: PropTypes.Requireable<string>;
-        /**
-         * Specifies an href attribute for the `Button`'s underlying html element.
-         */
-        href: PropTypes.Requireable<string>;
-        /**
-         * Callback fired when the `Button` is clicked.
-         */
-        onClick: PropTypes.Requireable<(...args: any[]) => any>;
-        /**
-         * Callback fired when the `Button` receives a keydown event.
-         */
-        onKeyDown: PropTypes.Requireable<(...args: any[]) => any>;
-        /**
-         * An icon, or function that returns an icon.
-         */
-        renderIcon: PropTypes.Requireable<string | number | boolean | {} | PropTypes.ReactElementLike | PropTypes.ReactNodeArray>;
-        /**
-         * Specifies the tabindex of the `Button`.
-         */
-        tabIndex: PropTypes.Requireable<string | number>;
-    };
+    static propTypes: import("@instructure/shared-types/types/UtilityTypes").PropValidators<keyof {
+        children?: import("react").ReactNode;
+        type?: "button" | "submit" | "reset" | undefined;
+        size?: "small" | "medium" | "large" | undefined;
+        elementRef?: ((...args: any[]) => any) | undefined;
+        as?: import("@instructure/shared-types/types/CommonProps").AsElementType | undefined;
+        interaction?: import("@instructure/ui-react-utils").InteractionType | undefined;
+        color?: "primary" | "primary-inverse" | "secondary" | "success" | "danger" | undefined;
+        focusColor?: "info" | "inverse" | undefined;
+        display?: "inline-block" | "block" | undefined;
+        textAlign?: "start" | "center" | undefined;
+        shape?: "circle" | "rectangle" | undefined;
+        withBackground?: boolean | undefined;
+        withBorder?: boolean | undefined;
+        isCondensed?: boolean | undefined;
+        margin?: import("@instructure/emotion/types/styleUtils/ThemeablePropValues").Spacing | undefined;
+        cursor?: string | undefined;
+        href?: string | undefined;
+        onClick?: ((...args: any[]) => any) | undefined;
+        onKeyDown?: ((...args: any[]) => any) | undefined;
+        renderIcon?: import("react").ReactNode | ((...args: any[]) => any);
+        tabIndex?: string | number | undefined;
+    }>;
+    static allowedProps: readonly (keyof {
+        children?: import("react").ReactNode;
+        type?: "button" | "submit" | "reset" | undefined;
+        size?: "small" | "medium" | "large" | undefined;
+        elementRef?: ((...args: any[]) => any) | undefined;
+        as?: import("@instructure/shared-types/types/CommonProps").AsElementType | undefined;
+        interaction?: import("@instructure/ui-react-utils").InteractionType | undefined;
+        color?: "primary" | "primary-inverse" | "secondary" | "success" | "danger" | undefined;
+        focusColor?: "info" | "inverse" | undefined;
+        display?: "inline-block" | "block" | undefined;
+        textAlign?: "start" | "center" | undefined;
+        shape?: "circle" | "rectangle" | undefined;
+        withBackground?: boolean | undefined;
+        withBorder?: boolean | undefined;
+        isCondensed?: boolean | undefined;
+        margin?: import("@instructure/emotion/types/styleUtils/ThemeablePropValues").Spacing | undefined;
+        cursor?: string | undefined;
+        href?: string | undefined;
+        onClick?: ((...args: any[]) => any) | undefined;
+        onKeyDown?: ((...args: any[]) => any) | undefined;
+        renderIcon?: import("react").ReactNode | ((...args: any[]) => any);
+        tabIndex?: string | number | undefined;
+    })[];
     static defaultProps: {
-        children: null;
-        type: string;
-        size: string;
-        elementRef: (el: any) => void;
-        as: string;
-        interaction: undefined;
-        color: string;
-        focusColor: undefined;
-        shape: string;
-        display: string;
-        textAlign: string;
-        withBackground: boolean;
-        withBorder: boolean;
-        isCondensed: boolean;
-        margin: string;
-        cursor: string;
-        href: undefined;
-        onClick: undefined;
-        onKeyDown: (event: any) => void;
-        renderIcon: undefined;
-        tabIndex: undefined;
+        readonly children: null;
+        readonly type: "button";
+        readonly size: "medium";
+        readonly elementRef: (el: any) => void;
+        readonly as: "button";
+        readonly color: "secondary";
+        readonly shape: "rectangle";
+        readonly display: "inline-block";
+        readonly textAlign: "start";
+        readonly withBackground: true;
+        readonly withBorder: true;
+        readonly isCondensed: false;
+        readonly margin: "0";
+        readonly cursor: "pointer";
+        readonly onKeyDown: (event: any) => void;
     };
     _rootElement: null;
     componentDidMount(): void;
     componentDidUpdate(prevProps: any, prevState: any, snapshot: any): void;
     get makeStylesVariables(): BaseButtonStyleProps;
     get hasOnlyIconVisible(): boolean;
-    get elementType(): any;
+    get elementType(): import("@instructure/shared-types/types/CommonProps").AsElementType;
     get interaction(): import("@instructure/ui-react-utils").InteractionType;
     get isDisabled(): boolean;
     get isReadOnly(): boolean;

package/types/BaseButton/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/BaseButton/index.tsx"],"names":[],"mappings":"AAwBA,eAAe;AACf,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACjC,OAAO,SAAS,MAAM,YAAY,CAAA;AAclC,OAAO,EAAa,GAAG,EAAsB,MAAM,sBAAsB,CAAA;AAIzE,OAAO,EAAE,eAAe,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAA;AAE/D;;;;GAIG;AAEH,cAEM,UAAW,SAAQ,SAAS,CAAC,eAAe,CAAC;IACjD,MAAM,CAAC,QAAQ,CAAC,WAAW,gBAAe;IAE1C,MAAM,CAAC,SAAS;;;QAKd;;WAEG;;QAEH;;WAEG;;QAEH;;WAEG;;QAEH;;WAEG;;QAEH;;WAEG;;QAEH;;WAEG;;QAEH;;WAEG;;QAQH;;WAEG;;QAEH;;;WAGG;;QAEH;;WAEG;;QAEH;;WAEG;;QAEH;;WAEG;;QAEH;;WAEG;;QAEH;;;WAGG;;QAEH;;;;WAIG;;QAEH;;;WAGG;;QAEH;;WAEG;;QAEH;;WAEG;;QAEH;;WAEG;;QAEH;;WAEG;;QAEH;;WAEG;;MAEJ;IAED,MAAM,CAAC,YAAY;;;;;;;;;;;;;;;;;;;;;;MAyBlB;IAED,YAAY,OAAO;IAEnB,iBAAiB;IAMjB,kBAAkB,CAAC,SAAS,KAAA,EAAE,SAAS,KAAA,EAAE,QAAQ,KAAA;IAKjD,IAAI,mBAAmB,IAAI,oBAAoB,CAK9C;IAED,IAAI,kBAAkB,YAGrB;IAED,IAAI,WAAW,QAEd;IAED,IAAI,WAAW,0DAEd;IAED,IAAI,UAAU,YAEb;IAED,IAAI,UAAU,YAEb;IAED,IAAI,SAAS,YAEZ;IAED,IAAI,UAAU,uBAkBb;IAED,IAAI,OAAO,YAEV;IAED,KAAK;IAML,gBAAgB,oBAIf;IAGD,WAAW,uBAaV;IAGD,aAAa,uBA0BZ;IAED,cAAc;IAgCd,MAAM;CAwDP;AAED,OAAO,EAAE,UAAU,EAAE,CAAA;AACrB,eAAe,UAAU,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/BaseButton/index.tsx"],"names":[],"mappings":"AAwBA,eAAe;AACf,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAcjC,OAAO,EAAa,GAAG,EAAE,MAAM,sBAAsB,CAAA;AAMrD,OAAO,KAAK,EAAE,eAAe,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAA;AAEpE;;;;GAIG;AAEH,cAEM,UAAW,SAAQ,SAAS,CAAC,eAAe,CAAC;IACjD,MAAM,CAAC,QAAQ,CAAC,WAAW,gBAAe;IAE1C,MAAM,CAAC,SAAS;;;;;;;;;;;;;;;;;;;;;;OAAY;IAC5B,MAAM,CAAC,YAAY;;;;;;;;;;;;;;;;;;;;;;SAAe;IAClC,MAAM,CAAC,YAAY;;;;;;;;;;;;;;;;MAmBT;IAEV,YAAY,OAAO;IAEnB,iBAAiB;IAMjB,kBAAkB,CAAC,SAAS,KAAA,EAAE,SAAS,KAAA,EAAE,QAAQ,KAAA;IAKjD,IAAI,mBAAmB,IAAI,oBAAoB,CAK9C;IAED,IAAI,kBAAkB,YAGrB;IAED,IAAI,WAAW,wEAEd;IAED,IAAI,WAAW,0DAEd;IAED,IAAI,UAAU,YAEb;IAED,IAAI,UAAU,YAEb;IAED,IAAI,SAAS,YAEZ;IAED,IAAI,UAAU,uBAkBb;IAED,IAAI,OAAO,YAEV;IAED,KAAK;IAML,gBAAgB,oBAIf;IAGD,WAAW,uBAaV;IAGD,aAAa,uBA0BZ;IAED,cAAc;IAgCd,MAAM;CAwDP;AAED,OAAO,EAAE,UAAU,EAAE,CAAA;AACrB,eAAe,UAAU,CAAA"}

package/types/BaseButton/{types.d.ts → props.d.ts}

@@ -1,10 +1,9 @@
-/// <reference types="react" />
-import { AsElementType } from '@instructure/shared-types';
+import React from 'react';
 import type { InteractionType } from '@instructure/ui-react-utils';
-import type { Spacing } from '@instructure/emotion';
-export declare type BaseButtonProps = {
-    makeStyles?: (...args: any[]) => any;
-    styles?: any;
+import type { Spacing, WithStyleProps } from '@instructure/emotion';
+import type { AsElementType, PropValidators } from '@instructure/shared-types';
+declare type BaseButtonOwnProps = {
+    children?: React.ReactNode;
     type?: 'button' | 'submit' | 'reset';
     size?: 'small' | 'medium' | 'large';
     elementRef?: (...args: any[]) => any;
@@ -26,8 +25,15 @@ export declare type BaseButtonProps = {
     renderIcon?: React.ReactNode | ((...args: any[]) => any);
     tabIndex?: number | string;
 };
-export declare type BaseButtonStyleProps = {
+declare type BaseButtonStyleProps = {
     isDisabled: boolean;
     hasOnlyIconVisible: boolean;
 };
-//# sourceMappingURL=types.d.ts.map
+declare type PropKeys = keyof BaseButtonOwnProps;
+declare type AllowedPropKeys = Readonly<Array<PropKeys>>;
+declare type BaseButtonProps = BaseButtonOwnProps & WithStyleProps;
+declare const propTypes: PropValidators<PropKeys>;
+declare const allowedProps: AllowedPropKeys;
+export type { BaseButtonProps, BaseButtonStyleProps };
+export { propTypes, allowedProps };
+//# sourceMappingURL=props.d.ts.map

package/types/BaseButton/props.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../src/BaseButton/props.ts"],"names":[],"mappings":"AAwBA,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,6BAA6B,CAAA;AAClE,OAAO,KAAK,EAAE,OAAO,EAAE,cAAc,EAAE,MAAM,sBAAsB,CAAA;AACnE,OAAO,KAAK,EAAE,aAAa,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAA;AAE9E,aAAK,kBAAkB,GAAG;IACxB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,IAAI,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAA;IACpC,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAA;IACnC,UAAU,CAAC,EAAE,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,CAAA;IACpC,EAAE,CAAC,EAAE,aAAa,CAAA;IAClB,WAAW,CAAC,EAAE,eAAe,CAAA;IAC7B,KAAK,CAAC,EAAE,SAAS,GAAG,iBAAiB,GAAG,WAAW,GAAG,SAAS,GAAG,QAAQ,CAAA;IAC1E,UAAU,CAAC,EAAE,MAAM,GAAG,SAAS,CAAA;IAC/B,OAAO,CAAC,EAAE,cAAc,GAAG,OAAO,CAAA;IAClC,SAAS,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAA;IAC9B,KAAK,CAAC,EAAE,WAAW,GAAG,QAAQ,CAAA;IAC9B,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,OAAO,CAAC,EAAE,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,CAAA;IACjC,SAAS,CAAC,EAAE,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,CAAA;IACnC,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,CAAC,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,CAAC,CAAA;IACxD,QAAQ,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;CAC3B,CAAA;AAED,aAAK,oBAAoB,GAAG;IAC1B,UAAU,EAAE,OAAO,CAAA;IACnB,kBAAkB,EAAE,OAAO,CAAA;CAC5B,CAAA;AAED,aAAK,QAAQ,GAAG,MAAM,kBAAkB,CAAA;AAExC,aAAK,eAAe,GAAG,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAA;AAEhD,aAAK,eAAe,GAAG,kBAAkB,GAAG,cAAc,CAAA;AAE1D,QAAA,MAAM,SAAS,EAAE,cAAc,CAAC,QAAQ,CAgGvC,CAAA;AAED,QAAA,MAAM,YAAY,EAAE,eAsBnB,CAAA;AAED,YAAY,EAAE,eAAe,EAAE,oBAAoB,EAAE,CAAA;AACrD,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,CAAA"}

package/types/BaseButton/styles.d.ts

@@ -1,5 +1,5 @@
 import { BaseButtonTheme } from '@instructure/shared-types';
-import { BaseButtonProps, BaseButtonStyleProps } from './types';
+import { BaseButtonProps, BaseButtonStyleProps } from './props';
 /**
  * ---
  * private: true

package/types/Button/index.d.ts

@@ -1,6 +1,5 @@
-import { Component } from 'react';
-import PropTypes from 'prop-types';
-import { ButtonProps } from './types';
+import React, { Component } from 'react';
+import type { ButtonProps } from './props';
 /**
 ---
 category: components
@@ -8,88 +7,52 @@ category: components
 **/
 declare class Button extends Component<ButtonProps> {
     static readonly componentId = "Button";
-    static propTypes: {
-        /**
-         * Specifies the `Button` children.
-         */
-        children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-        /**
-         * Specifies the type of the `Button`'s underlying html element.
-         */
-        type: PropTypes.Requireable<string>;
-        /**
-         * The size of the `Button`
-         */
-        size: PropTypes.Requireable<string>;
-        /**
-         * Provides a reference to the `Button`'s underlying html element.
-         */
-        elementRef: PropTypes.Requireable<(...args: any[]) => any>;
-        /**
-         * The element to render as the component root, `Button` by default.
-         */
-        as: PropTypes.Requireable<PropTypes.ReactComponentLike>;
-        /**
-         * Specifies if interaction with the `Button` is enabled, disabled, or readonly.
-         */
-        interaction: PropTypes.Requireable<string>;
-        /**
-         * Specifies the color for the `Button`.
-         */
-        color: PropTypes.Requireable<string>;
-        /**
-         * Override the `Button`'s default focus outline color.
-         */
-        focusColor: PropTypes.Requireable<string>;
-        /**
-         * The `Button` display property. When set to `inline-block`, the `Button` displays inline with other elements.
-         * When set to block, the `Button` expands to fill the width of the container.
-         */
-        display: PropTypes.Requireable<string>;
-        /**
-         * Sets the alignment of the `Button` children and/or icon.
-         */
-        textAlign: PropTypes.Requireable<string>;
-        /**
-         * Specifies if the `Button` should render with a solid background. When false, the background is transparent.
-         */
-        withBackground: PropTypes.Requireable<boolean>;
-        /**
-         * Valid values are `0`, `none`, `auto`, `xxx-small`, `xx-small`, `x-small`,
-         * `small`, `medium`, `large`, `x-large`, `xx-large`. Apply these values via
-         * familiar CSS-like shorthand. For example: `margin="small auto large"`.
-         */
-        margin: (props: any, propName: any, componentName: any, location: any) => any;
-        /**
-         * Specify a mouse cursor to use when hovering over the button.
-         * The `pointer` cursor is used by default.
-         */
-        cursor: PropTypes.Requireable<string>;
-        /**
-         * Specifies an href attribute for the `Button`'s underlying html element.
-         */
-        href: PropTypes.Requireable<string>;
-        /**
-         * An icon, or function that returns an icon.
-         */
-        renderIcon: PropTypes.Requireable<string | number | boolean | {} | PropTypes.ReactElementLike | PropTypes.ReactNodeArray>;
-    };
+    static propTypes: import("@instructure/shared-types/types/UtilityTypes").PropValidators<keyof {
+        children?: React.ReactNode;
+        type?: "button" | "submit" | "reset" | undefined;
+        size?: "small" | "medium" | "large" | undefined;
+        elementRef?: ((...args: any[]) => any) | undefined;
+        as?: import("@instructure/shared-types/types/CommonProps").AsElementType | undefined;
+        interaction?: "enabled" | "disabled" | "readonly" | undefined;
+        color?: "primary" | "primary-inverse" | "secondary" | "success" | "danger" | undefined;
+        focusColor?: "info" | "inverse" | undefined;
+        display?: "inline-block" | "block" | undefined;
+        textAlign?: "start" | "center" | undefined;
+        withBackground?: boolean | undefined;
+        margin?: import("@instructure/emotion/types/styleUtils/ThemeablePropValues").Spacing | undefined;
+        cursor?: string | undefined;
+        href?: string | undefined;
+        renderIcon?: React.ReactNode | ((...args: any[]) => any);
+    }>;
+    static allowedProps: readonly (keyof {
+        children?: React.ReactNode;
+        type?: "button" | "submit" | "reset" | undefined;
+        size?: "small" | "medium" | "large" | undefined;
+        elementRef?: ((...args: any[]) => any) | undefined;
+        as?: import("@instructure/shared-types/types/CommonProps").AsElementType | undefined;
+        interaction?: "enabled" | "disabled" | "readonly" | undefined;
+        color?: "primary" | "primary-inverse" | "secondary" | "success" | "danger" | undefined;
+        focusColor?: "info" | "inverse" | undefined;
+        display?: "inline-block" | "block" | undefined;
+        textAlign?: "start" | "center" | undefined;
+        withBackground?: boolean | undefined;
+        margin?: import("@instructure/emotion/types/styleUtils/ThemeablePropValues").Spacing | undefined;
+        cursor?: string | undefined;
+        href?: string | undefined;
+        renderIcon?: React.ReactNode | ((...args: any[]) => any);
+    })[];
     static defaultProps: {
         children: null;
         type: string;
         size: string;
         elementRef: (el: any) => void;
         as: string;
-        interaction: undefined;
         color: string;
-        focusColor: undefined;
         display: string;
         textAlign: string;
         withBackground: boolean;
         margin: string;
         cursor: string;
-        href: undefined;
-        renderIcon: undefined;
     };
     _buttonComponent: null;
     get focused(): null;

package/types/Button/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/Button/index.tsx"],"names":[],"mappings":"AAwBA,OAAc,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AACxC,OAAO,SAAS,MAAM,YAAY,CAAA;AASlC,OAAO,EAAE,WAAW,EAAE,MAAM,SAAS,CAAA;AAErC;;;;GAIG;AAEH,cAEM,MAAO,SAAQ,SAAS,CAAC,WAAW,CAAC;IACzC,MAAM,CAAC,QAAQ,CAAC,WAAW,YAAW;IAEtC,MAAM,CAAC,SAAS;QACd;;WAEG;;QAEH;;WAEG;;QAEH;;WAEG;;QAEH;;WAEG;;QAEH;;WAEG;;QAEH;;WAEG;;QAEH;;WAEG;;QAQH;;WAEG;;QAEH;;;WAGG;;QAEH;;WAEG;;QAEH;;WAEG;;QAEH;;;;WAIG;;QAEH;;;WAGG;;QAEH;;WAEG;;QAEH;;WAEG;;MAEJ;IAED,MAAM,CAAC,YAAY;;;;;;;;;;;;;;;;MAkBlB;IAED,gBAAgB,OAAO;IAEvB,IAAI,OAAO,SAGV;IAED,KAAK;IAML,gBAAgB,oBAKf;IAGD,eAAe,2BAEd;IAED,MAAM;CA8CP;AAED,eAAe,MAAM,CAAA;AACrB,OAAO,EAAE,MAAM,EAAE,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/Button/index.tsx"],"names":[],"mappings":"AAwBA,OAAO,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAWxC,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,SAAS,CAAA;AAE1C;;;;GAIG;AAEH,cAEM,MAAO,SAAQ,SAAS,CAAC,WAAW,CAAC;IACzC,MAAM,CAAC,QAAQ,CAAC,WAAW,YAAW;IAEtC,MAAM,CAAC,SAAS;;;;;;;;;;;;;;;;OAAY;IAC5B,MAAM,CAAC,YAAY;;;;;;;;;;;;;;;;SAAe;IAClC,MAAM,CAAC,YAAY;;;;;;;;;;;;MAclB;IAED,gBAAgB,OAAO;IAEvB,IAAI,OAAO,SAGV;IAED,KAAK;IAML,gBAAgB,oBAKf;IAGD,eAAe,2BAEd;IAED,MAAM;CA8CP;AAED,eAAe,MAAM,CAAA;AACrB,OAAO,EAAE,MAAM,EAAE,CAAA"}

package/types/Button/{types.d.ts → props.d.ts}

@@ -1,7 +1,8 @@
-import { AsElementType } from '@instructure/shared-types';
-import type { Spacing } from '@instructure/emotion';
 import React from 'react';
-export declare type ButtonProps = {
+import type { Spacing } from '@instructure/emotion';
+import type { AsElementType, PropValidators } from '@instructure/shared-types';
+declare type ButtonOwnProps = {
+    children?: React.ReactNode;
     type?: 'button' | 'submit' | 'reset';
     size?: 'small' | 'medium' | 'large';
     elementRef?: (...args: any[]) => any;
@@ -17,4 +18,11 @@ export declare type ButtonProps = {
     href?: string;
     renderIcon?: React.ReactNode | ((...args: any[]) => any);
 };
-//# sourceMappingURL=types.d.ts.map
+declare type PropKeys = keyof ButtonOwnProps;
+declare type AllowedPropKeys = Readonly<Array<PropKeys>>;
+declare type ButtonProps = ButtonOwnProps;
+declare const propTypes: PropValidators<PropKeys>;
+declare const allowedProps: AllowedPropKeys;
+export type { ButtonProps };
+export { propTypes, allowedProps };
+//# sourceMappingURL=props.d.ts.map

package/types/Button/props.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"props.d.ts","sourceRoot":"","sources":["../../src/Button/props.ts"],"names":[],"mappings":"AAwBA,OAAO,KAAK,MAAM,OAAO,CAAA;AAKzB,OAAO,KAAK,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAA;AACnD,OAAO,KAAK,EAAE,aAAa,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAA;AAE9E,aAAK,cAAc,GAAG;IACpB,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC1B,IAAI,CAAC,EAAE,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAA;IACpC,IAAI,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,OAAO,CAAA;IACnC,UAAU,CAAC,EAAE,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,CAAA;IACpC,EAAE,CAAC,EAAE,aAAa,CAAA;IAClB,WAAW,CAAC,EAAE,SAAS,GAAG,UAAU,GAAG,UAAU,CAAA;IACjD,KAAK,CAAC,EAAE,SAAS,GAAG,iBAAiB,GAAG,WAAW,GAAG,SAAS,GAAG,QAAQ,CAAA;IAC1E,UAAU,CAAC,EAAE,MAAM,GAAG,SAAS,CAAA;IAC/B,OAAO,CAAC,EAAE,cAAc,GAAG,OAAO,CAAA;IAClC,SAAS,CAAC,EAAE,OAAO,GAAG,QAAQ,CAAA;IAC9B,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,UAAU,CAAC,EAAE,KAAK,CAAC,SAAS,GAAG,CAAC,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,CAAC,CAAA;CACzD,CAAA;AAED,aAAK,QAAQ,GAAG,MAAM,cAAc,CAAA;AAEpC,aAAK,eAAe,GAAG,QAAQ,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAA;AAEhD,aAAK,WAAW,GAAG,cAAc,CAAA;AAEjC,QAAA,MAAM,SAAS,EAAE,cAAc,CAAC,QAAQ,CAuEvC,CAAA;AAED,QAAA,MAAM,YAAY,EAAE,eAgBnB,CAAA;AAED,YAAY,EAAE,WAAW,EAAE,CAAA;AAC3B,OAAO,EAAE,SAAS,EAAE,YAAY,EAAE,CAAA"}

package/types/CloseButton/index.d.ts

@@ -1,8 +1,7 @@
 /** @jsx jsx */
 import { Component } from 'react';
-import PropTypes from 'prop-types';
 import { jsx } from '@instructure/emotion';
-import { CloseButtonProps } from './types';
+import type { CloseButtonProps } from './props';
 /**
 ---
 category: components
@@ -10,88 +9,55 @@ category: components
 **/
 declare class CloseButton extends Component<CloseButtonProps> {
     static readonly componentId = "CloseButton";
-    static propTypes: {
-        makeStyles: PropTypes.Requireable<(...args: any[]) => any>;
-        styles: PropTypes.Requireable<object>;
-        /**
-         * An accessible label for the `CloseButton` (required)
-         */
-        screenReaderLabel: PropTypes.Validator<string | number | boolean | {} | PropTypes.ReactElementLike | PropTypes.ReactNodeArray>;
-        /**
-         * Specifies the color for the `CloseButton`.
-         */
-        color: PropTypes.Requireable<string>;
-        /**
-         * Specifies if interaction with the `CloseButton` is enabled, disabled, or readonly.
-         */
-        interaction: PropTypes.Requireable<string>;
-        /**
-         * Provides a reference to the `CloseButton`'s underlying html element.
-         */
-        elementRef: PropTypes.Requireable<(...args: any[]) => any>;
-        /**
-         * The size of the `CloseButton`
-         */
-        size: PropTypes.Requireable<string>;
-        /**
-         * Callback fired when the `CloseButton` is clicked.
-         */
-        onClick: PropTypes.Requireable<(...args: any[]) => any>;
-        /**
-         * Valid values are `0`, `none`, `auto`, `xxx-small`, `xx-small`, `x-small`,
-         * `small`, `medium`, `large`, `x-large`, `xx-large`. Apply these values via
-         * familiar CSS-like shorthand. For example: `margin="small auto large"`.
-         */
-        margin: (props: any, propName: any, componentName: any, location: any) => any;
-        /**
-         * Specifies the placement of the `CloseButton`
-         */
-        placement: PropTypes.Requireable<string>;
-        /**
-         * Specifies the offset distance for the `CloseButton` with respect to both the top and start/end of the container.
-         * Note that for this property to have an effect, the `placement` prop must be set to either `start` or `end`. The
-         * offset will also be created with respect to a positioned parent. If it does not appear to be working, try setting
-         * the `position` of the parent container to `relative`.
-         */
-        offset: PropTypes.Requireable<string>;
-        /**
-         * Specifies the type of the `Button`'s underlying html element.
-         */
-        type: PropTypes.Requireable<string>;
-        /**
-         * The element to render as the component root, `CloseButton` by default.
-         */
-        as: PropTypes.Requireable<PropTypes.ReactComponentLike>;
-        /**
-         * Specifies an href attribute for the `CloseButton`'s underlying html element.
-         */
-        href: PropTypes.Requireable<string>;
-        /**
-         * Specify a mouse cursor to use when hovering over the `CloseButton`.
-         */
-        cursor: PropTypes.Requireable<string>;
-        /**
-         * Specifies the tabindex of the `CloseButton`.
-         */
-        tabIndex: PropTypes.Requireable<string | number>;
-    };
+    static propTypes: import("@instructure/shared-types/types/UtilityTypes").PropValidators<keyof {
+        screenReaderLabel: import("react").ReactNode;
+        color?: "primary" | "primary-inverse" | undefined;
+        interaction?: "enabled" | "disabled" | "readonly" | undefined;
+        elementRef?: ((...args: any[]) => any) | undefined;
+        size?: "small" | "medium" | "large" | undefined;
+        onClick?: ((...args: any[]) => any) | undefined;
+        margin?: import("@instructure/emotion/types/styleUtils/ThemeablePropValues").Spacing | undefined;
+        placement?: "start" | "end" | "static" | undefined; /**
+        ---
+        category: components
+        ---
+        **/
+        offset?: "small" | "medium" | "none" | "x-small" | undefined;
+        type?: "button" | "submit" | "reset" | undefined;
+        as?: import("@instructure/shared-types/types/CommonProps").AsElementType | undefined;
+        href?: string | undefined;
+        cursor?: string | undefined;
+        tabIndex?: string | number | undefined;
+    }>;
+    static allowedProps: readonly (keyof {
+        screenReaderLabel: import("react").ReactNode;
+        color?: "primary" | "primary-inverse" | undefined;
+        interaction?: "enabled" | "disabled" | "readonly" | undefined;
+        elementRef?: ((...args: any[]) => any) | undefined;
+        size?: "small" | "medium" | "large" | undefined;
+        onClick?: ((...args: any[]) => any) | undefined;
+        margin?: import("@instructure/emotion/types/styleUtils/ThemeablePropValues").Spacing | undefined;
+        placement?: "start" | "end" | "static" | undefined; /**
+        ---
+        category: components
+        ---
+        **/
+        offset?: "small" | "medium" | "none" | "x-small" | undefined;
+        type?: "button" | "submit" | "reset" | undefined;
+        as?: import("@instructure/shared-types/types/CommonProps").AsElementType | undefined;
+        href?: string | undefined;
+        cursor?: string | undefined;
+        tabIndex?: string | number | undefined;
+    })[];
     static defaultProps: {
-        screenReaderLabel: undefined;
         onClick: (event: any) => void;
-        elementRef: undefined;
-        color: undefined;
-        interaction: undefined;
-        disabled: undefined;
-        readOnly: undefined;
         type: string;
         placement: string;
         offset: string;
         size: string;
         margin: string;
         as: string;
-        href: undefined;
         cursor: string;
-        tabIndex: undefined;
     };
     componentDidMount(): void;
     componentDidUpdate(): void;