Security Questionnaire Answers
A procurement FAQ grouping security controls into hairline rows that pair each question with a tone-coded yes, partial, or not-yet chip and the detail behind it, closing on a security pack request.
Docs
Installation
A real shadcn registry command, not a copy-paste stand-in: it fetches this block plus its button, badge dependencies and any missing npm packages, and installs them straight into your project.
npx shadcn add https://staaarter.com/r/security-questionnaire-answers.jsonPrefer not to use the CLI? Copy the source from the Code toggle above into src/components/blocks/faq/faq90.tsx instead.
Usage
The file also exports faq90Demo, the exact props behind the preview above. Spread it to get a working section in one line, then replace it with your own data.
import { Faq90, faq90Demo } from "@/components/blocks/faq/faq90"; export default function Page() { return <Faq90 {...faq90Demo} />; }
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| badge | string | none | Small pill above the heading. |
| heading | string | none | Section heading. |
| description | string | none | Section intro text. |
| groups | ControlGroup[] | none | Grouped rows of security controls, each rendered under its own group title. |
| closingHeading | string | "Need the full picture?" | Heading in the closing panel. |
| closingDescription | string | none | Supporting copy in the closing panel. |
| closingButtonLabel | string | "Request security pack" | Label on the inert closing button. |
| className | string | none | Extra classes for the outer section element. |
Types
type ControlStatus = "yes" | "partial" | "not-yet"; type ControlRow = { question: string; detail: string; status: ControlStatus; }; type ControlGroup = { title: string; rows: ControlRow[]; };
Behavior notes
- Plain server component: every row is always open, there is no accordion or toggle state anywhere in this block.
- The three control statuses map to Badge variants using semantic tokens only (default for yes, secondary for partial, outline for not-yet) rather than literal green/yellow/red colors.
- "Request security pack" is an inert button with no real submit handler; wiring it to an actual document request flow is left to the consuming app.
More FAQ Blocks
View all →collapsible-accordion
Collapsible Accordion
Stacked cards with expandable sections, for full-length answers in a compact format.
open-list-layout
Open List Layout
Questions with answers displayed directly below in a simple always-open list.
three-column-grid
Three Column Grid
Q&A pairs arranged in a responsive grid layout, always open.
tabbed-categories
Tabbed Categories
Sidebar navigation with category tabs and an accordion of that category's questions.
searchable-accordion
Searchable Accordion
Search input that filters accordion items in real-time by question and answer text.
grouped-sections
Grouped Sections
FAQs organized into titled sections, each with its own independent accordion below it.