@opentrons/components 0.1.3 → 0.1.5-alpha.3

package/lib/primitives/Btn.d.ts

@@ -1,8 +1,9 @@
+/// <reference types="react" />
 import type { PrimitiveComponent } from './types';
 export declare const BUTTON_TYPE_SUBMIT: 'submit';
 export declare const BUTTON_TYPE_RESET: 'reset';
 export declare const BUTTON_TYPE_BUTTON: 'button';
-declare type BtnComponent = PrimitiveComponent<'button'>;
+type BtnComponent = PrimitiveComponent<'button'>;
 /**
  * Button primitive
  *
@@ -14,47 +15,47 @@ export declare const Btn: BtnComponent;
  *
  * @component
  */
-export declare const PrimaryBtn: BtnComponent;
+export declare const PrimaryBtn: import("styled-components").StyledComponent<import("react").ComponentType<any> | keyof JSX.IntrinsicElements, any, import("./types").StyleProps, any>;
 /**
  * Secondary button variant
  *
  * @component
  */
-export declare const SecondaryBtn: BtnComponent;
+export declare const SecondaryBtn: import("styled-components").StyledComponent<import("react").ComponentType<any> | keyof JSX.IntrinsicElements, any, import("./types").StyleProps, any>;
 /**
  * New primary button variant used in app
  *
  * @component
  */
-export declare const NewPrimaryBtn: BtnComponent;
+export declare const NewPrimaryBtn: import("styled-components").StyledComponent<import("react").ComponentType<any> | keyof JSX.IntrinsicElements, any, import("./types").StyleProps, any>;
 /**
  * New secondary button variant used in app
  *
  * @component
  */
-export declare const NewSecondaryBtn: BtnComponent;
+export declare const NewSecondaryBtn: import("styled-components").StyledComponent<import("react").ComponentType<any> | keyof JSX.IntrinsicElements, any, import("./types").StyleProps, any>;
 /**
  * Red primary button variant used in app
  *
  * @component
  */
-export declare const NewAlertPrimaryBtn: BtnComponent;
+export declare const NewAlertPrimaryBtn: import("styled-components").StyledComponent<import("react").ComponentType<any> | keyof JSX.IntrinsicElements, any, import("./types").StyleProps, any>;
 /**
  * Red secondary button variant used in app
  *
  * @component
  */
-export declare const NewAlertSecondaryBtn: BtnComponent;
+export declare const NewAlertSecondaryBtn: import("styled-components").StyledComponent<import("react").ComponentType<any> | keyof JSX.IntrinsicElements, any, import("./types").StyleProps, any>;
 /**
  * Light secondary button variant
  *
  * @component
  */
-export declare const LightSecondaryBtn: BtnComponent;
+export declare const LightSecondaryBtn: import("styled-components").StyledComponent<import("react").ComponentType<any> | keyof JSX.IntrinsicElements, any, import("./types").StyleProps, any>;
 /**
  * Tertiary button variant
  *
  * @component
  */
-export declare const TertiaryBtn: BtnComponent;
+export declare const TertiaryBtn: import("styled-components").StyledComponent<import("react").ComponentType<any> | keyof JSX.IntrinsicElements, any, import("./types").StyleProps, any>;
 export {};

package/lib/primitives/style-props.d.ts

@@ -1,4 +1,4 @@
-import * as Types from './types';
+import type * as Types from './types';
 import type { CSSObject } from 'styled-components';
 export declare const styleProps: (props: Types.StyleProps) => CSSObject;
 export declare const isntStyleProp: (prop: string | React.ReactText) => boolean;

package/lib/primitives/types.d.ts

@@ -93,4 +93,4 @@ export interface TransitionProps {
 export interface StyleProps extends ColorProps, TypographyProps, SpacingProps, BorderProps, FlexboxProps, GridProps, LayoutProps, PositionProps, TransitionProps {
     className?: string;
 }
-export declare type PrimitiveComponent<Instance extends keyof JSX.IntrinsicElements | React.ComponentType<any>, Props extends StyleProps = StyleProps> = StyledComponent<Instance, {}, Props>;
+export type PrimitiveComponent<Instance extends keyof JSX.IntrinsicElements | React.ComponentType<any>, Props extends StyleProps = StyleProps> = StyledComponent<Instance, {}, Props>;

package/lib/styles/borders.d.ts

@@ -3,6 +3,6 @@ export declare const BORDER_RADIUS_DEFAULT = "2px";
 export declare const BORDER_RADIUS_1 = "5px";
 export declare const BORDER_STYLE_NONE = "none";
 export declare const BORDER_STYLE_SOLID = "solid";
-export declare const BORDER_SOLID_LIGHT: string;
-export declare const BORDER_SOLID_MEDIUM: string;
+export declare const BORDER_SOLID_LIGHT = "1px solid #e6e6e6";
+export declare const BORDER_SOLID_MEDIUM = "1px solid #9b9b9b";
 export declare const SHADOW_LIGHT = "0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.2)";

package/lib/styles/layout.d.ts

@@ -18,3 +18,6 @@ export declare const OVERFLOW_HIDDEN = "hidden";
 export declare const OVERFLOW_CLIP = "clip";
 export declare const OVERFLOW_SCROLL = "scroll";
 export declare const OVERFLOW_AUTO = "auto";
+export declare const OVERFLOW_WRAP_ANYWHERE = "anywhere";
+export declare const OVERFLOW_WRAP_BREAK_WORD = "break-word";
+export declare const OVERFLOW_WRAP_NORMAL = "normal";

package/lib/tooltips/DeprecatedTooltip.d.ts

@@ -1,6 +1,6 @@
 import * as React from 'react';
 import { Popper } from 'react-popper';
-declare type PopperProps = React.ComponentProps<typeof Popper>;
+type PopperProps = React.ComponentProps<typeof Popper>;
 export interface DeprecatedTooltipProps {
     /** show or hide the tooltip */
     open?: boolean;

package/lib/tooltips/HoverTooltip.d.ts

@@ -4,8 +4,8 @@ interface MouseHandlers {
     onMouseEnter: () => void;
     onMouseLeave: () => void;
 }
-export declare type HoverTooltipHandlers = React.PropsWithRef<MouseHandlers>;
-export declare type HoverTooltipProps = DeprecatedTooltipProps;
+export type HoverTooltipHandlers = React.PropsWithRef<MouseHandlers>;
+export type HoverTooltipProps = DeprecatedTooltipProps;
 interface HoverTooltipState {
     isOpen: boolean;
 }

package/lib/tooltips/types.d.ts

@@ -1,12 +1,12 @@
 import type { CSSProperties } from 'react';
 import type { Instance, Options, Modifier } from '@popperjs/core/lib/types';
 import type { UseHoverOptions, HoverHandlers } from '../interaction-enhancers';
-export declare type Placement = Options['placement'];
-export declare type Strategy = Options['strategy'];
-export declare type PopperInstance = Instance;
-export declare type PopperOptions = Options;
-export declare type PopperModifer<T> = Modifier<T>;
-export declare type HandleStateUpdate = (placement: Placement, styles: {
+export type Placement = Options['placement'];
+export type Strategy = Options['strategy'];
+export type PopperInstance = Instance;
+export type PopperOptions = Options;
+export type PopperModifer<T> = Modifier<T>;
+export type HandleStateUpdate = (placement: Placement, styles: {
     popper?: CSSProperties;
     arrow?: CSSProperties;
 }) => void;
@@ -19,7 +19,7 @@ export interface UsePopperOptions {
     strategy?: Strategy | null;
     offset?: number;
 }
-export declare type UsePopperResult = Instance | null;
+export type UsePopperResult = Instance | null;
 export interface UseTooltipOptions {
     placement?: Placement;
     strategy?: Strategy;
@@ -37,14 +37,14 @@ export interface UseTooltipResultTooltipProps {
     arrowRef: React.RefCallback<HTMLElement | null>;
     arrowStyle: CSSProperties;
 }
-export declare type UseTooltipResult = [
+export type UseTooltipResult = [
     UseTooltipResultTargetProps,
     UseTooltipResultTooltipProps
 ];
-export declare type UseHoverTooltipOptions = Partial<UseTooltipOptions & UseHoverOptions>;
+export type UseHoverTooltipOptions = Partial<UseTooltipOptions & UseHoverOptions>;
 export interface UseHoverTooltipTargetProps extends UseTooltipResultTargetProps, HoverHandlers {
 }
-export declare type UseHoverTooltipResult = [
+export type UseHoverTooltipResult = [
     UseHoverTooltipTargetProps,
     UseTooltipResultTooltipProps & {
         visible: boolean;

package/lib/ui-style-constants/borders.d.ts

@@ -8,9 +8,9 @@ export declare const borderRadiusSize4 = "16px";
 export declare const borderRadiusSize5 = "40px";
 export declare const borderRadiusSize6 = "60px";
 export declare const tabBorder: import("styled-components").FlattenSimpleInterpolation;
-export declare const activeLineBorder: string;
-export declare const lineBorder: string;
-export declare const transparentLineBorder: string;
+export declare const activeLineBorder = "1px solid #006CFA";
+export declare const lineBorder = "1px solid #DEDEDE";
+export declare const transparentLineBorder = "1px solid transparent";
 export declare const cardOutlineBorder: import("styled-components").FlattenSimpleInterpolation;
 export declare const bigDropShadow = "0 3px 6px rgba(255, 0, 0, 1)";
 export declare const smallDropShadow = "0px 3px 6px rgba(0, 0, 0, 0.23)";

package/lib/ui-style-constants/responsiveness.d.ts

@@ -1 +1,2 @@
 export declare const touchscreenMediaQuerySpecs = "(height: 600px) and (width: 1024px)";
+export declare const isTouchscreen: boolean;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opentrons/components",
-  "version": "0.1.3",
+  "version": "0.1.5-alpha.3",
   "description": "React components library for Opentrons' projects",
   "source": "src/index.ts",
   "types": "lib/index.d.ts",
@@ -24,7 +24,7 @@
     "@types/react-router-dom": "5.3.3"
   },
   "dependencies": {
-    "@opentrons/shared-data": "0.1.3",
+    "@opentrons/shared-data": "0.1.5-alpha.3",
     "@popperjs/core": "2.1.1",
     "@react-spring/types": "9.6.1",
     "@react-spring/web": "9.6.1",