Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

refactor(app): add and use deck map component in interventionmodal #15570

Merged
merged 9 commits into from
Jul 5, 2024
Prev Previous commit
Next Next commit
refactor(app): separate StandIn story util
We're probably going to use this a lot more now that we'll have a bunch
of content components that live in TwoColumn, so let's make StandIn reusable.
  • Loading branch information
sfoster1 committed Jul 5, 2024
commit 340dc826185aadaf950df18eb44af1d81d0fed31
14 changes: 1 addition & 13 deletions app/src/molecules/InterventionModal/TwoColumn.stories.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -7,11 +7,11 @@ import {
Flex,
DIRECTION_COLUMN,
Box,
BORDERS,
} from '@opentrons/components'
import { InlineNotification } from '../../atoms/InlineNotification'

import { TwoColumn as TwoColumnComponent } from './'
import { StandInContent } from './story-utils/StandIn'

import type { Meta, StoryObj } from '@storybook/react'

Expand All @@ -30,18 +30,6 @@ interface StorybookArgs {
rightText?: string
}

function StandInContent(): JSX.Element {
return (
<Box
border={'4px dashed #A864FFFF'}
borderRadius={BORDERS.borderRadius8}
margin={SPACING.spacing16}
height="104px"
backgroundColor="#A864FF19"
/>
)
}

interface NotificationProps {
heading?: string
message?: string
Expand Down
14 changes: 14 additions & 0 deletions app/src/molecules/InterventionModal/story-utils/StandIn.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
import * as React from 'react'
import { Box, BORDERS, SPACING } from '@opentrons/components'

export function StandInContent(): JSX.Element {
return (
<Box
border={'4px dashed #A864FFFF'}
borderRadius={BORDERS.borderRadius8}
margin={SPACING.spacing16}
height="104px"
backgroundColor="#A864FF19"
/>
)
}