@manifest-editor/projects 1.0.2

package/dist/index.cjs

@@ -0,0 +1,1301 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __commonJS = (cb, mod) => function __require() {
+  return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
+};
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var __publicField = (obj, key, value) => {
+  __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+  return value;
+};
+
+// ../../node_modules/.pnpm/shallowequal@1.1.0/node_modules/shallowequal/index.js
+var require_shallowequal = __commonJS({
+  "../../node_modules/.pnpm/shallowequal@1.1.0/node_modules/shallowequal/index.js"(exports, module2) {
+    "use strict";
+    module2.exports = function shallowEqual2(objA, objB, compare, compareContext) {
+      var ret = compare ? compare.call(compareContext, objA, objB) : void 0;
+      if (ret !== void 0) {
+        return !!ret;
+      }
+      if (objA === objB) {
+        return true;
+      }
+      if (typeof objA !== "object" || !objA || typeof objB !== "object" || !objB) {
+        return false;
+      }
+      var keysA = Object.keys(objA);
+      var keysB = Object.keys(objB);
+      if (keysA.length !== keysB.length) {
+        return false;
+      }
+      var bHasOwnProperty = Object.prototype.hasOwnProperty.bind(objB);
+      for (var idx = 0; idx < keysA.length; idx++) {
+        var key = keysA[idx];
+        if (!bHasOwnProperty(key)) {
+          return false;
+        }
+        var valueA = objA[key];
+        var valueB = objB[key];
+        ret = compare ? compare.call(compareContext, valueA, valueB, key) : void 0;
+        if (ret === false || ret === void 0 && valueA !== valueB) {
+          return false;
+        }
+      }
+      return true;
+    };
+  }
+});
+
+// ../../node_modules/.pnpm/slugify@1.6.6/node_modules/slugify/slugify.js
+var require_slugify = __commonJS({
+  "../../node_modules/.pnpm/slugify@1.6.6/node_modules/slugify/slugify.js"(exports, module2) {
+    "use strict";
+    (function(name, root, factory) {
+      if (typeof exports === "object") {
+        module2.exports = factory();
+        module2.exports["default"] = factory();
+      } else if (typeof define === "function" && define.amd) {
+        define(factory);
+      } else {
+        root[name] = factory();
+      }
+    })("slugify", exports, function() {
+      var charMap = JSON.parse(`{"$":"dollar","%":"percent","&":"and","<":"less",">":"greater","|":"or","\xA2":"cent","\xA3":"pound","\xA4":"currency","\xA5":"yen","\xA9":"(c)","\xAA":"a","\xAE":"(r)","\xBA":"o","\xC0":"A","\xC1":"A","\xC2":"A","\xC3":"A","\xC4":"A","\xC5":"A","\xC6":"AE","\xC7":"C","\xC8":"E","\xC9":"E","\xCA":"E","\xCB":"E","\xCC":"I","\xCD":"I","\xCE":"I","\xCF":"I","\xD0":"D","\xD1":"N","\xD2":"O","\xD3":"O","\xD4":"O","\xD5":"O","\xD6":"O","\xD8":"O","\xD9":"U","\xDA":"U","\xDB":"U","\xDC":"U","\xDD":"Y","\xDE":"TH","\xDF":"ss","\xE0":"a","\xE1":"a","\xE2":"a","\xE3":"a","\xE4":"a","\xE5":"a","\xE6":"ae","\xE7":"c","\xE8":"e","\xE9":"e","\xEA":"e","\xEB":"e","\xEC":"i","\xED":"i","\xEE":"i","\xEF":"i","\xF0":"d","\xF1":"n","\xF2":"o","\xF3":"o","\xF4":"o","\xF5":"o","\xF6":"o","\xF8":"o","\xF9":"u","\xFA":"u","\xFB":"u","\xFC":"u","\xFD":"y","\xFE":"th","\xFF":"y","\u0100":"A","\u0101":"a","\u0102":"A","\u0103":"a","\u0104":"A","\u0105":"a","\u0106":"C","\u0107":"c","\u010C":"C","\u010D":"c","\u010E":"D","\u010F":"d","\u0110":"DJ","\u0111":"dj","\u0112":"E","\u0113":"e","\u0116":"E","\u0117":"e","\u0118":"e","\u0119":"e","\u011A":"E","\u011B":"e","\u011E":"G","\u011F":"g","\u0122":"G","\u0123":"g","\u0128":"I","\u0129":"i","\u012A":"i","\u012B":"i","\u012E":"I","\u012F":"i","\u0130":"I","\u0131":"i","\u0136":"k","\u0137":"k","\u013B":"L","\u013C":"l","\u013D":"L","\u013E":"l","\u0141":"L","\u0142":"l","\u0143":"N","\u0144":"n","\u0145":"N","\u0146":"n","\u0147":"N","\u0148":"n","\u014C":"O","\u014D":"o","\u0150":"O","\u0151":"o","\u0152":"OE","\u0153":"oe","\u0154":"R","\u0155":"r","\u0158":"R","\u0159":"r","\u015A":"S","\u015B":"s","\u015E":"S","\u015F":"s","\u0160":"S","\u0161":"s","\u0162":"T","\u0163":"t","\u0164":"T","\u0165":"t","\u0168":"U","\u0169":"u","\u016A":"u","\u016B":"u","\u016E":"U","\u016F":"u","\u0170":"U","\u0171":"u","\u0172":"U","\u0173":"u","\u0174":"W","\u0175":"w","\u0176":"Y","\u0177":"y","\u0178":"Y","\u0179":"Z","\u017A":"z","\u017B":"Z","\u017C":"z","\u017D":"Z","\u017E":"z","\u018F":"E","\u0192":"f","\u01A0":"O","\u01A1":"o","\u01AF":"U","\u01B0":"u","\u01C8":"LJ","\u01C9":"lj","\u01CB":"NJ","\u01CC":"nj","\u0218":"S","\u0219":"s","\u021A":"T","\u021B":"t","\u0259":"e","\u02DA":"o","\u0386":"A","\u0388":"E","\u0389":"H","\u038A":"I","\u038C":"O","\u038E":"Y","\u038F":"W","\u0390":"i","\u0391":"A","\u0392":"B","\u0393":"G","\u0394":"D","\u0395":"E","\u0396":"Z","\u0397":"H","\u0398":"8","\u0399":"I","\u039A":"K","\u039B":"L","\u039C":"M","\u039D":"N","\u039E":"3","\u039F":"O","\u03A0":"P","\u03A1":"R","\u03A3":"S","\u03A4":"T","\u03A5":"Y","\u03A6":"F","\u03A7":"X","\u03A8":"PS","\u03A9":"W","\u03AA":"I","\u03AB":"Y","\u03AC":"a","\u03AD":"e","\u03AE":"h","\u03AF":"i","\u03B0":"y","\u03B1":"a","\u03B2":"b","\u03B3":"g","\u03B4":"d","\u03B5":"e","\u03B6":"z","\u03B7":"h","\u03B8":"8","\u03B9":"i","\u03BA":"k","\u03BB":"l","\u03BC":"m","\u03BD":"n","\u03BE":"3","\u03BF":"o","\u03C0":"p","\u03C1":"r","\u03C2":"s","\u03C3":"s","\u03C4":"t","\u03C5":"y","\u03C6":"f","\u03C7":"x","\u03C8":"ps","\u03C9":"w","\u03CA":"i","\u03CB":"y","\u03CC":"o","\u03CD":"y","\u03CE":"w","\u0401":"Yo","\u0402":"DJ","\u0404":"Ye","\u0406":"I","\u0407":"Yi","\u0408":"J","\u0409":"LJ","\u040A":"NJ","\u040B":"C","\u040F":"DZ","\u0410":"A","\u0411":"B","\u0412":"V","\u0413":"G","\u0414":"D","\u0415":"E","\u0416":"Zh","\u0417":"Z","\u0418":"I","\u0419":"J","\u041A":"K","\u041B":"L","\u041C":"M","\u041D":"N","\u041E":"O","\u041F":"P","\u0420":"R","\u0421":"S","\u0422":"T","\u0423":"U","\u0424":"F","\u0425":"H","\u0426":"C","\u0427":"Ch","\u0428":"Sh","\u0429":"Sh","\u042A":"U","\u042B":"Y","\u042C":"","\u042D":"E","\u042E":"Yu","\u042F":"Ya","\u0430":"a","\u0431":"b","\u0432":"v","\u0433":"g","\u0434":"d","\u0435":"e","\u0436":"zh","\u0437":"z","\u0438":"i","\u0439":"j","\u043A":"k","\u043B":"l","\u043C":"m","\u043D":"n","\u043E":"o","\u043F":"p","\u0440":"r","\u0441":"s","\u0442":"t","\u0443":"u","\u0444":"f","\u0445":"h","\u0446":"c","\u0447":"ch","\u0448":"sh","\u0449":"sh","\u044A":"u","\u044B":"y","\u044C":"","\u044D":"e","\u044E":"yu","\u044F":"ya","\u0451":"yo","\u0452":"dj","\u0454":"ye","\u0456":"i","\u0457":"yi","\u0458":"j","\u0459":"lj","\u045A":"nj","\u045B":"c","\u045D":"u","\u045F":"dz","\u0490":"G","\u0491":"g","\u0492":"GH","\u0493":"gh","\u049A":"KH","\u049B":"kh","\u04A2":"NG","\u04A3":"ng","\u04AE":"UE","\u04AF":"ue","\u04B0":"U","\u04B1":"u","\u04BA":"H","\u04BB":"h","\u04D8":"AE","\u04D9":"ae","\u04E8":"OE","\u04E9":"oe","\u0531":"A","\u0532":"B","\u0533":"G","\u0534":"D","\u0535":"E","\u0536":"Z","\u0537":"E'","\u0538":"Y'","\u0539":"T'","\u053A":"JH","\u053B":"I","\u053C":"L","\u053D":"X","\u053E":"C'","\u053F":"K","\u0540":"H","\u0541":"D'","\u0542":"GH","\u0543":"TW","\u0544":"M","\u0545":"Y","\u0546":"N","\u0547":"SH","\u0549":"CH","\u054A":"P","\u054B":"J","\u054C":"R'","\u054D":"S","\u054E":"V","\u054F":"T","\u0550":"R","\u0551":"C","\u0553":"P'","\u0554":"Q'","\u0555":"O''","\u0556":"F","\u0587":"EV","\u0621":"a","\u0622":"aa","\u0623":"a","\u0624":"u","\u0625":"i","\u0626":"e","\u0627":"a","\u0628":"b","\u0629":"h","\u062A":"t","\u062B":"th","\u062C":"j","\u062D":"h","\u062E":"kh","\u062F":"d","\u0630":"th","\u0631":"r","\u0632":"z","\u0633":"s","\u0634":"sh","\u0635":"s","\u0636":"dh","\u0637":"t","\u0638":"z","\u0639":"a","\u063A":"gh","\u0641":"f","\u0642":"q","\u0643":"k","\u0644":"l","\u0645":"m","\u0646":"n","\u0647":"h","\u0648":"w","\u0649":"a","\u064A":"y","\u064B":"an","\u064C":"on","\u064D":"en","\u064E":"a","\u064F":"u","\u0650":"e","\u0652":"","\u0660":"0","\u0661":"1","\u0662":"2","\u0663":"3","\u0664":"4","\u0665":"5","\u0666":"6","\u0667":"7","\u0668":"8","\u0669":"9","\u067E":"p","\u0686":"ch","\u0698":"zh","\u06A9":"k","\u06AF":"g","\u06CC":"y","\u06F0":"0","\u06F1":"1","\u06F2":"2","\u06F3":"3","\u06F4":"4","\u06F5":"5","\u06F6":"6","\u06F7":"7","\u06F8":"8","\u06F9":"9","\u0E3F":"baht","\u10D0":"a","\u10D1":"b","\u10D2":"g","\u10D3":"d","\u10D4":"e","\u10D5":"v","\u10D6":"z","\u10D7":"t","\u10D8":"i","\u10D9":"k","\u10DA":"l","\u10DB":"m","\u10DC":"n","\u10DD":"o","\u10DE":"p","\u10DF":"zh","\u10E0":"r","\u10E1":"s","\u10E2":"t","\u10E3":"u","\u10E4":"f","\u10E5":"k","\u10E6":"gh","\u10E7":"q","\u10E8":"sh","\u10E9":"ch","\u10EA":"ts","\u10EB":"dz","\u10EC":"ts","\u10ED":"ch","\u10EE":"kh","\u10EF":"j","\u10F0":"h","\u1E62":"S","\u1E63":"s","\u1E80":"W","\u1E81":"w","\u1E82":"W","\u1E83":"w","\u1E84":"W","\u1E85":"w","\u1E9E":"SS","\u1EA0":"A","\u1EA1":"a","\u1EA2":"A","\u1EA3":"a","\u1EA4":"A","\u1EA5":"a","\u1EA6":"A","\u1EA7":"a","\u1EA8":"A","\u1EA9":"a","\u1EAA":"A","\u1EAB":"a","\u1EAC":"A","\u1EAD":"a","\u1EAE":"A","\u1EAF":"a","\u1EB0":"A","\u1EB1":"a","\u1EB2":"A","\u1EB3":"a","\u1EB4":"A","\u1EB5":"a","\u1EB6":"A","\u1EB7":"a","\u1EB8":"E","\u1EB9":"e","\u1EBA":"E","\u1EBB":"e","\u1EBC":"E","\u1EBD":"e","\u1EBE":"E","\u1EBF":"e","\u1EC0":"E","\u1EC1":"e","\u1EC2":"E","\u1EC3":"e","\u1EC4":"E","\u1EC5":"e","\u1EC6":"E","\u1EC7":"e","\u1EC8":"I","\u1EC9":"i","\u1ECA":"I","\u1ECB":"i","\u1ECC":"O","\u1ECD":"o","\u1ECE":"O","\u1ECF":"o","\u1ED0":"O","\u1ED1":"o","\u1ED2":"O","\u1ED3":"o","\u1ED4":"O","\u1ED5":"o","\u1ED6":"O","\u1ED7":"o","\u1ED8":"O","\u1ED9":"o","\u1EDA":"O","\u1EDB":"o","\u1EDC":"O","\u1EDD":"o","\u1EDE":"O","\u1EDF":"o","\u1EE0":"O","\u1EE1":"o","\u1EE2":"O","\u1EE3":"o","\u1EE4":"U","\u1EE5":"u","\u1EE6":"U","\u1EE7":"u","\u1EE8":"U","\u1EE9":"u","\u1EEA":"U","\u1EEB":"u","\u1EEC":"U","\u1EED":"u","\u1EEE":"U","\u1EEF":"u","\u1EF0":"U","\u1EF1":"u","\u1EF2":"Y","\u1EF3":"y","\u1EF4":"Y","\u1EF5":"y","\u1EF6":"Y","\u1EF7":"y","\u1EF8":"Y","\u1EF9":"y","\u2013":"-","\u2018":"'","\u2019":"'","\u201C":"\\"","\u201D":"\\"","\u201E":"\\"","\u2020":"+","\u2022":"*","\u2026":"...","\u20A0":"ecu","\u20A2":"cruzeiro","\u20A3":"french franc","\u20A4":"lira","\u20A5":"mill","\u20A6":"naira","\u20A7":"peseta","\u20A8":"rupee","\u20A9":"won","\u20AA":"new shequel","\u20AB":"dong","\u20AC":"euro","\u20AD":"kip","\u20AE":"tugrik","\u20AF":"drachma","\u20B0":"penny","\u20B1":"peso","\u20B2":"guarani","\u20B3":"austral","\u20B4":"hryvnia","\u20B5":"cedi","\u20B8":"kazakhstani tenge","\u20B9":"indian rupee","\u20BA":"turkish lira","\u20BD":"russian ruble","\u20BF":"bitcoin","\u2120":"sm","\u2122":"tm","\u2202":"d","\u2206":"delta","\u2211":"sum","\u221E":"infinity","\u2665":"love","\u5143":"yuan","\u5186":"yen","\uFDFC":"rial","\uFEF5":"laa","\uFEF7":"laa","\uFEF9":"lai","\uFEFB":"la"}`);
+      var locales = JSON.parse('{"bg":{"\u0419":"Y","\u0426":"Ts","\u0429":"Sht","\u042A":"A","\u042C":"Y","\u0439":"y","\u0446":"ts","\u0449":"sht","\u044A":"a","\u044C":"y"},"de":{"\xC4":"AE","\xE4":"ae","\xD6":"OE","\xF6":"oe","\xDC":"UE","\xFC":"ue","\xDF":"ss","%":"prozent","&":"und","|":"oder","\u2211":"summe","\u221E":"unendlich","\u2665":"liebe"},"es":{"%":"por ciento","&":"y","<":"menor que",">":"mayor que","|":"o","\xA2":"centavos","\xA3":"libras","\xA4":"moneda","\u20A3":"francos","\u2211":"suma","\u221E":"infinito","\u2665":"amor"},"fr":{"%":"pourcent","&":"et","<":"plus petit",">":"plus grand","|":"ou","\xA2":"centime","\xA3":"livre","\xA4":"devise","\u20A3":"franc","\u2211":"somme","\u221E":"infini","\u2665":"amour"},"pt":{"%":"porcento","&":"e","<":"menor",">":"maior","|":"ou","\xA2":"centavo","\u2211":"soma","\xA3":"libra","\u221E":"infinito","\u2665":"amor"},"uk":{"\u0418":"Y","\u0438":"y","\u0419":"Y","\u0439":"y","\u0426":"Ts","\u0446":"ts","\u0425":"Kh","\u0445":"kh","\u0429":"Shch","\u0449":"shch","\u0413":"H","\u0433":"h"},"vi":{"\u0110":"D","\u0111":"d"},"da":{"\xD8":"OE","\xF8":"oe","\xC5":"AA","\xE5":"aa","%":"procent","&":"og","|":"eller","$":"dollar","<":"mindre end",">":"st\xF8rre end"},"nb":{"&":"og","\xC5":"AA","\xC6":"AE","\xD8":"OE","\xE5":"aa","\xE6":"ae","\xF8":"oe"},"it":{"&":"e"},"nl":{"&":"en"},"sv":{"&":"och","\xC5":"AA","\xC4":"AE","\xD6":"OE","\xE5":"aa","\xE4":"ae","\xF6":"oe"}}');
+      function replace(string, options) {
+        if (typeof string !== "string") {
+          throw new Error("slugify: string argument expected");
+        }
+        options = typeof options === "string" ? { replacement: options } : options || {};
+        var locale = locales[options.locale] || {};
+        var replacement = options.replacement === void 0 ? "-" : options.replacement;
+        var trim = options.trim === void 0 ? true : options.trim;
+        var slug = string.normalize().split("").reduce(function(result, ch) {
+          var appendChar = locale[ch];
+          if (appendChar === void 0)
+            appendChar = charMap[ch];
+          if (appendChar === void 0)
+            appendChar = ch;
+          if (appendChar === replacement)
+            appendChar = " ";
+          return result + appendChar.replace(options.remove || /[^\w\s$*_+~.()'"!\-:@]+/g, "");
+        }, "");
+        if (options.strict) {
+          slug = slug.replace(/[^A-Za-z0-9\s]/g, "");
+        }
+        if (trim) {
+          slug = slug.trim();
+        }
+        slug = slug.replace(/\s+/g, replacement);
+        if (options.lower) {
+          slug = slug.toLowerCase();
+        }
+        return slug;
+      }
+      replace.extend = function(customMap) {
+        Object.assign(charMap, customMap);
+      };
+      return replace;
+    });
+  }
+});
+
+// src/index.ts
+var src_exports = {};
+__export(src_exports, {
+  AppMenu: () => AppMenu,
+  Draft: () => Draft,
+  DraftTitle: () => DraftTitle,
+  DraftTitleEdit: () => DraftTitleEdit,
+  DraftTitleEditButton: () => DraftTitleEditButton,
+  DraftTitleEditInput: () => DraftTitleEditInput,
+  DraftTitleEditor: () => DraftTitleEditor,
+  DraftsText: () => DraftsText,
+  IconButton: () => IconButton,
+  ProjectLoadingReactContext: () => ProjectLoadingReactContext,
+  ProjectProvider: () => ProjectProvider,
+  ProjectReactContext: () => ProjectReactContext,
+  useCurrentProject: () => useCurrentProject,
+  useOptionalCurrentProject: () => useOptionalCurrentProject,
+  useProjectActionsWithBackend: () => useProjectActionsWithBackend,
+  useProjectBackend: () => useProjectBackend,
+  useProjectContext: () => useProjectContext,
+  useProjectCreators: () => useProjectCreators,
+  useProjectLoader: () => useProjectLoader,
+  useProjectLoading: () => useProjectLoading
+});
+module.exports = __toCommonJS(src_exports);
+
+// src/ProjectContext.tsx
+var import_react = require("react");
+
+// ../../node_modules/.pnpm/tiny-invariant@1.3.3/node_modules/tiny-invariant/dist/esm/tiny-invariant.js
+var isProduction = false;
+var prefix = "Invariant failed";
+function invariant(condition, message) {
+  if (condition) {
+    return;
+  }
+  if (isProduction) {
+    throw new Error(prefix);
+  }
+  var provided = typeof message === "function" ? message() : message;
+  var value = provided ? "".concat(prefix, ": ").concat(provided) : prefix;
+  throw new Error(value);
+}
+
+// src/ProjectContext.tsx
+var ProjectReactContext = (0, import_react.createContext)(null);
+var ProjectLoadingReactContext = (0, import_react.createContext)({
+  error: void 0,
+  isError: false,
+  isLoading: false
+});
+function useProjectLoading() {
+  return (0, import_react.useContext)(ProjectLoadingReactContext);
+}
+function useProjectContext() {
+  const ctx = (0, import_react.useContext)(ProjectReactContext);
+  invariant(ctx, "useProjectContext can only be called from inside <ProjectProvider />");
+  return ctx;
+}
+function useCurrentProject() {
+  const current = useProjectContext().current;
+  invariant(current, "No current project");
+  return current;
+}
+function useOptionalCurrentProject() {
+  const current = useProjectContext().current;
+  return current || null;
+}
+
+// src/ProjectContext.hooks.ts
+var import_react2 = require("react");
+var import_shallowequal = __toESM(require_shallowequal(), 1);
+var import_tiny_use_debounce = require("tiny-use-debounce");
+
+// src/helpers/project-from-manifest.ts
+var import_helpers = require("@iiif/helpers");
+var import_slugify = __toESM(require_slugify(), 1);
+function randomId() {
+  return `${Math.random().toString(36).substr(2)}-${Date.now().toString(36)}`;
+}
+function projectFromManifest(manifest, details = {}) {
+  const name = (0, import_helpers.getValue)(manifest.label) || "Untitled manifest";
+  return {
+    id: `manifest-editor://project/${randomId()}`,
+    filename: (0, import_slugify.default)(name, { lower: true }),
+    name,
+    metadata: {
+      created: Date.now(),
+      modified: Date.now()
+    },
+    resource: {
+      id: manifest.id,
+      type: "Manifest"
+    },
+    publications: [],
+    previews: [],
+    settings: {},
+    storage: {
+      type: "manifest-storage",
+      data: manifest
+    },
+    ...details
+  };
+}
+
+// src/ProjectContext.hooks.ts
+var import_presentation_2 = require("@iiif/parser/presentation-2");
+
+// src/helpers/ensure-unique-filename.ts
+var import_slugify2 = __toESM(require_slugify(), 1);
+function ensureUniqueFilename(project, existing) {
+  const filenames = existing.map((project2) => project2.filename);
+  const name = (project.name || project.filename || "Untitled project").toLowerCase();
+  if (project.filename && filenames.indexOf(project.filename) !== -1) {
+    project.filename = void 0;
+  }
+  if (!project.filename) {
+    let counter = 0;
+    while (!project.filename) {
+      const potentialFilename = `${(0, import_slugify2.default)(name, { lower: true })}${counter ? ` (${counter})` : ""}`;
+      if (filenames.indexOf(potentialFilename) === -1) {
+        project.filename = potentialFilename;
+        project.name = `${project.name} (${counter})`;
+        break;
+      }
+      counter++;
+    }
+  }
+}
+
+// src/helpers/project-from-collection.ts
+var import_helpers2 = require("@iiif/helpers");
+var import_slugify3 = __toESM(require_slugify(), 1);
+
+// src/helpers/random-id.ts
+function randomId2() {
+  return `${Math.random().toString(36).substr(2)}-${Date.now().toString(36)}`;
+}
+
+// src/helpers/project-from-collection.ts
+function projectFromCollection(collection, details = {}) {
+  const name = (0, import_helpers2.getValue)(collection.label) || "Untitled collection";
+  return {
+    id: `manifest-editor://project/${randomId2()}`,
+    filename: (0, import_slugify3.default)(name, { lower: true }),
+    name,
+    metadata: {
+      created: Date.now(),
+      modified: Date.now()
+    },
+    resource: {
+      id: collection.id,
+      type: "Collection"
+    },
+    publications: [],
+    previews: [],
+    settings: {},
+    storage: {
+      type: "collection-storage",
+      data: collection
+    },
+    ...details
+  };
+}
+
+// src/ProjectContext.hooks.ts
+var import_client_vault = require("@manifest-editor/client-vault");
+var import_shell = require("@manifest-editor/shell");
+function useProjectActionsWithBackend(dispatch, backend, storage) {
+  async function createProject(payload) {
+    const allProjects = await backend.getAllProjects(true);
+    const project = { ...payload };
+    ensureUniqueFilename(project, allProjects);
+    if (!storage.canCreate()) {
+      throw new Error("Cannot create project with this storage backend");
+    }
+    const backendStorage = await storage.create(project, project.storage.data);
+    const createdProject = { ...project, storage: backendStorage };
+    await backend.createProject(createdProject);
+    dispatch({ type: "createProject", payload: createdProject });
+    switchProject(project.id);
+  }
+  function deleteProject(payload) {
+    if (backend.canDelete()) {
+      dispatch({ type: "deleteProject", payload });
+      backend.deleteProject(payload).then(() => {
+        console.log("Loader: project deleted");
+      });
+    }
+  }
+  function switchProject(payload) {
+    dispatch({ type: "switchProject", payload });
+    backend.setLastProject(payload).then(() => {
+    });
+  }
+  function deselectProject(payload) {
+    dispatch({ type: "deselectProject", payload });
+  }
+  function forkProject(payload) {
+    dispatch({ type: "forkProject", payload });
+    throw new Error("Not implemented yet");
+  }
+  function setLoadingStatus(payload) {
+    dispatch({ type: "setLoadingStatus", payload });
+  }
+  function saveProject(project) {
+    console.log("trying to save project...");
+    dispatch({ type: "saveProject", payload: project });
+    Promise.all([
+      //
+      backend.updateProject(project),
+      storage.saveStorage(project.storage)
+    ]).then(() => {
+      console.log("Loader: project saved");
+    });
+  }
+  function updateDetails(payload) {
+    dispatch({ type: "updateDetails", payload });
+  }
+  function createPublication(payload) {
+    dispatch({ type: "createPublication", payload });
+  }
+  function updatePublication(payload) {
+    dispatch({ type: "updatePublication", payload });
+  }
+  function removePublication(payload) {
+    dispatch({ type: "removePublication", payload });
+  }
+  function updateSettings(payload) {
+    dispatch({ type: "updateSettings", payload });
+  }
+  function updateThumbnail(payload) {
+    dispatch({ type: "updateThumbnail", payload });
+  }
+  function updateStorage(payload) {
+    dispatch({ type: "updateStorage", payload });
+  }
+  function load(payload) {
+    dispatch({ type: "load", payload });
+  }
+  function setPreview(publication) {
+    dispatch({ type: "setPreview", payload: publication });
+  }
+  function removePreview(id) {
+    dispatch({ type: "removePreview", payload: id });
+  }
+  return (0, import_react2.useMemo)(
+    () => ({
+      createProject,
+      deleteProject,
+      switchProject,
+      deselectProject,
+      forkProject,
+      saveProject,
+      setLoadingStatus,
+      load,
+      updateDetails,
+      createPublication,
+      updatePublication,
+      removePublication,
+      updateSettings,
+      updateThumbnail,
+      updateStorage,
+      setPreview,
+      removePreview
+    }),
+    // Dispatch always stable.
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    []
+  );
+}
+function useProjectBackend({ actions, current }, backend) {
+  (0, import_react2.useEffect)(() => {
+    actions.setLoadingStatus({ loading: true, lastLoaded: 0, loaded: false });
+    backend.getAllProjects().then(async (allProjects) => {
+      const lastId = await backend.getLastProject();
+      const lastValid = allProjects.find((s) => s.id === lastId);
+      actions.load({
+        allProjects,
+        current: lastValid || null,
+        loadingStatus: {
+          loaded: true,
+          loading: false,
+          lastLoaded: Date.now()
+        }
+      });
+    });
+  }, []);
+}
+function useProjectLoader({ actions, current }, storage) {
+  const currentRef = (0, import_react2.useRef)(null);
+  const [ready, setIsReady] = (0, import_react2.useState)(false);
+  const [error, setError] = (0, import_react2.useState)("");
+  const saveChanges = (0, import_react2.useCallback)(() => {
+    const project = currentRef.current;
+    if (project) {
+      storage.saveStorage(project.storage).then(() => {
+        const newStorage = storage.getBackendStorage(project);
+        if (!(0, import_shallowequal.default)(newStorage, project.storage)) {
+          actions.saveProject({
+            ...project,
+            storage: newStorage
+          });
+        }
+      });
+    }
+  }, [actions, storage]);
+  const debounceSaveChanges = (0, import_tiny_use_debounce.useDebounce)(saveChanges, storage.saveInterval);
+  const currentId = current?.id;
+  (0, import_react2.useEffect)(() => {
+    currentRef.current = current;
+  }, [current]);
+  const { vault, promise } = (0, import_react2.useMemo)(() => {
+    if (current) {
+      const [vault2, promise2] = storage.createVaultInstance(current);
+      return {
+        vault: vault2,
+        promise: promise2
+      };
+    }
+    return { vault: null, promise: null };
+  }, [storage, currentId]);
+  (0, import_react2.useEffect)(() => {
+    const currentStorage = storage;
+    const currentProject = current;
+    const currentVault = vault;
+    return () => {
+      if (currentVault && currentProject) {
+        currentStorage.closeVaultInstance(currentProject, currentVault);
+      } else if (currentVault instanceof import_client_vault.ClientVault) {
+        currentVault.ws.close();
+      }
+    };
+  }, [storage, current, vault]);
+  (0, import_react2.useEffect)(() => {
+    setIsReady(false);
+    let cancelled = false;
+    if (promise) {
+      promise.then(() => {
+        if (!cancelled) {
+          setIsReady(true);
+        }
+      }).catch((e) => {
+        setError(e.message);
+      });
+    }
+    return () => {
+      cancelled = true;
+    };
+  }, [promise]);
+  (0, import_react2.useEffect)(() => {
+    window.addEventListener("beforeunload", saveChanges, false);
+    return () => {
+      window.removeEventListener("beforeunload", saveChanges);
+    };
+  }, [saveChanges]);
+  (0, import_react2.useEffect)(() => {
+    return () => {
+      saveChanges();
+    };
+  }, [saveChanges, currentId]);
+  (0, import_react2.useEffect)(() => {
+    if (vault && storage.shouldUpdateWithVault()) {
+      return vault.subscribe(debounceSaveChanges, true);
+    }
+  }, [debounceSaveChanges, storage, vault]);
+  return {
+    vault,
+    ready,
+    error
+  };
+}
+function useProjectCreators() {
+  const { actions } = useProjectContext();
+  const createBlankManifest = (0, import_react2.useCallback)(function createBlankManifest2() {
+    actions.createProject(
+      projectFromManifest({
+        "@context": "http://iiif.io/api/presentation/3/context.json",
+        id: `https://example.org/${randomId2()}`,
+        type: "Manifest",
+        label: {
+          en: ["Blank Manifest"]
+        },
+        items: []
+      })
+    );
+  }, []);
+  const createProjectFromManifestId = (0, import_react2.useCallback)(
+    async function createProjectFromManifestId2(id) {
+      let full = await (0, import_shell.getManifestNomalized)(id);
+      if (full) {
+        if (full["@id"]) {
+          full = (0, import_presentation_2.convertPresentation2)(full);
+        }
+        if (full) {
+          actions.createProject(projectFromManifest(full));
+        }
+      }
+    },
+    // Actions are stable.
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    []
+  );
+  const createProjectFromCollectionId = (0, import_react2.useCallback)(
+    async function createProjectFromCollectionId2(id) {
+      let full = await (0, import_shell.getManifestNomalized)(id);
+      if (full) {
+        if (full["@id"]) {
+          full = (0, import_presentation_2.convertPresentation2)(full);
+        }
+        if (full) {
+          actions.createProject(projectFromCollection(full));
+        }
+      }
+    },
+    // Actions are stable.
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    []
+  );
+  const createProjectFromManifestJson = (0, import_react2.useCallback)(
+    async function createProjectFromManifestId2(json) {
+      let full = JSON.parse(json);
+      if (full) {
+        if (full["@id"]) {
+          full = (0, import_presentation_2.convertPresentation2)(full);
+        }
+        if (full) {
+          actions.createProject(projectFromManifest(full));
+        }
+      }
+    },
+    // Actions are stable.
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    []
+  );
+  return {
+    createProjectFromManifestJson,
+    createProjectFromManifestId,
+    createProjectFromCollectionId,
+    createBlankManifest
+  };
+}
+
+// src/ProjectContext.internal.tsx
+var import_react3 = require("react");
+var import_shell2 = require("@manifest-editor/shell");
+
+// src/ProjectContext.reducer.ts
+var import_immer = require("immer");
+var projectContextReducer = (0, import_immer.produce)(function projectContextReducer2(state, action) {
+  if (state.current) {
+    switch (action.type) {
+      case "removePublication":
+        state.current.publications = state.current.publications.filter((p) => p.id !== action.payload);
+        break;
+      case "saveProject":
+        state.current.metadata.modified = Date.now();
+        break;
+      case "updateDetails":
+        state.current.name = action.payload.name;
+        state.current.filename = action.payload.filename;
+        break;
+      case "updateStorage":
+        state.current.storage = action.payload;
+        break;
+      case "createPublication": {
+        if (!state.current.publications.find((s) => s.id === action.payload.id)) {
+          state.current.publications.push(action.payload);
+        }
+        break;
+      }
+      case "updateThumbnail":
+        state.current.thumbnail = action.payload;
+        break;
+      case "updateSettings":
+        state.current.settings = action.payload;
+        break;
+      case "updatePublication": {
+        const found = state.current.publications.find((s) => s.id === action.payload.id);
+        if (found) {
+          found.config = action.payload.config;
+        }
+        break;
+      }
+      case "removePreview": {
+        const existing = state.current.previews?.findIndex((p) => p.id === action.payload);
+        if (existing !== -1) {
+          state.current.previews.splice(existing, 1);
+        }
+        break;
+      }
+      case "setPreview": {
+        const existing = state.current.previews?.findIndex((p) => p.id === action.payload.id);
+        if (existing !== -1) {
+          state.current.previews.splice(existing, 1, action.payload);
+        } else {
+          state.current.previews.push(action.payload);
+        }
+        break;
+      }
+    }
+  }
+  switch (action.type) {
+    case "load": {
+      state.allProjects = action.payload.allProjects;
+      state.current = action.payload.current;
+      state.loadingStatus = action.payload.loadingStatus;
+      break;
+    }
+    case "forkProject":
+      break;
+    case "deleteProject":
+      state.allProjects = state.allProjects.filter((p) => p.id !== action.payload);
+      if (state.current && state.current.id === action.payload) {
+        state.current = null;
+      }
+      break;
+    case "deselectProject":
+      state.current = null;
+      break;
+    case "createProject":
+      state.allProjects.push(action.payload);
+      state.current = action.payload;
+      break;
+    case "switchProject":
+      state.current = state.allProjects.find((p) => p.id === action.payload) || null;
+      break;
+    case "setLoadingStatus":
+      state.loadingStatus = action.payload;
+      break;
+  }
+});
+function getDefaultProjectContextState(status = {
+  loading: false,
+  loaded: true,
+  lastLoaded: 0
+}) {
+  return {
+    allProjects: [],
+    current: null,
+    loadingStatus: status
+  };
+}
+
+// src/backend/LocalStorageBackend.ts
+var localforage = __toESM(require("localforage"), 1);
+var LocalStorageBackend = class {
+  constructor(settings) {
+    __publicField(this, "namespace");
+    __publicField(this, "saveInterval");
+    __publicField(this, "storage");
+    this.namespace = settings?.namespace || "default-v1.1";
+    this.saveInterval = 5e3;
+    this.storage = localforage.createInstance({
+      name: "manifest-editor-projects"
+    });
+  }
+  async deleteProject(id) {
+    await this.storage.removeItem(`${this.namespace}/projects/${id}`);
+  }
+  async createProject(project) {
+    const index = await this.getProjectIndex();
+    await this.storage.setItem(`${this.namespace}/projects/${project.id}`, JSON.stringify(project));
+    if (index.indexOf(project.id) === -1) {
+      index.push(project.id);
+      await this.saveProjectIndex(index);
+    }
+  }
+  canDelete() {
+    return true;
+  }
+  async getAllProjects() {
+    try {
+      const index = await this.getProjectIndex();
+      const projects = [];
+      for (const item of index) {
+        if (item === "_index") {
+          continue;
+        }
+        const loaded = await this.storage.getItem(`${this.namespace}/projects/${item}`);
+        if (loaded) {
+          try {
+            projects.push(JSON.parse(loaded));
+          } catch (e) {
+          }
+        }
+      }
+      return projects;
+    } catch (e) {
+      console.error("Error loading from localstorage", e);
+      return [];
+    }
+  }
+  async getLastProject() {
+    return this.storage.getItem(`${this.namespace}/last`);
+  }
+  async setLastProject(id) {
+    await this.storage.setItem(`${this.namespace}/last`, id);
+  }
+  async updateProject(project) {
+    await this.storage.setItem(`${this.namespace}/projects/${project.id}`, JSON.stringify(project));
+  }
+  async saveProjectIndex(index) {
+    await this.storage.setItem(`${this.namespace}/_index`, JSON.stringify(index));
+  }
+  async getProjectIndex() {
+    const json = await this.storage.getItem(`${this.namespace}/_index`);
+    if (!json) {
+      return [];
+    }
+    const index = JSON.parse(json);
+    if (!Array.isArray(index)) {
+      return [];
+    }
+    return index;
+  }
+};
+
+// src/storage/AbstractVaultLoader.ts
+var import_vault = require("@iiif/helpers/vault");
+var AbstractVaultLoader = class {
+  constructor(config = {}) {
+    __publicField(this, "vaults", {});
+    __publicField(this, "saveInterval");
+    this.saveInterval = config.saveInterval || 5e3;
+  }
+  shouldUpdateWithVault() {
+    return true;
+  }
+  canCreate() {
+    return true;
+  }
+  canDelete() {
+    return true;
+  }
+  createVaultInstance(project) {
+    const foundVault = this.vaults[project.storage.data.key];
+    if (foundVault) {
+      return [foundVault, Promise.resolve()];
+    }
+    const vault = new import_vault.Vault();
+    const promise = async () => {
+      const data = await this.getStorage(project.storage);
+      await vault.loadManifest(project.resource.id, JSON.parse(JSON.stringify(data?.data)));
+      this.vaults[project.storage.data.key] = vault;
+    };
+    return [vault, promise()];
+  }
+  closeVaultInstance(project, vault) {
+  }
+  async saveStorage(storage) {
+    const vault = this.vaults[storage.data.key];
+    const manifestRef = {
+      id: storage.data.id,
+      type: storage.data.type
+    };
+    if (vault) {
+      const data = vault.toPresentation3(manifestRef);
+      const stored = data.type === "Collection" ? {
+        type: "collection-storage",
+        data
+      } : {
+        type: "manifest-storage",
+        data
+      };
+      await this.saveStorageData(stored, storage);
+    }
+  }
+};
+
+// src/storage/LocalStorageLoader.ts
+var import_localforage = __toESM(require("localforage"), 1);
+var LocalStorageLoader = class extends AbstractVaultLoader {
+  constructor(settings) {
+    super({ saveInterval: 5e3 });
+    __publicField(this, "type", "local-storage");
+    __publicField(this, "namespace");
+    __publicField(this, "storage");
+    __publicField(this, "vaults", {});
+    this.namespace = settings?.namespace || "default";
+    this.storage = import_localforage.default.createInstance({
+      name: "local-storage-resource-loader"
+    });
+  }
+  shouldUpdateWithVault() {
+    return true;
+  }
+  async create(project, data) {
+    const key = randomId2();
+    await localStorage.setItem(`${this.namespace}/store/${key}`, JSON.stringify(data));
+    return {
+      type: "resource-keyed-storage",
+      data: {
+        id: data.id,
+        type: data.type,
+        key
+      }
+    };
+  }
+  async getStorage(storage) {
+    try {
+      const item = await localStorage.getItem(`${this.namespace}/store/${storage.data.key}`);
+      const manifest = item ? JSON.parse(item) : null;
+      invariant(manifest, "Resource not found");
+      if (manifest.type === "Collection") {
+        return {
+          type: "collection-storage",
+          data: manifest
+        };
+      }
+      return {
+        type: "manifest-storage",
+        data: manifest
+      };
+    } catch (e) {
+      return null;
+    }
+  }
+  async saveStorageData(manifestStorage, storage) {
+    await localStorage.setItem(`${this.namespace}/store/${storage.data.key}`, JSON.stringify(manifestStorage.data));
+  }
+  async deleteStorage(storage) {
+    this.vaults[storage.data.key] = null;
+    await localStorage.removeItem(`${this.namespace}/store/${storage.data.key}`);
+  }
+  getBackendStorage(project) {
+    return project.storage;
+  }
+};
+
+// src/ProjectContext.internal.tsx
+var import_react_iiif_vault = require("react-iiif-vault");
+var import_jsx_runtime = require("react/jsx-runtime");
+function ProjectProvider(props) {
+  const { currentApp, changeApp } = (0, import_shell2.useApps)();
+  const backend = (0, import_react3.useMemo)(() => props.backend || new LocalStorageBackend(), []);
+  const storage = (0, import_react3.useMemo)(() => props.storage || new LocalStorageLoader(), []);
+  const [state, dispatch] = (0, import_react3.useReducer)(
+    projectContextReducer,
+    void 0,
+    props.initialState || getDefaultProjectContextState
+  );
+  const actions = useProjectActionsWithBackend(dispatch, backend, storage);
+  const context = (0, import_react3.useMemo)(
+    () => ({ actions, canDelete: backend.canDelete(), ...state }),
+    [actions, backend, state]
+  );
+  const { vault, ready, error } = useProjectLoader(context, storage);
+  const manifestOrCollection = context.current?.resource;
+  const loadingStatus = (0, import_react3.useMemo)(() => {
+    return { isLoading: !ready, isError: !!error, error };
+  }, [ready, error]);
+  useProjectBackend(context, backend);
+  (0, import_react3.useEffect)(() => {
+    if (state.loadingStatus && state.loadingStatus.loaded && ready && (!vault || !manifestOrCollection) && currentApp?.id !== (props.defaultApp || "splash")) {
+      changeApp({ id: props.defaultApp || "splash" });
+    }
+  }, []);
+  if (state.loadingStatus && state.loadingStatus.loading || context.current && !manifestOrCollection) {
+    return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { children: "Loading..." });
+  }
+  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ProjectLoadingReactContext.Provider, { value: loadingStatus, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ProjectReactContext.Provider, { value: context, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_iiif_vault.VaultProvider, { vault: vault || void 0, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_shell2.AppResourceInstanceProvider, { id: context.current?.id, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_shell2.AppResourceProvider, { resource: manifestOrCollection, children: props.children }) }) }, state.current?.id) }) });
+}
+
+// ../ui/icons/MenuIcon.tsx
+var import_jsx_runtime2 = require("react/jsx-runtime");
+var MenuIcon = () => /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)("svg", { xmlns: "http://www.w3.org/2000/svg", height: "1rem", viewBox: "0 0 24 24", width: "24px", fill: "#000000", children: [
+  /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M0 0h24v24H0z", fill: "none" }),
+  /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("path", { d: "M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z" })
+] });
+
+// ../ui/atoms/Dropdown.tsx
+var import_styled_components2 = __toESM(require("styled-components"), 1);
+
+// ../ui/atoms/Button.tsx
+var import_styled_components = __toESM(require("styled-components"), 1);
+var ButtonReset = import_styled_components.default.button`
+  border: none;
+  outline: none;
+  background-color: transparent;
+  margin: 0;
+  padding: 0;
+  font-size: inherit;
+  color: inherit;
+  cursor: pointer;
+  &:hover {
+    color: inherit;
+  }
+`;
+var Button = import_styled_components.default.button`
+  padding: 0.5rem 1rem;
+  color: ${(props) => props.theme.color.main || "none"};
+  background-color: ${(props) => props.theme.color.white || "white"};
+  border-radius: inherit;
+  border: none;
+  cursor: pointer;
+  display: flex;
+  align-items: center;
+  font-size: 0.85em;
+  :disabled {
+    opacity: 0.65;
+    cursor: not-allowed;
+  }
+
+  &:hover {
+    background: #eee;
+  }
+`;
+var SmallButton = (0, import_styled_components.default)(Button)`
+  padding: 0.25em ${(props) => props.theme.padding.xs || "0.4em"};
+  height: unset;
+  background: none;
+`;
+var SecondaryButton = (0, import_styled_components.default)(Button)`
+   {
+    padding: 0 ${(props) => props.theme.padding.medium || "1rem"};
+    color: ${(props) => props.theme.color.main || "#B84C74;"};
+    background-color: ${(props) => props.theme.color.white || "white"};
+    border: 1px solid ${(props) => props.theme.color.main || "#B84C74;"};
+    border-radius: 0.25rem;
+    cursor: pointer;
+    height: 2rem;
+    display: flex;
+    align-items: center;
+    white-space: nowrap;
+    font-size: 0.75rem;
+
+    :disabled {
+      opacity: 0.65;
+      cursor: not-allowed;
+    }
+  }
+`;
+var CalltoButton = (0, import_styled_components.default)(Button)`
+  padding: 0 ${(props) => props.theme.padding.medium || "1rem"};
+  color: ${(props) => props.theme.color.white || "white"};
+  background-color: ${(props) => props.theme.color.main || "#B84C74;"};
+  border: 1px solid #eee;
+  border-radius: 0.25rem;
+  cursor: pointer;
+  justify-content: center;
+  display: flex;
+  align-items: center;
+  &:hover {
+    background-color: ${(props) => props.theme.color.mainHover || "#B84C74;"};
+  }
+`;
+var ButtonGroup = import_styled_components.default.div`
+  display: flex;
+  flex-direction: row;
+  flex-wrap: wrap;
+  align-items: flex-start;
+  justify-content: ${(props) => props.$right ? "flex-end" : "flex-start"};
+`;
+
+// ../ui/atoms/Dropdown.tsx
+var Dropdown = import_styled_components2.default.div`
+  position: relative;
+  display: inline-block;
+`;
+var DropdownContent = import_styled_components2.default.div`
+  display: flex;
+  flex-direction: column;
+  position: absolute;
+  background-color: ${(props) => props.theme.color.white || "white"};
+  color: ${(props) => props.theme.color.black || " black"};
+  font-size: 0.75rem;
+  min-width: 160px;
+  box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
+  z-index: 150;
+  button {
+    &:hover {
+      background-color: ${(props) => props.theme.color.lightgrey || "lightgrey"};
+    }
+  }
+`;
+var DropdownItem = import_styled_components2.default.button`
+  padding: 0 ${(props) => props.theme.padding.small || "0.5rem"};
+  color: ${(props) => props.theme.color.main || "none"};
+  background-color: ${(props) => props.theme.color.white || "white"};
+  border-radius: 0;
+  border: none;
+  cursor: pointer;
+  display: flex;
+  padding: 0.65em 1em;
+  align-items: center;
+  :disabled {
+    opacity: 0.65;
+    cursor: not-allowed;
+  }
+
+  &:hover {
+    background-color: ${(props) => props.theme.color.lightgrey || "lightgrey"};
+  }
+
+  ${(props) => props.$active && import_styled_components2.css`
+      background: #b84c74;
+      color: #fff;
+      &:hover {
+        background: #b84c74;
+        color: #fff;
+      }
+    `}
+`;
+var DropdownMenu = import_styled_components2.default.div`
+  display: none;
+  flex-direction: column;
+  position: absolute;
+  background: #fff;
+  color: ${(props) => props.theme.color.black || " black"};
+  font-size: 0.75rem;
+  min-width: 190px;
+  top: calc(100% + 0.5em);
+  box-shadow:
+    0 4px 15px 0 rgba(0, 0, 0, 0.18),
+    0 0px 0px 1px rgba(0, 0, 0, 0.15),
+    inset 0 0 0 1px rgba(255, 255, 255, 0.2);
+  border-radius: 3px;
+  z-index: 150;
+  overflow: hidden;
+  padding-bottom: 3px;
+
+  ${Button} {
+    &:hover {
+      background-color: ${(props) => props.theme.color.lightgrey || "lightgrey"};
+    }
+  }
+
+  ${(props) => props.$open && import_styled_components2.css`
+      display: flex;
+    `}
+`;
+var DropdownLabel = import_styled_components2.default.div`
+  color: #999;
+  text-transform: uppercase;
+  font-weight: 600;
+  padding: 0.7em;
+  font-size: 0.875em;
+`;
+var DropdownDivider = import_styled_components2.default.div`
+  height: 1px;
+  margin: 0 0.5em;
+  background: #eee;
+`;
+
+// ../ui/madoc/use-local-storage.ts
+var import_react4 = require("react");
+
+// ../../node_modules/.pnpm/mitt@3.0.1/node_modules/mitt/dist/mitt.mjs
+function mitt_default(n) {
+  return { all: n = n || /* @__PURE__ */ new Map(), on: function(t, e) {
+    var i = n.get(t);
+    i ? i.push(e) : n.set(t, [e]);
+  }, off: function(t, e) {
+    var i = n.get(t);
+    i && (e ? i.splice(i.indexOf(e) >>> 0, 1) : n.set(t, []));
+  }, emit: function(t, e) {
+    var i = n.get(t);
+    i && i.slice().map(function(n2) {
+      n2(e);
+    }), (i = n.get("*")) && i.slice().map(function(n2) {
+      n2(t, e);
+    });
+  } };
+}
+
+// ../ui/madoc/use-local-storage.ts
+globalThis.MS_LS_EMITTER = globalThis.MS_LS_EMITTER || mitt_default();
+var lsEmitter = globalThis.MS_LS_EMITTER;
+function useLocalStorage(key, initialValue) {
+  const lastStoredValue = (0, import_react4.useRef)();
+  if (!lastStoredValue.current && initialValue) {
+    lastStoredValue.current = JSON.stringify(initialValue);
+  }
+  const [storedValue, setStoredValue] = (0, import_react4.useState)(() => {
+    try {
+      if (typeof window === "undefined" || typeof window.localStorage === "undefined") {
+        return initialValue;
+      }
+      const item = window.localStorage.getItem(key);
+      if (item) {
+        lastStoredValue.current = item;
+      }
+      return item ? JSON.parse(item) : initialValue;
+    } catch (error) {
+      console.log(error);
+      return initialValue;
+    }
+  });
+  const setValue = (value) => {
+    try {
+      if (typeof window !== "undefined" && typeof window.localStorage !== "undefined") {
+        let prev = initialValue;
+        try {
+          prev = typeof lastStoredValue.current === "undefined" ? initialValue : JSON.parse(lastStoredValue.current);
+        } catch (e) {
+        }
+        const valueToStore = value instanceof Function ? value(prev) : value;
+        setStoredValue(valueToStore);
+        const valueJson = JSON.stringify(valueToStore);
+        window.localStorage.setItem(key, valueJson);
+        if (valueJson !== lastStoredValue.current) {
+          lastStoredValue.current = valueJson;
+          lsEmitter.emit(`change:${key}`, { valueJson });
+        }
+      }
+    } catch (error) {
+      console.log(error);
+    }
+  };
+  (0, import_react4.useEffect)(() => {
+    const listener = ({ valueJson }) => {
+      if (valueJson && valueJson !== lastStoredValue.current) {
+        try {
+          setStoredValue(JSON.parse(valueJson));
+          lastStoredValue.current = valueJson;
+        } catch (e) {
+        }
+      }
+    };
+    lsEmitter.on(`change:${key}`, listener);
+    return () => {
+      lsEmitter.off(`change:${key}`, listener);
+    };
+  }, [key]);
+  return [storedValue, setValue, lastStoredValue];
+}
+
+// src/components/AppMenu.tsx
+var import_react_accessible_dropdown_menu_hook = __toESM(require("react-accessible-dropdown-menu-hook"), 1);
+var import_shell3 = require("@manifest-editor/shell");
+var import_styled_components3 = __toESM(require("styled-components"), 1);
+var import_jsx_runtime3 = require("react/jsx-runtime");
+var IconButton = import_styled_components3.default.button`
+  height: 1.75em;
+  width: 1.75em;
+  background: #e9e9e9;
+  border-radius: 3px;
+  display: flex;
+  text-align: center;
+  align-items: center;
+  font-size: 1.1em;
+  border: none;
+  justify-content: center;
+
+  &:focus {
+    background: #e94581;
+    color: #fff;
+    svg {
+      fill: #fff;
+    }
+  }
+`;
+function AppMenu(props) {
+  const { current: currentProject } = useProjectContext();
+  const [isMenuHidden, setIsMenuHidden] = useLocalStorage("menu-hidden");
+  const { apps, changeApp } = (0, import_shell3.useApps)();
+  const type = currentProject?.resource.type;
+  const filteredApps = Object.values(apps).filter((app) => {
+    if (app.metadata.project && app.metadata.projectType !== type) {
+      return false;
+    }
+    if (!currentProject && app.metadata.project) {
+      return false;
+    }
+    if (app.metadata.type === "launcher") {
+      return false;
+    }
+    return true;
+  });
+  const { itemProps, buttonProps, isOpen, setIsOpen } = (0, import_react_accessible_dropdown_menu_hook.default)(filteredApps.length + 1);
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(Dropdown, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(IconButton, { ...buttonProps, children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(MenuIcon, {}) }),
+    /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(DropdownMenu, { $open: isOpen, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(DropdownLabel, { children: "Apps" }),
+      /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(DropdownDivider, {}),
+      filteredApps.map((app, key) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+        Button,
+        {
+          ...itemProps[key],
+          onClick: () => {
+            changeApp({ id: app.metadata.id });
+            setIsOpen(false);
+          },
+          children: app.metadata.title
+        },
+        app.metadata.id
+      )),
+      props.hideMenu ? null : /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)(import_jsx_runtime3.Fragment, { children: [
+        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(DropdownLabel, { children: "Quick Settings" }),
+        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(DropdownDivider, {}),
+        /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(Button, { ...itemProps[filteredApps.length + 0], onClick: () => setIsMenuHidden(!isMenuHidden), children: isMenuHidden ? "Show menu" : "Hide menu" })
+      ] })
+    ] })
+  ] });
+}
+
+// src/components/DraftTitleEditor.tsx
+var import_react5 = require("react");
+var import_react_dom = require("react-dom");
+var import_styled_components4 = __toESM(require("styled-components"), 1);
+var import_jsx_runtime4 = require("react/jsx-runtime");
+var Draft = import_styled_components4.default.div`
+  display: flex;
+  flex-direction: row;
+  flex: 1;
+  padding: 0.28em;
+  padding-left: 0.5em;
+  align-items: center;
+  overflow: hidden;
+`;
+var DraftsText = import_styled_components4.default.div`
+  color: #828282;
+  padding-right: 1em;
+`;
+var DraftTitleEdit = import_styled_components4.default.form`
+  margin: 0;
+  padding: 0;
+  display: flex;
+  flex: 1;
+`;
+var DraftTitleEditInput = import_styled_components4.default.input`
+  font-size: 1em;
+  flex: 1;
+  border: 1px solid #999;
+  padding: 0.2em;
+  margin: -0.2em 0;
+`;
+var DraftTitleEditButton = (0, import_styled_components4.default)(SmallButton)`
+  font-size: 1em;
+  display: inline-block;
+`;
+var DraftTitle = import_styled_components4.default.div`
+  color: #333;
+  flex: 1;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  overflow: hidden;
+`;
+function DraftTitleEditor() {
+  const { actions, current } = useProjectContext();
+  const [editingTitle, setIsEditingTitle] = (0, import_react5.useState)(false);
+  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(Draft, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(DraftsText, { children: "Drafts" }),
+    current ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(import_jsx_runtime4.Fragment, { children: editingTitle ? /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
+      DraftTitleEdit,
+      {
+        onSubmit: (e) => {
+          const form = new FormData(e.target);
+          const data = Object.fromEntries(form.entries());
+          actions.updateDetails(data);
+          setIsEditingTitle(false);
+        },
+        children: [
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(DraftTitleEditInput, { id: "project-title", defaultValue: current.name, name: "name" }),
+          /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(DraftTitleEditButton, { children: "Save" })
+        ]
+      }
+    ) : /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
+      DraftTitle,
+      {
+        onClick: () => {
+          (0, import_react_dom.flushSync)(() => {
+            setIsEditingTitle(true);
+          });
+          document.getElementById("project-title")?.focus();
+        },
+        children: current.name || "Untitled project"
+      }
+    ) }) : null
+  ] });
+}