@orchidui/core 0.0.1 → 0.2.0

package/dist/OcOverviewItem-DNr5tWnt.js

@@ -0,0 +1,186 @@
+import { openBlock as i, createElementBlock as s, toDisplayString as l, createCommentVNode as r, createElementVNode as t, normalizeClass as c, Fragment as h, renderList as k, createBlock as g, unref as o, createSlots as u, withCtx as m, renderSlot as f, createVNode as d, createTextVNode as S } from "vue";
+import "dayjs";
+import { T as x } from "./OcComplexCalendar.vue_vue_type_style_index_0_lang-CIQPD-6N.js";
+import { _ as $ } from "./OcOverviewIcon-D702Ujka.js";
+import { _ as p } from "./OcIcon-CJgBICxh.js";
+import { S as w } from "./OcSkeleton-BdPTmGh0.js";
+import "libphonenumber-js";
+/* empty css                                                                  */
+import "v-calendar";
+/* empty css                                                                  */
+import "./Cropper.js";
+import "vue-draggable-next";
+import "@popperjs/core";
+/* empty css                                                                    */
+const B = { class: "flex gap-y-3 flex-col text-lg font-medium" }, b = { key: 0 }, Z = {
+  __name: "OcOverview",
+  props: {
+    title: String,
+    containerClass: String,
+    items: Array,
+    isLoading: Boolean
+  },
+  setup(e) {
+    return (a, y) => (i(), s("div", B, [
+      e.title ? (i(), s("span", b, l(e.title), 1)) : r("", !0),
+      t("div", {
+        class: c(["flex gap-x-5 items-start md:flex-row flex-col gap-y-3 md:gap-y-0", e.containerClass])
+      }, [
+        (i(!0), s(h, null, k(e.items, (n, v) => (i(), g(o(D), {
+          key: v,
+          title: n.title,
+          class: c(["flex-1", n.class]),
+          variant: n.variant,
+          tooltip: n.tooltip,
+          icon: n.icon,
+          "is-loading": e.isLoading,
+          content: n.content,
+          info: n.info,
+          "icon-height": n.iconHeight,
+          "icon-width": n.iconWidth
+        }, u({ _: 2 }, [
+          n.isWarning ? {
+            name: "warning",
+            fn: m(() => [
+              f(a.$slots, "warning")
+            ]),
+            key: "0"
+          } : void 0
+        ]), 1032, ["title", "class", "variant", "tooltip", "icon", "is-loading", "content", "info", "icon-height", "icon-width"]))), 128))
+      ], 2)
+    ]));
+  }
+}, V = {
+  key: 0,
+  class: "flex flex-col gap-y-3 min-w-[132px]"
+}, T = { class: "flex flex-col gap-y-px font-medium overflow-hidden" }, C = { class: "flex whitespace-nowrap items-start gap-x-3 text-xs text-oc-text-300" }, N = { class: "uppercase" }, L = { class: "px-3 bg-white text-center w-[175px] rounded py-2 text-oc-text-400 whitespace-break-spaces font-medium" }, O = { class: "flex items-center gap-x-2 overflow-hidden" }, W = {
+  key: 0,
+  class: "flex items-center gap-x-3 overflow-hidden"
+}, H = { class: "truncate" }, E = { class: "flex items-center gap-x-1" }, z = { class: "text-oc-text-400 text-sm font-medium cursor-default" }, A = { class: "px-3 bg-white text-center w-[175px] rounded py-2 text-oc-text-400 whitespace-break-spaces font-medium text-sm" }, D = {
+  __name: "OcOverviewItem",
+  props: {
+    icon: String,
+    variant: String,
+    title: String,
+    tooltip: String,
+    percentTooltip: String,
+    content: String,
+    info: Boolean,
+    isBig: Boolean,
+    isTransparent: Boolean,
+    isCard: Boolean,
+    isLoading: Boolean,
+    percentValue: Number,
+    iconWidth: {
+      type: String,
+      default: "22"
+    },
+    iconHeight: {
+      type: String,
+      default: "22"
+    }
+  },
+  setup(e) {
+    return (a, y) => (i(), s("div", {
+      class: c([e.isTransparent ? "p-3" : "border p-4 bg-oc-bg-light border-oc-gray-200 ", "flex flex-col gap-y-4 md:overflow-hidden w-full md:w-auto rounded"])
+    }, [
+      e.isLoading ? (i(), s("div", V, [
+        d(o(w), { class: "w-[80%] h-[14px] rounded-sm" }),
+        d(o(w), { class: "w-full h-[20px] rounded-sm" })
+      ])) : (i(), s(h, { key: 1 }, [
+        t("div", {
+          class: c(["flex items-center", e.isBig ? "gap-x-[.75rem]" : "gap-x-3"])
+        }, [
+          e.icon ? (i(), g(o($), {
+            key: 0,
+            icon: e.icon,
+            variant: e.variant,
+            height: e.iconHeight,
+            width: e.iconWidth
+          }, null, 8, ["icon", "variant", "height", "width"])) : r("", !0),
+          t("div", T, [
+            t("div", C, [
+              f(a.$slots, "title", {}, () => [
+                t("span", N, l(e.title), 1)
+              ]),
+              d(o(x), {
+                position: "top",
+                "popper-options": { strategy: "fixed" },
+                "popper-class": "rounded-sm"
+              }, u({
+                default: m(() => [
+                  e.info ? (i(), g(o(p), {
+                    key: 0,
+                    width: "16",
+                    height: "16",
+                    class: "text-oc-text-400",
+                    name: "information"
+                  })) : r("", !0)
+                ]),
+                _: 2
+              }, [
+                e.tooltip ? {
+                  name: "popper",
+                  fn: m(() => [
+                    t("div", L, l(e.tooltip), 1)
+                  ]),
+                  key: "0"
+                } : void 0
+              ]), 1024)
+            ]),
+            t("div", O, [
+              e.isCard ? (i(), g(o(p), {
+                key: 0,
+                width: "35",
+                name: "payment-methods/visa"
+              })) : r("", !0),
+              t("span", {
+                class: c([e.isBig ? "text-xl" : "", "truncate"])
+              }, [
+                f(a.$slots, "content", {}, () => [
+                  isNaN(e.percentValue) ? (i(), s(h, { key: 1 }, [
+                    S(l(e.content), 1)
+                  ], 64)) : (i(), s("div", W, [
+                    t("div", H, l(e.content), 1),
+                    d(o(x), {
+                      position: "top",
+                      "popper-class": "rounded-sm",
+                      "popper-options": { strategy: "fixed" }
+                    }, u({
+                      default: m(() => [
+                        t("div", E, [
+                          d(o(p), {
+                            name: e.percentValue >= 0 ? "triangle-up" : "triangle-down",
+                            class: c(e.percentValue >= 0 ? "text-oc-success-500" : "text-oc-error-500"),
+                            width: "10",
+                            height: "9"
+                          }, null, 8, ["name", "class"]),
+                          t("span", z, l(e.percentValue === 0 ? "-" : `${Math.abs(e.percentValue)}%`), 1)
+                        ])
+                      ]),
+                      _: 2
+                    }, [
+                      e.percentTooltip ? {
+                        name: "popper",
+                        fn: m(() => [
+                          t("div", A, l(e.percentTooltip), 1)
+                        ]),
+                        key: "0"
+                      } : void 0
+                    ]), 1024)
+                  ]))
+                ])
+              ], 2)
+            ]),
+            a.$slots.transfer ? f(a.$slots, "transfer", { key: 0 }) : r("", !0)
+          ])
+        ], 2),
+        a.$slots.warning ? f(a.$slots, "warning", { key: 0 }) : r("", !0)
+      ], 64))
+    ], 2));
+  }
+};
+export {
+  Z as _,
+  D as a
+};

package/dist/OcPageTitleRight-DMtJ1qmZ.js

@@ -0,0 +1,243 @@
+import { defineComponent as V, ref as k, openBlock as o, createElementBlock as u, createElementVNode as m, toDisplayString as b, createBlock as r, unref as e, mergeProps as d, withCtx as i, createVNode as l, withModifiers as j, createCommentVNode as n, Fragment as v, renderList as w, renderSlot as f, normalizeClass as z, createSlots as S } from "vue";
+import { a as T } from "./OcPrimaryActions-D5IprKsQ.js";
+import "dayjs";
+import { B, D as O, T as M } from "./OcComplexCalendar.vue_vue_type_style_index_0_lang-CIQPD-6N.js";
+import { _ as g } from "./OcIcon-CJgBICxh.js";
+import { _ as D } from "./OcChip-B1hm2Qni.js";
+/* empty css                                                                    */
+import "libphonenumber-js";
+/* empty css                                                                  */
+import "v-calendar";
+/* empty css                                                                  */
+import "./Cropper.js";
+import "vue-draggable-next";
+import { _ as x } from "./OcDropdownItem-DAElmzEu.js";
+import "@popperjs/core";
+import { _ as N } from "./OcCopyTooltip.vue_vue_type_script_setup_true_lang-S2RAfV_g.js";
+import { _ as E } from "./_plugin-vue_export-helper-CHgC5LLL.js";
+import { useWindowWidth as I } from "./composables/useWindowWidth.js";
+const R = { class: "flex flex-col gap-y-3" }, U = { class: "flex items-center justify-between gap-x-3" }, W = { class: "text-xl leading-[24px] font-medium" }, q = {
+  key: 0,
+  class: "flex gap-x-6 text-sm text-oc-text-400 py-4 whitespace-nowrap items-center"
+}, F = { class: "overflow-hidden text-ellipsis" }, L = /* @__PURE__ */ V({
+  __name: "OcMobilePageTitle",
+  props: {
+    title: { type: String },
+    description: { type: String },
+    primaryButtonProps: Object,
+    chipProps: Object,
+    secondaryButtonProps: Object
+  },
+  setup(t) {
+    const s = k(!1);
+    return (c, a) => (o(), u("div", R, [
+      m("div", U, [
+        m("span", W, b(t.title), 1),
+        t.primaryButtonProps || t.secondaryButtonProps ? (o(), r(e(B), d({
+          key: 0,
+          size: "small"
+        }, t.primaryButtonProps, { "is-additional-area": "" }), {
+          "additional-content": i(() => [
+            l(e(O), {
+              modelValue: s.value,
+              "onUpdate:modelValue": a[0] || (a[0] = (p) => s.value = p),
+              onClick: a[1] || (a[1] = j(() => {
+              }, ["stop"]))
+            }, {
+              menu: i(() => {
+                var p, h;
+                return [
+                  t.secondaryButtonProps ? (o(), r(e(x), {
+                    key: 0,
+                    text: (p = t.secondaryButtonProps) == null ? void 0 : p.label,
+                    icon: (h = t.secondaryButtonProps) == null ? void 0 : h.leftIcon
+                  }, null, 8, ["text", "icon"])) : n("", !0),
+                  t.secondaryButtonProps && t.secondaryButtonProps.dropdownOptions ? (o(!0), u(v, { key: 1 }, w(t.secondaryButtonProps.dropdownOptions, (y) => (o(), r(e(x), d({
+                    key: y.text,
+                    ref_for: !0
+                  }, y), null, 16))), 128)) : n("", !0)
+                ];
+              }),
+              default: i(() => [
+                l(e(g), {
+                  width: "16",
+                  height: "16",
+                  class: "mx-auto",
+                  name: "chevron-down"
+                })
+              ]),
+              _: 1
+            }, 8, ["modelValue"])
+          ]),
+          _: 1
+        }, 16)) : n("", !0)
+      ]),
+      t.description ? (o(), u("div", q, [
+        m("span", F, b(t.description), 1),
+        l(e(N), {
+          class: "shrink-0",
+          value: t.description
+        }, {
+          default: i(() => [
+            l(e(g), {
+              width: "16",
+              height: "16",
+              class: "cursor-pointer",
+              name: "copy"
+            })
+          ]),
+          _: 1
+        }, 8, ["value"])
+      ])) : n("", !0),
+      f(c.$slots, "mobile-amount"),
+      t.chipProps ? (o(), r(e(D), d({ key: 1 }, t.chipProps, { class: "self-start" }), null, 16)) : n("", !0)
+    ]));
+  }
+}), A = { class: "md:pb-5 pb-4 flex flex-col" }, G = { class: "flex flex-col gap-y-3 pt-4 md:pt-5 px-5 md:px-10" }, ft = {
+  __name: "OcPageTitle",
+  props: {
+    title: { type: String, required: !0 },
+    description: { type: String, default: "" },
+    titleClass: { type: String, default: "" },
+    copyValue: { type: String, default: "" },
+    primaryButtonProps: Object,
+    secondaryButtonProps: Object,
+    tooltipOptions: Object,
+    chipProps: Object,
+    isCopy: Boolean,
+    isBack: { type: Boolean, default: !1 },
+    isMobileCombineButtons: { type: Boolean, default: !1 }
+  },
+  emits: {
+    changeTab: [],
+    back: []
+  },
+  setup(t) {
+    return (s, c) => (o(), u("div", A, [
+      m("div", G, [
+        t.isBack ? (o(), r(e(B), {
+          key: 0,
+          size: "small",
+          "icon-class": "rotate-90",
+          variant: "secondary",
+          "is-transparent": "",
+          label: "Back",
+          "left-icon": "chevron-down",
+          class: "self-start",
+          onClick: c[0] || (c[0] = (a) => s.$emit("back"))
+        })) : n("", !0),
+        m("div", {
+          class: z(["w-full gap-5", [t.isMobileCombineButtons ? "hidden md:flex" : "flex", t.titleClass]])
+        }, [
+          l(T, {
+            title: t.title,
+            description: t.description,
+            "chip-props": t.chipProps,
+            "copy-value": t.copyValue,
+            "tooltip-options": t.tooltipOptions,
+            "is-copy": t.isCopy,
+            class: "flex-1"
+          }, S({ _: 2 }, [
+            s.$slots.title ? {
+              name: "title",
+              fn: i(() => [
+                f(s.$slots, "title")
+              ]),
+              key: "0"
+            } : void 0,
+            s.$slots.description ? {
+              name: "description",
+              fn: i(() => [
+                f(s.$slots, "description")
+              ]),
+              key: "1"
+            } : void 0
+          ]), 1032, ["title", "description", "chip-props", "copy-value", "tooltip-options", "is-copy"]),
+          f(s.$slots, "right", {}, () => [
+            l(e(X), {
+              class: "shrink-0",
+              "primary-button-props": t.primaryButtonProps,
+              "secondary-button-props": t.secondaryButtonProps
+            }, null, 8, ["primary-button-props", "secondary-button-props"])
+          ])
+        ], 2),
+        t.isMobileCombineButtons ? (o(), r(L, {
+          key: 1,
+          "secondary-button-props": t.secondaryButtonProps,
+          "primary-button-props": t.primaryButtonProps,
+          description: t.description,
+          "chip-props": t.chipProps,
+          title: t.title,
+          class: "md:hidden"
+        }, {
+          "mobile-amount": i(() => [
+            f(s.$slots, "mobile-amount")
+          ]),
+          _: 3
+        }, 8, ["secondary-button-props", "primary-button-props", "description", "chip-props", "title"])) : n("", !0)
+      ])
+    ]));
+  }
+}, H = { class: "flex gap-x-3 items-center" }, J = {
+  key: 0,
+  class: "p-2"
+}, K = { class: "px-3 py-[5px] whitespace-nowrap font-medium text-sm text-oc-text-400 flex gap-x-3 items-center" }, Q = {
+  __name: "OcPageTitleRight",
+  props: {
+    primaryButtonProps: Object,
+    secondaryButtonProps: Object
+  },
+  setup(t) {
+    var p;
+    const c = k(((p = t.secondaryButtonProps) == null ? void 0 : p.isDropdownOpened) ?? !1), { isMobile: a } = I();
+    return (h, y) => (o(), u("div", H, [
+      t.secondaryButtonProps ? (o(), r(e(O), {
+        key: 0,
+        modelValue: c.value,
+        "onUpdate:modelValue": y[0] || (y[0] = (P) => c.value = P),
+        distance: 10
+      }, {
+        menu: i(() => {
+          var P;
+          return [
+            (P = t.secondaryButtonProps) != null && P.dropdownOptions ? (o(), u("div", J, [
+              (o(!0), u(v, null, w(t.secondaryButtonProps.dropdownOptions, ($, C) => (o(), r(e(x), d({
+                key: C,
+                ref_for: !0
+              }, $), null, 16))), 128))
+            ])) : n("", !0)
+          ];
+        }),
+        default: i(() => [
+          l(e(B), d({
+            size: e(a) ? "small" : "default"
+          }, t.secondaryButtonProps), null, 16, ["size"])
+        ]),
+        _: 1
+      }, 8, ["modelValue"])) : n("", !0),
+      t.primaryButtonProps && t.primaryButtonProps.tooltip ? (o(), r(e(M), {
+        key: 1,
+        position: "top",
+        distance: 4,
+        "arrow-hidden": ""
+      }, {
+        popper: i(() => [
+          m("div", K, b(t.primaryButtonProps.tooltip), 1)
+        ]),
+        default: i(() => [
+          l(e(B), d({
+            size: e(a) ? "small" : "default"
+          }, t.primaryButtonProps), null, 16, ["size"])
+        ]),
+        _: 1
+      })) : t.primaryButtonProps ? (o(), r(e(B), d({
+        key: 2,
+        size: e(a) ? "small" : "default"
+      }, t.primaryButtonProps), null, 16, ["size"])) : n("", !0)
+    ]));
+  }
+}, X = /* @__PURE__ */ E(Q, [["__scopeId", "data-v-a7abfe33"]]);
+export {
+  X as P,
+  ft as _
+};

package/dist/OcPaginationNumber-IKPorX26.js

@@ -0,0 +1,172 @@
+import { computed as g, openBlock as d, createElementBlock as s, createElementVNode as u, createVNode as r, unref as n, Fragment as h, renderList as z, createBlock as y, withCtx as v, createTextVNode as c, toDisplayString as x, normalizeClass as f, renderSlot as N } from "vue";
+import "dayjs";
+import "./OcComplexCalendar.vue_vue_type_style_index_0_lang-CIQPD-6N.js";
+import { _ as P } from "./OcIcon-CJgBICxh.js";
+/* empty css                                                                    */
+import "libphonenumber-js";
+/* empty css                                                                  */
+import "v-calendar";
+/* empty css                                                                  */
+import "./Cropper.js";
+import "vue-draggable-next";
+import "@popperjs/core";
+const $ = { class: "w-full items-center flex relative" }, w = { class: "flex items-center gap-x-6" }, k = { class: "hidden md:flex items-center gap-x-3" }, B = { class: "md:hidden mx-[30px]" }, T = {
+  __name: "OcPagination",
+  props: {
+    maxPage: {
+      type: [String, Number],
+      default: 1
+    },
+    totalVisible: {
+      type: [String, Number],
+      default: 1,
+      validator: (e) => Number(e)
+    },
+    modelValue: {
+      type: [String, Number],
+      default: 1
+    },
+    isRounded: Boolean,
+    size: String
+  },
+  emits: {
+    "update:modelValue": []
+  },
+  setup(e) {
+    const a = e, m = g(() => {
+      let t = Number(a.totalVisible);
+      if (t <= 3 && a.maxPage > t && (t = 3), a.maxPage <= t)
+        return Array.from({ length: a.maxPage }, (l, i) => 1 + i);
+      if (a.modelValue <= t - 1)
+        return [
+          ...Array.from({ length: Math.min(t - 1, a.maxPage) }, (l, i) => i + 1),
+          "...",
+          a.maxPage
+        ];
+      if (a.modelValue >= a.maxPage - (t - 2))
+        return [
+          1,
+          "...",
+          ...Array.from(
+            { length: t - 1 },
+            (l, i) => a.maxPage - (t - 2) + i
+          )
+        ];
+      const o = a.modelValue - Math.floor((t - 2) / 2);
+      return [
+        1,
+        "...",
+        ...Array.from({ length: t - 2 }, (l, i) => o + i),
+        "...",
+        a.maxPage
+      ];
+    });
+    return (t, o) => (d(), s("div", $, [
+      u("div", w, [
+        r(n(V), {
+          disabled: e.modelValue <= 1,
+          size: e.size,
+          onClick: o[0] || (o[0] = (l) => e.modelValue > 1 ? t.$emit("update:modelValue", e.modelValue > 1 ? e.modelValue - 1 : e.modelValue) : "")
+        }, null, 8, ["disabled", "size"]),
+        u("div", k, [
+          (d(!0), s(h, null, z(m.value, (l) => (d(), y(n(b), {
+            key: l,
+            size: e.size,
+            "is-rounded": e.isRounded,
+            active: l === e.modelValue,
+            onClick: (i) => t.$emit("update:modelValue", l === "..." ? e.modelValue : l)
+          }, {
+            default: v(() => [
+              c(x(l), 1)
+            ]),
+            _: 2
+          }, 1032, ["size", "is-rounded", "active", "onClick"]))), 128))
+        ]),
+        u("div", B, [
+          r(n(b), {
+            size: e.size,
+            "is-rounded": e.isRounded,
+            active: !0
+          }, {
+            default: v(() => [
+              c(x(e.modelValue), 1)
+            ]),
+            _: 1
+          }, 8, ["size", "is-rounded"])
+        ]),
+        r(n(V), {
+          "is-next": "",
+          size: e.size,
+          disabled: e.modelValue >= e.maxPage,
+          onClick: o[1] || (o[1] = (l) => e.modelValue < e.maxPage ? t.$emit(
+            "update:modelValue",
+            e.modelValue < Number(e.maxPage) ? e.modelValue + 1 : Number(e.maxPage)
+          ) : "")
+        }, null, 8, ["size", "disabled"])
+      ])
+    ]));
+  }
+}, V = {
+  __name: "OcPrevNext",
+  props: {
+    disabled: Boolean,
+    isNext: Boolean,
+    size: {
+      type: String,
+      default: "default"
+    }
+  },
+  setup(e) {
+    const a = g(() => ({
+      default: "px-1 py-3",
+      small: "py-2 text-sm",
+      big: "px-2 py-4 text-lg"
+    }));
+    return (m, t) => (d(), s("div", {
+      class: f(["flex text-oc-text-400 items-center gap-x-1", [
+        a.value[e.size],
+        e.disabled ? "cursor-not-allowed opacity-60" : "hover:text-oc-text cursor-pointer",
+        e.isNext ? "flex-row-reverse" : ""
+      ]])
+    }, [
+      r(n(P), {
+        width: "14",
+        height: "14",
+        class: f(e.isNext ? "-rotate-90" : "rotate-90"),
+        name: "chevron-down"
+      }, null, 8, ["class"]),
+      c(" " + x(e.isNext ? "Next" : "Prev"), 1)
+    ], 2));
+  }
+}, b = {
+  __name: "OcPaginationNumber",
+  props: {
+    active: Boolean,
+    isRounded: Boolean,
+    size: {
+      type: String,
+      default: "default"
+    }
+  },
+  setup(e) {
+    const a = g(() => ({
+      default: "w-[36px]  h-[36px]",
+      small: "w-[32px] text-sm h-[32px]",
+      big: "w-[40px] text-lg h-[40px]"
+    }));
+    return (m, t) => (d(), s("div", {
+      class: f(["flex items-center justify-center cursor-pointer py-3 px-1", [
+        a.value[e.size],
+        e.active ? "bg-oc-gray-100 text-oc-text" : "text-oc-text-400 hover:text-oc-text hover:bg-oc-gray-50",
+        e.isRounded ? "rounded-full" : "rounded-sm"
+      ]])
+    }, [
+      N(m.$slots, "default")
+    ], 2));
+  }
+};
+export {
+  T as _,
+  V as a,
+  b
+};