@opentrons/components 0.1.6-alpha.12 → 0.1.6-alpha.16

package/lib/instrument/InstrumentDiagram.d.ts

@@ -1,4 +1,4 @@
-import type { FlattenSimpleInterpolation } from 'styled-components';
+import type { FlattenSimpleInterpolation } from '../patches';
 import type { PipetteV2Specs } from '@opentrons/shared-data';
 import type { Mount } from '../robot-types';
 import type { StyleProps } from '..';

package/lib/molecules/DropdownMenu/index.d.ts

@@ -35,7 +35,7 @@ export interface DropdownMenuProps {
     onBlur?: React.FocusEventHandler<HTMLButtonElement>;
     /** optional disabled */
     disabled?: boolean;
-    /** force direction for pd after release this will be fixed and remove */
-    forceDirection?: boolean;
+    /** optional placement of the menu */
+    menuPlacement?: 'auto' | 'top' | 'bottom';
 }
 export declare function DropdownMenu(props: DropdownMenuProps): JSX.Element;

package/lib/molecules/InfoScreen/index.d.ts

@@ -1,6 +1,8 @@
 interface InfoScreenProps {
     content: string;
+    subContent?: string;
     backgroundColor?: string;
+    height?: string;
 }
-export declare function InfoScreen({ content, backgroundColor, }: InfoScreenProps): JSX.Element;
+export declare function InfoScreen({ content, subContent, backgroundColor, height, }: InfoScreenProps): JSX.Element;
 export {};

package/lib/organisms/Toolbox/index.d.ts

@@ -1,4 +1,3 @@
-import * as React from 'react';
 export interface ToolboxProps {
     title: JSX.Element;
     children: React.ReactNode;
@@ -12,6 +11,7 @@ export interface ToolboxProps {
     closeButton?: JSX.Element;
     side?: 'left' | 'right';
     horizontalSide?: 'top' | 'bottom';
+    titlePadding?: string;
     childrenPadding?: string;
     subHeader?: JSX.Element | null;
     secondaryHeaderButton?: JSX.Element;

package/lib/patches.d.ts

@@ -0,0 +1,4 @@
+import styled from 'styled-components';
+export * from 'styled-components';
+declare const defaultStyled: typeof styled;
+export { defaultStyled as default };

package/lib/primitives/Btn.d.ts

@@ -1,4 +1,4 @@
-import type { StyledComponent } from 'styled-components';
+import type { StyledComponent } from '../patches';
 import type { StyleProps } from './types';
 export declare const BUTTON_TYPE_SUBMIT: 'submit';
 export declare const BUTTON_TYPE_RESET: 'reset';

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

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

package/lib/primitives/types.d.ts

@@ -1,4 +1,4 @@
-import type { StyledComponent, CSSProperties } from 'styled-components';
+import type { StyledComponent, CSSProperties } from '../patches';
 export interface ColorProps {
     color?: string;
     backgroundColor?: string;

package/lib/styles/typography.d.ts

@@ -1,4 +1,4 @@
-import type { FlattenSimpleInterpolation } from 'styled-components';
+import type { FlattenSimpleInterpolation } from '../patches';
 export declare const FONT_SIZE_HUGE = "3rem";
 export declare const FONT_SIZE_BIG = "1.5rem";
 export declare const FONT_SIZE_HEADER = "1.125rem";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opentrons/components",
-  "version": "0.1.6-alpha.12",
+  "version": "0.1.6-alpha.16",
   "description": "React components library for Opentrons' projects",
   "source": "src/index.ts",
   "types": "lib/index.d.ts",
@@ -19,11 +19,10 @@
   "homepage": "https://github.com/Opentrons/opentrons#readme",
   "peerDependencies": {
     "react": "18.2.0",
-    "react-dom": "18.2.0",
-    "styled-components": "5.3.6"
+    "react-dom": "18.2.0"
   },
   "dependencies": {
-    "@opentrons/shared-data": "0.1.6-alpha.12",
+    "@opentrons/shared-data": "0.1.6-alpha.16",
     "@popperjs/core": "2.1.1",
     "@react-spring/types": "9.6.1",
     "@react-spring/web": "9.6.1",
@@ -38,7 +37,8 @@
     "react-popper": "1.0.0",
     "react-remove-scroll": "2.4.3",
     "react-select": "5.4.0",
-    "redux": "4.0.5"
+    "redux": "4.0.5",
+    "styled-components": "5.3.6"
   },
   "devDependencies": {
     "react-redux": "8.1.2"

package/tsconfig.json

@@ -9,8 +9,6 @@
     "composite": true,
     "rootDir": "src",
     "outDir": "lib",
-    "allowSyntheticDefaultImports": true,
-    "esModuleInterop": true
   },
   "include": ["typings", "src"],
   "exclude": ["**/*.stories.tsx"]

package/vite.config.mts

@@ -10,18 +10,14 @@ import lostCss from 'lost'
 export default defineConfig({
   build: {
     // Relative to the root
+    ssr: 'src/index.ts',
     outDir: 'lib',
     // do not delete the outdir, typescript types might live there and we dont want to delete them
     emptyOutDir: false,
-    lib: {
-      entry: 'src/index.ts',
-      formats: ['es', 'cjs'], // Generate both ES Module and CommonJS outputs
-      fileName: (format) => (format === 'es' ? 'index.mjs' : 'index.cjs'),
+    commonjsOptions: {
+      transformMixedEsModules: true,
+      esmExternals: true,
     },
-    rollupOptions: {
-      external: ['react', 'react-dom', 'styled-components'], // Ensure peer dependencies are not bundled
-    },
-    target: 'es2017', // Transpile down to a compatible version for Next.js (for Protocol Library)
   },
   plugins: [
     react({
@@ -36,7 +32,6 @@ export default defineConfig({
     esbuildOptions: {
       target: 'es2020',
     },
-    exclude: ['styled-components'], // Avoid pre-bundling styled-components
   },
   css: {
     postcss: {
@@ -60,6 +55,5 @@ export default defineConfig({
         '../components/src/index.module.css'
       ),
     },
-    dedupe: ['styled-components'], // Prevent duplicate styled-components instances
   },
 })