{ "generatedAt": "2026-04-24T06:02:51.971Z", "generatorMode": "manifest-driven-sample-contract", "purpose": "This file is the transitional Button sample contract used to repair the Figma-conformance generation chain before runtime component generation resumes.", "source": { "canonicalSpecs": "figma-data/normalized/canonical-components.json", "manifest": "figma-data/normalized/components.manifest.json", "sourceLayer": "components-tokenized" }, "button": { "codeComponent": "Button", "generationPriority": 1, "canonicalStatus": "needs-review", "memberCount": 8, "totalVariants": 3200, "averageTokenCoverage": 100, "mergedVariantAxes": [ { "figmaAxis": "color", "propName": "color", "values": [ "gray 1", "green", "orange", "red" ], "sources": [ "Button/dark L", "Button/dark M", "Button/dark S", "Button/dark XS", "Button/light L", "Button/light M", "Button/light S", "Button/light XS" ] }, { "figmaAxis": "fixed width", "propName": "fixedWidth", "values": [ "no", "yes" ], "sources": [ "Button/dark L", "Button/dark M", "Button/dark S", "Button/dark XS", "Button/light L", "Button/light M", "Button/light S", "Button/light XS" ] }, { "figmaAxis": "icon", "propName": "icon", "values": [ "left", "light", "loading", "loading button", "no", "right" ], "sources": [ "Button/dark L", "Button/dark M", "Button/dark S", "Button/dark XS", "Button/light L", "Button/light M", "Button/light S", "Button/light XS" ] }, { "figmaAxis": "radius", "propName": "radius", "values": [ "round", "square" ], "sources": [ "Button/dark L", "Button/dark M", "Button/dark S", "Button/dark XS", "Button/light L", "Button/light M", "Button/light S", "Button/light XS" ] }, { "figmaAxis": "derived size", "propName": "size", "values": [ "L", "M", "S", "XS" ], "sources": [ "Button/dark L", "Button/dark M", "Button/dark S", "Button/dark XS", "Button/light L", "Button/light M", "Button/light S", "Button/light XS" ] }, { "figmaAxis": "status", "propName": "status", "values": [ "default", "disable", "hover", "loading" ], "sources": [ "Button/dark L", "Button/dark M", "Button/dark S", "Button/dark XS", "Button/light L", "Button/light M", "Button/light S", "Button/light XS" ] }, { "figmaAxis": "style", "propName": "style", "values": [ "filling", "ghost", "rimless" ], "sources": [ "Button/dark L", "Button/dark M", "Button/dark S", "Button/dark XS", "Button/light L", "Button/light M", "Button/light S", "Button/light XS" ] } ], "blockingFindings": [ { "code": "mixed-theme-members", "severity": "warning", "detail": "Button canonical spec currently merges light and dark member families before a stable canonical theme strategy exists." } ], "resolvedContract": { "includedMembers": [ "Button/dark L", "Button/dark M", "Button/dark S", "Button/dark XS", "Button/light L", "Button/light M", "Button/light S", "Button/light XS" ], "excludedMembers": [ { "figmaName": "Button/url link", "nodeId": "438:7995", "reason": "separate-link-family", "detail": "URL link introduces a distinct interaction family and darkTheme axis; it should not stay inside the main Button canonical contract." } ], "normalizedAxes": [ { "figmaAxis": "color", "propName": "color", "values": [ "gray 1", "green", "orange", "red" ], "sources": [ "Button/dark L", "Button/dark M", "Button/dark S", "Button/dark XS", "Button/light L", "Button/light M", "Button/light S", "Button/light XS" ] }, { "figmaAxis": "fixed width", "propName": "fixedWidth", "values": [ "no", "yes" ], "sources": [ "Button/dark L", "Button/dark M", "Button/dark S", "Button/dark XS", "Button/light L", "Button/light M", "Button/light S", "Button/light XS" ] }, { "figmaAxis": "icon", "propName": "icon", "values": [ "left", "light", "loading", "loading button", "no", "right" ], "sources": [ "Button/dark L", "Button/dark M", "Button/dark S", "Button/dark XS", "Button/light L", "Button/light M", "Button/light S", "Button/light XS" ] }, { "figmaAxis": "radius", "propName": "radius", "values": [ "round", "square" ], "sources": [ "Button/dark L", "Button/dark M", "Button/dark S", "Button/dark XS", "Button/light L", "Button/light M", "Button/light S", "Button/light XS" ] }, { "figmaAxis": "derived size", "propName": "size", "values": [ "L", "M", "S", "XS" ], "sources": [ "Button/dark L", "Button/dark M", "Button/dark S", "Button/dark XS", "Button/light L", "Button/light M", "Button/light S", "Button/light XS" ] }, { "figmaAxis": "status", "propName": "status", "values": [ "default", "disable", "hover", "loading" ], "sources": [ "Button/dark L", "Button/dark M", "Button/dark S", "Button/dark XS", "Button/light L", "Button/light M", "Button/light S", "Button/light XS" ] }, { "figmaAxis": "style", "propName": "style", "values": [ "filling", "ghost", "rimless" ], "sources": [ "Button/dark L", "Button/dark M", "Button/dark S", "Button/dark XS", "Button/light L", "Button/light M", "Button/light S", "Button/light XS" ] } ], "themeFamilies": [ "dark", "light" ] }, "members": [ { "figmaName": "Button/dark L", "pageName": "— — Buttons", "nodeId": "1545:51854", "filename": "button_dark_l__1545_51854.json", "tokenCoverage": { "totalRefs": 799, "resolvedRefs": 799, "unresolvedRefs": 0, "resolvedPercent": 100, "unresolvedVariableIds": [], "unresolvedSamples": [] }, "manifestPresent": true, "manifestCodeName": "ButtonDarkL", "manifestVariantAxes": [ { "figmaAxis": "icon", "propName": "icon", "values": [ "no", "right", "left", "loading" ] }, { "figmaAxis": "style", "propName": "style", "values": [ "filling", "ghost", "rimless" ] }, { "figmaAxis": "color", "propName": "color", "values": [ "green", "red", "orange", "gray 1" ] }, { "figmaAxis": "status", "propName": "status", "values": [ "hover", "disable", "default", "loading" ] }, { "figmaAxis": "radius", "propName": "radius", "values": [ "square", "round" ] }, { "figmaAxis": "fixed width", "propName": "fixedWidth", "values": [ "yes", "no" ] } ], "sampleVariants": [ { "nodeId": "314:47402", "figmaVariantName": "icon=no, style=filling, color=green, status=hover, radius=square, fixed width=yes", "props": { "icon": "no", "style": "filling", "color": "green", "status": "hover", "radius": "square", "fixedWidth": "yes" } }, { "nodeId": "314:47367", "figmaVariantName": "icon=no, style=filling, color=green, status=disable, radius=square, fixed width=yes", "props": { "icon": "no", "style": "filling", "color": "green", "status": "disable", "radius": "square", "fixedWidth": "yes" } }, { "nodeId": "314:47337", "figmaVariantName": "icon=no, style=filling, color=red, status=default, radius=square, fixed width=yes", "props": { "icon": "no", "style": "filling", "color": "red", "status": "default", "radius": "square", "fixedWidth": "yes" } } ] }, { "figmaName": "Button/dark M", "pageName": "— — Buttons", "nodeId": "1545:51964", "filename": "button_dark_m__1545_51964.json", "tokenCoverage": { "totalRefs": 792, "resolvedRefs": 792, "unresolvedRefs": 0, "resolvedPercent": 100, "unresolvedVariableIds": [], "unresolvedSamples": [] }, "manifestPresent": true, "manifestCodeName": "ButtonDarkM", "manifestVariantAxes": [ { "figmaAxis": "icon", "propName": "icon", "values": [ "left", "no", "right", "loading" ] }, { "figmaAxis": "style", "propName": "style", "values": [ "filling", "ghost", "rimless" ] }, { "figmaAxis": "color", "propName": "color", "values": [ "green", "red", "orange", "gray 1" ] }, { "figmaAxis": "status", "propName": "status", "values": [ "default", "hover", "disable", "loading" ] }, { "figmaAxis": "radius", "propName": "radius", "values": [ "square", "round" ] }, { "figmaAxis": "fixed width", "propName": "fixedWidth", "values": [ "yes", "no" ] } ], "sampleVariants": [ { "nodeId": "1421:27616", "figmaVariantName": "icon=left, style=filling, color=green, status=default, radius=square, fixed width=yes", "props": { "icon": "left", "style": "filling", "color": "green", "status": "default", "radius": "square", "fixedWidth": "yes" } }, { "nodeId": "1421:27622", "figmaVariantName": "icon=left, style=filling, color=green, status=hover, radius=square, fixed width=yes", "props": { "icon": "left", "style": "filling", "color": "green", "status": "hover", "radius": "square", "fixedWidth": "yes" } }, { "nodeId": "1421:27628", "figmaVariantName": "icon=left, style=filling, color=green, status=disable, radius=square, fixed width=yes", "props": { "icon": "left", "style": "filling", "color": "green", "status": "disable", "radius": "square", "fixedWidth": "yes" } } ] }, { "figmaName": "Button/dark S", "pageName": "— — Buttons", "nodeId": "1545:57246", "filename": "button_dark_s__1545_57246.json", "tokenCoverage": { "totalRefs": 804, "resolvedRefs": 804, "unresolvedRefs": 0, "resolvedPercent": 100, "unresolvedVariableIds": [], "unresolvedSamples": [] }, "manifestPresent": true, "manifestCodeName": "ButtonDarkS", "manifestVariantAxes": [ { "figmaAxis": "icon", "propName": "icon", "values": [ "left", "no", "right", "loading" ] }, { "figmaAxis": "style", "propName": "style", "values": [ "filling", "ghost", "rimless" ] }, { "figmaAxis": "color", "propName": "color", "values": [ "green", "red", "orange", "gray 1" ] }, { "figmaAxis": "status", "propName": "status", "values": [ "default", "hover", "disable", "loading" ] }, { "figmaAxis": "radius", "propName": "radius", "values": [ "square", "round" ] }, { "figmaAxis": "fixed width", "propName": "fixedWidth", "values": [ "yes", "no" ] } ], "sampleVariants": [ { "nodeId": "1421:27892", "figmaVariantName": "icon=left, style=filling, color=green, status=default, radius=square, fixed width=yes", "props": { "icon": "left", "style": "filling", "color": "green", "status": "default", "radius": "square", "fixedWidth": "yes" } }, { "nodeId": "1421:27898", "figmaVariantName": "icon=left, style=filling, color=green, status=hover, radius=square, fixed width=yes", "props": { "icon": "left", "style": "filling", "color": "green", "status": "hover", "radius": "square", "fixedWidth": "yes" } }, { "nodeId": "1421:27904", "figmaVariantName": "icon=left, style=filling, color=green, status=disable, radius=square, fixed width=yes", "props": { "icon": "left", "style": "filling", "color": "green", "status": "disable", "radius": "square", "fixedWidth": "yes" } } ] }, { "figmaName": "Button/dark XS", "pageName": "— — Buttons", "nodeId": "1545:57247", "filename": "button_dark_xs__1545_57247.json", "tokenCoverage": { "totalRefs": 796, "resolvedRefs": 796, "unresolvedRefs": 0, "resolvedPercent": 100, "unresolvedVariableIds": [], "unresolvedSamples": [] }, "manifestPresent": true, "manifestCodeName": "ButtonDarkXs", "manifestVariantAxes": [ { "figmaAxis": "icon", "propName": "icon", "values": [ "no", "left", "right", "loading" ] }, { "figmaAxis": "style", "propName": "style", "values": [ "filling", "ghost", "rimless" ] }, { "figmaAxis": "color", "propName": "color", "values": [ "green", "red", "orange", "gray 1" ] }, { "figmaAxis": "status", "propName": "status", "values": [ "default", "hover", "disable", "loading" ] }, { "figmaAxis": "radius", "propName": "radius", "values": [ "square", "round" ] }, { "figmaAxis": "fixed width", "propName": "fixedWidth", "values": [ "yes", "no" ] } ], "sampleVariants": [ { "nodeId": "314:47685", "figmaVariantName": "icon=no, style=filling, color=green, status=default, radius=square, fixed width=yes", "props": { "icon": "no", "style": "filling", "color": "green", "status": "default", "radius": "square", "fixedWidth": "yes" } }, { "nodeId": "314:47755", "figmaVariantName": "icon=no, style=filling, color=green, status=hover, radius=square, fixed width=yes", "props": { "icon": "no", "style": "filling", "color": "green", "status": "hover", "radius": "square", "fixedWidth": "yes" } }, { "nodeId": "314:47718", "figmaVariantName": "icon=no, style=filling, color=green, status=disable, radius=square, fixed width=yes", "props": { "icon": "no", "style": "filling", "color": "green", "status": "disable", "radius": "square", "fixedWidth": "yes" } } ] }, { "figmaName": "Button/light L", "pageName": "— — Buttons", "nodeId": "1545:47446", "filename": "button_light_l__1545_47446.json", "tokenCoverage": { "totalRefs": 792, "resolvedRefs": 792, "unresolvedRefs": 0, "resolvedPercent": 100, "unresolvedVariableIds": [], "unresolvedSamples": [] }, "manifestPresent": true, "manifestCodeName": "ButtonLightL", "manifestVariantAxes": [ { "figmaAxis": "icon", "propName": "icon", "values": [ "no", "right", "left", "loading button", "light" ] }, { "figmaAxis": "style", "propName": "style", "values": [ "filling", "ghost", "rimless" ] }, { "figmaAxis": "color", "propName": "color", "values": [ "green", "red", "orange", "gray 1" ] }, { "figmaAxis": "status", "propName": "status", "values": [ "default", "disable", "hover", "loading" ] }, { "figmaAxis": "Radius", "propName": "radius", "values": [ "square", "round" ] }, { "figmaAxis": "fixed width", "propName": "fixedWidth", "values": [ "yes", "no" ] } ], "sampleVariants": [ { "nodeId": "314:46720", "figmaVariantName": "icon=no, style=filling, color=green, status=default, Radius=square, fixed width=yes", "props": { "icon": "no", "style": "filling", "color": "green", "status": "default", "radius": "square", "fixedWidth": "yes" } }, { "nodeId": "314:46729", "figmaVariantName": "icon=no, style=filling, color=green, status=default, Radius=square, fixed width=no", "props": { "icon": "no", "style": "filling", "color": "green", "status": "default", "radius": "square", "fixedWidth": "no" } }, { "nodeId": "314:46779", "figmaVariantName": "icon=no, style=filling, color=green, status=disable, Radius=square, fixed width=yes", "props": { "icon": "no", "style": "filling", "color": "green", "status": "disable", "radius": "square", "fixedWidth": "yes" } } ] }, { "figmaName": "Button/light M", "pageName": "— — Buttons", "nodeId": "1545:47447", "filename": "button_light_m__1545_47447.json", "tokenCoverage": { "totalRefs": 810, "resolvedRefs": 810, "unresolvedRefs": 0, "resolvedPercent": 100, "unresolvedVariableIds": [], "unresolvedSamples": [] }, "manifestPresent": true, "manifestCodeName": "ButtonLightM", "manifestVariantAxes": [ { "figmaAxis": "icon", "propName": "icon", "values": [ "no", "right", "left", "loading" ] }, { "figmaAxis": "style", "propName": "style", "values": [ "filling", "ghost", "rimeless" ] }, { "figmaAxis": "color", "propName": "color", "values": [ "green", "red", "orange", "gray 1" ] }, { "figmaAxis": "status", "propName": "status", "values": [ "default", "disable", "hover", "loading" ] }, { "figmaAxis": "Radius", "propName": "radius", "values": [ "square", "round" ] }, { "figmaAxis": "fixed width", "propName": "fixedWidth", "values": [ "no", "yes" ] } ], "sampleVariants": [ { "nodeId": "314:46878", "figmaVariantName": "icon=no, style=filling, color=green, status=default, Radius=square, fixed width=no", "props": { "icon": "no", "style": "filling", "color": "green", "status": "default", "radius": "square", "fixedWidth": "no" } }, { "nodeId": "314:46924", "figmaVariantName": "icon=no, style=filling, color=green, status=disable, Radius=square, fixed width=no", "props": { "icon": "no", "style": "filling", "color": "green", "status": "disable", "radius": "square", "fixedWidth": "no" } }, { "nodeId": "314:46979", "figmaVariantName": "icon=no, style=filling, color=green, status=hover, Radius=square, fixed width=no", "props": { "icon": "no", "style": "filling", "color": "green", "status": "hover", "radius": "square", "fixedWidth": "no" } } ] }, { "figmaName": "Button/light S", "pageName": "— — Buttons", "nodeId": "1545:51851", "filename": "button_light_s__1545_51851.json", "tokenCoverage": { "totalRefs": 792, "resolvedRefs": 792, "unresolvedRefs": 0, "resolvedPercent": 100, "unresolvedVariableIds": [], "unresolvedSamples": [] }, "manifestPresent": true, "manifestCodeName": "ButtonLightS", "manifestVariantAxes": [ { "figmaAxis": "icon", "propName": "icon", "values": [ "no", "right", "left", "loading" ] }, { "figmaAxis": "style", "propName": "style", "values": [ "filling", "ghost", "rimeless" ] }, { "figmaAxis": "color", "propName": "color", "values": [ "green", "orange", "red", "gray 1" ] }, { "figmaAxis": "status", "propName": "status", "values": [ "default", "disable", "hover", "loading" ] }, { "figmaAxis": "radius", "propName": "radius", "values": [ "square", "round" ] }, { "figmaAxis": "fixed width", "propName": "fixedWidth", "values": [ "yes", "no" ] } ], "sampleVariants": [ { "nodeId": "314:47024", "figmaVariantName": "icon=no, style=filling, color=green, status=default, radius=square, fixed width=yes", "props": { "icon": "no", "style": "filling", "color": "green", "status": "default", "radius": "square", "fixedWidth": "yes" } }, { "nodeId": "314:47029", "figmaVariantName": "icon=no, style=filling, color=green, status=default, radius=square, fixed width=no", "props": { "icon": "no", "style": "filling", "color": "green", "status": "default", "radius": "square", "fixedWidth": "no" } }, { "nodeId": "314:47044", "figmaVariantName": "icon=no, style=filling, color=orange, status=default, radius=square, fixed width=yes", "props": { "icon": "no", "style": "filling", "color": "orange", "status": "default", "radius": "square", "fixedWidth": "yes" } } ] }, { "figmaName": "Button/light XS", "pageName": "— — Buttons", "nodeId": "1545:51852", "filename": "button_light_xs__1545_51852.json", "tokenCoverage": { "totalRefs": 792, "resolvedRefs": 792, "unresolvedRefs": 0, "resolvedPercent": 100, "unresolvedVariableIds": [], "unresolvedSamples": [] }, "manifestPresent": true, "manifestCodeName": "ButtonLightXs", "manifestVariantAxes": [ { "figmaAxis": "icon", "propName": "icon", "values": [ "no", "right", "left", "loading" ] }, { "figmaAxis": "style", "propName": "style", "values": [ "filling", "ghost", "rimeless" ] }, { "figmaAxis": "color", "propName": "color", "values": [ "green", "orange", "red", "gray 1" ] }, { "figmaAxis": "status", "propName": "status", "values": [ "default", "disable", "hover", "loading" ] }, { "figmaAxis": "radius", "propName": "radius", "values": [ "square", "round" ] }, { "figmaAxis": "fixed width", "propName": "fixedWidth", "values": [ "yes", "no" ] } ], "sampleVariants": [ { "nodeId": "314:47174", "figmaVariantName": "icon=no, style=filling, color=green, status=default, radius=square, fixed width=yes", "props": { "icon": "no", "style": "filling", "color": "green", "status": "default", "radius": "square", "fixedWidth": "yes" } }, { "nodeId": "314:47179", "figmaVariantName": "icon=no, style=filling, color=green, status=default, radius=square, fixed width=no", "props": { "icon": "no", "style": "filling", "color": "green", "status": "default", "radius": "square", "fixedWidth": "no" } }, { "nodeId": "314:47294", "figmaVariantName": "icon=no, style=filling, color=orange, status=default, radius=square, fixed width=yes", "props": { "icon": "no", "style": "filling", "color": "orange", "status": "default", "radius": "square", "fixedWidth": "yes" } } ] } ] } }