react-native-shine 0.2.1 → 0.3.0

package/README.md

@@ -1,6 +1,6 @@
 # react-native-shine
 
-Fast and efficient way to add interactive GPU-based shader effects to your React Native apps using [TypeGPU](https://github.com/type-gpu/type-gpu) and [WebGPU](https://github.com/wojtus7/react-native-wgpu).
+Fast and efficient way to add interactive GPU-based shader effects to your React Native apps using [TypeGPU](https://github.com/software-mansion/TypeGPU) and [WebGPU](https://github.com/wcandillon/react-native-webgpu).
 
 `react-native-shine` leverages powerful GPU execution via native bindings, delivering lovely, fancy and **shiny** effects—ideal for UIs or creative interactions.
 

package/lib/module/components/Shine.js

@@ -0,0 +1,269 @@
+"use strict";
+
+import { useEffect, useMemo, useRef, useState } from 'react';
+import { Canvas, useDevice, useGPUContext } from 'react-native-wgpu';
+import { getOrInitRoot } from "../roots.js";
+import mainVertex from "../shaders/vertexShaders/mainVertex.js";
+import getBitmapFromURI from "../shaders/resourceManagement/bitmaps.js";
+import { clamp, rotate2D, subscribeToOrientationChange, getAngleFromDimensions } from "../shaders/utils.js";
+import { glareOptionsBindGroupLayout, colorMaskBindGroupLayout, rotationValuesBindGroupLayout, textureBindGroupLayout, bufferData } from "../shaders/bindGroupLayouts.js";
+import Animated, { SensorType, useAnimatedSensor, useAnimatedStyle, useDerivedValue, useSharedValue } from 'react-native-reanimated';
+import * as d from 'typegpu/data';
+import { PixelRatio, Platform, View } from 'react-native';
+import { createGlareOptionsBindGroup, createColorMaskBindGroup, createRotationValuesBindGroup } from "../shaders/bindGroupUtils.js";
+import { createBindGroupPairs, createGlareOptions, createColorMask, colorMaskToTyped } from "../types/typeUtils.js";
+import { attachBindGroups, blend, createReverseHoloPipeline, createMaskPipeline, getDefaultTarget, pipelineRenderFunction, createRainbowHoloPipeline as createHoloPipeline } from "../shaders/pipelineSetups.js";
+import colorMaskFragment from "../shaders/fragmentShaders/colorMaskFragment.js";
+import { createTexture, loadTexture } from "../shaders/resourceManagement/textures.js";
+import { newGlareFragment } from "../shaders/fragmentShaders/glareFragment.js";
+import { TypedBufferMap } from "../shaders/resourceManagement/bufferManager.js";
+import { jsx as _jsx } from "react/jsx-runtime";
+export function Shine({
+  width,
+  height,
+  imageURI,
+  glareOptions: glareOptions,
+  colorMaskOptions,
+  maskURI,
+  touchPosition,
+  useTouchControl = false,
+  addTextureMask = false,
+  addHolo = false,
+  addReverseHolo = false
+}) {
+  const {
+    device = null
+  } = useDevice();
+  const root = device ? getOrInitRoot(device) : null;
+  const {
+    ref,
+    context
+  } = useGPUContext();
+  const presentationFormat = navigator.gpu.getPreferredCanvasFormat();
+  const frameRef = useRef(null);
+
+  //changing canvas size to prevent blur
+  const dpr = PixelRatio.get();
+  const logicalWidth = width;
+  const logicalHeight = height;
+  const pixelWidth = Math.max(1, Math.round(logicalWidth * dpr));
+  const pixelHeight = Math.max(1, Math.round(logicalHeight * dpr));
+  const [imageTexture, setImageTexture] = useState(null);
+  const [maskTexture, setMaskTexture] = useState(null);
+  const orientationAngle = useSharedValue(0); // degrees
+  const rotationShared = useSharedValue([0, 0, 0]); // final GPU offsets
+
+  // Calibration shared values (UI thread)
+  const initialGravity = useSharedValue([0, 0, 0]);
+  const calibSum = useSharedValue([0, 0, 0]);
+  const calibCount = useSharedValue(0);
+  const calibrated = useSharedValue(false);
+  const gravitySensor = useAnimatedSensor(SensorType.GRAVITY, {
+    interval: 20
+  });
+  const bufferManager = useMemo(() => new TypedBufferMap(bufferData), []);
+
+  //TODO: add once again, when the wgpu issues are fixed :3
+
+  const animatedStyle = useAnimatedStyle(() => {
+    // const rotX = rotationShared.value[0] * 10;
+    // const rotY = rotationShared.value[1] * 10;
+
+    return {
+      transform: [{
+        perspective: 300
+      }
+      // { rotateX: `${-rotX}deg` },
+      // { rotateY: `${rotY}deg` },
+      // { rotateZ: `${rotX * 5}deg` },
+      ]
+    };
+  });
+  // Subscribe to orientation changes and reset calibration on change
+  useEffect(() => {
+    orientationAngle.value = getAngleFromDimensions();
+    const unsubscribe = subscribeToOrientationChange(angleDeg => {
+      orientationAngle.value = angleDeg;
+    });
+    return () => unsubscribe();
+  }, [orientationAngle]);
+
+  // Calibration & mapping logic
+  useDerivedValue(() => {
+    'worklet';
+
+    if (useTouchControl) {
+      rotationShared.value = touchPosition ? [...touchPosition.value, 0] : [0, 0, 0];
+      return;
+    }
+
+    // console.log(orientationAngle.value);
+    const v = gravitySensor.sensor?.value ?? gravitySensor.sensor.value ?? {
+      x: 0,
+      y: 0,
+      z: 0
+    };
+    const gx = v.x ?? 0;
+    const gy = v.y ?? 0;
+    const gz = v.z ?? 0;
+    const CALIBRATION_SAMPLES = 40;
+    const alpha = 0.15; // smoothing
+    const scale = 0.6;
+    if (!calibrated.value) {
+      // accumulate baseline in device coordinates
+      const s = calibSum.value;
+      const c = calibCount.value + 1;
+      calibSum.value = [s[0] + gx, s[1] + gy, s[2] + gz];
+      calibCount.value = c;
+      if (c >= CALIBRATION_SAMPLES) {
+        const avg = calibSum.value;
+        initialGravity.value = [avg[0] / c, avg[1] / c, avg[2] / c];
+        calibrated.value = true;
+      }
+      rotationShared.value = [0, 0, 0];
+      return;
+    }
+    const init = initialGravity.value;
+    const dx = gx - init[0];
+    const dy = gy - init[1];
+    const dz = gz - init[2];
+
+    // Rotate into screen coordinates so offsets auto-swap with orientation
+    const [mx, my] = rotate2D([dx, dy], -orientationAngle.value);
+    const screenX = mx;
+    const screenY = -my;
+    const prev = rotationShared.value;
+    const smoothX = prev[0] * (1 - alpha) + screenX * alpha;
+    const smoothY = prev[1] * (1 - alpha) + screenY * alpha;
+    const smoothZ = prev[2] * (1 - alpha) + dz * alpha;
+    if (orientationAngle.value === 90) {
+      rotationShared.value = [clamp(smoothY * scale, -1, 1), clamp(-smoothX * scale, -1, 1), clamp(smoothZ * scale, -1, 1)];
+    } else {
+      rotationShared.value = [clamp(smoothX * scale, -1, 1), clamp(smoothY * scale, -1, 1), clamp(smoothZ * scale, -1, 1)];
+    }
+  });
+
+  // Resource setup
+  useEffect(() => {
+    if (!root || !device || !context) return;
+    (async () => {
+      const bitmap = await getBitmapFromURI(imageURI);
+      const texture = await createTexture(root, bitmap);
+      setImageTexture(texture);
+      await loadTexture(root, bitmap, texture);
+      if (!maskURI) return;
+      const maskBitmap = await getBitmapFromURI(maskURI);
+      const maskTex = await createTexture(root, maskBitmap);
+      setMaskTexture(maskTex);
+      await loadTexture(root, maskBitmap, maskTex);
+    })();
+  }, [root, device, context, imageURI, maskURI]);
+
+  // Render loop
+  useEffect(() => {
+    if (!root || !device || !context || !imageTexture) return;
+
+    //this sets the underlying resolution of the canvas to prevent blurriness
+    const canvasElement = context.canvas;
+    if (canvasElement && canvasElement.width !== pixelWidth && canvasElement.height !== pixelHeight) {
+      canvasElement.width = pixelWidth;
+      canvasElement.height = pixelHeight;
+    }
+    context.configure({
+      device,
+      format: presentationFormat,
+      alphaMode: 'premultiplied'
+    });
+    const sampler = device.createSampler({
+      magFilter: 'linear',
+      minFilter: 'linear'
+    });
+    const imageTextureBindGroup = root.createBindGroup(textureBindGroupLayout, {
+      texture: root.unwrap(imageTexture).createView(),
+      sampler: sampler
+    });
+    const rotationBuffer = bufferManager.addBuffer(root, 'rotationBuffer', d.vec3f(0.0));
+    const rotationBindGroup = createRotationValuesBindGroup(root, rotationBuffer);
+    const glareOptionsBuffer = bufferManager.addBuffer(root, 'glareBuffer', createGlareOptions(glareOptions ?? {}));
+    const glareOptionsBindGroup = createGlareOptionsBindGroup(root, glareOptionsBuffer);
+    const colorMaskBuffer = bufferManager.addBuffer(root, 'colorMaskBuffer', colorMaskToTyped(createColorMask(colorMaskOptions ?? {
+      baseColor: [-20, -20, -20]
+    })));
+    const colorMaskBindGroup = createColorMaskBindGroup(root, colorMaskBuffer);
+    const glareBGP = createBindGroupPairs([textureBindGroupLayout, rotationValuesBindGroupLayout, glareOptionsBindGroupLayout, colorMaskBindGroupLayout], [imageTextureBindGroup, rotationBindGroup, glareOptionsBindGroup, colorMaskBindGroup]);
+    const colorMaskBGP = createBindGroupPairs([textureBindGroupLayout, colorMaskBindGroupLayout, rotationValuesBindGroupLayout], [imageTextureBindGroup, colorMaskBindGroup, rotationBindGroup]);
+    let glarePipeline = root['~unstable'].withVertex(mainVertex, {}).withFragment(newGlareFragment, getDefaultTarget(presentationFormat)).createPipeline();
+    glarePipeline = attachBindGroups(glarePipeline, glareBGP);
+    let colorMaskPipeline = root['~unstable'].withVertex(mainVertex, {}).withFragment(colorMaskFragment, getDefaultTarget(presentationFormat, blend)).createPipeline();
+    colorMaskPipeline = attachBindGroups(colorMaskPipeline, colorMaskBGP);
+
+    //optional pipeline - mask
+    const maskPipeline = createMaskPipeline(root, maskTexture, createBindGroupPairs([textureBindGroupLayout, rotationValuesBindGroupLayout], [imageTextureBindGroup, rotationBindGroup]), sampler, presentationFormat);
+    const reverseHoloBGP = createBindGroupPairs([textureBindGroupLayout, rotationValuesBindGroupLayout, glareOptionsBindGroupLayout], [imageTextureBindGroup, rotationBindGroup, glareOptionsBindGroup]);
+    const reverseHoloPipeline = createReverseHoloPipeline(root, maskTexture, reverseHoloBGP, sampler, presentationFormat);
+    const holoBGP = createBindGroupPairs([rotationValuesBindGroupLayout], [rotationBindGroup]);
+    const holoPipeline = createHoloPipeline(root, imageTexture, holoBGP, sampler, presentationFormat);
+    const pipelines = [glarePipeline];
+    if (addTextureMask && maskPipeline) pipelines.push(maskPipeline);
+    if (addReverseHolo && reverseHoloPipeline) pipelines.push(reverseHoloPipeline);
+    if (addHolo && holoPipeline) pipelines.push(holoPipeline);
+    if (colorMaskOptions) pipelines.push(colorMaskPipeline);
+    const rot = d.vec3f(0.0);
+    let view;
+    let initialAttachment;
+    let loadingAttachment;
+    const isInSinglePass = false;
+    const render = () => {
+      rot[0] = rotationShared.value[0];
+      rot[1] = rotationShared.value[1];
+      rot[2] = rotationShared.value[2];
+      rotationBuffer.write(rot);
+      view = context.getCurrentTexture().createView();
+      initialAttachment = {
+        view: view,
+        clearValue: [0, 0, 0, 0],
+        loadOp: 'clear',
+        storeOp: 'store'
+      };
+      loadingAttachment = {
+        view: view,
+        clearValue: [0, 0, 0, 0],
+        loadOp: 'load',
+        storeOp: 'store'
+      };
+      pipelineRenderFunction(root, pipelines, [initialAttachment, loadingAttachment, loadingAttachment, loadingAttachment, loadingAttachment], view, isInSinglePass);
+      context.present();
+      frameRef.current = requestAnimationFrame(render);
+    };
+    frameRef.current = requestAnimationFrame(render);
+    return () => {
+      if (frameRef.current) cancelAnimationFrame(frameRef.current);
+    };
+  }, [device, context, root, presentationFormat, imageTexture, maskTexture, rotationShared, bufferManager, glareOptions, colorMaskOptions, maskURI, addHolo, addReverseHolo, addTextureMask, pixelWidth, pixelHeight]);
+  return /*#__PURE__*/_jsx(Animated.View, {
+    style: [animatedStyle],
+    children: /*#__PURE__*/_jsx(View, {
+      style: [
+        // styles.container,
+        // { width: logicalWidth, height: logicalHeight },
+      ],
+      children: /*#__PURE__*/_jsx(Canvas, {
+        ref: ref,
+        style: [{
+          width: logicalWidth,
+          height: logicalHeight
+        }
+        // aspectRatio: pixelWidth / pixelHeight,
+        // { transform: [{ scaleX: 1 / dpr }, { scaleY: 1 / dpr }] },
+        ],
+        transparent: Platform.OS === 'ios'
+        // transparent={true}
+      })
+    })
+  });
+}
+
+// const styles = StyleSheet.create({
+//   container: { overflow: 'hidden' },
+// });
+//# sourceMappingURL=Shine.js.map

package/lib/module/components/Shine.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["useEffect","useMemo","useRef","useState","Canvas","useDevice","useGPUContext","getOrInitRoot","mainVertex","getBitmapFromURI","clamp","rotate2D","subscribeToOrientationChange","getAngleFromDimensions","glareOptionsBindGroupLayout","colorMaskBindGroupLayout","rotationValuesBindGroupLayout","textureBindGroupLayout","bufferData","Animated","SensorType","useAnimatedSensor","useAnimatedStyle","useDerivedValue","useSharedValue","d","PixelRatio","Platform","View","createGlareOptionsBindGroup","createColorMaskBindGroup","createRotationValuesBindGroup","createBindGroupPairs","createGlareOptions","createColorMask","colorMaskToTyped","attachBindGroups","blend","createReverseHoloPipeline","createMaskPipeline","getDefaultTarget","pipelineRenderFunction","createRainbowHoloPipeline","createHoloPipeline","colorMaskFragment","createTexture","loadTexture","newGlareFragment","TypedBufferMap","jsx","_jsx","Shine","width","height","imageURI","glareOptions","colorMaskOptions","maskURI","touchPosition","useTouchControl","addTextureMask","addHolo","addReverseHolo","device","root","ref","context","presentationFormat","navigator","gpu","getPreferredCanvasFormat","frameRef","dpr","get","logicalWidth","logicalHeight","pixelWidth","Math","max","round","pixelHeight","imageTexture","setImageTexture","maskTexture","setMaskTexture","orientationAngle","rotationShared","initialGravity","calibSum","calibCount","calibrated","gravitySensor","GRAVITY","interval","bufferManager","animatedStyle","transform","perspective","value","unsubscribe","angleDeg","v","sensor","x","y","z","gx","gy","gz","CALIBRATION_SAMPLES","alpha","scale","s","c","avg","init","dx","dy","dz","mx","my","screenX","screenY","prev","smoothX","smoothY","smoothZ","bitmap","texture","maskBitmap","maskTex","canvasElement","canvas","configure","format","alphaMode","sampler","createSampler","magFilter","minFilter","imageTextureBindGroup","createBindGroup","unwrap","createView","rotationBuffer","addBuffer","vec3f","rotationBindGroup","glareOptionsBuffer","glareOptionsBindGroup","colorMaskBuffer","baseColor","colorMaskBindGroup","glareBGP","colorMaskBGP","glarePipeline","withVertex","withFragment","createPipeline","colorMaskPipeline","maskPipeline","reverseHoloBGP","reverseHoloPipeline","holoBGP","holoPipeline","pipelines","push","rot","view","initialAttachment","loadingAttachment","isInSinglePass","render","write","getCurrentTexture","clearValue","loadOp","storeOp","present","current","requestAnimationFrame","cancelAnimationFrame","style","children","transparent","OS"],"sourceRoot":"../../../src","sources":["components/Shine.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/components/ShineGroup.js

@@ -0,0 +1,104 @@
+"use strict";
+
+import React, { useEffect, useRef, useState } from 'react';
+import { View, StyleSheet, Image, PixelRatio } from 'react-native';
+import ViewShot, { captureRef } from 'react-native-view-shot';
+import { Shine } from "./Shine.js";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+export function ShineGroup({
+  children,
+  glareOptions,
+  colorMaskOptions,
+  maskURI,
+  touchPosition,
+  useTouchControl = false,
+  addTextureMask = false,
+  addHolo = false,
+  addReverseHolo = false
+}) {
+  const viewShotRef = useRef(null);
+  const [capturedURI, setCapturedURI] = useState(null);
+  const [size, setSize] = useState(null);
+  const onInnerLayout = e => {
+    const {
+      width,
+      height
+    } = e.nativeEvent.layout;
+    if (width > 0 && height > 0) {
+      if (!size || size.width !== width || size.height !== height) {
+        setSize({
+          width,
+          height
+        });
+      }
+    }
+    console.log('onInnerLayout', width, height);
+  };
+
+  // When we have a valid measured size, take a snapshot (after a short tick)
+  // Short timeout helps when children include images that finish layout a few ms later
+  useEffect(() => {
+    if (!viewShotRef.current || !size) return;
+    let mounted = true;
+    const t = setTimeout(async () => {
+      try {
+        const dpr = PixelRatio.get();
+        const pixelW = Math.round(size.width * dpr);
+        const pixelH = Math.round(size.height * dpr);
+        const uri = await captureRef(viewShotRef.current, {
+          format: 'png',
+          quality: 1,
+          width: pixelW,
+          height: pixelH
+        });
+        if (mounted) setCapturedURI(uri);
+      } catch (err) {
+        console.warn('ShineGroup capture failed', err);
+      }
+    }, 50);
+    return () => {
+      mounted = false;
+      clearTimeout(t);
+    };
+  }, [size, children]);
+  return /*#__PURE__*/_jsxs(View, {
+    style: styles.container,
+    children: [/*#__PURE__*/_jsx(ViewShot, {
+      ref: viewShotRef,
+      options: {
+        format: 'png',
+        quality: 1
+      },
+      children: /*#__PURE__*/_jsx(View, {
+        onLayout: onInnerLayout,
+        style: styles.inner,
+        children: children
+      })
+    }), capturedURI && size && /*#__PURE__*/_jsx(Image, {
+      src: capturedURI,
+      width: size.width,
+      height: size.height
+    }), capturedURI && size && /*#__PURE__*/_jsx(Shine, {
+      width: size.width,
+      height: size.height,
+      imageURI: capturedURI,
+      glareOptions: glareOptions,
+      colorMaskOptions: colorMaskOptions,
+      maskURI: maskURI,
+      touchPosition: touchPosition,
+      useTouchControl: useTouchControl,
+      addTextureMask: addTextureMask,
+      addReverseHolo: addReverseHolo,
+      addHolo: addHolo
+    })]
+  });
+}
+const styles = StyleSheet.create({
+  container: {
+    display: 'flex',
+    flexDirection: 'column',
+    gap: 10
+  },
+  inner: {}
+});
+//# sourceMappingURL=ShineGroup.js.map

package/lib/module/components/ShineGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useEffect","useRef","useState","View","StyleSheet","Image","PixelRatio","ViewShot","captureRef","Shine","jsx","_jsx","jsxs","_jsxs","ShineGroup","children","glareOptions","colorMaskOptions","maskURI","touchPosition","useTouchControl","addTextureMask","addHolo","addReverseHolo","viewShotRef","capturedURI","setCapturedURI","size","setSize","onInnerLayout","e","width","height","nativeEvent","layout","console","log","current","mounted","t","setTimeout","dpr","get","pixelW","Math","round","pixelH","uri","format","quality","err","warn","clearTimeout","style","styles","container","ref","options","onLayout","inner","src","imageURI","create","display","flexDirection","gap"],"sourceRoot":"../../../src","sources":["components/ShineGroup.tsx"],"mappings":"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","ignoreList":[]}

package/lib/module/enums/waveCallback.js

@@ -0,0 +1,19 @@
+"use strict";
+
+import tgpu from 'typegpu';
+import * as std from 'typegpu/std';
+import * as d from 'typegpu/data';
+export const WAVE_CALLBACKS = {
+  default: pos => {
+    'kernel';
+
+    const x = pos.x;
+    const y = pos.y;
+    const waveX = std.sin(x * 2.0);
+    const waveY = std.cos(y * 2.0);
+    return d.vec2f(waveX, waveY);
+  }
+};
+export const waveCallbackSlot = tgpu.slot();
+export const waveCallbackFn = tgpu.fn([d.vec2f], d.vec2f);
+//# sourceMappingURL=waveCallback.js.map

package/lib/module/enums/waveCallback.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["tgpu","std","d","WAVE_CALLBACKS","default","pos","x","y","waveX","sin","waveY","cos","vec2f","waveCallbackSlot","slot","waveCallbackFn","fn"],"sourceRoot":"../../../src","sources":["enums/waveCallback.ts"],"mappings":";;AAAA,OAAOA,IAAI,MAAuB,SAAS;AAC3C,OAAO,KAAKC,GAAG,MAAM,aAAa;AAClC,OAAO,KAAKC,CAAC,MAAM,cAAc;AAEjC,OAAO,MAAMC,cAAc,GAAG;EAC5BC,OAAO,EAAGC,GAAU,IAAK;IACvB,QAAQ;;IAER,MAAMC,CAAC,GAAGD,GAAG,CAACC,CAAC;IACf,MAAMC,CAAC,GAAGF,GAAG,CAACE,CAAC;IAEf,MAAMC,KAAK,GAAGP,GAAG,CAACQ,GAAG,CAACH,CAAC,GAAG,GAAG,CAAC;IAC9B,MAAMI,KAAK,GAAGT,GAAG,CAACU,GAAG,CAACJ,CAAC,GAAG,GAAG,CAAC;IAE9B,OAAOL,CAAC,CAACU,KAAK,CAACJ,KAAK,EAAEE,KAAK,CAAC;EAC9B;AACF,CAAU;AAEV,OAAO,MAAMG,gBAAgB,GAAGb,IAAI,CAACc,IAAI,CAAoC,CAAC;AAG9E,OAAO,MAAMC,cAAc,GAAGf,IAAI,CAACgB,EAAE,CAAC,CAACd,CAAC,CAACU,KAAK,CAAC,EAAEV,CAAC,CAACU,KAAK,CAAC","ignoreList":[]}

package/lib/module/hooks/useOrientation.js

@@ -0,0 +1,16 @@
+"use strict";
+
+import { useEffect, useState } from 'react';
+import { getAngleFromDimensions, subscribeToOrientationChange } from "../shaders/utils.js";
+export const useOrientation = () => {
+  const [orientation, setOrientation] = useState();
+  useEffect(() => {
+    setOrientation(getAngleFromDimensions() === 0 ? 'PORTRAIT' : 'LANDSCAPE');
+    const unsubscribe = subscribeToOrientationChange(angleDeg => {
+      setOrientation(angleDeg === 0 ? 'PORTRAIT' : 'LANDSCAPE');
+    });
+    return () => unsubscribe();
+  }, []);
+  return orientation;
+};
+//# sourceMappingURL=useOrientation.js.map

package/lib/module/hooks/useOrientation.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["useEffect","useState","getAngleFromDimensions","subscribeToOrientationChange","useOrientation","orientation","setOrientation","unsubscribe","angleDeg"],"sourceRoot":"../../../src","sources":["hooks/useOrientation.ts"],"mappings":";;AAAA,SAASA,SAAS,EAAEC,QAAQ,QAAQ,OAAO;AAC3C,SACEC,sBAAsB,EACtBC,4BAA4B,QACvB,qBAAkB;AAEzB,OAAO,MAAMC,cAAc,GAAGA,CAAA,KAAM;EAClC,MAAM,CAACC,WAAW,EAAEC,cAAc,CAAC,GAAGL,QAAQ,CAAS,CAAC;EAExDD,SAAS,CAAC,MAAM;IACdM,cAAc,CAACJ,sBAAsB,CAAC,CAAC,KAAK,CAAC,GAAG,UAAU,GAAG,WAAW,CAAC;IACzE,MAAMK,WAAW,GAAGJ,4BAA4B,CAAEK,QAAQ,IAAK;MAC7DF,cAAc,CAACE,QAAQ,KAAK,CAAC,GAAG,UAAU,GAAG,WAAW,CAAC;IAC3D,CAAC,CAAC;IAEF,OAAO,MAAMD,WAAW,CAAC,CAAC;EAC5B,CAAC,EAAE,EAAE,CAAC;EAEN,OAAOF,WAAW;AACpB,CAAC","ignoreList":[]}