@webority/mobile-ui 0.0.39 → 0.1.0

package/lib/commonjs/theme/tokens.js

@@ -1,706 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.lightTheme = exports.darkTheme = void 0;
-const typography = {
-  fontSize: {
-    xs: 11,
-    sm: 13,
-    base: 15,
-    lg: 17,
-    xl: 20,
-    '2xl': 24,
-    '3xl': 30,
-    '4xl': 36
-  },
-  fontWeight: {
-    normal: '400',
-    medium: '500',
-    semibold: '600',
-    bold: '700'
-  },
-  lineHeight: {
-    tight: 1.2,
-    normal: 1.4,
-    relaxed: 1.6
-  },
-  letterSpacing: {
-    tight: -0.2,
-    normal: 0,
-    wide: 0.4
-  }
-};
-const spacing = {
-  none: 0,
-  xxs: 2,
-  xs: 4,
-  sm: 8,
-  md: 12,
-  lg: 16,
-  xl: 24,
-  '2xl': 32,
-  '3xl': 48,
-  '4xl': 64
-};
-const radius = {
-  none: 0,
-  xs: 4,
-  sm: 6,
-  md: 10,
-  lg: 14,
-  xl: 20,
-  '2xl': 28,
-  full: 9999
-};
-
-// The one corner radius shared by every rounded-rect field: Input (single-line
-// and multiline / textarea), Select, NumberInput, PickerTrigger — anything that
-// composes FieldBase and reads `components.field.<size>`. Change it here and it
-// changes everywhere those controls render. (SearchBar keeps its own pill
-// radius; OTP cells keep their own — those are deliberate per-component
-// overrides, not part of this shared value.)
-const FIELD_RADIUS = 10;
-
-// `field` tokens hold the canonical dimensions every input-like control
-// inherits via FieldBase. Heights, radii and padding ladders here are the
-// single source of truth — Input, Select, SearchBar, NumberInput, OTPInput
-// cell and PickerTrigger fall through to these unless their own component
-// tokens override. Fill / border colours resolve at theme-build time inside
-// the providers (which know `colors.*`) — these defaults are dimension-only.
-// `md` is the design spec measured 1:1 (a 240×44 box, 14px inset, 14px type,
-// 16px icons, 12px label 4dp above the box, 12px message 2dp below it; the type's own
-// line box adds a little more optically); `sm` / `lg` step
-// the same ladder down and up.
-const fieldSizes = {
-  sm: {
-    paddingHorizontal: 12,
-    paddingVertical: 10,
-    minHeight: 38,
-    fontSize: 13,
-    borderRadius: FIELD_RADIUS,
-    iconSize: 14,
-    labelFontSize: 11,
-    labelGap: 4,
-    messageFontSize: 11,
-    messageGap: 2
-  },
-  md: {
-    paddingHorizontal: 14,
-    paddingVertical: 13,
-    minHeight: 44,
-    fontSize: 14,
-    borderRadius: FIELD_RADIUS,
-    iconSize: 16,
-    labelFontSize: 12,
-    labelGap: 4,
-    messageFontSize: 12,
-    messageGap: 2
-  },
-  lg: {
-    paddingHorizontal: 16,
-    paddingVertical: 15,
-    minHeight: 52,
-    fontSize: 16,
-    borderRadius: FIELD_RADIUS,
-    iconSize: 18,
-    labelFontSize: 13,
-    labelGap: 4,
-    messageFontSize: 13,
-    messageGap: 2
-  }
-};
-const components = {
-  button: {
-    xs: {
-      paddingHorizontal: 10,
-      paddingVertical: 4,
-      minHeight: 28,
-      fontSize: 12,
-      borderRadius: 8
-    },
-    sm: {
-      paddingHorizontal: 12,
-      paddingVertical: 6,
-      minHeight: 34,
-      fontSize: 14,
-      borderRadius: 10
-    },
-    md: {
-      paddingHorizontal: 16,
-      paddingVertical: 9,
-      minHeight: 42,
-      fontSize: 16,
-      borderRadius: 12
-    },
-    lg: {
-      paddingHorizontal: 20,
-      paddingVertical: 12,
-      minHeight: 50,
-      fontSize: 18,
-      borderRadius: 14
-    },
-    xl: {
-      paddingHorizontal: 24,
-      paddingVertical: 14,
-      minHeight: 58,
-      fontSize: 20,
-      borderRadius: 16
-    }
-  },
-  input: {
-    // Mirrors `fieldSizes` (Input reads its dimensions through FieldBase's
-    // field tokens); `multilineMinHeight` is the one Input-only key.
-    sm: {
-      ...fieldSizes.sm,
-      multilineMinHeight: 72
-    },
-    md: {
-      ...fieldSizes.md,
-      multilineMinHeight: 92
-    },
-    lg: {
-      ...fieldSizes.lg,
-      multilineMinHeight: 110
-    }
-  },
-  searchBar: {
-    // Everything but the corner comes from `field.<size>`, so a SearchBar
-    // beside an Input of the same size shares its height, padding, font and
-    // icon. `borderRadius: radius.full` keeps the pill as the library
-    // default; brands wanting the rounded-rect shape override per size to
-    // match `field.<size>.borderRadius`.
-    sm: {
-      borderRadius: radius.full
-    },
-    md: {
-      borderRadius: radius.full
-    },
-    lg: {
-      borderRadius: radius.full
-    }
-  },
-  emptyState: {
-    sm: {
-      iconSize: 48,
-      titleFontSize: 'lg',
-      descriptionFontSize: 'sm',
-      paddingVertical: 'lg'
-    },
-    md: {
-      iconSize: 64,
-      titleFontSize: 'xl',
-      descriptionFontSize: 'base',
-      paddingVertical: 'xl'
-    },
-    lg: {
-      iconSize: 80,
-      titleFontSize: '2xl',
-      descriptionFontSize: 'base',
-      paddingVertical: '2xl'
-    }
-  },
-  field: {
-    defaultVariant: 'outlined',
-    sm: fieldSizes.sm,
-    md: fieldSizes.md,
-    lg: fieldSizes.lg
-    // Variant fill / border colours are filled in at theme-build time by the
-    // light/dark Theme objects below — they need access to `colors.*`.
-  },
-  listItem: {
-    sm: {
-      paddingVertical: 'sm',
-      titleFontSize: 'sm',
-      subtitleFontSize: 'xs',
-      minHeight: 44
-    },
-    md: {
-      paddingVertical: 'md',
-      titleFontSize: 'base',
-      subtitleFontSize: 'sm',
-      minHeight: 56
-    },
-    lg: {
-      paddingVertical: 'lg',
-      titleFontSize: 'lg',
-      subtitleFontSize: 'sm',
-      minHeight: 72
-    }
-  },
-  badge: {
-    sm: {
-      fontSize: 10,
-      minWidth: 16,
-      height: 16,
-      paddingHorizontal: 5,
-      dotSize: 8
-    },
-    md: {
-      fontSize: 11,
-      minWidth: 20,
-      height: 20,
-      paddingHorizontal: 6,
-      dotSize: 10
-    },
-    borderWidth: 1.5,
-    anchorOffset: 4
-  },
-  chip: {
-    sm: {
-      paddingHorizontal: 10,
-      paddingVertical: 4,
-      fontSize: 12,
-      minHeight: 26,
-      closeSize: 16,
-      closeFontSize: 12,
-      gap: 6
-    },
-    md: {
-      paddingHorizontal: 12,
-      paddingVertical: 6,
-      fontSize: 13,
-      minHeight: 32,
-      closeSize: 18,
-      closeFontSize: 13,
-      gap: 8
-    }
-  },
-  checkbox: {
-    sm: {
-      boxSize: 16
-    },
-    md: {
-      boxSize: 20
-    },
-    lg: {
-      boxSize: 24
-    },
-    labelGap: 10
-  },
-  radio: {
-    sm: {
-      outer: 16,
-      inner: 8
-    },
-    md: {
-      outer: 20,
-      inner: 10
-    },
-    lg: {
-      outer: 24,
-      inner: 12
-    },
-    labelGap: 10
-  },
-  switch: {
-    sm: {
-      trackWidth: 42,
-      trackHeight: 26,
-      thumbSize: 22,
-      padding: 2
-    },
-    md: {
-      trackWidth: 51,
-      trackHeight: 31,
-      thumbSize: 27,
-      padding: 2
-    },
-    lg: {
-      trackWidth: 60,
-      trackHeight: 36,
-      thumbSize: 32,
-      padding: 2
-    },
-    thumbColor: '#FFFFFF'
-  },
-  otpInput: {
-    sm: {
-      cell: 36,
-      fontSize: 16,
-      borderRadius: 8,
-      gap: 8
-    },
-    md: {
-      cell: 48,
-      fontSize: 20,
-      borderRadius: 10,
-      gap: 10
-    },
-    lg: {
-      cell: 56,
-      fontSize: 24,
-      borderRadius: 12,
-      gap: 12
-    }
-  },
-  dialog: {
-    iconWrapperSize: 48,
-    iconWrapperBorderRadius: 24,
-    actionButtonMinHeight: 44
-  },
-  toast: {
-    iconCircleSize: 28,
-    iconCircleBorderRadius: 14,
-    iconGlyphFontSize: 16,
-    tintBarWidth: 4
-  },
-  formField: {
-    inlineLabelWidth: '35%'
-  }
-};
-const motion = {
-  duration: {
-    instant: 80,
-    fast: 160,
-    normal: 240,
-    slow: 360,
-    slower: 500
-  },
-  easing: {
-    standard: [0.4, 0.0, 0.2, 1],
-    accelerate: [0.4, 0.0, 1, 1],
-    decelerate: [0.0, 0.0, 0.2, 1],
-    sharp: [0.4, 0.0, 0.6, 1]
-  },
-  /**
-   * Springs run at sub-1 mass on purpose. Mass is the lever that decides
-   * whether motion reads as "responsive" or "floaty", and leaving it at 1 (the
-   * RN default) is what makes an otherwise correct animation feel slow. Higher
-   * stiffness with lighter mass settles faster without losing the spring.
-   *
-   * The asymmetry rule: OPEN with a spring from this scale, CLOSE with
-   * `Animated.timing` at `duration.fast` and `easing.accelerate`. A spring on
-   * the way out re-reads as hesitation — the element should leave decisively.
-   */
-  spring: {
-    gentle: {
-      damping: 26,
-      stiffness: 240,
-      mass: 0.9
-    },
-    bouncy: {
-      damping: 16,
-      stiffness: 200,
-      mass: 0.7
-    },
-    snappy: {
-      damping: 20,
-      stiffness: 300,
-      mass: 0.7
-    }
-  }
-};
-const lightShadows = {
-  none: {},
-  xs: {
-    shadowColor: '#000',
-    shadowOffset: {
-      width: 0,
-      height: 1
-    },
-    shadowOpacity: 0.04,
-    shadowRadius: 2,
-    elevation: 1
-  },
-  sm: {
-    shadowColor: '#000',
-    shadowOffset: {
-      width: 0,
-      height: 2
-    },
-    shadowOpacity: 0.06,
-    shadowRadius: 4,
-    elevation: 2
-  },
-  md: {
-    shadowColor: '#000',
-    shadowOffset: {
-      width: 0,
-      height: 4
-    },
-    shadowOpacity: 0.08,
-    shadowRadius: 8,
-    elevation: 4
-  },
-  lg: {
-    shadowColor: '#000',
-    shadowOffset: {
-      width: 0,
-      height: 8
-    },
-    shadowOpacity: 0.1,
-    shadowRadius: 16,
-    elevation: 8
-  },
-  xl: {
-    shadowColor: '#000',
-    shadowOffset: {
-      width: 0,
-      height: 12
-    },
-    shadowOpacity: 0.14,
-    shadowRadius: 24,
-    elevation: 12
-  },
-  '2xl': {
-    shadowColor: '#000',
-    shadowOffset: {
-      width: 0,
-      height: 20
-    },
-    shadowOpacity: 0.18,
-    shadowRadius: 32,
-    elevation: 20
-  }
-};
-const darkShadows = {
-  none: {},
-  xs: {
-    shadowColor: '#000',
-    shadowOffset: {
-      width: 0,
-      height: 1
-    },
-    shadowOpacity: 0.3,
-    shadowRadius: 2,
-    elevation: 1
-  },
-  sm: {
-    shadowColor: '#000',
-    shadowOffset: {
-      width: 0,
-      height: 2
-    },
-    shadowOpacity: 0.4,
-    shadowRadius: 4,
-    elevation: 2
-  },
-  md: {
-    shadowColor: '#000',
-    shadowOffset: {
-      width: 0,
-      height: 4
-    },
-    shadowOpacity: 0.5,
-    shadowRadius: 8,
-    elevation: 4
-  },
-  lg: {
-    shadowColor: '#000',
-    shadowOffset: {
-      width: 0,
-      height: 8
-    },
-    shadowOpacity: 0.55,
-    shadowRadius: 16,
-    elevation: 8
-  },
-  xl: {
-    shadowColor: '#000',
-    shadowOffset: {
-      width: 0,
-      height: 12
-    },
-    shadowOpacity: 0.6,
-    shadowRadius: 24,
-    elevation: 12
-  },
-  '2xl': {
-    shadowColor: '#000',
-    shadowOffset: {
-      width: 0,
-      height: 20
-    },
-    shadowOpacity: 0.7,
-    shadowRadius: 32,
-    elevation: 20
-  }
-};
-const lightTheme = exports.lightTheme = {
-  mode: 'light',
-  colors: {
-    primary: '#5B5BD6',
-    primaryHover: '#4F4FBF',
-    primaryPressed: '#4040A8',
-    primaryMuted: '#EEEEFC',
-    secondary: '#F4F4F8',
-    secondaryHover: '#E9E9F0',
-    success: '#1FAD66',
-    warning: '#F59E0B',
-    error: '#E5484D',
-    info: '#3B82F6',
-    onPrimary: '#FFFFFF',
-    onSecondary: '#0F0F1A',
-    onSuccess: '#FFFFFF',
-    onWarning: '#0F0F1A',
-    onError: '#FFFFFF',
-    onInfo: '#FFFFFF',
-    text: {
-      primary: '#0F0F1A',
-      secondary: '#52525B',
-      tertiary: '#8B8B95',
-      inverse: '#FFFFFF',
-      disabled: '#B4B4BB',
-      link: '#5B5BD6'
-    },
-    background: {
-      primary: '#FFFFFF',
-      secondary: '#F8F8FB',
-      tertiary: '#F1F1F5',
-      elevated: '#FFFFFF',
-      overlay: 'rgba(15, 15, 26, 0.5)',
-      inverse: '#0F0F1A'
-    },
-    border: {
-      primary: '#E5E5EC',
-      secondary: '#EFEFF3',
-      focus: '#5B5BD6',
-      error: '#E5484D',
-      width: 1
-    },
-    // Sampled 1:1 from the Input design spec (Default / Active / Filled /
-    // Disabled / Error columns), not derived from the brand tones: the field
-    // family sits on a cool near-white with a soft blue focus ring and a
-    // pink error ring, while the brand stays on `primary`.
-    field: {
-      background: '#F9FBFC',
-      backgroundFocused: '#FFFFFF',
-      backgroundDisabled: '#F5F6FA',
-      border: '#EBEDF3',
-      borderFocused: '#BED2F9',
-      borderError: '#FDBFCE',
-      label: '#242F4A',
-      text: '#252F4A',
-      textDisabled: '#C4CADA',
-      placeholder: '#99A1B7',
-      placeholderDisabled: '#C4CADA',
-      icon: '#99A1B7',
-      iconFocused: '#4B5675',
-      iconDisabled: '#C4CADA',
-      caret: '#5B8DEE',
-      message: '#E82545'
-    },
-    surface: {
-      pressed: 'rgba(15, 15, 26, 0.06)',
-      hovered: 'rgba(15, 15, 26, 0.04)',
-      selected: 'rgba(91, 91, 214, 0.1)',
-      disabled: '#F1F1F5'
-    },
-    // Same in both schemes: the surface under a glass control is the brand
-    // colour, not the page. See `Theme.colors.glass`.
-    glass: {
-      fill: 'rgba(255, 255, 255, 0.28)',
-      border: 'rgba(255, 255, 255, 0.45)',
-      on: '#0F0F1A',
-      badge: '#FFFFFF'
-    },
-    skeleton: {
-      background: '#EBEDF3',
-      highlight: '#F5F6FA'
-    },
-    // Held to one contrast standard: every hue lands in a 5.2:1-5.7:1 band
-    // against the white initials, so no single avatar colour is the weak one.
-    // Index order is load-bearing — it is what keeps a given user's colour stable.
-    avatarPalette: ['#5B5BD6', '#0A7979', '#A45A05', '#CD226E', '#2462EB', '#7C3AED', '#047C57', '#D42222']
-  },
-  typography,
-  spacing,
-  radius,
-  shadows: lightShadows,
-  motion,
-  components,
-  gradients: {}
-};
-const darkTheme = exports.darkTheme = {
-  mode: 'dark',
-  colors: {
-    primary: '#7C7CE8',
-    primaryHover: '#9292EE',
-    primaryPressed: '#A8A8F2',
-    primaryMuted: '#1F1F3D',
-    secondary: '#1F1F26',
-    secondaryHover: '#2A2A33',
-    success: '#30C780',
-    warning: '#FBBF24',
-    error: '#F87171',
-    info: '#60A5FA',
-    onPrimary: '#0F0F1A',
-    onSecondary: '#FAFAFA',
-    onSuccess: '#0F0F1A',
-    onWarning: '#0F0F1A',
-    onError: '#0F0F1A',
-    onInfo: '#0F0F1A',
-    text: {
-      primary: '#FAFAFA',
-      secondary: '#B4B4BB',
-      tertiary: '#71717A',
-      inverse: '#0F0F1A',
-      disabled: '#52525B',
-      link: '#9292EE'
-    },
-    background: {
-      primary: '#0B0B12',
-      secondary: '#13131C',
-      tertiary: '#1C1C26',
-      elevated: '#1C1C26',
-      overlay: 'rgba(0, 0, 0, 0.65)',
-      inverse: '#FAFAFA'
-    },
-    border: {
-      primary: '#27272F',
-      secondary: '#1C1C26',
-      focus: '#7C7CE8',
-      error: '#F87171',
-      width: 1
-    },
-    // Dark counterpart of the light field palette: the same roles, inverted
-    // against the dark surfaces (no dark design spec exists; these keep the
-    // light spec's contrast relationships).
-    field: {
-      background: '#13131C',
-      backgroundFocused: '#0B0B12',
-      backgroundDisabled: '#1C1C26',
-      border: '#27272F',
-      borderFocused: '#3D5FB0',
-      borderError: '#8A2F42',
-      label: '#E4E6EE',
-      text: '#FAFAFA',
-      textDisabled: '#52525B',
-      placeholder: '#71717A',
-      placeholderDisabled: '#52525B',
-      icon: '#8B8B95',
-      iconFocused: '#D4D4DB',
-      iconDisabled: '#52525B',
-      caret: '#7C9EF0',
-      message: '#F87171'
-    },
-    surface: {
-      pressed: 'rgba(255, 255, 255, 0.08)',
-      hovered: 'rgba(255, 255, 255, 0.05)',
-      selected: 'rgba(124, 124, 232, 0.18)',
-      disabled: '#1C1C26'
-    },
-    // Deliberately identical to the light theme; see `Theme.colors.glass`.
-    glass: {
-      fill: 'rgba(255, 255, 255, 0.28)',
-      border: 'rgba(255, 255, 255, 0.45)',
-      on: '#0F0F1A',
-      badge: '#FFFFFF'
-    },
-    skeleton: {
-      background: '#1C1C26',
-      highlight: '#27272F'
-    },
-    avatarPalette: ['#8B8BEE', '#2DD4BF', '#FCD34D', '#F472B6', '#60A5FA', '#A78BFA', '#34D399', '#F87171']
-  },
-  typography,
-  spacing,
-  radius,
-  shadows: darkShadows,
-  motion,
-  components,
-  gradients: {}
-};
-//# sourceMappingURL=tokens.js.map
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),exports.lightTheme=exports.darkTheme=void 0;const typography={fontSize:{xs:11,sm:13,base:15,lg:17,xl:20,"2xl":24,"3xl":30,"4xl":36},fontWeight:{normal:"400",medium:"500",semibold:"600",bold:"700"},lineHeight:{tight:1.2,normal:1.4,relaxed:1.6},letterSpacing:{tight:-.2,normal:0,wide:.4}},spacing={none:0,xxs:2,xs:4,sm:8,md:12,lg:16,xl:24,"2xl":32,"3xl":48,"4xl":64},radius={none:0,xs:4,sm:6,md:10,lg:14,xl:20,"2xl":28,full:9999},FIELD_RADIUS=10,fieldSizes={sm:{paddingHorizontal:12,paddingVertical:10,minHeight:38,fontSize:13,borderRadius:10,iconSize:14,labelFontSize:11,labelGap:4,messageFontSize:11,messageGap:2},md:{paddingHorizontal:14,paddingVertical:13,minHeight:44,fontSize:14,borderRadius:10,iconSize:16,labelFontSize:12,labelGap:4,messageFontSize:12,messageGap:2},lg:{paddingHorizontal:16,paddingVertical:15,minHeight:52,fontSize:16,borderRadius:10,iconSize:18,labelFontSize:13,labelGap:4,messageFontSize:13,messageGap:2}},components={button:{xs:{paddingHorizontal:10,paddingVertical:4,minHeight:28,fontSize:12,borderRadius:8},sm:{paddingHorizontal:12,paddingVertical:6,minHeight:34,fontSize:14,borderRadius:10},md:{paddingHorizontal:16,paddingVertical:9,minHeight:42,fontSize:16,borderRadius:12},lg:{paddingHorizontal:20,paddingVertical:12,minHeight:50,fontSize:18,borderRadius:14},xl:{paddingHorizontal:24,paddingVertical:14,minHeight:58,fontSize:20,borderRadius:16}},input:{sm:{...fieldSizes.sm,multilineMinHeight:72},md:{...fieldSizes.md,multilineMinHeight:92},lg:{...fieldSizes.lg,multilineMinHeight:110}},searchBar:{sm:{borderRadius:radius.full},md:{borderRadius:radius.full},lg:{borderRadius:radius.full}},emptyState:{sm:{iconSize:48,titleFontSize:"lg",descriptionFontSize:"sm",paddingVertical:"lg"},md:{iconSize:64,titleFontSize:"xl",descriptionFontSize:"base",paddingVertical:"xl"},lg:{iconSize:80,titleFontSize:"2xl",descriptionFontSize:"base",paddingVertical:"2xl"}},field:{defaultVariant:"outlined",sm:fieldSizes.sm,md:fieldSizes.md,lg:fieldSizes.lg},listItem:{sm:{paddingVertical:"sm",titleFontSize:"sm",subtitleFontSize:"xs",minHeight:44},md:{paddingVertical:"md",titleFontSize:"base",subtitleFontSize:"sm",minHeight:56},lg:{paddingVertical:"lg",titleFontSize:"lg",subtitleFontSize:"sm",minHeight:72}},badge:{sm:{fontSize:10,minWidth:16,height:16,paddingHorizontal:5,dotSize:8},md:{fontSize:11,minWidth:20,height:20,paddingHorizontal:6,dotSize:10},borderWidth:1.5,anchorOffset:4},chip:{sm:{paddingHorizontal:10,paddingVertical:4,fontSize:12,minHeight:26,closeSize:16,closeFontSize:12,gap:6},md:{paddingHorizontal:12,paddingVertical:6,fontSize:13,minHeight:32,closeSize:18,closeFontSize:13,gap:8}},checkbox:{sm:{boxSize:16},md:{boxSize:20},lg:{boxSize:24},labelGap:10},radio:{sm:{outer:16,inner:8},md:{outer:20,inner:10},lg:{outer:24,inner:12},labelGap:10},switch:{sm:{trackWidth:42,trackHeight:26,thumbSize:22,padding:2},md:{trackWidth:51,trackHeight:31,thumbSize:27,padding:2},lg:{trackWidth:60,trackHeight:36,thumbSize:32,padding:2},thumbColor:"#FFFFFF"},otpInput:{sm:{cell:36,fontSize:16,borderRadius:8,gap:8},md:{cell:48,fontSize:20,borderRadius:10,gap:10},lg:{cell:56,fontSize:24,borderRadius:12,gap:12}},dialog:{iconWrapperSize:48,iconWrapperBorderRadius:24,actionButtonMinHeight:44},toast:{iconCircleSize:28,iconCircleBorderRadius:14,iconGlyphFontSize:16,tintBarWidth:4},formField:{inlineLabelWidth:"35%"}},motion={duration:{instant:80,fast:160,normal:240,slow:360,slower:500},easing:{standard:[.4,0,.2,1],accelerate:[.4,0,1,1],decelerate:[0,0,.2,1],sharp:[.4,0,.6,1]},spring:{gentle:{damping:26,stiffness:240,mass:.9},bouncy:{damping:16,stiffness:200,mass:.7},snappy:{damping:20,stiffness:300,mass:.7}}},lightShadows={none:{},xs:{shadowColor:"#000",shadowOffset:{width:0,height:1},shadowOpacity:.04,shadowRadius:2,elevation:1},sm:{shadowColor:"#000",shadowOffset:{width:0,height:2},shadowOpacity:.06,shadowRadius:4,elevation:2},md:{shadowColor:"#000",shadowOffset:{width:0,height:4},shadowOpacity:.08,shadowRadius:8,elevation:4},lg:{shadowColor:"#000",shadowOffset:{width:0,height:8},shadowOpacity:.1,shadowRadius:16,elevation:8},xl:{shadowColor:"#000",shadowOffset:{width:0,height:12},shadowOpacity:.14,shadowRadius:24,elevation:12},"2xl":{shadowColor:"#000",shadowOffset:{width:0,height:20},shadowOpacity:.18,shadowRadius:32,elevation:20}},darkShadows={none:{},xs:{shadowColor:"#000",shadowOffset:{width:0,height:1},shadowOpacity:.3,shadowRadius:2,elevation:1},sm:{shadowColor:"#000",shadowOffset:{width:0,height:2},shadowOpacity:.4,shadowRadius:4,elevation:2},md:{shadowColor:"#000",shadowOffset:{width:0,height:4},shadowOpacity:.5,shadowRadius:8,elevation:4},lg:{shadowColor:"#000",shadowOffset:{width:0,height:8},shadowOpacity:.55,shadowRadius:16,elevation:8},xl:{shadowColor:"#000",shadowOffset:{width:0,height:12},shadowOpacity:.6,shadowRadius:24,elevation:12},"2xl":{shadowColor:"#000",shadowOffset:{width:0,height:20},shadowOpacity:.7,shadowRadius:32,elevation:20}},lightTheme=exports.lightTheme={mode:"light",colors:{primary:"#5B5BD6",primaryHover:"#4F4FBF",primaryPressed:"#4040A8",primaryMuted:"#EEEEFC",secondary:"#F4F4F8",secondaryHover:"#E9E9F0",success:"#1FAD66",warning:"#F59E0B",error:"#E5484D",info:"#3B82F6",onPrimary:"#FFFFFF",onSecondary:"#0F0F1A",onSuccess:"#FFFFFF",onWarning:"#0F0F1A",onError:"#FFFFFF",onInfo:"#FFFFFF",onOverlay:"#FFFFFF",text:{primary:"#0F0F1A",secondary:"#52525B",tertiary:"#8B8B95",inverse:"#FFFFFF",strong:"#252F4A",disabled:"#B4B4BB",link:"#5B5BD6"},background:{primary:"#FFFFFF",secondary:"#F8F8FB",tertiary:"#F1F1F5",elevated:"#FFFFFF",overlay:"rgba(15, 15, 26, 0.5)",inverse:"#0F0F1A"},border:{primary:"#E5E5EC",secondary:"#EFEFF3",focus:"#5B5BD6",error:"#E5484D",width:1},field:{background:"#F9FBFC",backgroundFocused:"#FFFFFF",backgroundDisabled:"#F5F6FA",border:"#EBEDF3",borderFocused:"#BED2F9",borderError:"#FDBFCE",label:"#242F4A",text:"#252F4A",textDisabled:"#C4CADA",placeholder:"#99A1B7",placeholderDisabled:"#C4CADA",icon:"#99A1B7",iconFocused:"#4B5675",iconDisabled:"#C4CADA",caret:"#5B8DEE",message:"#E82545"},surface:{pressed:"rgba(15, 15, 26, 0.06)",hovered:"rgba(15, 15, 26, 0.04)",selected:"rgba(91, 91, 214, 0.1)",disabled:"#F1F1F5"},glass:{fill:"rgba(255, 255, 255, 0.28)",border:"rgba(255, 255, 255, 0.45)",on:"#0F0F1A",badge:"#FFFFFF"},skeleton:{background:"#EBEDF3",highlight:"#F5F6FA"},avatarPalette:["#5B5BD6","#0A7979","#A45A05","#CD226E","#2462EB","#7C3AED","#047C57","#D42222"]},typography:typography,spacing:spacing,radius:radius,shadows:lightShadows,motion:motion,components:components,gradients:{}},darkTheme=exports.darkTheme={mode:"dark",colors:{primary:"#7C7CE8",primaryHover:"#9292EE",primaryPressed:"#A8A8F2",primaryMuted:"#1F1F3D",secondary:"#1F1F26",secondaryHover:"#2A2A33",success:"#30C780",warning:"#FBBF24",error:"#F87171",info:"#60A5FA",onPrimary:"#0F0F1A",onSecondary:"#FAFAFA",onSuccess:"#0F0F1A",onWarning:"#0F0F1A",onError:"#0F0F1A",onInfo:"#0F0F1A",onOverlay:"#FFFFFF",text:{primary:"#FAFAFA",secondary:"#B4B4BB",tertiary:"#71717A",inverse:"#0F0F1A",strong:"#E2E2E2",disabled:"#52525B",link:"#9292EE"},background:{primary:"#0B0B12",secondary:"#13131C",tertiary:"#1C1C26",elevated:"#1C1C26",overlay:"rgba(0, 0, 0, 0.65)",inverse:"#FAFAFA"},border:{primary:"#27272F",secondary:"#1C1C26",focus:"#7C7CE8",error:"#F87171",width:1},field:{background:"#13131C",backgroundFocused:"#0B0B12",backgroundDisabled:"#1C1C26",border:"#27272F",borderFocused:"#3D5FB0",borderError:"#8A2F42",label:"#E4E6EE",text:"#FAFAFA",textDisabled:"#52525B",placeholder:"#71717A",placeholderDisabled:"#52525B",icon:"#8B8B95",iconFocused:"#D4D4DB",iconDisabled:"#52525B",caret:"#7C9EF0",message:"#F87171"},surface:{pressed:"rgba(255, 255, 255, 0.08)",hovered:"rgba(255, 255, 255, 0.05)",selected:"rgba(124, 124, 232, 0.18)",disabled:"#1C1C26"},glass:{fill:"rgba(255, 255, 255, 0.28)",border:"rgba(255, 255, 255, 0.45)",on:"#0F0F1A",badge:"#FFFFFF"},skeleton:{background:"#1C1C26",highlight:"#27272F"},avatarPalette:["#8B8BEE","#2DD4BF","#FCD34D","#F472B6","#60A5FA","#A78BFA","#34D399","#F87171"]},typography:typography,spacing:spacing,radius:radius,shadows:darkShadows,motion:motion,components:components,gradients:{}};