update

packages/hackmd/dist/hackmd-agent.js

@@ -0,0 +1,360 @@
+function K(r) {
+  return r && r.__esModule && Object.prototype.hasOwnProperty.call(r, "default") ? r.default : r;
+}
+var $ = { exports: {} }, d = {};
+Object.defineProperty(d, "__esModule", {
+  value: !0
+});
+d.DATA_CLONE_ERROR = d.MESSAGE = d.REJECTED = d.FULFILLED = d.REPLY = d.CALL = d.HANDSHAKE_REPLY = d.HANDSHAKE = void 0;
+const B = "handshake";
+d.HANDSHAKE = B;
+const j = "handshake-reply";
+d.HANDSHAKE_REPLY = j;
+const J = "call";
+d.CALL = J;
+const W = "reply";
+d.REPLY = W;
+const k = "fulfilled";
+d.FULFILLED = k;
+const q = "rejected";
+d.REJECTED = q;
+const Q = "message";
+d.MESSAGE = Q;
+const X = "DataCloneError";
+d.DATA_CLONE_ERROR = X;
+var S = {};
+Object.defineProperty(S, "__esModule", {
+  value: !0
+});
+S.ERR_NO_IFRAME_SRC = S.ERR_NOT_IN_IFRAME = S.ERR_CONNECTION_TIMEOUT = S.ERR_CONNECTION_DESTROYED = void 0;
+const Z = "ConnectionDestroyed";
+S.ERR_CONNECTION_DESTROYED = Z;
+const ee = "ConnectionTimeout";
+S.ERR_CONNECTION_TIMEOUT = ee;
+const re = "NotInIframe";
+S.ERR_NOT_IN_IFRAME = re;
+const te = "NoIframeSrc";
+S.ERR_NO_IFRAME_SRC = te;
+var F = { exports: {} };
+(function(r, e) {
+  Object.defineProperty(e, "__esModule", {
+    value: !0
+  }), e.default = void 0;
+  var t = () => {
+    const n = [];
+    let u = !1;
+    return {
+      destroy() {
+        u = !0, n.forEach((a) => {
+          a();
+        });
+      },
+      onDestroy(a) {
+        u ? a() : n.push(a);
+      }
+    };
+  };
+  e.default = t, r.exports = e.default;
+})(F, F.exports);
+var ne = F.exports, H = { exports: {} }, M = {};
+Object.defineProperty(M, "__esModule", {
+  value: !0
+});
+M.deserializeError = M.serializeError = void 0;
+const oe = (r) => {
+  let e = r.name, t = r.message, n = r.stack;
+  return {
+    name: e,
+    message: t,
+    stack: n
+  };
+};
+M.serializeError = oe;
+const ae = (r) => {
+  const e = new Error();
+  return Object.keys(r).forEach((t) => e[t] = r[t]), e;
+};
+M.deserializeError = ae;
+(function(r, e) {
+  Object.defineProperty(e, "__esModule", {
+    value: !0
+  }), e.default = void 0;
+  var t = d, n = M, u = (a, v, O) => {
+    const i = a.localName, f = a.local, s = a.remote, h = a.originForSending, p = a.originForReceiving;
+    let g = !1;
+    O(`${i}: Connecting call receiver`);
+    const L = (_) => {
+      if (_.source !== s || _.data.penpal !== t.CALL)
+        return;
+      if (_.origin !== p) {
+        O(`${i} received message from origin ${_.origin} which did not match expected origin ${p}`);
+        return;
+      }
+      const m = _.data, C = m.methodName, l = m.args, T = m.id;
+      O(`${i}: Received ${C}() call`);
+      const E = (c) => (R) => {
+        if (O(`${i}: Sending ${C}() reply`), g) {
+          O(`${i}: Unable to send ${C}() reply due to destroyed connection`);
+          return;
+        }
+        const N = {
+          penpal: t.REPLY,
+          id: T,
+          resolution: c,
+          returnValue: R
+        };
+        c === t.REJECTED && R instanceof Error && (N.returnValue = (0, n.serializeError)(R), N.returnValueIsError = !0);
+        try {
+          s.postMessage(N, h);
+        } catch (D) {
+          throw D.name === t.DATA_CLONE_ERROR && s.postMessage({
+            penpal: t.REPLY,
+            id: T,
+            resolution: t.REJECTED,
+            returnValue: (0, n.serializeError)(D),
+            returnValueIsError: !0
+          }, h), D;
+        }
+      };
+      new Promise((c) => c(v[C].apply(v, l))).then(E(t.FULFILLED), E(t.REJECTED));
+    };
+    return f.addEventListener(t.MESSAGE, L), () => {
+      g = !0, f.removeEventListener(t.MESSAGE, L);
+    };
+  };
+  e.default = u, r.exports = e.default;
+})(H, H.exports);
+var ie = H.exports, b = { exports: {} }, x = { exports: {} };
+(function(r, e) {
+  Object.defineProperty(e, "__esModule", {
+    value: !0
+  }), e.default = void 0;
+  let t = 0;
+  var n = () => ++t;
+  e.default = n, r.exports = e.default;
+})(x, x.exports);
+var de = x.exports;
+(function(r, e) {
+  Object.defineProperty(e, "__esModule", {
+    value: !0
+  }), e.default = void 0;
+  var t = d, n = S, u = v(de), a = M;
+  function v(i) {
+    return i && i.__esModule ? i : { default: i };
+  }
+  var O = (i, f, s, h, p) => {
+    const g = f.localName, L = f.local, _ = f.remote, m = f.originForSending, C = f.originForReceiving;
+    let l = !1;
+    p(`${g}: Connecting call sender`);
+    const T = (E) => function() {
+      for (var c = arguments.length, R = new Array(c), N = 0; N < c; N++)
+        R[N] = arguments[N];
+      p(`${g}: Sending ${E}() call`);
+      let D;
+      try {
+        _.closed && (D = !0);
+      } catch {
+        D = !0;
+      }
+      if (D && h(), l) {
+        const w = new Error(`Unable to send ${E}() call due to destroyed connection`);
+        throw w.code = n.ERR_CONNECTION_DESTROYED, w;
+      }
+      return new Promise((w, P) => {
+        const y = (0, u.default)(), A = (o) => {
+          if (o.source !== _ || o.data.penpal !== t.REPLY || o.data.id !== y)
+            return;
+          if (o.origin !== C) {
+            p(`${g} received message from origin ${o.origin} which did not match expected origin ${C}`);
+            return;
+          }
+          p(`${g}: Received ${E}() reply`), L.removeEventListener(t.MESSAGE, A);
+          let I = o.data.returnValue;
+          o.data.returnValueIsError && (I = (0, a.deserializeError)(I)), (o.data.resolution === t.FULFILLED ? w : P)(I);
+        };
+        L.addEventListener(t.MESSAGE, A), _.postMessage({
+          penpal: t.CALL,
+          id: y,
+          methodName: E,
+          args: R
+        }, m);
+      });
+    };
+    return s.reduce((E, c) => (E[c] = T(c), E), i), () => {
+      l = !0;
+    };
+  };
+  e.default = O, r.exports = e.default;
+})(b, b.exports);
+var ce = b.exports, Y = { exports: {} };
+(function(r, e) {
+  Object.defineProperty(e, "__esModule", {
+    value: !0
+  }), e.default = void 0;
+  var t = (n) => function() {
+    if (n) {
+      for (var u = arguments.length, a = new Array(u), v = 0; v < u; v++)
+        a[v] = arguments[v];
+      console.log("[Penpal]", ...a);
+    }
+  };
+  e.default = t, r.exports = e.default;
+})(Y, Y.exports);
+var se = Y.exports;
+(function(r, e) {
+  Object.defineProperty(e, "__esModule", {
+    value: !0
+  }), e.default = void 0;
+  var t = d, n = S, u = i(ne), a = i(ie), v = i(ce), O = i(se);
+  function i(s) {
+    return s && s.__esModule ? s : { default: s };
+  }
+  var f = function() {
+    let h = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {}, p = h.parentOrigin, g = p === void 0 ? "*" : p, L = h.methods, _ = L === void 0 ? {} : L, m = h.timeout, C = h.debug;
+    const l = (0, O.default)(C);
+    if (window === window.top) {
+      const w = new Error("connectToParent() must be called within an iframe");
+      throw w.code = n.ERR_NOT_IN_IFRAME, w;
+    }
+    const T = (0, u.default)(), E = T.destroy, c = T.onDestroy, R = window, N = R.parent;
+    return {
+      promise: new Promise((w, P) => {
+        let y;
+        m !== void 0 && (y = setTimeout(() => {
+          const o = new Error(`Connection to parent timed out after ${m}ms`);
+          o.code = n.ERR_CONNECTION_TIMEOUT, P(o), E();
+        }, m));
+        const A = (o) => {
+          try {
+            clearTimeout();
+          } catch {
+            return;
+          }
+          if (o.source !== N || o.data.penpal !== t.HANDSHAKE_REPLY)
+            return;
+          if (g !== "*" && g !== o.origin) {
+            l(`Child received handshake reply from origin ${o.origin} which did not match expected origin ${g}`);
+            return;
+          }
+          l("Child: Received handshake reply"), R.removeEventListener(t.MESSAGE, A);
+          const I = {
+            localName: "Child",
+            local: R,
+            remote: N,
+            originForSending: o.origin === "null" ? "*" : o.origin,
+            originForReceiving: o.origin
+          }, V = {}, z = (0, a.default)(I, _, l);
+          c(z);
+          const U = (0, v.default)(V, I, o.data.methodNames, E, l);
+          c(U), clearTimeout(y), w(V);
+        };
+        R.addEventListener(t.MESSAGE, A), c(() => {
+          R.removeEventListener(t.MESSAGE, A);
+          const o = new Error("Connection destroyed");
+          o.code = n.ERR_CONNECTION_DESTROYED, P(o);
+        }), l("Child: Sending handshake"), N.postMessage({
+          penpal: t.HANDSHAKE,
+          methodNames: Object.keys(_)
+        }, g);
+      }),
+      destroy: E
+    };
+  };
+  e.default = f, r.exports = e.default;
+})($, $.exports);
+var le = $.exports;
+const ue = /* @__PURE__ */ K(le);
+function Ee(r, e, t) {
+  var n = t || {}, u = n.noTrailing, a = u === void 0 ? !1 : u, v = n.noLeading, O = v === void 0 ? !1 : v, i = n.debounceMode, f = i === void 0 ? void 0 : i, s, h = !1, p = 0;
+  function g() {
+    s && clearTimeout(s);
+  }
+  function L(m) {
+    var C = m || {}, l = C.upcomingOnly, T = l === void 0 ? !1 : l;
+    g(), h = !T;
+  }
+  function _() {
+    for (var m = arguments.length, C = new Array(m), l = 0; l < m; l++)
+      C[l] = arguments[l];
+    var T = this, E = Date.now() - p;
+    if (h)
+      return;
+    function c() {
+      p = Date.now(), e.apply(T, C);
+    }
+    function R() {
+      s = void 0;
+    }
+    !O && f && !s && c(), g(), f === void 0 && E > r ? O ? (p = Date.now(), a || (s = setTimeout(f ? R : c, r))) : c() : a !== !0 && (s = setTimeout(f ? R : c, f === void 0 ? r - E : r));
+  }
+  return _.cancel = L, _;
+}
+function fe(r, e, t) {
+  var n = t || {}, u = n.atBegin, a = u === void 0 ? !1 : u;
+  return Ee(r, e, {
+    debounceMode: a !== !1
+  });
+}
+const ge = !1, _e = "<%= origin %>";
+function Re() {
+  return window.editor.doc.getValue();
+}
+function G(r) {
+  window.editor.doc.setValue(r);
+}
+function ve(r) {
+  if (window.cmClient != null) {
+    G(r);
+    return;
+  }
+  const e = setInterval(() => {
+    window.cmClient != null && (clearInterval(e), G(r));
+  }, 250);
+}
+function pe(r) {
+  window.growi.notifyBodyChanges(r);
+}
+const me = fe(800, pe);
+function Ce(r) {
+  window.growi.saveWithShortcut(r);
+}
+function Oe() {
+  const r = window.CodeMirror, e = window.editor;
+  r == null || e == null || (e.on("change", (t, n) => {
+    n.origin !== "ignoreHistory" && me(t.doc.getValue());
+  }), r.commands.save = function(t) {
+    Ce(t.doc.getValue());
+  }, delete e.options.extraKeys["Cmd-S"], delete e.options.extraKeys["Ctrl-S"]);
+}
+function he() {
+  ue({
+    parentOrigin: _e,
+    // Methods child is exposing to parent
+    methods: {
+      getValue() {
+        return Re();
+      },
+      setValue(e) {
+        G(e);
+      },
+      setValueOnInit(e) {
+        ve(e);
+      }
+    },
+    debug: ge
+  }).promise.then((e) => {
+    window.growi = e;
+  }).catch((e) => {
+    console.log(e);
+  });
+}
+(function() {
+  if (window === window.parent) {
+    console.log("[GROWI] Loading agent for HackMD is not processed because currently not in iframe");
+    return;
+  }
+  console.log("[HackMD] Loading GROWI agent for HackMD..."), window.addEventListener("load", () => {
+    Oe();
+  }), he(), console.log("[HackMD] GROWI agent for HackMD has successfully loaded.");
+})();
+//# sourceMappingURL=hackmd-agent.js.map

packages/hackmd/dist/hackmd-styles.cjs

@@ -0,0 +1,2 @@
+"use strict";const n="<%= styles %>";function s(){const e=document.createElement("style");e.appendChild(document.createTextNode(unescape(n))),document.getElementsByTagName("head")[0].appendChild(e)}(function(){if(window===window.parent){console.log("[GROWI] Loading styles for HackMD is not processed because currently not in iframe");return}console.log("[HackMD] Loading GROWI styles for HackMD..."),s(),console.log("[HackMD] GROWI styles for HackMD has successfully loaded.")})();
+//# sourceMappingURL=hackmd-styles.cjs.map

packages/hackmd/dist/hackmd-styles.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"hackmd-styles.cjs","sources":["../src/hackmd-styles.ts"],"sourcesContent":["/**\n * GROWI styles loader for HackMD\n *\n * This file will be transpiled as a single JS\n *  and should be load from HackMD head via 'routes/hackmd.js' route\n *\n * USAGE:\n *  <script src=\"${hostname of GROWI}/_hackmd/load-styles\"></script>\n *\n * @author Yuki Takei <yuki@weseek.co.jp>\n */\n\n/* eslint-disable no-console  */\n\nconst styles = '<%= styles %>'; // will be replaced by ejs\n\n/**\n * Insert link tag to load style file\n */\nfunction insertStyle() {\n  const element = document.createElement('style');\n  element.appendChild(document.createTextNode(unescape(styles)));\n  document.getElementsByTagName('head')[0].appendChild(element);\n}\n\n/**\n * main\n */\n(function() {\n  // check HackMD is in iframe\n  if (window === window.parent) {\n    console.log('[GROWI] Loading styles for HackMD is not processed because currently not in iframe');\n    return;\n  }\n\n  console.log('[HackMD] Loading GROWI styles for HackMD...');\n\n  insertStyle();\n\n  console.log('[HackMD] GROWI styles for HackMD has successfully loaded.');\n}());\n"],"names":["styles","insertStyle","element"],"mappings":"aAcA,MAAMA,EAAS,gBAKf,SAASC,GAAc,CACf,MAAAC,EAAU,SAAS,cAAc,OAAO,EAC9CA,EAAQ,YAAY,SAAS,eAAe,SAASF,CAAM,CAAC,CAAC,EAC7D,SAAS,qBAAqB,MAAM,EAAE,CAAC,EAAE,YAAYE,CAAO,CAC9D,EAKC,UAAW,CAEN,GAAA,SAAW,OAAO,OAAQ,CAC5B,QAAQ,IAAI,oFAAoF,EAChG,MACF,CAEA,QAAQ,IAAI,6CAA6C,EAE7CD,IAEZ,QAAQ,IAAI,2DAA2D,CACzE,GAAE"}

packages/hackmd/dist/hackmd-styles.d.ts

@@ -0,0 +1,16 @@
+/**
+ * GROWI styles loader for HackMD
+ *
+ * This file will be transpiled as a single JS
+ *  and should be load from HackMD head via 'routes/hackmd.js' route
+ *
+ * USAGE:
+ *  <script src="${hostname of GROWI}/_hackmd/load-styles"></script>
+ *
+ * @author Yuki Takei <yuki@weseek.co.jp>
+ */
+declare const styles = "<%= styles %>";
+/**
+ * Insert link tag to load style file
+ */
+declare function insertStyle(): void;

packages/hackmd/dist/hackmd-styles.js

@@ -0,0 +1,13 @@
+const n = "<%= styles %>";
+function o() {
+  const e = document.createElement("style");
+  e.appendChild(document.createTextNode(unescape(n))), document.getElementsByTagName("head")[0].appendChild(e);
+}
+(function() {
+  if (window === window.parent) {
+    console.log("[GROWI] Loading styles for HackMD is not processed because currently not in iframe");
+    return;
+  }
+  console.log("[HackMD] Loading GROWI styles for HackMD..."), o(), console.log("[HackMD] GROWI styles for HackMD has successfully loaded.");
+})();
+//# sourceMappingURL=hackmd-styles.js.map

packages/hackmd/dist/hackmd-styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"hackmd-styles.js","sources":["../src/hackmd-styles.ts"],"sourcesContent":["/**\n * GROWI styles loader for HackMD\n *\n * This file will be transpiled as a single JS\n *  and should be load from HackMD head via 'routes/hackmd.js' route\n *\n * USAGE:\n *  <script src=\"${hostname of GROWI}/_hackmd/load-styles\"></script>\n *\n * @author Yuki Takei <yuki@weseek.co.jp>\n */\n\n/* eslint-disable no-console  */\n\nconst styles = '<%= styles %>'; // will be replaced by ejs\n\n/**\n * Insert link tag to load style file\n */\nfunction insertStyle() {\n  const element = document.createElement('style');\n  element.appendChild(document.createTextNode(unescape(styles)));\n  document.getElementsByTagName('head')[0].appendChild(element);\n}\n\n/**\n * main\n */\n(function() {\n  // check HackMD is in iframe\n  if (window === window.parent) {\n    console.log('[GROWI] Loading styles for HackMD is not processed because currently not in iframe');\n    return;\n  }\n\n  console.log('[HackMD] Loading GROWI styles for HackMD...');\n\n  insertStyle();\n\n  console.log('[HackMD] GROWI styles for HackMD has successfully loaded.');\n}());\n"],"names":["styles","insertStyle","element"],"mappings":"AAcA,MAAMA,IAAS;AAKf,SAASC,IAAc;AACf,QAAAC,IAAU,SAAS,cAAc,OAAO;AAC9C,EAAAA,EAAQ,YAAY,SAAS,eAAe,SAASF,CAAM,CAAC,CAAC,GAC7D,SAAS,qBAAqB,MAAM,EAAE,CAAC,EAAE,YAAYE,CAAO;AAC9D;AAAA,CAKC,WAAW;AAEN,MAAA,WAAW,OAAO,QAAQ;AAC5B,YAAQ,IAAI,oFAAoF;AAChG;AAAA,EACF;AAEA,UAAQ,IAAI,6CAA6C,GAE7CD,KAEZ,QAAQ,IAAI,2DAA2D;AACzE,GAAE;"}

packages/hackmd/dist/index.cjs

@@ -0,0 +1,2 @@
+"use strict";const e=require("node:fs"),s=require("node:path"),n=process.env.NODE_ENV==="production",t=n?".":"../dist",r=e.readFileSync(s.resolve(__dirname,`${t}/hackmd-styles.js`)),i=e.readFileSync(s.resolve(__dirname,`${t}/hackmd-agent.js`)),c=e.readFileSync(s.resolve(__dirname,`${t}/style.css`)),o={stylesJS:r.toString(),agentJS:i.toString(),stylesCSS:c.toString().replace(/(\r\n|\n|\r)/gm,"")};module.exports=o;
+//# sourceMappingURL=index.cjs.map

packages/hackmd/dist/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sources":["../src/index.ts"],"sourcesContent":["import fs from 'node:fs';\nimport path from 'node:path';\n\nconst isProduction = process.env.NODE_ENV === 'production';\nconst dirPath = isProduction ? '.' : '../dist';\nconst stylesJSFile = fs.readFileSync(path.resolve(__dirname, `${dirPath}/hackmd-styles.js`));\nconst agentJSFile = fs.readFileSync(path.resolve(__dirname, `${dirPath}/hackmd-agent.js`));\nconst stylesCSSFile = fs.readFileSync(path.resolve(__dirname, `${dirPath}/style.css`));\n\n// export to app as string\nconst hackmdFiles = {\n  stylesJS: stylesJSFile.toString(),\n  agentJS: agentJSFile.toString(),\n  stylesCSS: stylesCSSFile.toString().replace(/(\\r\\n|\\n|\\r)/gm, ''), // https://stackoverflow.com/questions/10805125/how-to-remove-all-line-breaks-from-a-string\n};\nexport default hackmdFiles;\n"],"names":["isProduction","dirPath","stylesJSFile","fs","path","agentJSFile","stylesCSSFile","hackmdFiles"],"mappings":"+DAGMA,EAAe,QAAQ,IAAI,WAAa,aACxCC,EAAUD,EAAe,IAAM,UAC/BE,EAAeC,EAAG,aAAaC,EAAK,QAAQ,UAAW,GAAGH,CAAO,mBAAmB,CAAC,EACrFI,EAAcF,EAAG,aAAaC,EAAK,QAAQ,UAAW,GAAGH,CAAO,kBAAkB,CAAC,EACnFK,EAAgBH,EAAG,aAAaC,EAAK,QAAQ,UAAW,GAAGH,CAAO,YAAY,CAAC,EAG/EM,EAAc,CAClB,SAAUL,EAAa,SAAS,EAChC,QAASG,EAAY,SAAS,EAC9B,UAAWC,EAAc,SAAA,EAAW,QAAQ,iBAAkB,EAAE,CAClE"}

packages/hackmd/dist/index.d.ts

@@ -0,0 +1,6 @@
+declare const hackmdFiles: {
+    stylesJS: string;
+    agentJS: string;
+    stylesCSS: string;
+};
+export default hackmdFiles;

packages/hackmd/dist/index.js

@@ -0,0 +1,12 @@
+import e from "node:fs";
+import s from "node:path";
+const r = process.env.NODE_ENV === "production", t = r ? "." : "../dist", n = e.readFileSync(s.resolve(__dirname, `${t}/hackmd-styles.js`)), o = e.readFileSync(s.resolve(__dirname, `${t}/hackmd-agent.js`)), i = e.readFileSync(s.resolve(__dirname, `${t}/style.css`)), c = {
+  stylesJS: n.toString(),
+  agentJS: o.toString(),
+  stylesCSS: i.toString().replace(/(\r\n|\n|\r)/gm, "")
+  // https://stackoverflow.com/questions/10805125/how-to-remove-all-line-breaks-from-a-string
+};
+export {
+  c as default
+};
+//# sourceMappingURL=index.js.map

packages/hackmd/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../src/index.ts"],"sourcesContent":["import fs from 'node:fs';\nimport path from 'node:path';\n\nconst isProduction = process.env.NODE_ENV === 'production';\nconst dirPath = isProduction ? '.' : '../dist';\nconst stylesJSFile = fs.readFileSync(path.resolve(__dirname, `${dirPath}/hackmd-styles.js`));\nconst agentJSFile = fs.readFileSync(path.resolve(__dirname, `${dirPath}/hackmd-agent.js`));\nconst stylesCSSFile = fs.readFileSync(path.resolve(__dirname, `${dirPath}/style.css`));\n\n// export to app as string\nconst hackmdFiles = {\n  stylesJS: stylesJSFile.toString(),\n  agentJS: agentJSFile.toString(),\n  stylesCSS: stylesCSSFile.toString().replace(/(\\r\\n|\\n|\\r)/gm, ''), // https://stackoverflow.com/questions/10805125/how-to-remove-all-line-breaks-from-a-string\n};\nexport default hackmdFiles;\n"],"names":["isProduction","dirPath","stylesJSFile","fs","path","agentJSFile","stylesCSSFile","hackmdFiles"],"mappings":";;AAGA,MAAMA,IAAe,QAAQ,IAAI,aAAa,cACxCC,IAAUD,IAAe,MAAM,WAC/BE,IAAeC,EAAG,aAAaC,EAAK,QAAQ,WAAW,GAAGH,CAAO,mBAAmB,CAAC,GACrFI,IAAcF,EAAG,aAAaC,EAAK,QAAQ,WAAW,GAAGH,CAAO,kBAAkB,CAAC,GACnFK,IAAgBH,EAAG,aAAaC,EAAK,QAAQ,WAAW,GAAGH,CAAO,YAAY,CAAC,GAG/EM,IAAc;AAAA,EAClB,UAAUL,EAAa,SAAS;AAAA,EAChC,SAASG,EAAY,SAAS;AAAA,EAC9B,WAAWC,EAAc,SAAA,EAAW,QAAQ,kBAAkB,EAAE;AAAA;AAClE;"}

packages/hackmd/dist/style.cjs

@@ -0,0 +1,2 @@
+"use strict";const s="";module.exports=s;
+//# sourceMappingURL=style.cjs.map

packages/hackmd/dist/style.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"style.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":""}

packages/hackmd/dist/style.css

@@ -0,0 +1 @@
+.navbar-header .navbar-brand{display:none}.navbar-form{margin-left:15px}.navbar-right .ui-new,.navbar-right .ui-publish{display:none}.CodeMirror pre.CodeMirror-line{font-family:Osaka-Mono,MS Gothic,Monaco,Menlo,Consolas,Courier New,monospace;font-size:14px;line-height:20px}

packages/hackmd/dist/style.js

@@ -0,0 +1,5 @@
+const t = "";
+export {
+  t as default
+};
+//# sourceMappingURL=style.js.map

packages/hackmd/dist/style.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"style.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

packages/hackmd/vite.config.js.timestamp-1695114238213-9c2299d83f727.mjs

@@ -0,0 +1,32 @@
+// vite.config.js
+import { defineConfig } from "file:///workspace/growi/node_modules/vite/dist/node/index.js";
+import dts from "file:///workspace/growi/node_modules/vite-plugin-dts/dist/index.mjs";
+var vite_config_default = defineConfig({
+  plugins: [
+    dts({ copyDtsFiles: true })
+  ],
+  build: {
+    outDir: "dist",
+    lib: {
+      entry: [
+        "src/index.ts",
+        "src/hackmd-styles.ts",
+        "src/hackmd-agent.js",
+        "src/style.scss"
+      ],
+      name: "hackmd-libs",
+      formats: ["es", "cjs"]
+    },
+    rollupOptions: {
+      external: [
+        "node:fs",
+        "node:path"
+      ]
+    },
+    sourcemap: true
+  }
+});
+export {
+  vite_config_default as default
+};
+//# sourceMappingURL=data:application/json;base64,ewogICJ2ZXJzaW9uIjogMywKICAic291cmNlcyI6IFsidml0ZS5jb25maWcuanMiXSwKICAic291cmNlc0NvbnRlbnQiOiBbImNvbnN0IF9fdml0ZV9pbmplY3RlZF9vcmlnaW5hbF9kaXJuYW1lID0gXCIvd29ya3NwYWNlL2dyb3dpL3BhY2thZ2VzL2hhY2ttZFwiO2NvbnN0IF9fdml0ZV9pbmplY3RlZF9vcmlnaW5hbF9maWxlbmFtZSA9IFwiL3dvcmtzcGFjZS9ncm93aS9wYWNrYWdlcy9oYWNrbWQvdml0ZS5jb25maWcuanNcIjtjb25zdCBfX3ZpdGVfaW5qZWN0ZWRfb3JpZ2luYWxfaW1wb3J0X21ldGFfdXJsID0gXCJmaWxlOi8vL3dvcmtzcGFjZS9ncm93aS9wYWNrYWdlcy9oYWNrbWQvdml0ZS5jb25maWcuanNcIjtpbXBvcnQgeyBkZWZpbmVDb25maWcgfSBmcm9tICd2aXRlJztcbmltcG9ydCBkdHMgZnJvbSAndml0ZS1wbHVnaW4tZHRzJztcblxuXG4vLyBodHRwczovL3ZpdGVqcy5kZXYvY29uZmlnL1xuZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29uZmlnKHtcbiAgcGx1Z2luczogW1xuICAgIGR0cyh7IGNvcHlEdHNGaWxlczogdHJ1ZSB9KSxcbiAgXSxcbiAgYnVpbGQ6IHtcbiAgICBvdXREaXI6ICdkaXN0JyxcbiAgICBsaWI6IHtcbiAgICAgIGVudHJ5OiBbXG4gICAgICAgICdzcmMvaW5kZXgudHMnLFxuICAgICAgICAnc3JjL2hhY2ttZC1zdHlsZXMudHMnLFxuICAgICAgICAnc3JjL2hhY2ttZC1hZ2VudC5qcycsXG4gICAgICAgICdzcmMvc3R5bGUuc2NzcycsXG4gICAgICBdLFxuICAgICAgbmFtZTogJ2hhY2ttZC1saWJzJyxcbiAgICAgIGZvcm1hdHM6IFsnZXMnLCAnY2pzJ10sXG4gICAgfSxcbiAgICByb2xsdXBPcHRpb25zOiB7XG4gICAgICBleHRlcm5hbDogW1xuICAgICAgICAnbm9kZTpmcycsXG4gICAgICAgICdub2RlOnBhdGgnLFxuICAgICAgXSxcbiAgICB9LFxuICAgIHNvdXJjZW1hcDogdHJ1ZSxcbiAgfSxcbn0pO1xuIl0sCiAgIm1hcHBpbmdzIjogIjtBQUFrUixTQUFTLG9CQUFvQjtBQUMvUyxPQUFPLFNBQVM7QUFJaEIsSUFBTyxzQkFBUSxhQUFhO0FBQUEsRUFDMUIsU0FBUztBQUFBLElBQ1AsSUFBSSxFQUFFLGNBQWMsS0FBSyxDQUFDO0FBQUEsRUFDNUI7QUFBQSxFQUNBLE9BQU87QUFBQSxJQUNMLFFBQVE7QUFBQSxJQUNSLEtBQUs7QUFBQSxNQUNILE9BQU87QUFBQSxRQUNMO0FBQUEsUUFDQTtBQUFBLFFBQ0E7QUFBQSxRQUNBO0FBQUEsTUFDRjtBQUFBLE1BQ0EsTUFBTTtBQUFBLE1BQ04sU0FBUyxDQUFDLE1BQU0sS0FBSztBQUFBLElBQ3ZCO0FBQUEsSUFDQSxlQUFlO0FBQUEsTUFDYixVQUFVO0FBQUEsUUFDUjtBQUFBLFFBQ0E7QUFBQSxNQUNGO0FBQUEsSUFDRjtBQUFBLElBQ0EsV0FBVztBQUFBLEVBQ2I7QUFDRixDQUFDOyIsCiAgIm5hbWVzIjogW10KfQo=

packages/presentation/vite.config.ts.timestamp-1695114238215-09fd9aa084899.mjs

@@ -0,0 +1,31 @@
+// vite.config.ts
+import react from "file:///workspace/growi/node_modules/@vitejs/plugin-react/dist/index.mjs";
+import { nodeExternals } from "file:///workspace/growi/node_modules/rollup-plugin-node-externals/dist/index.js";
+import { defineConfig } from "file:///workspace/growi/node_modules/vite/dist/node/index.js";
+import dts from "file:///workspace/growi/node_modules/vite-plugin-dts/dist/index.mjs";
+var vite_config_default = defineConfig({
+  plugins: [
+    react(),
+    dts({ copyDtsFiles: true }),
+    {
+      ...nodeExternals({
+        devDeps: true,
+        builtinsPrefix: "ignore"
+      }),
+      enforce: "pre"
+    }
+  ],
+  build: {
+    outDir: "dist",
+    sourcemap: true,
+    lib: {
+      entry: "src/index.ts",
+      name: "presentation-libs",
+      formats: ["es"]
+    }
+  }
+});
+export {
+  vite_config_default as default
+};
+//# sourceMappingURL=data:application/json;base64,ewogICJ2ZXJzaW9uIjogMywKICAic291cmNlcyI6IFsidml0ZS5jb25maWcudHMiXSwKICAic291cmNlc0NvbnRlbnQiOiBbImNvbnN0IF9fdml0ZV9pbmplY3RlZF9vcmlnaW5hbF9kaXJuYW1lID0gXCIvd29ya3NwYWNlL2dyb3dpL3BhY2thZ2VzL3ByZXNlbnRhdGlvblwiO2NvbnN0IF9fdml0ZV9pbmplY3RlZF9vcmlnaW5hbF9maWxlbmFtZSA9IFwiL3dvcmtzcGFjZS9ncm93aS9wYWNrYWdlcy9wcmVzZW50YXRpb24vdml0ZS5jb25maWcudHNcIjtjb25zdCBfX3ZpdGVfaW5qZWN0ZWRfb3JpZ2luYWxfaW1wb3J0X21ldGFfdXJsID0gXCJmaWxlOi8vL3dvcmtzcGFjZS9ncm93aS9wYWNrYWdlcy9wcmVzZW50YXRpb24vdml0ZS5jb25maWcudHNcIjtpbXBvcnQgcmVhY3QgZnJvbSAnQHZpdGVqcy9wbHVnaW4tcmVhY3QnO1xuaW1wb3J0IHsgbm9kZUV4dGVybmFscyB9IGZyb20gJ3JvbGx1cC1wbHVnaW4tbm9kZS1leHRlcm5hbHMnO1xuaW1wb3J0IHsgZGVmaW5lQ29uZmlnIH0gZnJvbSAndml0ZSc7XG5pbXBvcnQgZHRzIGZyb20gJ3ZpdGUtcGx1Z2luLWR0cyc7XG5cbi8vIGh0dHBzOi8vdml0ZWpzLmRldi9jb25maWcvXG5leHBvcnQgZGVmYXVsdCBkZWZpbmVDb25maWcoe1xuICBwbHVnaW5zOiBbXG4gICAgcmVhY3QoKSxcbiAgICBkdHMoeyBjb3B5RHRzRmlsZXM6IHRydWUgfSksXG4gICAge1xuICAgICAgLi4ubm9kZUV4dGVybmFscyh7XG4gICAgICAgIGRldkRlcHM6IHRydWUsXG4gICAgICAgIGJ1aWx0aW5zUHJlZml4OiAnaWdub3JlJyxcbiAgICAgIH0pLFxuICAgICAgZW5mb3JjZTogJ3ByZScsXG4gICAgfSxcbiAgXSxcbiAgYnVpbGQ6IHtcbiAgICBvdXREaXI6ICdkaXN0JyxcbiAgICBzb3VyY2VtYXA6IHRydWUsXG4gICAgbGliOiB7XG4gICAgICBlbnRyeTogJ3NyYy9pbmRleC50cycsXG4gICAgICBuYW1lOiAncHJlc2VudGF0aW9uLWxpYnMnLFxuICAgICAgZm9ybWF0czogWydlcyddLFxuICAgIH0sXG4gIH0sXG59KTtcbiJdLAogICJtYXBwaW5ncyI6ICI7QUFBb1MsT0FBTyxXQUFXO0FBQ3RULFNBQVMscUJBQXFCO0FBQzlCLFNBQVMsb0JBQW9CO0FBQzdCLE9BQU8sU0FBUztBQUdoQixJQUFPLHNCQUFRLGFBQWE7QUFBQSxFQUMxQixTQUFTO0FBQUEsSUFDUCxNQUFNO0FBQUEsSUFDTixJQUFJLEVBQUUsY0FBYyxLQUFLLENBQUM7QUFBQSxJQUMxQjtBQUFBLE1BQ0UsR0FBRyxjQUFjO0FBQUEsUUFDZixTQUFTO0FBQUEsUUFDVCxnQkFBZ0I7QUFBQSxNQUNsQixDQUFDO0FBQUEsTUFDRCxTQUFTO0FBQUEsSUFDWDtBQUFBLEVBQ0Y7QUFBQSxFQUNBLE9BQU87QUFBQSxJQUNMLFFBQVE7QUFBQSxJQUNSLFdBQVc7QUFBQSxJQUNYLEtBQUs7QUFBQSxNQUNILE9BQU87QUFBQSxNQUNQLE1BQU07QUFBQSxNQUNOLFNBQVMsQ0FBQyxJQUFJO0FBQUEsSUFDaEI7QUFBQSxFQUNGO0FBQ0YsQ0FBQzsiLAogICJuYW1lcyI6IFtdCn0K

packages/preset-templates/dist/marp-example/ja_JP/meta.json

@@ -0,0 +1,3 @@
+{
+  "title": "Marpを使ったプレゼンテーション"
+}

packages/preset-templates/dist/marp-example/ja_JP/template.md

@@ -0,0 +1,325 @@
+---
+marp: true
+---
+
+Marp
+===
+
+![h:250](https://avatars1.githubusercontent.com/u/20685754?v=4)
+
+##### Markdown プレゼンテーションのエコシステム
+
+###### by Marp チーム ([@marp-team][marp-team])
+
+[marp-team]: https://github.com/marp-team
+[marpit]: https://github.com/marp-team/marpit
+[marp-core]: https://github.com/marp-team/marp-core
+[marp-cli]: https://github.com/marp-team/marp-cli
+[marp-vscode]: https://github.com/marp-team/marp-vscode
+
+---
+
+# 特徴
+
+- :memo: **プレーンな Markdown 記法でスライドデッキを記述する** (CommonMark)
+- :factory: [Marpit framework][marpit]上にビルトする: スライドデッキを作成するための真新しい洗練されたフレームワーク
+- :gear: [Marp Core][marp-core]: npmを通じてコアエンジンやビルトインテーマを使いやすくする
+- :tv: [Marp CLI][marp-cli]: マークうダウン形式をHTML、PDF、PPTX、画像に変換する
+- :vs: [Marp for VS Code][marp-vscode]: 編集中のデッキをライブプレビューする
+- and more...
+
+---
+
+# どうやってスライドを記述するのか
+
+やり方はとてもシンプルです。ハイフン記号 (e.g. `---`)でページを分割します。
+
+```markdown
+# スライド 1
+
+本文
+
+---
+
+# スライド 2
+
+本文
+```
+
+---
+
+# 指示構文
+
+Marp では美しいスライド作成を支援するため、**"Directives"**　という拡張構文を用意しています。
+
+Markdown 記法の本文の前に挿入します:
+
+```
+---
+theme: default
+---
+```
+
+または本文のどこかにHTML形式で記述します:
+
+```html
+<!-- theme: default -->
+```
+
+https://marpit.marp.app/directives
+
+---
+
+## [グローバル指示構文](https://marpit.marp.app/directives?id=global-directives)
+
+- `theme` : テーマを選ぶ
+- `size` : スライドのサイズを `16:9` か `4:3` で選択する *(Marpit frameworkを除く)* 
+- [`headingDivider`](https://marpit.marp.app/directives?id=heading-divider) : 任意の見出しの前にスライドのページ区切りを挿入する
+
+```
+---
+theme: gaia
+size: 4:3
+---
+
+# 内容
+```
+
+> Marp では以下の[built-in themes in Marp Core](https://github.com/marp-team/marp-core/tree/master/themes#readme)が利用可能 : `default` `gaia` `uncover`.
+
+---
+
+## [ローカル指示構文](https://marpit.marp.app/directives?id=local-directives)
+
+スライドページ毎に設定できる値一覧
+
+- `paginate` : `true`でページ数を表示する
+- `header` : ヘッダーの内容を指定する
+- `footer` : フッターの内容を指定する
+- `class` : 現在のスライドにHTMLのクラス設定をする
+- `color` : 文字色を指定する
+- `backgroundColor` : 背景色を指定する
+
+---
+
+### スポット構文
+
+ローカル構文は**任意のページとそれ以降のページ**に適用されます。 
+
+`_class`のようにアンダーバーと接頭辞を使うことで一つのページに適用できます。
+
+![bg right 95%](https://marpit.marp.app/assets/directives.png)
+
+---
+
+### 活用例
+
+このページは [defined in Marp built-in theme](https://github.com/marp-team/marp-core/tree/master/themes#readme)で色彩を反転させています。
+
+<!-- _class: invert -->
+
+```html
+<!-- _class: invert -->
+```
+
+---
+
+# [Image syntax](https://marpit.marp.app/image-syntax)
+
+You can resize image size and apply filters through keywords: `width` (`w`), `height` (`h`), and filter CSS keywords.
+
+```markdown
+![width:100px height:100px](image.png)
+```
+
+```markdown
+![blur sepia:50%](filters.png)
+```
+
+Please refer [resizing image syntax](https://marpit.marp.app/image-syntax?id=resizing-image) and [a list of CSS filters](https://marpit.marp.app/image-syntax?id=image-filters).
+
+![w:100px h:100px](https://avatars1.githubusercontent.com/u/20685754?v=4) ![w:100 h:100 blur sepia:50%](https://avatars1.githubusercontent.com/u/20685754?v=4)
+
+---
+
+# [Background image](https://marpit.marp.app/image-syntax?id=slide-backgrounds)
+
+You can set background image for a slide by using `bg` keyword.
+
+```markdown
+![bg opacity](https://yhatt-marp-cli-example.netlify.com/assets/gradient.jpg)
+```
+
+![bg opacity](https://yhatt-marp-cli-example.netlify.com/assets/gradient.jpg)
+
+---
+
+## Multiple backgrounds ([Marpit's advanced backgrounds](https://marpit.marp.app/image-syntax?id=advanced-backgrounds))
+
+Marp can use multiple background images.
+
+```markdown
+![bg blur:3px](https://fakeimg.pl/800x600/fff/ccc/?text=A)
+![bg blur:3px](https://fakeimg.pl/800x600/eee/ccc/?text=B)
+![bg blur:3px](https://fakeimg.pl/800x600/ddd/ccc/?text=C)
+```
+
+Also can change alignment direction by including `vertical` keyword.
+
+![bg blur:3px](https://fakeimg.pl/800x600/fff/ccc/?text=A)
+![bg blur:3px](https://fakeimg.pl/800x600/eee/ccc/?text=B)
+![bg blur:3px](https://fakeimg.pl/800x600/ddd/ccc/?text=C)
+
+---
+
+## [Split background](https://marpit.marp.app/image-syntax?id=split-backgrounds)
+
+Marp can use [Deckset](https://docs.deckset.com/English.lproj/Media/01-background-images.html#split-slides) style split background(s).
+
+Make a space for background by `bg` + `left` / `right` keywords.
+
+```markdown
+![bg right](image.jpg)
+```
+
+![bg right](https://images.unsplash.com/photo-1568488789544-e37edf90eb67?crop=entropy&cs=tinysrgb&fit=crop&fm=jpg&h=720&ixlib=rb-1.2.1&q=80&w=640)
+
+<!-- _footer: "*Photo by [Mohamed Nohassi](https://unsplash.com/@coopery?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText) on [Unsplash](https://unsplash.com/?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText)*" -->
+
+---
+
+## [Fragmented list](https://marpit.marp.app/fragmented-list)
+
+Marp will parse a list with asterisk marker as the fragmented list for appearing contents one by one. (_**Only for exported HTML** by [Marp CLI][marp-cli] / [Marp for VS Code][marp-vscode]_)
+
+```markdown
+# Bullet list
+
+- One
+- Two
+- Three
+
+---
+
+# Fragmented list
+
+* One
+* Two
+* Three
+```
+
+---
+
+## Math typesetting (only for [Marp Core][marp-core])
+
+[KaTeX](https://katex.org/) math typesetting such as $ax^2+bc+c$ can use with [Pandoc's math syntax](https://pandoc.org/MANUAL.html#math).
+
+$$I_{xx}=\int\int_Ry^2f(x,y)\cdot{}dydx$$
+
+```tex
+$ax^2+bc+c$
+```
+```tex
+$$I_{xx}=\int\int_Ry^2f(x,y)\cdot{}dydx$$
+```
+
+---
+
+## Auto-scaling (only for [Marp Core][marp-core])
+
+*Several built-in themes* are supported auto-scaling for code blocks and math typesettings.
+
+```text
+Too long code block will be scaled-down automatically. ------------>
+```
+```text
+Too long code block will be scaled-down automatically. ------------------------>
+```
+```text
+Too long code block will be scaled-down automatically. ------------------------------------------------>
+```
+
+---
+
+##### <!--fit--> Auto-fitting header (only for [Marp Core][marp-core])
+##### <!--fit--> is available by annotating `<!--fit-->` in headings.
+
+<br />
+
+```html
+## <!--fit--> Auto-fitting header (only for Marp Core)
+```
+
+---
+
+## [Theme CSS](https://marpit.marp.app/theme-css)
+
+Marp uses `<section>` as the container of each slide. And others are same as styling for plain Markdown. The customized theme can use in [Marp CLI][marp-cli] and [Marp for VS Code][marp-vscode].
+
+```css
+/* @theme your-theme */
+
+@import 'default';
+
+section {
+  /* Specify slide size */
+  width: 960px;
+  height: 720px;
+}
+
+h1 {
+  font-size: 30px;
+  color: #c33;
+}
+```
+
+---
+
+## [Tweak style in Markdown](https://marpit.marp.app/theme-css?id=tweak-style-through-markdown)
+
+`<style>` tag in Markdown will work in the context of theme CSS.
+
+```markdown
+---
+theme: default
+---
+
+<style>
+section {
+  background: yellow;
+}
+</style>
+
+Re-painted yellow background, ha-ha.
+```
+
+> You can also add custom styling by class like `section.custom-class { ... }`.
+> Apply style through `<!-- _class: custom-class -->`.
+
+---
+
+## [Scoped style](https://marpit.marp.app/theme-css?id=scoped-style)
+
+If you want one-shot styling for current page, you can use `<style scoped>`.
+
+```markdown
+<style scoped>
+a {
+  color: green;
+}
+</style>
+
+![Green link!](https://marp.app/)
+```
+
+<style scoped>
+a { color: green; }
+</style>
+
+---
+
+# Enjoy writing slides! :v: <!--fit-->
+
+##### ![w:1em h:1em](https://avatars1.githubusercontent.com/u/20685754?v=4)  Marp: Markdown presentation ecosystem — https://marp.app/
+
+###### by Marp Team ([@marp-team][marp-team])

packages/preset-templates/dist/marp-example/zh_CN/meta.json

@@ -0,0 +1,3 @@
+{
+  "title": "Presentation examples with Marp"
+}

packages/preset-templates/dist/marp-example/zh_CN/template.md

@@ -0,0 +1,325 @@
+---
+marp: true
+---
+
+Marp
+===
+
+![h:250](https://avatars1.githubusercontent.com/u/20685754?v=4)
+
+##### Markdown presentation ecosystem
+
+###### by Marp Team ([@marp-team][marp-team])
+
+[marp-team]: https://github.com/marp-team
+[marpit]: https://github.com/marp-team/marpit
+[marp-core]: https://github.com/marp-team/marp-core
+[marp-cli]: https://github.com/marp-team/marp-cli
+[marp-vscode]: https://github.com/marp-team/marp-vscode
+
+---
+
+# Features
+
+- :memo: **Write slide deck with plain Markdown** (CommonMark)
+- :factory: Built on [Marpit framework][marpit]: A brand-new skinny framework for creating slide deck
+- :gear: [Marp Core][marp-core]: Easy to start using the core engine and built-in themes via npm
+- :tv: [Marp CLI][marp-cli]: Convert Markdown into HTML, PDF, PPTX, and images
+- :vs: [Marp for VS Code][marp-vscode]: Live-preview your deck while editting
+- and more...
+
+---
+
+# How to write slides?
+
+Split pages by horizontal ruler (e.g. `---`). It's very simple.
+
+```markdown
+# Slide 1
+
+foobar
+
+---
+
+# Slide 2
+
+foobar
+```
+
+---
+
+# Directives
+
+Marp has extended syntax called **"Directives"** to support creating beautiful slides.
+
+Insert front-matter to the top of Markdown:
+
+```
+---
+theme: default
+---
+```
+
+or HTML comment to anywhere:
+
+```html
+<!-- theme: default -->
+```
+
+https://marpit.marp.app/directives
+
+---
+
+## [Global directives](https://marpit.marp.app/directives?id=global-directives)
+
+- `theme`: Choose theme
+- `size`: Choose slide size from `16:9` and `4:3` *(except Marpit framework)*
+- [`headingDivider`](https://marpit.marp.app/directives?id=heading-divider): Instruct to divide slide pages at before of specified heading levels
+
+```
+---
+theme: gaia
+size: 4:3
+---
+
+# Content
+```
+
+> Marp can use [built-in themes in Marp Core](https://github.com/marp-team/marp-core/tree/master/themes#readme): `default`, `gaia`, and `uncover`.
+
+---
+
+## [Local directives](https://marpit.marp.app/directives?id=local-directives)
+
+These are the setting value per slide pages.
+
+- `paginate`: Show pagination by set `true`
+- `header`: Specify the contents for header
+- `footer`: Specify the contents for footer
+- `class`: Set HTML class for current slide
+- `color`: Set text color
+- `backgroundColor`: Set background color
+
+---
+
+### Spot directives
+
+Local directives would apply to **defined page and following pages**.
+
+They can apply to single page by using underscore prefix such as `_class`.
+
+![bg right 95%](https://marpit.marp.app/assets/directives.png)
+
+---
+
+### Example
+
+This page is using invert color scheme [defined in Marp built-in theme](https://github.com/marp-team/marp-core/tree/master/themes#readme).
+
+<!-- _class: invert -->
+
+```html
+<!-- _class: invert -->
+```
+
+---
+
+# [Image syntax](https://marpit.marp.app/image-syntax)
+
+You can resize image size and apply filters through keywords: `width` (`w`), `height` (`h`), and filter CSS keywords.
+
+```markdown
+![width:100px height:100px](image.png)
+```
+
+```markdown
+![blur sepia:50%](filters.png)
+```
+
+Please refer [resizing image syntax](https://marpit.marp.app/image-syntax?id=resizing-image) and [a list of CSS filters](https://marpit.marp.app/image-syntax?id=image-filters).
+
+![w:100px h:100px](https://avatars1.githubusercontent.com/u/20685754?v=4) ![w:100 h:100 blur sepia:50%](https://avatars1.githubusercontent.com/u/20685754?v=4)
+
+---
+
+# [Background image](https://marpit.marp.app/image-syntax?id=slide-backgrounds)
+
+You can set background image for a slide by using `bg` keyword.
+
+```markdown
+![bg opacity](https://yhatt-marp-cli-example.netlify.com/assets/gradient.jpg)
+```
+
+![bg opacity](https://yhatt-marp-cli-example.netlify.com/assets/gradient.jpg)
+
+---
+
+## Multiple backgrounds ([Marpit's advanced backgrounds](https://marpit.marp.app/image-syntax?id=advanced-backgrounds))
+
+Marp can use multiple background images.
+
+```markdown
+![bg blur:3px](https://fakeimg.pl/800x600/fff/ccc/?text=A)
+![bg blur:3px](https://fakeimg.pl/800x600/eee/ccc/?text=B)
+![bg blur:3px](https://fakeimg.pl/800x600/ddd/ccc/?text=C)
+```
+
+Also can change alignment direction by including `vertical` keyword.
+
+![bg blur:3px](https://fakeimg.pl/800x600/fff/ccc/?text=A)
+![bg blur:3px](https://fakeimg.pl/800x600/eee/ccc/?text=B)
+![bg blur:3px](https://fakeimg.pl/800x600/ddd/ccc/?text=C)
+
+---
+
+## [Split background](https://marpit.marp.app/image-syntax?id=split-backgrounds)
+
+Marp can use [Deckset](https://docs.deckset.com/English.lproj/Media/01-background-images.html#split-slides) style split background(s).
+
+Make a space for background by `bg` + `left` / `right` keywords.
+
+```markdown
+![bg right](image.jpg)
+```
+
+![bg right](https://images.unsplash.com/photo-1568488789544-e37edf90eb67?crop=entropy&cs=tinysrgb&fit=crop&fm=jpg&h=720&ixlib=rb-1.2.1&q=80&w=640)
+
+<!-- _footer: "*Photo by [Mohamed Nohassi](https://unsplash.com/@coopery?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText) on [Unsplash](https://unsplash.com/?utm_source=unsplash&utm_medium=referral&utm_content=creditCopyText)*" -->
+
+---
+
+## [Fragmented list](https://marpit.marp.app/fragmented-list)
+
+Marp will parse a list with asterisk marker as the fragmented list for appearing contents one by one. (_**Only for exported HTML** by [Marp CLI][marp-cli] / [Marp for VS Code][marp-vscode]_)
+
+```markdown
+# Bullet list
+
+- One
+- Two
+- Three
+
+---
+
+# Fragmented list
+
+* One
+* Two
+* Three
+```
+
+---
+
+## Math typesetting (only for [Marp Core][marp-core])
+
+[KaTeX](https://katex.org/) math typesetting such as $ax^2+bc+c$ can use with [Pandoc's math syntax](https://pandoc.org/MANUAL.html#math).
+
+$$I_{xx}=\int\int_Ry^2f(x,y)\cdot{}dydx$$
+
+```tex
+$ax^2+bc+c$
+```
+```tex
+$$I_{xx}=\int\int_Ry^2f(x,y)\cdot{}dydx$$
+```
+
+---
+
+## Auto-scaling (only for [Marp Core][marp-core])
+
+*Several built-in themes* are supported auto-scaling for code blocks and math typesettings.
+
+```text
+Too long code block will be scaled-down automatically. ------------>
+```
+```text
+Too long code block will be scaled-down automatically. ------------------------>
+```
+```text
+Too long code block will be scaled-down automatically. ------------------------------------------------>
+```
+
+---
+
+##### <!--fit--> Auto-fitting header (only for [Marp Core][marp-core])
+##### <!--fit--> is available by annotating `<!--fit-->` in headings.
+
+<br />
+
+```html
+## <!--fit--> Auto-fitting header (only for Marp Core)
+```
+
+---
+
+## [Theme CSS](https://marpit.marp.app/theme-css)
+
+Marp uses `<section>` as the container of each slide. And others are same as styling for plain Markdown. The customized theme can use in [Marp CLI][marp-cli] and [Marp for VS Code][marp-vscode].
+
+```css
+/* @theme your-theme */
+
+@import 'default';
+
+section {
+  /* Specify slide size */
+  width: 960px;
+  height: 720px;
+}
+
+h1 {
+  font-size: 30px;
+  color: #c33;
+}
+```
+
+---
+
+## [Tweak style in Markdown](https://marpit.marp.app/theme-css?id=tweak-style-through-markdown)
+
+`<style>` tag in Markdown will work in the context of theme CSS.
+
+```markdown
+---
+theme: default
+---
+
+<style>
+section {
+  background: yellow;
+}
+</style>
+
+Re-painted yellow background, ha-ha.
+```
+
+> You can also add custom styling by class like `section.custom-class { ... }`.
+> Apply style through `<!-- _class: custom-class -->`.
+
+---
+
+## [Scoped style](https://marpit.marp.app/theme-css?id=scoped-style)
+
+If you want one-shot styling for current page, you can use `<style scoped>`.
+
+```markdown
+<style scoped>
+a {
+  color: green;
+}
+</style>
+
+![Green link!](https://marp.app/)
+```
+
+<style scoped>
+a { color: green; }
+</style>
+
+---
+
+# Enjoy writing slides! :v: <!--fit-->
+
+##### ![w:1em h:1em](https://avatars1.githubusercontent.com/u/20685754?v=4)  Marp: Markdown presentation ecosystem — https://marp.app/
+
+###### by Marp Team ([@marp-team][marp-team])