@atlaskit/ds-explorations 0.1.3 → 0.1.4

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @atlaskit/ds-explorations
 
+## 0.1.4
+
+### Patch Changes
+
+- [`8cc2f888c83`](https://bitbucket.org/atlassian/atlassian-frontend/commits/8cc2f888c83) - Upgrade Typescript from `4.3.5` to `4.5.5`
+
 ## 0.1.3
 
 ### Patch Changes

package/dist/cjs/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/ds-explorations",
-	"version": "0.1.3",
+	"version": "0.1.4",
 	"sideEffects": false
 }

package/dist/es2019/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/ds-explorations",
-	"version": "0.1.3",
+	"version": "0.1.4",
 	"sideEffects": false
 }

package/dist/esm/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/ds-explorations",
-	"version": "0.1.3",
+	"version": "0.1.4",
 	"sideEffects": false
 }

package/dist/types-ts4.0/components/box.partial.d.ts

@@ -0,0 +1,213 @@
+/** @jsx jsx */
+import { ElementType, HTMLAttributes, ReactNode } from 'react';
+import { GlobalSpacingToken } from '../constants';
+import { BasePrimitiveProps } from './types';
+export interface BoxProps<T extends HTMLElement = HTMLElement> extends Omit<HTMLAttributes<T>, 'style' | 'as' | 'className'>, BasePrimitiveProps {
+    /**
+     * The DOM element to render as the Box. Defaults to `div`.
+     */
+    as?: ElementType;
+    /**
+     * Elements to be rendered inside the Box.
+     */
+    children?: ReactNode;
+    /**
+     * The html className attribute.
+     *
+     * Before using this prop please ensure:
+     * - The styles cannot otherwise be achieved through `Box` directly.
+     * - The use case needs custom styles that cannot be designed or implemented differently
+     *
+     * Ensure you're using the `@atlaskit/eslint-plugin-design-system` with this prop to prevent unbounded usage.
+     *
+     * @see `@atlaskit/eslint-plugin-design-system`
+     */
+    className?: string;
+    /**
+     * Token representing background color with a fallback.
+     */
+    backgroundColor?: [
+        BackgroundColor,
+        string
+    ];
+    /**
+     * Defines border style.
+     */
+    borderStyle?: BorderStyle;
+    /**
+     * Defines border width.
+     */
+    borderWidth?: BorderWidth;
+    /**
+     * Token representing border color with a fallback.
+     */
+    borderColor?: [
+        BorderColor,
+        string
+    ];
+    /**
+     * Defines border radius.
+     */
+    borderRadius?: BorderRadius;
+    /**
+     * Defines the main axis direction.
+     */
+    flexDirection?: FlexDirection;
+    /**
+     * Used to align children along the cross axis.
+     */
+    alignItems?: FlexAlignItems;
+    /**
+     * Used to align children along the main axis.
+     */
+    justifyContent?: FlexJustifyContent;
+    /**
+     * Shorthand for `paddingBlock` and `paddingInline` together.
+     *
+     * @see paddingBlock
+     * @see paddingInline
+     */
+    padding?: GlobalSpacingToken;
+    /**
+     * Token representing CSS `padding-block`.
+     */
+    paddingBlock?: GlobalSpacingToken;
+    /**
+     * Token representing CSS `padding-inline`.
+     */
+    paddingInline?: GlobalSpacingToken;
+    /**
+     * Token representing width.
+     */
+    width?: GlobalSpacingToken;
+    /**
+     * Token representing height.
+     */
+    height?: GlobalSpacingToken;
+    /**
+     * Defines display type and layout. Defaults to `flex`.
+     */
+    display?: Display;
+    /**
+     * CSS position property.
+     */
+    position?: keyof typeof positionMap;
+}
+/**
+ * __Box__
+ *
+ * Box is a primitive component that has the design decisions of the Atlassian Design System baked in.
+ * Renders a `div` by default.
+ *
+ * @internal
+ */
+declare const Box: import("react").ForwardRefExoticComponent<BoxProps<HTMLElement> & import("react").RefAttributes<HTMLElement>>;
+export default Box;
+declare type BorderStyle = keyof typeof borderStyleMap;
+declare const borderStyleMap: {
+    none: import("@emotion/react").SerializedStyles;
+    solid: import("@emotion/react").SerializedStyles;
+    dashed: import("@emotion/react").SerializedStyles;
+    dotted: import("@emotion/react").SerializedStyles;
+};
+declare type BorderWidth = keyof typeof borderWidthMap;
+declare const borderWidthMap: {
+    '0px': import("@emotion/react").SerializedStyles;
+    '1px': import("@emotion/react").SerializedStyles;
+    '2px': import("@emotion/react").SerializedStyles;
+    '3px': import("@emotion/react").SerializedStyles;
+};
+declare type BorderRadius = keyof typeof borderRadiusMap;
+declare const borderRadiusMap: {
+    normal: import("@emotion/react").SerializedStyles;
+    rounded: import("@emotion/react").SerializedStyles;
+    badge: import("@emotion/react").SerializedStyles;
+};
+declare type FlexDirection = keyof typeof flexDirectionMap;
+declare const flexDirectionMap: {
+    column: import("@emotion/react").SerializedStyles;
+    row: import("@emotion/react").SerializedStyles;
+};
+declare type FlexAlignItems = keyof typeof flexAlignItemsMap;
+declare const flexAlignItemsMap: {
+    center: import("@emotion/react").SerializedStyles;
+    baseline: import("@emotion/react").SerializedStyles;
+    flexStart: import("@emotion/react").SerializedStyles;
+    flexEnd: import("@emotion/react").SerializedStyles;
+};
+declare type FlexJustifyContent = keyof typeof flexJustifyContentMap;
+declare const flexJustifyContentMap: {
+    center: import("@emotion/react").SerializedStyles;
+    flexStart: import("@emotion/react").SerializedStyles;
+    flexEnd: import("@emotion/react").SerializedStyles;
+};
+declare type Display = keyof typeof displayMap;
+declare const displayMap: {
+    block: import("@emotion/react").SerializedStyles;
+    inline: import("@emotion/react").SerializedStyles;
+    flex: import("@emotion/react").SerializedStyles;
+    inlineFlex: import("@emotion/react").SerializedStyles;
+};
+declare const positionMap: {
+    absolute: import("@emotion/react").SerializedStyles;
+    relative: import("@emotion/react").SerializedStyles;
+    static: import("@emotion/react").SerializedStyles;
+};
+/**
+ * @codegenEnd
+ */
+/**
+ * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
+ * @codegen <<SignedSource::ebb55786a54803214357d0eef0cac448>>
+ * @codegenId colors
+ * @codegenCommand yarn codegen-styles
+ * @codegenParams ["border", "background"]
+ */
+declare const borderColorMap: {
+    'color.border': import("@emotion/react").SerializedStyles;
+    bold: import("@emotion/react").SerializedStyles;
+    inverse: import("@emotion/react").SerializedStyles;
+    focused: import("@emotion/react").SerializedStyles;
+    input: import("@emotion/react").SerializedStyles;
+    disabled: import("@emotion/react").SerializedStyles;
+    brand: import("@emotion/react").SerializedStyles;
+    selected: import("@emotion/react").SerializedStyles;
+    danger: import("@emotion/react").SerializedStyles;
+    warning: import("@emotion/react").SerializedStyles;
+    success: import("@emotion/react").SerializedStyles;
+    discovery: import("@emotion/react").SerializedStyles;
+    information: import("@emotion/react").SerializedStyles;
+};
+export declare type BorderColor = keyof typeof borderColorMap;
+declare const backgroundColorMap: {
+    disabled: import("@emotion/react").SerializedStyles;
+    'inverse.subtle': import("@emotion/react").SerializedStyles;
+    input: import("@emotion/react").SerializedStyles;
+    neutral: import("@emotion/react").SerializedStyles;
+    'neutral.subtle': import("@emotion/react").SerializedStyles;
+    'neutral.bold': import("@emotion/react").SerializedStyles;
+    'brand.bold': import("@emotion/react").SerializedStyles;
+    selected: import("@emotion/react").SerializedStyles;
+    'selected.bold': import("@emotion/react").SerializedStyles;
+    danger: import("@emotion/react").SerializedStyles;
+    'danger.bold': import("@emotion/react").SerializedStyles;
+    warning: import("@emotion/react").SerializedStyles;
+    'warning.bold': import("@emotion/react").SerializedStyles;
+    success: import("@emotion/react").SerializedStyles;
+    'success.bold': import("@emotion/react").SerializedStyles;
+    discovery: import("@emotion/react").SerializedStyles;
+    'discovery.bold': import("@emotion/react").SerializedStyles;
+    information: import("@emotion/react").SerializedStyles;
+    'information.bold': import("@emotion/react").SerializedStyles;
+    'color.blanket': import("@emotion/react").SerializedStyles;
+    'color.blanket.selected': import("@emotion/react").SerializedStyles;
+    'color.blanket.danger': import("@emotion/react").SerializedStyles;
+    'elevation.surface': import("@emotion/react").SerializedStyles;
+    'elevation.surface.sunken': import("@emotion/react").SerializedStyles;
+    'elevation.surface.raised': import("@emotion/react").SerializedStyles;
+    'elevation.surface.overlay': import("@emotion/react").SerializedStyles;
+};
+export declare type BackgroundColor = keyof typeof backgroundColorMap;
+/**
+ * @codegenEnd
+ */

package/dist/types-ts4.0/components/inline.partial.d.ts

@@ -0,0 +1,52 @@
+/** @jsx jsx */
+import { ReactNode } from 'react';
+import { GlobalSpacingToken } from '../constants';
+import { BasePrimitiveProps } from './types';
+interface InlineProps extends BasePrimitiveProps {
+    /**
+     * Used to align children along the cross axis.
+     */
+    alignItems?: FlexAlignItems;
+    /**
+     * Used to align children along the main axis.
+     */
+    justifyContent?: FlexJustifyContent;
+    /**
+     * Token representing gap between children.
+     */
+    gap: GlobalSpacingToken;
+    /**
+     * Renders a divider between children.
+     * If a string is provided it will automatically be wrapped in a `<Text>` component.
+     */
+    divider?: ReactNode;
+    /**
+     * Elements to be rendered inside the Inline.
+     */
+    children: ReactNode;
+}
+declare type FlexAlignItems = keyof typeof flexAlignItemsMap;
+declare const flexAlignItemsMap: {
+    center: import("@emotion/react").SerializedStyles;
+    baseline: import("@emotion/react").SerializedStyles;
+    flexStart: import("@emotion/react").SerializedStyles;
+    flexEnd: import("@emotion/react").SerializedStyles;
+};
+declare type FlexJustifyContent = keyof typeof flexJustifyContentMap;
+declare const flexJustifyContentMap: {
+    center: import("@emotion/react").SerializedStyles;
+    flexStart: import("@emotion/react").SerializedStyles;
+    flexEnd: import("@emotion/react").SerializedStyles;
+};
+/**
+ * __Inline__
+ *
+ * Inline is a primitive component based on flexbox that manages the horizontal layout of direct children.
+ * Renders a `div` by default.
+ *
+ */
+declare const Inline: import("react").ForwardRefExoticComponent<InlineProps & import("react").RefAttributes<HTMLDivElement>>;
+export default Inline;
+/**
+ * @codegenEnd
+ */

package/dist/types-ts4.0/components/interaction-surface.partial.d.ts

@@ -0,0 +1,45 @@
+/** @jsx jsx */
+import { ReactNode } from 'react';
+import { jsx } from '@emotion/react';
+import { BasePrimitiveProps } from './types';
+interface InteractionSurfaceProps extends BasePrimitiveProps {
+    children?: ReactNode;
+    appearance?: InteractionBackgroundColor;
+}
+/**
+ *
+ * @example
+ * ```js
+ * // a minimal icon button
+ * <Box as="button">
+ *   <InteractionSurface />
+ *   <WarningIcon label="icon button" />
+ * </Box>
+ * ```
+ */
+declare const InteractionSurface: ({ appearance, children, testId, }: InteractionSurfaceProps) => jsx.JSX.Element;
+export default InteractionSurface;
+declare const backgroundHoverColorMap: {
+    'inverse.subtle': import("@emotion/react").SerializedStyles;
+    input: import("@emotion/react").SerializedStyles;
+    neutral: import("@emotion/react").SerializedStyles;
+    'neutral.subtle': import("@emotion/react").SerializedStyles;
+    'neutral.bold': import("@emotion/react").SerializedStyles;
+    'brand.bold': import("@emotion/react").SerializedStyles;
+    selected: import("@emotion/react").SerializedStyles;
+    'selected.bold': import("@emotion/react").SerializedStyles;
+    danger: import("@emotion/react").SerializedStyles;
+    'danger.bold': import("@emotion/react").SerializedStyles;
+    warning: import("@emotion/react").SerializedStyles;
+    'warning.bold': import("@emotion/react").SerializedStyles;
+    success: import("@emotion/react").SerializedStyles;
+    'success.bold': import("@emotion/react").SerializedStyles;
+    discovery: import("@emotion/react").SerializedStyles;
+    'discovery.bold': import("@emotion/react").SerializedStyles;
+    information: import("@emotion/react").SerializedStyles;
+    'information.bold': import("@emotion/react").SerializedStyles;
+};
+declare type InteractionBackgroundColor = keyof typeof backgroundHoverColorMap;
+/**
+ * @codegenEnd
+ */

package/dist/types-ts4.0/components/stack.partial.d.ts

@@ -0,0 +1,47 @@
+/** @jsx jsx */
+import { ReactNode } from 'react';
+import { GlobalSpacingToken } from '../constants';
+import { BasePrimitiveProps } from './types';
+interface StackProps extends BasePrimitiveProps {
+    /**
+     * Used to align children along the cross axis.
+     */
+    alignItems?: FlexAlignItems;
+    /**
+     * Used to align children along the main axis.
+     */
+    justifyContent?: FlexJustifyContent;
+    /**
+     * Token representing gap between children.
+     */
+    gap: GlobalSpacingToken;
+    /**
+     * Elements to be rendered inside the Stack.
+     */
+    children: ReactNode;
+}
+declare type FlexAlignItems = keyof typeof flexAlignItemsMap;
+declare const flexAlignItemsMap: {
+    center: import("@emotion/react").SerializedStyles;
+    baseline: import("@emotion/react").SerializedStyles;
+    flexStart: import("@emotion/react").SerializedStyles;
+    flexEnd: import("@emotion/react").SerializedStyles;
+};
+declare type FlexJustifyContent = keyof typeof flexJustifyContentMap;
+declare const flexJustifyContentMap: {
+    center: import("@emotion/react").SerializedStyles;
+    flexStart: import("@emotion/react").SerializedStyles;
+    flexEnd: import("@emotion/react").SerializedStyles;
+};
+/**
+ * __Stack__
+ *
+ * Stack is a primitive component based on flexbox that manages the vertical layout of direct children.
+ * Renders a `div` by default.
+ *
+ */
+declare const Stack: import("react").ForwardRefExoticComponent<StackProps & import("react").RefAttributes<HTMLDivElement>>;
+export default Stack;
+/**
+ * @codegenEnd
+ */

package/dist/types-ts4.0/components/surface-provider.d.ts

@@ -0,0 +1,15 @@
+/// <reference types="react" />
+/**
+ * __Surface context__
+ *
+ * A surface context provides context information on the current background (if set).
+ */
+export declare const SurfaceContext: import("react").Context<"color.blanket" | "color.blanket.selected" | "color.blanket.danger" | "elevation.surface" | "elevation.surface.sunken" | "elevation.surface.raised" | "elevation.surface.overlay" | "disabled" | "inverse.subtle" | "input" | "neutral" | "neutral.subtle" | "neutral.bold" | "brand.bold" | "selected" | "selected.bold" | "danger" | "danger.bold" | "warning" | "warning.bold" | "success" | "success.bold" | "discovery" | "discovery.bold" | "information" | "information.bold">;
+/**
+ * __useSurface__
+ *
+ * Return the current surface. If no parent sets a surface color it falls back to the default surface.
+ *
+ * @see SurfaceContext
+ */
+export declare const useSurface: () => "color.blanket" | "color.blanket.selected" | "color.blanket.danger" | "elevation.surface" | "elevation.surface.sunken" | "elevation.surface.raised" | "elevation.surface.overlay" | "disabled" | "inverse.subtle" | "input" | "neutral" | "neutral.subtle" | "neutral.bold" | "brand.bold" | "selected" | "selected.bold" | "danger" | "danger.bold" | "warning" | "warning.bold" | "success" | "success.bold" | "discovery" | "discovery.bold" | "information" | "information.bold";

package/dist/types-ts4.0/components/text.partial.d.ts

@@ -0,0 +1,132 @@
+/** @jsx jsx */
+import { FC, ReactNode } from 'react';
+import { BasePrimitiveProps } from './types';
+declare const asAllowlist: readonly [
+    "span",
+    "div",
+    "p"
+];
+declare type AsElement = typeof asAllowlist[number];
+export interface TextProps extends BasePrimitiveProps {
+    /**
+     * HTML tag to be rendered. Defaults to `span`.
+     */
+    as?: AsElement;
+    /**
+     * Elements rendered within the Text element
+     */
+    children: ReactNode;
+    /**
+     * Text color
+     */
+    color?: [
+        TextColor,
+        string
+    ];
+    /**
+     * Font size https://developer.mozilla.org/en-US/docs/Web/CSS/font-size
+     */
+    fontSize?: FontSize;
+    /**
+     * Font weight https://developer.mozilla.org/en-US/docs/Web/CSS/font-weight
+     */
+    fontWeight?: FontWeight;
+    /**
+     * Line height https://developer.mozilla.org/en-US/docs/Web/CSS/line-height
+     */
+    lineHeight?: LineHeight;
+    /**
+     * Truncates text with an ellipsis when text overflows its parent container
+     * (i.e. `width` has been set on parent that is shorter than text length).
+     */
+    shouldTruncate?: boolean;
+    /**
+     * Text align https://developer.mozilla.org/en-US/docs/Web/CSS/text-align
+     */
+    textAlign?: TextAlign;
+    /**
+     * Text transform https://developer.mozilla.org/en-US/docs/Web/CSS/text-transform
+     */
+    textTransform?: TextTransform;
+    /**
+     * Vertical align https://developer.mozilla.org/en-US/docs/Web/CSS/vertical-align
+     */
+    verticalAlign?: VerticalAlign;
+}
+declare type FontSize = keyof typeof fontSizeMap;
+declare const fontSizeMap: {
+    '11px': import("@emotion/react").SerializedStyles;
+    '12px': import("@emotion/react").SerializedStyles;
+    '14px': import("@emotion/react").SerializedStyles;
+};
+declare type FontWeight = keyof typeof fontWeightMap;
+declare const fontWeightMap: {
+    '400': import("@emotion/react").SerializedStyles;
+    '500': import("@emotion/react").SerializedStyles;
+    '700': import("@emotion/react").SerializedStyles;
+};
+declare type LineHeight = keyof typeof lineHeightMap;
+declare const lineHeightMap: {
+    '12px': import("@emotion/react").SerializedStyles;
+    '16px': import("@emotion/react").SerializedStyles;
+    '20px': import("@emotion/react").SerializedStyles;
+    '24px': import("@emotion/react").SerializedStyles;
+    '28px': import("@emotion/react").SerializedStyles;
+    '32px': import("@emotion/react").SerializedStyles;
+    '40px': import("@emotion/react").SerializedStyles;
+};
+declare type TextAlign = keyof typeof textAlignMap;
+declare const textAlignMap: {
+    center: import("@emotion/react").SerializedStyles;
+    end: import("@emotion/react").SerializedStyles;
+    start: import("@emotion/react").SerializedStyles;
+};
+declare type TextTransform = keyof typeof textTransformMap;
+declare const textTransformMap: {
+    none: import("@emotion/react").SerializedStyles;
+    lowercase: import("@emotion/react").SerializedStyles;
+    uppercase: import("@emotion/react").SerializedStyles;
+};
+declare type VerticalAlign = keyof typeof verticalAlignMap;
+declare const verticalAlignMap: {
+    top: import("@emotion/react").SerializedStyles;
+    middle: import("@emotion/react").SerializedStyles;
+    bottom: import("@emotion/react").SerializedStyles;
+};
+/**
+ * __Text__
+ *
+ * Text is a primitive component that has the Atlassian Design System's design guidelines baked in.
+ * This includes considerations for text attributes such as color, font size, font weight, and line height.
+ * It renders a `span` by default.
+ *
+ * @internal
+ */
+declare const Text: FC<TextProps>;
+export default Text;
+/**
+ * THIS SECTION WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
+ * @codegen <<SignedSource::140ffff6e1310c1c37e2067e2c232b92>>
+ * @codegenId colors
+ * @codegenCommand yarn codegen-styles
+ * @codegenParams ["text"]
+ */
+declare const textColorMap: {
+    'color.text': import("@emotion/react").SerializedStyles;
+    subtle: import("@emotion/react").SerializedStyles;
+    subtlest: import("@emotion/react").SerializedStyles;
+    disabled: import("@emotion/react").SerializedStyles;
+    inverse: import("@emotion/react").SerializedStyles;
+    brand: import("@emotion/react").SerializedStyles;
+    selected: import("@emotion/react").SerializedStyles;
+    danger: import("@emotion/react").SerializedStyles;
+    warning: import("@emotion/react").SerializedStyles;
+    'warning.inverse': import("@emotion/react").SerializedStyles;
+    success: import("@emotion/react").SerializedStyles;
+    discovery: import("@emotion/react").SerializedStyles;
+    information: import("@emotion/react").SerializedStyles;
+};
+export declare type TextColor = keyof typeof textColorMap;
+/**
+ * @codegenEnd
+ */

package/dist/types-ts4.0/components/types.d.ts

@@ -0,0 +1,13 @@
+import type { CSSProperties } from 'react';
+export interface BasePrimitiveProps {
+    /**
+     * A unique string that appears as data attribute `data-testid` in the rendered code, serving as a hook for automated tests.
+     */
+    testId?: string;
+    /**
+     * Inline styles to be applied to the primitive.
+     * Marked as "unsafe" because any CSS properties can be provided here without any extra control or validation, including those that would be better managed by the primitive itself via props.
+     * Effectively equivalent to the standard `style` prop but marked with a special name so we can rationalise its usage IN THE FUTURE.
+     */
+    UNSAFE_style?: CSSProperties;
+}

package/dist/types-ts4.0/constants.d.ts

@@ -0,0 +1,15 @@
+export declare const SPACING_SCALE: {
+    'sp-0': number;
+    'sp-25': number;
+    'sp-50': number;
+    'sp-75': number;
+    'sp-100': number;
+    'sp-150': number;
+    'sp-200': number;
+    'sp-300': number;
+    'sp-400': number;
+    'sp-500': number;
+    'sp-600': number;
+    'sp-800': number;
+};
+export declare type GlobalSpacingToken = keyof typeof SPACING_SCALE;

package/dist/types-ts4.0/index.d.ts

@@ -0,0 +1,8 @@
+export { default as UNSAFE_Box } from './components/box.partial';
+export { default as UNSAFE_Text } from './components/text.partial';
+export { default as UNSAFE_Inline } from './components/inline.partial';
+export { default as UNSAFE_Stack } from './components/stack.partial';
+export { default as UNSAFE_InteractionSurface } from './components/interaction-surface.partial';
+export type { BoxProps as UNSAFE_BoxProps } from './components/box.partial';
+export type { TextProps as UNSAFE_TextProps } from './components/text.partial';
+export { SPACING_SCALE as UNSAFE_SPACING_SCALE } from './constants';

package/dist/types-ts4.0/internal/color-map.d.ts

@@ -0,0 +1,34 @@
+/**
+ * THIS FILE WAS CREATED VIA CODEGEN DO NOT MODIFY {@see http://go/af-codegen}
+ *
+ * Some artifact
+ *
+ * @codegen <<SignedSource::8f568e4f0837f7af4a10429e060ad059>>
+ * @codegenCommand yarn codegen-styles
+ */
+export declare const colorMap: {
+    readonly 'neutral.bold': "inverse";
+    readonly 'neutral.bold.hovered': "inverse";
+    readonly 'neutral.bold.pressed': "inverse";
+    readonly 'brand.bold': "inverse";
+    readonly 'brand.bold.hovered': "inverse";
+    readonly 'brand.bold.pressed': "inverse";
+    readonly 'selected.bold': "inverse";
+    readonly 'selected.bold.hovered': "inverse";
+    readonly 'selected.bold.pressed': "inverse";
+    readonly 'danger.bold': "inverse";
+    readonly 'danger.bold.hovered': "inverse";
+    readonly 'danger.bold.pressed': "inverse";
+    readonly 'warning.bold': "warning.inverse";
+    readonly 'warning.bold.hovered': "warning.inverse";
+    readonly 'warning.bold.pressed': "warning.inverse";
+    readonly 'success.bold': "inverse";
+    readonly 'success.bold.hovered': "inverse";
+    readonly 'success.bold.pressed': "inverse";
+    readonly 'discovery.bold': "inverse";
+    readonly 'discovery.bold.hovered': "inverse";
+    readonly 'discovery.bold.pressed': "inverse";
+    readonly 'information.bold': "inverse";
+    readonly 'information.bold.hovered': "inverse";
+    readonly 'information.bold.pressed': "inverse";
+};

package/dist/types-ts4.0/internal/role-to-element.d.ts

@@ -0,0 +1,32 @@
+/// <reference types="react" />
+/**
+ * Adapted straight from react-mui, with a small change.
+ * @see https://www.unpkg.com/browse/react-gui@0.2.1/src/modules/getAccessibilityElementWithSideEffect.js
+ */
+declare const roleToElementType: {
+    readonly article: "article";
+    readonly banner: "header";
+    readonly blockquote: "blockquote";
+    readonly button: "button";
+    readonly code: "code";
+    readonly complementary: "aside";
+    readonly contentinfo: "footer";
+    readonly deletion: "del";
+    readonly emphasis: "em";
+    readonly figure: "figure";
+    readonly insertion: "ins";
+    readonly form: "form";
+    readonly link: "a";
+    readonly list: "ul";
+    readonly listitem: "li";
+    readonly main: "main";
+    readonly navigation: "nav";
+    readonly region: "section";
+    readonly strong: "strong";
+    readonly presentation: "div";
+    readonly group: "fieldset";
+};
+declare type RoleMap = typeof roleToElementType;
+export declare type Role = keyof RoleMap;
+export declare type SupportedElements = RoleMap[Role] & keyof JSX.IntrinsicElements;
+export default roleToElementType;