☰

GM_webextPref

A config library powered by webext-pref.

Tento skript by nemal byť nainštalovaný priamo. Je to knižnica pre ďalšie skripty, ktorú by mali používať cez meta príkaz // @require https://update.greasyfork.org/scripts/371339/961539/GM_webextPref.js 

  1. // ==UserScript==
  2. // @name gm-webext-pref
  3. // @version 0.4.2
  4. // @description A config library powered by webext-pref.
  5. // @license MIT
  6. // @author eight04 <eight04@gmail.com>
  7. // @homepageURL https://github.com/eight04/GM_webextPref
  8. // @supportURL https://github.com/eight04/GM_webextPref/issues
  9. // @namespace eight04.blogspot.com
  10. // @grant GM_getValue
  11. // @grant GM.getValue
  12. // @grant GM_setValue
  13. // @grant GM.setValue
  14. // @grant GM_deleteValue
  15. // @grant GM.deleteValue
  16. // @grant GM_addValueChangeListener
  17. // @grant GM_registerMenuCommand
  18. // @grant GM.registerMenuCommand
  19. // @include *
  20. // ==/UserScript==
  21.  
  22. var GM_webextPref = (function () {
  23.   'use strict';
  24.  
  25.   /**
  26.    * event-lite.js - Light-weight EventEmitter (less than 1KB when gzipped)
  27.    *
  28.    * @copyright Yusuke Kawasaki
  29.    * @license MIT
  30.    * @constructor
  31.    * @see https://github.com/kawanet/event-lite
  32.    * @see http://kawanet.github.io/event-lite/EventLite.html
  33.    * @example
  34.    * var EventLite = require("event-lite");
  35.    *
  36.    * function MyClass() {...}             // your class
  37.    *
  38.    * EventLite.mixin(MyClass.prototype);  // import event methods
  39.    *
  40.    * var obj = new MyClass();
  41.    * obj.on("foo", function() {...});     // add event listener
  42.    * obj.once("bar", function() {...});   // add one-time event listener
  43.    * obj.emit("foo");                     // dispatch event
  44.    * obj.emit("bar");                     // dispatch another event
  45.    * obj.off("foo");                      // remove event listener
  46.    */
  47.  
  48.   function EventLite() {
  49.     if (!(this instanceof EventLite)) return new EventLite();
  50.   }
  51.  
  52.   const _module_ = {exports: {}};
  53.   (function(EventLite) {
  54.     // export the class for node.js
  55.     if ("undefined" !== typeof _module_) _module_.exports = EventLite;
  56.  
  57.     // property name to hold listeners
  58.     var LISTENERS = "listeners";
  59.  
  60.     // methods to export
  61.     var methods = {
  62.       on: on,
  63.       once: once,
  64.       off: off,
  65.       emit: emit
  66.     };
  67.  
  68.     // mixin to self
  69.     mixin(EventLite.prototype);
  70.  
  71.     // export mixin function
  72.     EventLite.mixin = mixin;
  73.  
  74.     /**
  75.      * Import on(), once(), off() and emit() methods into target object.
  76.      *
  77.      * @function EventLite.mixin
  78.      * @param target {Prototype}
  79.      */
  80.  
  81.     function mixin(target) {
  82.       for (var key in methods) {
  83.         target[key] = methods[key];
  84.       }
  85.       return target;
  86.     }
  87.  
  88.     /**
  89.      * Add an event listener.
  90.      *
  91.      * @function EventLite.prototype.on
  92.      * @param type {string}
  93.      * @param func {Function}
  94.      * @returns {EventLite} Self for method chaining
  95.      */
  96.  
  97.     function on(type, func) {
  98.       getListeners(this, type).push(func);
  99.       return this;
  100.     }
  101.  
  102.     /**
  103.      * Add one-time event listener.
  104.      *
  105.      * @function EventLite.prototype.once
  106.      * @param type {string}
  107.      * @param func {Function}
  108.      * @returns {EventLite} Self for method chaining
  109.      */
  110.  
  111.     function once(type, func) {
  112.       var that = this;
  113.       wrap.originalListener = func;
  114.       getListeners(that, type).push(wrap);
  115.       return that;
  116.  
  117.       function wrap() {
  118.         off.call(that, type, wrap);
  119.         func.apply(this, arguments);
  120.       }
  121.     }
  122.  
  123.     /**
  124.      * Remove an event listener.
  125.      *
  126.      * @function EventLite.prototype.off
  127.      * @param [type] {string}
  128.      * @param [func] {Function}
  129.      * @returns {EventLite} Self for method chaining
  130.      */
  131.  
  132.     function off(type, func) {
  133.       var that = this;
  134.       var listners;
  135.       if (!arguments.length) {
  136.         delete that[LISTENERS];
  137.       } else if (!func) {
  138.         listners = that[LISTENERS];
  139.         if (listners) {
  140.           delete listners[type];
  141.           if (!Object.keys(listners).length) return off.call(that);
  142.         }
  143.       } else {
  144.         listners = getListeners(that, type, true);
  145.         if (listners) {
  146.           listners = listners.filter(ne);
  147.           if (!listners.length) return off.call(that, type);
  148.           that[LISTENERS][type] = listners;
  149.         }
  150.       }
  151.       return that;
  152.  
  153.       function ne(test) {
  154.         return test !== func && test.originalListener !== func;
  155.       }
  156.     }
  157.  
  158.     /**
  159.      * Dispatch (trigger) an event.
  160.      *
  161.      * @function EventLite.prototype.emit
  162.      * @param type {string}
  163.      * @param [value] {*}
  164.      * @returns {boolean} True when a listener received the event
  165.      */
  166.  
  167.     function emit(type, value) {
  168.       var that = this;
  169.       var listeners = getListeners(that, type, true);
  170.       if (!listeners) return false;
  171.       var arglen = arguments.length;
  172.       if (arglen === 1) {
  173.         listeners.forEach(zeroarg);
  174.       } else if (arglen === 2) {
  175.         listeners.forEach(onearg);
  176.       } else {
  177.         var args = Array.prototype.slice.call(arguments, 1);
  178.         listeners.forEach(moreargs);
  179.       }
  180.       return !!listeners.length;
  181.  
  182.       function zeroarg(func) {
  183.         func.call(that);
  184.       }
  185.  
  186.       function onearg(func) {
  187.         func.call(that, value);
  188.       }
  189.  
  190.       function moreargs(func) {
  191.         func.apply(that, args);
  192.       }
  193.     }
  194.  
  195.     /**
  196.      * @ignore
  197.      */
  198.  
  199.     function getListeners(that, type, readonly) {
  200.       if (readonly && !that[LISTENERS]) return;
  201.       var listeners = that[LISTENERS] || (that[LISTENERS] = {});
  202.       return listeners[type] || (listeners[type] = []);
  203.     }
  204.  
  205.   })(EventLite);
  206.   var EventLite$1 = _module_.exports;
  207.  
  208.   function createPref(DEFAULT, sep = "/") {
  209.     let storage;
  210.     let currentScope = "global";
  211.     let scopeList = ["global"];
  212.     const events = new EventLite$1;
  213.     const globalCache = {};
  214.     let scopedCache = {};
  215.     let currentCache = Object.assign({}, DEFAULT);
  216.     let initializing;
  217.     
  218.     return Object.assign(events, {
  219.       // storage,
  220.       // ready,
  221.       connect,
  222.       disconnect,
  223.       get,
  224.       getAll,
  225.       set,
  226.       getCurrentScope,
  227.       setCurrentScope,
  228.       addScope,
  229.       deleteScope,
  230.       getScopeList,
  231.       import: import_,
  232.       export: export_,
  233.       has
  234.     });
  235.     
  236.     function import_(input) {
  237.       const newScopeList = input.scopeList || scopeList.slice();
  238.       const scopes = new Set(newScopeList);
  239.       if (!scopes.has("global")) {
  240.         throw new Error("invalid scopeList");
  241.       }
  242.       const changes = {
  243.         scopeList: newScopeList
  244.       };
  245.       for (const [scopeName, scope] of Object.entries(input.scopes)) {
  246.         if (!scopes.has(scopeName)) {
  247.           continue;
  248.         }
  249.         for (const [key, value] of Object.entries(scope)) {
  250.           if (DEFAULT[key] == undefined) {
  251.             continue;
  252.           }
  253.           changes[`${scopeName}${sep}${key}`] = value;
  254.         }
  255.       }
  256.       return storage.setMany(changes);
  257.     }
  258.     
  259.     function export_() {
  260.       const keys = [];
  261.       for (const scope of scopeList) {
  262.         keys.push(...Object.keys(DEFAULT).map(k => `${scope}${sep}${k}`));
  263.       }
  264.       keys.push("scopeList");
  265.       return storage.getMany(keys)
  266.         .then(changes => {
  267.           const _scopeList = changes.scopeList || scopeList.slice();
  268.           const scopes = new Set(_scopeList);
  269.           const output = {
  270.             scopeList: _scopeList,
  271.             scopes: {}
  272.           };
  273.           for (const [key, value] of Object.entries(changes)) {
  274.             const sepIndex = key.indexOf(sep);
  275.             if (sepIndex < 0) {
  276.               continue;
  277.             }
  278.             const scope = key.slice(0, sepIndex);
  279.             const realKey = key.slice(sepIndex + sep.length);
  280.             if (!scopes.has(scope)) {
  281.               continue;
  282.             }
  283.             if (DEFAULT[realKey] == undefined) {
  284.               continue;
  285.             }
  286.             if (!output.scopes[scope]) {
  287.               output.scopes[scope] = {};
  288.             }
  289.             output.scopes[scope][realKey] = value;
  290.           }
  291.           return output;
  292.         });
  293.     }
  294.     
  295.     function connect(_storage) {
  296.       storage = _storage;
  297.       initializing = storage.getMany(
  298.         Object.keys(DEFAULT).map(k => `global${sep}${k}`).concat(["scopeList"])
  299.       )
  300.         .then(updateCache);
  301.       storage.on("change", updateCache);
  302.       return initializing;
  303.     }
  304.     
  305.     function disconnect() {
  306.       storage.off("change", updateCache);
  307.       storage = null;
  308.     }
  309.     
  310.     function updateCache(changes, rebuildCache = false) {
  311.       if (changes.scopeList) {
  312.         scopeList = changes.scopeList;
  313.         events.emit("scopeListChange", scopeList);
  314.         if (!scopeList.includes(currentScope)) {
  315.           return setCurrentScope("global");
  316.         }
  317.       }
  318.       const changedKeys = new Set;
  319.       for (const [key, value] of Object.entries(changes)) {
  320.         const [scope, realKey] = key.startsWith(`global${sep}`) ? ["global", key.slice(6 + sep.length)] :
  321.           key.startsWith(`${currentScope}${sep}`) ? [currentScope, key.slice(currentScope.length + sep.length)] :
  322.             [null, null];
  323.         if (!scope || DEFAULT[realKey] == null) {
  324.           continue;
  325.         }
  326.         if (scope === "global") {
  327.           changedKeys.add(realKey);
  328.           globalCache[realKey] = value;
  329.         }
  330.         if (scope === currentScope) {
  331.           changedKeys.add(realKey);
  332.           scopedCache[realKey] = value;
  333.         }
  334.       }
  335.       if (rebuildCache) {
  336.         Object.keys(DEFAULT).forEach(k => changedKeys.add(k));
  337.       }
  338.       const realChanges = {};
  339.       let isChanged = false;
  340.       for (const key of changedKeys) {
  341.         const value = scopedCache[key] != null ? scopedCache[key] :
  342.           globalCache[key] != null ? globalCache[key] :
  343.           DEFAULT[key];
  344.         if (currentCache[key] !== value) {
  345.           realChanges[key] = value;
  346.           currentCache[key] = value;
  347.           isChanged = true;
  348.         }
  349.       }
  350.       if (isChanged) {
  351.         events.emit("change", realChanges);
  352.       }
  353.     }
  354.     
  355.     function has(key) {
  356.       return currentCache.hasOwnProperty(key);
  357.     }
  358.     
  359.     function get(key) {
  360.       return currentCache[key];
  361.     }
  362.     
  363.     function getAll() {
  364.       return Object.assign({}, currentCache);
  365.     }
  366.     
  367.     function set(key, value) {
  368.       return storage.setMany({
  369.         [`${currentScope}${sep}${key}`]: value
  370.       });
  371.     }
  372.     
  373.     function getCurrentScope() {
  374.       return currentScope;
  375.     }
  376.     
  377.     function setCurrentScope(newScope) {
  378.       if (currentScope === newScope) {
  379.         return Promise.resolve(true);
  380.       }
  381.       if (!scopeList.includes(newScope)) {
  382.         return Promise.resolve(false);
  383.       }
  384.       return storage.getMany(Object.keys(DEFAULT).map(k => `${newScope}${sep}${k}`))
  385.         .then(changes => {
  386.           currentScope = newScope;
  387.           scopedCache = {};
  388.           events.emit("scopeChange", currentScope);
  389.           updateCache(changes, true);
  390.           return true;
  391.         });
  392.     }
  393.     
  394.     function addScope(scope) {
  395.       if (scopeList.includes(scope)) {
  396.         return Promise.reject(new Error(`${scope} already exists`));
  397.       }
  398.       if (scope.includes(sep)) {
  399.         return Promise.reject(new Error(`invalid word: ${sep}`));
  400.       }
  401.       return storage.setMany({
  402.         scopeList: scopeList.concat([scope])
  403.       });
  404.     }
  405.     
  406.     function deleteScope(scope) {
  407.       if (scope === "global") {
  408.         return Promise.reject(new Error(`cannot delete global`));
  409.       }
  410.       return Promise.all([
  411.         storage.setMany({
  412.           scopeList: scopeList.filter(s => s != scope)
  413.         }),
  414.         storage.deleteMany(Object.keys(DEFAULT).map(k => `${scope}${sep}${k}`))
  415.       ]);
  416.     }
  417.     
  418.     function getScopeList() {
  419.       return scopeList;
  420.     }
  421.   }
  422.  
  423.   const keys = Object.keys;
  424.   function isBoolean(val) {
  425.     return typeof val === "boolean"
  426.   }
  427.   function isElement(val) {
  428.     return val && typeof val.nodeType === "number"
  429.   }
  430.   function isString(val) {
  431.     return typeof val === "string"
  432.   }
  433.   function isNumber(val) {
  434.     return typeof val === "number"
  435.   }
  436.   function isObject(val) {
  437.     return typeof val === "object" ? val !== null : isFunction(val)
  438.   }
  439.   function isFunction(val) {
  440.     return typeof val === "function"
  441.   }
  442.   function isArrayLike(obj) {
  443.     return isObject(obj) && typeof obj.length === "number" && typeof obj.nodeType !== "number"
  444.   }
  445.   function forEach(value, fn) {
  446.     if (!value) return
  447.  
  448.     for (const key of keys(value)) {
  449.       fn(value[key], key);
  450.     }
  451.   }
  452.   function isRef(maybeRef) {
  453.     return isObject(maybeRef) && "current" in maybeRef
  454.   }
  455.  
  456.   function _objectWithoutPropertiesLoose(source, excluded) {
  457.     if (source == null) return {}
  458.     var target = {};
  459.     var sourceKeys = Object.keys(source);
  460.     var key, i;
  461.  
  462.     for (i = 0; i < sourceKeys.length; i++) {
  463.       key = sourceKeys[i];
  464.       if (excluded.indexOf(key) >= 0) continue
  465.       target[key] = source[key];
  466.     }
  467.  
  468.     return target
  469.   }
  470.  
  471.   const isUnitlessNumber = {
  472.     animationIterationCount: 0,
  473.     borderImageOutset: 0,
  474.     borderImageSlice: 0,
  475.     borderImageWidth: 0,
  476.     boxFlex: 0,
  477.     boxFlexGroup: 0,
  478.     boxOrdinalGroup: 0,
  479.     columnCount: 0,
  480.     columns: 0,
  481.     flex: 0,
  482.     flexGrow: 0,
  483.     flexPositive: 0,
  484.     flexShrink: 0,
  485.     flexNegative: 0,
  486.     flexOrder: 0,
  487.     gridArea: 0,
  488.     gridRow: 0,
  489.     gridRowEnd: 0,
  490.     gridRowSpan: 0,
  491.     gridRowStart: 0,
  492.     gridColumn: 0,
  493.     gridColumnEnd: 0,
  494.     gridColumnSpan: 0,
  495.     gridColumnStart: 0,
  496.     fontWeight: 0,
  497.     lineClamp: 0,
  498.     lineHeight: 0,
  499.     opacity: 0,
  500.     order: 0,
  501.     orphans: 0,
  502.     tabSize: 0,
  503.     widows: 0,
  504.     zIndex: 0,
  505.     zoom: 0,
  506.     fillOpacity: 0,
  507.     floodOpacity: 0,
  508.     stopOpacity: 0,
  509.     strokeDasharray: 0,
  510.     strokeDashoffset: 0,
  511.     strokeMiterlimit: 0,
  512.     strokeOpacity: 0,
  513.     strokeWidth: 0,
  514.   };
  515.  
  516.   function prefixKey(prefix, key) {
  517.     return prefix + key.charAt(0).toUpperCase() + key.substring(1)
  518.   }
  519.  
  520.   const prefixes = ["Webkit", "ms", "Moz", "O"];
  521.   keys(isUnitlessNumber).forEach((prop) => {
  522.     prefixes.forEach((prefix) => {
  523.       isUnitlessNumber[prefixKey(prefix, prop)] = 0;
  524.     });
  525.   });
  526.  
  527.   const SVGNamespace = "http://www.w3.org/2000/svg";
  528.   const XLinkNamespace = "http://www.w3.org/1999/xlink";
  529.   const XMLNamespace = "http://www.w3.org/XML/1998/namespace";
  530.  
  531.   function isVisibleChild(value) {
  532.     return !isBoolean(value) && value != null
  533.   }
  534.  
  535.   function className(value) {
  536.     if (Array.isArray(value)) {
  537.       return value.map(className).filter(Boolean).join(" ")
  538.     } else if (isObject(value)) {
  539.       return keys(value)
  540.         .filter((k) => value[k])
  541.         .join(" ")
  542.     } else if (isVisibleChild(value)) {
  543.       return "" + value
  544.     } else {
  545.       return ""
  546.     }
  547.   }
  548.   const svg = {
  549.     animate: 0,
  550.     circle: 0,
  551.     clipPath: 0,
  552.     defs: 0,
  553.     desc: 0,
  554.     ellipse: 0,
  555.     feBlend: 0,
  556.     feColorMatrix: 0,
  557.     feComponentTransfer: 0,
  558.     feComposite: 0,
  559.     feConvolveMatrix: 0,
  560.     feDiffuseLighting: 0,
  561.     feDisplacementMap: 0,
  562.     feDistantLight: 0,
  563.     feFlood: 0,
  564.     feFuncA: 0,
  565.     feFuncB: 0,
  566.     feFuncG: 0,
  567.     feFuncR: 0,
  568.     feGaussianBlur: 0,
  569.     feImage: 0,
  570.     feMerge: 0,
  571.     feMergeNode: 0,
  572.     feMorphology: 0,
  573.     feOffset: 0,
  574.     fePointLight: 0,
  575.     feSpecularLighting: 0,
  576.     feSpotLight: 0,
  577.     feTile: 0,
  578.     feTurbulence: 0,
  579.     filter: 0,
  580.     foreignObject: 0,
  581.     g: 0,
  582.     image: 0,
  583.     line: 0,
  584.     linearGradient: 0,
  585.     marker: 0,
  586.     mask: 0,
  587.     metadata: 0,
  588.     path: 0,
  589.     pattern: 0,
  590.     polygon: 0,
  591.     polyline: 0,
  592.     radialGradient: 0,
  593.     rect: 0,
  594.     stop: 0,
  595.     svg: 0,
  596.     switch: 0,
  597.     symbol: 0,
  598.     text: 0,
  599.     textPath: 0,
  600.     tspan: 0,
  601.     use: 0,
  602.     view: 0,
  603.   };
  604.   function createElement(tag, attr, ...children) {
  605.     if (isString(attr) || Array.isArray(attr)) {
  606.       children.unshift(attr);
  607.       attr = {};
  608.     }
  609.  
  610.     attr = attr || {};
  611.  
  612.     if (!attr.namespaceURI && svg[tag] === 0) {
  613.       attr = Object.assign({}, attr, {
  614.         namespaceURI: SVGNamespace,
  615.       });
  616.     }
  617.  
  618.     if (attr.children != null && !children.length) {
  619.       var _attr = attr
  620.       ;({ children } = _attr);
  621.       attr = _objectWithoutPropertiesLoose(_attr, ["children"]);
  622.     }
  623.  
  624.     let node;
  625.  
  626.     if (isString(tag)) {
  627.       node = attr.namespaceURI
  628.         ? document.createElementNS(attr.namespaceURI, tag)
  629.         : document.createElement(tag);
  630.       attributes(attr, node);
  631.       appendChild(children, node);
  632.     } else if (isFunction(tag)) {
  633.       if (isObject(tag.defaultProps)) {
  634.         attr = Object.assign({}, tag.defaultProps, attr);
  635.       }
  636.  
  637.       node = tag(
  638.         Object.assign({}, attr, {
  639.           children,
  640.         })
  641.       );
  642.     }
  643.  
  644.     if (isRef(attr.ref)) {
  645.       attr.ref.current = node;
  646.     } else if (isFunction(attr.ref)) {
  647.       attr.ref(node);
  648.     }
  649.  
  650.     return node
  651.   }
  652.  
  653.   function appendChild(child, node) {
  654.     if (isArrayLike(child)) {
  655.       appendChildren(child, node);
  656.     } else if (isString(child) || isNumber(child)) {
  657.       appendChildToNode(document.createTextNode(child), node);
  658.     } else if (child === null) {
  659.       appendChildToNode(document.createComment(""), node);
  660.     } else if (isElement(child)) {
  661.       appendChildToNode(child, node);
  662.     }
  663.   }
  664.  
  665.   function appendChildren(children, node) {
  666.     for (const child of children) {
  667.       appendChild(child, node);
  668.     }
  669.  
  670.     return node
  671.   }
  672.  
  673.   function appendChildToNode(child, node) {
  674.     if (node instanceof window.HTMLTemplateElement) {
  675.       node.content.appendChild(child);
  676.     } else {
  677.       node.appendChild(child);
  678.     }
  679.   }
  680.  
  681.   function normalizeAttribute(s) {
  682.     return s.replace(/[A-Z\d]/g, (match) => ":" + match.toLowerCase())
  683.   }
  684.  
  685.   function attribute(key, value, node) {
  686.     switch (key) {
  687.       case "xlinkActuate":
  688.       case "xlinkArcrole":
  689.       case "xlinkHref":
  690.       case "xlinkRole":
  691.       case "xlinkShow":
  692.       case "xlinkTitle":
  693.       case "xlinkType":
  694.         attrNS(node, XLinkNamespace, normalizeAttribute(key), value);
  695.         return
  696.  
  697.       case "xmlnsXlink":
  698.         attr(node, normalizeAttribute(key), value);
  699.         return
  700.  
  701.       case "xmlBase":
  702.       case "xmlLang":
  703.       case "xmlSpace":
  704.         attrNS(node, XMLNamespace, normalizeAttribute(key), value);
  705.         return
  706.     }
  707.  
  708.     switch (key) {
  709.       case "htmlFor":
  710.         attr(node, "for", value);
  711.         return
  712.  
  713.       case "dataset":
  714.         forEach(value, (dataValue, dataKey) => {
  715.           if (dataValue != null) {
  716.             node.dataset[dataKey] = dataValue;
  717.           }
  718.         });
  719.         return
  720.  
  721.       case "innerHTML":
  722.       case "innerText":
  723.       case "textContent":
  724.         node[key] = value;
  725.         return
  726.  
  727.       case "spellCheck":
  728.         node.spellcheck = value;
  729.         return
  730.  
  731.       case "class":
  732.       case "className":
  733.         if (isFunction(value)) {
  734.           value(node);
  735.         } else {
  736.           attr(node, "class", className(value));
  737.         }
  738.  
  739.         return
  740.  
  741.       case "ref":
  742.       case "namespaceURI":
  743.         return
  744.  
  745.       case "style":
  746.         if (isObject(value)) {
  747.           forEach(value, (val, key) => {
  748.             if (isNumber(val) && isUnitlessNumber[key] !== 0) {
  749.               node.style[key] = val + "px";
  750.             } else {
  751.               node.style[key] = val;
  752.             }
  753.           });
  754.           return
  755.         }
  756.     }
  757.  
  758.     if (isFunction(value)) {
  759.       if (key[0] === "o" && key[1] === "n") {
  760.         node[key.toLowerCase()] = value;
  761.       }
  762.     } else if (value === true) {
  763.       attr(node, key, "");
  764.     } else if (value !== false && value != null) {
  765.       attr(node, key, value);
  766.     }
  767.   }
  768.  
  769.   function attr(node, key, value) {
  770.     node.setAttribute(key, value);
  771.   }
  772.  
  773.   function attrNS(node, namespace, key, value) {
  774.     node.setAttributeNS(namespace, key, value);
  775.   }
  776.  
  777.   function attributes(attr, node) {
  778.     for (const key of keys(attr)) {
  779.       attribute(key, attr[key], node);
  780.     }
  781.  
  782.     return node
  783.   }
  784.  
  785.   function messageGetter({
  786.     getMessage,
  787.     DEFAULT
  788.   }) {
  789.     return (key, params) => {
  790.       const message = getMessage(key, params);
  791.       if (message) return message;
  792.       const defaultMessage = DEFAULT[key];
  793.       if (!defaultMessage) return "";
  794.       if (!params) return defaultMessage;
  795.  
  796.       if (!Array.isArray(params)) {
  797.         params = [params];
  798.       }
  799.  
  800.       return defaultMessage.replace(/\$(\d+)/g, (m, n) => params[n - 1]);
  801.     };
  802.   }
  803.  
  804.   function fallback(getMessage) {
  805.     return messageGetter({
  806.       getMessage,
  807.       DEFAULT: {
  808.         currentScopeLabel: "Current scope",
  809.         addScopeLabel: "Add new scope",
  810.         deleteScopeLabel: "Delete current scope",
  811.         learnMoreButton: "Learn more",
  812.         importButton: "Import",
  813.         exportButton: "Export",
  814.         addScopePrompt: "Add new scope",
  815.         deleteScopeConfirm: "Delete scope $1?",
  816.         importPrompt: "Paste settings",
  817.         exportPrompt: "Copy settings"
  818.       }
  819.     });
  820.   }
  821.  
  822.   const VALID_CONTROL = new Set(["import", "export", "scope-list", "add-scope", "delete-scope"]);
  823.  
  824.   class DefaultMap extends Map {
  825.     constructor(getDefault) {
  826.       super();
  827.       this.getDefault = getDefault;
  828.     }
  829.  
  830.     get(key) {
  831.       let item = super.get(key);
  832.  
  833.       if (!item) {
  834.         item = this.getDefault();
  835.         super.set(key, item);
  836.       }
  837.  
  838.       return item;
  839.     }
  840.  
  841.   }
  842.  
  843.   function bindInputs(pref, inputs) {
  844.     const bounds = [];
  845.  
  846.     const onPrefChange = change => {
  847.       for (const key in change) {
  848.         if (!inputs.has(key)) {
  849.           continue;
  850.         }
  851.  
  852.         for (const input of inputs.get(key)) {
  853.           updateInput(input, change[key]);
  854.         }
  855.       }
  856.     };
  857.  
  858.     pref.on("change", onPrefChange);
  859.     bounds.push(() => pref.off("change", onPrefChange));
  860.  
  861.     for (const [key, list] of inputs.entries()) {
  862.       for (const input of list) {
  863.         const evt = input.hasAttribute("realtime") ? "input" : "change";
  864.  
  865.         const onChange = () => updatePref(key, input);
  866.  
  867.         input.addEventListener(evt, onChange);
  868.         bounds.push(() => input.removeEventListener(evt, onChange));
  869.       }
  870.     }
  871.  
  872.     onPrefChange(pref.getAll());
  873.     return () => {
  874.       for (const unbind of bounds) {
  875.         unbind();
  876.       }
  877.     };
  878.  
  879.     function updatePref(key, input) {
  880.       if (!input.checkValidity()) {
  881.         return;
  882.       }
  883.  
  884.       if (input.type === "checkbox") {
  885.         pref.set(key, input.checked);
  886.         return;
  887.       }
  888.  
  889.       if (input.type === "radio") {
  890.         if (input.checked) {
  891.           pref.set(key, input.value);
  892.         }
  893.  
  894.         return;
  895.       }
  896.  
  897.       if (input.nodeName === "SELECT" && input.multiple) {
  898.         pref.set(key, [...input.options].filter(o => o.selected).map(o => o.value));
  899.         return;
  900.       }
  901.  
  902.       if (input.type === "number" || input.type === "range") {
  903.         pref.set(key, Number(input.value));
  904.         return;
  905.       }
  906.  
  907.       pref.set(key, input.value);
  908.     }
  909.  
  910.     function updateInput(input, value) {
  911.       if (input.nodeName === "INPUT" && input.type === "radio") {
  912.         input.checked = input.value === value;
  913.         return;
  914.       }
  915.  
  916.       if (input.type === "checkbox") {
  917.         input.checked = value;
  918.         return;
  919.       }
  920.  
  921.       if (input.nodeName === "SELECT" && input.multiple) {
  922.         const checked = new Set(value);
  923.  
  924.         for (const option of input.options) {
  925.           option.selected = checked.has(option.value);
  926.         }
  927.  
  928.         return;
  929.       }
  930.  
  931.       input.value = value;
  932.     }
  933.   }
  934.  
  935.   function bindFields(pref, fields) {
  936.     const onPrefChange = change => {
  937.       for (const key in change) {
  938.         if (!fields.has(key)) {
  939.           continue;
  940.         }
  941.  
  942.         for (const field of fields.get(key)) {
  943.           field.disabled = field.dataset.bindToValue ? field.dataset.bindToValue !== change[key] : !change[key];
  944.         }
  945.       }
  946.     };
  947.  
  948.     pref.on("change", onPrefChange);
  949.     onPrefChange(pref.getAll());
  950.     return () => pref.off("change", onPrefChange);
  951.   }
  952.  
  953.   function bindControls({
  954.     pref,
  955.     controls,
  956.     alert: _alert = alert,
  957.     confirm: _confirm = confirm,
  958.     prompt: _prompt = prompt,
  959.     getMessage = () => {},
  960.     getNewScope = () => ""
  961.   }) {
  962.     const CONTROL_METHODS = {
  963.       "import": ["click", doImport],
  964.       "export": ["click", doExport],
  965.       "scope-list": ["change", updateCurrentScope],
  966.       "add-scope": ["click", addScope],
  967.       "delete-scope": ["click", deleteScope]
  968.     };
  969.  
  970.     for (const type in CONTROL_METHODS) {
  971.       for (const el of controls.get(type)) {
  972.         el.addEventListener(CONTROL_METHODS[type][0], CONTROL_METHODS[type][1]);
  973.       }
  974.     }
  975.  
  976.     pref.on("scopeChange", updateCurrentScopeEl);
  977.     pref.on("scopeListChange", updateScopeList);
  978.     updateScopeList();
  979.     updateCurrentScopeEl();
  980.  
  981.     const _ = fallback(getMessage);
  982.  
  983.     return unbind;
  984.  
  985.     function unbind() {
  986.       pref.off("scopeChange", updateCurrentScopeEl);
  987.       pref.off("scopeListChange", updateScopeList);
  988.  
  989.       for (const type in CONTROL_METHODS) {
  990.         for (const el of controls.get(type)) {
  991.           el.removeEventListener(CONTROL_METHODS[type][0], CONTROL_METHODS[type][1]);
  992.         }
  993.       }
  994.     }
  995.  
  996.     async function doImport() {
  997.       try {
  998.         const input = await _prompt(_("importPrompt"));
  999.  
  1000.         if (input == null) {
  1001.           return;
  1002.         }
  1003.  
  1004.         const settings = JSON.parse(input);
  1005.         return pref.import(settings);
  1006.       } catch (err) {
  1007.         await _alert(err.message);
  1008.       }
  1009.     }
  1010.  
  1011.     async function doExport() {
  1012.       try {
  1013.         const settings = await pref.export();
  1014.         await _prompt(_("exportPrompt"), JSON.stringify(settings));
  1015.       } catch (err) {
  1016.         await _alert(err.message);
  1017.       }
  1018.     }
  1019.  
  1020.     function updateCurrentScope(e) {
  1021.       pref.setCurrentScope(e.target.value);
  1022.     }
  1023.  
  1024.     async function addScope() {
  1025.       try {
  1026.         let scopeName = await _prompt(_("addScopePrompt"), getNewScope());
  1027.  
  1028.         if (scopeName == null) {
  1029.           return;
  1030.         }
  1031.  
  1032.         scopeName = scopeName.trim();
  1033.  
  1034.         if (!scopeName) {
  1035.           throw new Error("the value is empty");
  1036.         }
  1037.  
  1038.         await pref.addScope(scopeName);
  1039.         pref.setCurrentScope(scopeName);
  1040.       } catch (err) {
  1041.         await _alert(err.message);
  1042.       }
  1043.     }
  1044.  
  1045.     async function deleteScope() {
  1046.       try {
  1047.         const scopeName = pref.getCurrentScope();
  1048.         const result = await _confirm(_("deleteScopeConfirm", scopeName));
  1049.  
  1050.         if (result) {
  1051.           return pref.deleteScope(scopeName);
  1052.         }
  1053.       } catch (err) {
  1054.         await _alert(err.message);
  1055.       }
  1056.     }
  1057.  
  1058.     function updateCurrentScopeEl() {
  1059.       const scopeName = pref.getCurrentScope();
  1060.  
  1061.       for (const el of controls.get("scope-list")) {
  1062.         el.value = scopeName;
  1063.       }
  1064.     }
  1065.  
  1066.     function updateScopeList() {
  1067.       const scopeList = pref.getScopeList();
  1068.  
  1069.       for (const el of controls.get("scope-list")) {
  1070.         el.innerHTML = "";
  1071.         el.append(...scopeList.map(scope => {
  1072.           const option = document.createElement("option");
  1073.           option.value = scope;
  1074.           option.textContent = scope;
  1075.           return option;
  1076.         }));
  1077.       }
  1078.     }
  1079.   }
  1080.  
  1081.   function createBinding({
  1082.     pref,
  1083.     root,
  1084.     elements = root.querySelectorAll("input, textarea, select, fieldset, button"),
  1085.     keyPrefix = "pref-",
  1086.     controlPrefix = "webext-pref-",
  1087.     alert,
  1088.     confirm,
  1089.     prompt,
  1090.     getMessage,
  1091.     getNewScope
  1092.   }) {
  1093.     const inputs = new DefaultMap(() => []);
  1094.     const fields = new DefaultMap(() => []);
  1095.     const controls = new DefaultMap(() => []);
  1096.  
  1097.     for (const element of elements) {
  1098.       const id = element.id && stripPrefix(element.id, keyPrefix);
  1099.  
  1100.       if (id && pref.has(id)) {
  1101.         inputs.get(id).push(element);
  1102.         continue;
  1103.       }
  1104.  
  1105.       if (element.nodeName === "INPUT" && element.type === "radio") {
  1106.         const name = element.name && stripPrefix(element.name, keyPrefix);
  1107.  
  1108.         if (name && pref.has(name)) {
  1109.           inputs.get(name).push(element);
  1110.           continue;
  1111.         }
  1112.       }
  1113.  
  1114.       if (element.nodeName === "FIELDSET" && element.dataset.bindTo) {
  1115.         fields.get(element.dataset.bindTo).push(element);
  1116.         continue;
  1117.       }
  1118.  
  1119.       const controlType = findControlType(element.classList);
  1120.  
  1121.       if (controlType) {
  1122.         controls.get(controlType).push(element);
  1123.       }
  1124.     }
  1125.  
  1126.     const bounds = [bindInputs(pref, inputs), bindFields(pref, fields), bindControls({
  1127.       pref,
  1128.       controls,
  1129.       alert,
  1130.       confirm,
  1131.       prompt,
  1132.       getMessage,
  1133.       getNewScope
  1134.     })];
  1135.     return () => {
  1136.       for (const unbind of bounds) {
  1137.         unbind();
  1138.       }
  1139.     };
  1140.  
  1141.     function stripPrefix(id, prefix) {
  1142.       if (!prefix) {
  1143.         return id;
  1144.       }
  1145.  
  1146.       return id.startsWith(prefix) ? id.slice(prefix.length) : "";
  1147.     }
  1148.  
  1149.     function findControlType(list) {
  1150.       for (const name of list) {
  1151.         const controlType = stripPrefix(name, controlPrefix);
  1152.  
  1153.         if (VALID_CONTROL.has(controlType)) {
  1154.           return controlType;
  1155.         }
  1156.       }
  1157.     }
  1158.   }
  1159.  
  1160.   function createUI({
  1161.     body,
  1162.     getMessage = () => {},
  1163.     toolbar = true,
  1164.     navbar = true,
  1165.     keyPrefix = "pref-",
  1166.     controlPrefix = "webext-pref-"
  1167.   }) {
  1168.     const root = document.createDocumentFragment();
  1169.  
  1170.     const _ = fallback(getMessage);
  1171.  
  1172.     if (toolbar) {
  1173.       root.append(createToolbar());
  1174.     }
  1175.  
  1176.     if (navbar) {
  1177.       root.append(createNavbar());
  1178.     }
  1179.  
  1180.     root.append( /*#__PURE__*/createElement("div", {
  1181.       class: controlPrefix + "body"
  1182.     }, body.map(item => {
  1183.       if (!item.hLevel) {
  1184.         item.hLevel = 3;
  1185.       }
  1186.  
  1187.       return createItem(item);
  1188.     })));
  1189.     return root;
  1190.  
  1191.     function createToolbar() {
  1192.       return /*#__PURE__*/createElement("div", {
  1193.         class: controlPrefix + "toolbar"
  1194.       }, /*#__PURE__*/createElement("button", {
  1195.         type: "button",
  1196.         class: [controlPrefix + "import", "browser-style"]
  1197.       }, _("importButton")), /*#__PURE__*/createElement("button", {
  1198.         type: "button",
  1199.         class: [controlPrefix + "export", "browser-style"]
  1200.       }, _("exportButton")));
  1201.     }
  1202.  
  1203.     function createNavbar() {
  1204.       return /*#__PURE__*/createElement("div", {
  1205.         class: controlPrefix + "nav"
  1206.       }, /*#__PURE__*/createElement("select", {
  1207.         class: [controlPrefix + "scope-list", "browser-style"],
  1208.         title: _("currentScopeLabel")
  1209.       }), /*#__PURE__*/createElement("button", {
  1210.         type: "button",
  1211.         class: [controlPrefix + "delete-scope", "browser-style"],
  1212.         title: _("deleteScopeLabel")
  1213.       }, "\xD7"), /*#__PURE__*/createElement("button", {
  1214.         type: "button",
  1215.         class: [controlPrefix + "add-scope", "browser-style"],
  1216.         title: _("addScopeLabel")
  1217.       }, "+"));
  1218.     }
  1219.  
  1220.     function createItem(p) {
  1221.       if (p.type === "section") {
  1222.         return createSection(p);
  1223.       }
  1224.  
  1225.       if (p.type === "checkbox") {
  1226.         return createCheckbox(p);
  1227.       }
  1228.  
  1229.       if (p.type === "radiogroup") {
  1230.         return createRadioGroup(p);
  1231.       }
  1232.  
  1233.       return createInput(p);
  1234.     }
  1235.  
  1236.     function createInput(p) {
  1237.       const key = keyPrefix + p.key;
  1238.       let input;
  1239.       const onChange = p.validate ? e => {
  1240.         try {
  1241.           p.validate(e.target.value);
  1242.           e.target.setCustomValidity("");
  1243.         } catch (err) {
  1244.           e.target.setCustomValidity(err.message || String(err));
  1245.         }
  1246.       } : null;
  1247.  
  1248.       if (p.type === "select") {
  1249.         input = /*#__PURE__*/createElement("select", {
  1250.           multiple: p.multiple,
  1251.           class: "browser-style",
  1252.           id: key,
  1253.           onChange: onChange
  1254.         }, Object.entries(p.options).map(([value, label]) => /*#__PURE__*/createElement("option", {
  1255.           value: value
  1256.         }, label)));
  1257.       } else if (p.type === "textarea") {
  1258.         input = /*#__PURE__*/createElement("textarea", {
  1259.           rows: "8",
  1260.           class: "browser-style",
  1261.           id: key,
  1262.           onChange: onChange
  1263.         });
  1264.       } else {
  1265.         input = /*#__PURE__*/createElement("input", {
  1266.           type: p.type,
  1267.           id: key,
  1268.           onChange: onChange
  1269.         });
  1270.       }
  1271.  
  1272.       return /*#__PURE__*/createElement("div", {
  1273.         class: [`${controlPrefix}${p.type}`, "browser-style", p.className]
  1274.       }, /*#__PURE__*/createElement("label", {
  1275.         htmlFor: key
  1276.       }, p.label), p.learnMore && /*#__PURE__*/createElement(LearnMore, {
  1277.         url: p.learnMore
  1278.       }), input, p.help && /*#__PURE__*/createElement(Help, {
  1279.         content: p.help
  1280.       }));
  1281.     }
  1282.  
  1283.     function createRadioGroup(p) {
  1284.       return /*#__PURE__*/createElement("div", {
  1285.         class: [`${controlPrefix}${p.type}`, "browser-style", p.className]
  1286.       }, /*#__PURE__*/createElement("div", {
  1287.         class: controlPrefix + "radio-title"
  1288.       }, p.label), p.learnMore && /*#__PURE__*/createElement(LearnMore, {
  1289.         url: p.learnMore
  1290.       }), p.help && /*#__PURE__*/createElement(Help, {
  1291.         content: p.help
  1292.       }), p.children.map(c => {
  1293.         c.parentKey = p.key;
  1294.         return createCheckbox(inheritProp(p, c));
  1295.       }));
  1296.     }
  1297.  
  1298.     function Help({
  1299.       content
  1300.     }) {
  1301.       return /*#__PURE__*/createElement("p", {
  1302.         class: controlPrefix + "help"
  1303.       }, content);
  1304.     }
  1305.  
  1306.     function LearnMore({
  1307.       url
  1308.     }) {
  1309.       return /*#__PURE__*/createElement("a", {
  1310.         href: url,
  1311.         class: controlPrefix + "learn-more",
  1312.         target: "_blank",
  1313.         rel: "noopener noreferrer"
  1314.       }, _("learnMoreButton"));
  1315.     }
  1316.  
  1317.     function createCheckbox(p) {
  1318.       const id = p.parentKey ? `${keyPrefix}${p.parentKey}-${p.value}` : keyPrefix + p.key;
  1319.       return /*#__PURE__*/createElement("div", {
  1320.         class: [`${controlPrefix}${p.type}`, "browser-style", p.className]
  1321.       }, /*#__PURE__*/createElement("input", {
  1322.         type: p.type,
  1323.         id: id,
  1324.         name: p.parentKey ? keyPrefix + p.parentKey : null,
  1325.         value: p.value
  1326.       }), /*#__PURE__*/createElement("label", {
  1327.         htmlFor: id
  1328.       }, p.label), p.learnMore && /*#__PURE__*/createElement(LearnMore, {
  1329.         url: p.learnMore
  1330.       }), p.help && /*#__PURE__*/createElement(Help, {
  1331.         content: p.help
  1332.       }), p.children && /*#__PURE__*/createElement("fieldset", {
  1333.         class: controlPrefix + "checkbox-children",
  1334.         dataset: {
  1335.           bindTo: p.parentKey || p.key,
  1336.           bindToValue: p.value
  1337.         }
  1338.       }, p.children.map(c => createItem(inheritProp(p, c)))));
  1339.     }
  1340.  
  1341.     function createSection(p) {
  1342.       const Header = `h${p.hLevel}`;
  1343.       p.hLevel++;
  1344.       return (
  1345.         /*#__PURE__*/
  1346.         // FIXME: do we need browser-style for section?
  1347.         createElement("div", {
  1348.           class: [controlPrefix + p.type, p.className]
  1349.         }, /*#__PURE__*/createElement(Header, {
  1350.           class: controlPrefix + "header"
  1351.         }, p.label), p.help && /*#__PURE__*/createElement(Help, {
  1352.           content: p.help
  1353.         }), p.children && p.children.map(c => createItem(inheritProp(p, c))))
  1354.       );
  1355.     }
  1356.  
  1357.     function inheritProp(parent, child) {
  1358.       child.hLevel = parent.hLevel;
  1359.       return child;
  1360.     }
  1361.   }
  1362.  
  1363.   /* eslint-env greasemonkey */
  1364.  
  1365.   function createGMStorage() {
  1366.     const setValue = typeof GM_setValue === "function" ?
  1367.       promisify(GM_setValue) : GM.setValue.bind(GM);
  1368.     const getValue = typeof GM_getValue === "function" ?
  1369.       promisify(GM_getValue) : GM.getValue.bind(GM);
  1370.     const deleteValue = typeof GM_deleteValue === "function" ?
  1371.       promisify(GM_deleteValue) : GM.deleteValue.bind(GM);
  1372.     const events = new EventLite$1;
  1373.     
  1374.     if (typeof GM_addValueChangeListener === "function") {
  1375.       GM_addValueChangeListener("webext-pref-message", (name, oldValue, newValue) => {
  1376.         const changes = JSON.parse(newValue);
  1377.         for (const key of Object.keys(changes)) {
  1378.           if (typeof changes[key] === "object" && changes[key].$undefined) {
  1379.             changes[key] = undefined;
  1380.           }
  1381.         }
  1382.         events.emit("change", changes);
  1383.       });
  1384.     }
  1385.     
  1386.     return Object.assign(events, {getMany, setMany, deleteMany});
  1387.     
  1388.     function getMany(keys) {
  1389.       return Promise.all(keys.map(k => 
  1390.         getValue(`webext-pref/${k}`)
  1391.           .then(value => [k, typeof value === "string" ? JSON.parse(value) : value])
  1392.       ))
  1393.         .then(entries => {
  1394.           const output = {};
  1395.           for (const [key, value] of entries) {
  1396.             output[key] = value;
  1397.           }
  1398.           return output;
  1399.         });
  1400.     }
  1401.     
  1402.     function setMany(changes) {
  1403.       return Promise.all(Object.entries(changes).map(([key, value]) => 
  1404.         setValue(`webext-pref/${key}`, JSON.stringify(value))
  1405.       ))
  1406.         .then(() => {
  1407.           if (typeof GM_addValueChangeListener === "function") {
  1408.             return setValue("webext-pref-message", JSON.stringify(changes));
  1409.           }
  1410.           events.emit("change", changes);
  1411.         });
  1412.     }
  1413.     
  1414.     function deleteMany(keys) {
  1415.       return Promise.all(keys.map(k => deleteValue(`webext-pref/${k}`)))
  1416.         .then(() => {
  1417.           if (typeof GM_addValueChangeListener === "function") {
  1418.             const changes = {};
  1419.             for (const key of keys) {
  1420.               changes[key] = {
  1421.                 $undefined: true
  1422.               };
  1423.             }
  1424.             return setValue("webext-pref-message", JSON.stringify(changes));
  1425.           }
  1426.           const changes = {};
  1427.           for (const key of keys) {
  1428.             changes[key] = undefined;
  1429.           }
  1430.           events.emit("change", changes);
  1431.         });
  1432.     }
  1433.     
  1434.     function promisify(fn) {
  1435.       return (...args) => {
  1436.         try {
  1437.           return Promise.resolve(fn(...args));
  1438.         } catch (err) {
  1439.           return Promise.reject(err);
  1440.         }
  1441.       };
  1442.     }
  1443.   }
  1444.  
  1445.   /* eslint-env greasemonkey */
  1446.  
  1447.   function GM_webextPref({
  1448.     default: default_,
  1449.     separator,
  1450.     css = "",
  1451.     ...options
  1452.   }) {
  1453.     const pref = createPref(default_, separator);
  1454.     const initializing = pref.connect(createGMStorage());
  1455.     let isOpen = false;
  1456.     
  1457.     const registerMenu = 
  1458.       typeof GM_registerMenuCommand === "function" ? GM_registerMenuCommand :
  1459.       typeof GM !== "undefined" && GM && GM.registerMenuCommand ? GM.registerMenuCommand.bind(GM) :
  1460.       undefined;
  1461.       
  1462.     if (registerMenu) {
  1463.       registerMenu(`${getTitle()} - Configure`, openDialog);
  1464.     }
  1465.     
  1466.     return Object.assign(pref, {
  1467.       ready: () => initializing,
  1468.       openDialog
  1469.     });
  1470.     
  1471.     function openDialog() {
  1472.       if (isOpen) {
  1473.         return;
  1474.       }
  1475.       isOpen = true;
  1476.       
  1477.       let destroyView;
  1478.       
  1479.       const modal = document.createElement("div");
  1480.       modal.className = "webext-pref-modal";
  1481.       modal.onclick = () => {
  1482.         modal.classList.remove("webext-pref-modal-open");
  1483.         modal.addEventListener("transitionend", () => {
  1484.           if (destroyView) {
  1485.             destroyView();
  1486.           }
  1487.           modal.remove();
  1488.           isOpen = false;
  1489.         });
  1490.       };
  1491.       
  1492.       const style = document.createElement("style");
  1493.       style.textContent = "body{overflow:hidden}.webext-pref-modal{position:fixed;top:0;right:0;bottom:0;left:0;background:rgba(0,0,0,.5);overflow:auto;z-index:999999;opacity:0;transition:opacity .2s linear;display:flex}.webext-pref-modal-open{opacity:1}.webext-pref-modal::after,.webext-pref-modal::before{content:\"\";display:block;height:30px;visibility:hidden}.webext-pref-iframe-wrap{margin:auto}.webext-pref-iframe{margin:30px 0;display:inline-block;width:100%;max-width:100%;background:#fff;border-width:0;box-shadow:0 0 30px #000;transform:translateY(-20px);transition:transform .2s linear}.webext-pref-modal-open .webext-pref-iframe{transform:none}" + `
  1494.       body {
  1495.         padding-right: ${window.innerWidth - document.documentElement.offsetWidth}px;
  1496.       }
  1497.     `;
  1498.       
  1499.       const iframe = document.createElement("iframe");
  1500.       iframe.className = "webext-pref-iframe";
  1501.       iframe.srcdoc = `
  1502.       <html>
  1503.         <head>
  1504.           <style class="dialog-style"></style>
  1505.         </head>
  1506.         <body>
  1507.           <div class="dialog-body"></div>
  1508.         </body>
  1509.       </html>
  1510.     `;
  1511.       
  1512.       const wrap = document.createElement("div");
  1513.       wrap.className = "webext-pref-iframe-wrap";
  1514.       
  1515.       wrap.append(iframe);
  1516.       modal.append(style, wrap);
  1517.       document.body.appendChild(modal);
  1518.       
  1519.       iframe.onload = () => {
  1520.         iframe.onload = null;
  1521.         
  1522.         iframe.contentDocument.querySelector(".dialog-style").textContent = "body{display:inline-block;font-size:16px;font-family:sans-serif;white-space:nowrap;overflow:hidden;margin:0;color:#3d3d3d;line-height:1}input[type=number],input[type=text],select,textarea{display:block;width:100%;box-sizing:border-box;height:2em;font:inherit;padding:0 .3em;border:1px solid #9e9e9e;cursor:pointer}select[multiple],textarea{height:6em}input[type=number]:hover,input[type=text]:hover,select:hover,textarea:hover{border-color:#d5d5d5}input[type=number]:focus,input[type=text]:focus,select:focus,textarea:focus{cursor:auto;border-color:#3a93ee}textarea{line-height:1.5}input[type=checkbox],input[type=radio]{display:inline-block;width:1em;height:1em;font:inherit;margin:0}button{box-sizing:border-box;height:2em;font:inherit;border:1px solid #9e9e9e;cursor:pointer;background:0 0}button:hover{border-color:#d5d5d5}button:focus{border-color:#3a93ee}.dialog-body{margin:2em}.webext-pref-toolbar{display:flex;align-items:center;margin-bottom:1em}.dialog-title{font-size:1.34em;margin:0 2em 0 0;flex-grow:1}.webext-pref-toolbar button{font-size:.7em;margin-left:.5em}.webext-pref-nav{display:flex;margin-bottom:1em}.webext-pref-nav select{text-align:center;text-align-last:center}.webext-pref-nav button{width:2em}.webext-pref-number,.webext-pref-radiogroup,.webext-pref-select,.webext-pref-text,.webext-pref-textarea{margin:1em 0}.webext-pref-body>:first-child{margin-top:0}.webext-pref-body>:last-child{margin-bottom:0}.webext-pref-number>input,.webext-pref-select>select,.webext-pref-text>input,.webext-pref-textarea>textarea{margin:.3em 0}.webext-pref-checkbox,.webext-pref-radio{margin:.5em 0;padding-left:1.5em}.webext-pref-checkbox>input,.webext-pref-radio>input{margin-left:-1.5em;margin-right:.5em;vertical-align:middle}.webext-pref-checkbox>label,.webext-pref-radio>label{cursor:pointer;vertical-align:middle}.webext-pref-checkbox>label:hover,.webext-pref-radio>label:hover{color:#707070}.webext-pref-checkbox-children,.webext-pref-radio-children{margin:.7em 0 0;padding:0;border-width:0}.webext-pref-checkbox-children[disabled],.webext-pref-radio-children[disabled]{opacity:.5}.webext-pref-checkbox-children>:first-child,.webext-pref-radio-children>:first-child{margin-top:0}.webext-pref-checkbox-children>:last-child,.webext-pref-radio-children>:last-child{margin-bottom:0}.webext-pref-checkbox-children>:last-child>:last-child,.webext-pref-radio-children>:last-child>:last-child{margin-bottom:0}.webext-pref-help{color:#969696}.responsive{white-space:normal}.responsive .dialog-body{margin:1em}.responsive .webext-pref-toolbar{display:block}.responsive .dialog-title{margin:0 0 1em 0}.responsive .webext-pref-toolbar button{font-size:1em}.responsive .webext-pref-nav{display:block}" + css;
  1523.         
  1524.         const root = iframe.contentDocument.querySelector(".dialog-body");
  1525.         root.append(createUI(options));
  1526.         
  1527.         destroyView = createBinding({
  1528.           pref,
  1529.           root,
  1530.           ...options
  1531.         });
  1532.         
  1533.         const title = document.createElement("h2");
  1534.         title.className = "dialog-title";
  1535.         title.textContent = getTitle();
  1536.         iframe.contentDocument.querySelector(".webext-pref-toolbar").prepend(title);
  1537.         
  1538.         if (iframe.contentDocument.body.offsetWidth > modal.offsetWidth) {
  1539.           iframe.contentDocument.body.classList.add("responsive");
  1540.         }
  1541.         
  1542.         // calc iframe size
  1543.         iframe.style = `
  1544.         width: ${iframe.contentDocument.body.offsetWidth}px;
  1545.         height: ${iframe.contentDocument.body.scrollHeight}px;
  1546.       `;
  1547.         
  1548.         modal.classList.add("webext-pref-modal-open");
  1549.       };
  1550.     }
  1551.     
  1552.     function getTitle() {
  1553.       return typeof GM_info === "object" ?
  1554.         GM_info.script.name : GM.info.script.name;
  1555.     }
  1556.   }
  1557.  
  1558.   return GM_webextPref;
  1559.  
  1560. }());