@sirendesign/markup 1.0.24 → 1.0.26

package/dist/index.js

@@ -4,7 +4,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 var jsxRuntime = require('react/jsx-runtime');
-var require$$0 = require('react');
+var React = require('react');
 var reactDom = require('react-dom');
 
 const createStoreImpl = (createState) => {
@@ -44,85 +44,10 @@ function getDefaultExportFromCjs (x) {
 
 var withSelector = {exports: {}};
 
-var withSelector_production = {};
+var withSelector_development = {};
 
 var shim = {exports: {}};
 
-var useSyncExternalStoreShim_production = {};
-
-/**
- * @license React
- * use-sync-external-store-shim.production.js
- *
- * Copyright (c) Meta Platforms, Inc. and affiliates.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */
-
-var hasRequiredUseSyncExternalStoreShim_production;
-
-function requireUseSyncExternalStoreShim_production () {
-	if (hasRequiredUseSyncExternalStoreShim_production) return useSyncExternalStoreShim_production;
-	hasRequiredUseSyncExternalStoreShim_production = 1;
-	var React = require$$0;
-	function is(x, y) {
-	  return (x === y && (0 !== x || 1 / x === 1 / y)) || (x !== x && y !== y);
-	}
-	var objectIs = "function" === typeof Object.is ? Object.is : is,
-	  useState = React.useState,
-	  useEffect = React.useEffect,
-	  useLayoutEffect = React.useLayoutEffect,
-	  useDebugValue = React.useDebugValue;
-	function useSyncExternalStore$2(subscribe, getSnapshot) {
-	  var value = getSnapshot(),
-	    _useState = useState({ inst: { value: value, getSnapshot: getSnapshot } }),
-	    inst = _useState[0].inst,
-	    forceUpdate = _useState[1];
-	  useLayoutEffect(
-	    function () {
-	      inst.value = value;
-	      inst.getSnapshot = getSnapshot;
-	      checkIfSnapshotChanged(inst) && forceUpdate({ inst: inst });
-	    },
-	    [subscribe, value, getSnapshot]
-	  );
-	  useEffect(
-	    function () {
-	      checkIfSnapshotChanged(inst) && forceUpdate({ inst: inst });
-	      return subscribe(function () {
-	        checkIfSnapshotChanged(inst) && forceUpdate({ inst: inst });
-	      });
-	    },
-	    [subscribe]
-	  );
-	  useDebugValue(value);
-	  return value;
-	}
-	function checkIfSnapshotChanged(inst) {
-	  var latestGetSnapshot = inst.getSnapshot;
-	  inst = inst.value;
-	  try {
-	    var nextValue = latestGetSnapshot();
-	    return !objectIs(inst, nextValue);
-	  } catch (error) {
-	    return true;
-	  }
-	}
-	function useSyncExternalStore$1(subscribe, getSnapshot) {
-	  return getSnapshot();
-	}
-	var shim =
-	  "undefined" === typeof window ||
-	  "undefined" === typeof window.document ||
-	  "undefined" === typeof window.document.createElement
-	    ? useSyncExternalStore$1
-	    : useSyncExternalStore$2;
-	useSyncExternalStoreShim_production.useSyncExternalStore =
-	  void 0 !== React.useSyncExternalStore ? React.useSyncExternalStore : shim;
-	return useSyncExternalStoreShim_production;
-}
-
 var useSyncExternalStoreShim_development = {};
 
 /**
@@ -134,206 +59,95 @@ var useSyncExternalStoreShim_development = {};
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
-
-var hasRequiredUseSyncExternalStoreShim_development;
-
-function requireUseSyncExternalStoreShim_development () {
-	if (hasRequiredUseSyncExternalStoreShim_development) return useSyncExternalStoreShim_development;
-	hasRequiredUseSyncExternalStoreShim_development = 1;
-	"production" !== process.env.NODE_ENV &&
-	  (function () {
-	    function is(x, y) {
-	      return (x === y && (0 !== x || 1 / x === 1 / y)) || (x !== x && y !== y);
-	    }
-	    function useSyncExternalStore$2(subscribe, getSnapshot) {
-	      didWarnOld18Alpha ||
-	        void 0 === React.startTransition ||
-	        ((didWarnOld18Alpha = true),
-	        console.error(
-	          "You are using an outdated, pre-release alpha of React 18 that does not support useSyncExternalStore. The use-sync-external-store shim will not work correctly. Upgrade to a newer pre-release."
-	        ));
-	      var value = getSnapshot();
-	      if (!didWarnUncachedGetSnapshot) {
-	        var cachedValue = getSnapshot();
-	        objectIs(value, cachedValue) ||
-	          (console.error(
-	            "The result of getSnapshot should be cached to avoid an infinite loop"
-	          ),
-	          (didWarnUncachedGetSnapshot = true));
-	      }
-	      cachedValue = useState({
-	        inst: { value: value, getSnapshot: getSnapshot }
-	      });
-	      var inst = cachedValue[0].inst,
-	        forceUpdate = cachedValue[1];
-	      useLayoutEffect(
-	        function () {
-	          inst.value = value;
-	          inst.getSnapshot = getSnapshot;
-	          checkIfSnapshotChanged(inst) && forceUpdate({ inst: inst });
-	        },
-	        [subscribe, value, getSnapshot]
-	      );
-	      useEffect(
-	        function () {
-	          checkIfSnapshotChanged(inst) && forceUpdate({ inst: inst });
-	          return subscribe(function () {
-	            checkIfSnapshotChanged(inst) && forceUpdate({ inst: inst });
-	          });
-	        },
-	        [subscribe]
-	      );
-	      useDebugValue(value);
-	      return value;
-	    }
-	    function checkIfSnapshotChanged(inst) {
-	      var latestGetSnapshot = inst.getSnapshot;
-	      inst = inst.value;
-	      try {
-	        var nextValue = latestGetSnapshot();
-	        return !objectIs(inst, nextValue);
-	      } catch (error) {
-	        return true;
-	      }
-	    }
-	    function useSyncExternalStore$1(subscribe, getSnapshot) {
-	      return getSnapshot();
-	    }
-	    "undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
-	      "function" ===
-	        typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart &&
-	      __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(Error());
-	    var React = require$$0,
-	      objectIs = "function" === typeof Object.is ? Object.is : is,
-	      useState = React.useState,
-	      useEffect = React.useEffect,
-	      useLayoutEffect = React.useLayoutEffect,
-	      useDebugValue = React.useDebugValue,
-	      didWarnOld18Alpha = false,
-	      didWarnUncachedGetSnapshot = false,
-	      shim =
-	        "undefined" === typeof window ||
-	        "undefined" === typeof window.document ||
-	        "undefined" === typeof window.document.createElement
-	          ? useSyncExternalStore$1
-	          : useSyncExternalStore$2;
-	    useSyncExternalStoreShim_development.useSyncExternalStore =
-	      void 0 !== React.useSyncExternalStore ? React.useSyncExternalStore : shim;
-	    "undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
-	      "function" ===
-	        typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop &&
-	      __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop(Error());
-	  })();
-	return useSyncExternalStoreShim_development;
-}
-
-var hasRequiredShim;
-
-function requireShim () {
-	if (hasRequiredShim) return shim.exports;
-	hasRequiredShim = 1;
-
-	if (process.env.NODE_ENV === 'production') {
-	  shim.exports = requireUseSyncExternalStoreShim_production();
-	} else {
-	  shim.exports = requireUseSyncExternalStoreShim_development();
-	}
-	return shim.exports;
-}
-
-/**
- * @license React
- * use-sync-external-store-shim/with-selector.production.js
- *
- * Copyright (c) Meta Platforms, Inc. and affiliates.
- *
- * This source code is licensed under the MIT license found in the
- * LICENSE file in the root directory of this source tree.
- */
-
-var hasRequiredWithSelector_production;
-
-function requireWithSelector_production () {
-	if (hasRequiredWithSelector_production) return withSelector_production;
-	hasRequiredWithSelector_production = 1;
-	var React = require$$0,
-	  shim = requireShim();
-	function is(x, y) {
-	  return (x === y && (0 !== x || 1 / x === 1 / y)) || (x !== x && y !== y);
-	}
-	var objectIs = "function" === typeof Object.is ? Object.is : is,
-	  useSyncExternalStore = shim.useSyncExternalStore,
-	  useRef = React.useRef,
-	  useEffect = React.useEffect,
-	  useMemo = React.useMemo,
-	  useDebugValue = React.useDebugValue;
-	withSelector_production.useSyncExternalStoreWithSelector = function (
-	  subscribe,
-	  getSnapshot,
-	  getServerSnapshot,
-	  selector,
-	  isEqual
-	) {
-	  var instRef = useRef(null);
-	  if (null === instRef.current) {
-	    var inst = { hasValue: false, value: null };
-	    instRef.current = inst;
-	  } else inst = instRef.current;
-	  instRef = useMemo(
-	    function () {
-	      function memoizedSelector(nextSnapshot) {
-	        if (!hasMemo) {
-	          hasMemo = true;
-	          memoizedSnapshot = nextSnapshot;
-	          nextSnapshot = selector(nextSnapshot);
-	          if (void 0 !== isEqual && inst.hasValue) {
-	            var currentSelection = inst.value;
-	            if (isEqual(currentSelection, nextSnapshot))
-	              return (memoizedSelection = currentSelection);
-	          }
-	          return (memoizedSelection = nextSnapshot);
-	        }
-	        currentSelection = memoizedSelection;
-	        if (objectIs(memoizedSnapshot, nextSnapshot)) return currentSelection;
-	        var nextSelection = selector(nextSnapshot);
-	        if (void 0 !== isEqual && isEqual(currentSelection, nextSelection))
-	          return (memoizedSnapshot = nextSnapshot), currentSelection;
-	        memoizedSnapshot = nextSnapshot;
-	        return (memoizedSelection = nextSelection);
-	      }
-	      var hasMemo = false,
-	        memoizedSnapshot,
-	        memoizedSelection,
-	        maybeGetServerSnapshot =
-	          void 0 === getServerSnapshot ? null : getServerSnapshot;
-	      return [
-	        function () {
-	          return memoizedSelector(getSnapshot());
-	        },
-	        null === maybeGetServerSnapshot
-	          ? void 0
-	          : function () {
-	              return memoizedSelector(maybeGetServerSnapshot());
-	            }
-	      ];
-	    },
-	    [getSnapshot, getServerSnapshot, selector, isEqual]
-	  );
-	  var value = useSyncExternalStore(subscribe, instRef[0], instRef[1]);
-	  useEffect(
-	    function () {
-	      inst.hasValue = true;
-	      inst.value = value;
-	    },
-	    [value]
-	  );
-	  useDebugValue(value);
-	  return value;
-	};
-	return withSelector_production;
-}
-
-var withSelector_development = {};
+((function () {
+    function is(x, y) {
+      return (x === y && (0 !== x || 1 / x === 1 / y)) || (x !== x && y !== y);
+    }
+    function useSyncExternalStore$2(subscribe, getSnapshot) {
+      didWarnOld18Alpha ||
+        void 0 === React$1.startTransition ||
+        ((didWarnOld18Alpha = true),
+        console.error(
+          "You are using an outdated, pre-release alpha of React 18 that does not support useSyncExternalStore. The use-sync-external-store shim will not work correctly. Upgrade to a newer pre-release."
+        ));
+      var value = getSnapshot();
+      if (!didWarnUncachedGetSnapshot) {
+        var cachedValue = getSnapshot();
+        objectIs(value, cachedValue) ||
+          (console.error(
+            "The result of getSnapshot should be cached to avoid an infinite loop"
+          ),
+          (didWarnUncachedGetSnapshot = true));
+      }
+      cachedValue = useState({
+        inst: { value: value, getSnapshot: getSnapshot }
+      });
+      var inst = cachedValue[0].inst,
+        forceUpdate = cachedValue[1];
+      useLayoutEffect(
+        function () {
+          inst.value = value;
+          inst.getSnapshot = getSnapshot;
+          checkIfSnapshotChanged(inst) && forceUpdate({ inst: inst });
+        },
+        [subscribe, value, getSnapshot]
+      );
+      useEffect(
+        function () {
+          checkIfSnapshotChanged(inst) && forceUpdate({ inst: inst });
+          return subscribe(function () {
+            checkIfSnapshotChanged(inst) && forceUpdate({ inst: inst });
+          });
+        },
+        [subscribe]
+      );
+      useDebugValue(value);
+      return value;
+    }
+    function checkIfSnapshotChanged(inst) {
+      var latestGetSnapshot = inst.getSnapshot;
+      inst = inst.value;
+      try {
+        var nextValue = latestGetSnapshot();
+        return !objectIs(inst, nextValue);
+      } catch (error) {
+        return true;
+      }
+    }
+    function useSyncExternalStore$1(subscribe, getSnapshot) {
+      return getSnapshot();
+    }
+    "undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
+      "function" ===
+        typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart &&
+      __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(Error());
+    var React$1 = React,
+      objectIs = "function" === typeof Object.is ? Object.is : is,
+      useState = React$1.useState,
+      useEffect = React$1.useEffect,
+      useLayoutEffect = React$1.useLayoutEffect,
+      useDebugValue = React$1.useDebugValue,
+      didWarnOld18Alpha = false,
+      didWarnUncachedGetSnapshot = false,
+      shim =
+        "undefined" === typeof window ||
+        "undefined" === typeof window.document ||
+        "undefined" === typeof window.document.createElement
+          ? useSyncExternalStore$1
+          : useSyncExternalStore$2;
+    useSyncExternalStoreShim_development.useSyncExternalStore =
+      void 0 !== React$1.useSyncExternalStore ? React$1.useSyncExternalStore : shim;
+    "undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
+      "function" ===
+        typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop &&
+      __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop(Error());
+  }))();
+
+{
+  shim.exports = useSyncExternalStoreShim_development;
+}
+
+var shimExports = shim.exports;
 
 /**
  * @license React
@@ -344,111 +158,100 @@ var withSelector_development = {};
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
  */
+((function () {
+    function is(x, y) {
+      return (x === y && (0 !== x || 1 / x === 1 / y)) || (x !== x && y !== y);
+    }
+    "undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
+      "function" ===
+        typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart &&
+      __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(Error());
+    var React$1 = React,
+      shim = shimExports,
+      objectIs = "function" === typeof Object.is ? Object.is : is,
+      useSyncExternalStore = shim.useSyncExternalStore,
+      useRef = React$1.useRef,
+      useEffect = React$1.useEffect,
+      useMemo = React$1.useMemo,
+      useDebugValue = React$1.useDebugValue;
+    withSelector_development.useSyncExternalStoreWithSelector = function (
+      subscribe,
+      getSnapshot,
+      getServerSnapshot,
+      selector,
+      isEqual
+    ) {
+      var instRef = useRef(null);
+      if (null === instRef.current) {
+        var inst = { hasValue: false, value: null };
+        instRef.current = inst;
+      } else inst = instRef.current;
+      instRef = useMemo(
+        function () {
+          function memoizedSelector(nextSnapshot) {
+            if (!hasMemo) {
+              hasMemo = true;
+              memoizedSnapshot = nextSnapshot;
+              nextSnapshot = selector(nextSnapshot);
+              if (void 0 !== isEqual && inst.hasValue) {
+                var currentSelection = inst.value;
+                if (isEqual(currentSelection, nextSnapshot))
+                  return (memoizedSelection = currentSelection);
+              }
+              return (memoizedSelection = nextSnapshot);
+            }
+            currentSelection = memoizedSelection;
+            if (objectIs(memoizedSnapshot, nextSnapshot))
+              return currentSelection;
+            var nextSelection = selector(nextSnapshot);
+            if (void 0 !== isEqual && isEqual(currentSelection, nextSelection))
+              return (memoizedSnapshot = nextSnapshot), currentSelection;
+            memoizedSnapshot = nextSnapshot;
+            return (memoizedSelection = nextSelection);
+          }
+          var hasMemo = false,
+            memoizedSnapshot,
+            memoizedSelection,
+            maybeGetServerSnapshot =
+              void 0 === getServerSnapshot ? null : getServerSnapshot;
+          return [
+            function () {
+              return memoizedSelector(getSnapshot());
+            },
+            null === maybeGetServerSnapshot
+              ? void 0
+              : function () {
+                  return memoizedSelector(maybeGetServerSnapshot());
+                }
+          ];
+        },
+        [getSnapshot, getServerSnapshot, selector, isEqual]
+      );
+      var value = useSyncExternalStore(subscribe, instRef[0], instRef[1]);
+      useEffect(
+        function () {
+          inst.hasValue = true;
+          inst.value = value;
+        },
+        [value]
+      );
+      useDebugValue(value);
+      return value;
+    };
+    "undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
+      "function" ===
+        typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop &&
+      __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop(Error());
+  }))();
 
-var hasRequiredWithSelector_development;
-
-function requireWithSelector_development () {
-	if (hasRequiredWithSelector_development) return withSelector_development;
-	hasRequiredWithSelector_development = 1;
-	"production" !== process.env.NODE_ENV &&
-	  (function () {
-	    function is(x, y) {
-	      return (x === y && (0 !== x || 1 / x === 1 / y)) || (x !== x && y !== y);
-	    }
-	    "undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
-	      "function" ===
-	        typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart &&
-	      __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStart(Error());
-	    var React = require$$0,
-	      shim = requireShim(),
-	      objectIs = "function" === typeof Object.is ? Object.is : is,
-	      useSyncExternalStore = shim.useSyncExternalStore,
-	      useRef = React.useRef,
-	      useEffect = React.useEffect,
-	      useMemo = React.useMemo,
-	      useDebugValue = React.useDebugValue;
-	    withSelector_development.useSyncExternalStoreWithSelector = function (
-	      subscribe,
-	      getSnapshot,
-	      getServerSnapshot,
-	      selector,
-	      isEqual
-	    ) {
-	      var instRef = useRef(null);
-	      if (null === instRef.current) {
-	        var inst = { hasValue: false, value: null };
-	        instRef.current = inst;
-	      } else inst = instRef.current;
-	      instRef = useMemo(
-	        function () {
-	          function memoizedSelector(nextSnapshot) {
-	            if (!hasMemo) {
-	              hasMemo = true;
-	              memoizedSnapshot = nextSnapshot;
-	              nextSnapshot = selector(nextSnapshot);
-	              if (void 0 !== isEqual && inst.hasValue) {
-	                var currentSelection = inst.value;
-	                if (isEqual(currentSelection, nextSnapshot))
-	                  return (memoizedSelection = currentSelection);
-	              }
-	              return (memoizedSelection = nextSnapshot);
-	            }
-	            currentSelection = memoizedSelection;
-	            if (objectIs(memoizedSnapshot, nextSnapshot))
-	              return currentSelection;
-	            var nextSelection = selector(nextSnapshot);
-	            if (void 0 !== isEqual && isEqual(currentSelection, nextSelection))
-	              return (memoizedSnapshot = nextSnapshot), currentSelection;
-	            memoizedSnapshot = nextSnapshot;
-	            return (memoizedSelection = nextSelection);
-	          }
-	          var hasMemo = false,
-	            memoizedSnapshot,
-	            memoizedSelection,
-	            maybeGetServerSnapshot =
-	              void 0 === getServerSnapshot ? null : getServerSnapshot;
-	          return [
-	            function () {
-	              return memoizedSelector(getSnapshot());
-	            },
-	            null === maybeGetServerSnapshot
-	              ? void 0
-	              : function () {
-	                  return memoizedSelector(maybeGetServerSnapshot());
-	                }
-	          ];
-	        },
-	        [getSnapshot, getServerSnapshot, selector, isEqual]
-	      );
-	      var value = useSyncExternalStore(subscribe, instRef[0], instRef[1]);
-	      useEffect(
-	        function () {
-	          inst.hasValue = true;
-	          inst.value = value;
-	        },
-	        [value]
-	      );
-	      useDebugValue(value);
-	      return value;
-	    };
-	    "undefined" !== typeof __REACT_DEVTOOLS_GLOBAL_HOOK__ &&
-	      "function" ===
-	        typeof __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop &&
-	      __REACT_DEVTOOLS_GLOBAL_HOOK__.registerInternalModuleStop(Error());
-	  })();
-	return withSelector_development;
-}
-
-if (process.env.NODE_ENV === 'production') {
-  withSelector.exports = requireWithSelector_production();
-} else {
-  withSelector.exports = requireWithSelector_development();
+{
+  withSelector.exports = withSelector_development;
 }
 
 var withSelectorExports = withSelector.exports;
 var useSyncExternalStoreExports = /*@__PURE__*/getDefaultExportFromCjs(withSelectorExports);
 
-const { useDebugValue } = require$$0;
+const { useDebugValue } = React;
 const { useSyncExternalStoreWithSelector } = useSyncExternalStoreExports;
 let didWarnAboutEqualityFn = false;
 const identity = (arg) => arg;
@@ -17105,19 +16908,19 @@ const colors = [
 ];
 const AnnotationOverlay = ({ screenshot, onComplete, onCancel, }) => {
     var _a, _b;
-    const canvasRef = require$$0.useRef(null);
-    const containerRef = require$$0.useRef(null);
-    const [activeTool, setActiveTool] = require$$0.useState('pen');
-    const [activeColor, setActiveColor] = require$$0.useState('#EF4444');
-    const [isDrawing, setIsDrawing] = require$$0.useState(false);
-    const [currentPath, setCurrentPath] = require$$0.useState([]);
-    const [annotations, setAnnotations] = require$$0.useState([]);
-    const [imageLoaded, setImageLoaded] = require$$0.useState(false);
-    const [startPoint, setStartPoint] = require$$0.useState(null);
-    const [textInput, setTextInput] = require$$0.useState('');
-    const [textPosition, setTextPosition] = require$$0.useState(null);
-    const imgRef = require$$0.useRef(null);
-    require$$0.useEffect(() => {
+    const canvasRef = React.useRef(null);
+    const containerRef = React.useRef(null);
+    const [activeTool, setActiveTool] = React.useState('pen');
+    const [activeColor, setActiveColor] = React.useState('#EF4444');
+    const [isDrawing, setIsDrawing] = React.useState(false);
+    const [currentPath, setCurrentPath] = React.useState([]);
+    const [annotations, setAnnotations] = React.useState([]);
+    const [imageLoaded, setImageLoaded] = React.useState(false);
+    const [startPoint, setStartPoint] = React.useState(null);
+    const [textInput, setTextInput] = React.useState('');
+    const [textPosition, setTextPosition] = React.useState(null);
+    const imgRef = React.useRef(null);
+    React.useEffect(() => {
         const img = new Image();
         img.onload = () => {
             imgRef.current = img;
@@ -17125,7 +16928,7 @@ const AnnotationOverlay = ({ screenshot, onComplete, onCancel, }) => {
         };
         img.src = screenshot;
     }, [screenshot]);
-    require$$0.useEffect(() => {
+    React.useEffect(() => {
         if (!imageLoaded || !canvasRef.current || !imgRef.current)
             return;
         const canvas = canvasRef.current;
@@ -17152,7 +16955,7 @@ const AnnotationOverlay = ({ screenshot, onComplete, onCancel, }) => {
         canvas.height = height;
         redrawCanvas(ctx, width, height);
     }, [imageLoaded, annotations]);
-    const redrawCanvas = require$$0.useCallback((ctx, width, height) => {
+    const redrawCanvas = React.useCallback((ctx, width, height) => {
         if (!imgRef.current)
             return;
         ctx.clearRect(0, 0, width, height);
@@ -17405,27 +17208,27 @@ const AnnotationOverlay = ({ screenshot, onComplete, onCancel, }) => {
 const FeedbackForm = ({ onSubmit, onCancel, initialData, getSessionEvents, lastClickedElement, lastClickedText, }) => {
     var _a, _b;
     const { config, currentScreenshot, setCurrentScreenshot, annotations, setAnnotations, clearAnnotations, setIsCapturing, isCapturing, currentUser, setIsOpen, } = useMarkupStore();
-    const [title, setTitle] = require$$0.useState((initialData === null || initialData === void 0 ? void 0 : initialData.title) || "");
-    const [description, setDescription] = require$$0.useState((initialData === null || initialData === void 0 ? void 0 : initialData.description) || "");
-    const [priority, setPriority] = require$$0.useState((initialData === null || initialData === void 0 ? void 0 : initialData.priority) || "medium");
-    const [feedbackType, setFeedbackType] = require$$0.useState((initialData === null || initialData === void 0 ? void 0 : initialData.type) || "general");
-    const [currentCopy, setCurrentCopy] = require$$0.useState((initialData === null || initialData === void 0 ? void 0 : initialData.currentCopy) || "");
-    const [newCopy, setNewCopy] = require$$0.useState((initialData === null || initialData === void 0 ? void 0 : initialData.newCopy) || "");
-    const [designMockup, setDesignMockup] = require$$0.useState(initialData === null || initialData === void 0 ? void 0 : initialData.designMockup);
-    const [selectedTags, setSelectedTags] = require$$0.useState((initialData === null || initialData === void 0 ? void 0 : initialData.tags) || []);
-    const [isAnnotating, setIsAnnotating] = require$$0.useState(false);
-    const [isSubmitting, setIsSubmitting] = require$$0.useState(false);
-    const [annotatedScreenshot, setAnnotatedScreenshot] = require$$0.useState((initialData === null || initialData === void 0 ? void 0 : initialData.screenshot) || null);
+    const [title, setTitle] = React.useState((initialData === null || initialData === void 0 ? void 0 : initialData.title) || "");
+    const [description, setDescription] = React.useState((initialData === null || initialData === void 0 ? void 0 : initialData.description) || "");
+    const [priority, setPriority] = React.useState((initialData === null || initialData === void 0 ? void 0 : initialData.priority) || "medium");
+    const [feedbackType, setFeedbackType] = React.useState((initialData === null || initialData === void 0 ? void 0 : initialData.type) || "general");
+    const [currentCopy, setCurrentCopy] = React.useState((initialData === null || initialData === void 0 ? void 0 : initialData.currentCopy) || "");
+    const [newCopy, setNewCopy] = React.useState((initialData === null || initialData === void 0 ? void 0 : initialData.newCopy) || "");
+    const [designMockup, setDesignMockup] = React.useState(initialData === null || initialData === void 0 ? void 0 : initialData.designMockup);
+    const [selectedTags, setSelectedTags] = React.useState((initialData === null || initialData === void 0 ? void 0 : initialData.tags) || []);
+    const [isAnnotating, setIsAnnotating] = React.useState(false);
+    const [isSubmitting, setIsSubmitting] = React.useState(false);
+    const [annotatedScreenshot, setAnnotatedScreenshot] = React.useState((initialData === null || initialData === void 0 ? void 0 : initialData.screenshot) || null);
     // Screen recording states
-    const [isRecording, setIsRecording] = require$$0.useState(false);
-    const [recordedVideo, setRecordedVideo] = require$$0.useState(initialData === null || initialData === void 0 ? void 0 : initialData.screenRecording);
-    const [recordedBlob, setRecordedBlob] = require$$0.useState(null);
-    const [isUploadingVideo, setIsUploadingVideo] = require$$0.useState(false);
-    const [mediaRecorder, setMediaRecorder] = require$$0.useState(null);
-    const [recordingStream, setRecordingStream] = require$$0.useState(null);
+    const [isRecording, setIsRecording] = React.useState(false);
+    const [recordedVideo, setRecordedVideo] = React.useState(initialData === null || initialData === void 0 ? void 0 : initialData.screenRecording);
+    const [recordedBlob, setRecordedBlob] = React.useState(null);
+    const [isUploadingVideo, setIsUploadingVideo] = React.useState(false);
+    const [mediaRecorder, setMediaRecorder] = React.useState(null);
+    const [recordingStream, setRecordingStream] = React.useState(null);
     // Pin placement states
-    const [isPlacingPin, setIsPlacingPin] = require$$0.useState(false);
-    const [pinPosition, setPinPosition] = require$$0.useState((initialData === null || initialData === void 0 ? void 0 : initialData.pinLocation)
+    const [isPlacingPin, setIsPlacingPin] = React.useState(false);
+    const [pinPosition, setPinPosition] = React.useState((initialData === null || initialData === void 0 ? void 0 : initialData.pinLocation)
         ? {
             x: initialData.pinLocation.x,
             y: initialData.pinLocation.y,
@@ -17434,18 +17237,18 @@ const FeedbackForm = ({ onSubmit, onCancel, initialData, getSessionEvents, lastC
         }
         : null);
     // Image change states
-    const [isSelectingImage, setIsSelectingImage] = require$$0.useState(false);
-    const [originalImageSrc, setOriginalImageSrc] = require$$0.useState((initialData === null || initialData === void 0 ? void 0 : initialData.originalImageSrc) || "");
-    const [originalImageBackground, setOriginalImageBackground] = require$$0.useState((initialData === null || initialData === void 0 ? void 0 : initialData.originalImageBackground) || "");
-    const [replacementImageUrl, setReplacementImageUrl] = require$$0.useState((initialData === null || initialData === void 0 ? void 0 : initialData.replacementImageUrl) || "");
+    const [isSelectingImage, setIsSelectingImage] = React.useState(false);
+    const [originalImageSrc, setOriginalImageSrc] = React.useState((initialData === null || initialData === void 0 ? void 0 : initialData.originalImageSrc) || "");
+    const [originalImageBackground, setOriginalImageBackground] = React.useState((initialData === null || initialData === void 0 ? void 0 : initialData.originalImageBackground) || "");
+    const [replacementImageUrl, setReplacementImageUrl] = React.useState((initialData === null || initialData === void 0 ? void 0 : initialData.replacementImageUrl) || "");
     // Load initial annotations into store if editing
-    require$$0.useEffect(() => {
+    React.useEffect(() => {
         if (initialData === null || initialData === void 0 ? void 0 : initialData.annotations) {
             setAnnotations(initialData.annotations);
         }
     }, [initialData, setAnnotations]);
     // Handle pin placement mode
-    require$$0.useEffect(() => {
+    React.useEffect(() => {
         if (!isPlacingPin)
             return;
         // Close widget during pin placement
@@ -17471,7 +17274,7 @@ const FeedbackForm = ({ onSubmit, onCancel, initialData, getSessionEvents, lastC
         };
     }, [isPlacingPin, setIsOpen]);
     // Handle image selection mode for image-change type
-    require$$0.useEffect(() => {
+    React.useEffect(() => {
         if (!isSelectingImage)
             return;
         // Close widget during image selection
@@ -17543,7 +17346,7 @@ const FeedbackForm = ({ onSubmit, onCancel, initialData, getSessionEvents, lastC
         };
     }, [isSelectingImage, setIsOpen]);
     // Auto-capture selected text when component mounts (only if creating new)
-    require$$0.useEffect(() => {
+    React.useEffect(() => {
         var _a;
         if (initialData)
             return;
@@ -17858,9 +17661,9 @@ const statusColors = {
 };
 const FeedbackList = ({ feedbackItems, onSelectFeedback, }) => {
     const { config } = useMarkupStore();
-    const [statusFilter, setStatusFilter] = require$$0.useState("all");
-    const [sortBy, setSortBy] = require$$0.useState("newest");
-    const filteredAndSortedItems = require$$0.useMemo(() => {
+    const [statusFilter, setStatusFilter] = React.useState("all");
+    const [sortBy, setSortBy] = React.useState("newest");
+    const filteredAndSortedItems = React.useMemo(() => {
         let items = [...feedbackItems];
         // Filter by status
         if (statusFilter !== "all") {
@@ -17891,7 +17694,7 @@ const FeedbackList = ({ feedbackItems, onSelectFeedback, }) => {
         return items;
     }, [feedbackItems, statusFilter, sortBy]);
     // Group items by page URL
-    const groupedByPage = require$$0.useMemo(() => {
+    const groupedByPage = React.useMemo(() => {
         const groups = new Map();
         filteredAndSortedItems.forEach((item) => {
             var _a;
@@ -39833,7 +39636,8 @@ const getDefaultFirebaseConfig = () => {
         apiKey: 'AIzaSyD2rQ-HOEU4VW5h5CGmKQK9FcBDp2bi98g',
         authDomain: 'markup-db905.firebaseapp.com',
         projectId: 'markup-db905',
-        storageBucket: 'markup-db905.firebasestorage.app',
+        // Use the appspot.com storage bucket hostname which the SDK expects
+        storageBucket: 'markup-db905.appspot.com',
         messagingSenderId: '330137146006',
         appId: '1:330137146006:web:264638f50408c3864428b7'
     };
@@ -40152,19 +39956,19 @@ const priorityColors = {
 const FeedbackDetail = ({ feedback: initialFeedback, onBack, onDelete, onUpdate, }) => {
     var _a, _b, _c;
     const { config, updateFeedback: updateFeedback$1, currentUser } = useMarkupStore();
-    const [feedback, setFeedback] = require$$0.useState(initialFeedback);
-    const [newComment, setNewComment] = require$$0.useState("");
-    const [isAddingComment, setIsAddingComment] = require$$0.useState(false);
-    const [showFullScreenshot, setShowFullScreenshot] = require$$0.useState(false);
-    const [copied, setCopied] = require$$0.useState(false);
-    const [isEditing, setIsEditing] = require$$0.useState(false);
-    const [showDeleteConfirm, setShowDeleteConfirm] = require$$0.useState(false);
+    const [feedback, setFeedback] = React.useState(initialFeedback);
+    const [newComment, setNewComment] = React.useState("");
+    const [isAddingComment, setIsAddingComment] = React.useState(false);
+    const [showFullScreenshot, setShowFullScreenshot] = React.useState(false);
+    const [copied, setCopied] = React.useState(false);
+    const [isEditing, setIsEditing] = React.useState(false);
+    const [showDeleteConfirm, setShowDeleteConfirm] = React.useState(false);
     // Feature 2 & 5 states
-    const [showReplay, setShowReplay] = require$$0.useState(false);
-    const [showOverlay, setShowOverlay] = require$$0.useState(false);
-    const [overlayOpacity, setOverlayOpacity] = require$$0.useState(50);
+    const [showReplay, setShowReplay] = React.useState(false);
+    const [showOverlay, setShowOverlay] = React.useState(false);
+    const [overlayOpacity, setOverlayOpacity] = React.useState(50);
     // Parse session actions
-    const sessionActions = require$$0.useMemo(() => {
+    const sessionActions = React.useMemo(() => {
         if (!feedback.sessionEvents)
             return null;
         try {
@@ -40427,11 +40231,11 @@ const getCurrentUser = () => {
 };
 
 const AuthForm = ({ onSuccess }) => {
-    const [mode, setMode] = require$$0.useState("login");
-    const [email, setEmail] = require$$0.useState("");
-    const [password, setPassword] = require$$0.useState("");
-    const [error, setError] = require$$0.useState(null);
-    const [loading, setLoading] = require$$0.useState(false);
+    const [mode, setMode] = React.useState("login");
+    const [email, setEmail] = React.useState("");
+    const [password, setPassword] = React.useState("");
+    const [error, setError] = React.useState(null);
+    const [loading, setLoading] = React.useState(false);
     const handleSubmit = async (e) => {
         e.preventDefault();
         setError(null);
@@ -40476,8 +40280,8 @@ const VIEWPORT_PRESETS = [
 ];
 const ViewportControls = () => {
     const { viewportMode, setViewportMode, isOpen: isWidgetOpen } = useMarkupStore();
-    const [isExpanded, setIsExpanded] = require$$0.useState(false);
-    const dropdownRef = require$$0.useRef(null);
+    const [isExpanded, setIsExpanded] = React.useState(false);
+    const dropdownRef = React.useRef(null);
     const handlePresetClick = (preset) => {
         setViewportMode({ width: preset.width, height: preset.height });
         setIsExpanded(false);
@@ -40490,7 +40294,7 @@ const ViewportControls = () => {
         return (viewportMode === null || viewportMode === void 0 ? void 0 : viewportMode.width) === preset.width && (viewportMode === null || viewportMode === void 0 ? void 0 : viewportMode.height) === preset.height;
     };
     // Close dropdown on outside click
-    require$$0.useEffect(() => {
+    React.useEffect(() => {
         if (!isExpanded)
             return;
         const handleClickOutside = (event) => {
@@ -40502,7 +40306,7 @@ const ViewportControls = () => {
         return () => document.removeEventListener('mousedown', handleClickOutside);
     }, [isExpanded]);
     // Handle ESC key to close dropdown or reset viewport
-    require$$0.useEffect(() => {
+    React.useEffect(() => {
         const handleKeyDown = (event) => {
             if (event.key === 'Escape') {
                 if (isExpanded) {
@@ -40532,8 +40336,8 @@ const ViewportControls = () => {
 
 const FeedbackPins = ({ onPinClick }) => {
     const { feedbackItems, showPins } = useMarkupStore();
-    const [docSize, setDocSize] = require$$0.useState({ width: 0, height: 0 });
-    require$$0.useEffect(() => {
+    const [docSize, setDocSize] = React.useState({ width: 0, height: 0 });
+    React.useEffect(() => {
         const measure = () => {
             const root = document.documentElement;
             const body = document.body;
@@ -40556,7 +40360,7 @@ const FeedbackPins = ({ onPinClick }) => {
         };
     }, []);
     // Filter pins for current page URL
-    const currentPagePins = require$$0.useMemo(() => {
+    const currentPagePins = React.useMemo(() => {
         const currentUrl = window.location.href;
         return feedbackItems.filter(item => {
             var _a;
@@ -40626,7 +40430,7 @@ const useFirebaseSync = () => {
     const setFeedbackItems = useMarkupStore((state) => state.setFeedbackItems);
     const isAuthenticated = useMarkupStore((state) => state.isAuthenticated);
     // Auth state listener
-    require$$0.useEffect(() => {
+    React.useEffect(() => {
         // Check if Firebase is initialized by checking if any apps exist
         if (getApps().length === 0) {
             console.warn('Firebase not initialized. Call initFirebase() at app root or authentication will be disabled.');
@@ -40677,7 +40481,7 @@ const useFirebaseSync = () => {
         };
     }, [setCurrentUser, setIsAuthenticated]);
     // Feedback subscription listener
-    require$$0.useEffect(() => {
+    React.useEffect(() => {
         console.log('🔄 Feedback subscription effect running...', {
             firebaseApps: getApps().length,
             projectId: config.projectId,
@@ -40714,9 +40518,9 @@ const useFirebaseSync = () => {
 };
 
 const useSessionRecording = () => {
-    const actionsRef = require$$0.useRef([]);
+    const actionsRef = React.useRef([]);
     const maxActions = 50; // Keep last 50 actions
-    require$$0.useEffect(() => {
+    React.useEffect(() => {
         if (typeof window === 'undefined')
             return;
         const recordAction = (action) => {
@@ -40801,13 +40605,13 @@ const useSessionRecording = () => {
             clearTimeout(scrollTimeout);
         };
     }, []);
-    const getSessionEvents = require$$0.useCallback(() => {
+    const getSessionEvents = React.useCallback(() => {
         if (actionsRef.current.length === 0) {
             return undefined;
         }
         return JSON.stringify(actionsRef.current);
     }, []);
-    const clearSession = require$$0.useCallback(() => {
+    const clearSession = React.useCallback(() => {
         actionsRef.current = [];
     }, []);
     return {
@@ -40819,7 +40623,7 @@ const useSessionRecording = () => {
 const MarkupWidget = ({ config: userConfig, }) => {
     var _a;
     // Initialize Firebase synchronously on first render only
-    const initRef = require$$0.useRef(false);
+    const initRef = React.useRef(false);
     if (!initRef.current && (userConfig === null || userConfig === void 0 ? void 0 : userConfig.firebaseConfig) && getApps().length === 0) {
         try {
             initializeFirebase(userConfig.firebaseConfig);
@@ -40836,9 +40640,9 @@ const MarkupWidget = ({ config: userConfig, }) => {
     // Initialize Session Recording (Feature 2)
     const { getSessionEvents } = useSessionRecording();
     // Track last clicked element for component detection (Feature 4)
-    const lastClickedElementRef = require$$0.useRef(null);
-    const [lastClickedText, setLastClickedText] = require$$0.useState('');
-    require$$0.useEffect(() => {
+    const lastClickedElementRef = React.useRef(null);
+    const [lastClickedText, setLastClickedText] = React.useState('');
+    React.useEffect(() => {
         const handleClick = (e) => {
             var _a;
             // Store the clicked element (but ignore clicks on the widget itself)
@@ -40873,7 +40677,7 @@ const MarkupWidget = ({ config: userConfig, }) => {
         return () => document.removeEventListener('click', handleClick, true);
     }, []);
     // Apply viewport mode styling to document (like browser dev tools)
-    require$$0.useEffect(() => {
+    React.useEffect(() => {
         if (viewportMode) {
             const root = document.documentElement;
             const body = document.body;
@@ -40900,12 +40704,12 @@ const MarkupWidget = ({ config: userConfig, }) => {
             };
         }
     }, [viewportMode]);
-    require$$0.useEffect(() => {
+    React.useEffect(() => {
         if (userConfig) {
             setConfig(userConfig);
         }
     }, [userConfig, setConfig]);
-    require$$0.useEffect(() => {
+    React.useEffect(() => {
         const handleKeyDown = (e) => {
             const shortcut = config.shortcut || "ctrl+shift+m";
             const keys = shortcut.split("+").map((k) => k.trim().toLowerCase());
@@ -40924,7 +40728,7 @@ const MarkupWidget = ({ config: userConfig, }) => {
         document.addEventListener("keydown", handleKeyDown);
         return () => document.removeEventListener("keydown", handleKeyDown);
     }, [config.shortcut, isOpen, setIsOpen]);
-    const handleToggle = require$$0.useCallback(() => {
+    const handleToggle = React.useCallback(() => {
         if (!isOpen) {
             setIsOpen(true);
         }
@@ -40934,7 +40738,7 @@ const MarkupWidget = ({ config: userConfig, }) => {
             setActiveTab("create");
         }
     }, [isOpen, setIsOpen, setSelectedFeedback, setActiveTab]);
-    const handleSubmitFeedback = require$$0.useCallback(async (feedback) => {
+    const handleSubmitFeedback = React.useCallback(async (feedback) => {
         try {
             const currentUser = getCurrentUser();
             console.log("Submitting feedback:", {
@@ -40962,11 +40766,11 @@ const MarkupWidget = ({ config: userConfig, }) => {
         }
         setActiveTab("list");
     }, [addFeedbackItem, setActiveTab, config.projectId]);
-    const handleCancel = require$$0.useCallback(() => {
+    const handleCancel = React.useCallback(() => {
         reset();
         setIsOpen(false);
     }, [reset, setIsOpen]);
-    const handleSelectFeedback = require$$0.useCallback((feedback) => {
+    const handleSelectFeedback = React.useCallback((feedback) => {
         setSelectedFeedback(feedback);
         // Scroll to pin location
         if (feedback.pinLocation) {
@@ -40988,7 +40792,7 @@ const MarkupWidget = ({ config: userConfig, }) => {
             });
         }
     }, [setSelectedFeedback]);
-    const handlePinClick = require$$0.useCallback((feedback) => {
+    const handlePinClick = React.useCallback((feedback) => {
         setIsOpen(true);
         setActiveTab("list");
         setSelectedFeedback(feedback);
@@ -41012,11 +40816,11 @@ const MarkupWidget = ({ config: userConfig, }) => {
             });
         }
     }, [setIsOpen, setActiveTab, setSelectedFeedback]);
-    const handleBackFromDetail = require$$0.useCallback(() => {
+    const handleBackFromDetail = React.useCallback(() => {
         setSelectedFeedback(null);
         setViewportMode(null);
     }, [setSelectedFeedback, setViewportMode]);
-    const handleLogout = require$$0.useCallback(async () => {
+    const handleLogout = React.useCallback(async () => {
         try {
             await logOut();
             reset();
@@ -41025,10 +40829,10 @@ const MarkupWidget = ({ config: userConfig, }) => {
             console.error("Logout failed:", error);
         }
     }, [reset]);
-    const handleAuthSuccess = require$$0.useCallback(() => {
+    const handleAuthSuccess = React.useCallback(() => {
         setActiveTab("create");
     }, [setActiveTab]);
-    const handleDeleteFeedback = require$$0.useCallback(async (id) => {
+    const handleDeleteFeedback = React.useCallback(async (id) => {
         // Find the feedback item to get storage URLs
         const feedbackToDelete = feedbackItems.find(f => f.id === id);
         // Delete associated storage files
@@ -41043,7 +40847,7 @@ const MarkupWidget = ({ config: userConfig, }) => {
         removeFeedbackItem(id);
         setSelectedFeedback(null);
     }, [removeFeedbackItem, setSelectedFeedback, feedbackItems]);
-    const handleUpdateFeedback = require$$0.useCallback((updatedFeedback) => {
+    const handleUpdateFeedback = React.useCallback((updatedFeedback) => {
         updateFeedback(updatedFeedback);
         // Also update selected feedback if it's the same one (it should be)
         setSelectedFeedback(updatedFeedback);
@@ -41085,11 +40889,11 @@ function useMarkup({ config, syncWithServer = false }) {
     const store = useMarkupStore();
     const api = config.apiEndpoint ? new MarkupAPI(config) : null;
     // Initialize config
-    require$$0.useEffect(() => {
+    React.useEffect(() => {
         store.setConfig(config);
     }, [config]);
     // Fetch feedback from server on mount
-    require$$0.useEffect(() => {
+    React.useEffect(() => {
         if (syncWithServer && api) {
             api.getFeedback().then((items) => {
                 items.forEach((item) => {
@@ -41101,7 +40905,7 @@ function useMarkup({ config, syncWithServer = false }) {
             });
         }
     }, [syncWithServer, api]);
-    const submitFeedback = require$$0.useCallback(async (feedback) => {
+    const submitFeedback = React.useCallback(async (feedback) => {
         const now = new Date().toISOString();
         const newFeedback = {
             ...feedback,
@@ -41122,7 +40926,7 @@ function useMarkup({ config, syncWithServer = false }) {
         }
         return newFeedback;
     }, [api, store]);
-    const updateFeedback = require$$0.useCallback(async (id, updates) => {
+    const updateFeedback = React.useCallback(async (id, updates) => {
         store.updateFeedbackItem(id, updates);
         if (api) {
             try {
@@ -41133,7 +40937,7 @@ function useMarkup({ config, syncWithServer = false }) {
             }
         }
     }, [api, store]);
-    const deleteFeedback = require$$0.useCallback(async (id) => {
+    const deleteFeedback = React.useCallback(async (id) => {
         store.removeFeedbackItem(id);
         if (api) {
             try {
@@ -41144,14 +40948,14 @@ function useMarkup({ config, syncWithServer = false }) {
             }
         }
     }, [api, store]);
-    const openWidget = require$$0.useCallback(() => {
+    const openWidget = React.useCallback(() => {
         store.setIsOpen(true);
     }, [store]);
-    const closeWidget = require$$0.useCallback(() => {
+    const closeWidget = React.useCallback(() => {
         store.setIsOpen(false);
         store.reset();
     }, [store]);
-    const toggleWidget = require$$0.useCallback(() => {
+    const toggleWidget = React.useCallback(() => {
         store.setIsOpen(!store.isOpen);
     }, [store]);
     return {