Close #45: pass attributes that clash with user supplied keyword arguments as a dictionary instead of keywords

Author: cpsievert

examples/inputs/app.py

@@ -48,7 +48,10 @@
                 },
             ),
             st.input_action_button(
-                "button", "input_action_button()", icon=icon_svg("check")
+                "button",
+                "input_action_button()",
+                icon=icon_svg("check"),
+                class_="btn-primary",
             ),
             st.input_file("file", "File upload"),
         ),
@@ -69,7 +72,10 @@
                     ),
                     tags.br(),
                     st.input_action_button(
-                        "btn", "Show modal", icon=icon_svg("info-circle")
+                        "btn",
+                        "Show modal",
+                        icon=icon_svg("info-circle"),
+                        class_="btn-primary",
                     ),
                     st.panel_fixed(
                         st.panel_well(
@@ -138,7 +144,13 @@ def image():
     def _():
         btn = input.btn()
         if btn and btn > 0:
-            st.modal_show(st.modal("Hello there!", easy_close=True))
+            st.modal_show(
+                st.modal(
+                    "Hello there!",
+                    easy_close=True,
+                    footer=st.modal_button("Dismiss", class_="btn-primary"),
+                )
+            )
 
     @reactive.effect()
     def _():

shiny/ui_toolkit/bootstrap.py

@@ -23,7 +23,7 @@
 
 
 def row(*args: TagChildArg, **kwargs: TagAttrArg) -> Tag:
-    return div(*args, class_="row", **kwargs)
+    return div({"class": "row"}, *args, **kwargs)
 
 
 def column(
@@ -38,7 +38,7 @@ def column(
         # https://github.com/twbs/bootstrap/blob/74b8fe7/docs/4.3/migration/index.html#L659
         off = str(offset)
         cls += f" offset-md-{off} col-sm-offset-{off}"
-    return div(*args, class_=cls, **kwargs)
+    return div({"class": cls}, *args, **kwargs)
 
 
 # TODO: also accept a generic list (and wrap in panel in that case)
@@ -49,23 +49,23 @@ def layout_sidebar(
 
 
 def panel_well(*args: TagChildArg, **kwargs: TagAttrArg) -> Tag:
-    return div(*args, class_="well", **kwargs)
+    return div({"class": "well"}, *args, **kwargs)
 
 
 def panel_sidebar(*args: TagChildArg, width: int = 4, **kwargs: TagAttrArg) -> Tag:
     return div(
+        {"class": "col-sm-" + str(width)},
         # A11y semantic landmark for sidebar
-        tags.form(*args, role="complementary", class_="well", **kwargs),
-        class_="col-sm-" + str(width),
+        tags.form({"class": "well"}, *args, role="complementary", **kwargs),
     )
 
 
 def panel_main(*args: TagChildArg, width: int = 8, **kwargs: TagAttrArg) -> Tag:
     return div(
+        {"class": "col-sm-" + str(width)},
         # A11y semantic landmark for main region
         *args,
         role="main",
-        class_="col-sm-" + str(width),
         **kwargs,
     )
 
@@ -131,4 +131,4 @@ def panel_absolute(
 
 
 def help_text(*args: TagChildArg, **kwargs: TagAttrArg) -> Tag:
-    return span(*args, class_="help-block", **kwargs)
+    return span({"class": "help-block"}, *args, **kwargs)

shiny/ui_toolkit/download_button.py

@@ -5,21 +5,18 @@
 from ..shinyenv import is_pyodide
 
 
-# TODO: implement icon
 def download_button(
     id: str,
     label: TagChildArg,
     icon: TagChildArg = None,
-    class_: Optional[str] = None,
     width: Optional[str] = None,
     **kwargs: TagAttrArg,
 ) -> Tag:
     return tags.a(
         icon,
         label,
+        {"class": "btn btn-default shiny-download-link", "style": css(width=width)},
         id=id,
-        class_=f"btn btn-default shiny-download-link {class_}",
-        style=css(width=width),
         # This is a fake link that just results in a 404. It will be replaced by a
         # working link after the server side logic runs, so this link will only be
         # visited in cases where the user clicks the button too fast, or if the server
@@ -38,16 +35,14 @@ def download_link(
     id: str,
     label: TagChildArg,
     icon: TagChildArg = None,
-    class_: Optional[str] = None,
     width: Optional[str] = None,
     **kwargs: TagAttrArg,
 ) -> Tag:
     return tags.a(
         icon,
         label,
+        {"class": "shiny-download-link", "style": css(width=width)},
         id=id,
-        class_=f"shiny-download-link {class_}",
-        style=css(width=width),
         href="session/0/download/missing_download",
         target="_blank",
         download=None if is_pyodide else True,

shiny/ui_toolkit/input_action_button.py

@@ -11,12 +11,11 @@ def input_action_button(
     **kwargs: TagAttrArg,
 ) -> Tag:
     return tags.button(
+        {"class": "btn btn-default action-button", "style": css(width=width)},
         icon,
         label,
         id=id,
         type="button",
-        class_="btn btn-default action-button",
-        style=css(width=width),
         **kwargs,
     )
 
@@ -27,4 +26,4 @@ def input_action_link(
     icon: TagChildArg = None,
     **kwargs: TagAttrArg,
 ) -> Tag:
-    return tags.a(icon, label, id=id, href="#", class_="action-button", **kwargs)
+    return tags.a({"class": "action-button"}, icon, label, id=id, href="#", **kwargs)

shiny/ui_toolkit/input_date.py

@@ -124,8 +124,8 @@ def date_input_tag(
 ):
     return tags.input(
         datepicker_deps(),
+        {"class": "form-control"},
         type="text",
-        class_="form-control",
         # `aria-labelledby` attribute is required for accessibility to avoid doubled labels (#2951).
         aria_labelledby=id + "-label",
         # title attribute is announced for screen readers for date format.

shiny/ui_toolkit/modal.py

@@ -12,14 +12,15 @@
 from ..session import Session, _require_active_session, _process_deps
 
 
-def modal_button(label: str, icon: TagChildArg = None) -> Tag:
+def modal_button(label: str, icon: TagChildArg = None, **kwargs: TagChildArg) -> Tag:
     return tags.button(
         icon,
         label,
+        {"class": "btn btn-default"},
         type="button",
-        class_="btn btn-default",
         data_dismiss="modal",
         data_bs_dismiss="modal",
+        **kwargs
     )
 
 
@@ -43,7 +44,7 @@ def modal(
     dialog = div(
         div(
             title_div,
-            div(*args, class_="modal-body", **kwargs),
+            div({"class": "modal-body"}, *args, **kwargs),
             footer,
             class_="modal-content",
         ),

shiny/ui_toolkit/output.py

@@ -39,4 +39,4 @@ def output_ui(
 ) -> Tag:
     if not container:
         container = tags.span if inline else tags.div
-    return container(id=id, class_="shiny-html-output", **kwargs)  # type: ignore
+    return container({"class": "shiny-html-output"}, id=id, **kwargs)

shiny/ui_toolkit/page.py

@@ -62,15 +62,15 @@ def page_fluid(
     *args: Any, title: Optional[str] = None, lang: Optional[str] = None, **kwargs: str
 ) -> Tag:
     return page_bootstrap(
-        div(*args, class_="container-fluid", **kwargs), title=title, lang=lang
+        div({"class": "container-fluid"}, *args, **kwargs), title=title, lang=lang
     )
 
 
 def page_fixed(
     *args: Any, title: Optional[str] = None, lang: Optional[str] = None, **kwargs: str
 ) -> Tag:
     return page_bootstrap(
-        div(*args, class_="container", **kwargs), title=title, lang=lang
+        div({"class": "container"}, *args, **kwargs), title=title, lang=lang
     )