{"record":{"id":"47d5cc34b9a91457","repo":"reflex-dev/reflex","slug":"do-not-override-add-style-directly-use-add-style-47d5cc","errorCode":null,"errorMessage":"Do not override _add_style directly. Use add_style instead.","messagePattern":"Do not override _add_style directly\\. Use add_style instead\\.","errorType":"exception","errorClass":"UserWarning","httpStatus":null,"severity":"warning","filePath":"reflex/compiler/plugins/builtin.py","lineNumber":236,"sourceCode":"    @staticmethod\n    def _apply_style(\n        comp: Component, style: ComponentStyle, page_context: PageContext\n    ) -> Component | None:\n        \"\"\"Apply app-level styles to a single component.\n\n        Args:\n            comp: The component to style.\n            style: The app-level component style map.\n            page_context: The active page context, used to obtain a page-local\n                clone before rewriting ``style``.\n\n        Returns:\n            A page-local clone with the merged style, or ``None`` when the\n            component has no type-level or app-level style to apply.\n        \"\"\"\n        if type(comp)._add_style != Component._add_style:\n            msg = \"Do not override _add_style directly. Use add_style instead.\"\n            raise UserWarning(msg)\n\n        new_style = comp._add_style()\n        component_style = comp._get_component_style(style)\n        if not new_style and not component_style:\n            return None\n\n        style_vars = [new_style._var_data]\n        if component_style:\n            new_style.update(component_style)\n            style_vars.append(component_style._var_data)\n        new_style.update(comp.style)\n        style_vars.append(comp.style._var_data)\n        new_style._var_data = VarData.merge(*style_vars)\n\n        owned = page_context.own(comp)\n        owned.style = new_style\n        return owned\n","sourceCodeStart":218,"sourceCodeEnd":254,"githubUrl":"https://github.com/reflex-dev/reflex/blob/45b8ed5ab735f8a56bbb09a42384f030eb0208e7/reflex/compiler/plugins/builtin.py#L218-L254","documentation":"The style application pipeline in the builtin plugin (_apply_style) detects that a Component subclass overrode the private _add_style method instead of the public add_style hook. The private method is reserved for framework internals; overriding it breaks style composition, so Reflex raises a UserWarning as an error.","triggerScenarios":"Creating a custom Component subclass that defines _add_style() (matching it against Component._add_style via identity check). Overriding add_style() is the supported API.","commonSituations":"Component library authors copying internal Reflex component source that used _add_style, or code written against an older Reflex API where _add_style was the extension point.","solutions":["Rename the override from _add_style to add_style in your custom component","Check Reflex docs/changelog for the current style-extension API for your version","If extending a built-in component, call super().add_style() appropriately"],"exampleFix":"# before\nclass MyComp(rx.Component):\n    def _add_style(self):\n        return {\"padding\": \"1em\"}\n# after\nclass MyComp(rx.Component):\n    def add_style(self):\n        return {\"padding\": \"1em\"}","handlingStrategy":"type-guard","validationCode":"assert not (\"_add_style\" in MyComponent.__dict__), \"override add_style, not _add_style\"","typeGuard":"def uses_public_style_hook(cls) -> bool:\n    return \"_add_style\" not in cls.__dict__","tryCatchPattern":null,"preventionTips":["Override add_style in custom components, never _add_style","Consult current docs when authoring component libraries","Run a compile smoke test for custom components in CI"],"tags":["reflex","component","style","api-misuse"],"backgroundTag":"private-api-override","analyzedSha":"45b8ed5ab735f8a56bbb09a42384f030eb0208e7","analyzedAt":"2026-08-28T19:25:27.644Z","schemaVersion":2},"datasetVersion":"2026-08-28T21:17:43.275Z"}