{ "generatedAt": "2026-05-08T04:02:56.900Z", "source": { "candidates": "figma-data/normalized/design-system-candidates.json", "manifest": "figma-data/normalized/components.manifest.json", "sourceLayer": "components-tokenized" }, "summary": { "canonicalComponents": 21, "ready": 20, "needsReview": 1 }, "specs": [ { "codeComponent": "Button", "generationPriority": 1, "status": "needs-review", "sourceLayer": "components-tokenized", "memberCount": 8, "rawMemberCount": 9, "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" ] } ], "members": [ { "figmaName": "Button/dark L", "nodeId": "1545:51854", "pageName": "— — Buttons", "filename": "button_dark_l__1545_51854.json", "source": "figma-data/normalized/components-tokenized/button_dark_l__1545_51854.json", "variantCount": 400, "variantAxes": [ { "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" ] } ], "tokenCoverage": { "totalRefs": 799, "resolvedRefs": 799, "unresolvedRefs": 0, "resolvedPercent": 100, "unresolvedVariableIds": [], "unresolvedSamples": [] }, "codeName": "ButtonDarkL", "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" } }, { "nodeId": "314:47411", "figmaVariantName": "icon=no, style=filling, color=red, status=hover, radius=square, fixed width=yes", "props": { "icon": "no", "style": "filling", "color": "red", "status": "hover", "radius": "square", "fixedWidth": "yes" } }, { "nodeId": "314:47374", "figmaVariantName": "icon=no, style=filling, color=red, status=disable, radius=square, fixed width=yes", "props": { "icon": "no", "style": "filling", "color": "red", "status": "disable", "radius": "square", "fixedWidth": "yes" } }, { "nodeId": "314:47348", "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" } }, { "nodeId": "314:47416", "figmaVariantName": "icon=no, style=filling, color=orange, status=hover, radius=square, fixed width=yes", "props": { "icon": "no", "style": "filling", "color": "orange", "status": "hover", "radius": "square", "fixedWidth": "yes" } }, { "nodeId": "314:47383", "figmaVariantName": "icon=no, style=filling, color=orange, status=disable, radius=square, fixed width=yes", "props": { "icon": "no", "style": "filling", "color": "orange", "status": "disable", "radius": "square", "fixedWidth": "yes" } } ] }, { "figmaName": "Button/dark M", "nodeId": "1545:51964", "pageName": "— — Buttons", "filename": "button_dark_m__1545_51964.json", "source": "figma-data/normalized/components-tokenized/button_dark_m__1545_51964.json", "variantCount": 400, "variantAxes": [ { "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" ] } ], "tokenCoverage": { "totalRefs": 792, "resolvedRefs": 792, "unresolvedRefs": 0, "resolvedPercent": 100, "unresolvedVariableIds": [], "unresolvedSamples": [] }, "codeName": "ButtonDarkM", "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" } }, { "nodeId": "1421:27634", "figmaVariantName": "icon=left, style=filling, color=red, status=default, radius=square, fixed width=yes", "props": { "icon": "left", "style": "filling", "color": "red", "status": "default", "radius": "square", "fixedWidth": "yes" } }, { "nodeId": "1421:27640", "figmaVariantName": "icon=left, style=filling, color=red, status=hover, radius=square, fixed width=yes", "props": { "icon": "left", "style": "filling", "color": "red", "status": "hover", "radius": "square", "fixedWidth": "yes" } }, { "nodeId": "1421:27646", "figmaVariantName": "icon=left, style=filling, color=red, status=disable, radius=square, fixed width=yes", "props": { "icon": "left", "style": "filling", "color": "red", "status": "disable", "radius": "square", "fixedWidth": "yes" } }, { "nodeId": "1421:27652", "figmaVariantName": "icon=left, style=filling, color=orange, status=default, radius=square, fixed width=yes", "props": { "icon": "left", "style": "filling", "color": "orange", "status": "default", "radius": "square", "fixedWidth": "yes" } }, { "nodeId": "1421:27658", "figmaVariantName": "icon=left, style=filling, color=orange, status=hover, radius=square, fixed width=yes", "props": { "icon": "left", "style": "filling", "color": "orange", "status": "hover", "radius": "square", "fixedWidth": "yes" } } ] }, { "figmaName": "Button/dark S", "nodeId": "1545:57246", "pageName": "— — Buttons", "filename": "button_dark_s__1545_57246.json", "source": "figma-data/normalized/components-tokenized/button_dark_s__1545_57246.json", "variantCount": 400, "variantAxes": [ { "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" ] } ], "tokenCoverage": { "totalRefs": 804, "resolvedRefs": 804, "unresolvedRefs": 0, "resolvedPercent": 100, "unresolvedVariableIds": [], "unresolvedSamples": [] }, "codeName": "ButtonDarkS", "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" } }, { "nodeId": "1421:27910", "figmaVariantName": "icon=left, style=filling, color=red, status=default, radius=square, fixed width=yes", "props": { "icon": "left", "style": "filling", "color": "red", "status": "default", "radius": "square", "fixedWidth": "yes" } }, { "nodeId": "1421:27916", "figmaVariantName": "icon=left, style=filling, color=red, status=hover, radius=square, fixed width=yes", "props": { "icon": "left", "style": "filling", "color": "red", "status": "hover", "radius": "square", "fixedWidth": "yes" } }, { "nodeId": "1421:27922", "figmaVariantName": "icon=left, style=filling, color=red, status=disable, radius=square, fixed width=yes", "props": { "icon": "left", "style": "filling", "color": "red", "status": "disable", "radius": "square", "fixedWidth": "yes" } }, { "nodeId": "1421:27928", "figmaVariantName": "icon=left, style=filling, color=orange, status=default, radius=square, fixed width=yes", "props": { "icon": "left", "style": "filling", "color": "orange", "status": "default", "radius": "square", "fixedWidth": "yes" } }, { "nodeId": "1421:27934", "figmaVariantName": "icon=left, style=filling, color=orange, status=hover, radius=square, fixed width=yes", "props": { "icon": "left", "style": "filling", "color": "orange", "status": "hover", "radius": "square", "fixedWidth": "yes" } } ] }, { "figmaName": "Button/dark XS", "nodeId": "1545:57247", "pageName": "— — Buttons", "filename": "button_dark_xs__1545_57247.json", "source": "figma-data/normalized/components-tokenized/button_dark_xs__1545_57247.json", "variantCount": 400, "variantAxes": [ { "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" ] } ], "tokenCoverage": { "totalRefs": 796, "resolvedRefs": 796, "unresolvedRefs": 0, "resolvedPercent": 100, "unresolvedVariableIds": [], "unresolvedSamples": [] }, "codeName": "ButtonDarkXs", "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" } }, { "nodeId": "314:47690", "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" } }, { "nodeId": "314:47760", "figmaVariantName": "icon=no, style=filling, color=red, status=hover, radius=square, fixed width=yes", "props": { "icon": "no", "style": "filling", "color": "red", "status": "hover", "radius": "square", "fixedWidth": "yes" } }, { "nodeId": "314:47727", "figmaVariantName": "icon=no, style=filling, color=red, status=disable, radius=square, fixed width=yes", "props": { "icon": "no", "style": "filling", "color": "red", "status": "disable", "radius": "square", "fixedWidth": "yes" } }, { "nodeId": "314:47699", "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" } }, { "nodeId": "314:47769", "figmaVariantName": "icon=no, style=filling, color=orange, status=hover, radius=square, fixed width=yes", "props": { "icon": "no", "style": "filling", "color": "orange", "status": "hover", "radius": "square", "fixedWidth": "yes" } } ] }, { "figmaName": "Button/light L", "nodeId": "1545:47446", "pageName": "— — Buttons", "filename": "button_light_l__1545_47446.json", "source": "figma-data/normalized/components-tokenized/button_light_l__1545_47446.json", "variantCount": 400, "variantAxes": [ { "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" ] } ], "tokenCoverage": { "totalRefs": 792, "resolvedRefs": 792, "unresolvedRefs": 0, "resolvedPercent": 100, "unresolvedVariableIds": [], "unresolvedSamples": [] }, "codeName": "ButtonLightL", "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" } }, { "nodeId": "314:46774", "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:46824", "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:46829", "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" } }, { "nodeId": "314:46784", "figmaVariantName": "icon=no, style=filling, color=red, status=disable, Radius=square, fixed width=yes", "props": { "icon": "no", "style": "filling", "color": "red", "status": "disable", "radius": "square", "fixedWidth": "yes" } }, { "nodeId": "314:46789", "figmaVariantName": "icon=no, style=filling, color=red, status=disable, Radius=square, fixed width=no", "props": { "icon": "no", "style": "filling", "color": "red", "status": "disable", "radius": "square", "fixedWidth": "no" } } ] }, { "figmaName": "Button/light M", "nodeId": "1545:47447", "pageName": "— — Buttons", "filename": "button_light_m__1545_47447.json", "source": "figma-data/normalized/components-tokenized/button_light_m__1545_47447.json", "variantCount": 400, "variantAxes": [ { "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" ] } ], "tokenCoverage": { "totalRefs": 810, "resolvedRefs": 810, "unresolvedRefs": 0, "resolvedPercent": 100, "unresolvedVariableIds": [], "unresolvedSamples": [] }, "codeName": "ButtonLightM", "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" } }, { "nodeId": "314:46939", "figmaVariantName": "icon=no, style=filling, color=red, status=disable, Radius=square, fixed width=no", "props": { "icon": "no", "style": "filling", "color": "red", "status": "disable", "radius": "square", "fixedWidth": "no" } }, { "nodeId": "314:46984", "figmaVariantName": "icon=no, style=filling, color=red, status=hover, Radius=square, fixed width=no", "props": { "icon": "no", "style": "filling", "color": "red", "status": "hover", "radius": "square", "fixedWidth": "no" } }, { "nodeId": "314:46899", "figmaVariantName": "icon=no, style=filling, color=orange, status=default, Radius=square, fixed width=no", "props": { "icon": "no", "style": "filling", "color": "orange", "status": "default", "radius": "square", "fixedWidth": "no" } }, { "nodeId": "314:46944", "figmaVariantName": "icon=no, style=filling, color=orange, status=disable, Radius=square, fixed width=no", "props": { "icon": "no", "style": "filling", "color": "orange", "status": "disable", "radius": "square", "fixedWidth": "no" } }, { "nodeId": "314:46999", "figmaVariantName": "icon=no, style=filling, color=orange, status=hover, Radius=square, fixed width=no", "props": { "icon": "no", "style": "filling", "color": "orange", "status": "hover", "radius": "square", "fixedWidth": "no" } } ] }, { "figmaName": "Button/light S", "nodeId": "1545:51851", "pageName": "— — Buttons", "filename": "button_light_s__1545_51851.json", "source": "figma-data/normalized/components-tokenized/button_light_s__1545_51851.json", "variantCount": 400, "variantAxes": [ { "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" ] } ], "tokenCoverage": { "totalRefs": 792, "resolvedRefs": 792, "unresolvedRefs": 0, "resolvedPercent": 100, "unresolvedVariableIds": [], "unresolvedSamples": [] }, "codeName": "ButtonLightS", "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" } }, { "nodeId": "314:47049", "figmaVariantName": "icon=no, style=filling, color=orange, status=default, radius=square, fixed width=no", "props": { "icon": "no", "style": "filling", "color": "orange", "status": "default", "radius": "square", "fixedWidth": "no" } }, { "nodeId": "314:47034", "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" } }, { "nodeId": "314:47039", "figmaVariantName": "icon=no, style=filling, color=red, status=default, radius=square, fixed width=no", "props": { "icon": "no", "style": "filling", "color": "red", "status": "default", "radius": "square", "fixedWidth": "no" } }, { "nodeId": "314:47054", "figmaVariantName": "icon=no, style=filling, color=gray 1, status=default, radius=square, fixed width=yes", "props": { "icon": "no", "style": "filling", "color": "gray 1", "status": "default", "radius": "square", "fixedWidth": "yes" } }, { "nodeId": "314:47059", "figmaVariantName": "icon=no, style=filling, color=gray 1, status=default, radius=square, fixed width=no", "props": { "icon": "no", "style": "filling", "color": "gray 1", "status": "default", "radius": "square", "fixedWidth": "no" } } ] }, { "figmaName": "Button/light XS", "nodeId": "1545:51852", "pageName": "— — Buttons", "filename": "button_light_xs__1545_51852.json", "source": "figma-data/normalized/components-tokenized/button_light_xs__1545_51852.json", "variantCount": 400, "variantAxes": [ { "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" ] } ], "tokenCoverage": { "totalRefs": 792, "resolvedRefs": 792, "unresolvedRefs": 0, "resolvedPercent": 100, "unresolvedVariableIds": [], "unresolvedSamples": [] }, "codeName": "ButtonLightXs", "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" } }, { "nodeId": "314:47210", "figmaVariantName": "icon=no, style=filling, color=orange, status=default, radius=square, fixed width=no", "props": { "icon": "no", "style": "filling", "color": "orange", "status": "default", "radius": "square", "fixedWidth": "no" } }, { "nodeId": "314:47281", "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" } }, { "nodeId": "314:47211", "figmaVariantName": "icon=no, style=filling, color=red, status=default, radius=square, fixed width=no", "props": { "icon": "no", "style": "filling", "color": "red", "status": "default", "radius": "square", "fixedWidth": "no" } }, { "nodeId": "314:47293", "figmaVariantName": "icon=no, style=filling, color=gray 1, status=default, radius=square, fixed width=yes", "props": { "icon": "no", "style": "filling", "color": "gray 1", "status": "default", "radius": "square", "fixedWidth": "yes" } }, { "nodeId": "314:47223", "figmaVariantName": "icon=no, style=filling, color=gray 1, status=default, radius=square, fixed width=no", "props": { "icon": "no", "style": "filling", "color": "gray 1", "status": "default", "radius": "square", "fixedWidth": "no" } } ] } ], "notes": [ "Button canonical spec is intentionally held in needs-review while size/theme/link-family normalization is being repaired." ], "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" ] } }, { "codeComponent": "Input", "generationPriority": 2, "status": "ready", "sourceLayer": "components-tokenized", "memberCount": 2, "rawMemberCount": 2, "totalVariants": 224, "averageTokenCoverage": 100, "mergedVariantAxes": [ { "figmaAxis": "dark theme", "propName": "darkTheme", "values": [ "off", "on" ], "sources": [ "input box/filled", "input box/line" ] }, { "figmaAxis": "enable", "propName": "enable", "values": [ "off", "on" ], "sources": [ "input box/filled", "input box/line" ] }, { "figmaAxis": "feature", "propName": "feature", "values": [ "no", "text count", "yes" ], "sources": [ "input box/filled", "input box/line" ] }, { "figmaAxis": "size", "propName": "size", "values": [ "L", "M", "XL" ], "sources": [ "input box/filled", "input box/line" ] }, { "figmaAxis": "status", "propName": "status", "values": [ "default", "Filled", "normal" ], "sources": [ "input box/filled", "input box/line" ] }, { "figmaAxis": "UX", "propName": "ux", "values": [ "click", "default", "error", "hover" ], "sources": [ "input box/filled", "input box/line" ] } ], "members": [ { "figmaName": "input box/filled", "nodeId": "1436:32815", "pageName": "— — Input/Select box", "filename": "input_box_filled__1436_32815.json", "source": "figma-data/normalized/components-tokenized/input_box_filled__1436_32815.json", "variantCount": 112, "variantAxes": [ { "figmaAxis": "dark theme", "propName": "darkTheme", "values": [ "on", "off" ] }, { "figmaAxis": "status", "propName": "status", "values": [ "default", "normal" ] }, { "figmaAxis": "enable", "propName": "enable", "values": [ "on", "off" ] }, { "figmaAxis": "UX", "propName": "ux", "values": [ "default", "error", "hover", "click" ] }, { "figmaAxis": "size", "propName": "size", "values": [ "M", "L", "XL" ] }, { "figmaAxis": "feature", "propName": "feature", "values": [ "no", "yes", "text count" ] } ], "tokenCoverage": { "totalRefs": 296, "resolvedRefs": 296, "unresolvedRefs": 0, "resolvedPercent": 100, "unresolvedVariableIds": [], "unresolvedSamples": [] }, "codeName": "InputBoxFilled", "sampleVariants": [ { "nodeId": "1431:54604", "figmaVariantName": "dark theme=on, status=default, enable=on, UX=default, size=M, feature=no", "props": { "darkTheme": "on", "status": "default", "enable": "on", "ux": "default", "size": "M", "feature": "no" } }, { "nodeId": "4187:7940", "figmaVariantName": "dark theme=on, status=default, enable=on, UX=error, size=M, feature=no", "props": { "darkTheme": "on", "status": "default", "enable": "on", "ux": "error", "size": "M", "feature": "no" } }, { "nodeId": "1436:31698", "figmaVariantName": "dark theme=on, status=default, enable=on, UX=default, size=L, feature=no", "props": { "darkTheme": "on", "status": "default", "enable": "on", "ux": "default", "size": "L", "feature": "no" } }, { "nodeId": "4187:8055", "figmaVariantName": "dark theme=on, status=default, enable=on, UX=error, size=L, feature=no", "props": { "darkTheme": "on", "status": "default", "enable": "on", "ux": "error", "size": "L", "feature": "no" } }, { "nodeId": "1431:54626", "figmaVariantName": "dark theme=off, status=default, enable=on, UX=default, size=M, feature=no", "props": { "darkTheme": "off", "status": "default", "enable": "on", "ux": "default", "size": "M", "feature": "no" } }, { "nodeId": "4187:8103", "figmaVariantName": "dark theme=off, status=default, enable=on, UX=error, size=M, feature=no", "props": { "darkTheme": "off", "status": "default", "enable": "on", "ux": "error", "size": "M", "feature": "no" } }, { "nodeId": "1436:31692", "figmaVariantName": "dark theme=off, status=default, enable=on, UX=default, size=M, feature=yes", "props": { "darkTheme": "off", "status": "default", "enable": "on", "ux": "default", "size": "M", "feature": "yes" } }, { "nodeId": "4187:8106", "figmaVariantName": "dark theme=off, status=default, enable=on, UX=error, size=M, feature=yes", "props": { "darkTheme": "off", "status": "default", "enable": "on", "ux": "error", "size": "M", "feature": "yes" } } ] }, { "figmaName": "input box/line", "nodeId": "1818:8063", "pageName": "— — Input/Select box", "filename": "input_box_line__1818_8063.json", "source": "figma-data/normalized/components-tokenized/input_box_line__1818_8063.json", "variantCount": 112, "variantAxes": [ { "figmaAxis": "dark theme", "propName": "darkTheme", "values": [ "on", "off" ] }, { "figmaAxis": "status", "propName": "status", "values": [ "default", "normal", "Filled" ] }, { "figmaAxis": "enable", "propName": "enable", "values": [ "on", "off" ] }, { "figmaAxis": "UX", "propName": "ux", "values": [ "default", "error", "click", "hover" ] }, { "figmaAxis": "size", "propName": "size", "values": [ "M", "L", "XL" ] }, { "figmaAxis": "feature", "propName": "feature", "values": [ "no", "yes", "text count" ] } ], "tokenCoverage": { "totalRefs": 224, "resolvedRefs": 224, "unresolvedRefs": 0, "resolvedPercent": 100, "unresolvedVariableIds": [], "unresolvedSamples": [] }, "codeName": "InputBoxLine", "sampleVariants": [ { "nodeId": "1818:8064", "figmaVariantName": "dark theme=on, status=default, enable=on, UX=default, size=M, feature=no", "props": { "darkTheme": "on", "status": "default", "enable": "on", "ux": "default", "size": "M", "feature": "no" } }, { "nodeId": "4187:7696", "figmaVariantName": "dark theme=on, status=default, enable=on, UX=error, size=M, feature=no", "props": { "darkTheme": "on", "status": "default", "enable": "on", "ux": "error", "size": "M", "feature": "no" } }, { "nodeId": "1858:45977", "figmaVariantName": "dark theme=on, status=default, enable=on, UX=default, size=L, feature=no", "props": { "darkTheme": "on", "status": "default", "enable": "on", "ux": "default", "size": "L", "feature": "no" } }, { "nodeId": "4187:7801", "figmaVariantName": "dark theme=on, status=default, enable=on, UX=error, size=L, feature=no", "props": { "darkTheme": "on", "status": "default", "enable": "on", "ux": "error", "size": "L", "feature": "no" } }, { "nodeId": "1818:8068", "figmaVariantName": "dark theme=off, status=default, enable=on, UX=default, size=M, feature=no", "props": { "darkTheme": "off", "status": "default", "enable": "on", "ux": "default", "size": "M", "feature": "no" } }, { "nodeId": "4187:7845", "figmaVariantName": "dark theme=off, status=default, enable=on, UX=error, size=M, feature=no", "props": { "darkTheme": "off", "status": "default", "enable": "on", "ux": "error", "size": "M", "feature": "no" } }, { "nodeId": "1858:45979", "figmaVariantName": "dark theme=off, status=default, enable=on, UX=default, size=L, feature=no", "props": { "darkTheme": "off", "status": "default", "enable": "on", "ux": "default", "size": "L", "feature": "no" } }, { "nodeId": "4187:7889", "figmaVariantName": "dark theme=off, status=default, enable=on, UX=error, size=L, feature=no", "props": { "darkTheme": "off", "status": "default", "enable": "on", "ux": "error", "size": "L", "feature": "no" } } ] } ], "notes": [] }, { "codeComponent": "Checkbox", "generationPriority": 3, "status": "ready", "sourceLayer": "components-tokenized", "memberCount": 1, "rawMemberCount": 1, "totalVariants": 12, "averageTokenCoverage": 100, "mergedVariantAxes": [ { "figmaAxis": "dark theme", "propName": "darkTheme", "values": [ "off", "on" ], "sources": [ "check box" ] }, { "figmaAxis": "enable", "propName": "enable", "values": [ "no", "yes" ], "sources": [ "check box" ] }, { "figmaAxis": "status", "propName": "status", "values": [ "off", "on", "some" ], "sources": [ "check box" ] } ], "members": [ { "figmaName": "check box", "nodeId": "3242:13521", "pageName": "— — Buttons", "filename": "check_box__3242_13521.json", "source": "figma-data/normalized/components-tokenized/check_box__3242_13521.json", "variantCount": 12, "variantAxes": [ { "figmaAxis": "dark theme", "propName": "darkTheme", "values": [ "on", "off" ] }, { "figmaAxis": "status", "propName": "status", "values": [ "off", "on", "some" ] }, { "figmaAxis": "enable", "propName": "enable", "values": [ "yes", "no" ] } ], "tokenCoverage": { "totalRefs": 12, "resolvedRefs": 12, "unresolvedRefs": 0, "resolvedPercent": 100, "unresolvedVariableIds": [], "unresolvedSamples": [] }, "codeName": "CheckBox", "sampleVariants": [ { "nodeId": "374:771", "figmaVariantName": "dark theme=on, status=off, enable=yes", "props": { "darkTheme": "on", "status": "off", "enable": "yes" } }, { "nodeId": "374:783", "figmaVariantName": "dark theme=on, status=off, enable=no", "props": { "darkTheme": "on", "status": "off", "enable": "no" } }, { "nodeId": "374:782", "figmaVariantName": "dark theme=on, status=on, enable=no", "props": { "darkTheme": "on", "status": "on", "enable": "no" } }, { "nodeId": "374:780", "figmaVariantName": "dark theme=on, status=some, enable=no", "props": { "darkTheme": "on", "status": "some", "enable": "no" } }, { "nodeId": "374:772", "figmaVariantName": "dark theme=on, status=on, enable=yes", "props": { "darkTheme": "on", "status": "on", "enable": "yes" } }, { "nodeId": "374:773", "figmaVariantName": "dark theme=on, status=some, enable=yes", "props": { "darkTheme": "on", "status": "some", "enable": "yes" } }, { "nodeId": "374:774", "figmaVariantName": "dark theme=off, status=off, enable=yes", "props": { "darkTheme": "off", "status": "off", "enable": "yes" } }, { "nodeId": "374:775", "figmaVariantName": "dark theme=off, status=on, enable=yes", "props": { "darkTheme": "off", "status": "on", "enable": "yes" } } ] } ], "notes": [] }, { "codeComponent": "Radio", "generationPriority": 4, "status": "ready", "sourceLayer": "components-tokenized", "memberCount": 1, "rawMemberCount": 1, "totalVariants": 8, "averageTokenCoverage": 100, "mergedVariantAxes": [ { "figmaAxis": "dark theme", "propName": "darkTheme", "values": [ "off", "on" ], "sources": [ "radio" ] }, { "figmaAxis": "enable", "propName": "enable", "values": [ "no", "yes" ], "sources": [ "radio" ] }, { "figmaAxis": "status", "propName": "status", "values": [ "off", "on" ], "sources": [ "radio" ] } ], "members": [ { "figmaName": "radio", "nodeId": "3242:15188", "pageName": "— — Buttons", "filename": "radio__3242_15188.json", "source": "figma-data/normalized/components-tokenized/radio__3242_15188.json", "variantCount": 8, "variantAxes": [ { "figmaAxis": "dark theme", "propName": "darkTheme", "values": [ "on", "off" ] }, { "figmaAxis": "status", "propName": "status", "values": [ "off", "on" ] }, { "figmaAxis": "enable", "propName": "enable", "values": [ "yes", "no" ] } ], "tokenCoverage": { "totalRefs": 8, "resolvedRefs": 8, "unresolvedRefs": 0, "resolvedPercent": 100, "unresolvedVariableIds": [], "unresolvedSamples": [] }, "codeName": "Radio", "sampleVariants": [ { "nodeId": "374:853", "figmaVariantName": "dark theme=on, status=off, enable=yes", "props": { "darkTheme": "on", "status": "off", "enable": "yes" } }, { "nodeId": "374:854", "figmaVariantName": "dark theme=on, status=off, enable=no", "props": { "darkTheme": "on", "status": "off", "enable": "no" } }, { "nodeId": "374:855", "figmaVariantName": "dark theme=on, status=on, enable=no", "props": { "darkTheme": "on", "status": "on", "enable": "no" } }, { "nodeId": "374:856", "figmaVariantName": "dark theme=on, status=on, enable=yes", "props": { "darkTheme": "on", "status": "on", "enable": "yes" } }, { "nodeId": "374:857", "figmaVariantName": "dark theme=off, status=off, enable=yes", "props": { "darkTheme": "off", "status": "off", "enable": "yes" } }, { "nodeId": "374:860", "figmaVariantName": "dark theme=off, status=on, enable=yes", "props": { "darkTheme": "off", "status": "on", "enable": "yes" } }, { "nodeId": "374:858", "figmaVariantName": "dark theme=off, status=off, enable=no", "props": { "darkTheme": "off", "status": "off", "enable": "no" } }, { "nodeId": "374:859", "figmaVariantName": "dark theme=off, status=on, enable=no", "props": { "darkTheme": "off", "status": "on", "enable": "no" } } ] } ], "notes": [] }, { "codeComponent": "Switch", "generationPriority": 5, "status": "ready", "sourceLayer": "components-tokenized", "memberCount": 1, "rawMemberCount": 1, "totalVariants": 18, "averageTokenCoverage": 100, "mergedVariantAxes": [ { "figmaAxis": "dark theme", "propName": "darkTheme", "values": [ "off", "on" ], "sources": [ "switch" ] }, { "figmaAxis": "enable", "propName": "enable", "values": [ "no", "yes" ], "sources": [ "switch" ] }, { "figmaAxis": "loading", "propName": "loading", "values": [ "no", "yes" ], "sources": [ "switch" ] }, { "figmaAxis": "status", "propName": "status", "values": [ "live", "off", "on" ], "sources": [ "switch" ] } ], "members": [ { "figmaName": "switch", "nodeId": "348:3483", "pageName": "— — Buttons", "filename": "switch__348_3483.json", "source": "figma-data/normalized/components-tokenized/switch__348_3483.json", "variantCount": 18, "variantAxes": [ { "figmaAxis": "dark theme", "propName": "darkTheme", "values": [ "on", "off" ] }, { "figmaAxis": "status", "propName": "status", "values": [ "on", "live", "off" ] }, { "figmaAxis": "enable", "propName": "enable", "values": [ "yes", "no" ] }, { "figmaAxis": "loading", "propName": "loading", "values": [ "no", "yes" ] } ], "tokenCoverage": { "totalRefs": 4, "resolvedRefs": 4, "unresolvedRefs": 0, "resolvedPercent": 100, "unresolvedVariableIds": [], "unresolvedSamples": [] }, "codeName": "Switch", "sampleVariants": [ { "nodeId": "337:18075", "figmaVariantName": "dark theme=on, status=on, enable=yes, loading=no", "props": { "darkTheme": "on", "status": "on", "enable": "yes", "loading": "no" } }, { "nodeId": "337:18211", "figmaVariantName": "dark theme=on, status=on, enable=no, loading=yes", "props": { "darkTheme": "on", "status": "on", "enable": "no", "loading": "yes" } }, { "nodeId": "337:18249", "figmaVariantName": "dark theme=on, status=live, enable=yes, loading=no", "props": { "darkTheme": "on", "status": "live", "enable": "yes", "loading": "no" } }, { "nodeId": "337:18248", "figmaVariantName": "dark theme=on, status=live, enable=no, loading=no", "props": { "darkTheme": "on", "status": "live", "enable": "no", "loading": "no" } }, { "nodeId": "337:18245", "figmaVariantName": "dark theme=on, status=live, enable=no, loading=yes", "props": { "darkTheme": "on", "status": "live", "enable": "no", "loading": "yes" } }, { "nodeId": "337:18083", "figmaVariantName": "dark theme=off, status=on, enable=yes, loading=no", "props": { "darkTheme": "off", "status": "on", "enable": "yes", "loading": "no" } }, { "nodeId": "337:18209", "figmaVariantName": "dark theme=off, status=on, enable=no, loading=yes", "props": { "darkTheme": "off", "status": "on", "enable": "no", "loading": "yes" } }, { "nodeId": "337:18250", "figmaVariantName": "dark theme=off, status=live, enable=yes, loading=no", "props": { "darkTheme": "off", "status": "live", "enable": "yes", "loading": "no" } } ] } ], "notes": [] }, { "codeComponent": "InputNumber", "generationPriority": 6, "status": "ready", "sourceLayer": "components-tokenized", "memberCount": 1, "rawMemberCount": 1, "totalVariants": 4, "averageTokenCoverage": 100, "mergedVariantAxes": [ { "figmaAxis": "Property 1", "propName": "property1", "values": [ "Default", "Only Add", "Only Reduce", "Readonly" ], "sources": [ "InputNumber" ] } ], "members": [ { "figmaName": "InputNumber", "nodeId": "4684:7159", "pageName": "— — Input/Select box", "filename": "inputnumber__4684_7159.json", "source": "figma-data/normalized/components-tokenized/inputnumber__4684_7159.json", "variantCount": 4, "variantAxes": [ { "figmaAxis": "Property 1", "propName": "property1", "values": [ "Default", "Only Add", "Only Reduce", "Readonly" ] } ], "tokenCoverage": { "totalRefs": 8, "resolvedRefs": 8, "unresolvedRefs": 0, "resolvedPercent": 100, "unresolvedVariableIds": [], "unresolvedSamples": [] }, "codeName": "InputNumber", "sampleVariants": [ { "nodeId": "4684:7158", "figmaVariantName": "Property 1=Default", "props": { "property1": "Default" } }, { "nodeId": "4684:7160", "figmaVariantName": "Property 1=Only Add", "props": { "property1": "Only Add" } }, { "nodeId": "4684:7172", "figmaVariantName": "Property 1=Only Reduce", "props": { "property1": "Only Reduce" } }, { "nodeId": "4684:7184", "figmaVariantName": "Property 1=Readonly", "props": { "property1": "Readonly" } } ] } ], "notes": [] }, { "codeComponent": "Select", "generationPriority": 7, "status": "ready", "sourceLayer": "components-tokenized", "memberCount": 2, "rawMemberCount": 2, "totalVariants": 288, "averageTokenCoverage": 100, "mergedVariantAxes": [ { "figmaAxis": "dark theme", "propName": "darkTheme", "values": [ "off", "on" ], "sources": [ "select box/filled", "select box/line" ] }, { "figmaAxis": "enable", "propName": "enable", "values": [ "off", "on" ], "sources": [ "select box/filled", "select box/line" ] }, { "figmaAxis": "feature", "propName": "feature", "values": [ "date", "default", "time" ], "sources": [ "select box/filled", "select box/line" ] }, { "figmaAxis": "size", "propName": "size", "values": [ "L", "M" ], "sources": [ "select box/filled", "select box/line" ] }, { "figmaAxis": "status", "propName": "status", "values": [ "default", "multi select", "normal" ], "sources": [ "select box/filled", "select box/line" ] }, { "figmaAxis": "UX", "propName": "ux", "values": [ "click", "default", "editable", "error", "hover" ], "sources": [ "select box/filled", "select box/line" ] } ], "members": [ { "figmaName": "select box/filled", "nodeId": "1436:32816", "pageName": "— — Input/Select box", "filename": "select_box_filled__1436_32816.json", "source": "figma-data/normalized/components-tokenized/select_box_filled__1436_32816.json", "variantCount": 144, "variantAxes": [ { "figmaAxis": "dark theme", "propName": "darkTheme", "values": [ "on", "off" ] }, { "figmaAxis": "status", "propName": "status", "values": [ "default", "normal", "multi select" ] }, { "figmaAxis": "enable", "propName": "enable", "values": [ "on", "off" ] }, { "figmaAxis": "UX", "propName": "ux", "values": [ "default", "error", "hover", "click", "editable" ] }, { "figmaAxis": "size", "propName": "size", "values": [ "M", "L" ] }, { "figmaAxis": "feature", "propName": "feature", "values": [ "default", "time", "date" ] } ], "tokenCoverage": { "totalRefs": 376, "resolvedRefs": 376, "unresolvedRefs": 0, "resolvedPercent": 100, "unresolvedVariableIds": [], "unresolvedSamples": [] }, "codeName": "SelectBoxFilled", "sampleVariants": [ { "nodeId": "1436:32817", "figmaVariantName": "dark theme=on, status=default, enable=on, UX=default, size=M, feature=default", "props": { "darkTheme": "on", "status": "default", "enable": "on", "ux": "default", "size": "M", "feature": "default" } }, { "nodeId": "4187:6996", "figmaVariantName": "dark theme=on, status=default, enable=on, UX=error, size=M, feature=default", "props": { "darkTheme": "on", "status": "default", "enable": "on", "ux": "error", "size": "M", "feature": "default" } }, { "nodeId": "1443:38596", "figmaVariantName": "dark theme=on, status=default, enable=on, UX=default, size=L, feature=default", "props": { "darkTheme": "on", "status": "default", "enable": "on", "ux": "default", "size": "L", "feature": "default" } }, { "nodeId": "4187:7214", "figmaVariantName": "dark theme=on, status=default, enable=on, UX=error, size=L, feature=default", "props": { "darkTheme": "on", "status": "default", "enable": "on", "ux": "error", "size": "L", "feature": "default" } }, { "nodeId": "1436:32821", "figmaVariantName": "dark theme=off, status=default, enable=on, UX=default, size=M, feature=default", "props": { "darkTheme": "off", "status": "default", "enable": "on", "ux": "default", "size": "M", "feature": "default" } }, { "nodeId": "4187:7398", "figmaVariantName": "dark theme=off, status=default, enable=on, UX=error, size=M, feature=default", "props": { "darkTheme": "off", "status": "default", "enable": "on", "ux": "error", "size": "M", "feature": "default" } }, { "nodeId": "1443:38599", "figmaVariantName": "dark theme=off, status=default, enable=on, UX=default, size=L, feature=default", "props": { "darkTheme": "off", "status": "default", "enable": "on", "ux": "default", "size": "L", "feature": "default" } }, { "nodeId": "4187:7582", "figmaVariantName": "dark theme=off, status=default, enable=on, UX=error, size=L, feature=default", "props": { "darkTheme": "off", "status": "default", "enable": "on", "ux": "error", "size": "L", "feature": "default" } } ] }, { "figmaName": "select box/line", "nodeId": "1804:26921", "pageName": "— — Input/Select box", "filename": "select_box_line__1804_26921.json", "source": "figma-data/normalized/components-tokenized/select_box_line__1804_26921.json", "variantCount": 144, "variantAxes": [ { "figmaAxis": "dark theme", "propName": "darkTheme", "values": [ "on", "off" ] }, { "figmaAxis": "status", "propName": "status", "values": [ "default", "normal", "multi select" ] }, { "figmaAxis": "enable", "propName": "enable", "values": [ "on", "off" ] }, { "figmaAxis": "UX", "propName": "ux", "values": [ "default", "error", "hover", "click", "editable" ] }, { "figmaAxis": "size", "propName": "size", "values": [ "M", "L" ] }, { "figmaAxis": "feature", "propName": "feature", "values": [ "default", "time", "date" ] } ], "tokenCoverage": { "totalRefs": 288, "resolvedRefs": 288, "unresolvedRefs": 0, "resolvedPercent": 100, "unresolvedVariableIds": [], "unresolvedSamples": [] }, "codeName": "SelectBoxLine", "sampleVariants": [ { "nodeId": "1804:26922", "figmaVariantName": "dark theme=on, status=default, enable=on, UX=default, size=M, feature=default", "props": { "darkTheme": "on", "status": "default", "enable": "on", "ux": "default", "size": "M", "feature": "default" } }, { "nodeId": "4187:5323", "figmaVariantName": "dark theme=on, status=default, enable=on, UX=error, size=M, feature=default", "props": { "darkTheme": "on", "status": "default", "enable": "on", "ux": "error", "size": "M", "feature": "default" } }, { "nodeId": "1852:61100", "figmaVariantName": "dark theme=on, status=default, enable=on, UX=default, size=L, feature=default", "props": { "darkTheme": "on", "status": "default", "enable": "on", "ux": "default", "size": "L", "feature": "default" } }, { "nodeId": "4187:6628", "figmaVariantName": "dark theme=on, status=default, enable=on, UX=error, size=L, feature=default", "props": { "darkTheme": "on", "status": "default", "enable": "on", "ux": "error", "size": "L", "feature": "default" } }, { "nodeId": "1804:26928", "figmaVariantName": "dark theme=off, status=default, enable=on, UX=default, size=M, feature=default", "props": { "darkTheme": "off", "status": "default", "enable": "on", "ux": "default", "size": "M", "feature": "default" } }, { "nodeId": "4187:6444", "figmaVariantName": "dark theme=off, status=default, enable=on, UX=error, size=M, feature=default", "props": { "darkTheme": "off", "status": "default", "enable": "on", "ux": "error", "size": "M", "feature": "default" } }, { "nodeId": "1852:61103", "figmaVariantName": "dark theme=off, status=default, enable=on, UX=default, size=L, feature=default", "props": { "darkTheme": "off", "status": "default", "enable": "on", "ux": "default", "size": "L", "feature": "default" } }, { "nodeId": "4187:6812", "figmaVariantName": "dark theme=off, status=default, enable=on, UX=error, size=L, feature=default", "props": { "darkTheme": "off", "status": "default", "enable": "on", "ux": "error", "size": "L", "feature": "default" } } ] } ], "notes": [] }, { "codeComponent": "Badge", "generationPriority": 8, "status": "ready", "sourceLayer": "components-tokenized", "memberCount": 1, "rawMemberCount": 1, "totalVariants": 20, "averageTokenCoverage": 100, "mergedVariantAxes": [ { "figmaAxis": "Color", "propName": "color", "values": [ "Blue", "Green", "Neutral", "Orange", "Red" ], "sources": [ "Badge" ] }, { "figmaAxis": "Tag", "propName": "tag", "values": [ "Filled", "Line" ], "sources": [ "Badge" ] }, { "figmaAxis": "Type", "propName": "type", "values": [ "Circle", "Rectangle" ], "sources": [ "Badge" ] } ], "members": [ { "figmaName": "Badge", "nodeId": "4821:1665", "pageName": "— — Other Components", "filename": "badge__4821_1665.json", "source": "figma-data/normalized/components-tokenized/badge__4821_1665.json", "variantCount": 20, "variantAxes": [ { "figmaAxis": "Type", "propName": "type", "values": [ "Circle", "Rectangle" ] }, { "figmaAxis": "Color", "propName": "color", "values": [ "Green", "Blue", "Orange", "Red", "Neutral" ] }, { "figmaAxis": "Tag", "propName": "tag", "values": [ "Filled", "Line" ] } ], "tokenCoverage": { "totalRefs": 40, "resolvedRefs": 40, "unresolvedRefs": 0, "resolvedPercent": 100, "unresolvedVariableIds": [], "unresolvedSamples": [] }, "codeName": "Badge", "sampleVariants": [ { "nodeId": "4821:1662", "figmaVariantName": "Type=Circle, Color=Green, Tag=Filled", "props": { "type": "Circle", "color": "Green", "tag": "Filled" } }, { "nodeId": "4895:1363", "figmaVariantName": "Type=Circle, Color=Green, Tag=Line", "props": { "type": "Circle", "color": "Green", "tag": "Line" } }, { "nodeId": "4821:1663", "figmaVariantName": "Type=Circle, Color=Blue, Tag=Filled", "props": { "type": "Circle", "color": "Blue", "tag": "Filled" } }, { "nodeId": "4895:1365", "figmaVariantName": "Type=Circle, Color=Blue, Tag=Line", "props": { "type": "Circle", "color": "Blue", "tag": "Line" } }, { "nodeId": "4821:1661", "figmaVariantName": "Type=Circle, Color=Orange, Tag=Filled", "props": { "type": "Circle", "color": "Orange", "tag": "Filled" } }, { "nodeId": "4895:1367", "figmaVariantName": "Type=Circle, Color=Orange, Tag=Line", "props": { "type": "Circle", "color": "Orange", "tag": "Line" } }, { "nodeId": "4821:1660", "figmaVariantName": "Type=Circle, Color=Red, Tag=Filled", "props": { "type": "Circle", "color": "Red", "tag": "Filled" } }, { "nodeId": "4895:1369", "figmaVariantName": "Type=Circle, Color=Red, Tag=Line", "props": { "type": "Circle", "color": "Red", "tag": "Line" } } ] } ], "notes": [] }, { "codeComponent": "FormItem", "generationPriority": 9, "status": "ready", "sourceLayer": "components-tokenized", "memberCount": 1, "rawMemberCount": 1, "totalVariants": 64, "averageTokenCoverage": 100, "mergedVariantAxes": [ { "figmaAxis": "Label Width", "propName": "labelWidth", "values": [ "120 px", "200 px", "Dynamic" ], "sources": [ "Form Item" ] }, { "figmaAxis": "Layout", "propName": "layout", "values": [ "1 line", "1 line & Right", "2 lines" ], "sources": [ "Form Item" ] }, { "figmaAxis": "Status", "propName": "status", "values": [ "Error", "Normal" ], "sources": [ "Form Item" ] }, { "figmaAxis": "Theme", "propName": "theme", "values": [ "Dark", "Light" ], "sources": [ "Form Item" ] }, { "figmaAxis": "Type", "propName": "type", "values": [ "Label & checkbox", "Label & Input", "Label & Radio", "Label & Selector", "Label & Switch", "Label & Textarea" ], "sources": [ "Form Item" ] } ], "members": [ { "figmaName": "Form Item", "nodeId": "1923:50705", "pageName": "— — Notifications & Pop box", "filename": "form_item__1923_50705.json", "source": "figma-data/normalized/components-tokenized/form_item__1923_50705.json", "variantCount": 64, "variantAxes": [ { "figmaAxis": "Type", "propName": "type", "values": [ "Label & Input", "Label & Selector", "Label & Textarea", "Label & Radio", "Label & checkbox", "Label & Switch" ] }, { "figmaAxis": "Layout", "propName": "layout", "values": [ "2 lines", "1 line", "1 line & Right" ] }, { "figmaAxis": "Theme", "propName": "theme", "values": [ "Dark", "Light" ] }, { "figmaAxis": "Label Width", "propName": "labelWidth", "values": [ "Dynamic", "200 px", "120 px" ] }, { "figmaAxis": "Status", "propName": "status", "values": [ "Normal", "Error" ] } ], "tokenCoverage": { "totalRefs": 64, "resolvedRefs": 64, "unresolvedRefs": 0, "resolvedPercent": 100, "unresolvedVariableIds": [], "unresolvedSamples": [] }, "codeName": "FormItem", "sampleVariants": [ { "nodeId": "1923:49063", "figmaVariantName": "Type=Label & Input, Layout=2 lines, Theme=Dark, Label Width=Dynamic, Status=Normal", "props": { "type": "Label & Input", "layout": "2 lines", "theme": "Dark", "labelWidth": "Dynamic", "status": "Normal" } }, { "nodeId": "1923:49069", "figmaVariantName": "Type=Label & Input, Layout=2 lines, Theme=Dark, Label Width=Dynamic, Status=Error", "props": { "type": "Label & Input", "layout": "2 lines", "theme": "Dark", "labelWidth": "Dynamic", "status": "Error" } }, { "nodeId": "1923:49077", "figmaVariantName": "Type=Label & Selector, Layout=2 lines, Theme=Dark, Label Width=Dynamic, Status=Normal", "props": { "type": "Label & Selector", "layout": "2 lines", "theme": "Dark", "labelWidth": "Dynamic", "status": "Normal" } }, { "nodeId": "1923:49083", "figmaVariantName": "Type=Label & Selector, Layout=2 lines, Theme=Dark, Label Width=Dynamic, Status=Error", "props": { "type": "Label & Selector", "layout": "2 lines", "theme": "Dark", "labelWidth": "Dynamic", "status": "Error" } }, { "nodeId": "1923:49091", "figmaVariantName": "Type=Label & Textarea, Layout=2 lines, Theme=Dark, Label Width=Dynamic, Status=Normal", "props": { "type": "Label & Textarea", "layout": "2 lines", "theme": "Dark", "labelWidth": "Dynamic", "status": "Normal" } }, { "nodeId": "1923:49097", "figmaVariantName": "Type=Label & Textarea, Layout=2 lines, Theme=Dark, Label Width=Dynamic, Status=Error", "props": { "type": "Label & Textarea", "layout": "2 lines", "theme": "Dark", "labelWidth": "Dynamic", "status": "Error" } }, { "nodeId": "1923:49105", "figmaVariantName": "Type=Label & Radio, Layout=2 lines, Theme=Dark, Label Width=Dynamic, Status=Normal", "props": { "type": "Label & Radio", "layout": "2 lines", "theme": "Dark", "labelWidth": "Dynamic", "status": "Normal" } }, { "nodeId": "1923:49116", "figmaVariantName": "Type=Label & checkbox, Layout=2 lines, Theme=Dark, Label Width=Dynamic, Status=Normal", "props": { "type": "Label & checkbox", "layout": "2 lines", "theme": "Dark", "labelWidth": "Dynamic", "status": "Normal" } } ] } ], "notes": [] }, { "codeComponent": "Notification", "generationPriority": 10, "status": "ready", "sourceLayer": "components-tokenized", "memberCount": 1, "rawMemberCount": 1, "totalVariants": 14, "averageTokenCoverage": 100, "mergedVariantAxes": [ { "figmaAxis": "status", "propName": "status", "values": [ "error", "info", "pop confirm", "quick confirm", "secondary warning", "side pop", "warning" ], "sources": [ "Notification" ] }, { "figmaAxis": "theme", "propName": "theme", "values": [ "dark", "light" ], "sources": [ "Notification" ] } ], "members": [ { "figmaName": "Notification", "nodeId": "1408:17154", "pageName": "— — Notifications & Pop box", "filename": "notification__1408_17154.json", "source": "figma-data/normalized/components-tokenized/notification__1408_17154.json", "variantCount": 14, "variantAxes": [ { "figmaAxis": "theme", "propName": "theme", "values": [ "dark", "light" ] }, { "figmaAxis": "status", "propName": "status", "values": [ "warning", "secondary warning", "error", "pop confirm", "quick confirm", "side pop", "info" ] } ], "tokenCoverage": { "totalRefs": 42, "resolvedRefs": 42, "unresolvedRefs": 0, "resolvedPercent": 100, "unresolvedVariableIds": [], "unresolvedSamples": [] }, "codeName": "Notification", "sampleVariants": [ { "nodeId": "1408:17123", "figmaVariantName": "theme=dark, status=warning", "props": { "theme": "dark", "status": "warning" } }, { "nodeId": "1539:31680", "figmaVariantName": "theme=dark, status=secondary warning", "props": { "theme": "dark", "status": "secondary warning" } }, { "nodeId": "1408:17129", "figmaVariantName": "theme=light, status=warning", "props": { "theme": "light", "status": "warning" } }, { "nodeId": "1539:31691", "figmaVariantName": "theme=light, status=secondary warning", "props": { "theme": "light", "status": "secondary warning" } }, { "nodeId": "1408:17125", "figmaVariantName": "theme=dark, status=error", "props": { "theme": "dark", "status": "error" } }, { "nodeId": "1408:17131", "figmaVariantName": "theme=light, status=error", "props": { "theme": "light", "status": "error" } }, { "nodeId": "1408:17126", "figmaVariantName": "theme=dark, status=pop confirm", "props": { "theme": "dark", "status": "pop confirm" } }, { "nodeId": "1408:17132", "figmaVariantName": "theme=light, status=pop confirm", "props": { "theme": "light", "status": "pop confirm" } } ] } ], "notes": [] }, { "codeComponent": "Tooltip", "generationPriority": 11, "status": "ready", "sourceLayer": "components-tokenized", "memberCount": 1, "rawMemberCount": 1, "totalVariants": 12, "averageTokenCoverage": 100, "mergedVariantAxes": [ { "figmaAxis": "dark theme", "propName": "darkTheme", "values": [ "off", "on" ], "sources": [ "Tooltips" ] }, { "figmaAxis": "pointing", "propName": "pointing", "values": [ "Center down", "Center up", "left down", "left up", "right down", "right up" ], "sources": [ "Tooltips" ] } ], "members": [ { "figmaName": "Tooltips", "nodeId": "1408:17152", "pageName": "— — Notifications & Pop box", "filename": "tooltips__1408_17152.json", "source": "figma-data/normalized/components-tokenized/tooltips__1408_17152.json", "variantCount": 12, "variantAxes": [ { "figmaAxis": "dark theme", "propName": "darkTheme", "values": [ "on", "off" ] }, { "figmaAxis": "pointing", "propName": "pointing", "values": [ "left down", "Center down", "right down", "left up", "Center up", "right up" ] } ], "tokenCoverage": { "totalRefs": 12, "resolvedRefs": 12, "unresolvedRefs": 0, "resolvedPercent": 100, "unresolvedVariableIds": [], "unresolvedSamples": [] }, "codeName": "Tooltips", "sampleVariants": [ { "nodeId": "1408:17135", "figmaVariantName": "dark theme=on, pointing=left down", "props": { "darkTheme": "on", "pointing": "left down" } }, { "nodeId": "1669:28011", "figmaVariantName": "dark theme=off, pointing=left down", "props": { "darkTheme": "off", "pointing": "left down" } }, { "nodeId": "2514:63789", "figmaVariantName": "dark theme=on, pointing=Center down", "props": { "darkTheme": "on", "pointing": "Center down" } }, { "nodeId": "2514:63798", "figmaVariantName": "dark theme=off, pointing=Center down", "props": { "darkTheme": "off", "pointing": "Center down" } }, { "nodeId": "1408:17137", "figmaVariantName": "dark theme=on, pointing=right down", "props": { "darkTheme": "on", "pointing": "right down" } }, { "nodeId": "1669:28024", "figmaVariantName": "dark theme=off, pointing=right down", "props": { "darkTheme": "off", "pointing": "right down" } }, { "nodeId": "1408:17139", "figmaVariantName": "dark theme=on, pointing=left up", "props": { "darkTheme": "on", "pointing": "left up" } }, { "nodeId": "1669:28016", "figmaVariantName": "dark theme=off, pointing=left up", "props": { "darkTheme": "off", "pointing": "left up" } } ] } ], "notes": [] }, { "codeComponent": "BreadcrumbItem", "generationPriority": 12, "status": "ready", "sourceLayer": "components-tokenized", "memberCount": 1, "rawMemberCount": 1, "totalVariants": 4, "averageTokenCoverage": 100, "mergedVariantAxes": [ { "figmaAxis": "state", "propName": "state", "values": [ "current", "Default", "disabled", "hover" ], "sources": [ "Breadcrumb/Item" ] } ], "members": [ { "figmaName": "Breadcrumb/Item", "nodeId": "5003:7495", "pageName": "— — Other Components", "filename": "breadcrumb_item__5003_7495.json", "source": "figma-data/normalized/components-tokenized/breadcrumb_item__5003_7495.json", "variantCount": 4, "variantAxes": [ { "figmaAxis": "state", "propName": "state", "values": [ "Default", "hover", "current", "disabled" ] } ], "tokenCoverage": { "totalRefs": 4, "resolvedRefs": 4, "unresolvedRefs": 0, "resolvedPercent": 100, "unresolvedVariableIds": [], "unresolvedSamples": [] }, "codeName": "BreadcrumbItem", "sampleVariants": [ { "nodeId": "5004:1477", "figmaVariantName": "state=Default", "props": { "state": "Default" } }, { "nodeId": "5003:7483", "figmaVariantName": "state=hover", "props": { "state": "hover" } }, { "nodeId": "5003:7487", "figmaVariantName": "state=current", "props": { "state": "current" } }, { "nodeId": "5003:7491", "figmaVariantName": "state=disabled", "props": { "state": "disabled" } } ] } ], "notes": [] }, { "codeComponent": "Pagination", "generationPriority": 13, "status": "ready", "sourceLayer": "components-tokenized", "memberCount": 1, "rawMemberCount": 1, "totalVariants": 3, "averageTokenCoverage": 100, "mergedVariantAxes": [ { "figmaAxis": "Type", "propName": "type", "values": [ "Classic", "Simple", "Small" ], "sources": [ "Pagination" ] } ], "members": [ { "figmaName": "Pagination", "nodeId": "4894:7210", "pageName": "— — Other Components", "filename": "pagination__4894_7210.json", "source": "figma-data/normalized/components-tokenized/pagination__4894_7210.json", "variantCount": 3, "variantAxes": [ { "figmaAxis": "Type", "propName": "type", "values": [ "Classic", "Small", "Simple" ] } ], "tokenCoverage": { "totalRefs": 3, "resolvedRefs": 3, "unresolvedRefs": 0, "resolvedPercent": 100, "unresolvedVariableIds": [], "unresolvedSamples": [] }, "codeName": "Pagination", "sampleVariants": [ { "nodeId": "4884:7181", "figmaVariantName": "Type=Classic", "props": { "type": "Classic" } }, { "nodeId": "4907:6738", "figmaVariantName": "Type=Small", "props": { "type": "Small" } }, { "nodeId": "4894:7211", "figmaVariantName": "Type=Simple", "props": { "type": "Simple" } } ] } ], "notes": [] }, { "codeComponent": "Progress", "generationPriority": 14, "status": "ready", "sourceLayer": "components-tokenized", "memberCount": 1, "rawMemberCount": 1, "totalVariants": 16, "averageTokenCoverage": 100, "mergedVariantAxes": [ { "figmaAxis": "size", "propName": "size", "values": [ "M", "S" ], "sources": [ "Progress" ] }, { "figmaAxis": "status", "propName": "status", "values": [ "default", "error", "success", "warning" ], "sources": [ "Progress" ] }, { "figmaAxis": "theme", "propName": "theme", "values": [ "dark", "light" ], "sources": [ "Progress" ] } ], "members": [ { "figmaName": "Progress", "nodeId": "4915:7287", "pageName": "— — Other Components", "filename": "progress__4915_7287.json", "source": "figma-data/normalized/components-tokenized/progress__4915_7287.json", "variantCount": 16, "variantAxes": [ { "figmaAxis": "theme", "propName": "theme", "values": [ "dark", "light" ] }, { "figmaAxis": "status", "propName": "status", "values": [ "default", "success", "error", "warning" ] }, { "figmaAxis": "size", "propName": "size", "values": [ "M", "S" ] } ], "tokenCoverage": { "totalRefs": 16, "resolvedRefs": 16, "unresolvedRefs": 0, "resolvedPercent": 100, "unresolvedVariableIds": [], "unresolvedSamples": [] }, "codeName": "Progress", "sampleVariants": [ { "nodeId": "4915:7191", "figmaVariantName": "theme=dark, status=default, size=M", "props": { "theme": "dark", "status": "default", "size": "M" } }, { "nodeId": "4915:7197", "figmaVariantName": "theme=dark, status=default, size=S", "props": { "theme": "dark", "status": "default", "size": "S" } }, { "nodeId": "4915:7239", "figmaVariantName": "theme=light, status=default, size=M", "props": { "theme": "light", "status": "default", "size": "M" } }, { "nodeId": "4915:7245", "figmaVariantName": "theme=light, status=default, size=S", "props": { "theme": "light", "status": "default", "size": "S" } }, { "nodeId": "4915:7203", "figmaVariantName": "theme=dark, status=success, size=M", "props": { "theme": "dark", "status": "success", "size": "M" } }, { "nodeId": "4915:7209", "figmaVariantName": "theme=dark, status=success, size=S", "props": { "theme": "dark", "status": "success", "size": "S" } }, { "nodeId": "4915:7251", "figmaVariantName": "theme=light, status=success, size=M", "props": { "theme": "light", "status": "success", "size": "M" } }, { "nodeId": "4915:7257", "figmaVariantName": "theme=light, status=success, size=S", "props": { "theme": "light", "status": "success", "size": "S" } } ] } ], "notes": [] }, { "codeComponent": "Slider", "generationPriority": 15, "status": "ready", "sourceLayer": "components-tokenized", "memberCount": 1, "rawMemberCount": 1, "totalVariants": 4, "averageTokenCoverage": 100, "mergedVariantAxes": [ { "figmaAxis": "size", "propName": "size", "values": [ "M", "S" ], "sources": [ "Slider" ] }, { "figmaAxis": "theme", "propName": "theme", "values": [ "dark", "light" ], "sources": [ "Slider" ] } ], "members": [ { "figmaName": "Slider", "nodeId": "4934:7206", "pageName": "— — Other Components", "filename": "slider__4934_7206.json", "source": "figma-data/normalized/components-tokenized/slider__4934_7206.json", "variantCount": 4, "variantAxes": [ { "figmaAxis": "theme", "propName": "theme", "values": [ "dark", "light" ] }, { "figmaAxis": "size", "propName": "size", "values": [ "M", "S" ] } ], "tokenCoverage": { "totalRefs": 4, "resolvedRefs": 4, "unresolvedRefs": 0, "resolvedPercent": 100, "unresolvedVariableIds": [], "unresolvedSamples": [] }, "codeName": "Slider", "sampleVariants": [ { "nodeId": "4934:7182", "figmaVariantName": "theme=dark, size=M", "props": { "theme": "dark", "size": "M" } }, { "nodeId": "4934:7188", "figmaVariantName": "theme=dark, size=S", "props": { "theme": "dark", "size": "S" } }, { "nodeId": "4934:7194", "figmaVariantName": "theme=light, size=M", "props": { "theme": "light", "size": "M" } }, { "nodeId": "4934:7200", "figmaVariantName": "theme=light, size=S", "props": { "theme": "light", "size": "S" } } ] } ], "notes": [] }, { "codeComponent": "Rating", "generationPriority": 16, "status": "ready", "sourceLayer": "components-tokenized", "memberCount": 1, "rawMemberCount": 1, "totalVariants": 10, "averageTokenCoverage": 100, "mergedVariantAxes": [ { "figmaAxis": "theme", "propName": "theme", "values": [ "dark", "light" ], "sources": [ "Rating" ] }, { "figmaAxis": "value", "propName": "value", "values": [ "1", "2", "3", "4", "5" ], "sources": [ "Rating" ] } ], "members": [ { "figmaName": "Rating", "nodeId": "4935:7294", "pageName": "— — Other Components", "filename": "rating__4935_7294.json", "source": "figma-data/normalized/components-tokenized/rating__4935_7294.json", "variantCount": 10, "variantAxes": [ { "figmaAxis": "theme", "propName": "theme", "values": [ "dark", "light" ] }, { "figmaAxis": "value", "propName": "value", "values": [ "1", "2", "3", "4", "5" ] } ], "tokenCoverage": { "totalRefs": 0, "resolvedRefs": 0, "unresolvedRefs": 0, "resolvedPercent": 100, "unresolvedVariableIds": [], "unresolvedSamples": [] }, "codeName": "Rating", "sampleVariants": [ { "nodeId": "4935:7184", "figmaVariantName": "theme=dark, value=1", "props": { "theme": "dark", "value": "1" } }, { "nodeId": "4935:7195", "figmaVariantName": "theme=dark, value=2", "props": { "theme": "dark", "value": "2" } }, { "nodeId": "4935:7206", "figmaVariantName": "theme=dark, value=3", "props": { "theme": "dark", "value": "3" } }, { "nodeId": "4935:7217", "figmaVariantName": "theme=dark, value=4", "props": { "theme": "dark", "value": "4" } }, { "nodeId": "4935:7228", "figmaVariantName": "theme=dark, value=5", "props": { "theme": "dark", "value": "5" } }, { "nodeId": "4935:7239", "figmaVariantName": "theme=light, value=1", "props": { "theme": "light", "value": "1" } }, { "nodeId": "4935:7250", "figmaVariantName": "theme=light, value=2", "props": { "theme": "light", "value": "2" } }, { "nodeId": "4935:7261", "figmaVariantName": "theme=light, value=3", "props": { "theme": "light", "value": "3" } } ] } ], "notes": [] }, { "codeComponent": "StepItem", "generationPriority": 17, "status": "ready", "sourceLayer": "components-tokenized", "memberCount": 1, "rawMemberCount": 1, "totalVariants": 9, "averageTokenCoverage": 100, "mergedVariantAxes": [ { "figmaAxis": "direction", "propName": "direction", "values": [ "horizontal", "vertical" ], "sources": [ "Step/Item" ] }, { "figmaAxis": "state", "propName": "state", "values": [ "active", "completed", "pending" ], "sources": [ "Step/Item" ] }, { "figmaAxis": "style", "propName": "style", "values": [ "icon", "number" ], "sources": [ "Step/Item" ] } ], "members": [ { "figmaName": "Step/Item", "nodeId": "4943:7310", "pageName": "— — Other Components", "filename": "step_item__4943_7310.json", "source": "figma-data/normalized/components-tokenized/step_item__4943_7310.json", "variantCount": 9, "variantAxes": [ { "figmaAxis": "direction", "propName": "direction", "values": [ "horizontal", "vertical" ] }, { "figmaAxis": "style", "propName": "style", "values": [ "number", "icon" ] }, { "figmaAxis": "state", "propName": "state", "values": [ "completed", "active", "pending" ] } ], "tokenCoverage": { "totalRefs": 9, "resolvedRefs": 9, "unresolvedRefs": 0, "resolvedPercent": 100, "unresolvedVariableIds": [], "unresolvedSamples": [] }, "codeName": "StepItem", "sampleVariants": [ { "nodeId": "4943:7244", "figmaVariantName": "direction=horizontal, style=number, state=completed", "props": { "direction": "horizontal", "style": "number", "state": "completed" } }, { "nodeId": "4943:7237", "figmaVariantName": "direction=horizontal, style=number, state=active", "props": { "direction": "horizontal", "style": "number", "state": "active" } }, { "nodeId": "4943:7230", "figmaVariantName": "direction=horizontal, style=number, state=pending", "props": { "direction": "horizontal", "style": "number", "state": "pending" } }, { "nodeId": "4943:7299", "figmaVariantName": "direction=horizontal, style=icon, state=completed", "props": { "direction": "horizontal", "style": "icon", "state": "completed" } }, { "nodeId": "4943:7288", "figmaVariantName": "direction=horizontal, style=icon, state=active", "props": { "direction": "horizontal", "style": "icon", "state": "active" } }, { "nodeId": "4943:7277", "figmaVariantName": "direction=horizontal, style=icon, state=pending", "props": { "direction": "horizontal", "style": "icon", "state": "pending" } }, { "nodeId": "4943:7267", "figmaVariantName": "direction=vertical, style=number, state=completed", "props": { "direction": "vertical", "style": "number", "state": "completed" } }, { "nodeId": "4943:7261", "figmaVariantName": "direction=vertical, style=number, state=active", "props": { "direction": "vertical", "style": "number", "state": "active" } } ] } ], "notes": [] }, { "codeComponent": "TabList", "generationPriority": 18, "status": "ready", "sourceLayer": "components-tokenized", "memberCount": 1, "rawMemberCount": 1, "totalVariants": 3, "averageTokenCoverage": 100, "mergedVariantAxes": [ { "figmaAxis": "Type", "propName": "type", "values": [ "Filled", "Line", "Text" ], "sources": [ "Tab List" ] } ], "members": [ { "figmaName": "Tab List", "nodeId": "4452:7148", "pageName": "— — Other Components", "filename": "tab_list__4452_7148.json", "source": "figma-data/normalized/components-tokenized/tab_list__4452_7148.json", "variantCount": 3, "variantAxes": [ { "figmaAxis": "Type", "propName": "type", "values": [ "Line", "Text", "Filled" ] } ], "tokenCoverage": { "totalRefs": 6, "resolvedRefs": 6, "unresolvedRefs": 0, "resolvedPercent": 100, "unresolvedVariableIds": [], "unresolvedSamples": [] }, "codeName": "TabList", "sampleVariants": [ { "nodeId": "4605:7196", "figmaVariantName": "Type=Line", "props": { "type": "Line" } }, { "nodeId": "4265:16115", "figmaVariantName": "Type=Text", "props": { "type": "Text" } }, { "nodeId": "4452:7149", "figmaVariantName": "Type=Filled", "props": { "type": "Filled" } } ] } ], "notes": [] }, { "codeComponent": "TabItem", "generationPriority": 19, "status": "ready", "sourceLayer": "components-tokenized", "memberCount": 1, "rawMemberCount": 1, "totalVariants": 6, "averageTokenCoverage": 100, "mergedVariantAxes": [ { "figmaAxis": "Property 1", "propName": "property1", "values": [ "Active", "Normal" ], "sources": [ "Tab/Item" ] }, { "figmaAxis": "Property 2", "propName": "property2", "values": [ "Green", "White" ], "sources": [ "Tab/Item" ] }, { "figmaAxis": "Type", "propName": "type", "values": [ "Filled", "Line", "Text" ], "sources": [ "Tab/Item" ] } ], "members": [ { "figmaName": "Tab/Item", "nodeId": "4265:16082", "pageName": "— — Other Components", "filename": "tab_item__4265_16082.json", "source": "figma-data/normalized/components-tokenized/tab_item__4265_16082.json", "variantCount": 6, "variantAxes": [ { "figmaAxis": "Property 1", "propName": "property1", "values": [ "Normal", "Active" ] }, { "figmaAxis": "Property 2", "propName": "property2", "values": [ "White", "Green" ] }, { "figmaAxis": "Type", "propName": "type", "values": [ "Line", "Text", "Filled" ] } ], "tokenCoverage": { "totalRefs": 10, "resolvedRefs": 10, "unresolvedRefs": 0, "resolvedPercent": 100, "unresolvedVariableIds": [], "unresolvedSamples": [] }, "codeName": "TabItem", "sampleVariants": [ { "nodeId": "4265:16083", "figmaVariantName": "Property 1=Normal, Property 2=White, Type=Line", "props": { "property1": "Normal", "property2": "White", "type": "Line" } }, { "nodeId": "4605:7204", "figmaVariantName": "Property 1=Active, Property 2=White, Type=Text", "props": { "property1": "Active", "property2": "White", "type": "Text" } }, { "nodeId": "4452:7118", "figmaVariantName": "Property 1=Normal, Property 2=White, Type=Filled", "props": { "property1": "Normal", "property2": "White", "type": "Filled" } }, { "nodeId": "4265:16085", "figmaVariantName": "Property 1=Active, Property 2=Green, Type=Line", "props": { "property1": "Active", "property2": "Green", "type": "Line" } }, { "nodeId": "4452:7116", "figmaVariantName": "Property 1=Active, Property 2=Green, Type=Filled", "props": { "property1": "Active", "property2": "Green", "type": "Filled" } }, { "nodeId": "4265:16087", "figmaVariantName": "Property 1=Active, Property 2=White, Type=Line", "props": { "property1": "Active", "property2": "White", "type": "Line" } } ] } ], "notes": [] }, { "codeComponent": "Table", "generationPriority": 20, "status": "ready", "sourceLayer": "components-tokenized", "memberCount": 1, "rawMemberCount": 1, "totalVariants": 6, "averageTokenCoverage": 100, "mergedVariantAxes": [ { "figmaAxis": "Align", "propName": "align", "values": [ "Center", "Left", "Right" ], "sources": [ "Table" ] }, { "figmaAxis": "Type", "propName": "type", "values": [ "Header", "Tbody" ], "sources": [ "Table" ] } ], "members": [ { "figmaName": "Table", "nodeId": "4265:16131", "pageName": "— — Other Components", "filename": "table__4265_16131.json", "source": "figma-data/normalized/components-tokenized/table__4265_16131.json", "variantCount": 6, "variantAxes": [ { "figmaAxis": "Type", "propName": "type", "values": [ "Header", "Tbody" ] }, { "figmaAxis": "Align", "propName": "align", "values": [ "Left", "Center", "Right" ] } ], "tokenCoverage": { "totalRefs": 6, "resolvedRefs": 6, "unresolvedRefs": 0, "resolvedPercent": 100, "unresolvedVariableIds": [], "unresolvedSamples": [] }, "codeName": "Table", "sampleVariants": [ { "nodeId": "4265:16132", "figmaVariantName": "Type=Header, Align=Left", "props": { "type": "Header", "align": "Left" } }, { "nodeId": "4605:7111", "figmaVariantName": "Type=Header, Align=Center", "props": { "type": "Header", "align": "Center" } }, { "nodeId": "4605:7118", "figmaVariantName": "Type=Header, Align=Right", "props": { "type": "Header", "align": "Right" } }, { "nodeId": "4605:7125", "figmaVariantName": "Type=Tbody, Align=Left", "props": { "type": "Tbody", "align": "Left" } }, { "nodeId": "4265:16167", "figmaVariantName": "Type=Tbody, Align=Center", "props": { "type": "Tbody", "align": "Center" } }, { "nodeId": "4605:7131", "figmaVariantName": "Type=Tbody, Align=Right", "props": { "type": "Tbody", "align": "Right" } } ] } ], "notes": [] }, { "codeComponent": "TopBar", "generationPriority": 21, "status": "ready", "sourceLayer": "components-tokenized", "memberCount": 1, "rawMemberCount": 1, "totalVariants": 2, "averageTokenCoverage": 100, "mergedVariantAxes": [ { "figmaAxis": "Tag", "propName": "tag", "values": [ "After Login", "Before Login" ], "sources": [ "Top bar" ] } ], "members": [ { "figmaName": "Top bar", "nodeId": "4771:7173", "pageName": "— — Other Components", "filename": "top_bar__4771_7173.json", "source": "figma-data/normalized/components-tokenized/top_bar__4771_7173.json", "variantCount": 2, "variantAxes": [ { "figmaAxis": "Tag", "propName": "tag", "values": [ "After Login", "Before Login" ] } ], "tokenCoverage": { "totalRefs": 6, "resolvedRefs": 6, "unresolvedRefs": 0, "resolvedPercent": 100, "unresolvedVariableIds": [], "unresolvedSamples": [] }, "codeName": "TopBar", "sampleVariants": [ { "nodeId": "4771:7174", "figmaVariantName": "Tag=After Login", "props": { "tag": "After Login" } }, { "nodeId": "4771:7226", "figmaVariantName": "Tag=Before Login", "props": { "tag": "Before Login" } } ] } ], "notes": [] } ] }