@overmap-ai/core 1.0.35-projects-licensing.20 → 1.0.36-add-image-to-forms.0

package/dist/overmap-core.js

@@ -6,9 +6,9 @@ var __publicField = (obj, key, value) => {
 };
 var _a;
 import * as React from "react";
-import React__default, { useState, useEffect, useRef, memo, useMemo, forwardRef, createElement, useCallback, createContext, useContext, Children, isValidElement, cloneElement, Fragment, useLayoutEffect, useReducer } from "react";
-import { jsx, jsxs, Fragment as Fragment$1 } from "react/jsx-runtime";
-import { unsafeShowToast, AlertDialogProvider, ToastProvider, DefaultTheme, Flex, Text, useSeverityColor, Checkbox, TextArea, Select, useToast, IconButton, Badge, MultiSelect, Button, ButtonList, divButtonProps, Tooltip, DropdownItemMenu, Popover, Input, useAlertDialog } from "@overmap-ai/blocks";
+import React__default, { useState, useEffect, useRef, memo, useMemo, forwardRef, createElement, useCallback, createContext, useContext, Children, isValidElement, cloneElement, Fragment as Fragment$1, useLayoutEffect, useReducer } from "react";
+import { jsx, jsxs, Fragment } from "react/jsx-runtime";
+import { unsafeShowToast, AlertDialogProvider, ToastProvider, DefaultTheme, Flex, IconButton, Text, useSeverityColor, Checkbox, TextArea, Select, useToast, Badge, MultiSelect, Button, ButtonList, divButtonProps, Tooltip, DropdownItemMenu, Popover, Input, useAlertDialog } from "@overmap-ai/blocks";
 import { DepGraph } from "dependency-graph";
 import { offline as offline$1 } from "@redux-offline/redux-offline";
 import offlineConfig from "@redux-offline/redux-offline/lib/defaults";
@@ -22,11 +22,11 @@ import ColorCls from "color";
 import jwtDecode from "jwt-decode";
 import { RESET_STATE } from "@redux-offline/redux-offline/lib/constants";
 import { openDB } from "idb";
+import saveAs, { saveAs as saveAs$1 } from "file-saver";
 import { useField, useFormikContext, useFormik, FormikProvider } from "formik";
 import get from "lodash.get";
 import Linkify from "linkify-react";
 import { DragDropContext, Droppable, Draggable } from "@hello-pangea/dnd";
-import { saveAs } from "file-saver";
 import set from "lodash.set";
 import cloneDeep from "lodash.clonedeep";
 import { flushSync } from "react-dom";
@@ -626,15 +626,15 @@ const wrapMigration = (migrator) => (state) => {
 };
 const migrations = [initialVersioning, signOut, signOut, createOutboxState];
 const manifest = Object.fromEntries(migrations.map((migration2, i) => [i, wrapMigration(migration2)]));
-const initialState$m = {
+const initialState$l = {
   accessToken: "",
   refreshToken: "",
   isLoggedIn: false
 };
 const authSlice = createSlice({
   name: "auth",
-  initialState: initialState$m,
-  extraReducers: (builder) => builder.addCase("RESET", (state) => Object.assign(state, initialState$m)),
+  initialState: initialState$l,
+  extraReducers: (builder) => builder.addCase("RESET", (state) => Object.assign(state, initialState$l)),
   reducers: {
     setTokens: (state, action) => {
       state.accessToken = action.payload.accessToken;
@@ -1338,7 +1338,7 @@ const getLocalRelativeDateString = memoize((date, min, max) => {
     return getLocalDateString(date);
   return relative.format(days, "days");
 });
-const initialState$l = {
+const initialState$k = {
   categories: {},
   usedCategoryColors: [],
   categoryVisibility: {
@@ -1348,8 +1348,8 @@ const initialState$l = {
 };
 const categorySlice = createSlice({
   name: "categories",
-  initialState: initialState$l,
-  extraReducers: (builder) => builder.addCase("RESET", (state) => Object.assign(state, initialState$l)),
+  initialState: initialState$k,
+  extraReducers: (builder) => builder.addCase("RESET", (state) => Object.assign(state, initialState$k)),
   reducers: {
     setCategories: (state, action) => {
       if (!Array.isArray(action.payload))
@@ -1482,13 +1482,13 @@ const selectHiddenCategoryCount = (state) => {
   return hiddenCategoryCount;
 };
 const categoryReducer = categorySlice.reducer;
-const initialState$k = {
+const initialState$j = {
   components: {}
 };
 const componentSlice = createSlice({
   name: "components",
-  initialState: initialState$k,
-  extraReducers: (builder) => builder.addCase("RESET", (state) => Object.assign(state, initialState$k)),
+  initialState: initialState$j,
+  extraReducers: (builder) => builder.addCase("RESET", (state) => Object.assign(state, initialState$j)),
   reducers: {
     addComponent: (state, action) => {
       state.components[action.payload.offline_id] = action.payload;
@@ -1600,13 +1600,13 @@ const {
   removeAllComponentsOfType
 } = componentSlice.actions;
 const componentReducer = componentSlice.reducer;
-const initialState$j = {
+const initialState$i = {
   completionsByComponentId: {}
 };
 const componentStageCompletionSlice = createSlice({
   name: "componentStageCompletions",
-  initialState: initialState$j,
-  extraReducers: (builder) => builder.addCase("RESET", (state) => Object.assign(state, initialState$j)),
+  initialState: initialState$i,
+  extraReducers: (builder) => builder.addCase("RESET", (state) => Object.assign(state, initialState$i)),
   reducers: {
     addStageCompletion: (state, action) => {
       let stageToCompletionDateMapping = state.completionsByComponentId[action.payload.component];
@@ -1657,13 +1657,13 @@ const selectCompletedStageIdsForComponent = (component) => (state) => {
   return Object.keys(state.componentStageCompletionReducer.completionsByComponentId[component.offline_id] ?? {});
 };
 const componentStageCompletionReducer = componentStageCompletionSlice.reducer;
-const initialState$i = {
+const initialState$h = {
   stages: {}
 };
 const componentStageSlice = createSlice({
   name: "componentStages",
-  initialState: initialState$i,
-  extraReducers: (builder) => builder.addCase("RESET", (state) => Object.assign(state, initialState$i)),
+  initialState: initialState$h,
+  extraReducers: (builder) => builder.addCase("RESET", (state) => Object.assign(state, initialState$h)),
   reducers: {
     addStages: (state, action) => {
       Object.assign(state.stages, toOfflineIdRecord(action.payload));
@@ -1723,14 +1723,14 @@ const selectStagesFromStageIds = restructureCreateSelectorWithArgs(
 );
 const { addStages, updateStages, removeStages } = componentStageSlice.actions;
 const componentStageReducer = componentStageSlice.reducer;
-const initialState$h = {
+const initialState$g = {
   componentTypes: {},
   hiddenComponentTypeIds: {}
 };
 const componentTypeSlice = createSlice({
   name: "componentTypes",
-  initialState: initialState$h,
-  extraReducers: (builder) => builder.addCase("RESET", (state) => Object.assign(state, initialState$h)),
+  initialState: initialState$g,
+  extraReducers: (builder) => builder.addCase("RESET", (state) => Object.assign(state, initialState$g)),
   reducers: {
     addComponentType: (state, action) => {
       state.componentTypes[action.payload.offline_id] = action.payload;
@@ -1789,13 +1789,13 @@ const selectComponentTypesByName = restructureCreateSelectorWithArgs(
 const selectHiddenComponentTypeIds = (state) => state.componentTypeReducer.hiddenComponentTypeIds;
 const { addComponentType, setComponentTypes, toggleComponentTypeVisibility, deleteComponentType } = componentTypeSlice.actions;
 const componentTypeReducer = componentTypeSlice.reducer;
-const initialState$g = {
+const initialState$f = {
   workspaces: {},
   activeWorkspaceId: null
 };
 const workspaceSlice = createSlice({
   name: "workspace",
-  initialState: initialState$g,
+  initialState: initialState$f,
   // The `reducers` field lets us define reducers and generate associated actions
   reducers: {
     setWorkspaces: (state, action) => {
@@ -1852,20 +1852,21 @@ const selectPermittedWorkspaceIds = createSelector(
 );
 const workspaceReducer = workspaceSlice.reducer;
 const maxRecentIssues = 10;
-const initialState$f = {
+const initialState$e = {
   issues: {},
   attachments: {},
   comments: {},
   visibleStatuses: [IssueStatus.BACKLOG, IssueStatus.SELECTED],
+  isFetchingInitialData: false,
   visibleUserIds: null,
   recentIssueIds: [],
   activeIssueId: null
 };
 const issueSlice = createSlice({
   name: "issues",
-  initialState: initialState$f,
+  initialState: initialState$e,
   extraReducers: (builder) => builder.addCase("RESET", (state) => {
-    Object.assign(state, initialState$f);
+    Object.assign(state, initialState$e);
   }),
   reducers: {
     setIssues: (state, action) => {
@@ -1944,6 +1945,9 @@ const issueSlice = createSlice({
     setVisibleStatuses: (state, action) => {
       state.visibleStatuses = action.payload;
     },
+    setIsFetchingInitialData: (state, action) => {
+      state.isFetchingInitialData = action.payload;
+    },
     setVisibleUserIds: (state, action) => {
       state.visibleUserIds = [...new Set(action.payload)];
     },
@@ -2002,6 +2006,7 @@ const {
   resetRecentIssues,
   setActiveIssueId,
   setAttachments,
+  setIsFetchingInitialData,
   setIssueComments,
   setIssues,
   setVisibleStatuses,
@@ -2100,6 +2105,7 @@ const selectIssue = restructureCreateSelectorWithArgs(
     return mapping[id];
   })
 );
+const selectIsFetchingInitialData = (state) => state.issueReducer.isFetchingInitialData;
 const selectAllAttachments = createSelector([selectIssueAttachmentMapping], (mapping) => Object.values(mapping));
 const searchIssues = restructureCreateSelectorWithArgs(
   createSelector(
@@ -2191,15 +2197,15 @@ const selectRecentIssuesAsSearchResults = createSelector(
   }
 );
 const issueReducer = issueSlice.reducer;
-const initialState$e = {
+const initialState$d = {
   s3Urls: {}
 };
 const msPerHour = 1e3 * 60 * 60;
 const msPerWeek = msPerHour * 24 * 7;
 const fileSlice = createSlice({
   name: "file",
-  initialState: initialState$e,
-  extraReducers: (builder) => builder.addCase("RESET", (state) => Object.assign(state, initialState$e)),
+  initialState: initialState$d,
+  extraReducers: (builder) => builder.addCase("RESET", (state) => Object.assign(state, initialState$d)),
   reducers: {
     setUploadUrl: (state, action) => {
       const { url, fields, sha1 } = action.payload;
@@ -2226,7 +2232,7 @@ const selectUploadUrl = (sha1) => (state) => {
   return url;
 };
 const fileReducer = fileSlice.reducer;
-const initialState$d = {
+const initialState$c = {
   // TODO: Change first MapStyle.SATELLITE to MaptStyle.None when project creation map is fixed
   mapStyle: MapStyle.SATELLITE,
   showTooltips: false,
@@ -2234,8 +2240,8 @@ const initialState$d = {
 };
 const mapSlice = createSlice({
   name: "map",
-  initialState: initialState$d,
-  extraReducers: (builder) => builder.addCase("RESET", (state) => Object.assign(state, initialState$d)),
+  initialState: initialState$c,
+  extraReducers: (builder) => builder.addCase("RESET", (state) => Object.assign(state, initialState$c)),
   reducers: {
     setMapStyle: (state, action) => {
       state.mapStyle = action.payload;
@@ -2277,18 +2283,7 @@ var VerificationCodeType = /* @__PURE__ */ ((VerificationCodeType2) => {
   VerificationCodeType2[VerificationCodeType2["RESET_PASSWORD"] = 10] = "RESET_PASSWORD";
   return VerificationCodeType2;
 })(VerificationCodeType || {});
-var LicenseLevel = /* @__PURE__ */ ((LicenseLevel2) => {
-  LicenseLevel2[LicenseLevel2["PRO"] = 0] = "PRO";
-  return LicenseLevel2;
-})(LicenseLevel || {});
-var LicenseStatus = /* @__PURE__ */ ((LicenseStatus2) => {
-  LicenseStatus2[LicenseStatus2["ACTIVE"] = 0] = "ACTIVE";
-  LicenseStatus2[LicenseStatus2["PAUSED"] = 2] = "PAUSED";
-  LicenseStatus2[LicenseStatus2["CANCELED"] = 4] = "CANCELED";
-  LicenseStatus2[LicenseStatus2["INACTIVE"] = 6] = "INACTIVE";
-  return LicenseStatus2;
-})(LicenseStatus || {});
-const initialState$c = {
+const initialState$b = {
   users: {},
   currentUser: {
     id: 0,
@@ -2299,8 +2294,8 @@ const initialState$c = {
 };
 const userSlice = createSlice({
   name: "users",
-  initialState: initialState$c,
-  extraReducers: (builder) => builder.addCase("RESET", (state) => Object.assign(state, initialState$c)),
+  initialState: initialState$b,
+  extraReducers: (builder) => builder.addCase("RESET", (state) => Object.assign(state, initialState$b)),
   reducers: {
     setUsers: (state, action) => {
       const usersMapping = {};
@@ -2362,13 +2357,13 @@ const selectUser = (userId) => (state) => {
 const selectUsersAsMapping = (state) => state.userReducer.users;
 const selectFavouriteProjects = (state) => state.userReducer.currentUser.profile.favourite_project_ids;
 const userReducer = userSlice.reducer;
-const initialState$b = {
+const initialState$a = {
   organizationAccesses: {}
 };
 const organizationAccessSlice = createSlice({
   name: "organizationAccess",
-  initialState: initialState$b,
-  extraReducers: (builder) => builder.addCase("RESET", (state) => Object.assign(state, initialState$b)),
+  initialState: initialState$a,
+  extraReducers: (builder) => builder.addCase("RESET", (state) => Object.assign(state, initialState$a)),
   reducers: {
     setOrganizationAccesses: (state, action) => {
       if (!Array.isArray(action.payload))
@@ -2431,13 +2426,151 @@ const selectOrganizationAccessUserMapping = (state) => {
   return organizationAccesses;
 };
 const organizationAccessReducer = organizationAccessSlice.reducer;
-const initialState$a = {
+const initialState$9 = {
+  organizations: {},
+  activeOrganizationId: null
+};
+const organizationSlice = createSlice({
+  name: "organizations",
+  initialState: initialState$9,
+  extraReducers: (builder) => builder.addCase("RESET", (state) => Object.assign(state, initialState$9)),
+  reducers: {
+    setOrganizations: (state, action) => {
+      for (const org of action.payload) {
+        state.organizations[org.id] = org;
+      }
+    },
+    updateActiveOrganization: (state, action) => {
+      if (!state.activeOrganizationId) {
+        throw new Error("Cannot update name of active organization. Active organization ID does not exist");
+      }
+      if (state.activeOrganizationId !== action.payload.id) {
+        throw new Error("Tried updating active organization with different organization");
+      }
+      state.organizations[state.activeOrganizationId] = action.payload;
+    },
+    setActiveOrganizationId: (state, action) => {
+      state.activeOrganizationId = action.payload;
+    }
+  }
+});
+const { setOrganizations, setActiveOrganizationId, updateActiveOrganization } = organizationSlice.actions;
+const selectActiveOrganizationId = (state) => {
+  return state.organizationReducer.activeOrganizationId;
+};
+const selectOrganizations = (state) => {
+  return Object.values(state.organizationReducer.organizations);
+};
+const selectOrganizationsWithAccess = createSelector(
+  [selectOrganizations],
+  (organizations) => Object.values(organizations).filter((organization) => organization.has_access)
+);
+const selectActiveOrganization = (state) => {
+  const id = selectActiveOrganizationId(state);
+  if (!id) {
+    return null;
+  }
+  const organization = state.organizationReducer.organizations[id];
+  if (!organization) {
+    return null;
+  }
+  return organization;
+};
+const selectOrganizationUsersIds = createSelector(
+  [selectOrganizationAccesses],
+  (organizationAccesses) => Object.values(organizationAccesses).map((organizationAccess) => organizationAccess.user)
+);
+const selectOrganizationUsersAsMapping = createSelector(
+  [selectOrganizationUsersIds, selectUsersAsMapping],
+  (organizationUserIds, users) => organizationUserIds.reduce((accum, userId) => ({ ...accum, [userId]: users[userId] }), {})
+);
+const selectSortedOrganizationUsers = createSelector(
+  [selectCurrentUser, selectOrganizationUsersAsMapping, selectOrganizationAccessUserMapping],
+  (currentUser, userMapping, organizationAccessMapping) => {
+    return Object.values(userMapping).sort((userA, userB) => {
+      if (userA.id === currentUser.id) {
+        return -1;
+      } else if (userB.id === currentUser.id) {
+        return 1;
+      }
+      const organizationAccessesA = organizationAccessMapping[userA.id];
+      const organizationAccessesB = organizationAccessMapping[userB.id];
+      if ((organizationAccessesA == null ? void 0 : organizationAccessesA.access_level) === (organizationAccessesB == null ? void 0 : organizationAccessesB.access_level)) {
+        return userA.username.localeCompare(userB.username);
+      }
+      if ((organizationAccessesA == null ? void 0 : organizationAccessesA.access_level) === OrganizationAccessLevel.ADMIN) {
+        return -1;
+      }
+      return 1;
+    });
+  }
+);
+const selectOrganization = (id) => (state) => {
+  return state.organizationReducer.organizations[id];
+};
+const organizationReducer = organizationSlice.reducer;
+const createOfflineAction = (request2, baseUrl) => {
+  const requestWithUuid = request2.uuid ? request2 : { ...request2, uuid: v4() };
+  return {
+    payload: requestWithUuid,
+    type: "",
+    meta: {
+      offline: {
+        effect: {
+          timestamp: (/* @__PURE__ */ new Date()).toISOString(),
+          request: requestWithUuid,
+          BASE_URL: baseUrl
+        }
+      }
+    }
+  };
+};
+const initialState$8 = {
+  deletedRequests: [],
+  latestRetryTime: 0
+};
+const outboxSlice = createSlice({
+  name: "outbox",
+  initialState: initialState$8,
+  extraReducers: (builder) => builder.addCase("RESET", (state) => Object.assign(state, initialState$8)),
+  reducers: {
+    // enqueueActions is a reducer that does nothing but enqueue API request to the Redux Offline outbox
+    // Whenever an issue is being created, a reducer addIssue() is responsible for adding it to the offline store
+    // Then this reducer enqueueRequest() is responsible for adding the actual request data to the outbox
+    enqueueRequest: {
+      reducer: (state, _action) => {
+        return state;
+      },
+      prepare: (payload) => {
+        console.debug("Preparing to enqueue request", payload);
+        const { BASE_URL, ...rest } = payload;
+        return createOfflineAction(rest, BASE_URL);
+      }
+    },
+    markForDeletion(state, action) {
+      state.deletedRequests.push(action.payload);
+    },
+    markAsDeleted(state, action) {
+      const index2 = state.deletedRequests.indexOf(action.payload);
+      if (index2 !== -1)
+        state.deletedRequests.splice(index2, 1);
+    },
+    _setLatestRetryTime: (state, action) => {
+      state.latestRetryTime = action.payload;
+    }
+  }
+});
+const selectDeletedRequests = (state) => state.outboxReducer.deletedRequests;
+const selectLatestRetryTime = (state) => state.outboxReducer.latestRetryTime;
+const { enqueueRequest, markForDeletion, markAsDeleted, _setLatestRetryTime } = outboxSlice.actions;
+const outboxReducer = outboxSlice.reducer;
+const initialState$7 = {
   projectAccesses: {}
 };
 const projectAccessSlice = createSlice({
   name: "projectAccess",
-  initialState: initialState$a,
-  extraReducers: (builder) => builder.addCase("RESET", (state) => Object.assign(state, initialState$a)),
+  initialState: initialState$7,
+  extraReducers: (builder) => builder.addCase("RESET", (state) => Object.assign(state, initialState$7)),
   reducers: {
     setProjectAccesses: (state, action) => {
       if (!Array.isArray(action.payload))
@@ -2505,7 +2638,7 @@ const selectProjectAccessUserMapping = (state) => {
   return projectAccesses;
 };
 const projectAccessReducer = projectAccessSlice.reducer;
-const initialState$9 = {
+const initialState$6 = {
   projects: {},
   activeProjectId: null,
   recentProjectIds: [],
@@ -2514,7 +2647,7 @@ const initialState$9 = {
 };
 const projectSlice = createSlice({
   name: "projects",
-  initialState: initialState$9,
+  initialState: initialState$6,
   reducers: {
     setProjects: (state, action) => {
       const projectsMap = {};
@@ -2560,20 +2693,6 @@ const projectSlice = createSlice({
       } else {
         throw new Error("Accept project invite: user is not in this project");
       }
-    },
-    updateActiveProjectIssuesCount: (state, action) => {
-      if (state.activeProjectId) {
-        state.projects[state.activeProjectId].issues_count += action.payload;
-      } else {
-        throw new Error("Update issues count: no active project");
-      }
-    },
-    updateActiveProjectFormSubmissionsCount: (state, action) => {
-      if (state.activeProjectId) {
-        state.projects[state.activeProjectId].form_submissions_count += action.payload;
-      } else {
-        throw new Error("Update form submissions count: no active project");
-      }
     }
   }
 });
@@ -2584,9 +2703,7 @@ const {
   setActiveProjectId,
   setCreateProjectType,
   deleteProject,
-  acceptProjectInvite,
-  updateActiveProjectIssuesCount,
-  updateActiveProjectFormSubmissionsCount
+  acceptProjectInvite
 } = projectSlice.actions;
 const selectProjects = (state) => state.projectReducer.projects;
 const selectActiveProjectId = (state) => state.projectReducer.activeProjectId;
@@ -2650,264 +2767,39 @@ const selectSortedProjectUsers = createSelector(
     });
   }
 );
-const initialState$8 = {
-  licenses: {}
+const initialState$5 = {
+  projectFiles: {},
+  activeProjectFileId: null,
+  isImportingProjectFile: false,
+  enabledProjectFiles: {}
 };
-const licenseSlice = createSlice({
-  name: "license",
-  initialState: initialState$8,
-  extraReducers: (builder) => builder.addCase("RESET", (state) => Object.assign(state, initialState$8)),
+const projectFileSlice = createSlice({
+  name: "projectFiles",
+  initialState: initialState$5,
+  extraReducers: (builder) => builder.addCase("RESET", (state) => Object.assign(state, initialState$5)),
   reducers: {
-    setLicenses: (state, action) => {
-      if (!Array.isArray(action.payload))
-        throw new Error("Expected an array of Licenses");
-      if (action.payload.filter(onlyUniqueOfflineIds).length !== action.payload.length) {
-        throw new Error("Tried to use setLicenses reducer with duplicate ID's");
-      }
-      const licenses = {};
-      for (const license of action.payload) {
-        licenses[license.offline_id] = license;
+    addOrReplaceProjectFiles: (state, action) => {
+      for (let fileObj of action.payload) {
+        let file = fileObj.file;
+        if (file.includes("+")) {
+          console.warn("Attempting to apply fix for image URL with '+' character:", file);
+          const parts = file.split("/");
+          if (parts.length < 2) {
+            throw new Error("Invalid URL: " + file);
+          }
+          const lastPart = encodeURIComponent(parts[parts.length - 1]);
+          file = parts.slice(0, -1).join("/") + "/" + lastPart;
+          console.warn("Fixed URL:", file);
+          fileObj = { ...fileObj, file };
+        }
+        state.projectFiles[fileObj.offline_id] = fileObj;
       }
-      state.licenses = licenses;
     },
-    addLicenses: (state, action) => {
-      for (const license of action.payload) {
-        state.licenses[license.offline_id] = license;
+    addOrReplaceProjectFile: (state, action) => {
+      if (!action.payload.project) {
+        throw new Error("ProjectFile has no project. A project must be set before storing.");
       }
-    },
-    updateLicense: (state, action) => {
-      if (!(action.payload.offline_id in state.licenses)) {
-        throw new Error("Tried to update license that does not exist.");
-      }
-      state.licenses[action.payload.offline_id] = action.payload;
-    }
-  }
-});
-const { setLicenses, addLicenses, updateLicense } = licenseSlice.actions;
-const selectLicenses = (state) => {
-  return state.licenseReducer.licenses;
-};
-const selectLicense = (licenseId) => (state) => state.licenseReducer.licenses[licenseId];
-const selectActiveLicense = createSelector(
-  [selectLicenses, selectActiveProjectId],
-  (licenses, activeProjectId) => {
-    const activeLicense = Object.values(licenses).find((license) => license.project === activeProjectId);
-    return activeLicense ?? null;
-  }
-);
-const selectLicenseForProject = restructureCreateSelectorWithArgs(
-  createSelector(
-    [selectLicenses, (_state, projectId) => projectId],
-    (licenses, projectId) => Object.values(licenses).find((license) => license.project === projectId) ?? null
-  )
-);
-const selectActiveStatusLicenses = createSelector(
-  [selectLicenses],
-  (licenses) => Object.values(licenses).filter((license) => license.is_active)
-);
-const selectLicencesMapping = createSelector(
-  [selectLicenses],
-  (licenses) => Object.values(licenses).filter((license) => license.project).reduce((accum, license) => ({ ...accum, [license.project]: license }), {})
-);
-const licenseReducer = licenseSlice.reducer;
-const initialState$7 = {
-  organizations: {},
-  activeOrganizationId: null
-};
-const organizationSlice = createSlice({
-  name: "organizations",
-  initialState: initialState$7,
-  extraReducers: (builder) => builder.addCase("RESET", (state) => Object.assign(state, initialState$7)),
-  reducers: {
-    setOrganizations: (state, action) => {
-      for (const org of action.payload) {
-        state.organizations[org.id] = org;
-      }
-    },
-    updateActiveOrganization: (state, action) => {
-      if (!state.activeOrganizationId) {
-        throw new Error("Cannot update name of active organization. Active organization ID does not exist");
-      }
-      if (state.activeOrganizationId !== action.payload.id) {
-        throw new Error("Tried updating active organization with different organization");
-      }
-      state.organizations[state.activeOrganizationId] = action.payload;
-    },
-    setActiveOrganizationId: (state, action) => {
-      state.activeOrganizationId = action.payload;
-    }
-  }
-});
-const { setOrganizations, setActiveOrganizationId, updateActiveOrganization } = organizationSlice.actions;
-const selectActiveOrganizationId = (state) => {
-  return state.organizationReducer.activeOrganizationId;
-};
-const selectOrganizations = (state) => {
-  return Object.values(state.organizationReducer.organizations);
-};
-const selectOrganizationsMapping = (state) => {
-  return state.organizationReducer.organizations;
-};
-const selectOrganizationsWithAccess = createSelector(
-  [selectOrganizations],
-  (organizations) => Object.values(organizations).filter((organization) => organization.has_access)
-);
-const selectActiveOrganization = (state) => {
-  const id = selectActiveOrganizationId(state);
-  if (!id) {
-    return null;
-  }
-  const organization = state.organizationReducer.organizations[id];
-  if (!organization) {
-    return null;
-  }
-  return organization;
-};
-const selectOrganizationUsersIds = createSelector(
-  [selectOrganizationAccesses],
-  (organizationAccesses) => Object.values(organizationAccesses).map((organizationAccess) => organizationAccess.user)
-);
-const selectActiveOrganizationProjects = createSelector(
-  [selectProjects, selectActiveOrganizationId],
-  (projects, activeOrganizationId) => activeOrganizationId ? Object.values(projects).filter((project) => project.owner_organization === activeOrganizationId) : []
-);
-const selectActiveOrganizationLicenses = createSelector(
-  [selectActiveOrganizationId, selectLicenses],
-  (activeOrganizationId, licenses) => !activeOrganizationId ? [] : Object.values(licenses).filter((license) => license.organization_owner === activeOrganizationId)
-);
-const selectSortedOrganizationLicenses = createSelector(
-  [selectActiveOrganizationLicenses, selectProjects],
-  (licences, projects) => licences.sort((licenseA, licenseB) => {
-    if (!licenseA.project) {
-      return 1;
-    }
-    if (!licenseB.project) {
-      return -1;
-    }
-    return projects[licenseA.project].name.toLowerCase().localeCompare(
-      projects[licenseB.project].name.toLowerCase(),
-      void 0,
-      { numeric: true }
-    );
-  })
-);
-const selectOrganizationUsersAsMapping = createSelector(
-  [selectOrganizationUsersIds, selectUsersAsMapping],
-  (organizationUserIds, users) => organizationUserIds.reduce((accum, userId) => ({ ...accum, [userId]: users[userId] }), {})
-);
-const selectSortedOrganizationUsers = createSelector(
-  [selectCurrentUser, selectOrganizationUsersAsMapping, selectOrganizationAccessUserMapping],
-  (currentUser, userMapping, organizationAccessMapping) => {
-    return Object.values(userMapping).sort((userA, userB) => {
-      if (userA.id === currentUser.id) {
-        return -1;
-      } else if (userB.id === currentUser.id) {
-        return 1;
-      }
-      const organizationAccessesA = organizationAccessMapping[userA.id];
-      const organizationAccessesB = organizationAccessMapping[userB.id];
-      if ((organizationAccessesA == null ? void 0 : organizationAccessesA.access_level) === (organizationAccessesB == null ? void 0 : organizationAccessesB.access_level)) {
-        return userA.username.localeCompare(userB.username);
-      }
-      if ((organizationAccessesA == null ? void 0 : organizationAccessesA.access_level) === OrganizationAccessLevel.ADMIN) {
-        return -1;
-      }
-      return 1;
-    });
-  }
-);
-const selectOrganization = (id) => (state) => {
-  return state.organizationReducer.organizations[id];
-};
-const organizationReducer = organizationSlice.reducer;
-const createOfflineAction = (request2, baseUrl) => {
-  const requestWithUuid = request2.uuid ? request2 : { ...request2, uuid: v4() };
-  return {
-    payload: requestWithUuid,
-    type: "",
-    meta: {
-      offline: {
-        effect: {
-          timestamp: (/* @__PURE__ */ new Date()).toISOString(),
-          request: requestWithUuid,
-          BASE_URL: baseUrl
-        }
-      }
-    }
-  };
-};
-const initialState$6 = {
-  deletedRequests: [],
-  latestRetryTime: 0
-};
-const outboxSlice = createSlice({
-  name: "outbox",
-  initialState: initialState$6,
-  extraReducers: (builder) => builder.addCase("RESET", (state) => Object.assign(state, initialState$6)),
-  reducers: {
-    // enqueueActions is a reducer that does nothing but enqueue API request to the Redux Offline outbox
-    // Whenever an issue is being created, a reducer addIssue() is responsible for adding it to the offline store
-    // Then this reducer enqueueRequest() is responsible for adding the actual request data to the outbox
-    enqueueRequest: {
-      reducer: (state, _action) => {
-        return state;
-      },
-      prepare: (payload) => {
-        console.debug("Preparing to enqueue request", payload);
-        const { BASE_URL, ...rest } = payload;
-        return createOfflineAction(rest, BASE_URL);
-      }
-    },
-    markForDeletion(state, action) {
-      state.deletedRequests.push(action.payload);
-    },
-    markAsDeleted(state, action) {
-      const index2 = state.deletedRequests.indexOf(action.payload);
-      if (index2 !== -1)
-        state.deletedRequests.splice(index2, 1);
-    },
-    _setLatestRetryTime: (state, action) => {
-      state.latestRetryTime = action.payload;
-    }
-  }
-});
-const selectDeletedRequests = (state) => state.outboxReducer.deletedRequests;
-const selectLatestRetryTime = (state) => state.outboxReducer.latestRetryTime;
-const { enqueueRequest, markForDeletion, markAsDeleted, _setLatestRetryTime } = outboxSlice.actions;
-const outboxReducer = outboxSlice.reducer;
-const initialState$5 = {
-  projectFiles: {},
-  activeProjectFileId: null,
-  isImportingProjectFile: false,
-  enabledProjectFiles: {}
-};
-const projectFileSlice = createSlice({
-  name: "projectFiles",
-  initialState: initialState$5,
-  extraReducers: (builder) => builder.addCase("RESET", (state) => Object.assign(state, initialState$5)),
-  reducers: {
-    addOrReplaceProjectFiles: (state, action) => {
-      for (let fileObj of action.payload) {
-        let file = fileObj.file;
-        if (file.includes("+")) {
-          console.warn("Attempting to apply fix for image URL with '+' character:", file);
-          const parts = file.split("/");
-          if (parts.length < 2) {
-            throw new Error("Invalid URL: " + file);
-          }
-          const lastPart = encodeURIComponent(parts[parts.length - 1]);
-          file = parts.slice(0, -1).join("/") + "/" + lastPart;
-          console.warn("Fixed URL:", file);
-          fileObj = { ...fileObj, file };
-        }
-        state.projectFiles[fileObj.offline_id] = fileObj;
-      }
-    },
-    addOrReplaceProjectFile: (state, action) => {
-      if (!action.payload.project) {
-        throw new Error("ProjectFile has no project. A project must be set before storing.");
-      }
-      state.projectFiles[action.payload.offline_id] = action.payload;
+      state.projectFiles[action.payload.offline_id] = action.payload;
     },
     setProjectFileVisible: (state, action) => {
       state.enabledProjectFiles[action.payload.fileId] = action.payload.visible;
@@ -3011,9 +2903,7 @@ const initialState$3 = {
     Components: false,
     Experimental: false
   },
-  appearance: "dark",
-  isFetchingInitialData: false,
-  isLoading: false
+  appearance: "dark"
 };
 const settingSlice = createSlice({
   name: "settings",
@@ -3037,12 +2927,6 @@ const settingSlice = createSlice({
     },
     setAppearance: (state, action) => {
       state.appearance = action.payload;
-    },
-    setIsFetchingInitialData: (state, action) => {
-      state.isFetchingInitialData = action.payload;
-    },
-    setIsLoading: (state, action) => {
-      state.isLoading = action.payload;
     }
   }
 });
@@ -3051,9 +2935,7 @@ const {
   setEnablePlacementMode,
   setSectionExpanded,
   setEnableClustering,
-  setAppearance,
-  setIsFetchingInitialData,
-  setIsLoading
+  setAppearance
 } = settingSlice.actions;
 const selectEnablePlacementMode = (state) => state.settingReducer.placementMode;
 const selectEnableDuplicateIssues = (state) => state.settingReducer.useIssueTemplate;
@@ -3062,8 +2944,6 @@ const selectExpandedSections = (state) => state.settingReducer.expandedSections;
 const selectEnableClustering = (state) => state.settingReducer.enableClustering;
 const selectAppearance = (state) => state.settingReducer.appearance;
 const settingReducer = settingSlice.reducer;
-const selectIsFetchingInitialData = (state) => state.settingReducer.isFetchingInitialData;
-const selectIsLoading = (state) => state.settingReducer.isLoading;
 const LATEST_REVISION_CACHE = {};
 function considerCachingRevision(revision, formId2, preferPending = false) {
   var _a2;
@@ -3095,7 +2975,8 @@ const initialState$2 = {
   userForms: {},
   revisions: {},
   submissions: {},
-  submissionAttachments: {}
+  submissionAttachments: {},
+  revisionAttachments: {}
 };
 const userFormSlice = createSlice({
   name: "userForms",
@@ -3148,6 +3029,15 @@ const userFormSlice = createSlice({
         state.submissionAttachments[submissionId] = [action.payload];
       }
     },
+    addUserFormRevisionAttachment: (state, action) => {
+      const revisionId = action.payload.revision;
+      const revisionAttachments = state.revisionAttachments[revisionId];
+      if (revisionAttachments) {
+        revisionAttachments.push(action.payload);
+      } else {
+        state.revisionAttachments[revisionId] = [action.payload];
+      }
+    },
     setUserFormSubmissionAttachments: (state, action) => {
       state.submissionAttachments = {};
       for (const attachment of action.payload) {
@@ -3160,6 +3050,18 @@ const userFormSlice = createSlice({
         }
       }
     },
+    setUserFormRevisionAttachments: (state, action) => {
+      state.revisionAttachments = {};
+      for (const attachment of action.payload) {
+        const revisionId = attachment.revision;
+        const revisionAttachments = state.revisionAttachments[revisionId];
+        if (revisionAttachments) {
+          revisionAttachments.push(attachment);
+        } else {
+          state.revisionAttachments[revisionId] = [attachment];
+        }
+      }
+    },
     deleteUserFormSubmission: (state, action) => {
       delete state.submissions[action.payload];
     },
@@ -3216,11 +3118,16 @@ const {
   setUserFormSubmissions,
   addUserFormRevision,
   addUserFormSubmissionAttachment,
-  setUserFormSubmissionAttachments
+  addUserFormRevisionAttachment,
+  setUserFormSubmissionAttachments,
+  setUserFormRevisionAttachments
 } = userFormSlice.actions;
 const selectSubmissionAttachments = (submissionId) => (state) => {
   return state.userFormReducer.submissionAttachments[submissionId] || [];
 };
+const selectRevisionAttachments = (revisionId) => (state) => {
+  return state.userFormReducer.revisionAttachments[revisionId] || [];
+};
 const selectFilteredUserForms = restructureCreateSelectorWithArgs(
   createSelector(
     [
@@ -3291,6 +3198,7 @@ const selectUserForm = (formId2) => (state) => {
 const selectSubmissionMapping = (state) => state.userFormReducer.submissions;
 const selectSubmissions = createSelector([selectSubmissionMapping], (submissions) => Object.values(submissions));
 const selectRevisionMapping = (state) => state.userFormReducer.revisions;
+const selectRevisionAttachmentsMapping = (state) => state.userFormReducer.revisionAttachments;
 const selectRevisions = createSelector([selectRevisionMapping], (revisions) => Object.values(revisions));
 const selectRevisionsForForm = restructureCreateSelectorWithArgs(
   createSelector([selectRevisions, (_state, formId2) => formId2], (revisions, formId2) => {
@@ -3344,6 +3252,19 @@ const selectLatestRevisionByFormId = createSelector([selectRevisionMapping], (re
   }
   return latestRevisions;
 });
+const selectAllRevisionAttachmentsByLatestRevisionId = createSelector(
+  [selectUserFormMapping, selectRevisionMapping, selectRevisionAttachmentsMapping],
+  (forms, revisions, attachments) => {
+    const mappedAttachments = {};
+    for (const form of Object.values(forms)) {
+      const latestRevision = _selectLatestFormRevision(revisions, form.offline_id);
+      if (attachments[latestRevision.offline_id] !== void 0) {
+        mappedAttachments[latestRevision.offline_id] = attachments[latestRevision.offline_id];
+      }
+    }
+    return mappedAttachments;
+  }
+);
 const selectNumberOfUserForms = createSelector([selectUserFormMapping], (userForms) => {
   return Object.keys(userForms).length;
 });
@@ -3424,8 +3345,7 @@ const overmapReducers = {
   userFormReducer,
   userReducer,
   workspaceReducer,
-  emailDomainsReducer,
-  licenseReducer
+  emailDomainsReducer
 };
 const overmapReducer = combineReducers(overmapReducers);
 const resetStore = "RESET";
@@ -3586,6 +3506,19 @@ function extractErrorMessage(errorRes, err) {
         return errorRes.body.error;
       if (typeof errorRes.body.message === "string")
         return errorRes.body.message;
+      try {
+        return Object.entries(errorRes.body).map(([key, value]) => {
+          if (typeof value === "string") {
+            return `${key}: ${value}`;
+          }
+          if (Array.isArray(value)) {
+            return value.map((v) => `${key}: ${v}`).join("\n");
+          }
+          return `${key}: ${JSON.stringify(value)}`;
+        }).join("\n");
+      } catch (e) {
+        console.error("Failed to extract error message from response body", e);
+      }
     } else if (typeof errorRes.body === "string")
       return errorRes.body;
   } else if (errorRes == null ? void 0 : errorRes.text) {
@@ -4126,7 +4059,7 @@ class AuthService extends BaseApiService {
      * @returns {Promise<TokenPair>} The new access and refresh tokens
      */
     __publicField(this, "_getRenewedTokens", async (refreshToken) => {
-      const response = await this.enqueueRequest({
+      const promise = this.enqueueRequest({
         description: "Get renewed tokens",
         method: HttpMethod.POST,
         url: "/api/token/refresh/",
@@ -4139,6 +4072,14 @@ class AuthService extends BaseApiService {
         // Don't wait for other requests to finish, or we might end up in a deadlock.
         immediate: true
       });
+      let response = void 0;
+      try {
+        response = await promise;
+      } catch (e) {
+        await this.logout();
+      }
+      if (!response)
+        throw new Error("No response");
       if (!response.access)
         throw new Error("Missing access token");
       if (!response.refresh)
@@ -4858,7 +4799,6 @@ class IssueService extends BaseApiService {
     });
     store.dispatch(addIssue(issuePayload));
     store.dispatch(addToRecentIssues(issuePayload.offline_id));
-    store.dispatch(updateActiveProjectIssuesCount(1));
     const promise = this.enqueueRequest({
       description: "Create issue",
       method: HttpMethod.POST,
@@ -4885,7 +4825,6 @@ class IssueService extends BaseApiService {
         });
       }
       store.dispatch(removeIssue(issuePayload.offline_id));
-      store.dispatch(updateActiveProjectIssuesCount(-1));
       throw error2;
     });
     return [issuePayload, promise];
@@ -4924,8 +4863,7 @@ class IssueService extends BaseApiService {
     return [fullIssue, promise];
   }
   async remove(id) {
-    const { store } = this.client;
-    const state = store.getState();
+    const state = this.client.store.getState();
     const backup = state.issueReducer.issues[id];
     if (!backup) {
       throw new Error(`No issue with id ${id} found in the store`);
@@ -4933,7 +4871,6 @@ class IssueService extends BaseApiService {
     const attachments = Object.values(state.issueReducer.attachments).filter((a) => a.issue_id === id);
     const attachmentsOfIssue = selectPhotoAttachmentsOfIssue(id)(state);
     this.client.store.dispatch(removeIssue(id));
-    store.dispatch(updateActiveProjectIssuesCount(-1));
     if (attachmentsOfIssue) {
       this.client.store.dispatch(removeAttachmentsOfIssue(id));
     }
@@ -4948,7 +4885,6 @@ class IssueService extends BaseApiService {
     } catch (e) {
       this.client.store.dispatch(addIssue(backup));
       this.client.store.dispatch(addAttachments(attachments));
-      store.dispatch(updateActiveProjectIssuesCount(1));
       throw e;
     }
   }
@@ -5024,9 +4960,7 @@ class MainService extends BaseApiService {
         owner_organization: projectData.organization_owner,
         owner_user: projectData.user_owner,
         bounds: projectData.bounds,
-        invited: projectData.invited || false,
-        issues_count: projectData.issues_count,
-        form_submissions_count: projectData.form_submissions_count
+        invited: projectData.invited || false
       });
       if (currentProjectId === projectData.id && !projectData.invited) {
         isProjectIdValid = true;
@@ -5044,7 +4978,6 @@ class MainService extends BaseApiService {
     }
     store.dispatch(setCurrentUser(data.user));
     store.dispatch(addUsers(data.project_owners));
-    store.dispatch(setLicenses(data.licenses));
     const organizationsData = data.organizations;
     store.dispatch(setOrganizations(organizationsData));
     const validProjects = projects.filter((project) => !project.invited);
@@ -5357,7 +5290,6 @@ class ProjectService extends BaseApiService {
     if (!project) {
       throw new Error("Expected project to exist");
     }
-    const license = selectLicenseForProject(project.id);
     const activeProjectId = state.projectReducer.activeProjectId;
     if (activeProjectId === projectId) {
       store.dispatch({ type: "project/setActiveProjectId", payload: null });
@@ -5368,9 +5300,6 @@ class ProjectService extends BaseApiService {
     store.dispatch(removeProjectAccessesOfProject(project.id));
     store.dispatch({ type: "rehydrated/setRehydrated", payload: false });
     store.dispatch(deleteProject(project));
-    if (license) {
-      store.dispatch(updateLicense({ ...license, project: null }));
-    }
     try {
       await this.enqueueRequest({
         description: "Delete project",
@@ -5386,9 +5315,6 @@ class ProjectService extends BaseApiService {
       store.dispatch(addOrReplaceProjectFiles(filesToDelete));
       store.dispatch(setActiveProjectId(activeProjectId));
       store.dispatch({ type: "rehydrated/setRehydrated", payload: true });
-      if (license) {
-        store.dispatch(updateLicense({ ...license, project: project.id }));
-      }
       throw e;
     }
   }
@@ -5427,8 +5353,72 @@ class ProjectService extends BaseApiService {
     });
   }
 }
+const separateImageFromFields = async (payload) => {
+  const { fields } = payload;
+  const images = {};
+  const newFields = [];
+  for (const section of fields) {
+    if (section.type !== "section") {
+      throw new Error(`Expected ISerializedField type to be a section. Got ${section.type} instead.`);
+    }
+    const { fields: sectionFields } = section;
+    const newSectionFields = [];
+    for (const field of sectionFields) {
+      if (field.image) {
+        if (field.image instanceof Promise) {
+          try {
+            images[field.identifier] = await field.image;
+          } catch (e) {
+            console.error("Failed to get image from promise", e);
+          }
+        } else {
+          images[field.identifier] = field.image;
+        }
+        delete field.image;
+      }
+      newSectionFields.push(field);
+    }
+    newFields.push({ ...section, fields: newSectionFields });
+  }
+  const payloadWithoutImage = {
+    ...payload,
+    fields: newFields
+  };
+  return { payloadWithoutImage, images };
+};
 class UserFormService extends BaseApiService {
-  add(state, initialRevision, url, ownerUser, ownerOrganization) {
+  constructor() {
+    super(...arguments);
+    // Attach images to revision, after uploading them to S3
+    __publicField(this, "getAttachImagePromises", (images, offlineRevisionId) => {
+      const { store } = this.client;
+      return Object.entries(images).map(async ([key, image]) => {
+        const sha1 = await hashFile(image);
+        await this.client.files.addCache(image, sha1);
+        const [fileProps] = await this.client.files.uploadFileToS3(sha1);
+        const revisionAttachmentPayload = offline({
+          ...fileProps,
+          revision: offlineRevisionId,
+          field_identifier: key
+        });
+        const attach = await this.enqueueRequest({
+          description: "Attach image to form revision field",
+          method: HttpMethod.POST,
+          url: `/forms/revisions/${offlineRevisionId}/attachments/`,
+          payload: revisionAttachmentPayload,
+          blockers: [revisionAttachmentPayload.revision],
+          blocks: [revisionAttachmentPayload.offline_id]
+        });
+        const offlinePayload = {
+          ...revisionAttachmentPayload,
+          file: URL.createObjectURL(image)
+        };
+        store.dispatch(addUserFormRevisionAttachment(offlinePayload));
+        return attach;
+      });
+    });
+  }
+  async add(state, initialRevision, url, ownerUser, ownerOrganization) {
     if (!!ownerUser === !!ownerOrganization) {
       throw new Error("Exactly one of ownerUser and ownerOrganization must be defined.");
     }
@@ -5448,8 +5438,9 @@ class UserFormService extends BaseApiService {
       created_by: currentUser.id,
       ...ownerAttrs
     };
+    const { payloadWithoutImage, images } = await separateImageFromFields(offlineRevisionPayload);
     const retRevision = {
-      ...offlineRevisionPayload,
+      ...payloadWithoutImage,
       created_by: currentUser.id,
       form: retForm.offline_id,
       revision: 0
@@ -5464,24 +5455,26 @@ class UserFormService extends BaseApiService {
       queryParams: activeWorkspaceId ? {
         workspace_id: activeWorkspaceId
       } : void 0,
-      payload: { ...offlineFormPayload, initial_revision: offlineRevisionPayload },
+      payload: { ...offlineFormPayload, initial_revision: payloadWithoutImage },
       blockers: [],
-      blocks: [offlineFormPayload.offline_id, offlineRevisionPayload.offline_id]
+      blocks: [offlineFormPayload.offline_id, payloadWithoutImage.offline_id]
     });
+    const attachImagesPromises = this.getAttachImagePromises(images, offlineRevisionPayload.offline_id);
     void formPromise.catch((e) => {
       store.dispatch(deleteUserForm(retForm.offline_id));
       store.dispatch(deleteUserFormRevision(retRevision.offline_id));
       throw e;
     });
-    return [retForm, retRevision, formPromise];
+    const settledPromise = Promise.all([formPromise, ...attachImagesPromises]).then(() => formPromise);
+    return [retForm, retRevision, formPromise, settledPromise];
   }
-  addForOrganization(initialRevision) {
+  async addForOrganization(initialRevision) {
     const state = this.client.store.getState();
     const activeOrganizationId = state.organizationReducer.activeOrganizationId;
     if (!activeOrganizationId) {
       throw new Error("Cannot add forms for organization when there is no active organization.");
     }
-    return this.add(
+    return await this.add(
       state,
       initialRevision,
       `/forms/in-organization/${activeOrganizationId}/`,
@@ -5489,12 +5482,12 @@ class UserFormService extends BaseApiService {
       activeOrganizationId
     );
   }
-  addForCurrentUser(initialRevision) {
+  async addForCurrentUser(initialRevision) {
     const state = this.client.store.getState();
     const currentUser = state.userReducer.currentUser;
-    return this.add(state, initialRevision, "/forms/my-forms/", currentUser.id);
+    return await this.add(state, initialRevision, "/forms/my-forms/", currentUser.id);
   }
-  createRevision(formId2, revision) {
+  async createRevision(formId2, revision) {
     const offlineRevision = offline(revision);
     const { store } = this.client;
     const state = store.getState();
@@ -5503,8 +5496,9 @@ class UserFormService extends BaseApiService {
       throw new Error("Cannot create form revision when there is no active project.");
     }
     const currentUserId = state.userReducer.currentUser.id;
+    const { payloadWithoutImage, images } = await separateImageFromFields(offlineRevision);
     const fullRevision = {
-      ...offlineRevision,
+      ...payloadWithoutImage,
       created_by: currentUserId,
       revision: "Pending",
       form: formId2
@@ -5514,19 +5508,21 @@ class UserFormService extends BaseApiService {
       description: "Create form revision",
       method: HttpMethod.PATCH,
       url: `/forms/${formId2}/`,
-      payload: { initial_revision: offlineRevision },
+      payload: { initial_revision: payloadWithoutImage },
       queryParams: {
         project_id: activeProjectId.toString()
       },
       blockers: [formId2],
       blocks: [offlineRevision.offline_id]
     });
+    const attachImagesPromises = this.getAttachImagePromises(images, offlineRevision.offline_id);
     void promise.then((result) => {
       store.dispatch(addUserFormRevision(result));
     }).catch(() => {
       store.dispatch(deleteUserFormRevision(fullRevision.offline_id));
     });
-    return [fullRevision, promise];
+    const settledPromise = Promise.all([promise, ...attachImagesPromises]).then(() => promise);
+    return [fullRevision, settledPromise];
   }
   async favorite(formId2) {
     const { store } = this.client;
@@ -5608,6 +5604,7 @@ class UserFormService extends BaseApiService {
     });
     store.dispatch(addUserForms(Object.values(result.forms)));
     store.dispatch(addUserFormRevisions(Object.values(result.revisions)));
+    store.dispatch(setUserFormRevisionAttachments(Object.values(result.attachments)));
   }
 }
 const isArrayOfFiles = (value) => {
@@ -5694,11 +5691,9 @@ class UserFormSubmissionService extends BaseApiService {
     store.dispatch(addUserFormSubmission(offlineResultWithoutFiles));
     void promise.then((result) => {
       store.dispatch(addUserFormSubmission(result));
-      store.dispatch(updateActiveProjectFormSubmissionsCount(1));
       return result;
     }).catch(() => {
       store.dispatch(deleteUserFormSubmission(payload.offline_id));
-      store.dispatch(updateActiveProjectFormSubmissionsCount(-1));
     });
     const settledPromise = Promise.all([promise, ...attachFilesPromises]).then(() => promise);
     return [fullOfflineResult, settledPromise];
@@ -5708,7 +5703,6 @@ class UserFormSubmissionService extends BaseApiService {
     const state = store.getState();
     const submission = state.userFormReducer.submissions[submissionId];
     store.dispatch(deleteUserFormSubmission(submissionId));
-    store.dispatch(updateActiveProjectFormSubmissionsCount(-1));
     try {
       return await this.enqueueRequest({
         description: "Delete user form submissions",
@@ -5720,7 +5714,6 @@ class UserFormSubmissionService extends BaseApiService {
     } catch (e) {
       if (submission) {
         store.dispatch(addUserFormSubmission(submission));
-        store.dispatch(updateActiveProjectFormSubmissionsCount(1));
       }
       throw e;
     }
@@ -6133,12 +6126,10 @@ class OrganizationService extends BaseApiService {
     const organizationAccesses = data.organization_accesses;
     const emailDomains = data.email_domains;
     const users = data.users;
-    const licenses = data.licenses;
     store.dispatch(addUsers(users));
     store.dispatch(setActiveOrganizationId(activeOrganization.id));
     store.dispatch(setOrganizationAccesses(organizationAccesses));
     store.dispatch(setEmailDomains(emailDomains));
-    store.dispatch(addLicenses(licenses));
     if (showLoading) {
       store.dispatch(setIsFetchingInitialData(false));
     }
@@ -6179,109 +6170,6 @@ class OrganizationService extends BaseApiService {
     });
   }
 }
-class LicenseService extends BaseApiService {
-  async getLicensesForOrganization(organizationId, showLoading = false) {
-    if (showLoading) {
-      this.client.store.dispatch(setIsFetchingInitialData(true));
-    }
-    return this.enqueueRequest({
-      description: "Get licenses",
-      method: HttpMethod.GET,
-      url: `/organizations/${organizationId}/licenses/`,
-      isAuthNeeded: true,
-      blockers: [organizationId.toString()],
-      blocks: []
-    }).then((result) => {
-      if (showLoading) {
-        this.client.store.dispatch(setIsFetchingInitialData(false));
-      }
-      return result;
-    });
-  }
-  async pauseLicense(license) {
-    this.client.store.dispatch(setIsFetchingInitialData(true));
-    return this.enqueueRequest({
-      description: "Pause license",
-      method: HttpMethod.DELETE,
-      url: `/billing/${license.offline_id}/suspend/`,
-      isAuthNeeded: true,
-      blockers: [
-        license.organization_owner ? license.organization_owner.toString() : license.user_owner ? license.user_owner.toString() : ""
-      ],
-      blocks: []
-    }).then((result) => {
-      this.client.store.dispatch(updateLicense(result));
-      this.client.store.dispatch(setIsFetchingInitialData(false));
-      return result;
-    });
-  }
-  async resumeLicense(license) {
-    this.client.store.dispatch(setIsFetchingInitialData(true));
-    return this.enqueueRequest({
-      description: "Resume license",
-      method: HttpMethod.PATCH,
-      url: `/billing/${license.offline_id}/suspend/`,
-      isAuthNeeded: true,
-      blockers: [
-        license.organization_owner ? license.organization_owner.toString() : license.user_owner ? license.user_owner.toString() : ""
-      ],
-      blocks: []
-    }).then((result) => {
-      this.client.store.dispatch(updateLicense(result));
-      this.client.store.dispatch(setIsFetchingInitialData(false));
-      return result;
-    });
-  }
-  async cancelLicense(license) {
-    this.client.store.dispatch(setIsFetchingInitialData(true));
-    return this.enqueueRequest({
-      description: "Cancel license",
-      method: HttpMethod.DELETE,
-      url: `/billing/${license.offline_id}/`,
-      isAuthNeeded: true,
-      blockers: [
-        license.organization_owner ? license.organization_owner.toString() : license.user_owner ? license.user_owner.toString() : ""
-      ],
-      blocks: []
-    }).then((result) => {
-      this.client.store.dispatch(updateLicense(result));
-      this.client.store.dispatch(setIsFetchingInitialData(false));
-      return result;
-    });
-  }
-  async attachLicenseToProject(license, project) {
-    return this.enqueueRequest({
-      description: "Attach license",
-      method: HttpMethod.PATCH,
-      url: `/billing/${license.offline_id}/project/`,
-      isAuthNeeded: true,
-      payload: { project: project.id },
-      blockers: [
-        license.organization_owner ? license.organization_owner.toString() : license.user_owner ? license.user_owner.toString() : "",
-        project.id ? project.id.toString() : ""
-      ],
-      blocks: []
-    }).then((result) => {
-      this.client.store.dispatch(updateLicense(result));
-      return result;
-    });
-  }
-  async detachLicenseFromProject(license) {
-    return this.enqueueRequest({
-      description: "Detach license",
-      method: HttpMethod.DELETE,
-      url: `/billing/${license.offline_id}/project/`,
-      isAuthNeeded: true,
-      blockers: [
-        license.organization_owner ? license.organization_owner.toString() : license.user_owner ? license.user_owner.toString() : ""
-      ],
-      blocks: []
-    }).then((result) => {
-      this.client.store.dispatch(updateLicense(result));
-      return result;
-    });
-  }
-}
 class OvermapSDK {
   constructor(apiUrl, store) {
     __publicField(this, "API_URL");
@@ -6307,7 +6195,6 @@ class OvermapSDK {
     __publicField(this, "projectFiles", new ProjectFileService(this));
     __publicField(this, "emailVerification", new EmailVerificationService(this));
     __publicField(this, "emailDomains", new EmailDomainsService(this));
-    __publicField(this, "licenses", new LicenseService(this));
     this.API_URL = apiUrl;
     this.store = store;
   }
@@ -6336,16 +6223,26 @@ const OvermapProvider = (props) => {
   }
   return /* @__PURE__ */ jsx(OvermapContext.Provider, { value: null, children: ret });
 };
-const description$1 = "_description_o5vqt_1";
-const floatingButtonContainer$1 = "_floatingButtonContainer_o5vqt_5";
-const tabsList = "_tabsList_o5vqt_12";
-const tabTrigger = "_tabTrigger_o5vqt_20";
-const patchfieldBorder = "_patchfieldBorder_o5vqt_24";
-const title = "_title_o5vqt_24";
-const error = "_error_o5vqt_40";
+const description$2 = "_description_1rtl0_1";
+const floatingButtonContainer$2 = "_floatingButtonContainer_1rtl0_5";
+const FullScreenImageContainer$2 = "_FullScreenImageContainer_1rtl0_12";
+const fileName$2 = "_fileName_1rtl0_22";
+const longIconButton$2 = "_longIconButton_1rtl0_27";
+const previewImage$3 = "_previewImage_1rtl0_33";
+const FullScreenImage$2 = "_FullScreenImage_1rtl0_12";
+const tabsList = "_tabsList_1rtl0_51";
+const tabTrigger = "_tabTrigger_1rtl0_59";
+const patchfieldBorder = "_patchfieldBorder_1rtl0_63";
+const title = "_title_1rtl0_63";
+const error = "_error_1rtl0_79";
 const styles$7 = {
-  description: description$1,
-  floatingButtonContainer: floatingButtonContainer$1,
+  description: description$2,
+  floatingButtonContainer: floatingButtonContainer$2,
+  FullScreenImageContainer: FullScreenImageContainer$2,
+  fileName: fileName$2,
+  longIconButton: longIconButton$2,
+  previewImage: previewImage$3,
+  FullScreenImage: FullScreenImage$2,
   tabsList,
   tabTrigger,
   patchfieldBorder,
@@ -6386,12 +6283,13 @@ const emptyBaseField = {
 };
 class BaseField extends BaseFormElement {
   constructor(options) {
-    const { label, required, fieldValidators = [], formValidators = [], ...base } = options;
+    const { label, required, image, fieldValidators = [], formValidators = [], ...base } = options;
     super(base);
     __publicField(this, "required");
     __publicField(this, "formValidators");
     __publicField(this, "fieldValidators");
     __publicField(this, "label");
+    __publicField(this, "image");
     /**
      * By default, validation doesn't execute on `onChange` events when editing fields
      * until the field has been `touched`. This can be overridden by setting this to `false`
@@ -6401,6 +6299,7 @@ class BaseField extends BaseFormElement {
     __publicField(this, "onlyValidateAfterTouched", true);
     this.label = label;
     this.required = required;
+    this.image = image;
     this.fieldValidators = fieldValidators;
     this.formValidators = formValidators;
   }
@@ -6435,7 +6334,8 @@ class BaseField extends BaseFormElement {
     return {
       ...super._serialize(),
       label: this.label,
-      required: this.required
+      required: this.required,
+      image: this.image
     };
   }
   getFieldValidators() {
@@ -6447,108 +6347,22 @@ class BaseField extends BaseFormElement {
 }
 __publicField(BaseField, "fieldTypeName");
 __publicField(BaseField, "fieldTypeDescription");
-const description = "_description_1p32e_1";
-const floatingButtonContainer = "_floatingButtonContainer_1p32e_5";
+const description$1 = "_description_1nfty_1";
+const floatingButtonContainer$1 = "_floatingButtonContainer_1nfty_5";
+const FullScreenImageContainer$1 = "_FullScreenImageContainer_1nfty_12";
+const fileName$1 = "_fileName_1nfty_22";
+const longIconButton$1 = "_longIconButton_1nfty_27";
+const previewImage$2 = "_previewImage_1nfty_33";
+const FullScreenImage$1 = "_FullScreenImage_1nfty_12";
 const styles$6 = {
-  description,
-  floatingButtonContainer
-};
-const InputWithLabel = (props) => {
-  const { label, children, size, severity, inputId, labelId, flexProps } = props;
-  return /* @__PURE__ */ jsx(Flex, { direction: "column", gap: "1", asChild: true, ...flexProps, children: /* @__PURE__ */ jsxs("label", { htmlFor: inputId, children: [
-    /* @__PURE__ */ jsx(Text, { size, severity, id: labelId, children: label }),
-    children
-  ] }) });
-};
-const InputWithHelpText = (props) => {
-  const { helpText, children, severity } = props;
-  return /* @__PURE__ */ jsxs(Flex, { direction: "column", gap: "1", children: [
-    children,
-    /* @__PURE__ */ jsx(Flex, { direction: "column", children: /* @__PURE__ */ jsx(Text, { size: "1", severity, className: styles$6.description, children: helpText }) })
-  ] });
-};
-const InputWithLabelAndHelpText = (props) => {
-  const { children, ...restProps } = props;
-  return /* @__PURE__ */ jsx(InputWithHelpText, { ...restProps, children });
-};
-const useFormikInput = (props) => {
-  const { id, field, formId: formId2, size, showInputOnly, ...rest } = props;
-  const [fieldProps, meta, helpers] = useField(field.getId());
-  const { touched } = meta;
-  const helpText = meta.error ?? field.description;
-  const severity = meta.error ? "danger" : void 0;
-  const inputId = id ?? `${formId2}-${field.getId()}-input`;
-  const labelId = `${inputId}-label`;
-  const label = field.required ? `${field.label} *` : field.label;
-  const fieldPropsWithValidation = useMemo(() => {
-    const handleChange = (e) => {
-      const value = field.getValueFromChangeEvent(e);
-      void helpers.setValue(value, false).then();
-      if (touched || !field.onlyValidateAfterTouched) {
-        helpers.setError(field.getError(value));
-      }
-    };
-    const handleBlur = (e) => {
-      void helpers.setTouched(true, false).then();
-      helpers.setError(field.getError(field.getValueFromChangeEvent(e)));
-    };
-    return {
-      ...fieldProps,
-      onChange: handleChange,
-      onBlur: handleBlur
-    };
-  }, [field, fieldProps, helpers, touched]);
-  return [
-    {
-      helpText,
-      size,
-      severity,
-      inputId,
-      labelId,
-      label,
-      showInputOnly,
-      fieldProps: fieldPropsWithValidation,
-      helpers,
-      field
-    },
-    { ...rest, "aria-labelledby": labelId }
-  ];
+  description: description$1,
+  floatingButtonContainer: floatingButtonContainer$1,
+  FullScreenImageContainer: FullScreenImageContainer$1,
+  fileName: fileName$1,
+  longIconButton: longIconButton$1,
+  previewImage: previewImage$2,
+  FullScreenImage: FullScreenImage$1
 };
-const truthyValues = [true, "true"];
-const BooleanInput = memo((props) => {
-  const [{ inputId, labelId, size, severity, showInputOnly, fieldProps }, rest] = useFormikInput(props);
-  let [{ helpText, label }] = useFormikInput(props);
-  helpText = showInputOnly ? null : helpText;
-  label = showInputOnly ? "" : label;
-  const color = useSeverityColor(severity);
-  const value = truthyValues.includes(fieldProps.value);
-  return /* @__PURE__ */ jsx(InputWithLabelAndHelpText, { helpText, severity, children: /* @__PURE__ */ jsx(
-    InputWithLabel,
-    {
-      size,
-      severity,
-      inputId,
-      labelId,
-      label,
-      flexProps: { direction: "row-reverse", justify: "end", align: "center", gap: "2" },
-      children: /* @__PURE__ */ jsx(
-        Checkbox,
-        {
-          ...rest,
-          ...fieldProps,
-          id: inputId,
-          color,
-          value: value.toString(),
-          checked: value,
-          onCheckedChange: fieldProps.onChange,
-          onChange: void 0,
-          onBlur: void 0
-        }
-      )
-    }
-  ) });
-});
-BooleanInput.displayName = "BooleanInput";
 function _objectWithoutPropertiesLoose(source, excluded) {
   if (source == null)
     return {};
@@ -6813,6 +6627,24 @@ var GearIcon = /* @__PURE__ */ forwardRef(function(_ref, forwardedRef) {
     clipRule: "evenodd"
   }));
 });
+var _excluded$2C = ["color"];
+var ImageIcon = /* @__PURE__ */ forwardRef(function(_ref, forwardedRef) {
+  var _ref$color = _ref.color, color = _ref$color === void 0 ? "currentColor" : _ref$color, props = _objectWithoutPropertiesLoose(_ref, _excluded$2C);
+  return createElement("svg", Object.assign({
+    width: "15",
+    height: "15",
+    viewBox: "0 0 15 15",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, props, {
+    ref: forwardedRef
+  }), createElement("path", {
+    d: "M2.5 1H12.5C13.3284 1 14 1.67157 14 2.5V12.5C14 13.3284 13.3284 14 12.5 14H2.5C1.67157 14 1 13.3284 1 12.5V2.5C1 1.67157 1.67157 1 2.5 1ZM2.5 2C2.22386 2 2 2.22386 2 2.5V8.3636L3.6818 6.6818C3.76809 6.59551 3.88572 6.54797 4.00774 6.55007C4.12975 6.55216 4.24568 6.60372 4.32895 6.69293L7.87355 10.4901L10.6818 7.6818C10.8575 7.50607 11.1425 7.50607 11.3182 7.6818L13 9.3636V2.5C13 2.22386 12.7761 2 12.5 2H2.5ZM2 12.5V9.6364L3.98887 7.64753L7.5311 11.4421L8.94113 13H2.5C2.22386 13 2 12.7761 2 12.5ZM12.5 13H10.155L8.48336 11.153L11 8.6364L13 10.6364V12.5C13 12.7761 12.7761 13 12.5 13ZM6.64922 5.5C6.64922 5.03013 7.03013 4.64922 7.5 4.64922C7.96987 4.64922 8.35078 5.03013 8.35078 5.5C8.35078 5.96987 7.96987 6.35078 7.5 6.35078C7.03013 6.35078 6.64922 5.96987 6.64922 5.5ZM7.5 3.74922C6.53307 3.74922 5.74922 4.53307 5.74922 5.5C5.74922 6.46693 6.53307 7.25078 7.5 7.25078C8.46693 7.25078 9.25078 6.46693 9.25078 5.5C9.25078 4.53307 8.46693 3.74922 7.5 3.74922Z",
+    fill: color,
+    fillRule: "evenodd",
+    clipRule: "evenodd"
+  }));
+});
 var _excluded$2E = ["color"];
 var InputIcon = /* @__PURE__ */ forwardRef(function(_ref, forwardedRef) {
   var _ref$color = _ref.color, color = _ref$color === void 0 ? "currentColor" : _ref$color, props = _objectWithoutPropertiesLoose(_ref, _excluded$2E);
@@ -7009,6 +6841,196 @@ var UploadIcon = /* @__PURE__ */ forwardRef(function(_ref, forwardedRef) {
     clipRule: "evenodd"
   }));
 });
+const FullScreenImagePreview = memo((props) => {
+  const { file, url, name, setShowPreview } = props;
+  const handleDownload = useCallback(
+    (event) => {
+      event.stopPropagation();
+      const blob = new Blob([file]);
+      saveAs(blob, name);
+    },
+    [name, file]
+  );
+  return /* @__PURE__ */ jsxs(
+    "button",
+    {
+      className: styles$6.FullScreenImageContainer,
+      onClick: () => {
+        setShowPreview(false);
+      },
+      children: [
+        /* @__PURE__ */ jsxs(Flex, { align: "center", children: [
+          /* @__PURE__ */ jsx(
+            IconButton,
+            {
+              className: styles$6.longIconButton,
+              variant: "soft",
+              "aria-label": "Exit preview",
+              onClick: () => {
+                setShowPreview(false);
+              },
+              children: /* @__PURE__ */ jsx(ArrowLeftIcon, {})
+            }
+          ),
+          /* @__PURE__ */ jsx(Text, { className: styles$6.fileName, children: name }),
+          /* @__PURE__ */ jsx(
+            IconButton,
+            {
+              className: styles$6.longIconButton,
+              variant: "soft",
+              "aria-label": `Download ${name}`,
+              onClick: handleDownload,
+              children: /* @__PURE__ */ jsx(DownloadIcon, {})
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsx(
+          "img",
+          {
+            className: styles$6.FullScreenImage,
+            src: url,
+            alt: name,
+            onClick: (e) => {
+              e.stopPropagation();
+            }
+          }
+        )
+      ]
+    }
+  );
+});
+FullScreenImagePreview.displayName = "FullScreenImagePreview";
+const InputWithLabel = (props) => {
+  const { label, children, size, severity, inputId, labelId, image, flexProps } = props;
+  const [resolvedImage, setResolvedImage] = useState(void 0);
+  const [showImagePreview, setShowImagePreview] = useState(false);
+  useEffect(() => {
+    if (image instanceof Promise) {
+      image.then(setResolvedImage).catch(console.error);
+    } else {
+      setResolvedImage(image);
+    }
+  }, [image]);
+  const resolvedImageURL = resolvedImage ? URL.createObjectURL(resolvedImage) : void 0;
+  return /* @__PURE__ */ jsxs(Flex, { direction: "column", gap: "2", children: [
+    resolvedImage && /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(
+        "img",
+        {
+          className: styles$6.previewImage,
+          src: resolvedImageURL,
+          alt: resolvedImage.name,
+          onClick: () => {
+            setShowImagePreview(true);
+          }
+        }
+      ),
+      showImagePreview && /* @__PURE__ */ jsx(
+        FullScreenImagePreview,
+        {
+          file: resolvedImage,
+          url: resolvedImageURL,
+          name: resolvedImage.name,
+          setShowPreview: setShowImagePreview
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx(Flex, { direction: "column", gap: "1", asChild: true, ...flexProps, children: /* @__PURE__ */ jsxs("label", { htmlFor: inputId, children: [
+      /* @__PURE__ */ jsx(Text, { size, severity, id: labelId, children: label }),
+      children
+    ] }) })
+  ] });
+};
+const InputWithHelpText = (props) => {
+  const { helpText, children, severity } = props;
+  return /* @__PURE__ */ jsxs(Flex, { direction: "column", gap: "1", children: [
+    children,
+    /* @__PURE__ */ jsx(Flex, { direction: "column", children: /* @__PURE__ */ jsx(Text, { size: "1", severity, className: styles$6.description, children: helpText }) })
+  ] });
+};
+const InputWithLabelAndHelpText = (props) => {
+  const { children, ...restProps } = props;
+  return /* @__PURE__ */ jsx(InputWithHelpText, { ...restProps, children });
+};
+const useFormikInput = (props) => {
+  const { id, field, formId: formId2, size, showInputOnly, ...rest } = props;
+  const [fieldProps, meta, helpers] = useField(field.getId());
+  const { touched } = meta;
+  const helpText = meta.error ?? field.description;
+  const severity = meta.error ? "danger" : void 0;
+  const inputId = id ?? `${formId2}-${field.getId()}-input`;
+  const labelId = `${inputId}-label`;
+  const label = field.required ? `${field.label} *` : field.label;
+  const fieldPropsWithValidation = useMemo(() => {
+    const handleChange = (e) => {
+      const value = field.getValueFromChangeEvent(e);
+      void helpers.setValue(value, false).then();
+      if (touched || !field.onlyValidateAfterTouched) {
+        helpers.setError(field.getError(value));
+      }
+    };
+    const handleBlur = (e) => {
+      void helpers.setTouched(true, false).then();
+      helpers.setError(field.getError(field.getValueFromChangeEvent(e)));
+    };
+    return {
+      ...fieldProps,
+      onChange: handleChange,
+      onBlur: handleBlur
+    };
+  }, [field, fieldProps, helpers, touched]);
+  return [
+    {
+      helpText,
+      size,
+      severity,
+      inputId,
+      labelId,
+      label,
+      showInputOnly,
+      fieldProps: fieldPropsWithValidation,
+      helpers,
+      field
+    },
+    { ...rest, "aria-labelledby": labelId }
+  ];
+};
+const truthyValues = [true, "true"];
+const BooleanInput = memo((props) => {
+  const [{ inputId, labelId, size, severity, showInputOnly, field, fieldProps }, rest] = useFormikInput(props);
+  let [{ helpText, label }] = useFormikInput(props);
+  helpText = showInputOnly ? null : helpText;
+  label = showInputOnly ? "" : label;
+  const color = useSeverityColor(severity);
+  const value = truthyValues.includes(fieldProps.value);
+  return /* @__PURE__ */ jsx(InputWithLabelAndHelpText, { helpText, severity, children: /* @__PURE__ */ jsx(
+    InputWithLabel,
+    {
+      size,
+      severity,
+      inputId,
+      labelId,
+      label,
+      image: showInputOnly ? void 0 : field.image,
+      flexProps: { direction: "row-reverse", justify: "end", align: "center", gap: "2" },
+      children: /* @__PURE__ */ jsx(
+        Checkbox,
+        {
+          ...rest,
+          ...fieldProps,
+          id: inputId,
+          color,
+          value: value.toString(),
+          checked: value,
+          onCheckedChange: fieldProps.onChange,
+          onChange: void 0,
+          onBlur: void 0
+        }
+      )
+    }
+  ) });
+});
+BooleanInput.displayName = "BooleanInput";
 const emptyBooleanField = {
   ...emptyBaseField,
   type: "boolean"
@@ -7258,7 +7280,7 @@ const $5e63c961fc1ce211$var$SlotClone = /* @__PURE__ */ forwardRef((props, forwa
 });
 $5e63c961fc1ce211$var$SlotClone.displayName = "SlotClone";
 const $5e63c961fc1ce211$export$d9f1ccf0bdb05d45 = ({ children }) => {
-  return /* @__PURE__ */ createElement(Fragment, null, children);
+  return /* @__PURE__ */ createElement(Fragment$1, null, children);
 };
 function $5e63c961fc1ce211$var$isSlottable(child) {
   return /* @__PURE__ */ isValidElement(child) && child.type === $5e63c961fc1ce211$export$d9f1ccf0bdb05d45;
@@ -8437,25 +8459,36 @@ const Tabs = Object.assign({}, {
   Content: TabsContent
 });
 const NumberInput = memo((props) => {
-  const [{ inputId, labelId, size, severity, showInputOnly, fieldProps, field }, rest] = useFormikInput(props);
+  const [{ inputId, labelId, size, severity, showInputOnly, field, fieldProps }, rest] = useFormikInput(props);
   let [{ helpText, label }] = useFormikInput(props);
   helpText = showInputOnly ? null : helpText;
   label = showInputOnly ? "" : label;
   const color = useSeverityColor(severity);
-  return /* @__PURE__ */ jsx(InputWithLabelAndHelpText, { helpText, severity, children: /* @__PURE__ */ jsx(InputWithLabel, { size, severity, inputId, labelId, label, children: /* @__PURE__ */ jsx(
-    TextField$1.Input,
+  return /* @__PURE__ */ jsx(InputWithLabelAndHelpText, { helpText, severity, children: /* @__PURE__ */ jsx(
+    InputWithLabel,
     {
-      ...rest,
-      ...fieldProps,
-      type: "number",
-      id: inputId,
-      placeholder: "Enter a number",
-      min: field.minimum,
-      max: field.maximum,
-      step: field.integers ? 1 : 0.1,
-      color
+      size,
+      severity,
+      inputId,
+      labelId,
+      label,
+      image: showInputOnly ? void 0 : field.image,
+      children: /* @__PURE__ */ jsx(
+        TextField$1.Input,
+        {
+          ...rest,
+          ...fieldProps,
+          type: "number",
+          id: inputId,
+          placeholder: "Enter a number",
+          min: field.minimum,
+          max: field.maximum,
+          step: field.integers ? 1 : 0.1,
+          color
+        }
+      )
     }
-  ) }) });
+  ) });
 });
 NumberInput.displayName = "NumberInput";
 const emptyNumberField = {
@@ -8589,13 +8622,24 @@ __publicField(_NumberField, "_validateMax", (path) => (value, allValues) => {
 });
 let NumberField = _NumberField;
 const DateInput = memo((props) => {
-  const [{ inputId, labelId, size, severity, showInputOnly, fieldProps }, rest] = useFormikInput(props);
+  const [{ inputId, labelId, size, severity, showInputOnly, field, fieldProps }, rest] = useFormikInput(props);
   let [{ helpText, label }] = useFormikInput(props);
   helpText = showInputOnly ? null : helpText;
   label = showInputOnly ? "" : label;
   const color = useSeverityColor(severity);
   const value = fieldProps.value ? fieldProps.value.split("T")[0] : "";
-  return /* @__PURE__ */ jsx(InputWithLabelAndHelpText, { helpText, severity, children: /* @__PURE__ */ jsx(InputWithLabel, { size, severity, inputId, labelId, label, children: /* @__PURE__ */ jsx(TextField$1.Input, { ...rest, ...fieldProps, type: "date", id: inputId, color, value }) }) });
+  return /* @__PURE__ */ jsx(InputWithLabelAndHelpText, { helpText, severity, children: /* @__PURE__ */ jsx(
+    InputWithLabel,
+    {
+      size,
+      severity,
+      inputId,
+      labelId,
+      label,
+      image: showInputOnly ? void 0 : field.image,
+      children: /* @__PURE__ */ jsx(TextField$1.Input, { ...rest, ...fieldProps, type: "date", id: inputId, color, value })
+    }
+  ) });
 });
 DateInput.displayName = "DateInput";
 const emptyDateField = {
@@ -8739,43 +8783,54 @@ const styles$5 = {
   TextFieldInputCopy
 };
 const StringInput = memo((props) => {
-  const [{ inputId, labelId, size, severity, showInputOnly, fieldProps, field }, rest] = useFormikInput(props);
+  const [{ inputId, labelId, size, severity, showInputOnly, field, fieldProps }, rest] = useFormikInput(props);
   let [{ helpText, label }] = useFormikInput(props);
   helpText = showInputOnly ? null : helpText;
   label = showInputOnly ? "" : label;
   const color = useSeverityColor(severity);
-  return /* @__PURE__ */ jsx(InputWithLabelAndHelpText, { helpText, severity, children: /* @__PURE__ */ jsx(InputWithLabel, { size, severity, inputId, labelId, label, children: !rest.disabled || !fieldProps.value ? /* @__PURE__ */ jsx(
-    TextField$1.Input,
+  return /* @__PURE__ */ jsx(InputWithLabelAndHelpText, { helpText, severity, children: /* @__PURE__ */ jsx(
+    InputWithLabel,
     {
-      ...rest,
-      ...fieldProps,
-      type: field.inputType,
-      id: inputId,
-      placeholder: "Enter a short description",
-      color
-    }
-  ) : /* @__PURE__ */ jsxs(TextField$1.Root, { className: styles$5.clickableLinkContainer, children: [
-    /* @__PURE__ */ jsx(
-      "div",
-      {
-        className: classNames$1(
-          "rt-TextFieldInput rt-r-size-2 rt-variant-surface",
-          styles$5.TextFieldInputCopy
-        ),
-        children: /* @__PURE__ */ jsx(
-          Linkify,
+      size,
+      severity,
+      inputId,
+      labelId,
+      label,
+      image: showInputOnly ? void 0 : field.image,
+      children: !rest.disabled || !fieldProps.value ? /* @__PURE__ */ jsx(
+        TextField$1.Input,
+        {
+          ...rest,
+          ...fieldProps,
+          type: field.inputType,
+          id: inputId,
+          placeholder: "Enter a short description",
+          color
+        }
+      ) : /* @__PURE__ */ jsxs(TextField$1.Root, { className: styles$5.clickableLinkContainer, children: [
+        /* @__PURE__ */ jsx(
+          "div",
           {
-            options: {
-              target: "_blank",
-              rel: "noopener"
-            },
-            children: fieldProps.value
+            className: classNames$1(
+              "rt-TextFieldInput rt-r-size-2 rt-variant-surface",
+              styles$5.TextFieldInputCopy
+            ),
+            children: /* @__PURE__ */ jsx(
+              Linkify,
+              {
+                options: {
+                  target: "_blank",
+                  rel: "noopener"
+                },
+                children: fieldProps.value
+              }
+            )
           }
-        )
-      }
-    ),
-    /* @__PURE__ */ jsx("div", { className: "rt-TextFieldChrome" })
-  ] }) }) });
+        ),
+        /* @__PURE__ */ jsx("div", { className: "rt-TextFieldChrome" })
+      ] })
+    }
+  ) });
 });
 StringInput.displayName = "StringInput";
 const emptyStringField = {
@@ -8811,21 +8866,32 @@ __publicField(_StringField, "fieldTypeDescription", "Short text fields can hold
 __publicField(_StringField, "Icon", InputIcon);
 let StringField = _StringField;
 const TextInput = memo((props) => {
-  const [{ inputId, labelId, size, severity, showInputOnly, fieldProps }, rest] = useFormikInput(props);
+  const [{ inputId, labelId, size, severity, showInputOnly, field, fieldProps }, rest] = useFormikInput(props);
   let [{ helpText, label }] = useFormikInput(props);
   helpText = showInputOnly ? null : helpText;
   label = showInputOnly ? "" : label;
-  return /* @__PURE__ */ jsx(InputWithLabelAndHelpText, { helpText, severity, children: /* @__PURE__ */ jsx(InputWithLabel, { size, severity, inputId, labelId, label, children: /* @__PURE__ */ jsx(
-    TextArea,
+  return /* @__PURE__ */ jsx(InputWithLabelAndHelpText, { helpText, severity, children: /* @__PURE__ */ jsx(
+    InputWithLabel,
     {
-      ...rest,
-      ...fieldProps,
-      resize: "vertical",
-      id: inputId,
-      placeholder: "Enter a description",
-      severity
+      size,
+      severity,
+      inputId,
+      labelId,
+      label,
+      image: showInputOnly ? void 0 : field.image,
+      children: /* @__PURE__ */ jsx(
+        TextArea,
+        {
+          ...rest,
+          ...fieldProps,
+          resize: "vertical",
+          id: inputId,
+          placeholder: "Enter a description",
+          severity
+        }
+      )
     }
-  ) }) });
+  ) });
 });
 TextInput.displayName = "TextInput";
 const emptyTextField = {
@@ -8857,7 +8923,7 @@ __publicField(_TextField, "fieldTypeDescription", "Paragraph fields can hold up
 __publicField(_TextField, "Icon", RowsIcon);
 let TextField = _TextField;
 const SelectInput = memo((props) => {
-  const [{ inputId, labelId, size, severity, showInputOnly, fieldProps, field }, rest] = useFormikInput(props);
+  const [{ inputId, labelId, size, severity, showInputOnly, field, fieldProps }, rest] = useFormikInput(props);
   const { onChange, onBlur } = fieldProps;
   let [{ helpText, label }] = useFormikInput(props);
   helpText = showInputOnly ? null : helpText;
@@ -8873,18 +8939,29 @@ const SelectInput = memo((props) => {
     },
     [onChange, onBlur]
   );
-  return /* @__PURE__ */ jsx(InputWithLabelAndHelpText, { helpText, severity, children: /* @__PURE__ */ jsx(InputWithLabel, { size, severity, inputId, labelId, label, children: /* @__PURE__ */ jsx(
-    Select,
+  return /* @__PURE__ */ jsx(InputWithLabelAndHelpText, { helpText, severity, children: /* @__PURE__ */ jsx(
+    InputWithLabel,
     {
-      items: options,
-      ...fieldProps,
-      onValueChange: handleChange,
-      placeholder: "Select one...",
-      id: inputId,
+      size,
       severity,
-      ...rest
+      inputId,
+      labelId,
+      label,
+      image: showInputOnly ? void 0 : field.image,
+      children: /* @__PURE__ */ jsx(
+        Select,
+        {
+          items: options,
+          ...fieldProps,
+          onValueChange: handleChange,
+          placeholder: "Select one...",
+          id: inputId,
+          severity,
+          ...rest
+        }
+      )
     }
-  ) }) });
+  ) });
 });
 SelectInput.displayName = "SelectInput";
 const emptySection = (id = "", fields = []) => ({
@@ -9052,7 +9129,7 @@ const useFieldReordering = () => {
   return { reorderSection, reorderField };
 };
 const MultiStringInput = memo((props) => {
-  const [{ inputId, labelId, size, severity, showInputOnly, fieldProps }, rest] = useFormikInput(props);
+  const [{ inputId, labelId, size, severity, showInputOnly, field, fieldProps }, rest] = useFormikInput(props);
   let [{ helpText, label }] = useFormikInput(props);
   helpText = showInputOnly ? null : helpText;
   label = showInputOnly ? "" : label;
@@ -9125,32 +9202,43 @@ const MultiStringInput = memo((props) => {
     [setValueAndTouched, value]
   );
   return /* @__PURE__ */ jsx(DragDropContext, { onDragEnd: handleDragEnd, children: /* @__PURE__ */ jsxs(Flex, { direction: "column", gap: "2", children: [
-    /* @__PURE__ */ jsx(InputWithLabelAndHelpText, { helpText: updatedHelpText, severity, children: /* @__PURE__ */ jsx(InputWithLabel, { size, severity, inputId, labelId, label, children: (!disabled || value.length === 0) && /* @__PURE__ */ jsxs(Flex, { gap: "2", children: [
-      /* @__PURE__ */ jsx(Box, { grow: "1", children: /* @__PURE__ */ jsx(
-        TextField$1.Input,
-        {
-          placeholder: "Press enter to add a new option",
-          ...rest,
-          ...fieldProps,
-          value: intermediateValue,
-          onChange: handleChange,
-          onKeyDown: handleKeyDown,
-          id: inputId,
-          color: updatedColor,
-          onBlur: void 0
-        }
-      ) }),
-      /* @__PURE__ */ jsx(
-        IconButton,
-        {
-          type: "button",
-          "aria-label": "Add option",
-          disabled: !!internalError || disabled,
-          onClick: addOption,
-          children: /* @__PURE__ */ jsx(PlusIcon, {})
-        }
-      )
-    ] }) }) }),
+    /* @__PURE__ */ jsx(InputWithLabelAndHelpText, { helpText: updatedHelpText, severity, children: /* @__PURE__ */ jsx(
+      InputWithLabel,
+      {
+        size,
+        severity,
+        inputId,
+        labelId,
+        label,
+        image: showInputOnly ? void 0 : field.image,
+        children: (!disabled || value.length === 0) && /* @__PURE__ */ jsxs(Flex, { gap: "2", children: [
+          /* @__PURE__ */ jsx(Box, { grow: "1", children: /* @__PURE__ */ jsx(
+            TextField$1.Input,
+            {
+              placeholder: "Press enter to add a new option",
+              ...rest,
+              ...fieldProps,
+              value: intermediateValue,
+              onChange: handleChange,
+              onKeyDown: handleKeyDown,
+              id: inputId,
+              color: updatedColor,
+              onBlur: void 0
+            }
+          ) }),
+          /* @__PURE__ */ jsx(
+            IconButton,
+            {
+              type: "button",
+              "aria-label": "Add option",
+              disabled: !!internalError || disabled,
+              onClick: addOption,
+              children: /* @__PURE__ */ jsx(PlusIcon, {})
+            }
+          )
+        ] })
+      }
+    ) }),
     /* @__PURE__ */ jsx(Droppable, { droppableId, children: (droppableProvided) => /* @__PURE__ */ jsxs(Flex, { ...droppableProvided.droppableProps, ref: droppableProvided.innerRef, direction: "column", children: [
       value.map((option, index2) => /* @__PURE__ */ jsx(
         Draggable,
@@ -9332,7 +9420,7 @@ const parseValueToArray = (value) => {
   return [value];
 };
 const MultiSelectInput = memo((props) => {
-  const [{ inputId, labelId, size, severity, showInputOnly, fieldProps, field }, rest] = useFormikInput(props);
+  const [{ inputId, labelId, size, severity, showInputOnly, field, fieldProps }, rest] = useFormikInput(props);
   const { onChange, onBlur } = fieldProps;
   let [{ helpText, label }] = useFormikInput(props);
   helpText = showInputOnly ? null : helpText;
@@ -9345,19 +9433,30 @@ const MultiSelectInput = memo((props) => {
     },
     [onChange, onBlur]
   );
-  return /* @__PURE__ */ jsx(InputWithLabelAndHelpText, { helpText, severity, children: /* @__PURE__ */ jsx(InputWithLabel, { size, severity, inputId, labelId, label, children: /* @__PURE__ */ jsx(
-    MultiSelect,
+  return /* @__PURE__ */ jsx(InputWithLabelAndHelpText, { helpText, severity, children: /* @__PURE__ */ jsx(
+    InputWithLabel,
     {
-      value,
-      onValueChange: handleChange,
-      options: field.options,
-      name: fieldProps.name,
-      placeholder: "Select one or more...",
-      id: inputId,
+      size,
       severity,
-      ...rest
+      inputId,
+      labelId,
+      label,
+      image: showInputOnly ? void 0 : field.image,
+      children: /* @__PURE__ */ jsx(
+        MultiSelect,
+        {
+          value,
+          onValueChange: handleChange,
+          options: field.options,
+          name: fieldProps.name,
+          placeholder: "Select one or more...",
+          id: inputId,
+          severity,
+          ...rest
+        }
+      )
     }
-  ) }) });
+  ) });
 });
 MultiSelectInput.displayName = "MultiSelectInput";
 const emptyMultiSelectField = {
@@ -9433,23 +9532,15 @@ class FieldInputClonerField extends CustomField {
     super(options, FieldInputCloner);
   }
 }
-const previewImage = "_previewImage_y4yd1_1";
-const nameContainer = "_nameContainer_y4yd1_9";
-const hasPreview = "_hasPreview_y4yd1_14";
-const useEllipsis = "_useEllipsis_y4yd1_19";
-const FullScreenImageContainer = "_FullScreenImageContainer_y4yd1_25";
-const fileName = "_fileName_y4yd1_35";
-const longIconButton = "_longIconButton_y4yd1_40";
-const FullScreenImage = "_FullScreenImage_y4yd1_25";
+const previewImage$1 = "_previewImage_ebhyt_1";
+const nameContainer = "_nameContainer_ebhyt_9";
+const hasPreview = "_hasPreview_ebhyt_14";
+const useEllipsis = "_useEllipsis_ebhyt_19";
 const styles$4 = {
-  previewImage,
+  previewImage: previewImage$1,
   nameContainer,
   hasPreview,
-  useEllipsis,
-  FullScreenImageContainer,
-  fileName,
-  longIconButton,
-  FullScreenImage
+  useEllipsis
 };
 const convertBytesToLargestUnit = (bytes) => {
   const units = ["byte", "kilobyte", "megabyte"];
@@ -9469,7 +9560,7 @@ const convertBytesToLargestUnit = (bytes) => {
 };
 const UploadInput = memo((props) => {
   var _a2;
-  const [{ inputId, labelId, size, severity, helpText, showInputOnly, fieldProps, field }, rest] = useFormikInput(props);
+  const [{ inputId, labelId, size, severity, helpText, showInputOnly, field, fieldProps }, rest] = useFormikInput(props);
   const { onChange } = fieldProps;
   let [{ label }] = useFormikInput(props);
   label = showInputOnly ? "" : label;
@@ -9503,28 +9594,39 @@ const UploadInput = memo((props) => {
   const singleButtonText = value ? "Select new file" : "Select a file";
   const buttonText = field.maxFiles > 1 ? multipleButtonText : singleButtonText;
   return /* @__PURE__ */ jsxs(Flex, { direction: "column", gap: "2", children: [
-    /* @__PURE__ */ jsx(InputWithLabelAndHelpText, { helpText: updatedHelpText, severity, children: /* @__PURE__ */ jsxs(InputWithLabel, { size, severity, inputId, labelId, label, children: [
-      /* @__PURE__ */ jsx(Flex, { direction: "row", gap: "2", children: /* @__PURE__ */ jsx(Box, { width: "max-content", asChild: true, children: /* @__PURE__ */ jsxs(Button, { ...rest, variant: "soft", onClick: handleClick, id: "upload-input-upload-button", children: [
-        /* @__PURE__ */ jsx(UploadIcon, {}),
-        " ",
-        buttonText
-      ] }) }) }),
-      /* @__PURE__ */ jsx(
-        "input",
-        {
-          ...rest,
-          type: "file",
-          ref: input,
-          id: inputId,
-          accept: (_a2 = field.extensions) == null ? void 0 : _a2.join(","),
-          multiple: field.maxFiles > 1,
-          color,
-          style: { display: "none" },
-          ...fieldProps,
-          value: ""
-        }
-      )
-    ] }) }),
+    /* @__PURE__ */ jsx(InputWithLabelAndHelpText, { helpText: updatedHelpText, severity, children: /* @__PURE__ */ jsxs(
+      InputWithLabel,
+      {
+        size,
+        severity,
+        inputId,
+        labelId,
+        label,
+        image: showInputOnly ? void 0 : field.image,
+        children: [
+          /* @__PURE__ */ jsx(Flex, { direction: "row", gap: "2", children: /* @__PURE__ */ jsx(Box, { width: "max-content", asChild: true, children: /* @__PURE__ */ jsxs(Button, { ...rest, variant: "soft", onClick: handleClick, id: "upload-input-upload-button", children: [
+            /* @__PURE__ */ jsx(UploadIcon, {}),
+            " ",
+            buttonText
+          ] }) }) }),
+          /* @__PURE__ */ jsx(
+            "input",
+            {
+              ...rest,
+              type: "file",
+              ref: input,
+              id: inputId,
+              accept: (_a2 = field.extensions) == null ? void 0 : _a2.join(","),
+              multiple: field.maxFiles > 1,
+              color,
+              style: { display: "none" },
+              ...fieldProps,
+              value: ""
+            }
+          )
+        ]
+      }
+    ) }),
     Array.isArray(value) && value.length > 0 && /* @__PURE__ */ jsx(Flex, { direction: "column", gap: "2", children: value.map((file, index2) => /* @__PURE__ */ jsx(
       DisplayFile,
       {
@@ -9575,7 +9677,7 @@ const DisplayFile = memo((props) => {
         throw new Error("Cannot download a file that is not resolved.");
       }
       const blob = new Blob([resolvedFile]);
-      saveAs(blob, name);
+      saveAs$1(blob, name);
     },
     [name, resolvedFile]
   );
@@ -9618,7 +9720,7 @@ const DisplayFile = memo((props) => {
         }
       )
     ] }),
-    url && /* @__PURE__ */ jsxs(Fragment$1, { children: [
+    url && /* @__PURE__ */ jsxs(Fragment, { children: [
       /* @__PURE__ */ jsx(
         "img",
         {
@@ -9630,51 +9732,13 @@ const DisplayFile = memo((props) => {
           }
         }
       ),
-      showPreview && /* @__PURE__ */ jsxs(
-        "div",
+      showPreview && /* @__PURE__ */ jsx(
+        FullScreenImagePreview,
         {
-          className: styles$4.FullScreenImageContainer,
-          onClick: () => {
-            setShowPreview(false);
-          },
-          children: [
-            /* @__PURE__ */ jsxs(Flex, { align: "center", children: [
-              /* @__PURE__ */ jsx(
-                IconButton,
-                {
-                  className: styles$4.longIconButton,
-                  variant: "soft",
-                  "aria-label": "Exit preview",
-                  onClick: () => {
-                    setShowPreview(false);
-                  },
-                  children: /* @__PURE__ */ jsx(ArrowLeftIcon, {})
-                }
-              ),
-              /* @__PURE__ */ jsx(Text, { className: styles$4.fileName, children: name }),
-              /* @__PURE__ */ jsx(
-                IconButton,
-                {
-                  className: styles$4.longIconButton,
-                  variant: "soft",
-                  "aria-label": `Download ${name}`,
-                  onClick: handleDownload,
-                  children: /* @__PURE__ */ jsx(DownloadIcon, {})
-                }
-              )
-            ] }),
-            /* @__PURE__ */ jsx(
-              "img",
-              {
-                className: styles$4.FullScreenImage,
-                src: url,
-                alt: name,
-                onClick: (e) => {
-                  e.stopPropagation();
-                }
-              }
-            )
-          ]
+          file: resolvedFile,
+          url,
+          name,
+          setShowPreview
         }
       )
     ] })
@@ -9688,7 +9752,6 @@ const emptyUploadField = {
   maximum_size: void 0,
   maximum_files: 1
 };
-const largestSupportedSize = 50;
 const _UploadField = class _UploadField extends BaseField {
   constructor(options) {
     const { extensions, maximum_files, maximum_size, ...base } = options;
@@ -9726,11 +9789,11 @@ const _UploadField = class _UploadField extends BaseField {
         field: new NumberField({
           // TODO: Default value
           label: "What is the maximum size of each file?",
-          description: `Maximum file size in megabytes (between 1MB–${largestSupportedSize}MB).`,
+          description: `Maximum file size in megabytes (between 1MB–${maxFileSizeMB}MB).`,
           required: false,
           identifier: `${path}maximum_size`,
           minimum: 1,
-          maximum: largestSupportedSize,
+          maximum: maxFileSizeMB,
           integers: true
         }),
         showDirectly: false
@@ -9770,7 +9833,7 @@ const _UploadField = class _UploadField extends BaseField {
   }
   getFieldValidators() {
     const validators = super.getFieldValidators();
-    const maxFileSizeInMB = this.maxFileSize ?? largestSupportedSize;
+    const maxFileSizeInMB = this.maxFileSize ?? maxFileSizeMB;
     const maxFileSizeInB = maxFileSizeInMB * 1e3 * 1e3;
     const maxFiles = this.maxFiles || 1;
     validators.push((value) => {
@@ -9832,6 +9895,9 @@ const FieldTypeToEmptyFieldMapping = {
   "multi-string": emptyMultiStringField,
   "multi-select": emptyMultiSelectField
 };
+const maxFileSizeMB = 50;
+const maxFileSizeKB = maxFileSizeMB * 1e3;
+const maxFileSizeB = maxFileSizeKB * 1e3;
 const deserializeField = (serializedField) => {
   const fieldType = serializedField.type;
   const fieldCls = FieldTypeToClsMapping[fieldType];
@@ -10097,6 +10163,29 @@ const initialFormValues = (fields, values) => {
     cloneDeep(values)
   );
 };
+const useAttachImagesToFormRevisionFields = (revision) => {
+  const { sdk } = useSDK();
+  const revisionCopy = useMemo(
+    () => JSON.parse(JSON.stringify(revision)),
+    [revision]
+  );
+  useEffect(() => {
+    const attachments = selectRevisionAttachments(revisionCopy.offline_id)(sdk.store.getState()) ?? [];
+    for (const attachment of attachments) {
+      const filePromise = sdk.files.fetchFileFromUrl(attachment.file, attachment.file_sha1, attachment.file_name);
+      let sectionIndex = -1;
+      let fieldIndex = -1;
+      sectionIndex = revisionCopy.fields.findIndex((section) => {
+        fieldIndex = section.fields.findIndex((field) => field.identifier === attachment.field_identifier);
+        return fieldIndex !== -1;
+      });
+      if (sectionIndex !== -1 && fieldIndex !== -1) {
+        set(revisionCopy, `fields[${sectionIndex}].fields[${fieldIndex}].image`, filePromise);
+      }
+    }
+  }, [revisionCopy, sdk]);
+  return revisionCopy;
+};
 const defaultHandleSubmit = () => {
   throw new Error("onSubmit must be provided if form is not readonly.");
 };
@@ -10165,9 +10254,10 @@ const FormSubmissionViewer = memo(
         `Could not find revision ${submission.form_revision} for submission ${submission.offline_id}.`
       );
     }
+    const revisionWithImages = useAttachImagesToFormRevisionFields(revision);
     const schema = useMemo(() => {
-      return formRevisionToSchema(revision, { readonly: true });
-    }, [revision]);
+      return formRevisionToSchema(revisionWithImages, { readonly: true });
+    }, [revisionWithImages]);
     const submissionValuesWithAttachments = useMemo(() => {
       const attachments = selectSubmissionAttachments(submission.offline_id)(sdk.store.getState()) ?? [];
       const downloadedAttachments = {};
@@ -10449,14 +10539,14 @@ const PatchField = memo((props) => {
       }
     });
   }, [render, fieldProps.value, _meta, submitForm, helpers]);
-  return /* @__PURE__ */ jsx(Fragment$1, { children: ret });
+  return /* @__PURE__ */ jsx(Fragment, { children: ret });
 });
 PatchField.displayName = "PatchField";
 const PatchFormProvider = memo(
   forwardRef((props, ref) => {
-    const { children, schema, values, onPatch, onError, ...rest } = props;
+    const { children, schema, values, onPatch, onError, requiresDiff = true, onDirtyChange, ...rest } = props;
     const initialValues2 = useMemo(() => initialFormValues(schema.fields, values), [schema.fields, values]);
-    const handlePatch = useCallback(
+    const getDiff = useCallback(
       (values2) => {
         const diff = {};
         for (const key in values2) {
@@ -10465,11 +10555,18 @@ const PatchFormProvider = memo(
             diff[key] = value;
           }
         }
-        if (!hasKeys(diff))
+        return diff;
+      },
+      [initialValues2]
+    );
+    const handlePatch = useCallback(
+      (values2) => {
+        const diff = getDiff(values2);
+        if (requiresDiff && !hasKeys(diff))
           return;
         onPatch(diff);
       },
-      [initialValues2, onPatch]
+      [getDiff, onPatch, requiresDiff]
     );
     const validate = useCallback(
       (form) => {
@@ -10477,9 +10574,13 @@ const PatchFormProvider = memo(
         if (error2) {
           onError(error2);
         }
+        if (onDirtyChange) {
+          const diff = getDiff(form);
+          onDirtyChange(hasKeys(diff));
+        }
         return error2;
       },
-      [schema, onError]
+      [schema, onDirtyChange, onError, getDiff]
     );
     const formik = useFormik({
       initialValues: initialValues2,
@@ -10489,13 +10590,21 @@ const PatchFormProvider = memo(
       validateOnBlur: false,
       validateOnChange: false
     });
+    const handleChange = useCallback(() => {
+      if (onDirtyChange) {
+        const diff = getDiff(formik.values);
+        if (hasKeys(diff)) {
+          onDirtyChange(true);
+        }
+      }
+    }, [formik.values, getDiff, onDirtyChange]);
     const { errors, resetForm } = formik;
     useEffect(() => {
       if (hasKeys(errors)) {
         resetForm({ values: initialValues2, errors: {} });
       }
     }, [errors, initialValues2, resetForm]);
-    return /* @__PURE__ */ jsx(FormikProvider, { value: formik, children: /* @__PURE__ */ jsx("form", { ...rest, ref, onSubmit: formik.handleSubmit, children }) });
+    return /* @__PURE__ */ jsx(FormikProvider, { value: formik, children: /* @__PURE__ */ jsx("form", { ...rest, ref, onSubmit: formik.handleSubmit, onChange: handleChange, children }) });
   })
 );
 const typeBadge$1 = "_typeBadge_an5ff_1";
@@ -10509,8 +10618,12 @@ const forMobile = (mobile, display) => ({
   sm: mobile ? "none" : display
 });
 const FieldActions = memo((props) => {
-  const { index: index2, sectionIndex, remove: remove2, duplicate, move } = props;
+  const { index: index2, type, sectionIndex, remove: remove2, duplicate, move, upload } = props;
+  if (type !== "section" && !upload) {
+    throw new Error("Upload function prop must be defined for non-section fields.");
+  }
   const { values } = useFormikContext();
+  const fileInputRef = useRef(null);
   const actions = useMemo(() => {
     const actions2 = [
       {
@@ -10521,11 +10634,24 @@ const FieldActions = memo((props) => {
       },
       {
         Icon: TrashIcon,
-        buttonProps: { onClick: remove2 },
         key: "delete",
-        text: "Delete"
+        text: "Delete",
+        buttonProps: { onClick: remove2 }
       }
     ];
+    if (type !== "section") {
+      actions2.unshift({
+        Icon: ImageIcon,
+        key: "upload",
+        text: "Upload image",
+        buttonProps: {
+          onClick: () => {
+            var _a2;
+            (_a2 = fileInputRef.current) == null ? void 0 : _a2.click();
+          }
+        }
+      });
+    }
     if (sectionIndex === void 0 && index2 !== values.fields.length - 1 || sectionIndex !== void 0 && (sectionIndex < values.fields.length - 1 || index2 !== values.fields[sectionIndex].fields.length - 1)) {
       actions2.unshift({
         Icon: ArrowDownIcon,
@@ -10551,8 +10677,8 @@ const FieldActions = memo((props) => {
       });
     }
     return actions2;
-  }, [duplicate, index2, move, remove2, sectionIndex, values.fields]);
-  return /* @__PURE__ */ jsxs(Fragment$1, { children: [
+  }, [duplicate, index2, move, remove2, sectionIndex, type, values.fields]);
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
     /* @__PURE__ */ jsx(Flex, { display: forMobile(false, "flex"), direction: "column", gap: "5", mx: "2", children: actions.map((Action) => /* @__PURE__ */ jsx(
       IconButton,
       {
@@ -10580,17 +10706,36 @@ const FieldActions = memo((props) => {
           };
         })
       }
-    ) })
+    ) }),
+    type !== "section" && /* @__PURE__ */ jsx("input", { style: { display: "none" }, ref: fileInputRef, type: "file", accept: "image/*", onChange: upload })
   ] });
 });
 FieldActions.displayName = "FieldActions";
-const popoverInputsContainer = "_popoverInputsContainer_wqdmr_1";
-const typeBadge = "_typeBadge_wqdmr_5";
-const previewInput = "_previewInput_wqdmr_10";
-const directInput = "_directInput_wqdmr_14";
-const grow = "_grow_wqdmr_19";
+const description = "_description_13g4a_1";
+const floatingButtonContainer = "_floatingButtonContainer_13g4a_5";
+const FullScreenImageContainer = "_FullScreenImageContainer_13g4a_12";
+const fileName = "_fileName_13g4a_22";
+const longIconButton = "_longIconButton_13g4a_27";
+const previewImage = "_previewImage_13g4a_33";
+const FullScreenImage = "_FullScreenImage_13g4a_12";
+const popoverInputsContainer = "_popoverInputsContainer_13g4a_51";
+const imageContainer = "_imageContainer_13g4a_55";
+const deleteImageButton = "_deleteImageButton_13g4a_60";
+const typeBadge = "_typeBadge_13g4a_71";
+const previewInput = "_previewInput_13g4a_76";
+const directInput = "_directInput_13g4a_80";
+const grow = "_grow_13g4a_85";
 const styles = {
+  description,
+  floatingButtonContainer,
+  FullScreenImageContainer,
+  fileName,
+  longIconButton,
+  previewImage,
+  FullScreenImage,
   popoverInputsContainer,
+  imageContainer,
+  deleteImageButton,
   typeBadge,
   previewInput,
   directInput,
@@ -10626,6 +10771,9 @@ const useFieldTypeItems = (onSelect = () => null) => {
     });
   }, [onSelect]);
 };
+const isSection = (field) => {
+  return field.type === "section";
+};
 const FieldSettingsPopover = memo((props) => {
   const { popoverInputs, hasError } = props;
   return /* @__PURE__ */ jsx(
@@ -10655,6 +10803,8 @@ FieldSettingsPopover.displayName = "FieldSettingsPopover";
 const FieldBuilder = memo((props) => {
   var _a2, _b, _c, _d, _e, _f;
   const { parentPath, index: index2, initial, conditionalSourceFields } = props;
+  const { values, setFieldValue, errors } = useFormikContext();
+  const fieldTypeItems = useFieldTypeItems();
   const RADIX_SM_MIN_WIDTH = 576;
   const [isLargeScreen, setIsLargeScreen] = useState(
     window.matchMedia(`(min-width: ${RADIX_SM_MIN_WIDTH}px)`).matches
@@ -10669,22 +10819,39 @@ const FieldBuilder = memo((props) => {
       mediaQuery.removeEventListener("change", handleMediaQueryChange);
     };
   }, []);
-  const { values, setFieldValue, errors } = useFormikContext();
-  const fieldTypeItems = useFieldTypeItems();
-  const isSection = useCallback((field) => {
-    return field.type === "section";
-  }, []);
+  const [resolvedImage, setResolvedImage] = useState(void 0);
+  const [showImagePreview, setShowImagePreview] = useState(false);
+  useEffect(() => {
+    if (!isSection(initial)) {
+      if (initial.image instanceof Promise) {
+        initial.image.then(setResolvedImage).catch(console.error);
+      } else {
+        setResolvedImage(initial.image);
+      }
+    } else {
+      setResolvedImage(void 0);
+    }
+  }, [initial]);
+  const resolvedImageURL = resolvedImage ? URL.createObjectURL(resolvedImage) : void 0;
+  const handleImageDelete = useCallback(
+    (event) => {
+      event.stopPropagation();
+      const { image: _, ...fieldWithoutImage } = initial;
+      void setFieldValue(`${parentPath}.${index2}`, fieldWithoutImage).then();
+    },
+    [index2, initial, parentPath, setFieldValue]
+  );
   useEffect(() => {
     if (isSection(initial) && !initial.conditional) {
       void setFieldValue(`${parentPath}.${index2}.condition`, null).then();
     }
-  }, [index2, initial, isSection, parentPath, setFieldValue]);
+  }, [index2, initial, parentPath, setFieldValue]);
   const conditionLabel = useMemo(
     () => {
       var _a3, _b2;
       return isSection(initial) ? (_b2 = findFieldByIdentifier(values.fields, (_a3 = initial.condition) == null ? void 0 : _a3.identifier)) == null ? void 0 : _b2.label : void 0;
     },
-    [initial, isSection, values.fields]
+    [initial, values.fields]
   );
   const conditionComparison = isSection(initial) ? Array.isArray((_a2 = initial.condition) == null ? void 0 : _a2.value) ? "contains all of" : "equals" : void 0;
   let conditionValue = void 0;
@@ -10795,6 +10962,41 @@ const FieldBuilder = memo((props) => {
         /* @__PURE__ */ jsxs(Flex, { align: "center", gap: "3", children: [
           /* @__PURE__ */ jsx(Badge, { className: styles.typeBadge, children: (_f = fieldTypeItems.flat().find((item) => item.value === type)) == null ? void 0 : _f.content }),
           showPopoverInputs && /* @__PURE__ */ jsx(FieldSettingsPopover, { popoverInputs, hasError: popoverHasErrors })
+        ] }),
+        resolvedImage && /* @__PURE__ */ jsxs(Fragment, { children: [
+          /* @__PURE__ */ jsxs("div", { className: styles.imageContainer, children: [
+            /* @__PURE__ */ jsx(
+              "img",
+              {
+                className: styles.previewImage,
+                src: resolvedImageURL,
+                alt: resolvedImage.name,
+                onClick: () => {
+                  setShowImagePreview(true);
+                }
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              IconButton,
+              {
+                className: styles.deleteImageButton,
+                variant: "solid",
+                severity: "danger",
+                "aria-label": "delete",
+                onClick: handleImageDelete,
+                children: /* @__PURE__ */ jsx(TrashIcon, {})
+              }
+            )
+          ] }),
+          showImagePreview && /* @__PURE__ */ jsx(
+            FullScreenImagePreview,
+            {
+              file: resolvedImage,
+              url: resolvedImageURL,
+              name: resolvedImage.name,
+              setShowPreview: setShowImagePreview
+            }
+          )
         ] })
       ] }),
       /* @__PURE__ */ jsx(
@@ -10851,6 +11053,7 @@ const FieldWithActions = memo((props) => {
   const { field, index: index2, sectionIndex, takenLabels, remove: remove2 } = props;
   const { setFieldValue, values } = useFormikContext();
   const { reorderField } = useFieldReordering();
+  const { showError } = useToast();
   const parentPath = `fields.${sectionIndex}.fields`;
   const editFieldProps = useMemo(
     () => ({
@@ -10894,6 +11097,28 @@ const FieldWithActions = memo((props) => {
     },
     [sectionIndex, values.fields, index2, reorderField, setFieldValue]
   );
+  const uploadImage = useCallback(
+    (event) => {
+      const { files } = event.target;
+      if (!files || files.length !== 1)
+        return;
+      const file = files.item(0);
+      if (!file)
+        return;
+      if (file.size > maxFileSizeB) {
+        showError({
+          title: "File upload error",
+          description: `The file ${file.name} exceeded the maximum file size`
+        });
+        return;
+      }
+      void setFieldValue(`${parentPath}.${index2}`, {
+        ...field,
+        image: file
+      }).then();
+    },
+    [field, index2, parentPath, setFieldValue, showError]
+  );
   return /* @__PURE__ */ jsx(Draggable, { draggableId: field.identifier, index: index2, children: (draggableProvided) => /* @__PURE__ */ jsx(
     Card,
     {
@@ -10912,10 +11137,12 @@ const FieldWithActions = memo((props) => {
           FieldActions,
           {
             index: index2,
+            type: field.type,
             sectionIndex,
             remove: remove2,
             duplicate: duplicateField,
-            move: moveField
+            move: moveField,
+            upload: uploadImage
           }
         )
       ] })
@@ -10923,12 +11150,6 @@ const FieldWithActions = memo((props) => {
   ) });
 });
 FieldWithActions.displayName = "FieldWithActions";
-const FieldTypeDropdown = memo((props) => {
-  const { setFieldType, children } = props;
-  const fieldTypeItems = useFieldTypeItems(setFieldType);
-  return /* @__PURE__ */ jsx(DropdownItemMenu, { trigger: children, items: fieldTypeItems.flat() });
-});
-FieldTypeDropdown.displayName = "FieldTypeDropdown";
 const FieldSectionWithActions = memo((props) => {
   var _a2;
   const { field, index: sectionIndex, dropState } = props;
@@ -11064,6 +11285,7 @@ const FieldSectionWithActions = memo((props) => {
     },
     [sectionIndex, field.fields.length, values, setFieldValue]
   );
+  const fieldTypeItems = useFieldTypeItems(handleCreateField);
   return /* @__PURE__ */ jsx(Draggable, { draggableId: field.identifier, index: sectionIndex, children: (draggableProvided) => {
     return /* @__PURE__ */ jsx(
       Card,
@@ -11103,10 +11325,16 @@ const FieldSectionWithActions = memo((props) => {
                         child.identifier
                       )),
                       droppableProvided.placeholder,
-                      /* @__PURE__ */ jsx(FieldTypeDropdown, { setFieldType: handleCreateField, children: /* @__PURE__ */ jsxs(Button, { type: "button", variant: "soft", children: [
-                        /* @__PURE__ */ jsx(PlusIcon, {}),
-                        " Add field"
-                      ] }) })
+                      /* @__PURE__ */ jsx(
+                        DropdownItemMenu,
+                        {
+                          trigger: /* @__PURE__ */ jsxs(Button, { type: "button", variant: "soft", children: [
+                            /* @__PURE__ */ jsx(PlusIcon, {}),
+                            " Add field"
+                          ] }),
+                          items: fieldTypeItems.flat()
+                        }
+                      )
                     ]
                   }
                 )
@@ -11117,6 +11345,7 @@ const FieldSectionWithActions = memo((props) => {
             FieldActions,
             {
               index: sectionIndex,
+              type: field.type,
               remove: removeSection,
               duplicate: duplicateSection,
               move: moveSection
@@ -11241,7 +11470,7 @@ const FieldsEditor = memo(() => {
       direction: "column",
       gap: "0",
       children: [
-        values.fields.map((field, index2) => /* @__PURE__ */ jsxs(Fragment, { children: [
+        values.fields.map((field, index2) => /* @__PURE__ */ jsxs(Fragment$1, { children: [
           /* @__PURE__ */ jsx(FieldSectionWithActions, { field, index: index2, dropState }),
           /* @__PURE__ */ jsxs(
             Button,
@@ -11496,9 +11725,6 @@ export {
   IssuePriority,
   IssueService,
   IssueStatus,
-  LicenseLevel,
-  LicenseService,
-  LicenseStatus,
   MainService,
   MapStyle,
   MultiSelectField,
@@ -11546,7 +11772,6 @@ export {
   addEmailDomain,
   addFavouriteProjectId,
   addIssue,
-  addLicenses,
   addOrReplaceCategories,
   addOrReplaceIssueComment,
   addOrReplaceProjectFile,
@@ -11559,6 +11784,7 @@ export {
   addToRecentIssues,
   addUserForm,
   addUserFormRevision,
+  addUserFormRevisionAttachment,
   addUserFormRevisions,
   addUserFormSubmission,
   addUserFormSubmissionAttachment,
@@ -11645,8 +11871,6 @@ export {
   issueReducer,
   issueSlice,
   issueToSearchResult,
-  licenseReducer,
-  licenseSlice,
   literalToCoordinates,
   logOnlyOnce,
   makeClient,
@@ -11713,20 +11937,17 @@ export {
   searchIssues,
   selectAccessToken,
   selectActiveIssueId,
-  selectActiveLicense,
   selectActiveOrganization,
   selectActiveOrganizationAccess,
   selectActiveOrganizationId,
-  selectActiveOrganizationLicenses,
-  selectActiveOrganizationProjects,
   selectActiveProject,
   selectActiveProjectAccess,
   selectActiveProjectFileId,
   selectActiveProjectId,
-  selectActiveStatusLicenses,
   selectActiveWorkspace,
   selectActiveWorkspaceId,
   selectAllAttachments,
+  selectAllRevisionAttachmentsByLatestRevisionId,
   selectAppearance,
   selectCategories,
   selectCategoriesOfWorkspace,
@@ -11768,7 +11989,6 @@ export {
   selectHiddenComponentTypeIds,
   selectIsFetchingInitialData,
   selectIsImportingProjectFile,
-  selectIsLoading,
   selectIsLoggedIn,
   selectIssue,
   selectIssueAttachmentMapping,
@@ -11778,10 +11998,6 @@ export {
   selectLatestFormRevision,
   selectLatestRetryTime,
   selectLatestRevisionByFormId,
-  selectLicencesMapping,
-  selectLicense,
-  selectLicenseForProject,
-  selectLicenses,
   selectMainWorkspace,
   selectMapStyle,
   selectNumberOfComponentTypesMatchingCaseInsensitiveName,
@@ -11795,7 +12011,6 @@ export {
   selectOrganizationUsersAsMapping,
   selectOrganizationUsersIds,
   selectOrganizations,
-  selectOrganizationsMapping,
   selectOrganizationsWithAccess,
   selectPermittedWorkspaceIds,
   selectPhotoAttachmentsOfIssue,
@@ -11813,10 +12028,10 @@ export {
   selectRecentIssuesAsSearchResults,
   selectRecentProjects,
   selectRehydrated,
+  selectRevisionAttachments,
   selectRevisionsForForm,
   selectShowTooltips,
   selectSortedEmailDomains,
-  selectSortedOrganizationLicenses,
   selectSortedOrganizationUsers,
   selectSortedProjectUsers,
   selectSortedProjects,
@@ -11859,10 +12074,8 @@ export {
   setEnablePlacementMode,
   setIsFetchingInitialData,
   setIsImportingProjectFile,
-  setIsLoading,
   setIssueComments,
   setIssues,
-  setLicenses,
   setLoggedIn,
   setMapStyle,
   setOrganizationAccesses,
@@ -11877,6 +12090,7 @@ export {
   setTokens,
   setTourStep,
   setUploadUrl,
+  setUserFormRevisionAttachments,
   setUserFormSubmissionAttachments,
   setUserFormSubmissions,
   setUsers,
@@ -11897,12 +12111,9 @@ export {
   unhideAllCategories,
   unhideCategory,
   updateActiveOrganization,
-  updateActiveProjectFormSubmissionsCount,
-  updateActiveProjectIssuesCount,
   updateAttachment,
   updateComponent,
   updateIssue,
-  updateLicense,
   updateOrCreateProject,
   updateOrganizationAccess,
   updateProjectAccess,