{
  "slug": "segmented-control",
  "schemaVersion": 2,
  "sourceKind": "structured-spec",
  "confidence": "medium",
  "semanticTypeCandidates": ["segmented-control", "segmented-button", "tab-picker"],
  "variantDimensions": [
    { "axis": "size", "values": ["sm", "md"] },
    { "axis": "state", "values": ["default", "selected", "disabled"] },
    { "axis": "count", "values": ["2", "3", "4"] }
  ],
  "representativeVariants": [
    "md-3-default",
    "md-3-selected",
    "md-3-disabled"
  ],
  "anatomy": {
    "parts": ["container", "segment", "label", "selected-indicator"],
    "required": ["container", "segment", "label"]
  },
  "structurePatterns": [
    "Container = panel background (#F3F3F3), radius md (8px)",
    "Selected segment = flat gray (tier3 line) with ink text and weight 500, no shadow — NOT blue fill",
    "Selected text = ink-primary, unselected = ink-secondary",
    "Segments separated by 2px gap (no visible divider lines)",
    "Height = 32px (--layout-btn-height) for md, 28px for sm",
    "Each segment has 12px horizontal padding"
  ],
  "usageHints": [
    "Use for mutually exclusive view modes (list/grid, day/week/month)",
    "Best for 2-4 segments — more should use dropdown menu",
    "选中段是扁平灰（tier3-line）加墨色字，不是白色浮起的卡片，也不是蓝色"
  ],
  "doNotInvent": [
    "Blue selected segment or a floating white chip with shadow — selected = flat gray, no shadow",
    "Divider lines between segments — use gap instead",
    "Square corners on container — use md radius"
  ],
  "unknowns": ["Icon+label combo segments", "Segmented control overflow behavior"]
}
