Breaking Changes

Drop Python 3.7 Support

• Drop python3.7 support by @masenf in https://github.com/reflex-dev/reflex/pull/2003

Victory charts are completely removed in this release.

Graph and chart functionailty has been replaced by Recharts, see the docs for more examples.

• Remove victory charts by @ElijahAhianyo in https://github.com/reflex-dev/reflex/pull/1945

Removal of Deprecated Browser Storage API

• Deprecate rx.get_cookies by @ElijahAhianyo in https://github.com/reflex-dev/reflex/pull/1961
• Remove 0.3.0 deprecated features by @ElijahAhianyo in https://github.com/reflex-dev/reflex/pull/1947

rx.Var Fields are Renamed

Most users are not interacting the Var class directly, but if you are, the following fields have been renamed:

• name -> _var_name
• type_ -> _var_type
• state -> _var_state
• is_local -> _var_is_local
• is_string -> _var_is_string

This allows rx.Base and rx.Model classes using these field names to be accessed through State vars.

• Var field cleanup by @masenf in https://github.com/reflex-dev/reflex/pull/1943
• Replace renamed Var.type_ with _var_type by @masenf in https://github.com/reflex-dev/reflex/pull/2039

Prop Values are Validated

Each component prop now defines values as typing.Literal, which has two effects:

• In IDEs, the allowed values for a field will be prominently displayed.
• When compiling, invalid literal values for props will raise an exception.

The following code will now raise ValueError

rx.button("Foo", color_scheme="silly")

ValueError: prop value for color_scheme of the `Button` component should be one of the following: none,gray,red,orange,yellow,green,teal,blue,cyan,purple,pink,whiteAlpha,blackAlpha,linkedin,facebook,messenger,whatsapp,twitter,telegram. Got 'silly' instead

If you need to pass an unrecognized prop value, you can wrap it in an rx.Var.

rx.button("Foo", color_scheme=rx.Var.create("silly"))

• Props as Literals by @ElijahAhianyo in https://github.com/reflex-dev/reflex/pull/1921

New Features

New Base Template

When running reflex init in a new directory, a multi-page template will be deployed instead of the Welcome to Reflex page. This provides a better starting point for more complex apps.

Use reflex init --template blank to generate a new app with the previous template.

• Added base template + improve templating code by @Alek99 in https://github.com/reflex-dev/reflex/pull/1937
• [REF-876] Update base template styles by @masenf in https://github.com/reflex-dev/reflex/pull/2022
• Update base template styling by @picklelo in https://github.com/reflex-dev/reflex/pull/2050
• Update base template by @picklelo in https://github.com/reflex-dev/reflex/pull/2027

New Component: rx.data_editor

Based on the Glide Data Grid, the new rx.data_editor component supports in place editing of data tables and is more feature rich than the existing rx.data_table component.

See the docs for more examples and details.

(Note: pandas dataframe is not currently supported, but will be coming soon)

• Lendemor/add datagrid editor by @Lendemor in https://github.com/reflex-dev/reflex/pull/1941
• fix editable column and theme casting by @Lendemor in https://github.com/reflex-dev/reflex/pull/2051

State.router

The State.router property provides access to the current page's router data in a way that can be accessed from both the frontend and the backend.

Previous State.get_current_page(), State.get_query_params(), and others are now deprecated.

• deprecate get_ methods for router_data, use BaseVars instead by @Lendemor in https://github.com/reflex-dev/reflex/pull/1967

New component: rx.moment

Simple date/time formatting on the frontend, and provides an event trigger that can be fired peridically from the frontend.

• Wrap Moment Component by @Lendemor in https://github.com/reflex-dev/reflex/pull/1994
  • react-moment is used under the hood.

Reflex Hosting Preview

This release includes support for the new Reflex Hosting service, currently in closed testing, please reach out on Discord for more information.

• [REF-99] Add first version of CLI for hosting service by @martinxu9 in https://github.com/reflex-dev/reflex/pull/1810
• [reflex hosting] clean up tmp dir for storing zip archives by @jackie-pc in https://github.com/reflex-dev/reflex/pull/2021
• CLI switch to prod server by @martinxu9 in https://github.com/reflex-dev/reflex/pull/2016
• CLI improvements by @martinxu9 in https://github.com/reflex-dev/reflex/pull/2026
• add region check upfront when user deploys interactively by @martinxu9 in https://github.com/reflex-dev/reflex/pull/2030
• CLI will not set auto/stop setting for deployment by @martinxu9 in https://github.com/reflex-dev/reflex/pull/2040
• Add back build log command to CLI by @martinxu9 in https://github.com/reflex-dev/reflex/pull/2053

Demo App

Running reflex demo will now open a demo app based on the new base template showing some reflex features.

• Tom/template demo app by @tgberkeley in https://github.com/reflex-dev/reflex/pull/2046
• Add CLI demo command by @Alek99 in https://github.com/reflex-dev/reflex/pull/2044
• Use demo app for reflex demo command by @picklelo in https://github.com/reflex-dev/reflex/pull/2048
• Update demo command to open demo.reflex.run by @picklelo in https://github.com/reflex-dev/reflex/pull/2059

(Currently using a remotely hosted version of the app, but subsequent release will run the demo app locally.)

Radix Themes Preview

Reflex is moving away from Chakra-UI component to Radix-UI. And some of the new components are available in this release for testing in the reflex.components.radix.themes module. More details to follow.

• [REF-668] Wrap MyApp with radix Theme component by @masenf in https://github.com/reflex-dev/reflex/pull/1867
• [REF-938] Fix up radix themes issues by @masenf in https://github.com/reflex-dev/reflex/pull/2002

Improvements

Automatic API_URL

Most users will not have to explicitly set API_URL unless their frontend and backend are running on different hosts or via a load balancer.

When the default API_URL of http://localhost:{backend_port} is used, and the frontend is not being accessed on localhost, assume that the backend and frontend are on the same host.

• [REF-843] Automatically update api_url and deploy_url by @masenf in https://github.com/reflex-dev/reflex/pull/1954

Support for Static Sites

Do not display the connection error banner or attempt to connect to the backend if the app does not use State.

• No state No Websocket by @ElijahAhianyo in https://github.com/reflex-dev/reflex/pull/1950
• Remove Default state by @ElijahAhianyo in https://github.com/reflex-dev/reflex/pull/1978

Improve reflex export

• Support exporting to zip archives to a dir that is not cwd (to be use by hosting cli) by @jackie-pc in https://github.com/reflex-dev/reflex/pull/2005
• [reflex export] backend.zip excludes dirs that look like venv dirs by @jackie-pc in https://github.com/reflex-dev/reflex/pull/2009

Access Relationship Attributes on rx.Model

• Improve Var type handling for better rx.Model attribute access by @masenf in https://github.com/reflex-dev/reflex/pull/2010

Autogenerate missing requirements.txt

An app must have a requirements.txt to be deployed via the hosting service, so Reflex will create one based on top-level packages in the environment where it is running.

• Autogenerating Dependencies During Deployment by @Alek99 in https://github.com/reflex-dev/reflex/pull/2033

Support callback in rx.call_script

When running arbitrary script, it is now possible to pass the result back to an Event Handler. See the updated docs for more examples.

• Support callback for rx.call_script by @masenf in https://github.com/reflex-dev/reflex/pull/2045

Miscellaneous

• Warn when computed vars raise an exception by @masenf in https://github.com/reflex-dev/reflex/pull/1939
• Stop double compiles in dev mode by @picklelo in https://github.com/reflex-dev/reflex/pull/1990
• Improve Event handler Error message by @ElijahAhianyo in https://github.com/reflex-dev/reflex/pull/2019
• Relax wrapt dependency for tensorflow compatibility by @masenf in https://github.com/reflex-dev/reflex/pull/2001

Bug Fixes

• Fix custom components special props by @picklelo in https://github.com/reflex-dev/reflex/pull/1956
• Fix charts not displaying without specifying width and height
  • ChartBase.create: include default min dimensions (RESUB) by @masenf in https://github.com/reflex-dev/reflex/pull/1975
• Fix Cookie and LocalStorage values being reset on navigation
  • convert initialEvents to a function by @masenf in https://github.com/reflex-dev/reflex/pull/1982
• Bug: changing type of playing by @Billa05 in https://github.com/reflex-dev/reflex/pull/1986
• Rehydrate client storage after rx.remove_local_storage and rx.remove_cookies by @ElijahAhianyo in https://github.com/reflex-dev/reflex/pull/1998
• multi_select somewhat usable by @masenf in https://github.com/reflex-dev/reflex/pull/1861
• fix fnm version check by @Lendemor in https://github.com/reflex-dev/reflex/pull/2014
• Resolve npm path and fnm path on Windows by @masenf in https://github.com/reflex-dev/reflex/pull/2015
• Radix Themes style notation fix by @ElijahAhianyo in https://github.com/reflex-dev/reflex/pull/2025
• Generate state delta from processed state instance by @masenf in https://github.com/reflex-dev/reflex/pull/2023
• fix onload method not working in prod mode (and hosting) by @Lendemor in https://github.com/reflex-dev/reflex/pull/2049
• Add none to color scheme literal by @ElijahAhianyo in https://github.com/reflex-dev/reflex/pull/2055

README translations

• Translated README.md file in Italian (IT) by @LucianCrainic in https://github.com/reflex-dev/reflex/pull/1946
• Translate README.md file in Korean by @starcat37 in https://github.com/reflex-dev/reflex/pull/2011
• docs: fixed hindi translation by @smty2018 in https://github.com/reflex-dev/reflex/pull/2018

Other Changes

• bun version bump to 1.0.4 by @masenf in https://github.com/reflex-dev/reflex/pull/1942
• Bump to v0.2.9 by @picklelo in https://github.com/reflex-dev/reflex/pull/1953
• AppHarness: support headless mode and driver selection by @masenf in https://github.com/reflex-dev/reflex/pull/1963
• Lighthouse Test CI by @Alek99 in https://github.com/reflex-dev/reflex/pull/1974
• format: event arg values use backticks by @masenf in https://github.com/reflex-dev/reflex/pull/1926
• fix serialization as a whole for list/dict/Base containing custom items to serialize by @Lendemor in https://github.com/reflex-dev/reflex/pull/1984
• Fix AppHarness tests by @masenf in https://github.com/reflex-dev/reflex/pull/1987
• test_app: cleanup state_name logic and fixup get_sid() call by @masenf in https://github.com/reflex-dev/reflex/pull/1993
• Fix posthog by @picklelo in https://github.com/reflex-dev/reflex/pull/1992
• Refactor pyi_generator to use AST directly by @masenf in https://github.com/reflex-dev/reflex/pull/2034
• Remove .pyc and pycache from template dir by @masenf in https://github.com/reflex-dev/reflex/pull/2056

New Contributors

• @LucianCrainic made their first contribution in https://github.com/reflex-dev/reflex/pull/1946
• @Billa05 made their first contribution in https://github.com/reflex-dev/reflex/pull/1986
• @starcat37 made their first contribution in https://github.com/reflex-dev/reflex/pull/2011
• @smty2018 made their first contribution in https://github.com/reflex-dev/reflex/pull/2018
• @tgberkeley made their first contribution in https://github.com/reflex-dev/reflex/pull/2046

Full Changelog: https://github.com/reflex-dev/reflex/compare/v0.2.9...v0.3.0