@thelol3882/sapar 0.0.0-stage → 0.3.0

package/dist/chunk-ZBVQGMR4.js

@@ -0,0 +1,583 @@
+import {
+  defaultAnnounceStep,
+  defaultProgress,
+  useSaparAdapter,
+  useTourStep
+} from "./chunk-VC6XLWM3.js";
+import {
+  resolvePresentation,
+  spotlightPath
+} from "./chunk-FM64UDKJ.js";
+
+// src/expo/adapter.ts
+import { AccessibilityInfo, Dimensions } from "react-native";
+
+// src/expo/measure.ts
+function toRect(x, y, width, height) {
+  return width > 0 && height > 0 ? { x, y, width, height } : null;
+}
+function measureInWindow(instance) {
+  return new Promise((resolve) => {
+    const onMeasured = (...measurement) => resolve(toRect(...measurement));
+    instance.measureInWindow(onMeasured);
+  });
+}
+function measureLayout(instance, ancestor) {
+  return new Promise((resolve) => {
+    const onMeasured = (...measurement) => resolve(toRect(...measurement));
+    instance.measureLayout(ancestor, onMeasured, () => resolve(null));
+  });
+}
+
+// src/expo/registry.ts
+var anchors = /* @__PURE__ */ new Map();
+var waiters = /* @__PURE__ */ new Map();
+var pressListeners = /* @__PURE__ */ new Map();
+function addToSet(sets, key, item) {
+  const set = sets.get(key) ?? /* @__PURE__ */ new Set();
+  sets.set(key, set);
+  set.add(item);
+  return () => {
+    set.delete(item);
+    if (set.size === 0 && sets.get(key) === set) sets.delete(key);
+  };
+}
+function registerAnchor(key, anchor) {
+  anchors.set(key, anchor);
+  [...waiters.get(key) ?? []].forEach((resolve) => resolve(anchor));
+  return () => {
+    if (anchors.get(key) === anchor) anchors.delete(key);
+  };
+}
+function getAnchor(key) {
+  return anchors.get(key) ?? null;
+}
+function waitForAnchor(key, timeoutMs) {
+  const present = getAnchor(key);
+  if (present) return Promise.resolve(present);
+  return new Promise((resolve) => {
+    const stopWaiting = addToSet(waiters, key, settle);
+    const timer = setTimeout(() => settle(null), timeoutMs);
+    function settle(anchor) {
+      clearTimeout(timer);
+      stopWaiting();
+      resolve(anchor);
+    }
+  });
+}
+function subscribeToPress(key, listener) {
+  return addToSet(pressListeners, key, listener);
+}
+function notifyPress(key) {
+  [...pressListeners.get(key) ?? []].forEach((listener) => listener());
+}
+
+// src/expo/scrollIntoView.ts
+var SCROLL_SETTLE_MS = 350;
+var delay = (ms) => new Promise((resolve) => setTimeout(resolve, ms));
+function centeredOffset({ offsetY, height, viewportHeight }) {
+  return Math.max(0, offsetY - (viewportHeight - height) / 2);
+}
+async function scrollAnchorIntoView({ instance, container }, reducedMotion) {
+  const measurement = await container?.measure(instance);
+  if (!container || !measurement) return;
+  const animated = !reducedMotion;
+  container.scrollToOffset(centeredOffset(measurement), animated);
+  if (animated) await delay(SCROLL_SETTLE_MS);
+}
+
+// src/expo/stores.ts
+var asyncStorageStore = (storage) => ({
+  get: (key) => storage.getItem(key),
+  set: (key, value) => storage.setItem(key, value),
+  remove: (key) => storage.removeItem(key)
+});
+var mmkvStore = (mmkv) => ({
+  get: (key) => mmkv.getString(key) ?? null,
+  set: (key, value) => mmkv.set(key, value),
+  remove: (key) => "remove" in mmkv ? mmkv.remove(key) : mmkv.delete(key)
+});
+function appSessionStore() {
+  const values = /* @__PURE__ */ new Map();
+  return {
+    get: (key) => values.get(key) ?? null,
+    set: (key, value) => void values.set(key, value)
+  };
+}
+
+// src/expo/adapter.ts
+var nextFrame = () => new Promise((resolve) => requestAnimationFrame(() => resolve()));
+function trackReducedMotion() {
+  let enabled = false;
+  void AccessibilityInfo.isReduceMotionEnabled().then((value) => {
+    enabled = value;
+  });
+  AccessibilityInfo.addEventListener("reduceMotionChanged", (value) => {
+    enabled = value;
+  });
+  return () => enabled;
+}
+function createHandle(key) {
+  return {
+    key,
+    measure: async () => {
+      const anchor = getAnchor(key);
+      return anchor ? measureInWindow(anchor.instance) : null;
+    },
+    onPress: (listener) => subscribeToPress(key, listener)
+  };
+}
+function createExpoAdapter(options) {
+  const { compactBreakpointPx = 0 } = options;
+  return {
+    platform: "native",
+    async resolveAnchor(key, { timeoutMs }) {
+      const anchor = await waitForAnchor(key, timeoutMs);
+      return anchor ? createHandle(key) : null;
+    },
+    async scrollIntoView(handle, { reducedMotion }) {
+      const anchor = getAnchor(handle.key);
+      if (anchor) await scrollAnchorIntoView(anchor, reducedMotion);
+    },
+    currentRoute: options.currentRoute,
+    async navigate(route) {
+      await options.navigate(route);
+      await nextFrame();
+    },
+    prefersReducedMotion: trackReducedMotion(),
+    isCompact: () => Dimensions.get("window").width < compactBreakpointPx,
+    session: options.session ?? appSessionStore(),
+    now: Date.now
+  };
+}
+
+// src/expo/useTourAnchor.ts
+import { useCallback as useCallback2 } from "react";
+
+// src/expo/assignRef.ts
+function assignRef(ref, value) {
+  if (typeof ref === "function") ref(value);
+  else if (ref) ref.current = value;
+}
+
+// src/expo/scrollContainer.tsx
+import { createContext, forwardRef, useCallback, useContext, useMemo, useRef } from "react";
+import { ScrollView } from "react-native";
+import { jsx } from "react/jsx-runtime";
+var SCROLL_EVENT_THROTTLE_MS = 16;
+var ScrollContainerContext = createContext(null);
+function useTourScrollContainer() {
+  return useContext(ScrollContainerContext);
+}
+function createScrollEmitter() {
+  const listeners = /* @__PURE__ */ new Set();
+  let pendingFrame = null;
+  return {
+    subscribe(listener) {
+      listeners.add(listener);
+      return () => void listeners.delete(listener);
+    },
+    emit() {
+      if (pendingFrame !== null) return;
+      pendingFrame = requestAnimationFrame(() => {
+        pendingFrame = null;
+        [...listeners].forEach((listener) => listener());
+      });
+    }
+  };
+}
+function createScrollContainer(getScrollView, emitter) {
+  return {
+    async measure(instance) {
+      const scrollView = getScrollView();
+      const content = scrollView?.getInnerViewRef();
+      if (!scrollView || !content) return null;
+      const [layout, viewport] = await Promise.all([measureLayout(instance, content), measureInWindow(scrollView)]);
+      return layout && viewport ? { offsetY: layout.y, height: layout.height, viewportHeight: viewport.height } : null;
+    },
+    scrollToOffset: (offsetY, animated) => getScrollView()?.scrollTo({ y: offsetY, animated }),
+    subscribeToScroll: emitter.subscribe
+  };
+}
+var TourScrollView = forwardRef(function TourScrollView2(props, forwardedRef) {
+  const { onScroll } = props;
+  const scrollViewRef = useRef(null);
+  const emitter = useMemo(createScrollEmitter, []);
+  const container = useMemo(() => createScrollContainer(() => scrollViewRef.current, emitter), [emitter]);
+  const handleScroll = useCallback(
+    (event) => {
+      emitter.emit();
+      onScroll?.(event);
+    },
+    [emitter, onScroll]
+  );
+  const setScrollView = useCallback(
+    (node) => {
+      scrollViewRef.current = node;
+      assignRef(forwardedRef, node);
+    },
+    [forwardedRef]
+  );
+  return /* @__PURE__ */ jsx(ScrollContainerContext.Provider, { value: container, children: /* @__PURE__ */ jsx(ScrollView, { scrollEventThrottle: SCROLL_EVENT_THROTTLE_MS, ...props, onScroll: handleScroll, ref: setScrollView }) });
+});
+
+// src/expo/useTourAnchor.ts
+function useTourAnchor(key, { ref: hostRef, onTouchEnd: hostOnTouchEnd } = {}) {
+  const container = useTourScrollContainer();
+  const ref = useCallback2(
+    (instance) => {
+      assignRef(hostRef, instance);
+      if (!instance) return void 0;
+      const unregister = registerAnchor(key, { instance, container });
+      return () => {
+        unregister();
+        assignRef(hostRef, null);
+      };
+    },
+    [key, container, hostRef]
+  );
+  const onTouchEnd = useCallback2(
+    (event) => {
+      hostOnTouchEnd?.(event);
+      notifyPress(key);
+    },
+    [key, hostOnTouchEnd]
+  );
+  return { ref, collapsable: false, onTouchEnd };
+}
+
+// src/expo/cardPosition.ts
+var OPPOSITE_SIDE = { top: "bottom", bottom: "top", left: "right", right: "left" };
+var clamp = (value, min, max) => Math.max(min, Math.min(value, max));
+function spaceOnSide(side, { anchor, window, insets, offset }) {
+  switch (side) {
+    case "bottom":
+      return window.height - insets.bottom - (anchor.y + anchor.height) - offset;
+    case "top":
+      return anchor.y - insets.top - offset;
+    case "right":
+      return window.width - insets.right - (anchor.x + anchor.width) - offset;
+    case "left":
+      return anchor.x - insets.left - offset;
+  }
+}
+var preferredSide = (placement) => placement === "auto" ? "bottom" : placement;
+function findSideWithRoom(input) {
+  const preferred = preferredSide(input.placement);
+  const needed = preferred === "top" || preferred === "bottom" ? input.card.height : input.card.width;
+  const hasRoom = (side) => spaceOnSide(side, input) >= needed;
+  return [preferred, OPPOSITE_SIDE[preferred]].find(hasRoom) ?? null;
+}
+function positionBesideAnchor(side, { anchor, card, offset }) {
+  const centeredX = anchor.x + (anchor.width - card.width) / 2;
+  const centeredY = anchor.y + (anchor.height - card.height) / 2;
+  switch (side) {
+    case "bottom":
+      return { x: centeredX, y: anchor.y + anchor.height + offset };
+    case "top":
+      return { x: centeredX, y: anchor.y - offset - card.height };
+    case "right":
+      return { x: anchor.x + anchor.width + offset, y: centeredY };
+    case "left":
+      return { x: anchor.x - offset - card.width, y: centeredY };
+  }
+}
+function placeCard(input) {
+  const { anchor, card, window } = input;
+  if (!anchor) return { x: (window.width - card.width) / 2, y: (window.height - card.height) / 2, fits: true };
+  const anchored = { ...input, anchor };
+  const side = findSideWithRoom(anchored);
+  return { ...positionBesideAnchor(side ?? preferredSide(input.placement), anchored), fits: side !== null };
+}
+function computeCardPosition(input) {
+  const { card, window, insets } = input;
+  const { x, y, fits } = placeCard(input);
+  return {
+    x: clamp(x, insets.left, window.width - insets.right - card.width),
+    y: clamp(y, insets.top, window.height - insets.bottom - card.height),
+    fits
+  };
+}
+
+// src/expo/useAnchorRect.ts
+import { useEffect, useState } from "react";
+import { useWindowDimensions } from "react-native";
+var SETTLE_POLL_COUNT = 5;
+var SETTLE_POLL_INTERVAL_MS = 120;
+var sameRect = (a, b) => a === b || !!a && !!b && a.x === b.x && a.y === b.y && a.width === b.width && a.height === b.height;
+function useAnchorRect(handle) {
+  const { width, height } = useWindowDimensions();
+  const [measured, setMeasured] = useState(null);
+  useEffect(() => {
+    if (!handle) {
+      setMeasured(null);
+      return;
+    }
+    let cancelled = false;
+    async function measure(current) {
+      const rect = await current.measure();
+      if (cancelled) return;
+      setMeasured(
+        (previous) => previous?.handle === current && sameRect(previous.rect, rect) ? previous : { handle: current, rect }
+      );
+    }
+    void measure(handle);
+    const stopFollowingScroll = getAnchor(handle.key)?.container?.subscribeToScroll(() => void measure(handle));
+    let polls = 0;
+    const timer = setInterval(() => {
+      void measure(handle);
+      if (++polls >= SETTLE_POLL_COUNT) clearInterval(timer);
+    }, SETTLE_POLL_INTERVAL_MS);
+    return () => {
+      cancelled = true;
+      clearInterval(timer);
+      stopFollowingScroll?.();
+    };
+  }, [handle, width, height]);
+  return handle && measured?.handle === handle ? measured.rect : null;
+}
+
+// src/expo/TourPopover.tsx
+import { useCallback as useCallback3, useState as useState3 } from "react";
+import { StyleSheet, useWindowDimensions as useWindowDimensions3, View } from "react-native";
+
+// src/expo/useIsCompact.ts
+import { useWindowDimensions as useWindowDimensions2 } from "react-native";
+function useIsCompact() {
+  useWindowDimensions2();
+  return useSaparAdapter()?.isCompact() ?? false;
+}
+
+// src/expo/useKeyboardHeight.ts
+import { useEffect as useEffect2, useState as useState2 } from "react";
+import { Keyboard } from "react-native";
+function useKeyboardHeight() {
+  const [height, setHeight] = useState2(0);
+  useEffect2(() => {
+    const show = ({ endCoordinates }) => setHeight(endCoordinates.height);
+    const hide = () => setHeight(0);
+    const subscriptions = [
+      Keyboard.addListener("keyboardWillShow", show),
+      Keyboard.addListener("keyboardDidShow", show),
+      Keyboard.addListener("keyboardWillHide", hide),
+      Keyboard.addListener("keyboardDidHide", hide)
+    ];
+    return () => subscriptions.forEach((subscription) => subscription.remove());
+  }, []);
+  return height;
+}
+
+// src/expo/TourPopover.tsx
+import { jsx as jsx2 } from "react/jsx-runtime";
+import { createElement } from "react";
+var DEFAULT_OFFSET_PX = 12;
+var KEYBOARD_GAP_PX = 8;
+var DEFAULT_INSETS = { top: 8, right: 8, bottom: 8, left: 8 };
+var styles = StyleSheet.create({
+  centered: { ...StyleSheet.absoluteFill, justifyContent: "center", alignItems: "center" },
+  sheet: { position: "absolute", left: 0, right: 0, bottom: 0 },
+  // Positioned by transform so the card is measured at its natural width wherever it ends up.
+  anchored: { position: "absolute", top: 0, left: 0 },
+  hidden: { opacity: 0 }
+});
+var paddingFor = ({ top, right, bottom, left }) => ({
+  paddingTop: top,
+  paddingRight: right,
+  paddingBottom: bottom,
+  paddingLeft: left
+});
+function Sheet({ insets, style, children }) {
+  return /* @__PURE__ */ jsx2(View, { pointerEvents: "box-none", style: [styles.sheet, paddingFor({ ...insets, top: 0 }), style], children });
+}
+function CenteredCard({ insets, style, children }) {
+  return /* @__PURE__ */ jsx2(View, { pointerEvents: "box-none", style: [styles.centered, paddingFor(insets), style], children });
+}
+function AnchoredCard({ position, onLayout, style, children }) {
+  const transform = position ? [{ translateX: position.x }, { translateY: position.y }] : void 0;
+  return /* @__PURE__ */ jsx2(View, { onLayout, style: [styles.anchored, { transform }, !position && styles.hidden, style], children });
+}
+function Popover({ rect, placement, offset, presentation, insets, ...appearance }) {
+  const compact = useIsCompact();
+  const window = useWindowDimensions3();
+  const keyboardHeight = useKeyboardHeight();
+  const [card, setCard] = useState3(null);
+  const handleLayout = useCallback3(({ nativeEvent: { layout } }) => {
+    setCard(
+      (previous) => previous?.width === layout.width && previous.height === layout.height ? previous : { width: layout.width, height: layout.height }
+    );
+  }, []);
+  const bottom = keyboardHeight > 0 ? Math.max(insets.bottom, keyboardHeight + KEYBOARD_GAP_PX) : insets.bottom;
+  const clearedInsets = { ...insets, bottom };
+  const position = card && computeCardPosition({ anchor: rect, card, window, placement, offset, insets: clearedInsets });
+  switch (resolvePresentation({ presentation, compact, fits: position?.fits })) {
+    case "sheet":
+      return /* @__PURE__ */ jsx2(Sheet, { ...appearance, insets: clearedInsets });
+    case "anchored":
+      return rect ? /* @__PURE__ */ jsx2(AnchoredCard, { ...appearance, position, onLayout: handleLayout }) : /* @__PURE__ */ jsx2(CenteredCard, { ...appearance, insets: clearedInsets });
+  }
+}
+function TourPopover({ offset = DEFAULT_OFFSET_PX, insets, presentation = "auto", ...rest }) {
+  const tourStep = useTourStep();
+  const rect = useAnchorRect(tourStep?.handle ?? null);
+  if (!tourStep) return null;
+  return /* @__PURE__ */ createElement(
+    Popover,
+    {
+      ...rest,
+      key: `${tourStep.tour.key}:${tourStep.step.key}`,
+      placement: tourStep.step.placement,
+      offset,
+      presentation,
+      insets: { ...DEFAULT_INSETS, ...insets },
+      rect
+    }
+  );
+}
+
+// src/expo/TourSpotlight.tsx
+import { StyleSheet as StyleSheet2, useWindowDimensions as useWindowDimensions4 } from "react-native";
+import Svg, { Path } from "react-native-svg";
+import { jsx as jsx3 } from "react/jsx-runtime";
+var DEFAULT_COLOR = "rgba(0, 0, 0, 0.5)";
+var DEFAULT_RADIUS = 8;
+function Spotlight({ handle, padding, onClickOutside, color = DEFAULT_COLOR, radius = DEFAULT_RADIUS, style }) {
+  const rect = useAnchorRect(handle);
+  const window = useWindowDimensions4();
+  return /* @__PURE__ */ jsx3(
+    Svg,
+    {
+      width: window.width,
+      height: window.height,
+      style: [StyleSheet2.absoluteFill, style],
+      pointerEvents: "box-none",
+      accessibilityElementsHidden: true,
+      importantForAccessibility: "no-hide-descendants",
+      children: /* @__PURE__ */ jsx3(Path, { d: spotlightPath({ rect, padding, radius, bounds: window }), fill: color, fillRule: "evenodd", onPress: onClickOutside })
+    }
+  );
+}
+function TourSpotlight({ onClickOutside, ...rest }) {
+  const tourStep = useTourStep();
+  if (!tourStep) return null;
+  return /* @__PURE__ */ jsx3(
+    Spotlight,
+    {
+      ...rest,
+      handle: tourStep.handle,
+      padding: tourStep.step.padding,
+      onClickOutside: onClickOutside ?? tourStep.skip
+    }
+  );
+}
+
+// src/expo/useHardwareBackSkip.ts
+import { useEffect as useEffect3 } from "react";
+import { BackHandler } from "react-native";
+function useHardwareBackSkip(skip) {
+  useEffect3(() => {
+    if (!skip) return;
+    const subscription = BackHandler.addEventListener("hardwareBackPress", () => {
+      skip();
+      return true;
+    });
+    return () => subscription.remove();
+  }, [skip]);
+}
+
+// src/expo/TourOverlay.tsx
+import { Fragment, jsx as jsx4, jsxs } from "react/jsx-runtime";
+function TourOverlay({ spotlightColor, spotlightStyle, popoverStyle, onClickOutside, insets, presentation, children }) {
+  const tourStep = useTourStep();
+  useHardwareBackSkip(tourStep?.skip);
+  if (!tourStep) return null;
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx4(TourSpotlight, { color: spotlightColor, style: spotlightStyle, onClickOutside }),
+    /* @__PURE__ */ jsx4(TourPopover, { style: popoverStyle, insets, presentation, children: typeof children === "function" ? children(tourStep) : children })
+  ] });
+}
+
+// src/expo/TourStep.tsx
+import { createContext as createContext2, useContext as useContext2, useEffect as useEffect4 } from "react";
+import {
+  AccessibilityInfo as AccessibilityInfo2,
+  Pressable,
+  Text,
+  View as View2
+} from "react-native";
+import { jsx as jsx5 } from "react/jsx-runtime";
+var TourStepContext = createContext2(null);
+function useStepState() {
+  const tourStep = useContext2(TourStepContext);
+  if (!tourStep) throw new Error("TourStep parts must be rendered inside <TourStep.Root>.");
+  return tourStep;
+}
+function Dialog({ tourStep, announceStep = defaultAnnounceStep, children, ...rest }) {
+  const { step, position, total } = tourStep;
+  useEffect4(() => AccessibilityInfo2.announceForAccessibility(announceStep({ position, total, title: step.title })), [step.key]);
+  return /* @__PURE__ */ jsx5(TourStepContext.Provider, { value: tourStep, children: /* @__PURE__ */ jsx5(View2, { ...rest, role: "dialog", accessibilityViewIsModal: false, children }) });
+}
+function Root(props) {
+  const tourStep = useTourStep();
+  return tourStep ? /* @__PURE__ */ jsx5(Dialog, { ...props, tourStep }) : null;
+}
+function Title({ children, ...rest }) {
+  const { step } = useStepState();
+  return /* @__PURE__ */ jsx5(Text, { role: "heading", ...rest, children: children ?? step.title });
+}
+function Body({ children, ...rest }) {
+  const { step } = useStepState();
+  return /* @__PURE__ */ jsx5(Text, { ...rest, children: children ?? step.body });
+}
+function Progress({ children, ...rest }) {
+  const { position, total } = useStepState();
+  const count = { position, total };
+  const content = typeof children === "function" ? children(count) : children ?? defaultProgress(count);
+  return /* @__PURE__ */ jsx5(Text, { ...rest, children: content });
+}
+function Button({ children, textStyle, ...rest }) {
+  return /* @__PURE__ */ jsx5(Pressable, { role: "button", ...rest, children: /* @__PURE__ */ jsx5(Text, { style: textStyle, children }) });
+}
+function runThen(handler, action) {
+  return (event) => {
+    handler?.(event);
+    void action();
+  };
+}
+function Next({ doneLabel = "Done", nextLabel = "Next", showOnPress = false, children, onPress, ...rest }) {
+  const tourStep = useStepState();
+  if (tourStep.step.advanceOn === "press" && !showOnPress) return null;
+  return /* @__PURE__ */ jsx5(Button, { ...rest, onPress: runThen(onPress, tourStep.next), children: children ?? (tourStep.isLast ? doneLabel : nextLabel) });
+}
+function Back({ children = "Back", onPress, ...rest }) {
+  const tourStep = useStepState();
+  if (tourStep.isFirst) return null;
+  return /* @__PURE__ */ jsx5(Button, { ...rest, onPress: runThen(onPress, tourStep.previous), children });
+}
+function Skip({ children = "Skip", onPress, ...rest }) {
+  const { skip } = useStepState();
+  return /* @__PURE__ */ jsx5(Button, { ...rest, onPress: runThen(onPress, skip), children });
+}
+function Close({ children = "\xD7", ...rest }) {
+  return /* @__PURE__ */ jsx5(Skip, { accessibilityLabel: "Close tour", ...rest, children });
+}
+var TourStep = { Root, Title, Body, Progress, Next, Back, Skip, Close };
+
+export {
+  registerAnchor,
+  getAnchor,
+  waitForAnchor,
+  asyncStorageStore,
+  mmkvStore,
+  appSessionStore,
+  createExpoAdapter,
+  useTourScrollContainer,
+  TourScrollView,
+  useTourAnchor,
+  computeCardPosition,
+  useAnchorRect,
+  TourPopover,
+  TourSpotlight,
+  TourOverlay,
+  TourStep
+};
+//# sourceMappingURL=chunk-ZBVQGMR4.js.map