{ "name": "extended-profile-form", "kind": "block", "primary": "form", "page": "/apps/user-flow/app/registration/personal/personal.contents.html", "slots": [ { "name": "page-header", "tagName": "header", "html": "

Round out your profile

\n Optional — these help teammates find you in directory search and route messages to the right person." }, { "name": "page-content", "tagName": "section", "html": "\n \n \n\n \n \n \n \n \n \n \n \n \n \n \n \n\n \n \n \n \n \n \n \n \n \n\n \n \n \n\n \n\n \n \n \n\n \n \n \n \n \n \n \n \n \n \n \n \n\n \n \n \n \n \n \n \n\n \n\n \n Where else can teammates reach you?\n Optional — link your handles so DMs and mentions can route to the right surface.\n \n\n \n \n \n\n \n \n \n\n
\n \n \n Your profile will use the basics from sign-up (name + email) until you complete this step.\n \n
" }, { "name": "page-footer", "tagName": "footer", "html": "\n
\n Back\n \n
" } ], "nested": [ "reg-step-header", "reg-extended-profile", "reg-step-footer", "reg-step-progress" ], "attrs": { "data-reg-input": "", "action": "/site/examples/registration/done", "method": "get" }, "html": "
\n
\n\n
\n\n \n
", "source": "apps/user-flow/app/registration/personal/personal.contents.html", "metadata": { "domain": "forms", "description": "Complete extended-profile form — heading then many labelled fields (title, department, manager, pronouns, location, time zone, working hours) split into sections by dividers, prefixed social-handle inputs, a defer checkbox, and a back / continue footer. The full long-form composition with header and footer. Use for 'profile form', 'edit profile form', 'long form with many fields and sections'.", "keywords": [ "profile", "form", "extended", "edit", "user", "fields", "title", "department", "manager", "pronouns", "location", "timezone", "working-hours", "social", "handle", "prefix", "divider", "sections", "defer", "complete", "card", "heading", "footer", "continue", "full-form" ], "related": [ "reg-extended-profile", "auth-profile-form", "reg-step-footer" ], "tags": { "complexity": "complex", "form": "profile" } }, "captured_at": "2026-06-10T14:28:57.979Z", "template": [ { "id": "text", "component": "Text", "variant": "display", "textContent": "Round out your profile" }, { "id": "text-2", "component": "Text", "color": "subtle", "textContent": "Optional — these help teammates find you in directory search and route messages to the right person." }, { "id": "header-2", "component": "Header", "data-reg-heading": "", "data-chunk-slot": "page-header", "children": [ "text", "text-2" ] }, { "id": "header", "component": "Header", "data-reg-heading": "", "data-chunk-slot": "page-header", "children": [ "header-2" ] }, { "id": "title", "component": "Input", "autocomplete": "organization-title", "name": "title", "placeholder": "e.g. Senior Designer" }, { "id": "field", "component": "Field", "inline": true, "label": "Title", "children": [ "title" ] }, { "id": "department", "component": "ChoicePicker", "name": "department", "value": "design", "options": [ { "value": "", "label": "Pick one…" }, { "value": "engineering", "label": "Engineering" }, { "value": "product", "label": "Product" }, { "value": "design", "label": "Design" }, { "value": "sales", "label": "Sales" }, { "value": "marketing", "label": "Marketing" }, { "value": "cs", "label": "Customer Success" }, { "value": "ops", "label": "Operations" } ] }, { "id": "field-2", "component": "Field", "inline": true, "label": "Department", "children": [ "department" ] }, { "id": "manager", "component": "ChoicePicker", "name": "manager", "options": [ { "value": "", "label": "No manager" }, { "value": "jane", "label": "Jane Doe (Founder)" }, { "value": "maya", "label": "Maya Patel (VP Engineering)" }, { "value": "riley", "label": "Riley Park (Head of Design)" }, { "value": "morgan", "label": "Morgan Lee (Head of Sales)" } ], "value": "" }, { "id": "field-3", "component": "Field", "inline": true, "label": "Manager", "children": [ "manager" ] }, { "id": "pronouns", "component": "Input", "autocomplete": "off", "name": "pronouns", "placeholder": "e.g. she/her, they/them" }, { "id": "field-4", "component": "Field", "inline": true, "label": "Pronouns", "children": [ "pronouns" ] }, { "id": "divider", "component": "Divider" }, { "id": "location", "component": "Input", "autocomplete": "address-level2", "name": "location", "placeholder": "San Francisco, CA" }, { "id": "field-5", "component": "Field", "inline": true, "label": "Location", "children": [ "location" ] }, { "id": "timezone", "component": "ChoicePicker", "name": "timezone", "value": "america/los_angeles", "options": [ { "value": "america/los_angeles", "label": "Pacific (San Francisco) · UTC−8" }, { "value": "america/denver", "label": "Mountain (Denver) · UTC−7" }, { "value": "america/chicago", "label": "Central (Chicago) · UTC−6" }, { "value": "america/new_york", "label": "Eastern (New York) · UTC−5" }, { "value": "europe/london", "label": "London · UTC+0" }, { "value": "europe/berlin", "label": "Berlin · UTC+1" }, { "value": "asia/tokyo", "label": "Tokyo · UTC+9" }, { "value": "australia/sydney", "label": "Sydney · UTC+11" } ] }, { "id": "field-6", "component": "Field", "hint": "Detected from your browser. Override if you're traveling or working remotely.", "inline": true, "label": "Time zone", "children": [ "timezone" ] }, { "id": "segment", "component": "Segment", "text": "9 to 5", "value": "9to5" }, { "id": "segment-2", "component": "Segment", "text": "Flexible", "value": "flex" }, { "id": "segment-3", "component": "Segment", "text": "Custom", "value": "custom" }, { "id": "hours", "component": "SegmentedControl", "value": "9to5", "children": [ "segment", "segment-2", "segment-3" ] }, { "id": "field-7", "component": "Field", "inline": true, "label": "Working hours", "children": [ "hours" ] }, { "id": "divider-2", "component": "Divider" }, { "id": "text-3", "component": "Text", "strong": true, "textContent": "Where else can teammates reach you?" }, { "id": "text-4", "component": "Text", "color": "subtle", "size": "sm", "textContent": "Optional — link your handles so DMs and mentions can route to the right surface." }, { "id": "column", "component": "Column", "gap": "2", "children": [ "text-3", "text-4" ] }, { "id": "slack", "component": "Input", "name": "slack", "placeholder": "janedoe", "prefix": "@" }, { "id": "field-8", "component": "Field", "inline": true, "label": "Slack handle", "children": [ "slack" ] }, { "id": "github", "component": "Input", "name": "github", "placeholder": "janedoe", "prefix": "@" }, { "id": "field-9", "component": "Field", "inline": true, "label": "GitHub handle", "children": [ "github" ] }, { "id": "defer", "component": "CheckBox", "label": "I'll do this later from my profile", "name": "defer" }, { "id": "text-5", "component": "Text", "color": "subtle", "size": "sm", "textContent": "Your profile will use the basics from sign-up (name + email) until you complete this step.", "data-reg-defer-hint": "" }, { "id": "column-2", "component": "Column", "data-reg-defer-row": "", "children": [ "defer", "text-5" ] }, { "id": "section-2", "component": "Section", "data-reg-form": "", "data-chunk-slot": "page-content", "children": [ "field", "field-2", "field-3", "field-4", "divider", "field-5", "field-6", "field-7", "divider-2", "column", "field-8", "field-9", "column-2" ] }, { "id": "section", "component": "Section", "data-reg-form": "", "data-chunk-slot": "page-content", "children": [ "section-2" ] }, { "id": "column-3", "component": "Column" }, { "id": "text-6", "component": "Text", "textContent": "Back", "variant": "body" }, { "id": "link", "component": "Link", "href": "/site/examples/registration/org-review", "text": "Back", "data-reg-back": "", "children": [ "text-6" ] }, { "id": "button", "component": "Button", "type": "submit", "text": "Continue", "variant": "primary" }, { "id": "column-4", "component": "Column", "data-reg-actions": "", "children": [ "link", "button" ] }, { "id": "footer-2", "component": "Footer", "data-chunk-slot": "page-footer", "children": [ "column-3", "column-4" ] }, { "id": "footer", "component": "Footer", "data-chunk-slot": "page-footer", "children": [ "footer-2" ] }, { "id": "root", "component": "FormContainer", "data-reg-input": "", "children": [ "header", "section", "footer" ] } ] }