@stackflow/plugin-basic-ui 1.3.2 → 1.3.3-alpha.0
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.
- package/dist/basicUIPlugin.css.d.ts +1 -0
- package/dist/components/AppBar.d.ts +1 -0
- package/dist/components/AppScreen.css.d.ts +2 -2
- package/dist/index.css +11 -9
- package/dist/index.css.map +3 -3
- package/dist/index.js +5 -4
- package/dist/index.js.map +2 -2
- package/dist/index.mjs +5 -4
- package/dist/index.mjs.map +2 -2
- package/package.json +2 -2
- package/src/basicUIPlugin.css.ts +2 -0
- package/src/basicUIPlugin.tsx +2 -0
- package/src/components/AppBar.css.ts +8 -2
- package/src/components/AppScreen.css.ts +2 -2
|
@@ -13,6 +13,7 @@ declare const AppBar: import("react").ForwardRefExoticComponent<Partial<Pick<{
|
|
|
13
13
|
backgroundColor: string;
|
|
14
14
|
backgroundColorTransitionDuration: string;
|
|
15
15
|
overflow: string;
|
|
16
|
+
forceSafeAreaInsetTop: string;
|
|
16
17
|
}, "height" | "backgroundColor" | "borderColor" | "overflow" | "borderColorTransitionDuration" | "borderSize" | "heightTransitionDuration" | "iconColor" | "iconColorTransitionDuration" | "textColor" | "textColorTransitionDuration" | "backgroundColorTransitionDuration">> & {
|
|
17
18
|
title?: React.ReactNode;
|
|
18
19
|
appendLeft?: (() => React.ReactNode) | undefined;
|
|
@@ -34,10 +34,10 @@ export declare const paper: import("@vanilla-extract/recipes/dist/declarations/s
|
|
|
34
34
|
paddingTop: import("@vanilla-extract/private").CSSVarFunction;
|
|
35
35
|
"@supports": {
|
|
36
36
|
"(padding-top: constant(safe-area-inset-top))": {
|
|
37
|
-
paddingTop: `calc(var(--${string}) + constant(safe-area-inset-top))` | `calc(var(--${string}, ${string}) + constant(safe-area-inset-top))` | `calc(var(--${string}, ${number}) + constant(safe-area-inset-top))`;
|
|
37
|
+
paddingTop: `calc(var(--${string}) + max(var(--${string}), constant(safe-area-inset-top)))` | `calc(var(--${string}) + max(var(--${string}, ${string}), constant(safe-area-inset-top)))` | `calc(var(--${string}) + max(var(--${string}, ${number}), constant(safe-area-inset-top)))` | `calc(var(--${string}, ${string}) + max(var(--${string}), constant(safe-area-inset-top)))` | `calc(var(--${string}, ${string}) + max(var(--${string}, ${string}), constant(safe-area-inset-top)))` | `calc(var(--${string}, ${string}) + max(var(--${string}, ${number}), constant(safe-area-inset-top)))` | `calc(var(--${string}, ${number}) + max(var(--${string}), constant(safe-area-inset-top)))` | `calc(var(--${string}, ${number}) + max(var(--${string}, ${string}), constant(safe-area-inset-top)))` | `calc(var(--${string}, ${number}) + max(var(--${string}, ${number}), constant(safe-area-inset-top)))`;
|
|
38
38
|
};
|
|
39
39
|
"(padding-top: env(safe-area-inset-top))": {
|
|
40
|
-
paddingTop: `calc(var(--${string}) + env(safe-area-inset-top))` | `calc(var(--${string}, ${string}) + env(safe-area-inset-top))` | `calc(var(--${string}, ${number}) + env(safe-area-inset-top))`;
|
|
40
|
+
paddingTop: `calc(var(--${string}) + max(var(--${string}), env(safe-area-inset-top)))` | `calc(var(--${string}) + max(var(--${string}, ${string}), env(safe-area-inset-top)))` | `calc(var(--${string}) + max(var(--${string}, ${number}), env(safe-area-inset-top)))` | `calc(var(--${string}, ${string}) + max(var(--${string}), env(safe-area-inset-top)))` | `calc(var(--${string}, ${string}) + max(var(--${string}, ${string}), env(safe-area-inset-top)))` | `calc(var(--${string}, ${string}) + max(var(--${string}, ${number}), env(safe-area-inset-top)))` | `calc(var(--${string}, ${number}) + max(var(--${string}), env(safe-area-inset-top)))` | `calc(var(--${string}, ${number}) + max(var(--${string}, ${string}), env(safe-area-inset-top)))` | `calc(var(--${string}, ${number}) + max(var(--${string}, ${number}), env(safe-area-inset-top)))`;
|
|
41
41
|
};
|
|
42
42
|
};
|
|
43
43
|
})[];
|
package/dist/index.css
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/* vanilla-extract-css-ns:src/basicUIPlugin.css.ts.vanilla.css?source=#H4sIAAAAAAAAE+
|
|
1
|
+
/* vanilla-extract-css-ns:src/basicUIPlugin.css.ts.vanilla.css?source=#H4sIAAAAAAAAE+2UUUvDMBDH3/cpAr4omNJO66B+GEmTa3vbmouXdA7F7242NnzZqG0FEUrykIT73f0hd//kJXt9MuvlOhUfCyGk9EHpTbWlN+m2XY1Wlsqjlh3Gg97UTJ01UtOWuBA3VVU991AG2wsk16W6Te/FaSdZfteXKLCyHgOSlaZjdTgUIvV9mKbWdQHMWF45Fy8sS2IDfE1/uurVfynRL4ny+A6FyNz+p1wDWDehEA9JztAOo6ZqbuPjuPqoY8lz6y2zuB6Ho1PlB9iHkSK+0cn/PmoUr9FT1dAO+BBQiAaNAdvHVcQapFcVSMWgJFoPsa3IxaL9PVxSCNRK30CETgPAymDn4wgcu+lzkZxdLZtd7Z+7Wprkw31tmaz+1tgGCpidbXa2gc6WH53NEdoQw2AHNsQwSxZi2BczDxJK1gkAAA== */
|
|
2
2
|
._1q6dj2j0 {
|
|
3
3
|
--stackflow-plugin-basic-ui-background-color: #fff;
|
|
4
4
|
--stackflow-plugin-basic-ui-dim-background-color: rgba(0, 0, 0, 0.15);
|
|
@@ -17,6 +17,7 @@
|
|
|
17
17
|
--stackflow-plugin-basic-ui-app-bar-background-color: #fff;
|
|
18
18
|
--stackflow-plugin-basic-ui-app-bar-background-color-transition-duration: 0s;
|
|
19
19
|
--stackflow-plugin-basic-ui-app-bar-overflow: hidden;
|
|
20
|
+
--stackflow-plugin-basic-ui-force-safe-area-inset-top: 0px;
|
|
20
21
|
--stackflow-plugin-basic-ui-bottom-sheet-border-radius: 1rem;
|
|
21
22
|
}
|
|
22
23
|
._1q6dj2j1 {
|
|
@@ -37,6 +38,7 @@
|
|
|
37
38
|
--stackflow-plugin-basic-ui-app-bar-background-color: #fff;
|
|
38
39
|
--stackflow-plugin-basic-ui-app-bar-background-color-transition-duration: 0s;
|
|
39
40
|
--stackflow-plugin-basic-ui-app-bar-overflow: hidden;
|
|
41
|
+
--stackflow-plugin-basic-ui-force-safe-area-inset-top: 0px;
|
|
40
42
|
--stackflow-plugin-basic-ui-bottom-sheet-border-radius: 1rem;
|
|
41
43
|
}
|
|
42
44
|
._1q6dj2j5 {
|
|
@@ -103,7 +105,7 @@
|
|
|
103
105
|
background: none;
|
|
104
106
|
}
|
|
105
107
|
|
|
106
|
-
/* vanilla-extract-css-ns:src/components/AppScreen.css.ts.vanilla.css?source=#
|
|
108
|
+
/* vanilla-extract-css-ns:src/components/AppScreen.css.ts.vanilla.css?source=#H4sIAAAAAAAAE9WU0bKaMBCG732K3HRGpsQJenpOizd9k05IIgRDQkPQ03bOuzcEUIIK6vSmjhcwy375/93Nrn5EVOxeNi+v4M8CgASTfapVLSkkSigdgwPWSwgrYwM7oY6wFHXKJUxwxQmsOaS8gOOsYLv4WKx68tuT5GnqV0c1GsuKG65k3D7vlC46cv8lCkKgSky4+XUR8ZDkjGwwHVFgwzZ0GSH0KQTI/v0k7pI6fgzQ1r79hlxS9h6PjouCJnjkQkCSYZmyuM/riD9fab7OERjBM8bTzMQgQpoVW6+WMRBcMqxhqjHlTJrlU/0KgU4TvEStwcajM2mPan8nQd8G2sLLMB6E+6hXnug6NpnGkjks8lqSt8ED064CNl4RrYRoSgePLNlzA0/RNsRlatutapJN9G992b/TsPgC4rg/p8UnWDtNlFelwFaQVJJ5TY/ASP59Y3iqlavWBWrQrjyc+XbQu/z86YQU5F+Hi+HNr9yM2yg33FO20AO20D22hkN5r8kWtP8nuycEJabUTh40qpzdhrgs7YuG7TKA58MhrTVuHtx0DpDzG9ZnBrcGUsxMQTeTfo0Kl3Tk1GS2wqv1l2533bhbGz9btkc+ZeK8MAkWxN0YAB/FODnfq7oslTYVWHp1JUpakF22Fd4xiDXD1lTFTBMNAid9NCujxjhhDyoCn0GB32ezbIcIg9eEhTO6Xek+JmwzefjfHN+U3Jv9C2Bx8y4ACQAA */
|
|
107
109
|
._1dlf4346 {
|
|
108
110
|
background-color: var(--stackflow-plugin-basic-ui-dim-background-color);
|
|
109
111
|
}
|
|
@@ -178,16 +180,16 @@
|
|
|
178
180
|
}
|
|
179
181
|
@supports (padding-top: constant(safe-area-inset-top)) {
|
|
180
182
|
._1dlf434k {
|
|
181
|
-
padding-top: calc(var(--stackflow-plugin-basic-ui-app-bar-height) + constant(safe-area-inset-top));
|
|
183
|
+
padding-top: calc(var(--stackflow-plugin-basic-ui-app-bar-height) + max(var(--stackflow-plugin-basic-ui-force-safe-area-inset-top), constant(safe-area-inset-top)));
|
|
182
184
|
}
|
|
183
185
|
}
|
|
184
186
|
@supports (padding-top: env(safe-area-inset-top)) {
|
|
185
187
|
._1dlf434k {
|
|
186
|
-
padding-top: calc(var(--stackflow-plugin-basic-ui-app-bar-height) + env(safe-area-inset-top));
|
|
188
|
+
padding-top: calc(var(--stackflow-plugin-basic-ui-app-bar-height) + max(var(--stackflow-plugin-basic-ui-force-safe-area-inset-top), env(safe-area-inset-top)));
|
|
187
189
|
}
|
|
188
190
|
}
|
|
189
191
|
|
|
190
|
-
/* vanilla-extract-css-ns:src/components/AppBar.css.ts.vanilla.css?source=#H4sIAAAAAAAAE+
|
|
192
|
+
/* vanilla-extract-css-ns:src/components/AppBar.css.ts.vanilla.css?source=#H4sIAAAAAAAAE+1YyW7bMBC95yt4KWAXpkB5SVL51kNvPfUDAkqibMYUqYr0lqL/XoraSMnyEhg9BAlysMmZ4cybN0vivfjHzQzPFwj8eQAgpRyuCV2tVQB2OB9BKBWONgkTe5ix7Upfh1jSCG4pxFmmv+Sw1RkvH/4+eLVF31gUO5IX6tfbqzVca1NjLdTKq1xseQwjwUR+vdWuprYOwBukPCaH2sqLH7NkPpvPzeWeMgajNeYrEgCVYy4TkacTIDIcUXUsRMwpVVTwoOfauz2DrVUYb3NcfBhPQCgOUK5xLPbXWxZ5TPIzViuEfz/Gr9NXH3TAzkQdGw6lYFtF+vIlYGFXtYGrQo5hRWbxyEfoywQg/Tv+CPBN2jgBkg44qItIxZoAoOUwPhoZH+Uk/YgAuSWGxk0h9W4KIHXw9Y+LaSn0zYJ3ckEWW7KtqJMT/3xOKsJa3WhWdqMGsgBQLokCKDuACLNoBH3w9VYcJX0j4zFA78J/sJbn5wrSEA7t1p+Es0hk0cg/Sbn55KK0Rbq5LXw+FzbRzjXZz5xeldMGr4XBq15sUnwYXfJOvxYRKHFCIM4Jhqa8oRKZfjISXCtyNTp1bSC/10uE74YesaJ7dKK7FvdmZXMZUh7faOXcclH6+FRuFDiOKV/pIQiQt9CDzpUJSJrpVBaSMZUZw7o1c8GJI/Vs7m/c/qjOmbX32QHXBJohlMoJuK0sWrsDEBRrZKzWAZh60zLgNlNT76mHwXOAI0V3pLMzeNMht9H9fbbcCY0fVQhuiS1MdDfmQZGDGsjD/Yh3KyCtU5eXZGuvc7ApNtsiotetVDQ5anNcEa6TnDByKHzI1bItAMhIou/8ihCJFjbTXx95/vNTTRRGOWn+HPO9RSO7r85CweJlvYjQN1NaVT/VR0MbQTi43Vt1V/hdHGBGVxxSRVIZgEiHRPKTcbZXBk6jZp8avxOcUqaNF9Az3fSOUhXL7ncd6OYnjn6Z7z+0ZC/SR4S6SNUgGSgXJfynRuII6kunLb+nRYrsfwyOuzxzaWr0mBzZzbniJvJm/e4UG0EH8ZaeTX87nwQdHayKplboNPszDec0oWN3ZIRMRBvH77KdGmK2/48gjNFMUtnhFeVrktM+A5tzy24yNNWKMPMiYSVWeKuEq3hh1PVSNPBS8UGr/AMdXuEaxhEAAA== */
|
|
191
193
|
._1yk3a450 {
|
|
192
194
|
min-height: var(--stackflow-plugin-basic-ui-app-bar-min-height);
|
|
193
195
|
}
|
|
@@ -248,8 +250,8 @@
|
|
|
248
250
|
opacity var(--_1dlf4340);
|
|
249
251
|
}
|
|
250
252
|
._1yk3a455 {
|
|
251
|
-
height: constant(safe-area-inset-top);
|
|
252
|
-
height: env(safe-area-inset-top);
|
|
253
|
+
height: max(var(--stackflow-plugin-basic-ui-force-safe-area-inset-top), constant(safe-area-inset-top));
|
|
254
|
+
height: max(var(--stackflow-plugin-basic-ui-force-safe-area-inset-top), env(safe-area-inset-top));
|
|
253
255
|
}
|
|
254
256
|
._1yk3a456 {
|
|
255
257
|
height: var(--stackflow-plugin-basic-ui-app-bar-height);
|
|
@@ -297,8 +299,8 @@
|
|
|
297
299
|
left: 50%;
|
|
298
300
|
transform: translate(-50%);
|
|
299
301
|
height: var(--stackflow-plugin-basic-ui-app-bar-height);
|
|
300
|
-
top: constant(safe-area-inset-top);
|
|
301
|
-
top: env(safe-area-inset-top);
|
|
302
|
+
top: max(var(--stackflow-plugin-basic-ui-force-safe-area-inset-top), constant(safe-area-inset-top));
|
|
303
|
+
top: max(var(--stackflow-plugin-basic-ui-force-safe-area-inset-top), env(safe-area-inset-top));
|
|
302
304
|
}
|
|
303
305
|
._1q6dj2j0 ._1yk3a45c {
|
|
304
306
|
padding-left: 0.375rem;
|
package/dist/index.css.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["vanilla-extract-css-ns:src/basicUIPlugin.css.ts.vanilla.css?source=#H4sIAAAAAAAAE+
|
|
4
|
-
"sourcesContent": ["._1q6dj2j0 {\n --stackflow-plugin-basic-ui-background-color: #fff;\n --stackflow-plugin-basic-ui-dim-background-color: rgba(0, 0, 0, 0.15);\n --stackflow-plugin-basic-ui-transition-duration: 0s;\n --stackflow-plugin-basic-ui-computed-transition-duration: 0s;\n --stackflow-plugin-basic-ui-app-bar-border-color: rgba(0, 0, 0, 0.07);\n --stackflow-plugin-basic-ui-app-bar-border-color-transition-duration: 0s;\n --stackflow-plugin-basic-ui-app-bar-border-size: 1px;\n --stackflow-plugin-basic-ui-app-bar-height: 3.5rem;\n --stackflow-plugin-basic-ui-app-bar-height-transition-duration: 0s;\n --stackflow-plugin-basic-ui-app-bar-min-height: 3.5rem;\n --stackflow-plugin-basic-ui-app-bar-icon-color: #212124;\n --stackflow-plugin-basic-ui-app-bar-icon-color-transition-duration: 0s;\n --stackflow-plugin-basic-ui-app-bar-text-color: #212124;\n --stackflow-plugin-basic-ui-app-bar-text-color-transition-duration: 0s;\n --stackflow-plugin-basic-ui-app-bar-background-color: #fff;\n --stackflow-plugin-basic-ui-app-bar-background-color-transition-duration: 0s;\n --stackflow-plugin-basic-ui-app-bar-overflow: hidden;\n --stackflow-plugin-basic-ui-bottom-sheet-border-radius: 1rem;\n}\n._1q6dj2j1 {\n --stackflow-plugin-basic-ui-background-color: #fff;\n --stackflow-plugin-basic-ui-dim-background-color: rgba(0, 0, 0, 0.15);\n --stackflow-plugin-basic-ui-transition-duration: 0s;\n --stackflow-plugin-basic-ui-computed-transition-duration: 0s;\n --stackflow-plugin-basic-ui-app-bar-border-color: rgba(0, 0, 0, 0.07);\n --stackflow-plugin-basic-ui-app-bar-border-color-transition-duration: 0s;\n --stackflow-plugin-basic-ui-app-bar-border-size: 0.5px;\n --stackflow-plugin-basic-ui-app-bar-height: 2.75rem;\n --stackflow-plugin-basic-ui-app-bar-height-transition-duration: 0s;\n --stackflow-plugin-basic-ui-app-bar-min-height: 2.75rem;\n --stackflow-plugin-basic-ui-app-bar-icon-color: #212124;\n --stackflow-plugin-basic-ui-app-bar-icon-color-transition-duration: 0s;\n --stackflow-plugin-basic-ui-app-bar-text-color: #212124;\n --stackflow-plugin-basic-ui-app-bar-text-color-transition-duration: 0s;\n --stackflow-plugin-basic-ui-app-bar-background-color: #fff;\n --stackflow-plugin-basic-ui-app-bar-background-color-transition-duration: 0s;\n --stackflow-plugin-basic-ui-app-bar-overflow: hidden;\n --stackflow-plugin-basic-ui-bottom-sheet-border-radius: 1rem;\n}\n._1q6dj2j5 {\n pointer-events: none;\n}", ".dhthxq0 {\n width: 100%;\n}\n.dhthxq1 {\n height: 100%;\n}\n.dhthxq2 {\n top: 0;\n}\n.dhthxq3 {\n left: 0;\n}\n.dhthxq4 {\n position: absolute;\n}\n.dhthxq5 {\n position: relative;\n}\n.dhthxq7 {\n display: flex;\n}\n.dhthxq8 {\n flex: 1;\n}\n.dhthxq9 {\n align-items: center;\n}\n.dhthxqa {\n align-items: flex-end;\n}\n.dhthxqb {\n justify-content: center;\n}\n.dhthxqc {\n overflow: hidden;\n}\n.dhthxqd {\n white-space: nowrap;\n}\n.dhthxqe {\n text-align: center;\n}\n.dhthxqf {\n cursor: pointer;\n -webkit-tap-highlight-color: transparent;\n}\n.dhthxqg {\n box-sizing: border-box;\n}\n.dhthxqh {\n box-sizing: content-box;\n}\n.dhthxqi {\n appearance: none;\n border: 0;\n padding: 0;\n background: none;\n}", "._1dlf4346 {\n background-color: var(--stackflow-plugin-basic-ui-dim-background-color);\n}\n._1dlf4347 {\n background-color: var(--stackflow-plugin-basic-ui-background-color);\n}\n._1dlf4348 {\n transition: transform var(--_1dlf4340), opacity var(--_1dlf4340);\n}\n._1dlf434c {\n transform: translate3d(100%, 0, 0);\n}\n._1dlf434i {\n opacity: 0;\n z-index: var(--_1dlf4341);\n will-change: opacity;\n}\n._1q6dj2j0 ._1dlf434i {\n height: 10rem;\n background: linear-gradient(var(--stackflow-plugin-basic-ui-dim-background-color), rgba(0, 0, 0, 0));\n}\n\n ._1dlf4349 ._1dlf434i,\n ._1dlf434a ._1dlf434i\n {\n opacity: 1;\n}\n\n ._1dlf434b ._1dlf434i,\n ._1dlf434c ._1dlf434i\n {\n opacity: 0;\n}\n._1dlf434j {\n overflow-y: scroll;\n -webkit-overflow-scrolling: touch;\n z-index: var(--_1dlf4342);\n will-change: transform;\n}\n._1dlf434j::-webkit-scrollbar {\n display: none;\n}\n._1q6dj2j1 ._1dlf434j {\n transform: translate3d(100%, 0, 0);\n}\n\n ._1q6dj2j1 ._1dlf4349 ._1dlf434j,\n ._1q6dj2j1 ._1dlf434a ._1dlf434j\n {\n transform: translate3d(0, 0, 0);\n}\n._1q6dj2j0 ._1dlf434j {\n opacity: 0;\n transform: translate3d(0, 10rem, 0);\n}\n\n ._1q6dj2j0 ._1dlf4349 ._1dlf434j,\n ._1q6dj2j0 ._1dlf434a ._1dlf434j\n {\n opacity: 1;\n transform: translate3d(0, 0, 0);\n}\n._1dlf434k {\n transition: transform var(--_1dlf4340), opacity var(--_1dlf4340), padding-top var(--stackflow-plugin-basic-ui-app-bar-height-transition-duration);\n padding-top: var(--stackflow-plugin-basic-ui-app-bar-height);\n}\n._1q6dj2j1 ._1dlf434l {\n transform: translate3d(0, 100%, 0);\n}\n._1dlf434m {\n width: 1.25rem;\n z-index: var(--_1dlf4343);\n}\n._1dlf434n {\n top: var(--stackflow-plugin-basic-ui-app-bar-height);\n height: calc(100% - var(--stackflow-plugin-basic-ui-app-bar-height));\n}\n@supports (padding-top: constant(safe-area-inset-top)) {\n ._1dlf434k {\n padding-top: calc(var(--stackflow-plugin-basic-ui-app-bar-height) + constant(safe-area-inset-top));\n }\n}\n@supports (padding-top: env(safe-area-inset-top)) {\n ._1dlf434k {\n padding-top: calc(var(--stackflow-plugin-basic-ui-app-bar-height) + env(safe-area-inset-top));\n }\n}", "._1yk3a450 {\n min-height: var(--stackflow-plugin-basic-ui-app-bar-min-height);\n}\n._1yk3a451 {\n overflow: var(--stackflow-plugin-basic-ui-app-bar-overflow);\n}\n._1yk3a452 {\n background-color: var(--stackflow-plugin-basic-ui-app-bar-background-color);\n z-index: var(--_1dlf4344);\n will-change: transform, opacity;\n transition: background-color var(--stackflow-plugin-basic-ui-app-bar-background-color-transition-duration), box-shadow var(--stackflow-plugin-basic-ui-app-bar-border-color-transition-duration);\n}\n._1q6dj2j1 ._1yk3a452 {\n position: absolute;\n}\n._1q6dj2j1 ._1dlf434b ._1yk3a452 {\n transform: translate3d(100%, 0, 0);\n transition: background-color var(--stackflow-plugin-basic-ui-app-bar-background-color-transition-duration), box-shadow var(--stackflow-plugin-basic-ui-app-bar-border-color-transition-duration), transform 0s;\n}\n._1q6dj2j0 ._1yk3a452 {\n opacity: 0;\n transform: translate3d(0, 10rem, 0);\n transition: background-color var(--stackflow-plugin-basic-ui-app-bar-background-color-transition-duration), box-shadow var(--stackflow-plugin-basic-ui-app-bar-border-color-transition-duration), transform var(--_1dlf4340), opacity var(--_1dlf4340);\n}\n\n ._1q6dj2j0 ._1dlf4349 ._1yk3a452,\n ._1q6dj2j0 ._1dlf434a ._1yk3a452\n {\n opacity: 1;\n transform: translate3d(0, 0, 0);\n}\n._1yk3a453 {\n box-shadow: inset 0px calc(-1 * var(--stackflow-plugin-basic-ui-app-bar-border-size)) 0 var(--stackflow-plugin-basic-ui-app-bar-border-color);\n}\n._1q6dj2j1 ._1yk3a454 {\n transform: translate3d(0, 100vh, 0);\n transition: background-color var(--stackflow-plugin-basic-ui-app-bar-background-color-transition-duration), box-shadow var(--stackflow-plugin-basic-ui-app-bar-border-color-transition-duration), transform var(--_1dlf4340), opacity var(--_1dlf4340);\n}\n\n ._1q6dj2j1 ._1dlf4349 ._1yk3a454,\n ._1q6dj2j1 ._1dlf434a ._1yk3a454\n {\n transform: translate3d(0, 0, 0);\n}\n._1q6dj2j1 ._1dlf434b ._1yk3a454 {\n transform: translate3d(0, 100vh, 0);\n transition: background-color var(--stackflow-plugin-basic-ui-app-bar-background-color-transition-duration), box-shadow var(--stackflow-plugin-basic-ui-app-bar-border-color-transition-duration), transform var(--_1dlf4340), opacity var(--_1dlf4340);\n}\n._1yk3a455 {\n height: constant(safe-area-inset-top);\n height: env(safe-area-inset-top);\n}\n._1yk3a456 {\n height: var(--stackflow-plugin-basic-ui-app-bar-height);\n transition: height var(--stackflow-plugin-basic-ui-app-bar-height-transition-duration);\n}\n._1yk3a457 {\n padding: 0 0.5rem;\n}\n._1yk3a457:empty {\n display: none;\n}\n._1yk3a458 {\n color: var(--stackflow-plugin-basic-ui-app-bar-icon-color);\n transition: opacity 300ms, color var(--stackflow-plugin-basic-ui-app-bar-icon-color-transition-duration);\n width: 2.25rem;\n height: 2.75rem;\n}\n._1yk3a458:active {\n opacity: 0.2;\n transition: opacity 0s, color var(--stackflow-plugin-basic-ui-app-bar-icon-color-transition-duration);\n}\n._1yk3a45b {\n width: var(--_1dlf4345);\n color: var(--stackflow-plugin-basic-ui-app-bar-text-color);\n transition: height var(--stackflow-plugin-basic-ui-app-bar-height-transition-duration), color var(--stackflow-plugin-basic-ui-app-bar-text-color-transition-duration);\n}\n._1q6dj2j0 ._1yk3a45b {\n width: 100%;\n justify-content: flex-start;\n padding-left: 1rem;\n font-size: 1.1875rem;\n line-height: 1.5;\n font-weight: bold;\n box-sizing: border-box;\n}\n._1q6dj2j1 ._1yk3a45b {\n position: absolute;\n display: flex;\n align-items: center;\n justify-content: center;\n text-align: center;\n font-family: -apple-system, BlinkMacSystemFont;\n font-weight: 600;\n font-size: 1rem;\n left: 50%;\n transform: translate(-50%);\n height: var(--stackflow-plugin-basic-ui-app-bar-height);\n top: constant(safe-area-inset-top);\n top: env(safe-area-inset-top);\n}\n._1q6dj2j0 ._1yk3a45c {\n padding-left: 0.375rem;\n}\n._1yk3a45d {\n left: 50%;\n height: 1.25rem;\n transform: translate(-50%);\n max-width: 5rem;\n display: none;\n width: var(--_1dlf4345);\n}\n._1q6dj2j1 ._1yk3a45d {\n display: block;\n}\n._1yk3a45e {\n text-overflow: ellipsis;\n font-size: inherit;\n font-weight: inherit;\n}\n._1yk3a45f {\n padding: 0 0.5rem;\n margin-left: auto;\n}\n._1yk3a45f:empty {\n display: none;\n}\n._1q6dj2j0 ._1yk3a45f {\n padding: 0 0.5rem 0 0;\n}", "._1ht38h03 {\n transition: var(--_1ht38h00);\n}\n._1ht38h07 {\n transform: translate3d(100%, 0, 0);\n}\n._1ht38h0d {\n background-color: var(--stackflow-plugin-basic-ui-dim-background-color);\n z-index: var(--_1ht38h01);\n opacity: 0;\n}\n._1ht38h04 ._1ht38h0d, ._1ht38h05 ._1ht38h0d {\n opacity: 1;\n}\n._1ht38h06 ._1ht38h0d, ._1ht38h07 ._1ht38h0d {\n opacity: 0;\n}\n._1ht38h0e {\n background-color: var(--stackflow-plugin-basic-ui-background-color);\n width: 100%;\n border-radius: var(--stackflow-plugin-basic-ui-bottom-sheet-border-radius) var(--stackflow-plugin-basic-ui-bottom-sheet-border-radius) 0 0;\n will-change: transform, opacity;\n transform: translate3d(0, 100%, 0);\n opacity: 0;\n}\n._1ht38h04 ._1ht38h0e, ._1ht38h05 ._1ht38h0e {\n transform: translate3d(0, 0, 0);\n opacity: 1;\n}\n._1ht38h06 ._1ht38h0e, ._1ht38h07 ._1ht38h0e {\n transform: translate3d(0, 100%, 0);\n opacity: 0;\n}", "._5ozg8c3 {\n transition: var(--_5ozg8c0);\n}\n._5ozg8c7 {\n transform: translate3d(100%, 0, 0);\n}\n._5ozg8cd {\n background-color: var(--stackflow-plugin-basic-ui-dim-background-color);\n z-index: var(--_5ozg8c1);\n opacity: 0;\n}\n._5ozg8c4 ._5ozg8cd, ._5ozg8c5 ._5ozg8cd {\n opacity: 1;\n}\n._5ozg8c6 ._5ozg8cd, ._5ozg8c7 ._5ozg8cd {\n opacity: 0;\n}\n._5ozg8ce {\n background-color: var(--stackflow-plugin-basic-ui-background-color);\n width: 100%;\n margin: 0 2.5rem;\n box-shadow: 0px 0.625rem 2.375rem rgba(0, 0, 0, 0.15), 0px .5625rem 2.875rem rgba(0, 0, 0, 0.12), 0px .3125rem .9375rem rgba(0, 0, 0, 0.1);\n border-radius: var(--stackflow-plugin-basic-ui-bottom-sheet-border-radius);\n will-change: transform, opacity;\n transform: scale(1.1);\n opacity: 0;\n}\n._5ozg8c4 ._5ozg8ce, ._5ozg8c5 ._5ozg8ce {\n transform: scale(1);\n opacity: 1;\n}\n._5ozg8c6 ._5ozg8ce, ._5ozg8c7 ._5ozg8ce {\n transform: scale(1.1);\n opacity: 0;\n}"],
|
|
5
|
-
"mappings": ";AAAA;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAEF;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAEF;AACE;AAAA;;;
|
|
3
|
+
"sources": ["vanilla-extract-css-ns:src/basicUIPlugin.css.ts.vanilla.css?source=#H4sIAAAAAAAAE+2UUUvDMBDH3/cpAr4omNJO66B+GEmTa3vbmouXdA7F7242NnzZqG0FEUrykIT73f0hd//kJXt9MuvlOhUfCyGk9EHpTbWlN+m2XY1Wlsqjlh3Gg97UTJ01UtOWuBA3VVU991AG2wsk16W6Te/FaSdZfteXKLCyHgOSlaZjdTgUIvV9mKbWdQHMWF45Fy8sS2IDfE1/uurVfynRL4ny+A6FyNz+p1wDWDehEA9JztAOo6ZqbuPjuPqoY8lz6y2zuB6Ho1PlB9iHkSK+0cn/PmoUr9FT1dAO+BBQiAaNAdvHVcQapFcVSMWgJFoPsa3IxaL9PVxSCNRK30CETgPAymDn4wgcu+lzkZxdLZtd7Z+7Wprkw31tmaz+1tgGCpidbXa2gc6WH53NEdoQw2AHNsQwSxZi2BczDxJK1gkAAA==", "vanilla-extract-css-ns:src/styles/f.css.ts.vanilla.css?source=LmRodGh4cTAgewogIHdpZHRoOiAxMDAlOwp9Ci5kaHRoeHExIHsKICBoZWlnaHQ6IDEwMCU7Cn0KLmRodGh4cTIgewogIHRvcDogMDsKfQouZGh0aHhxMyB7CiAgbGVmdDogMDsKfQouZGh0aHhxNCB7CiAgcG9zaXRpb246IGFic29sdXRlOwp9Ci5kaHRoeHE1IHsKICBwb3NpdGlvbjogcmVsYXRpdmU7Cn0KLmRodGh4cTcgewogIGRpc3BsYXk6IGZsZXg7Cn0KLmRodGh4cTggewogIGZsZXg6IDE7Cn0KLmRodGh4cTkgewogIGFsaWduLWl0ZW1zOiBjZW50ZXI7Cn0KLmRodGh4cWEgewogIGFsaWduLWl0ZW1zOiBmbGV4LWVuZDsKfQouZGh0aHhxYiB7CiAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7Cn0KLmRodGh4cWMgewogIG92ZXJmbG93OiBoaWRkZW47Cn0KLmRodGh4cWQgewogIHdoaXRlLXNwYWNlOiBub3dyYXA7Cn0KLmRodGh4cWUgewogIHRleHQtYWxpZ246IGNlbnRlcjsKfQouZGh0aHhxZiB7CiAgY3Vyc29yOiBwb2ludGVyOwogIC13ZWJraXQtdGFwLWhpZ2hsaWdodC1jb2xvcjogdHJhbnNwYXJlbnQ7Cn0KLmRodGh4cWcgewogIGJveC1zaXppbmc6IGJvcmRlci1ib3g7Cn0KLmRodGh4cWggewogIGJveC1zaXppbmc6IGNvbnRlbnQtYm94Owp9Ci5kaHRoeHFpIHsKICBhcHBlYXJhbmNlOiBub25lOwogIGJvcmRlcjogMDsKICBwYWRkaW5nOiAwOwogIGJhY2tncm91bmQ6IG5vbmU7Cn0=", "vanilla-extract-css-ns:src/components/AppScreen.css.ts.vanilla.css?source=#H4sIAAAAAAAAE9WU0bKaMBCG732K3HRGpsQJenpOizd9k05IIgRDQkPQ03bOuzcEUIIK6vSmjhcwy375/93Nrn5EVOxeNi+v4M8CgASTfapVLSkkSigdgwPWSwgrYwM7oY6wFHXKJUxwxQmsOaS8gOOsYLv4WKx68tuT5GnqV0c1GsuKG65k3D7vlC46cv8lCkKgSky4+XUR8ZDkjGwwHVFgwzZ0GSH0KQTI/v0k7pI6fgzQ1r79hlxS9h6PjouCJnjkQkCSYZmyuM/riD9fab7OERjBM8bTzMQgQpoVW6+WMRBcMqxhqjHlTJrlU/0KgU4TvEStwcajM2mPan8nQd8G2sLLMB6E+6hXnug6NpnGkjks8lqSt8ED064CNl4RrYRoSgePLNlzA0/RNsRlatutapJN9G992b/TsPgC4rg/p8UnWDtNlFelwFaQVJJ5TY/ASP59Y3iqlavWBWrQrjyc+XbQu/z86YQU5F+Hi+HNr9yM2yg33FO20AO20D22hkN5r8kWtP8nuycEJabUTh40qpzdhrgs7YuG7TKA58MhrTVuHtx0DpDzG9ZnBrcGUsxMQTeTfo0Kl3Tk1GS2wqv1l2533bhbGz9btkc+ZeK8MAkWxN0YAB/FODnfq7oslTYVWHp1JUpakF22Fd4xiDXD1lTFTBMNAid9NCujxjhhDyoCn0GB32ezbIcIg9eEhTO6Xek+JmwzefjfHN+U3Jv9C2Bx8y4ACQAA", "vanilla-extract-css-ns:src/components/AppBar.css.ts.vanilla.css?source=#H4sIAAAAAAAAE+1YyW7bMBC95yt4KWAXpkB5SVL51kNvPfUDAkqibMYUqYr0lqL/XoraSMnyEhg9BAlysMmZ4cybN0vivfjHzQzPFwj8eQAgpRyuCV2tVQB2OB9BKBWONgkTe5ix7Upfh1jSCG4pxFmmv+Sw1RkvH/4+eLVF31gUO5IX6tfbqzVca1NjLdTKq1xseQwjwUR+vdWuprYOwBukPCaH2sqLH7NkPpvPzeWeMgajNeYrEgCVYy4TkacTIDIcUXUsRMwpVVTwoOfauz2DrVUYb3NcfBhPQCgOUK5xLPbXWxZ5TPIzViuEfz/Gr9NXH3TAzkQdGw6lYFtF+vIlYGFXtYGrQo5hRWbxyEfoywQg/Tv+CPBN2jgBkg44qItIxZoAoOUwPhoZH+Uk/YgAuSWGxk0h9W4KIHXw9Y+LaSn0zYJ3ckEWW7KtqJMT/3xOKsJa3WhWdqMGsgBQLokCKDuACLNoBH3w9VYcJX0j4zFA78J/sJbn5wrSEA7t1p+Es0hk0cg/Sbn55KK0Rbq5LXw+FzbRzjXZz5xeldMGr4XBq15sUnwYXfJOvxYRKHFCIM4Jhqa8oRKZfjISXCtyNTp1bSC/10uE74YesaJ7dKK7FvdmZXMZUh7faOXcclH6+FRuFDiOKV/pIQiQt9CDzpUJSJrpVBaSMZUZw7o1c8GJI/Vs7m/c/qjOmbX32QHXBJohlMoJuK0sWrsDEBRrZKzWAZh60zLgNlNT76mHwXOAI0V3pLMzeNMht9H9fbbcCY0fVQhuiS1MdDfmQZGDGsjD/Yh3KyCtU5eXZGuvc7ApNtsiotetVDQ5anNcEa6TnDByKHzI1bItAMhIou/8ihCJFjbTXx95/vNTTRRGOWn+HPO9RSO7r85CweJlvYjQN1NaVT/VR0MbQTi43Vt1V/hdHGBGVxxSRVIZgEiHRPKTcbZXBk6jZp8avxOcUqaNF9Az3fSOUhXL7ncd6OYnjn6Z7z+0ZC/SR4S6SNUgGSgXJfynRuII6kunLb+nRYrsfwyOuzxzaWr0mBzZzbniJvJm/e4UG0EH8ZaeTX87nwQdHayKplboNPszDec0oWN3ZIRMRBvH77KdGmK2/48gjNFMUtnhFeVrktM+A5tzy24yNNWKMPMiYSVWeKuEq3hh1PVSNPBS8UGr/AMdXuEaxhEAAA==", "vanilla-extract-css-ns:src/components/BottomSheet.css.ts.vanilla.css?source=Ll8xaHQzOGgwMyB7CiAgdHJhbnNpdGlvbjogdmFyKC0tXzFodDM4aDAwKTsKfQouXzFodDM4aDA3IHsKICB0cmFuc2Zvcm06IHRyYW5zbGF0ZTNkKDEwMCUsIDAsIDApOwp9Ci5fMWh0MzhoMGQgewogIGJhY2tncm91bmQtY29sb3I6IHZhcigtLXN0YWNrZmxvdy1wbHVnaW4tYmFzaWMtdWktZGltLWJhY2tncm91bmQtY29sb3IpOwogIHotaW5kZXg6IHZhcigtLV8xaHQzOGgwMSk7CiAgb3BhY2l0eTogMDsKfQouXzFodDM4aDA0IC5fMWh0MzhoMGQsIC5fMWh0MzhoMDUgLl8xaHQzOGgwZCB7CiAgb3BhY2l0eTogMTsKfQouXzFodDM4aDA2IC5fMWh0MzhoMGQsIC5fMWh0MzhoMDcgLl8xaHQzOGgwZCB7CiAgb3BhY2l0eTogMDsKfQouXzFodDM4aDBlIHsKICBiYWNrZ3JvdW5kLWNvbG9yOiB2YXIoLS1zdGFja2Zsb3ctcGx1Z2luLWJhc2ljLXVpLWJhY2tncm91bmQtY29sb3IpOwogIHdpZHRoOiAxMDAlOwogIGJvcmRlci1yYWRpdXM6IHZhcigtLXN0YWNrZmxvdy1wbHVnaW4tYmFzaWMtdWktYm90dG9tLXNoZWV0LWJvcmRlci1yYWRpdXMpIHZhcigtLXN0YWNrZmxvdy1wbHVnaW4tYmFzaWMtdWktYm90dG9tLXNoZWV0LWJvcmRlci1yYWRpdXMpIDAgMDsKICB3aWxsLWNoYW5nZTogdHJhbnNmb3JtLCBvcGFjaXR5OwogIHRyYW5zZm9ybTogdHJhbnNsYXRlM2QoMCwgMTAwJSwgMCk7CiAgb3BhY2l0eTogMDsKfQouXzFodDM4aDA0IC5fMWh0MzhoMGUsIC5fMWh0MzhoMDUgLl8xaHQzOGgwZSB7CiAgdHJhbnNmb3JtOiB0cmFuc2xhdGUzZCgwLCAwLCAwKTsKICBvcGFjaXR5OiAxOwp9Ci5fMWh0MzhoMDYgLl8xaHQzOGgwZSwgLl8xaHQzOGgwNyAuXzFodDM4aDBlIHsKICB0cmFuc2Zvcm06IHRyYW5zbGF0ZTNkKDAsIDEwMCUsIDApOwogIG9wYWNpdHk6IDA7Cn0=", "vanilla-extract-css-ns:src/components/Modal.css.ts.vanilla.css?source=Ll81b3pnOGMzIHsKICB0cmFuc2l0aW9uOiB2YXIoLS1fNW96ZzhjMCk7Cn0KLl81b3pnOGM3IHsKICB0cmFuc2Zvcm06IHRyYW5zbGF0ZTNkKDEwMCUsIDAsIDApOwp9Ci5fNW96ZzhjZCB7CiAgYmFja2dyb3VuZC1jb2xvcjogdmFyKC0tc3RhY2tmbG93LXBsdWdpbi1iYXNpYy11aS1kaW0tYmFja2dyb3VuZC1jb2xvcik7CiAgei1pbmRleDogdmFyKC0tXzVvemc4YzEpOwogIG9wYWNpdHk6IDA7Cn0KLl81b3pnOGM0IC5fNW96ZzhjZCwgLl81b3pnOGM1IC5fNW96ZzhjZCB7CiAgb3BhY2l0eTogMTsKfQouXzVvemc4YzYgLl81b3pnOGNkLCAuXzVvemc4YzcgLl81b3pnOGNkIHsKICBvcGFjaXR5OiAwOwp9Ci5fNW96ZzhjZSB7CiAgYmFja2dyb3VuZC1jb2xvcjogdmFyKC0tc3RhY2tmbG93LXBsdWdpbi1iYXNpYy11aS1iYWNrZ3JvdW5kLWNvbG9yKTsKICB3aWR0aDogMTAwJTsKICBtYXJnaW46IDAgMi41cmVtOwogIGJveC1zaGFkb3c6IDBweCAwLjYyNXJlbSAyLjM3NXJlbSByZ2JhKDAsIDAsIDAsIDAuMTUpLCAwcHggLjU2MjVyZW0gMi44NzVyZW0gcmdiYSgwLCAwLCAwLCAwLjEyKSwgMHB4IC4zMTI1cmVtIC45Mzc1cmVtIHJnYmEoMCwgMCwgMCwgMC4xKTsKICBib3JkZXItcmFkaXVzOiB2YXIoLS1zdGFja2Zsb3ctcGx1Z2luLWJhc2ljLXVpLWJvdHRvbS1zaGVldC1ib3JkZXItcmFkaXVzKTsKICB3aWxsLWNoYW5nZTogdHJhbnNmb3JtLCBvcGFjaXR5OwogIHRyYW5zZm9ybTogc2NhbGUoMS4xKTsKICBvcGFjaXR5OiAwOwp9Ci5fNW96ZzhjNCAuXzVvemc4Y2UsIC5fNW96ZzhjNSAuXzVvemc4Y2UgewogIHRyYW5zZm9ybTogc2NhbGUoMSk7CiAgb3BhY2l0eTogMTsKfQouXzVvemc4YzYgLl81b3pnOGNlLCAuXzVvemc4YzcgLl81b3pnOGNlIHsKICB0cmFuc2Zvcm06IHNjYWxlKDEuMSk7CiAgb3BhY2l0eTogMDsKfQ=="],
|
|
4
|
+
"sourcesContent": ["._1q6dj2j0 {\n --stackflow-plugin-basic-ui-background-color: #fff;\n --stackflow-plugin-basic-ui-dim-background-color: rgba(0, 0, 0, 0.15);\n --stackflow-plugin-basic-ui-transition-duration: 0s;\n --stackflow-plugin-basic-ui-computed-transition-duration: 0s;\n --stackflow-plugin-basic-ui-app-bar-border-color: rgba(0, 0, 0, 0.07);\n --stackflow-plugin-basic-ui-app-bar-border-color-transition-duration: 0s;\n --stackflow-plugin-basic-ui-app-bar-border-size: 1px;\n --stackflow-plugin-basic-ui-app-bar-height: 3.5rem;\n --stackflow-plugin-basic-ui-app-bar-height-transition-duration: 0s;\n --stackflow-plugin-basic-ui-app-bar-min-height: 3.5rem;\n --stackflow-plugin-basic-ui-app-bar-icon-color: #212124;\n --stackflow-plugin-basic-ui-app-bar-icon-color-transition-duration: 0s;\n --stackflow-plugin-basic-ui-app-bar-text-color: #212124;\n --stackflow-plugin-basic-ui-app-bar-text-color-transition-duration: 0s;\n --stackflow-plugin-basic-ui-app-bar-background-color: #fff;\n --stackflow-plugin-basic-ui-app-bar-background-color-transition-duration: 0s;\n --stackflow-plugin-basic-ui-app-bar-overflow: hidden;\n --stackflow-plugin-basic-ui-force-safe-area-inset-top: 0px;\n --stackflow-plugin-basic-ui-bottom-sheet-border-radius: 1rem;\n}\n._1q6dj2j1 {\n --stackflow-plugin-basic-ui-background-color: #fff;\n --stackflow-plugin-basic-ui-dim-background-color: rgba(0, 0, 0, 0.15);\n --stackflow-plugin-basic-ui-transition-duration: 0s;\n --stackflow-plugin-basic-ui-computed-transition-duration: 0s;\n --stackflow-plugin-basic-ui-app-bar-border-color: rgba(0, 0, 0, 0.07);\n --stackflow-plugin-basic-ui-app-bar-border-color-transition-duration: 0s;\n --stackflow-plugin-basic-ui-app-bar-border-size: 0.5px;\n --stackflow-plugin-basic-ui-app-bar-height: 2.75rem;\n --stackflow-plugin-basic-ui-app-bar-height-transition-duration: 0s;\n --stackflow-plugin-basic-ui-app-bar-min-height: 2.75rem;\n --stackflow-plugin-basic-ui-app-bar-icon-color: #212124;\n --stackflow-plugin-basic-ui-app-bar-icon-color-transition-duration: 0s;\n --stackflow-plugin-basic-ui-app-bar-text-color: #212124;\n --stackflow-plugin-basic-ui-app-bar-text-color-transition-duration: 0s;\n --stackflow-plugin-basic-ui-app-bar-background-color: #fff;\n --stackflow-plugin-basic-ui-app-bar-background-color-transition-duration: 0s;\n --stackflow-plugin-basic-ui-app-bar-overflow: hidden;\n --stackflow-plugin-basic-ui-force-safe-area-inset-top: 0px;\n --stackflow-plugin-basic-ui-bottom-sheet-border-radius: 1rem;\n}\n._1q6dj2j5 {\n pointer-events: none;\n}", ".dhthxq0 {\n width: 100%;\n}\n.dhthxq1 {\n height: 100%;\n}\n.dhthxq2 {\n top: 0;\n}\n.dhthxq3 {\n left: 0;\n}\n.dhthxq4 {\n position: absolute;\n}\n.dhthxq5 {\n position: relative;\n}\n.dhthxq7 {\n display: flex;\n}\n.dhthxq8 {\n flex: 1;\n}\n.dhthxq9 {\n align-items: center;\n}\n.dhthxqa {\n align-items: flex-end;\n}\n.dhthxqb {\n justify-content: center;\n}\n.dhthxqc {\n overflow: hidden;\n}\n.dhthxqd {\n white-space: nowrap;\n}\n.dhthxqe {\n text-align: center;\n}\n.dhthxqf {\n cursor: pointer;\n -webkit-tap-highlight-color: transparent;\n}\n.dhthxqg {\n box-sizing: border-box;\n}\n.dhthxqh {\n box-sizing: content-box;\n}\n.dhthxqi {\n appearance: none;\n border: 0;\n padding: 0;\n background: none;\n}", "._1dlf4346 {\n background-color: var(--stackflow-plugin-basic-ui-dim-background-color);\n}\n._1dlf4347 {\n background-color: var(--stackflow-plugin-basic-ui-background-color);\n}\n._1dlf4348 {\n transition: transform var(--_1dlf4340), opacity var(--_1dlf4340);\n}\n._1dlf434c {\n transform: translate3d(100%, 0, 0);\n}\n._1dlf434i {\n opacity: 0;\n z-index: var(--_1dlf4341);\n will-change: opacity;\n}\n._1q6dj2j0 ._1dlf434i {\n height: 10rem;\n background: linear-gradient(var(--stackflow-plugin-basic-ui-dim-background-color), rgba(0, 0, 0, 0));\n}\n\n ._1dlf4349 ._1dlf434i,\n ._1dlf434a ._1dlf434i\n {\n opacity: 1;\n}\n\n ._1dlf434b ._1dlf434i,\n ._1dlf434c ._1dlf434i\n {\n opacity: 0;\n}\n._1dlf434j {\n overflow-y: scroll;\n -webkit-overflow-scrolling: touch;\n z-index: var(--_1dlf4342);\n will-change: transform;\n}\n._1dlf434j::-webkit-scrollbar {\n display: none;\n}\n._1q6dj2j1 ._1dlf434j {\n transform: translate3d(100%, 0, 0);\n}\n\n ._1q6dj2j1 ._1dlf4349 ._1dlf434j,\n ._1q6dj2j1 ._1dlf434a ._1dlf434j\n {\n transform: translate3d(0, 0, 0);\n}\n._1q6dj2j0 ._1dlf434j {\n opacity: 0;\n transform: translate3d(0, 10rem, 0);\n}\n\n ._1q6dj2j0 ._1dlf4349 ._1dlf434j,\n ._1q6dj2j0 ._1dlf434a ._1dlf434j\n {\n opacity: 1;\n transform: translate3d(0, 0, 0);\n}\n._1dlf434k {\n transition: transform var(--_1dlf4340), opacity var(--_1dlf4340), padding-top var(--stackflow-plugin-basic-ui-app-bar-height-transition-duration);\n padding-top: var(--stackflow-plugin-basic-ui-app-bar-height);\n}\n._1q6dj2j1 ._1dlf434l {\n transform: translate3d(0, 100%, 0);\n}\n._1dlf434m {\n width: 1.25rem;\n z-index: var(--_1dlf4343);\n}\n._1dlf434n {\n top: var(--stackflow-plugin-basic-ui-app-bar-height);\n height: calc(100% - var(--stackflow-plugin-basic-ui-app-bar-height));\n}\n@supports (padding-top: constant(safe-area-inset-top)) {\n ._1dlf434k {\n padding-top: calc(var(--stackflow-plugin-basic-ui-app-bar-height) + max(var(--stackflow-plugin-basic-ui-force-safe-area-inset-top), constant(safe-area-inset-top)));\n }\n}\n@supports (padding-top: env(safe-area-inset-top)) {\n ._1dlf434k {\n padding-top: calc(var(--stackflow-plugin-basic-ui-app-bar-height) + max(var(--stackflow-plugin-basic-ui-force-safe-area-inset-top), env(safe-area-inset-top)));\n }\n}", "._1yk3a450 {\n min-height: var(--stackflow-plugin-basic-ui-app-bar-min-height);\n}\n._1yk3a451 {\n overflow: var(--stackflow-plugin-basic-ui-app-bar-overflow);\n}\n._1yk3a452 {\n background-color: var(--stackflow-plugin-basic-ui-app-bar-background-color);\n z-index: var(--_1dlf4344);\n will-change: transform, opacity;\n transition: background-color var(--stackflow-plugin-basic-ui-app-bar-background-color-transition-duration), box-shadow var(--stackflow-plugin-basic-ui-app-bar-border-color-transition-duration);\n}\n._1q6dj2j1 ._1yk3a452 {\n position: absolute;\n}\n._1q6dj2j1 ._1dlf434b ._1yk3a452 {\n transform: translate3d(100%, 0, 0);\n transition: background-color var(--stackflow-plugin-basic-ui-app-bar-background-color-transition-duration), box-shadow var(--stackflow-plugin-basic-ui-app-bar-border-color-transition-duration), transform 0s;\n}\n._1q6dj2j0 ._1yk3a452 {\n opacity: 0;\n transform: translate3d(0, 10rem, 0);\n transition: background-color var(--stackflow-plugin-basic-ui-app-bar-background-color-transition-duration), box-shadow var(--stackflow-plugin-basic-ui-app-bar-border-color-transition-duration), transform var(--_1dlf4340), opacity var(--_1dlf4340);\n}\n\n ._1q6dj2j0 ._1dlf4349 ._1yk3a452,\n ._1q6dj2j0 ._1dlf434a ._1yk3a452\n {\n opacity: 1;\n transform: translate3d(0, 0, 0);\n}\n._1yk3a453 {\n box-shadow: inset 0px calc(-1 * var(--stackflow-plugin-basic-ui-app-bar-border-size)) 0 var(--stackflow-plugin-basic-ui-app-bar-border-color);\n}\n._1q6dj2j1 ._1yk3a454 {\n transform: translate3d(0, 100vh, 0);\n transition: background-color var(--stackflow-plugin-basic-ui-app-bar-background-color-transition-duration), box-shadow var(--stackflow-plugin-basic-ui-app-bar-border-color-transition-duration), transform var(--_1dlf4340), opacity var(--_1dlf4340);\n}\n\n ._1q6dj2j1 ._1dlf4349 ._1yk3a454,\n ._1q6dj2j1 ._1dlf434a ._1yk3a454\n {\n transform: translate3d(0, 0, 0);\n}\n._1q6dj2j1 ._1dlf434b ._1yk3a454 {\n transform: translate3d(0, 100vh, 0);\n transition: background-color var(--stackflow-plugin-basic-ui-app-bar-background-color-transition-duration), box-shadow var(--stackflow-plugin-basic-ui-app-bar-border-color-transition-duration), transform var(--_1dlf4340), opacity var(--_1dlf4340);\n}\n._1yk3a455 {\n height: max(var(--stackflow-plugin-basic-ui-force-safe-area-inset-top), constant(safe-area-inset-top));\n height: max(var(--stackflow-plugin-basic-ui-force-safe-area-inset-top), env(safe-area-inset-top));\n}\n._1yk3a456 {\n height: var(--stackflow-plugin-basic-ui-app-bar-height);\n transition: height var(--stackflow-plugin-basic-ui-app-bar-height-transition-duration);\n}\n._1yk3a457 {\n padding: 0 0.5rem;\n}\n._1yk3a457:empty {\n display: none;\n}\n._1yk3a458 {\n color: var(--stackflow-plugin-basic-ui-app-bar-icon-color);\n transition: opacity 300ms, color var(--stackflow-plugin-basic-ui-app-bar-icon-color-transition-duration);\n width: 2.25rem;\n height: 2.75rem;\n}\n._1yk3a458:active {\n opacity: 0.2;\n transition: opacity 0s, color var(--stackflow-plugin-basic-ui-app-bar-icon-color-transition-duration);\n}\n._1yk3a45b {\n width: var(--_1dlf4345);\n color: var(--stackflow-plugin-basic-ui-app-bar-text-color);\n transition: height var(--stackflow-plugin-basic-ui-app-bar-height-transition-duration), color var(--stackflow-plugin-basic-ui-app-bar-text-color-transition-duration);\n}\n._1q6dj2j0 ._1yk3a45b {\n width: 100%;\n justify-content: flex-start;\n padding-left: 1rem;\n font-size: 1.1875rem;\n line-height: 1.5;\n font-weight: bold;\n box-sizing: border-box;\n}\n._1q6dj2j1 ._1yk3a45b {\n position: absolute;\n display: flex;\n align-items: center;\n justify-content: center;\n text-align: center;\n font-family: -apple-system, BlinkMacSystemFont;\n font-weight: 600;\n font-size: 1rem;\n left: 50%;\n transform: translate(-50%);\n height: var(--stackflow-plugin-basic-ui-app-bar-height);\n top: max(var(--stackflow-plugin-basic-ui-force-safe-area-inset-top), constant(safe-area-inset-top));\n top: max(var(--stackflow-plugin-basic-ui-force-safe-area-inset-top), env(safe-area-inset-top));\n}\n._1q6dj2j0 ._1yk3a45c {\n padding-left: 0.375rem;\n}\n._1yk3a45d {\n left: 50%;\n height: 1.25rem;\n transform: translate(-50%);\n max-width: 5rem;\n display: none;\n width: var(--_1dlf4345);\n}\n._1q6dj2j1 ._1yk3a45d {\n display: block;\n}\n._1yk3a45e {\n text-overflow: ellipsis;\n font-size: inherit;\n font-weight: inherit;\n}\n._1yk3a45f {\n padding: 0 0.5rem;\n margin-left: auto;\n}\n._1yk3a45f:empty {\n display: none;\n}\n._1q6dj2j0 ._1yk3a45f {\n padding: 0 0.5rem 0 0;\n}", "._1ht38h03 {\n transition: var(--_1ht38h00);\n}\n._1ht38h07 {\n transform: translate3d(100%, 0, 0);\n}\n._1ht38h0d {\n background-color: var(--stackflow-plugin-basic-ui-dim-background-color);\n z-index: var(--_1ht38h01);\n opacity: 0;\n}\n._1ht38h04 ._1ht38h0d, ._1ht38h05 ._1ht38h0d {\n opacity: 1;\n}\n._1ht38h06 ._1ht38h0d, ._1ht38h07 ._1ht38h0d {\n opacity: 0;\n}\n._1ht38h0e {\n background-color: var(--stackflow-plugin-basic-ui-background-color);\n width: 100%;\n border-radius: var(--stackflow-plugin-basic-ui-bottom-sheet-border-radius) var(--stackflow-plugin-basic-ui-bottom-sheet-border-radius) 0 0;\n will-change: transform, opacity;\n transform: translate3d(0, 100%, 0);\n opacity: 0;\n}\n._1ht38h04 ._1ht38h0e, ._1ht38h05 ._1ht38h0e {\n transform: translate3d(0, 0, 0);\n opacity: 1;\n}\n._1ht38h06 ._1ht38h0e, ._1ht38h07 ._1ht38h0e {\n transform: translate3d(0, 100%, 0);\n opacity: 0;\n}", "._5ozg8c3 {\n transition: var(--_5ozg8c0);\n}\n._5ozg8c7 {\n transform: translate3d(100%, 0, 0);\n}\n._5ozg8cd {\n background-color: var(--stackflow-plugin-basic-ui-dim-background-color);\n z-index: var(--_5ozg8c1);\n opacity: 0;\n}\n._5ozg8c4 ._5ozg8cd, ._5ozg8c5 ._5ozg8cd {\n opacity: 1;\n}\n._5ozg8c6 ._5ozg8cd, ._5ozg8c7 ._5ozg8cd {\n opacity: 0;\n}\n._5ozg8ce {\n background-color: var(--stackflow-plugin-basic-ui-background-color);\n width: 100%;\n margin: 0 2.5rem;\n box-shadow: 0px 0.625rem 2.375rem rgba(0, 0, 0, 0.15), 0px .5625rem 2.875rem rgba(0, 0, 0, 0.12), 0px .3125rem .9375rem rgba(0, 0, 0, 0.1);\n border-radius: var(--stackflow-plugin-basic-ui-bottom-sheet-border-radius);\n will-change: transform, opacity;\n transform: scale(1.1);\n opacity: 0;\n}\n._5ozg8c4 ._5ozg8ce, ._5ozg8c5 ._5ozg8ce {\n transform: scale(1);\n opacity: 1;\n}\n._5ozg8c6 ._5ozg8ce, ._5ozg8c7 ._5ozg8ce {\n transform: scale(1.1);\n opacity: 0;\n}"],
|
|
5
|
+
"mappings": ";AAAA;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAEF;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAEF;AACE;AAAA;;;AC3CF;AACE;AAAA;AAEF;AACE;AAAA;AAEF;AACE;AAAA;AAEF;AACE;AAAA;AAEF;AACE;AAAA;AAEF;AACE;AAAA;AAEF;AACE;AAAA;AAEF;AACE;AAAA;AAEF;AACE;AAAA;AAEF;AACE;AAAA;AAEF;AACE;AAAA;AAEF;AACE;AAAA;AAEF;AACE;AAAA;AAEF;AACE;AAAA;AAEF;AACE;AACA;AAAA;AAEF;AACE;AAAA;AAEF;AACE;AAAA;AAEF;AACE;AACA;AACA;AACA;AAAA;;;ACxDF;AACE;AAAA;AAEF;AACE;AAAA;AAEF;AACE;AAAA;AAEF;AACE;AAAA;AAEF;AACE;AACA;AACA;AAAA;AAEF;AACE;AACA;AAAA;AAGM;AAAA;AAGN;AAAA;AAGM;AAAA;AAGN;AAAA;AAEF;AACE;AACA;AACA;AACA;AAAA;AAEF;AACE;AAAA;AAEF;AACE;AAAA;AAGQ;AAAA;AAGR;AAAA;AAEF;AACE;AACA;AAAA;AAGQ;AAAA;AAGR;AACA;AAAA;AAEF;AACE;AAAA;AAAA;AAAA;AACA;AAAA;AAEF;AACE;AAAA;AAEF;AACE;AACA;AAAA;AAEF;AACE;AACA;AAAA;AAEF;AACE;AACE;AAAA;AAAA;AAGJ;AACE;AACE;AAAA;AAAA;;;ACpFJ;AACE;AAAA;AAEF;AACE;AAAA;AAEF;AACE;AACA;AACA;AACA;AAAA;AAEF;AACE;AAAA;AAEF;AACE;AACA;AAAA;AAAA;AAAA;AAAA;AAEF;AACE;AACA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGQ;AAAA;AAGR;AACA;AAAA;AAEF;AACE;AAAA;AAEF;AACE;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGU;AAAA;AAGV;AAAA;AAEF;AACE;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAEF;AACE;AACA;AAAA;AAEF;AACE;AACA;AAAA;AAEF;AACE;AAAA;AAEF;AACE;AAAA;AAEF;AACE;AACA;AACA;AACA;AAAA;AAEF;AACE;AACA;AAAA;AAEF;AACE;AACA;AACA;AAAA;AAEF;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAEF;AACE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAEF;AACE;AAAA;AAEF;AACE;AACA;AACA;AACA;AACA;AACA;AAAA;AAEF;AACE;AAAA;AAEF;AACE;AACA;AACA;AAAA;AAEF;AACE;AACA;AAAA;AAEF;AACE;AAAA;AAEF;AACE;AAAA;;;AChIF;AACE;AAAA;AAEF;AACE;AAAA;AAEF;AACE;AACA;AACA;AAAA;AAEF;AAAA;AACE;AAAA;AAEF;AAAA;AACE;AAAA;AAEF;AACE;AACA;AACA;AACA;AACA;AACA;AAAA;AAEF;AAAA;AACE;AACA;AAAA;AAEF;AAAA;AACE;AACA;AAAA;;;AC/BF;AACE;AAAA;AAEF;AACE;AAAA;AAEF;AACE;AACA;AACA;AAAA;AAEF;AAAA;AACE;AAAA;AAEF;AAAA;AACE;AAAA;AAEF;AACE;AACA;AACA;AACA;AAAA;AAAA;AAAA;AACA;AACA;AACA;AACA;AAAA;AAEF;AAAA;AACE;AACA;AAAA;AAEF;AAAA;AACE;AACA;AAAA;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/index.js
CHANGED
|
@@ -107,7 +107,7 @@ var import_react = require("react");
|
|
|
107
107
|
|
|
108
108
|
// src/basicUIPlugin.css.ts
|
|
109
109
|
var import_createRuntimeFn = require("@vanilla-extract/recipes/createRuntimeFn");
|
|
110
|
-
var globalVars = { backgroundColor: "var(--stackflow-plugin-basic-ui-background-color)", dimBackgroundColor: "var(--stackflow-plugin-basic-ui-dim-background-color)", transitionDuration: "var(--stackflow-plugin-basic-ui-transition-duration)", computedTransitionDuration: "var(--stackflow-plugin-basic-ui-computed-transition-duration)", appBar: { borderColor: "var(--stackflow-plugin-basic-ui-app-bar-border-color)", borderColorTransitionDuration: "var(--stackflow-plugin-basic-ui-app-bar-border-color-transition-duration)", borderSize: "var(--stackflow-plugin-basic-ui-app-bar-border-size)", height: "var(--stackflow-plugin-basic-ui-app-bar-height)", heightTransitionDuration: "var(--stackflow-plugin-basic-ui-app-bar-height-transition-duration)", minHeight: "var(--stackflow-plugin-basic-ui-app-bar-min-height)", iconColor: "var(--stackflow-plugin-basic-ui-app-bar-icon-color)", iconColorTransitionDuration: "var(--stackflow-plugin-basic-ui-app-bar-icon-color-transition-duration)", textColor: "var(--stackflow-plugin-basic-ui-app-bar-text-color)", textColorTransitionDuration: "var(--stackflow-plugin-basic-ui-app-bar-text-color-transition-duration)", backgroundColor: "var(--stackflow-plugin-basic-ui-app-bar-background-color)", backgroundColorTransitionDuration: "var(--stackflow-plugin-basic-ui-app-bar-background-color-transition-duration)", overflow: "var(--stackflow-plugin-basic-ui-app-bar-overflow)" }, bottomSheet: { borderRadius: "var(--stackflow-plugin-basic-ui-bottom-sheet-border-radius)" }, modal: { borderRadius: "var(--stackflow-plugin-basic-ui-bottom-sheet-border-radius)" } };
|
|
110
|
+
var globalVars = { backgroundColor: "var(--stackflow-plugin-basic-ui-background-color)", dimBackgroundColor: "var(--stackflow-plugin-basic-ui-dim-background-color)", transitionDuration: "var(--stackflow-plugin-basic-ui-transition-duration)", computedTransitionDuration: "var(--stackflow-plugin-basic-ui-computed-transition-duration)", appBar: { borderColor: "var(--stackflow-plugin-basic-ui-app-bar-border-color)", borderColorTransitionDuration: "var(--stackflow-plugin-basic-ui-app-bar-border-color-transition-duration)", borderSize: "var(--stackflow-plugin-basic-ui-app-bar-border-size)", height: "var(--stackflow-plugin-basic-ui-app-bar-height)", heightTransitionDuration: "var(--stackflow-plugin-basic-ui-app-bar-height-transition-duration)", minHeight: "var(--stackflow-plugin-basic-ui-app-bar-min-height)", iconColor: "var(--stackflow-plugin-basic-ui-app-bar-icon-color)", iconColorTransitionDuration: "var(--stackflow-plugin-basic-ui-app-bar-icon-color-transition-duration)", textColor: "var(--stackflow-plugin-basic-ui-app-bar-text-color)", textColorTransitionDuration: "var(--stackflow-plugin-basic-ui-app-bar-text-color-transition-duration)", backgroundColor: "var(--stackflow-plugin-basic-ui-app-bar-background-color)", backgroundColorTransitionDuration: "var(--stackflow-plugin-basic-ui-app-bar-background-color-transition-duration)", overflow: "var(--stackflow-plugin-basic-ui-app-bar-overflow)", forceSafeAreaInsetTop: "var(--stackflow-plugin-basic-ui-force-safe-area-inset-top)" }, bottomSheet: { borderRadius: "var(--stackflow-plugin-basic-ui-bottom-sheet-border-radius)" }, modal: { borderRadius: "var(--stackflow-plugin-basic-ui-bottom-sheet-border-radius)" } };
|
|
111
111
|
var stackWrapper = (0, import_createRuntimeFn.createRuntimeFn)({ defaultClassName: "_1q6dj2j2", variantClassNames: { theme: { android: "_1q6dj2j0", cupertino: "_1q6dj2j1" }, loading: { true: "_1q6dj2j5" } }, defaultVariants: {}, compoundVariants: [] });
|
|
112
112
|
|
|
113
113
|
// src/utils/compact.ts
|
|
@@ -170,7 +170,7 @@ function useGlobalOptions() {
|
|
|
170
170
|
var basicUIPlugin = (options) => () => ({
|
|
171
171
|
key: "basic-ui",
|
|
172
172
|
wrapStack({ stack, initialContext }) {
|
|
173
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _i;
|
|
173
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
|
|
174
174
|
const _options = typeof options === "function" ? options({ initialContext }) : options;
|
|
175
175
|
return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
|
|
176
176
|
GlobalOptionsProvider,
|
|
@@ -199,8 +199,9 @@ var basicUIPlugin = (options) => () => ({
|
|
|
199
199
|
[globalVars.appBar.height]: (_e = _options.appBar) == null ? void 0 : _e.height,
|
|
200
200
|
[globalVars.appBar.iconColor]: (_f = _options.appBar) == null ? void 0 : _f.iconColor,
|
|
201
201
|
[globalVars.appBar.textColor]: (_g = _options.appBar) == null ? void 0 : _g.textColor,
|
|
202
|
-
[globalVars.
|
|
203
|
-
[globalVars.
|
|
202
|
+
[globalVars.appBar.forceSafeAreaInsetTop]: (_h = _options.appBar) == null ? void 0 : _h.forceSafeAreaInsetTop,
|
|
203
|
+
[globalVars.bottomSheet.borderRadius]: (_i = _options.bottomSheet) == null ? void 0 : _i.borderRadius,
|
|
204
|
+
[globalVars.modal.borderRadius]: (_j = _options.modal) == null ? void 0 : _j.borderRadius
|
|
204
205
|
})
|
|
205
206
|
),
|
|
206
207
|
children: stack.render()
|