Leverage consolidate_attrs() with class_ and **kwargs

Author: schloerke

shiny/experimental/ui/_card.py

@@ -12,30 +12,6 @@
 from ._fill import bind_fill_role
 from ._utils import consolidate_attrs
 
-# class Page:
-#     x: Tag
-#     def __init__(
-#         self,
-#         x: Tag,
-#     ):
-#         self.x = x
-
-
-# class Fragment:
-#     x: Tag
-#     page: Page
-#     def __init__(
-#         self,
-#         x: Tag,
-#         page: Page,
-#     ):
-#         self.x = x
-#         self.page = page
-
-
-# def as_fragment(x: Tag, page: Page) -> Fragment:
-#     return Fragment(x=x, page=page)
-
 
 # A Bootstrap card component
 #
@@ -97,14 +73,14 @@ def card(
     height: Optional[CssUnit] = None,
     max_height: Optional[CssUnit] = None,
     fill: bool = True,
-    class_: Optional[str] = None,  # Applies after `bind_fill_role()`
+    class_: Optional[str] = None,
     wrapper: WrapperCallable | None | MISSING_TYPE = MISSING,
     **kwargs: TagAttrValue,
 ) -> Tag:
     if isinstance(wrapper, MISSING_TYPE):
         wrapper = card_body
 
-    attrs, children = consolidate_attrs(*args)
+    attrs, children = consolidate_attrs(*args, class_=class_, **kwargs)
     children = wrap_children_in_card(*children, wrapper=wrapper)
 
     tag = div(
@@ -119,14 +95,9 @@ def card(
         *attrs,
         full_screen_toggle() if full_screen else None,
         card_js_init(),
-        **kwargs,
     )
 
-    tag = bind_fill_role(tag, container=True, item=fill)
-    # Give the user an opportunity to override the classes added by bind_fill_role()
-    if class_ is not None:
-        tag.add_class(class_)
-    return tag
+    return bind_fill_role(tag, container=True, item=fill)
 
 
 def card_js_init() -> Tag:

shiny/experimental/ui/_card_item.py

@@ -77,7 +77,7 @@ def card_body(
     height: Optional[CssUnit] = None,
     gap: Optional[CssUnit] = None,
     fill: bool = True,
-    class_: Optional[str] = None,  # Applies after `bind_fill_role()`
+    class_: Optional[str] = None,
     **kwargs: TagAttrValue,
 ) -> CardItem:
     if isinstance(max_height_full_screen, MISSING_TYPE):
@@ -102,16 +102,13 @@ def card_body(
             "class": "card-body",
             "style": css(**div_style_args),
         },
+        class_=class_,
         **kwargs,
     )
 
-    tag = bind_fill_role(tag, item=fill, container=fillable)
-
-    # Give the user an opportunity to override the classes added by bind_fill_role()
-    if class_ is not None:
-        tag.add_class(class_)
-
-    return CardItem(tag)
+    return CardItem(
+        bind_fill_role(tag, item=fill, container=fillable),
+    )
 
 
 # https://mypy.readthedocs.io/en/stable/protocols.html#callback-protocols
@@ -248,7 +245,7 @@ def card_image(
     href: Optional[str] = None,
     border_radius: Literal["top", "bottom", "all", "none"] = "top",
     mime_type: Optional[str] = None,
-    class_: Optional[str] = None,  # Applies after `bind_fill_role()`
+    class_: Optional[str] = None,
     height: Optional[CssUnit] = None,
     fill: bool = True,
     width: Optional[CssUnit] = None,
@@ -288,13 +285,11 @@ def card_image(
         },
         {"class": card_class_map.get(border_radius, None)},
         *args,
+        class_=class_,
         **kwargs,
     )
 
     image = bind_fill_role(image, item=fill)
-    # Give the user an opportunity to override the classes added by bind_fill_role()
-    if class_ is not None:
-        image.add_class(class_)
 
     if href is not None:
         image = bind_fill_role(tags.a(image, href=href), container=True, item=True)

shiny/experimental/ui/_fill.py

@@ -5,6 +5,7 @@
 from htmltools import Tag
 
 from ._htmldeps import fill_dependency
+from ._tag import tag_prepend_class, tag_remove_class
 
 
 # TODO-future:
@@ -38,34 +39,3 @@ def bind_fill_role(
             tag_remove_class(tag, "html-fill-container")
 
     return tag
-
-
-# Tag.add_class(x: str) -> Self[Tag]:
-#     cls = self.attrs.get("class")
-#     if cls:
-#         x = cls + " " + x
-#     self.attrs["class"] = x
-#     return self
-
-
-def tag_prepend_class(tag: Tag, x: str) -> Tag:
-    cls = tag.attrs.get("class")
-    if cls:
-        # Prepend the class!
-        x = x + " " + cls
-    tag.attrs["class"] = x
-    return tag
-
-
-def tag_remove_class(tag: Tag, x: str) -> Tag:
-    cls = tag.attrs.get("class")
-    if not cls:
-        return tag
-    if x == cls:
-        tag.attrs.pop("class")
-        return tag
-
-    tag.attrs["class"] = " ".join(
-        [cls_val for cls_val in cls.split(" ") if cls_val != x]
-    )
-    return tag

shiny/experimental/ui/_layout.py

@@ -63,10 +63,10 @@ def layout_column_wrap(
     height: Optional[CssUnit] = None,
     height_mobile: Optional[CssUnit] = None,
     gap: Optional[CssUnit] = None,
-    class_: Optional[str] = None,  # Applies after `bind_fill_role()`
+    class_: Optional[str] = None,
     **kwargs: TagAttrValue,
 ):
-    attrs, children = consolidate_attrs(*args, **kwargs)
+    attrs, children = consolidate_attrs(*args, class_=class_, **kwargs)
 
     colspec: str | None = None
     if width is not None:
@@ -117,9 +117,4 @@ def layout_column_wrap(
         **attrs,
     )
 
-    tag = bind_fill_role(tag, item=fill)
-    # Give the user an opportunity to override the classes added by bind_fill_role()
-    if class_ is not None:
-        tag.add_class(class_)
-
-    return tag
+    return bind_fill_role(tag, item=fill)

shiny/experimental/ui/_page.py

@@ -2,12 +2,13 @@
 
 from typing import Optional, overload
 
-from htmltools import TagAttrs, TagChild, css, tags
+from htmltools import TagAttrs, TagAttrValue, TagChild, css, tags
 
 from shiny import ui
 
 from ._css import CssUnit, validate_css_unit
 from ._fill import bind_fill_role
+from ._utils import consolidate_attrs
 
 
 def page_fillable(
@@ -17,9 +18,11 @@ def page_fillable(
     fill_mobile: bool = False,
     title: Optional[str] = None,
     lang: Optional[str] = None,
+    **kwargs: TagAttrValue,
 ):
+    attrs, children = consolidate_attrs(*args, **kwargs)
+
     style = css(
-        # TODO: validate_css_padding(padding)
         padding=validate_css_padding(padding),
         gap=validate_css_unit(gap),
         __bslib_page_fill_mobile_height="100%" if fill_mobile else "auto",
@@ -28,7 +31,11 @@ def page_fillable(
     return ui.page_bootstrap(
         tags.head(tags.style("html { height: 100%; }")),
         bind_fill_role(
-            tags.body(class_="bslib-page-fill", style=style, *args),
+            tags.body(
+                {"class_": "bslib-page-fill", "style": style},
+                *children,
+                **attrs,
+            ),
             container=True,
         ),
         title=title,

shiny/experimental/ui/_tag.py

@@ -0,0 +1,88 @@
+from __future__ import annotations
+
+from htmltools import Tag, css
+
+# Tag.add_class(x: str) -> Self[Tag]:
+#     cls = self.attrs.get("class")
+#     if cls:
+#         x = cls + " " + x
+#     self.attrs["class"] = x
+#     return self
+
+
+# Do not export
+# "Prepend" version of `tag.add_class(class_)`
+def tag_prepend_class(tag: Tag, class_: str) -> Tag:
+    cls = tag.attrs.get("class")
+    if cls:
+        # Prepend the class!
+        class_ = class_ + " " + cls
+    tag.attrs["class"] = class_
+    return tag
+
+
+def tag_remove_class(tag: Tag, x: str) -> Tag:
+    """
+    Remove a class value from the HTML class attribute.
+
+    Parameters
+    ----------
+    class_
+        The class name to remove.
+
+    Returns
+    -------
+    :
+        The modified tag.
+    """
+    cls = tag.attrs.get("class")
+    if not cls:
+        return tag
+    if x == cls:
+        tag.attrs.pop("class")
+        return tag
+
+    tag.attrs["class"] = " ".join(
+        [cls_val for cls_val in cls.split(" ") if cls_val != x]
+    )
+    return tag
+
+
+def tag_add_style(
+    tag: Tag, *style: str, collapse_: str = "", **kwargs: str | float | None
+) -> Tag:
+    raise RuntimeError("Method currently not used. Remove this error message to use.")
+    """
+    Add a style value(s) to the HTML style attribute.
+
+    Parameters
+    ----------
+    *style
+        CSS properties and values already properly formatted. Each should already contain trailing semicolons.
+    collapse_
+        Character to use to collapse properties into a single string; likely "" (the
+        default) for style attributes, and either "\n" or None for style blocks.
+    **kwargs
+        Named style properties, where the name is the property name and the argument is
+        the property value. These values are sent to `~htmltools.css` to be formatted.
+
+    See Also
+    --------
+    ~htmltools.css
+
+    Returns
+    -------
+    :
+        The modified tag.
+    """
+    css_str = css(collapse_=collapse_, **kwargs)
+    if css_str is not None:
+        style += (css_str,)
+    style_str = " ".join(style)
+
+    # Append to existing style value if it exists
+    style_attr = tag.attrs.get("style")
+    if style_attr:
+        style_str = style_attr + " " + style_str
+    tag.attrs["style"] = style_str
+    return tag

shiny/experimental/ui/_utils.py

@@ -1,17 +1,17 @@
 from __future__ import annotations
 
-from shiny._typing_extensions import TypeGuard
 import typing
 
 from htmltools import TagAttrs, TagAttrValue, TagChild, div
 
+from shiny._typing_extensions import TypeGuard
+
 T = typing.TypeVar("T", bound=TagChild)
 
 # Export this type from htmltools
 TagAttrDict = typing.Dict[str, str]
 
 
-# TODO-barret; leverage `consolidate_attrs()` with `class_` and `**kwargs`
 def consolidate_attrs(
     *args: T | TagAttrs,
     **kwargs: TagAttrValue,

shiny/experimental/ui/_valuebox.py

@@ -1,6 +1,7 @@
 from __future__ import annotations
 
 import numbers
+import typing
 from typing import Callable, Optional
 
 from htmltools import Tag, TagAttrs, TagAttrValue, TagChild, css, div
@@ -10,7 +11,7 @@
 from ._css import CssUnit, validate_css_unit
 from ._fill import bind_fill_role
 from ._layout import layout_column_wrap
-from ._utils import is_01_scalar
+from ._utils import consolidate_attrs, is_01_scalar
 
 
 # It seems to be to use % over fr here since there is no gap on the grid
@@ -39,9 +40,11 @@ def value_box(
     height: Optional[CssUnit] = None,
     max_height: Optional[CssUnit] = None,
     fill: bool = True,
-    class_: Optional[str] = None,  # Applies after `bind_fill_role()` inside `card()`
+    class_: Optional[str] = None,
     **kwargs: TagAttrValue,
 ) -> Tag:
+    attrs, children = consolidate_attrs(*args, **kwargs)
+
     if showcase_layout is None:
         showcase_layout = showcase_left_center()
     if isinstance(title, str) or isinstance(title, numbers.Number):
@@ -52,7 +55,7 @@ def value_box(
     contents = div(
         title,
         value,
-        *args,
+        *children,
         class_="value-box-area",
     )
     contents = bind_fill_role(contents, container=True, item=True)
@@ -66,12 +69,17 @@ def value_box(
 
     return card(
         contents,
+        # Must be before `attrs` so that `class_` is applied before any `attrs` values
+        {"class": f"bslib-value-box border-0{theme_class_str}"},
+        # TODO-barret: Why is `TagAttrDict` not accepted here as a `TagAttrs` object?
+        # TagAttrDict: Dict[str, str]
+        # TagAttrs: Dict[str, str | float | bool | None]
+        typing.cast(TagAttrs, attrs),
         class_=f"bslib-value-box border-0{theme_class_str}{class_str}",
         full_screen=full_screen,
         height=height,
         max_height=max_height,
         fill=fill,
-        **kwargs,
     )