{
  "name": "Label",
  "type": "component",
  "description": "Form-control label, rendered through Typography.",
  "export": "@gtmi/strix-react/atoms/label",
  "path": "@gtmi/strix-react/atoms/label",
  "figma": {
    "file": "zT3vGm4QlFEI2Jp9nxyFKI",
    "fileName": "Demo components library",
    "nodes": [
      {
        "node": "22:3960",
        "name": ".label",
        "section": "Atoms"
      }
    ],
    "note": "Composes Label + Tooltip. `.label` at footnote=true is the ONLY node in the file that draws a tooltip SURFACE; every other tooltip draws just the trigger."
  },
  "props": [
    {
      "name": "htmlFor",
      "type": "string",
      "description": "Associates the label with a control by that control's id."
    },
    {
      "name": "isSelector",
      "type": "boolean",
      "default": "false",
      "description": "Selector mode: adds cursor-pointer and peer-driven checked/disabled styling. The sibling control must carry the `peer` class."
    },
    {
      "name": "typographyVariant",
      "type": "TypographyVariantsType",
      "default": "body-s in selector mode, body-m-semibold otherwise",
      "description": "Override the typography role."
    },
    {
      "name": "className",
      "type": "string",
      "description": "Merged through cn()."
    }
  ],
  "ai_tags": ["label", "form", "field", "primitive"],
  "since": "0.2.0",
  "tokens_used": ["--color-text-primary", "--color-text-disabled", "--font-weight-body-small-medium"],
  "notes": "Renders through Typography rather than styling text itself, so a label cannot drift from the type scale. The default role differs by mode deliberately: a standalone field label is a call to action, a selector label is body text beside a control. Adds ref forwarding, which upstream did not have. Figma alignment (scripts/figma/bindings/label.json): the  atom is a composition, not a capability -- a label with an adjacent info-icon tooltip trigger -- so it is documented by the WithTooltipTrigger stories rather than by a  prop. Folding Tooltip into Label would pull a portal and its theme stamping into a primitive that renders one element. ONE thing is not adopted: Figma darkens the trigger icon on open (gray-300 -> gray-400, 7.43:1 falling to 5.33:1), which is a state change that reduces contrast. Reading this atom also found a defect in Tooltip, now FIXED: its bubble was the same literal as the page it floats over (1.00:1 after Finding 0 re-pointed the page), separated by shadow alone. It is now Figma's inverted white bubble at 19.37:1. Figma alignment (scripts/figma/bindings/label.json): the `.label` atom is a composition, not a capability -- a label with an adjacent info-icon tooltip trigger -- so it is documented by the WithTooltipTrigger stories rather than by a `tooltip` prop. Folding Tooltip into Label would pull a portal and its theme stamping into a primitive that renders one element. ONE thing is not adopted: Figma darkens the trigger icon on open (gray-300 to gray-400, 7.43:1 falling to 5.33:1), a state change that reduces contrast. Reading this atom also found a defect in Tooltip, now FIXED: its bubble was the same literal as the page it floats over (1.00:1 after Finding 0 re-pointed the page), separated by shadow alone. It is now Figma's inverted white bubble at 19.37:1.\n\nPORTED FROM FIGMA .label (22:3960). The type ramp IS Figma's now: Paragraph/medium-semibold, 16/24 at Semibold (CSS 600), via the existing `body-m-semibold` role. The deferral that blocked this read \"Label routes its type through a shared Typography role, so adopting it would restyle everything using cta-regular-s on the evidence of one atom\" -- and nothing else uses cta-regular-s. It appears in Typography's own table and in Label's default, in no other component, so there was nothing shared to break; and no new role was needed, because body-m-semibold is already exactly 16/24 at 600. CHECK WHO READS A ROLE before deferring on the grounds that it is shared.\n\nNever map a Figma fontWeight number: Dev Mode reports 375 for this style, which is Whitney SSm's embedded value for Semibold and not a CSS weight. This binding once read 375 as \"Medium\" for exactly that reason, while .section-title-label reported the same 375 and named Semibold correctly.\n\nThe stories' tooltip trigger now inks --color-icon-field-info (gray-300, 7.43:1 on the page), which is what the atom binds; they were rendering --color-icon-secondary #c5d0e3. Still not adopted: Figma DARKENS the trigger on open, gray-300 -> gray-400, dropping 7.43:1 to 5.33:1. Both clear 3:1 so it is not a conformance failure, but Strix's trigger has no open state at all, so there is nothing to substitute either."
}