@stackflow/plugin-basic-ui 0.14.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.
Files changed (73) hide show
  1. package/LICENSE +21 -0
  2. package/README.md +61 -0
  3. package/dist/assets/IconBack.d.ts +5 -0
  4. package/dist/assets/IconClose.d.ts +5 -0
  5. package/dist/assets/index.d.ts +2 -0
  6. package/dist/basicUIPlugin.d.ts +10 -0
  7. package/dist/components/AppBar.css.d.ts +24 -0
  8. package/dist/components/AppBar.d.ts +27 -0
  9. package/dist/components/AppScreen.css.d.ts +44 -0
  10. package/dist/components/AppScreen.d.ts +10 -0
  11. package/dist/components/BottomSheet.css.d.ts +21 -0
  12. package/dist/components/BottomSheet.d.ts +7 -0
  13. package/dist/components/Modal.css.d.ts +21 -0
  14. package/dist/components/Modal.d.ts +7 -0
  15. package/dist/hooks/index.d.ts +7 -0
  16. package/dist/hooks/useLazy.d.ts +1 -0
  17. package/dist/hooks/useMaxWidth.d.ts +8 -0
  18. package/dist/hooks/useStyleEffect.d.ts +10 -0
  19. package/dist/hooks/useStyleEffectHide.d.ts +5 -0
  20. package/dist/hooks/useStyleEffectOffset.d.ts +8 -0
  21. package/dist/hooks/useStyleEffectSwipeBack.d.ts +9 -0
  22. package/dist/hooks/useTheme.d.ts +3 -0
  23. package/dist/index.css +2 -0
  24. package/dist/index.css.map +7 -0
  25. package/dist/index.d.ts +5 -0
  26. package/dist/index.js +2 -0
  27. package/dist/index.js.map +7 -0
  28. package/dist/index.mjs +2 -0
  29. package/dist/index.mjs.map +7 -0
  30. package/dist/styles/f.css.d.ts +18 -0
  31. package/dist/styles/index.d.ts +1 -0
  32. package/dist/theme.css.d.ts +25 -0
  33. package/dist/utils/PropOf.d.ts +2 -0
  34. package/dist/utils/compactMap.d.ts +3 -0
  35. package/dist/utils/index.d.ts +7 -0
  36. package/dist/utils/last.d.ts +1 -0
  37. package/dist/utils/listenOnce.d.ts +1 -0
  38. package/dist/utils/listenResize.d.ts +1 -0
  39. package/dist/utils/noop.d.ts +1 -0
  40. package/dist/utils/requestNextFrame.d.ts +1 -0
  41. package/package.json +61 -0
  42. package/src/assets/IconBack.tsx +21 -0
  43. package/src/assets/IconClose.tsx +25 -0
  44. package/src/assets/index.ts +2 -0
  45. package/src/basicUIPlugin.tsx +48 -0
  46. package/src/components/AppBar.css.ts +173 -0
  47. package/src/components/AppBar.tsx +193 -0
  48. package/src/components/AppScreen.css.ts +159 -0
  49. package/src/components/AppScreen.tsx +106 -0
  50. package/src/components/BottomSheet.css.ts +78 -0
  51. package/src/components/BottomSheet.tsx +91 -0
  52. package/src/components/Modal.css.ts +82 -0
  53. package/src/components/Modal.tsx +91 -0
  54. package/src/hooks/index.ts +7 -0
  55. package/src/hooks/useLazy.tsx +15 -0
  56. package/src/hooks/useMaxWidth.ts +43 -0
  57. package/src/hooks/useStyleEffect.ts +76 -0
  58. package/src/hooks/useStyleEffectHide.ts +34 -0
  59. package/src/hooks/useStyleEffectOffset.ts +57 -0
  60. package/src/hooks/useStyleEffectSwipeBack.ts +228 -0
  61. package/src/hooks/useTheme.ts +9 -0
  62. package/src/index.ts +5 -0
  63. package/src/styles/f.css.ts +84 -0
  64. package/src/styles/index.ts +1 -0
  65. package/src/theme.css.ts +75 -0
  66. package/src/utils/PropOf.ts +1 -0
  67. package/src/utils/compactMap.ts +13 -0
  68. package/src/utils/index.ts +7 -0
  69. package/src/utils/last.ts +1 -0
  70. package/src/utils/listenOnce.ts +12 -0
  71. package/src/utils/listenResize.ts +8 -0
  72. package/src/utils/noop.ts +1 -0
  73. package/src/utils/requestNextFrame.tsx +8 -0
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../src/index.ts", "../src/basicUIPlugin.tsx", "../src/hooks/useLazy.tsx", "../src/utils/compactMap.ts", "../src/utils/listenOnce.ts", "../src/utils/listenResize.ts", "../src/utils/noop.ts", "../src/utils/requestNextFrame.tsx", "../src/hooks/useMaxWidth.ts", "../src/hooks/useStyleEffect.ts", "../src/hooks/useStyleEffectHide.ts", "../src/hooks/useStyleEffectOffset.ts", "../src/hooks/useStyleEffectSwipeBack.ts", "../src/hooks/useTheme.ts", "../src/theme.css.ts", "../src/components/AppScreen.tsx", "../src/components/AppBar.tsx", "../src/assets/IconBack.tsx", "../src/assets/IconClose.tsx", "../src/components/AppBar.css.ts", "../src/components/AppScreen.css.ts", "../src/components/BottomSheet.tsx", "../src/components/BottomSheet.css.ts", "../src/components/Modal.tsx", "../src/components/Modal.css.ts"],
4
+ "sourcesContent": ["export { basicUIPlugin } from \"./basicUIPlugin\";\nexport { default as AppScreen } from \"./components/AppScreen\";\nexport { default as BottomSheet } from \"./components/BottomSheet\";\nexport { default as Modal } from \"./components/Modal\";\nexport { globalVars as cssVars } from \"./theme.css\";\n", "import type { StackflowReactPlugin } from \"@stackflow/react\";\nimport { assignInlineVars } from \"@vanilla-extract/dynamic\";\nimport React from \"react\";\n\nimport { ThemeProvider } from \"./hooks\";\nimport * as theme from \"./theme.css\";\nimport { compactMap } from \"./utils\";\n\ntype RPartial<K> = {\n [attr in keyof K]?: K[attr] extends object ? RPartial<K[attr]> : K[attr];\n};\n\ntype BasicUIPluginOptions = RPartial<theme.GlobalVars> & {\n theme: \"android\" | \"cupertino\";\n};\n\nexport const basicUIPlugin: (\n options: BasicUIPluginOptions,\n) => StackflowReactPlugin = (options) => () => ({\n key: \"basic-ui\",\n wrapStack({ stack }) {\n return (\n <ThemeProvider value={options.theme}>\n <div\n className={theme[options.theme]}\n style={assignInlineVars(\n compactMap({\n [theme.globalVars.backgroundColor]: options.backgroundColor,\n [theme.globalVars.dimBackgroundColor]: options.dimBackgroundColor,\n [theme.globalVars.appBar.borderColor]:\n options.appBar?.borderColor,\n [theme.globalVars.appBar.borderSize]: options.appBar?.borderSize,\n [theme.globalVars.appBar.height]: options.appBar?.height,\n [theme.globalVars.appBar.iconColor]: options.appBar?.iconColor,\n [theme.globalVars.appBar.textColor]: options.appBar?.textColor,\n [theme.globalVars.bottomSheet.borderRadius]:\n options.bottomSheet?.borderRadius,\n [theme.globalVars.modal.borderRadius]:\n options.modal?.borderRadius,\n }),\n )}\n >\n {stack.render()}\n </div>\n </ThemeProvider>\n );\n },\n});\n", "import { useEffect, useState } from \"react\";\n\nimport { requestNextFrame } from \"../utils\";\n\nexport function useLazy<T>(value: T) {\n const [state, setState] = useState<T | undefined>(undefined);\n\n useEffect(() => {\n requestNextFrame(() => {\n setState(value);\n });\n }, [value]);\n\n return state;\n}\n", "export function compactMap<T extends {}>(\n obj: T,\n): {\n [key in keyof T]: NonNullable<T[key]>;\n} {\n return Object.entries(obj).reduce<any>((acc, [key, value]) => {\n if (value !== null && value !== undefined) {\n acc[key] = value;\n }\n\n return acc;\n }, {});\n}\n", "export function listenOnce<T extends HTMLElement>(\n el: T,\n type: keyof HTMLElementEventMap,\n cb: () => void,\n) {\n const listener = () => {\n el.removeEventListener(type, listener);\n cb();\n };\n\n el.addEventListener(type, listener);\n}\n", "export const listenResize = (cb: () => void) => {\n cb();\n window.addEventListener(\"resize\", cb);\n\n return () => {\n window.removeEventListener(\"resize\", cb);\n };\n};\n", "export const noop = () => {};\n", "// https://github.com/MingruiZhang/react-animate-mount/blob/32300c04a4fdfa97724b70aaaf0c0f403d6da247/src/Animate.js#L171-L179\nexport function requestNextFrame(cb: () => void) {\n requestAnimationFrame(() => {\n requestAnimationFrame(() => {\n cb();\n });\n });\n}\n", "import type React from \"react\";\nimport { useEffect, useState } from \"react\";\n\nimport { listenResize, noop } from \"../utils\";\n\nexport function useMaxWidth({\n outerRef,\n innerRef,\n enable,\n}: {\n outerRef: React.ForwardedRef<any>;\n innerRef: React.MutableRefObject<any>;\n enable: boolean;\n}) {\n const [maxWidth, setMaxWidth] = useState<number | undefined>(undefined);\n\n useEffect(() => {\n const $outer = outerRef && \"current\" in outerRef && outerRef.current;\n const $inner = innerRef.current;\n\n if (!enable || !$outer || !$inner) {\n return noop;\n }\n\n const dispose = listenResize(() => {\n const screenWidth = $outer.clientWidth;\n\n const leftWidth = $inner.offsetLeft;\n const centerWidth = $inner.clientWidth;\n const rightWidth = screenWidth - leftWidth - centerWidth;\n\n const sideMargin = Math.max(leftWidth, rightWidth);\n\n setMaxWidth(screenWidth - 2 * sideMargin);\n });\n\n return dispose;\n }, []);\n\n return {\n maxWidth,\n };\n}\n", "import type { ActivityTransitionState } from \"@stackflow/core\";\nimport { useActivity } from \"@stackflow/react\";\nimport type React from \"react\";\nimport { useEffect } from \"react\";\n\nconst connections: {\n [styleName: string]: Map<\n number,\n {\n refs: Array<React.RefObject<any>>;\n hasEffect: boolean;\n }\n >;\n} = {};\n\nexport function useStyleEffect({\n styleName,\n refs,\n effect,\n}: {\n styleName: string;\n refs: Array<React.RefObject<any>>;\n effect?: (params: {\n activityTransitionState: ActivityTransitionState;\n refs: Array<React.RefObject<any>>;\n }) => (() => void) | void;\n}) {\n const activity = useActivity();\n\n useEffect(() => {\n if (!connections[styleName]) {\n connections[styleName] = new Map();\n }\n\n connections[styleName].set(activity.zIndex, {\n refs,\n hasEffect: !!effect,\n });\n\n return () => {\n connections[styleName].delete(activity.zIndex);\n };\n }, [activity.id, refs, effect]);\n\n useEffect(() => {\n if (!effect) {\n return () => {};\n }\n\n const refs = (() => {\n let arr: Array<React.RefObject<any>> = [];\n\n for (let i = 1; i <= activity.zIndex; i += 1) {\n const connection = connections[styleName].get(activity.zIndex - i);\n\n if (connection?.refs) {\n arr = [...arr, ...connection.refs];\n }\n if (connection?.hasEffect) {\n break;\n }\n }\n\n return arr;\n })();\n\n const cleanup = effect({\n activityTransitionState: activity.transitionState,\n refs,\n });\n\n return () => {\n cleanup?.();\n };\n }, [activity.transitionState]);\n}\n", "/* eslint-disable no-param-reassign */\n\nimport { useStyleEffect } from \"./useStyleEffect\";\n\nexport function useStyleEffectHide({\n refs,\n hasEffect,\n}: {\n refs: Array<React.RefObject<any>>;\n hasEffect?: boolean;\n}) {\n useStyleEffect({\n styleName: \"hide\",\n refs,\n effect: hasEffect\n ? ({ activityTransitionState, refs }) => {\n switch (activityTransitionState) {\n case \"enter-done\": {\n refs.forEach((ref) => {\n ref.current.style.display = \"none\";\n });\n break;\n }\n default: {\n refs.forEach((ref) => {\n ref.current.style.display = \"\";\n });\n break;\n }\n }\n }\n : undefined,\n });\n}\n", "/* eslint-disable no-param-reassign */\n\nimport { listenOnce, requestNextFrame } from \"../utils\";\nimport { useStyleEffect } from \"./useStyleEffect\";\n\nexport const OFFSET_PX_ANDROID = 32;\nexport const OFFSET_PX_CUPERTINO = 80;\n\nexport function useStyleEffectOffset({\n refs,\n theme,\n hasEffect,\n}: {\n refs: Array<React.RefObject<any>>;\n theme: \"android\" | \"cupertino\";\n hasEffect?: boolean;\n}) {\n useStyleEffect({\n styleName: \"offset\",\n refs,\n effect: hasEffect\n ? ({ activityTransitionState, refs }) => {\n const transform =\n theme === \"cupertino\"\n ? `translateX(-${OFFSET_PX_CUPERTINO / 16}rem)`\n : `translateY(-${OFFSET_PX_ANDROID / 16}rem)`;\n\n switch (activityTransitionState) {\n case \"enter-active\":\n case \"enter-done\": {\n refs.forEach((ref) => {\n ref.current.style.transition = `var(--stackflow-transition-duration)`;\n ref.current.style.transform = transform;\n });\n break;\n }\n case \"exit-active\":\n case \"exit-done\": {\n requestNextFrame(() => {\n refs.forEach((ref) => {\n ref.current.style.transform = \"\";\n\n listenOnce(ref.current, \"transitionend\", () => {\n ref.current.style.transition = \"\";\n });\n });\n });\n break;\n }\n default: {\n break;\n }\n }\n }\n : undefined,\n });\n}\n", "/* eslint-disable no-param-reassign */\n\nimport { listenOnce } from \"../utils\";\nimport { useStyleEffect } from \"./useStyleEffect\";\nimport { OFFSET_PX_CUPERTINO } from \"./useStyleEffectOffset\";\n\nexport function useStyleEffectSwipeBack({\n theme,\n dimRef,\n edgeRef,\n paperRef,\n hasEffect,\n onSwiped,\n}: {\n theme: \"android\" | \"cupertino\";\n dimRef: React.RefObject<HTMLDivElement>;\n edgeRef: React.RefObject<HTMLDivElement>;\n paperRef: React.RefObject<HTMLDivElement>;\n hasEffect?: boolean;\n onSwiped?: () => void;\n}) {\n useStyleEffect({\n styleName: \"swipe-back\",\n refs: [paperRef],\n effect: hasEffect\n ? ({ refs }) => {\n if (theme !== \"cupertino\") {\n return () => {};\n }\n\n if (!dimRef.current || !edgeRef.current || !paperRef.current) {\n return () => {};\n }\n\n const $dim = dimRef.current;\n const $edge = edgeRef.current;\n const $paper = paperRef.current;\n\n let x0: number | null = null;\n let t0: number | null = null;\n let x: number | null = null;\n\n let cachedRefs: Array<{\n style: {\n transform: string;\n transition: string;\n };\n parentElement?: {\n style: {\n display: string;\n };\n };\n }> = [];\n\n const resetState = () => {\n x0 = null;\n t0 = null;\n x = null;\n cachedRefs = [];\n };\n\n let _rAFLock = false;\n\n function movePaper(dx: number) {\n if (!_rAFLock) {\n _rAFLock = true;\n\n requestAnimationFrame(() => {\n const p = dx / $paper.clientWidth;\n\n $dim.style.opacity = `${1 - p}`;\n $dim.style.transition = \"0s\";\n\n $paper.style.overflowY = \"hidden\";\n $paper.style.transform = `translateX(${dx}px)`;\n $paper.style.transition = \"0s\";\n\n refs.forEach((ref: React.RefObject<HTMLElement>) => {\n if (!ref.current) {\n return;\n }\n\n ref.current.style.transform = `translateX(${\n -1 * (1 - p) * OFFSET_PX_CUPERTINO\n }px)`;\n ref.current.style.transition = \"0s\";\n\n if (ref.current.parentElement?.style.display === \"none\") {\n ref.current.parentElement.style.display = \"block\";\n }\n });\n\n _rAFLock = false;\n });\n }\n }\n\n function resetPaper({ swiped }: { swiped: boolean }) {\n requestAnimationFrame(() => {\n $dim.style.opacity = `${swiped ? 0 : 1}`;\n $dim.style.transition = \"var(--stackflow-transition-duration)\";\n\n $paper.style.overflowY = \"hidden\";\n $paper.style.transform = `translateX(${swiped ? \"100%\" : \"0\"})`;\n $paper.style.transition = \"var(--stackflow-transition-duration)\";\n\n refs.forEach((ref: React.RefObject<HTMLElement>) => {\n if (!ref.current) {\n return;\n }\n\n ref.current.style.transition = `var(--stackflow-transition-duration)`;\n ref.current.style.transform = `translateX(${\n swiped ? \"0\" : `-${OFFSET_PX_CUPERTINO / 16}rem`\n })`;\n });\n\n listenOnce($paper, \"transitionend\", () => {\n $dim.style.opacity = \"\";\n $paper.style.overflowY = \"\";\n $paper.style.transform = \"\";\n\n refs.forEach((ref: React.RefObject<HTMLElement>, i) => {\n if (!ref.current) {\n return;\n }\n\n const cachedRef = cachedRefs[i];\n\n if (swiped) {\n ref.current.style.transition = \"\";\n ref.current.style.transform = \"\";\n\n if (ref.current.parentElement) {\n ref.current.parentElement.style.display = \"\";\n }\n } else if (cachedRef) {\n ref.current.style.transition = cachedRef.style.transition;\n ref.current.style.transform = cachedRef.style.transform;\n\n if (ref.current.parentElement && cachedRef.parentElement) {\n ref.current.parentElement.style.display =\n cachedRef.parentElement.style.display;\n }\n }\n });\n });\n });\n }\n\n const onTouchStart = (e: TouchEvent) => {\n const { activeElement } = document as any;\n\n activeElement?.blur?.();\n // eslint-disable-next-line no-multi-assign\n x0 = x = e.touches[0].clientX;\n t0 = Date.now();\n\n cachedRefs = refs.map((ref) => {\n if (!ref.current) {\n return {\n style: {\n transform: \"\",\n transition: \"\",\n },\n };\n }\n\n return {\n style: {\n transform: ref.current.style.transform,\n transition: ref.current.style.transition,\n },\n parentElement: ref.current.parentElement\n ? {\n style: {\n display: ref.current.parentElement.style.display,\n },\n }\n : undefined,\n };\n });\n };\n\n const onTouchMove = (e: TouchEvent) => {\n if (!x0) {\n resetState();\n return;\n }\n\n x = e.touches[0].clientX;\n\n movePaper(x - x0);\n };\n\n const onTouchEnd = () => {\n if (!x0 || !t0 || !x) {\n resetState();\n return;\n }\n\n const t = Date.now();\n const v = (x - x0) / (t - t0);\n const swiped = v > 1 || x / $paper.clientWidth > 0.4;\n\n if (swiped) {\n onSwiped?.();\n }\n\n resetState();\n resetPaper({ swiped });\n };\n\n $edge.addEventListener(\"touchstart\", onTouchStart, { passive: true });\n $edge.addEventListener(\"touchmove\", onTouchMove, { passive: true });\n $edge.addEventListener(\"touchend\", onTouchEnd, { passive: true });\n $edge.addEventListener(\"touchcancel\", onTouchEnd, { passive: true });\n\n return () => {\n $edge.removeEventListener(\"touchstart\", onTouchStart);\n $edge.removeEventListener(\"touchmove\", onTouchMove);\n $edge.removeEventListener(\"touchend\", onTouchEnd);\n $edge.removeEventListener(\"touchcancel\", onTouchEnd);\n };\n }\n : undefined,\n });\n}\n", "import { createContext, useContext } from \"react\";\n\nconst ThemeContext = createContext<\"android\" | \"cupertino\">(\"android\");\n\nexport const ThemeProvider = ThemeContext.Provider;\n\nexport function useTheme() {\n return useContext(ThemeContext);\n}\n", "import 'src/theme.css.ts.vanilla.css?source=#H4sIAAAAAAAAE+WT3UrEMBCF7/cpAt4obEKzWhYiPomI5GfaBjedMJnisuK7W0X3akvrpZUEQsI5h5l8jCFE3grzeTwGy1YWtv6lOeCrdLZEL4couYMED7YPhDE8ibeNEPKSzo0vLeHQB+nxgGTEVdM091PyENMFC7XOXldb8b2Vrm8mE2zO44WkQwpAUwnVfnFCiScwQufjrKGD2HZsxK2qCdKsPHrsz5+y0+O6m/UwHHmpxyEzJlk6AP5phmyIQxnb+SrwfbMEsh8yEMce/wHmStW/AL1T+z9DWj1rjzmnU7V+iisd1jNCvX6Eqx3ED1vu8AteBwAA';\nexport var android = '_1coppmz0';\nexport var cupertino = '_1coppmz1';\nexport var globalVars = {backgroundColor:'var(--stackflow-basic-ui-background-color)',dimBackgroundColor:'var(--stackflow-basic-ui-dim-background-color)',appBar:{borderColor:'var(--stackflow-basic-ui-app-bar-border-color)',borderSize:'var(--stackflow-basic-ui-app-bar-border-size)',height:'var(--stackflow-basic-ui-app-bar-height)',iconColor:'var(--stackflow-basic-ui-app-bar-icon-color)',textColor:'var(--stackflow-basic-ui-app-bar-text-color)'},bottomSheet:{borderRadius:'var(--stackflow-basic-ui-bottom-sheet-border-radius)'},modal:{borderRadius:'var(--stackflow-basic-ui-bottom-sheet-border-radius)'}};\nexport var rootAndroid = ':root[data-stackflow-basic-ui-theme=android]';\nexport var rootCupertino = ':root[data-stackflow-basic-ui-theme=cupertino]';", "/* eslint-disable no-param-reassign */\n\nimport { useActions, useActivity } from \"@stackflow/react\";\nimport { assignInlineVars } from \"@vanilla-extract/dynamic\";\nimport React, { useRef } from \"react\";\n\nimport {\n useLazy,\n useStyleEffectHide,\n useStyleEffectOffset,\n useStyleEffectSwipeBack,\n useTheme,\n} from \"../hooks\";\nimport type { GlobalVars } from \"../theme.css\";\nimport { globalVars } from \"../theme.css\";\nimport type { PropOf } from \"../utils\";\nimport { compactMap } from \"../utils\";\nimport AppBar from \"./AppBar\";\nimport * as css from \"./AppScreen.css\";\n\ntype AppScreenProps = Partial<\n Pick<GlobalVars, \"backgroundColor\" | \"dimBackgroundColor\">\n> & {\n appBar?: Omit<PropOf<typeof AppBar>, \"theme\" | \"ref\" | \"key\">;\n children: React.ReactNode;\n};\nconst AppScreen: React.FC<AppScreenProps> = ({ appBar, children }) => {\n const theme = useTheme();\n const activity = useActivity();\n const { pop } = useActions();\n\n const appScreenRef = useRef<HTMLDivElement>(null);\n const dimRef = useRef<HTMLDivElement>(null);\n const paperRef = useRef<HTMLDivElement>(null);\n const edgeRef = useRef<HTMLDivElement>(null);\n const appBarRef = useRef<HTMLDivElement>(null);\n\n useStyleEffectHide({\n refs: [appScreenRef],\n hasEffect: true,\n });\n useStyleEffectOffset({\n theme,\n refs: theme === \"cupertino\" ? [paperRef] : [paperRef, appBarRef],\n hasEffect: true,\n });\n useStyleEffectSwipeBack({\n theme,\n dimRef,\n edgeRef,\n paperRef,\n hasEffect: true,\n onSwiped() {\n pop();\n },\n });\n\n const isRoot = activity.zIndex === 0;\n const hasAppBar = !!appBar;\n\n const zIndexBase = activity.zIndex * 5;\n const zIndexDim = zIndexBase;\n const zIndexPaper = zIndexBase + (theme === \"cupertino\" && hasAppBar ? 1 : 3);\n const zIndexEdge = zIndexBase + 4;\n const zIndexAppBar = zIndexBase + 7;\n\n return (\n <div\n ref={appScreenRef}\n className={css.appScreen({\n transitionState: useLazy(activity.transitionState),\n })}\n style={assignInlineVars(\n compactMap({\n [globalVars.appBar.height]: appBar?.height,\n [css.vars.zIndexes.dim]: `${zIndexDim}`,\n [css.vars.zIndexes.paper]: `${zIndexPaper}`,\n [css.vars.zIndexes.edge]: `${zIndexEdge}`,\n [css.vars.zIndexes.appBar]: `${zIndexAppBar}`,\n [css.vars.transitionDuration]:\n activity.transitionState === \"enter-active\" ||\n activity.transitionState === \"exit-active\"\n ? `var(--stackflow-transition-duration)`\n : \"0ms\",\n }),\n )}\n >\n <div className={css.dim} ref={dimRef} />\n <div\n key={activity.id}\n className={css.paper({\n hasAppBar,\n })}\n ref={paperRef}\n >\n {children}\n </div>\n {!isRoot && theme === \"cupertino\" && (\n <div className={css.edge({ hasAppBar })} ref={edgeRef} />\n )}\n {appBar && <AppBar {...appBar} ref={appBarRef} />}\n </div>\n );\n};\n\nexport default AppScreen;\n", "import { useActions, useActivity } from \"@stackflow/react\";\nimport { assignInlineVars } from \"@vanilla-extract/dynamic\";\nimport React, { useRef } from \"react\";\n\nimport { IconBack, IconClose } from \"../assets\";\nimport { useMaxWidth, useTheme } from \"../hooks\";\nimport type { GlobalVars } from \"../theme.css\";\nimport { globalVars } from \"../theme.css\";\nimport { compactMap, noop } from \"../utils\";\nimport * as css from \"./AppBar.css\";\nimport * as appScreenCss from \"./AppScreen.css\";\n\ntype AppBarProps = Partial<\n Pick<\n GlobalVars[\"appBar\"],\n \"borderColor\" | \"borderSize\" | \"height\" | \"iconColor\" | \"textColor\"\n >\n> & {\n title?: React.ReactNode;\n appendLeft?: () => React.ReactNode;\n appendRight?: () => React.ReactNode;\n backButton?:\n | {\n renderIcon?: () => React.ReactNode;\n onClick?: (e: React.MouseEvent<HTMLButtonElement>) => void;\n }\n | {\n render?: () => React.ReactNode;\n };\n closeButton?:\n | {\n renderIcon?: () => React.ReactNode;\n onClick: (e: React.MouseEvent<HTMLButtonElement>) => void;\n }\n | {\n render?: () => React.ReactNode;\n };\n closeButtonLocation?: \"left\" | \"right\";\n border?: boolean;\n};\nconst AppBar = React.forwardRef<HTMLDivElement, AppBarProps>(\n (\n {\n title,\n appendLeft,\n appendRight,\n backButton,\n closeButton,\n closeButtonLocation = \"left\",\n border = true,\n iconColor,\n textColor,\n borderColor,\n borderSize,\n height,\n },\n ref,\n ) => {\n const actions = useActions();\n const activity = useActivity();\n\n const theme = useTheme();\n\n const centerRef = useRef<any>(null);\n\n const { maxWidth } = useMaxWidth({\n outerRef: ref,\n innerRef: centerRef,\n enable: theme === \"cupertino\",\n });\n\n const onBackClick = (e: React.MouseEvent<HTMLButtonElement>) => {\n if (backButton && \"onClick\" in backButton && backButton.onClick) {\n backButton.onClick(e);\n }\n\n if (!e.defaultPrevented) {\n actions.pop();\n }\n };\n\n const isCloseButtonVisible =\n activity.zIndex === 0 ||\n (activity.zIndex === 1 &&\n activity.transitionState === \"enter-active\" &&\n activity.pushedBy.name === \"Replaced\");\n\n const renderBackButton = () => {\n if (isCloseButtonVisible) {\n return null;\n }\n\n if (!backButton) {\n return (\n <button\n type=\"button\"\n className={css.backButton}\n onClick={onBackClick}\n >\n <IconBack />\n </button>\n );\n }\n\n if (\"render\" in backButton && backButton.render) {\n return backButton.render?.();\n }\n\n return (\n <button type=\"button\" className={css.backButton} onClick={onBackClick}>\n {\"renderIcon\" in backButton && backButton.renderIcon ? (\n backButton.renderIcon()\n ) : (\n <IconBack />\n )}\n </button>\n );\n };\n\n const renderCloseButton = () => {\n if (!closeButton || !isCloseButtonVisible) {\n return null;\n }\n if (\"render\" in closeButton && closeButton.render) {\n return closeButton.render();\n }\n\n return (\n <button\n type=\"button\"\n className={css.closeButton}\n onClick={\"onClick\" in closeButton ? closeButton.onClick : noop}\n >\n {\"renderIcon\" in closeButton && closeButton.renderIcon ? (\n closeButton.renderIcon()\n ) : (\n <IconClose />\n )}\n </button>\n );\n };\n\n const hasLeft = !!(\n (closeButtonLocation === \"left\" && closeButton) ||\n backButton ||\n appendLeft\n );\n\n return (\n <div\n ref={ref}\n className={css.appBar({\n border,\n })}\n style={assignInlineVars(\n compactMap({\n [globalVars.appBar.iconColor]: iconColor,\n [globalVars.appBar.textColor]: textColor,\n [globalVars.appBar.borderColor]: borderColor,\n [globalVars.appBar.borderSize]: borderSize,\n [globalVars.appBar.height]: height,\n [appScreenCss.vars.appBar.center.mainWidth]: `${maxWidth}px`,\n }),\n )}\n >\n <div className={css.left}>\n {closeButtonLocation === \"left\" && renderCloseButton()}\n {renderBackButton()}\n {appendLeft?.()}\n </div>\n <div ref={centerRef} className={css.center}>\n <div\n className={css.centerMain({\n hasLeft,\n })}\n >\n {typeof title === \"string\" ? (\n <div className={css.centerText}>{title}</div>\n ) : (\n title\n )}\n </div>\n </div>\n <div className={css.right}>\n {appendRight?.()}\n {closeButtonLocation === \"right\" && renderCloseButton()}\n </div>\n </div>\n );\n },\n);\n\nexport default AppBar;\n", "import React from \"react\";\n\nconst IconBack: React.FC<{\n className?: string;\n}> = (props) => (\n <svg\n className={props.className}\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M11.5659 5.56564C11.8783 5.25322 11.8783 4.74669 11.5659 4.43427C11.2535 4.12185 10.7469 4.12185 10.4345 4.43427L3.43451 11.4343C3.12209 11.7467 3.12209 12.2532 3.43451 12.5656L10.4345 19.5656C10.7469 19.8781 11.2535 19.8781 11.5659 19.5656C11.8783 19.2532 11.8783 18.7467 11.5659 18.4343L5.93157 12.8H20.0002C20.442 12.8 20.8002 12.4418 20.8002 12C20.8002 11.5581 20.442 11.2 20.0002 11.2H5.93157L11.5659 5.56564Z\"\n fill=\"currentColor\"\n />\n </svg>\n);\n\nexport default IconBack;\n", "import React from \"react\";\n\nconst IconClose: React.FC<{\n className?: string;\n}> = (props) => (\n <svg\n className={props.className}\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M6.56588 5.43433C6.25346 5.12191 5.74693 5.12191 5.43451 5.43433C5.12209 5.74675 5.12209 6.25328 5.43451 6.5657L10.8688 12L5.43451 17.4343C5.12209 17.7467 5.12209 18.2533 5.43451 18.5657C5.74693 18.8781 6.25346 18.8781 6.56588 18.5657L12.0002 13.1314L17.4345 18.5657C17.7469 18.8781 18.2535 18.8781 18.5659 18.5657C18.8783 18.2533 18.8783 17.7467 18.5659 17.4343L13.1316 12L18.5659 6.5657C18.8783 6.25328 18.8783 5.74675 18.5659 5.43433C18.2535 5.12191 17.7469 5.12191 17.4345 5.43433L12.0002 10.8686L6.56588 5.43433Z\"\n fill=\"currentColor\"\n />\n <path\n d=\"M6.56588 5.43433C6.25346 5.12191 5.74693 5.12191 5.43451 5.43433C5.12209 5.74675 5.12209 6.25328 5.43451 6.5657L10.8688 12L5.43451 17.4343C5.12209 17.7467 5.12209 18.2533 5.43451 18.5657C5.74693 18.8781 6.25346 18.8781 6.56588 18.5657L12.0002 13.1314L17.4345 18.5657C17.7469 18.8781 18.2535 18.8781 18.5659 18.5657C18.8783 18.2533 18.8783 17.7467 18.5659 17.4343L13.1316 12L18.5659 6.5657C18.8783 6.25328 18.8783 5.74675 18.5659 5.43433C18.2535 5.12191 17.7469 5.12191 17.4345 5.43433L12.0002 10.8686L6.56588 5.43433Z\"\n fill=\"currentColor\"\n />\n </svg>\n);\n\nexport default IconClose;\n", "import 'src/styles/f.css.ts.vanilla.css?source=LmRodGh4cTAgewogIHdpZHRoOiAxMDAlOwp9Ci5kaHRoeHExIHsKICBoZWlnaHQ6IDEwMCU7Cn0KLmRodGh4cTIgewogIHRvcDogMDsKfQouZGh0aHhxMyB7CiAgbGVmdDogMDsKfQouZGh0aHhxNCB7CiAgcG9zaXRpb246IGFic29sdXRlOwp9Ci5kaHRoeHE1IHsKICBwb3NpdGlvbjogcmVsYXRpdmU7Cn0KLmRodGh4cTcgewogIGRpc3BsYXk6IGZsZXg7Cn0KLmRodGh4cTggewogIGFsaWduLWl0ZW1zOiBjZW50ZXI7Cn0KLmRodGh4cTkgewogIGFsaWduLWl0ZW1zOiBmbGV4LWVuZDsKfQouZGh0aHhxYSB7CiAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7Cn0KLmRodGh4cWIgewogIG92ZXJmbG93OiBoaWRkZW47Cn0KLmRodGh4cWMgewogIHdoaXRlLXNwYWNlOiBub3dyYXA7Cn0KLmRodGh4cWQgewogIHRleHQtYWxpZ246IGNlbnRlcjsKfQouZGh0aHhxZSB7CiAgY3Vyc29yOiBwb2ludGVyOwogIC13ZWJraXQtdGFwLWhpZ2hsaWdodC1jb2xvcjogdHJhbnNwYXJlbnQ7Cn0KLmRodGh4cWYgewogIGJveC1zaXppbmc6IGJvcmRlci1ib3g7Cn0KLmRodGh4cWcgewogIGJveC1zaXppbmc6IGNvbnRlbnQtYm94Owp9Ci5kaHRoeHFoIHsKICBhcHBlYXJhbmNlOiBub25lOwogIGJvcmRlcjogMDsKICBwYWRkaW5nOiAwOwogIGJhY2tncm91bmQ6IG5vbmU7Cn0=';\nimport 'src/theme.css.ts.vanilla.css?source=#H4sIAAAAAAAAE+WT3UrEMBCF7/cpAt4obEKzWhYiPomI5GfaBjedMJnisuK7W0X3akvrpZUEQsI5h5l8jCFE3grzeTwGy1YWtv6lOeCrdLZEL4couYMED7YPhDE8ibeNEPKSzo0vLeHQB+nxgGTEVdM091PyENMFC7XOXldb8b2Vrm8mE2zO44WkQwpAUwnVfnFCiScwQufjrKGD2HZsxK2qCdKsPHrsz5+y0+O6m/UwHHmpxyEzJlk6AP5phmyIQxnb+SrwfbMEsh8yEMce/wHmStW/AL1T+z9DWj1rjzmnU7V+iisd1jNCvX6Eqx3ED1vu8AteBwAA';\nimport 'src/components/AppScreen.css.ts.vanilla.css?source=#H4sIAAAAAAAAE61VYW+bMBD9nl/hL5OIFkem7brF0f7HpqmaDtsBE2Nbxkm2Vv3vNVCaAKGCrRIfQPf87t0937H+HXO1u7u9u0dPC4QSYPvUmYPmmBllHEVHcBHGpQ+BnTInnEApGT5IzGWB+/DldvG8WLeUX+dSvk/3rabzDnQpvTS6JWrjpAtnZ/jOuII2rwq8+BHFhHzqomWNNhaY9H8pItvw9Yil5uJPP0/cnmTG2uKRoDPJClFnjP/FwcO1An0mCvEdNHdG8gfUy54JmWaeopg4UWw7raNISS3A4dQBl0L7aJ4vK+TSBCKyQq/Pslv+pq/lrRNxBwcTcckojvRMmobLm+BRuLrYEC+ZM0pVXcInkeylx2/RJiR1Gjw3B5a94+VNtw05pS1bQ5KAqzNzWVoFIa02WnTsj88V5NPsZwcrnJfaXFyAfOJlHeTcfEj6zTQlZFQGfIgM+CcZZHbu4QDmV8b/WvKfUT2cowLm2zHUMjDjcsbGZI33ZL41Q0kDY2ZJag7u64MWOA+Tib2xFDFQbHyRgbXhw+FmLS7RZ8SMDriw/ErYCQxOQJjqUviKrVpo/0kv9HGM+aIOVddxktxnofz1zZfXZT2yYW67p4vmXlfypirbXvwa6pKqhYDw5POVgBfwQmEH5wcAAA==';\nimport 'src/components/AppBar.css.ts.vanilla.css?source=#H4sIAAAAAAAAE61Vy47aMBTdz1d4UwmqOnKAwExG3XTRXVfdtKqq0SVxwB3HtmzzrPrvtZ3A4AkRlOku8X2de+4reUp3z2OYZAT9vkNoSdliaXO0Bj3A2FgonisuN3gOhhV4xTAo5X40bhSHj85GQVkyscBWqhwVUjgrYQcGKopBU8BMGGq9tKtNxbpXce/+S7o9YHlKS15NxpOJE/65S57SQipV71OUHDP4gHItpf1RgoVz2O2S1vRjsVJUWybkzxPTkLyShlkmRY5gbiRfWdoN1YCYvzFq10sAYDUIU0ld580nB0u/DVJC3sVJk38OD6LUkpWdlKWCgtldjshjT/zvLr6m9fAobymKq0LOAGwkD2/C2vURw077YfdDgv8ACd4EqTFMg+FcbrFZQik3OQoTgIjaogJ4Mbg4hXOpS6qxYXs6RO8RToeIXJ7d1qqQXOoY0aiZg2ZEXVMgkmSu+LFOTmtld0GzZEZxcEkLKWikNQ7yEOKKbcLc2jjiifus5RWNCamNF25YaZc5GiWjBtrL0holsw7acQ6FZWv6qtuTUV8cYiL7LBhW3C+iNJJMg6RFE09DFrK4NnlLtzYuRmfKp7dOeQTSLxIP7NfKWFbtXExhqXDE+fS8V21PNzSnlZOlLcmVUw6N5p6S9H52IJ8zQfGhAmmSHXU37dtc8vLx0OdsHxqr7UD31LfMr8z43DKf9i7zk4b1KfsH4GwhMLO0Nu54OTaoPkvRiyiUK5idvoaUK6gZd859aTnFZmec3w/ok+Po+QsUX8P/Z6fZIWlKyGuSD/yGKmRN5c6tlQHOwn247Xhfd7QvHOvzTTu7tWlnp1uobUOSjLvDfd9cTV8Quabae3cwOWfKMPOKTyaWVLMu88f3E78PfWsQoRr0gokWFKysjA0v7MYORw+3ctQD0X+4WH8BFY3tFtYJAAA=';\nimport { createRuntimeFn as _7a468 } from '@vanilla-extract/recipes/createRuntimeFn';\nexport var appBar = _7a468({defaultClassName:'_1yk3a450 dhthxq4 dhthxq8 dhthxq7 dhthxq0 dhthxqg _1dlf4347',variantClassNames:{border:{true:'_1yk3a451'}},defaultVariants:{},compoundVariants:[]});\nexport var backButton = '_1yk3a453 dhthxq8 dhthxq7 dhthxqa dhthxqe dhthxqh';\nexport var center = '_1yk3a455 dhthxq8 dhthxq7';\nexport var centerMain = _7a468({defaultClassName:'_1yk3a456',variantClassNames:{hasLeft:{true:'_1yk3a457'}},defaultVariants:{},compoundVariants:[]});\nexport var centerText = '_1yk3a458 dhthxqb dhthxqc dhthxq0';\nexport var closeButton = '_1yk3a453 dhthxq8 dhthxq7 dhthxqa dhthxqe dhthxqh';\nexport var left = '_1yk3a452 dhthxq8 dhthxq7 dhthxq1';\nexport var right = '_1yk3a459 dhthxq8 dhthxq7 dhthxq1 dhthxq5';", "import 'src/styles/f.css.ts.vanilla.css?source=LmRodGh4cTAgewogIHdpZHRoOiAxMDAlOwp9Ci5kaHRoeHExIHsKICBoZWlnaHQ6IDEwMCU7Cn0KLmRodGh4cTIgewogIHRvcDogMDsKfQouZGh0aHhxMyB7CiAgbGVmdDogMDsKfQouZGh0aHhxNCB7CiAgcG9zaXRpb246IGFic29sdXRlOwp9Ci5kaHRoeHE1IHsKICBwb3NpdGlvbjogcmVsYXRpdmU7Cn0KLmRodGh4cTcgewogIGRpc3BsYXk6IGZsZXg7Cn0KLmRodGh4cTggewogIGFsaWduLWl0ZW1zOiBjZW50ZXI7Cn0KLmRodGh4cTkgewogIGFsaWduLWl0ZW1zOiBmbGV4LWVuZDsKfQouZGh0aHhxYSB7CiAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7Cn0KLmRodGh4cWIgewogIG92ZXJmbG93OiBoaWRkZW47Cn0KLmRodGh4cWMgewogIHdoaXRlLXNwYWNlOiBub3dyYXA7Cn0KLmRodGh4cWQgewogIHRleHQtYWxpZ246IGNlbnRlcjsKfQouZGh0aHhxZSB7CiAgY3Vyc29yOiBwb2ludGVyOwogIC13ZWJraXQtdGFwLWhpZ2hsaWdodC1jb2xvcjogdHJhbnNwYXJlbnQ7Cn0KLmRodGh4cWYgewogIGJveC1zaXppbmc6IGJvcmRlci1ib3g7Cn0KLmRodGh4cWcgewogIGJveC1zaXppbmc6IGNvbnRlbnQtYm94Owp9Ci5kaHRoeHFoIHsKICBhcHBlYXJhbmNlOiBub25lOwogIGJvcmRlcjogMDsKICBwYWRkaW5nOiAwOwogIGJhY2tncm91bmQ6IG5vbmU7Cn0=';\nimport 'src/theme.css.ts.vanilla.css?source=#H4sIAAAAAAAAE+WT3UrEMBCF7/cpAt4obEKzWhYiPomI5GfaBjedMJnisuK7W0X3akvrpZUEQsI5h5l8jCFE3grzeTwGy1YWtv6lOeCrdLZEL4couYMED7YPhDE8ibeNEPKSzo0vLeHQB+nxgGTEVdM091PyENMFC7XOXldb8b2Vrm8mE2zO44WkQwpAUwnVfnFCiScwQufjrKGD2HZsxK2qCdKsPHrsz5+y0+O6m/UwHHmpxyEzJlk6AP5phmyIQxnb+SrwfbMEsh8yEMce/wHmStW/AL1T+z9DWj1rjzmnU7V+iisd1jNCvX6Eqx3ED1vu8AteBwAA';\nimport 'src/components/AppScreen.css.ts.vanilla.css?source=#H4sIAAAAAAAAE61VYW+bMBD9nl/hL5OIFkem7brF0f7HpqmaDtsBE2Nbxkm2Vv3vNVCaAKGCrRIfQPf87t0937H+HXO1u7u9u0dPC4QSYPvUmYPmmBllHEVHcBHGpQ+BnTInnEApGT5IzGWB+/DldvG8WLeUX+dSvk/3rabzDnQpvTS6JWrjpAtnZ/jOuII2rwq8+BHFhHzqomWNNhaY9H8pItvw9Yil5uJPP0/cnmTG2uKRoDPJClFnjP/FwcO1An0mCvEdNHdG8gfUy54JmWaeopg4UWw7raNISS3A4dQBl0L7aJ4vK+TSBCKyQq/Pslv+pq/lrRNxBwcTcckojvRMmobLm+BRuLrYEC+ZM0pVXcInkeylx2/RJiR1Gjw3B5a94+VNtw05pS1bQ5KAqzNzWVoFIa02WnTsj88V5NPsZwcrnJfaXFyAfOJlHeTcfEj6zTQlZFQGfIgM+CcZZHbu4QDmV8b/WvKfUT2cowLm2zHUMjDjcsbGZI33ZL41Q0kDY2ZJag7u64MWOA+Tib2xFDFQbHyRgbXhw+FmLS7RZ8SMDriw/ErYCQxOQJjqUviKrVpo/0kv9HGM+aIOVddxktxnofz1zZfXZT2yYW67p4vmXlfypirbXvwa6pKqhYDw5POVgBfwQmEH5wcAAA==';\nimport { createRuntimeFn as _7a468 } from '@vanilla-extract/recipes/createRuntimeFn';\nexport var allTransitions = '_1dlf4348';\nexport var appScreen = _7a468({defaultClassName:'dhthxq4 dhthxq0 dhthxq1 dhthxq2 dhthxq3 dhthxqb',variantClassNames:{transitionState:{'enter-active':'_1dlf4349','enter-done':'_1dlf434a','exit-active':'_1dlf434b','exit-done':'_1dlf434c'}},defaultVariants:{},compoundVariants:[]});\nexport var background = '_1dlf4347';\nexport var dim = '_1dlf434i dhthxq4 dhthxq0 dhthxq1 dhthxq2 dhthxq3 _1dlf4346 _1dlf4348';\nexport var edge = _7a468({defaultClassName:'_1dlf434l dhthxq4 dhthxq2 dhthxq3 dhthxq1',variantClassNames:{hasAppBar:{true:'_1dlf434m'}},defaultVariants:{},compoundVariants:[]});\nexport var enterActive = '_1dlf4349';\nexport var enterDone = '_1dlf434a';\nexport var exitActive = '_1dlf434b';\nexport var exitDone = '_1dlf434c';\nexport var paper = _7a468({defaultClassName:'_1dlf434j dhthxq4 dhthxq0 dhthxq1 dhthxq2 dhthxq3 _1dlf4347 _1dlf4348',variantClassNames:{hasAppBar:{true:'_1dlf434k dhthxqf'}},defaultVariants:{},compoundVariants:[]});\nexport var vars = {transitionDuration:'var(--_1dlf4340)',zIndexes:{dim:'var(--_1dlf4341)',paper:'var(--_1dlf4342)',edge:'var(--_1dlf4343)',appBar:'var(--_1dlf4344)'},appBar:{center:{mainWidth:'var(--_1dlf4345)'}}};", "/* eslint-disable jsx-a11y/no-static-element-interactions, jsx-a11y/click-events-have-key-events */\n\nimport { useActions, useActivity } from \"@stackflow/react\";\nimport { assignInlineVars } from \"@vanilla-extract/dynamic\";\nimport React, { useRef } from \"react\";\n\nimport { useLazy, useStyleEffect } from \"../hooks\";\nimport type { GlobalVars } from \"../theme.css\";\nimport { globalVars } from \"../theme.css\";\nimport { compactMap } from \"../utils\";\nimport * as css from \"./BottomSheet.css\";\n\ntype BottomSheetProps = Partial<\n Pick<GlobalVars, \"backgroundColor\" | \"dimBackgroundColor\">\n> &\n Partial<GlobalVars[\"bottomSheet\"]> & {\n children: React.ReactNode;\n };\nconst BottomSheet: React.FC<BottomSheetProps> = ({\n borderRadius = \"1rem\",\n backgroundColor,\n dimBackgroundColor,\n children,\n}) => {\n const activity = useActivity();\n const { pop } = useActions();\n\n const containerRef = useRef<HTMLDivElement>(null);\n const paperRef = useRef<HTMLDivElement>(null);\n\n useStyleEffect({\n styleName: \"hide\",\n refs: [containerRef],\n });\n useStyleEffect({\n styleName: \"offset\",\n refs: [paperRef],\n });\n useStyleEffect({\n styleName: \"swipe-back\",\n refs: [paperRef],\n });\n\n const popLock = useRef(false);\n\n const onDimClick = () => {\n if (popLock.current) {\n return;\n }\n\n pop();\n popLock.current = true;\n };\n const onPaperClick: React.MouseEventHandler = (e) => {\n e.stopPropagation();\n };\n\n const zIndexBase = activity.zIndex * 5 + 3;\n const zIndexPaper = activity.zIndex * 5 + 4;\n\n return (\n <div\n className={css.container({\n transitionState: useLazy(activity.transitionState),\n })}\n ref={containerRef}\n style={assignInlineVars(\n compactMap({\n [globalVars.bottomSheet.borderRadius]: borderRadius,\n [globalVars.backgroundColor]: backgroundColor,\n [globalVars.dimBackgroundColor]: dimBackgroundColor,\n [css.vars.zIndexes.dim]: `${zIndexBase}`,\n [css.vars.zIndexes.paper]: `${zIndexPaper}`,\n [css.vars.transitionDuration]:\n activity.transitionState === \"enter-active\" ||\n activity.transitionState === \"exit-active\"\n ? `var(--stackflow-transition-duration)`\n : \"0ms\",\n }),\n )}\n >\n <div className={css.dim} ref={paperRef} onClick={onDimClick}>\n <div className={css.paper} onClick={onPaperClick}>\n {children}\n </div>\n </div>\n </div>\n );\n};\n\nexport default BottomSheet;\n", "import 'src/styles/f.css.ts.vanilla.css?source=LmRodGh4cTAgewogIHdpZHRoOiAxMDAlOwp9Ci5kaHRoeHExIHsKICBoZWlnaHQ6IDEwMCU7Cn0KLmRodGh4cTIgewogIHRvcDogMDsKfQouZGh0aHhxMyB7CiAgbGVmdDogMDsKfQouZGh0aHhxNCB7CiAgcG9zaXRpb246IGFic29sdXRlOwp9Ci5kaHRoeHE1IHsKICBwb3NpdGlvbjogcmVsYXRpdmU7Cn0KLmRodGh4cTcgewogIGRpc3BsYXk6IGZsZXg7Cn0KLmRodGh4cTggewogIGFsaWduLWl0ZW1zOiBjZW50ZXI7Cn0KLmRodGh4cTkgewogIGFsaWduLWl0ZW1zOiBmbGV4LWVuZDsKfQouZGh0aHhxYSB7CiAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7Cn0KLmRodGh4cWIgewogIG92ZXJmbG93OiBoaWRkZW47Cn0KLmRodGh4cWMgewogIHdoaXRlLXNwYWNlOiBub3dyYXA7Cn0KLmRodGh4cWQgewogIHRleHQtYWxpZ246IGNlbnRlcjsKfQouZGh0aHhxZSB7CiAgY3Vyc29yOiBwb2ludGVyOwogIC13ZWJraXQtdGFwLWhpZ2hsaWdodC1jb2xvcjogdHJhbnNwYXJlbnQ7Cn0KLmRodGh4cWYgewogIGJveC1zaXppbmc6IGJvcmRlci1ib3g7Cn0KLmRodGh4cWcgewogIGJveC1zaXppbmc6IGNvbnRlbnQtYm94Owp9Ci5kaHRoeHFoIHsKICBhcHBlYXJhbmNlOiBub25lOwogIGJvcmRlcjogMDsKICBwYWRkaW5nOiAwOwogIGJhY2tncm91bmQ6IG5vbmU7Cn0=';\nimport 'src/theme.css.ts.vanilla.css?source=#H4sIAAAAAAAAE+WT3UrEMBCF7/cpAt4obEKzWhYiPomI5GfaBjedMJnisuK7W0X3akvrpZUEQsI5h5l8jCFE3grzeTwGy1YWtv6lOeCrdLZEL4couYMED7YPhDE8ibeNEPKSzo0vLeHQB+nxgGTEVdM091PyENMFC7XOXldb8b2Vrm8mE2zO44WkQwpAUwnVfnFCiScwQufjrKGD2HZsxK2qCdKsPHrsz5+y0+O6m/UwHHmpxyEzJlk6AP5phmyIQxnb+SrwfbMEsh8yEMce/wHmStW/AL1T+z9DWj1rjzmnU7V+iisd1jNCvX6Eqx3ED1vu8AteBwAA';\nimport 'src/components/BottomSheet.css.ts.vanilla.css?source=Ll8xaHQzOGgwMyB7CiAgdHJhbnNpdGlvbjogdmFyKC0tXzFodDM4aDAwKTsKfQouXzFodDM4aDA3IHsKICB0cmFuc2Zvcm06IHRyYW5zbGF0ZVgoMTAwJSk7Cn0KLl8xaHQzOGgwZCB7CiAgYmFja2dyb3VuZC1jb2xvcjogdmFyKC0tc3RhY2tmbG93LWJhc2ljLXVpLWRpbS1iYWNrZ3JvdW5kLWNvbG9yKTsKICB6LWluZGV4OiB2YXIoLS1fMWh0MzhoMDEpOwogIG9wYWNpdHk6IDA7Cn0KLl8xaHQzOGgwNCAuXzFodDM4aDBkLCAuXzFodDM4aDA1IC5fMWh0MzhoMGQgewogIG9wYWNpdHk6IDE7Cn0KLl8xaHQzOGgwNiAuXzFodDM4aDBkLCAuXzFodDM4aDA3IC5fMWh0MzhoMGQgewogIG9wYWNpdHk6IDA7Cn0KLl8xaHQzOGgwZSB7CiAgYmFja2dyb3VuZC1jb2xvcjogdmFyKC0tc3RhY2tmbG93LWJhc2ljLXVpLWJhY2tncm91bmQtY29sb3IpOwogIHdpZHRoOiAxMDAlOwogIGJvcmRlci1yYWRpdXM6IHZhcigtLXN0YWNrZmxvdy1iYXNpYy11aS1ib3R0b20tc2hlZXQtYm9yZGVyLXJhZGl1cykgdmFyKC0tc3RhY2tmbG93LWJhc2ljLXVpLWJvdHRvbS1zaGVldC1ib3JkZXItcmFkaXVzKSAwIDA7CiAgdHJhbnNmb3JtOiB0cmFuc2xhdGVZKDEwMCUpOwogIG9wYWNpdHk6IDA7Cn0KLl8xaHQzOGgwNCAuXzFodDM4aDBlLCAuXzFodDM4aDA1IC5fMWh0MzhoMGUgewogIHRyYW5zZm9ybTogdHJhbnNsYXRlWSgwKTsKICBvcGFjaXR5OiAxOwp9Ci5fMWh0MzhoMDYgLl8xaHQzOGgwZSwgLl8xaHQzOGgwNyAuXzFodDM4aDBlIHsKICB0cmFuc2Zvcm06IHRyYW5zbGF0ZVkoMTAwJSk7CiAgb3BhY2l0eTogMDsKfQ==';\nimport { createRuntimeFn as _7a468 } from '@vanilla-extract/recipes/createRuntimeFn';\nexport var container = _7a468({defaultClassName:'dhthxq4 dhthxq0 dhthxq1 dhthxq2 dhthxq3 dhthxqb',variantClassNames:{transitionState:{'enter-active':'_1ht38h04','enter-done':'_1ht38h05','exit-active':'_1ht38h06','exit-done':'_1ht38h07'}},defaultVariants:{},compoundVariants:[]});\nexport var dim = '_1ht38h0d dhthxq4 dhthxq0 dhthxq1 dhthxq2 dhthxq3 dhthxqb dhthxq9 dhthxq7 _1ht38h03';\nexport var enterActive = '_1ht38h04';\nexport var enterDone = '_1ht38h05';\nexport var exitActive = '_1ht38h06';\nexport var exitDone = '_1ht38h07';\nexport var paper = '_1ht38h0e dhthxqb _1ht38h03';\nexport var vars = {transitionDuration:'var(--_1ht38h00)',zIndexes:{dim:'var(--_1ht38h01)',paper:'var(--_1ht38h02)'}};", "/* eslint-disable jsx-a11y/no-static-element-interactions, jsx-a11y/click-events-have-key-events */\n\nimport { useActions, useActivity } from \"@stackflow/react\";\nimport { assignInlineVars } from \"@vanilla-extract/dynamic\";\nimport React, { useRef } from \"react\";\n\nimport { useLazy, useStyleEffect } from \"../hooks\";\nimport type { GlobalVars } from \"../theme.css\";\nimport { globalVars } from \"../theme.css\";\nimport { compactMap } from \"../utils\";\nimport * as css from \"./Modal.css\";\n\ntype ModalProps = Partial<\n Pick<GlobalVars, \"backgroundColor\" | \"dimBackgroundColor\">\n> &\n Partial<GlobalVars[\"modal\"]> & {\n children: React.ReactNode;\n };\nconst Modal: React.FC<ModalProps> = ({\n backgroundColor,\n dimBackgroundColor,\n borderRadius = \"1rem\",\n children,\n}) => {\n const activity = useActivity();\n const { pop } = useActions();\n\n const containerRef = useRef<HTMLDivElement>(null);\n const paperRef = useRef<HTMLDivElement>(null);\n\n useStyleEffect({\n styleName: \"hide\",\n refs: [containerRef],\n });\n useStyleEffect({\n styleName: \"offset\",\n refs: [paperRef],\n });\n useStyleEffect({\n styleName: \"swipe-back\",\n refs: [paperRef],\n });\n\n const popLock = useRef(false);\n\n const onDimClick = () => {\n if (popLock.current) {\n return;\n }\n\n pop();\n popLock.current = true;\n };\n const onPaperClick: React.MouseEventHandler = (e) => {\n e.stopPropagation();\n };\n\n const zIndexBase = activity.zIndex * 5 + 3;\n const zIndexPaper = activity.zIndex * 5 + 4;\n\n return (\n <div\n className={css.container({\n transitionState: useLazy(activity.transitionState),\n })}\n ref={containerRef}\n style={assignInlineVars(\n compactMap({\n [globalVars.bottomSheet.borderRadius]: borderRadius,\n [globalVars.backgroundColor]: backgroundColor,\n [globalVars.dimBackgroundColor]: dimBackgroundColor,\n [css.vars.zIndexes.dim]: `${zIndexBase}`,\n [css.vars.zIndexes.paper]: `${zIndexPaper}`,\n [css.vars.transitionDuration]:\n activity.transitionState === \"enter-active\" ||\n activity.transitionState === \"exit-active\"\n ? `var(--stackflow-transition-duration)`\n : \"0ms\",\n }),\n )}\n >\n <div className={css.dim} ref={paperRef} onClick={onDimClick}>\n <div className={css.paper} onClick={onPaperClick}>\n {children}\n </div>\n </div>\n </div>\n );\n};\n\nexport default Modal;\n", "import 'src/styles/f.css.ts.vanilla.css?source=LmRodGh4cTAgewogIHdpZHRoOiAxMDAlOwp9Ci5kaHRoeHExIHsKICBoZWlnaHQ6IDEwMCU7Cn0KLmRodGh4cTIgewogIHRvcDogMDsKfQouZGh0aHhxMyB7CiAgbGVmdDogMDsKfQouZGh0aHhxNCB7CiAgcG9zaXRpb246IGFic29sdXRlOwp9Ci5kaHRoeHE1IHsKICBwb3NpdGlvbjogcmVsYXRpdmU7Cn0KLmRodGh4cTcgewogIGRpc3BsYXk6IGZsZXg7Cn0KLmRodGh4cTggewogIGFsaWduLWl0ZW1zOiBjZW50ZXI7Cn0KLmRodGh4cTkgewogIGFsaWduLWl0ZW1zOiBmbGV4LWVuZDsKfQouZGh0aHhxYSB7CiAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7Cn0KLmRodGh4cWIgewogIG92ZXJmbG93OiBoaWRkZW47Cn0KLmRodGh4cWMgewogIHdoaXRlLXNwYWNlOiBub3dyYXA7Cn0KLmRodGh4cWQgewogIHRleHQtYWxpZ246IGNlbnRlcjsKfQouZGh0aHhxZSB7CiAgY3Vyc29yOiBwb2ludGVyOwogIC13ZWJraXQtdGFwLWhpZ2hsaWdodC1jb2xvcjogdHJhbnNwYXJlbnQ7Cn0KLmRodGh4cWYgewogIGJveC1zaXppbmc6IGJvcmRlci1ib3g7Cn0KLmRodGh4cWcgewogIGJveC1zaXppbmc6IGNvbnRlbnQtYm94Owp9Ci5kaHRoeHFoIHsKICBhcHBlYXJhbmNlOiBub25lOwogIGJvcmRlcjogMDsKICBwYWRkaW5nOiAwOwogIGJhY2tncm91bmQ6IG5vbmU7Cn0=';\nimport 'src/theme.css.ts.vanilla.css?source=#H4sIAAAAAAAAE+WT3UrEMBCF7/cpAt4obEKzWhYiPomI5GfaBjedMJnisuK7W0X3akvrpZUEQsI5h5l8jCFE3grzeTwGy1YWtv6lOeCrdLZEL4couYMED7YPhDE8ibeNEPKSzo0vLeHQB+nxgGTEVdM091PyENMFC7XOXldb8b2Vrm8mE2zO44WkQwpAUwnVfnFCiScwQufjrKGD2HZsxK2qCdKsPHrsz5+y0+O6m/UwHHmpxyEzJlk6AP5phmyIQxnb+SrwfbMEsh8yEMce/wHmStW/AL1T+z9DWj1rjzmnU7V+iisd1jNCvX6Eqx3ED1vu8AteBwAA';\nimport 'src/components/Modal.css.ts.vanilla.css?source=Ll81b3pnOGMzIHsKICB0cmFuc2l0aW9uOiB2YXIoLS1fNW96ZzhjMCk7Cn0KLl81b3pnOGM3IHsKICB0cmFuc2Zvcm06IHRyYW5zbGF0ZVgoMTAwJSk7Cn0KLl81b3pnOGNkIHsKICBiYWNrZ3JvdW5kLWNvbG9yOiB2YXIoLS1zdGFja2Zsb3ctYmFzaWMtdWktZGltLWJhY2tncm91bmQtY29sb3IpOwogIHotaW5kZXg6IHZhcigtLV81b3pnOGMxKTsKICBvcGFjaXR5OiAwOwp9Ci5fNW96ZzhjNCAuXzVvemc4Y2QsIC5fNW96ZzhjNSAuXzVvemc4Y2QgewogIG9wYWNpdHk6IDE7Cn0KLl81b3pnOGM2IC5fNW96ZzhjZCwgLl81b3pnOGM3IC5fNW96ZzhjZCB7CiAgb3BhY2l0eTogMDsKfQouXzVvemc4Y2UgewogIGJhY2tncm91bmQtY29sb3I6IHZhcigtLXN0YWNrZmxvdy1iYXNpYy11aS1iYWNrZ3JvdW5kLWNvbG9yKTsKICB3aWR0aDogMTAwJTsKICBtYXJnaW46IDAgMi41cmVtOwogIGJveC1zaGFkb3c6IDBweCAwLjYyNXJlbSAyLjM3NXJlbSByZ2JhKDAsIDAsIDAsIDAuMTUpLCAwcHggLjU2MjVyZW0gMi44NzVyZW0gcmdiYSgwLCAwLCAwLCAwLjEyKSwgMHB4IC4zMTI1cmVtIC45Mzc1cmVtIHJnYmEoMCwgMCwgMCwgMC4xKTsKICBib3JkZXItcmFkaXVzOiB2YXIoLS1zdGFja2Zsb3ctYmFzaWMtdWktYm90dG9tLXNoZWV0LWJvcmRlci1yYWRpdXMpOwogIHRyYW5zZm9ybTogc2NhbGUoMS4xKTsKICBvcGFjaXR5OiAwOwp9Ci5fNW96ZzhjNCAuXzVvemc4Y2UsIC5fNW96ZzhjNSAuXzVvemc4Y2UgewogIHRyYW5zZm9ybTogc2NhbGUoMSk7CiAgb3BhY2l0eTogMTsKfQouXzVvemc4YzYgLl81b3pnOGNlLCAuXzVvemc4YzcgLl81b3pnOGNlIHsKICB0cmFuc2Zvcm06IHNjYWxlKDEuMSk7CiAgb3BhY2l0eTogMDsKfQ==';\nimport { createRuntimeFn as _7a468 } from '@vanilla-extract/recipes/createRuntimeFn';\nexport var container = _7a468({defaultClassName:'dhthxq4 dhthxq0 dhthxq1 dhthxq2 dhthxq3 dhthxqb',variantClassNames:{transitionState:{'enter-active':'_5ozg8c4','enter-done':'_5ozg8c5','exit-active':'_5ozg8c6','exit-done':'_5ozg8c7'}},defaultVariants:{},compoundVariants:[]});\nexport var dim = '_5ozg8cd dhthxq4 dhthxq0 dhthxq1 dhthxq2 dhthxq3 dhthxqb dhthxq8 dhthxq7 dhthxqa _5ozg8c3';\nexport var enterActive = '_5ozg8c4';\nexport var enterDone = '_5ozg8c5';\nexport var exitActive = '_5ozg8c6';\nexport var exitDone = '_5ozg8c7';\nexport var paper = '_5ozg8ce dhthxqb _5ozg8c3';\nexport var vars = {transitionDuration:'var(--_5ozg8c0)',zIndexes:{dim:'var(--_5ozg8c1)',paper:'var(--_5ozg8c2)'}};"],
5
+ "mappings": "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",
6
+ "names": ["src_exports", "__export", "AppScreen_default", "BottomSheet_default", "Modal_default", "basicUIPlugin", "globalVars", "__toCommonJS", "import_dynamic", "import_react", "import_react", "compactMap", "obj", "acc", "key", "value", "listenOnce", "el", "type", "cb", "listener", "listenResize", "cb", "noop", "requestNextFrame", "cb", "useLazy", "value", "state", "setState", "requestNextFrame", "import_react", "useMaxWidth", "outerRef", "innerRef", "enable", "maxWidth", "setMaxWidth", "$outer", "$inner", "noop", "listenResize", "screenWidth", "leftWidth", "centerWidth", "rightWidth", "sideMargin", "import_react", "connections", "useStyleEffect", "styleName", "refs", "effect", "activity", "arr", "i", "connection", "cleanup", "useStyleEffectHide", "refs", "hasEffect", "useStyleEffect", "activityTransitionState", "ref", "OFFSET_PX_ANDROID", "OFFSET_PX_CUPERTINO", "useStyleEffectOffset", "refs", "theme", "hasEffect", "useStyleEffect", "activityTransitionState", "transform", "ref", "requestNextFrame", "listenOnce", "useStyleEffectSwipeBack", "theme", "dimRef", "edgeRef", "paperRef", "hasEffect", "onSwiped", "useStyleEffect", "refs", "$dim", "$edge", "$paper", "x0", "t0", "x", "cachedRefs", "resetState", "_rAFLock", "movePaper", "dx", "p", "ref", "_a", "OFFSET_PX_CUPERTINO", "resetPaper", "swiped", "listenOnce", "i", "cachedRef", "onTouchStart", "e", "activeElement", "onTouchMove", "onTouchEnd", "t", "import_react", "ThemeContext", "ThemeProvider", "useTheme", "theme_css_exports", "__export", "android", "cupertino", "globalVars", "rootAndroid", "rootCupertino", "android", "cupertino", "globalVars", "rootAndroid", "rootCupertino", "basicUIPlugin", "options", "stack", "_a", "_b", "_c", "_d", "_e", "_f", "_g", "React", "ThemeProvider", "theme_css_exports", "compactMap", "globalVars", "import_react", "import_dynamic", "import_react", "import_dynamic", "import_react", "IconBack", "props", "React", "IconBack_default", "import_react", "IconClose", "props", "React", "IconClose_default", "import_createRuntimeFn", "appBar", "_7a468", "backButton", "center", "centerMain", "centerText", "closeButton", "left", "right", "import_createRuntimeFn", "appScreen", "_7a468", "dim", "edge", "_7a468", "paper", "_7a468", "vars", "AppBar", "React", "title", "appendLeft", "appendRight", "backButton", "closeButton", "closeButtonLocation", "border", "iconColor", "textColor", "borderColor", "borderSize", "height", "ref", "actions", "activity", "theme", "useTheme", "centerRef", "maxWidth", "useMaxWidth", "onBackClick", "e", "isCloseButtonVisible", "renderBackButton", "_a", "IconBack_default", "renderCloseButton", "noop", "IconClose_default", "hasLeft", "appBar", "compactMap", "globalVars", "vars", "left", "center", "centerMain", "centerText", "right", "AppBar_default", "AppScreen", "appBar", "children", "theme", "useTheme", "activity", "pop", "appScreenRef", "dimRef", "paperRef", "edgeRef", "appBarRef", "useStyleEffectHide", "useStyleEffectOffset", "useStyleEffectSwipeBack", "isRoot", "hasAppBar", "zIndexBase", "zIndexDim", "zIndexPaper", "zIndexEdge", "zIndexAppBar", "React", "appScreen", "useLazy", "compactMap", "globalVars", "vars", "dim", "paper", "edge", "AppBar_default", "__spreadProps", "__spreadValues", "AppScreen_default", "import_react", "import_dynamic", "import_createRuntimeFn", "container", "_7a468", "dim", "paper", "vars", "BottomSheet", "borderRadius", "backgroundColor", "dimBackgroundColor", "children", "activity", "pop", "containerRef", "paperRef", "useStyleEffect", "popLock", "onDimClick", "onPaperClick", "e", "zIndexBase", "zIndexPaper", "React", "container", "useLazy", "compactMap", "globalVars", "vars", "dim", "paper", "BottomSheet_default", "import_react", "import_dynamic", "import_createRuntimeFn", "container", "_7a468", "dim", "paper", "vars", "Modal", "backgroundColor", "dimBackgroundColor", "borderRadius", "children", "activity", "pop", "containerRef", "paperRef", "useStyleEffect", "popLock", "onDimClick", "onPaperClick", "e", "zIndexBase", "zIndexPaper", "React", "container", "useLazy", "compactMap", "globalVars", "vars", "dim", "paper", "Modal_default"]
7
+ }
package/dist/index.mjs ADDED
@@ -0,0 +1,2 @@
1
+ var Q=Object.defineProperty,Tt=Object.defineProperties;var wt=Object.getOwnPropertyDescriptors;var Z=Object.getOwnPropertySymbols;var Mt=Object.prototype.hasOwnProperty,Pt=Object.prototype.propertyIsEnumerable;var J=(t,o,r)=>o in t?Q(t,o,{enumerable:!0,configurable:!0,writable:!0,value:r}):t[o]=r,tt=(t,o)=>{for(var r in o||(o={}))Mt.call(o,r)&&J(t,r,o[r]);if(Z)for(var r of Z(o))Pt.call(o,r)&&J(t,r,o[r]);return t},et=(t,o)=>Tt(t,wt(o));var Vt=(t,o)=>{for(var r in o)Q(t,r,{get:o[r],enumerable:!0})};import{assignInlineVars as Kt}from"@vanilla-extract/dynamic";import dt from"react";import{useEffect as At,useState as Bt}from"react";function k(t){return Object.entries(t).reduce((o,[r,e])=>(e!=null&&(o[r]=e),o),{})}function w(t,o,r){let e=()=>{t.removeEventListener(o,e),r()};t.addEventListener(o,e)}var rt=t=>(t(),window.addEventListener("resize",t),()=>{window.removeEventListener("resize",t)});var M=()=>{};function P(t){requestAnimationFrame(()=>{requestAnimationFrame(()=>{t()})})}function S(t){let[o,r]=Bt(void 0);return At(()=>{P(()=>{r(t)})},[t]),o}import{useEffect as Dt,useState as Ot}from"react";function ot({outerRef:t,innerRef:o,enable:r}){let[e,a]=Ot(void 0);return Dt(()=>{let l=t&&"current"in t&&t.current,n=o.current;return!r||!l||!n?M:rt(()=>{let s=l.clientWidth,m=n.offsetLeft,h=n.clientWidth,u=s-m-h,p=Math.max(m,u);a(s-2*p)})},[]),{maxWidth:e}}import{useActivity as Ht}from"@stackflow/react";import{useEffect as at}from"react";var I={};function y({styleName:t,refs:o,effect:r}){let e=Ht();at(()=>(I[t]||(I[t]=new Map),I[t].set(e.zIndex,{refs:o,hasEffect:!!r}),()=>{I[t].delete(e.zIndex)}),[e.id,o,r]),at(()=>{if(!r)return()=>{};let a=(()=>{let n=[];for(let i=1;i<=e.zIndex;i+=1){let s=I[t].get(e.zIndex-i);if(s!=null&&s.refs&&(n=[...n,...s.refs]),s!=null&&s.hasEffect)break}return n})(),l=r({activityTransitionState:e.transitionState,refs:a});return()=>{l==null||l()}},[e.transitionState])}function nt({refs:t,hasEffect:o}){y({styleName:"hide",refs:t,effect:o?({activityTransitionState:r,refs:e})=>{switch(r){case"enter-done":{e.forEach(a=>{a.current.style.display="none"});break}default:{e.forEach(a=>{a.current.style.display=""});break}}}:void 0})}var Ft=32,V=80;function st({refs:t,theme:o,hasEffect:r}){y({styleName:"offset",refs:t,effect:r?({activityTransitionState:e,refs:a})=>{let l=o==="cupertino"?`translateX(-${V/16}rem)`:`translateY(-${Ft/16}rem)`;switch(e){case"enter-active":case"enter-done":{a.forEach(n=>{n.current.style.transition="var(--stackflow-transition-duration)",n.current.style.transform=l});break}case"exit-active":case"exit-done":{P(()=>{a.forEach(n=>{n.current.style.transform="",w(n.current,"transitionend",()=>{n.current.style.transition=""})})});break}default:break}}:void 0})}function it({theme:t,dimRef:o,edgeRef:r,paperRef:e,hasEffect:a,onSwiped:l}){y({styleName:"swipe-back",refs:[e],effect:a?({refs:n})=>{if(t!=="cupertino")return()=>{};if(!o.current||!r.current||!e.current)return()=>{};let i=o.current,s=r.current,m=e.current,h=null,u=null,p=null,C=[],g=()=>{h=null,u=null,p=null,C=[]},q=!1;function _(x){q||(q=!0,requestAnimationFrame(()=>{let d=x/m.clientWidth;i.style.opacity=`${1-d}`,i.style.transition="0s",m.style.overflowY="hidden",m.style.transform=`translateX(${x}px)`,m.style.transition="0s",n.forEach(f=>{var v;!f.current||(f.current.style.transform=`translateX(${-1*(1-d)*V}px)`,f.current.style.transition="0s",((v=f.current.parentElement)==null?void 0:v.style.display)==="none"&&(f.current.parentElement.style.display="block"))}),q=!1}))}function H({swiped:x}){requestAnimationFrame(()=>{i.style.opacity=`${x?0:1}`,i.style.transition="var(--stackflow-transition-duration)",m.style.overflowY="hidden",m.style.transform=`translateX(${x?"100%":"0"})`,m.style.transition="var(--stackflow-transition-duration)",n.forEach(d=>{!d.current||(d.current.style.transition="var(--stackflow-transition-duration)",d.current.style.transform=`translateX(${x?"0":`-${V/16}rem`})`)}),w(m,"transitionend",()=>{i.style.opacity="",m.style.overflowY="",m.style.transform="",n.forEach((d,f)=>{if(!d.current)return;let v=C[f];x?(d.current.style.transition="",d.current.style.transform="",d.current.parentElement&&(d.current.parentElement.style.display="")):v&&(d.current.style.transition=v.style.transition,d.current.style.transform=v.style.transform,d.current.parentElement&&v.parentElement&&(d.current.parentElement.style.display=v.parentElement.style.display))})})})}let N=x=>{var f;let{activeElement:d}=document;(f=d==null?void 0:d.blur)==null||f.call(d),h=p=x.touches[0].clientX,u=Date.now(),C=n.map(v=>v.current?{style:{transform:v.current.style.transform,transition:v.current.style.transition},parentElement:v.current.parentElement?{style:{display:v.current.parentElement.style.display}}:void 0}:{style:{transform:"",transition:""}})},z=x=>{if(!h){g();return}p=x.touches[0].clientX,_(p-h)},R=()=>{if(!h||!u||!p){g();return}let x=Date.now(),f=(p-h)/(x-u)>1||p/m.clientWidth>.4;f&&(l==null||l()),g(),H({swiped:f})};return s.addEventListener("touchstart",N,{passive:!0}),s.addEventListener("touchmove",z,{passive:!0}),s.addEventListener("touchend",R,{passive:!0}),s.addEventListener("touchcancel",R,{passive:!0}),()=>{s.removeEventListener("touchstart",N),s.removeEventListener("touchmove",z),s.removeEventListener("touchend",R),s.removeEventListener("touchcancel",R)}}:void 0})}import{createContext as $t,useContext as jt}from"react";var ct=$t("android"),lt=ct.Provider;function A(){return jt(ct)}var F={};Vt(F,{android:()=>Wt,cupertino:()=>Gt,globalVars:()=>c,rootAndroid:()=>Xt,rootCupertino:()=>Ut});var Wt="_1coppmz0",Gt="_1coppmz1",c={backgroundColor:"var(--stackflow-basic-ui-background-color)",dimBackgroundColor:"var(--stackflow-basic-ui-dim-background-color)",appBar:{borderColor:"var(--stackflow-basic-ui-app-bar-border-color)",borderSize:"var(--stackflow-basic-ui-app-bar-border-size)",height:"var(--stackflow-basic-ui-app-bar-height)",iconColor:"var(--stackflow-basic-ui-app-bar-icon-color)",textColor:"var(--stackflow-basic-ui-app-bar-text-color)"},bottomSheet:{borderRadius:"var(--stackflow-basic-ui-bottom-sheet-border-radius)"},modal:{borderRadius:"var(--stackflow-basic-ui-bottom-sheet-border-radius)"}},Xt=":root[data-stackflow-basic-ui-theme=android]",Ut=":root[data-stackflow-basic-ui-theme=cupertino]";var Yt=t=>()=>({key:"basic-ui",wrapStack({stack:o}){var r,e,a,l,n,i,s;return dt.createElement(lt,{value:t.theme},dt.createElement("div",{className:F[t.theme],style:Kt(k({[c.backgroundColor]:t.backgroundColor,[c.dimBackgroundColor]:t.dimBackgroundColor,[c.appBar.borderColor]:(r=t.appBar)==null?void 0:r.borderColor,[c.appBar.borderSize]:(e=t.appBar)==null?void 0:e.borderSize,[c.appBar.height]:(a=t.appBar)==null?void 0:a.height,[c.appBar.iconColor]:(l=t.appBar)==null?void 0:l.iconColor,[c.appBar.textColor]:(n=t.appBar)==null?void 0:n.textColor,[c.bottomSheet.borderRadius]:(i=t.bottomSheet)==null?void 0:i.borderRadius,[c.modal.borderRadius]:(s=t.modal)==null?void 0:s.borderRadius}))},o.render()))}});import{useActions as ne,useActivity as se}from"@stackflow/react";import{assignInlineVars as ie}from"@vanilla-extract/dynamic";import L,{useRef as T}from"react";import{useActions as te,useActivity as ee}from"@stackflow/react";import{assignInlineVars as re}from"@vanilla-extract/dynamic";import b,{useRef as oe}from"react";import mt from"react";var Zt=t=>mt.createElement("svg",{className:t.className,width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg"},mt.createElement("path",{d:"M11.5659 5.56564C11.8783 5.25322 11.8783 4.74669 11.5659 4.43427C11.2535 4.12185 10.7469 4.12185 10.4345 4.43427L3.43451 11.4343C3.12209 11.7467 3.12209 12.2532 3.43451 12.5656L10.4345 19.5656C10.7469 19.8781 11.2535 19.8781 11.5659 19.5656C11.8783 19.2532 11.8783 18.7467 11.5659 18.4343L5.93157 12.8H20.0002C20.442 12.8 20.8002 12.4418 20.8002 12C20.8002 11.5581 20.442 11.2 20.0002 11.2H5.93157L11.5659 5.56564Z",fill:"currentColor"})),B=Zt;import $ from"react";var Jt=t=>$.createElement("svg",{className:t.className,width:"24",height:"24",viewBox:"0 0 24 24",fill:"none",xmlns:"http://www.w3.org/2000/svg"},$.createElement("path",{d:"M6.56588 5.43433C6.25346 5.12191 5.74693 5.12191 5.43451 5.43433C5.12209 5.74675 5.12209 6.25328 5.43451 6.5657L10.8688 12L5.43451 17.4343C5.12209 17.7467 5.12209 18.2533 5.43451 18.5657C5.74693 18.8781 6.25346 18.8781 6.56588 18.5657L12.0002 13.1314L17.4345 18.5657C17.7469 18.8781 18.2535 18.8781 18.5659 18.5657C18.8783 18.2533 18.8783 17.7467 18.5659 17.4343L13.1316 12L18.5659 6.5657C18.8783 6.25328 18.8783 5.74675 18.5659 5.43433C18.2535 5.12191 17.7469 5.12191 17.4345 5.43433L12.0002 10.8686L6.56588 5.43433Z",fill:"currentColor"}),$.createElement("path",{d:"M6.56588 5.43433C6.25346 5.12191 5.74693 5.12191 5.43451 5.43433C5.12209 5.74675 5.12209 6.25328 5.43451 6.5657L10.8688 12L5.43451 17.4343C5.12209 17.7467 5.12209 18.2533 5.43451 18.5657C5.74693 18.8781 6.25346 18.8781 6.56588 18.5657L12.0002 13.1314L17.4345 18.5657C17.7469 18.8781 18.2535 18.8781 18.5659 18.5657C18.8783 18.2533 18.8783 17.7467 18.5659 17.4343L13.1316 12L18.5659 6.5657C18.8783 6.25328 18.8783 5.74675 18.5659 5.43433C18.2535 5.12191 17.7469 5.12191 17.4345 5.43433L12.0002 10.8686L6.56588 5.43433Z",fill:"currentColor"})),j=Jt;import{createRuntimeFn as pt}from"@vanilla-extract/recipes/createRuntimeFn";var ft=pt({defaultClassName:"_1yk3a450 dhthxq4 dhthxq8 dhthxq7 dhthxq0 dhthxqg _1dlf4347",variantClassNames:{border:{true:"_1yk3a451"}},defaultVariants:{},compoundVariants:[]}),W="_1yk3a453 dhthxq8 dhthxq7 dhthxqa dhthxqe dhthxqh",ht="_1yk3a455 dhthxq8 dhthxq7",ut=pt({defaultClassName:"_1yk3a456",variantClassNames:{hasLeft:{true:"_1yk3a457"}},defaultVariants:{},compoundVariants:[]}),xt="_1yk3a458 dhthxqb dhthxqc dhthxq0",vt="_1yk3a453 dhthxq8 dhthxq7 dhthxqa dhthxqe dhthxqh",yt="_1yk3a452 dhthxq8 dhthxq7 dhthxq1",bt="_1yk3a459 dhthxq8 dhthxq7 dhthxq1 dhthxq5";import{createRuntimeFn as G}from"@vanilla-extract/recipes/createRuntimeFn";var Ct=G({defaultClassName:"dhthxq4 dhthxq0 dhthxq1 dhthxq2 dhthxq3 dhthxqb",variantClassNames:{transitionState:{"enter-active":"_1dlf4349","enter-done":"_1dlf434a","exit-active":"_1dlf434b","exit-done":"_1dlf434c"}},defaultVariants:{},compoundVariants:[]});var gt="_1dlf434i dhthxq4 dhthxq0 dhthxq1 dhthxq2 dhthxq3 _1dlf4346 _1dlf4348",kt=G({defaultClassName:"_1dlf434l dhthxq4 dhthxq2 dhthxq3 dhthxq1",variantClassNames:{hasAppBar:{true:"_1dlf434m"}},defaultVariants:{},compoundVariants:[]});var Et=G({defaultClassName:"_1dlf434j dhthxq4 dhthxq0 dhthxq1 dhthxq2 dhthxq3 _1dlf4347 _1dlf4348",variantClassNames:{hasAppBar:{true:"_1dlf434k dhthxqf"}},defaultVariants:{},compoundVariants:[]}),E={transitionDuration:"var(--_1dlf4340)",zIndexes:{dim:"var(--_1dlf4341)",paper:"var(--_1dlf4342)",edge:"var(--_1dlf4343)",appBar:"var(--_1dlf4344)"},appBar:{center:{mainWidth:"var(--_1dlf4345)"}}};var ae=b.forwardRef(({title:t,appendLeft:o,appendRight:r,backButton:e,closeButton:a,closeButtonLocation:l="left",border:n=!0,iconColor:i,textColor:s,borderColor:m,borderSize:h,height:u},p)=>{let C=te(),g=ee(),q=A(),_=oe(null),{maxWidth:H}=ot({outerRef:p,innerRef:_,enable:q==="cupertino"}),N=f=>{e&&"onClick"in e&&e.onClick&&e.onClick(f),f.defaultPrevented||C.pop()},z=g.zIndex===0||g.zIndex===1&&g.transitionState==="enter-active"&&g.pushedBy.name==="Replaced",R=()=>{var f;return z?null:e?"render"in e&&e.render?(f=e.render)==null?void 0:f.call(e):b.createElement("button",{type:"button",className:W,onClick:N},"renderIcon"in e&&e.renderIcon?e.renderIcon():b.createElement(B,null)):b.createElement("button",{type:"button",className:W,onClick:N},b.createElement(B,null))},x=()=>!a||!z?null:"render"in a&&a.render?a.render():b.createElement("button",{type:"button",className:vt,onClick:"onClick"in a?a.onClick:M},"renderIcon"in a&&a.renderIcon?a.renderIcon():b.createElement(j,null)),d=!!(l==="left"&&a||e||o);return b.createElement("div",{ref:p,className:ft({border:n}),style:re(k({[c.appBar.iconColor]:i,[c.appBar.textColor]:s,[c.appBar.borderColor]:m,[c.appBar.borderSize]:h,[c.appBar.height]:u,[E.appBar.center.mainWidth]:`${H}px`}))},b.createElement("div",{className:yt},l==="left"&&x(),R(),o==null?void 0:o()),b.createElement("div",{ref:_,className:ht},b.createElement("div",{className:ut({hasLeft:d})},typeof t=="string"?b.createElement("div",{className:xt},t):t)),b.createElement("div",{className:bt},r==null?void 0:r(),l==="right"&&x()))}),_t=ae;var ce=({appBar:t,children:o})=>{let r=A(),e=se(),{pop:a}=ne(),l=T(null),n=T(null),i=T(null),s=T(null),m=T(null);nt({refs:[l],hasEffect:!0}),st({theme:r,refs:r==="cupertino"?[i]:[i,m],hasEffect:!0}),it({theme:r,dimRef:n,edgeRef:s,paperRef:i,hasEffect:!0,onSwiped(){a()}});let h=e.zIndex===0,u=!!t,p=e.zIndex*5,C=p,g=p+(r==="cupertino"&&u?1:3),q=p+4,_=p+7;return L.createElement("div",{ref:l,className:Ct({transitionState:S(e.transitionState)}),style:ie(k({[c.appBar.height]:t==null?void 0:t.height,[E.zIndexes.dim]:`${C}`,[E.zIndexes.paper]:`${g}`,[E.zIndexes.edge]:`${q}`,[E.zIndexes.appBar]:`${_}`,[E.transitionDuration]:e.transitionState==="enter-active"||e.transitionState==="exit-active"?"var(--stackflow-transition-duration)":"0ms"}))},L.createElement("div",{className:gt,ref:n}),L.createElement("div",{key:e.id,className:Et({hasAppBar:u}),ref:i},o),!h&&r==="cupertino"&&L.createElement("div",{className:kt({hasAppBar:u}),ref:s}),t&&L.createElement(_t,et(tt({},t),{ref:m})))},le=ce;import{useActions as pe,useActivity as fe}from"@stackflow/react";import{assignInlineVars as he}from"@vanilla-extract/dynamic";import X,{useRef as U}from"react";import{createRuntimeFn as de}from"@vanilla-extract/recipes/createRuntimeFn";var Rt=de({defaultClassName:"dhthxq4 dhthxq0 dhthxq1 dhthxq2 dhthxq3 dhthxqb",variantClassNames:{transitionState:{"enter-active":"_1ht38h04","enter-done":"_1ht38h05","exit-active":"_1ht38h06","exit-done":"_1ht38h07"}},defaultVariants:{},compoundVariants:[]}),St="_1ht38h0d dhthxq4 dhthxq0 dhthxq1 dhthxq2 dhthxq3 dhthxqb dhthxq9 dhthxq7 _1ht38h03";var Nt="_1ht38h0e dhthxqb _1ht38h03",D={transitionDuration:"var(--_1ht38h00)",zIndexes:{dim:"var(--_1ht38h01)",paper:"var(--_1ht38h02)"}};var ue=({borderRadius:t="1rem",backgroundColor:o,dimBackgroundColor:r,children:e})=>{let a=fe(),{pop:l}=pe(),n=U(null),i=U(null);y({styleName:"hide",refs:[n]}),y({styleName:"offset",refs:[i]}),y({styleName:"swipe-back",refs:[i]});let s=U(!1),m=()=>{s.current||(l(),s.current=!0)},h=C=>{C.stopPropagation()},u=a.zIndex*5+3,p=a.zIndex*5+4;return X.createElement("div",{className:Rt({transitionState:S(a.transitionState)}),ref:n,style:he(k({[c.bottomSheet.borderRadius]:t,[c.backgroundColor]:o,[c.dimBackgroundColor]:r,[D.zIndexes.dim]:`${u}`,[D.zIndexes.paper]:`${p}`,[D.transitionDuration]:a.transitionState==="enter-active"||a.transitionState==="exit-active"?"var(--stackflow-transition-duration)":"0ms"}))},X.createElement("div",{className:St,ref:i,onClick:m},X.createElement("div",{className:Nt,onClick:h},e)))},xe=ue;import{useActions as be,useActivity as Ce}from"@stackflow/react";import{assignInlineVars as ge}from"@vanilla-extract/dynamic";import K,{useRef as Y}from"react";import{createRuntimeFn as ve}from"@vanilla-extract/recipes/createRuntimeFn";var zt=ve({defaultClassName:"dhthxq4 dhthxq0 dhthxq1 dhthxq2 dhthxq3 dhthxqb",variantClassNames:{transitionState:{"enter-active":"_5ozg8c4","enter-done":"_5ozg8c5","exit-active":"_5ozg8c6","exit-done":"_5ozg8c7"}},defaultVariants:{},compoundVariants:[]}),It="_5ozg8cd dhthxq4 dhthxq0 dhthxq1 dhthxq2 dhthxq3 dhthxqb dhthxq8 dhthxq7 dhthxqa _5ozg8c3";var Lt="_5ozg8ce dhthxqb _5ozg8c3",O={transitionDuration:"var(--_5ozg8c0)",zIndexes:{dim:"var(--_5ozg8c1)",paper:"var(--_5ozg8c2)"}};var ke=({backgroundColor:t,dimBackgroundColor:o,borderRadius:r="1rem",children:e})=>{let a=Ce(),{pop:l}=be(),n=Y(null),i=Y(null);y({styleName:"hide",refs:[n]}),y({styleName:"offset",refs:[i]}),y({styleName:"swipe-back",refs:[i]});let s=Y(!1),m=()=>{s.current||(l(),s.current=!0)},h=C=>{C.stopPropagation()},u=a.zIndex*5+3,p=a.zIndex*5+4;return K.createElement("div",{className:zt({transitionState:S(a.transitionState)}),ref:n,style:ge(k({[c.bottomSheet.borderRadius]:r,[c.backgroundColor]:t,[c.dimBackgroundColor]:o,[O.zIndexes.dim]:`${u}`,[O.zIndexes.paper]:`${p}`,[O.transitionDuration]:a.transitionState==="enter-active"||a.transitionState==="exit-active"?"var(--stackflow-transition-duration)":"0ms"}))},K.createElement("div",{className:It,ref:i,onClick:m},K.createElement("div",{className:Lt,onClick:h},e)))},Ee=ke;export{le as AppScreen,xe as BottomSheet,Ee as Modal,Yt as basicUIPlugin,c as cssVars};
2
+ //# sourceMappingURL=index.mjs.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../src/basicUIPlugin.tsx", "../src/hooks/useLazy.tsx", "../src/utils/compactMap.ts", "../src/utils/listenOnce.ts", "../src/utils/listenResize.ts", "../src/utils/noop.ts", "../src/utils/requestNextFrame.tsx", "../src/hooks/useMaxWidth.ts", "../src/hooks/useStyleEffect.ts", "../src/hooks/useStyleEffectHide.ts", "../src/hooks/useStyleEffectOffset.ts", "../src/hooks/useStyleEffectSwipeBack.ts", "../src/hooks/useTheme.ts", "../src/theme.css.ts", "../src/components/AppScreen.tsx", "../src/components/AppBar.tsx", "../src/assets/IconBack.tsx", "../src/assets/IconClose.tsx", "../src/components/AppBar.css.ts", "../src/components/AppScreen.css.ts", "../src/components/BottomSheet.tsx", "../src/components/BottomSheet.css.ts", "../src/components/Modal.tsx", "../src/components/Modal.css.ts"],
4
+ "sourcesContent": ["import type { StackflowReactPlugin } from \"@stackflow/react\";\nimport { assignInlineVars } from \"@vanilla-extract/dynamic\";\nimport React from \"react\";\n\nimport { ThemeProvider } from \"./hooks\";\nimport * as theme from \"./theme.css\";\nimport { compactMap } from \"./utils\";\n\ntype RPartial<K> = {\n [attr in keyof K]?: K[attr] extends object ? RPartial<K[attr]> : K[attr];\n};\n\ntype BasicUIPluginOptions = RPartial<theme.GlobalVars> & {\n theme: \"android\" | \"cupertino\";\n};\n\nexport const basicUIPlugin: (\n options: BasicUIPluginOptions,\n) => StackflowReactPlugin = (options) => () => ({\n key: \"basic-ui\",\n wrapStack({ stack }) {\n return (\n <ThemeProvider value={options.theme}>\n <div\n className={theme[options.theme]}\n style={assignInlineVars(\n compactMap({\n [theme.globalVars.backgroundColor]: options.backgroundColor,\n [theme.globalVars.dimBackgroundColor]: options.dimBackgroundColor,\n [theme.globalVars.appBar.borderColor]:\n options.appBar?.borderColor,\n [theme.globalVars.appBar.borderSize]: options.appBar?.borderSize,\n [theme.globalVars.appBar.height]: options.appBar?.height,\n [theme.globalVars.appBar.iconColor]: options.appBar?.iconColor,\n [theme.globalVars.appBar.textColor]: options.appBar?.textColor,\n [theme.globalVars.bottomSheet.borderRadius]:\n options.bottomSheet?.borderRadius,\n [theme.globalVars.modal.borderRadius]:\n options.modal?.borderRadius,\n }),\n )}\n >\n {stack.render()}\n </div>\n </ThemeProvider>\n );\n },\n});\n", "import { useEffect, useState } from \"react\";\n\nimport { requestNextFrame } from \"../utils\";\n\nexport function useLazy<T>(value: T) {\n const [state, setState] = useState<T | undefined>(undefined);\n\n useEffect(() => {\n requestNextFrame(() => {\n setState(value);\n });\n }, [value]);\n\n return state;\n}\n", "export function compactMap<T extends {}>(\n obj: T,\n): {\n [key in keyof T]: NonNullable<T[key]>;\n} {\n return Object.entries(obj).reduce<any>((acc, [key, value]) => {\n if (value !== null && value !== undefined) {\n acc[key] = value;\n }\n\n return acc;\n }, {});\n}\n", "export function listenOnce<T extends HTMLElement>(\n el: T,\n type: keyof HTMLElementEventMap,\n cb: () => void,\n) {\n const listener = () => {\n el.removeEventListener(type, listener);\n cb();\n };\n\n el.addEventListener(type, listener);\n}\n", "export const listenResize = (cb: () => void) => {\n cb();\n window.addEventListener(\"resize\", cb);\n\n return () => {\n window.removeEventListener(\"resize\", cb);\n };\n};\n", "export const noop = () => {};\n", "// https://github.com/MingruiZhang/react-animate-mount/blob/32300c04a4fdfa97724b70aaaf0c0f403d6da247/src/Animate.js#L171-L179\nexport function requestNextFrame(cb: () => void) {\n requestAnimationFrame(() => {\n requestAnimationFrame(() => {\n cb();\n });\n });\n}\n", "import type React from \"react\";\nimport { useEffect, useState } from \"react\";\n\nimport { listenResize, noop } from \"../utils\";\n\nexport function useMaxWidth({\n outerRef,\n innerRef,\n enable,\n}: {\n outerRef: React.ForwardedRef<any>;\n innerRef: React.MutableRefObject<any>;\n enable: boolean;\n}) {\n const [maxWidth, setMaxWidth] = useState<number | undefined>(undefined);\n\n useEffect(() => {\n const $outer = outerRef && \"current\" in outerRef && outerRef.current;\n const $inner = innerRef.current;\n\n if (!enable || !$outer || !$inner) {\n return noop;\n }\n\n const dispose = listenResize(() => {\n const screenWidth = $outer.clientWidth;\n\n const leftWidth = $inner.offsetLeft;\n const centerWidth = $inner.clientWidth;\n const rightWidth = screenWidth - leftWidth - centerWidth;\n\n const sideMargin = Math.max(leftWidth, rightWidth);\n\n setMaxWidth(screenWidth - 2 * sideMargin);\n });\n\n return dispose;\n }, []);\n\n return {\n maxWidth,\n };\n}\n", "import type { ActivityTransitionState } from \"@stackflow/core\";\nimport { useActivity } from \"@stackflow/react\";\nimport type React from \"react\";\nimport { useEffect } from \"react\";\n\nconst connections: {\n [styleName: string]: Map<\n number,\n {\n refs: Array<React.RefObject<any>>;\n hasEffect: boolean;\n }\n >;\n} = {};\n\nexport function useStyleEffect({\n styleName,\n refs,\n effect,\n}: {\n styleName: string;\n refs: Array<React.RefObject<any>>;\n effect?: (params: {\n activityTransitionState: ActivityTransitionState;\n refs: Array<React.RefObject<any>>;\n }) => (() => void) | void;\n}) {\n const activity = useActivity();\n\n useEffect(() => {\n if (!connections[styleName]) {\n connections[styleName] = new Map();\n }\n\n connections[styleName].set(activity.zIndex, {\n refs,\n hasEffect: !!effect,\n });\n\n return () => {\n connections[styleName].delete(activity.zIndex);\n };\n }, [activity.id, refs, effect]);\n\n useEffect(() => {\n if (!effect) {\n return () => {};\n }\n\n const refs = (() => {\n let arr: Array<React.RefObject<any>> = [];\n\n for (let i = 1; i <= activity.zIndex; i += 1) {\n const connection = connections[styleName].get(activity.zIndex - i);\n\n if (connection?.refs) {\n arr = [...arr, ...connection.refs];\n }\n if (connection?.hasEffect) {\n break;\n }\n }\n\n return arr;\n })();\n\n const cleanup = effect({\n activityTransitionState: activity.transitionState,\n refs,\n });\n\n return () => {\n cleanup?.();\n };\n }, [activity.transitionState]);\n}\n", "/* eslint-disable no-param-reassign */\n\nimport { useStyleEffect } from \"./useStyleEffect\";\n\nexport function useStyleEffectHide({\n refs,\n hasEffect,\n}: {\n refs: Array<React.RefObject<any>>;\n hasEffect?: boolean;\n}) {\n useStyleEffect({\n styleName: \"hide\",\n refs,\n effect: hasEffect\n ? ({ activityTransitionState, refs }) => {\n switch (activityTransitionState) {\n case \"enter-done\": {\n refs.forEach((ref) => {\n ref.current.style.display = \"none\";\n });\n break;\n }\n default: {\n refs.forEach((ref) => {\n ref.current.style.display = \"\";\n });\n break;\n }\n }\n }\n : undefined,\n });\n}\n", "/* eslint-disable no-param-reassign */\n\nimport { listenOnce, requestNextFrame } from \"../utils\";\nimport { useStyleEffect } from \"./useStyleEffect\";\n\nexport const OFFSET_PX_ANDROID = 32;\nexport const OFFSET_PX_CUPERTINO = 80;\n\nexport function useStyleEffectOffset({\n refs,\n theme,\n hasEffect,\n}: {\n refs: Array<React.RefObject<any>>;\n theme: \"android\" | \"cupertino\";\n hasEffect?: boolean;\n}) {\n useStyleEffect({\n styleName: \"offset\",\n refs,\n effect: hasEffect\n ? ({ activityTransitionState, refs }) => {\n const transform =\n theme === \"cupertino\"\n ? `translateX(-${OFFSET_PX_CUPERTINO / 16}rem)`\n : `translateY(-${OFFSET_PX_ANDROID / 16}rem)`;\n\n switch (activityTransitionState) {\n case \"enter-active\":\n case \"enter-done\": {\n refs.forEach((ref) => {\n ref.current.style.transition = `var(--stackflow-transition-duration)`;\n ref.current.style.transform = transform;\n });\n break;\n }\n case \"exit-active\":\n case \"exit-done\": {\n requestNextFrame(() => {\n refs.forEach((ref) => {\n ref.current.style.transform = \"\";\n\n listenOnce(ref.current, \"transitionend\", () => {\n ref.current.style.transition = \"\";\n });\n });\n });\n break;\n }\n default: {\n break;\n }\n }\n }\n : undefined,\n });\n}\n", "/* eslint-disable no-param-reassign */\n\nimport { listenOnce } from \"../utils\";\nimport { useStyleEffect } from \"./useStyleEffect\";\nimport { OFFSET_PX_CUPERTINO } from \"./useStyleEffectOffset\";\n\nexport function useStyleEffectSwipeBack({\n theme,\n dimRef,\n edgeRef,\n paperRef,\n hasEffect,\n onSwiped,\n}: {\n theme: \"android\" | \"cupertino\";\n dimRef: React.RefObject<HTMLDivElement>;\n edgeRef: React.RefObject<HTMLDivElement>;\n paperRef: React.RefObject<HTMLDivElement>;\n hasEffect?: boolean;\n onSwiped?: () => void;\n}) {\n useStyleEffect({\n styleName: \"swipe-back\",\n refs: [paperRef],\n effect: hasEffect\n ? ({ refs }) => {\n if (theme !== \"cupertino\") {\n return () => {};\n }\n\n if (!dimRef.current || !edgeRef.current || !paperRef.current) {\n return () => {};\n }\n\n const $dim = dimRef.current;\n const $edge = edgeRef.current;\n const $paper = paperRef.current;\n\n let x0: number | null = null;\n let t0: number | null = null;\n let x: number | null = null;\n\n let cachedRefs: Array<{\n style: {\n transform: string;\n transition: string;\n };\n parentElement?: {\n style: {\n display: string;\n };\n };\n }> = [];\n\n const resetState = () => {\n x0 = null;\n t0 = null;\n x = null;\n cachedRefs = [];\n };\n\n let _rAFLock = false;\n\n function movePaper(dx: number) {\n if (!_rAFLock) {\n _rAFLock = true;\n\n requestAnimationFrame(() => {\n const p = dx / $paper.clientWidth;\n\n $dim.style.opacity = `${1 - p}`;\n $dim.style.transition = \"0s\";\n\n $paper.style.overflowY = \"hidden\";\n $paper.style.transform = `translateX(${dx}px)`;\n $paper.style.transition = \"0s\";\n\n refs.forEach((ref: React.RefObject<HTMLElement>) => {\n if (!ref.current) {\n return;\n }\n\n ref.current.style.transform = `translateX(${\n -1 * (1 - p) * OFFSET_PX_CUPERTINO\n }px)`;\n ref.current.style.transition = \"0s\";\n\n if (ref.current.parentElement?.style.display === \"none\") {\n ref.current.parentElement.style.display = \"block\";\n }\n });\n\n _rAFLock = false;\n });\n }\n }\n\n function resetPaper({ swiped }: { swiped: boolean }) {\n requestAnimationFrame(() => {\n $dim.style.opacity = `${swiped ? 0 : 1}`;\n $dim.style.transition = \"var(--stackflow-transition-duration)\";\n\n $paper.style.overflowY = \"hidden\";\n $paper.style.transform = `translateX(${swiped ? \"100%\" : \"0\"})`;\n $paper.style.transition = \"var(--stackflow-transition-duration)\";\n\n refs.forEach((ref: React.RefObject<HTMLElement>) => {\n if (!ref.current) {\n return;\n }\n\n ref.current.style.transition = `var(--stackflow-transition-duration)`;\n ref.current.style.transform = `translateX(${\n swiped ? \"0\" : `-${OFFSET_PX_CUPERTINO / 16}rem`\n })`;\n });\n\n listenOnce($paper, \"transitionend\", () => {\n $dim.style.opacity = \"\";\n $paper.style.overflowY = \"\";\n $paper.style.transform = \"\";\n\n refs.forEach((ref: React.RefObject<HTMLElement>, i) => {\n if (!ref.current) {\n return;\n }\n\n const cachedRef = cachedRefs[i];\n\n if (swiped) {\n ref.current.style.transition = \"\";\n ref.current.style.transform = \"\";\n\n if (ref.current.parentElement) {\n ref.current.parentElement.style.display = \"\";\n }\n } else if (cachedRef) {\n ref.current.style.transition = cachedRef.style.transition;\n ref.current.style.transform = cachedRef.style.transform;\n\n if (ref.current.parentElement && cachedRef.parentElement) {\n ref.current.parentElement.style.display =\n cachedRef.parentElement.style.display;\n }\n }\n });\n });\n });\n }\n\n const onTouchStart = (e: TouchEvent) => {\n const { activeElement } = document as any;\n\n activeElement?.blur?.();\n // eslint-disable-next-line no-multi-assign\n x0 = x = e.touches[0].clientX;\n t0 = Date.now();\n\n cachedRefs = refs.map((ref) => {\n if (!ref.current) {\n return {\n style: {\n transform: \"\",\n transition: \"\",\n },\n };\n }\n\n return {\n style: {\n transform: ref.current.style.transform,\n transition: ref.current.style.transition,\n },\n parentElement: ref.current.parentElement\n ? {\n style: {\n display: ref.current.parentElement.style.display,\n },\n }\n : undefined,\n };\n });\n };\n\n const onTouchMove = (e: TouchEvent) => {\n if (!x0) {\n resetState();\n return;\n }\n\n x = e.touches[0].clientX;\n\n movePaper(x - x0);\n };\n\n const onTouchEnd = () => {\n if (!x0 || !t0 || !x) {\n resetState();\n return;\n }\n\n const t = Date.now();\n const v = (x - x0) / (t - t0);\n const swiped = v > 1 || x / $paper.clientWidth > 0.4;\n\n if (swiped) {\n onSwiped?.();\n }\n\n resetState();\n resetPaper({ swiped });\n };\n\n $edge.addEventListener(\"touchstart\", onTouchStart, { passive: true });\n $edge.addEventListener(\"touchmove\", onTouchMove, { passive: true });\n $edge.addEventListener(\"touchend\", onTouchEnd, { passive: true });\n $edge.addEventListener(\"touchcancel\", onTouchEnd, { passive: true });\n\n return () => {\n $edge.removeEventListener(\"touchstart\", onTouchStart);\n $edge.removeEventListener(\"touchmove\", onTouchMove);\n $edge.removeEventListener(\"touchend\", onTouchEnd);\n $edge.removeEventListener(\"touchcancel\", onTouchEnd);\n };\n }\n : undefined,\n });\n}\n", "import { createContext, useContext } from \"react\";\n\nconst ThemeContext = createContext<\"android\" | \"cupertino\">(\"android\");\n\nexport const ThemeProvider = ThemeContext.Provider;\n\nexport function useTheme() {\n return useContext(ThemeContext);\n}\n", "import 'src/theme.css.ts.vanilla.css?source=#H4sIAAAAAAAAE+WT3UrEMBCF7/cpAt4obEKzWhYiPomI5GfaBjedMJnisuK7W0X3akvrpZUEQsI5h5l8jCFE3grzeTwGy1YWtv6lOeCrdLZEL4couYMED7YPhDE8ibeNEPKSzo0vLeHQB+nxgGTEVdM091PyENMFC7XOXldb8b2Vrm8mE2zO44WkQwpAUwnVfnFCiScwQufjrKGD2HZsxK2qCdKsPHrsz5+y0+O6m/UwHHmpxyEzJlk6AP5phmyIQxnb+SrwfbMEsh8yEMce/wHmStW/AL1T+z9DWj1rjzmnU7V+iisd1jNCvX6Eqx3ED1vu8AteBwAA';\nexport var android = '_1coppmz0';\nexport var cupertino = '_1coppmz1';\nexport var globalVars = {backgroundColor:'var(--stackflow-basic-ui-background-color)',dimBackgroundColor:'var(--stackflow-basic-ui-dim-background-color)',appBar:{borderColor:'var(--stackflow-basic-ui-app-bar-border-color)',borderSize:'var(--stackflow-basic-ui-app-bar-border-size)',height:'var(--stackflow-basic-ui-app-bar-height)',iconColor:'var(--stackflow-basic-ui-app-bar-icon-color)',textColor:'var(--stackflow-basic-ui-app-bar-text-color)'},bottomSheet:{borderRadius:'var(--stackflow-basic-ui-bottom-sheet-border-radius)'},modal:{borderRadius:'var(--stackflow-basic-ui-bottom-sheet-border-radius)'}};\nexport var rootAndroid = ':root[data-stackflow-basic-ui-theme=android]';\nexport var rootCupertino = ':root[data-stackflow-basic-ui-theme=cupertino]';", "/* eslint-disable no-param-reassign */\n\nimport { useActions, useActivity } from \"@stackflow/react\";\nimport { assignInlineVars } from \"@vanilla-extract/dynamic\";\nimport React, { useRef } from \"react\";\n\nimport {\n useLazy,\n useStyleEffectHide,\n useStyleEffectOffset,\n useStyleEffectSwipeBack,\n useTheme,\n} from \"../hooks\";\nimport type { GlobalVars } from \"../theme.css\";\nimport { globalVars } from \"../theme.css\";\nimport type { PropOf } from \"../utils\";\nimport { compactMap } from \"../utils\";\nimport AppBar from \"./AppBar\";\nimport * as css from \"./AppScreen.css\";\n\ntype AppScreenProps = Partial<\n Pick<GlobalVars, \"backgroundColor\" | \"dimBackgroundColor\">\n> & {\n appBar?: Omit<PropOf<typeof AppBar>, \"theme\" | \"ref\" | \"key\">;\n children: React.ReactNode;\n};\nconst AppScreen: React.FC<AppScreenProps> = ({ appBar, children }) => {\n const theme = useTheme();\n const activity = useActivity();\n const { pop } = useActions();\n\n const appScreenRef = useRef<HTMLDivElement>(null);\n const dimRef = useRef<HTMLDivElement>(null);\n const paperRef = useRef<HTMLDivElement>(null);\n const edgeRef = useRef<HTMLDivElement>(null);\n const appBarRef = useRef<HTMLDivElement>(null);\n\n useStyleEffectHide({\n refs: [appScreenRef],\n hasEffect: true,\n });\n useStyleEffectOffset({\n theme,\n refs: theme === \"cupertino\" ? [paperRef] : [paperRef, appBarRef],\n hasEffect: true,\n });\n useStyleEffectSwipeBack({\n theme,\n dimRef,\n edgeRef,\n paperRef,\n hasEffect: true,\n onSwiped() {\n pop();\n },\n });\n\n const isRoot = activity.zIndex === 0;\n const hasAppBar = !!appBar;\n\n const zIndexBase = activity.zIndex * 5;\n const zIndexDim = zIndexBase;\n const zIndexPaper = zIndexBase + (theme === \"cupertino\" && hasAppBar ? 1 : 3);\n const zIndexEdge = zIndexBase + 4;\n const zIndexAppBar = zIndexBase + 7;\n\n return (\n <div\n ref={appScreenRef}\n className={css.appScreen({\n transitionState: useLazy(activity.transitionState),\n })}\n style={assignInlineVars(\n compactMap({\n [globalVars.appBar.height]: appBar?.height,\n [css.vars.zIndexes.dim]: `${zIndexDim}`,\n [css.vars.zIndexes.paper]: `${zIndexPaper}`,\n [css.vars.zIndexes.edge]: `${zIndexEdge}`,\n [css.vars.zIndexes.appBar]: `${zIndexAppBar}`,\n [css.vars.transitionDuration]:\n activity.transitionState === \"enter-active\" ||\n activity.transitionState === \"exit-active\"\n ? `var(--stackflow-transition-duration)`\n : \"0ms\",\n }),\n )}\n >\n <div className={css.dim} ref={dimRef} />\n <div\n key={activity.id}\n className={css.paper({\n hasAppBar,\n })}\n ref={paperRef}\n >\n {children}\n </div>\n {!isRoot && theme === \"cupertino\" && (\n <div className={css.edge({ hasAppBar })} ref={edgeRef} />\n )}\n {appBar && <AppBar {...appBar} ref={appBarRef} />}\n </div>\n );\n};\n\nexport default AppScreen;\n", "import { useActions, useActivity } from \"@stackflow/react\";\nimport { assignInlineVars } from \"@vanilla-extract/dynamic\";\nimport React, { useRef } from \"react\";\n\nimport { IconBack, IconClose } from \"../assets\";\nimport { useMaxWidth, useTheme } from \"../hooks\";\nimport type { GlobalVars } from \"../theme.css\";\nimport { globalVars } from \"../theme.css\";\nimport { compactMap, noop } from \"../utils\";\nimport * as css from \"./AppBar.css\";\nimport * as appScreenCss from \"./AppScreen.css\";\n\ntype AppBarProps = Partial<\n Pick<\n GlobalVars[\"appBar\"],\n \"borderColor\" | \"borderSize\" | \"height\" | \"iconColor\" | \"textColor\"\n >\n> & {\n title?: React.ReactNode;\n appendLeft?: () => React.ReactNode;\n appendRight?: () => React.ReactNode;\n backButton?:\n | {\n renderIcon?: () => React.ReactNode;\n onClick?: (e: React.MouseEvent<HTMLButtonElement>) => void;\n }\n | {\n render?: () => React.ReactNode;\n };\n closeButton?:\n | {\n renderIcon?: () => React.ReactNode;\n onClick: (e: React.MouseEvent<HTMLButtonElement>) => void;\n }\n | {\n render?: () => React.ReactNode;\n };\n closeButtonLocation?: \"left\" | \"right\";\n border?: boolean;\n};\nconst AppBar = React.forwardRef<HTMLDivElement, AppBarProps>(\n (\n {\n title,\n appendLeft,\n appendRight,\n backButton,\n closeButton,\n closeButtonLocation = \"left\",\n border = true,\n iconColor,\n textColor,\n borderColor,\n borderSize,\n height,\n },\n ref,\n ) => {\n const actions = useActions();\n const activity = useActivity();\n\n const theme = useTheme();\n\n const centerRef = useRef<any>(null);\n\n const { maxWidth } = useMaxWidth({\n outerRef: ref,\n innerRef: centerRef,\n enable: theme === \"cupertino\",\n });\n\n const onBackClick = (e: React.MouseEvent<HTMLButtonElement>) => {\n if (backButton && \"onClick\" in backButton && backButton.onClick) {\n backButton.onClick(e);\n }\n\n if (!e.defaultPrevented) {\n actions.pop();\n }\n };\n\n const isCloseButtonVisible =\n activity.zIndex === 0 ||\n (activity.zIndex === 1 &&\n activity.transitionState === \"enter-active\" &&\n activity.pushedBy.name === \"Replaced\");\n\n const renderBackButton = () => {\n if (isCloseButtonVisible) {\n return null;\n }\n\n if (!backButton) {\n return (\n <button\n type=\"button\"\n className={css.backButton}\n onClick={onBackClick}\n >\n <IconBack />\n </button>\n );\n }\n\n if (\"render\" in backButton && backButton.render) {\n return backButton.render?.();\n }\n\n return (\n <button type=\"button\" className={css.backButton} onClick={onBackClick}>\n {\"renderIcon\" in backButton && backButton.renderIcon ? (\n backButton.renderIcon()\n ) : (\n <IconBack />\n )}\n </button>\n );\n };\n\n const renderCloseButton = () => {\n if (!closeButton || !isCloseButtonVisible) {\n return null;\n }\n if (\"render\" in closeButton && closeButton.render) {\n return closeButton.render();\n }\n\n return (\n <button\n type=\"button\"\n className={css.closeButton}\n onClick={\"onClick\" in closeButton ? closeButton.onClick : noop}\n >\n {\"renderIcon\" in closeButton && closeButton.renderIcon ? (\n closeButton.renderIcon()\n ) : (\n <IconClose />\n )}\n </button>\n );\n };\n\n const hasLeft = !!(\n (closeButtonLocation === \"left\" && closeButton) ||\n backButton ||\n appendLeft\n );\n\n return (\n <div\n ref={ref}\n className={css.appBar({\n border,\n })}\n style={assignInlineVars(\n compactMap({\n [globalVars.appBar.iconColor]: iconColor,\n [globalVars.appBar.textColor]: textColor,\n [globalVars.appBar.borderColor]: borderColor,\n [globalVars.appBar.borderSize]: borderSize,\n [globalVars.appBar.height]: height,\n [appScreenCss.vars.appBar.center.mainWidth]: `${maxWidth}px`,\n }),\n )}\n >\n <div className={css.left}>\n {closeButtonLocation === \"left\" && renderCloseButton()}\n {renderBackButton()}\n {appendLeft?.()}\n </div>\n <div ref={centerRef} className={css.center}>\n <div\n className={css.centerMain({\n hasLeft,\n })}\n >\n {typeof title === \"string\" ? (\n <div className={css.centerText}>{title}</div>\n ) : (\n title\n )}\n </div>\n </div>\n <div className={css.right}>\n {appendRight?.()}\n {closeButtonLocation === \"right\" && renderCloseButton()}\n </div>\n </div>\n );\n },\n);\n\nexport default AppBar;\n", "import React from \"react\";\n\nconst IconBack: React.FC<{\n className?: string;\n}> = (props) => (\n <svg\n className={props.className}\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M11.5659 5.56564C11.8783 5.25322 11.8783 4.74669 11.5659 4.43427C11.2535 4.12185 10.7469 4.12185 10.4345 4.43427L3.43451 11.4343C3.12209 11.7467 3.12209 12.2532 3.43451 12.5656L10.4345 19.5656C10.7469 19.8781 11.2535 19.8781 11.5659 19.5656C11.8783 19.2532 11.8783 18.7467 11.5659 18.4343L5.93157 12.8H20.0002C20.442 12.8 20.8002 12.4418 20.8002 12C20.8002 11.5581 20.442 11.2 20.0002 11.2H5.93157L11.5659 5.56564Z\"\n fill=\"currentColor\"\n />\n </svg>\n);\n\nexport default IconBack;\n", "import React from \"react\";\n\nconst IconClose: React.FC<{\n className?: string;\n}> = (props) => (\n <svg\n className={props.className}\n width=\"24\"\n height=\"24\"\n viewBox=\"0 0 24 24\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n >\n <path\n d=\"M6.56588 5.43433C6.25346 5.12191 5.74693 5.12191 5.43451 5.43433C5.12209 5.74675 5.12209 6.25328 5.43451 6.5657L10.8688 12L5.43451 17.4343C5.12209 17.7467 5.12209 18.2533 5.43451 18.5657C5.74693 18.8781 6.25346 18.8781 6.56588 18.5657L12.0002 13.1314L17.4345 18.5657C17.7469 18.8781 18.2535 18.8781 18.5659 18.5657C18.8783 18.2533 18.8783 17.7467 18.5659 17.4343L13.1316 12L18.5659 6.5657C18.8783 6.25328 18.8783 5.74675 18.5659 5.43433C18.2535 5.12191 17.7469 5.12191 17.4345 5.43433L12.0002 10.8686L6.56588 5.43433Z\"\n fill=\"currentColor\"\n />\n <path\n d=\"M6.56588 5.43433C6.25346 5.12191 5.74693 5.12191 5.43451 5.43433C5.12209 5.74675 5.12209 6.25328 5.43451 6.5657L10.8688 12L5.43451 17.4343C5.12209 17.7467 5.12209 18.2533 5.43451 18.5657C5.74693 18.8781 6.25346 18.8781 6.56588 18.5657L12.0002 13.1314L17.4345 18.5657C17.7469 18.8781 18.2535 18.8781 18.5659 18.5657C18.8783 18.2533 18.8783 17.7467 18.5659 17.4343L13.1316 12L18.5659 6.5657C18.8783 6.25328 18.8783 5.74675 18.5659 5.43433C18.2535 5.12191 17.7469 5.12191 17.4345 5.43433L12.0002 10.8686L6.56588 5.43433Z\"\n fill=\"currentColor\"\n />\n </svg>\n);\n\nexport default IconClose;\n", "import 'src/styles/f.css.ts.vanilla.css?source=LmRodGh4cTAgewogIHdpZHRoOiAxMDAlOwp9Ci5kaHRoeHExIHsKICBoZWlnaHQ6IDEwMCU7Cn0KLmRodGh4cTIgewogIHRvcDogMDsKfQouZGh0aHhxMyB7CiAgbGVmdDogMDsKfQouZGh0aHhxNCB7CiAgcG9zaXRpb246IGFic29sdXRlOwp9Ci5kaHRoeHE1IHsKICBwb3NpdGlvbjogcmVsYXRpdmU7Cn0KLmRodGh4cTcgewogIGRpc3BsYXk6IGZsZXg7Cn0KLmRodGh4cTggewogIGFsaWduLWl0ZW1zOiBjZW50ZXI7Cn0KLmRodGh4cTkgewogIGFsaWduLWl0ZW1zOiBmbGV4LWVuZDsKfQouZGh0aHhxYSB7CiAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7Cn0KLmRodGh4cWIgewogIG92ZXJmbG93OiBoaWRkZW47Cn0KLmRodGh4cWMgewogIHdoaXRlLXNwYWNlOiBub3dyYXA7Cn0KLmRodGh4cWQgewogIHRleHQtYWxpZ246IGNlbnRlcjsKfQouZGh0aHhxZSB7CiAgY3Vyc29yOiBwb2ludGVyOwogIC13ZWJraXQtdGFwLWhpZ2hsaWdodC1jb2xvcjogdHJhbnNwYXJlbnQ7Cn0KLmRodGh4cWYgewogIGJveC1zaXppbmc6IGJvcmRlci1ib3g7Cn0KLmRodGh4cWcgewogIGJveC1zaXppbmc6IGNvbnRlbnQtYm94Owp9Ci5kaHRoeHFoIHsKICBhcHBlYXJhbmNlOiBub25lOwogIGJvcmRlcjogMDsKICBwYWRkaW5nOiAwOwogIGJhY2tncm91bmQ6IG5vbmU7Cn0=';\nimport 'src/theme.css.ts.vanilla.css?source=#H4sIAAAAAAAAE+WT3UrEMBCF7/cpAt4obEKzWhYiPomI5GfaBjedMJnisuK7W0X3akvrpZUEQsI5h5l8jCFE3grzeTwGy1YWtv6lOeCrdLZEL4couYMED7YPhDE8ibeNEPKSzo0vLeHQB+nxgGTEVdM091PyENMFC7XOXldb8b2Vrm8mE2zO44WkQwpAUwnVfnFCiScwQufjrKGD2HZsxK2qCdKsPHrsz5+y0+O6m/UwHHmpxyEzJlk6AP5phmyIQxnb+SrwfbMEsh8yEMce/wHmStW/AL1T+z9DWj1rjzmnU7V+iisd1jNCvX6Eqx3ED1vu8AteBwAA';\nimport 'src/components/AppScreen.css.ts.vanilla.css?source=#H4sIAAAAAAAAE61VYW+bMBD9nl/hL5OIFkem7brF0f7HpqmaDtsBE2Nbxkm2Vv3vNVCaAKGCrRIfQPf87t0937H+HXO1u7u9u0dPC4QSYPvUmYPmmBllHEVHcBHGpQ+BnTInnEApGT5IzGWB+/DldvG8WLeUX+dSvk/3rabzDnQpvTS6JWrjpAtnZ/jOuII2rwq8+BHFhHzqomWNNhaY9H8pItvw9Yil5uJPP0/cnmTG2uKRoDPJClFnjP/FwcO1An0mCvEdNHdG8gfUy54JmWaeopg4UWw7raNISS3A4dQBl0L7aJ4vK+TSBCKyQq/Pslv+pq/lrRNxBwcTcckojvRMmobLm+BRuLrYEC+ZM0pVXcInkeylx2/RJiR1Gjw3B5a94+VNtw05pS1bQ5KAqzNzWVoFIa02WnTsj88V5NPsZwcrnJfaXFyAfOJlHeTcfEj6zTQlZFQGfIgM+CcZZHbu4QDmV8b/WvKfUT2cowLm2zHUMjDjcsbGZI33ZL41Q0kDY2ZJag7u64MWOA+Tib2xFDFQbHyRgbXhw+FmLS7RZ8SMDriw/ErYCQxOQJjqUviKrVpo/0kv9HGM+aIOVddxktxnofz1zZfXZT2yYW67p4vmXlfypirbXvwa6pKqhYDw5POVgBfwQmEH5wcAAA==';\nimport 'src/components/AppBar.css.ts.vanilla.css?source=#H4sIAAAAAAAAE61Vy47aMBTdz1d4UwmqOnKAwExG3XTRXVfdtKqq0SVxwB3HtmzzrPrvtZ3A4AkRlOku8X2de+4reUp3z2OYZAT9vkNoSdliaXO0Bj3A2FgonisuN3gOhhV4xTAo5X40bhSHj85GQVkyscBWqhwVUjgrYQcGKopBU8BMGGq9tKtNxbpXce/+S7o9YHlKS15NxpOJE/65S57SQipV71OUHDP4gHItpf1RgoVz2O2S1vRjsVJUWybkzxPTkLyShlkmRY5gbiRfWdoN1YCYvzFq10sAYDUIU0ld580nB0u/DVJC3sVJk38OD6LUkpWdlKWCgtldjshjT/zvLr6m9fAobymKq0LOAGwkD2/C2vURw077YfdDgv8ACd4EqTFMg+FcbrFZQik3OQoTgIjaogJ4Mbg4hXOpS6qxYXs6RO8RToeIXJ7d1qqQXOoY0aiZg2ZEXVMgkmSu+LFOTmtld0GzZEZxcEkLKWikNQ7yEOKKbcLc2jjiifus5RWNCamNF25YaZc5GiWjBtrL0holsw7acQ6FZWv6qtuTUV8cYiL7LBhW3C+iNJJMg6RFE09DFrK4NnlLtzYuRmfKp7dOeQTSLxIP7NfKWFbtXExhqXDE+fS8V21PNzSnlZOlLcmVUw6N5p6S9H52IJ8zQfGhAmmSHXU37dtc8vLx0OdsHxqr7UD31LfMr8z43DKf9i7zk4b1KfsH4GwhMLO0Nu54OTaoPkvRiyiUK5idvoaUK6gZd859aTnFZmec3w/ok+Po+QsUX8P/Z6fZIWlKyGuSD/yGKmRN5c6tlQHOwn247Xhfd7QvHOvzTTu7tWlnp1uobUOSjLvDfd9cTV8Quabae3cwOWfKMPOKTyaWVLMu88f3E78PfWsQoRr0gokWFKysjA0v7MYORw+3ctQD0X+4WH8BFY3tFtYJAAA=';\nimport { createRuntimeFn as _7a468 } from '@vanilla-extract/recipes/createRuntimeFn';\nexport var appBar = _7a468({defaultClassName:'_1yk3a450 dhthxq4 dhthxq8 dhthxq7 dhthxq0 dhthxqg _1dlf4347',variantClassNames:{border:{true:'_1yk3a451'}},defaultVariants:{},compoundVariants:[]});\nexport var backButton = '_1yk3a453 dhthxq8 dhthxq7 dhthxqa dhthxqe dhthxqh';\nexport var center = '_1yk3a455 dhthxq8 dhthxq7';\nexport var centerMain = _7a468({defaultClassName:'_1yk3a456',variantClassNames:{hasLeft:{true:'_1yk3a457'}},defaultVariants:{},compoundVariants:[]});\nexport var centerText = '_1yk3a458 dhthxqb dhthxqc dhthxq0';\nexport var closeButton = '_1yk3a453 dhthxq8 dhthxq7 dhthxqa dhthxqe dhthxqh';\nexport var left = '_1yk3a452 dhthxq8 dhthxq7 dhthxq1';\nexport var right = '_1yk3a459 dhthxq8 dhthxq7 dhthxq1 dhthxq5';", "import 'src/styles/f.css.ts.vanilla.css?source=LmRodGh4cTAgewogIHdpZHRoOiAxMDAlOwp9Ci5kaHRoeHExIHsKICBoZWlnaHQ6IDEwMCU7Cn0KLmRodGh4cTIgewogIHRvcDogMDsKfQouZGh0aHhxMyB7CiAgbGVmdDogMDsKfQouZGh0aHhxNCB7CiAgcG9zaXRpb246IGFic29sdXRlOwp9Ci5kaHRoeHE1IHsKICBwb3NpdGlvbjogcmVsYXRpdmU7Cn0KLmRodGh4cTcgewogIGRpc3BsYXk6IGZsZXg7Cn0KLmRodGh4cTggewogIGFsaWduLWl0ZW1zOiBjZW50ZXI7Cn0KLmRodGh4cTkgewogIGFsaWduLWl0ZW1zOiBmbGV4LWVuZDsKfQouZGh0aHhxYSB7CiAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7Cn0KLmRodGh4cWIgewogIG92ZXJmbG93OiBoaWRkZW47Cn0KLmRodGh4cWMgewogIHdoaXRlLXNwYWNlOiBub3dyYXA7Cn0KLmRodGh4cWQgewogIHRleHQtYWxpZ246IGNlbnRlcjsKfQouZGh0aHhxZSB7CiAgY3Vyc29yOiBwb2ludGVyOwogIC13ZWJraXQtdGFwLWhpZ2hsaWdodC1jb2xvcjogdHJhbnNwYXJlbnQ7Cn0KLmRodGh4cWYgewogIGJveC1zaXppbmc6IGJvcmRlci1ib3g7Cn0KLmRodGh4cWcgewogIGJveC1zaXppbmc6IGNvbnRlbnQtYm94Owp9Ci5kaHRoeHFoIHsKICBhcHBlYXJhbmNlOiBub25lOwogIGJvcmRlcjogMDsKICBwYWRkaW5nOiAwOwogIGJhY2tncm91bmQ6IG5vbmU7Cn0=';\nimport 'src/theme.css.ts.vanilla.css?source=#H4sIAAAAAAAAE+WT3UrEMBCF7/cpAt4obEKzWhYiPomI5GfaBjedMJnisuK7W0X3akvrpZUEQsI5h5l8jCFE3grzeTwGy1YWtv6lOeCrdLZEL4couYMED7YPhDE8ibeNEPKSzo0vLeHQB+nxgGTEVdM091PyENMFC7XOXldb8b2Vrm8mE2zO44WkQwpAUwnVfnFCiScwQufjrKGD2HZsxK2qCdKsPHrsz5+y0+O6m/UwHHmpxyEzJlk6AP5phmyIQxnb+SrwfbMEsh8yEMce/wHmStW/AL1T+z9DWj1rjzmnU7V+iisd1jNCvX6Eqx3ED1vu8AteBwAA';\nimport 'src/components/AppScreen.css.ts.vanilla.css?source=#H4sIAAAAAAAAE61VYW+bMBD9nl/hL5OIFkem7brF0f7HpqmaDtsBE2Nbxkm2Vv3vNVCaAKGCrRIfQPf87t0937H+HXO1u7u9u0dPC4QSYPvUmYPmmBllHEVHcBHGpQ+BnTInnEApGT5IzGWB+/DldvG8WLeUX+dSvk/3rabzDnQpvTS6JWrjpAtnZ/jOuII2rwq8+BHFhHzqomWNNhaY9H8pItvw9Yil5uJPP0/cnmTG2uKRoDPJClFnjP/FwcO1An0mCvEdNHdG8gfUy54JmWaeopg4UWw7raNISS3A4dQBl0L7aJ4vK+TSBCKyQq/Pslv+pq/lrRNxBwcTcckojvRMmobLm+BRuLrYEC+ZM0pVXcInkeylx2/RJiR1Gjw3B5a94+VNtw05pS1bQ5KAqzNzWVoFIa02WnTsj88V5NPsZwcrnJfaXFyAfOJlHeTcfEj6zTQlZFQGfIgM+CcZZHbu4QDmV8b/WvKfUT2cowLm2zHUMjDjcsbGZI33ZL41Q0kDY2ZJag7u64MWOA+Tib2xFDFQbHyRgbXhw+FmLS7RZ8SMDriw/ErYCQxOQJjqUviKrVpo/0kv9HGM+aIOVddxktxnofz1zZfXZT2yYW67p4vmXlfypirbXvwa6pKqhYDw5POVgBfwQmEH5wcAAA==';\nimport { createRuntimeFn as _7a468 } from '@vanilla-extract/recipes/createRuntimeFn';\nexport var allTransitions = '_1dlf4348';\nexport var appScreen = _7a468({defaultClassName:'dhthxq4 dhthxq0 dhthxq1 dhthxq2 dhthxq3 dhthxqb',variantClassNames:{transitionState:{'enter-active':'_1dlf4349','enter-done':'_1dlf434a','exit-active':'_1dlf434b','exit-done':'_1dlf434c'}},defaultVariants:{},compoundVariants:[]});\nexport var background = '_1dlf4347';\nexport var dim = '_1dlf434i dhthxq4 dhthxq0 dhthxq1 dhthxq2 dhthxq3 _1dlf4346 _1dlf4348';\nexport var edge = _7a468({defaultClassName:'_1dlf434l dhthxq4 dhthxq2 dhthxq3 dhthxq1',variantClassNames:{hasAppBar:{true:'_1dlf434m'}},defaultVariants:{},compoundVariants:[]});\nexport var enterActive = '_1dlf4349';\nexport var enterDone = '_1dlf434a';\nexport var exitActive = '_1dlf434b';\nexport var exitDone = '_1dlf434c';\nexport var paper = _7a468({defaultClassName:'_1dlf434j dhthxq4 dhthxq0 dhthxq1 dhthxq2 dhthxq3 _1dlf4347 _1dlf4348',variantClassNames:{hasAppBar:{true:'_1dlf434k dhthxqf'}},defaultVariants:{},compoundVariants:[]});\nexport var vars = {transitionDuration:'var(--_1dlf4340)',zIndexes:{dim:'var(--_1dlf4341)',paper:'var(--_1dlf4342)',edge:'var(--_1dlf4343)',appBar:'var(--_1dlf4344)'},appBar:{center:{mainWidth:'var(--_1dlf4345)'}}};", "/* eslint-disable jsx-a11y/no-static-element-interactions, jsx-a11y/click-events-have-key-events */\n\nimport { useActions, useActivity } from \"@stackflow/react\";\nimport { assignInlineVars } from \"@vanilla-extract/dynamic\";\nimport React, { useRef } from \"react\";\n\nimport { useLazy, useStyleEffect } from \"../hooks\";\nimport type { GlobalVars } from \"../theme.css\";\nimport { globalVars } from \"../theme.css\";\nimport { compactMap } from \"../utils\";\nimport * as css from \"./BottomSheet.css\";\n\ntype BottomSheetProps = Partial<\n Pick<GlobalVars, \"backgroundColor\" | \"dimBackgroundColor\">\n> &\n Partial<GlobalVars[\"bottomSheet\"]> & {\n children: React.ReactNode;\n };\nconst BottomSheet: React.FC<BottomSheetProps> = ({\n borderRadius = \"1rem\",\n backgroundColor,\n dimBackgroundColor,\n children,\n}) => {\n const activity = useActivity();\n const { pop } = useActions();\n\n const containerRef = useRef<HTMLDivElement>(null);\n const paperRef = useRef<HTMLDivElement>(null);\n\n useStyleEffect({\n styleName: \"hide\",\n refs: [containerRef],\n });\n useStyleEffect({\n styleName: \"offset\",\n refs: [paperRef],\n });\n useStyleEffect({\n styleName: \"swipe-back\",\n refs: [paperRef],\n });\n\n const popLock = useRef(false);\n\n const onDimClick = () => {\n if (popLock.current) {\n return;\n }\n\n pop();\n popLock.current = true;\n };\n const onPaperClick: React.MouseEventHandler = (e) => {\n e.stopPropagation();\n };\n\n const zIndexBase = activity.zIndex * 5 + 3;\n const zIndexPaper = activity.zIndex * 5 + 4;\n\n return (\n <div\n className={css.container({\n transitionState: useLazy(activity.transitionState),\n })}\n ref={containerRef}\n style={assignInlineVars(\n compactMap({\n [globalVars.bottomSheet.borderRadius]: borderRadius,\n [globalVars.backgroundColor]: backgroundColor,\n [globalVars.dimBackgroundColor]: dimBackgroundColor,\n [css.vars.zIndexes.dim]: `${zIndexBase}`,\n [css.vars.zIndexes.paper]: `${zIndexPaper}`,\n [css.vars.transitionDuration]:\n activity.transitionState === \"enter-active\" ||\n activity.transitionState === \"exit-active\"\n ? `var(--stackflow-transition-duration)`\n : \"0ms\",\n }),\n )}\n >\n <div className={css.dim} ref={paperRef} onClick={onDimClick}>\n <div className={css.paper} onClick={onPaperClick}>\n {children}\n </div>\n </div>\n </div>\n );\n};\n\nexport default BottomSheet;\n", "import 'src/styles/f.css.ts.vanilla.css?source=LmRodGh4cTAgewogIHdpZHRoOiAxMDAlOwp9Ci5kaHRoeHExIHsKICBoZWlnaHQ6IDEwMCU7Cn0KLmRodGh4cTIgewogIHRvcDogMDsKfQouZGh0aHhxMyB7CiAgbGVmdDogMDsKfQouZGh0aHhxNCB7CiAgcG9zaXRpb246IGFic29sdXRlOwp9Ci5kaHRoeHE1IHsKICBwb3NpdGlvbjogcmVsYXRpdmU7Cn0KLmRodGh4cTcgewogIGRpc3BsYXk6IGZsZXg7Cn0KLmRodGh4cTggewogIGFsaWduLWl0ZW1zOiBjZW50ZXI7Cn0KLmRodGh4cTkgewogIGFsaWduLWl0ZW1zOiBmbGV4LWVuZDsKfQouZGh0aHhxYSB7CiAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7Cn0KLmRodGh4cWIgewogIG92ZXJmbG93OiBoaWRkZW47Cn0KLmRodGh4cWMgewogIHdoaXRlLXNwYWNlOiBub3dyYXA7Cn0KLmRodGh4cWQgewogIHRleHQtYWxpZ246IGNlbnRlcjsKfQouZGh0aHhxZSB7CiAgY3Vyc29yOiBwb2ludGVyOwogIC13ZWJraXQtdGFwLWhpZ2hsaWdodC1jb2xvcjogdHJhbnNwYXJlbnQ7Cn0KLmRodGh4cWYgewogIGJveC1zaXppbmc6IGJvcmRlci1ib3g7Cn0KLmRodGh4cWcgewogIGJveC1zaXppbmc6IGNvbnRlbnQtYm94Owp9Ci5kaHRoeHFoIHsKICBhcHBlYXJhbmNlOiBub25lOwogIGJvcmRlcjogMDsKICBwYWRkaW5nOiAwOwogIGJhY2tncm91bmQ6IG5vbmU7Cn0=';\nimport 'src/theme.css.ts.vanilla.css?source=#H4sIAAAAAAAAE+WT3UrEMBCF7/cpAt4obEKzWhYiPomI5GfaBjedMJnisuK7W0X3akvrpZUEQsI5h5l8jCFE3grzeTwGy1YWtv6lOeCrdLZEL4couYMED7YPhDE8ibeNEPKSzo0vLeHQB+nxgGTEVdM091PyENMFC7XOXldb8b2Vrm8mE2zO44WkQwpAUwnVfnFCiScwQufjrKGD2HZsxK2qCdKsPHrsz5+y0+O6m/UwHHmpxyEzJlk6AP5phmyIQxnb+SrwfbMEsh8yEMce/wHmStW/AL1T+z9DWj1rjzmnU7V+iisd1jNCvX6Eqx3ED1vu8AteBwAA';\nimport 'src/components/BottomSheet.css.ts.vanilla.css?source=Ll8xaHQzOGgwMyB7CiAgdHJhbnNpdGlvbjogdmFyKC0tXzFodDM4aDAwKTsKfQouXzFodDM4aDA3IHsKICB0cmFuc2Zvcm06IHRyYW5zbGF0ZVgoMTAwJSk7Cn0KLl8xaHQzOGgwZCB7CiAgYmFja2dyb3VuZC1jb2xvcjogdmFyKC0tc3RhY2tmbG93LWJhc2ljLXVpLWRpbS1iYWNrZ3JvdW5kLWNvbG9yKTsKICB6LWluZGV4OiB2YXIoLS1fMWh0MzhoMDEpOwogIG9wYWNpdHk6IDA7Cn0KLl8xaHQzOGgwNCAuXzFodDM4aDBkLCAuXzFodDM4aDA1IC5fMWh0MzhoMGQgewogIG9wYWNpdHk6IDE7Cn0KLl8xaHQzOGgwNiAuXzFodDM4aDBkLCAuXzFodDM4aDA3IC5fMWh0MzhoMGQgewogIG9wYWNpdHk6IDA7Cn0KLl8xaHQzOGgwZSB7CiAgYmFja2dyb3VuZC1jb2xvcjogdmFyKC0tc3RhY2tmbG93LWJhc2ljLXVpLWJhY2tncm91bmQtY29sb3IpOwogIHdpZHRoOiAxMDAlOwogIGJvcmRlci1yYWRpdXM6IHZhcigtLXN0YWNrZmxvdy1iYXNpYy11aS1ib3R0b20tc2hlZXQtYm9yZGVyLXJhZGl1cykgdmFyKC0tc3RhY2tmbG93LWJhc2ljLXVpLWJvdHRvbS1zaGVldC1ib3JkZXItcmFkaXVzKSAwIDA7CiAgdHJhbnNmb3JtOiB0cmFuc2xhdGVZKDEwMCUpOwogIG9wYWNpdHk6IDA7Cn0KLl8xaHQzOGgwNCAuXzFodDM4aDBlLCAuXzFodDM4aDA1IC5fMWh0MzhoMGUgewogIHRyYW5zZm9ybTogdHJhbnNsYXRlWSgwKTsKICBvcGFjaXR5OiAxOwp9Ci5fMWh0MzhoMDYgLl8xaHQzOGgwZSwgLl8xaHQzOGgwNyAuXzFodDM4aDBlIHsKICB0cmFuc2Zvcm06IHRyYW5zbGF0ZVkoMTAwJSk7CiAgb3BhY2l0eTogMDsKfQ==';\nimport { createRuntimeFn as _7a468 } from '@vanilla-extract/recipes/createRuntimeFn';\nexport var container = _7a468({defaultClassName:'dhthxq4 dhthxq0 dhthxq1 dhthxq2 dhthxq3 dhthxqb',variantClassNames:{transitionState:{'enter-active':'_1ht38h04','enter-done':'_1ht38h05','exit-active':'_1ht38h06','exit-done':'_1ht38h07'}},defaultVariants:{},compoundVariants:[]});\nexport var dim = '_1ht38h0d dhthxq4 dhthxq0 dhthxq1 dhthxq2 dhthxq3 dhthxqb dhthxq9 dhthxq7 _1ht38h03';\nexport var enterActive = '_1ht38h04';\nexport var enterDone = '_1ht38h05';\nexport var exitActive = '_1ht38h06';\nexport var exitDone = '_1ht38h07';\nexport var paper = '_1ht38h0e dhthxqb _1ht38h03';\nexport var vars = {transitionDuration:'var(--_1ht38h00)',zIndexes:{dim:'var(--_1ht38h01)',paper:'var(--_1ht38h02)'}};", "/* eslint-disable jsx-a11y/no-static-element-interactions, jsx-a11y/click-events-have-key-events */\n\nimport { useActions, useActivity } from \"@stackflow/react\";\nimport { assignInlineVars } from \"@vanilla-extract/dynamic\";\nimport React, { useRef } from \"react\";\n\nimport { useLazy, useStyleEffect } from \"../hooks\";\nimport type { GlobalVars } from \"../theme.css\";\nimport { globalVars } from \"../theme.css\";\nimport { compactMap } from \"../utils\";\nimport * as css from \"./Modal.css\";\n\ntype ModalProps = Partial<\n Pick<GlobalVars, \"backgroundColor\" | \"dimBackgroundColor\">\n> &\n Partial<GlobalVars[\"modal\"]> & {\n children: React.ReactNode;\n };\nconst Modal: React.FC<ModalProps> = ({\n backgroundColor,\n dimBackgroundColor,\n borderRadius = \"1rem\",\n children,\n}) => {\n const activity = useActivity();\n const { pop } = useActions();\n\n const containerRef = useRef<HTMLDivElement>(null);\n const paperRef = useRef<HTMLDivElement>(null);\n\n useStyleEffect({\n styleName: \"hide\",\n refs: [containerRef],\n });\n useStyleEffect({\n styleName: \"offset\",\n refs: [paperRef],\n });\n useStyleEffect({\n styleName: \"swipe-back\",\n refs: [paperRef],\n });\n\n const popLock = useRef(false);\n\n const onDimClick = () => {\n if (popLock.current) {\n return;\n }\n\n pop();\n popLock.current = true;\n };\n const onPaperClick: React.MouseEventHandler = (e) => {\n e.stopPropagation();\n };\n\n const zIndexBase = activity.zIndex * 5 + 3;\n const zIndexPaper = activity.zIndex * 5 + 4;\n\n return (\n <div\n className={css.container({\n transitionState: useLazy(activity.transitionState),\n })}\n ref={containerRef}\n style={assignInlineVars(\n compactMap({\n [globalVars.bottomSheet.borderRadius]: borderRadius,\n [globalVars.backgroundColor]: backgroundColor,\n [globalVars.dimBackgroundColor]: dimBackgroundColor,\n [css.vars.zIndexes.dim]: `${zIndexBase}`,\n [css.vars.zIndexes.paper]: `${zIndexPaper}`,\n [css.vars.transitionDuration]:\n activity.transitionState === \"enter-active\" ||\n activity.transitionState === \"exit-active\"\n ? `var(--stackflow-transition-duration)`\n : \"0ms\",\n }),\n )}\n >\n <div className={css.dim} ref={paperRef} onClick={onDimClick}>\n <div className={css.paper} onClick={onPaperClick}>\n {children}\n </div>\n </div>\n </div>\n );\n};\n\nexport default Modal;\n", "import 'src/styles/f.css.ts.vanilla.css?source=LmRodGh4cTAgewogIHdpZHRoOiAxMDAlOwp9Ci5kaHRoeHExIHsKICBoZWlnaHQ6IDEwMCU7Cn0KLmRodGh4cTIgewogIHRvcDogMDsKfQouZGh0aHhxMyB7CiAgbGVmdDogMDsKfQouZGh0aHhxNCB7CiAgcG9zaXRpb246IGFic29sdXRlOwp9Ci5kaHRoeHE1IHsKICBwb3NpdGlvbjogcmVsYXRpdmU7Cn0KLmRodGh4cTcgewogIGRpc3BsYXk6IGZsZXg7Cn0KLmRodGh4cTggewogIGFsaWduLWl0ZW1zOiBjZW50ZXI7Cn0KLmRodGh4cTkgewogIGFsaWduLWl0ZW1zOiBmbGV4LWVuZDsKfQouZGh0aHhxYSB7CiAganVzdGlmeS1jb250ZW50OiBjZW50ZXI7Cn0KLmRodGh4cWIgewogIG92ZXJmbG93OiBoaWRkZW47Cn0KLmRodGh4cWMgewogIHdoaXRlLXNwYWNlOiBub3dyYXA7Cn0KLmRodGh4cWQgewogIHRleHQtYWxpZ246IGNlbnRlcjsKfQouZGh0aHhxZSB7CiAgY3Vyc29yOiBwb2ludGVyOwogIC13ZWJraXQtdGFwLWhpZ2hsaWdodC1jb2xvcjogdHJhbnNwYXJlbnQ7Cn0KLmRodGh4cWYgewogIGJveC1zaXppbmc6IGJvcmRlci1ib3g7Cn0KLmRodGh4cWcgewogIGJveC1zaXppbmc6IGNvbnRlbnQtYm94Owp9Ci5kaHRoeHFoIHsKICBhcHBlYXJhbmNlOiBub25lOwogIGJvcmRlcjogMDsKICBwYWRkaW5nOiAwOwogIGJhY2tncm91bmQ6IG5vbmU7Cn0=';\nimport 'src/theme.css.ts.vanilla.css?source=#H4sIAAAAAAAAE+WT3UrEMBCF7/cpAt4obEKzWhYiPomI5GfaBjedMJnisuK7W0X3akvrpZUEQsI5h5l8jCFE3grzeTwGy1YWtv6lOeCrdLZEL4couYMED7YPhDE8ibeNEPKSzo0vLeHQB+nxgGTEVdM091PyENMFC7XOXldb8b2Vrm8mE2zO44WkQwpAUwnVfnFCiScwQufjrKGD2HZsxK2qCdKsPHrsz5+y0+O6m/UwHHmpxyEzJlk6AP5phmyIQxnb+SrwfbMEsh8yEMce/wHmStW/AL1T+z9DWj1rjzmnU7V+iisd1jNCvX6Eqx3ED1vu8AteBwAA';\nimport 'src/components/Modal.css.ts.vanilla.css?source=Ll81b3pnOGMzIHsKICB0cmFuc2l0aW9uOiB2YXIoLS1fNW96ZzhjMCk7Cn0KLl81b3pnOGM3IHsKICB0cmFuc2Zvcm06IHRyYW5zbGF0ZVgoMTAwJSk7Cn0KLl81b3pnOGNkIHsKICBiYWNrZ3JvdW5kLWNvbG9yOiB2YXIoLS1zdGFja2Zsb3ctYmFzaWMtdWktZGltLWJhY2tncm91bmQtY29sb3IpOwogIHotaW5kZXg6IHZhcigtLV81b3pnOGMxKTsKICBvcGFjaXR5OiAwOwp9Ci5fNW96ZzhjNCAuXzVvemc4Y2QsIC5fNW96ZzhjNSAuXzVvemc4Y2QgewogIG9wYWNpdHk6IDE7Cn0KLl81b3pnOGM2IC5fNW96ZzhjZCwgLl81b3pnOGM3IC5fNW96ZzhjZCB7CiAgb3BhY2l0eTogMDsKfQouXzVvemc4Y2UgewogIGJhY2tncm91bmQtY29sb3I6IHZhcigtLXN0YWNrZmxvdy1iYXNpYy11aS1iYWNrZ3JvdW5kLWNvbG9yKTsKICB3aWR0aDogMTAwJTsKICBtYXJnaW46IDAgMi41cmVtOwogIGJveC1zaGFkb3c6IDBweCAwLjYyNXJlbSAyLjM3NXJlbSByZ2JhKDAsIDAsIDAsIDAuMTUpLCAwcHggLjU2MjVyZW0gMi44NzVyZW0gcmdiYSgwLCAwLCAwLCAwLjEyKSwgMHB4IC4zMTI1cmVtIC45Mzc1cmVtIHJnYmEoMCwgMCwgMCwgMC4xKTsKICBib3JkZXItcmFkaXVzOiB2YXIoLS1zdGFja2Zsb3ctYmFzaWMtdWktYm90dG9tLXNoZWV0LWJvcmRlci1yYWRpdXMpOwogIHRyYW5zZm9ybTogc2NhbGUoMS4xKTsKICBvcGFjaXR5OiAwOwp9Ci5fNW96ZzhjNCAuXzVvemc4Y2UsIC5fNW96ZzhjNSAuXzVvemc4Y2UgewogIHRyYW5zZm9ybTogc2NhbGUoMSk7CiAgb3BhY2l0eTogMTsKfQouXzVvemc4YzYgLl81b3pnOGNlLCAuXzVvemc4YzcgLl81b3pnOGNlIHsKICB0cmFuc2Zvcm06IHNjYWxlKDEuMSk7CiAgb3BhY2l0eTogMDsKfQ==';\nimport { createRuntimeFn as _7a468 } from '@vanilla-extract/recipes/createRuntimeFn';\nexport var container = _7a468({defaultClassName:'dhthxq4 dhthxq0 dhthxq1 dhthxq2 dhthxq3 dhthxqb',variantClassNames:{transitionState:{'enter-active':'_5ozg8c4','enter-done':'_5ozg8c5','exit-active':'_5ozg8c6','exit-done':'_5ozg8c7'}},defaultVariants:{},compoundVariants:[]});\nexport var dim = '_5ozg8cd dhthxq4 dhthxq0 dhthxq1 dhthxq2 dhthxq3 dhthxqb dhthxq8 dhthxq7 dhthxqa _5ozg8c3';\nexport var enterActive = '_5ozg8c4';\nexport var enterDone = '_5ozg8c5';\nexport var exitActive = '_5ozg8c6';\nexport var exitDone = '_5ozg8c7';\nexport var paper = '_5ozg8ce dhthxqb _5ozg8c3';\nexport var vars = {transitionDuration:'var(--_5ozg8c0)',zIndexes:{dim:'var(--_5ozg8c1)',paper:'var(--_5ozg8c2)'}};"],
5
+ "mappings": "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",
6
+ "names": ["assignInlineVars", "React", "useEffect", "useState", "compactMap", "obj", "acc", "key", "value", "listenOnce", "el", "type", "cb", "listener", "listenResize", "cb", "noop", "requestNextFrame", "cb", "useLazy", "value", "state", "setState", "useState", "useEffect", "requestNextFrame", "useEffect", "useState", "useMaxWidth", "outerRef", "innerRef", "enable", "maxWidth", "setMaxWidth", "useState", "useEffect", "$outer", "$inner", "noop", "listenResize", "screenWidth", "leftWidth", "centerWidth", "rightWidth", "sideMargin", "useActivity", "useEffect", "connections", "useStyleEffect", "styleName", "refs", "effect", "activity", "arr", "connection", "cleanup", "useStyleEffectHide", "refs", "hasEffect", "useStyleEffect", "activityTransitionState", "ref", "OFFSET_PX_ANDROID", "OFFSET_PX_CUPERTINO", "useStyleEffectOffset", "refs", "theme", "hasEffect", "useStyleEffect", "activityTransitionState", "transform", "ref", "requestNextFrame", "listenOnce", "useStyleEffectSwipeBack", "theme", "dimRef", "edgeRef", "paperRef", "hasEffect", "onSwiped", "useStyleEffect", "refs", "$dim", "$edge", "$paper", "x0", "t0", "x", "cachedRefs", "resetState", "_rAFLock", "movePaper", "dx", "p", "ref", "_a", "OFFSET_PX_CUPERTINO", "resetPaper", "swiped", "listenOnce", "i", "cachedRef", "onTouchStart", "e", "activeElement", "onTouchMove", "onTouchEnd", "t", "createContext", "useContext", "ThemeContext", "ThemeProvider", "useTheme", "theme_css_exports", "__export", "android", "cupertino", "globalVars", "rootAndroid", "rootCupertino", "android", "cupertino", "globalVars", "rootAndroid", "rootCupertino", "basicUIPlugin", "options", "stack", "_a", "_b", "_c", "_d", "_e", "_f", "_g", "React", "ThemeProvider", "theme_css_exports", "assignInlineVars", "compactMap", "globalVars", "useActions", "useActivity", "assignInlineVars", "React", "useRef", "useActions", "useActivity", "assignInlineVars", "React", "useRef", "React", "IconBack", "props", "IconBack_default", "React", "IconClose", "props", "IconClose_default", "_7a468", "appBar", "backButton", "center", "centerMain", "centerText", "closeButton", "left", "right", "_7a468", "appScreen", "_7a468", "dim", "edge", "_7a468", "paper", "_7a468", "vars", "AppBar", "React", "title", "appendLeft", "appendRight", "backButton", "closeButton", "closeButtonLocation", "border", "iconColor", "textColor", "borderColor", "borderSize", "height", "ref", "actions", "useActions", "activity", "useActivity", "theme", "useTheme", "centerRef", "useRef", "maxWidth", "useMaxWidth", "onBackClick", "e", "isCloseButtonVisible", "renderBackButton", "_a", "IconBack_default", "renderCloseButton", "noop", "IconClose_default", "hasLeft", "appBar", "assignInlineVars", "compactMap", "globalVars", "vars", "left", "center", "centerMain", "centerText", "right", "AppBar_default", "AppScreen", "appBar", "children", "theme", "useTheme", "activity", "useActivity", "pop", "useActions", "appScreenRef", "useRef", "dimRef", "paperRef", "edgeRef", "appBarRef", "useStyleEffectHide", "useStyleEffectOffset", "useStyleEffectSwipeBack", "isRoot", "hasAppBar", "zIndexBase", "zIndexDim", "zIndexPaper", "zIndexEdge", "zIndexAppBar", "React", "appScreen", "useLazy", "assignInlineVars", "compactMap", "globalVars", "vars", "dim", "paper", "edge", "AppBar_default", "__spreadProps", "__spreadValues", "AppScreen_default", "useActions", "useActivity", "assignInlineVars", "React", "useRef", "_7a468", "container", "dim", "paper", "vars", "BottomSheet", "borderRadius", "backgroundColor", "dimBackgroundColor", "children", "activity", "useActivity", "pop", "useActions", "containerRef", "useRef", "paperRef", "useStyleEffect", "popLock", "onDimClick", "onPaperClick", "e", "zIndexBase", "zIndexPaper", "React", "container", "useLazy", "assignInlineVars", "compactMap", "globalVars", "vars", "dim", "paper", "BottomSheet_default", "useActions", "useActivity", "assignInlineVars", "React", "useRef", "_7a468", "container", "dim", "paper", "vars", "Modal", "backgroundColor", "dimBackgroundColor", "borderRadius", "children", "activity", "useActivity", "pop", "useActions", "containerRef", "useRef", "paperRef", "useStyleEffect", "popLock", "onDimClick", "onPaperClick", "e", "zIndexBase", "zIndexPaper", "React", "container", "useLazy", "assignInlineVars", "compactMap", "globalVars", "vars", "dim", "paper", "Modal_default"]
7
+ }
@@ -0,0 +1,18 @@
1
+ export declare const fullWidth: string;
2
+ export declare const fullHeight: string;
3
+ export declare const top0: string;
4
+ export declare const left0: string;
5
+ export declare const posAbs: string;
6
+ export declare const posRel: string;
7
+ export declare const posAbsFull: string;
8
+ export declare const flex: string;
9
+ export declare const flexAlignCenter: string;
10
+ export declare const flexAlignEnd: string;
11
+ export declare const flexJustifyCenter: string;
12
+ export declare const overflowHidden: string;
13
+ export declare const whiteSpaceNowrap: string;
14
+ export declare const textAlignCenter: string;
15
+ export declare const cursorPointer: string;
16
+ export declare const borderBox: string;
17
+ export declare const contentBox: string;
18
+ export declare const resetButton: string;
@@ -0,0 +1 @@
1
+ export * as f from "./f.css";
@@ -0,0 +1,25 @@
1
+ import type { MapLeafNodes } from "@vanilla-extract/private";
2
+ export declare const globalVars: MapLeafNodes<{
3
+ backgroundColor: string;
4
+ dimBackgroundColor: string;
5
+ appBar: {
6
+ borderColor: string;
7
+ borderSize: string;
8
+ height: string;
9
+ iconColor: string;
10
+ textColor: string;
11
+ };
12
+ bottomSheet: {
13
+ borderRadius: string;
14
+ };
15
+ modal: {
16
+ borderRadius: string;
17
+ };
18
+ }, import("@vanilla-extract/private").CSSVarFunction>;
19
+ declare type InferVars<T> = T extends MapLeafNodes<infer U, any> ? U : never;
20
+ export declare type GlobalVars = InferVars<typeof globalVars>;
21
+ export declare const rootAndroid = ":root[data-stackflow-basic-ui-theme=android]";
22
+ export declare const rootCupertino = ":root[data-stackflow-basic-ui-theme=cupertino]";
23
+ export declare const android: string;
24
+ export declare const cupertino: string;
25
+ export {};
@@ -0,0 +1,2 @@
1
+ /// <reference types="react" />
2
+ export declare type PropOf<T> = T extends React.ComponentType<infer U> ? U : never;
@@ -0,0 +1,3 @@
1
+ export declare function compactMap<T extends {}>(obj: T): {
2
+ [key in keyof T]: NonNullable<T[key]>;
3
+ };
@@ -0,0 +1,7 @@
1
+ export * from "./compactMap";
2
+ export * from "./last";
3
+ export * from "./listenOnce";
4
+ export * from "./listenResize";
5
+ export * from "./noop";
6
+ export * from "./PropOf";
7
+ export * from "./requestNextFrame";
@@ -0,0 +1 @@
1
+ export declare const last: <T extends unknown>(arr: T[]) => T;
@@ -0,0 +1 @@
1
+ export declare function listenOnce<T extends HTMLElement>(el: T, type: keyof HTMLElementEventMap, cb: () => void): void;
@@ -0,0 +1 @@
1
+ export declare const listenResize: (cb: () => void) => () => void;
@@ -0,0 +1 @@
1
+ export declare const noop: () => void;
@@ -0,0 +1 @@
1
+ export declare function requestNextFrame(cb: () => void): void;
package/package.json ADDED
@@ -0,0 +1,61 @@
1
+ {
2
+ "name": "@stackflow/plugin-basic-ui",
3
+ "version": "0.14.1",
4
+ "license": "MIT",
5
+ "exports": {
6
+ ".": {
7
+ "require": "./dist/index.js",
8
+ "import": "./dist/index.mjs"
9
+ },
10
+ "./index.css": "./dist/index.css"
11
+ },
12
+ "main": "./dist/index.js",
13
+ "module": "./dist/index.mjs",
14
+ "types": "./dist/index.d.ts",
15
+ "files": [
16
+ "dist",
17
+ "src",
18
+ "README.md"
19
+ ],
20
+ "scripts": {
21
+ "build": "yarn build:js && yarn build:dts",
22
+ "build:dts": "tsc --emitDeclarationOnly",
23
+ "build:js": "node ./esbuild.config.js",
24
+ "clean": "rimraf dist",
25
+ "dev": "yarn build:js --watch && yarn build:dts --watch"
26
+ },
27
+ "dependencies": {
28
+ "@vanilla-extract/dynamic": "^2.0.2",
29
+ "@vanilla-extract/private": "^1.0.3",
30
+ "@vanilla-extract/recipes": "^0.2.5",
31
+ "ts-pattern": "^4.0.5"
32
+ },
33
+ "devDependencies": {
34
+ "@stackflow/core": "^0.14.0",
35
+ "@stackflow/esbuild-config": "^0.14.0",
36
+ "@stackflow/react": "^0.14.0",
37
+ "@types/react": "^18.0.10",
38
+ "@vanilla-extract/css": "^1.7.2",
39
+ "@vanilla-extract/css-utils": "^0.1.2",
40
+ "esbuild": "^0.14.51",
41
+ "react": "^18.1.0",
42
+ "rimraf": "^3.0.2",
43
+ "typescript": "^4.7.4"
44
+ },
45
+ "peerDependencies": {
46
+ "@stackflow/core": "0",
47
+ "@stackflow/react": "0",
48
+ "@types/react": ">=16.8.0",
49
+ "react": ">=16.8.0"
50
+ },
51
+ "publishConfig": {
52
+ "access": "public"
53
+ },
54
+ "ultra": {
55
+ "concurrent": [
56
+ "dev",
57
+ "build"
58
+ ]
59
+ },
60
+ "gitHead": "78548991935be3c48f56abad9d49f524b94cf0a9"
61
+ }
@@ -0,0 +1,21 @@
1
+ import React from "react";
2
+
3
+ const IconBack: React.FC<{
4
+ className?: string;
5
+ }> = (props) => (
6
+ <svg
7
+ className={props.className}
8
+ width="24"
9
+ height="24"
10
+ viewBox="0 0 24 24"
11
+ fill="none"
12
+ xmlns="http://www.w3.org/2000/svg"
13
+ >
14
+ <path
15
+ d="M11.5659 5.56564C11.8783 5.25322 11.8783 4.74669 11.5659 4.43427C11.2535 4.12185 10.7469 4.12185 10.4345 4.43427L3.43451 11.4343C3.12209 11.7467 3.12209 12.2532 3.43451 12.5656L10.4345 19.5656C10.7469 19.8781 11.2535 19.8781 11.5659 19.5656C11.8783 19.2532 11.8783 18.7467 11.5659 18.4343L5.93157 12.8H20.0002C20.442 12.8 20.8002 12.4418 20.8002 12C20.8002 11.5581 20.442 11.2 20.0002 11.2H5.93157L11.5659 5.56564Z"
16
+ fill="currentColor"
17
+ />
18
+ </svg>
19
+ );
20
+
21
+ export default IconBack;
@@ -0,0 +1,25 @@
1
+ import React from "react";
2
+
3
+ const IconClose: React.FC<{
4
+ className?: string;
5
+ }> = (props) => (
6
+ <svg
7
+ className={props.className}
8
+ width="24"
9
+ height="24"
10
+ viewBox="0 0 24 24"
11
+ fill="none"
12
+ xmlns="http://www.w3.org/2000/svg"
13
+ >
14
+ <path
15
+ d="M6.56588 5.43433C6.25346 5.12191 5.74693 5.12191 5.43451 5.43433C5.12209 5.74675 5.12209 6.25328 5.43451 6.5657L10.8688 12L5.43451 17.4343C5.12209 17.7467 5.12209 18.2533 5.43451 18.5657C5.74693 18.8781 6.25346 18.8781 6.56588 18.5657L12.0002 13.1314L17.4345 18.5657C17.7469 18.8781 18.2535 18.8781 18.5659 18.5657C18.8783 18.2533 18.8783 17.7467 18.5659 17.4343L13.1316 12L18.5659 6.5657C18.8783 6.25328 18.8783 5.74675 18.5659 5.43433C18.2535 5.12191 17.7469 5.12191 17.4345 5.43433L12.0002 10.8686L6.56588 5.43433Z"
16
+ fill="currentColor"
17
+ />
18
+ <path
19
+ d="M6.56588 5.43433C6.25346 5.12191 5.74693 5.12191 5.43451 5.43433C5.12209 5.74675 5.12209 6.25328 5.43451 6.5657L10.8688 12L5.43451 17.4343C5.12209 17.7467 5.12209 18.2533 5.43451 18.5657C5.74693 18.8781 6.25346 18.8781 6.56588 18.5657L12.0002 13.1314L17.4345 18.5657C17.7469 18.8781 18.2535 18.8781 18.5659 18.5657C18.8783 18.2533 18.8783 17.7467 18.5659 17.4343L13.1316 12L18.5659 6.5657C18.8783 6.25328 18.8783 5.74675 18.5659 5.43433C18.2535 5.12191 17.7469 5.12191 17.4345 5.43433L12.0002 10.8686L6.56588 5.43433Z"
20
+ fill="currentColor"
21
+ />
22
+ </svg>
23
+ );
24
+
25
+ export default IconClose;
@@ -0,0 +1,2 @@
1
+ export { default as IconBack } from "./IconBack";
2
+ export { default as IconClose } from "./IconClose";