@uiw/copy-to-clipboard 1.0.13 → 1.0.15

package/README.md

@@ -1,4 +1,4 @@
-copy text to clipboard
+Copy Text to Clipboard
 ===
 
 ![No Dependencies](http://jaywcjlove.github.io/sb/status/no-dependencies.svg)
@@ -6,7 +6,7 @@ copy text to clipboard
 [![Build & Deploy](https://github.com/uiwjs/copy-to-clipboard/workflows/Build/badge.svg)](https://github.com/uiwjs/react-codemirror/actions)
 [![Open in unpkg](https://img.shields.io/badge/Open%20in-unpkg-blue)](https://uiwjs.github.io/npm-unpkg/#/pkg/@uiw/copy-to-clipboard/file/README.md)
 [![npm version](https://img.shields.io/npm/v/@uiw/copy-to-clipboard.svg)](https://www.npmjs.com/package/@uiw/copy-to-clipboard)
-[![Repo Dependents](https://badgen.net/github/dependents-repo/uiwjs/copy-to-clipboard)](https://github.com/jaywcjlove/rehype-rewrite/network/dependents)
+[![Repo Dependents](https://badgen.net/github/dependents-repo/uiwjs/copy-to-clipboard)](https://github.com/uiwjs/copy-to-clipboard/network/dependents)
 
 **This styling is an extra step which is likely not required.**
 

package/dist/copy-to-clipboard.cjs.js

@@ -1,11 +1,11 @@
 /**! 
- * @uiw/copy-to-clipboard v1.0.13 
+ * @uiw/copy-to-clipboard v1.0.15 
  * Copy to clipboard. 
  * 
  * Copyright (c) 2023 Kenny Wang 
  * https://github.com/uiwjs/copy-to-clipboard.git 
  * 
- * @website: https://github.com/uiwjs/copy-to-clipboard.git
+ * @website: https://uiwjs.github.io/copy-to-clipboard
  
  * Licensed under the MIT license 
  */
@@ -38,6 +38,7 @@
  * @param {CopyTextToClipboard} cb 
  */
 function copyTextToClipboard(text, cb) {
+  if (typeof document === "undefined") return;
   const el = document.createElement('textarea');
   el.value = text;
   el.setAttribute('readonly', '');

package/dist/copy-to-clipboard.esm.js

@@ -1,11 +1,11 @@
 /**! 
- * @uiw/copy-to-clipboard v1.0.13 
+ * @uiw/copy-to-clipboard v1.0.15 
  * Copy to clipboard. 
  * 
  * Copyright (c) 2023 Kenny Wang 
  * https://github.com/uiwjs/copy-to-clipboard.git 
  * 
- * @website: https://github.com/uiwjs/copy-to-clipboard.git
+ * @website: https://uiwjs.github.io/copy-to-clipboard
  
  * Licensed under the MIT license 
  */
@@ -36,6 +36,7 @@
  * @param {CopyTextToClipboard} cb 
  */
 function copyTextToClipboard(text, cb) {
+  if (typeof document === "undefined") return;
   const el = document.createElement('textarea');
   el.value = text;
   el.setAttribute('readonly', '');

package/dist/copy-to-clipboard.umd.js

@@ -1,11 +1,11 @@
 /**! 
- * @uiw/copy-to-clipboard v1.0.13 
+ * @uiw/copy-to-clipboard v1.0.15 
  * Copy to clipboard. 
  * 
  * Copyright (c) 2023 Kenny Wang 
  * https://github.com/uiwjs/copy-to-clipboard.git 
  * 
- * @website: https://github.com/uiwjs/copy-to-clipboard.git
+ * @website: https://uiwjs.github.io/copy-to-clipboard
  
  * Licensed under the MIT license 
  */
@@ -42,6 +42,7 @@
    * @param {CopyTextToClipboard} cb 
    */
   function copyTextToClipboard(text, cb) {
+    if (typeof document === "undefined") return;
     const el = document.createElement('textarea');
     el.value = text;
     el.setAttribute('readonly', '');

package/dist/copy-to-clipboard.umd.js.map

@@ -1 +1 @@
-{"version":3,"file":"copy-to-clipboard.umd.js","sources":["../src/main.js"],"sourcesContent":["/**\n * *** This styling is an extra step which is likely not required. ***\n * https://github.com/w3c/clipboard-apis/blob/master/explainer.adoc#writing-to-the-clipboard\n * \n * Why is it here? To ensure:\n * \n * 1. the element is able to have focus and selection.\n * 2. if element was to flash render it has minimal visual impact.\n * 3. less flakyness with selection and copying which **might** occur if\n *     the textarea element is not visible.\n *\n *   The likelihood is the element won't even render, not even a flash,\n *   so some of these are just precautions. However in IE the element\n *   is visible whilst the popup box asking the user for permission for\n *   the web page to copy to the clipboard.\n *  \n *   Place in top-left corner of screen regardless of scroll position.\n *\n * @typedef CopyTextToClipboard\n * @property {(text: string, method?: (isCopy: boolean) => void) => void} void\n * @returns {void}\n * \n * @param {string} text \n * @param {CopyTextToClipboard} cb \n */\nexport default function copyTextToClipboard(text, cb) {\n  const el = document.createElement('textarea');\n  el.value = text;\n  el.setAttribute('readonly', '');\n  el.style = {\n    position: 'absolute',\n    left: '-9999px',\n  }\n  document.body.appendChild(el);\n  const selected = document.getSelection().rangeCount > 0 ? document.getSelection().getRangeAt(0) : false;\n  el.select();\n  let isCopy = false;\n  try {\n    const successful = document.execCommand('copy');\n    isCopy = !!successful;\n  } catch (err) {\n    isCopy = false;\n  }\n  document.body.removeChild(el);\n  if (selected && document.getSelection) {\n    document.getSelection().removeAllRanges();\n    document.getSelection().addRange(selected);\n  }\n  cb && cb(isCopy);\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;EAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACe,SAAS,mBAAmB,CAAC,IAAI,EAAE,EAAE,EAAE;EACtD,EAAE,MAAM,EAAE,GAAG,QAAQ,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC;EAChD,EAAE,EAAE,CAAC,KAAK,GAAG,IAAI,CAAC;EAClB,EAAE,EAAE,CAAC,YAAY,CAAC,UAAU,EAAE,EAAE,CAAC,CAAC;EAClC,EAAE,EAAE,CAAC,KAAK,GAAG;EACb,IAAI,QAAQ,EAAE,UAAU;EACxB,IAAI,IAAI,EAAE,SAAS;EACnB,IAAG;EACH,EAAE,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,EAAE,CAAC,CAAC;EAChC,EAAE,MAAM,QAAQ,GAAG,QAAQ,CAAC,YAAY,EAAE,CAAC,UAAU,GAAG,CAAC,GAAG,QAAQ,CAAC,YAAY,EAAE,CAAC,UAAU,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC;EAC1G,EAAE,EAAE,CAAC,MAAM,EAAE,CAAC;EACd,EAAE,IAAI,MAAM,GAAG,KAAK,CAAC;EACrB,EAAE,IAAI;EACN,IAAI,MAAM,UAAU,GAAG,QAAQ,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC;EACpD,IAAI,MAAM,GAAG,CAAC,CAAC,UAAU,CAAC;EAC1B,GAAG,CAAC,OAAO,GAAG,EAAE;EAChB,IAAI,MAAM,GAAG,KAAK,CAAC;EACnB,GAAG;EACH,EAAE,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,EAAE,CAAC,CAAC;EAChC,EAAE,IAAI,QAAQ,IAAI,QAAQ,CAAC,YAAY,EAAE;EACzC,IAAI,QAAQ,CAAC,YAAY,EAAE,CAAC,eAAe,EAAE,CAAC;EAC9C,IAAI,QAAQ,CAAC,YAAY,EAAE,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC;EAC/C,GAAG;EACH,EAAE,EAAE,IAAI,EAAE,CAAC,MAAM,CAAC,CAAC;EACnB;;;;;;;;"}
+{"version":3,"file":"copy-to-clipboard.umd.js","sources":["../src/main.js"],"sourcesContent":["/**\n * *** This styling is an extra step which is likely not required. ***\n * https://github.com/w3c/clipboard-apis/blob/master/explainer.adoc#writing-to-the-clipboard\n * \n * Why is it here? To ensure:\n * \n * 1. the element is able to have focus and selection.\n * 2. if element was to flash render it has minimal visual impact.\n * 3. less flakyness with selection and copying which **might** occur if\n *     the textarea element is not visible.\n *\n *   The likelihood is the element won't even render, not even a flash,\n *   so some of these are just precautions. However in IE the element\n *   is visible whilst the popup box asking the user for permission for\n *   the web page to copy to the clipboard.\n *  \n *   Place in top-left corner of screen regardless of scroll position.\n *\n * @typedef CopyTextToClipboard\n * @property {(text: string, method?: (isCopy: boolean) => void) => void} void\n * @returns {void}\n * \n * @param {string} text \n * @param {CopyTextToClipboard} cb \n */\nexport default function copyTextToClipboard(text, cb) {\n  if (typeof document === \"undefined\") return;\n  const el = document.createElement('textarea');\n  el.value = text;\n  el.setAttribute('readonly', '');\n  el.style = {\n    position: 'absolute',\n    left: '-9999px',\n  }\n  document.body.appendChild(el);\n  const selected = document.getSelection().rangeCount > 0 ? document.getSelection().getRangeAt(0) : false;\n  el.select();\n  let isCopy = false;\n  try {\n    const successful = document.execCommand('copy');\n    isCopy = !!successful;\n  } catch (err) {\n    isCopy = false;\n  }\n  document.body.removeChild(el);\n  if (selected && document.getSelection) {\n    document.getSelection().removeAllRanges();\n    document.getSelection().addRange(selected);\n  }\n  cb && cb(isCopy);\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;EAAA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACe,SAAS,mBAAmB,CAAC,IAAI,EAAE,EAAE,EAAE;EACtD,EAAE,IAAI,OAAO,QAAQ,KAAK,WAAW,EAAE,OAAO;EAC9C,EAAE,MAAM,EAAE,GAAG,QAAQ,CAAC,aAAa,CAAC,UAAU,CAAC,CAAC;EAChD,EAAE,EAAE,CAAC,KAAK,GAAG,IAAI,CAAC;EAClB,EAAE,EAAE,CAAC,YAAY,CAAC,UAAU,EAAE,EAAE,CAAC,CAAC;EAClC,EAAE,EAAE,CAAC,KAAK,GAAG;EACb,IAAI,QAAQ,EAAE,UAAU;EACxB,IAAI,IAAI,EAAE,SAAS;EACnB,IAAG;EACH,EAAE,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,EAAE,CAAC,CAAC;EAChC,EAAE,MAAM,QAAQ,GAAG,QAAQ,CAAC,YAAY,EAAE,CAAC,UAAU,GAAG,CAAC,GAAG,QAAQ,CAAC,YAAY,EAAE,CAAC,UAAU,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC;EAC1G,EAAE,EAAE,CAAC,MAAM,EAAE,CAAC;EACd,EAAE,IAAI,MAAM,GAAG,KAAK,CAAC;EACrB,EAAE,IAAI;EACN,IAAI,MAAM,UAAU,GAAG,QAAQ,CAAC,WAAW,CAAC,MAAM,CAAC,CAAC;EACpD,IAAI,MAAM,GAAG,CAAC,CAAC,UAAU,CAAC;EAC1B,GAAG,CAAC,OAAO,GAAG,EAAE;EAChB,IAAI,MAAM,GAAG,KAAK,CAAC;EACnB,GAAG;EACH,EAAE,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,EAAE,CAAC,CAAC;EAChC,EAAE,IAAI,QAAQ,IAAI,QAAQ,CAAC,YAAY,EAAE;EACzC,IAAI,QAAQ,CAAC,YAAY,EAAE,CAAC,eAAe,EAAE,CAAC;EAC9C,IAAI,QAAQ,CAAC,YAAY,EAAE,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC;EAC/C,GAAG;EACH,EAAE,EAAE,IAAI,EAAE,CAAC,MAAM,CAAC,CAAC;EACnB;;;;;;;;"}

package/dist/copy-to-clipboard.umd.min.js

@@ -1,3 +1,3 @@
-/*! @uiw/copy-to-clipboard v1.0.13 | MIT © 2023 Kenny Wang https://github.com/uiwjs/copy-to-clipboard.git */
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):(e="undefined"!=typeof globalThis?globalThis:e||self).copyTextToClipboard=t()}(this,(function(){"use strict";return function(e,t){const o=document.createElement("textarea");o.value=e,o.setAttribute("readonly",""),o.style={position:"absolute",left:"-9999px"},document.body.appendChild(o);const n=document.getSelection().rangeCount>0&&document.getSelection().getRangeAt(0);o.select();let c=!1;try{c=!!document.execCommand("copy")}catch(e){c=!1}document.body.removeChild(o),n&&document.getSelection&&(document.getSelection().removeAllRanges(),document.getSelection().addRange(n)),t&&t(c)}}));
+/*! @uiw/copy-to-clipboard v1.0.15 | MIT © 2023 Kenny Wang https://uiwjs.github.io/copy-to-clipboard */
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t():"function"==typeof define&&define.amd?define(t):(e="undefined"!=typeof globalThis?globalThis:e||self).copyTextToClipboard=t()}(this,(function(){"use strict";return function(e,t){if("undefined"==typeof document)return;const o=document.createElement("textarea");o.value=e,o.setAttribute("readonly",""),o.style={position:"absolute",left:"-9999px"},document.body.appendChild(o);const n=document.getSelection().rangeCount>0&&document.getSelection().getRangeAt(0);o.select();let d=!1;try{d=!!document.execCommand("copy")}catch(e){d=!1}document.body.removeChild(o),n&&document.getSelection&&(document.getSelection().removeAllRanges(),document.getSelection().addRange(n)),t&&t(d)}}));
 //# sourceMappingURL=copy-to-clipboard.umd.min.js.map

package/dist/copy-to-clipboard.umd.min.js.map

@@ -1 +1 @@
-{"version":3,"file":"copy-to-clipboard.umd.min.js","sources":["../src/main.js"],"sourcesContent":["/**\n * *** This styling is an extra step which is likely not required. ***\n * https://github.com/w3c/clipboard-apis/blob/master/explainer.adoc#writing-to-the-clipboard\n * \n * Why is it here? To ensure:\n * \n * 1. the element is able to have focus and selection.\n * 2. if element was to flash render it has minimal visual impact.\n * 3. less flakyness with selection and copying which **might** occur if\n *     the textarea element is not visible.\n *\n *   The likelihood is the element won't even render, not even a flash,\n *   so some of these are just precautions. However in IE the element\n *   is visible whilst the popup box asking the user for permission for\n *   the web page to copy to the clipboard.\n *  \n *   Place in top-left corner of screen regardless of scroll position.\n *\n * @typedef CopyTextToClipboard\n * @property {(text: string, method?: (isCopy: boolean) => void) => void} void\n * @returns {void}\n * \n * @param {string} text \n * @param {CopyTextToClipboard} cb \n */\nexport default function copyTextToClipboard(text, cb) {\n  const el = document.createElement('textarea');\n  el.value = text;\n  el.setAttribute('readonly', '');\n  el.style = {\n    position: 'absolute',\n    left: '-9999px',\n  }\n  document.body.appendChild(el);\n  const selected = document.getSelection().rangeCount > 0 ? document.getSelection().getRangeAt(0) : false;\n  el.select();\n  let isCopy = false;\n  try {\n    const successful = document.execCommand('copy');\n    isCopy = !!successful;\n  } catch (err) {\n    isCopy = false;\n  }\n  document.body.removeChild(el);\n  if (selected && document.getSelection) {\n    document.getSelection().removeAllRanges();\n    document.getSelection().addRange(selected);\n  }\n  cb && cb(isCopy);\n};\n"],"names":["text","cb","el","document","createElement","value","setAttribute","style","position","left","body","appendChild","selected","getSelection","rangeCount","getRangeAt","select","isCopy","execCommand","err","removeChild","removeAllRanges","addRange"],"mappings":";2PAyBe,SAA6BA,EAAMC,GAChD,MAAMC,EAAKC,SAASC,cAAc,YAClCF,EAAGG,MAAQL,EACXE,EAAGI,aAAa,WAAY,IAC5BJ,EAAGK,MAAQ,CACTC,SAAU,WACVC,KAAM,WAERN,SAASO,KAAKC,YAAYT,GAC1B,MAAMU,EAAWT,SAASU,eAAeC,WAAa,GAAIX,SAASU,eAAeE,WAAW,GAC7Fb,EAAGc,SACH,IAAIC,GAAS,EACb,IAEEA,IADmBd,SAASe,YAAY,OAEzC,CAAC,MAAOC,GACPF,GAAS,CACV,CACDd,SAASO,KAAKU,YAAYlB,GACtBU,GAAYT,SAASU,eACvBV,SAASU,eAAeQ,kBACxBlB,SAASU,eAAeS,SAASV,IAEnCX,GAAMA,EAAGgB,EACX"}
+{"version":3,"file":"copy-to-clipboard.umd.min.js","sources":["../src/main.js"],"sourcesContent":["/**\n * *** This styling is an extra step which is likely not required. ***\n * https://github.com/w3c/clipboard-apis/blob/master/explainer.adoc#writing-to-the-clipboard\n * \n * Why is it here? To ensure:\n * \n * 1. the element is able to have focus and selection.\n * 2. if element was to flash render it has minimal visual impact.\n * 3. less flakyness with selection and copying which **might** occur if\n *     the textarea element is not visible.\n *\n *   The likelihood is the element won't even render, not even a flash,\n *   so some of these are just precautions. However in IE the element\n *   is visible whilst the popup box asking the user for permission for\n *   the web page to copy to the clipboard.\n *  \n *   Place in top-left corner of screen regardless of scroll position.\n *\n * @typedef CopyTextToClipboard\n * @property {(text: string, method?: (isCopy: boolean) => void) => void} void\n * @returns {void}\n * \n * @param {string} text \n * @param {CopyTextToClipboard} cb \n */\nexport default function copyTextToClipboard(text, cb) {\n  if (typeof document === \"undefined\") return;\n  const el = document.createElement('textarea');\n  el.value = text;\n  el.setAttribute('readonly', '');\n  el.style = {\n    position: 'absolute',\n    left: '-9999px',\n  }\n  document.body.appendChild(el);\n  const selected = document.getSelection().rangeCount > 0 ? document.getSelection().getRangeAt(0) : false;\n  el.select();\n  let isCopy = false;\n  try {\n    const successful = document.execCommand('copy');\n    isCopy = !!successful;\n  } catch (err) {\n    isCopy = false;\n  }\n  document.body.removeChild(el);\n  if (selected && document.getSelection) {\n    document.getSelection().removeAllRanges();\n    document.getSelection().addRange(selected);\n  }\n  cb && cb(isCopy);\n};\n"],"names":["text","cb","document","el","createElement","value","setAttribute","style","position","left","body","appendChild","selected","getSelection","rangeCount","getRangeAt","select","isCopy","execCommand","err","removeChild","removeAllRanges","addRange"],"mappings":";2PAyBe,SAA6BA,EAAMC,GAChD,GAAwB,oBAAbC,SAA0B,OACrC,MAAMC,EAAKD,SAASE,cAAc,YAClCD,EAAGE,MAAQL,EACXG,EAAGG,aAAa,WAAY,IAC5BH,EAAGI,MAAQ,CACTC,SAAU,WACVC,KAAM,WAERP,SAASQ,KAAKC,YAAYR,GAC1B,MAAMS,EAAWV,SAASW,eAAeC,WAAa,GAAIZ,SAASW,eAAeE,WAAW,GAC7FZ,EAAGa,SACH,IAAIC,GAAS,EACb,IAEEA,IADmBf,SAASgB,YAAY,OAEzC,CAAC,MAAOC,GACPF,GAAS,CACV,CACDf,SAASQ,KAAKU,YAAYjB,GACtBS,GAAYV,SAASW,eACvBX,SAASW,eAAeQ,kBACxBnB,SAASW,eAAeS,SAASV,IAEnCX,GAAMA,EAAGgB,EACX"}

package/dist/css/copy.css

@@ -0,0 +1,49 @@
+markdown-style pre > .copied,
+markdown-style [class*='language-'] .copied {
+  display: flex;
+  position: absolute;
+  cursor: pointer;
+  color: #a5afbb;
+  top: 6px;
+  right: 6px;
+  border-radius: 5px;
+  background: #82828226;
+  padding: 6px;
+  font-size: 12px;
+  transition: all 0.3s;
+  z-index: 10;
+}
+markdown-style pre > .copied:not(.active),
+markdown-style [class*='language-'] .copied:not(.active) {
+  visibility: hidden;
+}
+markdown-style pre:hover > .copied,
+markdown-style [class*='language-']:hover .copied {
+  visibility: visible;
+}
+markdown-style pre:hover > .copied:hover,
+markdown-style [class*='language-']:hover .copied:hover {
+  background: #4caf50;
+  color: #fff;
+}
+markdown-style [class*='language-']:hover .copied:active,
+markdown-style pre > .copied.active {
+  background: #2e9b33;
+  color: #fff;
+}
+markdown-style pre > .copied .octicon-copy,
+markdown-style [class*='language-'] .copied .octicon-copy {
+  display: block;
+}
+markdown-style pre > .copied .octicon-check,
+markdown-style [class*='language-'] .copied .octicon-check {
+  display: none;
+}
+markdown-style pre > .active .octicon-copy,
+markdown-style [class*='language-'] .active .octicon-copy {
+  display: none;
+}
+markdown-style pre > .active .octicon-check,
+markdown-style [class*='language-'] .active .octicon-check {
+  display: block;
+}

package/dist/css/demo-preview.css

@@ -0,0 +1,62 @@
+.idoc-demo-warpper {
+  overflow: hidden;
+  min-height: 60px;
+  margin-bottom: 16px;
+}
+
+div.idoc-demo-warpper {
+  position: relative;
+  background-color: var(--color-canvas-subtle);
+  border-radius: 6px;
+}
+
+div.idoc-demo-warpper > pre {
+  padding: 16px;
+  overflow: auto;
+  display: block;
+  margin-bottom: 0 !important;
+  height: 100%;
+}
+
+div.idoc-demo-previw {
+  padding: 10px;
+  font-size: initial;
+  line-height: initial;
+  line-height: initial;
+  font-family: initial;
+  overflow: auto;
+}
+.idoc-demo-previw {
+  border: 0;
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  width: 100%;
+  background-color: var(--color-canvas-subtle);
+  border: 1px solid var(--color-border-default);
+  border-radius: 6px;
+  z-index: 9;
+  transition: left 0.3s cubic-bezier(1, 0, 1, 0);
+}
+
+.idoc-demo-previw.ishiden {
+  left: -100%;
+}
+button.idoc-toggle-previw {
+  user-select: none;
+  position: absolute;
+  z-index: 10;
+  border: transparent;
+  background-color: var(--color-border-default);
+  cursor: pointer;
+  font-size: 12px;
+  padding: 2px 5px;
+  border-radius: 3px;
+  bottom: 5px;
+  right: 5px;
+}
+button.idoc-toggle-previw:hover {
+  color: var(--color-theme-text);
+}

package/dist/css/main.css

@@ -0,0 +1,258 @@
+[data-color-mode*='dark'],
+[data-color-mode*='dark'] body {
+  --color-header-bg: #3a3a3a8f;
+  --color-header-border: #21262d;
+  --color-hover: #ffffff1c;
+  --color-hoc-bg: #fffefe08;
+}
+
+[data-color-mode*='light'],
+[data-color-mode*='light'] body {
+  --color-header-bg: #ffffff52;
+  --color-header-border: #d3d3d3;
+  --color-hover: #0000001a;
+  --color-hoc-bg: #00000008;
+}
+
+*,
+:after,
+:before {
+  box-sizing: border-box;
+}
+
+html {
+  scroll-behavior: smooth;
+}
+
+body {
+  margin: 0;
+  font-size: 14px;
+  font-family: -apple-system, 'Segoe UI', Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji';
+}
+
+a {
+  text-decoration: none;
+  color: var(--color-accent-fg);
+}
+a:hover {
+  text-decoration: underline;
+}
+
+.warpper {
+  max-width: 960px;
+  margin: 0 auto;
+}
+
+.warpper dark-mode {
+  font-size: 18px;
+}
+
+markdown-style {
+  min-height: 60vh;
+  grid-area: main;
+  margin-bottom: 18px !important;
+}
+markdown-style img {
+  background-color: transparent !important;
+}
+
+.warpper-content {
+  padding: 0 20px;
+  padding-top: 32px;
+  margin-top: 48px;
+  display: grid;
+  grid-template-columns: minmax(0, 3.5fr) minmax(0, 15rem);
+  grid-template-areas: 'main toc';
+  grid-gap: 18px;
+  gap: 18px;
+}
+.warpper-content.sidebar {
+  grid-template-columns: 180px minmax(0, 3.5fr) minmax(0, 15rem);
+  grid-template-areas: 'sidebar main toc';
+}
+.warpper-content.notocs {
+  grid-template-columns: minmax(0, 3.5fr);
+  grid-template-areas: 'main';
+}
+.warpper-content.sidebar.notocs {
+  grid-template-columns: 180px minmax(0, 3.5fr);
+  grid-template-areas: 'sidebar main';
+}
+
+nav.tocs .is-position-fixed {
+  top: 58px !important;
+  max-height: calc(100% - 68px);
+}
+nav.tocs {
+  position: relative;
+  grid-area: toc;
+}
+nav.tocs p {
+  color: var(--color-fg-muted);
+  margin-bottom: 0;
+}
+nav.tocs a {
+  color: var(--color-fg-muted);
+  display: block;
+  padding: 0 5px;
+}
+nav.tocs .inner {
+  padding: 10px 10px 10px 10px;
+  background-color: var(--color-hoc-bg);
+  max-width: 240px;
+  width: 240px;
+}
+
+a.gototop {
+  position: fixed;
+  bottom: 10px;
+  right: 10px;
+  display: inline-block;
+  background: var(--color-theme-text);
+  padding: 5px;
+  border-radius: 5px;
+  z-index: 9999;
+  color: var(--color-theme-bg);
+  font-size: 10px;
+  opacity: 0;
+  transition: all 0.3s;
+}
+a.gototop:hover {
+  opacity: 1;
+}
+
+.header {
+  position: fixed;
+  width: 100%;
+  background: var(--color-header-bg);
+  backdrop-filter: saturate(180%) blur(0.4rem);
+  background-color: var(--color-header-bg);
+  border-bottom: 1px solid var(--color-header-border);
+  z-index: 99;
+  top: 0;
+}
+
+.header .inner {
+  display: flex;
+  justify-content: space-between;
+  min-height: 45px;
+  padding-left: 10px;
+  padding-right: 10px;
+}
+.header .logo {
+  font-weight: bold;
+  display: flex;
+  color: var(--color-theme-text);
+  align-items: center;
+}
+.header .logo:hover {
+  text-decoration: none;
+}
+.header .logo .title {
+  padding-left: 8px;
+  display: flex;
+}
+.header .logo .title sup {
+  margin-top: -5px;
+  padding-left: 2px;
+  font-weight: normal;
+  color: var(--color-fg-subtle);
+}
+.header .logo img,
+.header .logo svg {
+  height: 26px;
+  display: block;
+}
+
+.header .content {
+  display: flex;
+  align-items: center;
+}
+
+.header .menu {
+  padding: 0;
+  margin: 0;
+  display: flex;
+  list-style: none;
+  padding-right: 10px;
+}
+.header .menu li {
+  display: flex;
+  align-items: center;
+}
+.header a {
+  color: var(--color-theme-text);
+  font-weight: bold;
+}
+.header .menu a {
+  padding: 3px 7px;
+  font-size: 14px;
+  border-radius: 2px;
+}
+.header .menu a.active {
+  background-color: var(--color-hover);
+}
+
+.header .github {
+  width: 18px;
+  height: 18px;
+  margin-right: 8px;
+}
+
+section.article-footer {
+  display: flex;
+  align-items: center;
+  font-size: 14px;
+  justify-content: space-between;
+  margin-top: 12px;
+}
+
+section.article-footer a {
+  display: flex;
+  align-items: center;
+}
+
+section.article-footer .edit-button {
+  padding-right: 8px;
+}
+section.article-footer .edit-button svg {
+  height: 15px;
+  margin-right: 6px;
+}
+
+section.article-footer .atime {
+  font-size: 12px;
+  color: var(--color-fg-muted);
+  margin-top: 2px;
+}
+
+.previous {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  grid-gap: 12px;
+  gap: 12px;
+  background-color: var(--color-canvas-subtle);
+  padding: 10px;
+  font-size: 14px;
+  border-radius: 5px;
+  margin-top: 26px;
+}
+.previous a {
+  display: flex;
+  align-items: center;
+}
+.previous a.prev svg {
+  margin-right: 3px;
+}
+.previous a.next svg {
+  margin-left: 3px;
+}
+
+.footer {
+  text-align: center;
+  border-top: 1px solid var(--color-header-border);
+  padding: 32px 0 110px 0;
+  color: var(--color-fg-muted);
+  font-size: 14px;
+}

package/dist/css/media.css

@@ -0,0 +1,52 @@
+@media only screen and (min-width: 1024px) {
+  footer.article-footer,
+  .warpper {
+    max-width: 1200px;
+  }
+}
+
+@media screen and (max-width: 900px) {
+  .warpper-content {
+    grid-template-columns: minmax(0, 3.5fr);
+    grid-template-areas: 'main';
+  }
+  .warpper-content.sidebar {
+    grid-template-areas: 'sidebar main';
+    grid-template-columns: 180px minmax(0, 41rem);
+  }
+  nav.tocs {
+    display: none;
+  }
+}
+
+@media screen and (max-width: 600px) {
+  .warpper-content {
+    grid-template-columns: minmax(0, 3.5fr);
+    grid-template-areas: 'main';
+  }
+  .warpper-content.sidebar {
+    grid-template-areas: 'main';
+    grid-template-columns: minmax(0, 41rem);
+  }
+  nav.tocs,
+  .sidebar-border {
+    display: none;
+  }
+}
+
+@media print {
+  .header,
+  nav.tocs,
+  section.article-footer,
+  .sidebar-border,
+  .previous,
+  .footer,
+  a.gototop {
+    display: none;
+  }
+  .warpper-content {
+    margin: 0;
+    padding: 0;
+    display: initial;
+  }
+}

package/dist/css/sidebar.css

@@ -0,0 +1,41 @@
+.sidebar-border {
+  border-right: 1px solid var(--color-border-muted);
+}
+aside.sidebar {
+  min-width: 160px;
+  margin-left: -5px;
+  padding-bottom: 20px;
+  padding-right: 6px;
+  position: -webkit-sticky;
+  position: sticky;
+  top: 56px;
+  grid-area: sidebar;
+  overflow: auto;
+  max-height: calc(100vh - 56px);
+  padding-bottom: 36px;
+}
+aside.sidebar label:first-child {
+  padding-top: 0 !important;
+}
+aside.sidebar a:first-child {
+  margin-top: 0 !important;
+}
+aside.sidebar label {
+  font-size: 12px;
+  padding: 5px 0 3px 0;
+  display: block;
+  padding-left: 5px !important;
+}
+aside.sidebar a.active {
+  color: var(--color-prettylights-syntax-markup-inserted-text);
+  background-color: var(--color-hover);
+}
+aside.sidebar a {
+  display: block;
+  padding: 3px 5px 3px 5px;
+  border-radius: 3px;
+  margin: 3px 0;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  overflow: hidden;
+}

package/dist/css/tocbot.css

@@ -0,0 +1,52 @@
+.tocs {
+  line-height: 26px;
+}
+nav.tocs > .inner {
+  position: sticky;
+  top: 56px;
+  overflow: auto;
+  max-height: calc(100vh - 56px);
+}
+nav.tocs .inner > .tocs-list {
+  overflow: hidden;
+  position: relative;
+}
+.tocs .tocs-list li {
+  list-style: none;
+}
+.tocs-list {
+  margin: 0;
+  padding-left: 10px;
+}
+.tocs-list.is-collapsed {
+  max-height: 0;
+  overflow: hidden;
+  transition: max-height 0.3s cubic-bezier(0, 1, 0, 1);
+}
+.tocs-list.is-collapsed.is-open {
+  max-height: 9999px;
+  transition: max-height 0.3s cubic-bezier(1, 0, 1, 0);
+}
+
+.tocs-link {
+  height: 100%;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  overflow: hidden;
+}
+.tocs-link::before {
+  background-color: var(--color-border-default);
+  content: ' ';
+  display: inline-block;
+  height: inherit;
+  left: 0;
+  margin-top: -1px;
+  position: absolute;
+  width: 2px;
+}
+.tocs-link.is-active-link {
+  font-weight: 700;
+}
+.tocs-link.is-active-link::before {
+  background-color: #54bc4b;
+}