Add 'src/plugin/packer/' from commit '4636d5a469992da04880ea44cef09c9…

…760df8e55' git-subtree-dir: src/plugin/packer git-subtree-mainline: b71bade git-subtree-split: 4636d5a
kintone · Oct 22, 2024 · 90d2ede · 90d2ede
2 parents b71bade + 4636d5a
commit 90d2ede
Show file tree

Hide file tree

Showing 81 changed files with 4,218 additions and 0 deletions.
diff --git a/src/plugin/packer/.gitattributes b/src/plugin/packer/.gitattributes
@@ -0,0 +1,2 @@
+*.js eol=lf
+/docs/dist/* binary
diff --git a/src/plugin/packer/.gitignore b/src/plugin/packer/.gitignore
@@ -0,0 +1,8 @@
+node_modules
+.vault
+test/fixtures/sample-plugin/plugin.zip
+test/fixtures/sample-plugin/*.ppk
+test/.output
+docs/dist/*
+!docs/dist/.gitkeep
+/dist
diff --git a/src/plugin/packer/CHANGELOG.md b/src/plugin/packer/CHANGELOG.md
diff --git a/src/plugin/packer/LICENSE b/src/plugin/packer/LICENSE
@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2018 Cybozu, Inc.
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
diff --git a/src/plugin/packer/README.md b/src/plugin/packer/README.md
@@ -0,0 +1,67 @@
+# kintone-plugin-packer
+
+[![npm version](https://badge.fury.io/js/%40kintone%2Fplugin-packer.svg)](https://badge.fury.io/js/%40kintone%2Fplugin-packer)
+![Node.js version](https://img.shields.io/badge/dynamic/json.svg?url=https://raw.githubusercontent.com/kintone/js-sdk/main/packages/plugin-packer/package.json&label=node&query=$.engines.node&colorB=blue)
+![License](https://img.shields.io/npm/l/@kintone/plugin-packer.svg)
+
+[kintone plugin package.sh](https://github.com/kintone-samples/plugin-samples) in JavaScript
+
+It's written in pure JavaScript, so
+
+- The CLI works with Node.js in Mac/Windows/Linux
+- [The web page](https://plugin-packer.kintone.dev/) works in any modern browsers
+- Validate your `manifest.json` with [JSON Schema](https://github.com/kintone/js-sdk/tree/main/packages/plugin-manifest-validator)
+
+# How to install
+
+```console
+$ npm install -g @kintone/plugin-packer
+```
+
+# Usage: CLI
+
+```console
+$ kintone-plugin-packer [OPTIONS] PLUGIN_DIR
+```
+
+## Options
+
+- `--ppk PPK_FILE`: The path of input private key file. If omitted, it is generated automatically into `<Plugin ID>.ppk` in the same directory of `PLUGIN_DIR` or `--out` if specified.
+- `--out PLUGIN_FILE`: The path of generated plugin file. The default is `plugin.zip` in the same directory of `PLUGIN_DIR`.
+- `--watch`, `-w`: Watch PLUGIN_DIR for the changes.
+
+## How to use with `npm run`
+
+If your private key is `./private.ppk` and the plugin directory is `./plugin`, edit `package.json`:
+
+```json
+{
+  "scripts": {
+    "package": "kintone-plugin-packer --ppk private.ppk plugin"
+  }
+}
+```
+
+and then
+
+```console
+$ npm run package
+```
+
+# Usage: Node.js API
+
+```js
+const packer = require("@kintone/plugin-packer");
+const fs = require("fs");
+
+const buffer = createContentsZipBufferInYourSelf();
+packer(buffer).then((output) => {
+  console.log(output.id);
+  fs.writeFileSync("./private.ppk", output.privateKey);
+  fs.writeFileSync("./plugin.zip", output.plugin);
+});
+```
+
+## License
+
+MIT License
diff --git a/src/plugin/packer/babel.config.js b/src/plugin/packer/babel.config.js
@@ -0,0 +1,7 @@
+module.exports = {
+  presets: [
+    ["@babel/preset-env", { targets: { node: "current" } }],
+    "@babel/preset-typescript",
+  ],
+  plugins: ["babel-plugin-replace-ts-export-assignment"],
+};
diff --git a/src/plugin/packer/bin/cli.js b/src/plugin/packer/bin/cli.js
@@ -0,0 +1,53 @@
+#!/usr/bin/env node
+
+"use strict";
+
+const meow = require("meow");
+const packer = require("../dist/cli");
+
+const USAGE = "$ kintone-plugin-packer [options] PLUGIN_DIR";
+
+const flagSpec = {
+  ppk: {
+    type: "string",
+  },
+  out: {
+    type: "string",
+  },
+  watch: {
+    type: "boolean",
+    alias: "w",
+  },
+};
+
+const cli = meow(
+  `
+Usage
+  ${USAGE}
+
+Options
+  --ppk PPK_FILE: Private key file. If omitted, it's generated into '<Plugin ID>.ppk' in the same directory of PLUGIN_DIR.
+  --out PLUGIN_FILE: The default is 'plugin.zip' in the same directory of PLUGIN_DIR.
+  --watch: Watch PLUGIN_DIR for the changes.
+`,
+  {
+    flags: flagSpec,
+  },
+);
+
+if (!cli.input[0]) {
+  console.error("Error: An argument `PLUGIN_DIR` is required.");
+  cli.showHelp();
+}
+
+const pluginDir = cli.input[0];
+const flags = Object.keys(flagSpec).reduce((prev, cur) => {
+  prev[cur] = cli.flags[cur];
+  return prev;
+}, {});
+
+if (process.env.NODE_ENV === "test") {
+  console.log(JSON.stringify({ pluginDir, flags }));
+} else {
+  packer(pluginDir, flags);
+}
diff --git a/src/plugin/packer/bin/eslint.config.mjs b/src/plugin/packer/bin/eslint.config.mjs
@@ -0,0 +1,6 @@
+import presetsNodePrettier from "@cybozu/eslint-config/flat/presets/node-prettier.js";
+
+/** @type {import("eslint").Linter.Config[]} */
+export default [
+  ...presetsNodePrettier
+];
diff --git a/src/plugin/packer/docs/dist/.gitkeep b/src/plugin/packer/docs/dist/.gitkeep
diff --git a/src/plugin/packer/docs/index-ja.html b/src/plugin/packer/docs/index-ja.html
@@ -0,0 +1,102 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width,initial-scale=1">
+  <title>Package your kintone plug-in!</title>
+  <link rel="stylesheet" href="./dist/normalize.min.css">
+  <link rel="stylesheet" href="./style.css">
+  <script defer src="https://use.fontawesome.com/releases/v5.0.7/js/all.js"></script>
+  <!-- Google Tag Manager -->
+  <script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
+            new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
+          j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
+          'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
+  })(window,document,'script','dataLayer','GTM-5N49D3');</script>
+  <!-- End Google Tag Manager -->
+  <script src="./dist/bundle.js" defer></script>
+</head>
+<body>
+  <!-- Google Tag Manager (noscript) -->
+  <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-5N49D3"
+                    height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
+  <!-- End Google Tag Manager (noscript) -->
+  <header class="header">
+    <h1 class="header__title">Package your kintone plug-in!</h1>
+  </header>
+  <main>
+    <section class="description">
+      <p>
+        プラグインディレクトリをアップロードしてください。<br>
+        Chrome, Firefox以外の場合は、Zipで固めてアップロードしてください。<br>
+        秘密鍵と署名済みのプラグインファイルを生成します。<br>
+        2回目以降の場合は、秘密鍵も添付してください。
+      </p>
+    </section>
+    <section class="upload-area">
+      <div class="upload-area__droppable js-upload js-upload-zip">
+        <p class="upload-area__text">
+          <span class="hide js-zip-ok-icon ok-icon"><i class="fas fa-check-circle"></i></span>
+          <i class="far fa-folder"></i>
+          <a href="" class="upload-area__zip-link js-upload-zip-link">
+            プラグインをドラッグアンドドロップするか、ここをクリックして選択してください
+          </a>
+          <br />
+          <i class="fas fa-upload"></i>
+          <span class="js-zip-file-name"></span>
+          <input type=file class="upload-area__file-upload js-file-upload" accept=".zip" tabindex="-1" webkitdirectory>
+        </p>
+      </div>
+      <div class="upload-area__droppable js-upload js-upload-ppk">
+        <p class="upload-area__text">
+          <span class="hide js-ppk-ok-icon ok-icon"><i class="fas fa-check-circle"></i></span>
+          <i class="fas fa-key"></i>
+          <a href="" class="upload-area__ppk-link js-upload-ppk-link">
+            秘密鍵(.ppk)ファイルをドラッグアンドドロップするか、ここをクリックして選択してください（オプション）
+          </a>
+          <br />
+          <i class="fas fa-upload"></i>
+          <span class="js-ppk-file-name"></span>
+          <input type=file class="upload-area__file-upload js-file-upload" accept=".ppk" tabInde="-1">
+        </p>
+      </div>
+    </section>
+    <section class="hide download js-download">
+      <h2 class="download__title">プラグインを作成しました！</h2>
+      <ul class="download__list">
+        <li class="download__list-element">
+          ID: <span class="js-download-plugin-id"></span>
+        </li>
+        <li class="download__list-element">
+          <span class="ok-icon"><i class="fas fa-check-circle"></i></span>
+          <span><i class="far fa-folder"></i></span>
+          <a class="js-download-plugin" download="plugin.zip">
+            plugin.zip
+          </a>
+        </li>
+        <li class="download__list-element">
+          <span class="ok-icon"><i class="fas fa-check-circle"></i></span>
+          <i class="fas fa-key"></i>
+          <a class="js-download-ppk" download="private.ppk">
+            private.ppk
+          </a>
+        </li>
+      </ul>
+    </section>
+    <section class="hide error js-error">
+      <h2 class="error__title">プラグインの作成に失敗しました</h2>
+      <ul class="error__messages js-error-messages"></ul>
+    </section>
+    <section class="action">
+      <button class="action__button action__button--create js-create-btn disabled">作成する</button>
+      <button class="action__button action__button--create js-create-loading-btn hide">
+        <span class="loading"><i class="fas fa-spinner"></i></span>
+      </button>
+      <button class="action__button action__button--clear js-clear-btn">リセットする</button>
+    </section>
+  </main>
+  <footer class="footer">
+    <p>Lang: <a href="./index.html">English</a></p>
+  </footer>
+</body>
+</html>
diff --git a/src/plugin/packer/docs/index.html b/src/plugin/packer/docs/index.html
@@ -0,0 +1,102 @@
+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width,initial-scale=1">
+  <title>Package your kintone plug-in!</title>
+  <link rel="stylesheet" href="./dist/normalize.min.css">
+  <link rel="stylesheet" href="./style.css">
+  <script defer src="https://use.fontawesome.com/releases/v5.0.7/js/all.js"></script>
+  <!-- Google Tag Manager -->
+  <script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
+            new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
+          j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
+          'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
+  })(window,document,'script','dataLayer','GTM-5N49D3');</script>
+  <!-- End Google Tag Manager -->
+  <script src="./dist/bundle.js" defer></script>
+</head>
+<body>
+  <!-- Google Tag Manager (noscript) -->
+  <noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-5N49D3"
+                    height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
+  <!-- End Google Tag Manager (noscript) -->
+  <header class="header">
+    <h1 class="header__title">Package your kintone plug-in!</h1>
+  </header>
+  <main>
+    <section class="description">
+      <p>
+        Upload the plug-in directory.<br>
+        If you are using a browser except for Chrome or Firefox, upload the zipped plug-in file.<br>
+        A secret key file and a signed plug-in file will be generated.<br>
+        The secret key will also need to be uploaded when repackaging your plug-in.
+      </p>
+    </section>
+    <section class="upload-area">
+      <div class="upload-area__droppable js-upload js-upload-zip">
+        <p class="upload-area__text">
+          <span class="hide js-zip-ok-icon ok-icon"><i class="fas fa-check-circle"></i></span>
+          <i class="far fa-folder"></i>
+          <a href="" class="upload-area__zip-link js-upload-zip-link">
+            Drag and drop your kintone plug-in!
+          </a>
+          <br />
+          <i class="fas fa-upload"></i>
+          <span class="js-zip-file-name"></span>
+          <input type=file class="upload-area__file-upload js-file-upload" accept=".zip" tabindex="-1" webkitdirectory>
+        </p>
+      </div>
+      <div class="upload-area__droppable js-upload js-upload-ppk">
+        <p class="upload-area__text">
+          <span class="hide js-ppk-ok-icon ok-icon"><i class="fas fa-check-circle"></i></span>
+          <i class="fas fa-key"></i>
+          <a href="" class="upload-area__ppk-link js-upload-ppk-link">
+            Drag and drop your secret key file(.ppk)
+          </a>
+          (optional)<br />
+          <i class="fas fa-upload"></i>
+          <span class="js-ppk-file-name"></span>
+          <input type=file class="upload-area__file-upload js-file-upload" accept=".ppk" tabInde="-1">
+        </p>
+      </div>
+    </section>
+    <section class="hide download js-download">
+      <h2 class="download__title">Success!</h2>
+      <ul class="download__list">
+        <li class="download__list-element">
+          ID: <span class="js-download-plugin-id"></span>
+        </li>
+        <li class="download__list-element">
+          <span class="ok-icon"><i class="fas fa-check-circle"></i></span>
+          <span><i class="far fa-folder"></i></span>
+          <a class="js-download-plugin" download="plugin.zip">
+            plugin.zip
+          </a>
+        </li>
+        <li class="download__list-element">
+          <span class="ok-icon"><i class="fas fa-check-circle"></i></span>
+          <i class="fas fa-key"></i>
+          <a class="js-download-ppk" download="private.ppk">
+            private.ppk
+          </a>
+        </li>
+      </ul>
+    </section>
+    <section class="hide error js-error">
+      <h2 class="error__title">Failed</h2>
+      <ul class="error__messages js-error-messages"></ul>
+    </section>
+    <section class="action">
+      <button class="action__button action__button--create js-create-btn disabled">Create</button>
+      <button class="action__button action__button--create js-create-loading-btn hide">
+        <span class="loading"><i class="fas fa-spinner"></i></span>
+      </button>
+      <button class="action__button action__button--clear js-clear-btn">Reset</button>
+    </section>
+  </main>
+  <footer class="footer">
+      <p>Lang: <a href="./index-ja.html">JP</a></p>
+  </footer>
+</body>
+</html>