@razorpay/blade 9.6.1 → 10.0.0

package/build/utils/index.native.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.native.js","sources":["../../src/utils/getColorScheme/getColorScheme.native.ts","../../src/utils/getMediaQuery/getMediaQuery.ts","../../src/utils/getPlatformType/getPlatformType.ts","../../src/utils/useBreakpoint/useBreakpoint.ts","../../src/tokens/theme/theme.ts","../../src/utils/logger/logger.ts","../../src/utils/useColorScheme/useColorScheme.ts","../../src/utils/platform/isReactNative.ts","../../src/utils/platform/getOS.native.ts","../../src/utils/platform/platform.native.ts","../../src/utils/platform/castUtils.ts","../../src/utils/makeBorderSize/makeBorderSize.ts","../../src/utils/makeMotionTime/makeMotionTime.native.ts","../../src/utils/makeSpace/makeSpace.ts","../../src/utils/makeTypographySize/makeTypographySize.native.ts","../../src/utils/makeSize/makeSize.ts","../../src/utils/toTitleCase/toTitleCase.ts","../../src/utils/usePrevious/usePrevious.ts","../../src/components/BladeProvider/useTheme.ts"],"sourcesContent":["import { Appearance } from 'react-native';\nimport type { ColorSchemeNames, ColorSchemeNamesInput } from '~tokens/theme';\n\nexport const getColorScheme = (colorScheme: ColorSchemeNamesInput = 'light'): ColorSchemeNames => {\n  // @TODO: convert this to hook as Appearance API also adds an eventListener which subscribes to the colorscheme changes on the device\n  if (colorScheme === 'light' || colorScheme === 'dark') {\n    return colorScheme;\n  }\n\n  if (colorScheme === 'system') {\n    return Appearance.getColorScheme() ?? 'light';\n  }\n\n  return 'light';\n};\n","export const getMediaQuery = ({ min, max }: { min: number; max?: number }): string => {\n  return `screen and (min-width: ${min}px)${max ? ` and (max-width: ${max}px)` : ''}`;\n};\n","export type PlatformTypes = 'browser' | 'node' | 'react-native' | 'unknown';\n\nexport const getPlatformType = (): PlatformTypes => {\n  if (typeof navigator !== 'undefined' && navigator.product === 'ReactNative') {\n    return 'react-native';\n  }\n\n  if (typeof document !== 'undefined') {\n    return 'browser';\n  }\n\n  if (typeof process !== 'undefined') {\n    return 'node';\n  }\n\n  return 'unknown';\n};\n","/* eslint-disable @typescript-eslint/restrict-plus-operands */\nimport { useEffect, useState, useCallback, useMemo } from 'react';\nimport { getPlatformType } from '../getPlatformType';\nimport { getMediaQuery } from '../getMediaQuery';\nimport type { Breakpoints } from '~tokens/global';\n\nconst deviceType = {\n  desktop: 'desktop',\n  mobile: 'mobile',\n} as const;\n\ntype DeviceType = keyof typeof deviceType;\ntype Breakpoint = keyof Breakpoints | undefined;\n\ntype BreakpointAndDevice = {\n  matchedBreakpoint: Breakpoint;\n  matchedDeviceType: DeviceType;\n};\n\nexport const useBreakpoint = ({\n  breakpoints,\n}: {\n  breakpoints: Breakpoints;\n}): BreakpointAndDevice => {\n  const supportsMatchMedia =\n    typeof document !== 'undefined' &&\n    typeof window !== 'undefined' &&\n    typeof window?.matchMedia === 'function';\n\n  const breakpointsTokenAndQueryCollection = useMemo(\n    () =>\n      (supportsMatchMedia\n        ? Object.entries(breakpoints).map(([token, screenSize], index, breakpointsArray) => {\n            const min = screenSize;\n            const maxValue = breakpointsArray[index + 1]?.[1];\n            const mediaQuery = getMediaQuery({ min, max: maxValue ? maxValue - 1 : undefined });\n            return { token, screenSize, mediaQuery };\n          })\n        : []) as {\n        token: keyof Breakpoints;\n        screenSize: number;\n        mediaQuery: string;\n      }[],\n    [breakpoints, supportsMatchMedia],\n  );\n\n  const getMatchedDeviceType = useCallback((matchedBreakpoint: Breakpoint): DeviceType => {\n    let matchedDeviceType: DeviceType = deviceType.mobile;\n    const platform = getPlatformType();\n    if (platform === 'react-native') {\n      matchedDeviceType = deviceType.mobile;\n    } else if (platform === 'browser') {\n      if (matchedBreakpoint && ['base', 'xs', 's'].includes(matchedBreakpoint)) {\n        // tablet is also categorised as mobile\n        matchedDeviceType = deviceType.mobile;\n      } else {\n        matchedDeviceType = deviceType.desktop;\n      }\n    } else if (platform === 'node') {\n      //@TODO: Check for useragent for node\n      matchedDeviceType = deviceType.desktop;\n    }\n    return matchedDeviceType;\n  }, []);\n\n  const getMatchedBreakpoint = useCallback(\n    (event?: MediaQueryListEvent): Breakpoint => {\n      const matchedBreakpoint =\n        breakpointsTokenAndQueryCollection.find(({ mediaQuery = '' }) => {\n          // this will run whenever mediaQuery change event is triggered\n          if (event?.media === mediaQuery) {\n            return true;\n          }\n          // this will run when the state is initialised for the first time and hence the event object will be empty so we'll fallback to browser's window object\n          if (window.matchMedia(mediaQuery).matches) {\n            return true;\n          }\n          return false;\n        })?.token ?? undefined;\n\n      return matchedBreakpoint;\n    },\n    [breakpointsTokenAndQueryCollection],\n  );\n\n  const [breakpointAndDevice, setBreakpointAndDevice] = useState(() => {\n    const matchedBreakpoint = getMatchedBreakpoint();\n    const matchedDeviceType = getMatchedDeviceType(matchedBreakpoint);\n    return {\n      matchedBreakpoint,\n      matchedDeviceType,\n    };\n  });\n\n  useEffect(() => {\n    if (!supportsMatchMedia) {\n      return undefined;\n    }\n\n    const handleMediaQueryChange = (event: MediaQueryListEvent): void => {\n      setBreakpointAndDevice(() => {\n        const matchedBreakpoint = getMatchedBreakpoint(event);\n        const matchedDeviceType = getMatchedDeviceType(matchedBreakpoint);\n\n        return { matchedBreakpoint, matchedDeviceType };\n      });\n    };\n\n    const mediaQueryInstances = breakpointsTokenAndQueryCollection.map(({ mediaQuery = '' }) => {\n      const mediaQueryInstance = window.matchMedia(mediaQuery);\n      /**\n       * the mediaquery event listener is available on mediaQuery instances and not `window`\n       * we iterate over all the breakpoints we have, register each instance and store them as `mediaQueryInstances` so we can later unregister all of them.\n       */\n      if (mediaQueryInstance.addEventListener) {\n        mediaQueryInstance.addEventListener('change', handleMediaQueryChange);\n      } else {\n        // In older browsers MediaQueryList do not yet inherit from EventTarget, So using addListener as fallback - https://developer.mozilla.org/en-US/docs/Web/API/MediaQueryList/addListener\n        mediaQueryInstance.addListener(handleMediaQueryChange);\n      }\n      return mediaQueryInstance;\n    });\n\n    return (): void => {\n      mediaQueryInstances.forEach((mediaQueryInstance) => {\n        if (mediaQueryInstance.removeEventListener) {\n          mediaQueryInstance.removeEventListener('change', handleMediaQueryChange);\n        } else {\n          // In older browsers MediaQueryList do not yet inherit from EventTarget, So using removeListener as fallback - https://developer.mozilla.org/en-US/docs/Web/API/MediaQueryList/removeListener\n          mediaQueryInstance.removeListener(handleMediaQueryChange);\n        }\n      });\n    };\n  }, [\n    breakpointsTokenAndQueryCollection,\n    getMatchedBreakpoint,\n    getMatchedDeviceType,\n    supportsMatchMedia,\n  ]);\n\n  // @TODO: handle SSR scenarios\n  return breakpointAndDevice;\n};\n","import type { StringWithAutocomplete } from '~utils/types';\nimport type {\n  Border,\n  Breakpoints,\n  Motion,\n  Spacing,\n  TypographyWithPlatforms,\n  ElevationWithColorModes,\n} from '~tokens/global';\n\nexport type ColorSchemeNames = 'dark' | 'light';\nexport type ColorSchemeNamesInput = ColorSchemeNames | 'system';\n\nexport type ColorSchemeModes = 'onDark' | 'onLight';\n\nexport type TextTypes = 'muted' | 'normal' | 'placeholder' | 'subdued' | 'subtle';\n\nexport type ColorContrastTypes = 'low' | 'high';\n\nexport type Feedback = 'information' | 'negative' | 'neutral' | 'notice' | 'positive';\n\nexport type ColorContrast = {\n  [K in ColorContrastTypes as `${Extract<K, string>}Contrast`]: string;\n};\n\n// @TODO: this shall rather be Surface = 'level1' | 'level2' | 'level3' to keep in sync with color tokens\nexport type SurfaceLevels = 1 | 2 | 3;\n\nexport type ActionStates = {\n  default: string;\n  hover: string;\n  focus: string;\n  active: string;\n  disabled: string;\n};\n\nexport type LinkActionStates = ActionStates & {\n  visited: string;\n};\n\nexport type ActionStatesWithContrast = {\n  default: ColorContrast;\n  hover: ColorContrast;\n  focus: ColorContrast;\n  active: ColorContrast;\n  disabled: ColorContrast;\n};\n\nexport type LinkActionStatesWithContrast = ActionStatesWithContrast & {\n  visited: ColorContrast;\n};\n\nexport type ActionVariants = {\n  primary: ActionStates;\n  secondary: ActionStates;\n  tertiary: ActionStates;\n  link: LinkActionStates;\n};\n\nexport type ActionVariantsWithContrast = {\n  primary: ActionStatesWithContrast;\n  secondary: ActionStatesWithContrast;\n  tertiary: ActionStatesWithContrast;\n  link: ActionStatesWithContrast;\n};\n\n// export type ActionProperties = {\n//   background: ActionVariants;\n//   border: ActionVariants;\n//   text: ActionVariants;\n//   icon: ActionVariants;\n// };\n\nexport type FeedbackActions = {\n  background: Pick<ActionVariantsWithContrast, 'primary'>;\n  border: Pick<ActionVariantsWithContrast, 'primary'>;\n  text: Pick<ActionVariantsWithContrast, 'link' | 'primary'>;\n  icon: Pick<ActionVariantsWithContrast, 'link' | 'primary'>;\n};\n\nexport type Colors = {\n  brand: {\n    primary: Record<300 | 400 | 500 | 600 | 700 | 800, string>;\n    secondary: Record<500, string>;\n    gray: Record<200 | 300 | 400 | 500 | 600 | 700 | 'a50' | 'a100', ColorContrast>;\n  };\n  feedback: {\n    background: Record<Feedback, ColorContrast>;\n    border: Record<Feedback, ColorContrast>;\n    text: Record<Feedback, ColorContrast>;\n    icon: Record<Feedback, ColorContrast>;\n    positive: {\n      action: FeedbackActions;\n    };\n    negative: {\n      action: FeedbackActions;\n    };\n    information: {\n      action: FeedbackActions;\n    };\n    notice: {\n      action: FeedbackActions;\n    };\n    neutral: {\n      action: FeedbackActions;\n    };\n  };\n  surface: {\n    background: Record<'level1' | 'level2' | 'level3', ColorContrast>;\n    border: Record<'normal' | 'subtle', ColorContrast>;\n    text: Record<TextTypes, ColorContrast>;\n    action: {\n      icon: ActionStatesWithContrast;\n    };\n  };\n  overlay: Record<'background', string>;\n  action: {\n    background: Omit<ActionVariants, 'link'>;\n    border: Omit<ActionVariants, 'link'>;\n    text: ActionVariants;\n    icon: ActionVariants;\n  };\n  badge: {\n    background: {\n      blue: ColorContrast;\n    };\n    border: {\n      blue: ColorContrast;\n    };\n    text: {\n      blue: ColorContrast;\n    };\n    icon: {\n      blue: ColorContrast;\n    };\n  };\n};\n\nexport type ColorsWithModes = Record<ColorSchemeModes, Colors>;\n\nexport type ThemeTokens = {\n  name: 'paymentTheme' | 'bankingTheme' | StringWithAutocomplete; // Can be used to watch over state changes between theme without watching over entire theme object\n  border: Border;\n  breakpoints: Breakpoints;\n  colors: ColorsWithModes;\n  motion: Motion;\n  elevation: ElevationWithColorModes;\n  spacing: Spacing;\n  typography: TypographyWithPlatforms;\n};\n\nexport type SpacingValues = `${Spacing[keyof Spacing]}px`;\nexport type BorderWidthValues = `${Border['width'][keyof Border['width']]}px`;\nexport type BorderRadiusValues =\n  | `${Border['radius'][Exclude<keyof Border['radius'], 'round'>]}px`\n  | `${Border['radius'][Extract<keyof Border['radius'], 'round'>]}`;\n\nexport const colorSchemeNamesInput: ColorSchemeNamesInput[] = ['light', 'dark', 'system'];\n","type LogType = 'error' | 'warn' | 'log';\n\ntype LoggerOptions = {\n  message: string;\n  moduleName?: string;\n  type: LogType;\n};\n\ntype ThrowBladeErrorOptions = {\n  message: string;\n  moduleName?: string;\n};\n\nconst PREFIX = '[Blade]:';\n\nconst throwBladeError = ({ message, moduleName }: ThrowBladeErrorOptions): void | never => {\n  if (__DEV__) {\n    const prefix = moduleName ? `[Blade: ${moduleName}]:` : PREFIX;\n    throw new Error(`${prefix} ${message}`);\n  }\n};\n\nconst getCommonLogger = (\n  type: LogType,\n): typeof console.log | typeof console.error | typeof console.warn => {\n  switch (type) {\n    case 'error':\n      return console.error;\n    case 'warn':\n      return console.warn;\n    case 'log':\n    default:\n      return console.log;\n  }\n};\n\nconst logger = ({ message, moduleName, type }: LoggerOptions): void => {\n  if (__DEV__) {\n    const prefix = moduleName ? `[Blade: ${moduleName}]:` : PREFIX;\n    getCommonLogger(type)(`${prefix} ${message}`);\n  }\n};\n\nexport { throwBladeError, logger };\n","import { useState, useCallback } from 'react';\nimport { getColorScheme } from '../getColorScheme';\nimport { colorSchemeNamesInput } from '~tokens/theme/theme';\nimport type { ColorSchemeNames, ColorSchemeNamesInput } from '~tokens/theme';\nimport { throwBladeError } from '~utils/logger';\n\nexport type UseColorScheme = {\n  colorScheme: ColorSchemeNames;\n  setColorScheme: (colorScheme: ColorSchemeNamesInput) => void;\n};\n\nexport const useColorScheme = (\n  initialColorScheme: ColorSchemeNamesInput = 'light',\n): UseColorScheme => {\n  // if colorScheme defined use that else fallback to 'light'\n  const [colorSchemeState, setColorSchemeState] = useState<ColorSchemeNames>(() =>\n    getColorScheme(initialColorScheme),\n  );\n\n  const setColorScheme = useCallback(function setThemeMode(colorScheme: ColorSchemeNamesInput) {\n    if (__DEV__) {\n      if (!colorSchemeNamesInput.includes(colorScheme)) {\n        throwBladeError({\n          message: `Expected color scheme to be one of [${colorSchemeNamesInput.toString()}] but received ${colorScheme}`,\n          moduleName: 'useColorScheme',\n        });\n      }\n    }\n    setColorSchemeState(getColorScheme(colorScheme));\n  }, []);\n\n  return {\n    colorScheme: colorSchemeState,\n    setColorScheme,\n  };\n};\n","/* eslint-disable @typescript-eslint/no-namespace */\nimport { getPlatformType } from '../getPlatformType';\n\nconst isReactNative = (): boolean => {\n  return getPlatformType() === 'react-native';\n};\n\nexport { isReactNative };\n","import { Platform } from 'react-native';\n\nexport const getOS = (): typeof Platform.OS => {\n  return Platform.OS;\n};\n\nexport const isAndroid = (): boolean => getOS() === 'android';\n","/* eslint-disable @typescript-eslint/no-namespace */\nimport type { Brand, NativeOrWebBrand } from './types';\n\nnamespace Platform {\n  export type Name = 'native';\n  /**\n   * Right now, the module resolution is set to resolve `.native` files,\n   *\n   * Thus Platform.Select<> type will return the `native` type\n   */\n  export type Select<Options extends { web: unknown; native: unknown }> = Brand<\n    Options[Name],\n    'platform-native'\n  >;\n\n  export type CastNative<T extends NativeOrWebBrand | undefined> = Extract<\n    T,\n    { __brand__?: 'platform-native' | 'platform-all' }\n  >;\n\n  export type CastWeb<T extends NativeOrWebBrand | undefined> = Extract<\n    T,\n    { __brand__?: 'platform-web' | 'platform-all' }\n  >;\n}\n\nexport { Platform };\n","import type { Platform } from '.';\n\n/**\n * @description\n *\n * Casts a Platform.Select<> type to web type\n *\n * @example\n *\n * ```ts\n * type Example = Platform.Select<{ web: string; native: number }>;\n *\n * const extractedWebType = castWebType('' as Example);\n * //    ^ string\n * ```\n */\nconst castWebType = <T>(value: T): Platform.CastWeb<T> => {\n  return value as Platform.CastWeb<typeof value>;\n};\n\n/**\n * @description\n *\n * Casts a Platform.Select<> type to native type\n *\n * @example\n *\n * ```ts\n * type Example = Platform.Select<{ web: string; native: number }>;\n *\n * const extractedNativeType = castNativeType('' as Example);\n * //    ^ number\n * ```\n */\nconst castNativeType = <T>(value: T): Platform.CastNative<T> => {\n  return value as Platform.CastNative<typeof value>;\n};\n\nexport { castWebType, castNativeType };\n","export function makeBorderSize<T extends number>(size: T): `${T}px`;\nexport function makeBorderSize<T extends string>(size: T): T;\nexport function makeBorderSize<T extends number | string>(size: T): `${T}px` | T {\n  if (typeof size === 'number') {\n    return `${size}px`;\n  }\n  return size;\n}\n","import type { MakeMotionTime } from './types';\nimport type { Platform } from '~utils';\n\nexport const makeMotionTime = <T extends number>(\n  time: T,\n): Platform.CastNative<MakeMotionTime<T>> => {\n  return time;\n};\n","export const makeSpace = <T extends number>(size: T): `${T}px` => {\n  return `${size}px`;\n};\n","export const makeTypographySize = <T extends number>(size: T): `${T}px` => {\n  return `${size}px`;\n};\n","export type MakeSize<T extends number> = `${T}px`;\n\nexport const makeSize = <T extends number>(size: T): `${T}px` => {\n  return `${size}px`;\n};\n","/**\n * @deprecated This utility will be deprecated in subsequent version.\n */\nexport const toTitleCase = (inputString: string): string =>\n  inputString\n    .toLowerCase()\n    .split(' ')\n    .map((word) => word.charAt(0).toUpperCase() + word.slice(1))\n    .join(' ');\n","import type { MutableRefObject } from 'react';\nimport { useEffect, useRef } from 'react';\n\n/**\n * a type-safe version of the `usePrevious` hook described here:\n * @see {@link https://reactjs.org/docs/hooks-faq.html#how-to-get-the-previous-props-or-state}\n * @deprecated This utility will be deprecated in subsequent version.\n */\nexport function usePrevious<T>(value: T): MutableRefObject<T | undefined>['current'] {\n  const ref = useRef<T>();\n\n  useEffect(() => {\n    ref.current = value;\n  }, [value]);\n\n  return ref.current;\n}\n","import { useContext, createContext } from 'react';\nimport type { UseColorScheme } from '../../utils/useColorScheme';\nimport type { Theme } from './';\nimport type { TypographyPlatforms } from '~tokens/global';\nimport { throwBladeError } from '~utils/logger';\n\nexport type ThemeContext = UseColorScheme & {\n  theme: Theme;\n  platform: TypographyPlatforms;\n};\n\nexport const ThemeContext = createContext<ThemeContext>({\n  // @ts-expect-error set null\n  theme: null,\n  colorScheme: 'light',\n  platform: 'onDesktop',\n  setColorScheme: () => null,\n});\n\nconst useTheme = (): ThemeContext => {\n  const themeContext = useContext<ThemeContext>(ThemeContext);\n  if (__DEV__) {\n    if (!themeContext.theme) {\n      throwBladeError({\n        message: 'BladeProvider is missing theme',\n        moduleName: 'BladeProvider',\n      });\n    }\n    if (themeContext === undefined) {\n      throwBladeError({\n        message: 'useTheme must be used within BladeProvider',\n        moduleName: 'BladeProvider',\n      });\n    }\n  }\n  return themeContext;\n};\n\nexport default useTheme;\n"],"names":["getColorScheme","colorScheme","Appearance","getMediaQuery","min","max","getPlatformType","navigator","product","document","process","deviceType","desktop","mobile","useBreakpoint","breakpoints","supportsMatchMedia","window","matchMedia","breakpointsTokenAndQueryCollection","useMemo","Object","entries","map","index","breakpointsArray","token","screenSize","maxValue","mediaQuery","undefined","getMatchedDeviceType","useCallback","matchedBreakpoint","matchedDeviceType","platform","includes","getMatchedBreakpoint","event","find","media","matches","useState","breakpointAndDevice","setBreakpointAndDevice","useEffect","handleMediaQueryChange","mediaQueryInstances","mediaQueryInstance","addEventListener","addListener","forEach","removeEventListener","removeListener","colorSchemeNamesInput","PREFIX","throwBladeError","message","moduleName","__DEV__","prefix","Error","useColorScheme","initialColorScheme","colorSchemeState","setColorSchemeState","setColorScheme","setThemeMode","toString","isReactNative","getOS","Platform","OS","isAndroid","castWebType","value","castNativeType","makeBorderSize","size","makeMotionTime","time","makeSpace","makeTypographySize","makeSize","toTitleCase","inputString","toLowerCase","split","word","charAt","toUpperCase","slice","join","usePrevious","ref","useRef","current","ThemeContext","createContext","theme","useTheme","themeContext","useContext"],"mappings":";;;;AAGaA,IAAAA,cAAc,CAAG,SAAjBA,cAAiB,EAAoE,KAAnEC,WAAmE,2DAA9B,OAA8B,CAEhG,GAAIA,WAAW,GAAK,OAAhB,EAA2BA,WAAW,GAAK,MAA/C,CAAuD,CACrD,OAAOA,WAAP,CACD,CAED,GAAIA,WAAW,GAAK,QAApB,CAA8B,2BAC5B,8BAAOC,UAAU,CAACF,cAAX,EAAP,8BAAsC,OAAtC,CACD,CAED,OAAO,OAAP,CACD;;ACdYG,IAAAA,aAAa,CAAG,SAAhBA,aAAgB,MAAyD,KAAtDC,GAAsD,MAAtDA,GAAsD,CAAjDC,GAAiD,MAAjDA,GAAiD,CACpF,iCAAiCD,GAAjC,QAA0CC,GAAG,qBAAuBA,GAAvB,OAAkC,EAA/E,EACD;;ACAYC,IAAAA,eAAe,CAAG,SAAlBA,eAAkB,EAAqB,CAClD,GAAI,OAAOC,SAAP,GAAqB,WAArB,EAAoCA,SAAS,CAACC,OAAV,GAAsB,aAA9D,CAA6E,CAC3E,OAAO,cAAP,CACD,CAED,GAAI,OAAOC,QAAP,GAAoB,WAAxB,CAAqC,CACnC,OAAO,SAAP,CACD,CAED,GAAI,OAAOC,OAAP,GAAmB,WAAvB,CAAoC,CAClC,OAAO,MAAP,CACD,CAED,OAAO,SAAP,CACD;;ACVD,IAAMC,UAAU,CAAG,CACjBC,OAAO,CAAE,SADQ,CAEjBC,MAAM,CAAE,QAFS,CAAnB,CAaaC,IAAAA,aAAa,CAAG,SAAhBA,aAAgB,MAIF,iBAHzBC,WAGyB,MAHzBA,WAGyB,CACzB,IAAMC,kBAAkB,CACtB,OAAOP,QAAP,GAAoB,WAApB,EACA,OAAOQ,MAAP,GAAkB,WADlB,EAEA,gBAAOA,MAAP,eAAO,QAAQC,UAAf,IAA8B,UAHhC,CAKA,IAAMC,kCAAkC,CAAGC,OAAO,CAChD,kBACGJ,kBAAkB,CACfK,MAAM,CAACC,OAAP,CAAeP,WAAf,EAA4BQ,GAA5B,CAAgC,eAAsBC,KAAtB,CAA6BC,gBAA7B,CAAkD,yDAAhDC,KAAgD,UAAzCC,UAAyC,UAChF,IAAMvB,GAAG,CAAGuB,UAAZ,CACA,IAAMC,QAAQ,oBAAGH,gBAAgB,CAACD,KAAK,CAAG,CAAT,CAAnB,eAAG,kBAA8B,CAA9B,CAAjB,CACA,IAAMK,UAAU,CAAG1B,aAAa,CAAC,CAAEC,GAAG,CAAHA,GAAF,CAAOC,GAAG,CAAEuB,QAAQ,CAAGA,QAAQ,CAAG,CAAd,CAAkBE,SAAtC,CAAD,CAAhC,CACA,OAAO,CAAEJ,KAAK,CAALA,KAAF,CAASC,UAAU,CAAVA,UAAT,CAAqBE,UAAU,CAAVA,UAArB,CAAP,CACD,CALD,CADe,CAOf,EARN,EADgD,CAchD,CAACd,WAAD,CAAcC,kBAAd,CAdgD,CAAlD,CAiBA,IAAMe,oBAAoB,CAAGC,WAAW,CAAC,SAACC,iBAAD,CAA+C,CACtF,IAAIC,iBAA6B,CAAGvB,UAAU,CAACE,MAA/C,CACA,IAAMsB,QAAQ,CAAG7B,eAAe,EAAhC,CACA,GAAI6B,QAAQ,GAAK,cAAjB,CAAiC,CAC/BD,iBAAiB,CAAGvB,UAAU,CAACE,MAA/B,CACD,CAFD,QAEWsB,QAAQ,GAAK,SAAjB,CAA4B,CACjC,GAAIF,iBAAiB,EAAI,CAAC,MAAD,CAAS,IAAT,CAAe,GAAf,EAAoBG,QAApB,CAA6BH,iBAA7B,CAAzB,CAA0E,CAExEC,iBAAiB,CAAGvB,UAAU,CAACE,MAA/B,CACD,CAHD,KAGO,CACLqB,iBAAiB,CAAGvB,UAAU,CAACC,OAA/B,CACD,CACF,CAPM,QAOIuB,QAAQ,GAAK,MAAjB,CAAyB,CAE9BD,iBAAiB,CAAGvB,UAAU,CAACC,OAA/B,CACD,CACD,OAAOsB,iBAAP,CACD,CAjBuC,CAiBrC,EAjBqC,CAAxC,CAmBA,IAAMG,oBAAoB,CAAGL,WAAW,CACtC,SAACM,KAAD,CAA6C,kDAC3C,IAAML,iBAAiB,gDACrBd,kCAAkC,CAACoB,IAAnC,CAAwC,eAAyB,4BAAtBV,UAAsB,CAAtBA,UAAsB,2BAAT,EAAS,kBAE/D,GAAI,CAAAS,KAAK,MAAL,QAAAA,KAAK,CAAEE,KAAP,IAAiBX,UAArB,CAAiC,CAC/B,WAAA,CACD,CAED,GAAIZ,MAAM,CAACC,UAAP,CAAkBW,UAAlB,EAA8BY,OAAlC,CAA2C,CACzC,WAAA,CACD,CACD,YAAA,CACD,CAVD,CADqB,eACrB,uBAUIf,KAXiB,8BAWRI,SAXf,CAaA,OAAOG,iBAAP,CACD,CAhBqC,CAiBtC,CAACd,kCAAD,CAjBsC,CAAxC,CAoBA,cAAsDuB,QAAQ,CAAC,UAAM,CACnE,IAAMT,iBAAiB,CAAGI,oBAAoB,EAA9C,CACA,IAAMH,iBAAiB,CAAGH,oBAAoB,CAACE,iBAAD,CAA9C,CACA,OAAO,CACLA,iBAAiB,CAAjBA,iBADK,CAELC,iBAAiB,CAAjBA,iBAFK,CAAP,CAID,CAP6D,CAA9D,wCAAOS,mBAAP,eAA4BC,sBAA5B,eASAC,SAAS,CAAC,UAAM,CACd,GAAI,CAAC7B,kBAAL,CAAyB,CACvB,OAAOc,SAAP,CACD,CAED,IAAMgB,sBAAsB,CAAG,SAAzBA,sBAAyB,CAACR,KAAD,CAAsC,CACnEM,sBAAsB,CAAC,UAAM,CAC3B,IAAMX,iBAAiB,CAAGI,oBAAoB,CAACC,KAAD,CAA9C,CACA,IAAMJ,iBAAiB,CAAGH,oBAAoB,CAACE,iBAAD,CAA9C,CAEA,OAAO,CAAEA,iBAAiB,CAAjBA,iBAAF,CAAqBC,iBAAiB,CAAjBA,iBAArB,CAAP,CACD,CALqB,CAAtB,CAMD,CAPD,CASA,IAAMa,mBAAmB,CAAG5B,kCAAkC,CAACI,GAAnC,CAAuC,eAAyB,4BAAtBM,UAAsB,CAAtBA,UAAsB,2BAAT,EAAS,kBAC1F,IAAMmB,kBAAkB,CAAG/B,MAAM,CAACC,UAAP,CAAkBW,UAAlB,CAA3B,CAKA,GAAImB,kBAAkB,CAACC,gBAAvB,CAAyC,CACvCD,kBAAkB,CAACC,gBAAnB,CAAoC,QAApC,CAA8CH,sBAA9C,EACD,CAFD,KAEO,CAELE,kBAAkB,CAACE,WAAnB,CAA+BJ,sBAA/B,EACD,CACD,OAAOE,kBAAP,CACD,CAb2B,CAA5B,CAeA,iBAAmB,CACjBD,mBAAmB,CAACI,OAApB,CAA4B,SAACH,kBAAD,CAAwB,CAClD,GAAIA,kBAAkB,CAACI,mBAAvB,CAA4C,CAC1CJ,kBAAkB,CAACI,mBAAnB,CAAuC,QAAvC,CAAiDN,sBAAjD,EACD,CAFD,KAEO,CAELE,kBAAkB,CAACK,cAAnB,CAAkCP,sBAAlC,EACD,CACF,CAPD,EAQD,CATD,CAUD,CAvCQ,CAuCN,CACD3B,kCADC,CAEDkB,oBAFC,CAGDN,oBAHC,CAIDf,kBAJC,CAvCM,CAAT,CA+CA,OAAO2B,mBAAP,CACD;;ICeYW,qBAA8C,CAAG,CAAC,OAAD,CAAU,MAAV,CAAkB,QAAlB,CAAvD;;AChJP,IAAMC,MAAM,CAAG,UAAf,CAEA,IAAMC,eAAe,CAAG,SAAlBA,eAAkB,MAAmE,KAAhEC,OAAgE,MAAhEA,OAAgE,CAAvDC,UAAuD,MAAvDA,UAAuD,CACzF,GAAIC,OAAJ,CAAa,CACX,IAAMC,MAAM,CAAGF,UAAU,YAAcA,UAAd,MAA+BH,MAAxD,CACA,UAAUM,KAAJ,CAAaD,MAAb,KAAuBH,OAAvB,CAAN,CACD,CACF,CALD;;ACJaK,IAAAA,cAAc,CAAG,SAAjBA,cAAiB,EAET,KADnBC,kBACmB,2DADyB,OACzB,CAEnB,cAAgDrB,QAAQ,CAAmB,kBACzE1C,cAAc,CAAC+D,kBAAD,CAD2D,EAAnB,CAAxD,wCAAOC,gBAAP,eAAyBC,mBAAzB,eAIA,IAAMC,cAAc,CAAGlC,WAAW,CAAC,SAASmC,YAAT,CAAsBlE,WAAtB,CAA0D,CAC3F,GAAI0D,OAAJ,CAAa,CACX,GAAI,CAACL,qBAAqB,CAAClB,QAAtB,CAA+BnC,WAA/B,CAAL,CAAkD,CAChDuD,eAAe,CAAC,CACdC,OAAO,wCAAyCH,qBAAqB,CAACc,QAAtB,EAAzC,mBAA2FnE,WADpF,CAEdyD,UAAU,CAAE,gBAFE,CAAD,CAAf,CAID,CACF,CACDO,mBAAmB,CAACjE,cAAc,CAACC,WAAD,CAAf,CAAnB,CACD,CAViC,CAU/B,EAV+B,CAAlC,CAYA,OAAO,CACLA,WAAW,CAAE+D,gBADR,CAELE,cAAc,CAAdA,cAFK,CAAP,CAID;;AChCKG,IAAAA,aAAa,CAAG,SAAhBA,aAAgB,EAAe,CACnC,OAAO/D,eAAe,KAAO,cAA7B,CACD;;ACHYgE,IAAAA,KAAK,CAAG,SAARA,KAAQ,EAA0B,CAC7C,OAAOC,UAAQ,CAACC,EAAhB,CACD,EAEYC,IAAAA,SAAS,CAAG,SAAZA,SAAY,UAAeH,KAAK,KAAO,SAA3B;;qCCHfC,WAAAA;;ACaJG,IAAAA,WAAW,CAAG,SAAdA,WAAc,CAAIC,KAAJ,CAAsC,CACxD,OAAOA,KAAP,CACD,EAgBKC,IAAAA,cAAc,CAAG,SAAjBA,cAAiB,CAAID,KAAJ,CAAyC,CAC9D,OAAOA,KAAP,CACD;;SClCeE,cAAT,CAAmDC,IAAnD,CAA0E,CAC/E,GAAI,OAAOA,IAAP,GAAgB,QAApB,CAA8B,CAC5B,OAAUA,IAAV,MACD,CACD,OAAOA,IAAP,CACD;;ACJYC,IAAAA,cAAc,CAAG,SAAjBA,cAAiB,CAC5BC,IAD4B,CAEe,CAC3C,OAAOA,IAAP,CACD;;ACPYC,IAAAA,SAAS,CAAG,SAAZA,SAAY,CAAmBH,IAAnB,CAAyC,CAChE,OAAUA,IAAV,MACD;;ACFYI,IAAAA,kBAAkB,CAAG,SAArBA,kBAAqB,CAAmBJ,IAAnB,CAAyC,CACzE,OAAUA,IAAV,MACD;;ACAYK,IAAAA,QAAQ,CAAG,SAAXA,QAAW,CAAmBL,IAAnB,CAAyC,CAC/D,OAAUA,IAAV,MACD;;ACDYM,IAAAA,WAAW,CAAG,SAAdA,WAAc,CAACC,WAAD,SACzBA,WAAW,CACRC,WADH,GAEGC,KAFH,CAES,GAFT,EAGGhE,GAHH,CAGO,SAACiE,IAAD,SAAUA,IAAI,CAACC,MAAL,CAAY,CAAZ,EAAeC,WAAf,GAA+BF,IAAI,CAACG,KAAL,CAAW,CAAX,CAAzC,EAHP,EAIGC,IAJH,CAIQ,GAJR,CADyB;;SCKXC,WAAT,CAAwBlB,KAAxB,CAA8E,CACnF,IAAMmB,GAAG,CAAGC,MAAM,EAAlB,CAEAlD,SAAS,CAAC,UAAM,CACdiD,GAAG,CAACE,OAAJ,CAAcrB,KAAd,CACD,CAFQ,CAEN,CAACA,KAAD,CAFM,CAAT,CAIA,OAAOmB,GAAG,CAACE,OAAX,CACD;;ACLYC,IAAAA,YAAY,CAAGC,aAAa,CAAe,CAEtDC,KAAK,CAAE,IAF+C,CAGtDlG,WAAW,CAAE,OAHyC,CAItDkC,QAAQ,CAAE,WAJ4C,CAKtD+B,cAAc,CAAE,qCAAA,EALsC,CAAf,EAQnCkC,IAAAA,QAAQ,CAAG,SAAXA,QAAW,EAAoB,CACnC,IAAMC,YAAY,CAAGC,UAAU,CAAeL,YAAf,CAA/B,CACA,GAAItC,OAAJ,CAAa,CACX,GAAI,CAAC0C,YAAY,CAACF,KAAlB,CAAyB,CACvB3C,eAAe,CAAC,CACdC,OAAO,CAAE,gCADK,CAEdC,UAAU,CAAE,eAFE,CAAD,CAAf,CAID,CACD,GAAI2C,YAAY,GAAKvE,SAArB,CAAgC,CAC9B0B,eAAe,CAAC,CACdC,OAAO,CAAE,4CADK,CAEdC,UAAU,CAAE,eAFE,CAAD,CAAf,CAID,CACF,CACD,OAAO2C,YAAP,CACD;;;;"}
+{"version":3,"file":"index.native.js","sources":["../../src/utils/getColorScheme/getColorScheme.native.ts","../../src/utils/getMediaQuery/getMediaQuery.ts","../../src/utils/getPlatformType/getPlatformType.ts","../../src/utils/useBreakpoint/useBreakpoint.ts","../../src/tokens/theme/theme.ts","../../src/utils/logger/logger.ts","../../src/utils/useColorScheme/useColorScheme.ts","../../src/utils/platform/isReactNative.ts","../../src/utils/platform/getOS.native.ts","../../src/utils/platform/platform.native.ts","../../src/utils/platform/castUtils.ts","../../src/utils/makeBorderSize/makeBorderSize.ts","../../src/utils/makeMotionTime/makeMotionTime.native.ts","../../src/utils/makeSpace/makeSpace.ts","../../src/utils/makeTypographySize/makeTypographySize.native.ts","../../src/utils/makeSize/makeSize.ts","../../src/utils/toTitleCase/toTitleCase.ts","../../src/utils/usePrevious/usePrevious.ts","../../src/components/BladeProvider/useTheme.ts"],"sourcesContent":["import { Appearance } from 'react-native';\nimport type { ColorSchemeNames, ColorSchemeNamesInput } from '~tokens/theme';\n\nexport const getColorScheme = (colorScheme: ColorSchemeNamesInput = 'light'): ColorSchemeNames => {\n  // @TODO: convert this to hook as Appearance API also adds an eventListener which subscribes to the colorscheme changes on the device\n  if (colorScheme === 'light' || colorScheme === 'dark') {\n    return colorScheme;\n  }\n\n  if (colorScheme === 'system') {\n    return Appearance.getColorScheme() ?? 'light';\n  }\n\n  return 'light';\n};\n","export const getMediaQuery = ({ min, max }: { min: number; max?: number }): string => {\n  return `screen and (min-width: ${min}px)${max ? ` and (max-width: ${max}px)` : ''}`;\n};\n","export type PlatformTypes = 'browser' | 'node' | 'react-native' | 'unknown';\n\nexport const getPlatformType = (): PlatformTypes => {\n  if (typeof navigator !== 'undefined' && navigator.product === 'ReactNative') {\n    return 'react-native';\n  }\n\n  if (typeof document !== 'undefined') {\n    return 'browser';\n  }\n\n  if (typeof process !== 'undefined') {\n    return 'node';\n  }\n\n  return 'unknown';\n};\n","/* eslint-disable @typescript-eslint/restrict-plus-operands */\nimport { useEffect, useState, useCallback, useMemo } from 'react';\nimport { getPlatformType } from '../getPlatformType';\nimport { getMediaQuery } from '../getMediaQuery';\nimport type { Breakpoints } from '~tokens/global';\n\nconst deviceType = {\n  desktop: 'desktop',\n  mobile: 'mobile',\n} as const;\n\ntype DeviceType = keyof typeof deviceType;\ntype Breakpoint = keyof Breakpoints | undefined;\n\ntype BreakpointAndDevice = {\n  matchedBreakpoint: Breakpoint;\n  matchedDeviceType: DeviceType;\n};\n\nexport const useBreakpoint = ({\n  breakpoints,\n}: {\n  breakpoints: Breakpoints;\n}): BreakpointAndDevice => {\n  const supportsMatchMedia =\n    typeof document !== 'undefined' &&\n    typeof window !== 'undefined' &&\n    typeof window?.matchMedia === 'function';\n\n  const breakpointsTokenAndQueryCollection = useMemo(\n    () =>\n      (supportsMatchMedia\n        ? Object.entries(breakpoints).map(([token, screenSize], index, breakpointsArray) => {\n            const min = screenSize;\n            const maxValue = breakpointsArray[index + 1]?.[1];\n            const mediaQuery = getMediaQuery({ min, max: maxValue ? maxValue - 1 : undefined });\n            return { token, screenSize, mediaQuery };\n          })\n        : []) as {\n        token: keyof Breakpoints;\n        screenSize: number;\n        mediaQuery: string;\n      }[],\n    [breakpoints, supportsMatchMedia],\n  );\n\n  const getMatchedDeviceType = useCallback((matchedBreakpoint: Breakpoint): DeviceType => {\n    let matchedDeviceType: DeviceType = deviceType.mobile;\n    const platform = getPlatformType();\n    if (platform === 'react-native') {\n      matchedDeviceType = deviceType.mobile;\n    } else if (platform === 'browser') {\n      if (matchedBreakpoint && ['base', 'xs', 's'].includes(matchedBreakpoint)) {\n        // tablet is also categorised as mobile\n        matchedDeviceType = deviceType.mobile;\n      } else {\n        matchedDeviceType = deviceType.desktop;\n      }\n    } else if (platform === 'node') {\n      //@TODO: Check for useragent for node\n      matchedDeviceType = deviceType.desktop;\n    }\n    return matchedDeviceType;\n  }, []);\n\n  const getMatchedBreakpoint = useCallback(\n    (event?: MediaQueryListEvent): Breakpoint => {\n      const matchedBreakpoint =\n        breakpointsTokenAndQueryCollection.find(({ mediaQuery = '' }) => {\n          // this will run whenever mediaQuery change event is triggered\n          if (event?.media === mediaQuery) {\n            return true;\n          }\n          // this will run when the state is initialised for the first time and hence the event object will be empty so we'll fallback to browser's window object\n          if (window.matchMedia(mediaQuery).matches) {\n            return true;\n          }\n          return false;\n        })?.token ?? undefined;\n\n      return matchedBreakpoint;\n    },\n    [breakpointsTokenAndQueryCollection],\n  );\n\n  const [breakpointAndDevice, setBreakpointAndDevice] = useState(() => {\n    const matchedBreakpoint = getMatchedBreakpoint();\n    const matchedDeviceType = getMatchedDeviceType(matchedBreakpoint);\n    return {\n      matchedBreakpoint,\n      matchedDeviceType,\n    };\n  });\n\n  useEffect(() => {\n    if (!supportsMatchMedia) {\n      return undefined;\n    }\n\n    const handleMediaQueryChange = (event: MediaQueryListEvent): void => {\n      setBreakpointAndDevice(() => {\n        const matchedBreakpoint = getMatchedBreakpoint(event);\n        const matchedDeviceType = getMatchedDeviceType(matchedBreakpoint);\n\n        return { matchedBreakpoint, matchedDeviceType };\n      });\n    };\n\n    const mediaQueryInstances = breakpointsTokenAndQueryCollection.map(({ mediaQuery = '' }) => {\n      const mediaQueryInstance = window.matchMedia(mediaQuery);\n      /**\n       * the mediaquery event listener is available on mediaQuery instances and not `window`\n       * we iterate over all the breakpoints we have, register each instance and store them as `mediaQueryInstances` so we can later unregister all of them.\n       */\n      if (mediaQueryInstance.addEventListener) {\n        mediaQueryInstance.addEventListener('change', handleMediaQueryChange);\n      } else {\n        // In older browsers MediaQueryList do not yet inherit from EventTarget, So using addListener as fallback - https://developer.mozilla.org/en-US/docs/Web/API/MediaQueryList/addListener\n        mediaQueryInstance.addListener(handleMediaQueryChange);\n      }\n      return mediaQueryInstance;\n    });\n\n    return (): void => {\n      mediaQueryInstances.forEach((mediaQueryInstance) => {\n        if (mediaQueryInstance.removeEventListener) {\n          mediaQueryInstance.removeEventListener('change', handleMediaQueryChange);\n        } else {\n          // In older browsers MediaQueryList do not yet inherit from EventTarget, So using removeListener as fallback - https://developer.mozilla.org/en-US/docs/Web/API/MediaQueryList/removeListener\n          mediaQueryInstance.removeListener(handleMediaQueryChange);\n        }\n      });\n    };\n  }, [\n    breakpointsTokenAndQueryCollection,\n    getMatchedBreakpoint,\n    getMatchedDeviceType,\n    supportsMatchMedia,\n  ]);\n\n  // @TODO: handle SSR scenarios\n  return breakpointAndDevice;\n};\n","import type { StringWithAutocomplete } from '~utils/types';\nimport type {\n  Border,\n  Breakpoints,\n  Motion,\n  Spacing,\n  TypographyWithPlatforms,\n  ElevationWithColorModes,\n} from '~tokens/global';\n\nexport type ColorSchemeNames = 'dark' | 'light';\nexport type ColorSchemeNamesInput = ColorSchemeNames | 'system';\n\nexport type ColorSchemeModes = 'onDark' | 'onLight';\n\nexport type TextTypes = 'muted' | 'normal' | 'placeholder' | 'subdued' | 'subtle';\n\nexport type ColorContrastTypes = 'low' | 'high';\n\nexport type Feedback = 'information' | 'negative' | 'neutral' | 'notice' | 'positive';\n\nexport type ColorContrast = {\n  [K in ColorContrastTypes as `${Extract<K, string>}Contrast`]: string;\n};\n\n// @TODO: this shall rather be Surface = 'level1' | 'level2' | 'level3' to keep in sync with color tokens\nexport type SurfaceLevels = 1 | 2 | 3;\n\nexport type ActionStates = {\n  default: string;\n  hover: string;\n  focus: string;\n  active: string;\n  disabled: string;\n};\n\nexport type LinkActionStates = ActionStates & {\n  visited: string;\n};\n\nexport type ActionStatesWithContrast = {\n  default: ColorContrast;\n  hover: ColorContrast;\n  focus: ColorContrast;\n  active: ColorContrast;\n  disabled: ColorContrast;\n};\n\nexport type LinkActionStatesWithContrast = ActionStatesWithContrast & {\n  visited: ColorContrast;\n};\n\nexport type ActionVariants = {\n  primary: ActionStates;\n  secondary: ActionStates;\n  tertiary: ActionStates;\n  link: LinkActionStates;\n};\n\nexport type ActionVariantsWithContrast = {\n  primary: ActionStatesWithContrast;\n  secondary: ActionStatesWithContrast;\n  tertiary: ActionStatesWithContrast;\n  link: ActionStatesWithContrast;\n};\n\n// export type ActionProperties = {\n//   background: ActionVariants;\n//   border: ActionVariants;\n//   text: ActionVariants;\n//   icon: ActionVariants;\n// };\n\nexport type FeedbackActions = {\n  background: Pick<ActionVariantsWithContrast, 'primary'>;\n  border: Pick<ActionVariantsWithContrast, 'primary'>;\n  text: Pick<ActionVariantsWithContrast, 'link' | 'primary'>;\n  icon: Pick<ActionVariantsWithContrast, 'link' | 'primary'>;\n};\n\nexport type Colors = {\n  brand: {\n    primary: Record<300 | 400 | 500 | 600 | 700 | 800, string>;\n    secondary: Record<500, string>;\n    gray: Record<200 | 300 | 400 | 500 | 600 | 700 | 'a50' | 'a100', ColorContrast>;\n  };\n  feedback: {\n    background: Record<Feedback, ColorContrast>;\n    border: Record<Feedback, ColorContrast>;\n    text: Record<Feedback, ColorContrast>;\n    icon: Record<Feedback, ColorContrast>;\n    positive: {\n      action: FeedbackActions;\n    };\n    negative: {\n      action: FeedbackActions;\n    };\n    information: {\n      action: FeedbackActions;\n    };\n    notice: {\n      action: FeedbackActions;\n    };\n    neutral: {\n      action: FeedbackActions;\n    };\n  };\n  surface: {\n    background: Record<'level1' | 'level2' | 'level3', ColorContrast>;\n    border: Record<'normal' | 'subtle', ColorContrast>;\n    text: Record<TextTypes, ColorContrast>;\n    action: {\n      icon: ActionStatesWithContrast;\n    };\n  };\n  overlay: Record<'background', string>;\n  action: {\n    background: Omit<ActionVariants, 'link'>;\n    border: Omit<ActionVariants, 'link'>;\n    text: ActionVariants;\n    icon: ActionVariants;\n  };\n  badge: {\n    background: {\n      blue: ColorContrast;\n    };\n    border: {\n      blue: ColorContrast;\n    };\n    text: {\n      blue: ColorContrast;\n    };\n    icon: {\n      blue: ColorContrast;\n    };\n  };\n};\n\nexport type ColorsWithModes = Record<ColorSchemeModes, Colors>;\n\nexport type ThemeTokens = {\n  name: 'paymentTheme' | 'bankingTheme' | StringWithAutocomplete; // Can be used to watch over state changes between theme without watching over entire theme object\n  border: Border;\n  breakpoints: Breakpoints;\n  colors: ColorsWithModes;\n  motion: Motion;\n  elevation: ElevationWithColorModes;\n  spacing: Spacing;\n  typography: TypographyWithPlatforms;\n};\n\nexport type SpacingValues = `${Spacing[keyof Spacing]}px`;\nexport type BorderWidthValues = `${Border['width'][keyof Border['width']]}px`;\nexport type BorderRadiusValues =\n  | `${Border['radius'][Exclude<keyof Border['radius'], 'round'>]}px`\n  | `${Border['radius'][Extract<keyof Border['radius'], 'round'>]}`;\n\nexport const colorSchemeNamesInput: ColorSchemeNamesInput[] = ['light', 'dark', 'system'];\n","type LogType = 'error' | 'warn' | 'log';\n\ntype LoggerOptions = {\n  message: string;\n  moduleName?: string;\n  type: LogType;\n};\n\ntype ThrowBladeErrorOptions = {\n  message: string;\n  moduleName?: string;\n};\n\nconst PREFIX = '[Blade]:';\n\nconst throwBladeError = ({ message, moduleName }: ThrowBladeErrorOptions): void | never => {\n  if (__DEV__) {\n    const prefix = moduleName ? `[Blade: ${moduleName}]:` : PREFIX;\n    throw new Error(`${prefix} ${message}`);\n  }\n};\n\nconst getCommonLogger = (\n  type: LogType,\n): typeof console.log | typeof console.error | typeof console.warn => {\n  switch (type) {\n    case 'error':\n      return console.error;\n    case 'warn':\n      return console.warn;\n    case 'log':\n    default:\n      return console.log;\n  }\n};\n\nconst logger = ({ message, moduleName, type }: LoggerOptions): void => {\n  if (__DEV__) {\n    const prefix = moduleName ? `[Blade: ${moduleName}]:` : PREFIX;\n    getCommonLogger(type)(`${prefix} ${message}`);\n  }\n};\n\nexport { throwBladeError, logger };\n","import { useState, useCallback } from 'react';\nimport { getColorScheme } from '../getColorScheme';\nimport { colorSchemeNamesInput } from '~tokens/theme/theme';\nimport type { ColorSchemeNames, ColorSchemeNamesInput } from '~tokens/theme';\nimport { throwBladeError } from '~utils/logger';\n\nexport type UseColorScheme = {\n  colorScheme: ColorSchemeNames;\n  setColorScheme: (colorScheme: ColorSchemeNamesInput) => void;\n};\n\nexport const useColorScheme = (\n  initialColorScheme: ColorSchemeNamesInput = 'light',\n): UseColorScheme => {\n  // if colorScheme defined use that else fallback to 'light'\n  const [colorSchemeState, setColorSchemeState] = useState<ColorSchemeNames>(() =>\n    getColorScheme(initialColorScheme),\n  );\n\n  const setColorScheme = useCallback(function setThemeMode(colorScheme: ColorSchemeNamesInput) {\n    if (__DEV__) {\n      if (!colorSchemeNamesInput.includes(colorScheme)) {\n        throwBladeError({\n          message: `Expected color scheme to be one of [${colorSchemeNamesInput.toString()}] but received ${colorScheme}`,\n          moduleName: 'useColorScheme',\n        });\n      }\n    }\n    setColorSchemeState(getColorScheme(colorScheme));\n  }, []);\n\n  return {\n    colorScheme: colorSchemeState,\n    setColorScheme,\n  };\n};\n","/* eslint-disable @typescript-eslint/no-namespace */\nimport { getPlatformType } from '../getPlatformType';\n\nconst isReactNative = (): boolean => {\n  return getPlatformType() === 'react-native';\n};\n\nexport { isReactNative };\n","import { Platform } from 'react-native';\n\nexport const getOS = (): typeof Platform.OS => {\n  return Platform.OS;\n};\n\nexport const isAndroid = (): boolean => getOS() === 'android';\n","/* eslint-disable @typescript-eslint/no-namespace */\nimport type { Brand, NativeOrWebBrand } from './types';\n\nnamespace Platform {\n  export type Name = 'native';\n  /**\n   * Right now, the module resolution is set to resolve `.native` files,\n   *\n   * Thus Platform.Select<> type will return the `native` type\n   */\n  export type Select<Options extends { web: unknown; native: unknown }> = Brand<\n    Options[Name],\n    'platform-native'\n  >;\n\n  export type CastNative<T extends NativeOrWebBrand | undefined> = Extract<\n    T,\n    { __brand__?: 'platform-native' | 'platform-all' }\n  >;\n\n  export type CastWeb<T extends NativeOrWebBrand | undefined> = Extract<\n    T,\n    { __brand__?: 'platform-web' | 'platform-all' }\n  >;\n}\n\nexport { Platform };\n","import type { Platform } from '.';\n\n/**\n * @description\n *\n * Casts a Platform.Select<> type to web type\n *\n * @example\n *\n * ```ts\n * type Example = Platform.Select<{ web: string; native: number }>;\n *\n * const extractedWebType = castWebType('' as Example);\n * //    ^ string\n * ```\n */\nconst castWebType = <T>(value: T): Platform.CastWeb<T> => {\n  return value as Platform.CastWeb<typeof value>;\n};\n\n/**\n * @description\n *\n * Casts a Platform.Select<> type to native type\n *\n * @example\n *\n * ```ts\n * type Example = Platform.Select<{ web: string; native: number }>;\n *\n * const extractedNativeType = castNativeType('' as Example);\n * //    ^ number\n * ```\n */\nconst castNativeType = <T>(value: T): Platform.CastNative<T> => {\n  return value as Platform.CastNative<typeof value>;\n};\n\nexport { castWebType, castNativeType };\n","export function makeBorderSize<T extends number>(size: T): `${T}px`;\nexport function makeBorderSize<T extends string>(size: T): T;\nexport function makeBorderSize<T extends number | string>(size: T): `${T}px` | T {\n  if (typeof size === 'number') {\n    return `${size}px`;\n  }\n  return size;\n}\n","import type { MakeMotionTime } from './types';\nimport type { Platform } from '~utils';\n\nexport const makeMotionTime = <T extends number>(\n  time: T,\n): Platform.CastNative<MakeMotionTime<T>> => {\n  return time;\n};\n","export const makeSpace = <T extends number>(size: T): `${T}px` => {\n  return `${size}px`;\n};\n","export const makeTypographySize = <T extends number>(size: T): `${T}px` => {\n  return `${size}px`;\n};\n","export type MakeSize<T extends number> = `${T}px`;\n\nexport const makeSize = <T extends number>(size: T): `${T}px` => {\n  return `${size}px`;\n};\n","/**\n * @deprecated This utility will be deprecated in subsequent version.\n */\nexport const toTitleCase = (inputString: string): string =>\n  inputString\n    .toLowerCase()\n    .split(' ')\n    .map((word) => word.charAt(0).toUpperCase() + word.slice(1))\n    .join(' ');\n","import type { MutableRefObject } from 'react';\nimport { useEffect, useRef } from 'react';\n\n/**\n * a type-safe version of the `usePrevious` hook described here:\n * @see {@link https://reactjs.org/docs/hooks-faq.html#how-to-get-the-previous-props-or-state}\n * @deprecated This utility will be deprecated in subsequent version.\n */\nexport function usePrevious<T>(value: T): MutableRefObject<T | undefined>['current'] {\n  const ref = useRef<T>();\n\n  useEffect(() => {\n    ref.current = value;\n  }, [value]);\n\n  return ref.current;\n}\n","import { useContext, createContext } from 'react';\nimport type { UseColorScheme } from '../../utils/useColorScheme';\nimport type { Theme } from './';\nimport type { TypographyPlatforms } from '~tokens/global';\nimport { throwBladeError } from '~utils/logger';\n\nexport type ThemeContext = UseColorScheme & {\n  theme: Theme;\n  platform: TypographyPlatforms;\n};\n\nexport const ThemeContext = createContext<ThemeContext>({\n  // @ts-expect-error set null\n  theme: null,\n  colorScheme: 'light',\n  platform: 'onDesktop',\n  setColorScheme: () => null,\n});\n\nconst useTheme = (): ThemeContext => {\n  const themeContext = useContext<ThemeContext>(ThemeContext);\n  if (__DEV__) {\n    if (!themeContext.theme) {\n      throwBladeError({\n        message: 'BladeProvider is missing theme',\n        moduleName: 'BladeProvider',\n      });\n    }\n    if (themeContext === undefined) {\n      throwBladeError({\n        message: 'useTheme must be used within BladeProvider',\n        moduleName: 'BladeProvider',\n      });\n    }\n  }\n  return themeContext;\n};\n\nexport default useTheme;\n"],"names":["getColorScheme","colorScheme","arguments","length","undefined","_Appearance$getColorS","Appearance","getMediaQuery","_ref","min","max","getPlatformType","navigator","product","document","process","deviceType","desktop","mobile","useBreakpoint","_window","breakpoints","supportsMatchMedia","window","matchMedia","breakpointsTokenAndQueryCollection","useMemo","Object","entries","map","_ref2","index","breakpointsArray","_breakpointsArray","_ref3","_slicedToArray","token","screenSize","maxValue","mediaQuery","getMatchedDeviceType","useCallback","matchedBreakpoint","matchedDeviceType","platform","includes","getMatchedBreakpoint","event","_breakpointsTokenAndQ","_breakpointsTokenAndQ2","find","_ref4","_ref4$mediaQuery","media","matches","_useState","useState","_useState2","breakpointAndDevice","setBreakpointAndDevice","useEffect","handleMediaQueryChange","mediaQueryInstances","_ref5","_ref5$mediaQuery","mediaQueryInstance","addEventListener","addListener","forEach","removeEventListener","removeListener","colorSchemeNamesInput","PREFIX","throwBladeError","message","moduleName","__DEV__","prefix","Error","useColorScheme","initialColorScheme","colorSchemeState","setColorSchemeState","setColorScheme","setThemeMode","toString","isReactNative","getOS","Platform","OS","isAndroid","castWebType","value","castNativeType","makeBorderSize","size","makeMotionTime","time","makeSpace","makeTypographySize","makeSize","toTitleCase","inputString","toLowerCase","split","word","charAt","toUpperCase","slice","join","usePrevious","ref","useRef","current","ThemeContext","createContext","theme","useTheme","themeContext","useContext"],"mappings":"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"}

package/build/utils/index.production.web.js

@@ -10,21 +10,18 @@ var getColorScheme = function getColorScheme() {
     system: 'default'
   };
   var supportsMatchMedia = typeof window !== 'undefined' && typeof window.matchMedia === 'function';
-
   if (colorScheme === 'light' || colorScheme === 'dark') {
     return colorScheme;
   }
-
   if (colorScheme === 'system' && supportsMatchMedia && window.matchMedia(colorSchemeMediaQueryMap.dark).matches) {
     return 'dark';
   }
-
   return 'light';
 };
 
 var getMediaQuery = function getMediaQuery(_ref) {
   var min = _ref.min,
-      max = _ref.max;
+    max = _ref.max;
   return "screen and (min-width: ".concat(min, "px)").concat(max ? " and (max-width: ".concat(max, "px)") : '');
 };
 
@@ -32,15 +29,12 @@ var getPlatformType = function getPlatformType() {
   if (typeof navigator !== 'undefined' && navigator.product === 'ReactNative') {
     return 'react-native';
   }
-
   if (typeof document !== 'undefined') {
     return 'browser';
   }
-
   if (typeof process !== 'undefined') {
     return 'node';
   }
-
   return 'unknown';
 };
 
@@ -50,17 +44,14 @@ var deviceType = {
 };
 var useBreakpoint = function useBreakpoint(_ref) {
   var _window;
-
   var breakpoints = _ref.breakpoints;
   var supportsMatchMedia = typeof document !== 'undefined' && typeof window !== 'undefined' && typeof ((_window = window) === null || _window === void 0 ? void 0 : _window.matchMedia) === 'function';
   var breakpointsTokenAndQueryCollection = useMemo(function () {
     return supportsMatchMedia ? Object.entries(breakpoints).map(function (_ref2, index, breakpointsArray) {
       var _breakpointsArray;
-
       var _ref3 = _slicedToArray(_ref2, 2),
-          token = _ref3[0],
-          screenSize = _ref3[1];
-
+        token = _ref3[0],
+        screenSize = _ref3[1];
       var min = screenSize;
       var maxValue = (_breakpointsArray = breakpointsArray[index + 1]) === null || _breakpointsArray === void 0 ? void 0 : _breakpointsArray[1];
       var mediaQuery = getMediaQuery({
@@ -77,7 +68,6 @@ var useBreakpoint = function useBreakpoint(_ref) {
   var getMatchedDeviceType = useCallback(function (matchedBreakpoint) {
     var matchedDeviceType = deviceType.mobile;
     var platform = getPlatformType();
-
     if (platform === 'react-native') {
       matchedDeviceType = deviceType.mobile;
     } else if (platform === 'browser') {
@@ -91,49 +81,40 @@ var useBreakpoint = function useBreakpoint(_ref) {
       //@TODO: Check for useragent for node
       matchedDeviceType = deviceType.desktop;
     }
-
     return matchedDeviceType;
   }, []);
   var getMatchedBreakpoint = useCallback(function (event) {
     var _breakpointsTokenAndQ, _breakpointsTokenAndQ2;
-
     var matchedBreakpoint = (_breakpointsTokenAndQ = (_breakpointsTokenAndQ2 = breakpointsTokenAndQueryCollection.find(function (_ref4) {
       var _ref4$mediaQuery = _ref4.mediaQuery,
-          mediaQuery = _ref4$mediaQuery === void 0 ? '' : _ref4$mediaQuery;
-
+        mediaQuery = _ref4$mediaQuery === void 0 ? '' : _ref4$mediaQuery;
       // this will run whenever mediaQuery change event is triggered
       if ((event === null || event === void 0 ? void 0 : event.media) === mediaQuery) {
         return true;
-      } // this will run when the state is initialised for the first time and hence the event object will be empty so we'll fallback to browser's window object
-
-
+      }
       // this will run when the state is initialised for the first time and hence the event object will be empty so we'll fallback to browser's window object
       if (window.matchMedia(mediaQuery).matches) {
         return true;
       }
-
       return false;
     })) === null || _breakpointsTokenAndQ2 === void 0 ? void 0 : _breakpointsTokenAndQ2.token) !== null && _breakpointsTokenAndQ !== void 0 ? _breakpointsTokenAndQ : undefined;
     return matchedBreakpoint;
   }, [breakpointsTokenAndQueryCollection]);
-
   var _useState = useState(function () {
-    var matchedBreakpoint = getMatchedBreakpoint();
-    var matchedDeviceType = getMatchedDeviceType(matchedBreakpoint);
-    return {
-      matchedBreakpoint: matchedBreakpoint,
-      matchedDeviceType: matchedDeviceType
-    };
-  }),
-      _useState2 = _slicedToArray(_useState, 2),
-      breakpointAndDevice = _useState2[0],
-      setBreakpointAndDevice = _useState2[1];
-
+      var matchedBreakpoint = getMatchedBreakpoint();
+      var matchedDeviceType = getMatchedDeviceType(matchedBreakpoint);
+      return {
+        matchedBreakpoint: matchedBreakpoint,
+        matchedDeviceType: matchedDeviceType
+      };
+    }),
+    _useState2 = _slicedToArray(_useState, 2),
+    breakpointAndDevice = _useState2[0],
+    setBreakpointAndDevice = _useState2[1];
   useEffect(function () {
     if (!supportsMatchMedia) {
       return undefined;
     }
-
     var handleMediaQueryChange = function handleMediaQueryChange(event) {
       setBreakpointAndDevice(function () {
         var matchedBreakpoint = getMatchedBreakpoint(event);
@@ -144,23 +125,20 @@ var useBreakpoint = function useBreakpoint(_ref) {
         };
       });
     };
-
     var mediaQueryInstances = breakpointsTokenAndQueryCollection.map(function (_ref5) {
       var _ref5$mediaQuery = _ref5.mediaQuery,
-          mediaQuery = _ref5$mediaQuery === void 0 ? '' : _ref5$mediaQuery;
+        mediaQuery = _ref5$mediaQuery === void 0 ? '' : _ref5$mediaQuery;
       var mediaQueryInstance = window.matchMedia(mediaQuery);
       /**
        * the mediaquery event listener is available on mediaQuery instances and not `window`
        * we iterate over all the breakpoints we have, register each instance and store them as `mediaQueryInstances` so we can later unregister all of them.
        */
-
       if (mediaQueryInstance.addEventListener) {
         mediaQueryInstance.addEventListener('change', handleMediaQueryChange);
       } else {
         // In older browsers MediaQueryList do not yet inherit from EventTarget, So using addListener as fallback - https://developer.mozilla.org/en-US/docs/Web/API/MediaQueryList/addListener
         mediaQueryInstance.addListener(handleMediaQueryChange);
       }
-
       return mediaQueryInstance;
     });
     return function () {
@@ -173,24 +151,22 @@ var useBreakpoint = function useBreakpoint(_ref) {
         }
       });
     };
-  }, [breakpointsTokenAndQueryCollection, getMatchedBreakpoint, getMatchedDeviceType, supportsMatchMedia]); // @TODO: handle SSR scenarios
+  }, [breakpointsTokenAndQueryCollection, getMatchedBreakpoint, getMatchedDeviceType, supportsMatchMedia]);
 
+  // @TODO: handle SSR scenarios
   return breakpointAndDevice;
 };
 
 var useColorScheme = function useColorScheme() {
   var initialColorScheme = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : 'light';
-
   // if colorScheme defined use that else fallback to 'light'
   var _useState = useState(function () {
-    return getColorScheme(initialColorScheme);
-  }),
-      _useState2 = _slicedToArray(_useState, 2),
-      colorSchemeState = _useState2[0],
-      setColorSchemeState = _useState2[1];
-
+      return getColorScheme(initialColorScheme);
+    }),
+    _useState2 = _slicedToArray(_useState, 2),
+    colorSchemeState = _useState2[0],
+    setColorSchemeState = _useState2[1];
   var setColorScheme = useCallback(function setThemeMode(colorScheme) {
-
     setColorSchemeState(getColorScheme(colorScheme));
   }, []);
   return {
@@ -200,7 +176,6 @@ var useColorScheme = function useColorScheme() {
 };
 
 /* eslint-disable @typescript-eslint/no-namespace */
-
 var isReactNative = function isReactNative() {
   return getPlatformType() === 'react-native';
 };
@@ -214,7 +189,6 @@ var isAndroid = function isAndroid() {
 
 /* eslint-disable @typescript-eslint/no-namespace */
 var Platform;
-
 (function (_Platform) {})(Platform || (Platform = {}));
 
 /**
@@ -234,6 +208,7 @@ var Platform;
 var castWebType = function castWebType(value) {
   return value;
 };
+
 /**
  * @description
  *
@@ -248,8 +223,6 @@ var castWebType = function castWebType(value) {
  * //    ^ number
  * ```
  */
-
-
 var castNativeType = function castNativeType(value) {
   return value;
 };
@@ -258,7 +231,6 @@ function makeBorderSize(size) {
   if (typeof size === 'number') {
     return "".concat(size, "px");
   }
-
   return size;
 }
 
@@ -293,7 +265,6 @@ var toTitleCase = function toTitleCase(inputString) {
  * @see {@link https://reactjs.org/docs/hooks-faq.html#how-to-get-the-previous-props-or-state}
  * @deprecated This utility will be deprecated in subsequent version.
  */
-
 function usePrevious(value) {
   var ref = useRef();
   useEffect(function () {
@@ -311,10 +282,8 @@ var ThemeContext = /*#__PURE__*/createContext({
     return null;
   }
 });
-
 var useTheme = function useTheme() {
   var themeContext = useContext(ThemeContext);
-
   return themeContext;
 };
 

package/build/utils/index.production.web.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.production.web.js","sources":["../../src/utils/getColorScheme/getColorScheme.web.ts","../../src/utils/getMediaQuery/getMediaQuery.ts","../../src/utils/getPlatformType/getPlatformType.ts","../../src/utils/useBreakpoint/useBreakpoint.ts","../../src/utils/useColorScheme/useColorScheme.ts","../../src/utils/platform/isReactNative.ts","../../src/utils/platform/getOS.web.ts","../../src/utils/platform/platform.ts","../../src/utils/platform/castUtils.ts","../../src/utils/makeBorderSize/makeBorderSize.ts","../../src/utils/makeMotionTime/makeMotionTime.web.ts","../../src/utils/makeSpace/makeSpace.ts","../../src/utils/makeTypographySize/makeTypographySize.web.ts","../../src/utils/makeSize/makeSize.ts","../../src/utils/toTitleCase/toTitleCase.ts","../../src/utils/usePrevious/usePrevious.ts","../../src/components/BladeProvider/useTheme.ts"],"sourcesContent":["import type { ColorSchemeNames, ColorSchemeNamesInput } from '~tokens/theme';\n\nexport const getColorScheme = (colorScheme: ColorSchemeNamesInput = 'light'): ColorSchemeNames => {\n  // @TODO: create a useMediaQuery hook with an event listener which will subscribe to changes and move all this logic there\n  const colorSchemeMediaQueryMap = {\n    light: '(prefers-color-scheme: light)',\n    dark: '(prefers-color-scheme: dark)',\n    system: 'default',\n  };\n  const supportsMatchMedia =\n    typeof window !== 'undefined' && typeof window.matchMedia === 'function';\n\n  if (colorScheme === 'light' || colorScheme === 'dark') {\n    return colorScheme;\n  }\n\n  if (\n    colorScheme === 'system' &&\n    supportsMatchMedia &&\n    window.matchMedia(colorSchemeMediaQueryMap.dark).matches\n  ) {\n    return 'dark';\n  }\n\n  return 'light';\n};\n","export const getMediaQuery = ({ min, max }: { min: number; max?: number }): string => {\n  return `screen and (min-width: ${min}px)${max ? ` and (max-width: ${max}px)` : ''}`;\n};\n","export type PlatformTypes = 'browser' | 'node' | 'react-native' | 'unknown';\n\nexport const getPlatformType = (): PlatformTypes => {\n  if (typeof navigator !== 'undefined' && navigator.product === 'ReactNative') {\n    return 'react-native';\n  }\n\n  if (typeof document !== 'undefined') {\n    return 'browser';\n  }\n\n  if (typeof process !== 'undefined') {\n    return 'node';\n  }\n\n  return 'unknown';\n};\n","/* eslint-disable @typescript-eslint/restrict-plus-operands */\nimport { useEffect, useState, useCallback, useMemo } from 'react';\nimport { getPlatformType } from '../getPlatformType';\nimport { getMediaQuery } from '../getMediaQuery';\nimport type { Breakpoints } from '~tokens/global';\n\nconst deviceType = {\n  desktop: 'desktop',\n  mobile: 'mobile',\n} as const;\n\ntype DeviceType = keyof typeof deviceType;\ntype Breakpoint = keyof Breakpoints | undefined;\n\ntype BreakpointAndDevice = {\n  matchedBreakpoint: Breakpoint;\n  matchedDeviceType: DeviceType;\n};\n\nexport const useBreakpoint = ({\n  breakpoints,\n}: {\n  breakpoints: Breakpoints;\n}): BreakpointAndDevice => {\n  const supportsMatchMedia =\n    typeof document !== 'undefined' &&\n    typeof window !== 'undefined' &&\n    typeof window?.matchMedia === 'function';\n\n  const breakpointsTokenAndQueryCollection = useMemo(\n    () =>\n      (supportsMatchMedia\n        ? Object.entries(breakpoints).map(([token, screenSize], index, breakpointsArray) => {\n            const min = screenSize;\n            const maxValue = breakpointsArray[index + 1]?.[1];\n            const mediaQuery = getMediaQuery({ min, max: maxValue ? maxValue - 1 : undefined });\n            return { token, screenSize, mediaQuery };\n          })\n        : []) as {\n        token: keyof Breakpoints;\n        screenSize: number;\n        mediaQuery: string;\n      }[],\n    [breakpoints, supportsMatchMedia],\n  );\n\n  const getMatchedDeviceType = useCallback((matchedBreakpoint: Breakpoint): DeviceType => {\n    let matchedDeviceType: DeviceType = deviceType.mobile;\n    const platform = getPlatformType();\n    if (platform === 'react-native') {\n      matchedDeviceType = deviceType.mobile;\n    } else if (platform === 'browser') {\n      if (matchedBreakpoint && ['base', 'xs', 's'].includes(matchedBreakpoint)) {\n        // tablet is also categorised as mobile\n        matchedDeviceType = deviceType.mobile;\n      } else {\n        matchedDeviceType = deviceType.desktop;\n      }\n    } else if (platform === 'node') {\n      //@TODO: Check for useragent for node\n      matchedDeviceType = deviceType.desktop;\n    }\n    return matchedDeviceType;\n  }, []);\n\n  const getMatchedBreakpoint = useCallback(\n    (event?: MediaQueryListEvent): Breakpoint => {\n      const matchedBreakpoint =\n        breakpointsTokenAndQueryCollection.find(({ mediaQuery = '' }) => {\n          // this will run whenever mediaQuery change event is triggered\n          if (event?.media === mediaQuery) {\n            return true;\n          }\n          // this will run when the state is initialised for the first time and hence the event object will be empty so we'll fallback to browser's window object\n          if (window.matchMedia(mediaQuery).matches) {\n            return true;\n          }\n          return false;\n        })?.token ?? undefined;\n\n      return matchedBreakpoint;\n    },\n    [breakpointsTokenAndQueryCollection],\n  );\n\n  const [breakpointAndDevice, setBreakpointAndDevice] = useState(() => {\n    const matchedBreakpoint = getMatchedBreakpoint();\n    const matchedDeviceType = getMatchedDeviceType(matchedBreakpoint);\n    return {\n      matchedBreakpoint,\n      matchedDeviceType,\n    };\n  });\n\n  useEffect(() => {\n    if (!supportsMatchMedia) {\n      return undefined;\n    }\n\n    const handleMediaQueryChange = (event: MediaQueryListEvent): void => {\n      setBreakpointAndDevice(() => {\n        const matchedBreakpoint = getMatchedBreakpoint(event);\n        const matchedDeviceType = getMatchedDeviceType(matchedBreakpoint);\n\n        return { matchedBreakpoint, matchedDeviceType };\n      });\n    };\n\n    const mediaQueryInstances = breakpointsTokenAndQueryCollection.map(({ mediaQuery = '' }) => {\n      const mediaQueryInstance = window.matchMedia(mediaQuery);\n      /**\n       * the mediaquery event listener is available on mediaQuery instances and not `window`\n       * we iterate over all the breakpoints we have, register each instance and store them as `mediaQueryInstances` so we can later unregister all of them.\n       */\n      if (mediaQueryInstance.addEventListener) {\n        mediaQueryInstance.addEventListener('change', handleMediaQueryChange);\n      } else {\n        // In older browsers MediaQueryList do not yet inherit from EventTarget, So using addListener as fallback - https://developer.mozilla.org/en-US/docs/Web/API/MediaQueryList/addListener\n        mediaQueryInstance.addListener(handleMediaQueryChange);\n      }\n      return mediaQueryInstance;\n    });\n\n    return (): void => {\n      mediaQueryInstances.forEach((mediaQueryInstance) => {\n        if (mediaQueryInstance.removeEventListener) {\n          mediaQueryInstance.removeEventListener('change', handleMediaQueryChange);\n        } else {\n          // In older browsers MediaQueryList do not yet inherit from EventTarget, So using removeListener as fallback - https://developer.mozilla.org/en-US/docs/Web/API/MediaQueryList/removeListener\n          mediaQueryInstance.removeListener(handleMediaQueryChange);\n        }\n      });\n    };\n  }, [\n    breakpointsTokenAndQueryCollection,\n    getMatchedBreakpoint,\n    getMatchedDeviceType,\n    supportsMatchMedia,\n  ]);\n\n  // @TODO: handle SSR scenarios\n  return breakpointAndDevice;\n};\n","import { useState, useCallback } from 'react';\nimport { getColorScheme } from '../getColorScheme';\nimport { colorSchemeNamesInput } from '~tokens/theme/theme';\nimport type { ColorSchemeNames, ColorSchemeNamesInput } from '~tokens/theme';\nimport { throwBladeError } from '~utils/logger';\n\nexport type UseColorScheme = {\n  colorScheme: ColorSchemeNames;\n  setColorScheme: (colorScheme: ColorSchemeNamesInput) => void;\n};\n\nexport const useColorScheme = (\n  initialColorScheme: ColorSchemeNamesInput = 'light',\n): UseColorScheme => {\n  // if colorScheme defined use that else fallback to 'light'\n  const [colorSchemeState, setColorSchemeState] = useState<ColorSchemeNames>(() =>\n    getColorScheme(initialColorScheme),\n  );\n\n  const setColorScheme = useCallback(function setThemeMode(colorScheme: ColorSchemeNamesInput) {\n    if (__DEV__) {\n      if (!colorSchemeNamesInput.includes(colorScheme)) {\n        throwBladeError({\n          message: `Expected color scheme to be one of [${colorSchemeNamesInput.toString()}] but received ${colorScheme}`,\n          moduleName: 'useColorScheme',\n        });\n      }\n    }\n    setColorSchemeState(getColorScheme(colorScheme));\n  }, []);\n\n  return {\n    colorScheme: colorSchemeState,\n    setColorScheme,\n  };\n};\n","/* eslint-disable @typescript-eslint/no-namespace */\nimport { getPlatformType } from '../getPlatformType';\n\nconst isReactNative = (): boolean => {\n  return getPlatformType() === 'react-native';\n};\n\nexport { isReactNative };\n","import type { Platform } from 'react-native';\n\nexport const getOS = (): typeof Platform.OS => {\n  return 'web';\n};\n\nexport const isAndroid = (): boolean => false;\n","/* eslint-disable @typescript-eslint/no-namespace */\nimport type { Brand, NativeOrWebBrand } from './types';\n\nnamespace Platform {\n  export type Name = 'web';\n  /**\n   * Right now, the module resolution is set to resolve `.web` files,\n   *\n   * Thus Platform.Select<> type will return the `web` type\n   */\n  export type Select<Options extends { web: unknown; native: unknown }> = Brand<\n    Options[Name],\n    'platform-web'\n  >;\n\n  export type CastNative<T extends NativeOrWebBrand | undefined> = Extract<\n    T,\n    { __brand__?: 'platform-native' | 'platform-all' }\n  >;\n\n  export type CastWeb<T extends NativeOrWebBrand | undefined> = Extract<\n    T,\n    { __brand__?: 'platform-web' | 'platform-all' }\n  >;\n}\n\nexport { Platform };\n","import type { Platform } from '.';\n\n/**\n * @description\n *\n * Casts a Platform.Select<> type to web type\n *\n * @example\n *\n * ```ts\n * type Example = Platform.Select<{ web: string; native: number }>;\n *\n * const extractedWebType = castWebType('' as Example);\n * //    ^ string\n * ```\n */\nconst castWebType = <T>(value: T): Platform.CastWeb<T> => {\n  return value as Platform.CastWeb<typeof value>;\n};\n\n/**\n * @description\n *\n * Casts a Platform.Select<> type to native type\n *\n * @example\n *\n * ```ts\n * type Example = Platform.Select<{ web: string; native: number }>;\n *\n * const extractedNativeType = castNativeType('' as Example);\n * //    ^ number\n * ```\n */\nconst castNativeType = <T>(value: T): Platform.CastNative<T> => {\n  return value as Platform.CastNative<typeof value>;\n};\n\nexport { castWebType, castNativeType };\n","export function makeBorderSize<T extends number>(size: T): `${T}px`;\nexport function makeBorderSize<T extends string>(size: T): T;\nexport function makeBorderSize<T extends number | string>(size: T): `${T}px` | T {\n  if (typeof size === 'number') {\n    return `${size}px`;\n  }\n  return size;\n}\n","import type { MakeMotionTime } from './types';\nimport type { Platform } from '~utils';\n\nexport const makeMotionTime = <T extends number>(time: T): Platform.CastWeb<MakeMotionTime<T>> => {\n  return `${time}ms`;\n};\n","export const makeSpace = <T extends number>(size: T): `${T}px` => {\n  return `${size}px`;\n};\n","export const makeTypographySize = (size: number): `${number}rem` => {\n  const remValue = size / 16;\n  return `${remValue}rem`;\n};\n","export type MakeSize<T extends number> = `${T}px`;\n\nexport const makeSize = <T extends number>(size: T): `${T}px` => {\n  return `${size}px`;\n};\n","/**\n * @deprecated This utility will be deprecated in subsequent version.\n */\nexport const toTitleCase = (inputString: string): string =>\n  inputString\n    .toLowerCase()\n    .split(' ')\n    .map((word) => word.charAt(0).toUpperCase() + word.slice(1))\n    .join(' ');\n","import type { MutableRefObject } from 'react';\nimport { useEffect, useRef } from 'react';\n\n/**\n * a type-safe version of the `usePrevious` hook described here:\n * @see {@link https://reactjs.org/docs/hooks-faq.html#how-to-get-the-previous-props-or-state}\n * @deprecated This utility will be deprecated in subsequent version.\n */\nexport function usePrevious<T>(value: T): MutableRefObject<T | undefined>['current'] {\n  const ref = useRef<T>();\n\n  useEffect(() => {\n    ref.current = value;\n  }, [value]);\n\n  return ref.current;\n}\n","import { useContext, createContext } from 'react';\nimport type { UseColorScheme } from '../../utils/useColorScheme';\nimport type { Theme } from './';\nimport type { TypographyPlatforms } from '~tokens/global';\nimport { throwBladeError } from '~utils/logger';\n\nexport type ThemeContext = UseColorScheme & {\n  theme: Theme;\n  platform: TypographyPlatforms;\n};\n\nexport const ThemeContext = createContext<ThemeContext>({\n  // @ts-expect-error set null\n  theme: null,\n  colorScheme: 'light',\n  platform: 'onDesktop',\n  setColorScheme: () => null,\n});\n\nconst useTheme = (): ThemeContext => {\n  const themeContext = useContext<ThemeContext>(ThemeContext);\n  if (__DEV__) {\n    if (!themeContext.theme) {\n      throwBladeError({\n        message: 'BladeProvider is missing theme',\n        moduleName: 'BladeProvider',\n      });\n    }\n    if (themeContext === undefined) {\n      throwBladeError({\n        message: 'useTheme must be used within BladeProvider',\n        moduleName: 'BladeProvider',\n      });\n    }\n  }\n  return themeContext;\n};\n\nexport default useTheme;\n"],"names":["getColorScheme","colorScheme","colorSchemeMediaQueryMap","light","dark","system","supportsMatchMedia","window","matchMedia","matches","getMediaQuery","min","max","getPlatformType","navigator","product","document","process","deviceType","desktop","mobile","useBreakpoint","breakpoints","breakpointsTokenAndQueryCollection","useMemo","Object","entries","map","index","breakpointsArray","token","screenSize","maxValue","mediaQuery","undefined","getMatchedDeviceType","useCallback","matchedBreakpoint","matchedDeviceType","platform","includes","getMatchedBreakpoint","event","find","media","useState","breakpointAndDevice","setBreakpointAndDevice","useEffect","handleMediaQueryChange","mediaQueryInstances","mediaQueryInstance","addEventListener","addListener","forEach","removeEventListener","removeListener","useColorScheme","initialColorScheme","colorSchemeState","setColorSchemeState","setColorScheme","setThemeMode","isReactNative","getOS","isAndroid","Platform","castWebType","value","castNativeType","makeBorderSize","size","makeMotionTime","time","makeSpace","makeTypographySize","remValue","makeSize","toTitleCase","inputString","toLowerCase","split","word","charAt","toUpperCase","slice","join","usePrevious","ref","useRef","current","ThemeContext","createContext","theme","useTheme","themeContext","useContext"],"mappings":"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"}
+{"version":3,"file":"index.production.web.js","sources":["../../src/utils/getColorScheme/getColorScheme.web.ts","../../src/utils/getMediaQuery/getMediaQuery.ts","../../src/utils/getPlatformType/getPlatformType.ts","../../src/utils/useBreakpoint/useBreakpoint.ts","../../src/utils/useColorScheme/useColorScheme.ts","../../src/utils/platform/isReactNative.ts","../../src/utils/platform/getOS.web.ts","../../src/utils/platform/platform.ts","../../src/utils/platform/castUtils.ts","../../src/utils/makeBorderSize/makeBorderSize.ts","../../src/utils/makeMotionTime/makeMotionTime.web.ts","../../src/utils/makeSpace/makeSpace.ts","../../src/utils/makeTypographySize/makeTypographySize.web.ts","../../src/utils/makeSize/makeSize.ts","../../src/utils/toTitleCase/toTitleCase.ts","../../src/utils/usePrevious/usePrevious.ts","../../src/components/BladeProvider/useTheme.ts"],"sourcesContent":["import type { ColorSchemeNames, ColorSchemeNamesInput } from '~tokens/theme';\n\nexport const getColorScheme = (colorScheme: ColorSchemeNamesInput = 'light'): ColorSchemeNames => {\n  // @TODO: create a useMediaQuery hook with an event listener which will subscribe to changes and move all this logic there\n  const colorSchemeMediaQueryMap = {\n    light: '(prefers-color-scheme: light)',\n    dark: '(prefers-color-scheme: dark)',\n    system: 'default',\n  };\n  const supportsMatchMedia =\n    typeof window !== 'undefined' && typeof window.matchMedia === 'function';\n\n  if (colorScheme === 'light' || colorScheme === 'dark') {\n    return colorScheme;\n  }\n\n  if (\n    colorScheme === 'system' &&\n    supportsMatchMedia &&\n    window.matchMedia(colorSchemeMediaQueryMap.dark).matches\n  ) {\n    return 'dark';\n  }\n\n  return 'light';\n};\n","export const getMediaQuery = ({ min, max }: { min: number; max?: number }): string => {\n  return `screen and (min-width: ${min}px)${max ? ` and (max-width: ${max}px)` : ''}`;\n};\n","export type PlatformTypes = 'browser' | 'node' | 'react-native' | 'unknown';\n\nexport const getPlatformType = (): PlatformTypes => {\n  if (typeof navigator !== 'undefined' && navigator.product === 'ReactNative') {\n    return 'react-native';\n  }\n\n  if (typeof document !== 'undefined') {\n    return 'browser';\n  }\n\n  if (typeof process !== 'undefined') {\n    return 'node';\n  }\n\n  return 'unknown';\n};\n","/* eslint-disable @typescript-eslint/restrict-plus-operands */\nimport { useEffect, useState, useCallback, useMemo } from 'react';\nimport { getPlatformType } from '../getPlatformType';\nimport { getMediaQuery } from '../getMediaQuery';\nimport type { Breakpoints } from '~tokens/global';\n\nconst deviceType = {\n  desktop: 'desktop',\n  mobile: 'mobile',\n} as const;\n\ntype DeviceType = keyof typeof deviceType;\ntype Breakpoint = keyof Breakpoints | undefined;\n\ntype BreakpointAndDevice = {\n  matchedBreakpoint: Breakpoint;\n  matchedDeviceType: DeviceType;\n};\n\nexport const useBreakpoint = ({\n  breakpoints,\n}: {\n  breakpoints: Breakpoints;\n}): BreakpointAndDevice => {\n  const supportsMatchMedia =\n    typeof document !== 'undefined' &&\n    typeof window !== 'undefined' &&\n    typeof window?.matchMedia === 'function';\n\n  const breakpointsTokenAndQueryCollection = useMemo(\n    () =>\n      (supportsMatchMedia\n        ? Object.entries(breakpoints).map(([token, screenSize], index, breakpointsArray) => {\n            const min = screenSize;\n            const maxValue = breakpointsArray[index + 1]?.[1];\n            const mediaQuery = getMediaQuery({ min, max: maxValue ? maxValue - 1 : undefined });\n            return { token, screenSize, mediaQuery };\n          })\n        : []) as {\n        token: keyof Breakpoints;\n        screenSize: number;\n        mediaQuery: string;\n      }[],\n    [breakpoints, supportsMatchMedia],\n  );\n\n  const getMatchedDeviceType = useCallback((matchedBreakpoint: Breakpoint): DeviceType => {\n    let matchedDeviceType: DeviceType = deviceType.mobile;\n    const platform = getPlatformType();\n    if (platform === 'react-native') {\n      matchedDeviceType = deviceType.mobile;\n    } else if (platform === 'browser') {\n      if (matchedBreakpoint && ['base', 'xs', 's'].includes(matchedBreakpoint)) {\n        // tablet is also categorised as mobile\n        matchedDeviceType = deviceType.mobile;\n      } else {\n        matchedDeviceType = deviceType.desktop;\n      }\n    } else if (platform === 'node') {\n      //@TODO: Check for useragent for node\n      matchedDeviceType = deviceType.desktop;\n    }\n    return matchedDeviceType;\n  }, []);\n\n  const getMatchedBreakpoint = useCallback(\n    (event?: MediaQueryListEvent): Breakpoint => {\n      const matchedBreakpoint =\n        breakpointsTokenAndQueryCollection.find(({ mediaQuery = '' }) => {\n          // this will run whenever mediaQuery change event is triggered\n          if (event?.media === mediaQuery) {\n            return true;\n          }\n          // this will run when the state is initialised for the first time and hence the event object will be empty so we'll fallback to browser's window object\n          if (window.matchMedia(mediaQuery).matches) {\n            return true;\n          }\n          return false;\n        })?.token ?? undefined;\n\n      return matchedBreakpoint;\n    },\n    [breakpointsTokenAndQueryCollection],\n  );\n\n  const [breakpointAndDevice, setBreakpointAndDevice] = useState(() => {\n    const matchedBreakpoint = getMatchedBreakpoint();\n    const matchedDeviceType = getMatchedDeviceType(matchedBreakpoint);\n    return {\n      matchedBreakpoint,\n      matchedDeviceType,\n    };\n  });\n\n  useEffect(() => {\n    if (!supportsMatchMedia) {\n      return undefined;\n    }\n\n    const handleMediaQueryChange = (event: MediaQueryListEvent): void => {\n      setBreakpointAndDevice(() => {\n        const matchedBreakpoint = getMatchedBreakpoint(event);\n        const matchedDeviceType = getMatchedDeviceType(matchedBreakpoint);\n\n        return { matchedBreakpoint, matchedDeviceType };\n      });\n    };\n\n    const mediaQueryInstances = breakpointsTokenAndQueryCollection.map(({ mediaQuery = '' }) => {\n      const mediaQueryInstance = window.matchMedia(mediaQuery);\n      /**\n       * the mediaquery event listener is available on mediaQuery instances and not `window`\n       * we iterate over all the breakpoints we have, register each instance and store them as `mediaQueryInstances` so we can later unregister all of them.\n       */\n      if (mediaQueryInstance.addEventListener) {\n        mediaQueryInstance.addEventListener('change', handleMediaQueryChange);\n      } else {\n        // In older browsers MediaQueryList do not yet inherit from EventTarget, So using addListener as fallback - https://developer.mozilla.org/en-US/docs/Web/API/MediaQueryList/addListener\n        mediaQueryInstance.addListener(handleMediaQueryChange);\n      }\n      return mediaQueryInstance;\n    });\n\n    return (): void => {\n      mediaQueryInstances.forEach((mediaQueryInstance) => {\n        if (mediaQueryInstance.removeEventListener) {\n          mediaQueryInstance.removeEventListener('change', handleMediaQueryChange);\n        } else {\n          // In older browsers MediaQueryList do not yet inherit from EventTarget, So using removeListener as fallback - https://developer.mozilla.org/en-US/docs/Web/API/MediaQueryList/removeListener\n          mediaQueryInstance.removeListener(handleMediaQueryChange);\n        }\n      });\n    };\n  }, [\n    breakpointsTokenAndQueryCollection,\n    getMatchedBreakpoint,\n    getMatchedDeviceType,\n    supportsMatchMedia,\n  ]);\n\n  // @TODO: handle SSR scenarios\n  return breakpointAndDevice;\n};\n","import { useState, useCallback } from 'react';\nimport { getColorScheme } from '../getColorScheme';\nimport { colorSchemeNamesInput } from '~tokens/theme/theme';\nimport type { ColorSchemeNames, ColorSchemeNamesInput } from '~tokens/theme';\nimport { throwBladeError } from '~utils/logger';\n\nexport type UseColorScheme = {\n  colorScheme: ColorSchemeNames;\n  setColorScheme: (colorScheme: ColorSchemeNamesInput) => void;\n};\n\nexport const useColorScheme = (\n  initialColorScheme: ColorSchemeNamesInput = 'light',\n): UseColorScheme => {\n  // if colorScheme defined use that else fallback to 'light'\n  const [colorSchemeState, setColorSchemeState] = useState<ColorSchemeNames>(() =>\n    getColorScheme(initialColorScheme),\n  );\n\n  const setColorScheme = useCallback(function setThemeMode(colorScheme: ColorSchemeNamesInput) {\n    if (__DEV__) {\n      if (!colorSchemeNamesInput.includes(colorScheme)) {\n        throwBladeError({\n          message: `Expected color scheme to be one of [${colorSchemeNamesInput.toString()}] but received ${colorScheme}`,\n          moduleName: 'useColorScheme',\n        });\n      }\n    }\n    setColorSchemeState(getColorScheme(colorScheme));\n  }, []);\n\n  return {\n    colorScheme: colorSchemeState,\n    setColorScheme,\n  };\n};\n","/* eslint-disable @typescript-eslint/no-namespace */\nimport { getPlatformType } from '../getPlatformType';\n\nconst isReactNative = (): boolean => {\n  return getPlatformType() === 'react-native';\n};\n\nexport { isReactNative };\n","import type { Platform } from 'react-native';\n\nexport const getOS = (): typeof Platform.OS => {\n  return 'web';\n};\n\nexport const isAndroid = (): boolean => false;\n","/* eslint-disable @typescript-eslint/no-namespace */\nimport type { Brand, NativeOrWebBrand } from './types';\n\nnamespace Platform {\n  export type Name = 'web';\n  /**\n   * Right now, the module resolution is set to resolve `.web` files,\n   *\n   * Thus Platform.Select<> type will return the `web` type\n   */\n  export type Select<Options extends { web: unknown; native: unknown }> = Brand<\n    Options[Name],\n    'platform-web'\n  >;\n\n  export type CastNative<T extends NativeOrWebBrand | undefined> = Extract<\n    T,\n    { __brand__?: 'platform-native' | 'platform-all' }\n  >;\n\n  export type CastWeb<T extends NativeOrWebBrand | undefined> = Extract<\n    T,\n    { __brand__?: 'platform-web' | 'platform-all' }\n  >;\n}\n\nexport { Platform };\n","import type { Platform } from '.';\n\n/**\n * @description\n *\n * Casts a Platform.Select<> type to web type\n *\n * @example\n *\n * ```ts\n * type Example = Platform.Select<{ web: string; native: number }>;\n *\n * const extractedWebType = castWebType('' as Example);\n * //    ^ string\n * ```\n */\nconst castWebType = <T>(value: T): Platform.CastWeb<T> => {\n  return value as Platform.CastWeb<typeof value>;\n};\n\n/**\n * @description\n *\n * Casts a Platform.Select<> type to native type\n *\n * @example\n *\n * ```ts\n * type Example = Platform.Select<{ web: string; native: number }>;\n *\n * const extractedNativeType = castNativeType('' as Example);\n * //    ^ number\n * ```\n */\nconst castNativeType = <T>(value: T): Platform.CastNative<T> => {\n  return value as Platform.CastNative<typeof value>;\n};\n\nexport { castWebType, castNativeType };\n","export function makeBorderSize<T extends number>(size: T): `${T}px`;\nexport function makeBorderSize<T extends string>(size: T): T;\nexport function makeBorderSize<T extends number | string>(size: T): `${T}px` | T {\n  if (typeof size === 'number') {\n    return `${size}px`;\n  }\n  return size;\n}\n","import type { MakeMotionTime } from './types';\nimport type { Platform } from '~utils';\n\nexport const makeMotionTime = <T extends number>(time: T): Platform.CastWeb<MakeMotionTime<T>> => {\n  return `${time}ms`;\n};\n","export const makeSpace = <T extends number>(size: T): `${T}px` => {\n  return `${size}px`;\n};\n","export const makeTypographySize = (size: number): `${number}rem` => {\n  const remValue = size / 16;\n  return `${remValue}rem`;\n};\n","export type MakeSize<T extends number> = `${T}px`;\n\nexport const makeSize = <T extends number>(size: T): `${T}px` => {\n  return `${size}px`;\n};\n","/**\n * @deprecated This utility will be deprecated in subsequent version.\n */\nexport const toTitleCase = (inputString: string): string =>\n  inputString\n    .toLowerCase()\n    .split(' ')\n    .map((word) => word.charAt(0).toUpperCase() + word.slice(1))\n    .join(' ');\n","import type { MutableRefObject } from 'react';\nimport { useEffect, useRef } from 'react';\n\n/**\n * a type-safe version of the `usePrevious` hook described here:\n * @see {@link https://reactjs.org/docs/hooks-faq.html#how-to-get-the-previous-props-or-state}\n * @deprecated This utility will be deprecated in subsequent version.\n */\nexport function usePrevious<T>(value: T): MutableRefObject<T | undefined>['current'] {\n  const ref = useRef<T>();\n\n  useEffect(() => {\n    ref.current = value;\n  }, [value]);\n\n  return ref.current;\n}\n","import { useContext, createContext } from 'react';\nimport type { UseColorScheme } from '../../utils/useColorScheme';\nimport type { Theme } from './';\nimport type { TypographyPlatforms } from '~tokens/global';\nimport { throwBladeError } from '~utils/logger';\n\nexport type ThemeContext = UseColorScheme & {\n  theme: Theme;\n  platform: TypographyPlatforms;\n};\n\nexport const ThemeContext = createContext<ThemeContext>({\n  // @ts-expect-error set null\n  theme: null,\n  colorScheme: 'light',\n  platform: 'onDesktop',\n  setColorScheme: () => null,\n});\n\nconst useTheme = (): ThemeContext => {\n  const themeContext = useContext<ThemeContext>(ThemeContext);\n  if (__DEV__) {\n    if (!themeContext.theme) {\n      throwBladeError({\n        message: 'BladeProvider is missing theme',\n        moduleName: 'BladeProvider',\n      });\n    }\n    if (themeContext === undefined) {\n      throwBladeError({\n        message: 'useTheme must be used within BladeProvider',\n        moduleName: 'BladeProvider',\n      });\n    }\n  }\n  return themeContext;\n};\n\nexport default useTheme;\n"],"names":["getColorScheme","colorScheme","arguments","length","undefined","colorSchemeMediaQueryMap","light","dark","system","supportsMatchMedia","window","matchMedia","matches","getMediaQuery","_ref","min","max","concat","getPlatformType","navigator","product","document","process","deviceType","desktop","mobile","useBreakpoint","_window","breakpoints","breakpointsTokenAndQueryCollection","useMemo","Object","entries","map","_ref2","index","breakpointsArray","_breakpointsArray","_ref3","_slicedToArray","token","screenSize","maxValue","mediaQuery","getMatchedDeviceType","useCallback","matchedBreakpoint","matchedDeviceType","platform","includes","getMatchedBreakpoint","event","_breakpointsTokenAndQ","_breakpointsTokenAndQ2","find","_ref4","_ref4$mediaQuery","media","_useState","useState","_useState2","breakpointAndDevice","setBreakpointAndDevice","useEffect","handleMediaQueryChange","mediaQueryInstances","_ref5","_ref5$mediaQuery","mediaQueryInstance","addEventListener","addListener","forEach","removeEventListener","removeListener","useColorScheme","initialColorScheme","colorSchemeState","setColorSchemeState","setColorScheme","setThemeMode","isReactNative","getOS","isAndroid","Platform","_Platform","castWebType","value","castNativeType","makeBorderSize","size","makeMotionTime","time","makeSpace","makeTypographySize","remValue","makeSize","toTitleCase","inputString","toLowerCase","split","word","charAt","toUpperCase","slice","join","usePrevious","ref","useRef","current","ThemeContext","createContext","theme","useTheme","themeContext","useContext"],"mappings":"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"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@razorpay/blade",
   "description": "The Design System that powers Razorpay",
-  "version": "9.6.1",
+  "version": "10.0.0",
   "license": "MIT",
   "engines": {
     "node": ">=18.12.1"
@@ -114,7 +114,7 @@
     "postinstall": "patch-package"
   },
   "dependencies": {
-    "@babel/runtime": "7.16.5",
+    "@babel/runtime": "7.20.0",
     "@types/body-scroll-lock": "3.1.0",
     "@use-gesture/react": "10.2.24",
     "body-scroll-lock": "4.0.0-beta.0",
@@ -124,16 +124,17 @@
     "patch-package": "7.0.0"
   },
   "devDependencies": {
-    "@babel/core": "7.16.5",
+    "@babel/core": "7.20.2",
     "@babel/plugin-transform-react-jsx": "7.16.5",
     "@babel/plugin-transform-runtime": "7.16.5",
-    "@babel/preset-env": "7.16.5",
+    "@babel/preset-env": "7.20.2",
     "@babel/preset-react": "7.16.5",
     "@babel/preset-typescript": "7.16.5",
     "@codesandbox/sandpack-react": "1.16.0",
     "@gorhom/bottom-sheet": "4.4.6",
     "@gorhom/portal": "1.0.14",
-    "@react-native-async-storage/async-storage": "1.15.14",
+    "@react-native/metro-config": "0.72.9",
+    "@react-native-async-storage/async-storage": "1.19.1",
     "@react-native-community/datetimepicker": "5.0.1",
     "@react-native-community/slider": "4.1.12",
     "@rollup/plugin-alias": "3.1.9",
@@ -159,9 +160,9 @@
     "@storybook/react-native": "6.0.1-alpha.7",
     "@testing-library/jest-dom": "5.16.4",
     "@testing-library/jest-native": "5.4.2",
-    "@testing-library/react": "12.1.5",
+    "@testing-library/react": "13.4.0",
     "@testing-library/react-hooks": "8.0.1",
-    "@testing-library/react-native": "12.1.3",
+    "@testing-library/react-native": "12.2.0",
     "@testing-library/user-event": "14.4.3",
     "@types/body-scroll-lock": "3.1.0",
     "@types/dedent": "0.7.0",
@@ -171,7 +172,7 @@
     "@types/jsdom": "20.0.1",
     "@types/lodash": "4.14.168",
     "@types/react": "17.0.38",
-    "@types/react-native": "0.66.9",
+    "@types/react-native": "0.72.2",
     "@types/react-test-renderer": "17.0.1",
     "@types/styled-components": "5.1.25",
     "@types/styled-components-react-native": "5.1.3",
@@ -199,18 +200,18 @@
     "jscodeshift": "0.13.1",
     "jsdom": "20.0.2",
     "lodash": "4.17.21",
-    "metro-react-native-babel-preset": "0.66.2",
+    "metro-react-native-babel-preset": "0.76.7",
     "moniker": "0.1.2",
     "npm-run-all": "4.1.5",
     "outdent": "0.8.0",
-    "react": "17.0.2",
-    "react-dom": "17.0.2",
-    "react-native": "0.66.5",
+    "react": "18.2.0",
+    "react-dom": "18.2.0",
+    "react-native": "0.72.3",
     "react-native-gesture-handler": "2.9.0",
-    "react-native-reanimated": "2.14.4",
+    "react-native-reanimated": "3.4.1",
     "react-native-svg": "12.3.0",
     "react-scripts": "4.0.3",
-    "react-test-renderer": "17.0.2",
+    "react-test-renderer": "18.2.0",
     "rollup": "2.61.1",
     "rollup-plugin-dts": "4.0.1",
     "rollup-plugin-peer-deps-external": "2.2.4",
@@ -226,10 +227,10 @@
     "@gorhom/portal": "1.0.14",
     "@floating-ui/react": "0.24.2",
     "@floating-ui/react-native": "0.10.0",
-    "react": ">=17",
-    "react-dom": ">=17",
-    "react-native": "^0.66.5",
-    "react-native-reanimated": "^2.6.0",
+    "react": ">=18",
+    "react-dom": ">=18",
+    "react-native": "^0.72",
+    "react-native-reanimated": "^3.4.1",
     "react-native-svg": "^12.3.0",
     "styled-components": "^5",
     "react-native-gesture-handler": "^2.9.0"
@@ -246,10 +247,10 @@
     }
   },
   "resolutions": {
-    "@storybook/**/react-dom": "17.0.2",
-    "@storybook/**/react": "17.0.2",
-    "react-dom": "17.0.2",
-    "react": "17.0.2",
+    "@storybook/**/react-dom": "18.2.0",
+    "@storybook/**/react": "18.2.0",
+    "react-dom": "18.2.0",
+    "react": "18.2.0",
     "styled-components": "^5"
   },
   "bundlemon": {