use direction props from radix.Flex (#2696)

* use direction props from radix.Flex

* override direction props

* test no var

* confirm no var

* add comment for reflex-web
This commit is contained in:
Thomas Brandého 2024-02-22 22:33:10 +01:00 committed by GitHub
parent b849c8d9d8
commit 05044ed912
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 12 additions and 10 deletions

View File

@ -3,9 +3,10 @@
from __future__ import annotations
from reflex.components.component import Component
from reflex.vars import Var
from ..base import LiteralAlign, LiteralSpacing
from .flex import Flex
from .flex import Flex, LiteralFlexDirection
class Stack(Flex):
@ -41,12 +42,12 @@ class Stack(Flex):
class VStack(Stack):
"""A vertical stack component."""
def _apply_theme(self, theme: Component):
self.style.update({"flex_direction": "column"})
# The direction of the stack.
direction: Var[LiteralFlexDirection] = "column" # type: ignore
class HStack(Stack):
"""A horizontal stack component."""
def _apply_theme(self, theme: Component):
self.style.update({"flex_direction": "row"})
# The direction of the stack.
direction: Var[LiteralFlexDirection] = "row" # type: ignore

View File

@ -8,8 +8,9 @@ from reflex.vars import Var, BaseVar, ComputedVar
from reflex.event import EventChain, EventHandler, EventSpec
from reflex.style import Style
from reflex.components.component import Component
from reflex.vars import Var
from ..base import LiteralAlign, LiteralSpacing
from .flex import Flex
from .flex import Flex, LiteralFlexDirection
class Stack(Flex):
@overload
@ -178,13 +179,13 @@ class VStack(Stack):
*children,
spacing: Optional[LiteralSpacing] = "2",
align: Optional[LiteralAlign] = "start",
as_child: Optional[Union[Var[bool], bool]] = None,
direction: Optional[
Union[
Var[Literal["row", "column", "row-reverse", "column-reverse"]],
Literal["row", "column", "row-reverse", "column-reverse"],
]
] = None,
as_child: Optional[Union[Var[bool], bool]] = None,
justify: Optional[
Union[
Var[Literal["start", "center", "end", "between"]],
@ -296,8 +297,8 @@ class VStack(Stack):
*children: The children of the stack.
spacing: The spacing between each stack item.
align: The alignment of the stack items.
as_child: Change the default rendered element for the one passed as a child, merging their props and behavior.
direction: How child items are layed out: "row" | "column" | "row-reverse" | "column-reverse"
as_child: Change the default rendered element for the one passed as a child, merging their props and behavior.
justify: Alignment of children along the cross axis: "start" | "center" | "end" | "between"
wrap: Whether children should wrap when they reach the end of their container: "nowrap" | "wrap" | "wrap-reverse"
access_key: Provides a hint for generating a keyboard shortcut for the current element.
@ -337,13 +338,13 @@ class HStack(Stack):
*children,
spacing: Optional[LiteralSpacing] = "2",
align: Optional[LiteralAlign] = "start",
as_child: Optional[Union[Var[bool], bool]] = None,
direction: Optional[
Union[
Var[Literal["row", "column", "row-reverse", "column-reverse"]],
Literal["row", "column", "row-reverse", "column-reverse"],
]
] = None,
as_child: Optional[Union[Var[bool], bool]] = None,
justify: Optional[
Union[
Var[Literal["start", "center", "end", "between"]],
@ -455,8 +456,8 @@ class HStack(Stack):
*children: The children of the stack.
spacing: The spacing between each stack item.
align: The alignment of the stack items.
as_child: Change the default rendered element for the one passed as a child, merging their props and behavior.
direction: How child items are layed out: "row" | "column" | "row-reverse" | "column-reverse"
as_child: Change the default rendered element for the one passed as a child, merging their props and behavior.
justify: Alignment of children along the cross axis: "start" | "center" | "end" | "between"
wrap: Whether children should wrap when they reach the end of their container: "nowrap" | "wrap" | "wrap-reverse"
access_key: Provides a hint for generating a keyboard shortcut for the current element.