reflex 0.4.6a4__py3-none-any.whl → 0.4.7a1__py3-none-any.whl

reflex/components/component.py

@@ -76,15 +76,7 @@ class BaseComponent(Base, ABC):
         """
 
     @abstractmethod
-    def get_ref_hooks(self) -> set[str]:
-        """Get the hooks required by refs in this component.
-
-        Returns:
-            The hooks for the refs.
-        """
-
-    @abstractmethod
-    def get_hooks_internal(self) -> set[str]:
+    def _get_all_hooks_internal(self) -> dict[str, None]:
         """Get the reflex internal hooks for the component and its children.
 
         Returns:
@@ -92,7 +84,7 @@ class BaseComponent(Base, ABC):
         """
 
     @abstractmethod
-    def get_hooks(self) -> set[str]:
+    def _get_all_hooks(self) -> dict[str, None]:
         """Get the React hooks for this component.
 
         Returns:
@@ -100,7 +92,7 @@ class BaseComponent(Base, ABC):
         """
 
     @abstractmethod
-    def get_imports(self) -> imports.ImportDict:
+    def _get_all_imports(self) -> imports.ImportDict:
         """Get all the libraries and fields that are used by the component.
 
         Returns:
@@ -108,7 +100,7 @@ class BaseComponent(Base, ABC):
         """
 
     @abstractmethod
-    def get_dynamic_imports(self) -> set[str]:
+    def _get_all_dynamic_imports(self) -> set[str]:
         """Get dynamic imports for the component.
 
         Returns:
@@ -116,7 +108,7 @@ class BaseComponent(Base, ABC):
         """
 
     @abstractmethod
-    def get_custom_code(self) -> set[str]:
+    def _get_all_custom_code(self) -> set[str]:
         """Get custom code for the component.
 
         Returns:
@@ -124,7 +116,7 @@ class BaseComponent(Base, ABC):
         """
 
     @abstractmethod
-    def get_refs(self) -> set[str]:
+    def _get_all_refs(self) -> set[str]:
         """Get the refs for the children of the component.
 
         Returns:
@@ -645,6 +637,9 @@ class Component(BaseComponent, ABC):
                 )
                 props[prop] = props.pop(under_prop)
 
+        # Filter out None props
+        props = {key: value for key, value in props.items() if value is not None}
+
         # Validate all the children.
         for child in children:
             # Make sure the child is a valid type.
@@ -674,7 +669,7 @@ class Component(BaseComponent, ABC):
         """
         self.style.update(style)
 
-    def add_style(self, style: ComponentStyle) -> Component:
+    def _add_style_recursive(self, style: ComponentStyle) -> Component:
         """Add additional style to the component and its children.
 
         Args:
@@ -703,7 +698,7 @@ class Component(BaseComponent, ABC):
             # Skip BaseComponent and StatefulComponent children.
             if not isinstance(child, Component):
                 continue
-            child.add_style(style)
+            child._add_style_recursive(style)
         return self
 
     def _get_style(self) -> dict:
@@ -926,7 +921,7 @@ class Component(BaseComponent, ABC):
         """
         return None
 
-    def get_custom_code(self) -> Set[str]:
+    def _get_all_custom_code(self) -> set[str]:
         """Get custom code for the component and its children.
 
         Returns:
@@ -942,7 +937,7 @@ class Component(BaseComponent, ABC):
 
         # Add the custom code for the children.
         for child in self.children:
-            code |= child.get_custom_code()
+            code |= child._get_all_custom_code()
 
         # Return the code.
         return code
@@ -955,7 +950,7 @@ class Component(BaseComponent, ABC):
         """
         return None
 
-    def get_dynamic_imports(self) -> Set[str]:
+    def _get_all_dynamic_imports(self) -> Set[str]:
         """Get dynamic imports for the component and its children.
 
         Returns:
@@ -971,11 +966,11 @@ class Component(BaseComponent, ABC):
 
         # Get the dynamic imports from children
         for child in self.children:
-            dynamic_imports |= child.get_dynamic_imports()
+            dynamic_imports |= child._get_all_dynamic_imports()
 
         for prop in self.get_component_props():
             if getattr(self, prop) is not None:
-                dynamic_imports |= getattr(self, prop).get_dynamic_imports()
+                dynamic_imports |= getattr(self, prop)._get_all_dynamic_imports()
 
         # Return the dynamic imports
         return dynamic_imports
@@ -987,7 +982,7 @@ class Component(BaseComponent, ABC):
             The  imports for the components props of the component.
         """
         return [
-            getattr(self, prop).get_imports()
+            getattr(self, prop)._get_all_imports()
             for prop in self.get_component_props()
             if getattr(self, prop) is not None
         ]
@@ -1058,7 +1053,7 @@ class Component(BaseComponent, ABC):
             *var_imports,
         )
 
-    def get_imports(self, collapse: bool = False) -> imports.ImportDict:
+    def _get_all_imports(self, collapse: bool = False) -> imports.ImportDict:
         """Get all the libraries and fields that are used by the component and its children.
 
         Args:
@@ -1068,7 +1063,7 @@ class Component(BaseComponent, ABC):
             The import dict with the required imports.
         """
         _imports = imports.merge_imports(
-            self._get_imports(), *[child.get_imports() for child in self.children]
+            self._get_imports(), *[child._get_all_imports() for child in self.children]
         )
         return imports.collapse_imports(_imports) if collapse else _imports
 
@@ -1105,62 +1100,53 @@ class Component(BaseComponent, ABC):
         if ref is not None:
             return f"const {ref} = useRef(null); {str(Var.create_safe(ref).as_ref())} = {ref};"
 
-    def _get_vars_hooks(self) -> set[str]:
+    def _get_vars_hooks(self) -> dict[str, None]:
         """Get the hooks required by vars referenced in this component.
 
         Returns:
             The hooks for the vars.
         """
-        vars_hooks = set()
+        vars_hooks = {}
         for var in self._get_vars():
             if var._var_data:
                 vars_hooks.update(var._var_data.hooks)
         return vars_hooks
 
-    def _get_events_hooks(self) -> set[str]:
+    def _get_events_hooks(self) -> dict[str, None]:
         """Get the hooks required by events referenced in this component.
 
         Returns:
             The hooks for the events.
         """
-        if self.event_triggers:
-            return {Hooks.EVENTS}
-        return set()
+        return {Hooks.EVENTS: None} if self.event_triggers else {}
 
-    def _get_special_hooks(self) -> set[str]:
+    def _get_special_hooks(self) -> dict[str, None]:
         """Get the hooks required by special actions referenced in this component.
 
         Returns:
             The hooks for special actions.
         """
-        if self.autofocus:
-            return {
-                """
-                // Set focus to the specified element.
-                const focusRef = useRef(null)
-                useEffect(() => {
-                  if (focusRef.current) {
-                    focusRef.current.focus();
-                  }
-                })""",
-            }
-        return set()
+        return {Hooks.AUTOFOCUS: None} if self.autofocus else {}
 
-    def _get_hooks_internal(self) -> Set[str]:
+    def _get_hooks_internal(self) -> dict[str, None]:
         """Get the React hooks for this component managed by the framework.
 
         Downstream components should NOT override this method to avoid breaking
         framework functionality.
 
         Returns:
-            Set of internally managed hooks.
+            The internally managed hooks.
         """
-        return (
-            self._get_vars_hooks()
-            | self._get_events_hooks()
-            | self._get_special_hooks()
-            | set(hook for hook in [self._get_mount_lifecycle_hook()] if hook)
-        )
+        return {
+            **{
+                hook: None
+                for hook in [self._get_ref_hook(), self._get_mount_lifecycle_hook()]
+                if hook is not None
+            },
+            **self._get_vars_hooks(),
+            **self._get_events_hooks(),
+            **self._get_special_hooks(),
+        }
 
     def _get_hooks(self) -> str | None:
         """Get the React hooks for this component.
@@ -1172,20 +1158,7 @@ class Component(BaseComponent, ABC):
         """
         return
 
-    def get_ref_hooks(self) -> Set[str]:
-        """Get the ref hooks for the component and its children.
-
-        Returns:
-            The ref hooks.
-        """
-        ref_hook = self._get_ref_hook()
-        hooks = set() if ref_hook is None else {ref_hook}
-
-        for child in self.children:
-            hooks |= child.get_ref_hooks()
-        return hooks
-
-    def get_hooks_internal(self) -> set[str]:
+    def _get_all_hooks_internal(self) -> dict[str, None]:
         """Get the reflex internal hooks for the component and its children.
 
         Returns:
@@ -1196,26 +1169,26 @@ class Component(BaseComponent, ABC):
 
         # Add the hook code for the children.
         for child in self.children:
-            code |= child.get_hooks_internal()
+            code = {**code, **child._get_all_hooks_internal()}
 
         return code
 
-    def get_hooks(self) -> Set[str]:
+    def _get_all_hooks(self) -> dict[str, None]:
         """Get the React hooks for this component and its children.
 
         Returns:
             The code that should appear just before returning the rendered component.
         """
-        code = set()
+        code = {}
 
         # Add the hook code for this component.
         hooks = self._get_hooks()
         if hooks is not None:
-            code.add(hooks)
+            code[hooks] = None
 
         # Add the hook code for the children.
         for child in self.children:
-            code |= child.get_hooks()
+            code = {**code, **child._get_all_hooks()}
 
         return code
 
@@ -1230,7 +1203,7 @@ class Component(BaseComponent, ABC):
             return None
         return format.format_ref(self.id)
 
-    def get_refs(self) -> Set[str]:
+    def _get_all_refs(self) -> set[str]:
         """Get the refs for the children of the component.
 
         Returns:
@@ -1241,10 +1214,10 @@ class Component(BaseComponent, ABC):
         if ref is not None:
             refs.add(ref)
         for child in self.children:
-            refs |= child.get_refs()
+            refs |= child._get_all_refs()
         return refs
 
-    def get_custom_components(
+    def _get_all_custom_components(
         self, seen: set[str] | None = None
     ) -> Set[CustomComponent]:
         """Get all the custom components used by the component.
@@ -1264,7 +1237,7 @@ class Component(BaseComponent, ABC):
             # Skip BaseComponent and StatefulComponent children.
             if not isinstance(child, Component):
                 continue
-            custom_components |= child.get_custom_components(seen=seen)
+            custom_components |= child._get_all_custom_components(seen=seen)
         return custom_components
 
     @property
@@ -1288,7 +1261,7 @@ class Component(BaseComponent, ABC):
         """
         return {}
 
-    def get_app_wrap_components(self) -> dict[tuple[int, str], Component]:
+    def _get_all_app_wrap_components(self) -> dict[tuple[int, str], Component]:
         """Get the app wrap components for the component and its children.
 
         Returns:
@@ -1298,14 +1271,14 @@ class Component(BaseComponent, ABC):
         components = self._get_app_wrap_components()
 
         for component in tuple(components.values()):
-            components.update(component.get_app_wrap_components())
+            components.update(component._get_all_app_wrap_components())
 
         # Add the app wrap components for the children.
         for child in self.children:
             # Skip BaseComponent and StatefulComponent children.
             if not isinstance(child, Component):
                 continue
-            components.update(child.get_app_wrap_components())
+            components.update(child._get_all_app_wrap_components())
 
         # Return the components.
         return components
@@ -1374,8 +1347,8 @@ class CustomComponent(Component):
                     self.component_props[key] = value
                     value = base_value._replace(
                         merge_var_data=VarData(  # type: ignore
-                            imports=value.get_imports(),
-                            hooks=value.get_hooks(),
+                            imports=value._get_all_imports(),
+                            hooks=value._get_all_hooks(),
                         )
                     )
                 else:
@@ -1414,7 +1387,7 @@ class CustomComponent(Component):
         """
         return set()
 
-    def get_custom_components(
+    def _get_all_custom_components(
         self, seen: set[str] | None = None
     ) -> Set[CustomComponent]:
         """Get all the custom components used by the component.
@@ -1430,12 +1403,12 @@ class CustomComponent(Component):
         # Store the seen components in a set to avoid infinite recursion.
         if seen is None:
             seen = set()
-        custom_components = {self} | super().get_custom_components(seen=seen)
+        custom_components = {self} | super()._get_all_custom_components(seen=seen)
 
         # Avoid adding the same component twice.
         if self.tag not in seen:
             seen.add(self.tag)
-            custom_components |= self.get_component(self).get_custom_components(
+            custom_components |= self.get_component(self)._get_all_custom_components(
                 seen=seen
             )
 
@@ -1447,7 +1420,9 @@ class CustomComponent(Component):
                 seen.add(child_component.tag)
                 if isinstance(child_component, CustomComponent):
                     custom_components |= {child_component}
-                custom_components |= child_component.get_custom_components(seen=seen)
+                custom_components |= child_component._get_all_custom_components(
+                    seen=seen
+                )
         return custom_components
 
     def _render(self) -> Tag:
@@ -1851,31 +1826,23 @@ class StatefulComponent(BaseComponent):
             )
         return trigger_memo
 
-    def get_ref_hooks(self) -> set[str]:
-        """Get the ref hooks for the component and its children.
-
-        Returns:
-            The ref hooks.
-        """
-        return set()
-
-    def get_hooks_internal(self) -> set[str]:
+    def _get_all_hooks_internal(self) -> dict[str, None]:
         """Get the reflex internal hooks for the component and its children.
 
         Returns:
             The code that should appear just before user-defined hooks.
         """
-        return set()
+        return {}
 
-    def get_hooks(self) -> set[str]:
+    def _get_all_hooks(self) -> dict[str, None]:
         """Get the React hooks for this component.
 
         Returns:
             The code that should appear just before returning the rendered component.
         """
-        return set()
+        return {}
 
-    def get_imports(self) -> imports.ImportDict:
+    def _get_all_imports(self) -> imports.ImportDict:
         """Get all the libraries and fields that are used by the component.
 
         Returns:
@@ -1887,9 +1854,9 @@ class StatefulComponent(BaseComponent):
                     ImportVar(tag=self.tag)
                 ]
             }
-        return self.component.get_imports()
+        return self.component._get_all_imports()
 
-    def get_dynamic_imports(self) -> set[str]:
+    def _get_all_dynamic_imports(self) -> set[str]:
         """Get dynamic imports for the component.
 
         Returns:
@@ -1897,9 +1864,9 @@ class StatefulComponent(BaseComponent):
         """
         if self.rendered_as_shared:
             return set()
-        return self.component.get_dynamic_imports()
+        return self.component._get_all_dynamic_imports()
 
-    def get_custom_code(self) -> set[str]:
+    def _get_all_custom_code(self) -> set[str]:
         """Get custom code for the component.
 
         Returns:
@@ -1907,9 +1874,9 @@ class StatefulComponent(BaseComponent):
         """
         if self.rendered_as_shared:
             return set()
-        return self.component.get_custom_code().union({self.code})
+        return self.component._get_all_custom_code().union({self.code})
 
-    def get_refs(self) -> set[str]:
+    def _get_all_refs(self) -> set[str]:
         """Get the refs for the children of the component.
 
         Returns:
@@ -1917,7 +1884,7 @@ class StatefulComponent(BaseComponent):
         """
         if self.rendered_as_shared:
             return set()
-        return self.component.get_refs()
+        return self.component._get_all_refs()
 
     def render(self) -> dict:
         """Define how to render the component in React.
@@ -1975,7 +1942,7 @@ class MemoizationLeaf(Component):
             The memoization leaf
         """
         comp = super().create(*children, **props)
-        if comp.get_hooks() or comp.get_hooks_internal():
+        if comp._get_all_hooks() or comp._get_all_hooks_internal():
             comp._memoization_mode = cls._memoization_mode.copy(
                 update={"disposition": MemoizationDisposition.ALWAYS}
             )

reflex/components/core/banner.py

@@ -22,7 +22,7 @@ from reflex.vars import Var, VarData
 
 connect_error_var_data: VarData = VarData(  # type: ignore
     imports=Imports.EVENTS,
-    hooks={Hooks.EVENTS},
+    hooks={Hooks.EVENTS: None},
 )
 
 connection_error: Var = Var.create_safe(

reflex/components/core/upload.py

@@ -1,4 +1,5 @@
 """A file upload component."""
+
 from __future__ import annotations
 
 import os
@@ -31,7 +32,7 @@ upload_files_context_var_data: VarData = VarData(  # type: ignore
         },
     },
     hooks={
-        "const [filesById, setFilesById] = useContext(UploadFilesContext);",
+        "const [filesById, setFilesById] = useContext(UploadFilesContext);": None,
     },
 )
 

reflex/components/datadisplay/__init__.py

@@ -4,6 +4,7 @@ from .code import CodeBlock
 from .code import LiteralCodeBlockTheme as LiteralCodeBlockTheme
 from .code import LiteralCodeLanguage as LiteralCodeLanguage
 from .dataeditor import DataEditor, DataEditorTheme
+from .logo import logo
 
 code_block = CodeBlock.create
 data_editor = DataEditor.create

reflex/components/datadisplay/logo.py

@@ -0,0 +1,49 @@
+"""A Reflex logo component."""
+import reflex as rx
+
+
+def logo(**props):
+    """A Reflex logo.
+
+    Args:
+        **props: The props to pass to the component.
+
+    Returns:
+        The logo component.
+    """
+    light_mode_logo = """<svg width="56" height="12" viewBox="0 0 56 12" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M0 11.6V0.400024H8.96V4.88002H6.72V2.64002H2.24V4.88002H6.72V7.12002H2.24V11.6H0ZM6.72 11.6V7.12002H8.96V11.6H6.72Z" fill="#110F1F"/>
+<path d="M11.2 11.6V0.400024H17.92V2.64002H13.44V4.88002H17.92V7.12002H13.44V9.36002H17.92V11.6H11.2Z" fill="#110F1F"/>
+<path d="M20.16 11.6V0.400024H26.88V2.64002H22.4V4.88002H26.88V7.12002H22.4V11.6H20.16Z" fill="#110F1F"/>
+<path d="M29.12 11.6V0.400024H31.36V9.36002H35.84V11.6H29.12Z" fill="#110F1F"/>
+<path d="M38.08 11.6V0.400024H44.8V2.64002H40.32V4.88002H44.8V7.12002H40.32V9.36002H44.8V11.6H38.08Z" fill="#110F1F"/>
+<path d="M47.04 4.88002V0.400024H49.28V4.88002H47.04ZM53.76 4.88002V0.400024H56V4.88002H53.76ZM49.28 7.12002V4.88002H53.76V7.12002H49.28ZM47.04 11.6V7.12002H49.28V11.6H47.04ZM53.76 11.6V7.12002H56V11.6H53.76Z" fill="#110F1F"/>
+</svg>"""
+
+    dark_mode_logo = """<svg width="56" height="12" viewBox="0 0 56 12" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M0 11.5999V0.399902H8.96V4.8799H6.72V2.6399H2.24V4.8799H6.72V7.1199H2.24V11.5999H0ZM6.72 11.5999V7.1199H8.96V11.5999H6.72Z" fill="white"/>
+<path d="M11.2 11.5999V0.399902H17.92V2.6399H13.44V4.8799H17.92V7.1199H13.44V9.3599H17.92V11.5999H11.2Z" fill="white"/>
+<path d="M20.16 11.5999V0.399902H26.88V2.6399H22.4V4.8799H26.88V7.1199H22.4V11.5999H20.16Z" fill="white"/>
+<path d="M29.12 11.5999V0.399902H31.36V9.3599H35.84V11.5999H29.12Z" fill="white"/>
+<path d="M38.08 11.5999V0.399902H44.8V2.6399H40.32V4.8799H44.8V7.1199H40.32V9.3599H44.8V11.5999H38.08Z" fill="white"/>
+<path d="M47.04 4.8799V0.399902H49.28V4.8799H47.04ZM53.76 4.8799V0.399902H56V4.8799H53.76ZM49.28 7.1199V4.8799H53.76V7.1199H49.28ZM47.04 11.5999V7.1199H49.28V11.5999H47.04ZM53.76 11.5999V7.1199H56V11.5999H53.76Z" fill="white"/>
+</svg>"""
+
+    return rx.center(
+        rx.link(
+            rx.hstack(
+                "Built with ",
+                rx.color_mode_cond(
+                    rx.html(light_mode_logo),
+                    rx.html(dark_mode_logo),
+                ),
+                text_align="center",
+                align="center",
+                padding="1em",
+            ),
+            href="https://reflex.dev",
+            size="3",
+        ),
+        width=props.pop("width", "100%"),
+        **props,
+    )

reflex/components/el/elements/forms.py

@@ -1,4 +1,5 @@
 """Element classes. This is an auto-generated file. Do not edit. See ../generate.py."""
+
 from __future__ import annotations
 
 from hashlib import md5
@@ -162,7 +163,9 @@ class Form(BaseHTML):
         props["handle_submit_unique_name"] = ""
         form = super().create(*children, **props)
         form.handle_submit_unique_name = md5(
-            str(form.get_hooks_internal().union(form.get_hooks())).encode("utf-8")
+            str({**form._get_all_hooks_internal(), **form._get_all_hooks()}).encode(
+                "utf-8"
+            )
         ).hexdigest()
         return form
 
@@ -207,7 +210,7 @@ class Form(BaseHTML):
     def _get_form_refs(self) -> Dict[str, Any]:
         # Send all the input refs to the handler.
         form_refs = {}
-        for ref in self.get_refs():
+        for ref in self._get_all_refs():
             # when ref start with refs_ it's an array of refs, so we need different method
             # to collect data
             if ref.startswith("refs_"):
@@ -592,13 +595,13 @@ class Textarea(BaseHTML):
             "enter_key_submit",
         ]
 
-    def get_custom_code(self) -> Set[str]:
+    def _get_all_custom_code(self) -> Set[str]:
         """Include the custom code for auto_height and enter_key_submit functionality.
 
         Returns:
             The custom code for the component.
         """
-        custom_code = super().get_custom_code()
+        custom_code = super()._get_all_custom_code()
         if self.auto_height is not None:
             custom_code.add(AUTO_HEIGHT_JS)
         if self.enter_key_submit is not None:

reflex/components/el/elements/forms.pyi

@@ -2022,7 +2022,6 @@ AUTO_HEIGHT_JS = '\nconst autoHeightOnInput = (e, is_enabled) => {\n    if (is_e
 ENTER_KEY_SUBMIT_JS = "\nconst enterKeySubmitOnKeyDown = (e, is_enabled) => {\n    if (is_enabled && e.which === 13 && !e.shiftKey) {\n        e.preventDefault();\n        if (!e.repeat) {\n            if (e.target.form) {\n                e.target.form.requestSubmit();\n            }\n        }\n    }\n}\n"
 
 class Textarea(BaseHTML):
-    def get_custom_code(self) -> Set[str]: ...
     def get_event_triggers(self) -> Dict[str, Any]: ...
     @overload
     @classmethod

reflex/components/lucide/icon.py

@@ -53,6 +53,7 @@ class Icon(LucideIconComponent):
         if children:
             if len(children) == 1 and type(children[0]) == str:
                 props["tag"] = children[0]
+                children = []
             else:
                 raise AttributeError(
                     f"Passing multiple children to Icon component is not allowed: remove positional arguments {children[1:]} to fix"
@@ -129,7 +130,7 @@ RENAMED_ICONS_05 = {
     "dot_square": "square_dot",
     "download_cloud": "cloud_download",
     "equal_square": "square_equal",
-    "form_input": "rectangle_elipsis",
+    "form_input": "rectangle_ellipsis",
     "function_square": "square_function",
     "gantt_chart_square": "square_gantt_chart",
     "gauge_circle": "circle_gauge",
@@ -140,7 +141,7 @@ RENAMED_ICONS_05 = {
     "ice_cream_2": "ice_cream_bowl",
     "indent": "indent_increase",
     "kanban_square": "square_kanban",
-    "kanban_square_dashed": "square_kanban_dashed",
+    "kanban_square_dashed": "square_dashed_kanban",
     "laptop_2": "laptop_minimal",
     "library_square": "square_library",
     "loader_2": "loader_circle",

reflex/components/lucide/icon.pyi

@@ -221,7 +221,7 @@ RENAMED_ICONS_05 = {
     "dot_square": "square_dot",
     "download_cloud": "cloud_download",
     "equal_square": "square_equal",
-    "form_input": "rectangle_elipsis",
+    "form_input": "rectangle_ellipsis",
     "function_square": "square_function",
     "gantt_chart_square": "square_gantt_chart",
     "gauge_circle": "circle_gauge",
@@ -232,7 +232,7 @@ RENAMED_ICONS_05 = {
     "ice_cream_2": "ice_cream_bowl",
     "indent": "indent_increase",
     "kanban_square": "square_kanban",
-    "kanban_square_dashed": "square_kanban_dashed",
+    "kanban_square_dashed": "square_dashed_kanban",
     "laptop_2": "laptop_minimal",
     "library_square": "square_library",
     "loader_2": "loader_circle",