feat(site): create Template Builder components #25123
Conversation
jeremyruppel
force-pushed
the
jeremy/template-builder-components
branch
from
0948f05 to
85b17e5
Compare
| return ( | ||
| <div | ||
| className={cn( | ||
| "border-0 border-l border-border border-solid mx-4 -translate-x-px", |
There was a problem hiding this comment.
IMO we should make the step divider's border color correspond with the step number above, to make the connection/progression between steps clearer.
What do you think @chrifro?
There was a problem hiding this comment.
wow, I'm not sure where I got that divider line color from! double checked the Figma and the divider never changes color as you progress through the steps– it's always that secondary gray. @aqandrew what do you think of this vs green?
There was a problem hiding this comment.
I took those two screenshots after setting different StepDivider border colors in DevTools on my machine! Didn't mean to gaslight you 😆
I was recommending the white/green borders as a possible improvement over what was designed. I know I'm late giving design feedback (seeing as the latest Figma comments are from 1-2 months ago), but I'm curious to know what you/Christin think about my proposal
There was a problem hiding this comment.
oh haaaaaa my bad! gotcha, ok I asked design on the Figma. I am thinking of merging this as-is though and we can change the line color depending on the answer
There was a problem hiding this comment.
SGTM, I'm good with adding that in a followup PR if that's what we decide on. I'd be happy to implement it too 🙂
…uilder Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
…nition-driven Replace the children API on ModuleConfiguration and TemplateConfiguration with a typed fields array rendered by a shared ConfigurationField dispatcher. Text fields reuse the existing FormField; select, radio, and switch fields are covered by local wrappers. This removes the ad-hoc field helpers the stories previously had to invent and stops duplicating SelectField across both story files. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
- Use semantic HTML: section, header, figure, h3 elements - Add aria-labelledby to ModuleCard and TemplateCard - Refactor StepIndicator to use cva for variant styling - Define named props types for BaseTemplateSelection and ModuleSelection - Remove unnecessary flex classes, lean on native block flow - Fix View Details link width in ModuleCard
Co-authored-by: Andrew Aquino <dawneraq@gmail.com>
jeremyruppel
force-pushed
the
jeremy/template-builder-components
branch
from
b6a41d6 to
681b59f
Compare
aqandrew
left a comment
aqandrew
left a comment
There was a problem hiding this comment.
Thanks for addressing my PR comments! I'm good with this if you accept the Chromatic changes
I've accepted all of the changes for this PR– there's still a few that are for Agents so I'm going to leave those |
3 participants
This PR introduces several components used in the Template Builder designs:
Base template card
Base template customization
Module card
Module customization
Selection overview
