{ "id": "76b155a0893154", "version": "0.0.6", "metadata": {}, "name": "module", "children": [ { "id": "5c9686b875966", "is": "50e32bec2591", "label": "Dropdown", "name": "component-instance", "attributes": {}, "style": {}, "children": [ { "id": "5c9686b876903", "variantId": null, "propertyName": "text", "targetIdPath": [ "67e386c7935" ], "value": "super long label that should ellipsis if it overflows", "name": "override", "children": [] } ], "metadata": { "bounds": { "left": 357, "top": 282, "right": 558, "bottom": 524.2360321797468 } }, "variant": {} }, { "id": "f89d0ee73352", "is": "50e32bec2591", "label": "Filtering", "name": "component-instance", "attributes": {}, "style": {}, "children": [], "metadata": { "bounds": { "left": 132, "top": 580, "right": 333, "bottom": 822.2360321797469 } }, "variant": { "69c680a12": true } }, { "label": "Dropdown", "is": "div", "style": { "width": "100%", "position": "relative", "outline": "none" }, "attributes": {}, "id": "50e32bec2591", "name": "component", "children": [ { "id": "782254018619", "variant": {}, "is": "9b7b527f175442", "name": "component-instance", "attributes": {}, "style": {}, "children": [ { "id": "69c680a14", "variantId": "69c680a12", "propertyName": "style", "targetIdPath": [ "67e386c7935" ], "value": { "display": "block", "cursor": "default" }, "name": "override", "children": [] }, { "slotId": "c00d8561361", "id": "ebe8eef3202", "children": [ { "id": "87568a7232485", "children": [ { "id": "8b8bbe2c232831", "label": "button", "is": "div", "name": "element", "attributes": {}, "style": { "box-sizing": "border-box", "display": "flex", "align-items": "center", "user-select": "none", "background": "rgba(255, 255, 255, 1)", "cursor": "default", "padding-left": "6px", "padding-top": "4px", "padding-right": "6px", "padding-bottom": "4px" }, "children": [ { "id": "69c680a11", "is": "7149f8199122", "name": "component-instance", "attributes": { "placeholder": "filter" }, "style": { "width": "100%", "padding": "4px 8px", "border-radius": "0px", "border": "none", "box-sizing": "border-box", "display": "none", "padding-top": "0px", "padding-right": "0px", "padding-bottom": "0px", "padding-left": "0px", "box-shadow": "unset" }, "children": [ { "id": "69c680a13", "variantId": "69c680a12", "propertyName": "style", "targetIdPath": [], "value": { "border-radius": "0px", "border": "none", "display": "block" }, "name": "override", "children": [] } ], "metadata": { "bounds": { "left": 435.5632830380766, "top": 172.7598749633466, "right": 535.5632830380766, "bottom": 201.7956837222485 } }, "label": "filter input" }, { "id": "67e386c7935", "name": "text", "label": "Label", "value": "Label", "style": { "display": "inline-block", "width": "100%" }, "children": [], "metadata": {}, "styleMixins": { "dc3b39eb1275": { "priority": 0 }, "61225017220906": { "priority": 1 } } }, { "id": "628c465922", "variant": {}, "is": "e186b96e4079", "name": "component-instance", "attributes": {}, "style": { "height": "10px", "position": "relative", "opacity": "0.4", "top": "1px" }, "children": [], "metadata": {} } ], "metadata": {}, "styleMixins": { "c29da5f4213993": { "priority": 0 } } } ], "metadata": {}, "name": "slot", "label": "button" } ], "metadata": {}, "name": "plug" }, { "slotId": "e6638364254", "id": "e6638364407", "children": [ { "id": "806ffd0684", "label": "Menu", "is": "div", "name": "element", "attributes": {}, "style": { "box-sizing": "border-box", "display": "block", "max-height": "200px", "margin-top": "8px", "border-bottom-left-radius": "2px", "border-top-left-radius": "2px", "border-top-right-radius": "2px", "border-bottom-right-radius": "2px", "border": "1px solid rgba(238, 238, 238, 1)", "overflow-y": "scroll" }, "children": [ { "label": "options", "id": "806ffd06590", "children": [ { "id": "9c4dcc9c484", "is": "8b8bbe2c859177", "name": "component-instance", "attributes": {}, "style": {}, "children": [], "metadata": { "bounds": { "left": 341, "top": 451.64745698660715, "right": 542, "bottom": 485.64745698660715 } } }, { "id": "9c4dcc9c578", "is": "8b8bbe2c859177", "name": "component-instance", "attributes": {}, "style": {}, "children": [], "metadata": { "bounds": { "left": 341, "top": 451.64745698660715, "right": 542, "bottom": 485.64745698660715 } }, "variant": { "cd433e9f899": true } }, { "id": "9c4dcc9c678", "is": "8b8bbe2c859177", "name": "component-instance", "attributes": {}, "style": {}, "children": [], "metadata": { "bounds": { "left": 341, "top": 451.64745698660715, "right": 542, "bottom": 485.64745698660715 } } }, { "id": "9c4dcc9c784", "is": "8b8bbe2c859177", "name": "component-instance", "attributes": {}, "style": {}, "children": [], "metadata": { "bounds": { "left": 341, "top": 451.64745698660715, "right": 542, "bottom": 485.64745698660715 } }, "variant": { "cd433e9f899": true } }, { "id": "9c4dcc9c896", "is": "8b8bbe2c859177", "name": "component-instance", "attributes": {}, "style": {}, "children": [], "metadata": { "bounds": { "left": 341, "top": 451.64745698660715, "right": 542, "bottom": 485.64745698660715 } } }, { "id": "9c4dcc9c1014", "is": "8b8bbe2c859177", "name": "component-instance", "attributes": {}, "style": {}, "children": [], "metadata": { "bounds": { "left": 341, "top": 451.64745698660715, "right": 542, "bottom": 485.64745698660715 } }, "variant": { "cd433e9f899": true } }, { "id": "9c4dcc9c1138", "is": "8b8bbe2c859177", "name": "component-instance", "attributes": {}, "style": {}, "children": [], "metadata": { "bounds": { "left": 341, "top": 451.64745698660715, "right": 542, "bottom": 485.64745698660715 } } }, { "id": "9c4dcc9c1268", "is": "8b8bbe2c859177", "name": "component-instance", "attributes": {}, "style": {}, "children": [], "metadata": { "bounds": { "left": 341, "top": 451.64745698660715, "right": 542, "bottom": 485.64745698660715 } }, "variant": { "cd433e9f899": true } }, { "id": "9c4dcc9c1404", "is": "8b8bbe2c859177", "name": "component-instance", "attributes": {}, "style": {}, "children": [], "metadata": { "bounds": { "left": 341, "top": 451.64745698660715, "right": 542, "bottom": 485.64745698660715 } } }, { "id": "e6638364329", "is": "8b8bbe2c859177", "name": "component-instance", "attributes": {}, "style": {}, "children": [], "metadata": { "bounds": { "left": 341, "top": 451.64745698660715, "right": 542, "bottom": 485.64745698660715 } }, "variant": { "cd433e9f899": true } }, { "id": "d5b0b72c121", "is": "8b8bbe2c859177", "name": "component-instance", "attributes": {}, "style": {}, "children": [], "metadata": { "bounds": { "left": 341, "top": 451.64745698660715, "right": 542, "bottom": 485.64745698660715 } } }, { "id": "d5b0b72c343", "is": "8b8bbe2c859177", "name": "component-instance", "attributes": {}, "style": {}, "children": [], "metadata": { "bounds": { "left": 341, "top": 451.64745698660715, "right": 542, "bottom": 485.64745698660715 } }, "variant": { "cd433e9f899": true } }, { "id": "d5b0b72c263", "is": "8b8bbe2c859177", "name": "component-instance", "attributes": {}, "style": {}, "children": [], "metadata": { "bounds": { "left": 341, "top": 451.64745698660715, "right": 542, "bottom": 485.64745698660715 } } }, { "id": "d5b0b72c189", "is": "8b8bbe2c859177", "name": "component-instance", "attributes": {}, "style": {}, "children": [], "metadata": { "bounds": { "left": 341, "top": 451.64745698660715, "right": 542, "bottom": 485.64745698660715 } }, "variant": { "cd433e9f899": true } } ], "metadata": {}, "name": "slot" } ], "metadata": { "bounds": { "left": 382.50305721861076, "top": 371.29600643511884, "right": 482.50305721861076, "bottom": 471.29600643511884 } }, "styleMixins": { "fb4d37ca18486": { "priority": 0 } } } ], "metadata": {}, "name": "plug" }, { "id": "22702c5f14240", "variantId": "22702c5f2706", "propertyName": "style", "targetIdPath": [ "67e386c7935" ], "value": { "color": "rgba(223, 18, 233, 1)" }, "name": "override", "children": [] }, { "id": "c29da5f4830054", "propertyName": "styleMixins", "targetIdPath": [ "67e386c7935" ], "value": { "1538744319106": { "priority": 0 }, "1538744322303": { "priority": 0 }, "1538744324123": { "priority": 0 }, "1538744362709": { "priority": 0 }, "1538744363813": { "priority": 0 }, "1538744381364": { "priority": 0 } }, "name": "override", "children": [] } ], "metadata": { "bounds": { "left": 237, "top": 371, "right": 337, "bottom": 471 } }, "label": "Popover" }, { "id": "69c680a12", "name": "variant", "label": "filterable", "isDefault": false, "children": [], "metadata": {} }, { "id": "be1fb4991", "variantId": "69c680a12", "propertyName": "style", "targetIdPath": [ "67e386c7935" ], "value": { "display": "none" }, "name": "override", "children": [] }, { "id": "be1fb4992", "variantId": null, "propertyName": "style", "targetIdPath": [], "value": { "font-size": "11px" }, "name": "override", "children": [] }, { "id": "be1fb4994", "variantId": "69c680a12", "propertyName": "style", "targetIdPath": [ "69c680a11" ], "value": { "display": "block" }, "name": "override", "children": [] }, { "id": "22702c5f2706", "name": "variant", "label": "special", "isDefault": true, "children": [], "metadata": {} }, { "id": "22702c5f3079", "variantId": "22702c5f2706", "propertyName": "style", "targetIdPath": [], "value": {}, "name": "override", "children": [] } ], "metadata": { "bounds": { "left": 133, "top": 279, "right": 334, "bottom": 521.2360321797468 } }, "controllers": [ "./controller.tsx" ], "variant": {} }, { "id": "83d6aa885923", "variant": {}, "is": "50e32bec2591", "name": "component-instance", "attributes": {}, "style": { "background": "rgba(105, 105, 105, 1)" }, "children": [ { "id": "83d6aa8811798", "propertyName": "style", "targetIdPath": [ "8b8bbe2c432477" ], "value": { "display": "block" }, "name": "override", "children": [] }, { "id": "83d6aa8833337", "propertyName": "style", "targetIdPath": [ "8b8bbe2c237350" ], "value": { "background": "rgba(250, 250, 250, 250)", "border": "1px solid rgba(0,0,0,0.08)", "box-sizing": "border-box", "max-height": "200px", "overflow": "scroll" }, "name": "override", "children": [] }, { "id": "83d6aa8868582", "propertyName": "style", "targetIdPath": [ "8b8bbe2c859178" ], "value": {}, "name": "override", "children": [] }, { "id": "83d6aa88244809", "propertyName": "style", "targetIdPath": [ "8b8bbe2c882925" ], "value": { "border-bottom": "none" }, "name": "override", "children": [] }, { "id": "93b595c642", "propertyName": "style", "targetIdPath": [ "67e386c7935" ], "value": { "use-select": "none" }, "name": "override", "children": [] }, { "id": "7822540130313", "propertyName": "style", "targetIdPath": [ "782254018619", "ddec6a12139578" ], "value": { "display": "block", "width": "100%" }, "name": "override", "children": [] }, { "id": "3041a301150368", "propertyName": "style", "targetIdPath": [ "782254018619", "ddec6a12139578", "8b8bbe2c237350" ], "value": {}, "name": "override", "children": [] }, { "id": "cd433e9f2973", "propertyName": "variant", "targetIdPath": [ "9c4dcc9c578" ], "value": { "cd433e9f899": true, "cd433e9f6531": true }, "name": "override", "children": [] }, { "id": "cd433e9f3270", "propertyName": "variant", "targetIdPath": [ "9c4dcc9c784" ], "value": { "cd433e9f899": true }, "name": "override", "children": [] }, { "id": "cd433e9f3567", "propertyName": "variant", "targetIdPath": [ "9c4dcc9c1014" ], "value": { "cd433e9f899": true }, "name": "override", "children": [] }, { "id": "cd433e9f3864", "propertyName": "variant", "targetIdPath": [ "9c4dcc9c1268" ], "value": { "cd433e9f899": true }, "name": "override", "children": [] }, { "id": "cd433e9f4161", "propertyName": "variant", "targetIdPath": [ "9c4dcc9c1404" ], "value": { "cd433e9f899": true }, "name": "override", "children": [] }, { "id": "cd433e9f4458", "propertyName": "variant", "targetIdPath": [ "e6638364329" ], "value": { "cd433e9f899": false }, "name": "override", "children": [] }, { "id": "cd433e9f8013", "propertyName": "variant", "targetIdPath": [ "9c4dcc9c484" ], "value": { "cd433e9f6531": true }, "name": "override", "children": [] }, { "id": "cd433e9f8606", "variantId": null, "propertyName": "text", "targetIdPath": [ "9c4dcc9c484", "8b8bbe2c859176" ], "value": "variable 1", "name": "override", "children": [] }, { "id": "cd433e9f11567", "variantId": null, "propertyName": "text", "targetIdPath": [ "9c4dcc9c578", "8b8bbe2c859176" ], "value": "variable 2", "name": "override", "children": [] } ], "metadata": { "bounds": { "left": 636, "top": 284, "right": 838, "bottom": 763.2949139732143 } }, "label": "Dropdown open" }, { "id": "75283639905", "label": "Element", "is": "div", "name": "element", "attributes": {}, "style": { "box-sizing": "border-box", "display": "block" }, "children": [ { "id": "752836391500", "is": "50e32bec2591", "name": "component-instance", "attributes": {}, "style": {}, "children": [ { "id": "752836392602", "propertyName": "variant", "targetIdPath": [ "782254018619" ], "value": { "e691a1d98281": true }, "name": "override", "children": [] }, { "id": "752836392970", "propertyName": "style", "targetIdPath": [ "782254018619", "ddec6a12139578" ], "value": { "display": "block" }, "name": "override", "children": [] } ], "metadata": { "bounds": { "left": 133, "top": 279, "right": 334, "bottom": 521.2360321797468 } }, "variant": { "69c680a12": false } } ], "metadata": { "bounds": { "left": 1118.8702518954262, "top": 290.5348726353282, "right": 1642.978560762243, "bottom": 622.236217096113 } } } ] }