Examples

Package CSS

Use the package stylesheet as the npm-consumer styling path.

Pattern

Import @aigentive/wire-react/styles.css once. The package CSS covers the current Wire surfaces without requiring a utility-class source scan from consumers.

tsx

"use client";

import "@aigentive/wire-react/styles.css";
import { WireViewer } from "@aigentive/wire-react";

export function WorkflowPreview({ diagram }) {
  return (
    <div style={{ height: 360 }}>
      <WireViewer
        diagram={diagram}
        fitView
        fitViewPadding={0.2}
        showControls
        showMiniMap
      />
    </div>
  );
}

NextCustom shell