{"component":{"aria":"Badge is decorative status; the surrounding context provides meaning. If the badge IS the only signal of state, wrap with a screen-reader-friendly element: <span class='sr-only'>Status: </span><span class='ps-badge'>active</span>.","category":"components","css":".ps-badge{display:inline-flex;align-items:center;padding:0 var(--ps-space-3,8px);min-height:1.25rem;border-radius:var(--ps-corner-1,2px);font-size:.75rem;font-weight:600;line-height:1.34;letter-spacing:.16px}.ps-badge--neutral{background-color:var(--ps-surface-subtle,#f5f6f8);color:var(--ps-ink-secondary,#4a4f59)}.ps-badge--primary{background-color:var(--ps-support-info-bg,#eef3ff);color:var(--ps-support-info,#234ed8)}.ps-badge--positive{background-color:var(--ps-support-positive-bg,#e8f6ed);color:var(--ps-support-positive,#16602b)}.ps-badge--caution{background-color:var(--ps-support-caution-bg,#fff5e1);color:var(--ps-support-caution,#7a520a)}.ps-badge--critical{background-color:var(--ps-support-critical-bg,#fceaea);color:var(--ps-support-critical,#7d1414)}","description":"A small, inline status indicator. Carries a short label and a tone.","display_name":"Badge","html":"<span class=\"ps-badge ps-badge--{{variant}}\">{{label}}</span>","name":"badge","registry_type":"component","research_links":[],"tabs_available":["accessibility","code","style","usage"],"variants":[{"css_class":"ps-badge ps-badge--neutral","description":"","html":"","name":"neutral","tokens":[]},{"css_class":"ps-badge ps-badge--primary","description":"","html":"","name":"primary","tokens":[]},{"css_class":"ps-badge ps-badge--positive","description":"","html":"","name":"positive","tokens":[]},{"css_class":"ps-badge ps-badge--caution","description":"","html":"","name":"caution","tokens":[]},{"css_class":"ps-badge ps-badge--critical","description":"","html":"","name":"critical","tokens":[]}],"wcag":{"target":"2.2 AAA"}},"tenant":"pointsav","theme":"pointsav-brand"}