dara-components 1.8.5__py3-none-any.whl → 1.22.1__py3-none-any.whl

dara/components/common/heading.py

@@ -16,10 +16,9 @@ limitations under the License.
 """
 
 import re
-from typing import Union
 
 from dara.components.common.base_component import ContentComponent
-from dara.core.interactivity import NonDataVariable
+from dara.core.interactivity import ClientVariable
 
 
 class Heading(ContentComponent):
@@ -69,12 +68,14 @@ class Heading(ContentComponent):
     :param level: The level of heading to display, defaults to 1
     """
 
-    heading: Union[str, NonDataVariable]
+    heading: str | ClientVariable
     level: int = 1
 
     @property
     def anchor_name(self):
+        if isinstance(self.heading, ClientVariable):
+            raise ValueError('Heading anchor name cannot be accessed directly from a variable')
         return re.sub(r'\s+', '-', self.heading.lower())
 
-    def __init__(self, heading: Union[str, NonDataVariable], **kwargs):
+    def __init__(self, heading: str | ClientVariable, **kwargs):
         super().__init__(heading=heading, **kwargs)

dara/components/common/icon.py

@@ -15,8 +15,6 @@ See the License for the specific language governing permissions and
 limitations under the License.
 """
 
-from typing import Optional
-
 from dara.components.common.base_component import ContentComponent
 
 
@@ -65,4 +63,4 @@ class Icon(ContentComponent):
     """
 
     icon: str
-    color: Optional[str] = None
+    color: str | None = None

dara/components/common/if_cmp.py

@@ -15,22 +15,25 @@ See the License for the specific language governing permissions and
 limitations under the License.
 """
 
-from typing import List, Optional, Union
+from typing import ClassVar
 
-from pydantic import validator
+from pydantic import field_validator
 
 from dara.components.common.base_component import ModifierComponent
-from dara.core.definitions import ComponentInstance, TemplateMarker
+from dara.core.definitions import ComponentInstance
 from dara.core.interactivity import AnyVariable, Condition, Operator
 
 
-def cast_list(value: Union[ComponentInstance, List[ComponentInstance]]) -> List[ComponentInstance]:
+def cast_list(value: ComponentInstance | list[ComponentInstance | None]) -> list[ComponentInstance]:
     """
     Cast the value to a list if it is not or return original list if it is.
 
     :param value: the value to cast
     """
-    return value if isinstance(value, List) else [value]
+    return [v for v in value if v is not None] if isinstance(value, list) else [value]
+
+
+ConditionType = type[Condition]
 
 
 class If(ModifierComponent):
@@ -44,16 +47,17 @@ class If(ModifierComponent):
     An If component is created like so, in this example it is comparing the values of two variables:
 
     ```python
-
     from dara.core import Variable
     from dara.components.common import If, Text
 
+    var_1 = Variable(True)
+    var_2 = Variable(False)
+
     If(
-        condition= Variable(True) == Variable(False),
+        condition=var_1 == var_2,
         true_children=Text('Equal'),
         false_children=Text('Different')
     )
-
     ```
 
     :param condition: a condition object
@@ -62,12 +66,12 @@ class If(ModifierComponent):
     """
 
     condition: Condition
-    true_children: List[ComponentInstance]
-    false_children: List[ComponentInstance]
+    true_children: list[ComponentInstance]
+    false_children: list[ComponentInstance]
 
-    Condition = Condition
+    Condition: ClassVar[ConditionType] = Condition
 
-    @validator('condition')
+    @field_validator('condition')
     @classmethod
     def validate_condition(cls, value):
         if not isinstance(value, Condition):
@@ -81,15 +85,17 @@ class If(ModifierComponent):
 
     def __init__(
         self,
-        condition: Union[Condition, AnyVariable, TemplateMarker],  # type: ignore
-        true_children: Union[ComponentInstance, List[ComponentInstance]],
-        false_children: Optional[Union[ComponentInstance, List[ComponentInstance]]] = None,
+        condition: Condition | AnyVariable,  # type: ignore
+        true_children: ComponentInstance | list[ComponentInstance | None],
+        false_children: ComponentInstance | list[ComponentInstance | None] | None = None,
     ):
         if false_children is None:
             false_children = []
-        if isinstance(condition, (AnyVariable, TemplateMarker)):
+        if isinstance(condition, AnyVariable):
             condition = Condition(operator=Operator.TRUTHY, other=None, variable=condition)
 
         super().__init__(
-            condition=condition, true_children=cast_list(true_children), false_children=cast_list(false_children)
+            condition=condition,
+            true_children=cast_list(true_children),
+            false_children=cast_list(false_children),  # type: ignore
         )

dara/components/common/image.py

@@ -15,7 +15,7 @@ See the License for the specific language governing permissions and
 limitations under the License.
 """
 
-from pydantic import validator
+from pydantic import field_validator
 
 from dara.components.common.base_component import ContentComponent
 
@@ -57,7 +57,7 @@ class Image(ContentComponent):
 
     src: str
 
-    @validator('src')
+    @field_validator('src')
     @classmethod
     def validate_src(cls, value: str):
         if not value.startswith('/static/') and not value.startswith('http'):

dara/components/common/input.py

@@ -15,8 +15,6 @@ See the License for the specific language governing permissions and
 limitations under the License.
 """
 
-from typing import Optional
-
 from dara.components.common.base_component import FormComponent
 from dara.core.base_definitions import Action
 from dara.core.interactivity import Variable
@@ -32,23 +30,23 @@ class Input(FormComponent):
     An Input component is created via:
 
     ```python
-
     from dara.core import Variable
     from dara.components.common import Input
 
-    Input(value=Variable('initial input value'))
+    value_var = Variable('initial input value')
 
+    Input(value=value_var)
     ```
 
     You could define a numerical input with the following:
 
     ```python
-
     from dara.core import Variable
     from dara.components.common import Input
 
-    Input(value=Variable(0), type='number')
+    value_var = Variable(0)
 
+    Input(value=value_var, type='number')
     ```
 
     :param value: A Variable instance recording the component's state
@@ -58,8 +56,8 @@ class Input(FormComponent):
     :param id: the key to be used if this component is within a form
     """
 
-    id: Optional[str] = None
-    placeholder: Optional[str] = None
-    type: Optional[str] = None
-    onchange: Optional[Action] = None
-    value: Optional[Variable[str]] = None
+    id: str | None = None
+    placeholder: str | None = None
+    type: str | None = None
+    onchange: Action | None = None
+    value: Variable | None = None

dara/components/common/label.py

@@ -15,9 +15,7 @@ See the License for the specific language governing permissions and
 limitations under the License.
 """
 
-from typing import List, Optional, Union
-
-from pydantic import validator
+from pydantic import field_validator
 
 from dara.components.common.base_component import ContentComponent
 from dara.core.definitions import ComponentInstance
@@ -33,29 +31,31 @@ class Label(ContentComponent):
     Example of a simple Label component:
 
     ```python
-
+    from dara.core import Variable
     from dara.components.common import Label, Input
 
+    value_var = Variable()
+
     Label(
-        Input(),
+        Input(value=value_var),
         value='My Input:',
         direction='horizontal',
     )
-
     ```
 
     For further customization you can also pass a ComponentInstance to the value param:
 
     ```python
+    from dara.core import Variable
+    from dara.components.common import Label, Input, Heading
 
-    from dara.components.common import Label, Input, Text
+    value_var = Variable()
 
     Label(
-        Input(),
+        Input(value=value_var),
         value=Heading('My Input:', level=2),
         direction='horizontal',
     )
-
     ```
 
     :param value: A label to be presented with the child component, accepts a string or ComponentInstance
@@ -63,14 +63,13 @@ class Label(ContentComponent):
     :param label_width: A optional string containing the width the label should take
     """
 
-    value: Union[str, ComponentInstance]
+    value: str | ComponentInstance
     direction: Direction = Direction.VERTICAL
-    label_width: Optional[str] = None
+    label_width: str | None = None
 
-    @validator('children')
+    @field_validator('children')
     @classmethod
-    def validate_only_one_child(cls, children: List[ComponentInstance]) -> List[ComponentInstance]:
-
+    def validate_only_one_child(cls, children: list[ComponentInstance]) -> list[ComponentInstance]:
         if len(children) > 1:
             raise TypeError(
                 'More than one component was passed to the Label component. Label accepts only one child component'

dara/components/common/markdown.py

@@ -15,10 +15,8 @@ See the License for the specific language governing permissions and
 limitations under the License.
 """
 
-from typing import Union
-
 from dara.components.common.base_component import BaseDashboardComponent
-from dara.core.interactivity import NonDataVariable
+from dara.core.interactivity import ClientVariable
 
 
 class Markdown(BaseDashboardComponent):
@@ -42,8 +40,8 @@ class Markdown(BaseDashboardComponent):
     if the markdown is user-provided
     """
 
-    markdown: Union[NonDataVariable, str]
+    markdown: ClientVariable | str
     html_raw: bool = False
 
-    def __init__(self, markdown: Union[NonDataVariable, str], html_raw: bool = False, **kwargs):
+    def __init__(self, markdown: ClientVariable | str, html_raw: bool = False, **kwargs):
         super().__init__(markdown=markdown, html_raw=html_raw, **kwargs)

dara/components/common/modal.py

@@ -16,7 +16,7 @@ limitations under the License.
 """
 
 from dara.components.common.base_component import LayoutComponent
-from dara.core.interactivity import NonDataVariable
+from dara.core.interactivity import ClientVariable
 
 
 class Modal(LayoutComponent):
@@ -47,4 +47,4 @@ class Modal(LayoutComponent):
     :param align: How to align the content of the modal, accepts any flexbox alignments
     """
 
-    show: NonDataVariable
+    show: ClientVariable

dara/components/common/overlay.py

@@ -15,12 +15,10 @@ See the License for the specific language governing permissions and
 limitations under the License.
 """
 
-from typing import Optional
-
-from pydantic import validator
+from pydantic import field_validator
 
 from dara.components.common.base_component import LayoutComponent
-from dara.core.interactivity import NonDataVariable
+from dara.core.interactivity import ClientVariable
 
 
 class Overlay(LayoutComponent):
@@ -43,20 +41,16 @@ class Overlay(LayoutComponent):
 
     :param show: Boolean Variable instance recording the state, if True it renders the overlay and its' children
     :param position: the position of the overlay; can be top-left, top-right, bottom-left, bottom-right
-    :param padding: the padding around the overlay elements passed a string; can also be passed as individual side's padding in css shorthand format
-    :param margin: the margin property to shift the overlay in any direction passed as a string; can also be passed as individual side's margin in css shorthand format
     """
 
-    show: Optional[NonDataVariable] = None
-    padding: Optional[str] = None
-    margin: Optional[str] = None
+    show: ClientVariable | None = None
 
-    @validator('position')
+    @field_validator('position')
     @classmethod
-    def validate_position(cls, position) -> str:
+    def validate_position(cls, value) -> str:
         position_list = ['top-left', 'top-right', 'bottom-left', 'bottom-right']
-        if position not in position_list:
+        if value not in position_list:
             raise ValueError(
-                f'Invalid position: {position}, position should be one of the following values: {position_list}'
+                f'Invalid position: {value}, position should be one of the following values: {position_list}'
             )
-        return position
+        return value

dara/components/common/paragraph.py

@@ -15,7 +15,7 @@ See the License for the specific language governing permissions and
 limitations under the License.
 """
 
-from pydantic import validator
+from pydantic import field_validator
 
 from dara.components.common.anchor import Anchor
 from dara.components.common.base_component import LayoutComponent, LayoutError
@@ -66,7 +66,7 @@ class Paragraph(LayoutComponent):
 
     """
 
-    @validator('children')
+    @field_validator('children')
     @classmethod
     def validate_children(cls, children):
         for child in children:

dara/components/common/progress_bar.py

@@ -15,12 +15,10 @@ See the License for the specific language governing permissions and
 limitations under the License.
 """
 
-from typing import Optional, Union
-
-from pydantic import validator
+from pydantic import field_validator
 
 from dara.components.common.base_component import ContentComponent
-from dara.core.interactivity import NonDataVariable
+from dara.core.interactivity import ClientVariable
 
 
 class ProgressBar(ContentComponent):
@@ -48,13 +46,13 @@ class ProgressBar(ContentComponent):
     :param color: Optional color property for the progress bar, this should be the hex value of the color.
     """
 
-    progress: Union[int, NonDataVariable]
+    progress: int | ClientVariable
     small: bool = False
-    color: Optional[str] = None
+    color: str | None = None
 
-    @validator('progress')
+    @field_validator('progress')
     @classmethod
     def validate_progress(cls, progress):
-        if not isinstance(progress, (int, NonDataVariable)):
+        if not isinstance(progress, (int, ClientVariable)):
             raise ValueError('Progress must be an int or Variable')
         return progress

dara/components/common/radio_group.py

@@ -15,17 +15,23 @@ See the License for the specific language governing permissions and
 limitations under the License.
 """
 
-from typing import Any, List, Optional, Union
+from typing import Any
 
-from pydantic import validator
+from pydantic import field_validator
+from typing_extensions import TypedDict
 
 from dara.components.common.base_component import FormComponent
-from dara.components.common.utils import Item
 from dara.core.base_definitions import Action
-from dara.core.interactivity import NonDataVariable, UrlVariable, Variable
+from dara.core.definitions import ComponentInstance
+from dara.core.interactivity import ClientVariable, Variable
 from dara.core.visual.components.types import Direction
 
 
+class RadioItem(TypedDict):
+    value: Any
+    label: str | ComponentInstance
+
+
 class RadioGroup(FormComponent):
     """
     ![RadioGroup](../../../../docs/packages/dara-components/common/assets/RadioGroup.png)
@@ -36,19 +42,32 @@ class RadioGroup(FormComponent):
     Simple RadioGroup component:
 
     ```python
+    from dara.core import Variable
+    from dara.components import RadioGroup, RadioItem, Text
 
-    from dara.components.common import RadioGroup, Item
+    value_var_str = Variable('first')
 
     # you can pass items as a list of values
     RadioGroup(
         items=['first', 'second'],
-        value=Variable('first'),
+        value=value_var_str,
+    )
+
+    value_var_num = Variable(1)
+
+    # or as an `RadioItem` list
+    RadioGroup(
+        items=[RadioItem(label='first',value=1), Item(label='second',value=2)],
+        value=value_var_num,
     )
 
-    # or as an `Item` list
+    # or as an `RadioItem` list with arbitrary components
     RadioGroup(
-        items=[Item(label='first',value=1), Item(label='second',value=2)],
-        value=Variable('first'),
+        items=[
+            RadioItem(label=Text(text='first', color='red'), value=1),
+            RadioItem(label=Text(text='second', color='blue'), value=2)
+        ],
+        value=value_var_num,
     )
     ```
 
@@ -59,7 +78,7 @@ class RadioGroup(FormComponent):
 
     RadioGroup(
         items=['first', 'second'],
-        value=Variable('first'),
+        value=value_var_str,
         direction='horizontal'
     )
     ```
@@ -72,20 +91,18 @@ class RadioGroup(FormComponent):
     :param id: the key to be used if this component is within a form
     """
 
-    items: Union[List[Item], NonDataVariable]
-    value: Optional[Union[Variable[Any], UrlVariable[Any]]] = None
-    list_styling: Optional[bool] = False
-    onchange: Optional[Action] = None
+    items: list[RadioItem] | list[str] | ClientVariable
+    value: Variable[Any] | None = None
+    list_styling: bool | None = False
+    onchange: Action | None = None
     direction: Direction = Direction.VERTICAL
-    id: Optional[str] = None
+    id: str | None = None
 
-    @validator('items', pre=True)
+    @field_validator('items', mode='before')
     @classmethod
-    def validate_items(cls, items: Any) -> Union[List[Item], NonDataVariable]:
-        if isinstance(items, NonDataVariable):
+    def validate_items(cls, items: Any) -> list[RadioItem] | ClientVariable:
+        if isinstance(items, ClientVariable):
             return items
-        if not isinstance(items, list):
-            raise ValueError('Items must be passed as a list to the RadioGroup component')
         if len(items) == 0:
             raise ValueError('Items list is empty, you must provide at least one item')
-        return [Item.to_item(item) for item in items]
+        return [RadioItem(value=item, label=item) if isinstance(item, str) else item for item in items]

dara/components/common/select.py

@@ -15,14 +15,15 @@ See the License for the specific language governing permissions and
 limitations under the License.
 """
 
-from typing import Any, Dict, List, Optional, Union
+from typing import Any
 
-from pydantic import BaseModel, validator
+from pydantic import ValidationInfo, field_validator
 
 from dara.components.common.base_component import FormComponent
 from dara.components.common.utils import Item
 from dara.core.base_definitions import Action
-from dara.core.interactivity import NonDataVariable, UrlVariable, Variable
+from dara.core.base_definitions import DaraBaseModel as BaseModel
+from dara.core.interactivity import ClientVariable, Variable
 from dara.core.logging import dev_logger
 
 
@@ -35,11 +36,11 @@ class ListSection(BaseModel):
     """
 
     label: str
-    items: List[Union[Item, str, dict]]
+    items: list[Item | str | dict]
 
-    @validator('items')
+    @field_validator('items')
     @classmethod
-    def validate_items(cls, items: Any) -> List[Item]:
+    def validate_items(cls, items: Any) -> list[Item]:
         if len(items) == 0:
             raise ValueError('Items of ListSection was empty, you must provide at least one item to the component')
         return [Item.to_item(item) for item in items]
@@ -58,55 +59,59 @@ class Select(FormComponent):
     A Select component is created via:
 
     ```python
-
     from dara.core import Variable
     from dara.components.common import Select
 
+    selection_var = Variable('first')
+
     Select(
-        value=Variable('first'),
+        value=selection_var,
         items=['first', 'second', 'third'],
     )
-
     ```
 
     A searchable Select component is created via:
 
     ```python
-
     from dara.core import Variable
     from dara.components.common import Select
 
+    selection_var = Variable('first')
+
     Select(
-        value=Variable('first'),
+        value=selection_var,
         items=['first', 'second', 'third'],
         searchable=True,
     )
-
     ```
 
     A more complicated example with explicit item labels/values that allows multiple items to be selected at the same time:
 
     ```python
-
     from dara.core import Variable
     from dara.components.common import Select, Item
 
+    selection_var = Variable([1, 2])
+
     Select(
         items=[Item(label='first',value=1), Item(label='second',value=2)],
-        value=Variable([1, 2]),
+        value=selection_var,
         multiselect=True
     )
-
     ```
 
-    Example of using a seclect component to allow selections in a sectioned list:
+    Example of using a select component to allow selections in a sectioned list:
 
     ```python
+    from dara.core import Variable
     from dara.components.common import Select, ListSection
 
+    selection_var = Variable()
+
     Select(
         items=[ListSection(label='Section 1', items=['1 item 1', '1 item 2', '1 item 3']), ListSection(label='Section 2', items=['2 item 1', '2 item 2'])],
         searchable=True,
+        value=selection_var,
     )
     ```
 
@@ -120,21 +125,21 @@ class Select(FormComponent):
     :param value: A Variable instance recording the component's state
     """
 
-    id: Optional[str] = None
+    id: str | None = None
     multiselect: bool = False
     searchable: bool = False
-    items: Union[List[Union[Item, ListSection]], NonDataVariable]
+    items: list[Item | ListSection] | ClientVariable
     max_rows: int = 3
-    onchange: Optional[Action] = None
-    placeholder: Optional[str] = None
-    value: Optional[Union[Variable[Any], UrlVariable[Any]]] = None
+    onchange: Action | None = None
+    placeholder: str | None = None
+    value: Variable[Any] | None = None
 
-    @validator('items', pre=True)
+    @field_validator('items', mode='before')
     @classmethod
-    def validate_items(cls, items: Any, values: Dict[str, Any]) -> Union[List[Item], NonDataVariable]:
-        multiselect = values.get('multiselect')
-        searchable = values.get('searchable')
-        if isinstance(items, NonDataVariable):
+    def validate_items(cls, items: Any, info: ValidationInfo) -> list[Item | ListSection] | ClientVariable:
+        multiselect = info.data.get('multiselect')
+        searchable = info.data.get('searchable')
+        if isinstance(items, ClientVariable):
             return items
         if not isinstance(items, list):
             raise ValueError('Items must be passed as a list to the select component')
@@ -151,19 +156,17 @@ class Select(FormComponent):
         return [Item.to_item(item) for item in items]
 
 
-def _parse_item(item: Any, return_listsection: bool = False):
+def _parse_item(item: Any, return_listsection: bool = False) -> Item | ListSection:
     """
     Converts items to Item objects for a SectionedList. Can return a ListSection for a dictionary if
     return_listsection is set to True.
     """
-    if isinstance(item, list):
-        return [_parse_item(subitem) for subitem in item]
     if isinstance(item, dict):
         if return_listsection and item.get('label') is not None and item.get('items') is not None:
             items = item.get('items')
             if not isinstance(items, list):
                 raise ValueError(f"Dictionary 'items' value for SectionedList must be a list, got {items}")
-            return ListSection(label=str(item.get('label')), items=_parse_item(items))
+            return ListSection(label=str(item.get('label')), items=[Item.to_item(subitem) for subitem in items])
         return Item.to_item(item)
     if isinstance(item, ListSection):
         return item