tguikit 0.1.0 → 0.1.1

package/README.md

@@ -2,8 +2,6 @@
 
 React 19 component library for Telegram Mini Apps — a modern reimplementation of [`@telegram-apps/telegram-ui`](https://github.com/telegram-mini-apps-dev/TelegramUI).
 
-**[Storybook →](https://alwaysgladtobethefirst.github.io/tgui/)**
-
 > Pre-release. The API is still moving before `1.0`.
 
 ## Install
@@ -44,10 +42,7 @@ bun install
 bun run storybook
 ```
 
-Storybook is the workbench — every component has a story. The hosted build is at
-[alwaysgladtobethefirst.github.io/tgui](https://alwaysgladtobethefirst.github.io/tgui/).
-
-See [`CONTRIBUTING.md`](./CONTRIBUTING.md).
+Storybook is the workbench — every component has a story. See [`CONTRIBUTING.md`](./CONTRIBUTING.md).
 
 ## License
 

package/dist/index.js

@@ -203,9 +203,9 @@ function ue() {
 	return /iphone|ipad|ipod/i.test(t) || n ? "ios" : "base";
 }
 var k = {
-	wrapper: "_wrapper_1jphr_1",
-	"wrapper--ios": "_wrapper--ios_1jphr_89",
-	"wrapper--dark": "_wrapper--dark_1jphr_102"
+	wrapper: "_wrapper_17e4j_1",
+	"wrapper--ios": "_wrapper--ios_17e4j_89",
+	"wrapper--dark": "_wrapper--dark_17e4j_102"
 }, de = () => "light";
 function fe({ ref: e, platform: t, appearance: r, portalContainer: i, className: a, children: o, ...s }) {
 	let l = d(() => t ?? ue(), [t]), u = m(ce, se, de), f = r ?? u, [g, _] = p(null), v = c((t) => {
@@ -357,12 +357,12 @@ j.displayName = "Caption";
 //#endregion
 //#region src/components/Card/Card.context.ts
 var M = o({ type: "plain" }), N = {
-	card: "_card_tdyqh_1",
-	cardAmbient: "_cardAmbient_tdyqh_17",
-	cell: "_cell_tdyqh_21",
-	cellAmbient: "_cellAmbient_tdyqh_26",
-	cellHeader: "_cellHeader_tdyqh_43",
-	cellSubtitle: "_cellSubtitle_tdyqh_47"
+	card: "_card_1maup_1",
+	cardAmbient: "_cardAmbient_1maup_17",
+	cell: "_cell_1maup_21",
+	cellAmbient: "_cellAmbient_1maup_26",
+	cellHeader: "_cellHeader_1maup_43",
+	cellSubtitle: "_cellSubtitle_1maup_47"
 }, P = {
 	cell: "_cell_1w7p5_1",
 	before: "_before_1w7p5_10",
@@ -502,9 +502,9 @@ function L({ ref: e, type: t = "plain", className: r, children: i, ...a }) {
 }
 L.displayName = "Card", L.Cell = I;
 var R = {
-	checkbox: "_checkbox_3wbt9_1",
-	input: "_input_3wbt9_12",
-	box: "_box_3wbt9_22"
+	checkbox: "_checkbox_yjw6v_1",
+	input: "_input_yjw6v_12",
+	box: "_box_yjw6v_22"
 };
 //#endregion
 //#region src/components/Checkbox/Checkbox.tsx
@@ -556,16 +556,16 @@ function we({ ref: e, weight: t = "2", className: r, Component: i = "h5", ...a }
 }
 we.displayName = "Headline";
 var B = {
-	base: "_base_ja3pv_1",
-	body: "_body_ja3pv_7",
-	ios: "_ios_ja3pv_23",
-	before: "_before_ja3pv_29",
-	after: "_after_ja3pv_30",
-	field: "_field_ja3pv_35",
-	header: "_header_ja3pv_56",
-	focused: "_focused_ja3pv_70",
-	error: "_error_ja3pv_78",
-	disabled: "_disabled_ja3pv_90"
+	base: "_base_wqh9u_1",
+	body: "_body_wqh9u_7",
+	ios: "_ios_wqh9u_23",
+	before: "_before_wqh9u_29",
+	after: "_after_wqh9u_30",
+	field: "_field_wqh9u_35",
+	header: "_header_wqh9u_56",
+	focused: "_focused_wqh9u_70",
+	error: "_error_wqh9u_78",
+	disabled: "_disabled_wqh9u_90"
 };
 //#endregion
 //#region src/components/Input/Input.tsx
@@ -797,15 +797,15 @@ function J({ ref: e, header: t, footer: o, className: c, children: l, ...u }) {
 }
 J.displayName = "Section", J.Header = K, J.Footer = G;
 var Y = {
-	base: "_base_9dgop_1",
-	row: "_row_9dgop_7",
-	ios: "_ios_9dgop_14",
-	select: "_select_9dgop_19",
-	chevron: "_chevron_9dgop_33",
-	header: "_header_9dgop_45",
-	focused: "_focused_9dgop_59",
-	error: "_error_9dgop_67",
-	disabled: "_disabled_9dgop_79"
+	base: "_base_yxki5_1",
+	row: "_row_yxki5_7",
+	ios: "_ios_yxki5_17",
+	select: "_select_yxki5_22",
+	chevron: "_chevron_yxki5_36",
+	header: "_header_yxki5_48",
+	focused: "_focused_yxki5_62",
+	error: "_error_yxki5_70",
+	disabled: "_disabled_yxki5_82"
 };
 //#endregion
 //#region src/components/Select/Select.tsx
@@ -869,13 +869,13 @@ function Fe({ ref: e, disabled: t, className: i, style: a, ...o }) {
 }
 Fe.displayName = "Switch";
 var Z = {
-	bar: "_bar_y3gvr_1",
-	barIos: "_barIos_y3gvr_10",
-	item: "_item_y3gvr_15",
-	itemIos: "_itemIos_y3gvr_34",
-	itemSelected: "_itemSelected_y3gvr_39",
-	icon: "_icon_y3gvr_43",
-	text: "_text_y3gvr_64"
+	bar: "_bar_muj3n_1",
+	barIos: "_barIos_muj3n_10",
+	item: "_item_muj3n_15",
+	itemIos: "_itemIos_muj3n_33",
+	itemSelected: "_itemSelected_muj3n_38",
+	icon: "_icon_muj3n_42",
+	text: "_text_muj3n_62"
 };
 //#endregion
 //#region src/components/TabBar/TabBarItem.tsx

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","names":[],"sources":["../src/shared/lib/cn.ts","../src/components/Typography/Typography.module.css","../src/components/Typography/Typography.variants.ts","../src/components/Typography/Typography.tsx","../src/components/Subheadline/Subheadline.module.css","../src/components/Subheadline/Subheadline.variants.ts","../src/components/Subheadline/Subheadline.tsx","../src/components/TguiProvider/context.ts","../src/components/TguiProvider/useTgui.ts","../src/components/Tappable/Ripple.module.css","../src/components/Tappable/Ripple.tsx","../src/components/Tappable/Tappable.module.css","../src/components/Tappable/useRipple.ts","../src/components/Tappable/Tappable.tsx","../src/components/Text/Text.module.css","../src/components/Text/Text.tsx","../src/shared/lib/telegram.ts","../src/shared/lib/appearance.ts","../src/shared/lib/platform.ts","../src/components/TguiProvider/TguiProvider.module.css","../src/components/TguiProvider/TguiProvider.tsx","../src/components/Button/Button.module.css","../src/components/Button/Button.variants.ts","../src/components/Button/Button.tsx","../src/components/Caption/Caption.module.css","../src/components/Caption/Caption.variants.ts","../src/components/Caption/Caption.tsx","../src/components/Card/Card.context.ts","../src/components/Card/Card.module.css","../src/components/Cell/Cell.module.css","../src/components/Cell/Cell.variants.ts","../src/components/Cell/Cell.tsx","../src/components/Card/CardCell.tsx","../src/components/Card/Card.tsx","../src/components/Checkbox/Checkbox.module.css","../src/components/Checkbox/Checkbox.tsx","../src/components/Divider/Divider.module.css","../src/components/Divider/Divider.tsx","../src/components/Headline/Headline.module.css","../src/components/Headline/Headline.tsx","../src/components/Input/Input.module.css","../src/components/Input/Input.tsx","../src/components/LargeTitle/LargeTitle.module.css","../src/components/LargeTitle/LargeTitle.tsx","../src/components/List/List.module.css","../src/components/List/List.tsx","../src/components/Title/Title.module.css","../src/components/Title/Title.variants.ts","../src/components/Title/Title.tsx","../src/components/Placeholder/Placeholder.module.css","../src/components/Placeholder/Placeholder.tsx","../src/components/Section/Section.module.css","../src/components/Section/SectionFooter.tsx","../src/components/Section/SectionHeader.tsx","../src/components/Section/Section.tsx","../src/components/Select/Select.module.css","../src/components/Select/Select.tsx","../src/components/Switch/Switch.module.css","../src/components/Switch/Switch.tsx","../src/components/TabBar/TabBar.module.css","../src/components/TabBar/TabBarItem.tsx","../src/components/TabBar/TabBar.tsx"],"sourcesContent":["import { type ClassValue, clsx } from 'clsx';\n\nexport function cn(...inputs: ClassValue[]) {\n  return clsx(inputs);\n}\n",".typography {\n  margin: 0;\n  font-family: var(--tgui--font-family);\n}\n\n.weight-1 {\n  font-weight: var(--tgui--font_weight--accent1);\n}\n\n.weight-2 {\n  font-weight: var(--tgui--font_weight--accent2);\n}\n\n.weight-3 {\n  font-weight: var(--tgui--font_weight--accent3);\n}\n\n.caps {\n  text-transform: uppercase;\n}\n","import { cva } from 'class-variance-authority';\nimport styles from './Typography.module.css';\n\nexport const typography = cva(styles.typography, {\n  variants: {\n    weight: {\n      '1': styles['weight-1'],\n      '2': styles['weight-2'],\n      '3': styles['weight-3'],\n    },\n    caps: { true: styles.caps },\n  },\n  defaultVariants: { weight: '3' },\n});\n","import type { AllHTMLAttributes, ElementType, Ref } from 'react';\nimport { cn } from '../../shared/lib/cn';\nimport { typography } from './Typography.variants';\n\nexport interface TypographyProps extends AllHTMLAttributes<HTMLElement> {\n  ref?: Ref<HTMLElement>;\n  weight?: '1' | '2' | '3';\n  caps?: boolean;\n  Component?: ElementType;\n}\n\nexport function Typography({\n  ref,\n  weight,\n  caps,\n  Component = 'span',\n  className,\n  ...rest\n}: TypographyProps) {\n  return <Component ref={ref} className={cn(typography({ weight, caps }), className)} {...rest} />;\n}\n\nTypography.displayName = 'Typography';\n",".level-1 {\n  font-size: var(--tgui--subheadline1--font_size);\n  line-height: var(--tgui--subheadline1--line_height);\n}\n\n.level-2 {\n  font-size: var(--tgui--subheadline2--font_size);\n  line-height: var(--tgui--subheadline2--line_height);\n}\n","import { cva } from 'class-variance-authority';\nimport styles from './Subheadline.module.css';\n\nexport type SubheadlineLevel = '1' | '2';\n\nexport const subheadline = cva('', {\n  variants: {\n    level: {\n      '1': styles['level-1'],\n      '2': styles['level-2'],\n    },\n  },\n  defaultVariants: { level: '1' },\n});\n","import type { Ref } from 'react';\nimport { cn } from '../../shared/lib/cn';\nimport { Typography, type TypographyProps } from '../Typography';\nimport { type SubheadlineLevel, subheadline } from './Subheadline.variants';\n\nexport interface SubheadlineProps extends TypographyProps {\n  ref?: Ref<HTMLElement>;\n  level?: SubheadlineLevel;\n}\n\nexport function Subheadline({\n  ref,\n  level,\n  Component = 'h6',\n  className,\n  ...rest\n}: SubheadlineProps) {\n  return (\n    <Typography\n      ref={ref}\n      Component={Component}\n      className={cn(subheadline({ level }), className)}\n      {...rest}\n    />\n  );\n}\n\nSubheadline.displayName = 'Subheadline';\n","import { createContext } from 'react';\nimport type { TguiContextValue } from '../../shared/types/tgui';\n\nexport const TguiContext = createContext<TguiContextValue | null>(null);\n\nTguiContext.displayName = 'TguiContext';\n","import { useContext } from 'react';\nimport type { TguiContextValue } from '../../shared/types/tgui';\nimport { TguiContext } from './context';\n\nexport function useTgui(): TguiContextValue {\n  const context = useContext(TguiContext);\n\n  if (context === null) {\n    throw new Error('useTgui must be used within a <TguiProvider>.');\n  }\n\n  return context;\n}\n",".ripple {\n  position: absolute;\n  inset: 0;\n  overflow: hidden;\n  border-radius: inherit;\n  pointer-events: none;\n}\n\n.wave {\n  position: absolute;\n  width: 24px;\n  height: 24px;\n  border-radius: 50%;\n  transform: translate(-50%, -50%);\n  background: var(--tgui--outline);\n  opacity: 0;\n  animation: wave-rise 0.35s cubic-bezier(0.3, 0.3, 0.5, 1);\n}\n\n@keyframes wave-rise {\n  from {\n    transform: translate(-50%, -50%) scale(1);\n    opacity: 1;\n  }\n  30% {\n    opacity: 1;\n  }\n  to {\n    transform: translate(-50%, -50%) scale(8);\n    opacity: 0;\n  }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .wave {\n    animation: none;\n  }\n}\n","import styles from './Ripple.module.css';\nimport type { Wave } from './useRipple';\n\ninterface RippleProps {\n  waves: Wave[];\n  onWaveEnd: (id: number) => void;\n}\n\nexport function Ripple({ waves, onWaveEnd }: RippleProps) {\n  return (\n    <span aria-hidden className={styles.ripple}>\n      {waves.map((wave) => (\n        <span\n          key={wave.id}\n          className={styles.wave}\n          style={{ top: wave.y, left: wave.x }}\n          onAnimationEnd={() => onWaveEnd(wave.id)}\n        />\n      ))}\n    </span>\n  );\n}\n",".tappable {\n  position: relative;\n  isolation: isolate;\n  cursor: pointer;\n  transition: opacity 0.15s ease-out;\n}\n\n.tappable[data-readonly] {\n  cursor: default;\n}\n\n.tappable[data-disabled] {\n  cursor: default;\n  opacity: 0.35;\n}\n\n.tappable--ios:not([data-disabled]):not([data-readonly]):active,\n.tappable--opacity:not([data-disabled]):not([data-readonly]):active {\n  opacity: 0.65;\n}\n\n@media (hover: hover) and (pointer: fine) {\n  .tappable--ios:not([data-disabled]):not([data-readonly]):hover,\n  .tappable--opacity:not([data-disabled]):not([data-readonly]):hover {\n    opacity: 0.85;\n  }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .tappable {\n    transition: none;\n  }\n}\n","import { type PointerEvent, useCallback, useEffect, useRef, useState } from 'react';\n\nconst PRESS_DELAY = 70;\nconst WAVE_FALLBACK = 600;\n\nexport interface Wave {\n  id: number;\n  x: number;\n  y: number;\n}\n\ntype Timer = ReturnType<typeof setTimeout>;\n\nexport function useRipple() {\n  const [waves, setWaves] = useState<Wave[]>([]);\n  const nextId = useRef(0);\n  const pressTimers = useRef(new Map<number, Timer>());\n  const waveTimers = useRef(new Set<Timer>());\n\n  useEffect(() => {\n    const press = pressTimers.current;\n    const wave = waveTimers.current;\n    return () => {\n      for (const timer of press.values()) clearTimeout(timer);\n      for (const timer of wave) clearTimeout(timer);\n    };\n  }, []);\n\n  const removeWave = useCallback((id: number) => {\n    setWaves((current) => current.filter((wave) => wave.id !== id));\n  }, []);\n\n  const onPointerDown = useCallback(\n    (event: PointerEvent<HTMLElement>) => {\n      const { top, left } = event.currentTarget.getBoundingClientRect();\n      const x = event.clientX - left;\n      const y = event.clientY - top;\n      const { pointerId } = event;\n\n      const press = setTimeout(() => {\n        pressTimers.current.delete(pointerId);\n        const id = nextId.current++;\n        setWaves((current) => [...current, { id, x, y }]);\n\n        const fallback = setTimeout(() => {\n          waveTimers.current.delete(fallback);\n          removeWave(id);\n        }, WAVE_FALLBACK);\n        waveTimers.current.add(fallback);\n      }, PRESS_DELAY);\n\n      pressTimers.current.set(pointerId, press);\n    },\n    [removeWave],\n  );\n\n  const onPointerCancel = useCallback((event: PointerEvent<HTMLElement>) => {\n    const press = pressTimers.current.get(event.pointerId);\n    if (press) {\n      clearTimeout(press);\n      pressTimers.current.delete(event.pointerId);\n    }\n  }, []);\n\n  return { waves, onPointerDown, onPointerCancel, removeWave };\n}\n","'use client';\n\nimport type { AllHTMLAttributes, ElementType, PointerEvent, Ref } from 'react';\nimport { cn } from '../../shared/lib/cn';\nimport { useTgui } from '../TguiProvider/useTgui';\nimport { Ripple } from './Ripple';\nimport styles from './Tappable.module.css';\nimport { useRipple } from './useRipple';\n\nexport interface TappableProps extends AllHTMLAttributes<HTMLElement> {\n  ref?: Ref<HTMLElement>;\n  Component?: ElementType;\n  interactiveAnimation?: 'background' | 'opacity';\n}\n\nexport function Tappable({\n  ref,\n  Component = 'div',\n  interactiveAnimation = 'background',\n  className,\n  children,\n  onPointerDown,\n  onPointerCancel,\n  ...rest\n}: TappableProps) {\n  const { platform } = useTgui();\n  const ripple = useRipple();\n  const disabled = Boolean(rest.disabled);\n  const readOnly = Boolean(rest.readOnly);\n\n  const interactive = Component !== 'div' && Component !== 'span';\n  const hasRipple =\n    platform === 'base' &&\n    interactiveAnimation === 'background' &&\n    !readOnly &&\n    !disabled &&\n    (interactive || rest.onClick != null);\n\n  const handlePointerDown = (event: PointerEvent<HTMLElement>) => {\n    if (hasRipple) ripple.onPointerDown(event);\n    onPointerDown?.(event);\n  };\n\n  const handlePointerCancel = (event: PointerEvent<HTMLElement>) => {\n    if (hasRipple) ripple.onPointerCancel(event);\n    onPointerCancel?.(event);\n  };\n\n  return (\n    <Component\n      ref={ref}\n      className={cn(\n        styles.tappable,\n        platform === 'ios' && styles['tappable--ios'],\n        interactiveAnimation === 'opacity' && styles['tappable--opacity'],\n        className,\n      )}\n      data-readonly={readOnly || undefined}\n      data-disabled={disabled || undefined}\n      aria-disabled={disabled || undefined}\n      onPointerDown={handlePointerDown}\n      onPointerCancel={handlePointerCancel}\n      {...rest}\n    >\n      {hasRipple && <Ripple waves={ripple.waves} onWaveEnd={ripple.removeWave} />}\n      {children}\n    </Component>\n  );\n}\n\nTappable.displayName = 'Tappable';\n",".text {\n  font-size: var(--tgui--text--font_size);\n  line-height: var(--tgui--text--line_height);\n}\n","import type { Ref } from 'react';\nimport { cn } from '../../shared/lib/cn';\nimport { Typography, type TypographyProps } from '../Typography';\nimport styles from './Text.module.css';\n\nexport interface TextProps extends TypographyProps {\n  ref?: Ref<HTMLElement>;\n}\n\nexport function Text({ ref, className, Component = 'span', ...rest }: TextProps) {\n  return (\n    <Typography ref={ref} Component={Component} className={cn(styles.text, className)} {...rest} />\n  );\n}\n\nText.displayName = 'Text';\n","import type { WebApp } from '../types/telegram';\n\nexport function getTelegramWebApp(): WebApp | undefined {\n  if (typeof window === 'undefined') {\n    return undefined;\n  }\n\n  return window.Telegram?.WebApp;\n}\n","import type { Appearance } from '../types/tgui';\nimport { getTelegramWebApp } from './telegram';\n\nconst DARK_QUERY = '(prefers-color-scheme: dark)';\n\nfunction canMatchMedia() {\n  return typeof window !== 'undefined' && typeof window.matchMedia === 'function';\n}\n\nexport function getAppearance(): Appearance {\n  const webApp = getTelegramWebApp();\n  if (webApp) {\n    return webApp.colorScheme === 'dark' ? 'dark' : 'light';\n  }\n\n  if (canMatchMedia()) {\n    return window.matchMedia(DARK_QUERY).matches ? 'dark' : 'light';\n  }\n\n  return 'light';\n}\n\nexport function subscribeAppearance(onChange: () => void): () => void {\n  const webApp = getTelegramWebApp();\n  if (webApp) {\n    webApp.onEvent('themeChanged', onChange);\n    return () => webApp.offEvent('themeChanged', onChange);\n  }\n\n  if (!canMatchMedia()) {\n    return () => {};\n  }\n\n  const media = window.matchMedia(DARK_QUERY);\n  media.addEventListener('change', onChange);\n  return () => media.removeEventListener('change', onChange);\n}\n","import type { TguiPlatform } from '../types/tgui';\nimport { getTelegramWebApp } from './telegram';\n\nconst TELEGRAM_IOS_LIKE = new Set(['ios', 'macos']);\n\nexport function getPlatform(): TguiPlatform {\n  const webApp = getTelegramWebApp();\n  if (webApp) {\n    return TELEGRAM_IOS_LIKE.has(webApp.platform) ? 'ios' : 'base';\n  }\n\n  if (typeof navigator === 'undefined') {\n    return 'base';\n  }\n\n  const ua = navigator.userAgent;\n  const isIpadOs = ua.includes('Macintosh') && navigator.maxTouchPoints > 1;\n\n  return /iphone|ipad|ipod/i.test(ua) || isIpadOs ? 'ios' : 'base';\n}\n",".wrapper {\n  --tgui--font-family:\n    system-ui, -apple-system, BlinkMacSystemFont, \"Roboto\", \"Apple Color Emoji\", \"Helvetica Neue\",\n    sans-serif;\n\n  --tgui--font_weight--accent1: 700;\n  --tgui--font_weight--accent2: 600;\n  --tgui--font_weight--accent3: 400;\n\n  --tgui--large_title--font_size: 34px;\n  --tgui--large_title--line_height: 42px;\n\n  --tgui--title1--font_size: 28px;\n  --tgui--title1--line_height: 36px;\n  --tgui--title2--font_size: 24px;\n  --tgui--title2--line_height: 32px;\n  --tgui--title3--font_size: 20px;\n  --tgui--title3--line_height: 24px;\n\n  --tgui--headline--font_size: 19px;\n  --tgui--headline--line_height: 28px;\n\n  --tgui--text--font_size: 17px;\n  --tgui--text--line_height: 26px;\n\n  --tgui--subheadline1--font_size: 16px;\n  --tgui--subheadline1--line_height: 24px;\n  --tgui--subheadline2--font_size: 15px;\n  --tgui--subheadline2--line_height: 22px;\n\n  --tgui--caption1--font_size: 13px;\n  --tgui--caption1--line_height: 20px;\n  --tgui--caption2--font_size: 11px;\n  --tgui--caption2--line_height: 16px;\n\n  --tgui--border--width: 1px;\n  --tgui--base--section--box_shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1);\n\n  --tgui--bg_color: var(--tg-theme-bg-color, #ffffff);\n  --tgui--text_color: var(--tg-theme-text-color, #000000);\n  --tgui--hint_color: var(--tg-theme-hint-color, #707579);\n  --tgui--link_color: var(--tg-theme-link-color, #007aff);\n  --tgui--button_color: var(--tg-theme-button-color, #007aff);\n  --tgui--button_text_color: var(--tg-theme-button-text-color, #ffffff);\n  --tgui--secondary_bg_color: var(--tg-theme-secondary-bg-color, #efeff4);\n  --tgui--header_bg_color: var(--tg-theme-header-bg-color, #ffffff);\n  --tgui--accent_text_color: var(--tg-theme-accent-text-color, #007aff);\n  --tgui--section_bg_color: var(--tg-theme-section-bg-color, #ffffff);\n  --tgui--section_header_text_color: var(--tg-theme-section-header-text-color, #707579);\n  --tgui--subtitle_text_color: var(--tg-theme-subtitle-text-color, #707579);\n  --tgui--destructive_text_color: var(--tg-theme-destructive-text-color, #e53935);\n\n  --tgui--skeleton: rgba(0, 0, 0, 0.03);\n  --tgui--divider: rgba(0, 0, 0, 0.15);\n  --tgui--outline: rgba(0, 0, 0, 0.05);\n  --tgui--surface_primary: rgba(255, 255, 255, 0.95);\n\n  --tgui--tertiary_bg_color: #f4f4f7;\n  --tgui--quartenary_bg_color: #f6f6fa;\n  --tgui--segmented_control_active_bg: var(--tgui--bg_color);\n  --tgui--card_bg_color: var(--tgui--section_bg_color);\n  --tgui--secondary_hint_color: #a2acb0;\n  --tgui--secondary_fill: rgba(67, 120, 255, 0.1);\n  --tgui--green: #31d158;\n  --tgui--destructive_background: #e53935;\n  --tgui--primary_code_highlight: #4378ff;\n  --tgui--secondary_code_highlight: #b00fb4;\n  --tgui--tertiary_code_highlight: #3a9f20;\n  --tgui--plain_background: rgba(0, 0, 0, 0.04);\n  --tgui--plain_foreground: rgba(0, 0, 0, 0.8);\n  --tgui--toast_accent_color: #55a6ff;\n\n  --tgui--surface_dark: rgba(56, 56, 56, 0.85);\n  --tgui--tooltip_background_dark: rgba(0, 0, 0, 0.85);\n  --tgui--white: #ffffff;\n  --tgui--black: #000000;\n\n  --tgui--z-index--simple: 1;\n  --tgui--z-index--skeleton: 2;\n  --tgui--z-index--overlay: 3;\n\n  -webkit-tap-highlight-color: transparent;\n  -webkit-text-size-adjust: 100%;\n\n  font-family: var(--tgui--font-family);\n  color: var(--tgui--text_color);\n}\n\n.wrapper--ios {\n  --tgui--large_title--line_height: 41px;\n  --tgui--title1--line_height: 34px;\n  --tgui--title2--line_height: 28px;\n  --tgui--title3--line_height: 25px;\n  --tgui--headline--line_height: 24px;\n  --tgui--text--line_height: 22px;\n  --tgui--subheadline1--line_height: 21px;\n  --tgui--subheadline2--line_height: 20px;\n  --tgui--caption1--line_height: 16px;\n  --tgui--caption2--line_height: 13px;\n}\n\n.wrapper--dark {\n  --tgui--bg_color: var(--tg-theme-bg-color, #212121);\n  --tgui--text_color: var(--tg-theme-text-color, #ffffff);\n  --tgui--hint_color: var(--tg-theme-hint-color, #aaaaaa);\n  --tgui--link_color: var(--tg-theme-link-color, #2990ff);\n  --tgui--button_color: var(--tg-theme-button-color, #2990ff);\n  --tgui--button_text_color: var(--tg-theme-button-text-color, #ffffff);\n  --tgui--secondary_bg_color: var(--tg-theme-secondary-bg-color, #0f0f0f);\n  --tgui--header_bg_color: var(--tg-theme-header-bg-color, #212121);\n  --tgui--accent_text_color: var(--tg-theme-accent-text-color, #007aff);\n  --tgui--section_bg_color: var(--tg-theme-section-bg-color, #212121);\n  --tgui--section_header_text_color: var(--tg-theme-section-header-text-color, #aaaaaa);\n  --tgui--subtitle_text_color: var(--tg-theme-subtitle-text-color, #aaaaaa);\n  --tgui--destructive_text_color: var(--tg-theme-destructive-text-color, #e53935);\n\n  --tgui--skeleton: rgba(255, 255, 255, 0.03);\n  --tgui--divider: rgba(255, 255, 255, 0.05);\n  --tgui--outline: rgba(255, 255, 255, 0.1);\n  --tgui--surface_primary: rgba(23, 23, 23, 0.95);\n  --tgui--tertiary_bg_color: #2a2a2a;\n  --tgui--quartenary_bg_color: #2f2f2f;\n  --tgui--segmented_control_active_bg: #2f2f2f;\n  --tgui--card_bg_color: #262626;\n  --tgui--secondary_hint_color: #78797e;\n  --tgui--secondary_fill: rgba(41, 144, 255, 0.15);\n  --tgui--green: #32e55e;\n  --tgui--destructive_background: rgba(255, 35, 35, 0.02);\n  --tgui--primary_code_highlight: #2990ff;\n  --tgui--secondary_code_highlight: #e937ed;\n  --tgui--tertiary_code_highlight: #5ae536;\n  --tgui--plain_background: rgba(255, 255, 255, 0.08);\n  --tgui--plain_foreground: rgba(255, 255, 255, 0.95);\n}\n\n@media (min-resolution: 2dppx) {\n  .wrapper {\n    --tgui--border--width: 0.5px;\n  }\n}\n\n@supports (padding-top: env(safe-area-inset-bottom)) {\n  .wrapper {\n    --tgui--safe_area_inset_bottom: env(safe-area-inset-bottom);\n  }\n}\n\n@supports (color: color-mix(in srgb, red 10%, transparent)) {\n  .wrapper {\n    --tgui--secondary_fill: color-mix(in srgb, var(--tgui--accent_text_color) 10%, transparent);\n    --tgui--tertiary_bg_color: color-mix(\n      in srgb,\n      var(--tgui--secondary_bg_color),\n      var(--tgui--bg_color) 40%\n    );\n    --tgui--quartenary_bg_color: color-mix(\n      in srgb,\n      var(--tgui--secondary_bg_color),\n      var(--tgui--bg_color) 20%\n    );\n  }\n\n  .wrapper--dark {\n    --tgui--secondary_fill: color-mix(in srgb, var(--tgui--accent_text_color) 15%, transparent);\n    --tgui--card_bg_color: color-mix(in srgb, var(--tgui--bg_color), #fff 7%);\n    --tgui--tertiary_bg_color: color-mix(in srgb, var(--tgui--bg_color), #fff 10%);\n    --tgui--quartenary_bg_color: color-mix(in srgb, var(--tgui--bg_color), #fff 14%);\n    --tgui--segmented_control_active_bg: color-mix(in srgb, var(--tgui--bg_color), #fff 12%);\n  }\n}\n","import {\n  type HTMLAttributes,\n  type Ref,\n  useCallback,\n  useMemo,\n  useState,\n  useSyncExternalStore,\n} from 'react';\nimport { getAppearance, subscribeAppearance } from '../../shared/lib/appearance';\nimport { cn } from '../../shared/lib/cn';\nimport { getPlatform } from '../../shared/lib/platform';\nimport type { Appearance, TguiPlatform } from '../../shared/types/tgui';\nimport { TguiContext } from './context';\nimport styles from './TguiProvider.module.css';\n\nexport interface TguiProviderProps extends HTMLAttributes<HTMLDivElement> {\n  ref?: Ref<HTMLDivElement>;\n  platform?: TguiPlatform;\n  appearance?: Appearance;\n  portalContainer?: HTMLElement | null;\n}\n\nconst getServerAppearance = (): Appearance => 'light';\n\nexport function TguiProvider({\n  ref,\n  platform: platformProp,\n  appearance: appearanceProp,\n  portalContainer: portalContainerProp,\n  className,\n  children,\n  ...rest\n}: TguiProviderProps) {\n  const platform = useMemo(() => platformProp ?? getPlatform(), [platformProp]);\n\n  const systemAppearance = useSyncExternalStore(\n    subscribeAppearance,\n    getAppearance,\n    getServerAppearance,\n  );\n  const appearance = appearanceProp ?? systemAppearance;\n\n  const [wrapper, setWrapper] = useState<HTMLDivElement | null>(null);\n  const setRef = useCallback(\n    (node: HTMLDivElement | null) => {\n      setWrapper(node);\n\n      if (typeof ref === 'function') {\n        ref(node);\n      } else if (ref) {\n        ref.current = node;\n      }\n    },\n    [ref],\n  );\n\n  const value = useMemo(\n    () => ({\n      platform,\n      appearance,\n      portalContainer: portalContainerProp ?? wrapper,\n    }),\n    [platform, appearance, portalContainerProp, wrapper],\n  );\n\n  return (\n    <div\n      ref={setRef}\n      className={cn(\n        styles.wrapper,\n        platform === 'ios' && styles['wrapper--ios'],\n        appearance === 'dark' && styles['wrapper--dark'],\n        className,\n      )}\n      {...rest}\n    >\n      <TguiContext.Provider value={value}>{children}</TguiContext.Provider>\n    </div>\n  );\n}\n\nTguiProvider.displayName = 'TguiProvider';\n",".button {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  box-sizing: border-box;\n  max-inline-size: 100%;\n  min-inline-size: 80px;\n  border: none;\n  border-radius: var(--tgui--button--border_radius, 8px);\n  text-decoration: none;\n}\n\n.stretched {\n  inline-size: 100%;\n  flex-grow: 1;\n}\n\n.button::after {\n  content: \"\";\n  position: absolute;\n  inset: 0;\n  opacity: 0;\n  background: var(--tgui--bg_color);\n  transition: opacity 0.15s ease-out;\n}\n\n@media (hover: hover) and (pointer: fine) {\n  .button:not([data-disabled]):hover::after {\n    opacity: var(--tgui--button--wash-opacity);\n  }\n}\n\n.before,\n.after {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.content {\n  display: flex;\n  flex: 0 1 auto;\n  min-inline-size: 0;\n  align-items: center;\n  justify-content: center;\n  z-index: var(--tgui--z-index--simple);\n}\n\n.label {\n  min-inline-size: 0;\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n}\n\n.content svg {\n  display: block;\n}\n\n.loading {\n  pointer-events: none;\n}\n\n.loading .before,\n.loading .after,\n.loading .content {\n  opacity: 0;\n}\n\n.spinner {\n  position: absolute;\n  width: 20px;\n  height: 20px;\n  border: 2px solid currentColor;\n  border-radius: 50%;\n  border-top-color: transparent;\n  color: var(--tgui--button--spinner-color);\n  animation: button-spinner 0.6s linear infinite;\n}\n\n@keyframes button-spinner {\n  to {\n    transform: rotate(360deg);\n  }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .spinner {\n    animation-duration: 1.6s;\n  }\n}\n\n.size-s {\n  height: 36px;\n  min-width: 34px;\n  gap: 6px;\n  padding: 8px 12px;\n  border-radius: 999px;\n}\n\n.size-m {\n  height: 42px;\n  min-width: 42px;\n  gap: 8px;\n  padding: 8px 14px;\n}\n\n.size-l {\n  height: 50px;\n  gap: 10px;\n  padding: 10px 20px;\n}\n\n.ios.size-m {\n  border-radius: 12px;\n}\n\n.ios::after {\n  content: none;\n}\n\n.mode-filled {\n  --tgui--button--wash-opacity: 0.15;\n  --tgui--button--spinner-color: var(--tgui--button_text_color);\n  color: var(--tgui--button_text_color);\n  background: var(--tgui--button_color);\n}\n\n.mode-bezeled {\n  --tgui--button--wash-opacity: 0.07;\n  --tgui--button--spinner-color: var(--tgui--link_color);\n  color: var(--tgui--link_color);\n  background: var(--tgui--secondary_fill);\n}\n\n.mode-plain {\n  --tgui--button--wash-opacity: 0.03;\n  --tgui--button--spinner-color: var(--tgui--plain_foreground);\n  color: var(--tgui--link_color);\n  background: transparent;\n}\n\n.mode-gray {\n  --tgui--button--wash-opacity: 0.5;\n  --tgui--button--spinner-color: var(--tgui--plain_foreground);\n  color: var(--tgui--plain_foreground);\n  background: var(--tgui--plain_background);\n}\n\n.mode-outline {\n  --tgui--button--wash-opacity: 0.5;\n  --tgui--button--spinner-color: var(--tgui--plain_foreground);\n  color: var(--tgui--plain_foreground);\n  background: transparent;\n  box-shadow: 0 0 0 1px var(--tgui--outline);\n}\n\n.mode-white {\n  --tgui--button--wash-opacity: 0.5;\n  --tgui--button--spinner-color: var(--tgui--surface_dark);\n  color: var(--tgui--black);\n  background: var(--tgui--white);\n}\n","import { cva } from 'class-variance-authority';\nimport type { TguiPlatform } from '../../shared/types/tgui';\nimport styles from './Button.module.css';\n\nexport type ButtonMode = 'filled' | 'bezeled' | 'plain' | 'gray' | 'outline' | 'white';\nexport type ButtonSize = 's' | 'm' | 'l';\n\nexport const button = cva(styles.button, {\n  variants: {\n    mode: {\n      filled: styles['mode-filled'],\n      bezeled: styles['mode-bezeled'],\n      plain: styles['mode-plain'],\n      gray: styles['mode-gray'],\n      outline: styles['mode-outline'],\n      white: styles['mode-white'],\n    },\n    size: {\n      s: styles['size-s'],\n      m: styles['size-m'],\n      l: styles['size-l'],\n    },\n    stretched: { true: styles.stretched },\n    platform: { ios: styles.ios, base: null },\n  },\n  defaultVariants: { mode: 'filled', size: 'm' },\n});\n\nexport type ButtonVariantInput = {\n  mode?: ButtonMode;\n  size?: ButtonSize;\n  stretched?: boolean;\n  platform: TguiPlatform;\n};\n","'use client';\n\nimport type { AllHTMLAttributes, ElementType, ReactNode, Ref } from 'react';\nimport { cn } from '../../shared/lib/cn';\nimport { Subheadline } from '../Subheadline';\nimport { Tappable } from '../Tappable';\nimport { Text } from '../Text';\nimport { useTgui } from '../TguiProvider';\nimport styles from './Button.module.css';\nimport { type ButtonMode, type ButtonSize, button } from './Button.variants';\n\nexport interface ButtonProps extends Omit<AllHTMLAttributes<HTMLElement>, 'size'> {\n  ref?: Ref<HTMLElement>;\n  Component?: ElementType;\n  mode?: ButtonMode;\n  size?: ButtonSize;\n  stretched?: boolean;\n  loading?: boolean;\n  before?: ReactNode;\n  after?: ReactNode;\n}\n\nfunction Label({ size, children }: { size: ButtonSize; children: ReactNode }) {\n  const shared = { weight: '2', className: styles.content } as const;\n  const inner = <span className={styles.label}>{children}</span>;\n  return size === 'l' ? (\n    <Text {...shared}>{inner}</Text>\n  ) : (\n    <Subheadline level=\"2\" {...shared}>\n      {inner}\n    </Subheadline>\n  );\n}\n\nexport function Button({\n  ref,\n  Component = 'button',\n  mode = 'filled',\n  size = 'm',\n  stretched = false,\n  loading = false,\n  type,\n  before,\n  after,\n  children,\n  className,\n  ...rest\n}: ButtonProps) {\n  const { platform } = useTgui();\n\n  return (\n    <Tappable\n      ref={ref}\n      Component={Component}\n      type={Component === 'button' ? (type ?? 'button') : type}\n      aria-busy={loading || undefined}\n      className={cn(\n        button({ mode, size, stretched, platform }),\n        loading && styles.loading,\n        className,\n      )}\n      {...rest}\n    >\n      {loading ? <span className={styles.spinner} aria-hidden /> : null}\n      {before ? <span className={styles.before}>{before}</span> : null}\n      <Label size={size}>{children}</Label>\n      {after ? <span className={styles.after}>{after}</span> : null}\n    </Tappable>\n  );\n}\n\nButton.displayName = 'Button';\n",".level-1 {\n  font-size: var(--tgui--caption1--font_size);\n  line-height: var(--tgui--caption1--line_height);\n}\n\n.level-2 {\n  font-size: var(--tgui--caption2--font_size);\n  line-height: var(--tgui--caption2--line_height);\n}\n","import { cva } from 'class-variance-authority';\nimport styles from './Caption.module.css';\n\nexport type CaptionLevel = '1' | '2';\n\nexport const caption = cva('', {\n  variants: {\n    level: {\n      '1': styles['level-1'],\n      '2': styles['level-2'],\n    },\n  },\n  defaultVariants: { level: '1' },\n});\n","import type { Ref } from 'react';\nimport { cn } from '../../shared/lib/cn';\nimport { Typography, type TypographyProps } from '../Typography';\nimport { type CaptionLevel, caption } from './Caption.variants';\n\nexport interface CaptionProps extends TypographyProps {\n  ref?: Ref<HTMLElement>;\n  level?: CaptionLevel;\n}\n\nexport function Caption({ ref, level, Component = 'span', className, ...rest }: CaptionProps) {\n  return (\n    <Typography\n      ref={ref}\n      Component={Component}\n      className={cn(caption({ level }), className)}\n      {...rest}\n    />\n  );\n}\n\nCaption.displayName = 'Caption';\n","import { createContext } from 'react';\n\nexport type CardType = 'plain' | 'ambient';\n\nexport const CardContext = createContext<{ type: CardType }>({ type: 'plain' });\n",".card {\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n  border-radius: 20px;\n  background: var(--tgui--card_bg_color);\n  box-shadow:\n    0 32px 64px 0 rgba(0, 0, 0, 0.04),\n    0 0 2px 1px rgba(0, 0, 0, 0.02);\n}\n\n.card > * {\n  flex-shrink: 0;\n}\n\n.cardAmbient {\n  background: #000;\n}\n\n.cell {\n  padding: 0 20px;\n  background: var(--tgui--card_bg_color);\n}\n\n.cellAmbient {\n  --tgui--cell--middle--padding: 12px 0;\n\n  position: absolute;\n  inset: auto 0 0 0;\n  padding-top: 64px;\n  padding-bottom: 4px;\n  background: linear-gradient(\n    180deg,\n    rgba(0, 0, 0, 0) 0%,\n    rgba(0, 0, 0, 0.12) 22%,\n    rgba(0, 0, 0, 0.55) 62%,\n    rgba(0, 0, 0, 0.85) 100%\n  );\n  color: #fff;\n}\n\n.cellHeader {\n  font-weight: var(--tgui--font_weight--accent2);\n}\n\n.cellSubtitle {\n  display: -webkit-box;\n  -webkit-line-clamp: 2;\n  -webkit-box-orient: vertical;\n}\n\n.cellAmbient .cellHeader {\n  color: #fff;\n}\n\n.cellAmbient .cellSubtitle {\n  color: rgba(255, 255, 255, 0.8);\n}\n",".cell {\n  --tgui--cell--middle--padding: 16px 0;\n\n  display: flex;\n  align-items: center;\n  gap: 24px;\n  padding: 0 24px;\n}\n\n.before,\n.after {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.middle {\n  flex-grow: 1;\n  min-inline-size: 0;\n  max-inline-size: 100%;\n  padding: var(--tgui--cell--middle--padding);\n\n  display: flex;\n  flex-direction: column;\n  gap: 2px;\n}\n\n.middle > *,\n.title {\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n}\n\n.multiline .middle > *,\n.multiline .title {\n  white-space: normal;\n}\n\n.head {\n  display: inline-flex;\n  align-items: center;\n  gap: 4px;\n}\n\n.subhead {\n  color: var(--tgui--subtitle_text_color);\n}\n\n.hint,\n.subtitle,\n.description {\n  color: var(--tgui--hint_color);\n}\n\n.hovered {\n  background: var(--tgui--tertiary_bg_color);\n}\n\n.ios {\n  --tgui--cell--middle--padding: 12px 0;\n  gap: 16px;\n  padding: 0 16px;\n}\n\n@media (hover: hover) and (pointer: fine) {\n  .interactive:not([data-disabled]):hover {\n    background: var(--tgui--tertiary_bg_color);\n  }\n}\n","import { cva } from 'class-variance-authority';\nimport styles from './Cell.module.css';\n\nexport const cell = cva(styles.cell, {\n  variants: {\n    platform: { ios: styles.ios, base: null },\n    hovered: { true: styles.hovered },\n    interactive: { true: styles.interactive },\n    multiline: { true: styles.multiline },\n  },\n});\n","'use client';\n\nimport type { ElementType, ReactNode, Ref } from 'react';\nimport { cn } from '../../shared/lib/cn';\nimport { Caption } from '../Caption';\nimport { Subheadline } from '../Subheadline';\nimport { Tappable, type TappableProps } from '../Tappable';\nimport { Text } from '../Text';\nimport { useTgui } from '../TguiProvider';\nimport styles from './Cell.module.css';\nimport { cell } from './Cell.variants';\n\nexport interface CellProps extends Omit<TappableProps, 'Component'> {\n  ref?: Ref<HTMLElement>;\n  Component?: ElementType;\n  subhead?: ReactNode;\n  hint?: ReactNode;\n  titleBadge?: ReactNode;\n  subtitle?: ReactNode;\n  description?: ReactNode;\n  before?: ReactNode;\n  after?: ReactNode;\n  hovered?: boolean;\n  multiline?: boolean;\n}\n\nfunction CellTitle({ ios, children }: { ios: boolean; children: ReactNode }) {\n  return ios ? (\n    <Text className={styles.head}>{children}</Text>\n  ) : (\n    <Subheadline level=\"1\" className={styles.head}>\n      {children}\n    </Subheadline>\n  );\n}\n\nfunction CellDescription({ ios, children }: { ios: boolean; children: ReactNode }) {\n  return ios ? (\n    <Caption className={styles.description}>{children}</Caption>\n  ) : (\n    <Subheadline level=\"2\" className={styles.description}>\n      {children}\n    </Subheadline>\n  );\n}\n\nexport function Cell({\n  ref,\n  Component = 'div',\n  subhead,\n  children,\n  hint,\n  titleBadge,\n  subtitle,\n  description,\n  before,\n  after,\n  hovered,\n  multiline,\n  className,\n  ...rest\n}: CellProps) {\n  const { platform } = useTgui();\n  const ios = platform === 'ios';\n  const hasTitle = children != null || hint != null || titleBadge != null;\n  const interactive =\n    rest.onClick != null ||\n    rest.href != null ||\n    Component === 'a' ||\n    Component === 'button' ||\n    Component === 'label';\n\n  return (\n    <Tappable\n      ref={ref}\n      Component={Component}\n      className={cn(cell({ platform, hovered, multiline, interactive }), className)}\n      {...rest}\n    >\n      {before != null ? <div className={styles.before}>{before}</div> : null}\n\n      <div className={styles.middle}>\n        {subhead != null ? (\n          <Subheadline level=\"2\" className={styles.subhead}>\n            {subhead}\n          </Subheadline>\n        ) : null}\n\n        {hasTitle ? (\n          <CellTitle ios={ios}>\n            {children != null ? <span className={styles.title}>{children}</span> : null}\n            {hint != null ? <span className={styles.hint}>{hint}</span> : null}\n            {titleBadge}\n          </CellTitle>\n        ) : null}\n\n        {subtitle != null ? (\n          <Subheadline level=\"2\" className={styles.subtitle}>\n            {subtitle}\n          </Subheadline>\n        ) : null}\n\n        {description != null ? <CellDescription ios={ios}>{description}</CellDescription> : null}\n      </div>\n\n      {after != null ? <div className={styles.after}>{after}</div> : null}\n    </Tappable>\n  );\n}\n\nCell.displayName = 'Cell';\n","'use client';\n\nimport { type Ref, useContext } from 'react';\nimport { cn } from '../../shared/lib/cn';\nimport { Cell, type CellProps } from '../Cell';\nimport { CardContext } from './Card.context';\nimport styles from './Card.module.css';\n\nexport interface CardCellProps extends CellProps {\n  ref?: Ref<HTMLElement>;\n}\n\nexport function CardCell({ ref, children, subtitle, className, ...rest }: CardCellProps) {\n  const { type } = useContext(CardContext);\n  const ambient = type === 'ambient';\n\n  return (\n    <Cell\n      ref={ref}\n      className={cn(styles.cell, ambient && styles.cellAmbient, className)}\n      subtitle={\n        subtitle != null ? <span className={styles.cellSubtitle}>{subtitle}</span> : undefined\n      }\n      {...rest}\n    >\n      {children != null ? <span className={styles.cellHeader}>{children}</span> : null}\n    </Cell>\n  );\n}\n\nCardCell.displayName = 'CardCell';\n","'use client';\n\nimport { type HTMLAttributes, type Ref, useMemo } from 'react';\nimport { cn } from '../../shared/lib/cn';\nimport { CardContext, type CardType } from './Card.context';\nimport styles from './Card.module.css';\nimport { CardCell } from './CardCell';\n\nexport interface CardProps extends HTMLAttributes<HTMLElement> {\n  ref?: Ref<HTMLElement>;\n  type?: CardType;\n}\n\nexport function Card({ ref, type = 'plain', className, children, ...rest }: CardProps) {\n  const context = useMemo(() => ({ type }), [type]);\n\n  return (\n    <CardContext.Provider value={context}>\n      <article\n        ref={ref}\n        className={cn(styles.card, type === 'ambient' && styles.cardAmbient, className)}\n        {...rest}\n      >\n        {children}\n      </article>\n    </CardContext.Provider>\n  );\n}\n\nCard.displayName = 'Card';\nCard.Cell = CardCell;\n",".checkbox {\n  position: relative;\n  display: inline-flex;\n  cursor: pointer;\n}\n\n.checkbox[data-disabled] {\n  cursor: default;\n  opacity: 0.3;\n}\n\n.input {\n  position: absolute;\n  inset: 0;\n  width: 100%;\n  height: 100%;\n  margin: 0;\n  opacity: 0;\n  cursor: inherit;\n}\n\n.box {\n  position: relative;\n  width: 20px;\n  height: 20px;\n  border-radius: 6px;\n  box-shadow: inset 0 0 0 2px var(--tgui--outline);\n  transition:\n    box-shadow 0.15s ease-out,\n    background 0.15s ease-out;\n}\n\n.input:checked + .box,\n.input:indeterminate + .box {\n  background: var(--tgui--link_color);\n  box-shadow: none;\n}\n\n.input:focus-visible + .box {\n  box-shadow: 0 0 0 2px var(--tgui--link_color);\n}\n\n.input:checked + .box::after {\n  content: \"\";\n  position: absolute;\n  left: 7px;\n  top: 3px;\n  width: 5px;\n  height: 9px;\n  border: solid var(--tgui--button_text_color);\n  border-width: 0 2px 2px 0;\n  transform: rotate(45deg);\n}\n\n.input:indeterminate + .box::after {\n  content: \"\";\n  position: absolute;\n  left: 4px;\n  top: 9px;\n  width: 12px;\n  height: 2px;\n  background: var(--tgui--button_text_color);\n}\n","import { type InputHTMLAttributes, type Ref, useEffect, useRef } from 'react';\nimport { cn } from '../../shared/lib/cn';\nimport styles from './Checkbox.module.css';\n\nexport interface CheckboxProps extends InputHTMLAttributes<HTMLInputElement> {\n  ref?: Ref<HTMLInputElement>;\n  indeterminate?: boolean;\n}\n\nexport function Checkbox({\n  ref,\n  indeterminate = false,\n  disabled,\n  className,\n  style,\n  ...rest\n}: CheckboxProps) {\n  const inner = useRef<HTMLInputElement>(null);\n\n  useEffect(() => {\n    if (inner.current) inner.current.indeterminate = indeterminate;\n  }, [indeterminate]);\n\n  const mergeRef = (node: HTMLInputElement | null) => {\n    inner.current = node;\n    if (typeof ref === 'function') ref(node);\n    else if (ref) ref.current = node;\n  };\n\n  return (\n    <span\n      className={cn(styles.checkbox, className)}\n      style={style}\n      data-disabled={disabled || undefined}\n    >\n      <input\n        ref={mergeRef}\n        type=\"checkbox\"\n        className={styles.input}\n        disabled={disabled}\n        {...rest}\n      />\n      <span className={styles.box} aria-hidden />\n    </span>\n  );\n}\n\nCheckbox.displayName = 'Checkbox';\n",".divider {\n  margin: 0;\n  border: none;\n  border-block-start: var(--tgui--border--width) solid var(--tgui--outline);\n}\n","import type { HTMLAttributes, Ref } from 'react';\nimport { cn } from '../../shared/lib/cn';\nimport styles from './Divider.module.css';\n\nexport interface DividerProps extends HTMLAttributes<HTMLHRElement> {\n  ref?: Ref<HTMLHRElement>;\n}\n\nexport function Divider({ ref, className, ...rest }: DividerProps) {\n  return <hr ref={ref} className={cn(styles.divider, className)} {...rest} />;\n}\n\nDivider.displayName = 'Divider';\n",".headline {\n  font-size: var(--tgui--headline--font_size);\n  line-height: var(--tgui--headline--line_height);\n}\n","import type { Ref } from 'react';\nimport { cn } from '../../shared/lib/cn';\nimport { Typography, type TypographyProps } from '../Typography';\nimport styles from './Headline.module.css';\n\nexport interface HeadlineProps extends TypographyProps {\n  ref?: Ref<HTMLElement>;\n}\n\nexport function Headline({\n  ref,\n  weight = '2',\n  className,\n  Component = 'h5',\n  ...rest\n}: HeadlineProps) {\n  return (\n    <Typography\n      ref={ref}\n      weight={weight}\n      Component={Component}\n      className={cn(styles.headline, className)}\n      {...rest}\n    />\n  );\n}\n\nHeadline.displayName = 'Headline';\n",".base {\n  position: relative;\n  padding: 20px 22px 16px;\n  background: var(--tgui--bg_color);\n}\n\n.body {\n  display: flex;\n  align-items: center;\n  box-sizing: border-box;\n  padding: 12px 16px;\n}\n\n.body > :not(:first-child) {\n  margin-left: 12px;\n}\n\n.base .body {\n  border-radius: 14px;\n  box-shadow: 0 0 0 2px var(--tgui--outline);\n}\n\n.ios .body {\n  min-height: 48px;\n  border-radius: 12px;\n  background: var(--tgui--bg_color);\n}\n\n.before,\n.after {\n  display: flex;\n  align-items: center;\n}\n\n.field {\n  display: block;\n  width: 100%;\n  margin: 0;\n  padding: 0;\n  border: 0;\n  outline: 0;\n  background: transparent;\n  color: var(--tgui--text_color);\n  text-overflow: ellipsis;\n}\n\n.field::placeholder {\n  color: var(--tgui--secondary_hint_color);\n}\n\n.field::-webkit-outer-spin-button,\n.field::-webkit-inner-spin-button {\n  appearance: none;\n}\n\n.header {\n  position: absolute;\n  top: 6px;\n  left: 32px;\n  max-width: calc(100% - 76px);\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n  padding: 0 6px;\n  border-radius: 5px;\n  color: var(--tgui--secondary_hint_color);\n  background: var(--tgui--bg_color);\n}\n\n.focused.base .body {\n  box-shadow: 0 0 0 2px var(--tgui--link_color);\n}\n\n.focused.base .header {\n  color: var(--tgui--link_color);\n}\n\n.error.base .body {\n  box-shadow: 0 0 0 2px var(--tgui--destructive_text_color);\n}\n\n.error.base .header {\n  color: var(--tgui--destructive_text_color);\n}\n\n.error.ios .body {\n  box-shadow: 0 0 0 1.5px var(--tgui--destructive_text_color);\n}\n\n.disabled {\n  pointer-events: none;\n}\n\n.disabled.ios {\n  opacity: 0.35;\n}\n","'use client';\n\nimport {\n  type FocusEvent,\n  type InputHTMLAttributes,\n  type ReactNode,\n  type Ref,\n  useState,\n} from 'react';\nimport { cn } from '../../shared/lib/cn';\nimport { Subheadline } from '../Subheadline';\nimport { Text } from '../Text';\nimport { useTgui } from '../TguiProvider';\nimport styles from './Input.module.css';\n\nexport type InputStatus = 'default' | 'error' | 'focused';\n\nexport interface InputProps extends InputHTMLAttributes<HTMLInputElement> {\n  ref?: Ref<HTMLInputElement>;\n  header?: ReactNode;\n  before?: ReactNode;\n  after?: ReactNode;\n  status?: InputStatus;\n}\n\nexport function Input({\n  ref,\n  type = 'text',\n  header,\n  before,\n  after,\n  status,\n  disabled,\n  className,\n  onFocus,\n  onBlur,\n  ...rest\n}: InputProps) {\n  const { platform } = useTgui();\n  const ios = platform === 'ios';\n  const [focused, setFocused] = useState(false);\n  const state = status ?? (focused ? 'focused' : 'default');\n  const Typography = ios ? Text : Subheadline;\n\n  const handleFocus = (event: FocusEvent<HTMLInputElement>) => {\n    if (!disabled) setFocused(true);\n    onFocus?.(event);\n  };\n  const handleBlur = (event: FocusEvent<HTMLInputElement>) => {\n    setFocused(false);\n    onBlur?.(event);\n  };\n\n  return (\n    <div\n      className={cn(\n        ios ? styles.ios : styles.base,\n        state === 'error' && styles.error,\n        state === 'focused' && styles.focused,\n        disabled && styles.disabled,\n        className,\n      )}\n      aria-disabled={disabled || undefined}\n    >\n      {/* biome-ignore lint/a11y/noLabelWithoutControl: the control is <input> below, rendered via Typography */}\n      <label className={styles.body}>\n        {before != null ? <span className={styles.before}>{before}</span> : null}\n        <Typography\n          ref={ref as Ref<HTMLElement>}\n          Component=\"input\"\n          className={styles.field}\n          type={type}\n          disabled={disabled}\n          onFocus={handleFocus}\n          onBlur={handleBlur}\n          {...rest}\n        />\n        {after != null ? <span className={styles.after}>{after}</span> : null}\n      </label>\n      {header != null && !ios ? <span className={styles.header}>{header}</span> : null}\n    </div>\n  );\n}\n\nInput.displayName = 'Input';\n",".large-title {\n  font-size: var(--tgui--large_title--font_size);\n  line-height: var(--tgui--large_title--line_height);\n\n  letter-spacing: -0.02em;\n}\n","import type { Ref } from 'react';\nimport { cn } from '../../shared/lib/cn';\nimport { Typography, type TypographyProps } from '../Typography';\nimport styles from './LargeTitle.module.css';\n\nexport interface LargeTitleProps extends TypographyProps {\n  ref?: Ref<HTMLElement>;\n}\n\nexport function LargeTitle({\n  ref,\n  weight = '1',\n  className,\n  Component = 'h1',\n  ...rest\n}: LargeTitleProps) {\n  return (\n    <Typography\n      ref={ref}\n      weight={weight}\n      Component={Component}\n      className={cn(styles['large-title'], className)}\n      {...rest}\n    />\n  );\n}\n\nLargeTitle.displayName = 'LargeTitle';\n",".list {\n  box-sizing: border-box;\n}\n\n.ios {\n  padding: 10px 18px;\n}\n\n.list > :not(:last-child) {\n  margin-bottom: 12px;\n}\n","'use client';\n\nimport type { ElementType, HTMLAttributes, Ref } from 'react';\nimport { cn } from '../../shared/lib/cn';\nimport { useTgui } from '../TguiProvider';\nimport styles from './List.module.css';\n\nexport interface ListProps extends HTMLAttributes<HTMLElement> {\n  ref?: Ref<HTMLElement>;\n  Component?: ElementType;\n}\n\nexport function List({ ref, Component = 'div', className, children, ...rest }: ListProps) {\n  const { platform } = useTgui();\n\n  return (\n    <Component\n      ref={ref}\n      className={cn(styles.list, platform === 'ios' && styles.ios, className)}\n      {...rest}\n    >\n      {children}\n    </Component>\n  );\n}\n\nList.displayName = 'List';\n",".level-1 {\n  font-size: var(--tgui--title1--font_size);\n  line-height: var(--tgui--title1--line_height);\n}\n\n.level-2 {\n  font-size: var(--tgui--title2--font_size);\n  line-height: var(--tgui--title2--line_height);\n}\n\n.level-3 {\n  font-size: var(--tgui--title3--font_size);\n  line-height: var(--tgui--title3--line_height);\n}\n","import type { ElementType } from 'react';\nimport styles from './Title.module.css';\n\nexport type TitleLevel = '1' | '2' | '3';\n\nexport const TITLE_LEVELS: Record<TitleLevel, { tag: ElementType; className: string }> = {\n  '1': { tag: 'h2', className: styles['level-1'] },\n  '2': { tag: 'h3', className: styles['level-2'] },\n  '3': { tag: 'h4', className: styles['level-3'] },\n};\n","import type { Ref } from 'react';\nimport { cn } from '../../shared/lib/cn';\nimport { Typography, type TypographyProps } from '../Typography';\nimport { TITLE_LEVELS, type TitleLevel } from './Title.variants';\n\nexport interface TitleProps extends TypographyProps {\n  ref?: Ref<HTMLElement>;\n  level?: TitleLevel;\n}\n\nexport function Title({ ref, level = '2', Component, className, ...rest }: TitleProps) {\n  const { tag, className: levelClass } = TITLE_LEVELS[level];\n\n  return (\n    <Typography\n      ref={ref}\n      Component={Component ?? tag}\n      className={cn(levelClass, className)}\n      {...rest}\n    />\n  );\n}\n\nTitle.displayName = 'Title';\n",".placeholder {\n  overflow: hidden;\n\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n\n  gap: 24px;\n  padding: 32px;\n}\n\n.fields {\n  margin: 0;\n  text-align: center;\n  overflow-wrap: anywhere;\n}\n\n.description {\n  color: var(--tgui--hint_color);\n}\n\n.description:not(:first-child) {\n  margin-top: 8px;\n}\n","import type { HTMLAttributes, ReactNode, Ref } from 'react';\nimport { cn } from '../../shared/lib/cn';\nimport { Text } from '../Text';\nimport { Title } from '../Title';\nimport styles from './Placeholder.module.css';\n\nexport interface PlaceholderProps extends HTMLAttributes<HTMLElement> {\n  ref?: Ref<HTMLElement>;\n  children?: ReactNode;\n  header?: ReactNode;\n  description?: ReactNode;\n  action?: ReactNode;\n}\n\nexport function Placeholder({\n  ref,\n  children,\n  header,\n  description,\n  action,\n  className,\n  ...rest\n}: PlaceholderProps) {\n  return (\n    <section ref={ref} className={cn(styles.placeholder, className)} {...rest}>\n      {children}\n      {header != null || description != null ? (\n        <dl className={styles.fields}>\n          {header != null ? (\n            <Title Component=\"dt\" level=\"3\" weight=\"2\">\n              {header}\n            </Title>\n          ) : null}\n          {description != null ? (\n            <Text Component=\"dd\" className={styles.description}>\n              {description}\n            </Text>\n          ) : null}\n        </dl>\n      ) : null}\n      {action}\n    </section>\n  );\n}\n\nPlaceholder.displayName = 'Placeholder';\n",".body {\n  display: flex;\n  flex-direction: column;\n}\n\n.sectionBase .bodyWithHeader {\n  background: var(--tgui--section_bg_color);\n  box-shadow: var(--tgui--base--section--box_shadow);\n}\n\n.sectionIos .body {\n  border-radius: 12px;\n  background: var(--tgui--section_bg_color);\n}\n\n.sectionIos .body > :first-child {\n  border-radius: 12px 12px 0 0;\n}\n\n.sectionIos .body > :last-child {\n  border-radius: 0 0 12px 12px;\n}\n\n.sectionIos .body > :only-child {\n  border-radius: 12px;\n}\n\n.header {\n  padding: 20px 24px 4px 22px;\n  color: var(--tgui--link_color);\n}\n\n.headerLarge {\n  padding-left: 24px;\n  color: var(--tgui--text_color);\n}\n\n.headerIos {\n  padding: 16px 16px 8px;\n  color: var(--tgui--section_header_text_color);\n}\n\n.headerIos.headerLarge {\n  padding: 0 0 12px;\n  color: var(--tgui--text_color);\n}\n\n.footer {\n  padding: 12px 24px;\n}\n\n.footerIos {\n  padding: 8px 16px 0;\n}\n\n.footerCentered {\n  padding: 16px 24px 20px;\n  text-align: center;\n}\n\n.footerIos.footerCentered {\n  padding: 16px 16px 0;\n}\n\n.footerText {\n  color: var(--tgui--hint_color);\n}\n","'use client';\n\nimport type { HTMLAttributes, ReactNode, Ref } from 'react';\nimport { cn } from '../../shared/lib/cn';\nimport { Caption } from '../Caption';\nimport { Subheadline } from '../Subheadline';\nimport { useTgui } from '../TguiProvider';\nimport styles from './Section.module.css';\n\nexport interface SectionFooterProps extends HTMLAttributes<HTMLElement> {\n  ref?: Ref<HTMLElement>;\n  centered?: boolean;\n}\n\nfunction FooterText({ ios, children }: { ios: boolean; children: ReactNode }) {\n  return ios ? (\n    <Caption className={styles.footerText}>{children}</Caption>\n  ) : (\n    <Subheadline level=\"2\" className={styles.footerText}>\n      {children}\n    </Subheadline>\n  );\n}\n\nexport function SectionFooter({\n  ref,\n  centered = false,\n  className,\n  children,\n  ...rest\n}: SectionFooterProps) {\n  const { platform } = useTgui();\n  const ios = platform === 'ios';\n\n  return (\n    <footer\n      ref={ref}\n      className={cn(\n        styles.footer,\n        ios && styles.footerIos,\n        centered && styles.footerCentered,\n        className,\n      )}\n      {...rest}\n    >\n      <FooterText ios={ios}>{children}</FooterText>\n    </footer>\n  );\n}\n\nSectionFooter.displayName = 'SectionFooter';\n","'use client';\n\nimport type { HTMLAttributes, ReactNode, Ref } from 'react';\nimport { cn } from '../../shared/lib/cn';\nimport { Caption } from '../Caption';\nimport { Subheadline } from '../Subheadline';\nimport { Text } from '../Text';\nimport { useTgui } from '../TguiProvider';\nimport styles from './Section.module.css';\n\nexport interface SectionHeaderProps extends HTMLAttributes<HTMLElement> {\n  ref?: Ref<HTMLElement>;\n  large?: boolean;\n}\n\nfunction HeaderText({\n  ios,\n  large,\n  children,\n}: {\n  ios: boolean;\n  large: boolean;\n  children: ReactNode;\n}) {\n  if (large) {\n    return ios ? (\n      <Subheadline Component=\"h2\" level=\"1\" weight=\"2\">\n        {children}\n      </Subheadline>\n    ) : (\n      <Text Component=\"h2\" weight=\"2\">\n        {children}\n      </Text>\n    );\n  }\n  return ios ? (\n    <Caption Component=\"h2\" caps>\n      {children}\n    </Caption>\n  ) : (\n    <Subheadline Component=\"h2\" level=\"2\" weight=\"2\">\n      {children}\n    </Subheadline>\n  );\n}\n\nexport function SectionHeader({\n  ref,\n  large = false,\n  className,\n  children,\n  ...rest\n}: SectionHeaderProps) {\n  const { platform } = useTgui();\n  const ios = platform === 'ios';\n\n  return (\n    <header\n      ref={ref}\n      className={cn(styles.header, ios && styles.headerIos, large && styles.headerLarge, className)}\n      {...rest}\n    >\n      <HeaderText ios={ios} large={large}>\n        {children}\n      </HeaderText>\n    </header>\n  );\n}\n\nSectionHeader.displayName = 'SectionHeader';\n","'use client';\n\nimport {\n  Children,\n  Fragment,\n  type HTMLAttributes,\n  isValidElement,\n  type ReactNode,\n  type Ref,\n} from 'react';\nimport { cn } from '../../shared/lib/cn';\nimport { Divider } from '../Divider';\nimport { useTgui } from '../TguiProvider';\nimport styles from './Section.module.css';\nimport { SectionFooter } from './SectionFooter';\nimport { SectionHeader } from './SectionHeader';\n\nexport interface SectionProps extends HTMLAttributes<HTMLElement> {\n  ref?: Ref<HTMLElement>;\n  header?: ReactNode;\n  footer?: ReactNode;\n}\n\nconst isText = (node: ReactNode) => typeof node === 'string' || typeof node === 'number';\n\nexport function Section({ ref, header, footer, className, children, ...rest }: SectionProps) {\n  const { platform } = useTgui();\n  const rows = Children.toArray(children);\n\n  return (\n    <section\n      ref={ref}\n      className={cn(platform === 'ios' ? styles.sectionIos : styles.sectionBase, className)}\n      {...rest}\n    >\n      <div className={styles.bodyWithHeader}>\n        {isText(header) ? <SectionHeader>{header}</SectionHeader> : header}\n        <div className={styles.body}>\n          {rows.map((row, i) => (\n            <Fragment key={isValidElement(row) ? row.key : i}>\n              {row}\n              {i < rows.length - 1 ? <Divider /> : null}\n            </Fragment>\n          ))}\n        </div>\n      </div>\n      {isText(footer) ? <SectionFooter>{footer}</SectionFooter> : footer}\n    </section>\n  );\n}\n\nSection.displayName = 'Section';\nSection.Header = SectionHeader;\nSection.Footer = SectionFooter;\n",".base {\n  position: relative;\n  padding: 20px 22px 16px;\n  background: var(--tgui--bg_color);\n}\n\n.row {\n  position: relative;\n  box-sizing: border-box;\n  border-radius: 14px;\n  box-shadow: inset 0 0 0 2px var(--tgui--outline);\n}\n\n.ios .row {\n  border-radius: 12px;\n  background: var(--tgui--bg_color);\n}\n\n.select {\n  appearance: none;\n  display: block;\n  width: 100%;\n  min-height: 48px;\n  margin: 0;\n  padding: 12px 44px 12px 16px;\n  border: 0;\n  outline: 0;\n  border-radius: inherit;\n  background: transparent;\n  color: var(--tgui--text_color);\n}\n\n.chevron {\n  position: absolute;\n  top: 50%;\n  right: 18px;\n  width: 8px;\n  height: 8px;\n  border: solid var(--tgui--secondary_hint_color);\n  border-width: 0 2px 2px 0;\n  transform: translateY(-75%) rotate(45deg);\n  pointer-events: none;\n}\n\n.header {\n  position: absolute;\n  top: 6px;\n  left: 32px;\n  max-width: calc(100% - 76px);\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n  padding: 0 6px;\n  border-radius: 5px;\n  color: var(--tgui--secondary_hint_color);\n  background: var(--tgui--bg_color);\n}\n\n.focused.base .row {\n  box-shadow: inset 0 0 0 2px var(--tgui--link_color);\n}\n\n.focused.base .header {\n  color: var(--tgui--link_color);\n}\n\n.error.base .row {\n  box-shadow: inset 0 0 0 2px var(--tgui--destructive_text_color);\n}\n\n.error.base .header {\n  color: var(--tgui--destructive_text_color);\n}\n\n.error.ios .row {\n  box-shadow: inset 0 0 0 1.5px var(--tgui--destructive_text_color);\n}\n\n.disabled {\n  pointer-events: none;\n}\n\n.disabled.ios {\n  opacity: 0.35;\n}\n","'use client';\n\nimport {\n  type FocusEvent,\n  type ReactNode,\n  type Ref,\n  type SelectHTMLAttributes,\n  useState,\n} from 'react';\nimport { cn } from '../../shared/lib/cn';\nimport type { InputStatus } from '../Input';\nimport { Subheadline } from '../Subheadline';\nimport { Text } from '../Text';\nimport { useTgui } from '../TguiProvider';\nimport styles from './Select.module.css';\n\nexport interface SelectProps extends SelectHTMLAttributes<HTMLSelectElement> {\n  ref?: Ref<HTMLSelectElement>;\n  header?: ReactNode;\n  status?: InputStatus;\n}\n\nexport function Select({\n  ref,\n  header,\n  status,\n  disabled,\n  className,\n  onFocus,\n  onBlur,\n  children,\n  ...rest\n}: SelectProps) {\n  const { platform } = useTgui();\n  const ios = platform === 'ios';\n  const [focused, setFocused] = useState(false);\n  const state = status ?? (focused ? 'focused' : 'default');\n  const Typography = ios ? Text : Subheadline;\n\n  const handleFocus = (event: FocusEvent<HTMLSelectElement>) => {\n    if (!disabled) setFocused(true);\n    onFocus?.(event);\n  };\n  const handleBlur = (event: FocusEvent<HTMLSelectElement>) => {\n    setFocused(false);\n    onBlur?.(event);\n  };\n\n  return (\n    <div\n      className={cn(\n        ios ? styles.ios : styles.base,\n        state === 'error' && styles.error,\n        state === 'focused' && styles.focused,\n        disabled && styles.disabled,\n        className,\n      )}\n      aria-disabled={disabled || undefined}\n    >\n      <div className={styles.row}>\n        <Typography\n          ref={ref as Ref<HTMLElement>}\n          Component=\"select\"\n          className={styles.select}\n          disabled={disabled}\n          onFocus={handleFocus}\n          onBlur={handleBlur}\n          {...rest}\n        >\n          {children}\n        </Typography>\n        <span aria-hidden className={styles.chevron} />\n      </div>\n      {header != null && !ios ? <span className={styles.header}>{header}</span> : null}\n    </div>\n  );\n}\n\nSelect.displayName = 'Select';\n",".switch {\n  position: relative;\n  overflow: hidden;\n  display: inline-flex;\n  align-items: center;\n  width: 52px;\n  height: 32px;\n  border-radius: 16px;\n  cursor: pointer;\n  flex-shrink: 0;\n}\n\n.switch[data-disabled] {\n  cursor: default;\n  opacity: 0.4;\n}\n\n.input {\n  position: absolute;\n  inset: 0;\n  width: 100%;\n  height: 100%;\n  margin: 0;\n  opacity: 0;\n  cursor: inherit;\n}\n\n.control::before {\n  position: absolute;\n  content: \"\";\n  inset: 0;\n  background: var(--tgui--secondary_bg_color);\n}\n\n.base .control::before {\n  border-radius: 16px;\n  border: 3px solid var(--tgui--secondary_hint_color);\n}\n\n.control::after {\n  position: absolute;\n  content: \"\";\n  top: 50%;\n  transform: translateY(-50%);\n  border-radius: 50%;\n}\n\n.base .control::after {\n  width: 16px;\n  height: 16px;\n  margin-left: 8px;\n  background: var(--tgui--secondary_hint_color);\n}\n\n.ios .control::before {\n  background: rgba(120, 120, 128, 0.22);\n}\n\n.ios .control::after {\n  width: 28px;\n  height: 28px;\n  margin-left: 2px;\n  background: var(--tgui--white);\n  box-shadow:\n    0 3px 8px 0 rgba(0, 0, 0, 0.12),\n    0 1px 1px 0 rgba(0, 0, 0, 0.16);\n}\n\n.input:checked + .control::before {\n  border-color: var(--tgui--link_color);\n  background-color: var(--tgui--link_color);\n}\n\n.input:checked + .control::after {\n  transform: translateX(20px) translateY(-50%);\n}\n\n.base .input:checked + .control::after {\n  width: 24px;\n  height: 24px;\n  background: var(--tgui--white);\n  transform: translateX(16px) translateY(-50%);\n}\n\n.input:focus-visible + .control::before {\n  box-shadow: 0 0 0 2px var(--tgui--link_color);\n}\n\n@media (prefers-reduced-motion: no-preference) {\n  .control::before {\n    transition:\n      background-color 0.2s ease,\n      border-color 0.2s ease;\n  }\n  .control::after {\n    transition: transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);\n  }\n  .ios .control::after {\n    transition: transform 0.2s cubic-bezier(0.36, -0.24, 0.26, 1.32);\n  }\n}\n","'use client';\n\nimport type { InputHTMLAttributes, Ref } from 'react';\nimport { cn } from '../../shared/lib/cn';\nimport { useTgui } from '../TguiProvider';\nimport styles from './Switch.module.css';\n\nexport interface SwitchProps extends InputHTMLAttributes<HTMLInputElement> {\n  ref?: Ref<HTMLInputElement>;\n}\n\nexport function Switch({ ref, disabled, className, style, ...rest }: SwitchProps) {\n  const { platform } = useTgui();\n\n  return (\n    <label\n      className={cn(styles.switch, platform === 'ios' ? styles.ios : styles.base, className)}\n      style={style}\n      data-disabled={disabled || undefined}\n    >\n      <input ref={ref} type=\"checkbox\" className={styles.input} disabled={disabled} {...rest} />\n      <span aria-hidden className={styles.control} />\n    </label>\n  );\n}\n\nSwitch.displayName = 'Switch';\n",".bar {\n  display: flex;\n  align-items: stretch;\n  padding: 0 16px;\n  padding-bottom: env(safe-area-inset-bottom, 0px);\n  background: var(--tgui--surface_primary);\n  box-shadow: 0 -0.5px 0 var(--tgui--divider);\n}\n\n.barIos {\n  padding: 0;\n  padding-bottom: calc(6px + env(safe-area-inset-bottom, 0px));\n}\n\n.item {\n  flex: 1 0 0;\n  min-inline-size: 0;\n  max-inline-size: 100%;\n  margin: 0;\n  padding: 10px 16px 14px;\n  border: none;\n  background: transparent;\n\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  gap: 4px;\n\n  color: var(--tgui--secondary_hint_color);\n  transition: color 0.15s ease-out;\n}\n\n.itemIos {\n  padding: 7px 12px 2px;\n  gap: 3px;\n}\n\n.itemSelected {\n  color: var(--tgui--link_color);\n}\n\n.icon {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  min-width: 64px;\n  height: 32px;\n  padding: 2px 10px;\n  border-radius: 16px;\n  transition: background 0.15s ease-out;\n}\n\n.itemIos .icon {\n  min-width: 0;\n  height: 28px;\n  padding: 0;\n}\n\n.itemSelected:not(.itemIos) .icon {\n  background: var(--tgui--secondary_fill);\n}\n\n.text {\n  max-inline-size: 100%;\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n}\n","'use client';\n\nimport type { ButtonHTMLAttributes, ReactNode, Ref } from 'react';\nimport { cn } from '../../shared/lib/cn';\nimport { Caption } from '../Caption';\nimport { Tappable } from '../Tappable';\nimport { useTgui } from '../TguiProvider';\nimport styles from './TabBar.module.css';\n\nexport interface TabBarItemProps extends ButtonHTMLAttributes<HTMLButtonElement> {\n  ref?: Ref<HTMLElement>;\n  selected?: boolean;\n  text?: string;\n  children?: ReactNode;\n}\n\nexport function TabBarItem({ ref, selected, text, children, className, ...rest }: TabBarItemProps) {\n  const { platform } = useTgui();\n  const ios = platform === 'ios';\n\n  return (\n    <Tappable\n      ref={ref}\n      Component=\"button\"\n      interactiveAnimation=\"opacity\"\n      aria-current={selected ? 'page' : undefined}\n      className={cn(styles.item, ios && styles.itemIos, selected && styles.itemSelected, className)}\n      {...rest}\n    >\n      {children != null ? <span className={styles.icon}>{children}</span> : null}\n      {text != null ? (\n        <Caption className={styles.text} weight=\"2\" level={ios ? '2' : '1'}>\n          {text}\n        </Caption>\n      ) : null}\n    </Tappable>\n  );\n}\n\nTabBarItem.displayName = 'TabBarItem';\n","'use client';\n\nimport type { HTMLAttributes, Ref } from 'react';\nimport { cn } from '../../shared/lib/cn';\nimport { useTgui } from '../TguiProvider';\nimport styles from './TabBar.module.css';\nimport { TabBarItem } from './TabBarItem';\n\nexport interface TabBarProps extends HTMLAttributes<HTMLElement> {\n  ref?: Ref<HTMLElement>;\n}\n\nexport function TabBar({ ref, className, children, ...rest }: TabBarProps) {\n  const { platform } = useTgui();\n\n  return (\n    <nav\n      ref={ref}\n      className={cn(styles.bar, platform === 'ios' && styles.barIos, className)}\n      {...rest}\n    >\n      {children}\n    </nav>\n  );\n}\n\nTabBar.displayName = 'TabBar';\nTabBar.Item = TabBarItem;\n"],"mappings":"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"}
+{"version":3,"file":"index.js","names":[],"sources":["../src/shared/lib/cn.ts","../src/components/Typography/Typography.module.css","../src/components/Typography/Typography.variants.ts","../src/components/Typography/Typography.tsx","../src/components/Subheadline/Subheadline.module.css","../src/components/Subheadline/Subheadline.variants.ts","../src/components/Subheadline/Subheadline.tsx","../src/components/TguiProvider/context.ts","../src/components/TguiProvider/useTgui.ts","../src/components/Tappable/Ripple.module.css","../src/components/Tappable/Ripple.tsx","../src/components/Tappable/Tappable.module.css","../src/components/Tappable/useRipple.ts","../src/components/Tappable/Tappable.tsx","../src/components/Text/Text.module.css","../src/components/Text/Text.tsx","../src/shared/lib/telegram.ts","../src/shared/lib/appearance.ts","../src/shared/lib/platform.ts","../src/components/TguiProvider/TguiProvider.module.css","../src/components/TguiProvider/TguiProvider.tsx","../src/components/Button/Button.module.css","../src/components/Button/Button.variants.ts","../src/components/Button/Button.tsx","../src/components/Caption/Caption.module.css","../src/components/Caption/Caption.variants.ts","../src/components/Caption/Caption.tsx","../src/components/Card/Card.context.ts","../src/components/Card/Card.module.css","../src/components/Cell/Cell.module.css","../src/components/Cell/Cell.variants.ts","../src/components/Cell/Cell.tsx","../src/components/Card/CardCell.tsx","../src/components/Card/Card.tsx","../src/components/Checkbox/Checkbox.module.css","../src/components/Checkbox/Checkbox.tsx","../src/components/Divider/Divider.module.css","../src/components/Divider/Divider.tsx","../src/components/Headline/Headline.module.css","../src/components/Headline/Headline.tsx","../src/components/Input/Input.module.css","../src/components/Input/Input.tsx","../src/components/LargeTitle/LargeTitle.module.css","../src/components/LargeTitle/LargeTitle.tsx","../src/components/List/List.module.css","../src/components/List/List.tsx","../src/components/Title/Title.module.css","../src/components/Title/Title.variants.ts","../src/components/Title/Title.tsx","../src/components/Placeholder/Placeholder.module.css","../src/components/Placeholder/Placeholder.tsx","../src/components/Section/Section.module.css","../src/components/Section/SectionFooter.tsx","../src/components/Section/SectionHeader.tsx","../src/components/Section/Section.tsx","../src/components/Select/Select.module.css","../src/components/Select/Select.tsx","../src/components/Switch/Switch.module.css","../src/components/Switch/Switch.tsx","../src/components/TabBar/TabBar.module.css","../src/components/TabBar/TabBarItem.tsx","../src/components/TabBar/TabBar.tsx"],"sourcesContent":["import { type ClassValue, clsx } from 'clsx';\n\nexport function cn(...inputs: ClassValue[]) {\n  return clsx(inputs);\n}\n",".typography {\n  margin: 0;\n  font-family: var(--tgui--font-family);\n}\n\n.weight-1 {\n  font-weight: var(--tgui--font_weight--accent1);\n}\n\n.weight-2 {\n  font-weight: var(--tgui--font_weight--accent2);\n}\n\n.weight-3 {\n  font-weight: var(--tgui--font_weight--accent3);\n}\n\n.caps {\n  text-transform: uppercase;\n}\n","import { cva } from 'class-variance-authority';\nimport styles from './Typography.module.css';\n\nexport const typography = cva(styles.typography, {\n  variants: {\n    weight: {\n      '1': styles['weight-1'],\n      '2': styles['weight-2'],\n      '3': styles['weight-3'],\n    },\n    caps: { true: styles.caps },\n  },\n  defaultVariants: { weight: '3' },\n});\n","import type { AllHTMLAttributes, ElementType, Ref } from 'react';\nimport { cn } from '../../shared/lib/cn';\nimport { typography } from './Typography.variants';\n\nexport interface TypographyProps extends AllHTMLAttributes<HTMLElement> {\n  ref?: Ref<HTMLElement>;\n  weight?: '1' | '2' | '3';\n  caps?: boolean;\n  Component?: ElementType;\n}\n\nexport function Typography({\n  ref,\n  weight,\n  caps,\n  Component = 'span',\n  className,\n  ...rest\n}: TypographyProps) {\n  return <Component ref={ref} className={cn(typography({ weight, caps }), className)} {...rest} />;\n}\n\nTypography.displayName = 'Typography';\n",".level-1 {\n  font-size: var(--tgui--subheadline1--font_size);\n  line-height: var(--tgui--subheadline1--line_height);\n}\n\n.level-2 {\n  font-size: var(--tgui--subheadline2--font_size);\n  line-height: var(--tgui--subheadline2--line_height);\n}\n","import { cva } from 'class-variance-authority';\nimport styles from './Subheadline.module.css';\n\nexport type SubheadlineLevel = '1' | '2';\n\nexport const subheadline = cva('', {\n  variants: {\n    level: {\n      '1': styles['level-1'],\n      '2': styles['level-2'],\n    },\n  },\n  defaultVariants: { level: '1' },\n});\n","import type { Ref } from 'react';\nimport { cn } from '../../shared/lib/cn';\nimport { Typography, type TypographyProps } from '../Typography';\nimport { type SubheadlineLevel, subheadline } from './Subheadline.variants';\n\nexport interface SubheadlineProps extends TypographyProps {\n  ref?: Ref<HTMLElement>;\n  level?: SubheadlineLevel;\n}\n\nexport function Subheadline({\n  ref,\n  level,\n  Component = 'h6',\n  className,\n  ...rest\n}: SubheadlineProps) {\n  return (\n    <Typography\n      ref={ref}\n      Component={Component}\n      className={cn(subheadline({ level }), className)}\n      {...rest}\n    />\n  );\n}\n\nSubheadline.displayName = 'Subheadline';\n","import { createContext } from 'react';\nimport type { TguiContextValue } from '../../shared/types/tgui';\n\nexport const TguiContext = createContext<TguiContextValue | null>(null);\n\nTguiContext.displayName = 'TguiContext';\n","import { useContext } from 'react';\nimport type { TguiContextValue } from '../../shared/types/tgui';\nimport { TguiContext } from './context';\n\nexport function useTgui(): TguiContextValue {\n  const context = useContext(TguiContext);\n\n  if (context === null) {\n    throw new Error('useTgui must be used within a <TguiProvider>.');\n  }\n\n  return context;\n}\n",".ripple {\n  position: absolute;\n  inset: 0;\n  overflow: hidden;\n  border-radius: inherit;\n  pointer-events: none;\n}\n\n.wave {\n  position: absolute;\n  width: 24px;\n  height: 24px;\n  border-radius: 50%;\n  transform: translate(-50%, -50%);\n  background: var(--tgui--outline);\n  opacity: 0;\n  animation: wave-rise 0.35s cubic-bezier(0.3, 0.3, 0.5, 1);\n}\n\n@keyframes wave-rise {\n  from {\n    transform: translate(-50%, -50%) scale(1);\n    opacity: 1;\n  }\n  30% {\n    opacity: 1;\n  }\n  to {\n    transform: translate(-50%, -50%) scale(8);\n    opacity: 0;\n  }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .wave {\n    animation: none;\n  }\n}\n","import styles from './Ripple.module.css';\nimport type { Wave } from './useRipple';\n\ninterface RippleProps {\n  waves: Wave[];\n  onWaveEnd: (id: number) => void;\n}\n\nexport function Ripple({ waves, onWaveEnd }: RippleProps) {\n  return (\n    <span aria-hidden className={styles.ripple}>\n      {waves.map((wave) => (\n        <span\n          key={wave.id}\n          className={styles.wave}\n          style={{ top: wave.y, left: wave.x }}\n          onAnimationEnd={() => onWaveEnd(wave.id)}\n        />\n      ))}\n    </span>\n  );\n}\n",".tappable {\n  position: relative;\n  isolation: isolate;\n  cursor: pointer;\n  transition: opacity 0.15s ease-out;\n}\n\n.tappable[data-readonly] {\n  cursor: default;\n}\n\n.tappable[data-disabled] {\n  cursor: default;\n  opacity: 0.35;\n}\n\n.tappable--ios:not([data-disabled]):not([data-readonly]):active,\n.tappable--opacity:not([data-disabled]):not([data-readonly]):active {\n  opacity: 0.65;\n}\n\n@media (hover: hover) and (pointer: fine) {\n  .tappable--ios:not([data-disabled]):not([data-readonly]):hover,\n  .tappable--opacity:not([data-disabled]):not([data-readonly]):hover {\n    opacity: 0.85;\n  }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .tappable {\n    transition: none;\n  }\n}\n","import { type PointerEvent, useCallback, useEffect, useRef, useState } from 'react';\n\nconst PRESS_DELAY = 70;\nconst WAVE_FALLBACK = 600;\n\nexport interface Wave {\n  id: number;\n  x: number;\n  y: number;\n}\n\ntype Timer = ReturnType<typeof setTimeout>;\n\nexport function useRipple() {\n  const [waves, setWaves] = useState<Wave[]>([]);\n  const nextId = useRef(0);\n  const pressTimers = useRef(new Map<number, Timer>());\n  const waveTimers = useRef(new Set<Timer>());\n\n  useEffect(() => {\n    const press = pressTimers.current;\n    const wave = waveTimers.current;\n    return () => {\n      for (const timer of press.values()) clearTimeout(timer);\n      for (const timer of wave) clearTimeout(timer);\n    };\n  }, []);\n\n  const removeWave = useCallback((id: number) => {\n    setWaves((current) => current.filter((wave) => wave.id !== id));\n  }, []);\n\n  const onPointerDown = useCallback(\n    (event: PointerEvent<HTMLElement>) => {\n      const { top, left } = event.currentTarget.getBoundingClientRect();\n      const x = event.clientX - left;\n      const y = event.clientY - top;\n      const { pointerId } = event;\n\n      const press = setTimeout(() => {\n        pressTimers.current.delete(pointerId);\n        const id = nextId.current++;\n        setWaves((current) => [...current, { id, x, y }]);\n\n        const fallback = setTimeout(() => {\n          waveTimers.current.delete(fallback);\n          removeWave(id);\n        }, WAVE_FALLBACK);\n        waveTimers.current.add(fallback);\n      }, PRESS_DELAY);\n\n      pressTimers.current.set(pointerId, press);\n    },\n    [removeWave],\n  );\n\n  const onPointerCancel = useCallback((event: PointerEvent<HTMLElement>) => {\n    const press = pressTimers.current.get(event.pointerId);\n    if (press) {\n      clearTimeout(press);\n      pressTimers.current.delete(event.pointerId);\n    }\n  }, []);\n\n  return { waves, onPointerDown, onPointerCancel, removeWave };\n}\n","'use client';\n\nimport type { AllHTMLAttributes, ElementType, PointerEvent, Ref } from 'react';\nimport { cn } from '../../shared/lib/cn';\nimport { useTgui } from '../TguiProvider/useTgui';\nimport { Ripple } from './Ripple';\nimport styles from './Tappable.module.css';\nimport { useRipple } from './useRipple';\n\nexport interface TappableProps extends AllHTMLAttributes<HTMLElement> {\n  ref?: Ref<HTMLElement>;\n  Component?: ElementType;\n  interactiveAnimation?: 'background' | 'opacity';\n}\n\nexport function Tappable({\n  ref,\n  Component = 'div',\n  interactiveAnimation = 'background',\n  className,\n  children,\n  onPointerDown,\n  onPointerCancel,\n  ...rest\n}: TappableProps) {\n  const { platform } = useTgui();\n  const ripple = useRipple();\n  const disabled = Boolean(rest.disabled);\n  const readOnly = Boolean(rest.readOnly);\n\n  const interactive = Component !== 'div' && Component !== 'span';\n  const hasRipple =\n    platform === 'base' &&\n    interactiveAnimation === 'background' &&\n    !readOnly &&\n    !disabled &&\n    (interactive || rest.onClick != null);\n\n  const handlePointerDown = (event: PointerEvent<HTMLElement>) => {\n    if (hasRipple) ripple.onPointerDown(event);\n    onPointerDown?.(event);\n  };\n\n  const handlePointerCancel = (event: PointerEvent<HTMLElement>) => {\n    if (hasRipple) ripple.onPointerCancel(event);\n    onPointerCancel?.(event);\n  };\n\n  return (\n    <Component\n      ref={ref}\n      className={cn(\n        styles.tappable,\n        platform === 'ios' && styles['tappable--ios'],\n        interactiveAnimation === 'opacity' && styles['tappable--opacity'],\n        className,\n      )}\n      data-readonly={readOnly || undefined}\n      data-disabled={disabled || undefined}\n      aria-disabled={disabled || undefined}\n      onPointerDown={handlePointerDown}\n      onPointerCancel={handlePointerCancel}\n      {...rest}\n    >\n      {hasRipple && <Ripple waves={ripple.waves} onWaveEnd={ripple.removeWave} />}\n      {children}\n    </Component>\n  );\n}\n\nTappable.displayName = 'Tappable';\n",".text {\n  font-size: var(--tgui--text--font_size);\n  line-height: var(--tgui--text--line_height);\n}\n","import type { Ref } from 'react';\nimport { cn } from '../../shared/lib/cn';\nimport { Typography, type TypographyProps } from '../Typography';\nimport styles from './Text.module.css';\n\nexport interface TextProps extends TypographyProps {\n  ref?: Ref<HTMLElement>;\n}\n\nexport function Text({ ref, className, Component = 'span', ...rest }: TextProps) {\n  return (\n    <Typography ref={ref} Component={Component} className={cn(styles.text, className)} {...rest} />\n  );\n}\n\nText.displayName = 'Text';\n","import type { WebApp } from '../types/telegram';\n\nexport function getTelegramWebApp(): WebApp | undefined {\n  if (typeof window === 'undefined') {\n    return undefined;\n  }\n\n  return window.Telegram?.WebApp;\n}\n","import type { Appearance } from '../types/tgui';\nimport { getTelegramWebApp } from './telegram';\n\nconst DARK_QUERY = '(prefers-color-scheme: dark)';\n\nfunction canMatchMedia() {\n  return typeof window !== 'undefined' && typeof window.matchMedia === 'function';\n}\n\nexport function getAppearance(): Appearance {\n  const webApp = getTelegramWebApp();\n  if (webApp) {\n    return webApp.colorScheme === 'dark' ? 'dark' : 'light';\n  }\n\n  if (canMatchMedia()) {\n    return window.matchMedia(DARK_QUERY).matches ? 'dark' : 'light';\n  }\n\n  return 'light';\n}\n\nexport function subscribeAppearance(onChange: () => void): () => void {\n  const webApp = getTelegramWebApp();\n  if (webApp) {\n    webApp.onEvent('themeChanged', onChange);\n    return () => webApp.offEvent('themeChanged', onChange);\n  }\n\n  if (!canMatchMedia()) {\n    return () => {};\n  }\n\n  const media = window.matchMedia(DARK_QUERY);\n  media.addEventListener('change', onChange);\n  return () => media.removeEventListener('change', onChange);\n}\n","import type { TguiPlatform } from '../types/tgui';\nimport { getTelegramWebApp } from './telegram';\n\nconst TELEGRAM_IOS_LIKE = new Set(['ios', 'macos']);\n\nexport function getPlatform(): TguiPlatform {\n  const webApp = getTelegramWebApp();\n  if (webApp) {\n    return TELEGRAM_IOS_LIKE.has(webApp.platform) ? 'ios' : 'base';\n  }\n\n  if (typeof navigator === 'undefined') {\n    return 'base';\n  }\n\n  const ua = navigator.userAgent;\n  const isIpadOs = ua.includes('Macintosh') && navigator.maxTouchPoints > 1;\n\n  return /iphone|ipad|ipod/i.test(ua) || isIpadOs ? 'ios' : 'base';\n}\n",".wrapper {\n  --tgui--font-family:\n    system-ui, -apple-system, BlinkMacSystemFont, \"Roboto\", \"Apple Color Emoji\", \"Helvetica Neue\",\n    sans-serif;\n\n  --tgui--font_weight--accent1: 700;\n  --tgui--font_weight--accent2: 600;\n  --tgui--font_weight--accent3: 400;\n\n  --tgui--large_title--font_size: 34px;\n  --tgui--large_title--line_height: 42px;\n\n  --tgui--title1--font_size: 28px;\n  --tgui--title1--line_height: 36px;\n  --tgui--title2--font_size: 24px;\n  --tgui--title2--line_height: 32px;\n  --tgui--title3--font_size: 20px;\n  --tgui--title3--line_height: 24px;\n\n  --tgui--headline--font_size: 19px;\n  --tgui--headline--line_height: 28px;\n\n  --tgui--text--font_size: 17px;\n  --tgui--text--line_height: 26px;\n\n  --tgui--subheadline1--font_size: 16px;\n  --tgui--subheadline1--line_height: 24px;\n  --tgui--subheadline2--font_size: 15px;\n  --tgui--subheadline2--line_height: 22px;\n\n  --tgui--caption1--font_size: 13px;\n  --tgui--caption1--line_height: 20px;\n  --tgui--caption2--font_size: 11px;\n  --tgui--caption2--line_height: 16px;\n\n  --tgui--border--width: 1px;\n  --tgui--base--section--box_shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1);\n\n  --tgui--bg_color: var(--tg-theme-bg-color, #ffffff);\n  --tgui--text_color: var(--tg-theme-text-color, #000000);\n  --tgui--hint_color: var(--tg-theme-hint-color, #707579);\n  --tgui--link_color: var(--tg-theme-link-color, #007aff);\n  --tgui--button_color: var(--tg-theme-button-color, #007aff);\n  --tgui--button_text_color: var(--tg-theme-button-text-color, #ffffff);\n  --tgui--secondary_bg_color: var(--tg-theme-secondary-bg-color, #efeff4);\n  --tgui--header_bg_color: var(--tg-theme-header-bg-color, #ffffff);\n  --tgui--accent_text_color: var(--tg-theme-accent-text-color, #007aff);\n  --tgui--section_bg_color: var(--tg-theme-section-bg-color, #ffffff);\n  --tgui--section_header_text_color: var(--tg-theme-section-header-text-color, #707579);\n  --tgui--subtitle_text_color: var(--tg-theme-subtitle-text-color, #707579);\n  --tgui--destructive_text_color: var(--tg-theme-destructive-text-color, #e53935);\n\n  --tgui--skeleton: rgba(0, 0, 0, 0.03);\n  --tgui--divider: rgba(0, 0, 0, 0.15);\n  --tgui--outline: rgba(0, 0, 0, 0.05);\n  --tgui--surface_primary: rgba(255, 255, 255, 0.95);\n\n  --tgui--tertiary_bg_color: #f4f4f7;\n  --tgui--quartenary_bg_color: #f6f6fa;\n  --tgui--segmented_control_active_bg: var(--tgui--bg_color);\n  --tgui--card_bg_color: var(--tgui--section_bg_color);\n  --tgui--secondary_hint_color: #a2acb0;\n  --tgui--secondary_fill: rgba(67, 120, 255, 0.14);\n  --tgui--green: #31d158;\n  --tgui--destructive_background: #e53935;\n  --tgui--primary_code_highlight: #4378ff;\n  --tgui--secondary_code_highlight: #b00fb4;\n  --tgui--tertiary_code_highlight: #3a9f20;\n  --tgui--plain_background: rgba(0, 0, 0, 0.04);\n  --tgui--plain_foreground: rgba(0, 0, 0, 0.8);\n  --tgui--toast_accent_color: #55a6ff;\n\n  --tgui--surface_dark: rgba(56, 56, 56, 0.85);\n  --tgui--tooltip_background_dark: rgba(0, 0, 0, 0.85);\n  --tgui--white: #ffffff;\n  --tgui--black: #000000;\n\n  --tgui--z-index--simple: 1;\n  --tgui--z-index--skeleton: 2;\n  --tgui--z-index--overlay: 3;\n\n  -webkit-tap-highlight-color: transparent;\n  -webkit-text-size-adjust: 100%;\n\n  font-family: var(--tgui--font-family);\n  color: var(--tgui--text_color);\n}\n\n.wrapper--ios {\n  --tgui--large_title--line_height: 41px;\n  --tgui--title1--line_height: 34px;\n  --tgui--title2--line_height: 28px;\n  --tgui--title3--line_height: 25px;\n  --tgui--headline--line_height: 24px;\n  --tgui--text--line_height: 22px;\n  --tgui--subheadline1--line_height: 21px;\n  --tgui--subheadline2--line_height: 20px;\n  --tgui--caption1--line_height: 16px;\n  --tgui--caption2--line_height: 13px;\n}\n\n.wrapper--dark {\n  --tgui--bg_color: var(--tg-theme-bg-color, #212121);\n  --tgui--text_color: var(--tg-theme-text-color, #ffffff);\n  --tgui--hint_color: var(--tg-theme-hint-color, #aaaaaa);\n  --tgui--link_color: var(--tg-theme-link-color, #2990ff);\n  --tgui--button_color: var(--tg-theme-button-color, #2990ff);\n  --tgui--button_text_color: var(--tg-theme-button-text-color, #ffffff);\n  --tgui--secondary_bg_color: var(--tg-theme-secondary-bg-color, #0f0f0f);\n  --tgui--header_bg_color: var(--tg-theme-header-bg-color, #212121);\n  --tgui--accent_text_color: var(--tg-theme-accent-text-color, #007aff);\n  --tgui--section_bg_color: var(--tg-theme-section-bg-color, #212121);\n  --tgui--section_header_text_color: var(--tg-theme-section-header-text-color, #aaaaaa);\n  --tgui--subtitle_text_color: var(--tg-theme-subtitle-text-color, #aaaaaa);\n  --tgui--destructive_text_color: var(--tg-theme-destructive-text-color, #e53935);\n\n  --tgui--skeleton: rgba(255, 255, 255, 0.03);\n  --tgui--divider: rgba(255, 255, 255, 0.05);\n  --tgui--outline: rgba(255, 255, 255, 0.1);\n  --tgui--surface_primary: rgba(23, 23, 23, 0.95);\n  --tgui--tertiary_bg_color: #2a2a2a;\n  --tgui--quartenary_bg_color: #2f2f2f;\n  --tgui--segmented_control_active_bg: #2f2f2f;\n  --tgui--card_bg_color: #262626;\n  --tgui--secondary_hint_color: #78797e;\n  --tgui--secondary_fill: rgba(41, 144, 255, 0.2);\n  --tgui--green: #32e55e;\n  --tgui--destructive_background: rgba(255, 35, 35, 0.02);\n  --tgui--primary_code_highlight: #2990ff;\n  --tgui--secondary_code_highlight: #e937ed;\n  --tgui--tertiary_code_highlight: #5ae536;\n  --tgui--plain_background: rgba(255, 255, 255, 0.08);\n  --tgui--plain_foreground: rgba(255, 255, 255, 0.95);\n}\n\n@media (min-resolution: 2dppx) {\n  .wrapper {\n    --tgui--border--width: 0.5px;\n  }\n}\n\n@supports (padding-top: env(safe-area-inset-bottom)) {\n  .wrapper {\n    --tgui--safe_area_inset_bottom: env(safe-area-inset-bottom);\n  }\n}\n\n@supports (color: color-mix(in srgb, red 10%, transparent)) {\n  .wrapper {\n    --tgui--secondary_fill: color-mix(in srgb, var(--tgui--accent_text_color) 14%, transparent);\n    --tgui--tertiary_bg_color: color-mix(\n      in srgb,\n      var(--tgui--secondary_bg_color),\n      var(--tgui--bg_color) 40%\n    );\n    --tgui--quartenary_bg_color: color-mix(\n      in srgb,\n      var(--tgui--secondary_bg_color),\n      var(--tgui--bg_color) 20%\n    );\n  }\n\n  .wrapper--dark {\n    --tgui--secondary_fill: color-mix(in srgb, var(--tgui--accent_text_color) 20%, transparent);\n    --tgui--card_bg_color: color-mix(in srgb, var(--tgui--bg_color), #fff 7%);\n    --tgui--tertiary_bg_color: color-mix(in srgb, var(--tgui--bg_color), #fff 10%);\n    --tgui--quartenary_bg_color: color-mix(in srgb, var(--tgui--bg_color), #fff 14%);\n    --tgui--segmented_control_active_bg: color-mix(in srgb, var(--tgui--bg_color), #fff 12%);\n  }\n}\n","import {\n  type HTMLAttributes,\n  type Ref,\n  useCallback,\n  useMemo,\n  useState,\n  useSyncExternalStore,\n} from 'react';\nimport { getAppearance, subscribeAppearance } from '../../shared/lib/appearance';\nimport { cn } from '../../shared/lib/cn';\nimport { getPlatform } from '../../shared/lib/platform';\nimport type { Appearance, TguiPlatform } from '../../shared/types/tgui';\nimport { TguiContext } from './context';\nimport styles from './TguiProvider.module.css';\n\nexport interface TguiProviderProps extends HTMLAttributes<HTMLDivElement> {\n  ref?: Ref<HTMLDivElement>;\n  platform?: TguiPlatform;\n  appearance?: Appearance;\n  portalContainer?: HTMLElement | null;\n}\n\nconst getServerAppearance = (): Appearance => 'light';\n\nexport function TguiProvider({\n  ref,\n  platform: platformProp,\n  appearance: appearanceProp,\n  portalContainer: portalContainerProp,\n  className,\n  children,\n  ...rest\n}: TguiProviderProps) {\n  const platform = useMemo(() => platformProp ?? getPlatform(), [platformProp]);\n\n  const systemAppearance = useSyncExternalStore(\n    subscribeAppearance,\n    getAppearance,\n    getServerAppearance,\n  );\n  const appearance = appearanceProp ?? systemAppearance;\n\n  const [wrapper, setWrapper] = useState<HTMLDivElement | null>(null);\n  const setRef = useCallback(\n    (node: HTMLDivElement | null) => {\n      setWrapper(node);\n\n      if (typeof ref === 'function') {\n        ref(node);\n      } else if (ref) {\n        ref.current = node;\n      }\n    },\n    [ref],\n  );\n\n  const value = useMemo(\n    () => ({\n      platform,\n      appearance,\n      portalContainer: portalContainerProp ?? wrapper,\n    }),\n    [platform, appearance, portalContainerProp, wrapper],\n  );\n\n  return (\n    <div\n      ref={setRef}\n      className={cn(\n        styles.wrapper,\n        platform === 'ios' && styles['wrapper--ios'],\n        appearance === 'dark' && styles['wrapper--dark'],\n        className,\n      )}\n      {...rest}\n    >\n      <TguiContext.Provider value={value}>{children}</TguiContext.Provider>\n    </div>\n  );\n}\n\nTguiProvider.displayName = 'TguiProvider';\n",".button {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  box-sizing: border-box;\n  max-inline-size: 100%;\n  min-inline-size: 80px;\n  border: none;\n  border-radius: var(--tgui--button--border_radius, 8px);\n  text-decoration: none;\n}\n\n.stretched {\n  inline-size: 100%;\n  flex-grow: 1;\n}\n\n.button::after {\n  content: \"\";\n  position: absolute;\n  inset: 0;\n  opacity: 0;\n  background: var(--tgui--bg_color);\n  transition: opacity 0.15s ease-out;\n}\n\n@media (hover: hover) and (pointer: fine) {\n  .button:not([data-disabled]):hover::after {\n    opacity: var(--tgui--button--wash-opacity);\n  }\n}\n\n.before,\n.after {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.content {\n  display: flex;\n  flex: 0 1 auto;\n  min-inline-size: 0;\n  align-items: center;\n  justify-content: center;\n  z-index: var(--tgui--z-index--simple);\n}\n\n.label {\n  min-inline-size: 0;\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n}\n\n.content svg {\n  display: block;\n}\n\n.loading {\n  pointer-events: none;\n}\n\n.loading .before,\n.loading .after,\n.loading .content {\n  opacity: 0;\n}\n\n.spinner {\n  position: absolute;\n  width: 20px;\n  height: 20px;\n  border: 2px solid currentColor;\n  border-radius: 50%;\n  border-top-color: transparent;\n  color: var(--tgui--button--spinner-color);\n  animation: button-spinner 0.6s linear infinite;\n}\n\n@keyframes button-spinner {\n  to {\n    transform: rotate(360deg);\n  }\n}\n\n@media (prefers-reduced-motion: reduce) {\n  .spinner {\n    animation-duration: 1.6s;\n  }\n}\n\n.size-s {\n  height: 36px;\n  min-width: 34px;\n  gap: 6px;\n  padding: 8px 12px;\n  border-radius: 999px;\n}\n\n.size-m {\n  height: 42px;\n  min-width: 42px;\n  gap: 8px;\n  padding: 8px 14px;\n}\n\n.size-l {\n  height: 50px;\n  gap: 10px;\n  padding: 10px 20px;\n}\n\n.ios.size-m {\n  border-radius: 12px;\n}\n\n.ios::after {\n  content: none;\n}\n\n.mode-filled {\n  --tgui--button--wash-opacity: 0.15;\n  --tgui--button--spinner-color: var(--tgui--button_text_color);\n  color: var(--tgui--button_text_color);\n  background: var(--tgui--button_color);\n}\n\n.mode-bezeled {\n  --tgui--button--wash-opacity: 0.07;\n  --tgui--button--spinner-color: var(--tgui--link_color);\n  color: var(--tgui--link_color);\n  background: var(--tgui--secondary_fill);\n}\n\n.mode-plain {\n  --tgui--button--wash-opacity: 0.03;\n  --tgui--button--spinner-color: var(--tgui--plain_foreground);\n  color: var(--tgui--link_color);\n  background: transparent;\n}\n\n.mode-gray {\n  --tgui--button--wash-opacity: 0.5;\n  --tgui--button--spinner-color: var(--tgui--plain_foreground);\n  color: var(--tgui--plain_foreground);\n  background: var(--tgui--plain_background);\n}\n\n.mode-outline {\n  --tgui--button--wash-opacity: 0.5;\n  --tgui--button--spinner-color: var(--tgui--plain_foreground);\n  color: var(--tgui--plain_foreground);\n  background: transparent;\n  box-shadow: 0 0 0 1px var(--tgui--outline);\n}\n\n.mode-white {\n  --tgui--button--wash-opacity: 0.5;\n  --tgui--button--spinner-color: var(--tgui--surface_dark);\n  color: var(--tgui--black);\n  background: var(--tgui--white);\n}\n","import { cva } from 'class-variance-authority';\nimport type { TguiPlatform } from '../../shared/types/tgui';\nimport styles from './Button.module.css';\n\nexport type ButtonMode = 'filled' | 'bezeled' | 'plain' | 'gray' | 'outline' | 'white';\nexport type ButtonSize = 's' | 'm' | 'l';\n\nexport const button = cva(styles.button, {\n  variants: {\n    mode: {\n      filled: styles['mode-filled'],\n      bezeled: styles['mode-bezeled'],\n      plain: styles['mode-plain'],\n      gray: styles['mode-gray'],\n      outline: styles['mode-outline'],\n      white: styles['mode-white'],\n    },\n    size: {\n      s: styles['size-s'],\n      m: styles['size-m'],\n      l: styles['size-l'],\n    },\n    stretched: { true: styles.stretched },\n    platform: { ios: styles.ios, base: null },\n  },\n  defaultVariants: { mode: 'filled', size: 'm' },\n});\n\nexport type ButtonVariantInput = {\n  mode?: ButtonMode;\n  size?: ButtonSize;\n  stretched?: boolean;\n  platform: TguiPlatform;\n};\n","'use client';\n\nimport type { AllHTMLAttributes, ElementType, ReactNode, Ref } from 'react';\nimport { cn } from '../../shared/lib/cn';\nimport { Subheadline } from '../Subheadline';\nimport { Tappable } from '../Tappable';\nimport { Text } from '../Text';\nimport { useTgui } from '../TguiProvider';\nimport styles from './Button.module.css';\nimport { type ButtonMode, type ButtonSize, button } from './Button.variants';\n\nexport interface ButtonProps extends Omit<AllHTMLAttributes<HTMLElement>, 'size'> {\n  ref?: Ref<HTMLElement>;\n  Component?: ElementType;\n  mode?: ButtonMode;\n  size?: ButtonSize;\n  stretched?: boolean;\n  loading?: boolean;\n  before?: ReactNode;\n  after?: ReactNode;\n}\n\nfunction Label({ size, children }: { size: ButtonSize; children: ReactNode }) {\n  const shared = { weight: '2', className: styles.content } as const;\n  const inner = <span className={styles.label}>{children}</span>;\n  return size === 'l' ? (\n    <Text {...shared}>{inner}</Text>\n  ) : (\n    <Subheadline level=\"2\" {...shared}>\n      {inner}\n    </Subheadline>\n  );\n}\n\nexport function Button({\n  ref,\n  Component = 'button',\n  mode = 'filled',\n  size = 'm',\n  stretched = false,\n  loading = false,\n  type,\n  before,\n  after,\n  children,\n  className,\n  ...rest\n}: ButtonProps) {\n  const { platform } = useTgui();\n\n  return (\n    <Tappable\n      ref={ref}\n      Component={Component}\n      type={Component === 'button' ? (type ?? 'button') : type}\n      aria-busy={loading || undefined}\n      className={cn(\n        button({ mode, size, stretched, platform }),\n        loading && styles.loading,\n        className,\n      )}\n      {...rest}\n    >\n      {loading ? <span className={styles.spinner} aria-hidden /> : null}\n      {before ? <span className={styles.before}>{before}</span> : null}\n      <Label size={size}>{children}</Label>\n      {after ? <span className={styles.after}>{after}</span> : null}\n    </Tappable>\n  );\n}\n\nButton.displayName = 'Button';\n",".level-1 {\n  font-size: var(--tgui--caption1--font_size);\n  line-height: var(--tgui--caption1--line_height);\n}\n\n.level-2 {\n  font-size: var(--tgui--caption2--font_size);\n  line-height: var(--tgui--caption2--line_height);\n}\n","import { cva } from 'class-variance-authority';\nimport styles from './Caption.module.css';\n\nexport type CaptionLevel = '1' | '2';\n\nexport const caption = cva('', {\n  variants: {\n    level: {\n      '1': styles['level-1'],\n      '2': styles['level-2'],\n    },\n  },\n  defaultVariants: { level: '1' },\n});\n","import type { Ref } from 'react';\nimport { cn } from '../../shared/lib/cn';\nimport { Typography, type TypographyProps } from '../Typography';\nimport { type CaptionLevel, caption } from './Caption.variants';\n\nexport interface CaptionProps extends TypographyProps {\n  ref?: Ref<HTMLElement>;\n  level?: CaptionLevel;\n}\n\nexport function Caption({ ref, level, Component = 'span', className, ...rest }: CaptionProps) {\n  return (\n    <Typography\n      ref={ref}\n      Component={Component}\n      className={cn(caption({ level }), className)}\n      {...rest}\n    />\n  );\n}\n\nCaption.displayName = 'Caption';\n","import { createContext } from 'react';\n\nexport type CardType = 'plain' | 'ambient';\n\nexport const CardContext = createContext<{ type: CardType }>({ type: 'plain' });\n",".card {\n  position: relative;\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n  border-radius: 20px;\n  background: var(--tgui--card_bg_color);\n  box-shadow:\n    0 32px 64px 0 rgba(0, 0, 0, 0.04),\n    0 0 2px 1px rgba(0, 0, 0, 0.02);\n}\n\n.card > * {\n  flex-shrink: 0;\n}\n\n.cardAmbient {\n  background: var(--tgui--black);\n}\n\n.cell {\n  padding: 0 20px;\n  background: var(--tgui--card_bg_color);\n}\n\n.cellAmbient {\n  --tgui--cell--middle--padding: 12px 0;\n\n  position: absolute;\n  inset: auto 0 0 0;\n  padding-top: 64px;\n  padding-bottom: 4px;\n  background: linear-gradient(\n    180deg,\n    rgba(0, 0, 0, 0) 0%,\n    rgba(0, 0, 0, 0.12) 22%,\n    rgba(0, 0, 0, 0.55) 62%,\n    rgba(0, 0, 0, 0.85) 100%\n  );\n  color: var(--tgui--white);\n}\n\n.cellHeader {\n  font-weight: var(--tgui--font_weight--accent2);\n}\n\n.cellSubtitle {\n  display: -webkit-box;\n  -webkit-line-clamp: 2;\n  -webkit-box-orient: vertical;\n}\n\n.cellAmbient .cellHeader {\n  color: var(--tgui--white);\n}\n\n.cellAmbient .cellSubtitle {\n  color: rgba(255, 255, 255, 0.8);\n}\n",".cell {\n  --tgui--cell--middle--padding: 16px 0;\n\n  display: flex;\n  align-items: center;\n  gap: 24px;\n  padding: 0 24px;\n}\n\n.before,\n.after {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.middle {\n  flex-grow: 1;\n  min-inline-size: 0;\n  max-inline-size: 100%;\n  padding: var(--tgui--cell--middle--padding);\n\n  display: flex;\n  flex-direction: column;\n  gap: 2px;\n}\n\n.middle > *,\n.title {\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n}\n\n.multiline .middle > *,\n.multiline .title {\n  white-space: normal;\n}\n\n.head {\n  display: inline-flex;\n  align-items: center;\n  gap: 4px;\n}\n\n.subhead {\n  color: var(--tgui--subtitle_text_color);\n}\n\n.hint,\n.subtitle,\n.description {\n  color: var(--tgui--hint_color);\n}\n\n.hovered {\n  background: var(--tgui--tertiary_bg_color);\n}\n\n.ios {\n  --tgui--cell--middle--padding: 12px 0;\n  gap: 16px;\n  padding: 0 16px;\n}\n\n@media (hover: hover) and (pointer: fine) {\n  .interactive:not([data-disabled]):hover {\n    background: var(--tgui--tertiary_bg_color);\n  }\n}\n","import { cva } from 'class-variance-authority';\nimport styles from './Cell.module.css';\n\nexport const cell = cva(styles.cell, {\n  variants: {\n    platform: { ios: styles.ios, base: null },\n    hovered: { true: styles.hovered },\n    interactive: { true: styles.interactive },\n    multiline: { true: styles.multiline },\n  },\n});\n","'use client';\n\nimport type { ElementType, ReactNode, Ref } from 'react';\nimport { cn } from '../../shared/lib/cn';\nimport { Caption } from '../Caption';\nimport { Subheadline } from '../Subheadline';\nimport { Tappable, type TappableProps } from '../Tappable';\nimport { Text } from '../Text';\nimport { useTgui } from '../TguiProvider';\nimport styles from './Cell.module.css';\nimport { cell } from './Cell.variants';\n\nexport interface CellProps extends Omit<TappableProps, 'Component'> {\n  ref?: Ref<HTMLElement>;\n  Component?: ElementType;\n  subhead?: ReactNode;\n  hint?: ReactNode;\n  titleBadge?: ReactNode;\n  subtitle?: ReactNode;\n  description?: ReactNode;\n  before?: ReactNode;\n  after?: ReactNode;\n  hovered?: boolean;\n  multiline?: boolean;\n}\n\nfunction CellTitle({ ios, children }: { ios: boolean; children: ReactNode }) {\n  return ios ? (\n    <Text className={styles.head}>{children}</Text>\n  ) : (\n    <Subheadline level=\"1\" className={styles.head}>\n      {children}\n    </Subheadline>\n  );\n}\n\nfunction CellDescription({ ios, children }: { ios: boolean; children: ReactNode }) {\n  return ios ? (\n    <Caption className={styles.description}>{children}</Caption>\n  ) : (\n    <Subheadline level=\"2\" className={styles.description}>\n      {children}\n    </Subheadline>\n  );\n}\n\nexport function Cell({\n  ref,\n  Component = 'div',\n  subhead,\n  children,\n  hint,\n  titleBadge,\n  subtitle,\n  description,\n  before,\n  after,\n  hovered,\n  multiline,\n  className,\n  ...rest\n}: CellProps) {\n  const { platform } = useTgui();\n  const ios = platform === 'ios';\n  const hasTitle = children != null || hint != null || titleBadge != null;\n  const interactive =\n    rest.onClick != null ||\n    rest.href != null ||\n    Component === 'a' ||\n    Component === 'button' ||\n    Component === 'label';\n\n  return (\n    <Tappable\n      ref={ref}\n      Component={Component}\n      className={cn(cell({ platform, hovered, multiline, interactive }), className)}\n      {...rest}\n    >\n      {before != null ? <div className={styles.before}>{before}</div> : null}\n\n      <div className={styles.middle}>\n        {subhead != null ? (\n          <Subheadline level=\"2\" className={styles.subhead}>\n            {subhead}\n          </Subheadline>\n        ) : null}\n\n        {hasTitle ? (\n          <CellTitle ios={ios}>\n            {children != null ? <span className={styles.title}>{children}</span> : null}\n            {hint != null ? <span className={styles.hint}>{hint}</span> : null}\n            {titleBadge}\n          </CellTitle>\n        ) : null}\n\n        {subtitle != null ? (\n          <Subheadline level=\"2\" className={styles.subtitle}>\n            {subtitle}\n          </Subheadline>\n        ) : null}\n\n        {description != null ? <CellDescription ios={ios}>{description}</CellDescription> : null}\n      </div>\n\n      {after != null ? <div className={styles.after}>{after}</div> : null}\n    </Tappable>\n  );\n}\n\nCell.displayName = 'Cell';\n","'use client';\n\nimport { type Ref, useContext } from 'react';\nimport { cn } from '../../shared/lib/cn';\nimport { Cell, type CellProps } from '../Cell';\nimport { CardContext } from './Card.context';\nimport styles from './Card.module.css';\n\nexport interface CardCellProps extends CellProps {\n  ref?: Ref<HTMLElement>;\n}\n\nexport function CardCell({ ref, children, subtitle, className, ...rest }: CardCellProps) {\n  const { type } = useContext(CardContext);\n  const ambient = type === 'ambient';\n\n  return (\n    <Cell\n      ref={ref}\n      className={cn(styles.cell, ambient && styles.cellAmbient, className)}\n      subtitle={\n        subtitle != null ? <span className={styles.cellSubtitle}>{subtitle}</span> : undefined\n      }\n      {...rest}\n    >\n      {children != null ? <span className={styles.cellHeader}>{children}</span> : null}\n    </Cell>\n  );\n}\n\nCardCell.displayName = 'CardCell';\n","'use client';\n\nimport { type HTMLAttributes, type Ref, useMemo } from 'react';\nimport { cn } from '../../shared/lib/cn';\nimport { CardContext, type CardType } from './Card.context';\nimport styles from './Card.module.css';\nimport { CardCell } from './CardCell';\n\nexport interface CardProps extends HTMLAttributes<HTMLElement> {\n  ref?: Ref<HTMLElement>;\n  type?: CardType;\n}\n\nexport function Card({ ref, type = 'plain', className, children, ...rest }: CardProps) {\n  const context = useMemo(() => ({ type }), [type]);\n\n  return (\n    <CardContext.Provider value={context}>\n      <article\n        ref={ref}\n        className={cn(styles.card, type === 'ambient' && styles.cardAmbient, className)}\n        {...rest}\n      >\n        {children}\n      </article>\n    </CardContext.Provider>\n  );\n}\n\nCard.displayName = 'Card';\nCard.Cell = CardCell;\n",".checkbox {\n  position: relative;\n  display: inline-flex;\n  cursor: pointer;\n}\n\n.checkbox[data-disabled] {\n  cursor: default;\n  opacity: 0.3;\n}\n\n.input {\n  position: absolute;\n  inset: 0;\n  width: 100%;\n  height: 100%;\n  margin: 0;\n  opacity: 0;\n  cursor: inherit;\n}\n\n.box {\n  position: relative;\n  width: 20px;\n  height: 20px;\n  border-radius: 6px;\n  box-shadow: inset 0 0 0 2px var(--tgui--outline);\n  pointer-events: none;\n}\n\n@media (prefers-reduced-motion: no-preference) {\n  .box {\n    transition:\n      box-shadow 0.15s ease-out,\n      background 0.15s ease-out;\n  }\n}\n\n.input:checked + .box,\n.input:indeterminate + .box {\n  background: var(--tgui--link_color);\n  box-shadow: none;\n}\n\n.input:focus-visible + .box {\n  box-shadow: 0 0 0 2px var(--tgui--link_color);\n}\n\n.input:checked + .box::after {\n  content: \"\";\n  position: absolute;\n  left: 7px;\n  top: 3px;\n  width: 5px;\n  height: 9px;\n  border: solid var(--tgui--button_text_color);\n  border-width: 0 2px 2px 0;\n  transform: rotate(45deg);\n}\n\n.input:indeterminate + .box::after {\n  content: \"\";\n  position: absolute;\n  left: 4px;\n  top: 9px;\n  width: 12px;\n  height: 2px;\n  background: var(--tgui--button_text_color);\n}\n","import { type InputHTMLAttributes, type Ref, useEffect, useRef } from 'react';\nimport { cn } from '../../shared/lib/cn';\nimport styles from './Checkbox.module.css';\n\nexport interface CheckboxProps extends InputHTMLAttributes<HTMLInputElement> {\n  ref?: Ref<HTMLInputElement>;\n  indeterminate?: boolean;\n}\n\nexport function Checkbox({\n  ref,\n  indeterminate = false,\n  disabled,\n  className,\n  style,\n  ...rest\n}: CheckboxProps) {\n  const inner = useRef<HTMLInputElement>(null);\n\n  useEffect(() => {\n    if (inner.current) inner.current.indeterminate = indeterminate;\n  }, [indeterminate]);\n\n  const mergeRef = (node: HTMLInputElement | null) => {\n    inner.current = node;\n    if (typeof ref === 'function') ref(node);\n    else if (ref) ref.current = node;\n  };\n\n  return (\n    <span\n      className={cn(styles.checkbox, className)}\n      style={style}\n      data-disabled={disabled || undefined}\n    >\n      <input\n        ref={mergeRef}\n        type=\"checkbox\"\n        className={styles.input}\n        disabled={disabled}\n        {...rest}\n      />\n      <span className={styles.box} aria-hidden />\n    </span>\n  );\n}\n\nCheckbox.displayName = 'Checkbox';\n",".divider {\n  margin: 0;\n  border: none;\n  border-block-start: var(--tgui--border--width) solid var(--tgui--outline);\n}\n","import type { HTMLAttributes, Ref } from 'react';\nimport { cn } from '../../shared/lib/cn';\nimport styles from './Divider.module.css';\n\nexport interface DividerProps extends HTMLAttributes<HTMLHRElement> {\n  ref?: Ref<HTMLHRElement>;\n}\n\nexport function Divider({ ref, className, ...rest }: DividerProps) {\n  return <hr ref={ref} className={cn(styles.divider, className)} {...rest} />;\n}\n\nDivider.displayName = 'Divider';\n",".headline {\n  font-size: var(--tgui--headline--font_size);\n  line-height: var(--tgui--headline--line_height);\n}\n","import type { Ref } from 'react';\nimport { cn } from '../../shared/lib/cn';\nimport { Typography, type TypographyProps } from '../Typography';\nimport styles from './Headline.module.css';\n\nexport interface HeadlineProps extends TypographyProps {\n  ref?: Ref<HTMLElement>;\n}\n\nexport function Headline({\n  ref,\n  weight = '2',\n  className,\n  Component = 'h5',\n  ...rest\n}: HeadlineProps) {\n  return (\n    <Typography\n      ref={ref}\n      weight={weight}\n      Component={Component}\n      className={cn(styles.headline, className)}\n      {...rest}\n    />\n  );\n}\n\nHeadline.displayName = 'Headline';\n",".base {\n  position: relative;\n  padding: 20px 22px 16px;\n  background: var(--tgui--bg_color);\n}\n\n.body {\n  display: flex;\n  align-items: center;\n  box-sizing: border-box;\n  padding: 12px 16px;\n}\n\n.body > :not(:first-child) {\n  margin-left: 12px;\n}\n\n.base .body {\n  border-radius: 14px;\n  box-shadow: 0 0 0 2px var(--tgui--outline);\n}\n\n.ios .body {\n  min-height: 48px;\n  border-radius: 12px;\n  background: var(--tgui--tertiary_bg_color);\n}\n\n.before,\n.after {\n  display: flex;\n  align-items: center;\n}\n\n.field {\n  display: block;\n  width: 100%;\n  margin: 0;\n  padding: 0;\n  border: 0;\n  outline: 0;\n  background: transparent;\n  color: var(--tgui--text_color);\n  text-overflow: ellipsis;\n}\n\n.field::placeholder {\n  color: var(--tgui--secondary_hint_color);\n}\n\n.field::-webkit-outer-spin-button,\n.field::-webkit-inner-spin-button {\n  appearance: none;\n}\n\n.header {\n  position: absolute;\n  top: 6px;\n  left: 32px;\n  max-width: calc(100% - 76px);\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n  padding: 0 6px;\n  border-radius: 5px;\n  color: var(--tgui--secondary_hint_color);\n  background: var(--tgui--bg_color);\n}\n\n.focused.base .body {\n  box-shadow: 0 0 0 2px var(--tgui--link_color);\n}\n\n.focused.base .header {\n  color: var(--tgui--link_color);\n}\n\n.error.base .body {\n  box-shadow: 0 0 0 2px var(--tgui--destructive_text_color);\n}\n\n.error.base .header {\n  color: var(--tgui--destructive_text_color);\n}\n\n.error.ios .body {\n  box-shadow: 0 0 0 1.5px var(--tgui--destructive_text_color);\n}\n\n.disabled {\n  pointer-events: none;\n}\n\n.disabled.ios {\n  opacity: 0.35;\n}\n","'use client';\n\nimport {\n  type FocusEvent,\n  type InputHTMLAttributes,\n  type ReactNode,\n  type Ref,\n  useState,\n} from 'react';\nimport { cn } from '../../shared/lib/cn';\nimport { Subheadline } from '../Subheadline';\nimport { Text } from '../Text';\nimport { useTgui } from '../TguiProvider';\nimport styles from './Input.module.css';\n\nexport type InputStatus = 'default' | 'error' | 'focused';\n\nexport interface InputProps extends InputHTMLAttributes<HTMLInputElement> {\n  ref?: Ref<HTMLInputElement>;\n  header?: ReactNode;\n  before?: ReactNode;\n  after?: ReactNode;\n  status?: InputStatus;\n}\n\nexport function Input({\n  ref,\n  type = 'text',\n  header,\n  before,\n  after,\n  status,\n  disabled,\n  className,\n  onFocus,\n  onBlur,\n  ...rest\n}: InputProps) {\n  const { platform } = useTgui();\n  const ios = platform === 'ios';\n  const [focused, setFocused] = useState(false);\n  const state = status ?? (focused ? 'focused' : 'default');\n  const Typography = ios ? Text : Subheadline;\n\n  const handleFocus = (event: FocusEvent<HTMLInputElement>) => {\n    if (!disabled) setFocused(true);\n    onFocus?.(event);\n  };\n  const handleBlur = (event: FocusEvent<HTMLInputElement>) => {\n    setFocused(false);\n    onBlur?.(event);\n  };\n\n  return (\n    <div\n      className={cn(\n        ios ? styles.ios : styles.base,\n        state === 'error' && styles.error,\n        state === 'focused' && styles.focused,\n        disabled && styles.disabled,\n        className,\n      )}\n      aria-disabled={disabled || undefined}\n    >\n      {/* biome-ignore lint/a11y/noLabelWithoutControl: the control is <input> below, rendered via Typography */}\n      <label className={styles.body}>\n        {before != null ? <span className={styles.before}>{before}</span> : null}\n        <Typography\n          ref={ref as Ref<HTMLElement>}\n          Component=\"input\"\n          className={styles.field}\n          type={type}\n          disabled={disabled}\n          onFocus={handleFocus}\n          onBlur={handleBlur}\n          {...rest}\n        />\n        {after != null ? <span className={styles.after}>{after}</span> : null}\n      </label>\n      {header != null && !ios ? <span className={styles.header}>{header}</span> : null}\n    </div>\n  );\n}\n\nInput.displayName = 'Input';\n",".large-title {\n  font-size: var(--tgui--large_title--font_size);\n  line-height: var(--tgui--large_title--line_height);\n\n  letter-spacing: -0.02em;\n}\n","import type { Ref } from 'react';\nimport { cn } from '../../shared/lib/cn';\nimport { Typography, type TypographyProps } from '../Typography';\nimport styles from './LargeTitle.module.css';\n\nexport interface LargeTitleProps extends TypographyProps {\n  ref?: Ref<HTMLElement>;\n}\n\nexport function LargeTitle({\n  ref,\n  weight = '1',\n  className,\n  Component = 'h1',\n  ...rest\n}: LargeTitleProps) {\n  return (\n    <Typography\n      ref={ref}\n      weight={weight}\n      Component={Component}\n      className={cn(styles['large-title'], className)}\n      {...rest}\n    />\n  );\n}\n\nLargeTitle.displayName = 'LargeTitle';\n",".list {\n  box-sizing: border-box;\n}\n\n.ios {\n  padding: 10px 18px;\n}\n\n.list > :not(:last-child) {\n  margin-bottom: 12px;\n}\n","'use client';\n\nimport type { ElementType, HTMLAttributes, Ref } from 'react';\nimport { cn } from '../../shared/lib/cn';\nimport { useTgui } from '../TguiProvider';\nimport styles from './List.module.css';\n\nexport interface ListProps extends HTMLAttributes<HTMLElement> {\n  ref?: Ref<HTMLElement>;\n  Component?: ElementType;\n}\n\nexport function List({ ref, Component = 'div', className, children, ...rest }: ListProps) {\n  const { platform } = useTgui();\n\n  return (\n    <Component\n      ref={ref}\n      className={cn(styles.list, platform === 'ios' && styles.ios, className)}\n      {...rest}\n    >\n      {children}\n    </Component>\n  );\n}\n\nList.displayName = 'List';\n",".level-1 {\n  font-size: var(--tgui--title1--font_size);\n  line-height: var(--tgui--title1--line_height);\n}\n\n.level-2 {\n  font-size: var(--tgui--title2--font_size);\n  line-height: var(--tgui--title2--line_height);\n}\n\n.level-3 {\n  font-size: var(--tgui--title3--font_size);\n  line-height: var(--tgui--title3--line_height);\n}\n","import type { ElementType } from 'react';\nimport styles from './Title.module.css';\n\nexport type TitleLevel = '1' | '2' | '3';\n\nexport const TITLE_LEVELS: Record<TitleLevel, { tag: ElementType; className: string }> = {\n  '1': { tag: 'h2', className: styles['level-1'] },\n  '2': { tag: 'h3', className: styles['level-2'] },\n  '3': { tag: 'h4', className: styles['level-3'] },\n};\n","import type { Ref } from 'react';\nimport { cn } from '../../shared/lib/cn';\nimport { Typography, type TypographyProps } from '../Typography';\nimport { TITLE_LEVELS, type TitleLevel } from './Title.variants';\n\nexport interface TitleProps extends TypographyProps {\n  ref?: Ref<HTMLElement>;\n  level?: TitleLevel;\n}\n\nexport function Title({ ref, level = '2', Component, className, ...rest }: TitleProps) {\n  const { tag, className: levelClass } = TITLE_LEVELS[level];\n\n  return (\n    <Typography\n      ref={ref}\n      Component={Component ?? tag}\n      className={cn(levelClass, className)}\n      {...rest}\n    />\n  );\n}\n\nTitle.displayName = 'Title';\n",".placeholder {\n  overflow: hidden;\n\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n\n  gap: 24px;\n  padding: 32px;\n}\n\n.fields {\n  margin: 0;\n  text-align: center;\n  overflow-wrap: anywhere;\n}\n\n.description {\n  color: var(--tgui--hint_color);\n}\n\n.description:not(:first-child) {\n  margin-top: 8px;\n}\n","import type { HTMLAttributes, ReactNode, Ref } from 'react';\nimport { cn } from '../../shared/lib/cn';\nimport { Text } from '../Text';\nimport { Title } from '../Title';\nimport styles from './Placeholder.module.css';\n\nexport interface PlaceholderProps extends HTMLAttributes<HTMLElement> {\n  ref?: Ref<HTMLElement>;\n  children?: ReactNode;\n  header?: ReactNode;\n  description?: ReactNode;\n  action?: ReactNode;\n}\n\nexport function Placeholder({\n  ref,\n  children,\n  header,\n  description,\n  action,\n  className,\n  ...rest\n}: PlaceholderProps) {\n  return (\n    <section ref={ref} className={cn(styles.placeholder, className)} {...rest}>\n      {children}\n      {header != null || description != null ? (\n        <dl className={styles.fields}>\n          {header != null ? (\n            <Title Component=\"dt\" level=\"3\" weight=\"2\">\n              {header}\n            </Title>\n          ) : null}\n          {description != null ? (\n            <Text Component=\"dd\" className={styles.description}>\n              {description}\n            </Text>\n          ) : null}\n        </dl>\n      ) : null}\n      {action}\n    </section>\n  );\n}\n\nPlaceholder.displayName = 'Placeholder';\n",".body {\n  display: flex;\n  flex-direction: column;\n}\n\n.sectionBase .bodyWithHeader {\n  background: var(--tgui--section_bg_color);\n  box-shadow: var(--tgui--base--section--box_shadow);\n}\n\n.sectionIos .body {\n  border-radius: 12px;\n  background: var(--tgui--section_bg_color);\n}\n\n.sectionIos .body > :first-child {\n  border-radius: 12px 12px 0 0;\n}\n\n.sectionIos .body > :last-child {\n  border-radius: 0 0 12px 12px;\n}\n\n.sectionIos .body > :only-child {\n  border-radius: 12px;\n}\n\n.header {\n  padding: 20px 24px 4px 22px;\n  color: var(--tgui--link_color);\n}\n\n.headerLarge {\n  padding-left: 24px;\n  color: var(--tgui--text_color);\n}\n\n.headerIos {\n  padding: 16px 16px 8px;\n  color: var(--tgui--section_header_text_color);\n}\n\n.headerIos.headerLarge {\n  padding: 0 0 12px;\n  color: var(--tgui--text_color);\n}\n\n.footer {\n  padding: 12px 24px;\n}\n\n.footerIos {\n  padding: 8px 16px 0;\n}\n\n.footerCentered {\n  padding: 16px 24px 20px;\n  text-align: center;\n}\n\n.footerIos.footerCentered {\n  padding: 16px 16px 0;\n}\n\n.footerText {\n  color: var(--tgui--hint_color);\n}\n","'use client';\n\nimport type { HTMLAttributes, ReactNode, Ref } from 'react';\nimport { cn } from '../../shared/lib/cn';\nimport { Caption } from '../Caption';\nimport { Subheadline } from '../Subheadline';\nimport { useTgui } from '../TguiProvider';\nimport styles from './Section.module.css';\n\nexport interface SectionFooterProps extends HTMLAttributes<HTMLElement> {\n  ref?: Ref<HTMLElement>;\n  centered?: boolean;\n}\n\nfunction FooterText({ ios, children }: { ios: boolean; children: ReactNode }) {\n  return ios ? (\n    <Caption className={styles.footerText}>{children}</Caption>\n  ) : (\n    <Subheadline level=\"2\" className={styles.footerText}>\n      {children}\n    </Subheadline>\n  );\n}\n\nexport function SectionFooter({\n  ref,\n  centered = false,\n  className,\n  children,\n  ...rest\n}: SectionFooterProps) {\n  const { platform } = useTgui();\n  const ios = platform === 'ios';\n\n  return (\n    <footer\n      ref={ref}\n      className={cn(\n        styles.footer,\n        ios && styles.footerIos,\n        centered && styles.footerCentered,\n        className,\n      )}\n      {...rest}\n    >\n      <FooterText ios={ios}>{children}</FooterText>\n    </footer>\n  );\n}\n\nSectionFooter.displayName = 'SectionFooter';\n","'use client';\n\nimport type { HTMLAttributes, ReactNode, Ref } from 'react';\nimport { cn } from '../../shared/lib/cn';\nimport { Caption } from '../Caption';\nimport { Subheadline } from '../Subheadline';\nimport { Text } from '../Text';\nimport { useTgui } from '../TguiProvider';\nimport styles from './Section.module.css';\n\nexport interface SectionHeaderProps extends HTMLAttributes<HTMLElement> {\n  ref?: Ref<HTMLElement>;\n  large?: boolean;\n}\n\nfunction HeaderText({\n  ios,\n  large,\n  children,\n}: {\n  ios: boolean;\n  large: boolean;\n  children: ReactNode;\n}) {\n  if (large) {\n    return ios ? (\n      <Subheadline Component=\"h2\" level=\"1\" weight=\"2\">\n        {children}\n      </Subheadline>\n    ) : (\n      <Text Component=\"h2\" weight=\"2\">\n        {children}\n      </Text>\n    );\n  }\n  return ios ? (\n    <Caption Component=\"h2\" caps>\n      {children}\n    </Caption>\n  ) : (\n    <Subheadline Component=\"h2\" level=\"2\" weight=\"2\">\n      {children}\n    </Subheadline>\n  );\n}\n\nexport function SectionHeader({\n  ref,\n  large = false,\n  className,\n  children,\n  ...rest\n}: SectionHeaderProps) {\n  const { platform } = useTgui();\n  const ios = platform === 'ios';\n\n  return (\n    <header\n      ref={ref}\n      className={cn(styles.header, ios && styles.headerIos, large && styles.headerLarge, className)}\n      {...rest}\n    >\n      <HeaderText ios={ios} large={large}>\n        {children}\n      </HeaderText>\n    </header>\n  );\n}\n\nSectionHeader.displayName = 'SectionHeader';\n","'use client';\n\nimport {\n  Children,\n  Fragment,\n  type HTMLAttributes,\n  isValidElement,\n  type ReactNode,\n  type Ref,\n} from 'react';\nimport { cn } from '../../shared/lib/cn';\nimport { Divider } from '../Divider';\nimport { useTgui } from '../TguiProvider';\nimport styles from './Section.module.css';\nimport { SectionFooter } from './SectionFooter';\nimport { SectionHeader } from './SectionHeader';\n\nexport interface SectionProps extends HTMLAttributes<HTMLElement> {\n  ref?: Ref<HTMLElement>;\n  header?: ReactNode;\n  footer?: ReactNode;\n}\n\nconst isText = (node: ReactNode) => typeof node === 'string' || typeof node === 'number';\n\nexport function Section({ ref, header, footer, className, children, ...rest }: SectionProps) {\n  const { platform } = useTgui();\n  const rows = Children.toArray(children);\n\n  return (\n    <section\n      ref={ref}\n      className={cn(platform === 'ios' ? styles.sectionIos : styles.sectionBase, className)}\n      {...rest}\n    >\n      <div className={styles.bodyWithHeader}>\n        {isText(header) ? <SectionHeader>{header}</SectionHeader> : header}\n        <div className={styles.body}>\n          {rows.map((row, i) => (\n            <Fragment key={isValidElement(row) ? row.key : i}>\n              {row}\n              {i < rows.length - 1 ? <Divider /> : null}\n            </Fragment>\n          ))}\n        </div>\n      </div>\n      {isText(footer) ? <SectionFooter>{footer}</SectionFooter> : footer}\n    </section>\n  );\n}\n\nSection.displayName = 'Section';\nSection.Header = SectionHeader;\nSection.Footer = SectionFooter;\n",".base {\n  position: relative;\n  padding: 20px 22px 16px;\n  background: var(--tgui--bg_color);\n}\n\n.row {\n  position: relative;\n  box-sizing: border-box;\n  border-radius: 14px;\n}\n\n.base .row {\n  box-shadow: inset 0 0 0 2px var(--tgui--outline);\n}\n\n.ios .row {\n  border-radius: 12px;\n  background: var(--tgui--tertiary_bg_color);\n}\n\n.select {\n  appearance: none;\n  display: block;\n  width: 100%;\n  min-height: 48px;\n  margin: 0;\n  padding: 12px 44px 12px 16px;\n  border: 0;\n  outline: 0;\n  border-radius: inherit;\n  background: transparent;\n  color: var(--tgui--text_color);\n}\n\n.chevron {\n  position: absolute;\n  top: 50%;\n  right: 18px;\n  width: 8px;\n  height: 8px;\n  border: solid var(--tgui--secondary_hint_color);\n  border-width: 0 2px 2px 0;\n  transform: translateY(-75%) rotate(45deg);\n  pointer-events: none;\n}\n\n.header {\n  position: absolute;\n  top: 6px;\n  left: 32px;\n  max-width: calc(100% - 76px);\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n  padding: 0 6px;\n  border-radius: 5px;\n  color: var(--tgui--secondary_hint_color);\n  background: var(--tgui--bg_color);\n}\n\n.focused.base .row {\n  box-shadow: inset 0 0 0 2px var(--tgui--link_color);\n}\n\n.focused.base .header {\n  color: var(--tgui--link_color);\n}\n\n.error.base .row {\n  box-shadow: inset 0 0 0 2px var(--tgui--destructive_text_color);\n}\n\n.error.base .header {\n  color: var(--tgui--destructive_text_color);\n}\n\n.error.ios .row {\n  box-shadow: inset 0 0 0 1.5px var(--tgui--destructive_text_color);\n}\n\n.disabled {\n  pointer-events: none;\n}\n\n.disabled.ios {\n  opacity: 0.35;\n}\n","'use client';\n\nimport {\n  type FocusEvent,\n  type ReactNode,\n  type Ref,\n  type SelectHTMLAttributes,\n  useState,\n} from 'react';\nimport { cn } from '../../shared/lib/cn';\nimport type { InputStatus } from '../Input';\nimport { Subheadline } from '../Subheadline';\nimport { Text } from '../Text';\nimport { useTgui } from '../TguiProvider';\nimport styles from './Select.module.css';\n\nexport interface SelectProps extends SelectHTMLAttributes<HTMLSelectElement> {\n  ref?: Ref<HTMLSelectElement>;\n  header?: ReactNode;\n  status?: InputStatus;\n}\n\nexport function Select({\n  ref,\n  header,\n  status,\n  disabled,\n  className,\n  onFocus,\n  onBlur,\n  children,\n  ...rest\n}: SelectProps) {\n  const { platform } = useTgui();\n  const ios = platform === 'ios';\n  const [focused, setFocused] = useState(false);\n  const state = status ?? (focused ? 'focused' : 'default');\n  const Typography = ios ? Text : Subheadline;\n\n  const handleFocus = (event: FocusEvent<HTMLSelectElement>) => {\n    if (!disabled) setFocused(true);\n    onFocus?.(event);\n  };\n  const handleBlur = (event: FocusEvent<HTMLSelectElement>) => {\n    setFocused(false);\n    onBlur?.(event);\n  };\n\n  return (\n    <div\n      className={cn(\n        ios ? styles.ios : styles.base,\n        state === 'error' && styles.error,\n        state === 'focused' && styles.focused,\n        disabled && styles.disabled,\n        className,\n      )}\n      aria-disabled={disabled || undefined}\n    >\n      <div className={styles.row}>\n        <Typography\n          ref={ref as Ref<HTMLElement>}\n          Component=\"select\"\n          className={styles.select}\n          disabled={disabled}\n          onFocus={handleFocus}\n          onBlur={handleBlur}\n          {...rest}\n        >\n          {children}\n        </Typography>\n        <span aria-hidden className={styles.chevron} />\n      </div>\n      {header != null && !ios ? <span className={styles.header}>{header}</span> : null}\n    </div>\n  );\n}\n\nSelect.displayName = 'Select';\n",".switch {\n  position: relative;\n  overflow: hidden;\n  display: inline-flex;\n  align-items: center;\n  width: 52px;\n  height: 32px;\n  border-radius: 16px;\n  cursor: pointer;\n  flex-shrink: 0;\n}\n\n.switch[data-disabled] {\n  cursor: default;\n  opacity: 0.4;\n}\n\n.input {\n  position: absolute;\n  inset: 0;\n  width: 100%;\n  height: 100%;\n  margin: 0;\n  opacity: 0;\n  cursor: inherit;\n}\n\n.control::before {\n  position: absolute;\n  content: \"\";\n  inset: 0;\n  background: var(--tgui--secondary_bg_color);\n}\n\n.base .control::before {\n  border-radius: 16px;\n  border: 3px solid var(--tgui--secondary_hint_color);\n}\n\n.control::after {\n  position: absolute;\n  content: \"\";\n  top: 50%;\n  transform: translateY(-50%);\n  border-radius: 50%;\n}\n\n.base .control::after {\n  width: 16px;\n  height: 16px;\n  margin-left: 8px;\n  background: var(--tgui--secondary_hint_color);\n}\n\n.ios .control::before {\n  background: rgba(120, 120, 128, 0.22);\n}\n\n.ios .control::after {\n  width: 28px;\n  height: 28px;\n  margin-left: 2px;\n  background: var(--tgui--white);\n  box-shadow:\n    0 3px 8px 0 rgba(0, 0, 0, 0.12),\n    0 1px 1px 0 rgba(0, 0, 0, 0.16);\n}\n\n.input:checked + .control::before {\n  border-color: var(--tgui--link_color);\n  background-color: var(--tgui--link_color);\n}\n\n.input:checked + .control::after {\n  transform: translateX(20px) translateY(-50%);\n}\n\n.base .input:checked + .control::after {\n  width: 24px;\n  height: 24px;\n  background: var(--tgui--white);\n  transform: translateX(16px) translateY(-50%);\n}\n\n.input:focus-visible + .control::before {\n  box-shadow: 0 0 0 2px var(--tgui--link_color);\n}\n\n@media (prefers-reduced-motion: no-preference) {\n  .control::before {\n    transition:\n      background-color 0.2s ease,\n      border-color 0.2s ease;\n  }\n  .control::after {\n    transition: transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);\n  }\n  .ios .control::after {\n    transition: transform 0.2s cubic-bezier(0.36, -0.24, 0.26, 1.32);\n  }\n}\n","'use client';\n\nimport type { InputHTMLAttributes, Ref } from 'react';\nimport { cn } from '../../shared/lib/cn';\nimport { useTgui } from '../TguiProvider';\nimport styles from './Switch.module.css';\n\nexport interface SwitchProps extends InputHTMLAttributes<HTMLInputElement> {\n  ref?: Ref<HTMLInputElement>;\n}\n\nexport function Switch({ ref, disabled, className, style, ...rest }: SwitchProps) {\n  const { platform } = useTgui();\n\n  return (\n    <label\n      className={cn(styles.switch, platform === 'ios' ? styles.ios : styles.base, className)}\n      style={style}\n      data-disabled={disabled || undefined}\n    >\n      <input ref={ref} type=\"checkbox\" className={styles.input} disabled={disabled} {...rest} />\n      <span aria-hidden className={styles.control} />\n    </label>\n  );\n}\n\nSwitch.displayName = 'Switch';\n",".bar {\n  display: flex;\n  align-items: stretch;\n  padding: 0 16px;\n  padding-bottom: env(safe-area-inset-bottom, 0px);\n  background: var(--tgui--surface_primary);\n  box-shadow: 0 -0.5px 0 var(--tgui--divider);\n}\n\n.barIos {\n  padding: 0;\n  padding-bottom: calc(6px + env(safe-area-inset-bottom, 0px));\n}\n\n.item {\n  flex: 1 0 0;\n  min-inline-size: 0;\n  max-inline-size: 100%;\n  margin: 0;\n  padding: 10px 16px 14px;\n  border: none;\n  background: transparent;\n\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  gap: 4px;\n\n  color: var(--tgui--secondary_hint_color);\n}\n\n.itemIos {\n  padding: 7px 12px 2px;\n  gap: 3px;\n}\n\n.itemSelected {\n  color: var(--tgui--link_color);\n}\n\n.icon {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  min-width: 64px;\n  height: 32px;\n  padding: 2px 10px;\n  border-radius: 16px;\n}\n\n.itemIos .icon {\n  min-width: 0;\n  height: 28px;\n  padding: 0;\n}\n\n.itemSelected:not(.itemIos) .icon {\n  background: var(--tgui--secondary_fill);\n}\n\n.text {\n  max-inline-size: 100%;\n  overflow: hidden;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n}\n\n@media (prefers-reduced-motion: no-preference) {\n  .item {\n    transition: color 0.15s ease-out;\n  }\n\n  .icon {\n    transition: background 0.15s ease-out;\n  }\n}\n","'use client';\n\nimport type { ButtonHTMLAttributes, ReactNode, Ref } from 'react';\nimport { cn } from '../../shared/lib/cn';\nimport { Caption } from '../Caption';\nimport { Tappable } from '../Tappable';\nimport { useTgui } from '../TguiProvider';\nimport styles from './TabBar.module.css';\n\nexport interface TabBarItemProps extends ButtonHTMLAttributes<HTMLButtonElement> {\n  ref?: Ref<HTMLElement>;\n  selected?: boolean;\n  text?: string;\n  children?: ReactNode;\n}\n\nexport function TabBarItem({ ref, selected, text, children, className, ...rest }: TabBarItemProps) {\n  const { platform } = useTgui();\n  const ios = platform === 'ios';\n\n  return (\n    <Tappable\n      ref={ref}\n      Component=\"button\"\n      interactiveAnimation=\"opacity\"\n      aria-current={selected ? 'page' : undefined}\n      className={cn(styles.item, ios && styles.itemIos, selected && styles.itemSelected, className)}\n      {...rest}\n    >\n      {children != null ? <span className={styles.icon}>{children}</span> : null}\n      {text != null ? (\n        <Caption className={styles.text} weight=\"2\" level={ios ? '2' : '1'}>\n          {text}\n        </Caption>\n      ) : null}\n    </Tappable>\n  );\n}\n\nTabBarItem.displayName = 'TabBarItem';\n","'use client';\n\nimport type { HTMLAttributes, Ref } from 'react';\nimport { cn } from '../../shared/lib/cn';\nimport { useTgui } from '../TguiProvider';\nimport styles from './TabBar.module.css';\nimport { TabBarItem } from './TabBarItem';\n\nexport interface TabBarProps extends HTMLAttributes<HTMLElement> {\n  ref?: Ref<HTMLElement>;\n}\n\nexport function TabBar({ ref, className, children, ...rest }: TabBarProps) {\n  const { platform } = useTgui();\n\n  return (\n    <nav\n      ref={ref}\n      className={cn(styles.bar, platform === 'ios' && styles.barIos, className)}\n      {...rest}\n    >\n      {children}\n    </nav>\n  );\n}\n\nTabBar.displayName = 'TabBar';\nTabBar.Item = TabBarItem;\n"],"mappings":"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"}

package/dist/styles.css

@@ -1,2 +1,2 @@
-._typography_1uxpm_1{font-family:var(--tgui--font-family);margin:0}._weight-1_1uxpm_6{font-weight:var(--tgui--font_weight--accent1)}._weight-2_1uxpm_10{font-weight:var(--tgui--font_weight--accent2)}._weight-3_1uxpm_14{font-weight:var(--tgui--font_weight--accent3)}._caps_1uxpm_18{text-transform:uppercase}._level-1_1azf3_1{font-size:var(--tgui--subheadline1--font_size);line-height:var(--tgui--subheadline1--line_height)}._level-2_1azf3_6{font-size:var(--tgui--subheadline2--font_size);line-height:var(--tgui--subheadline2--line_height)}._ripple_1cc3x_1{border-radius:inherit;pointer-events:none;position:absolute;inset:0;overflow:hidden}._wave_1cc3x_9{background:var(--tgui--outline);opacity:0;border-radius:50%;width:24px;height:24px;animation:.35s cubic-bezier(.3,.3,.5,1) _wave-rise_1cc3x_1;position:absolute;transform:translate(-50%,-50%)}@keyframes _wave-rise_1cc3x_1{0%{opacity:1;transform:translate(-50%,-50%)scale(1)}30%{opacity:1}to{opacity:0;transform:translate(-50%,-50%)scale(8)}}@media (prefers-reduced-motion:reduce){._wave_1cc3x_9{animation:none}}._tappable_10au7_1{isolation:isolate;cursor:pointer;transition:opacity .15s ease-out;position:relative}._tappable_10au7_1[data-readonly]{cursor:default}._tappable_10au7_1[data-disabled]{cursor:default;opacity:.35}._tappable--ios_10au7_17:not([data-disabled]):not([data-readonly]):active,._tappable--opacity_10au7_18:not([data-disabled]):not([data-readonly]):active{opacity:.65}@media (hover:hover) and (pointer:fine){._tappable--ios_10au7_17:not([data-disabled]):not([data-readonly]):hover,._tappable--opacity_10au7_18:not([data-disabled]):not([data-readonly]):hover{opacity:.85}}@media (prefers-reduced-motion:reduce){._tappable_10au7_1{transition:none}}._text_5v0x0_1{font-size:var(--tgui--text--font_size);line-height:var(--tgui--text--line_height)}._wrapper_1jphr_1{--tgui--font-family:system-ui, -apple-system, BlinkMacSystemFont, "Roboto", "Apple Color Emoji", "Helvetica Neue", sans-serif;--tgui--font_weight--accent1:700;--tgui--font_weight--accent2:600;--tgui--font_weight--accent3:400;--tgui--large_title--font_size:34px;--tgui--large_title--line_height:42px;--tgui--title1--font_size:28px;--tgui--title1--line_height:36px;--tgui--title2--font_size:24px;--tgui--title2--line_height:32px;--tgui--title3--font_size:20px;--tgui--title3--line_height:24px;--tgui--headline--font_size:19px;--tgui--headline--line_height:28px;--tgui--text--font_size:17px;--tgui--text--line_height:26px;--tgui--subheadline1--font_size:16px;--tgui--subheadline1--line_height:24px;--tgui--subheadline2--font_size:15px;--tgui--subheadline2--line_height:22px;--tgui--caption1--font_size:13px;--tgui--caption1--line_height:20px;--tgui--caption2--font_size:11px;--tgui--caption2--line_height:16px;--tgui--border--width:1px;--tgui--base--section--box_shadow:0 1px 2px 0 #0000001a;--tgui--bg_color:var(--tg-theme-bg-color,#fff);--tgui--text_color:var(--tg-theme-text-color,#000);--tgui--hint_color:var(--tg-theme-hint-color,#707579);--tgui--link_color:var(--tg-theme-link-color,#007aff);--tgui--button_color:var(--tg-theme-button-color,#007aff);--tgui--button_text_color:var(--tg-theme-button-text-color,#fff);--tgui--secondary_bg_color:var(--tg-theme-secondary-bg-color,#efeff4);--tgui--header_bg_color:var(--tg-theme-header-bg-color,#fff);--tgui--accent_text_color:var(--tg-theme-accent-text-color,#007aff);--tgui--section_bg_color:var(--tg-theme-section-bg-color,#fff);--tgui--section_header_text_color:var(--tg-theme-section-header-text-color,#707579);--tgui--subtitle_text_color:var(--tg-theme-subtitle-text-color,#707579);--tgui--destructive_text_color:var(--tg-theme-destructive-text-color,#e53935);--tgui--skeleton:#00000008;--tgui--divider:#00000026;--tgui--outline:#0000000d;--tgui--surface_primary:#fffffff2;--tgui--tertiary_bg_color:#f4f4f7;--tgui--quartenary_bg_color:#f6f6fa;--tgui--segmented_control_active_bg:var(--tgui--bg_color);--tgui--card_bg_color:var(--tgui--section_bg_color);--tgui--secondary_hint_color:#a2acb0;--tgui--secondary_fill:#4378ff1a;--tgui--green:#31d158;--tgui--destructive_background:#e53935;--tgui--primary_code_highlight:#4378ff;--tgui--secondary_code_highlight:#b00fb4;--tgui--tertiary_code_highlight:#3a9f20;--tgui--plain_background:#0000000a;--tgui--plain_foreground:#000c;--tgui--toast_accent_color:#55a6ff;--tgui--surface_dark:#383838d9;--tgui--tooltip_background_dark:#000000d9;--tgui--white:#fff;--tgui--black:#000;--tgui--z-index--simple:1;--tgui--z-index--skeleton:2;--tgui--z-index--overlay:3;-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%;font-family:var(--tgui--font-family);color:var(--tgui--text_color)}._wrapper--ios_1jphr_89{--tgui--large_title--line_height:41px;--tgui--title1--line_height:34px;--tgui--title2--line_height:28px;--tgui--title3--line_height:25px;--tgui--headline--line_height:24px;--tgui--text--line_height:22px;--tgui--subheadline1--line_height:21px;--tgui--subheadline2--line_height:20px;--tgui--caption1--line_height:16px;--tgui--caption2--line_height:13px}._wrapper--dark_1jphr_102{--tgui--bg_color:var(--tg-theme-bg-color,#212121);--tgui--text_color:var(--tg-theme-text-color,#fff);--tgui--hint_color:var(--tg-theme-hint-color,#aaa);--tgui--link_color:var(--tg-theme-link-color,#2990ff);--tgui--button_color:var(--tg-theme-button-color,#2990ff);--tgui--button_text_color:var(--tg-theme-button-text-color,#fff);--tgui--secondary_bg_color:var(--tg-theme-secondary-bg-color,#0f0f0f);--tgui--header_bg_color:var(--tg-theme-header-bg-color,#212121);--tgui--accent_text_color:var(--tg-theme-accent-text-color,#007aff);--tgui--section_bg_color:var(--tg-theme-section-bg-color,#212121);--tgui--section_header_text_color:var(--tg-theme-section-header-text-color,#aaa);--tgui--subtitle_text_color:var(--tg-theme-subtitle-text-color,#aaa);--tgui--destructive_text_color:var(--tg-theme-destructive-text-color,#e53935);--tgui--skeleton:#ffffff08;--tgui--divider:#ffffff0d;--tgui--outline:#ffffff1a;--tgui--surface_primary:#171717f2;--tgui--tertiary_bg_color:#2a2a2a;--tgui--quartenary_bg_color:#2f2f2f;--tgui--segmented_control_active_bg:#2f2f2f;--tgui--card_bg_color:#262626;--tgui--secondary_hint_color:#78797e;--tgui--secondary_fill:#2990ff26;--tgui--green:#32e55e;--tgui--destructive_background:#ff232305;--tgui--primary_code_highlight:#2990ff;--tgui--secondary_code_highlight:#e937ed;--tgui--tertiary_code_highlight:#5ae536;--tgui--plain_background:#ffffff14;--tgui--plain_foreground:#fffffff2}@media (resolution>=2x){._wrapper_1jphr_1{--tgui--border--width:.5px}}@supports (padding-top:env(safe-area-inset-bottom)){._wrapper_1jphr_1{--tgui--safe_area_inset_bottom:env(safe-area-inset-bottom)}}@supports (color:color-mix(in srgb, red 10%, transparent)){._wrapper_1jphr_1{--tgui--secondary_fill:color-mix(in srgb, var(--tgui--accent_text_color) 10%, transparent);--tgui--tertiary_bg_color:color-mix(in srgb, var(--tgui--secondary_bg_color), var(--tgui--bg_color) 40%);--tgui--quartenary_bg_color:color-mix(in srgb, var(--tgui--secondary_bg_color), var(--tgui--bg_color) 20%)}._wrapper--dark_1jphr_102{--tgui--secondary_fill:color-mix(in srgb, var(--tgui--accent_text_color) 15%, transparent);--tgui--card_bg_color:color-mix(in srgb, var(--tgui--bg_color), #fff 7%);--tgui--tertiary_bg_color:color-mix(in srgb, var(--tgui--bg_color), #fff 10%);--tgui--quartenary_bg_color:color-mix(in srgb, var(--tgui--bg_color), #fff 14%);--tgui--segmented_control_active_bg:color-mix(in srgb, var(--tgui--bg_color), #fff 12%)}}._button_17mwm_1{box-sizing:border-box;border-radius:var(--tgui--button--border_radius,8px);border:none;justify-content:center;align-items:center;min-inline-size:80px;max-inline-size:100%;text-decoration:none;display:inline-flex}._stretched_17mwm_13{flex-grow:1;inline-size:100%}._button_17mwm_1:after{content:"";opacity:0;background:var(--tgui--bg_color);transition:opacity .15s ease-out;position:absolute;inset:0}@media (hover:hover) and (pointer:fine){._button_17mwm_1:not([data-disabled]):hover:after{opacity:var(--tgui--button--wash-opacity)}}._before_17mwm_33,._after_17mwm_34{justify-content:center;align-items:center;display:flex}._content_17mwm_40{min-inline-size:0;z-index:var(--tgui--z-index--simple);flex:0 auto;justify-content:center;align-items:center;display:flex}._label_17mwm_49{white-space:nowrap;text-overflow:ellipsis;min-inline-size:0;overflow:hidden}._content_17mwm_40 svg{display:block}._loading_17mwm_60{pointer-events:none}._loading_17mwm_60 ._before_17mwm_33,._loading_17mwm_60 ._after_17mwm_34,._loading_17mwm_60 ._content_17mwm_40{opacity:0}._spinner_17mwm_70{width:20px;height:20px;color:var(--tgui--button--spinner-color);border:2px solid;border-top-color:#0000;border-radius:50%;animation:.6s linear infinite _button-spinner_17mwm_1;position:absolute}@keyframes _button-spinner_17mwm_1{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){._spinner_17mwm_70{animation-duration:1.6s}}._size-s_17mwm_93{border-radius:999px;gap:6px;min-width:34px;height:36px;padding:8px 12px}._size-m_17mwm_101{gap:8px;min-width:42px;height:42px;padding:8px 14px}._size-l_17mwm_108{gap:10px;height:50px;padding:10px 20px}._ios_17mwm_114._size-m_17mwm_101{border-radius:12px}._ios_17mwm_114:after{content:none}._mode-filled_17mwm_122{--tgui--button--wash-opacity:.15;--tgui--button--spinner-color:var(--tgui--button_text_color);color:var(--tgui--button_text_color);background:var(--tgui--button_color)}._mode-bezeled_17mwm_129{--tgui--button--wash-opacity:.07;--tgui--button--spinner-color:var(--tgui--link_color);color:var(--tgui--link_color);background:var(--tgui--secondary_fill)}._mode-plain_17mwm_136{--tgui--button--wash-opacity:.03;--tgui--button--spinner-color:var(--tgui--plain_foreground);color:var(--tgui--link_color);background:0 0}._mode-gray_17mwm_143{--tgui--button--wash-opacity:.5;--tgui--button--spinner-color:var(--tgui--plain_foreground);color:var(--tgui--plain_foreground);background:var(--tgui--plain_background)}._mode-outline_17mwm_150{--tgui--button--wash-opacity:.5;--tgui--button--spinner-color:var(--tgui--plain_foreground);color:var(--tgui--plain_foreground);box-shadow:0 0 0 1px var(--tgui--outline);background:0 0}._mode-white_17mwm_158{--tgui--button--wash-opacity:.5;--tgui--button--spinner-color:var(--tgui--surface_dark);color:var(--tgui--black);background:var(--tgui--white)}._level-1_1fkm7_1{font-size:var(--tgui--caption1--font_size);line-height:var(--tgui--caption1--line_height)}._level-2_1fkm7_6{font-size:var(--tgui--caption2--font_size);line-height:var(--tgui--caption2--line_height)}._card_tdyqh_1{background:var(--tgui--card_bg_color);border-radius:20px;flex-direction:column;display:flex;position:relative;overflow:hidden;box-shadow:0 32px 64px #0000000a,0 0 2px 1px #00000005}._card_tdyqh_1>*{flex-shrink:0}._cardAmbient_tdyqh_17{background:#000}._cell_tdyqh_21{background:var(--tgui--card_bg_color);padding:0 20px}._cellAmbient_tdyqh_26{--tgui--cell--middle--padding:12px 0;color:#fff;background:linear-gradient(#0000 0%,#0000001f 22%,#0000008c 62%,#000000d9 100%);padding-top:64px;padding-bottom:4px;position:absolute;inset:auto 0 0}._cellHeader_tdyqh_43{font-weight:var(--tgui--font_weight--accent2)}._cellSubtitle_tdyqh_47{-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box}._cellAmbient_tdyqh_26 ._cellHeader_tdyqh_43{color:#fff}._cellAmbient_tdyqh_26 ._cellSubtitle_tdyqh_47{color:#fffc}._cell_1w7p5_1{--tgui--cell--middle--padding:16px 0;align-items:center;gap:24px;padding:0 24px;display:flex}._before_1w7p5_10,._after_1w7p5_11{justify-content:center;align-items:center;display:flex}._middle_1w7p5_17{min-inline-size:0;max-inline-size:100%;padding:var(--tgui--cell--middle--padding);flex-direction:column;flex-grow:1;gap:2px;display:flex}._middle_1w7p5_17>*,._title_1w7p5_29{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}._multiline_1w7p5_35 ._middle_1w7p5_17>*,._multiline_1w7p5_35 ._title_1w7p5_29{white-space:normal}._head_1w7p5_40{align-items:center;gap:4px;display:inline-flex}._subhead_1w7p5_46{color:var(--tgui--subtitle_text_color)}._hint_1w7p5_50,._subtitle_1w7p5_51,._description_1w7p5_52{color:var(--tgui--hint_color)}._hovered_1w7p5_56{background:var(--tgui--tertiary_bg_color)}._ios_1w7p5_60{--tgui--cell--middle--padding:12px 0;gap:16px;padding:0 16px}@media (hover:hover) and (pointer:fine){._interactive_1w7p5_67:not([data-disabled]):hover{background:var(--tgui--tertiary_bg_color)}}._checkbox_3wbt9_1{cursor:pointer;display:inline-flex;position:relative}._checkbox_3wbt9_1[data-disabled]{cursor:default;opacity:.3}._input_3wbt9_12{opacity:0;width:100%;height:100%;cursor:inherit;margin:0;position:absolute;inset:0}._box_3wbt9_22{width:20px;height:20px;box-shadow:inset 0 0 0 2px var(--tgui--outline);border-radius:6px;transition:box-shadow .15s ease-out,background .15s ease-out;position:relative}._input_3wbt9_12:checked+._box_3wbt9_22,._input_3wbt9_12:indeterminate+._box_3wbt9_22{background:var(--tgui--link_color);box-shadow:none}._input_3wbt9_12:focus-visible+._box_3wbt9_22{box-shadow:0 0 0 2px var(--tgui--link_color)}._input_3wbt9_12:checked+._box_3wbt9_22:after{content:"";border:solid var(--tgui--button_text_color);border-width:0 2px 2px 0;width:5px;height:9px;position:absolute;top:3px;left:7px;transform:rotate(45deg)}._input_3wbt9_12:indeterminate+._box_3wbt9_22:after{content:"";background:var(--tgui--button_text_color);width:12px;height:2px;position:absolute;top:9px;left:4px}._divider_fq1ux_1{border:none;border-block-start:var(--tgui--border--width) solid var(--tgui--outline);margin:0}._headline_17ihj_1{font-size:var(--tgui--headline--font_size);line-height:var(--tgui--headline--line_height)}._base_ja3pv_1{background:var(--tgui--bg_color);padding:20px 22px 16px;position:relative}._body_ja3pv_7{box-sizing:border-box;align-items:center;padding:12px 16px;display:flex}._body_ja3pv_7>:not(:first-child){margin-left:12px}._base_ja3pv_1 ._body_ja3pv_7{box-shadow:0 0 0 2px var(--tgui--outline);border-radius:14px}._ios_ja3pv_23 ._body_ja3pv_7{background:var(--tgui--bg_color);border-radius:12px;min-height:48px}._before_ja3pv_29,._after_ja3pv_30{align-items:center;display:flex}._field_ja3pv_35{width:100%;color:var(--tgui--text_color);text-overflow:ellipsis;background:0 0;border:0;outline:0;margin:0;padding:0;display:block}._field_ja3pv_35::placeholder{color:var(--tgui--secondary_hint_color)}._field_ja3pv_35::-webkit-outer-spin-button{appearance:none}._field_ja3pv_35::-webkit-inner-spin-button{appearance:none}._header_ja3pv_56{white-space:nowrap;text-overflow:ellipsis;max-width:calc(100% - 76px);color:var(--tgui--secondary_hint_color);background:var(--tgui--bg_color);border-radius:5px;padding:0 6px;position:absolute;top:6px;left:32px;overflow:hidden}._focused_ja3pv_70._base_ja3pv_1 ._body_ja3pv_7{box-shadow:0 0 0 2px var(--tgui--link_color)}._focused_ja3pv_70._base_ja3pv_1 ._header_ja3pv_56{color:var(--tgui--link_color)}._error_ja3pv_78._base_ja3pv_1 ._body_ja3pv_7{box-shadow:0 0 0 2px var(--tgui--destructive_text_color)}._error_ja3pv_78._base_ja3pv_1 ._header_ja3pv_56{color:var(--tgui--destructive_text_color)}._error_ja3pv_78._ios_ja3pv_23 ._body_ja3pv_7{box-shadow:0 0 0 1.5px var(--tgui--destructive_text_color)}._disabled_ja3pv_90{pointer-events:none}._disabled_ja3pv_90._ios_ja3pv_23{opacity:.35}._large-title_15hug_1{font-size:var(--tgui--large_title--font_size);line-height:var(--tgui--large_title--line_height);letter-spacing:-.02em}._list_1rhgw_1{box-sizing:border-box}._ios_1rhgw_5{padding:10px 18px}._list_1rhgw_1>:not(:last-child){margin-bottom:12px}._level-1_rosk9_1{font-size:var(--tgui--title1--font_size);line-height:var(--tgui--title1--line_height)}._level-2_rosk9_6{font-size:var(--tgui--title2--font_size);line-height:var(--tgui--title2--line_height)}._level-3_rosk9_11{font-size:var(--tgui--title3--font_size);line-height:var(--tgui--title3--line_height)}._placeholder_4t5fq_1{flex-direction:column;justify-content:center;align-items:center;gap:24px;padding:32px;display:flex;overflow:hidden}._fields_4t5fq_13{text-align:center;overflow-wrap:anywhere;margin:0}._description_4t5fq_19{color:var(--tgui--hint_color)}._description_4t5fq_19:not(:first-child){margin-top:8px}._body_1o4ef_1{flex-direction:column;display:flex}._sectionBase_1o4ef_6 ._bodyWithHeader_1o4ef_6{background:var(--tgui--section_bg_color);box-shadow:var(--tgui--base--section--box_shadow)}._sectionIos_1o4ef_11 ._body_1o4ef_1{background:var(--tgui--section_bg_color);border-radius:12px}._sectionIos_1o4ef_11 ._body_1o4ef_1>:first-child{border-radius:12px 12px 0 0}._sectionIos_1o4ef_11 ._body_1o4ef_1>:last-child{border-radius:0 0 12px 12px}._sectionIos_1o4ef_11 ._body_1o4ef_1>:only-child{border-radius:12px}._header_1o4ef_28{color:var(--tgui--link_color);padding:20px 24px 4px 22px}._headerLarge_1o4ef_33{color:var(--tgui--text_color);padding-left:24px}._headerIos_1o4ef_38{color:var(--tgui--section_header_text_color);padding:16px 16px 8px}._headerIos_1o4ef_38._headerLarge_1o4ef_33{color:var(--tgui--text_color);padding:0 0 12px}._footer_1o4ef_48{padding:12px 24px}._footerIos_1o4ef_52{padding:8px 16px 0}._footerCentered_1o4ef_56{text-align:center;padding:16px 24px 20px}._footerIos_1o4ef_52._footerCentered_1o4ef_56{padding:16px 16px 0}._footerText_1o4ef_65{color:var(--tgui--hint_color)}._base_9dgop_1{background:var(--tgui--bg_color);padding:20px 22px 16px;position:relative}._row_9dgop_7{box-sizing:border-box;box-shadow:inset 0 0 0 2px var(--tgui--outline);border-radius:14px;position:relative}._ios_9dgop_14 ._row_9dgop_7{background:var(--tgui--bg_color);border-radius:12px}._select_9dgop_19{appearance:none;border-radius:inherit;width:100%;min-height:48px;color:var(--tgui--text_color);background:0 0;border:0;outline:0;margin:0;padding:12px 44px 12px 16px;display:block}._chevron_9dgop_33{border:solid var(--tgui--secondary_hint_color);pointer-events:none;border-width:0 2px 2px 0;width:8px;height:8px;position:absolute;top:50%;right:18px;transform:translateY(-75%)rotate(45deg)}._header_9dgop_45{white-space:nowrap;text-overflow:ellipsis;max-width:calc(100% - 76px);color:var(--tgui--secondary_hint_color);background:var(--tgui--bg_color);border-radius:5px;padding:0 6px;position:absolute;top:6px;left:32px;overflow:hidden}._focused_9dgop_59._base_9dgop_1 ._row_9dgop_7{box-shadow:inset 0 0 0 2px var(--tgui--link_color)}._focused_9dgop_59._base_9dgop_1 ._header_9dgop_45{color:var(--tgui--link_color)}._error_9dgop_67._base_9dgop_1 ._row_9dgop_7{box-shadow:inset 0 0 0 2px var(--tgui--destructive_text_color)}._error_9dgop_67._base_9dgop_1 ._header_9dgop_45{color:var(--tgui--destructive_text_color)}._error_9dgop_67._ios_9dgop_14 ._row_9dgop_7{box-shadow:inset 0 0 0 1.5px var(--tgui--destructive_text_color)}._disabled_9dgop_79{pointer-events:none}._disabled_9dgop_79._ios_9dgop_14{opacity:.35}._switch_s4zd1_1{cursor:pointer;border-radius:16px;flex-shrink:0;align-items:center;width:52px;height:32px;display:inline-flex;position:relative;overflow:hidden}._switch_s4zd1_1[data-disabled]{cursor:default;opacity:.4}._input_s4zd1_18{opacity:0;width:100%;height:100%;cursor:inherit;margin:0;position:absolute;inset:0}._control_s4zd1_28:before{content:"";background:var(--tgui--secondary_bg_color);position:absolute;inset:0}._base_s4zd1_35 ._control_s4zd1_28:before{border:3px solid var(--tgui--secondary_hint_color);border-radius:16px}._control_s4zd1_28:after{content:"";border-radius:50%;position:absolute;top:50%;transform:translateY(-50%)}._base_s4zd1_35 ._control_s4zd1_28:after{background:var(--tgui--secondary_hint_color);width:16px;height:16px;margin-left:8px}._ios_s4zd1_55 ._control_s4zd1_28:before{background:#78788038}._ios_s4zd1_55 ._control_s4zd1_28:after{background:var(--tgui--white);width:28px;height:28px;margin-left:2px;box-shadow:0 3px 8px #0000001f,0 1px 1px #00000029}._input_s4zd1_18:checked+._control_s4zd1_28:before{border-color:var(--tgui--link_color);background-color:var(--tgui--link_color)}._input_s4zd1_18:checked+._control_s4zd1_28:after{transform:translate(20px)translateY(-50%)}._base_s4zd1_35 ._input_s4zd1_18:checked+._control_s4zd1_28:after{background:var(--tgui--white);width:24px;height:24px;transform:translate(16px)translateY(-50%)}._input_s4zd1_18:focus-visible+._control_s4zd1_28:before{box-shadow:0 0 0 2px var(--tgui--link_color)}@media (prefers-reduced-motion:no-preference){._control_s4zd1_28:before{transition:background-color .2s,border-color .2s}._control_s4zd1_28:after{transition:transform .3s cubic-bezier(.175,.885,.32,1.275)}._ios_s4zd1_55 ._control_s4zd1_28:after{transition:transform .2s cubic-bezier(.36,-.24,.26,1.32)}}._bar_y3gvr_1{padding:0 16px;padding-bottom:env(safe-area-inset-bottom,0px);background:var(--tgui--surface_primary);box-shadow:0 -.5px 0 var(--tgui--divider);align-items:stretch;display:flex}._barIos_y3gvr_10{padding:0;padding-bottom:calc(6px + env(safe-area-inset-bottom,0px))}._item_y3gvr_15{min-inline-size:0;max-inline-size:100%;color:var(--tgui--secondary_hint_color);background:0 0;border:none;flex-direction:column;flex:1 0 0;justify-content:center;align-items:center;gap:4px;margin:0;padding:10px 16px 14px;transition:color .15s ease-out;display:flex}._itemIos_y3gvr_34{gap:3px;padding:7px 12px 2px}._itemSelected_y3gvr_39{color:var(--tgui--link_color)}._icon_y3gvr_43{border-radius:16px;justify-content:center;align-items:center;min-width:64px;height:32px;padding:2px 10px;transition:background .15s ease-out;display:flex}._itemIos_y3gvr_34 ._icon_y3gvr_43{min-width:0;height:28px;padding:0}._itemSelected_y3gvr_39:not(._itemIos_y3gvr_34) ._icon_y3gvr_43{background:var(--tgui--secondary_fill)}._text_y3gvr_64{white-space:nowrap;text-overflow:ellipsis;max-inline-size:100%;overflow:hidden}
+._typography_1uxpm_1{font-family:var(--tgui--font-family);margin:0}._weight-1_1uxpm_6{font-weight:var(--tgui--font_weight--accent1)}._weight-2_1uxpm_10{font-weight:var(--tgui--font_weight--accent2)}._weight-3_1uxpm_14{font-weight:var(--tgui--font_weight--accent3)}._caps_1uxpm_18{text-transform:uppercase}._level-1_1azf3_1{font-size:var(--tgui--subheadline1--font_size);line-height:var(--tgui--subheadline1--line_height)}._level-2_1azf3_6{font-size:var(--tgui--subheadline2--font_size);line-height:var(--tgui--subheadline2--line_height)}._ripple_1cc3x_1{border-radius:inherit;pointer-events:none;position:absolute;inset:0;overflow:hidden}._wave_1cc3x_9{background:var(--tgui--outline);opacity:0;border-radius:50%;width:24px;height:24px;animation:.35s cubic-bezier(.3,.3,.5,1) _wave-rise_1cc3x_1;position:absolute;transform:translate(-50%,-50%)}@keyframes _wave-rise_1cc3x_1{0%{opacity:1;transform:translate(-50%,-50%)scale(1)}30%{opacity:1}to{opacity:0;transform:translate(-50%,-50%)scale(8)}}@media (prefers-reduced-motion:reduce){._wave_1cc3x_9{animation:none}}._tappable_10au7_1{isolation:isolate;cursor:pointer;transition:opacity .15s ease-out;position:relative}._tappable_10au7_1[data-readonly]{cursor:default}._tappable_10au7_1[data-disabled]{cursor:default;opacity:.35}._tappable--ios_10au7_17:not([data-disabled]):not([data-readonly]):active,._tappable--opacity_10au7_18:not([data-disabled]):not([data-readonly]):active{opacity:.65}@media (hover:hover) and (pointer:fine){._tappable--ios_10au7_17:not([data-disabled]):not([data-readonly]):hover,._tappable--opacity_10au7_18:not([data-disabled]):not([data-readonly]):hover{opacity:.85}}@media (prefers-reduced-motion:reduce){._tappable_10au7_1{transition:none}}._text_5v0x0_1{font-size:var(--tgui--text--font_size);line-height:var(--tgui--text--line_height)}._wrapper_17e4j_1{--tgui--font-family:system-ui, -apple-system, BlinkMacSystemFont, "Roboto", "Apple Color Emoji", "Helvetica Neue", sans-serif;--tgui--font_weight--accent1:700;--tgui--font_weight--accent2:600;--tgui--font_weight--accent3:400;--tgui--large_title--font_size:34px;--tgui--large_title--line_height:42px;--tgui--title1--font_size:28px;--tgui--title1--line_height:36px;--tgui--title2--font_size:24px;--tgui--title2--line_height:32px;--tgui--title3--font_size:20px;--tgui--title3--line_height:24px;--tgui--headline--font_size:19px;--tgui--headline--line_height:28px;--tgui--text--font_size:17px;--tgui--text--line_height:26px;--tgui--subheadline1--font_size:16px;--tgui--subheadline1--line_height:24px;--tgui--subheadline2--font_size:15px;--tgui--subheadline2--line_height:22px;--tgui--caption1--font_size:13px;--tgui--caption1--line_height:20px;--tgui--caption2--font_size:11px;--tgui--caption2--line_height:16px;--tgui--border--width:1px;--tgui--base--section--box_shadow:0 1px 2px 0 #0000001a;--tgui--bg_color:var(--tg-theme-bg-color,#fff);--tgui--text_color:var(--tg-theme-text-color,#000);--tgui--hint_color:var(--tg-theme-hint-color,#707579);--tgui--link_color:var(--tg-theme-link-color,#007aff);--tgui--button_color:var(--tg-theme-button-color,#007aff);--tgui--button_text_color:var(--tg-theme-button-text-color,#fff);--tgui--secondary_bg_color:var(--tg-theme-secondary-bg-color,#efeff4);--tgui--header_bg_color:var(--tg-theme-header-bg-color,#fff);--tgui--accent_text_color:var(--tg-theme-accent-text-color,#007aff);--tgui--section_bg_color:var(--tg-theme-section-bg-color,#fff);--tgui--section_header_text_color:var(--tg-theme-section-header-text-color,#707579);--tgui--subtitle_text_color:var(--tg-theme-subtitle-text-color,#707579);--tgui--destructive_text_color:var(--tg-theme-destructive-text-color,#e53935);--tgui--skeleton:#00000008;--tgui--divider:#00000026;--tgui--outline:#0000000d;--tgui--surface_primary:#fffffff2;--tgui--tertiary_bg_color:#f4f4f7;--tgui--quartenary_bg_color:#f6f6fa;--tgui--segmented_control_active_bg:var(--tgui--bg_color);--tgui--card_bg_color:var(--tgui--section_bg_color);--tgui--secondary_hint_color:#a2acb0;--tgui--secondary_fill:#4378ff24;--tgui--green:#31d158;--tgui--destructive_background:#e53935;--tgui--primary_code_highlight:#4378ff;--tgui--secondary_code_highlight:#b00fb4;--tgui--tertiary_code_highlight:#3a9f20;--tgui--plain_background:#0000000a;--tgui--plain_foreground:#000c;--tgui--toast_accent_color:#55a6ff;--tgui--surface_dark:#383838d9;--tgui--tooltip_background_dark:#000000d9;--tgui--white:#fff;--tgui--black:#000;--tgui--z-index--simple:1;--tgui--z-index--skeleton:2;--tgui--z-index--overlay:3;-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%;font-family:var(--tgui--font-family);color:var(--tgui--text_color)}._wrapper--ios_17e4j_89{--tgui--large_title--line_height:41px;--tgui--title1--line_height:34px;--tgui--title2--line_height:28px;--tgui--title3--line_height:25px;--tgui--headline--line_height:24px;--tgui--text--line_height:22px;--tgui--subheadline1--line_height:21px;--tgui--subheadline2--line_height:20px;--tgui--caption1--line_height:16px;--tgui--caption2--line_height:13px}._wrapper--dark_17e4j_102{--tgui--bg_color:var(--tg-theme-bg-color,#212121);--tgui--text_color:var(--tg-theme-text-color,#fff);--tgui--hint_color:var(--tg-theme-hint-color,#aaa);--tgui--link_color:var(--tg-theme-link-color,#2990ff);--tgui--button_color:var(--tg-theme-button-color,#2990ff);--tgui--button_text_color:var(--tg-theme-button-text-color,#fff);--tgui--secondary_bg_color:var(--tg-theme-secondary-bg-color,#0f0f0f);--tgui--header_bg_color:var(--tg-theme-header-bg-color,#212121);--tgui--accent_text_color:var(--tg-theme-accent-text-color,#007aff);--tgui--section_bg_color:var(--tg-theme-section-bg-color,#212121);--tgui--section_header_text_color:var(--tg-theme-section-header-text-color,#aaa);--tgui--subtitle_text_color:var(--tg-theme-subtitle-text-color,#aaa);--tgui--destructive_text_color:var(--tg-theme-destructive-text-color,#e53935);--tgui--skeleton:#ffffff08;--tgui--divider:#ffffff0d;--tgui--outline:#ffffff1a;--tgui--surface_primary:#171717f2;--tgui--tertiary_bg_color:#2a2a2a;--tgui--quartenary_bg_color:#2f2f2f;--tgui--segmented_control_active_bg:#2f2f2f;--tgui--card_bg_color:#262626;--tgui--secondary_hint_color:#78797e;--tgui--secondary_fill:#2990ff33;--tgui--green:#32e55e;--tgui--destructive_background:#ff232305;--tgui--primary_code_highlight:#2990ff;--tgui--secondary_code_highlight:#e937ed;--tgui--tertiary_code_highlight:#5ae536;--tgui--plain_background:#ffffff14;--tgui--plain_foreground:#fffffff2}@media (resolution>=2x){._wrapper_17e4j_1{--tgui--border--width:.5px}}@supports (padding-top:env(safe-area-inset-bottom)){._wrapper_17e4j_1{--tgui--safe_area_inset_bottom:env(safe-area-inset-bottom)}}@supports (color:color-mix(in srgb, red 10%, transparent)){._wrapper_17e4j_1{--tgui--secondary_fill:color-mix(in srgb, var(--tgui--accent_text_color) 14%, transparent);--tgui--tertiary_bg_color:color-mix(in srgb, var(--tgui--secondary_bg_color), var(--tgui--bg_color) 40%);--tgui--quartenary_bg_color:color-mix(in srgb, var(--tgui--secondary_bg_color), var(--tgui--bg_color) 20%)}._wrapper--dark_17e4j_102{--tgui--secondary_fill:color-mix(in srgb, var(--tgui--accent_text_color) 20%, transparent);--tgui--card_bg_color:color-mix(in srgb, var(--tgui--bg_color), #fff 7%);--tgui--tertiary_bg_color:color-mix(in srgb, var(--tgui--bg_color), #fff 10%);--tgui--quartenary_bg_color:color-mix(in srgb, var(--tgui--bg_color), #fff 14%);--tgui--segmented_control_active_bg:color-mix(in srgb, var(--tgui--bg_color), #fff 12%)}}._button_17mwm_1{box-sizing:border-box;border-radius:var(--tgui--button--border_radius,8px);border:none;justify-content:center;align-items:center;min-inline-size:80px;max-inline-size:100%;text-decoration:none;display:inline-flex}._stretched_17mwm_13{flex-grow:1;inline-size:100%}._button_17mwm_1:after{content:"";opacity:0;background:var(--tgui--bg_color);transition:opacity .15s ease-out;position:absolute;inset:0}@media (hover:hover) and (pointer:fine){._button_17mwm_1:not([data-disabled]):hover:after{opacity:var(--tgui--button--wash-opacity)}}._before_17mwm_33,._after_17mwm_34{justify-content:center;align-items:center;display:flex}._content_17mwm_40{min-inline-size:0;z-index:var(--tgui--z-index--simple);flex:0 auto;justify-content:center;align-items:center;display:flex}._label_17mwm_49{white-space:nowrap;text-overflow:ellipsis;min-inline-size:0;overflow:hidden}._content_17mwm_40 svg{display:block}._loading_17mwm_60{pointer-events:none}._loading_17mwm_60 ._before_17mwm_33,._loading_17mwm_60 ._after_17mwm_34,._loading_17mwm_60 ._content_17mwm_40{opacity:0}._spinner_17mwm_70{width:20px;height:20px;color:var(--tgui--button--spinner-color);border:2px solid;border-top-color:#0000;border-radius:50%;animation:.6s linear infinite _button-spinner_17mwm_1;position:absolute}@keyframes _button-spinner_17mwm_1{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){._spinner_17mwm_70{animation-duration:1.6s}}._size-s_17mwm_93{border-radius:999px;gap:6px;min-width:34px;height:36px;padding:8px 12px}._size-m_17mwm_101{gap:8px;min-width:42px;height:42px;padding:8px 14px}._size-l_17mwm_108{gap:10px;height:50px;padding:10px 20px}._ios_17mwm_114._size-m_17mwm_101{border-radius:12px}._ios_17mwm_114:after{content:none}._mode-filled_17mwm_122{--tgui--button--wash-opacity:.15;--tgui--button--spinner-color:var(--tgui--button_text_color);color:var(--tgui--button_text_color);background:var(--tgui--button_color)}._mode-bezeled_17mwm_129{--tgui--button--wash-opacity:.07;--tgui--button--spinner-color:var(--tgui--link_color);color:var(--tgui--link_color);background:var(--tgui--secondary_fill)}._mode-plain_17mwm_136{--tgui--button--wash-opacity:.03;--tgui--button--spinner-color:var(--tgui--plain_foreground);color:var(--tgui--link_color);background:0 0}._mode-gray_17mwm_143{--tgui--button--wash-opacity:.5;--tgui--button--spinner-color:var(--tgui--plain_foreground);color:var(--tgui--plain_foreground);background:var(--tgui--plain_background)}._mode-outline_17mwm_150{--tgui--button--wash-opacity:.5;--tgui--button--spinner-color:var(--tgui--plain_foreground);color:var(--tgui--plain_foreground);box-shadow:0 0 0 1px var(--tgui--outline);background:0 0}._mode-white_17mwm_158{--tgui--button--wash-opacity:.5;--tgui--button--spinner-color:var(--tgui--surface_dark);color:var(--tgui--black);background:var(--tgui--white)}._level-1_1fkm7_1{font-size:var(--tgui--caption1--font_size);line-height:var(--tgui--caption1--line_height)}._level-2_1fkm7_6{font-size:var(--tgui--caption2--font_size);line-height:var(--tgui--caption2--line_height)}._card_1maup_1{background:var(--tgui--card_bg_color);border-radius:20px;flex-direction:column;display:flex;position:relative;overflow:hidden;box-shadow:0 32px 64px #0000000a,0 0 2px 1px #00000005}._card_1maup_1>*{flex-shrink:0}._cardAmbient_1maup_17{background:var(--tgui--black)}._cell_1maup_21{background:var(--tgui--card_bg_color);padding:0 20px}._cellAmbient_1maup_26{--tgui--cell--middle--padding:12px 0;color:var(--tgui--white);background:linear-gradient(#0000 0%,#0000001f 22%,#0000008c 62%,#000000d9 100%);padding-top:64px;padding-bottom:4px;position:absolute;inset:auto 0 0}._cellHeader_1maup_43{font-weight:var(--tgui--font_weight--accent2)}._cellSubtitle_1maup_47{-webkit-line-clamp:2;-webkit-box-orient:vertical;display:-webkit-box}._cellAmbient_1maup_26 ._cellHeader_1maup_43{color:var(--tgui--white)}._cellAmbient_1maup_26 ._cellSubtitle_1maup_47{color:#fffc}._cell_1w7p5_1{--tgui--cell--middle--padding:16px 0;align-items:center;gap:24px;padding:0 24px;display:flex}._before_1w7p5_10,._after_1w7p5_11{justify-content:center;align-items:center;display:flex}._middle_1w7p5_17{min-inline-size:0;max-inline-size:100%;padding:var(--tgui--cell--middle--padding);flex-direction:column;flex-grow:1;gap:2px;display:flex}._middle_1w7p5_17>*,._title_1w7p5_29{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}._multiline_1w7p5_35 ._middle_1w7p5_17>*,._multiline_1w7p5_35 ._title_1w7p5_29{white-space:normal}._head_1w7p5_40{align-items:center;gap:4px;display:inline-flex}._subhead_1w7p5_46{color:var(--tgui--subtitle_text_color)}._hint_1w7p5_50,._subtitle_1w7p5_51,._description_1w7p5_52{color:var(--tgui--hint_color)}._hovered_1w7p5_56{background:var(--tgui--tertiary_bg_color)}._ios_1w7p5_60{--tgui--cell--middle--padding:12px 0;gap:16px;padding:0 16px}@media (hover:hover) and (pointer:fine){._interactive_1w7p5_67:not([data-disabled]):hover{background:var(--tgui--tertiary_bg_color)}}._checkbox_yjw6v_1{cursor:pointer;display:inline-flex;position:relative}._checkbox_yjw6v_1[data-disabled]{cursor:default;opacity:.3}._input_yjw6v_12{opacity:0;width:100%;height:100%;cursor:inherit;margin:0;position:absolute;inset:0}._box_yjw6v_22{width:20px;height:20px;box-shadow:inset 0 0 0 2px var(--tgui--outline);pointer-events:none;border-radius:6px;position:relative}@media (prefers-reduced-motion:no-preference){._box_yjw6v_22{transition:box-shadow .15s ease-out,background .15s ease-out}}._input_yjw6v_12:checked+._box_yjw6v_22,._input_yjw6v_12:indeterminate+._box_yjw6v_22{background:var(--tgui--link_color);box-shadow:none}._input_yjw6v_12:focus-visible+._box_yjw6v_22{box-shadow:0 0 0 2px var(--tgui--link_color)}._input_yjw6v_12:checked+._box_yjw6v_22:after{content:"";border:solid var(--tgui--button_text_color);border-width:0 2px 2px 0;width:5px;height:9px;position:absolute;top:3px;left:7px;transform:rotate(45deg)}._input_yjw6v_12:indeterminate+._box_yjw6v_22:after{content:"";background:var(--tgui--button_text_color);width:12px;height:2px;position:absolute;top:9px;left:4px}._divider_fq1ux_1{border:none;border-block-start:var(--tgui--border--width) solid var(--tgui--outline);margin:0}._headline_17ihj_1{font-size:var(--tgui--headline--font_size);line-height:var(--tgui--headline--line_height)}._base_wqh9u_1{background:var(--tgui--bg_color);padding:20px 22px 16px;position:relative}._body_wqh9u_7{box-sizing:border-box;align-items:center;padding:12px 16px;display:flex}._body_wqh9u_7>:not(:first-child){margin-left:12px}._base_wqh9u_1 ._body_wqh9u_7{box-shadow:0 0 0 2px var(--tgui--outline);border-radius:14px}._ios_wqh9u_23 ._body_wqh9u_7{background:var(--tgui--tertiary_bg_color);border-radius:12px;min-height:48px}._before_wqh9u_29,._after_wqh9u_30{align-items:center;display:flex}._field_wqh9u_35{width:100%;color:var(--tgui--text_color);text-overflow:ellipsis;background:0 0;border:0;outline:0;margin:0;padding:0;display:block}._field_wqh9u_35::placeholder{color:var(--tgui--secondary_hint_color)}._field_wqh9u_35::-webkit-outer-spin-button{appearance:none}._field_wqh9u_35::-webkit-inner-spin-button{appearance:none}._header_wqh9u_56{white-space:nowrap;text-overflow:ellipsis;max-width:calc(100% - 76px);color:var(--tgui--secondary_hint_color);background:var(--tgui--bg_color);border-radius:5px;padding:0 6px;position:absolute;top:6px;left:32px;overflow:hidden}._focused_wqh9u_70._base_wqh9u_1 ._body_wqh9u_7{box-shadow:0 0 0 2px var(--tgui--link_color)}._focused_wqh9u_70._base_wqh9u_1 ._header_wqh9u_56{color:var(--tgui--link_color)}._error_wqh9u_78._base_wqh9u_1 ._body_wqh9u_7{box-shadow:0 0 0 2px var(--tgui--destructive_text_color)}._error_wqh9u_78._base_wqh9u_1 ._header_wqh9u_56{color:var(--tgui--destructive_text_color)}._error_wqh9u_78._ios_wqh9u_23 ._body_wqh9u_7{box-shadow:0 0 0 1.5px var(--tgui--destructive_text_color)}._disabled_wqh9u_90{pointer-events:none}._disabled_wqh9u_90._ios_wqh9u_23{opacity:.35}._large-title_15hug_1{font-size:var(--tgui--large_title--font_size);line-height:var(--tgui--large_title--line_height);letter-spacing:-.02em}._list_1rhgw_1{box-sizing:border-box}._ios_1rhgw_5{padding:10px 18px}._list_1rhgw_1>:not(:last-child){margin-bottom:12px}._level-1_rosk9_1{font-size:var(--tgui--title1--font_size);line-height:var(--tgui--title1--line_height)}._level-2_rosk9_6{font-size:var(--tgui--title2--font_size);line-height:var(--tgui--title2--line_height)}._level-3_rosk9_11{font-size:var(--tgui--title3--font_size);line-height:var(--tgui--title3--line_height)}._placeholder_4t5fq_1{flex-direction:column;justify-content:center;align-items:center;gap:24px;padding:32px;display:flex;overflow:hidden}._fields_4t5fq_13{text-align:center;overflow-wrap:anywhere;margin:0}._description_4t5fq_19{color:var(--tgui--hint_color)}._description_4t5fq_19:not(:first-child){margin-top:8px}._body_1o4ef_1{flex-direction:column;display:flex}._sectionBase_1o4ef_6 ._bodyWithHeader_1o4ef_6{background:var(--tgui--section_bg_color);box-shadow:var(--tgui--base--section--box_shadow)}._sectionIos_1o4ef_11 ._body_1o4ef_1{background:var(--tgui--section_bg_color);border-radius:12px}._sectionIos_1o4ef_11 ._body_1o4ef_1>:first-child{border-radius:12px 12px 0 0}._sectionIos_1o4ef_11 ._body_1o4ef_1>:last-child{border-radius:0 0 12px 12px}._sectionIos_1o4ef_11 ._body_1o4ef_1>:only-child{border-radius:12px}._header_1o4ef_28{color:var(--tgui--link_color);padding:20px 24px 4px 22px}._headerLarge_1o4ef_33{color:var(--tgui--text_color);padding-left:24px}._headerIos_1o4ef_38{color:var(--tgui--section_header_text_color);padding:16px 16px 8px}._headerIos_1o4ef_38._headerLarge_1o4ef_33{color:var(--tgui--text_color);padding:0 0 12px}._footer_1o4ef_48{padding:12px 24px}._footerIos_1o4ef_52{padding:8px 16px 0}._footerCentered_1o4ef_56{text-align:center;padding:16px 24px 20px}._footerIos_1o4ef_52._footerCentered_1o4ef_56{padding:16px 16px 0}._footerText_1o4ef_65{color:var(--tgui--hint_color)}._base_yxki5_1{background:var(--tgui--bg_color);padding:20px 22px 16px;position:relative}._row_yxki5_7{box-sizing:border-box;border-radius:14px;position:relative}._base_yxki5_1 ._row_yxki5_7{box-shadow:inset 0 0 0 2px var(--tgui--outline)}._ios_yxki5_17 ._row_yxki5_7{background:var(--tgui--tertiary_bg_color);border-radius:12px}._select_yxki5_22{appearance:none;border-radius:inherit;width:100%;min-height:48px;color:var(--tgui--text_color);background:0 0;border:0;outline:0;margin:0;padding:12px 44px 12px 16px;display:block}._chevron_yxki5_36{border:solid var(--tgui--secondary_hint_color);pointer-events:none;border-width:0 2px 2px 0;width:8px;height:8px;position:absolute;top:50%;right:18px;transform:translateY(-75%)rotate(45deg)}._header_yxki5_48{white-space:nowrap;text-overflow:ellipsis;max-width:calc(100% - 76px);color:var(--tgui--secondary_hint_color);background:var(--tgui--bg_color);border-radius:5px;padding:0 6px;position:absolute;top:6px;left:32px;overflow:hidden}._focused_yxki5_62._base_yxki5_1 ._row_yxki5_7{box-shadow:inset 0 0 0 2px var(--tgui--link_color)}._focused_yxki5_62._base_yxki5_1 ._header_yxki5_48{color:var(--tgui--link_color)}._error_yxki5_70._base_yxki5_1 ._row_yxki5_7{box-shadow:inset 0 0 0 2px var(--tgui--destructive_text_color)}._error_yxki5_70._base_yxki5_1 ._header_yxki5_48{color:var(--tgui--destructive_text_color)}._error_yxki5_70._ios_yxki5_17 ._row_yxki5_7{box-shadow:inset 0 0 0 1.5px var(--tgui--destructive_text_color)}._disabled_yxki5_82{pointer-events:none}._disabled_yxki5_82._ios_yxki5_17{opacity:.35}._switch_s4zd1_1{cursor:pointer;border-radius:16px;flex-shrink:0;align-items:center;width:52px;height:32px;display:inline-flex;position:relative;overflow:hidden}._switch_s4zd1_1[data-disabled]{cursor:default;opacity:.4}._input_s4zd1_18{opacity:0;width:100%;height:100%;cursor:inherit;margin:0;position:absolute;inset:0}._control_s4zd1_28:before{content:"";background:var(--tgui--secondary_bg_color);position:absolute;inset:0}._base_s4zd1_35 ._control_s4zd1_28:before{border:3px solid var(--tgui--secondary_hint_color);border-radius:16px}._control_s4zd1_28:after{content:"";border-radius:50%;position:absolute;top:50%;transform:translateY(-50%)}._base_s4zd1_35 ._control_s4zd1_28:after{background:var(--tgui--secondary_hint_color);width:16px;height:16px;margin-left:8px}._ios_s4zd1_55 ._control_s4zd1_28:before{background:#78788038}._ios_s4zd1_55 ._control_s4zd1_28:after{background:var(--tgui--white);width:28px;height:28px;margin-left:2px;box-shadow:0 3px 8px #0000001f,0 1px 1px #00000029}._input_s4zd1_18:checked+._control_s4zd1_28:before{border-color:var(--tgui--link_color);background-color:var(--tgui--link_color)}._input_s4zd1_18:checked+._control_s4zd1_28:after{transform:translate(20px)translateY(-50%)}._base_s4zd1_35 ._input_s4zd1_18:checked+._control_s4zd1_28:after{background:var(--tgui--white);width:24px;height:24px;transform:translate(16px)translateY(-50%)}._input_s4zd1_18:focus-visible+._control_s4zd1_28:before{box-shadow:0 0 0 2px var(--tgui--link_color)}@media (prefers-reduced-motion:no-preference){._control_s4zd1_28:before{transition:background-color .2s,border-color .2s}._control_s4zd1_28:after{transition:transform .3s cubic-bezier(.175,.885,.32,1.275)}._ios_s4zd1_55 ._control_s4zd1_28:after{transition:transform .2s cubic-bezier(.36,-.24,.26,1.32)}}._bar_muj3n_1{padding:0 16px;padding-bottom:env(safe-area-inset-bottom,0px);background:var(--tgui--surface_primary);box-shadow:0 -.5px 0 var(--tgui--divider);align-items:stretch;display:flex}._barIos_muj3n_10{padding:0;padding-bottom:calc(6px + env(safe-area-inset-bottom,0px))}._item_muj3n_15{min-inline-size:0;max-inline-size:100%;color:var(--tgui--secondary_hint_color);background:0 0;border:none;flex-direction:column;flex:1 0 0;justify-content:center;align-items:center;gap:4px;margin:0;padding:10px 16px 14px;display:flex}._itemIos_muj3n_33{gap:3px;padding:7px 12px 2px}._itemSelected_muj3n_38{color:var(--tgui--link_color)}._icon_muj3n_42{border-radius:16px;justify-content:center;align-items:center;min-width:64px;height:32px;padding:2px 10px;display:flex}._itemIos_muj3n_33 ._icon_muj3n_42{min-width:0;height:28px;padding:0}._itemSelected_muj3n_38:not(._itemIos_muj3n_33) ._icon_muj3n_42{background:var(--tgui--secondary_fill)}._text_muj3n_62{white-space:nowrap;text-overflow:ellipsis;max-inline-size:100%;overflow:hidden}@media (prefers-reduced-motion:no-preference){._item_muj3n_15{transition:color .15s ease-out}._icon_muj3n_42{transition:background .15s ease-out}}
 /*$vite$:1*/

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "tguikit",
   "private": false,
-  "version": "0.1.0",
+  "version": "0.1.1",
   "type": "module",
   "description": "React 19 component library for Telegram Mini Apps — a modern reimplementation of @telegram-apps/telegram-ui.",
   "keywords": [
@@ -19,10 +19,10 @@
   "author": "Vladyslav Skrynnyk",
   "repository": {
     "type": "git",
-    "url": "git+https://github.com/alwaysgladtobethefirst/tgui.git"
+    "url": "git+https://github.com/alwaysgladtobethefirst/tguikit.git"
   },
-  "homepage": "https://alwaysgladtobethefirst.github.io/tgui/",
-  "bugs": "https://github.com/alwaysgladtobethefirst/tgui/issues",
+  "homepage": "https://github.com/alwaysgladtobethefirst/tguikit#readme",
+  "bugs": "https://github.com/alwaysgladtobethefirst/tguikit/issues",
   "sideEffects": [
     "**/*.css"
   ],