{
    "id": "remote-11047",
    "element_type": "e-aae-a-toggle-switcher",
    "category": "toggle-switcher",
    "title": "toggle-switcher-style-switch",
    "thumbnail_url": "",
    "pro": false,
    "hash": "cd589a013dc6",
    "updated_at": "2026-08-27T10:59:30+00:00",
    "name": "toggle-switcher-style-switch",
    "model": {
        "id": "730519f1",
        "settings": {
            "classes": {
                "$$type": "classes",
                "value": [
                    "e-730519f1-8249938"
                ]
            }
        },
        "elements": [
            {
                "id": "22a5ad9f",
                "settings": [],
                "elements": [
                    {
                        "id": "345b9818",
                        "settings": {
                            "classes": {
                                "$$type": "classes",
                                "value": [
                                    "e-345b9818-bc56781"
                                ]
                            }
                        },
                        "elements": [
                            {
                                "id": "11a7b74a",
                                "settings": {
                                    "classes": {
                                        "$$type": "classes",
                                        "value": [
                                            "e-11a7b74a-764afb2"
                                        ]
                                    },
                                    "is_after": {
                                        "$$type": "boolean",
                                        "value": false
                                    }
                                },
                                "elements": [
                                    {
                                        "id": "64fd2232",
                                        "settings": {
                                            "paragraph": {
                                                "$$type": "html-v3",
                                                "value": {
                                                    "content": {
                                                        "$$type": "string",
                                                        "value": "Monthly"
                                                    },
                                                    "children": []
                                                }
                                            }
                                        },
                                        "elements": [],
                                        "isInner": false,
                                        "widgetType": "e-paragraph",
                                        "elType": "widget",
                                        "styles": [],
                                        "interactions": [],
                                        "editor_settings": {
                                            "title": "Text"
                                        },
                                        "version": "0.0"
                                    }
                                ],
                                "isInner": false,
                                "elType": "e-aae-a-toggle-switcher-label",
                                "styles": {
                                    "e-11a7b74a-764afb2": {
                                        "id": "e-11a7b74a-764afb2",
                                        "label": "local",
                                        "type": "class",
                                        "variants": [
                                            {
                                                "meta": {
                                                    "breakpoint": "desktop",
                                                    "state": null
                                                },
                                                "props": {
                                                    "width": {
                                                        "$$type": "size",
                                                        "value": {
                                                            "unit": "auto",
                                                            "size": ""
                                                        }
                                                    },
                                                    "cursor": {
                                                        "$$type": "string",
                                                        "value": "pointer"
                                                    }
                                                },
                                                "custom_css": null
                                            },
                                            {
                                                "meta": {
                                                    "breakpoint": "desktop",
                                                    "state": "e--selected"
                                                },
                                                "props": {
                                                    "color": {
                                                        "$$type": "color",
                                                        "value": "#1a1a1a"
                                                    },
                                                    "font-weight": {
                                                        "$$type": "string",
                                                        "value": "600"
                                                    }
                                                },
                                                "custom_css": null
                                            }
                                        ]
                                    }
                                },
                                "interactions": [],
                                "editor_settings": {
                                    "title": "Label Before"
                                },
                                "version": "0.0"
                            },
                            {
                                "id": "64374d32",
                                "settings": {
                                    "classes": {
                                        "$$type": "classes",
                                        "value": [
                                            "e-64374d32-34f24b9"
                                        ]
                                    }
                                },
                                "elements": [
                                    {
                                        "id": "2ecdd4a8",
                                        "settings": {
                                            "classes": {
                                                "$$type": "classes",
                                                "value": [
                                                    "e-2ecdd4a8-4925883"
                                                ]
                                            }
                                        },
                                        "elements": [],
                                        "isInner": false,
                                        "widgetType": "e-aae-a-toggle-switcher-knob",
                                        "elType": "widget",
                                        "styles": {
                                            "e-2ecdd4a8-4925883": {
                                                "id": "e-2ecdd4a8-4925883",
                                                "label": "local",
                                                "type": "class",
                                                "variants": [
                                                    {
                                                        "meta": {
                                                            "breakpoint": "desktop",
                                                            "state": null
                                                        },
                                                        "props": {
                                                            "width": {
                                                                "$$type": "size",
                                                                "value": {
                                                                    "unit": "px",
                                                                    "size": 16
                                                                }
                                                            },
                                                            "height": {
                                                                "$$type": "size",
                                                                "value": {
                                                                    "unit": "px",
                                                                    "size": 16
                                                                }
                                                            },
                                                            "min-width": {
                                                                "$$type": "size",
                                                                "value": {
                                                                    "unit": "px",
                                                                    "size": 0
                                                                }
                                                            },
                                                            "position": {
                                                                "$$type": "string",
                                                                "value": "absolute"
                                                            },
                                                            "inset-block-start": {
                                                                "$$type": "size",
                                                                "value": {
                                                                    "unit": "%",
                                                                    "size": 50
                                                                }
                                                            },
                                                            "inset-inline-start": {
                                                                "$$type": "size",
                                                                "value": {
                                                                    "unit": "px",
                                                                    "size": 0
                                                                }
                                                            },
                                                            "padding": {
                                                                "$$type": "size",
                                                                "value": {
                                                                    "unit": "px",
                                                                    "size": 0
                                                                }
                                                            },
                                                            "border-radius": {
                                                                "$$type": "size",
                                                                "value": {
                                                                    "unit": "%",
                                                                    "size": 50
                                                                }
                                                            },
                                                            "background": {
                                                                "$$type": "background",
                                                                "value": {
                                                                    "color": {
                                                                        "$$type": "color",
                                                                        "value": "#ffffff"
                                                                    }
                                                                }
                                                            },
                                                            "transform": {
                                                                "$$type": "transform",
                                                                "value": {
                                                                    "transform-functions": {
                                                                        "$$type": "transform-functions",
                                                                        "value": [
                                                                            {
                                                                                "$$type": "transform-move",
                                                                                "value": {
                                                                                    "x": {
                                                                                        "$$type": "size",
                                                                                        "value": {
                                                                                            "unit": "px",
                                                                                            "size": 0
                                                                                        }
                                                                                    },
                                                                                    "y": {
                                                                                        "$$type": "size",
                                                                                        "value": {
                                                                                            "unit": "%",
                                                                                            "size": -50
                                                                                        }
                                                                                    },
                                                                                    "z": {
                                                                                        "$$type": "size",
                                                                                        "value": {
                                                                                            "unit": "px",
                                                                                            "size": 0
                                                                                        }
                                                                                    }
                                                                                }
                                                                            }
                                                                        ]
                                                                    }
                                                                }
                                                            },
                                                            "transition": {
                                                                "$$type": "transition",
                                                                "value": [
                                                                    {
                                                                        "$$type": "selection-size",
                                                                        "value": {
                                                                            "selection": {
                                                                                "$$type": "key-value",
                                                                                "value": {
                                                                                    "key": {
                                                                                        "$$type": "string",
                                                                                        "value": "All properties"
                                                                                    },
                                                                                    "value": {
                                                                                        "$$type": "string",
                                                                                        "value": "all"
                                                                                    }
                                                                                }
                                                                            },
                                                                            "size": {
                                                                                "$$type": "size",
                                                                                "value": {
                                                                                    "unit": "ms",
                                                                                    "size": 400
                                                                                }
                                                                            }
                                                                        }
                                                                    }
                                                                ]
                                                            },
                                                            "display": {
                                                                "$$type": "string",
                                                                "value": "inline-block"
                                                            }
                                                        },
                                                        "custom_css": null
                                                    }
                                                ]
                                            }
                                        },
                                        "interactions": [],
                                        "editor_settings": [],
                                        "version": "0.0"
                                    }
                                ],
                                "isInner": false,
                                "elType": "e-aae-a-toggle-switcher-track",
                                "styles": {
                                    "e-64374d32-34f24b9": {
                                        "id": "e-64374d32-34f24b9",
                                        "label": "local",
                                        "type": "class",
                                        "variants": [
                                            {
                                                "meta": {
                                                    "breakpoint": "desktop",
                                                    "state": null
                                                },
                                                "props": {
                                                    "width": {
                                                        "$$type": "size",
                                                        "value": {
                                                            "unit": "px",
                                                            "size": 40
                                                        }
                                                    },
                                                    "height": {
                                                        "$$type": "size",
                                                        "value": {
                                                            "unit": "px",
                                                            "size": 20
                                                        }
                                                    },
                                                    "min-width": {
                                                        "$$type": "size",
                                                        "value": {
                                                            "unit": "px",
                                                            "size": 0
                                                        }
                                                    },
                                                    "min-height": {
                                                        "$$type": "size",
                                                        "value": {
                                                            "unit": "px",
                                                            "size": 0
                                                        }
                                                    },
                                                    "position": {
                                                        "$$type": "string",
                                                        "value": "relative"
                                                    },
                                                    "cursor": {
                                                        "$$type": "string",
                                                        "value": "pointer"
                                                    },
                                                    "padding": {
                                                        "$$type": "size",
                                                        "value": {
                                                            "unit": "px",
                                                            "size": 0
                                                        }
                                                    },
                                                    "border-radius": {
                                                        "$$type": "size",
                                                        "value": {
                                                            "unit": "px",
                                                            "size": 10
                                                        }
                                                    },
                                                    "border-width": {
                                                        "$$type": "size",
                                                        "value": {
                                                            "unit": "px",
                                                            "size": 2
                                                        }
                                                    },
                                                    "border-color": {
                                                        "$$type": "color",
                                                        "value": "#999999"
                                                    },
                                                    "border-style": {
                                                        "$$type": "string",
                                                        "value": "solid"
                                                    },
                                                    "background": {
                                                        "$$type": "background",
                                                        "value": {
                                                            "color": {
                                                                "$$type": "color",
                                                                "value": "#999999"
                                                            }
                                                        }
                                                    },
                                                    "display": {
                                                        "$$type": "string",
                                                        "value": "inline-block"
                                                    }
                                                },
                                                "custom_css": null
                                            },
                                            {
                                                "meta": {
                                                    "breakpoint": "desktop",
                                                    "state": "e--selected"
                                                },
                                                "props": {
                                                    "background": {
                                                        "$$type": "background",
                                                        "value": {
                                                            "color": {
                                                                "$$type": "color",
                                                                "value": "#000000"
                                                            }
                                                        }
                                                    },
                                                    "border-color": {
                                                        "$$type": "color",
                                                        "value": "#000000"
                                                    }
                                                },
                                                "custom_css": null
                                            }
                                        ]
                                    }
                                },
                                "interactions": [],
                                "editor_settings": {
                                    "title": "Switch"
                                },
                                "version": "0.0"
                            },
                            {
                                "id": "4a93174e",
                                "settings": {
                                    "classes": {
                                        "$$type": "classes",
                                        "value": [
                                            "e-4a93174e-8b5b59b"
                                        ]
                                    },
                                    "is_after": {
                                        "$$type": "boolean",
                                        "value": true
                                    }
                                },
                                "elements": [
                                    {
                                        "id": "45a8d2f4",
                                        "settings": {
                                            "paragraph": {
                                                "$$type": "html-v3",
                                                "value": {
                                                    "content": {
                                                        "$$type": "string",
                                                        "value": "Yearly"
                                                    },
                                                    "children": []
                                                }
                                            }
                                        },
                                        "elements": [],
                                        "isInner": false,
                                        "widgetType": "e-paragraph",
                                        "elType": "widget",
                                        "styles": [],
                                        "interactions": [],
                                        "editor_settings": {
                                            "title": "Text"
                                        },
                                        "version": "0.0"
                                    }
                                ],
                                "isInner": false,
                                "elType": "e-aae-a-toggle-switcher-label",
                                "styles": {
                                    "e-4a93174e-8b5b59b": {
                                        "id": "e-4a93174e-8b5b59b",
                                        "label": "local",
                                        "type": "class",
                                        "variants": [
                                            {
                                                "meta": {
                                                    "breakpoint": "desktop",
                                                    "state": null
                                                },
                                                "props": {
                                                    "width": {
                                                        "$$type": "size",
                                                        "value": {
                                                            "unit": "auto",
                                                            "size": ""
                                                        }
                                                    },
                                                    "cursor": {
                                                        "$$type": "string",
                                                        "value": "pointer"
                                                    }
                                                },
                                                "custom_css": null
                                            },
                                            {
                                                "meta": {
                                                    "breakpoint": "desktop",
                                                    "state": "e--selected"
                                                },
                                                "props": {
                                                    "color": {
                                                        "$$type": "color",
                                                        "value": "#1a1a1a"
                                                    },
                                                    "font-weight": {
                                                        "$$type": "string",
                                                        "value": "600"
                                                    }
                                                },
                                                "custom_css": null
                                            }
                                        ]
                                    }
                                },
                                "interactions": [],
                                "editor_settings": {
                                    "title": "Label After"
                                },
                                "version": "0.0"
                            }
                        ],
                        "isInner": false,
                        "elType": "e-aae-a-toggle-switcher-tablist",
                        "styles": {
                            "e-345b9818-0604e57": {
                                "id": "e-345b9818-0604e57",
                                "label": "local",
                                "type": "class",
                                "variants": [
                                    {
                                        "meta": {
                                            "breakpoint": "desktop",
                                            "state": null
                                        },
                                        "props": {
                                            "width": {
                                                "$$type": "size",
                                                "value": {
                                                    "unit": "%",
                                                    "size": 100
                                                }
                                            },
                                            "margin": {
                                                "$$type": "dimensions",
                                                "value": {
                                                    "block-start": {
                                                        "$$type": "size",
                                                        "value": {
                                                            "unit": "px",
                                                            "size": 0
                                                        }
                                                    },
                                                    "inline-end": {
                                                        "$$type": "size",
                                                        "value": {
                                                            "unit": "px",
                                                            "size": 0
                                                        }
                                                    },
                                                    "block-end": {
                                                        "$$type": "size",
                                                        "value": {
                                                            "unit": "px",
                                                            "size": 20
                                                        }
                                                    },
                                                    "inline-start": {
                                                        "$$type": "size",
                                                        "value": {
                                                            "unit": "px",
                                                            "size": 0
                                                        }
                                                    }
                                                }
                                            },
                                            "flex-direction": {
                                                "$$type": "string",
                                                "value": "row"
                                            },
                                            "gap": {
                                                "$$type": "size",
                                                "value": {
                                                    "unit": "px",
                                                    "size": 10
                                                }
                                            },
                                            "justify-content": {
                                                "$$type": "string",
                                                "value": "center"
                                            },
                                            "align-items": {
                                                "$$type": "string",
                                                "value": "center"
                                            }
                                        },
                                        "custom_css": null
                                    }
                                ]
                            },
                            "e-345b9818-bc56781": {
                                "id": "e-345b9818-bc56781",
                                "label": "local",
                                "type": "class",
                                "variants": [
                                    {
                                        "meta": {
                                            "breakpoint": "desktop",
                                            "state": null
                                        },
                                        "props": {
                                            "justify-content": {
                                                "$$type": "string",
                                                "value": "center"
                                            },
                                            "align-items": {
                                                "$$type": "string",
                                                "value": "center"
                                            }
                                        },
                                        "custom_css": null
                                    }
                                ]
                            }
                        },
                        "interactions": [],
                        "editor_settings": {
                            "title": "Switch Row"
                        },
                        "version": "0.0"
                    },
                    {
                        "id": "5be45259",
                        "settings": [],
                        "elements": [
                            {
                                "id": "50c62993",
                                "settings": {
                                    "tag": {
                                        "$$type": "string",
                                        "value": "h3"
                                    },
                                    "title": {
                                        "$$type": "html-v3",
                                        "value": {
                                            "content": {
                                                "$$type": "string",
                                                "value": "Monthly Plan"
                                            },
                                            "children": []
                                        }
                                    }
                                },
                                "elements": [],
                                "isInner": false,
                                "widgetType": "e-heading",
                                "elType": "widget",
                                "styles": [],
                                "interactions": [],
                                "editor_settings": [],
                                "version": "0.0"
                            },
                            {
                                "id": "47f02d0b",
                                "settings": {
                                    "paragraph": {
                                        "$$type": "html-v3",
                                        "value": {
                                            "content": {
                                                "$$type": "string",
                                                "value": "$9/month — billed monthly."
                                            },
                                            "children": []
                                        }
                                    },
                                    "tag": {
                                        "$$type": "string",
                                        "value": "p"
                                    }
                                },
                                "elements": [],
                                "isInner": false,
                                "widgetType": "e-paragraph",
                                "elType": "widget",
                                "styles": [],
                                "interactions": [],
                                "editor_settings": [],
                                "version": "0.0"
                            }
                        ],
                        "isInner": false,
                        "elType": "e-aae-a-toggle-pane",
                        "styles": [],
                        "interactions": [],
                        "editor_settings": {
                            "title": "Pane 1"
                        },
                        "version": "0.0"
                    },
                    {
                        "id": "7323a7c7",
                        "settings": [],
                        "elements": [
                            {
                                "id": "97b9bae",
                                "settings": {
                                    "tag": {
                                        "$$type": "string",
                                        "value": "h3"
                                    },
                                    "title": {
                                        "$$type": "html-v3",
                                        "value": {
                                            "content": {
                                                "$$type": "string",
                                                "value": "Yearly Plan"
                                            },
                                            "children": []
                                        }
                                    }
                                },
                                "elements": [],
                                "isInner": false,
                                "widgetType": "e-heading",
                                "elType": "widget",
                                "styles": [],
                                "interactions": [],
                                "editor_settings": [],
                                "version": "0.0"
                            },
                            {
                                "id": "2f845469",
                                "settings": {
                                    "paragraph": {
                                        "$$type": "html-v3",
                                        "value": {
                                            "content": {
                                                "$$type": "string",
                                                "value": "$90/year — save 2 months."
                                            },
                                            "children": []
                                        }
                                    },
                                    "tag": {
                                        "$$type": "string",
                                        "value": "p"
                                    }
                                },
                                "elements": [],
                                "isInner": false,
                                "widgetType": "e-paragraph",
                                "elType": "widget",
                                "styles": [],
                                "interactions": [],
                                "editor_settings": [],
                                "version": "0.0"
                            }
                        ],
                        "isInner": false,
                        "elType": "e-aae-a-toggle-pane",
                        "styles": [],
                        "interactions": [],
                        "editor_settings": {
                            "title": "Pane 2"
                        },
                        "version": "0.0"
                    }
                ],
                "isInner": false,
                "elType": "e-aae-a-toggle-switcher",
                "styles": [],
                "interactions": [],
                "editor_settings": {
                    "title": "toggle-switcher-switch"
                },
                "version": "0.0"
            }
        ],
        "isInner": false,
        "elType": "e-flexbox",
        "styles": {
            "e-730519f1-8249938": {
                "id": "e-730519f1-8249938",
                "label": "local",
                "type": "class",
                "variants": [
                    {
                        "meta": {
                            "breakpoint": "desktop",
                            "state": null
                        },
                        "props": {
                            "flex-direction": {
                                "$$type": "string",
                                "value": "column"
                            }
                        },
                        "custom_css": null
                    }
                ]
            }
        },
        "interactions": [],
        "editor_settings": [],
        "version": "0.0"
    },
    "source": "remote"
}