instaui 0.1.7__py3-none-any.whl → 0.1.9__py3-none-any.whl

instaui/components/html/heading.py

@@ -3,13 +3,13 @@ from typing import TYPE_CHECKING, Any, Literal, Union
 from instaui.components.element import Element
 
 if TYPE_CHECKING:
-    import instaui.vars as ui_vars
+    from instaui.vars.types import TMaybeRef
 
 
 class Heading(Element):
     def __init__(
         self,
-        text: Union[str, ui_vars.TMaybeRef[Any]],
+        text: Union[str, TMaybeRef[Any]],
         *,
         level: Literal[1, 2, 3, 4, 5, 6] = 1,
     ):
@@ -22,30 +22,30 @@ class Heading(Element):
 
 
 class H1(Heading):
-    def __init__(self, text: Union[str, ui_vars.TMaybeRef[Any]]):
+    def __init__(self, text: Union[str, TMaybeRef[Any]]):
         super().__init__(text, level=1)
 
 
 class H2(Heading):
-    def __init__(self, text: Union[str, ui_vars.TMaybeRef[Any]]):
+    def __init__(self, text: Union[str, TMaybeRef[Any]]):
         super().__init__(text, level=2)
 
 
 class H3(Heading):
-    def __init__(self, text: Union[str, ui_vars.TMaybeRef[Any]]):
+    def __init__(self, text: Union[str, TMaybeRef[Any]]):
         super().__init__(text, level=3)
 
 
 class H4(Heading):
-    def __init__(self, text: Union[str, ui_vars.TMaybeRef[Any]]):
+    def __init__(self, text: Union[str, TMaybeRef[Any]]):
         super().__init__(text, level=4)
 
 
 class H5(Heading):
-    def __init__(self, text: Union[str, ui_vars.TMaybeRef[Any]]):
+    def __init__(self, text: Union[str, TMaybeRef[Any]]):
         super().__init__(text, level=5)
 
 
 class H6(Heading):
-    def __init__(self, text: Union[str, ui_vars.TMaybeRef[Any]]):
+    def __init__(self, text: Union[str, TMaybeRef[Any]]):
         super().__init__(text, level=6)

instaui/components/html/input.py

@@ -6,16 +6,16 @@ from instaui.components.value_element import ValueElement
 from ._mixins import InputEventMixin
 
 if TYPE_CHECKING:
-    import instaui.vars as ui_vars
+    from instaui.vars.types import TMaybeRef
 
 
 class Input(InputEventMixin, ValueElement[str]):
     def __init__(
         self,
-        value: Union[str, ui_vars.TMaybeRef[str], None] = None,
+        value: Union[str, TMaybeRef[str], None] = None,
         *,
-        model_value: Union[str, ui_vars.TMaybeRef[str], None] = None,
-        disabled: Optional[ui_vars.TMaybeRef[bool]] = None,
+        model_value: Union[str, TMaybeRef[str], None] = None,
+        disabled: Optional[TMaybeRef[bool]] = None,
     ):
         super().__init__("input", value, is_html_component=True)
 

instaui/components/html/label.py

@@ -3,13 +3,13 @@ from typing import TYPE_CHECKING, Any, Union
 from instaui.components.element import Element
 
 if TYPE_CHECKING:
-    import instaui.vars as ui_vars
+    from instaui.vars.types import TMaybeRef
 
 
 class Label(Element):
     def __init__(
         self,
-        text: Union[Any, ui_vars.TMaybeRef[Any], None] = None,
+        text: Union[Any, TMaybeRef[Any], None] = None,
     ):
         super().__init__("label")
 

instaui/components/html/li.py

@@ -3,7 +3,7 @@ from typing import TYPE_CHECKING, Any, Union
 from instaui.components.element import Element
 
 if TYPE_CHECKING:
-    from instaui.vars import TMaybeRef
+    from instaui.vars.types import TMaybeRef
 
 
 class Li(Element):

instaui/components/html/number.py

@@ -5,7 +5,7 @@ from instaui.components.value_element import ValueElement
 from ._mixins import InputEventMixin
 
 if TYPE_CHECKING:
-    import instaui.vars as ui_vars
+    from instaui.vars.types import TMaybeRef
 
 
 _T_value = Union[int, float]
@@ -14,11 +14,11 @@ _T_value = Union[int, float]
 class Number(InputEventMixin, ValueElement[_T_value]):
     def __init__(
         self,
-        value: Optional[ui_vars.TMaybeRef[_T_value]] = None,
+        value: Optional[TMaybeRef[_T_value]] = None,
         *,
-        model_value: Optional[ui_vars.TMaybeRef[_T_value]] = None,
-        min: Optional[ui_vars.TMaybeRef[_T_value]] = None,
-        max: Optional[ui_vars.TMaybeRef[_T_value]] = None,
+        model_value: Optional[TMaybeRef[_T_value]] = None,
+        min: Optional[TMaybeRef[_T_value]] = None,
+        max: Optional[TMaybeRef[_T_value]] = None,
     ):
         super().__init__("input", value, is_html_component=True)
         self.props({"type": "number"})

instaui/components/html/paragraph.py

@@ -3,13 +3,13 @@ from typing import TYPE_CHECKING, Any, Union
 from instaui.components.element import Element
 
 if TYPE_CHECKING:
-    import instaui.vars as ui_vars
+    from instaui.vars.types import TMaybeRef
 
 
 class Paragraph(Element):
     def __init__(
         self,
-        text: Union[str, ui_vars.TMaybeRef[Any]],
+        text: Union[str, TMaybeRef[Any]],
     ):
         super().__init__("p")
         self.props(

instaui/components/html/select.py

@@ -1,14 +1,9 @@
 from __future__ import annotations
 from typing import (
-    TYPE_CHECKING,
-    Callable,
-    Dict,
     List,
     Optional,
     Union,
-    overload,
 )
-from typing_extensions import Self
 from instaui.components.value_element import ValueElement
 from instaui.components.element import Element
 from instaui.event.event_mixin import EventMixin

instaui/components/html/span.py

@@ -3,13 +3,13 @@ from typing import TYPE_CHECKING, Any, Union
 from instaui.components.element import Element
 
 if TYPE_CHECKING:
-    import instaui.vars as ui_vars
+    from instaui.vars.types import TMaybeRef
 
 
 class Span(Element):
     def __init__(
         self,
-        text: Union[str, ui_vars.TMaybeRef[Any]],
+        text: Union[str, TMaybeRef[Any]],
     ):
         super().__init__("span")
         self.props(

instaui/components/html/table.py

@@ -1,24 +1,24 @@
 from __future__ import annotations
-from typing import TYPE_CHECKING, Any, List, Optional, Union
+from typing import TYPE_CHECKING, Any, List, Union
 from instaui.components.element import Element
 from instaui.components.content import Content
 from instaui.components.vfor import VFor
 
 if TYPE_CHECKING:
-    import instaui.vars as ui_vars
+    from instaui.vars.types import TMaybeRef
 
 
 class Table(Element):
     def __init__(
         self,
-        columns: Union[List[str], ui_vars.TMaybeRef[List[str]], None] = None,
-        rows: Union[List[List[Any]], ui_vars.TMaybeRef[List[List[Any]]], None] = None,
+        columns: Union[List[str], TMaybeRef[List[str]], None] = None,
+        rows: Union[List[List[Any]], TMaybeRef[List[List[Any]]], None] = None,
     ):
         """Create a table element.
 
         Args:
-            columns (Union[List[str], ui_vars.TMaybeRef[List[str]], None], optional): A list of column headers or a reactive reference to such a list. Defaults to None.
-            rows (Union[List[List[Any]], ui_vars.TMaybeRef[List[List[Any]]], None], optional): A list of row data, where each row is a list of cell values, or a reactive reference to such a list. Defaults to None.
+            columns (Union[List[str], TMaybeRef[List[str]], None], optional): A list of column headers or a reactive reference to such a list. Defaults to None.
+            rows (Union[List[List[Any]], TMaybeRef[List[List[Any]]], None], optional): A list of row data, where each row is a list of cell values, or a reactive reference to such a list. Defaults to None.
         """
         super().__init__("table")
 

instaui/components/html/textarea.py

@@ -6,16 +6,16 @@ from instaui.components.value_element import ValueElement
 from ._mixins import InputEventMixin
 
 if TYPE_CHECKING:
-    import instaui.vars as ui_vars
+    from instaui.vars.types import TMaybeRef
 
 
 class Textarea(InputEventMixin, ValueElement[str]):
     def __init__(
         self,
-        value: Union[str, ui_vars.TMaybeRef[str], None] = None,
+        value: Union[str, TMaybeRef[str], None] = None,
         *,
-        model_value: Union[str, ui_vars.TMaybeRef[str], None] = None,
-        disabled: Optional[ui_vars.TMaybeRef[bool]] = None,
+        model_value: Union[str, TMaybeRef[str], None] = None,
+        disabled: Optional[TMaybeRef[bool]] = None,
     ):
         super().__init__("textarea", value, is_html_component=True)
 

instaui/components/row.py

@@ -1,7 +1,4 @@
 from __future__ import annotations
-from typing import (
-    TypeVar,
-)
 from instaui.components.element import Element
 from instaui.vars.types import TMaybeRef
 from instaui.vars.js_computed import JsComputed

instaui/components/shiki_code/static/shiki-style.css

@@ -1,179 +1,179 @@
-:root {
-  --shiki-font-family-mono: ui-monospace, "Menlo", "Monaco", "Consolas", "Liberation Mono", "Courier New", monospace;
-  --shiki-code-line-height: 1.5;
-  --shiki-code-font-size: 0.875em;
-  --shiki-code-block-color: #67676c;
-  --shiki-icon-copy: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='rgba(128,128,128,1)' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' viewBox='0 0 24 24'%3E%3Crect width='8' height='4' x='8' y='2' rx='1' ry='1'/%3E%3Cpath d='M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2'/%3E%3C/svg%3E");
-  --shiki-icon-copied: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='rgba(128,128,128,1)' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' viewBox='0 0 24 24'%3E%3Crect width='8' height='4' x='8' y='2' rx='1' ry='1'/%3E%3Cpath d='M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2'/%3E%3Cpath d='m9 14 2 2 4-4'/%3E%3C/svg%3E");
-  --shiki-code-copy-code-border-color: #e2e2e3;
-  --shiki-code-copy-code-bg: #f6f6f7;
-  --shiki-code-copy-code-hover-border-color: #e2e2e3;
-  --shiki-code-copy-code-hover-bg: #ffffff;
-  --shiki-code-copy-code-active-text: #67676c;
-  --shiki-code-copy-copied-text-content: "Copied";
-  --shiki-code-lang-color: #929295;
-}
-@media (min-width: 640px) {
-  .shiki-code[class*=language-] {
-    border-radius: 8px;
-    margin: 15px 0;
-  }
-}
-.shiki-code[class*=language-] {
-  position: relative;
-  margin: 16px 0;
-  background-color: #f9f9f9;
-  overflow-x: auto;
-  transition: background-color 0.5s;
-  /* line numbers */
-}
-.shiki-code[class*=language-] pre,
-.shiki-code[class*=language-] code {
-  font-family: var(--shiki-font-family-mono);
-}
-.shiki-code[class*=language-] pre {
-  position: relative;
-  z-index: 1;
-  margin: 0;
-  padding: 20px 0;
-  background: transparent;
-  overflow-x: auto;
-}
-.shiki-code[class*=language-] code {
-  display: block;
-  padding: 0 24px 0 0;
-  width: fit-content;
-  min-width: 100%;
-  line-height: var(--shiki-code-line-height);
-  font-size: var(--shiki-code-font-size);
-  color: var(--shiki-code-block-color);
-  transition: color 0.5s;
-}
-.shiki-code[class*=language-] code > .line:before {
-  content: ' ';
-  padding: 0 5px;
-}
-.shiki-code[class*=language-] > button.copy {
-  direction: ltr;
-  position: absolute;
-  top: 12px;
-  right: 12px;
-  z-index: 3;
-  border: 1px solid var(--shiki-code-copy-code-border-color);
-  border-radius: 4px;
-  width: 40px;
-  height: 40px;
-  background-color: var(--shiki-code-copy-code-bg);
-  opacity: 0;
-  cursor: pointer;
-  background-image: var(--shiki-icon-copy);
-  background-position: 50%;
-  background-size: 20px;
-  background-repeat: no-repeat;
-  transition: border-color 0.25s, background-color 0.25s, opacity 0.25s;
-}
-.shiki-code[class*=language-]:hover > button.copy,
-.shiki-code[class*=language-] > button.copy:focus {
-  opacity: 1;
-}
-.shiki-code[class*=language-] > button.copy:hover,
-.shiki-code[class*=language-] > button.copy.copied {
-  border-color: var(--shiki-code-copy-code-hover-border-color);
-  background-color: var(--shiki-code-copy-code-hover-bg);
-}
-.shiki-code[class*=language-] > button.copy.copied,
-.shiki-code[class*=language-] > button.copy:hover.copied {
-  border-radius: 0 4px 4px 0;
-  background-color: var(--shiki-code-copy-code-hover-bg);
-  background-image: var(--shiki-icon-copied);
-}
-.shiki-code[class*=language-] > button.copy.copied:before,
-.shiki-code[class*=language-] > button.copy:hover.copied:before {
-  position: relative;
-  top: -1px;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  border: 1px solid var(--shiki-code-copy-code-hover-border-color);
-  border-right: 0;
-  border-radius: 4px 0 0 4px;
-  padding: 0 10px;
-  width: fit-content;
-  height: 40px;
-  text-align: center;
-  font-size: 12px;
-  font-weight: 500;
-  color: var(--shiki-code-copy-code-active-text);
-  background-color: var(--shiki-code-copy-code-hover-bg);
-  white-space: nowrap;
-  content: var(--shiki-code-copy-copied-text-content);
-  transform: translate(calc(-100% - 1px));
-}
-.shiki-code[class*=language-] > span.lang {
-  position: absolute;
-  top: 2px;
-  right: 8px;
-  z-index: 2;
-  font-size: 12px;
-  font-weight: 500;
-  -webkit-user-select: none;
-  user-select: none;
-  color: var(--shiki-code-lang-color);
-  transition: color 0.4s, opacity 0.4s;
-}
-.shiki-code[class*=language-]:hover > button.copy + span.lang,
-.shiki-code[class*=language-] > button.copy:focus + span.lang {
-  opacity: 0;
-}
-.shiki-code[class*=language-].theme-dark {
-  --shiki-code-line-diff-add-color: #3dd68c;
-  --shiki-code-line-diff-add-symbol-color: #3dd68c;
-  --shiki-code-line-diff-remove-color: hsla(349.72, 89.16%, 60.2%, 0.16);
-  --shiki-code-line-diff-remove-symbol-color: hsl(357.62, 39.92%, 50.39%);
-  --shiki-code-line-line-number-color: hsla(198.18, 13.36%, 80%, 0.7);
-}
-.shiki-code[class*=language-] pre.shiki .diff {
-  all: unset;
-}
-.shiki-code[class*=language-] pre.shiki code .diff.remove {
-  background-color: var(--shiki-code-line-diff-remove-color, rgba(244, 63, 94, 0.14));
-  opacity: 0.7;
-}
-.shiki-code[class*=language-] pre.shiki code .diff.add {
-  background-color: rgba(16, 185, 129, 0.14);
-}
-.shiki-code[class*=language-] pre.shiki code .diff.add:before {
-  content: "+";
-  color: var(--shiki-code-line-diff-add-symbol-color, #18794e);
-}
-.shiki-code[class*=language-] pre.shiki code .diff.remove:before {
-  content: "-";
-  color: var(--shiki-code-line-diff-remove-symbol-color, hsl(357.62, 39.92%, 50.39%));
-}
-.shiki-code[class*=language-] pre.shiki code .diff:before {
-  width: 2.5em;
-  text-align: left;
-  padding-left: 10px;
-}
-.shiki-code[class*=language-] pre.shiki code .diff {
-  box-sizing: border-box;
-  transition: background-color 0.5s;
-  margin: 0 -24px;
-  padding: 0 24px;
-  width: calc(100% + 48px);
-  display: inline-block;
-}
-.shiki-code[class*=language-].line-numbers code {
-  counter-reset: step;
-  counter-increment: step 0;
-}
-.shiki-code[class*=language-].line-numbers code .line::before {
-  content: counter(step);
-  counter-increment: step;
-  display: inline-block;
-  text-align: right;
-  color: var(--shiki-code-line-line-number-color, hsla(198.18, 13.36%, 51.57%, 0.7));
-  width: 2.5em;
-  text-align: left;
-  padding-left: 10px;
-}
+:root {
+  --shiki-font-family-mono: ui-monospace, "Menlo", "Monaco", "Consolas", "Liberation Mono", "Courier New", monospace;
+  --shiki-code-line-height: 1.5;
+  --shiki-code-font-size: 0.875em;
+  --shiki-code-block-color: #67676c;
+  --shiki-icon-copy: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='rgba(128,128,128,1)' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' viewBox='0 0 24 24'%3E%3Crect width='8' height='4' x='8' y='2' rx='1' ry='1'/%3E%3Cpath d='M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2'/%3E%3C/svg%3E");
+  --shiki-icon-copied: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' stroke='rgba(128,128,128,1)' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' viewBox='0 0 24 24'%3E%3Crect width='8' height='4' x='8' y='2' rx='1' ry='1'/%3E%3Cpath d='M16 4h2a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2V6a2 2 0 0 1 2-2h2'/%3E%3Cpath d='m9 14 2 2 4-4'/%3E%3C/svg%3E");
+  --shiki-code-copy-code-border-color: #e2e2e3;
+  --shiki-code-copy-code-bg: #f6f6f7;
+  --shiki-code-copy-code-hover-border-color: #e2e2e3;
+  --shiki-code-copy-code-hover-bg: #ffffff;
+  --shiki-code-copy-code-active-text: #67676c;
+  --shiki-code-copy-copied-text-content: "Copied";
+  --shiki-code-lang-color: #929295;
+}
+@media (min-width: 640px) {
+  .shiki-code[class*=language-] {
+    border-radius: 8px;
+    margin: 15px 0;
+  }
+}
+.shiki-code[class*=language-] {
+  position: relative;
+  margin: 16px 0;
+  background-color: #f9f9f9;
+  overflow-x: auto;
+  transition: background-color 0.5s;
+  /* line numbers */
+}
+.shiki-code[class*=language-] pre,
+.shiki-code[class*=language-] code {
+  font-family: var(--shiki-font-family-mono);
+}
+.shiki-code[class*=language-] pre {
+  position: relative;
+  z-index: 1;
+  margin: 0;
+  padding: 20px 0;
+  background: transparent;
+  overflow-x: auto;
+}
+.shiki-code[class*=language-] code {
+  display: block;
+  padding: 0 24px 0 0;
+  width: fit-content;
+  min-width: 100%;
+  line-height: var(--shiki-code-line-height);
+  font-size: var(--shiki-code-font-size);
+  color: var(--shiki-code-block-color);
+  transition: color 0.5s;
+}
+.shiki-code[class*=language-] code > .line:before {
+  content: ' ';
+  padding: 0 5px;
+}
+.shiki-code[class*=language-] > button.copy {
+  direction: ltr;
+  position: absolute;
+  top: 12px;
+  right: 12px;
+  z-index: 3;
+  border: 1px solid var(--shiki-code-copy-code-border-color);
+  border-radius: 4px;
+  width: 40px;
+  height: 40px;
+  background-color: var(--shiki-code-copy-code-bg);
+  opacity: 0;
+  cursor: pointer;
+  background-image: var(--shiki-icon-copy);
+  background-position: 50%;
+  background-size: 20px;
+  background-repeat: no-repeat;
+  transition: border-color 0.25s, background-color 0.25s, opacity 0.25s;
+}
+.shiki-code[class*=language-]:hover > button.copy,
+.shiki-code[class*=language-] > button.copy:focus {
+  opacity: 1;
+}
+.shiki-code[class*=language-] > button.copy:hover,
+.shiki-code[class*=language-] > button.copy.copied {
+  border-color: var(--shiki-code-copy-code-hover-border-color);
+  background-color: var(--shiki-code-copy-code-hover-bg);
+}
+.shiki-code[class*=language-] > button.copy.copied,
+.shiki-code[class*=language-] > button.copy:hover.copied {
+  border-radius: 0 4px 4px 0;
+  background-color: var(--shiki-code-copy-code-hover-bg);
+  background-image: var(--shiki-icon-copied);
+}
+.shiki-code[class*=language-] > button.copy.copied:before,
+.shiki-code[class*=language-] > button.copy:hover.copied:before {
+  position: relative;
+  top: -1px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  border: 1px solid var(--shiki-code-copy-code-hover-border-color);
+  border-right: 0;
+  border-radius: 4px 0 0 4px;
+  padding: 0 10px;
+  width: fit-content;
+  height: 40px;
+  text-align: center;
+  font-size: 12px;
+  font-weight: 500;
+  color: var(--shiki-code-copy-code-active-text);
+  background-color: var(--shiki-code-copy-code-hover-bg);
+  white-space: nowrap;
+  content: var(--shiki-code-copy-copied-text-content);
+  transform: translate(calc(-100% - 1px));
+}
+.shiki-code[class*=language-] > span.lang {
+  position: absolute;
+  top: 2px;
+  right: 8px;
+  z-index: 2;
+  font-size: 12px;
+  font-weight: 500;
+  -webkit-user-select: none;
+  user-select: none;
+  color: var(--shiki-code-lang-color);
+  transition: color 0.4s, opacity 0.4s;
+}
+.shiki-code[class*=language-]:hover > button.copy + span.lang,
+.shiki-code[class*=language-] > button.copy:focus + span.lang {
+  opacity: 0;
+}
+.shiki-code[class*=language-].theme-dark {
+  --shiki-code-line-diff-add-color: #3dd68c;
+  --shiki-code-line-diff-add-symbol-color: #3dd68c;
+  --shiki-code-line-diff-remove-color: hsla(349.72, 89.16%, 60.2%, 0.16);
+  --shiki-code-line-diff-remove-symbol-color: hsl(357.62, 39.92%, 50.39%);
+  --shiki-code-line-line-number-color: hsla(198.18, 13.36%, 80%, 0.7);
+}
+.shiki-code[class*=language-] pre.shiki .diff {
+  all: unset;
+}
+.shiki-code[class*=language-] pre.shiki code .diff.remove {
+  background-color: var(--shiki-code-line-diff-remove-color, rgba(244, 63, 94, 0.14));
+  opacity: 0.7;
+}
+.shiki-code[class*=language-] pre.shiki code .diff.add {
+  background-color: rgba(16, 185, 129, 0.14);
+}
+.shiki-code[class*=language-] pre.shiki code .diff.add:before {
+  content: "+";
+  color: var(--shiki-code-line-diff-add-symbol-color, #18794e);
+}
+.shiki-code[class*=language-] pre.shiki code .diff.remove:before {
+  content: "-";
+  color: var(--shiki-code-line-diff-remove-symbol-color, hsl(357.62, 39.92%, 50.39%));
+}
+.shiki-code[class*=language-] pre.shiki code .diff:before {
+  width: 2.5em;
+  text-align: left;
+  padding-left: 10px;
+}
+.shiki-code[class*=language-] pre.shiki code .diff {
+  box-sizing: border-box;
+  transition: background-color 0.5s;
+  margin: 0 -24px;
+  padding: 0 24px;
+  width: calc(100% + 48px);
+  display: inline-block;
+}
+.shiki-code[class*=language-].line-numbers code {
+  counter-reset: step;
+  counter-increment: step 0;
+}
+.shiki-code[class*=language-].line-numbers code .line::before {
+  content: counter(step);
+  counter-increment: step;
+  display: inline-block;
+  text-align: right;
+  color: var(--shiki-code-line-line-number-color, hsla(198.18, 13.36%, 51.57%, 0.7));
+  width: 2.5em;
+  text-align: left;
+  padding-left: 10px;
+}

instaui/experimental/__init__.py

@@ -1,4 +1,3 @@
 from .debug import list_all_bindables
-from instaui.vars.state import state
 
-__all__ = ["list_all_bindables", "state"]
+__all__ = ["list_all_bindables"]