Feature flags / 14 primitives + composition

Feature flag + experimentation primitives

Visual primitives for the Mufflermen feature-flag console — built against real workshop releases (quote-instant-pricing, parts-3d-viewer, workshop-bay-availability-realtime, compliance-receipt-qr). Visual reference only — no real backend wired.

Production answer

Feature flag + experimentation primitives is a reusable Oak Flats Muffler Men UI primitive with documented states, accessibility expectations, theme behavior, and implementation evidence.

Primary CTAReview Feature flag + experimentation primitives states
Generative search brief

Feature flag + experimentation primitives: Visual primitives for the Mufflermen feature-flag console — built against real workshop releases (quote-instant-pricing, parts-3d-viewer, workshop-bay-availability-realtime, compliance-receipt-qr). Visual reference only — no real backend wired.

Visual reference only — no real backend wired
Primitive 01

Flag card

Flag card with key, on/off toggle, tone-coded env chips (DEV / STG / PRD), variant chips and last-modified meta.

Stateful · toggleOpen
Primitive 02

Flag detail pane

Full detail pane composing variants, targeting rules, rollout, change timeline, kill switch and linked experiments.

CompositionOpen
Primitive 03

Rollout slider

0-100% slider with tone-shifting fill, snap points 0/25/50/75/100, full keyboard support and aria-valuenow.

Stateful · sliderOpen
Primitive 04

Variant picker

A/B/C variant picker with weight inputs and a sum-must-100% indicator that flips tone when invalid.

Stateful · weightsOpen
Primitive 05

Targeting rule row

Subject (user / workspace / role / geo / device) + operator + tag input value list with remove action.

Stateful · tagsOpen
Primitive 06

Audience filter card

Audience card with name, member count, criteria chips and edit / duplicate / archive actions.

StatelessOpen
Primitive 07

Environment tabs

Three-tab DEV / STG / PRD switcher with per-environment status dots and flag counts.

Stateful · tabsOpen
Primitive 08

Flag search

Inline flag search with kbd hint, owner chip filter, status chip filter and archived toggle.

Stateful · filtersOpen
Primitive 09

Kill switch button

Big destructive kill switch — red glow, two-step confirm with typed phrase input and aria-live alert.

Stateful · confirmOpen
Primitive 10

Experiment results

Experiment results card — variant rows with conversion, uplift, p-value chip, winner badge and significance bar.

StatelessOpen
Primitive 11

Dependency graph

SVG graph of dependent flags — parent → child edges with arrowheads and a cycle-detected warning chip.

StatelessOpen
Primitive 12

Recent flag changes log

Audit log of flag changes — who / when / what / from-value → to-value. Powered by the shared DataTable.

StatelessOpen
Primitive 13

Rollout canary bar

Canary progression 1% → 5% → 25% → 50% → 100% with reached / current step highlighting and ETA chip.

StatelessOpen
Primitive 14

Feature gate preview

Mock preview — attributes in, resolved variant + reason out, plus a small 'you would see…' surface stub.

StatelessOpen
Composition

Full console

Composed console wiring EnvironmentTabs + FlagSearch + flag list + FlagDetailPane + RecentChanges + KillSwitch.

CompositionOpen