@overmap-ai/core 1.0.51-bulk-form-submission.3 → 1.0.51-fix-document-urls.0

package/dist/overmap-core.umd.cjs

@@ -5,8 +5,8 @@ var __publicField = (obj, key, value) => {
   return value;
 };
 (function(global2, factory) {
-  typeof exports === "object" && typeof module !== "undefined" ? factory(exports, require("react"), require("react/jsx-runtime"), require("@overmap-ai/blocks"), require("dependency-graph"), require("@redux-offline/redux-offline"), require("@redux-offline/redux-offline/lib/defaults"), require("localforage"), require("redux-persist-migrate"), require("@reduxjs/toolkit"), require("superagent"), require("react-redux"), require("file-saver"), require("uuid"), require("color"), require("jwt-decode"), require("@redux-offline/redux-offline/lib/constants"), require("idb"), require("formik"), require("lodash.get"), require("linkify-react"), require("@hello-pangea/dnd"), require("xlsx"), require("react-pdf"), require("react-pdf/dist/Page/AnnotationLayer.css"), require("react-pdf/dist/Page/TextLayer.css"), require("react-dom"), require("react-sketch-canvas"), require("lodash.set"), require("lodash.clonedeep")) : typeof define === "function" && define.amd ? define(["exports", "react", "react/jsx-runtime", "@overmap-ai/blocks", "dependency-graph", "@redux-offline/redux-offline", "@redux-offline/redux-offline/lib/defaults", "localforage", "redux-persist-migrate", "@reduxjs/toolkit", "superagent", "react-redux", "file-saver", "uuid", "color", "jwt-decode", "@redux-offline/redux-offline/lib/constants", "idb", "formik", "lodash.get", "linkify-react", "@hello-pangea/dnd", "xlsx", "react-pdf", "react-pdf/dist/Page/AnnotationLayer.css", "react-pdf/dist/Page/TextLayer.css", "react-dom", "react-sketch-canvas", "lodash.set", "lodash.clonedeep"], factory) : (global2 = typeof globalThis !== "undefined" ? globalThis : global2 || self, factory(global2["overmap-core"] = {}, global2.React, global2.jsxRuntime, global2.blocks, global2.dependencyGraph, global2.reduxOffline, global2.offlineConfig, global2.localforage, global2.createMigration, global2.toolkit, global2.request, global2.reactRedux, global2.saveAs, global2.uuid, global2.ColorCls, global2.jwtDecode, global2.constants, global2.idb, global2.formik, global2.get, global2.Linkify, global2.dnd, global2.xlsx, global2.reactPdf, null, null, global2.ReactDOM, global2.reactSketchCanvas, global2.set, global2.cloneDeep));
-})(this, function(exports2, React, jsxRuntime, blocks, dependencyGraph, reduxOffline, offlineConfig, localforage, createMigration, toolkit, request, reactRedux, saveAs, uuid, ColorCls, jwtDecode, constants, idb, formik, get, Linkify, dnd, xlsx, reactPdf, AnnotationLayer_css, TextLayer_css, ReactDOM, reactSketchCanvas, set, cloneDeep) {
+  typeof exports === "object" && typeof module !== "undefined" ? factory(exports, require("react"), require("react/jsx-runtime"), require("@overmap-ai/blocks"), require("dependency-graph"), require("@redux-offline/redux-offline"), require("@redux-offline/redux-offline/lib/defaults"), require("localforage"), require("redux-persist-migrate"), require("@reduxjs/toolkit"), require("superagent"), require("react-redux"), require("file-saver"), require("uuid"), require("color"), require("jwt-decode"), require("@redux-offline/redux-offline/lib/constants"), require("idb"), require("formik"), require("lodash.get"), require("linkify-react"), require("@hello-pangea/dnd"), require("qr-scanner"), require("xlsx"), require("react-pdf"), require("react-pdf/dist/Page/AnnotationLayer.css"), require("react-pdf/dist/Page/TextLayer.css"), require("react-dom"), require("react-sketch-canvas"), require("lodash.set"), require("lodash.clonedeep")) : typeof define === "function" && define.amd ? define(["exports", "react", "react/jsx-runtime", "@overmap-ai/blocks", "dependency-graph", "@redux-offline/redux-offline", "@redux-offline/redux-offline/lib/defaults", "localforage", "redux-persist-migrate", "@reduxjs/toolkit", "superagent", "react-redux", "file-saver", "uuid", "color", "jwt-decode", "@redux-offline/redux-offline/lib/constants", "idb", "formik", "lodash.get", "linkify-react", "@hello-pangea/dnd", "qr-scanner", "xlsx", "react-pdf", "react-pdf/dist/Page/AnnotationLayer.css", "react-pdf/dist/Page/TextLayer.css", "react-dom", "react-sketch-canvas", "lodash.set", "lodash.clonedeep"], factory) : (global2 = typeof globalThis !== "undefined" ? globalThis : global2 || self, factory(global2["overmap-core"] = {}, global2.React, global2.jsxRuntime, global2.blocks, global2.dependencyGraph, global2.reduxOffline, global2.offlineConfig, global2.localforage, global2.createMigration, global2.toolkit, global2.request, global2.reactRedux, global2.saveAs, global2.uuid, global2.ColorCls, global2.jwtDecode, global2.constants, global2.idb, global2.formik, global2.get, global2.Linkify, global2.dnd, global2.QrScannerAPI, global2.xlsx, global2.reactPdf, null, null, global2.ReactDOM, global2.reactSketchCanvas, global2.set, global2.cloneDeep));
+})(this, function(exports2, React, jsxRuntime, blocks, dependencyGraph, reduxOffline, offlineConfig, localforage, createMigration, toolkit, request, reactRedux, saveAs, uuid, ColorCls, jwtDecode, constants, idb, formik, get, Linkify, dnd, QrScannerAPI, xlsx, reactPdf, AnnotationLayer_css, TextLayer_css, ReactDOM, reactSketchCanvas, set, cloneDeep) {
   var _a;
   "use strict";
   function _interopNamespaceDefault(e) {
@@ -3641,7 +3641,7 @@ var __publicField = (obj, key, value) => {
         }
         for (const revision of Object.values(revisions)) {
           const form = formsOfComponentTypes[revision.form];
-          if (!form || !form.component_type || !ret[form.component_type] || formRevisionSortFn(ret[form.component_type], revision) < 0)
+          if (!form || !form.component_type || ret[form.component_type] && formRevisionSortFn(ret[form.component_type], revision) > 0)
             continue;
           ret[form.component_type] = revision;
         }
@@ -7988,6 +7988,7 @@ var __publicField = (obj, key, value) => {
     }
   }
   class DocumentService extends BaseApiService {
+    // TODO: Support adding for project or organization
     add(document2) {
       const { store } = this.client;
       const currentUserId = store.getState().userReducer.currentUser.id;
@@ -8109,15 +8110,25 @@ var __publicField = (obj, key, value) => {
     }
     async refreshStore() {
       const { store } = this.client;
-      const activeProjectId = store.getState().projectReducer.activeProjectId;
-      const result = await this.enqueueRequest({
+      const state = store.getState();
+      const activeProjectId = state.projectReducer.activeProjectId;
+      const projectDocumentsPromise = this.enqueueRequest({
         description: "Get project documents",
         method: HttpMethod.GET,
-        url: `/documents/projects/${activeProjectId}/`,
+        url: `/projects/${activeProjectId}/documents/`,
+        blockers: [],
+        blocks: []
+      });
+      const activeOrganizationId = state.organizationReducer.activeOrganizationId;
+      const organizationDocumentsPromise = this.enqueueRequest({
+        description: "Get organization documents",
+        method: HttpMethod.GET,
+        url: `/organizations/${activeOrganizationId}/documents/`,
         blockers: [],
         blocks: []
       });
-      store.dispatch(setDocuments(result));
+      store.dispatch(setDocuments(await projectDocumentsPromise));
+      store.dispatch(addDocuments(await organizationDocumentsPromise));
     }
   }
   class AgentService extends BaseApiService {
@@ -8222,7 +8233,7 @@ var __publicField = (obj, key, value) => {
   const patchfieldBorder = "_patchfieldBorder_1w0fq_73";
   const title = "_title_1w0fq_73";
   const error = "_error_1w0fq_89";
-  const styles$c = {
+  const styles$d = {
     description: description$2,
     floatingButtonContainer: floatingButtonContainer$2,
     FullScreenImageContainer: FullScreenImageContainer$2,
@@ -8343,7 +8354,7 @@ var __publicField = (obj, key, value) => {
   const longIconButton$1 = "_longIconButton_10o76_36";
   const previewImage$1 = "_previewImage_10o76_42";
   const FullScreenImage$1 = "_FullScreenImage_10o76_12";
-  const styles$b = {
+  const styles$c = {
     description: description$1,
     floatingButtonContainer: floatingButtonContainer$1,
     FullScreenImageContainer: FullScreenImageContainer$1,
@@ -8367,7 +8378,7 @@ var __publicField = (obj, key, value) => {
       /* @__PURE__ */ jsxRuntime.jsx(
         "button",
         {
-          className: styles$b.FullScreenImageContainer,
+          className: styles$c.FullScreenImageContainer,
           type: "button",
           onClick: () => {
             setShowPreview(false);
@@ -8375,7 +8386,7 @@ var __publicField = (obj, key, value) => {
           children: /* @__PURE__ */ jsxRuntime.jsx(
             "img",
             {
-              className: styles$b.FullScreenImage,
+              className: styles$c.FullScreenImage,
               src: url,
               alt: name,
               onClick: (e) => {
@@ -8385,11 +8396,11 @@ var __publicField = (obj, key, value) => {
           )
         }
       ),
-      /* @__PURE__ */ jsxRuntime.jsxs(blocks.Flex, { className: styles$b.TopBarContainer, align: "center", children: [
+      /* @__PURE__ */ jsxRuntime.jsxs(blocks.Flex, { className: styles$c.TopBarContainer, align: "center", children: [
         /* @__PURE__ */ jsxRuntime.jsx(
           blocks.IconButton,
           {
-            className: styles$b.longIconButton,
+            className: styles$c.longIconButton,
             variant: "soft",
             "aria-label": "Exit preview",
             onClick: () => {
@@ -8398,11 +8409,11 @@ var __publicField = (obj, key, value) => {
             children: /* @__PURE__ */ jsxRuntime.jsx(blocks.RiIcon, { icon: "RiArrowLeftLine" })
           }
         ),
-        /* @__PURE__ */ jsxRuntime.jsx(blocks.Text, { className: styles$b.fileName, children: name }),
+        /* @__PURE__ */ jsxRuntime.jsx(blocks.Text, { className: styles$c.fileName, children: name }),
         /* @__PURE__ */ jsxRuntime.jsx(
           blocks.IconButton,
           {
-            className: styles$b.longIconButton,
+            className: styles$c.longIconButton,
             variant: "soft",
             "aria-label": `Download ${name}`,
             onClick: handleDownload,
@@ -8430,7 +8441,7 @@ var __publicField = (obj, key, value) => {
         /* @__PURE__ */ jsxRuntime.jsx(
           "img",
           {
-            className: styles$b.previewImage,
+            className: styles$c.previewImage,
             src: resolvedImageURL,
             alt: resolvedImage.name,
             onClick: () => {
@@ -8458,7 +8469,7 @@ var __publicField = (obj, key, value) => {
     const { helpText, children, severity } = props;
     return /* @__PURE__ */ jsxRuntime.jsxs(blocks.Flex, { direction: "column", gap: "1", children: [
       children,
-      /* @__PURE__ */ jsxRuntime.jsx(blocks.Flex, { direction: "column", children: /* @__PURE__ */ jsxRuntime.jsx(blocks.Text, { size: "1", severity, className: styles$b.description, children: helpText }) })
+      /* @__PURE__ */ jsxRuntime.jsx(blocks.Flex, { direction: "column", children: /* @__PURE__ */ jsxRuntime.jsx(blocks.Text, { size: "1", severity, className: styles$c.description, children: helpText }) })
     ] });
   };
   const InputWithLabelAndHelpText = (props) => {
@@ -8692,6 +8703,9 @@ var __publicField = (obj, key, value) => {
   function RiCalendarLine(props) {
     return GenIcon({ "tag": "svg", "attr": { "viewBox": "0 0 24 24", "fill": "currentColor" }, "child": [{ "tag": "path", "attr": { "d": "M9 1V3H15V1H17V3H21C21.5523 3 22 3.44772 22 4V20C22 20.5523 21.5523 21 21 21H3C2.44772 21 2 20.5523 2 20V4C2 3.44772 2.44772 3 3 3H7V1H9ZM20 11H4V19H20V11ZM7 5H4V9H20V5H17V7H15V5H9V7H7V5Z" }, "child": [] }] })(props);
   }
+  function RiQrCodeLine(props) {
+    return GenIcon({ "tag": "svg", "attr": { "viewBox": "0 0 24 24", "fill": "currentColor" }, "child": [{ "tag": "path", "attr": { "d": "M16 17V16H13V13H16V15H18V17H17V19H15V21H13V18H15V17H16ZM21 21H17V19H19V17H21V21ZM3 3H11V11H3V3ZM5 5V9H9V5H5ZM13 3H21V11H13V3ZM15 5V9H19V5H15ZM3 13H11V21H3V13ZM5 15V19H9V15H5ZM18 13H21V15H18V13ZM6 6H8V8H6V6ZM6 16H8V18H6V16ZM16 6H18V8H16V6Z" }, "child": [] }] })(props);
+  }
   function RiFileCopyLine(props) {
     return GenIcon({ "tag": "svg", "attr": { "viewBox": "0 0 24 24", "fill": "currentColor" }, "child": [{ "tag": "path", "attr": { "d": "M6.9998 6V3C6.9998 2.44772 7.44752 2 7.9998 2H19.9998C20.5521 2 20.9998 2.44772 20.9998 3V17C20.9998 17.5523 20.5521 18 19.9998 18H16.9998V20.9991C16.9998 21.5519 16.5499 22 15.993 22H4.00666C3.45059 22 3 21.5554 3 20.9991L3.0026 7.00087C3.0027 6.44811 3.45264 6 4.00942 6H6.9998ZM5.00242 8L5.00019 20H14.9998V8H5.00242ZM8.9998 6H16.9998V16H18.9998V4H8.9998V6Z" }, "child": [] }] })(props);
   }
@@ -9595,9 +9609,9 @@ var __publicField = (obj, key, value) => {
     return React__namespace.createElement("div", { ...insetProps, ref: forwardedRef, className: classNames("rt-Inset", className, withBreakpoints(side, "rt-r-side"), withBreakpoints(clip, "rt-r-clip"), withBreakpoints(p, "rt-r-p"), withBreakpoints(px, "rt-r-px"), withBreakpoints(py, "rt-r-py"), withBreakpoints(pt, "rt-r-pt"), withBreakpoints(pr, "rt-r-pr"), withBreakpoints(pb, "rt-r-pb"), withBreakpoints(pl, "rt-r-pl"), withMarginProps(marginProps)) });
   });
   Inset.displayName = "Inset";
-  const sizes$7 = ["1", "2", "3", "4", "5", "6", "7", "8", "9"];
+  const sizes$8 = ["1", "2", "3", "4", "5", "6", "7", "8", "9"];
   const headingPropDefs = {
-    size: { type: "enum", values: sizes$7, default: "6", responsive: true },
+    size: { type: "enum", values: sizes$8, default: "6", responsive: true },
     weight: { ...weightProp, default: "bold" },
     align: alignProp,
     trim: trimProp,
@@ -9610,9 +9624,9 @@ var __publicField = (obj, key, value) => {
     return React__namespace.createElement($5e63c961fc1ce211$export$8c6ed5c666ac1360, { "data-accent-color": color, ...headingProps, ref: forwardedRef, className: classNames("rt-Heading", className, withBreakpoints(size, "rt-r-size"), withBreakpoints(weight, "rt-r-weight"), withBreakpoints(align, "rt-r-ta"), withBreakpoints(trim, "rt-r-lt"), { "rt-high-contrast": highContrast }, withMarginProps(marginProps)) }, asChild ? children : React__namespace.createElement(Tag, null, children));
   });
   Heading.displayName = "Heading";
-  const sizes$6 = ["1", "2", "3", "4", "5", "6", "7", "8", "9"];
+  const sizes$7 = ["1", "2", "3", "4", "5", "6", "7", "8", "9"];
   const textPropDefs = {
-    size: { type: "enum", values: sizes$6, default: void 0, responsive: true },
+    size: { type: "enum", values: sizes$7, default: void 0, responsive: true },
     weight: weightProp,
     align: alignProp,
     trim: trimProp,
@@ -9625,6 +9639,21 @@ var __publicField = (obj, key, value) => {
     return React__namespace.createElement($5e63c961fc1ce211$export$8c6ed5c666ac1360, { "data-accent-color": color, ...textProps, ref: forwardedRef, className: classNames("rt-Text", className, withBreakpoints(size, "rt-r-size"), withBreakpoints(weight, "rt-r-weight"), withBreakpoints(align, "rt-r-ta"), withBreakpoints(trim, "rt-r-lt"), { "rt-high-contrast": highContrast }, withMarginProps(marginProps)) }, asChild ? children : React__namespace.createElement(Tag, null, children));
   });
   Text.displayName = "Text";
+  const sizes$6 = ["1", "2", "3", "4", "5", "6", "7", "8", "9"];
+  const variants$4 = ["solid", "soft", "outline", "ghost"];
+  const codePropDefs = {
+    size: { type: "enum", values: sizes$6, default: void 0, responsive: true },
+    variant: { type: "enum", values: variants$4, default: "soft" },
+    weight: weightProp,
+    color: colorProp,
+    highContrast: highContrastProp
+  };
+  const Code = React__namespace.forwardRef((props, forwardedRef) => {
+    const { rest: marginRest, ...marginProps } = extractMarginProps(props);
+    const { className, size = codePropDefs.size.default, variant = codePropDefs.variant.default, weight = codePropDefs.weight.default, color = codePropDefs.color.default, highContrast = codePropDefs.highContrast.default, ...codeProps } = marginRest;
+    return React__namespace.createElement("code", { "data-accent-color": color, ...codeProps, ref: forwardedRef, className: classNames("rt-Code", className, withBreakpoints(size, "rt-r-size"), `rt-variant-${variant}`, withBreakpoints(weight, "rt-r-weight"), { "rt-high-contrast": highContrast }, withMarginProps(marginProps)) });
+  });
+  Code.displayName = "Code";
   const Em = React__namespace.forwardRef((props, forwardedRef) => React__namespace.createElement("em", { ...props, ref: forwardedRef, className: classNames("rt-Em", props.className) }));
   Em.displayName = "Em";
   const Strong = React__namespace.forwardRef((props, forwardedRef) => React__namespace.createElement("strong", { ...props, ref: forwardedRef, className: classNames("rt-Strong", props.className) }));
@@ -12015,7 +12044,7 @@ var __publicField = (obj, key, value) => {
   });
   const clickableLinkContainer = "_clickableLinkContainer_1ace7_1";
   const TextFieldInputCopy = "_TextFieldInputCopy_1ace7_5";
-  const styles$a = {
+  const styles$b = {
     clickableLinkContainer,
     TextFieldInputCopy
   };
@@ -12044,13 +12073,13 @@ var __publicField = (obj, key, value) => {
             placeholder: field.placeholder,
             color
           }
-        ) : /* @__PURE__ */ jsxRuntime.jsxs(TextField$1.Root, { className: styles$a.clickableLinkContainer, children: [
+        ) : /* @__PURE__ */ jsxRuntime.jsxs(TextField$1.Root, { className: styles$b.clickableLinkContainer, children: [
           /* @__PURE__ */ jsxRuntime.jsx(
             "div",
             {
               className: classNames$1(
                 "rt-TextFieldInput rt-r-size-2 rt-variant-surface",
-                styles$a.TextFieldInputCopy
+                styles$b.TextFieldInputCopy
               ),
               children: /* @__PURE__ */ jsxRuntime.jsx(
                 Linkify,
@@ -12742,6 +12771,158 @@ var __publicField = (obj, key, value) => {
   __publicField(_MultiSelectField, "fieldTypeDescription", "Allows the user to select a multiple options from a list of options.");
   __publicField(_MultiSelectField, "Icon", RiCheckboxLine);
   let MultiSelectField = _MultiSelectField;
+  const QrScannerWrapper = "_QrScannerWrapper_1puz3_1";
+  const styles$a = {
+    QrScannerWrapper
+  };
+  const QrInput = React.memo((props) => {
+    const [{ inputId, labelId, label, helpText, size, severity, showInputOnly, field, fieldProps }, rest] = useFormikInput(props);
+    const [showQrScanner, setShowQrScanner] = React.useState(false);
+    const value = fieldProps.value;
+    const handleQrScan = React.useCallback(
+      (data) => {
+        fieldProps.onChange({ target: { value: data } });
+        setShowQrScanner(false);
+      },
+      [fieldProps]
+    );
+    const handleClearScanResult = React.useCallback(() => {
+      fieldProps.onChange({ target: { value: "" } });
+    }, [fieldProps]);
+    const handleScanButtonClicked = React.useCallback(() => {
+      setShowQrScanner(true);
+    }, []);
+    const handleQrScannerClose = React.useCallback(() => {
+      setShowQrScanner(false);
+    }, []);
+    return /* @__PURE__ */ jsxRuntime.jsx(InputWithLabelAndHelpText, { helpText, severity, children: /* @__PURE__ */ jsxRuntime.jsxs(
+      InputWithLabel,
+      {
+        size,
+        severity,
+        inputId,
+        labelId,
+        label: showInputOnly ? label : "",
+        image: showInputOnly ? void 0 : field.image,
+        flexProps: { direction: "column", justify: "start", align: "start", gap: "1" },
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx(
+            blocks.Overlay,
+            {
+              open: showQrScanner,
+              content: () => /* @__PURE__ */ jsxRuntime.jsx(QrScanner, { onQrScan: handleQrScan, onClose: handleQrScannerClose }),
+              onOpenChange: setShowQrScanner
+            }
+          ),
+          /* @__PURE__ */ jsxRuntime.jsxs(Flex, { width: "max-content", gap: "1", align: "center", children: [
+            /* @__PURE__ */ jsxRuntime.jsxs(blocks.Button, { ...rest, variant: "soft", onClick: handleScanButtonClicked, children: [
+              /* @__PURE__ */ jsxRuntime.jsx(blocks.RiIcon, { icon: "RiQrCodeLine" }),
+              "Scan"
+            ] }),
+            value && /* @__PURE__ */ jsxRuntime.jsx(Text, { color: "jade", size: "1", children: /* @__PURE__ */ jsxRuntime.jsx(blocks.RiIcon, { icon: "RiCheckLine", style: { verticalAlign: "bottom" } }) })
+          ] }),
+          value && /* @__PURE__ */ jsxRuntime.jsx(Card, { children: /* @__PURE__ */ jsxRuntime.jsxs(Flex, { width: "max-content", gap: "2", align: "center", children: [
+            /* @__PURE__ */ jsxRuntime.jsx(Code, { color: "gray", highContrast: true, children: value }),
+            /* @__PURE__ */ jsxRuntime.jsx(
+              blocks.IconButton,
+              {
+                severity: "info",
+                variant: "ghost",
+                "aria-label": "delete",
+                size: "small",
+                onClick: handleClearScanResult,
+                children: /* @__PURE__ */ jsxRuntime.jsx(blocks.RiIcon, { icon: "RiCloseLine" })
+              }
+            )
+          ] }) })
+        ]
+      }
+    ) });
+  });
+  QrInput.displayName = "QrInput";
+  const QrScanner = React.memo((props) => {
+    const { onQrScan, onClose } = props;
+    const videoRef = React.useRef(null);
+    const [isScannerLoading, setIsScannerLoading] = React.useState(false);
+    React.useEffect(() => {
+      if (!videoRef.current)
+        return;
+      const qrScanner = new QrScannerAPI(
+        videoRef.current,
+        (result) => {
+          const data = result.data;
+          onQrScan(data);
+          qrScanner.destroy();
+        },
+        {
+          highlightCodeOutline: true,
+          highlightScanRegion: true,
+          maxScansPerSecond: 1
+        }
+      );
+      setIsScannerLoading(true);
+      qrScanner.start().then(() => {
+        setIsScannerLoading(false);
+      }).catch(() => {
+        setIsScannerLoading(false);
+      });
+    }, [onQrScan]);
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      Flex,
+      {
+        className: styles$a.QrScannerWrapper,
+        width: "100%",
+        height: "100%",
+        direction: "column",
+        gap: "2",
+        justify: "center",
+        position: "relative",
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx(Flex, { width: "100%", position: "absolute", top: "0", p: "2", children: /* @__PURE__ */ jsxRuntime.jsx(blocks.IconButton, { "aria-label": "close", variant: "soft", severity: "info", highContrast: true, onClick: onClose, children: /* @__PURE__ */ jsxRuntime.jsx(blocks.RiIcon, { icon: "RiCloseLine" }) }) }),
+          /* @__PURE__ */ jsxRuntime.jsxs(Box, { style: { maxWidth: "100%", maxHeight: "100%" }, position: "relative", children: [
+            /* @__PURE__ */ jsxRuntime.jsx("video", { ref: videoRef, style: { width: "100%", height: "100%" } }),
+            isScannerLoading && /* @__PURE__ */ jsxRuntime.jsx(
+              Flex,
+              {
+                position: "absolute",
+                inset: "0",
+                style: { background: "var(--color-background)" },
+                justify: "center",
+                align: "center",
+                children: /* @__PURE__ */ jsxRuntime.jsx(blocks.Spinner, {})
+              }
+            )
+          ] })
+        ]
+      }
+    );
+  });
+  QrScanner.displayName = "QrScanner";
+  const emptyQrField = {
+    ...emptyBaseField,
+    type: "qr"
+  };
+  const _QrField = class _QrField extends BaseField {
+    constructor(options) {
+      super({ ...options, type: "qr" });
+      __publicField(this, "onlyValidateAfterTouched", false);
+    }
+    serialize() {
+      return super._serialize();
+    }
+    static deserialize(data) {
+      if (data.type !== "qr")
+        throw new Error("Type mismatch.");
+      return new _QrField(data);
+    }
+    getInput(props) {
+      return /* @__PURE__ */ jsxRuntime.jsx(QrInput, { ...props, field: this });
+    }
+  };
+  __publicField(_QrField, "fieldTypeName", "QR");
+  __publicField(_QrField, "fieldTypeDescription", "Used for scanning/reading QR codes.");
+  __publicField(_QrField, "Icon", RiQrCodeLine);
+  let QrField = _QrField;
   const FieldInputCloner = React.memo((props) => {
     const { field, ...rest } = props;
     const [{ value: identifier }] = formik.useField(field.options.clonedFieldIdentifier);
@@ -13999,6 +14180,7 @@ var __publicField = (obj, key, value) => {
     text: TextField,
     custom: CustomField,
     upload: UploadField,
+    qr: QrField,
     // TODO: Underscore
     "multi-string": MultiStringField,
     "multi-select": MultiSelectField
@@ -14012,6 +14194,7 @@ var __publicField = (obj, key, value) => {
     text: emptyTextField,
     custom: emptyCustomField,
     upload: emptyUploadField,
+    qr: emptyQrField,
     // TODO: Underscore
     "multi-string": emptyMultiStringField,
     "multi-select": emptyMultiSelectField
@@ -14099,7 +14282,7 @@ var __publicField = (obj, key, value) => {
     return /* @__PURE__ */ jsxRuntime.jsx(Card, { children: /* @__PURE__ */ jsxRuntime.jsxs(blocks.Flex, { direction: "column", gap: "3", children: [
       /* @__PURE__ */ jsxRuntime.jsxs(blocks.Flex, { direction: "column", children: [
         /* @__PURE__ */ jsxRuntime.jsx(Heading, { as: "h3", size: "3", children: label }),
-        /* @__PURE__ */ jsxRuntime.jsx(blocks.Text, { className: styles$b.description, children: description2 })
+        /* @__PURE__ */ jsxRuntime.jsx(blocks.Text, { className: styles$c.description, children: description2 })
       ] }),
       inputs
     ] }) });
@@ -14342,7 +14525,7 @@ var __publicField = (obj, key, value) => {
         [schema.title]
       );
       const Description = React.useMemo(
-        () => typeof schema.description === "string" ? /* @__PURE__ */ jsxRuntime.jsx(blocks.Text, { className: styles$b.description, children: schema.description }) : schema.description,
+        () => typeof schema.description === "string" ? /* @__PURE__ */ jsxRuntime.jsx(blocks.Text, { className: styles$c.description, children: schema.description }) : schema.description,
         [schema.description]
       );
       const inputs = useFieldInputs(schema.fields, { formId: formId2, disabled: readonly });
@@ -14358,7 +14541,7 @@ var __publicField = (obj, key, value) => {
           !hideDescription && Description
         ] }) }),
         inputs,
-        !readonly && /* @__PURE__ */ jsxRuntime.jsxs(blocks.Flex, { className: styles$b.floatingButtonContainer, align: "center", justify: "end", gap: "2", children: [
+        !readonly && /* @__PURE__ */ jsxRuntime.jsxs(blocks.Flex, { className: styles$c.floatingButtonContainer, align: "center", justify: "end", gap: "2", children: [
           cancelText && /* @__PURE__ */ jsxRuntime.jsx(blocks.Button, { severity: "info", ...buttonProps, type: "button", onClick: onCancel, children: cancelText }),
           /* @__PURE__ */ jsxRuntime.jsx(blocks.Button, { ...buttonProps, type: "submit", disabled: !formik$1.isValid, children: submitText })
         ] })
@@ -15706,12 +15889,12 @@ var __publicField = (obj, key, value) => {
       });
       const previewSchema = React.useMemo(() => formRevisionToSchema(formik$1.values), [formik$1.values]);
       return /* @__PURE__ */ jsxRuntime.jsx(Tabs.Root, { ref, defaultValue: "edit", children: /* @__PURE__ */ jsxRuntime.jsxs(blocks.Flex, { direction: "column", gap: "2", children: [
-        showTabs && /* @__PURE__ */ jsxRuntime.jsxs(Tabs.List, { className: classNames$1(styles$c.tabsList, tabsListClassName), children: [
-          /* @__PURE__ */ jsxRuntime.jsx(Tabs.Trigger, { className: styles$c.tabTrigger, value: "edit", children: /* @__PURE__ */ jsxRuntime.jsxs(blocks.Flex, { align: "center", gap: "2", children: [
+        showTabs && /* @__PURE__ */ jsxRuntime.jsxs(Tabs.List, { className: classNames$1(styles$d.tabsList, tabsListClassName), children: [
+          /* @__PURE__ */ jsxRuntime.jsx(Tabs.Trigger, { className: styles$d.tabTrigger, value: "edit", children: /* @__PURE__ */ jsxRuntime.jsxs(blocks.Flex, { align: "center", gap: "2", children: [
             /* @__PURE__ */ jsxRuntime.jsx(blocks.RiIcon, { icon: "RiPencilLine" }),
             "Edit"
           ] }) }),
-          /* @__PURE__ */ jsxRuntime.jsx(Tabs.Trigger, { className: styles$c.tabTrigger, value: "preview", children: /* @__PURE__ */ jsxRuntime.jsxs(blocks.Flex, { align: "center", gap: "2", children: [
+          /* @__PURE__ */ jsxRuntime.jsx(Tabs.Trigger, { className: styles$d.tabTrigger, value: "preview", children: /* @__PURE__ */ jsxRuntime.jsxs(blocks.Flex, { align: "center", gap: "2", children: [
             /* @__PURE__ */ jsxRuntime.jsx(blocks.RiIcon, { icon: "RiEyeLine" }),
             "Preview"
           ] }) })
@@ -15735,8 +15918,8 @@ var __publicField = (obj, key, value) => {
                     render: ({ setValue, value, meta }) => /* @__PURE__ */ jsxRuntime.jsx(InputWithHelpText, { severity: "danger", helpText: meta.error ?? null, children: /* @__PURE__ */ jsxRuntime.jsx(
                       blocks.Input,
                       {
-                        className: classNames$1(styles$c.title, {
-                          [styles$c.error]: meta.error
+                        className: classNames$1(styles$d.title, {
+                          [styles$d.error]: meta.error
                         }),
                         placeholder: "Form title",
                         value,
@@ -15758,7 +15941,7 @@ var __publicField = (obj, key, value) => {
                     render: ({ setValue, value }) => /* @__PURE__ */ jsxRuntime.jsx(
                       blocks.TextArea,
                       {
-                        className: styles$c.description,
+                        className: styles$d.description,
                         placeholder: "Explain the purpose of this form",
                         value,
                         onChange: (event) => {
@@ -15776,7 +15959,7 @@ var __publicField = (obj, key, value) => {
               /* @__PURE__ */ jsxRuntime.jsx(FieldsEditor, { fieldsOnly }),
               /* @__PURE__ */ jsxRuntime.jsx(blocks.Text, { severity: "danger", size: "1", children: typeof formik$1.errors.fields === "string" && formik$1.errors.fields })
             ] }),
-            /* @__PURE__ */ jsxRuntime.jsxs(blocks.Flex, { className: styles$c.floatingButtonContainer, align: "center", justify: "end", gap: "2", children: [
+            /* @__PURE__ */ jsxRuntime.jsxs(blocks.Flex, { className: styles$d.floatingButtonContainer, align: "center", justify: "end", gap: "2", children: [
               onCancel && /* @__PURE__ */ jsxRuntime.jsx(blocks.Button, { type: "button", variant: "solid", severity: "info", onClick: onCancel, children: "Cancel" }),
               /* @__PURE__ */ jsxRuntime.jsx(blocks.Button, { type: "submit", children: "Save form" })
             ] })
@@ -15811,6 +15994,9 @@ var __publicField = (obj, key, value) => {
     NumberInput,
     PatchField,
     PatchFormProvider,
+    QrField,
+    QrInput,
+    QrScanner,
     SelectField,
     SelectInput,
     StringField,
@@ -15825,6 +16011,7 @@ var __publicField = (obj, key, value) => {
     emptyMultiSelectField,
     emptyMultiStringField,
     emptyNumberField,
+    emptyQrField,
     emptySelectField,
     emptyStringField,
     emptyTextField,
@@ -15914,6 +16101,9 @@ var __publicField = (obj, key, value) => {
   exports2.ProjectFileService = ProjectFileService;
   exports2.ProjectService = ProjectService;
   exports2.ProjectType = ProjectType;
+  exports2.QrField = QrField;
+  exports2.QrInput = QrInput;
+  exports2.QrScanner = QrScanner;
   exports2.SDKContext = SDKContext;
   exports2.SDKProvider = SDKProvider;
   exports2.SUPPORTED_IMAGE_FILE_TYPES = SUPPORTED_IMAGE_FILE_TYPES;
@@ -16037,6 +16227,7 @@ var __publicField = (obj, key, value) => {
   exports2.emptyMultiSelectField = emptyMultiSelectField;
   exports2.emptyMultiStringField = emptyMultiStringField;
   exports2.emptyNumberField = emptyNumberField;
+  exports2.emptyQrField = emptyQrField;
   exports2.emptySelectField = emptySelectField;
   exports2.emptyStringField = emptyStringField;
   exports2.emptyTextField = emptyTextField;