{ "extractedAt": "2026-06-08T05:06:14.671Z", "figmaFileKey": "YbsPRUVmNdsbN40NNwh1Gn", "figmaName": "Popup Box", "nodeId": "1939:43682", "type": "COMPONENT_SET", "pageId": "1379:4191", "pageName": "— — Notifications & Pop box", "description": "", "key": "196ff739b62d48bc359eaa0236e577ecefae8921", "variants": [ { "id": "1939:43644", "name": "Theme=Dark", "type": "COMPONENT", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "h": 416, "w": 680, "x": -10375, "y": 3201, "pH": 16, "pV": null, "pR": 16, "pB": null, "gap": null, "r": 4, "layoutMode": "VERTICAL", "layoutSizingHorizontal": "FILL", "layoutSizingVertical": "HUG", "primaryAxisSizingMode": null, "counterAxisSizingMode": "FIXED", "subnodeCount": 2, "primaryAxisAlignItems": null, "counterAxisAlignItems": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#1f1f1f", "v": "VariableID:VariableID:1558:94791", "token": { "cssVar": "--color-grey-12", "figmaName": "UX/Grey/grey-12 #1F1F1F", "variableId": "VariableID:1558:94791", "strategy": "normalized-variable-id" } } ], "strokes": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#595959", "v": "VariableID:VariableID:1558:94787", "token": { "cssVar": "--color-grey-8", "figmaName": "UX/Grey/grey-8 #595959", "variableId": "VariableID:1558:94787", "strategy": "normalized-variable-id" } } ], "strokeWeight": 1, "effects": [ { "type": "DROP_SHADOW", "visible": true, "radius": 12, "spread": 4, "blendMode": "NORMAL", "offset": { "x": 0, "y": 5 }, "color": { "hex": "#000000", "opacity": 0.09000000357627869 } }, { "type": "DROP_SHADOW", "visible": true, "radius": 6, "spread": null, "blendMode": "NORMAL", "offset": { "x": 0, "y": 3 }, "color": { "hex": "#000000", "opacity": 0.11999999731779099 } }, { "type": "DROP_SHADOW", "visible": true, "radius": 2, "spread": -2, "blendMode": "NORMAL", "offset": { "x": 0, "y": 1 }, "color": { "hex": "#000000", "opacity": 0.1599999964237213 } } ], "text": { "characters": "Output name xxxx", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "size": 16, "fontFamily": "Roboto", "fontWeight": 600, "lineHeightPx": 24, "letterSpacing": 0, "textCase": null, "textDecoration": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#f8f8f8", "v": "VariableID:VariableID:1558:94782", "token": { "cssVar": "--color-grey-2", "figmaName": "UX/Grey/grey-2 #F8F8F8", "variableId": "VariableID:1558:94782", "strategy": "normalized-variable-id" } } ], "v": null, "compositeToken": null }, "vectorNodeIds": [ "I1869:68901;2043:2464", "I1869:68902;1480:73575", "I1869:68902;1480:73576", "I1869:68902;1480:74296", "I1869:68904;1923:49081;1283:40359", "I1869:68904;1923:49081;1544:33561", "I1869:68904;1923:49082;1436:33905;2107:20124", "I1869:68912;1923:49067;1283:40359", "I1869:68912;1923:49067;1544:33561", "I1869:68913;1923:49067;1283:40359", "I1869:68913;1923:49067;1544:33561", "I1869:68914;1923:49234;1283:40359", "I1869:68914;1923:49234;1544:33561" ], "children": [ { "id": "1869:68899", "name": "popup top bar", "type": "FRAME", "visible": true, "opacity": 1, "w": 648, "h": 40, "x": -10359, "y": 3201, "r": null, "fills": [], "strokes": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#595959", "v": "VariableID:VariableID:1558:94787", "token": { "cssVar": "--color-grey-8", "figmaName": "UX/Grey/grey-8 #595959", "variableId": "VariableID:1558:94787", "strategy": "normalized-variable-id" } } ], "children": [ { "id": "1869:68900", "name": "General", "type": "TEXT", "visible": true, "opacity": 1, "w": 624, "h": 24, "x": -10359, "y": 3209, "r": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#f8f8f8", "v": "VariableID:VariableID:1558:94782", "token": { "cssVar": "--color-grey-2", "figmaName": "UX/Grey/grey-2 #F8F8F8", "variableId": "VariableID:1558:94782", "strategy": "normalized-variable-id" } } ], "strokes": [], "characters": "Output name xxxx" }, { "id": "1869:68901", "name": "icon/PP/Edit", "type": "INSTANCE", "visible": false, "opacity": 1, "w": 16, "h": 16, "x": -10263, "y": 3201, "r": null, "fills": [], "strokes": [], "componentId": "93:3246" }, { "id": "1869:68902", "name": "icon/Edit/Close", "type": "INSTANCE", "visible": true, "opacity": 1, "w": 16, "h": 16, "x": -9727, "y": 3213, "r": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#9e9e9e", "v": "VariableID:VariableID:2611:57617", "token": { "cssVar": "--icon-default", "figmaName": "Color Type/Icon/Default", "variableId": "VariableID:2611:57617", "strategy": "normalized-variable-id" } } ], "strokes": [], "componentId": "1155:24553" } ] }, { "id": "1869:68903", "name": "Content", "type": "FRAME", "visible": true, "opacity": 1, "w": 648, "h": 376, "x": -10359, "y": 3241, "r": null, "fills": [], "strokes": [], "children": [ { "id": "4741:15545", "name": "Popup_Box_Content", "type": "SLOT", "visible": true, "opacity": 1, "w": 632, "h": 272, "x": -10351, "y": 3265, "r": null, "fills": [], "strokes": [], "children": [ { "id": "1869:68904", "name": "Form Item", "type": "INSTANCE", "visible": true, "opacity": 1, "w": 632, "h": 64, "x": -10351, "y": 3265, "r": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#9e9e9e", "v": "VariableID:VariableID:1558:94786", "token": { "cssVar": "--color-grey-6", "figmaName": "UX/Grey/grey-6 #9E9E9E", "variableId": "VariableID:1558:94786", "strategy": "normalized-variable-id" } } ], "strokes": [], "componentId": "1923:49077" }, { "id": "1869:68912", "name": "Form Item", "type": "INSTANCE", "visible": true, "opacity": 1, "w": 632, "h": 64, "x": -10351, "y": 3345, "r": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#9e9e9e", "v": "VariableID:VariableID:1558:94786", "token": { "cssVar": "--color-grey-6", "figmaName": "UX/Grey/grey-6 #9E9E9E", "variableId": "VariableID:1558:94786", "strategy": "normalized-variable-id" } } ], "strokes": [], "componentId": "1923:49063" }, { "id": "1869:68913", "name": "Form Item", "type": "INSTANCE", "visible": true, "opacity": 1, "w": 632, "h": 64, "x": -10351, "y": 3425, "r": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#9e9e9e", "v": "VariableID:VariableID:1558:94786", "token": { "cssVar": "--color-grey-6", "figmaName": "UX/Grey/grey-6 #9E9E9E", "variableId": "VariableID:1558:94786", "strategy": "normalized-variable-id" } } ], "strokes": [], "componentId": "1923:49063" }, { "id": "1869:68914", "name": "Form Item", "type": "INSTANCE", "visible": true, "opacity": 1, "w": 632, "h": 32, "x": -10351, "y": 3505, "r": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#9e9e9e", "v": "VariableID:VariableID:1558:94786", "token": { "cssVar": "--color-grey-6", "figmaName": "UX/Grey/grey-6 #9E9E9E", "variableId": "VariableID:1558:94786", "strategy": "normalized-variable-id" } } ], "strokes": [], "componentId": "1923:49230" } ] }, { "id": "1869:68915", "name": "popup tool bar", "type": "FRAME", "visible": true, "opacity": 1, "w": 632, "h": 32, "x": -10351, "y": 3561, "r": null, "fills": [], "strokes": [], "children": [ { "id": "1869:68916", "name": "button/no icon", "type": "INSTANCE", "visible": false, "opacity": 1, "w": 80, "h": 32, "x": -9867, "y": 3585, "r": 4, "fills": [], "strokes": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#33ab4f" } ], "componentId": "189:25673" }, { "id": "1869:68917", "name": "Button/dark M", "type": "INSTANCE", "visible": true, "opacity": 1, "w": 76, "h": 32, "x": -9887, "y": 3561, "r": 4, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#cccccc", "v": "VariableID:VariableID:1558:94785", "token": { "cssVar": "--color-grey-5", "figmaName": "UX/Grey/grey-5 #CCCCCC", "variableId": "VariableID:1558:94785", "strategy": "normalized-variable-id" } } ], "strokes": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#434343", "v": "VariableID:VariableID:1558:94788", "token": { "cssVar": "--color-grey-9", "figmaName": "UX/Grey/grey-9 #434343", "variableId": "VariableID:1558:94788", "strategy": "normalized-variable-id" } } ], "componentId": "314:47458" }, { "id": "1869:68918", "name": "Button/dark M", "type": "INSTANCE", "visible": true, "opacity": 1, "w": 76, "h": 32, "x": -9795, "y": 3561, "r": 4, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#2fb54e", "v": "VariableID:VariableID:1626:104889", "token": { "cssVar": "--brand", "figmaName": "UX/Brand/Brand", "variableId": "VariableID:1626:104889", "strategy": "normalized-variable-id" } } ], "strokes": [], "componentId": "314:47437" } ] } ] } ], "description": null, "componentSetId": "1939:43682", "componentPropertyReferences": null }, { "id": "1939:43606", "name": "Theme=Light", "type": "COMPONENT", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "h": 416, "w": 680, "x": -10375, "y": 3657, "pH": 16, "pV": null, "pR": 16, "pB": null, "gap": null, "r": 4, "layoutMode": "VERTICAL", "layoutSizingHorizontal": "FILL", "layoutSizingVertical": "HUG", "primaryAxisSizingMode": null, "counterAxisSizingMode": "FIXED", "subnodeCount": 2, "primaryAxisAlignItems": null, "counterAxisAlignItems": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#f8f8f8", "v": "VariableID:VariableID:1558:94782", "token": { "cssVar": "--color-grey-2", "figmaName": "UX/Grey/grey-2 #F8F8F8", "variableId": "VariableID:1558:94782", "strategy": "normalized-variable-id" } } ], "strokes": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#f0f0f0", "v": "VariableID:VariableID:1558:94783", "token": { "cssVar": "--color-grey-3", "figmaName": "UX/Grey/grey-3 #F0F0F0", "variableId": "VariableID:1558:94783", "strategy": "normalized-variable-id" } } ], "strokeWeight": 1, "effects": [ { "type": "DROP_SHADOW", "visible": true, "radius": 28, "spread": 8, "blendMode": "NORMAL", "offset": { "x": 0, "y": 9 }, "color": { "hex": "#000000", "opacity": 0.05000000074505806 } }, { "type": "DROP_SHADOW", "visible": true, "radius": 16, "spread": null, "blendMode": "NORMAL", "offset": { "x": 0, "y": 6 }, "color": { "hex": "#000000", "opacity": 0.07999999821186066 } }, { "type": "DROP_SHADOW", "visible": true, "radius": 6, "spread": -4, "blendMode": "NORMAL", "offset": { "x": 0, "y": 3 }, "color": { "hex": "#000000", "opacity": 0.11999999731779099 } } ], "text": { "characters": "Output name xxxx", "visible": true, "opacity": 1, "blendMode": "PASS_THROUGH", "size": 16, "fontFamily": "Roboto", "fontWeight": 600, "lineHeightPx": 24, "letterSpacing": 0, "textCase": null, "textDecoration": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#141414", "v": "VariableID:VariableID:1558:94792", "token": { "cssVar": "--color-grey-13", "figmaName": "UX/Grey/grey-13 #141414", "variableId": "VariableID:1558:94792", "strategy": "normalized-variable-id" } } ], "v": null, "compositeToken": null }, "vectorNodeIds": [ "I1939:43264;2043:2464", "I1939:43265;1480:73575", "I1939:43265;1480:73576", "I1939:43265;1480:74296", "I4993:1296;1923:49336;1283:40359", "I4993:1296;1923:49336;1544:33561", "I4993:1296;1923:49337;1804:26930;2107:20124", "I4993:1297;1923:49322;1283:40359", "I4993:1297;1923:49322;1544:33561", "I4993:1298;1923:49322;1283:40359", "I4993:1298;1923:49322;1544:33561", "I4993:1299;1923:49489;1283:40359", "I4993:1299;1923:49489;1544:33561" ], "children": [ { "id": "1939:43262", "name": "popup top bar", "type": "FRAME", "visible": true, "opacity": 1, "w": 648, "h": 40, "x": -10359, "y": 3657, "r": null, "fills": [], "strokes": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#cccccc", "v": "VariableID:VariableID:1558:94785", "token": { "cssVar": "--color-grey-5", "figmaName": "UX/Grey/grey-5 #CCCCCC", "variableId": "VariableID:1558:94785", "strategy": "normalized-variable-id" } } ], "children": [ { "id": "1939:43263", "name": "General", "type": "TEXT", "visible": true, "opacity": 1, "w": 624, "h": 24, "x": -10359, "y": 3665, "r": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#141414", "v": "VariableID:VariableID:1558:94792", "token": { "cssVar": "--color-grey-13", "figmaName": "UX/Grey/grey-13 #141414", "variableId": "VariableID:1558:94792", "strategy": "normalized-variable-id" } } ], "strokes": [], "characters": "Output name xxxx" }, { "id": "1939:43264", "name": "icon/PP/Edit", "type": "INSTANCE", "visible": false, "opacity": 1, "w": 16, "h": 16, "x": -10263, "y": 3657, "r": null, "fills": [], "strokes": [], "componentId": "93:3246" }, { "id": "1939:43265", "name": "icon/Edit/Close", "type": "INSTANCE", "visible": true, "opacity": 1, "w": 16, "h": 16, "x": -9727, "y": 3669, "r": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#dbdbdb", "v": "VariableID:VariableID:1558:94784", "token": { "cssVar": "--color-grey-4", "figmaName": "UX/Grey/grey-4 #DBDBDB", "variableId": "VariableID:1558:94784", "strategy": "normalized-variable-id" } } ], "strokes": [], "componentId": "1155:24553" } ] }, { "id": "1939:43266", "name": "Content", "type": "FRAME", "visible": true, "opacity": 1, "w": 648, "h": 376, "x": -10359, "y": 3697, "r": null, "fills": [], "strokes": [], "children": [ { "id": "4993:1295", "name": "Popup_Box_Content", "type": "SLOT", "visible": true, "opacity": 1, "w": 632, "h": 272, "x": -10351, "y": 3721, "r": null, "fills": [], "strokes": [], "children": [ { "id": "4993:1296", "name": "Form Item", "type": "INSTANCE", "visible": true, "opacity": 1, "w": 632, "h": 64, "x": -10351, "y": 3721, "r": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#434343", "v": "VariableID:VariableID:1558:94788", "token": { "cssVar": "--color-grey-9", "figmaName": "UX/Grey/grey-9 #434343", "variableId": "VariableID:1558:94788", "strategy": "normalized-variable-id" } } ], "strokes": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#cccccc", "v": "VariableID:VariableID:1558:94785", "token": { "cssVar": "--color-grey-5", "figmaName": "UX/Grey/grey-5 #CCCCCC", "variableId": "VariableID:1558:94785", "strategy": "normalized-variable-id" } } ], "componentId": "1923:49332" }, { "id": "4993:1297", "name": "Form Item", "type": "INSTANCE", "visible": true, "opacity": 1, "w": 632, "h": 64, "x": -10351, "y": 3801, "r": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#434343", "v": "VariableID:VariableID:1558:94788", "token": { "cssVar": "--color-grey-9", "figmaName": "UX/Grey/grey-9 #434343", "variableId": "VariableID:1558:94788", "strategy": "normalized-variable-id" } } ], "strokes": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#cccccc", "v": "VariableID:VariableID:1558:94785", "token": { "cssVar": "--color-grey-5", "figmaName": "UX/Grey/grey-5 #CCCCCC", "variableId": "VariableID:1558:94785", "strategy": "normalized-variable-id" } } ], "componentId": "1923:49318" }, { "id": "4993:1298", "name": "Form Item", "type": "INSTANCE", "visible": true, "opacity": 1, "w": 632, "h": 64, "x": -10351, "y": 3881, "r": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#434343", "v": "VariableID:VariableID:1558:94788", "token": { "cssVar": "--color-grey-9", "figmaName": "UX/Grey/grey-9 #434343", "variableId": "VariableID:1558:94788", "strategy": "normalized-variable-id" } } ], "strokes": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#cccccc", "v": "VariableID:VariableID:1558:94785", "token": { "cssVar": "--color-grey-5", "figmaName": "UX/Grey/grey-5 #CCCCCC", "variableId": "VariableID:1558:94785", "strategy": "normalized-variable-id" } } ], "componentId": "1923:49318" }, { "id": "4993:1299", "name": "Form Item", "type": "INSTANCE", "visible": true, "opacity": 1, "w": 632, "h": 32, "x": -10351, "y": 3961, "r": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#434343", "v": "VariableID:VariableID:1558:94788", "token": { "cssVar": "--color-grey-9", "figmaName": "UX/Grey/grey-9 #434343", "variableId": "VariableID:1558:94788", "strategy": "normalized-variable-id" } } ], "strokes": [], "componentId": "1923:49485" } ] }, { "id": "1939:43268", "name": "Rectangle", "type": "RECTANGLE", "visible": false, "opacity": 1, "w": 632, "h": 2, "x": -10351, "y": 3806, "r": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#353535", "v": "VariableID:VariableID:1558:94789", "token": { "cssVar": "--color-grey-10", "figmaName": "UX/Grey/grey-10 #353535", "variableId": "VariableID:1558:94789", "strategy": "normalized-variable-id" } } ], "strokes": [] }, { "id": "1939:43269", "name": "Frame 2163", "type": "FRAME", "visible": false, "opacity": 1, "w": 632, "h": 36, "x": -10351, "y": 3832, "r": null, "fills": [], "strokes": [], "children": [ { "id": "1939:43270", "name": "Server", "type": "TEXT", "visible": true, "opacity": 1, "w": 632, "h": 20, "x": -10351, "y": 3832, "r": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#9e9e9e", "v": "VariableID:VariableID:1558:94786", "token": { "cssVar": "--color-grey-6", "figmaName": "UX/Grey/grey-6 #9E9E9E", "variableId": "VariableID:1558:94786", "strategy": "normalized-variable-id" } } ], "strokes": [], "characters": "Server" }, { "id": "1939:43271", "name": "Frame 2146", "type": "FRAME", "visible": true, "opacity": 1, "w": 632, "h": 16, "x": -10351, "y": 3852, "r": null, "fills": [], "strokes": [], "children": [ { "id": "1939:43272", "name": "http://", "type": "TEXT", "visible": true, "opacity": 1, "w": 33, "h": 16, "x": -10351, "y": 3852, "r": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#9e9e9e", "v": "VariableID:VariableID:1558:94786", "token": { "cssVar": "--color-grey-6", "figmaName": "UX/Grey/grey-6 #9E9E9E", "variableId": "VariableID:1558:94786", "strategy": "normalized-variable-id" } } ], "strokes": [], "characters": "http://" }, { "id": "1939:43273", "name": ".tvustream.com:8288/", "type": "TEXT", "visible": true, "opacity": 1, "w": 119, "h": 16, "x": -10318, "y": 3852, "r": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#9e9e9e", "v": "VariableID:VariableID:1558:94786", "token": { "cssVar": "--color-grey-6", "figmaName": "UX/Grey/grey-6 #9E9E9E", "variableId": "VariableID:1558:94786", "strategy": "normalized-variable-id" } } ], "strokes": [], "characters": ".tvustream.com:8288/" }, { "id": "1939:43274", "name": ".m3u8", "type": "TEXT", "visible": true, "opacity": 1, "w": 34, "h": 16, "x": -10199, "y": 3852, "r": null, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#9e9e9e", "v": "VariableID:VariableID:1558:94786", "token": { "cssVar": "--color-grey-6", "figmaName": "UX/Grey/grey-6 #9E9E9E", "variableId": "VariableID:1558:94786", "strategy": "normalized-variable-id" } } ], "strokes": [], "characters": ".m3u8" } ] } ] }, { "id": "1939:43599", "name": "popup tool bar", "type": "FRAME", "visible": true, "opacity": 1, "w": 632, "h": 32, "x": -10351, "y": 4017, "r": null, "fills": [], "strokes": [], "children": [ { "id": "1939:43600", "name": "button/no icon", "type": "INSTANCE", "visible": false, "opacity": 1, "w": 80, "h": 32, "x": -9867, "y": 4041, "r": 4, "fills": [], "strokes": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#33ab4f" } ], "componentId": "189:25673" }, { "id": "1939:43601", "name": "Button/light M", "type": "INSTANCE", "visible": true, "opacity": 1, "w": 76, "h": 32, "x": -9884, "y": 4017, "r": 4, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#434343", "v": "VariableID:VariableID:1558:94788", "token": { "cssVar": "--color-grey-9", "figmaName": "UX/Grey/grey-9 #434343", "variableId": "VariableID:1558:94788", "strategy": "normalized-variable-id" } } ], "strokes": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#dbdbdb", "v": "VariableID:VariableID:1558:94784", "token": { "cssVar": "--color-grey-4", "figmaName": "UX/Grey/grey-4 #DBDBDB", "variableId": "VariableID:1558:94784", "strategy": "normalized-variable-id" } } ], "componentId": "314:46908" }, { "id": "1939:43602", "name": "Button/light M", "type": "INSTANCE", "visible": true, "opacity": 1, "w": 73, "h": 32, "x": -9792, "y": 4017, "r": 4, "fills": [ { "type": "SOLID", "visible": true, "opacity": 1, "blendMode": "NORMAL", "hex": "#299f45", "v": "VariableID:VariableID:1626:104889", "token": { "cssVar": "--brand", "figmaName": "UX/Brand/Brand", "variableId": "VariableID:1626:104889", "strategy": "normalized-variable-id" } } ], "strokes": [], "componentId": "314:46878" } ] } ] } ], "description": null, "componentSetId": "1939:43682", "componentPropertyReferences": null } ], "tokenizedAt": "2026-06-09T05:12:24.741Z", "tokenizationStrategy": "variable-id-first-then-hex-fallback", "source": { "sourceLayer": "figma-data/raw/components", "sourceFile": "figma-data/raw/components/popup_box__1939_43682.json", "rawExtractedAt": "2026-06-08T05:06:14.671Z", "rawNodeId": "1939:43682", "rawSha256": "0c9596b3092415aab932102730012c8c3252e9eb7af5b9f3c2464897ce0a8490" } }