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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,14 +1,9 @@
1
1
  from __future__ import annotations
2
2
  from typing import (
3
- TYPE_CHECKING,
4
- Callable,
5
- Dict,
6
3
  List,
7
4
  Optional,
8
5
  Union,
9
- overload,
10
6
  )
11
- from typing_extensions import Self
12
7
  from instaui.components.value_element import ValueElement
13
8
  from instaui.components.element import Element
14
9
  from instaui.event.event_mixin import EventMixin
@@ -1,5 +1,5 @@
1
1
  from __future__ import annotations
2
- from typing import TYPE_CHECKING, Any, List, Optional, Union
2
+ from typing import TYPE_CHECKING, Any, List, Union
3
3
  from instaui.components.element import Element
4
4
  from instaui.components.content import Content
5
5
  from instaui.components.vfor import VFor
instaui/components/row.py CHANGED
@@ -1,7 +1,4 @@
1
1
  from __future__ import annotations
2
- from typing import (
3
- TypeVar,
4
- )
5
2
  from instaui.components.element import Element
6
3
  from instaui.vars.types import TMaybeRef
7
4
  from instaui.vars.js_computed import JsComputed
@@ -1,179 +1,179 @@
1
- :root {
2
- --shiki-font-family-mono: ui-monospace, "Menlo", "Monaco", "Consolas", "Liberation Mono", "Courier New", monospace;
3
- --shiki-code-line-height: 1.5;
4
- --shiki-code-font-size: 0.875em;
5
- --shiki-code-block-color: #67676c;
6
- --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");
7
- --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");
8
- --shiki-code-copy-code-border-color: #e2e2e3;
9
- --shiki-code-copy-code-bg: #f6f6f7;
10
- --shiki-code-copy-code-hover-border-color: #e2e2e3;
11
- --shiki-code-copy-code-hover-bg: #ffffff;
12
- --shiki-code-copy-code-active-text: #67676c;
13
- --shiki-code-copy-copied-text-content: "Copied";
14
- --shiki-code-lang-color: #929295;
15
- }
16
- @media (min-width: 640px) {
17
- .shiki-code[class*=language-] {
18
- border-radius: 8px;
19
- margin: 15px 0;
20
- }
21
- }
22
- .shiki-code[class*=language-] {
23
- position: relative;
24
- margin: 16px 0;
25
- background-color: #f9f9f9;
26
- overflow-x: auto;
27
- transition: background-color 0.5s;
28
- /* line numbers */
29
- }
30
- .shiki-code[class*=language-] pre,
31
- .shiki-code[class*=language-] code {
32
- font-family: var(--shiki-font-family-mono);
33
- }
34
- .shiki-code[class*=language-] pre {
35
- position: relative;
36
- z-index: 1;
37
- margin: 0;
38
- padding: 20px 0;
39
- background: transparent;
40
- overflow-x: auto;
41
- }
42
- .shiki-code[class*=language-] code {
43
- display: block;
44
- padding: 0 24px 0 0;
45
- width: fit-content;
46
- min-width: 100%;
47
- line-height: var(--shiki-code-line-height);
48
- font-size: var(--shiki-code-font-size);
49
- color: var(--shiki-code-block-color);
50
- transition: color 0.5s;
51
- }
52
- .shiki-code[class*=language-] code > .line:before {
53
- content: ' ';
54
- padding: 0 5px;
55
- }
56
- .shiki-code[class*=language-] > button.copy {
57
- direction: ltr;
58
- position: absolute;
59
- top: 12px;
60
- right: 12px;
61
- z-index: 3;
62
- border: 1px solid var(--shiki-code-copy-code-border-color);
63
- border-radius: 4px;
64
- width: 40px;
65
- height: 40px;
66
- background-color: var(--shiki-code-copy-code-bg);
67
- opacity: 0;
68
- cursor: pointer;
69
- background-image: var(--shiki-icon-copy);
70
- background-position: 50%;
71
- background-size: 20px;
72
- background-repeat: no-repeat;
73
- transition: border-color 0.25s, background-color 0.25s, opacity 0.25s;
74
- }
75
- .shiki-code[class*=language-]:hover > button.copy,
76
- .shiki-code[class*=language-] > button.copy:focus {
77
- opacity: 1;
78
- }
79
- .shiki-code[class*=language-] > button.copy:hover,
80
- .shiki-code[class*=language-] > button.copy.copied {
81
- border-color: var(--shiki-code-copy-code-hover-border-color);
82
- background-color: var(--shiki-code-copy-code-hover-bg);
83
- }
84
- .shiki-code[class*=language-] > button.copy.copied,
85
- .shiki-code[class*=language-] > button.copy:hover.copied {
86
- border-radius: 0 4px 4px 0;
87
- background-color: var(--shiki-code-copy-code-hover-bg);
88
- background-image: var(--shiki-icon-copied);
89
- }
90
- .shiki-code[class*=language-] > button.copy.copied:before,
91
- .shiki-code[class*=language-] > button.copy:hover.copied:before {
92
- position: relative;
93
- top: -1px;
94
- display: flex;
95
- justify-content: center;
96
- align-items: center;
97
- border: 1px solid var(--shiki-code-copy-code-hover-border-color);
98
- border-right: 0;
99
- border-radius: 4px 0 0 4px;
100
- padding: 0 10px;
101
- width: fit-content;
102
- height: 40px;
103
- text-align: center;
104
- font-size: 12px;
105
- font-weight: 500;
106
- color: var(--shiki-code-copy-code-active-text);
107
- background-color: var(--shiki-code-copy-code-hover-bg);
108
- white-space: nowrap;
109
- content: var(--shiki-code-copy-copied-text-content);
110
- transform: translate(calc(-100% - 1px));
111
- }
112
- .shiki-code[class*=language-] > span.lang {
113
- position: absolute;
114
- top: 2px;
115
- right: 8px;
116
- z-index: 2;
117
- font-size: 12px;
118
- font-weight: 500;
119
- -webkit-user-select: none;
120
- user-select: none;
121
- color: var(--shiki-code-lang-color);
122
- transition: color 0.4s, opacity 0.4s;
123
- }
124
- .shiki-code[class*=language-]:hover > button.copy + span.lang,
125
- .shiki-code[class*=language-] > button.copy:focus + span.lang {
126
- opacity: 0;
127
- }
128
- .shiki-code[class*=language-].theme-dark {
129
- --shiki-code-line-diff-add-color: #3dd68c;
130
- --shiki-code-line-diff-add-symbol-color: #3dd68c;
131
- --shiki-code-line-diff-remove-color: hsla(349.72, 89.16%, 60.2%, 0.16);
132
- --shiki-code-line-diff-remove-symbol-color: hsl(357.62, 39.92%, 50.39%);
133
- --shiki-code-line-line-number-color: hsla(198.18, 13.36%, 80%, 0.7);
134
- }
135
- .shiki-code[class*=language-] pre.shiki .diff {
136
- all: unset;
137
- }
138
- .shiki-code[class*=language-] pre.shiki code .diff.remove {
139
- background-color: var(--shiki-code-line-diff-remove-color, rgba(244, 63, 94, 0.14));
140
- opacity: 0.7;
141
- }
142
- .shiki-code[class*=language-] pre.shiki code .diff.add {
143
- background-color: rgba(16, 185, 129, 0.14);
144
- }
145
- .shiki-code[class*=language-] pre.shiki code .diff.add:before {
146
- content: "+";
147
- color: var(--shiki-code-line-diff-add-symbol-color, #18794e);
148
- }
149
- .shiki-code[class*=language-] pre.shiki code .diff.remove:before {
150
- content: "-";
151
- color: var(--shiki-code-line-diff-remove-symbol-color, hsl(357.62, 39.92%, 50.39%));
152
- }
153
- .shiki-code[class*=language-] pre.shiki code .diff:before {
154
- width: 2.5em;
155
- text-align: left;
156
- padding-left: 10px;
157
- }
158
- .shiki-code[class*=language-] pre.shiki code .diff {
159
- box-sizing: border-box;
160
- transition: background-color 0.5s;
161
- margin: 0 -24px;
162
- padding: 0 24px;
163
- width: calc(100% + 48px);
164
- display: inline-block;
165
- }
166
- .shiki-code[class*=language-].line-numbers code {
167
- counter-reset: step;
168
- counter-increment: step 0;
169
- }
170
- .shiki-code[class*=language-].line-numbers code .line::before {
171
- content: counter(step);
172
- counter-increment: step;
173
- display: inline-block;
174
- text-align: right;
175
- color: var(--shiki-code-line-line-number-color, hsla(198.18, 13.36%, 51.57%, 0.7));
176
- width: 2.5em;
177
- text-align: left;
178
- padding-left: 10px;
179
- }
1
+ :root {
2
+ --shiki-font-family-mono: ui-monospace, "Menlo", "Monaco", "Consolas", "Liberation Mono", "Courier New", monospace;
3
+ --shiki-code-line-height: 1.5;
4
+ --shiki-code-font-size: 0.875em;
5
+ --shiki-code-block-color: #67676c;
6
+ --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");
7
+ --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");
8
+ --shiki-code-copy-code-border-color: #e2e2e3;
9
+ --shiki-code-copy-code-bg: #f6f6f7;
10
+ --shiki-code-copy-code-hover-border-color: #e2e2e3;
11
+ --shiki-code-copy-code-hover-bg: #ffffff;
12
+ --shiki-code-copy-code-active-text: #67676c;
13
+ --shiki-code-copy-copied-text-content: "Copied";
14
+ --shiki-code-lang-color: #929295;
15
+ }
16
+ @media (min-width: 640px) {
17
+ .shiki-code[class*=language-] {
18
+ border-radius: 8px;
19
+ margin: 15px 0;
20
+ }
21
+ }
22
+ .shiki-code[class*=language-] {
23
+ position: relative;
24
+ margin: 16px 0;
25
+ background-color: #f9f9f9;
26
+ overflow-x: auto;
27
+ transition: background-color 0.5s;
28
+ /* line numbers */
29
+ }
30
+ .shiki-code[class*=language-] pre,
31
+ .shiki-code[class*=language-] code {
32
+ font-family: var(--shiki-font-family-mono);
33
+ }
34
+ .shiki-code[class*=language-] pre {
35
+ position: relative;
36
+ z-index: 1;
37
+ margin: 0;
38
+ padding: 20px 0;
39
+ background: transparent;
40
+ overflow-x: auto;
41
+ }
42
+ .shiki-code[class*=language-] code {
43
+ display: block;
44
+ padding: 0 24px 0 0;
45
+ width: fit-content;
46
+ min-width: 100%;
47
+ line-height: var(--shiki-code-line-height);
48
+ font-size: var(--shiki-code-font-size);
49
+ color: var(--shiki-code-block-color);
50
+ transition: color 0.5s;
51
+ }
52
+ .shiki-code[class*=language-] code > .line:before {
53
+ content: ' ';
54
+ padding: 0 5px;
55
+ }
56
+ .shiki-code[class*=language-] > button.copy {
57
+ direction: ltr;
58
+ position: absolute;
59
+ top: 12px;
60
+ right: 12px;
61
+ z-index: 3;
62
+ border: 1px solid var(--shiki-code-copy-code-border-color);
63
+ border-radius: 4px;
64
+ width: 40px;
65
+ height: 40px;
66
+ background-color: var(--shiki-code-copy-code-bg);
67
+ opacity: 0;
68
+ cursor: pointer;
69
+ background-image: var(--shiki-icon-copy);
70
+ background-position: 50%;
71
+ background-size: 20px;
72
+ background-repeat: no-repeat;
73
+ transition: border-color 0.25s, background-color 0.25s, opacity 0.25s;
74
+ }
75
+ .shiki-code[class*=language-]:hover > button.copy,
76
+ .shiki-code[class*=language-] > button.copy:focus {
77
+ opacity: 1;
78
+ }
79
+ .shiki-code[class*=language-] > button.copy:hover,
80
+ .shiki-code[class*=language-] > button.copy.copied {
81
+ border-color: var(--shiki-code-copy-code-hover-border-color);
82
+ background-color: var(--shiki-code-copy-code-hover-bg);
83
+ }
84
+ .shiki-code[class*=language-] > button.copy.copied,
85
+ .shiki-code[class*=language-] > button.copy:hover.copied {
86
+ border-radius: 0 4px 4px 0;
87
+ background-color: var(--shiki-code-copy-code-hover-bg);
88
+ background-image: var(--shiki-icon-copied);
89
+ }
90
+ .shiki-code[class*=language-] > button.copy.copied:before,
91
+ .shiki-code[class*=language-] > button.copy:hover.copied:before {
92
+ position: relative;
93
+ top: -1px;
94
+ display: flex;
95
+ justify-content: center;
96
+ align-items: center;
97
+ border: 1px solid var(--shiki-code-copy-code-hover-border-color);
98
+ border-right: 0;
99
+ border-radius: 4px 0 0 4px;
100
+ padding: 0 10px;
101
+ width: fit-content;
102
+ height: 40px;
103
+ text-align: center;
104
+ font-size: 12px;
105
+ font-weight: 500;
106
+ color: var(--shiki-code-copy-code-active-text);
107
+ background-color: var(--shiki-code-copy-code-hover-bg);
108
+ white-space: nowrap;
109
+ content: var(--shiki-code-copy-copied-text-content);
110
+ transform: translate(calc(-100% - 1px));
111
+ }
112
+ .shiki-code[class*=language-] > span.lang {
113
+ position: absolute;
114
+ top: 2px;
115
+ right: 8px;
116
+ z-index: 2;
117
+ font-size: 12px;
118
+ font-weight: 500;
119
+ -webkit-user-select: none;
120
+ user-select: none;
121
+ color: var(--shiki-code-lang-color);
122
+ transition: color 0.4s, opacity 0.4s;
123
+ }
124
+ .shiki-code[class*=language-]:hover > button.copy + span.lang,
125
+ .shiki-code[class*=language-] > button.copy:focus + span.lang {
126
+ opacity: 0;
127
+ }
128
+ .shiki-code[class*=language-].theme-dark {
129
+ --shiki-code-line-diff-add-color: #3dd68c;
130
+ --shiki-code-line-diff-add-symbol-color: #3dd68c;
131
+ --shiki-code-line-diff-remove-color: hsla(349.72, 89.16%, 60.2%, 0.16);
132
+ --shiki-code-line-diff-remove-symbol-color: hsl(357.62, 39.92%, 50.39%);
133
+ --shiki-code-line-line-number-color: hsla(198.18, 13.36%, 80%, 0.7);
134
+ }
135
+ .shiki-code[class*=language-] pre.shiki .diff {
136
+ all: unset;
137
+ }
138
+ .shiki-code[class*=language-] pre.shiki code .diff.remove {
139
+ background-color: var(--shiki-code-line-diff-remove-color, rgba(244, 63, 94, 0.14));
140
+ opacity: 0.7;
141
+ }
142
+ .shiki-code[class*=language-] pre.shiki code .diff.add {
143
+ background-color: rgba(16, 185, 129, 0.14);
144
+ }
145
+ .shiki-code[class*=language-] pre.shiki code .diff.add:before {
146
+ content: "+";
147
+ color: var(--shiki-code-line-diff-add-symbol-color, #18794e);
148
+ }
149
+ .shiki-code[class*=language-] pre.shiki code .diff.remove:before {
150
+ content: "-";
151
+ color: var(--shiki-code-line-diff-remove-symbol-color, hsl(357.62, 39.92%, 50.39%));
152
+ }
153
+ .shiki-code[class*=language-] pre.shiki code .diff:before {
154
+ width: 2.5em;
155
+ text-align: left;
156
+ padding-left: 10px;
157
+ }
158
+ .shiki-code[class*=language-] pre.shiki code .diff {
159
+ box-sizing: border-box;
160
+ transition: background-color 0.5s;
161
+ margin: 0 -24px;
162
+ padding: 0 24px;
163
+ width: calc(100% + 48px);
164
+ display: inline-block;
165
+ }
166
+ .shiki-code[class*=language-].line-numbers code {
167
+ counter-reset: step;
168
+ counter-increment: step 0;
169
+ }
170
+ .shiki-code[class*=language-].line-numbers code .line::before {
171
+ content: counter(step);
172
+ counter-increment: step;
173
+ display: inline-block;
174
+ text-align: right;
175
+ color: var(--shiki-code-line-line-number-color, hsla(198.18, 13.36%, 51.57%, 0.7));
176
+ width: 2.5em;
177
+ text-align: left;
178
+ padding-left: 10px;
179
+ }
@@ -1,4 +1,3 @@
1
1
  from .debug import list_all_bindables
2
- from instaui.vars.state import state
3
2
 
4
- __all__ = ["list_all_bindables", "state"]
3
+ __all__ = ["list_all_bindables"]