Bus UI Data Display

ProjectionDetail renders one public-safe projection.

Use it when you need a structured detail view with fields, optional summary text, and evidence actions that may be omitted or disabled with diagnostics.

Public API

ProjectionDetail(p ProjectionDetailProps) (ProjectionDetailResult, error)

The inputs are ProjectionDetailProps, ProjectionField, and ProjectionEvidenceAction. The result includes rendered HTML plus ProjectionDetailDiagnostic entries.

When to use it

Use ProjectionDetail for provider payloads or other projected data that needs public-safe redaction and evidence affordances in one surface.

Live demo

Loading ProjectionDetail demo...

Example

Go API

import (
  gx "github.com/busdk/bus-gx/pkg/gx"
  ui "github.com/busdk/bus-ui/pkg/ui"
)

node := ui.ProjectionDetail(ui.ProjectionDetailProps{
  Title:   "Invoice projection",
  Summary: "Validated before the provider response is exposed.",
  Fields: []ui.ProjectionField{
    {Label: "Provider", Value: "Stripe"},
    {Label: "State", Value: "Ready"},
  },
  Evidence: []ui.ProjectionEvidenceAction{
    {Label: "Open evidence", Operation: ui.EvidenceOperationOpen, URL: "/evidence/invoice.pdf"},
  },
})

html, err := gx.RenderHTML(node)

.gx source

In .gx source, author the visible component state as GX markup. Keep the Go API block above for the package helper or render-boundary call.

package busuiexamples

import gx "github.com/busdk/bus-gx/pkg/gx"

func ProjectionDetailExample() gx.Node {
  return <section class="projection-detail">
  <h2><Text value={"Receipt projection"}></Text></h2>
  <dl><dt><Text value={"Status"}></Text></dt><dd><Text value={"Ready"}></Text></dd></dl>
</section>
}

Use the public pkg/ui facade for this projection detail surface.