@wordpress/compose/build-module/hooks/use-viewport-match/index.mjs.map

WordPress higher-order components (HOCs).

{
  "version": 3,
  "sources": ["../../../src/hooks/use-viewport-match/index.ts"],
  "sourcesContent": ["/**\n * WordPress dependencies\n */\nimport { createContext, useContext } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport useMediaQuery from '../use-media-query';\n\ntype Breakpoint =\n\t| 'xhuge'\n\t| 'huge'\n\t| 'wide'\n\t| 'xlarge'\n\t| 'large'\n\t| 'medium'\n\t| 'small'\n\t| 'mobile';\ntype ViewportOperator = '>=' | '<';\n\n/**\n * Hash of breakpoint names with pixel width at which it becomes effective.\n *\n * @see _breakpoints.scss\n */\nconst BREAKPOINTS: Record< Breakpoint, number > = {\n\txhuge: 1920,\n\thuge: 1440,\n\twide: 1280,\n\txlarge: 1080,\n\tlarge: 960,\n\tmedium: 782,\n\tsmall: 600,\n\tmobile: 480,\n};\n\n/**\n * Object mapping media query operators to the condition to be used.\n */\nconst CONDITIONS: Record< ViewportOperator, string > = {\n\t'>=': 'min-width',\n\t'<': 'max-width',\n};\n\n/**\n * Object mapping media query operators to a function that evaluates if the operator matches.\n */\nconst OPERATOR_EVALUATORS: Record<\n\tViewportOperator,\n\t( breakpointValue: number, width: number ) => boolean\n> = {\n\t'>=': ( breakpointValue, width ) => width >= breakpointValue,\n\t'<': ( breakpointValue, width ) => width < breakpointValue,\n};\n\nconst ViewportMatchWidthContext = createContext< number | null >( null );\nViewportMatchWidthContext.displayName = 'ViewportMatchWidthContext';\n\n/**\n * Returns true if the viewport matches the given query, or false otherwise.\n *\n * @param breakpoint Breakpoint size name.\n * @param operator   Viewport operator.\n * @param view       Window instance in which to perform viewport matching.\n *\n * @example\n *\n * ```ts\n * useViewportMatch( 'huge', '<' );\n * useViewportMatch( 'medium' );\n * ```\n *\n * @return Whether viewport matches query.\n */\nconst useViewportMatch = (\n\tbreakpoint: Breakpoint,\n\toperator: ViewportOperator = '>=',\n\t// Resolve the default lazily so SSR (where `window` is undeclared) does not\n\t// throw a ReferenceError when this default expression is evaluated.\n\tview: Window | undefined = typeof window !== 'undefined'\n\t\t? window\n\t\t: undefined\n): boolean => {\n\tconst simulatedWidth = useContext( ViewportMatchWidthContext );\n\tconst mediaQuery =\n\t\t! simulatedWidth &&\n\t\t`(${ CONDITIONS[ operator ] }: ${ BREAKPOINTS[ breakpoint ] }px)`;\n\tconst mediaQueryResult = useMediaQuery( mediaQuery || undefined, view );\n\n\tif ( simulatedWidth ) {\n\t\treturn OPERATOR_EVALUATORS[ operator ](\n\t\t\tBREAKPOINTS[ breakpoint ],\n\t\t\tsimulatedWidth\n\t\t);\n\t}\n\treturn mediaQueryResult;\n};\n\nuseViewportMatch.__experimentalWidthProvider =\n\tViewportMatchWidthContext.Provider;\n\nexport default useViewportMatch;\n"],
  "mappings": ";AAGA,SAAS,eAAe,kBAAkB;AAK1C,OAAO,mBAAmB;AAkB1B,IAAM,cAA4C;AAAA,EACjD,OAAO;AAAA,EACP,MAAM;AAAA,EACN,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,QAAQ;AACT;AAKA,IAAM,aAAiD;AAAA,EACtD,MAAM;AAAA,EACN,KAAK;AACN;AAKA,IAAM,sBAGF;AAAA,EACH,MAAM,CAAE,iBAAiB,UAAW,SAAS;AAAA,EAC7C,KAAK,CAAE,iBAAiB,UAAW,QAAQ;AAC5C;AAEA,IAAM,4BAA4B,cAAgC,IAAK;AACvE,0BAA0B,cAAc;AAkBxC,IAAM,mBAAmB,CACxB,YACA,WAA6B,MAG7B,OAA2B,OAAO,WAAW,cAC1C,SACA,WACU;AACb,QAAM,iBAAiB,WAAY,yBAA0B;AAC7D,QAAM,aACL,CAAE,kBACF,IAAK,WAAY,QAAS,CAAE,KAAM,YAAa,UAAW,CAAE;AAC7D,QAAM,mBAAmB,cAAe,cAAc,QAAW,IAAK;AAEtE,MAAK,gBAAiB;AACrB,WAAO,oBAAqB,QAAS;AAAA,MACpC,YAAa,UAAW;AAAA,MACxB;AAAA,IACD;AAAA,EACD;AACA,SAAO;AACR;AAEA,iBAAiB,8BAChB,0BAA0B;AAE3B,IAAO,6BAAQ;",
  "names": []
}