{"id":"70bda8f5-5e2f-45cc-8b29-6a03049cdfb2","shortId":"5t2qPQ","kind":"skill","title":"hig-components-controls","tagline":">-","description":"# Apple HIG: Selection and Input Controls\n\nCheck for `.claude/apple-design-context.md` before asking questions. Use existing context and only ask for information not already covered.\n\n## Key Principles\n\n1. **Clear current state.** Users must always see what is selected. Toggles show on/off, segmented controls highlight the active segment, pickers display the current selection.\n\n2. **Prefer standard system controls.** Built-in controls provide consistency and accessibility. Custom controls introduce a learning curve and may break assistive features.\n\n3. **Toggles for binary states.** On or off. In Settings-style screens, changes take effect immediately. In modal forms, changes commit on confirmation.\n\n4. **Segmented controls for mutually exclusive options.** 2-5 items, roughly equal importance, short labels.\n\n5. **Sliders for continuous values.** When precise numeric input is not critical. Provide min/max labels or icons for range endpoints.\n\n6. **Pickers for long option lists.** Too many options for a segmented control. Works well for dates, times, structured data.\n\n7. **Steppers for small, precise adjustments.** Increment/decrement in fixed steps. Display current value next to the stepper with reasonable min/max bounds.\n\n8. **Text fields for short, single-line input.** Text views for multi-line. Configure keyboard type to match expected input (email, URL, number).\n\n9. **Combo boxes: text input + selection list.** macOS. Type a value or choose from a predefined list when custom values are valid.\n\n10. **Token fields: discrete values as visual tokens.** macOS. For email recipients, tags, or collections of discrete items.\n\n11. **Gauges and rating indicators display values.** Gauges show a value within a range. Rating indicators show ratings (often stars). Display-only; use interactive variants for input.\n\n## Reference Index\n\n| Reference | Topic | Key content |\n|---|---|---|\n| [controls.md](references/controls.md) | General controls | States, affordance, system controls |\n| [toggles.md](references/toggles.md) | Toggles | On/off, immediate effect |\n| [segmented-controls.md](references/segmented-controls.md) | Segmented controls | 2-5 options, equal weight |\n| [sliders.md](references/sliders.md) | Sliders | Continuous range, min/max labels |\n| [steppers.md](references/steppers.md) | Steppers | Fixed steps, bounded values |\n| [pickers.md](references/pickers.md) | Pickers | Dates, times, long option sets |\n| [combo-boxes.md](references/combo-boxes.md) | Combo boxes | macOS, type or select, custom values |\n| [text-fields.md](references/text-fields.md) | Text fields | Short input, keyboard types, validation |\n| [text-views.md](references/text-views.md) | Text views | Multi-line, comments, descriptions |\n| [labels.md](references/labels.md) | Labels | Placement, VoiceOver support |\n| [token-fields.md](references/token-fields.md) | Token fields | macOS, chips, tags, recipients |\n| [virtual-keyboards.md](references/virtual-keyboards.md) | Virtual keyboards | Email, URL, number keyboard types |\n| [rating-indicators.md](references/rating-indicators.md) | Rating indicators | Star ratings, display-only |\n| [gauges.md](references/gauges.md) | Gauges | Level indicators, range display |\n\n## Output Format\n\n1. **Control recommendation with rationale** and why alternatives are less suitable.\n2. **State management** -- how the control communicates current state and whether changes apply immediately or on confirmation.\n3. **Validation approach** -- when to show errors and how to communicate rules.\n4. **Accessibility** -- labels, traits, hints for VoiceOver.\n\n## Questions to Ask\n\n1. What type of data? (Boolean, choice from fixed set, numeric, free-form text?)\n2. How many options?\n3. Which platforms? (Combo boxes and token fields are macOS-only)\n4. Settings screen or inline form?\n\n## Related Skills\n\n- **hig-components-menus** -- Buttons and pop-up buttons complementing selection controls\n- **hig-components-dialogs** -- Sheets and popovers containing forms\n- **hig-components-search** -- Search fields sharing text input patterns\n- **hig-inputs** -- Keyboard, pointer, gesture interactions with controls\n- **hig-foundations** -- Typography, color, layout for control styling\n\n---\n\n*Built by [Raintree Technology](https://raintree.technology) · [More developer tools](https://raintree.technology)*","tags":["hig","components","controls","doctor","raintree-technology","accessibility","agent-skills","ai-agents","apple","apple-design","audit","claude-code"],"capabilities":["skill","source-raintree-technology","skill-hig-components-controls","topic-accessibility","topic-agent-skills","topic-ai-agents","topic-apple","topic-apple-design","topic-audit","topic-claude-code","topic-cursor","topic-hig","topic-ios","topic-macos","topic-skills"],"categories":["hig-doctor"],"synonyms":[],"warnings":[],"endpointUrl":"https://skills.sh/raintree-technology/hig-doctor/hig-components-controls","protocol":"skill","transport":"skills-sh","auth":{"type":"none","details":{"cli":"npx skills add raintree-technology/hig-doctor","source_repo":"https://github.com/raintree-technology/hig-doctor","install_from":"skills.sh"}},"qualityScore":"0.472","qualityRationale":"deterministic score 0.47 from registry signals: · indexed on github topic:agent-skills · 45 github stars · SKILL.md body (4,341 chars)","verified":false,"liveness":"unknown","lastLivenessCheck":null,"agentReviews":{"count":0,"score_avg":null,"cost_usd_avg":null,"success_rate":null,"latency_p50_ms":null,"narrative_summary":null,"summary_updated_at":null},"enrichmentModel":"deterministic:skill-github:v1","enrichmentVersion":1,"enrichedAt":"2026-05-02T00:57:09.158Z","embedding":null,"createdAt":"2026-04-18T22:18:04.552Z","updatedAt":"2026-05-02T00:57:09.158Z","lastSeenAt":"2026-05-02T00:57:09.158Z","tsv":"'-5':111,297 '1':30,392,442 '10':226 '11':244 '2':55,110,296,403,457 '3':79,420,461 '4':103,432,473 '5':118 '6':138 '7':158 '8':179 '9':204 'access':67,433 'activ':48 'adjust':163 'afford':283 'alreadi':26 'altern':399 'alway':36 'appl':5 'appli':415 'approach':422 'ask':15,22,441 'assist':77 'binari':82 'boolean':447 'bound':178,313 'box':206,326,465 'break':76 'built':61,531 'built-in':60 'button':485,490 'chang':92,99,414 'check':11 'chip':362 'choic':448 'choos':216 'claude/apple-design-context.md':13 'clear':31 'collect':240 'color':526 'combo':205,325,464 'combo-boxes.md':323 'comment':349 'commit':100 'communic':409,430 'complement':491 'compon':3,483,496,505 'configur':194 'confirm':102,419 'consist':65 'contain':501 'content':277 'context':19 'continu':121,304 'control':4,10,45,59,63,69,105,150,281,285,295,393,408,493,521,529 'controls.md':278 'cover':27 'critic':129 'current':32,53,169,410 'curv':73 'custom':68,222,331 'data':157,446 'date':154,318 'descript':350 'develop':537 'dialog':497 'discret':229,242 'display':51,168,249,265,381,389 'display-on':264,380 'effect':94,291 'email':201,236,369 'endpoint':137 'equal':114,299 'error':426 'exclus':108 'exist':18 'expect':199 'featur':78 'field':181,228,336,360,468,508 'fix':166,311,450 'form':98,455,478,502 'format':391 'foundat':524 'free':454 'free-form':453 'gaug':245,251,385 'gauges.md':383 'general':280 'gestur':518 'hig':2,6,482,495,504,514,523 'hig-components-control':1 'hig-components-dialog':494 'hig-components-menus':481 'hig-components-search':503 'hig-found':522 'hig-input':513 'highlight':46 'hint':436 'icon':134 'immedi':95,290,416 'import':115 'increment/decrement':164 'index':273 'indic':248,259,377,387 'inform':24 'inlin':477 'input':9,126,187,200,208,271,338,511,515 'interact':268,519 'introduc':70 'item':112,243 'key':28,276 'keyboard':195,339,368,372,516 'label':117,132,307,353,434 'labels.md':351 'layout':527 'learn':72 'less':401 'level':386 'line':186,193,348 'list':143,210,220 'long':141,320 'maco':211,234,327,361,471 'macos-on':470 'manag':405 'mani':145,459 'match':198 'may':75 'menus':484 'min/max':131,177,306 'modal':97 'multi':192,347 'multi-lin':191,346 'must':35 'mutual':107 'next':171 'number':203,371 'numer':125,452 'often':262 'on/off':43,289 'option':109,142,146,298,321,460 'output':390 'pattern':512 'picker':50,139,317 'pickers.md':315 'placement':354 'platform':463 'pointer':517 'pop':488 'pop-up':487 'popov':500 'precis':124,162 'predefin':219 'prefer':56 'principl':29 'provid':64,130 'question':16,439 'raintre':533 'raintree.technology':535,539 'rang':136,257,305,388 'rate':247,258,261,376,379 'rating-indicators.md':374 'rational':396 'reason':176 'recipi':237,364 'recommend':394 'refer':272,274 'references/combo-boxes.md':324 'references/controls.md':279 'references/gauges.md':384 'references/labels.md':352 'references/pickers.md':316 'references/rating-indicators.md':375 'references/segmented-controls.md':293 'references/sliders.md':302 'references/steppers.md':309 'references/text-fields.md':334 'references/text-views.md':343 'references/toggles.md':287 'references/token-fields.md':358 'references/virtual-keyboards.md':366 'relat':479 'rough':113 'rule':431 'screen':91,475 'search':506,507 'see':37 'segment':44,49,104,149,294 'segmented-controls.md':292 'select':7,40,54,209,330,492 'set':89,322,451,474 'settings-styl':88 'share':509 'sheet':498 'short':116,183,337 'show':42,252,260,425 'singl':185 'single-lin':184 'skill':480 'skill-hig-components-controls' 'slider':119,303 'sliders.md':301 'small':161 'source-raintree-technology' 'standard':57 'star':263,378 'state':33,83,282,404,411 'step':167,312 'stepper':159,174,310 'steppers.md':308 'structur':156 'style':90,530 'suitabl':402 'support':356 'system':58,284 'tag':238,363 'take':93 'technolog':534 'text':180,188,207,335,344,456,510 'text-fields.md':333 'text-views.md':342 'time':155,319 'toggl':41,80,288 'toggles.md':286 'token':227,233,359,467 'token-fields.md':357 'tool':538 'topic':275 'topic-accessibility' 'topic-agent-skills' 'topic-ai-agents' 'topic-apple' 'topic-apple-design' 'topic-audit' 'topic-claude-code' 'topic-cursor' 'topic-hig' 'topic-ios' 'topic-macos' 'topic-skills' 'trait':435 'type':196,212,328,340,373,444 'typographi':525 'url':202,370 'use':17,267 'user':34 'valid':225,341,421 'valu':122,170,214,223,230,250,254,314,332 'variant':269 'view':189,345 'virtual':367 'virtual-keyboards.md':365 'visual':232 'voiceov':355,438 'weight':300 'well':152 'whether':413 'within':255 'work':151","prices":[{"id":"2fd49ba5-7454-4d09-b72a-1a526f61acb9","listingId":"70bda8f5-5e2f-45cc-8b29-6a03049cdfb2","amountUsd":"0","unit":"free","nativeCurrency":null,"nativeAmount":null,"chain":null,"payTo":null,"paymentMethod":"skill-free","isPrimary":true,"details":{"org":"raintree-technology","category":"hig-doctor","install_from":"skills.sh"},"createdAt":"2026-04-18T22:18:04.552Z"}],"sources":[{"listingId":"70bda8f5-5e2f-45cc-8b29-6a03049cdfb2","source":"github","sourceId":"raintree-technology/hig-doctor/hig-components-controls","sourceUrl":"https://github.com/raintree-technology/hig-doctor/tree/main/skills/hig-components-controls","isPrimary":false,"firstSeenAt":"2026-04-18T22:18:04.552Z","lastSeenAt":"2026-05-02T00:57:09.158Z"}],"details":{"listingId":"70bda8f5-5e2f-45cc-8b29-6a03049cdfb2","quickStartSnippet":null,"exampleRequest":null,"exampleResponse":null,"schema":null,"openapiUrl":null,"agentsTxtUrl":null,"citations":[],"useCases":[],"bestFor":[],"notFor":[],"kindDetails":{"org":"raintree-technology","slug":"hig-components-controls","github":{"repo":"raintree-technology/hig-doctor","stars":45,"topics":["accessibility","agent-skills","ai-agents","apple","apple-design","audit","claude-code","cursor","hig","human-interface-guidelines","ios","macos","skills","swiftui","tvos","uikit","visionos","watchos"],"license":"other","html_url":"https://github.com/raintree-technology/hig-doctor","pushed_at":"2026-04-28T22:36:54Z","description":"Apple HIG audit CLI + 14 agent skills for AI coding assistants — score any project for HIG compliance across 12 frameworks","skill_md_sha":"2f694859399f958545b53f1a75726eeb280c5cac","skill_md_path":"skills/hig-components-controls/SKILL.md","default_branch":"main","skill_tree_url":"https://github.com/raintree-technology/hig-doctor/tree/main/skills/hig-components-controls"},"layout":"multi","source":"github","category":"hig-doctor","frontmatter":{"name":"hig-components-controls","description":">-"},"skills_sh_url":"https://skills.sh/raintree-technology/hig-doctor/hig-components-controls"},"updatedAt":"2026-05-02T00:57:09.158Z"}}