@quoreadmin/ui 1.7.20 → 1.8.1

package/dist/index131.js

@@ -1,257 +1,82 @@
-import { defineComponent as M, ref as h, computed as H, onMounted as A, onUnmounted as Q, watch as F, nextTick as O } from "vue";
-import { onClickOutside as W } from "./index163.js";
-import { useThrottleFn as k } from "./index174.js";
-const G = M({
-  name: "QPopover",
+import { defineComponent as x, ref as s, onMounted as y, nextTick as P } from "vue";
+import { getDocument as C, version as k, GlobalWorkerOptions as E } from "./index188.js";
+import D from "./index22.js";
+E.workerSrc = `https://cdn.jsdelivr.net/npm/pdfjs-dist@${k}/legacy/build/pdf.worker.min.mjs`;
+const S = x({
+  name: "PdfViewer",
+  components: {
+    QErrorModal: D
+  },
   props: {
-    /** Aligns the popover accordingly with the trigger.
-     * i.e. bottom, center, left, middle, right, top.
-     * Right, left or middle align goes with bottom or top position
-     * Top, bottom or center align goes with right or left position */
-    align: {
-      type: String,
-      default: "left"
-    },
-    /** Specifies whether to have a caret pointer or not. */
-    hasCaret: {
-      type: Boolean,
-      default: !0
-    },
-    /**  Toggles the content from the parent component. i.e. false, true. */
-    modelValue: {
-      type: Boolean,
-      default: !1
-    },
-    /** Positions the popover to the specified side of the trigger.
-     * i.e. bottom, left, right, top.
-     * Bottom or top position goes with right, left or middle align
-     * Right or left position goes with top, bottom or center align */
-    position: {
-      type: String,
-      default: "bottom"
-    },
-    /** Should the popover be repositioned and realigned automatically if it is outside viewport.
-     *  Moving element position from left to right, and top to bottom
-     * and alignment from right to left or top to bottom.
-    */
-    reposition: {
-      type: Boolean,
-      default: !0
-    },
-    /** Specifies the size of the popover. sm, md, lg, or filter-sm, filter-md, filter-lg for filter-style popovers. */
-    size: {
+    url: {
       type: String,
-      default: "md"
-    },
-    /** Set if the popover is teleported to the teleportTo element (escapes overflow clipping) */
-    teleport: {
-      type: Boolean,
-      default: !1
-    },
-    /** Target element for teleport */
-    teleportTo: {
-      type: String,
-      default: "body"
-    },
-    /** Whether the teleported popover should follow the trigger on scroll.
-     * When true (default), popover repositions as user scrolls.
-     * When false, popover stays fixed at its initial opened position. */
-    followScroll: {
-      type: Boolean,
-      default: !0
-    },
-    /** Trigger popover on click, hover or both */
-    trigger: {
-      type: String,
-      default: "click"
-    },
-    /** Whether to close the popover when the trigger scrolls out of its scrollable parent.
-     * Useful for popovers inside scrollable containers to prevent orphaned popovers. */
-    closeOnScrollOutOfView: {
-      type: Boolean,
-      default: !1
-    },
-    /** Whether to scroll the page to bring the popover into view when it opens or content changes.
-     * Uses smooth scrolling and adds padding to ensure the popover isn't at the edge of the viewport. */
-    scrollIntoView: {
-      type: Boolean,
-      default: !1
-    },
-    /** Padding (in pixels) from viewport edge when scrolling popover into view. */
-    scrollIntoViewPadding: {
-      type: Number,
-      default: 20
+      required: !0
     }
   },
-  emits: ["update:modelValue"],
-  setup(o, { emit: a }) {
-    const f = h(!1), d = h(""), u = h(null), g = h(null), V = h({
-      top: "0",
-      left: "0",
-      transform: "none"
-    }), p = H(() => f.value === !0 && o.reposition === !0 ? S(o.align) : o.align), y = H(() => f.value === !0 && o.reposition === !0 ? R(o.position) : o.position), S = (t) => {
-      if (!u.value) return t;
-      const e = o.teleport ? document.querySelector(".q-popover.teleported") : u.value.children[1];
-      if (!e || w(e)) return t;
-      const n = u.value.children[0].getBoundingClientRect(), r = e.getBoundingClientRect();
-      if (t === "left" || t === "right" || t === "center") {
-        const l = n.left;
-        return window.innerWidth - l < r.width ? "right" : "left";
-      } else {
-        const l = n.top;
-        return window.innerHeight - l < r.height ? "bottom" : "top";
-      }
-    }, R = (t) => {
-      if (!u.value) return t;
-      const e = o.teleport ? document.querySelector(".q-popover.teleported") : u.value.children[1];
-      if (!e || w(e)) return t;
-      const n = u.value.children[0].getBoundingClientRect(), r = e.getBoundingClientRect();
-      if (t === "top" || t === "bottom") {
-        const l = n.top;
-        return window.innerHeight - l < r.height ? "top" : "bottom";
-      } else {
-        const l = n.left;
-        return window.innerWidth - l < r.width ? "left" : "right";
+  emits: ["pdf-error"],
+  setup(w, { emit: a }) {
+    let r = null;
+    const g = 2, v = 16, l = s([]), c = s(!0), t = s(!1), i = s(0), f = async () => {
+      try {
+        if (r = await C(w.url).promise, !r)
+          throw new Error("pdfDoc is null or undefined");
+        i.value = r.numPages, c.value = !1, await P(), l.value = Array.from(
+          document.querySelectorAll(".pdf-pages canvas")
+        ), await h();
+      } catch (e) {
+        t.value = !0, console.log(e), c.value = !1, a("pdf-error", !0);
       }
-    }, w = (t) => {
-      if (!t) return !1;
-      const e = t.getBoundingClientRect();
-      return e ? e.top >= 0 && e.left >= 0 && e.bottom <= (window.innerHeight || document.documentElement.clientHeight) && e.right <= (window.innerWidth || document.documentElement.clientWidth) : !1;
-    }, q = () => {
-      if (!u.value) return !0;
-      const t = u.value.children[0];
-      if (!t) return !0;
-      const e = t.getBoundingClientRect();
-      let n = t.parentElement;
-      for (; n; ) {
-        const r = getComputedStyle(n), l = r.overflowY, i = r.overflowX;
-        if (l === "auto" || l === "scroll" || (i === "auto" || i === "scroll")) {
-          const v = n.getBoundingClientRect();
-          if (!(e.bottom > v.top && e.top < v.bottom && e.right > v.left && e.left < v.right))
-            return !1;
-        }
-        n = n.parentElement;
+    }, h = async () => {
+      try {
+        for (let e = 1; e <= i.value; e++)
+          await u(e);
+      } catch (e) {
+        console.log(e), t.value = !0, a("pdf-error", !0);
       }
-      return !0;
-    }, B = () => {
-      if (!o.teleport || !o.scrollIntoView || !o.modelValue) return;
-      const t = document.querySelector(".q-popover.teleported");
-      if (!t) return;
-      const e = t.getBoundingClientRect(), n = o.scrollIntoViewPadding, r = window.innerHeight, l = window.innerWidth;
-      let i = 0, c = 0;
-      e.bottom + n > r ? c = e.bottom + n - r : e.top - n < 0 && (c = e.top - n), e.right + n > l ? i = e.right + n - l : e.left - n < 0 && (i = e.left - n), (i !== 0 || c !== 0) && window.scrollBy({
-        top: c,
-        left: i,
-        behavior: "smooth"
-      });
-    }, z = () => {
-      if (!o.teleport || !o.scrollIntoView) return;
-      b();
-      const t = document.querySelector(".q-popover.teleported");
-      t && (g.value = new ResizeObserver(() => {
-        setTimeout(B, 50);
-      }), g.value.observe(t));
-    }, b = () => {
-      g.value && (g.value.disconnect(), g.value = null);
-    }, I = () => {
-      (o.trigger === "click" || o.trigger === "both") && a("update:modelValue", !o.modelValue);
-    }, P = () => {
-      o.trigger !== "click" && a("update:modelValue", !1);
-    }, T = () => {
-      o.trigger !== "click" && a("update:modelValue", !0);
-    }, x = () => {
-      const t = u.value?.children[0];
-      if (t) {
-        const e = t.clientWidth, n = t.clientHeight;
-        switch (p.value) {
-          case "left":
-            d.value = `margin-left: ${e / 2 - 10}px;`;
-            break;
-          case "right":
-            d.value = `margin-right: ${e / 2 - 10}px;`;
-            break;
-          case "top":
-            d.value = `margin-top: ${n / 2 - 10}px;`;
-            break;
-          case "bottom":
-            d.value = `margin-bottom: ${n / 2 - 10}px;`;
-            break;
-        }
+    }, u = async (e) => {
+      try {
+        const o = await r?.getPage(e);
+        if (!o)
+          throw new Error(
+            `Page ${e} does not exist in the PDF document`
+          );
+        const d = o.getViewport({ scale: 1 }), n = l.value[e - 1];
+        if (!n)
+          throw new Error(
+            `Canvas for page ${e} does not exist`
+          );
+        const p = n.getContext("2d");
+        if (!p)
+          throw new Error(
+            `Context for page ${e} does not exist`
+          );
+        n.height = d?.height, n.width = d?.width;
+        const m = {
+          canvasContext: p,
+          viewport: d
+        };
+        await o?.render(m);
+      } catch (o) {
+        console.log(o), t.value = !0, a("pdf-error", !0);
       }
-    }, m = () => {
-      if (!u.value || !o.teleport) return;
-      const t = u.value.children[0];
-      if (!t) return;
-      const e = t.getBoundingClientRect(), n = 10, r = y.value, l = p.value;
-      let i = 0, c = 0, s = "none";
-      r === "bottom" ? (i = e.bottom + n, l === "left" ? (c = e.left, s = "none") : l === "right" ? (c = e.right, s = "translateX(-100%)") : l === "center" && (c = e.left + e.width / 2, s = "translateX(-50%)")) : r === "top" ? (i = e.top - n, s = "translateY(-100%)", l === "left" ? c = e.left : l === "right" ? (c = e.right, s = "translate(-100%, -100%)") : l === "center" && (c = e.left + e.width / 2, s = "translate(-50%, -100%)")) : r === "left" ? (c = e.left - n, s = "translateX(-100%)", l === "top" ? i = e.top : l === "bottom" ? (i = e.bottom, s = "translate(-100%, -100%)") : l === "middle" && (i = e.top + e.height / 2, s = "translate(-100%, -50%)")) : r === "right" && (c = e.right + n, l === "top" ? (i = e.top, s = "none") : l === "bottom" ? (i = e.bottom, s = "translateY(-100%)") : l === "middle" && (i = e.top + e.height / 2, s = "translateY(-50%)")), V.value = {
-        top: `${i}px`,
-        left: `${c}px`,
-        transform: s
-      };
-    }, L = () => {
-      o.teleport && o.modelValue && m();
-    }, X = () => {
-      if (o.teleport && o.modelValue) {
-        if (o.closeOnScrollOutOfView && !q()) {
-          a("update:modelValue", !1);
-          return;
-        }
-        o.followScroll && m();
-      }
-    }, C = k(L, 16, !0), E = k(X, 16, !0);
-    W(u, (t) => {
-      if (o.teleport) {
-        const e = document.querySelector(".q-popover.teleported");
-        if (e && e.contains(t.target))
-          return;
-      }
-      o.modelValue && a("update:modelValue", !1);
-    });
-    function Y() {
-      f.value = !1, b();
-    }
-    function $() {
-      f.value = !0, o.teleport ? O(() => {
-        m(), o.scrollIntoView && setTimeout(() => {
-          z(), B();
-        }, 100);
-      }) : !w(u.value?.children[1]) && o.reposition === !0 && x();
-    }
-    return A(() => {
-      o.teleport && (window.addEventListener("resize", C), window.addEventListener("scroll", E, !0));
-    }), Q(() => {
-      o.teleport && (window.removeEventListener("resize", C), window.removeEventListener("scroll", E, !0)), b();
-    }), F(
-      () => o.modelValue,
-      (t) => {
-        o.teleport && t && O(() => {
-          m();
-        });
-      }
-    ), {
+    };
+    return y(() => {
+      f();
+    }), {
+      // Static
+      skeletonColumns: g,
+      skeletonRows: v,
       // Refs
-      entered: f,
-      offsetStyle: d,
-      popover: u,
-      teleportedStyle: V,
-      // Computed
-      alignment: p,
-      positioning: y,
+      canvasRefs: l,
+      loadingMeta: c,
+      showErrorModal: t,
+      totalPages: i,
       // Methods
-      getAlignment: S,
-      getPositioning: R,
-      isElementInView: w,
-      onAfterLeave: Y,
-      onClick: I,
-      onClickOutside: W,
-      onEnter: $,
-      onMouseLeave: P,
-      onMouseOver: T,
-      updateTeleportedPosition: m
+      loadPDF: f,
+      renderPage: u
     };
   }
 });
 export {
-  G as default
+  S as default
 };

package/dist/index133.js

@@ -0,0 +1,257 @@
+import { defineComponent as M, ref as h, computed as H, onMounted as A, onUnmounted as Q, watch as F, nextTick as O } from "vue";
+import { onClickOutside as W } from "./index165.js";
+import { useThrottleFn as k } from "./index176.js";
+const G = M({
+  name: "QPopover",
+  props: {
+    /** Aligns the popover accordingly with the trigger.
+     * i.e. bottom, center, left, middle, right, top.
+     * Right, left or middle align goes with bottom or top position
+     * Top, bottom or center align goes with right or left position */
+    align: {
+      type: String,
+      default: "left"
+    },
+    /** Specifies whether to have a caret pointer or not. */
+    hasCaret: {
+      type: Boolean,
+      default: !0
+    },
+    /**  Toggles the content from the parent component. i.e. false, true. */
+    modelValue: {
+      type: Boolean,
+      default: !1
+    },
+    /** Positions the popover to the specified side of the trigger.
+     * i.e. bottom, left, right, top.
+     * Bottom or top position goes with right, left or middle align
+     * Right or left position goes with top, bottom or center align */
+    position: {
+      type: String,
+      default: "bottom"
+    },
+    /** Should the popover be repositioned and realigned automatically if it is outside viewport.
+     *  Moving element position from left to right, and top to bottom
+     * and alignment from right to left or top to bottom.
+    */
+    reposition: {
+      type: Boolean,
+      default: !0
+    },
+    /** Specifies the size of the popover. sm, md, lg, or filter-sm, filter-md, filter-lg for filter-style popovers. */
+    size: {
+      type: String,
+      default: "md"
+    },
+    /** Set if the popover is teleported to the teleportTo element (escapes overflow clipping) */
+    teleport: {
+      type: Boolean,
+      default: !1
+    },
+    /** Target element for teleport */
+    teleportTo: {
+      type: String,
+      default: "body"
+    },
+    /** Whether the teleported popover should follow the trigger on scroll.
+     * When true (default), popover repositions as user scrolls.
+     * When false, popover stays fixed at its initial opened position. */
+    followScroll: {
+      type: Boolean,
+      default: !0
+    },
+    /** Trigger popover on click, hover or both */
+    trigger: {
+      type: String,
+      default: "click"
+    },
+    /** Whether to close the popover when the trigger scrolls out of its scrollable parent.
+     * Useful for popovers inside scrollable containers to prevent orphaned popovers. */
+    closeOnScrollOutOfView: {
+      type: Boolean,
+      default: !1
+    },
+    /** Whether to scroll the page to bring the popover into view when it opens or content changes.
+     * Uses smooth scrolling and adds padding to ensure the popover isn't at the edge of the viewport. */
+    scrollIntoView: {
+      type: Boolean,
+      default: !1
+    },
+    /** Padding (in pixels) from viewport edge when scrolling popover into view. */
+    scrollIntoViewPadding: {
+      type: Number,
+      default: 20
+    }
+  },
+  emits: ["update:modelValue"],
+  setup(o, { emit: a }) {
+    const f = h(!1), d = h(""), u = h(null), g = h(null), V = h({
+      top: "0",
+      left: "0",
+      transform: "none"
+    }), p = H(() => f.value === !0 && o.reposition === !0 ? S(o.align) : o.align), y = H(() => f.value === !0 && o.reposition === !0 ? R(o.position) : o.position), S = (t) => {
+      if (!u.value) return t;
+      const e = o.teleport ? document.querySelector(".q-popover.teleported") : u.value.children[1];
+      if (!e || w(e)) return t;
+      const n = u.value.children[0].getBoundingClientRect(), r = e.getBoundingClientRect();
+      if (t === "left" || t === "right" || t === "center") {
+        const l = n.left;
+        return window.innerWidth - l < r.width ? "right" : "left";
+      } else {
+        const l = n.top;
+        return window.innerHeight - l < r.height ? "bottom" : "top";
+      }
+    }, R = (t) => {
+      if (!u.value) return t;
+      const e = o.teleport ? document.querySelector(".q-popover.teleported") : u.value.children[1];
+      if (!e || w(e)) return t;
+      const n = u.value.children[0].getBoundingClientRect(), r = e.getBoundingClientRect();
+      if (t === "top" || t === "bottom") {
+        const l = n.top;
+        return window.innerHeight - l < r.height ? "top" : "bottom";
+      } else {
+        const l = n.left;
+        return window.innerWidth - l < r.width ? "left" : "right";
+      }
+    }, w = (t) => {
+      if (!t) return !1;
+      const e = t.getBoundingClientRect();
+      return e ? e.top >= 0 && e.left >= 0 && e.bottom <= (window.innerHeight || document.documentElement.clientHeight) && e.right <= (window.innerWidth || document.documentElement.clientWidth) : !1;
+    }, q = () => {
+      if (!u.value) return !0;
+      const t = u.value.children[0];
+      if (!t) return !0;
+      const e = t.getBoundingClientRect();
+      let n = t.parentElement;
+      for (; n; ) {
+        const r = getComputedStyle(n), l = r.overflowY, i = r.overflowX;
+        if (l === "auto" || l === "scroll" || (i === "auto" || i === "scroll")) {
+          const v = n.getBoundingClientRect();
+          if (!(e.bottom > v.top && e.top < v.bottom && e.right > v.left && e.left < v.right))
+            return !1;
+        }
+        n = n.parentElement;
+      }
+      return !0;
+    }, B = () => {
+      if (!o.teleport || !o.scrollIntoView || !o.modelValue) return;
+      const t = document.querySelector(".q-popover.teleported");
+      if (!t) return;
+      const e = t.getBoundingClientRect(), n = o.scrollIntoViewPadding, r = window.innerHeight, l = window.innerWidth;
+      let i = 0, c = 0;
+      e.bottom + n > r ? c = e.bottom + n - r : e.top - n < 0 && (c = e.top - n), e.right + n > l ? i = e.right + n - l : e.left - n < 0 && (i = e.left - n), (i !== 0 || c !== 0) && window.scrollBy({
+        top: c,
+        left: i,
+        behavior: "smooth"
+      });
+    }, z = () => {
+      if (!o.teleport || !o.scrollIntoView) return;
+      b();
+      const t = document.querySelector(".q-popover.teleported");
+      t && (g.value = new ResizeObserver(() => {
+        setTimeout(B, 50);
+      }), g.value.observe(t));
+    }, b = () => {
+      g.value && (g.value.disconnect(), g.value = null);
+    }, I = () => {
+      (o.trigger === "click" || o.trigger === "both") && a("update:modelValue", !o.modelValue);
+    }, P = () => {
+      o.trigger !== "click" && a("update:modelValue", !1);
+    }, T = () => {
+      o.trigger !== "click" && a("update:modelValue", !0);
+    }, x = () => {
+      const t = u.value?.children[0];
+      if (t) {
+        const e = t.clientWidth, n = t.clientHeight;
+        switch (p.value) {
+          case "left":
+            d.value = `margin-left: ${e / 2 - 10}px;`;
+            break;
+          case "right":
+            d.value = `margin-right: ${e / 2 - 10}px;`;
+            break;
+          case "top":
+            d.value = `margin-top: ${n / 2 - 10}px;`;
+            break;
+          case "bottom":
+            d.value = `margin-bottom: ${n / 2 - 10}px;`;
+            break;
+        }
+      }
+    }, m = () => {
+      if (!u.value || !o.teleport) return;
+      const t = u.value.children[0];
+      if (!t) return;
+      const e = t.getBoundingClientRect(), n = 10, r = y.value, l = p.value;
+      let i = 0, c = 0, s = "none";
+      r === "bottom" ? (i = e.bottom + n, l === "left" ? (c = e.left, s = "none") : l === "right" ? (c = e.right, s = "translateX(-100%)") : l === "center" && (c = e.left + e.width / 2, s = "translateX(-50%)")) : r === "top" ? (i = e.top - n, s = "translateY(-100%)", l === "left" ? c = e.left : l === "right" ? (c = e.right, s = "translate(-100%, -100%)") : l === "center" && (c = e.left + e.width / 2, s = "translate(-50%, -100%)")) : r === "left" ? (c = e.left - n, s = "translateX(-100%)", l === "top" ? i = e.top : l === "bottom" ? (i = e.bottom, s = "translate(-100%, -100%)") : l === "middle" && (i = e.top + e.height / 2, s = "translate(-100%, -50%)")) : r === "right" && (c = e.right + n, l === "top" ? (i = e.top, s = "none") : l === "bottom" ? (i = e.bottom, s = "translateY(-100%)") : l === "middle" && (i = e.top + e.height / 2, s = "translateY(-50%)")), V.value = {
+        top: `${i}px`,
+        left: `${c}px`,
+        transform: s
+      };
+    }, L = () => {
+      o.teleport && o.modelValue && m();
+    }, X = () => {
+      if (o.teleport && o.modelValue) {
+        if (o.closeOnScrollOutOfView && !q()) {
+          a("update:modelValue", !1);
+          return;
+        }
+        o.followScroll && m();
+      }
+    }, C = k(L, 16, !0), E = k(X, 16, !0);
+    W(u, (t) => {
+      if (o.teleport) {
+        const e = document.querySelector(".q-popover.teleported");
+        if (e && e.contains(t.target))
+          return;
+      }
+      o.modelValue && a("update:modelValue", !1);
+    });
+    function Y() {
+      f.value = !1, b();
+    }
+    function $() {
+      f.value = !0, o.teleport ? O(() => {
+        m(), o.scrollIntoView && setTimeout(() => {
+          z(), B();
+        }, 100);
+      }) : !w(u.value?.children[1]) && o.reposition === !0 && x();
+    }
+    return A(() => {
+      o.teleport && (window.addEventListener("resize", C), window.addEventListener("scroll", E, !0));
+    }), Q(() => {
+      o.teleport && (window.removeEventListener("resize", C), window.removeEventListener("scroll", E, !0)), b();
+    }), F(
+      () => o.modelValue,
+      (t) => {
+        o.teleport && t && O(() => {
+          m();
+        });
+      }
+    ), {
+      // Refs
+      entered: f,
+      offsetStyle: d,
+      popover: u,
+      teleportedStyle: V,
+      // Computed
+      alignment: p,
+      positioning: y,
+      // Methods
+      getAlignment: S,
+      getPositioning: R,
+      isElementInView: w,
+      onAfterLeave: Y,
+      onClick: I,
+      onClickOutside: W,
+      onEnter: $,
+      onMouseLeave: P,
+      onMouseOver: T,
+      updateTeleportedPosition: m
+    };
+  }
+});
+export {
+  G as default
+};

package/dist/index136.js

@@ -1,37 +1,56 @@
-import { defineComponent as r } from "vue";
-import e from "./index40.js";
-const s = r({
-  name: "QProgressBarGroup",
-  components: {
-    QProgressBar: e
-  },
+import { defineComponent as n, computed as r } from "vue";
+const o = n({
+  name: "QProgressBar",
   props: {
     id: {
       type: String,
-      default: "q-progress-bar-group"
-    },
-    items: {
-      type: Array,
-      required: !0
+      default: "q-progress-bar"
     },
-    barColor: {
-      type: String,
-      default: "bg-green-20"
+    bgClass: {
+      type: String
     },
     customClass: {
       type: String,
       default: ""
     },
+    hasContainerBackground: {
+      type: Boolean,
+      default: !1
+    },
     heightClass: {
       type: String,
       default: "h-[0.875rem]"
     },
+    label: {
+      type: String,
+      default: ""
+    },
+    labelClass: {
+      type: [String, Array, Object],
+      default: ""
+    },
+    // Value between 0 and 100
+    percent: {
+      type: Number,
+      required: !0
+    },
     showLabel: {
       type: Boolean,
       default: !0
     }
+  },
+  setup(e) {
+    const a = r(() => e.bgClass || "bg-green-20"), s = r(() => {
+      const t = ["q-progress-bar relative flex items-center", e.customClass, e.heightClass];
+      return e.hasContainerBackground ? [...t, "bg-gray-00"] : t;
+    });
+    return {
+      // Computed
+      barColor: a,
+      containerClasses: s
+    };
   }
 });
 export {
-  s as default
+  o as default
 };