Bridge Training
Bridge ReactMisc

Preview

Generic preview containers and key-value display.

Import from @workspace/bridge-react/misc/*.

PreviewCard

Generic card container for preview content.

import { PreviewCard } from '@workspace/bridge-react/misc/preview-card';

<PreviewCard>
  <p>Preview content here</p>
</PreviewCard>

Props

Prop

Type

KeyValuePreview

Displays key-value pairs as inline badges. Useful for teaching params, metadata, settings.

import { KeyValuePreview } from '@workspace/bridge-react/misc/key-value-preview';

<KeyValuePreview
  title="Settings"
  entries={[
    { key: 'scoring', label: 'Scoring', value: 'TPP' },
    { key: 'vuln', label: 'Vulnerability', value: 'NS' },
  ]}
/>

Demo

Props

Prop

Type

On this page