@stackflow/plugin-basic-ui 1.3.4-alpha.0 → 1.3.4-alpha.5
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/components/AppBar.css.d.ts +2 -17
- package/dist/components/AppBar.d.ts +0 -1
- package/dist/components/AppScreen.css.d.ts +2 -11
- package/dist/components/AppScreen.d.ts +1 -2
- package/dist/hooks/useStyleEffectOffset.d.ts +1 -2
- package/dist/index.css +20 -34
- package/dist/index.css.map +3 -3
- package/dist/index.js +35 -75
- package/dist/index.js.map +2 -2
- package/dist/index.mjs +35 -75
- package/dist/index.mjs.map +2 -2
- package/package.json +5 -5
- package/src/components/AppBar.css.ts +2 -19
- package/src/components/AppBar.tsx +4 -5
- package/src/components/AppScreen.css.ts +2 -11
- package/src/components/AppScreen.tsx +24 -64
- package/src/hooks/useMaxWidth.ts +1 -1
- package/src/hooks/useStyleEffectOffset.ts +4 -23
|
@@ -4,8 +4,8 @@ export declare const appBar: import("@vanilla-extract/recipes/dist/declarations/
|
|
|
4
4
|
boxShadow: `inset 0px calc(-1 * var(--${string})) 0 var(--${string})` | `inset 0px calc(-1 * var(--${string})) 0 var(--${string}, ${string})` | `inset 0px calc(-1 * var(--${string})) 0 var(--${string}, ${number})` | `inset 0px calc(-1 * var(--${string}, ${string})) 0 var(--${string})` | `inset 0px calc(-1 * var(--${string}, ${string})) 0 var(--${string}, ${string})` | `inset 0px calc(-1 * var(--${string}, ${string})) 0 var(--${string}, ${number})` | `inset 0px calc(-1 * var(--${string}, ${number})) 0 var(--${string})` | `inset 0px calc(-1 * var(--${string}, ${number})) 0 var(--${string}, ${string})` | `inset 0px calc(-1 * var(--${string}, ${number})) 0 var(--${string}, ${number})`;
|
|
5
5
|
};
|
|
6
6
|
};
|
|
7
|
-
|
|
8
|
-
|
|
7
|
+
presentModalFullScreen: {
|
|
8
|
+
true: {
|
|
9
9
|
selectors: {
|
|
10
10
|
[x: string]: {
|
|
11
11
|
transform: "translate3d(0, 100vh, 0)";
|
|
@@ -17,21 +17,6 @@ export declare const appBar: import("@vanilla-extract/recipes/dist/declarations/
|
|
|
17
17
|
};
|
|
18
18
|
};
|
|
19
19
|
};
|
|
20
|
-
activityEnterStyle: {
|
|
21
|
-
slideInLeft: {
|
|
22
|
-
selectors: {
|
|
23
|
-
[x: string]: {
|
|
24
|
-
opacity: number;
|
|
25
|
-
transform: "translate3d(0, 0, 0)";
|
|
26
|
-
transition?: undefined;
|
|
27
|
-
} | {
|
|
28
|
-
transform: "translate3d(100%, 0, 0)";
|
|
29
|
-
transition: string;
|
|
30
|
-
opacity?: undefined;
|
|
31
|
-
};
|
|
32
|
-
};
|
|
33
|
-
};
|
|
34
|
-
};
|
|
35
20
|
}>;
|
|
36
21
|
export declare const safeArea: string;
|
|
37
22
|
export declare const container: string;
|
|
@@ -35,7 +35,6 @@ declare const AppBar: import("react").ForwardRefExoticComponent<Partial<Pick<{
|
|
|
35
35
|
closeButtonLocation?: "left" | "right" | undefined;
|
|
36
36
|
border?: boolean | undefined;
|
|
37
37
|
modalPresentationStyle?: "fullScreen" | undefined;
|
|
38
|
-
activityEnterStyle?: "slideInLeft" | undefined;
|
|
39
38
|
onTopClick?: ((e: React.MouseEvent) => void) | undefined;
|
|
40
39
|
} & import("react").RefAttributes<HTMLDivElement>>;
|
|
41
40
|
export default AppBar;
|
|
@@ -42,8 +42,8 @@ export declare const paper: import("@vanilla-extract/recipes/dist/declarations/s
|
|
|
42
42
|
};
|
|
43
43
|
})[];
|
|
44
44
|
};
|
|
45
|
-
|
|
46
|
-
|
|
45
|
+
presentModalFullScreen: {
|
|
46
|
+
true: {
|
|
47
47
|
selectors: {
|
|
48
48
|
[x: string]: {
|
|
49
49
|
transform: "translate3d(0, 100%, 0)";
|
|
@@ -51,15 +51,6 @@ export declare const paper: import("@vanilla-extract/recipes/dist/declarations/s
|
|
|
51
51
|
};
|
|
52
52
|
};
|
|
53
53
|
};
|
|
54
|
-
activityEnterStyle: {
|
|
55
|
-
slideInLeft: {
|
|
56
|
-
selectors: {
|
|
57
|
-
[x: string]: {
|
|
58
|
-
transform: "translate3d(50%, 0, 0)";
|
|
59
|
-
};
|
|
60
|
-
};
|
|
61
|
-
};
|
|
62
|
-
};
|
|
63
54
|
}>;
|
|
64
55
|
export declare const edge: import("@vanilla-extract/recipes/dist/declarations/src/types").RuntimeFn<{
|
|
65
56
|
hasAppBar: {
|
|
@@ -11,8 +11,7 @@ export declare function useAppScreen(): AppScreenContext;
|
|
|
11
11
|
export declare type AppScreenProps = Partial<Pick<GlobalVars, "backgroundColor" | "dimBackgroundColor">> & {
|
|
12
12
|
appBar?: Omit<PropOf<typeof AppBar>, "theme" | "modalPresentationStyle" | "ref" | "key">;
|
|
13
13
|
preventSwipeBack?: boolean;
|
|
14
|
-
|
|
15
|
-
ANDROID_ONLY_activityEnterStyle?: "slideInLeft";
|
|
14
|
+
modalPresentationStyle?: "fullScreen";
|
|
16
15
|
children: React.ReactNode;
|
|
17
16
|
};
|
|
18
17
|
declare const AppScreen: React.FC<AppScreenProps>;
|
|
@@ -1,9 +1,8 @@
|
|
|
1
1
|
/// <reference types="react" />
|
|
2
2
|
export declare const OFFSET_PX_ANDROID = 32;
|
|
3
3
|
export declare const OFFSET_PX_CUPERTINO = 80;
|
|
4
|
-
export declare function useStyleEffectOffset({ refs, theme,
|
|
4
|
+
export declare function useStyleEffectOffset({ refs, theme, hasEffect, }: {
|
|
5
5
|
refs: Array<React.RefObject<any>>;
|
|
6
6
|
theme: "android" | "cupertino";
|
|
7
|
-
activityEnterStyle?: "slideInLeft";
|
|
8
7
|
hasEffect?: boolean;
|
|
9
8
|
}): void;
|
package/dist/index.css
CHANGED
|
@@ -105,7 +105,7 @@
|
|
|
105
105
|
background: none;
|
|
106
106
|
}
|
|
107
107
|
|
|
108
|
-
/* 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=#H4sIAAAAAAAAE9WU0bKaMBCG732K3HRGpsQJenpOizd9k05IIgZDQkPQ03bOuzcEUAIK6vSmjhfisl/+f3ezqx8RFbuXzcsr+LMAIMHkkGpVSQqJEkrH4Ij1EsLS2MBOqBMsRJVyCRNccgIrDinP4TAr2C4+FquO/PYkeZr61VGNxrLkhisZN793SuctuXsTBSFQBSbc/BpFPCS5IGtMSxTYsA1dRgh9CgGyXz+Ju6SWHwO0tU+/IZeUvceD46KgDp64EJDssUxZ3OW1xJ+vNFtnCAzge8bTvYlBhDTLt14tYyC4ZFjDVGPKmTTLp/oVAp0meIkag7VHZ9Ie1XzOgr71tIXjMO6Fu6hXnug6NpnGkjks8lqSNcEj064CNl4SrYSoSwdPLDlwA8/RJsRlatutKrKf6N963L/zsPgC4rg7p8EnWDtNlJeFwFaQVJJ5TY/AQP59Y3iulavWCNVrVxbOvNvrXXZ5dUIK8q/DaHizKzfjNsoN95Qt9IAtdI+t/lDea7IBHf7J7glBgSm1kweNKma3IS4K+6Bhswzg5XBIK43rH246e8j5Deszg1sDKWamoJ1Jv0a5Szpxava2wqv1l3Z33bhbGz9bNkc+ZeKyMAkWxN0YAB/FODnfy6oolDYlWHp1JUpakF22Jd4xiDXD1lTJTB0NAid9MCuDxjhhDyoCn0GO3+/Oyu2f1+SFM+pdAT8mzDN5/D993xTeWf4LpNp3kwwJAAA= */
|
|
109
109
|
._1dlf4346 {
|
|
110
110
|
background-color: var(--stackflow-plugin-basic-ui-dim-background-color);
|
|
111
111
|
}
|
|
@@ -170,14 +170,11 @@
|
|
|
170
170
|
._1q6dj2j1 ._1dlf434l {
|
|
171
171
|
transform: translate3d(0, 100%, 0);
|
|
172
172
|
}
|
|
173
|
-
.
|
|
174
|
-
transform: translate3d(50%, 0, 0);
|
|
175
|
-
}
|
|
176
|
-
._1dlf434n {
|
|
173
|
+
._1dlf434m {
|
|
177
174
|
width: 1.25rem;
|
|
178
175
|
z-index: var(--_1dlf4343);
|
|
179
176
|
}
|
|
180
|
-
.
|
|
177
|
+
._1dlf434n {
|
|
181
178
|
top: var(--stackflow-plugin-basic-ui-app-bar-height);
|
|
182
179
|
height: calc(100% - var(--stackflow-plugin-basic-ui-app-bar-height));
|
|
183
180
|
}
|
|
@@ -192,7 +189,7 @@
|
|
|
192
189
|
}
|
|
193
190
|
}
|
|
194
191
|
|
|
195
|
-
/* 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+1YS2/bMAy+91foMiAZIkPOo+2c2w677bQfUMi2nKhRJM9SXh323yfJL9mOnaQIdiga5GBLJEV+/Egx8V7802aG5wsE/jwAsKUcrgldrVUA9jgbQSgVjjYJEweYst1Kb4dY0gjuKMRpql8yWOuMlw9/H7zSom8tij3JjPr19kqNprWptRZq5VUmdjyGkWAiu95qW1NbB+ANUh6TY2nlxY9ZMp/N53bzQBmD0RrzFQmAyjCXici2EyBSHFF1MiJ2lSoqeNBx7d2ewdoqjHcZNg/jCQjFEco1jsXhessii0k2YLVA+Pdj/Dp99UEL7FSUseFQCrZTpCufAxa2VSu4CuQYVmQWj3yEvkwA0t/xR4BvUscJkGyAg9qIFKwJAFr246OR8VFGth8RoGaJoXFVSJ0dA6QOvvw0Mc2FvjnwTi7IYke2Fm3kxB/OSUFYpxvN8m5UQRYAyiVRAKVHEGEWjaAPvt6Ko6RvZDwG6F3499byfKggLeHQfv1JOIdEDo38s5SbTy5KO6Sbu8LDuXCJNtRkP3N6VU4rvBYWr3Kw2eLj6JbhRuKEQJwRDG2RQyVSfXAkuFbnanRu2wJ/3/MI3/cd5UT62Ij02lOr8a3Jlnz5RitDg0bu41M+XeA4pnylL0SAvIW+9JoyAdmmOq1GMqYyZVi3aS44aUg92/0bJ0GqM+fMgG7AJZlmCG3lBNxWIrXdHgjMSBmrdQCm3jQPuM7U1HvqYPAc4EjRPWnND960z210f58dd0LrRxFCs9wWNrob86DIUfXk4X7EuxWQ2qnLA7Mz4zWwMVOuieh1JxVNTtocV4TrJCeMHI0PmVrWBQAZSfSeXxAi0cJ2EtBLnv/8VBKFUU6qn2a+t6hkD8VaKFi8LIcS+mZLq+iteqlvOgh7J32n7ozfZgEzuuKQKrKVAYh0SCQ7G2e9ZeG0au6q9TvBW8q0cQM9I1CepDKD73cd6OYnjn7Z9x9ashPpI0JtpEqQLJSLHP5z1+MI6s1Gc35PixTp/7tE7njYpRukw+rIbdQFT5E363aq2Ao20K+pWvW64YToGGFRQKVCq/EPNJ/z5I6b10fIRLRp+J23VkvS+n8KwhhNJZUtjlG+JhntsrFad+wmfTecCTMzacuxwjslmooXrr1OinpOMg9a5R/4yDzf3hEAAA== */
|
|
196
193
|
._1yk3a450 {
|
|
197
194
|
min-height: var(--stackflow-plugin-basic-ui-app-bar-min-height);
|
|
198
195
|
}
|
|
@@ -252,47 +249,36 @@
|
|
|
252
249
|
transform var(--_1dlf4340),
|
|
253
250
|
opacity var(--_1dlf4340);
|
|
254
251
|
}
|
|
255
|
-
.
|
|
256
|
-
opacity: 1;
|
|
257
|
-
transform: translate3d(0, 0, 0);
|
|
258
|
-
}
|
|
259
|
-
._1q6dj2j0 ._1dlf434b ._1yk3a455 {
|
|
260
|
-
transform: translate3d(100%, 0, 0);
|
|
261
|
-
transition:
|
|
262
|
-
background-color var(--stackflow-plugin-basic-ui-app-bar-background-color-transition-duration),
|
|
263
|
-
box-shadow var(--stackflow-plugin-basic-ui-app-bar-border-color-transition-duration),
|
|
264
|
-
transform 0s;
|
|
265
|
-
}
|
|
266
|
-
._1yk3a456 {
|
|
252
|
+
._1yk3a455 {
|
|
267
253
|
height: max(var(--stackflow-plugin-basic-ui-app-bar-min-safe-area-inset-top), constant(safe-area-inset-top));
|
|
268
254
|
height: max(var(--stackflow-plugin-basic-ui-app-bar-min-safe-area-inset-top), env(safe-area-inset-top));
|
|
269
255
|
}
|
|
270
|
-
.
|
|
256
|
+
._1yk3a456 {
|
|
271
257
|
height: var(--stackflow-plugin-basic-ui-app-bar-height);
|
|
272
258
|
transition: height var(--stackflow-plugin-basic-ui-app-bar-height-transition-duration);
|
|
273
259
|
}
|
|
274
|
-
.
|
|
260
|
+
._1yk3a457 {
|
|
275
261
|
padding: 0 0.5rem;
|
|
276
262
|
}
|
|
277
|
-
.
|
|
263
|
+
._1yk3a457:empty {
|
|
278
264
|
display: none;
|
|
279
265
|
}
|
|
280
|
-
.
|
|
266
|
+
._1yk3a458 {
|
|
281
267
|
color: var(--stackflow-plugin-basic-ui-app-bar-icon-color);
|
|
282
268
|
transition: opacity 300ms, color var(--stackflow-plugin-basic-ui-app-bar-icon-color-transition-duration);
|
|
283
269
|
width: 2.25rem;
|
|
284
270
|
height: 2.75rem;
|
|
285
271
|
}
|
|
286
|
-
.
|
|
272
|
+
._1yk3a458:active {
|
|
287
273
|
opacity: 0.2;
|
|
288
274
|
transition: opacity 0s, color var(--stackflow-plugin-basic-ui-app-bar-icon-color-transition-duration);
|
|
289
275
|
}
|
|
290
|
-
.
|
|
276
|
+
._1yk3a45b {
|
|
291
277
|
width: var(--_1dlf4345);
|
|
292
278
|
color: var(--stackflow-plugin-basic-ui-app-bar-text-color);
|
|
293
279
|
transition: height var(--stackflow-plugin-basic-ui-app-bar-height-transition-duration), color var(--stackflow-plugin-basic-ui-app-bar-text-color-transition-duration);
|
|
294
280
|
}
|
|
295
|
-
._1q6dj2j0 .
|
|
281
|
+
._1q6dj2j0 ._1yk3a45b {
|
|
296
282
|
width: 100%;
|
|
297
283
|
justify-content: flex-start;
|
|
298
284
|
padding-left: 1rem;
|
|
@@ -301,7 +287,7 @@
|
|
|
301
287
|
font-weight: bold;
|
|
302
288
|
box-sizing: border-box;
|
|
303
289
|
}
|
|
304
|
-
._1q6dj2j1 .
|
|
290
|
+
._1q6dj2j1 ._1yk3a45b {
|
|
305
291
|
position: absolute;
|
|
306
292
|
display: flex;
|
|
307
293
|
align-items: center;
|
|
@@ -316,10 +302,10 @@
|
|
|
316
302
|
top: max(var(--stackflow-plugin-basic-ui-app-bar-min-safe-area-inset-top), constant(safe-area-inset-top));
|
|
317
303
|
top: max(var(--stackflow-plugin-basic-ui-app-bar-min-safe-area-inset-top), env(safe-area-inset-top));
|
|
318
304
|
}
|
|
319
|
-
._1q6dj2j0 .
|
|
305
|
+
._1q6dj2j0 ._1yk3a45c {
|
|
320
306
|
padding-left: 0.375rem;
|
|
321
307
|
}
|
|
322
|
-
.
|
|
308
|
+
._1yk3a45d {
|
|
323
309
|
left: 50%;
|
|
324
310
|
height: 1.25rem;
|
|
325
311
|
transform: translate(-50%);
|
|
@@ -327,22 +313,22 @@
|
|
|
327
313
|
display: none;
|
|
328
314
|
width: var(--_1dlf4345);
|
|
329
315
|
}
|
|
330
|
-
._1q6dj2j1 .
|
|
316
|
+
._1q6dj2j1 ._1yk3a45d {
|
|
331
317
|
display: block;
|
|
332
318
|
}
|
|
333
|
-
.
|
|
319
|
+
._1yk3a45e {
|
|
334
320
|
text-overflow: ellipsis;
|
|
335
321
|
font-size: inherit;
|
|
336
322
|
font-weight: inherit;
|
|
337
323
|
}
|
|
338
|
-
.
|
|
324
|
+
._1yk3a45f {
|
|
339
325
|
padding: 0 0.5rem;
|
|
340
326
|
margin-left: auto;
|
|
341
327
|
}
|
|
342
|
-
.
|
|
328
|
+
._1yk3a45f:empty {
|
|
343
329
|
display: none;
|
|
344
330
|
}
|
|
345
|
-
._1q6dj2j0 .
|
|
331
|
+
._1q6dj2j0 ._1yk3a45f {
|
|
346
332
|
padding: 0 0.5rem 0 0;
|
|
347
333
|
}
|
|
348
334
|
|
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+2U30rDMBTG7/cUAW8UTGmrdVAfRtLktD1bmxPzZw7FdzcbG95s1LaCCKW9SML55XyQ73zJS/b6pDb5JmUfK8Y4d17Ibd3RGzddaFDzSjiUPGBcyG1jKWjFJXVkS3ZT1/XzAKWwv0DaphK36T07/UlW3A1d5K3QDj2S5ipYcViULHVDmKTeBA9qKi+MiRvLK7IK7DX96XpQ/6WLfkmUw3coWWb2P+VawKb1JXtICgv9OGqu5j4eTuuPMrY8Wy/P4vc4Hp0r38PeTxTxjc5+90mjeI2eq4Z2YA8FJWtRKdBjnOBEDVxYEBy1g2guMrH1sJMr8p567lqI0GkMrFAYXByEo6c+V8k527Il2/55tqVJMT7d8mT9t/E2UsCSb0u+Tcq34phvhlD7WAY70D6WadIQy74Agy2ZNuIJAAA=", "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=#
|
|
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-app-bar-min-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-app-bar-min-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._1q6dj2j0 ._1dlf434m {\n transform: translate3d(50%, 0, 0);\n}\n._1dlf434n {\n width: 1.25rem;\n z-index: var(--_1dlf4343);\n}\n._1dlf434o {\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-app-bar-min-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-app-bar-min-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._1q6dj2j0 ._1yk3a455 {\n opacity: 1;\n transform: translate3d(0, 0, 0);\n}\n._1q6dj2j0 ._1dlf434b ._1yk3a455 {\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._1yk3a456 {\n height: max(var(--stackflow-plugin-basic-ui-app-bar-min-safe-area-inset-top), constant(safe-area-inset-top));\n height: max(var(--stackflow-plugin-basic-ui-app-bar-min-safe-area-inset-top), env(safe-area-inset-top));\n}\n._1yk3a457 {\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._1yk3a458 {\n padding: 0 0.5rem;\n}\n._1yk3a458:empty {\n display: none;\n}\n._1yk3a459 {\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._1yk3a459:active {\n opacity: 0.2;\n transition: opacity 0s, color var(--stackflow-plugin-basic-ui-app-bar-icon-color-transition-duration);\n}\n._1yk3a45c {\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 ._1yk3a45c {\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 ._1yk3a45c {\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-app-bar-min-safe-area-inset-top), constant(safe-area-inset-top));\n top: max(var(--stackflow-plugin-basic-ui-app-bar-min-safe-area-inset-top), env(safe-area-inset-top));\n}\n._1q6dj2j0 ._1yk3a45d {\n padding-left: 0.375rem;\n}\n._1yk3a45e {\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 ._1yk3a45e {\n display: block;\n}\n._1yk3a45f {\n text-overflow: ellipsis;\n font-size: inherit;\n font-weight: inherit;\n}\n._1yk3a45g {\n padding: 0 0.5rem;\n margin-left: auto;\n}\n._1yk3a45g:empty {\n display: none;\n}\n._1q6dj2j0 ._1yk3a45g {\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;
|
|
3
|
+
"sources": ["vanilla-extract-css-ns:src/basicUIPlugin.css.ts.vanilla.css?source=#H4sIAAAAAAAAE+2U30rDMBTG7/cUAW8UTGmrdVAfRtLktD1bmxPzZw7FdzcbG95s1LaCCKW9SML55XyQ73zJS/b6pDb5JmUfK8Y4d17Ibd3RGzddaFDzSjiUPGBcyG1jKWjFJXVkS3ZT1/XzAKWwv0DaphK36T07/UlW3A1d5K3QDj2S5ipYcViULHVDmKTeBA9qKi+MiRvLK7IK7DX96XpQ/6WLfkmUw3coWWb2P+VawKb1JXtICgv9OGqu5j4eTuuPMrY8Wy/P4vc4Hp0r38PeTxTxjc5+90mjeI2eq4Z2YA8FJWtRKdBjnOBEDVxYEBy1g2guMrH1sJMr8p567lqI0GkMrFAYXByEo6c+V8k527Il2/55tqVJMT7d8mT9t/E2UsCSb0u+Tcq34phvhlD7WAY70D6WadIQy74Agy2ZNuIJAAA=", "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=#H4sIAAAAAAAAE9WU0bKaMBCG732K3HRGpsQJenpOizd9k05IIgZDQkPQ03bOuzcEUAIK6vSmjhfisl/+f3ezqx8RFbuXzcsr+LMAIMHkkGpVSQqJEkrH4Ij1EsLS2MBOqBMsRJVyCRNccgIrDinP4TAr2C4+FquO/PYkeZr61VGNxrLkhisZN793SuctuXsTBSFQBSbc/BpFPCS5IGtMSxTYsA1dRgh9CgGyXz+Ju6SWHwO0tU+/IZeUvceD46KgDp64EJDssUxZ3OW1xJ+vNFtnCAzge8bTvYlBhDTLt14tYyC4ZFjDVGPKmTTLp/oVAp0meIkag7VHZ9Ie1XzOgr71tIXjMO6Fu6hXnug6NpnGkjks8lqSNcEj064CNl4SrYSoSwdPLDlwA8/RJsRlatutKrKf6N963L/zsPgC4rg7p8EnWDtNlJeFwFaQVJJ5TY/AQP59Y3iulavWCNVrVxbOvNvrXXZ5dUIK8q/DaHizKzfjNsoN95Qt9IAtdI+t/lDea7IBHf7J7glBgSm1kweNKma3IS4K+6Bhswzg5XBIK43rH246e8j5Deszg1sDKWamoJ1Jv0a5Szpxava2wqv1l3Z33bhbGz9bNkc+ZeKyMAkWxN0YAB/FODnfy6oolDYlWHp1JUpakF22Jd4xiDXD1lTJTB0NAid9MCuDxjhhDyoCn0GO3+/Oyu2f1+SFM+pdAT8mzDN5/D993xTeWf4LpNp3kwwJAAA=", "vanilla-extract-css-ns:src/components/AppBar.css.ts.vanilla.css?source=#H4sIAAAAAAAAE+1YS2/bMAy+91foMiAZIkPOo+2c2w677bQfUMi2nKhRJM9SXh323yfJL9mOnaQIdiga5GBLJEV+/Egx8V7802aG5wsE/jwAsKUcrgldrVUA9jgbQSgVjjYJEweYst1Kb4dY0gjuKMRpql8yWOuMlw9/H7zSom8tij3JjPr19kqNprWptRZq5VUmdjyGkWAiu95qW1NbB+ANUh6TY2nlxY9ZMp/N53bzQBmD0RrzFQmAyjCXici2EyBSHFF1MiJ2lSoqeNBx7d2ewdoqjHcZNg/jCQjFEco1jsXhessii0k2YLVA+Pdj/Dp99UEL7FSUseFQCrZTpCufAxa2VSu4CuQYVmQWj3yEvkwA0t/xR4BvUscJkGyAg9qIFKwJAFr246OR8VFGth8RoGaJoXFVSJ0dA6QOvvw0Mc2FvjnwTi7IYke2Fm3kxB/OSUFYpxvN8m5UQRYAyiVRAKVHEGEWjaAPvt6Ko6RvZDwG6F3499byfKggLeHQfv1JOIdEDo38s5SbTy5KO6Sbu8LDuXCJNtRkP3N6VU4rvBYWr3Kw2eLj6JbhRuKEQJwRDG2RQyVSfXAkuFbnanRu2wJ/3/MI3/cd5UT62Ij02lOr8a3Jlnz5RitDg0bu41M+XeA4pnylL0SAvIW+9JoyAdmmOq1GMqYyZVi3aS44aUg92/0bJ0GqM+fMgG7AJZlmCG3lBNxWIrXdHgjMSBmrdQCm3jQPuM7U1HvqYPAc4EjRPWnND960z210f58dd0LrRxFCs9wWNrob86DIUfXk4X7EuxWQ2qnLA7Mz4zWwMVOuieh1JxVNTtocV4TrJCeMHI0PmVrWBQAZSfSeXxAi0cJ2EtBLnv/8VBKFUU6qn2a+t6hkD8VaKFi8LIcS+mZLq+iteqlvOgh7J32n7ozfZgEzuuKQKrKVAYh0SCQ7G2e9ZeG0au6q9TvBW8q0cQM9I1CepDKD73cd6OYnjn7Z9x9ashPpI0JtpEqQLJSLHP5z1+MI6s1Gc35PixTp/7tE7njYpRukw+rIbdQFT5E363aq2Ao20K+pWvW64YToGGFRQKVCq/EPNJ/z5I6b10fIRLRp+J23VkvS+n8KwhhNJZUtjlG+JhntsrFad+wmfTecCTMzacuxwjslmooXrr1OinpOMg9a5R/4yDzf3hEAAA==", "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-app-bar-min-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-app-bar-min-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-app-bar-min-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-app-bar-min-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-app-bar-min-safe-area-inset-top), constant(safe-area-inset-top));\n height: max(var(--stackflow-plugin-basic-ui-app-bar-min-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-app-bar-min-safe-area-inset-top), constant(safe-area-inset-top));\n top: max(var(--stackflow-plugin-basic-ui-app-bar-min-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
|
@@ -252,7 +252,7 @@ function useMaxWidth({
|
|
|
252
252
|
setMaxWidth(screenWidth - 2 * sideMargin);
|
|
253
253
|
});
|
|
254
254
|
return dispose;
|
|
255
|
-
}
|
|
255
|
+
});
|
|
256
256
|
return {
|
|
257
257
|
maxWidth
|
|
258
258
|
};
|
|
@@ -365,28 +365,13 @@ var OFFSET_PX_CUPERTINO = 80;
|
|
|
365
365
|
function useStyleEffectOffset({
|
|
366
366
|
refs,
|
|
367
367
|
theme,
|
|
368
|
-
activityEnterStyle,
|
|
369
368
|
hasEffect
|
|
370
369
|
}) {
|
|
371
370
|
useStyleEffect({
|
|
372
371
|
styleName: "offset",
|
|
373
372
|
refs,
|
|
374
373
|
effect: hasEffect ? ({ activityTransitionState, refs: refs2 }) => {
|
|
375
|
-
|
|
376
|
-
let opacity;
|
|
377
|
-
switch (theme) {
|
|
378
|
-
case "cupertino": {
|
|
379
|
-
transform = `translate3d(-${OFFSET_PX_CUPERTINO / 16}rem, 0, 0)`;
|
|
380
|
-
opacity = "1";
|
|
381
|
-
break;
|
|
382
|
-
}
|
|
383
|
-
case "android":
|
|
384
|
-
default: {
|
|
385
|
-
transform = activityEnterStyle === "slideInLeft" ? `translate3d(-50%, 0, 0)` : `translate3d(0, -${OFFSET_PX_ANDROID / 16}rem, 0)`;
|
|
386
|
-
opacity = activityEnterStyle === "slideInLeft" ? "0" : "1";
|
|
387
|
-
break;
|
|
388
|
-
}
|
|
389
|
-
}
|
|
374
|
+
const transform = theme === "cupertino" ? `translate3d(-${OFFSET_PX_CUPERTINO / 16}rem, 0, 0)` : `translate3d(0, -${OFFSET_PX_ANDROID / 16}rem, 0)`;
|
|
390
375
|
const cleanup = () => {
|
|
391
376
|
requestNextFrame(() => {
|
|
392
377
|
refs2.forEach((ref) => {
|
|
@@ -395,7 +380,6 @@ function useStyleEffectOffset({
|
|
|
395
380
|
}
|
|
396
381
|
const $el = ref.current;
|
|
397
382
|
$el.style.transform = "";
|
|
398
|
-
$el.style.opacity = "";
|
|
399
383
|
listenOnce($el, "transitionend", () => {
|
|
400
384
|
$el.style.transition = "";
|
|
401
385
|
});
|
|
@@ -411,7 +395,6 @@ function useStyleEffectOffset({
|
|
|
411
395
|
}
|
|
412
396
|
ref.current.style.transition = globalVars.computedTransitionDuration;
|
|
413
397
|
ref.current.style.transform = transform;
|
|
414
|
-
ref.current.style.opacity = opacity;
|
|
415
398
|
});
|
|
416
399
|
switch (activityTransitionState) {
|
|
417
400
|
case "enter-done":
|
|
@@ -442,10 +425,10 @@ function useStyleEffectOffset({
|
|
|
442
425
|
var import_createRuntimeFn2 = require("@vanilla-extract/recipes/createRuntimeFn");
|
|
443
426
|
var appScreen = (0, import_createRuntimeFn2.createRuntimeFn)({ defaultClassName: "dhthxq4 dhthxq0 dhthxq1 dhthxq2 dhthxq3 dhthxqc", variantClassNames: { transitionState: { "enter-active": "_1dlf4349", "enter-done": "_1dlf434a", "exit-active": "_1dlf434b", "exit-done": "_1dlf434c" } }, defaultVariants: {}, compoundVariants: [] });
|
|
444
427
|
var dim = "_1dlf434i dhthxq4 dhthxq0 dhthxq1 dhthxq2 dhthxq3 _1dlf4346 _1dlf4348";
|
|
445
|
-
var edge = (0, import_createRuntimeFn2.createRuntimeFn)({ defaultClassName: "
|
|
428
|
+
var edge = (0, import_createRuntimeFn2.createRuntimeFn)({ defaultClassName: "_1dlf434m dhthxq4 dhthxq2 dhthxq3 dhthxq1", variantClassNames: { hasAppBar: { true: "_1dlf434n" } }, defaultVariants: {}, compoundVariants: [] });
|
|
446
429
|
var exitActive = "_1dlf434b";
|
|
447
430
|
var exitDone = "_1dlf434c";
|
|
448
|
-
var paper = (0, import_createRuntimeFn2.createRuntimeFn)({ defaultClassName: "_1dlf434j dhthxq4 dhthxq0 dhthxq1 dhthxq2 dhthxq3 _1dlf4347 _1dlf4348", variantClassNames: { hasAppBar: { true: "_1dlf434k dhthxqg" },
|
|
431
|
+
var paper = (0, import_createRuntimeFn2.createRuntimeFn)({ defaultClassName: "_1dlf434j dhthxq4 dhthxq0 dhthxq1 dhthxq2 dhthxq3 _1dlf4347 _1dlf4348", variantClassNames: { hasAppBar: { true: "_1dlf434k dhthxqg" }, presentModalFullScreen: { true: "_1dlf434l" } }, defaultVariants: {}, compoundVariants: [] });
|
|
449
432
|
var vars = { transitionDuration: "var(--_1dlf4340)", zIndexes: { dim: "var(--_1dlf4341)", paper: "var(--_1dlf4342)", edge: "var(--_1dlf4343)", appBar: "var(--_1dlf4344)" }, appBar: { center: { mainWidth: "var(--_1dlf4345)" } } };
|
|
450
433
|
|
|
451
434
|
// src/hooks/useStyleEffectSwipeBack.ts
|
|
@@ -628,17 +611,17 @@ var import_react7 = require("react");
|
|
|
628
611
|
|
|
629
612
|
// src/components/AppBar.css.ts
|
|
630
613
|
var import_createRuntimeFn3 = require("@vanilla-extract/recipes/createRuntimeFn");
|
|
631
|
-
var appBar = (0, import_createRuntimeFn3.createRuntimeFn)({ defaultClassName: "_1yk3a452 dhthxq4 dhthxq0 dhthxqh _1dlf4347 _1yk3a451", variantClassNames: { border: { true: "_1yk3a453" },
|
|
632
|
-
var backButton = "
|
|
614
|
+
var appBar = (0, import_createRuntimeFn3.createRuntimeFn)({ defaultClassName: "_1yk3a452 dhthxq4 dhthxq0 dhthxqh _1dlf4347 _1yk3a451", variantClassNames: { border: { true: "_1yk3a453" }, presentModalFullScreen: { true: "_1yk3a454" } }, defaultVariants: {}, compoundVariants: [] });
|
|
615
|
+
var backButton = "_1yk3a458 dhthxq9 dhthxq7 dhthxqb dhthxqf dhthxqi";
|
|
633
616
|
var center = "dhthxq9 dhthxq7 dhthxq8 _1yk3a450";
|
|
634
|
-
var centerMain = (0, import_createRuntimeFn3.createRuntimeFn)({ defaultClassName: "
|
|
635
|
-
var centerMainEdge = "
|
|
636
|
-
var centerText = "
|
|
637
|
-
var closeButton = "
|
|
638
|
-
var container = "
|
|
639
|
-
var left = "
|
|
640
|
-
var right = "
|
|
641
|
-
var safeArea = "
|
|
617
|
+
var centerMain = (0, import_createRuntimeFn3.createRuntimeFn)({ defaultClassName: "_1yk3a45b", variantClassNames: { hasLeft: { true: "_1yk3a45c" } }, defaultVariants: {}, compoundVariants: [] });
|
|
618
|
+
var centerMainEdge = "_1yk3a45d dhthxqi dhthxq4 dhthxq2 dhthxqf";
|
|
619
|
+
var centerText = "_1yk3a45e dhthxqc dhthxqd dhthxq0";
|
|
620
|
+
var closeButton = "_1yk3a458 dhthxq9 dhthxq7 dhthxqb dhthxqf dhthxqi";
|
|
621
|
+
var container = "_1yk3a456 dhthxqa dhthxq7 _1yk3a451";
|
|
622
|
+
var left = "_1yk3a457 dhthxq9 dhthxq7 dhthxq1 _1yk3a450";
|
|
623
|
+
var right = "_1yk3a45f dhthxq9 dhthxq7 dhthxq1 dhthxq5 _1yk3a450";
|
|
624
|
+
var safeArea = "_1yk3a455";
|
|
642
625
|
|
|
643
626
|
// src/components/AppBar.tsx
|
|
644
627
|
var import_jsx_runtime4 = require("react/jsx-runtime");
|
|
@@ -652,7 +635,6 @@ var AppBar = (0, import_react7.forwardRef)(
|
|
|
652
635
|
closeButtonLocation = "left",
|
|
653
636
|
border = true,
|
|
654
637
|
modalPresentationStyle,
|
|
655
|
-
activityEnterStyle,
|
|
656
638
|
iconColor,
|
|
657
639
|
iconColorTransitionDuration,
|
|
658
640
|
textColor,
|
|
@@ -679,6 +661,7 @@ var AppBar = (0, import_react7.forwardRef)(
|
|
|
679
661
|
innerRef: centerRef,
|
|
680
662
|
enable: globalOptions.theme === "cupertino"
|
|
681
663
|
});
|
|
664
|
+
const presentModalFullScreen = modalPresentationStyle === "fullScreen";
|
|
682
665
|
const onBackClick = (e) => {
|
|
683
666
|
if (backButton2 && "onClick" in backButton2 && backButton2.onClick) {
|
|
684
667
|
backButton2.onClick(e);
|
|
@@ -726,7 +709,7 @@ var AppBar = (0, import_react7.forwardRef)(
|
|
|
726
709
|
if (globalBackButton && "renderIcon" in globalBackButton && globalBackButton.renderIcon) {
|
|
727
710
|
return globalBackButton.renderIcon();
|
|
728
711
|
}
|
|
729
|
-
if (
|
|
712
|
+
if (presentModalFullScreen) {
|
|
730
713
|
return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(IconClose_default, {});
|
|
731
714
|
}
|
|
732
715
|
return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(IconBack_default, {});
|
|
@@ -782,8 +765,7 @@ var AppBar = (0, import_react7.forwardRef)(
|
|
|
782
765
|
ref,
|
|
783
766
|
className: appBar({
|
|
784
767
|
border,
|
|
785
|
-
|
|
786
|
-
activityEnterStyle
|
|
768
|
+
presentModalFullScreen
|
|
787
769
|
}),
|
|
788
770
|
style: (0, import_dynamic2.assignInlineVars)(
|
|
789
771
|
compactMap({
|
|
@@ -854,8 +836,7 @@ var AppScreen = ({
|
|
|
854
836
|
dimBackgroundColor,
|
|
855
837
|
appBar: appBar2,
|
|
856
838
|
preventSwipeBack,
|
|
857
|
-
|
|
858
|
-
ANDROID_ONLY_activityEnterStyle,
|
|
839
|
+
modalPresentationStyle,
|
|
859
840
|
children
|
|
860
841
|
}) => {
|
|
861
842
|
var _a, _b;
|
|
@@ -867,55 +848,36 @@ var AppScreen = ({
|
|
|
867
848
|
const paperRef = (0, import_react9.useRef)(null);
|
|
868
849
|
const edgeRef = (0, import_react9.useRef)(null);
|
|
869
850
|
const appBarRef = (0, import_react9.useRef)(null);
|
|
870
|
-
const
|
|
871
|
-
const
|
|
872
|
-
const swipeBackPrevented = preventSwipeBack || modalPresentationStyle === "fullScreen";
|
|
873
|
-
const hasAppBar = !!appBar2;
|
|
874
|
-
const zIndexBase = ((_a = activity == null ? void 0 : activity.zIndex) != null ? _a : 0) * 5;
|
|
875
|
-
let zIndexDim;
|
|
876
|
-
let zIndexPaper;
|
|
877
|
-
let zIndexEdge;
|
|
878
|
-
let zIndexAppBar;
|
|
879
|
-
switch (globalOptions.theme) {
|
|
880
|
-
case "cupertino": {
|
|
881
|
-
zIndexDim = zIndexBase + (modalPresentationStyle === "fullScreen" ? 2 : 0);
|
|
882
|
-
zIndexPaper = zIndexBase + (hasAppBar && modalPresentationStyle !== "fullScreen" ? 1 : 3);
|
|
883
|
-
zIndexEdge = zIndexBase + 4;
|
|
884
|
-
zIndexAppBar = zIndexBase + 7;
|
|
885
|
-
break;
|
|
886
|
-
}
|
|
887
|
-
case "android":
|
|
888
|
-
default: {
|
|
889
|
-
zIndexDim = zIndexBase;
|
|
890
|
-
zIndexPaper = zIndexBase + (activityEnterStyle === "slideInLeft" ? 1 : 3);
|
|
891
|
-
zIndexEdge = zIndexBase + 4;
|
|
892
|
-
zIndexAppBar = zIndexBase + (activityEnterStyle === "slideInLeft" ? 7 : 4);
|
|
893
|
-
break;
|
|
894
|
-
}
|
|
895
|
-
}
|
|
896
|
-
const transitionState = (_b = activity == null ? void 0 : activity.transitionState) != null ? _b : "enter-done";
|
|
897
|
-
const lazyTransitionState = useLazy(transitionState);
|
|
851
|
+
const presentModalFullScreen = modalPresentationStyle === "fullScreen";
|
|
852
|
+
const swipeBackPrevented = preventSwipeBack || presentModalFullScreen;
|
|
898
853
|
useStyleEffectHide({
|
|
899
854
|
refs: [appScreenRef],
|
|
900
855
|
hasEffect: true
|
|
901
856
|
});
|
|
902
857
|
useStyleEffectOffset({
|
|
903
|
-
refs: globalOptions.theme === "cupertino" || activityEnterStyle === "slideInLeft" ? [paperRef] : [paperRef, appBarRef],
|
|
904
858
|
theme: globalOptions.theme,
|
|
905
|
-
|
|
906
|
-
hasEffect:
|
|
859
|
+
refs: globalOptions.theme === "cupertino" ? [paperRef] : [paperRef, appBarRef],
|
|
860
|
+
hasEffect: !presentModalFullScreen
|
|
907
861
|
});
|
|
908
862
|
useStyleEffectSwipeBack({
|
|
863
|
+
theme: globalOptions.theme,
|
|
909
864
|
dimRef,
|
|
910
865
|
edgeRef,
|
|
911
866
|
paperRef,
|
|
912
|
-
|
|
867
|
+
hasEffect: true,
|
|
913
868
|
prevented: swipeBackPrevented,
|
|
914
869
|
onSwiped() {
|
|
915
870
|
pop();
|
|
916
|
-
}
|
|
917
|
-
hasEffect: true
|
|
871
|
+
}
|
|
918
872
|
});
|
|
873
|
+
const hasAppBar = !!appBar2;
|
|
874
|
+
const zIndexBase = ((_a = activity == null ? void 0 : activity.zIndex) != null ? _a : 0) * 5;
|
|
875
|
+
const zIndexDim = zIndexBase;
|
|
876
|
+
const zIndexPaper = zIndexBase + (globalOptions.theme === "cupertino" && hasAppBar ? 1 : 3);
|
|
877
|
+
const zIndexEdge = zIndexBase + 4;
|
|
878
|
+
const zIndexAppBar = globalOptions.theme === "cupertino" ? zIndexBase + 7 : zIndexBase + 4;
|
|
879
|
+
const transitionState = (_b = activity == null ? void 0 : activity.transitionState) != null ? _b : "enter-done";
|
|
880
|
+
const lazyTransitionState = useLazy(transitionState);
|
|
919
881
|
const onAppBarTopClick = (e) => {
|
|
920
882
|
var _a2, _b2;
|
|
921
883
|
(_a2 = appBar2 == null ? void 0 : appBar2.onTopClick) == null ? void 0 : _a2.call(appBar2, e);
|
|
@@ -962,13 +924,12 @@ var AppScreen = ({
|
|
|
962
924
|
})
|
|
963
925
|
),
|
|
964
926
|
children: [
|
|
965
|
-
|
|
927
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)("div", { className: dim, ref: dimRef }),
|
|
966
928
|
appBar2 && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
967
929
|
AppBar_default,
|
|
968
930
|
__spreadProps(__spreadValues({}, appBar2), {
|
|
969
931
|
ref: appBarRef,
|
|
970
932
|
modalPresentationStyle,
|
|
971
|
-
activityEnterStyle,
|
|
972
933
|
onTopClick: onAppBarTopClick
|
|
973
934
|
})
|
|
974
935
|
),
|
|
@@ -977,8 +938,7 @@ var AppScreen = ({
|
|
|
977
938
|
{
|
|
978
939
|
className: paper({
|
|
979
940
|
hasAppBar,
|
|
980
|
-
|
|
981
|
-
activityEnterStyle
|
|
941
|
+
presentModalFullScreen
|
|
982
942
|
}),
|
|
983
943
|
ref: paperRef,
|
|
984
944
|
children
|