@stackflow/plugin-basic-ui 1.0.0 → 1.0.1
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/{theme.css.d.ts → basicUIPlugin.css.d.ts} +11 -0
- package/dist/basicUIPlugin.d.ts +2 -2
- package/dist/components/AppScreen.d.ts +1 -1
- package/dist/components/BottomSheet.d.ts +1 -1
- package/dist/components/Modal.d.ts +1 -1
- package/dist/index.css +142 -139
- package/dist/index.css.map +3 -3
- package/dist/index.d.ts +1 -1
- package/dist/index.js +38 -42
- package/dist/index.js.map +4 -4
- package/dist/index.mjs +38 -46
- package/dist/index.mjs.map +4 -4
- package/package.json +7 -7
- package/src/{theme.css.ts → basicUIPlugin.css.ts} +24 -8
- package/src/basicUIPlugin.tsx +19 -19
- package/src/components/AppBar.css.ts +2 -2
- package/src/components/AppBar.tsx +2 -2
- package/src/components/AppScreen.css.ts +2 -2
- package/src/components/AppScreen.tsx +2 -2
- package/src/components/BottomSheet.css.ts +1 -1
- package/src/components/BottomSheet.tsx +2 -2
- package/src/components/Modal.css.ts +1 -1
- package/src/components/Modal.tsx +2 -2
- package/src/hooks/useStyleEffectOffset.ts +1 -1
- package/src/hooks/useStyleEffectSwipeBack.ts +1 -1
- package/src/index.ts +1 -1
package/dist/index.css.map
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
|
-
"sources": ["vanilla-extract-css-ns:src/
|
|
4
|
-
"sourcesContent": [":root, :root[data-stackflow-plugin-basic-ui-theme=android] {\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: 0ms;\n --stackflow-plugin-basic-ui-app-bar-border-color: rgba(0, 0, 0, 0.07);\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: 0ms;\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-text-color: #212124;\n --stackflow-plugin-basic-ui-app-bar-background-color: #fff;\n --stackflow-plugin-basic-ui-app-bar-overflow: hidden;\n --stackflow-plugin-basic-ui-bottom-sheet-border-radius: 1rem;\n}\n:root[data-stackflow-plugin-basic-ui-theme=cupertino] {\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: 0ms;\n --stackflow-plugin-basic-ui-app-bar-border-color: rgba(0, 0, 0, 0.07);\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: 0ms;\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-text-color: #212124;\n --stackflow-plugin-basic-ui-app-bar-background-color: #fff;\n --stackflow-plugin-basic-ui-app-bar-overflow: hidden;\n --stackflow-plugin-basic-ui-bottom-sheet-border-radius: 1rem;\n}\n.theme__1coppmz0 {\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: 0ms;\n --stackflow-plugin-basic-ui-app-bar-border-color: rgba(0, 0, 0, 0.07);\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: 0ms;\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-text-color: #212124;\n --stackflow-plugin-basic-ui-app-bar-background-color: #fff;\n --stackflow-plugin-basic-ui-app-bar-overflow: hidden;\n --stackflow-plugin-basic-ui-bottom-sheet-border-radius: 1rem;\n}\n.theme__1coppmz1 {\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: 0ms;\n --stackflow-plugin-basic-ui-app-bar-border-color: rgba(0, 0, 0, 0.07);\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: 0ms;\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-text-color: #212124;\n --stackflow-plugin-basic-ui-app-bar-background-color: #fff;\n --stackflow-plugin-basic-ui-app-bar-overflow: hidden;\n --stackflow-plugin-basic-ui-bottom-sheet-border-radius: 1rem;\n}", ".f__dhthxq0 {\n width: 100%;\n}\n.f__dhthxq1 {\n height: 100%;\n}\n.f__dhthxq2 {\n top: 0;\n}\n.f__dhthxq3 {\n left: 0;\n}\n.f__dhthxq4 {\n position: absolute;\n}\n.f__dhthxq5 {\n position: relative;\n}\n.f__dhthxq7 {\n display: flex;\n}\n.f__dhthxq8 {\n flex: 1;\n}\n.f__dhthxq9 {\n align-items: center;\n}\n.f__dhthxqa {\n align-items: flex-end;\n}\n.f__dhthxqb {\n justify-content: center;\n}\n.f__dhthxqc {\n overflow: hidden;\n}\n.f__dhthxqd {\n white-space: nowrap;\n}\n.f__dhthxqe {\n text-align: center;\n}\n.f__dhthxqf {\n cursor: pointer;\n -webkit-tap-highlight-color: transparent;\n}\n.f__dhthxqg {\n box-sizing: border-box;\n}\n.f__dhthxqh {\n box-sizing: content-box;\n}\n.f__dhthxqi {\n appearance: none;\n border: 0;\n padding: 0;\n background: none;\n}", ".AppScreen__1dlf4346 {\n background-color: var(--stackflow-plugin-basic-ui-dim-background-color);\n}\n.AppScreen__1dlf4347 {\n background-color: var(--stackflow-plugin-basic-ui-background-color);\n}\n.AppScreen__1dlf4348 {\n transition: transform var(--transitionDuration__1dlf4340), opacity var(--transitionDuration__1dlf4340);\n}\n.AppScreen__1dlf434c {\n transform: translate3d(100%, 0, 0);\n}\n.AppScreen__1dlf434i {\n opacity: 0;\n z-index: var(--zIndexes-dim__1dlf4341);\n will-change: opacity;\n}\n\n .theme__1coppmz0 .AppScreen__1dlf434i,\n :root[data-stackflow-plugin-basic-ui-theme=android] .AppScreen__1dlf434i\n {\n height: 10rem;\n background: linear-gradient(var(--stackflow-plugin-basic-ui-dim-background-color), rgba(0, 0, 0, 0));\n}\n\n .AppScreen__1dlf4349 .AppScreen__1dlf434i,\n .AppScreen__1dlf434a .AppScreen__1dlf434i\n {\n opacity: 1;\n}\n\n .AppScreen__1dlf434b .AppScreen__1dlf434i,\n .AppScreen__1dlf434c .AppScreen__1dlf434i\n {\n opacity: 0;\n}\n.AppScreen__1dlf434j {\n overflow-y: scroll;\n -webkit-overflow-scrolling: touch;\n z-index: var(--zIndexes-paper__1dlf4342);\n will-change: transform;\n}\n.AppScreen__1dlf434j::-webkit-scrollbar {\n display: none;\n}\n\n .theme__1coppmz1 .AppScreen__1dlf434j,\n :root[data-stackflow-plugin-basic-ui-theme=cupertino] .AppScreen__1dlf434j\n {\n transform: translate3d(100%, 0, 0);\n}\n\n .theme__1coppmz1 .AppScreen__1dlf4349 .AppScreen__1dlf434j,\n :root[data-stackflow-plugin-basic-ui-theme=cupertino] .AppScreen__1dlf4349 .AppScreen__1dlf434j,\n .theme__1coppmz1 .AppScreen__1dlf434a .AppScreen__1dlf434j,\n :root[data-stackflow-plugin-basic-ui-theme=cupertino] .AppScreen__1dlf434a .AppScreen__1dlf434j\n {\n transform: translate3d(0, 0, 0);\n}\n\n .theme__1coppmz0 .AppScreen__1dlf434j,\n :root[data-stackflow-plugin-basic-ui-theme=android] .AppScreen__1dlf434j\n {\n opacity: 0;\n transform: translate3d(0, 10rem, 0);\n}\n\n .theme__1coppmz0 .AppScreen__1dlf4349 .AppScreen__1dlf434j,\n :root[data-stackflow-plugin-basic-ui-theme=android] .AppScreen__1dlf4349 .AppScreen__1dlf434j,\n .theme__1coppmz0 .AppScreen__1dlf434a .AppScreen__1dlf434j,\n :root[data-stackflow-plugin-basic-ui-theme=android] .AppScreen__1dlf434a .AppScreen__1dlf434j\n {\n opacity: 1;\n transform: translate3d(0, 0, 0);\n}\n.AppScreen_hasAppBar_true__1dlf434k {\n transition: transform var(--transitionDuration__1dlf4340), opacity var(--transitionDuration__1dlf4340), padding-top var(--stackflow-plugin-basic-ui-app-bar-height-transition-duration);\n padding-top: calc(var(--stackflow-plugin-basic-ui-app-bar-height) + constant(safe-area-inset-top));\n padding-top: calc(var(--stackflow-plugin-basic-ui-app-bar-height) + env(safe-area-inset-top));\n}\n\n .theme__1coppmz1 .AppScreen_presentModalFullScreen_true__1dlf434l,\n :root[data-stackflow-plugin-basic-ui-theme=cupertino] .AppScreen_presentModalFullScreen_true__1dlf434l\n {\n transform: translate3d(0, 100%, 0);\n}\n.AppScreen__1dlf434m {\n width: 1.25rem;\n z-index: var(--zIndexes-edge__1dlf4343);\n}\n.AppScreen_hasAppBar_true__1dlf434n {\n top: var(--stackflow-plugin-basic-ui-app-bar-height);\n height: calc(100% - var(--stackflow-plugin-basic-ui-app-bar-height));\n}", ".AppBar__1yk3a450 {\n min-height: var(--stackflow-plugin-basic-ui-app-bar-min-height);\n}\n.AppBar__1yk3a451 {\n overflow: var(--stackflow-plugin-basic-ui-app-bar-overflow);\n}\n.AppBar__1yk3a452 {\n background-color: var(--stackflow-plugin-basic-ui-app-bar-background-color);\n z-index: var(--zIndexes-appBar__1dlf4344);\n will-change: transform, opacity;\n}\n\n .theme__1coppmz1 .AppBar__1yk3a452,\n :root[data-stackflow-plugin-basic-ui-theme=cupertino] .AppBar__1yk3a452\n {\n position: absolute;\n}\n\n .theme__1coppmz1 .AppScreen__1dlf434b .AppBar__1yk3a452,\n :root[data-stackflow-plugin-basic-ui-theme=cupertino] .AppScreen__1dlf434b .AppBar__1yk3a452\n {\n transform: translate3d(100%, 0, 0);\n transition: 0s;\n}\n\n .theme__1coppmz0 .AppBar__1yk3a452,\n :root[data-stackflow-plugin-basic-ui-theme=android] .AppBar__1yk3a452\n {\n opacity: 0;\n transform: translate3d(0, 10rem, 0);\n transition: transform var(--transitionDuration__1dlf4340), opacity var(--transitionDuration__1dlf4340);\n}\n\n .theme__1coppmz0 .AppScreen__1dlf4349 .AppBar__1yk3a452,\n :root[data-stackflow-plugin-basic-ui-theme=android] .AppScreen__1dlf4349 .AppBar__1yk3a452,\n .theme__1coppmz0 .AppScreen__1dlf434a .AppBar__1yk3a452,\n :root[data-stackflow-plugin-basic-ui-theme=android] .AppScreen__1dlf434a .AppBar__1yk3a452\n {\n opacity: 1;\n transform: translate3d(0, 0, 0);\n}\n.AppBar_border_true__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\n .theme__1coppmz1 .AppBar_presentModalFullScreen_true__1yk3a454,\n :root[data-stackflow-plugin-basic-ui-theme=cupertino] .AppBar_presentModalFullScreen_true__1yk3a454\n {\n transform: translate3d(0, 100vh, 0);\n transition: transform var(--transitionDuration__1dlf4340), opacity var(--transitionDuration__1dlf4340);\n}\n\n .theme__1coppmz1 .AppScreen__1dlf4349 .AppBar_presentModalFullScreen_true__1yk3a454,\n :root[data-stackflow-plugin-basic-ui-theme=cupertino] .AppScreen__1dlf4349 .AppBar_presentModalFullScreen_true__1yk3a454,\n .theme__1coppmz1 .AppScreen__1dlf434a .AppBar_presentModalFullScreen_true__1yk3a454,\n :root[data-stackflow-plugin-basic-ui-theme=cupertino] .AppScreen__1dlf434a .AppBar_presentModalFullScreen_true__1yk3a454\n {\n transform: translate3d(0, 0, 0);\n}\n\n .theme__1coppmz1 .AppScreen__1dlf434b .AppBar_presentModalFullScreen_true__1yk3a454,\n :root[data-stackflow-plugin-basic-ui-theme=cupertino] .AppScreen__1dlf434b .AppBar_presentModalFullScreen_true__1yk3a454\n {\n transform: translate3d(0, 100vh, 0);\n transition: transform var(--transitionDuration__1dlf4340), opacity var(--transitionDuration__1dlf4340);\n}\n.AppBar__1yk3a455 {\n height: constant(safe-area-inset-top);\n height: env(safe-area-inset-top);\n}\n.AppBar__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.AppBar__1yk3a457 {\n padding: 0 0.5rem;\n}\n.AppBar__1yk3a457:empty {\n display: none;\n}\n.AppBar__1yk3a458 {\n color: var(--stackflow-plugin-basic-ui-app-bar-icon-color);\n transition: opacity 300ms;\n width: 2.25rem;\n height: 2.75rem;\n}\n.AppBar__1yk3a458:active {\n opacity: 0.2;\n transition: opacity 0s;\n}\n.AppBar__1yk3a45b {\n width: var(--appBar-center-mainWidth__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);\n}\n\n .theme__1coppmz0 .AppBar__1yk3a45b,\n :root[data-stackflow-plugin-basic-ui-theme=android] .AppBar__1yk3a45b\n {\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\n .theme__1coppmz1 .AppBar__1yk3a45b,\n :root[data-stackflow-plugin-basic-ui-theme=cupertino] .AppBar__1yk3a45b\n {\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\n .theme__1coppmz0 .AppBar_hasLeft_true__1yk3a45c,\n :root[data-stackflow-plugin-basic-ui-theme=android] .AppBar_hasLeft_true__1yk3a45c\n {\n padding-left: 0.375rem;\n}\n.AppBar__1yk3a45d {\n left: 50%;\n height: 1.25rem;\n transform: translate(-50%);\n max-width: 5rem;\n display: none;\n width: var(--appBar-center-mainWidth__1dlf4345);\n}\n\n .theme__1coppmz1 .AppBar__1yk3a45d,\n :root[data-stackflow-plugin-basic-ui-theme=cupertino] .AppBar__1yk3a45d\n {\n display: block;\n}\n.AppBar__1yk3a45e {\n text-overflow: ellipsis;\n font-size: inherit;\n font-weight: inherit;\n}\n.AppBar__1yk3a45f {\n padding: 0 0.5rem;\n margin-left: auto;\n}\n.AppBar__1yk3a45f:empty {\n display: none;\n}\n\n .theme__1coppmz0 .AppBar__1yk3a45f,\n :root[data-stackflow-plugin-basic-ui-theme=android] .AppBar__1yk3a45f\n {\n padding: 0 0.5rem 0 0;\n}", ".BottomSheet__1ht38h03 {\n transition: var(--transitionDuration__1ht38h00);\n}\n.BottomSheet__1ht38h07 {\n transform: translate3d(100%, 0, 0);\n}\n.BottomSheet__1ht38h0d {\n background-color: var(--stackflow-plugin-basic-ui-dim-background-color);\n z-index: var(--zIndexes-dim__1ht38h01);\n opacity: 0;\n}\n.BottomSheet__1ht38h04 .BottomSheet__1ht38h0d, .BottomSheet__1ht38h05 .BottomSheet__1ht38h0d {\n opacity: 1;\n}\n.BottomSheet__1ht38h06 .BottomSheet__1ht38h0d, .BottomSheet__1ht38h07 .BottomSheet__1ht38h0d {\n opacity: 0;\n}\n.BottomSheet__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.BottomSheet__1ht38h04 .BottomSheet__1ht38h0e, .BottomSheet__1ht38h05 .BottomSheet__1ht38h0e {\n transform: translate3d(0, 0, 0);\n opacity: 1;\n}\n.BottomSheet__1ht38h06 .BottomSheet__1ht38h0e, .BottomSheet__1ht38h07 .BottomSheet__1ht38h0e {\n transform: translate3d(0, 100%, 0);\n opacity: 0;\n}", ".Modal__5ozg8c3 {\n transition: var(--transitionDuration__5ozg8c0);\n}\n.Modal__5ozg8c7 {\n transform: translate3d(100%, 0, 0);\n}\n.Modal__5ozg8cd {\n background-color: var(--stackflow-plugin-basic-ui-dim-background-color);\n z-index: var(--zIndexes-dim__5ozg8c1);\n opacity: 0;\n}\n.Modal__5ozg8c4 .Modal__5ozg8cd, .Modal__5ozg8c5 .Modal__5ozg8cd {\n opacity: 1;\n}\n.Modal__5ozg8c6 .Modal__5ozg8cd, .Modal__5ozg8c7 .Modal__5ozg8cd {\n opacity: 0;\n}\n.Modal__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.Modal__5ozg8c4 .Modal__5ozg8ce, .Modal__5ozg8c5 .Modal__5ozg8ce {\n transform: scale(1);\n opacity: 1;\n}\n.Modal__5ozg8c6 .Modal__5ozg8ce, .Modal__5ozg8c7 .Modal__5ozg8ce {\n transform: scale(1.1);\n opacity: 0;\n}"],
|
|
5
|
-
"mappings": ";AAAA;AAAA;AACE;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;AAAA;AAEF;AACE;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;AAAA;;;
|
|
3
|
+
"sources": ["vanilla-extract-css-ns:src/basicUIPlugin.css.ts.vanilla.css?source=#H4sIAAAAAAAAE+2Vy07DMBBF9/0KS2xAqqOkECoZ8SUIISeeJC6NJ4wnpQLx77iFbhCQBws2ViLldY8zyfjIihB5KdThcGc0a+lZl4/VFp9lt+1r62ShvS1lbyU30MKtdobQmnvxuhBC/hIvwoOasHdGlrhFUuKsqqqbAcrY9huS6kKfp0vxuSdZfjE0EJN23rJFJ01P+nCiRNr6IU53XbggWSAZoJ8KSNeDBXwZyNsXUCLr9mO5BmzdsBKXSU7QTqP+/PVtuDmvAFuGd54avsrCdjUWZdjzTHTeZDvRuAM6BJRorDHghrgCmbGVvgHgU39JG9v70OHjv3pbTFCq7Dsgtg6jVLOkSpN8ularZP3PXk2sIIr1IVbykD1dm81qk0Zb4hIUTRlhShZNietKtGWkLfnRlg6t4xCDHTgOMYcOQuwdmkbOSzENAAA=", "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=#H4sIAAAAAAAAE7WW3bKaMBDH732K3HRGpsQJenrag9Mn6XQ6SxIhGhMagvZj+u4NoEhERM/xMFyAm/z2n91l19mPiMnV0+LpGf2dIJQA3aRGl4phqqU2MdqBmWJcWGdYSb3HuSxToXAChaC4FJiJLT7fFSwn/yazI/nzK8nXqV9qqjWgCmGFVnHzvNJmeyAfV5IgRDoHKuzvnsVD0hOywhyIEixfsGlEyIcQEXf7m0S96cCPEVm6tz9YKMZ/xWfuoqAy7oWUmGagUh4f91VEZ2ouh/75zNbzNUEnL2Frjo3W9hsDC1diZzO+5V9BMaMF+97hHDGV6IyLNLMxiojh26WXoxhJoTgYnBpggis7fVUdhMikCUxJE7gqdsH5URtdLxeP2v4GAydowx5dxibXsXQMS7xUrxvjjps6As5eUKOlrEKH9zzZCItba2MSKnVlpEuaXamLeb8u2iL0BcTx0U+DT8DUmpgocglOkNKKe6HolFN0Ou067Cy4o6BomXNjhdKdklqfULd/PiP6Xt5H6hD2kgR4Hwlwb+DISNTI23X228SZNL+7DQutG8mNYh+Q4r7u0QSThya4L2A4vd1WdVOyW9DmIZMuRDkw5voRtjofnb2Q5+7F4GZE4JNzzEoD1UPdszrIGFGQdHRM+OAAfURUK7fcTZgCVhyD4eC6ZMFtBQ0e5oWr3ZADr1QvNwMZekve2ANkF3b90z+0Tb8gtvWmvWA2c+U0m386jO+B8bLwd6vGZRXLO8O47PxnqNNQqUP4Xkwl5z+l8Vc0dwoAAA==", "vanilla-extract-css-ns:src/components/AppBar.css.ts.vanilla.css?source=#H4sIAAAAAAAAE81XS28aMRC+8yt8qQQVXnl55AHqpYfeeuqxqiLv2gtOvPbWNgRS9b/X630aloUkRGqUA9gz429e3wzBQ7h/muLZHIE/AwBSJuCastXaLMAWqyGE2uD4KeHyGWZ8s7LXEdYshhsGcZbZLwo2OqPl4O8gqCyGzqLcUpWrX26v0vCtTZy1yCqvlNwIAmPJpbrc6qGmtQ7AC2SC0F1l5SEkPJlNZzN3+cw4h/EaixVdAKOw0IlU6RjIDMfM7HN0Vqr6s0B/35DHyWMIGszjlsBCSWl+EmxwD1qzpin9Em8yqgwT8lfLVmMqD0QmNTNMigXAkZZ8Y2gvnsKv6NrQjs36KOuolQHk2NApGYYIfRoDZP9doN1V6Q3Sp/xA7wePBVGSkdNRLVNrYSxPo7e4Q6Ro2gW/VjmoKDSq6+boptfhQuj+ur73G+0CgD8CAD6fh7A/D2UJtWhiWtCE3EG9xiSnHSY0NQBlOxBjHg9hCD5fThpSEaqgZi90NALotXoV0Xj57aaK2dgTeSdZzNrGehrRlTLarj+olLtZ6P76Xp8z3AUDfxQM/KY81KV8Fnj0UcCj/6OAahBz93K1jsRSWKeEGWqcUIgVxdC1NjQyc29XglRsT8i0bN94ti/t63rN8T0tjl9pBTYWINkonH/wMd4Wkx4TwsTKziSAgrmdO77MgqaZDWQuSZjOOLasKaSgntSdu3/lxsRsxFu7UtvhKn1ThFJd7ErErBdgEkwKhE1oJ8HtEei7BY4N29KDmRtMTr1TbAW1fuQUyzf9Epo7rK/01NCdOeHpdVM7OOrr1lYTNc38rp0mGrT6tgxSvnHlrj1utGHJ3jorDBU2PQmnu/wNZZZNrUFOE3sXlqlMrLCbgfYoCO9uqxRzJmj9ayEM5rXsc3kWSU6W1ThmL66Ky9Foj7oDEr43IF3z0AtJ1+rcap48IvkB5mwlIDM01ZZ8bLCo6oxgc+XKyKm1T11EEpwybo3nhcIp1Htt8gXyqw3h03cc/3Dfv1nJoxjeIHSYgyr8LknzIrFd/DyE9tKjxrfwnMwu4F4n1Ue83VOtVf3xm0fZcQfEh9PLr2sUTI85iThBL6ZNades1h/mFO9g2XCVwgEn97DWmWYgV2sG0m6GGl/EZfzkRaSgZ1fUzY94yjnLNNMHNcnEmip2XL31ectucmqs5QFUuRNFFvDGSF+xb9b1UmtyJWpNPB459CD/YKH8A4KdXslTEQAA", "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": [":root, :root[data-stackflow-plugin-basic-ui-theme=android] {\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: 0ms;\n --stackflow-plugin-basic-ui-app-bar-border-color: rgba(0, 0, 0, 0.07);\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: 0ms;\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-text-color: #212124;\n --stackflow-plugin-basic-ui-app-bar-background-color: #fff;\n --stackflow-plugin-basic-ui-app-bar-overflow: hidden;\n --stackflow-plugin-basic-ui-bottom-sheet-border-radius: 1rem;\n}\n:root[data-stackflow-plugin-basic-ui-theme=cupertino] {\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: 0ms;\n --stackflow-plugin-basic-ui-app-bar-border-color: rgba(0, 0, 0, 0.07);\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: 0ms;\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-text-color: #212124;\n --stackflow-plugin-basic-ui-app-bar-background-color: #fff;\n --stackflow-plugin-basic-ui-app-bar-overflow: hidden;\n --stackflow-plugin-basic-ui-bottom-sheet-border-radius: 1rem;\n}\n._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: 0ms;\n --stackflow-plugin-basic-ui-app-bar-border-color: rgba(0, 0, 0, 0.07);\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: 0ms;\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-text-color: #212124;\n --stackflow-plugin-basic-ui-app-bar-background-color: #fff;\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: 0ms;\n --stackflow-plugin-basic-ui-app-bar-border-color: rgba(0, 0, 0, 0.07);\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: 0ms;\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-text-color: #212124;\n --stackflow-plugin-basic-ui-app-bar-background-color: #fff;\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\n ._1q6dj2j0 ._1dlf434i,\n :root[data-stackflow-plugin-basic-ui-theme=android] ._1dlf434i\n {\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\n ._1q6dj2j1 ._1dlf434j,\n :root[data-stackflow-plugin-basic-ui-theme=cupertino] ._1dlf434j\n {\n transform: translate3d(100%, 0, 0);\n}\n\n ._1q6dj2j1 ._1dlf4349 ._1dlf434j,\n :root[data-stackflow-plugin-basic-ui-theme=cupertino] ._1dlf4349 ._1dlf434j,\n ._1q6dj2j1 ._1dlf434a ._1dlf434j,\n :root[data-stackflow-plugin-basic-ui-theme=cupertino] ._1dlf434a ._1dlf434j\n {\n transform: translate3d(0, 0, 0);\n}\n\n ._1q6dj2j0 ._1dlf434j,\n :root[data-stackflow-plugin-basic-ui-theme=android] ._1dlf434j\n {\n opacity: 0;\n transform: translate3d(0, 10rem, 0);\n}\n\n ._1q6dj2j0 ._1dlf4349 ._1dlf434j,\n :root[data-stackflow-plugin-basic-ui-theme=android] ._1dlf4349 ._1dlf434j,\n ._1q6dj2j0 ._1dlf434a ._1dlf434j,\n :root[data-stackflow-plugin-basic-ui-theme=android] ._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: calc(var(--stackflow-plugin-basic-ui-app-bar-height) + constant(safe-area-inset-top));\n padding-top: calc(var(--stackflow-plugin-basic-ui-app-bar-height) + env(safe-area-inset-top));\n}\n\n ._1q6dj2j1 ._1dlf434l,\n :root[data-stackflow-plugin-basic-ui-theme=cupertino] ._1dlf434l\n {\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}", "._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}\n\n ._1q6dj2j1 ._1yk3a452,\n :root[data-stackflow-plugin-basic-ui-theme=cupertino] ._1yk3a452\n {\n position: absolute;\n}\n\n ._1q6dj2j1 ._1dlf434b ._1yk3a452,\n :root[data-stackflow-plugin-basic-ui-theme=cupertino] ._1dlf434b ._1yk3a452\n {\n transform: translate3d(100%, 0, 0);\n transition: 0s;\n}\n\n ._1q6dj2j0 ._1yk3a452,\n :root[data-stackflow-plugin-basic-ui-theme=android] ._1yk3a452\n {\n opacity: 0;\n transform: translate3d(0, 10rem, 0);\n transition: transform var(--_1dlf4340), opacity var(--_1dlf4340);\n}\n\n ._1q6dj2j0 ._1dlf4349 ._1yk3a452,\n :root[data-stackflow-plugin-basic-ui-theme=android] ._1dlf4349 ._1yk3a452,\n ._1q6dj2j0 ._1dlf434a ._1yk3a452,\n :root[data-stackflow-plugin-basic-ui-theme=android] ._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\n ._1q6dj2j1 ._1yk3a454,\n :root[data-stackflow-plugin-basic-ui-theme=cupertino] ._1yk3a454\n {\n transform: translate3d(0, 100vh, 0);\n transition: transform var(--_1dlf4340), opacity var(--_1dlf4340);\n}\n\n ._1q6dj2j1 ._1dlf4349 ._1yk3a454,\n :root[data-stackflow-plugin-basic-ui-theme=cupertino] ._1dlf4349 ._1yk3a454,\n ._1q6dj2j1 ._1dlf434a ._1yk3a454,\n :root[data-stackflow-plugin-basic-ui-theme=cupertino] ._1dlf434a ._1yk3a454\n {\n transform: translate3d(0, 0, 0);\n}\n\n ._1q6dj2j1 ._1dlf434b ._1yk3a454,\n :root[data-stackflow-plugin-basic-ui-theme=cupertino] ._1dlf434b ._1yk3a454\n {\n transform: translate3d(0, 100vh, 0);\n transition: 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;\n width: 2.25rem;\n height: 2.75rem;\n}\n._1yk3a458:active {\n opacity: 0.2;\n transition: opacity 0s;\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);\n}\n\n ._1q6dj2j0 ._1yk3a45b,\n :root[data-stackflow-plugin-basic-ui-theme=android] ._1yk3a45b\n {\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\n ._1q6dj2j1 ._1yk3a45b,\n :root[data-stackflow-plugin-basic-ui-theme=cupertino] ._1yk3a45b\n {\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\n ._1q6dj2j0 ._1yk3a45c,\n :root[data-stackflow-plugin-basic-ui-theme=android] ._1yk3a45c\n {\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\n ._1q6dj2j1 ._1yk3a45d,\n :root[data-stackflow-plugin-basic-ui-theme=cupertino] ._1yk3a45d\n {\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\n ._1q6dj2j0 ._1yk3a45f,\n :root[data-stackflow-plugin-basic-ui-theme=android] ._1yk3a45f\n {\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;AAAA;AACE;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;AAAA;AAEF;AACE;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;AAAA;AAEF;AACE;AAAA;;;AC7DF;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;AAGM;AAAA;AAGN;AACA;AAAA;AAGM;AAAA;AAGN;AAAA;AAGM;AAAA;AAGN;AAAA;AAEF;AACE;AACA;AACA;AACA;AAAA;AAEF;AACE;AAAA;AAGQ;AAAA;AAGR;AAAA;AAGQ;AAAA;AAAA;AAAA;AAKR;AAAA;AAGQ;AAAA;AAGR;AACA;AAAA;AAGQ;AAAA;AAAA;AAAA;AAKR;AACA;AAAA;AAEF;AACE;AAAA;AAAA;AAAA;AACA;AACA;AAAA;AAGU;AAAA;AAGV;AAAA;AAEF;AACE;AACA;AAAA;AAEF;AACE;AACA;AAAA;;;AC5FF;AACE;AAAA;AAEF;AACE;AAAA;AAEF;AACE;AACA;AACA;AAAA;AAGQ;AAAA;AAGR;AAAA;AAGQ;AAAA;AAGR;AACA;AAAA;AAGQ;AAAA;AAGR;AACA;AACA;AAAA;AAGQ;AAAA;AAAA;AAAA;AAKR;AACA;AAAA;AAEF;AACE;AAAA;AAGU;AAAA;AAGV;AACA;AAAA;AAGU;AAAA;AAAA;AAAA;AAKV;AAAA;AAGU;AAAA;AAGV;AACA;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;AAGM;AAAA;AAGN;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGM;AAAA;AAGN;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAA;AAGU;AAAA;AAGV;AAAA;AAEF;AACE;AACA;AACA;AACA;AACA;AACA;AAAA;AAGM;AAAA;AAGN;AAAA;AAEF;AACE;AACA;AACA;AAAA;AAEF;AACE;AACA;AAAA;AAEF;AACE;AAAA;AAGM;AAAA;AAGN;AAAA;;;ACjKF;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.d.ts
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
export { basicUIPlugin } from "./basicUIPlugin";
|
|
2
|
+
export { globalVars as cssVars } from "./basicUIPlugin.css";
|
|
2
3
|
export { default as AppScreen, AppScreenContext, AppScreenProps, useAppScreen, } from "./components/AppScreen";
|
|
3
4
|
export { default as BottomSheet, BottomSheetProps, } from "./components/BottomSheet";
|
|
4
5
|
export { default as Modal, ModalProps } from "./components/Modal";
|
|
5
|
-
export { globalVars as cssVars } from "./theme.css";
|
package/dist/index.js
CHANGED
|
@@ -50,20 +50,10 @@ module.exports = __toCommonJS(src_exports);
|
|
|
50
50
|
var import_dynamic = require("@vanilla-extract/dynamic");
|
|
51
51
|
var import_react = require("react");
|
|
52
52
|
|
|
53
|
-
// src/
|
|
54
|
-
var
|
|
55
|
-
__export(theme_css_exports, {
|
|
56
|
-
android: () => android,
|
|
57
|
-
cupertino: () => cupertino,
|
|
58
|
-
globalVars: () => globalVars,
|
|
59
|
-
rootAndroid: () => rootAndroid,
|
|
60
|
-
rootCupertino: () => rootCupertino
|
|
61
|
-
});
|
|
62
|
-
var android = "theme__1coppmz0";
|
|
63
|
-
var cupertino = "theme__1coppmz1";
|
|
53
|
+
// src/basicUIPlugin.css.ts
|
|
54
|
+
var import_createRuntimeFn = require("@vanilla-extract/recipes/createRuntimeFn");
|
|
64
55
|
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)", appBar: { borderColor: "var(--stackflow-plugin-basic-ui-app-bar-border-color)", 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)", textColor: "var(--stackflow-plugin-basic-ui-app-bar-text-color)", backgroundColor: "var(--stackflow-plugin-basic-ui-app-bar-background-color)", 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)" } };
|
|
65
|
-
var
|
|
66
|
-
var rootCupertino = ":root[data-stackflow-plugin-basic-ui-theme=cupertino]";
|
|
56
|
+
var stackWrapper = (0, import_createRuntimeFn.createRuntimeFn)({ defaultClassName: "_1q6dj2j2", variantClassNames: { theme: { android: "_1q6dj2j0", cupertino: "_1q6dj2j1" }, loading: { true: "_1q6dj2j5" } }, defaultVariants: {}, compoundVariants: [] });
|
|
67
57
|
|
|
68
58
|
// src/utils/compact.ts
|
|
69
59
|
function compact(arr) {
|
|
@@ -139,7 +129,13 @@ var basicUIPlugin = (options) => () => ({
|
|
|
139
129
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(GlobalOptionsProvider, { value: options, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
140
130
|
"div",
|
|
141
131
|
{
|
|
142
|
-
className:
|
|
132
|
+
className: compact([
|
|
133
|
+
stackWrapper({
|
|
134
|
+
theme: isBrowser() ? options.theme : void 0,
|
|
135
|
+
loading: stack.globalTransitionState === "loading"
|
|
136
|
+
}),
|
|
137
|
+
options.rootClassName
|
|
138
|
+
]).join(" "),
|
|
143
139
|
style: (0, import_dynamic.assignInlineVars)(
|
|
144
140
|
compactMap({
|
|
145
141
|
[globalVars.backgroundColor]: options.backgroundColor,
|
|
@@ -595,26 +591,26 @@ var IconClose = (props) => /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(
|
|
|
595
591
|
var IconClose_default = IconClose;
|
|
596
592
|
|
|
597
593
|
// src/components/AppBar.css.ts
|
|
598
|
-
var
|
|
599
|
-
var appBar = (0,
|
|
600
|
-
var backButton = "
|
|
601
|
-
var center = "
|
|
602
|
-
var centerMain = (0,
|
|
603
|
-
var centerMainEdge = "
|
|
604
|
-
var centerText = "
|
|
605
|
-
var closeButton = "
|
|
606
|
-
var container = "
|
|
607
|
-
var left = "
|
|
608
|
-
var right = "
|
|
609
|
-
var safeArea = "
|
|
594
|
+
var import_createRuntimeFn2 = require("@vanilla-extract/recipes/createRuntimeFn");
|
|
595
|
+
var appBar = (0, import_createRuntimeFn2.createRuntimeFn)({ defaultClassName: "_1yk3a452 dhthxq4 dhthxq0 dhthxqh _1dlf4347 _1yk3a451", variantClassNames: { border: { true: "_1yk3a453" }, presentModalFullScreen: { true: "_1yk3a454" } }, defaultVariants: {}, compoundVariants: [] });
|
|
596
|
+
var backButton = "_1yk3a458 dhthxq9 dhthxq7 dhthxqb dhthxqf dhthxqi";
|
|
597
|
+
var center = "dhthxq9 dhthxq7 dhthxq8 _1yk3a450";
|
|
598
|
+
var centerMain = (0, import_createRuntimeFn2.createRuntimeFn)({ defaultClassName: "_1yk3a45b", variantClassNames: { hasLeft: { true: "_1yk3a45c" } }, defaultVariants: {}, compoundVariants: [] });
|
|
599
|
+
var centerMainEdge = "_1yk3a45d dhthxqi dhthxq4 dhthxq2 dhthxqf";
|
|
600
|
+
var centerText = "_1yk3a45e dhthxqc dhthxqd dhthxq0";
|
|
601
|
+
var closeButton = "_1yk3a458 dhthxq9 dhthxq7 dhthxqb dhthxqf dhthxqi";
|
|
602
|
+
var container = "_1yk3a456 dhthxqa dhthxq7 _1yk3a451";
|
|
603
|
+
var left = "_1yk3a457 dhthxq9 dhthxq7 dhthxq1 _1yk3a450";
|
|
604
|
+
var right = "_1yk3a45f dhthxq9 dhthxq7 dhthxq1 dhthxq5 _1yk3a450";
|
|
605
|
+
var safeArea = "_1yk3a455";
|
|
610
606
|
|
|
611
607
|
// src/components/AppScreen.css.ts
|
|
612
|
-
var
|
|
613
|
-
var appScreen = (0,
|
|
614
|
-
var dim = "
|
|
615
|
-
var edge = (0,
|
|
616
|
-
var paper = (0,
|
|
617
|
-
var vars = { transitionDuration: "var(--
|
|
608
|
+
var import_createRuntimeFn3 = require("@vanilla-extract/recipes/createRuntimeFn");
|
|
609
|
+
var appScreen = (0, import_createRuntimeFn3.createRuntimeFn)({ defaultClassName: "dhthxq4 dhthxq0 dhthxq1 dhthxq2 dhthxq3 dhthxqc", variantClassNames: { transitionState: { "enter-active": "_1dlf4349", "enter-done": "_1dlf434a", "exit-active": "_1dlf434b", "exit-done": "_1dlf434c" } }, defaultVariants: {}, compoundVariants: [] });
|
|
610
|
+
var dim = "_1dlf434i dhthxq4 dhthxq0 dhthxq1 dhthxq2 dhthxq3 _1dlf4346 _1dlf4348";
|
|
611
|
+
var edge = (0, import_createRuntimeFn3.createRuntimeFn)({ defaultClassName: "_1dlf434m dhthxq4 dhthxq2 dhthxq3 dhthxq1", variantClassNames: { hasAppBar: { true: "_1dlf434n" } }, defaultVariants: {}, compoundVariants: [] });
|
|
612
|
+
var paper = (0, import_createRuntimeFn3.createRuntimeFn)({ defaultClassName: "_1dlf434j dhthxq4 dhthxq0 dhthxq1 dhthxq2 dhthxq3 _1dlf4347 _1dlf4348", variantClassNames: { hasAppBar: { true: "_1dlf434k dhthxqg" }, presentModalFullScreen: { true: "_1dlf434l" } }, defaultVariants: {}, compoundVariants: [] });
|
|
613
|
+
var vars = { transitionDuration: "var(--_1dlf4340)", zIndexes: { dim: "var(--_1dlf4341)", paper: "var(--_1dlf4342)", edge: "var(--_1dlf4343)", appBar: "var(--_1dlf4344)" }, appBar: { center: { mainWidth: "var(--_1dlf4345)" } } };
|
|
618
614
|
|
|
619
615
|
// src/components/AppBar.tsx
|
|
620
616
|
var import_jsx_runtime4 = require("react/jsx-runtime");
|
|
@@ -946,11 +942,11 @@ var import_dynamic4 = require("@vanilla-extract/dynamic");
|
|
|
946
942
|
var import_react11 = require("react");
|
|
947
943
|
|
|
948
944
|
// src/components/BottomSheet.css.ts
|
|
949
|
-
var
|
|
950
|
-
var container2 = (0,
|
|
951
|
-
var dim2 = "
|
|
952
|
-
var paper2 = "
|
|
953
|
-
var vars2 = { transitionDuration: "var(--
|
|
945
|
+
var import_createRuntimeFn4 = require("@vanilla-extract/recipes/createRuntimeFn");
|
|
946
|
+
var container2 = (0, import_createRuntimeFn4.createRuntimeFn)({ defaultClassName: "dhthxq4 dhthxq0 dhthxq1 dhthxq2 dhthxq3 dhthxqc", variantClassNames: { transitionState: { "enter-active": "_1ht38h04", "enter-done": "_1ht38h05", "exit-active": "_1ht38h06", "exit-done": "_1ht38h07" } }, defaultVariants: {}, compoundVariants: [] });
|
|
947
|
+
var dim2 = "_1ht38h0d dhthxq4 dhthxq0 dhthxq1 dhthxq2 dhthxq3 dhthxqc dhthxqa dhthxq7 _1ht38h03";
|
|
948
|
+
var paper2 = "_1ht38h0e dhthxqc _1ht38h03";
|
|
949
|
+
var vars2 = { transitionDuration: "var(--_1ht38h00)", zIndexes: { dim: "var(--_1ht38h01)", paper: "var(--_1ht38h02)" } };
|
|
954
950
|
|
|
955
951
|
// src/components/BottomSheet.tsx
|
|
956
952
|
var import_jsx_runtime6 = require("react/jsx-runtime");
|
|
@@ -1026,11 +1022,11 @@ var import_dynamic5 = require("@vanilla-extract/dynamic");
|
|
|
1026
1022
|
var import_react13 = require("react");
|
|
1027
1023
|
|
|
1028
1024
|
// src/components/Modal.css.ts
|
|
1029
|
-
var
|
|
1030
|
-
var container3 = (0,
|
|
1031
|
-
var dim3 = "
|
|
1032
|
-
var paper3 = "
|
|
1033
|
-
var vars3 = { transitionDuration: "var(--
|
|
1025
|
+
var import_createRuntimeFn5 = require("@vanilla-extract/recipes/createRuntimeFn");
|
|
1026
|
+
var container3 = (0, import_createRuntimeFn5.createRuntimeFn)({ defaultClassName: "dhthxq4 dhthxq0 dhthxq1 dhthxq2 dhthxq3 dhthxqc", variantClassNames: { transitionState: { "enter-active": "_5ozg8c4", "enter-done": "_5ozg8c5", "exit-active": "_5ozg8c6", "exit-done": "_5ozg8c7" } }, defaultVariants: {}, compoundVariants: [] });
|
|
1027
|
+
var dim3 = "_5ozg8cd dhthxq4 dhthxq0 dhthxq1 dhthxq2 dhthxq3 dhthxqc dhthxq9 dhthxq7 dhthxqb _5ozg8c3";
|
|
1028
|
+
var paper3 = "_5ozg8ce dhthxqc _5ozg8c3";
|
|
1029
|
+
var vars3 = { transitionDuration: "var(--_5ozg8c0)", zIndexes: { dim: "var(--_5ozg8c1)", paper: "var(--_5ozg8c2)" } };
|
|
1034
1030
|
|
|
1035
1031
|
// src/components/Modal.tsx
|
|
1036
1032
|
var import_jsx_runtime7 = require("react/jsx-runtime");
|