@web-utils/component 2.0.13 → 2.7.0

package/dist/components/keep-view-alive/index.js

@@ -1,89 +1,69 @@
-import { n as normalizeComponent } from "../../chunks/3d28cc08.js";
-const _toString = Object.prototype.toString;
-function isDef(v) {
-  return v !== void 0 && v !== null;
+import { n as _ } from "../../chunks/vueComponentNormalizer.71e2aa87.js";
+const C = Object.prototype.toString;
+function d(e) {
+  return e != null;
 }
-function isAsyncPlaceholder(node) {
-  return node.isComment && node.asyncFactory;
+function g(e) {
+  return e.isComment && e.asyncFactory;
 }
-function getFirstComponentChild(children) {
-  if (Array.isArray(children)) {
-    for (let i = 0; i < children.length; i++) {
-      const c = children[i];
-      if (isDef(c) && (isDef(c.componentOptions) || isAsyncPlaceholder(c))) {
-        return c;
-      }
+function v(e) {
+  if (Array.isArray(e))
+    for (let t = 0; t < e.length; t++) {
+      const n = e[t];
+      if (d(n) && (d(n.componentOptions) || g(n)))
+        return n;
     }
-  }
 }
-function isRegExp(v) {
-  return _toString.call(v) === "[object RegExp]";
+function x(e) {
+  return C.call(e) === "[object RegExp]";
 }
-function getComponentName(opts) {
-  return opts && (opts.Ctor.options.name || opts.tag);
+function f(e) {
+  return e && (e.Ctor.options.name || e.tag);
 }
-function matches(pattern, name) {
-  if (Array.isArray(pattern)) {
-    return pattern.indexOf(name) > -1;
-  } else if (typeof pattern === "string") {
-    return pattern.split(",").indexOf(name) > -1;
-  } else if (isRegExp(pattern)) {
-    return pattern.test(name);
-  }
-  return false;
+function l(e, t) {
+  return Array.isArray(e) ? e.indexOf(t) > -1 : typeof e == "string" ? e.split(",").indexOf(t) > -1 : x(e) ? e.test(t) : !1;
 }
-function remove(arr, item) {
-  if (arr.length) {
-    const index = arr.indexOf(item);
-    if (index > -1) {
-      return arr.splice(index, 1);
-    }
+function y(e, t) {
+  if (e.length) {
+    const n = e.indexOf(t);
+    if (n > -1)
+      return e.splice(n, 1);
   }
 }
-function pruneCache(keepAliveInstance, filter) {
-  const { cache, keys, _vnode } = keepAliveInstance;
-  for (const key in cache) {
-    const entry = cache[key];
-    if (entry) {
-      const name = entry.name;
-      if (name && !filter(name)) {
-        pruneCacheEntry(cache, key, keys, _vnode);
-      }
+function p(e, t) {
+  const { cache: n, keys: o, _vnode: c } = e;
+  for (const i in n) {
+    const s = n[i];
+    if (s) {
+      const a = s.name;
+      a && !t(a) && h(n, i, o, c);
     }
   }
 }
-function pruneCacheEntry(cache, key, keys, current) {
-  const entry = cache[key];
-  if (entry && (!current || entry.tag !== current.tag)) {
-    entry.componentInstance.$destroy();
-  }
-  cache[key] = null;
-  remove(keys, key);
+function h(e, t, n, o) {
+  const c = e[t];
+  c && (!o || c.tag !== o.tag) && c.componentInstance.$destroy(), e[t] = null, y(n, t);
 }
-const __vue2_script = {
+const k = {
   name: "KeepViewAlive",
-  abstract: true,
+  abstract: !0,
   props: {
     include: Array,
     exclude: Array,
     max: [String, Number]
   },
   created() {
-    this.cache = /* @__PURE__ */ Object.create(null);
-    this.keys = [];
+    this.cache = /* @__PURE__ */ Object.create(null), this.keys = [];
   },
   destroyed() {
-    for (const key in this.cache) {
-      pruneCacheEntry(this.cache, key, this.keys);
-    }
+    for (const e in this.cache)
+      h(this.cache, e, this.keys);
   },
   mounted() {
-    this.cacheVNode();
-    this.$watch("include", (val) => {
-      pruneCache(this, (name) => matches(val, name));
-    });
-    this.$watch("exclude", (val) => {
-      pruneCache(this, (name) => !matches(val, name));
+    this.cacheVNode(), this.$watch("include", (e) => {
+      p(this, (t) => l(e, t));
+    }), this.$watch("exclude", (e) => {
+      p(this, (t) => !l(e, t));
     });
   },
   updated() {
@@ -91,76 +71,53 @@ const __vue2_script = {
   },
   methods: {
     cacheVNode() {
-      const { cache, keys, vnodeToCache, keyToCache } = this;
-      if (vnodeToCache) {
-        const { tag, componentInstance, componentOptions } = vnodeToCache;
-        cache[keyToCache] = {
-          name: getComponentName(componentOptions),
-          tag,
-          cid: componentOptions.Ctor.cid,
-          componentInstance
-        };
-        keys.push(keyToCache);
-        if (this.max && keys.length > parseInt(this.max)) {
-          pruneCacheEntry(cache, keys[0], keys, this._vnode);
-        }
-        this.vnodeToCache = null;
+      const { cache: e, keys: t, vnodeToCache: n, keyToCache: o } = this;
+      if (n) {
+        const { tag: c, componentInstance: i, componentOptions: s } = n;
+        e[o] = {
+          name: f(s),
+          tag: c,
+          cid: s.Ctor.cid,
+          componentInstance: i
+        }, t.push(o), this.max && t.length > parseInt(this.max) && h(e, t[0], t, this._vnode), this.vnodeToCache = null;
       }
     }
   },
   render() {
-    const slot = this.$slots.default;
-    const vnode = getFirstComponentChild(slot);
-    const componentOptions = vnode && vnode.componentOptions;
-    if (componentOptions) {
-      const name = getComponentName(componentOptions);
-      const { include, exclude } = this;
-      if (include && (!name || !matches(include, name)) || exclude && name && matches(exclude, name)) {
-        return vnode;
-      }
-      const { cache, keys } = this;
-      const key = vnode.key == null ? componentOptions.Ctor.cid + (componentOptions.tag ? `::${componentOptions.tag}` : "") : vnode.key;
-      const entry = cache[key];
-      if (entry) {
-        if (entry.cid === componentOptions.Ctor.cid) {
-          vnode.componentInstance = entry.componentInstance;
-          remove(keys, key);
-          keys.push(key);
-        } else {
-          entry.componentInstance.$destroy();
-          cache[key] = null;
-          this.vnodeToCache = vnode;
-          this.keyToCache = key;
-        }
-      } else {
-        this.vnodeToCache = vnode;
-        this.keyToCache = key;
-      }
-      vnode.data.keepAlive = true;
+    const e = this.$slots.default, t = v(e), n = t && t.componentOptions;
+    if (n) {
+      const o = f(n), { include: c, exclude: i } = this;
+      if (
+        // not included
+        c && (!o || !l(c, o)) || // excluded
+        i && o && l(i, o)
+      )
+        return t;
+      const { cache: s, keys: a } = this, r = t.key == null ? n.Ctor.cid + (n.tag ? `::${n.tag}` : "") : t.key, u = s[r];
+      u ? u.cid === n.Ctor.cid ? (t.componentInstance = u.componentInstance, y(a, r), a.push(r)) : (u.componentInstance.$destroy(), s[r] = null, this.vnodeToCache = t, this.keyToCache = r) : (this.vnodeToCache = t, this.keyToCache = r), t.data.keepAlive = !0;
     }
-    return vnode || slot && slot[0];
+    return t || e && e[0];
   }
 };
-let __vue2_render, __vue2_staticRenderFns;
-const __cssModules = {};
-var __component__ = /* @__PURE__ */ normalizeComponent(
-  __vue2_script,
-  __vue2_render,
-  __vue2_staticRenderFns,
-  false,
-  __vue2_injectStyles,
+let A, O;
+const m = {};
+var T = /* @__PURE__ */ _(
+  k,
+  A,
+  O,
+  !1,
+  I,
   null,
   null,
   null
 );
-function __vue2_injectStyles(context) {
-  for (let o in __cssModules) {
-    this[o] = __cssModules[o];
-  }
+function I(e) {
+  for (let t in m)
+    this[t] = m[t];
 }
-const KeepViewAlive = /* @__PURE__ */ function() {
-  return __component__.exports;
+const b = /* @__PURE__ */ function() {
+  return T.exports;
 }();
 export {
-  KeepViewAlive as default
+  b as default
 };

package/dist/components/keyboard/index.js

@@ -0,0 +1,389 @@
+import { n as S } from "../../chunks/vueComponentNormalizer.71e2aa87.js";
+let T = class {
+  constructor(e) {
+    if (typeof e != "object") {
+      console.error('aKeyboard: The obj parameter needs to be an object <In "new aKeyboard()">');
+      return;
+    }
+    this.obj = e;
+    const r = document.querySelector(e.el);
+    let l = "";
+    if (typeof e.style == "object")
+      for (let t in e.style)
+        l += t + ": " + e.style[t] + ";";
+    let i = '<div class="akeyboard-keyboard' + (e.fixedBottomCenter ? " akeyboard-keyboard-fixedBottomCenter" : "") + '" style="' + l + '">', o = [];
+    for (let t = 1; t < 10; t++)
+      o.push(t.toString());
+    o.push("0");
+    const s = e.keys || [
+      ["`"].concat(o).concat([
+        "-",
+        "=",
+        "Delete"
+      ]),
+      ["Tab", "q", "w", "e", "r", "t", "y", "u", "i", "o", "p", "[", "]", "\\"],
+      ["Caps", "a", "s", "d", "f", "g", "h", "j", "k", "l", ";", "'", "Enter"],
+      ["Shift", "z", "x", "c", "v", "b", "n", "m", ",", ".", "/", "Shift"],
+      ["Space"]
+    ];
+    let n;
+    const a = [], m = [];
+    for (let t = 0; t < s.length; t++) {
+      a.push([]), m.push([]), n = s[t];
+      for (let c = 0; c < n.length; c++) {
+        if (n[c].length === 1) {
+          switch (m[t].push(n[c].toUpperCase()), n[c]) {
+            case "`":
+              a[t].push("~");
+              continue;
+            case "1":
+              a[t].push("!");
+              continue;
+            case "2":
+              a[t].push("@");
+              continue;
+            case "3":
+              a[t].push("#");
+              continue;
+            case "4":
+              a[t].push("$");
+              continue;
+            case "5":
+              a[t].push("%");
+              continue;
+            case "6":
+              a[t].push("^");
+              continue;
+            case "7":
+              a[t].push("&");
+              continue;
+            case "8":
+              a[t].push("*");
+              continue;
+            case "9":
+              a[t].push("(");
+              continue;
+            case "0":
+              a[t].push(")");
+              continue;
+            case "-":
+              a[t].push("_");
+              continue;
+            case "=":
+              a[t].push("+");
+              continue;
+            case "[":
+              a[t].push("{");
+              continue;
+            case "]":
+              a[t].push("}");
+              continue;
+            case "\\":
+              a[t].push("|");
+              continue;
+            case ";":
+              a[t].push(":");
+              continue;
+            case "'":
+              a[t].push('"');
+              continue;
+            case ",":
+              a[t].push("<");
+              continue;
+            case ".":
+              a[t].push(">");
+              continue;
+            case "/":
+              a[t].push("?");
+              continue;
+          }
+          a[t].push(n[c].toUpperCase());
+          continue;
+        }
+        a[t].push(n[c]), m[t].push(n[c]);
+      }
+    }
+    for (let t = 0; t < s.length; t++) {
+      n = s[t], i += '<div class="akeyboard-keyboard-innerKeys">';
+      for (let c = 0; c < n.length; c++)
+        i += '<div class="akeyboard-keyboard-keys akeyboard-keyboard-keys-' + n[c] + '">' + n[c] + "</div>";
+      i += "</div>";
+    }
+    i += "</div>", r.innerHTML = i;
+    let K = !1;
+    s.forEach((t) => {
+      if (t.includes("Shift")) {
+        K = !0;
+        return;
+      }
+    }), K && document.querySelectorAll(e.el + " .akeyboard-keyboard-keys-Shift").forEach((c) => {
+      c.onclick = function() {
+        if (!this.isShift) {
+          const y = document.querySelector(e.el + " .akeyboard-keyboard-keys-Caps");
+          if (y && y.isCaps)
+            return;
+          c.isShift = !0, c.innerHTML = "SHIFT", this.classList.add("keyboard-keyboard-keys-focus");
+          const u = document.querySelectorAll(e.el + " .akeyboard-keyboard-innerKeys");
+          let b;
+          for (let h = 0; h < u.length; h++) {
+            b = u[h];
+            for (let f = 0; f < b.childNodes.length; f++)
+              a[h][f] !== "Shift" && (b.childNodes[f].innerHTML = a[h][f]);
+          }
+          return;
+        }
+        c.isShift = !1, c.innerHTML = "Shift", this.classList.remove("keyboard-keyboard-keys-focus");
+        const p = document.querySelectorAll(e.el + " .akeyboard-keyboard-innerKeys");
+        let k;
+        for (let y = 0; y < p.length; y++) {
+          k = p[y];
+          for (let u = 0; u < k.childNodes.length; u++)
+            k.childNodes[u].innerHTML = s[y][u];
+        }
+      };
+    });
+    let v = !1;
+    s.forEach((t) => {
+      if (t.includes("Caps")) {
+        v = !0;
+        return;
+      }
+    }), v && document.querySelectorAll(e.el + " .akeyboard-keyboard-keys-Caps").forEach((c) => {
+      c.onclick = function() {
+        if (!this.isCaps) {
+          const y = document.querySelector(e.el + " .akeyboard-keyboard-keys-Shift");
+          if (y && y.isShift)
+            return;
+          this.isCaps = !0, this.classList.add("keyboard-keyboard-keys-focus");
+          const u = document.querySelectorAll(e.el + " .akeyboard-keyboard-innerKeys");
+          let b;
+          for (let h = 0; h < u.length; h++) {
+            b = u[h];
+            for (let f = 0; f < b.childNodes.length; f++)
+              b.childNodes[f].innerHTML = m[h][f];
+          }
+          return;
+        }
+        this.isCaps = !1, this.classList.remove("keyboard-keyboard-keys-focus");
+        const p = document.querySelectorAll(e.el + " .akeyboard-keyboard-innerKeys");
+        let k;
+        for (let y = 0; y < p.length; y++) {
+          k = p[y];
+          for (let u = 0; u < k.childNodes.length; u++)
+            k.childNodes[u].innerHTML = s[y][u];
+        }
+      };
+    });
+  }
+  inputOn(e, r, l, i) {
+    if (typeof e != "string") {
+      console.error('aKeyboard: The inputEle parameter needs to be a string <In "aKeyboard.inputOn()">');
+      return;
+    }
+    if (typeof r != "string") {
+      console.error('aKeyboard: The type parameter needs to be a string <In "aKeyboard.inputOn()">');
+      return;
+    }
+    const o = document.querySelector(e), s = document.querySelectorAll(this.obj.el + " .akeyboard-keyboard-keys");
+    for (let n = 0; n < s.length; n++)
+      if (!["Shift", "Caps"].includes(s[n].innerHTML)) {
+        if (s[n].innerHTML === "Delete") {
+          s[n].onclick = function() {
+            o[r] = o[r].substr(0, o[r].length - 1), l("Delete", o[r]);
+          };
+          continue;
+        }
+        if (s[n].innerHTML === "Tab") {
+          s[n].onclick = function() {
+            o[r] += "  ", l("Tab", o[r]);
+          };
+          continue;
+        }
+        if (s[n].innerHTML === "Enter") {
+          s[n].onclick = function() {
+            o[r] += `
+`, l("Enter", o[r]);
+          };
+          continue;
+        }
+        if (s[n].innerHTML === "Space") {
+          s[n].onclick = function() {
+            o[r] += " ", l("Space", o[r]);
+          };
+          continue;
+        }
+        i && typeof i == "object" && Object.keys(i).length > 0 && i[s[n].innerHTML] ? s[n].onclick = i[s[n].innerHTML] : s[n].onclick = function() {
+          o[r] += this.innerText, l(this.innerText, o[r]);
+        };
+      }
+  }
+  onclick(e, r) {
+    if (typeof e != "string") {
+      console.error('aKeyboard: The btn parameter needs to be a string <In "aKeyboard.onclick()">');
+      return;
+    }
+    if (typeof r != "function") {
+      console.error('aKeyboard: The fn parameter needs to be a function <In "aKeyboard.onclick()">');
+      return;
+    }
+    let l = document.querySelector(this.obj.el + " .akeyboard-keyboard-keys-" + e);
+    l ? l.onclick = r : console.error("Can not find key: " + e);
+  }
+};
+class E {
+  constructor(e) {
+    if (typeof e != "object") {
+      console.error('aKeyboard: The obj parameter needs to be an object <In "new aKeyboard()">');
+      return;
+    }
+    this.obj = e;
+    const r = document.querySelector(e.el);
+    let l = "";
+    if (typeof e.style == "object")
+      for (let o in e.style)
+        l += o + ": " + e.style[o] + ";";
+    let i = '<div class="akeyboard-numberKeyboard' + (e.fixedBottomCenter ? " akeyboard-keyboard-fixedBottomCenter" : "") + '" style="' + l + '">';
+    i += '<div class="akeyboard-keyboard-innerKeys">';
+    for (let o = 1; o < 10; o++)
+      i += '<div class="akeyboard-keyboard-keys akeyboard-keyboard-keys-' + o + '">' + o + "</div>", o % 3 === 0 && (i += '</div><div class="akeyboard-keyboard-innerKeys">');
+    i += '<div class="akeyboard-keyboard-keys akeyboard-keyboard-keys-0">0</div><div class="akeyboard-keyboard-keys akeyboard-keyboard-keys-Delete">Delete</div></div><div class="akeyboard-keyboard-innerKeys"><div class="akeyboard-keyboard-keys akeyboard-numberKeyboard-keys-Enter">Enter</div></div>', i += "</div>", r.innerHTML = i;
+  }
+  inputOn(e, r, l, i) {
+    if (typeof e != "string") {
+      console.error('aKeyboard: The inputEle parameter needs to be a string <In "aKeyboard.inputOn()">');
+      return;
+    }
+    if (typeof r != "string") {
+      console.error('aKeyboard: The type parameter needs to be a string <In "aKeyboard.inputOn()">');
+      return;
+    }
+    const o = document.querySelector(e), s = document.querySelectorAll(this.obj.el + " .akeyboard-keyboard-keys");
+    for (let n = 0; n < s.length; n++) {
+      if (s[n].innerHTML === "Delete") {
+        s[n].onclick = function() {
+          o[r] = o[r].substr(0, o[r].length - 1), l("Delete", o[r]);
+        };
+        continue;
+      }
+      if (s[n].innerHTML === "Enter") {
+        s[n].onclick = function() {
+          o[r] += `
+`, l("Enter", o[r]);
+        };
+        continue;
+      }
+      i && typeof i == "object" && Object.keys(i).length > 0 && i[s[n].innerHTML] ? s[n].onclick = i[s[n].innerHTML] : s[n].onclick = function() {
+        o[r] += this.innerText, l(this.innerText, o[r]);
+      };
+    }
+  }
+  onclick(e, r) {
+    if (typeof e != "string") {
+      console.error('aKeyboard: The btn parameter needs to be a string <In "aKeyboard.onclick()">');
+      return;
+    }
+    if (typeof r != "function") {
+      console.error('aKeyboard: The fn parameter needs to be a function <In "aKeyboard.onclick()">');
+      return;
+    }
+    let l = document.querySelector(this.obj.el + " .akeyboard-keyboard-keys-" + e);
+    l ? l.onclick = r : console.error("Can not find key: " + e);
+  }
+}
+var _ = function() {
+  var d = this, e = d.$createElement, r = d._self._c || e;
+  return r("div", {
+    class: ["avue-keyboard", d.className]
+  }, [r("div", {
+    attrs: {
+      id: "keyboard"
+    }
+  })]);
+}, L = [];
+const M = {
+  name: "Keyboard",
+  props: {
+    ele: {
+      type: String,
+      required: !0
+    },
+    keys: Array,
+    theme: {
+      type: String,
+      default: "default",
+      validator: (d) => ["default", "dark", "green", "classic"].includes(d)
+    },
+    type: {
+      type: String,
+      default: "default",
+      validator: (d) => ["default", "number", "mobile"].includes(d)
+    },
+    fixedBottomCenter: {
+      type: Boolean,
+      default: !1
+    },
+    rebind: {
+      type: Boolean,
+      default: !0
+    }
+  },
+  data() {
+    return {
+      customClick: {}
+    };
+  },
+  computed: {
+    className() {
+      return `avue-keyboard--${this.theme}`;
+    }
+  },
+  watch: {
+    ele() {
+      this.init();
+    }
+  },
+  mounted() {
+    this.init();
+  },
+  methods: {
+    init() {
+      if (!this.ele)
+        return;
+      let d;
+      const e = {
+        el: "#keyboard",
+        style: {},
+        keys: this.keys,
+        fixedBottomCenter: this.fixedBottomCenter
+      };
+      this.type === "default" ? d = new T(e) : this.type === "number" ? d = new E(e) : this.type === "mobile" && (d = new MobileKeyBoard(e));
+      const r = this.ele.indexOf("#") === 0 ? this.ele.substring(1) : this.ele;
+      d.inputOn(`#${r}`, "value", (l, i) => {
+        this.$emit("click", l, i);
+      }, this.rebind ? this.customClick : null), this.keyboard = d;
+    },
+    bindClick(d, e) {
+      this.keyboard.onclick(d, e), this.customClick[d] = e;
+    }
+  }
+}, g = {};
+var C = /* @__PURE__ */ S(
+  M,
+  _,
+  L,
+  !1,
+  H,
+  null,
+  null,
+  null
+);
+function H(d) {
+  for (let e in g)
+    this[e] = g[e];
+}
+const I = /* @__PURE__ */ function() {
+  return C.exports;
+}();
+export {
+  I as default
+};

package/dist/components/keyboard/style.css

@@ -0,0 +1 @@
+.avue-keyboard--default .akeyboard-keyboard{height:100%;width:100%;background:#f0f0f0;border-radius:5px;padding:9px 5px 5px;box-sizing:border-box}.avue-keyboard--default .akeyboard-keyboard-innerKeys{text-align:center}.avue-keyboard--default .akeyboard-keyboard-keys{height:40px;min-width:40px;padding:0 10px;border-radius:5px;background:white;display:inline-block;line-height:40px;text-align:center;box-sizing:border-box;margin:4px;cursor:pointer;user-select:none}.avue-keyboard--default .akeyboard-keyboard-keys:hover{background:#1e9fff;color:#fff}.avue-keyboard--default .akeyboard-keyboard-keys-Delete,.avue-keyboard--default .akeyboard-keyboard-keys-Tab{width:80px}.avue-keyboard--default .akeyboard-keyboard-keys-Caps{width:77px}.avue-keyboard--default .akeyboard-keyboard-keys-Enter{width:90px}.avue-keyboard--default .akeyboard-keyboard-keys-Shift{width:106px}.avue-keyboard--default .akeyboard-keyboard-keys-Space{width:350px}.avue-keyboard--default .keyboard-keyboard-keys-focus{background:#1e9fff;color:#fff}.avue-keyboard--default .akeyboard-keyboard-fixedBottomCenter{width:100%!important;height:auto!important;position:fixed;bottom:0px;left:0px;border-radius:0!important}.avue-keyboard--default .akeyboard-numberKeyboard{height:100%;width:100%;background:#f0f0f0;border-radius:5px;padding:10px 5px 5px;box-sizing:border-box}.avue-keyboard--default .akeyboard-numberKeyboard-keys-Enter{height:40px;width:100px}.avue-keyboard--default .akeyboard-mobileKeyboard{height:100%;width:100%;background:#f0f0f0;border-radius:5px;padding:11px 5px 5px;box-sizing:border-box}.avue-keyboard--default .akeyboard-mobileKeyboard-keys{height:25px;min-width:25px;padding:0 10px;border-radius:3px;background:white;display:inline-block;line-height:25px;text-align:center;box-sizing:border-box;margin:3px 2px 2px;cursor:pointer;user-select:none;font-size:10px}.avue-keyboard--default .akeyboard-mobileKeyboard-keys:hover{background:#1e9fff!important;color:#fff}.avue-keyboard--default .akeyboard-mobileKeyboard-keys-\21e7 ,.avue-keyboard--default .akeyboard-mobileKeyboard-keys-\21e6 {width:25px;background-color:#999faf}.avue-keyboard--default .akeyboard-mobileKeyboard-keys-Space{height:28px;width:100px;line-height:28px;margin-left:55px}.avue-keyboard--default .akeyboard-mobileKeyboard-keys-Enter{height:28px;width:55px;line-height:28px;background:#1e9fff!important;color:#fff}.avue-keyboard--default .akeyboard-mobileKeyboard-keys-focus{background:#1e9fff!important;color:#fff}.avue-keyboard--green .akeyboard-keyboard{height:100%;width:100%;background:#003300;border-radius:5px;padding:9px 5px 5px;box-sizing:border-box}.avue-keyboard--green .akeyboard-keyboard-innerKeys{text-align:center}.avue-keyboard--green .akeyboard-keyboard-keys{height:40px;min-width:40px;padding:0 10px;border-radius:5px;background:#cccc99;display:inline-block;line-height:40px;text-align:center;box-sizing:border-box;margin:4px;cursor:pointer;user-select:none}.avue-keyboard--green .akeyboard-keyboard-keys:hover{background:#669933;color:#fff}.avue-keyboard--green .akeyboard-keyboard-keys-Delete,.avue-keyboard--green .akeyboard-keyboard-keys-Tab{width:80px}.avue-keyboard--green .akeyboard-keyboard-keys-Caps{width:77px}.avue-keyboard--green .akeyboard-keyboard-keys-Enter{width:90px}.avue-keyboard--green .akeyboard-keyboard-keys-Shift{width:106px}.avue-keyboard--green .akeyboard-keyboard-keys-Space{width:350px}.avue-keyboard--green .keyboard-keyboard-keys-focus{background:#669933;color:#fff}.avue-keyboard--green .akeyboard-keyboard-fixedBottomCenter{width:100%!important;height:auto!important;position:fixed;bottom:0px;left:0px;border-radius:0!important}.avue-keyboard--green .akeyboard-numberKeyboard{height:100%;width:100%;background:#003300;border-radius:5px;padding:10px 5px 5px;box-sizing:border-box}.avue-keyboard--green .akeyboard-numberKeyboard-keys-Enter{height:40px;width:100px}.avue-keyboard--green .akeyboard-mobileKeyboard{height:100%;width:100%;background:#003300;border-radius:5px;padding:11px 5px 5px;box-sizing:border-box}.avue-keyboard--green .akeyboard-mobileKeyboard-keys{height:25px;min-width:25px;padding:0 10px;border-radius:3px;background:#cccc99;display:inline-block;line-height:25px;text-align:center;box-sizing:border-box;margin:3px 2px 2px;cursor:pointer;user-select:none;font-size:10px}.avue-keyboard--green .akeyboard-mobileKeyboard-keys:hover{background:#669933!important;color:#fff}.avue-keyboard--green .akeyboard-mobileKeyboard-keys-\21e7 ,.avue-keyboard--green .akeyboard-mobileKeyboard-keys-\21e6 {width:25px;background-color:#999faf}.avue-keyboard--green .akeyboard-mobileKeyboard-keys-Space{height:28px;width:100px;line-height:28px;margin-left:55px}.avue-keyboard--green .akeyboard-mobileKeyboard-keys-Enter{height:28px;width:55px;line-height:28px;background:#669933!important;color:#fff}.avue-keyboard--green .akeyboard-mobileKeyboard-keys-focus{background:#669933!important;color:#fff}.avue-keyboard--dark .akeyboard-keyboard{height:100%;width:100%;background:black;color:#fff;border-radius:5px;padding:9px 5px 5px;box-sizing:border-box}.avue-keyboard--dark .akeyboard-keyboard-innerKeys{text-align:center}.avue-keyboard--dark .akeyboard-keyboard-keys{height:40px;min-width:40px;padding:0 10px;border-radius:5px;background:#393d49;color:#fff;display:inline-block;line-height:40px;text-align:center;box-sizing:border-box;margin:4px;cursor:pointer;user-select:none}.avue-keyboard--dark .akeyboard-keyboard-keys:hover{background:#1e9fff}.avue-keyboard--dark .akeyboard-keyboard-keys-Delete,.avue-keyboard--dark .akeyboard-keyboard-keys-Tab{width:80px}.avue-keyboard--dark .akeyboard-keyboard-keys-Caps{width:77px}.avue-keyboard--dark .akeyboard-keyboard-keys-Enter{width:90px}.avue-keyboard--dark .akeyboard-keyboard-keys-Shift{width:106px}.avue-keyboard--dark .akeyboard-keyboard-keys-Space{width:350px}.avue-keyboard--dark .keyboard-keyboard-keys-focus{background:#1e9fff}.avue-keyboard--dark .akeyboard-keyboard-fixedBottomCenter{width:100%!important;height:auto!important;position:fixed;bottom:0px;left:0px;border-radius:0!important}.avue-keyboard--dark .akeyboard-numberKeyboard{height:100%;width:100%;background:black;border-radius:5px;padding:10px 5px 5px;box-sizing:border-box}.avue-keyboard--dark .akeyboard-numberKeyboard-keys-Enter{height:40px;width:100px}.avue-keyboard--dark .akeyboard-mobileKeyboard{height:100%;width:100%;background:black;border-radius:5px;padding:11px 5px 5px;box-sizing:border-box}.avue-keyboard--dark .akeyboard-mobileKeyboard-keys{height:25px;min-width:25px;padding:0 10px;border-radius:3px;background:#393d49;color:#fff;display:inline-block;line-height:25px;text-align:center;box-sizing:border-box;margin:3px 2px 2px;cursor:pointer;user-select:none;font-size:10px}.avue-keyboard--dark .akeyboard-mobileKeyboard-keys:hover{background:#1e9fff!important;color:#fff}.avue-keyboard--dark .akeyboard-mobileKeyboard-keys-\21e7 ,.avue-keyboard--dark .akeyboard-mobileKeyboard-keys-\21e6 {width:25px;background-color:#999faf}.avue-keyboard--dark .akeyboard-mobileKeyboard-keys-Space{height:28px;width:100px;line-height:28px;margin-left:55px}.avue-keyboard--dark .akeyboard-mobileKeyboard-keys-Enter{height:28px;width:55px;line-height:28px;background:#1e9fff!important;color:#fff}.avue-keyboard--dark .akeyboard-mobileKeyboard-keys-focus{background:#1e9fff!important;color:#fff}.avue-keyboard--classic .akeyboard-keyboard{height:100%;width:100%;background:#2f4056;border-radius:5px;padding:9px 5px 5px;box-sizing:border-box}.avue-keyboard--classic .akeyboard-keyboard-innerKeys{text-align:center}.avue-keyboard--classic .akeyboard-keyboard-keys{height:40px;min-width:40px;padding:0 10px;border-radius:5px;background:white;display:inline-block;line-height:40px;text-align:center;box-sizing:border-box;margin:4px;cursor:pointer;user-select:none}.avue-keyboard--classic .akeyboard-keyboard-keys:hover{background:#c2c2c2;color:#fff}.avue-keyboard--classic .akeyboard-keyboard-keys-Delete,.avue-keyboard--classic .akeyboard-keyboard-keys-Tab{width:80px}.avue-keyboard--classic .akeyboard-keyboard-keys-Caps{width:77px}.avue-keyboard--classic .akeyboard-keyboard-keys-Enter{width:90px}.avue-keyboard--classic .akeyboard-keyboard-keys-Shift{width:106px}.avue-keyboard--classic .akeyboard-keyboard-keys-Space{width:350px}.avue-keyboard--classic .keyboard-keyboard-keys-focus{background:#c2c2c2;color:#fff}.avue-keyboard--classic .akeyboard-keyboard-fixedBottomCenter{width:100%!important;height:auto!important;position:fixed;bottom:0px;left:0px;border-radius:0!important}.avue-keyboard--classic .akeyboard-numberKeyboard{height:100%;width:100%;background:#2f4056;border-radius:5px;padding:10px 5px 5px;box-sizing:border-box}.avue-keyboard--classic .akeyboard-numberKeyboard-keys-Enter{height:40px;width:100px}.avue-keyboard--classic .akeyboard-mobileKeyboard{height:100%;width:100%;background:#2f4056;border-radius:5px;padding:11px 5px 5px;box-sizing:border-box}.avue-keyboard--classic .akeyboard-mobileKeyboard-keys{height:25px;min-width:25px;padding:0 10px;border-radius:3px;background:white;display:inline-block;line-height:25px;text-align:center;box-sizing:border-box;margin:3px 2px 2px;cursor:pointer;user-select:none;font-size:10px}.avue-keyboard--classic .akeyboard-mobileKeyboard-keys:hover{background:#c2c2c2!important;color:#fff}.avue-keyboard--classic .akeyboard-mobileKeyboard-keys-\21e7 ,.avue-keyboard--classic .akeyboard-mobileKeyboard-keys-\21e6 {width:25px;background-color:#999faf}.avue-keyboard--classic .akeyboard-mobileKeyboard-keys-Space{height:28px;width:100px;line-height:28px;margin-left:55px}.avue-keyboard--classic .akeyboard-mobileKeyboard-keys-Enter{height:28px;width:55px;line-height:28px;background:#c2c2c2!important;color:#fff}.avue-keyboard--classic .akeyboard-mobileKeyboard-keys-focus{background:#c2c2c2!important;color:#fff}