treqit-ui-library 1.4.6 → 1.4.8

package/dist/treqit-ui-library.css

@@ -1 +1 @@
-.btn[data-v-8db92d47]{position:relative;display:inline-flex;align-items:center;justify-content:center;border:none;font-weight:700;cursor:pointer;transition:background-color .2s ease,color .2s ease,box-shadow .2s ease;padding:.5rem 1rem;font-size:1rem;min-width:80px;overflow:hidden}.btn[data-v-8db92d47]:disabled{cursor:not-allowed}.btn--full[data-v-8db92d47]{width:100%}.btn-loader[data-v-8db92d47]{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;align-items:center;justify-content:center}.simple-spinner[data-v-8db92d47]{border:6px solid currentColor;border-top-color:transparent;border-radius:50%;width:32px;height:32px;animation:spin-8db92d47 .8s linear infinite;opacity:.7}@keyframes spin-8db92d47{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.btn-content.content-hidden[data-v-8db92d47]{visibility:hidden;opacity:0}.btn--x-large[data-v-8db92d47]{scrollbar-width:1.125rem;height:60px;font-size:1.35rem;min-width:92px;padding:0 24px;border-radius:12px}.btn--small[data-v-8db92d47]{padding:.25rem .75rem;font-size:.875rem;border-radius:5px!important}.btn--medium[data-v-8db92d47]{padding:.5rem 1rem;font-size:1rem;border-radius:8px!important}.btn--large[data-v-8db92d47]{padding:.75rem 1.5rem;font-size:1.125rem;border-radius:8px!important}.btn--primary[data-v-8db92d47]{background-color:var(--btn-primary-bg);color:#fff;box-shadow:0 1px 3px #0000001a,0 1px 2px -1px #0000001a}.btn--primary[data-v-8db92d47]:not(:disabled):hover{background-color:var(--btn-primary-hover-bg);box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -2px #0000001a}.btn--secondary[data-v-8db92d47]{background-color:var(--btn-secondary-bg);color:#1a202c;box-shadow:0 1px 3px #0000001a,0 1px 2px -1px #0000001a;border:2px solid var(--secondary-color, #3C464D)}.btn--secondary[data-v-8db92d47]:not(:disabled):hover{background-color:var(--btn-secondary-hover-bg);box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -2px #0000001a}.btn--destructive[data-v-8db92d47]{background-color:#ef4444;color:#fff;box-shadow:0 1px 3px #0000001a,0 1px 2px -1px #0000001a}.btn--destructive[data-v-8db92d47]:not(:disabled):hover{background-color:#dc2626}.btn--outlined[data-v-8db92d47]{background-color:transparent;color:var(--btn-secondary-bg);border:2px solid var(--btn-secondary-bg);box-shadow:none}.btn--outlined[data-v-8db92d47]:not(:disabled):hover{background-color:var(--btn-primary-bg);color:#fff}.btn--outlined-primary[data-v-8db92d47]{background-color:transparent;color:var(--btn-primary-bg);border:2px solid var(--btn-primary-bg);box-shadow:none}.btn--outlined-primary[data-v-8db92d47]:not(:disabled):hover{background-color:var(--btn-primary-bg);color:#fff}.btn--outlined-secondary[data-v-8db92d47]{background-color:#fff;color:var(--secondary-color, #3C464D);border:2px solid var(--secondary-color, #3C464D);box-shadow:none}.btn--outlined-secondary[data-v-8db92d47]:not(:disabled):hover{background-color:var(--secondary-color, #3C464D);color:#fff;border-color:#fff}.btn--elevated[data-v-8db92d47]{background-color:var(--btn-primary-bg);color:#fff;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -2px #0000001a}.btn--elevated[data-v-8db92d47]:not(:disabled):hover{background-color:var(--btn-primary-hover-bg);box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a}.btn--flat[data-v-8db92d47]{background-color:#fff;color:var(--btn-primary-bg);box-shadow:none}.btn--flat[data-v-8db92d47]:not(:disabled):hover{background-color:var(--btn-primary-hover-bg);color:#fff}.btn--text[data-v-8db92d47]{background-color:#fff;color:var(--btn-primary-bg);box-shadow:none}.btn--text[data-v-8db92d47]:not(:disabled):hover{background-color:#f0f0f0}.btn--rounded[data-v-8db92d47]{background-color:transparent;color:var(--secondary-color, #3C464D);border:2px solid var(--secondary-color, #3C464D);box-shadow:none;border-radius:50%!important;padding:.5rem;min-width:auto}@media screen and (max-width:768px){.btn--small[data-v-8db92d47]{padding:.2rem .6rem;font-size:.8rem}.btn--medium[data-v-8db92d47]{padding:.4rem .8rem;font-size:.9rem}.btn--large[data-v-8db92d47]{padding:.6rem 1.2rem;font-size:1rem}.btn--rounded[data-v-8db92d47]{padding:.3rem;font-size:.8rem;max-width:30px;max-height:30px}}
+.btn[data-v-8db92d47]{position:relative;display:inline-flex;align-items:center;justify-content:center;border:none;font-weight:700;cursor:pointer;transition:background-color .2s ease,color .2s ease,box-shadow .2s ease;padding:.5rem 1rem;font-size:1rem;min-width:80px;overflow:hidden}.btn[data-v-8db92d47]:disabled{cursor:not-allowed}.btn--full[data-v-8db92d47]{width:100%}.btn-loader[data-v-8db92d47]{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;align-items:center;justify-content:center}.simple-spinner[data-v-8db92d47]{border:6px solid currentColor;border-top-color:transparent;border-radius:50%;width:32px;height:32px;animation:spin-8db92d47 .8s linear infinite;opacity:.7}@keyframes spin-8db92d47{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.btn-content.content-hidden[data-v-8db92d47]{visibility:hidden;opacity:0}.btn--x-large[data-v-8db92d47]{scrollbar-width:1.125rem;height:60px;font-size:1.35rem;min-width:92px;padding:0 24px;border-radius:12px}.btn--small[data-v-8db92d47]{padding:.25rem .75rem;font-size:.875rem;border-radius:5px!important}.btn--medium[data-v-8db92d47]{padding:.5rem 1rem;font-size:1rem;border-radius:8px!important}.btn--large[data-v-8db92d47]{padding:.75rem 1.5rem;font-size:1.125rem;border-radius:8px!important}.btn--primary[data-v-8db92d47]{background-color:var(--btn-primary-bg);color:#fff;box-shadow:0 1px 3px #0000001a,0 1px 2px -1px #0000001a}.btn--primary[data-v-8db92d47]:not(:disabled):hover{background-color:var(--btn-primary-hover-bg);box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -2px #0000001a}.btn--secondary[data-v-8db92d47]{background-color:var(--btn-secondary-bg);color:#1a202c;box-shadow:0 1px 3px #0000001a,0 1px 2px -1px #0000001a;border:2px solid var(--secondary-color, #3C464D)}.btn--secondary[data-v-8db92d47]:not(:disabled):hover{background-color:var(--btn-secondary-hover-bg);box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -2px #0000001a}.btn--destructive[data-v-8db92d47]{background-color:#ef4444;color:#fff;box-shadow:0 1px 3px #0000001a,0 1px 2px -1px #0000001a}.btn--destructive[data-v-8db92d47]:not(:disabled):hover{background-color:#dc2626}.btn--outlined[data-v-8db92d47]{background-color:transparent;color:var(--btn-secondary-bg);border:2px solid var(--btn-secondary-bg);box-shadow:none}.btn--outlined[data-v-8db92d47]:not(:disabled):hover{background-color:var(--btn-primary-bg);color:#fff}.btn--outlined-primary[data-v-8db92d47]{background-color:transparent;color:var(--btn-primary-bg);border:2px solid var(--btn-primary-bg);box-shadow:none}.btn--outlined-primary[data-v-8db92d47]:not(:disabled):hover{background-color:var(--btn-primary-bg);color:#fff}.btn--outlined-secondary[data-v-8db92d47]{background-color:#fff;color:var(--secondary-color, #3C464D);border:2px solid var(--secondary-color, #3C464D);box-shadow:none}.btn--outlined-secondary[data-v-8db92d47]:not(:disabled):hover{background-color:var(--secondary-color, #3C464D);color:#fff;border-color:#fff}.btn--elevated[data-v-8db92d47]{background-color:var(--btn-primary-bg);color:#fff;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -2px #0000001a}.btn--elevated[data-v-8db92d47]:not(:disabled):hover{background-color:var(--btn-primary-hover-bg);box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a}.btn--flat[data-v-8db92d47]{background-color:#fff;color:var(--btn-primary-bg);box-shadow:none}.btn--flat[data-v-8db92d47]:not(:disabled):hover{background-color:var(--btn-primary-hover-bg);color:#fff}.btn--text[data-v-8db92d47]{background-color:#fff;color:var(--btn-primary-bg);box-shadow:none}.btn--text[data-v-8db92d47]:not(:disabled):hover{background-color:#f0f0f0}.btn--rounded[data-v-8db92d47]{background-color:transparent;color:var(--secondary-color, #3C464D);border:2px solid var(--secondary-color, #3C464D);box-shadow:none;border-radius:50%!important;padding:.5rem;min-width:auto}@media screen and (max-width:768px){.btn--small[data-v-8db92d47]{padding:.2rem .6rem;font-size:.8rem}.btn--medium[data-v-8db92d47]{padding:.4rem .8rem;font-size:.9rem}.btn--large[data-v-8db92d47]{padding:.6rem 1.2rem;font-size:1rem}.btn--rounded[data-v-8db92d47]{padding:.3rem;font-size:.8rem;max-width:30px;max-height:30px}}.overlay[data-v-11b69f56]{position:fixed;inset:0;background-color:#0000004d;display:flex;justify-content:center;align-items:center;z-index:1000}.overlay--contained[data-v-11b69f56]{position:absolute}.overlay-fade-enter-active[data-v-11b69f56],.overlay-fade-leave-active[data-v-11b69f56]{transition:opacity .3s ease}.overlay-fade-enter-from[data-v-11b69f56],.overlay-fade-leave-to[data-v-11b69f56]{opacity:0}.icon[data-v-4a07735a]{display:inline-block;font-feature-settings:"liga";height:1em;justify-content:center;letter-spacing:normal;line-height:1;min-width:1em;position:relative;text-align:center;text-indent:0;-webkit-user-select:none;-moz-user-select:none;user-select:none;vertical-align:middle;width:1em;margin:5px}

package/dist/treqit-ui-library.js

@@ -1,26 +1,26 @@
-import { computed as u, createElementBlock as a, openBlock as d, normalizeClass as s, createCommentVNode as c, createElementVNode as i, renderSlot as m } from "vue";
-const f = (t, e) => {
-  const l = t.__vccOpts || t;
-  for (const [o, n] of e)
-    l[o] = n;
-  return l;
-}, p = ["type", "disabled"], y = {
+import { computed as c, createElementBlock as d, openBlock as s, normalizeClass as r, createCommentVNode as f, createElementVNode as m, renderSlot as y, watch as p, createBlock as v, Transition as b, withCtx as g, withModifiers as z, normalizeStyle as _ } from "vue";
+const u = (e, t) => {
+  const n = e.__vccOpts || e;
+  for (const [o, l] of t)
+    n[o] = l;
+  return n;
+}, B = ["type", "disabled"], k = {
   key: 0,
   class: "btn-loader"
-}, b = {
+}, S = {
   __name: "Button",
   props: {
     variant: {
       type: String,
       default: "primary",
       // 'primary', 'secondary', 'destructive'
-      validator: (t) => ["primary", "secondary", "destructive", "flat", "elevated", "text", "outlined", "outlined-primary", "outlined-secondary", "rounded"].includes(t)
+      validator: (e) => ["primary", "secondary", "destructive", "flat", "elevated", "text", "outlined", "outlined-primary", "outlined-secondary", "rounded"].includes(e)
     },
     size: {
       type: String,
       default: "medium",
       // 'small', 'medium', 'large'
-      validator: (t) => ["sm", "small", "medium", "large", "x-large"].includes(t)
+      validator: (e) => ["sm", "small", "medium", "large", "x-large"].includes(e)
     },
     type: {
       type: String,
@@ -40,37 +40,109 @@ const f = (t, e) => {
     }
   },
   emits: ["click"],
-  setup(t) {
-    const e = t, l = u(() => [
+  setup(e) {
+    const t = e, n = c(() => [
       "btn",
-      `btn--${e.variant}`,
-      `btn--${e.size === "sm" ? "small" : e.size}`,
+      `btn--${t.variant}`,
+      `btn--${t.size === "sm" ? "small" : t.size}`,
       {
-        "btn--loading": e.loading,
-        "btn--full": e.full
+        "btn--loading": t.loading,
+        "btn--full": t.full
       }
     ]);
-    return (o, n) => (d(), a("button", {
-      type: t.type,
-      class: s(l.value),
-      disabled: t.disabled || t.loading,
-      onClick: n[0] || (n[0] = (g) => o.$emit("click"))
+    return (o, l) => (s(), d("button", {
+      type: e.type,
+      class: r(n.value),
+      disabled: e.disabled || e.loading,
+      onClick: l[0] || (l[0] = (a) => o.$emit("click"))
     }, [
-      t.loading ? (d(), a("div", y, [...n[1] || (n[1] = [
-        i("div", { class: "simple-spinner" }, null, -1)
-      ])])) : c("", !0),
-      i("span", {
-        class: s(["btn-content", { "content-hidden": t.loading }])
+      e.loading ? (s(), d("div", k, [...l[1] || (l[1] = [
+        m("div", { class: "simple-spinner" }, null, -1)
+      ])])) : f("", !0),
+      m("span", {
+        class: r(["btn-content", { "content-hidden": e.loading }])
       }, [
-        m(o.$slots, "default", {}, void 0, !0)
+        y(o.$slots, "default", {}, void 0, !0)
       ], 2)
-    ], 10, p));
+    ], 10, B));
   }
-}, r = /* @__PURE__ */ f(b, [["__scopeId", "data-v-8db92d47"]]), v = (t) => {
-  t.component("TreqitButton", r), t.component("Button", r);
-}, k = { install: v };
+}, x = /* @__PURE__ */ u(S, [["__scopeId", "data-v-8db92d47"]]), $ = {
+  __name: "Overlay",
+  props: {
+    modelValue: {
+      type: Boolean,
+      default: !1
+    },
+    contained: {
+      type: Boolean,
+      default: !1
+    }
+  },
+  emits: ["update:modelValue"],
+  setup(e, { emit: t }) {
+    const n = e, o = t;
+    function l() {
+      o("update:modelValue", !1);
+    }
+    return p(() => n.modelValue, (a) => {
+      !n.contained && typeof document < "u" && (document.body.style.overflow = a ? "hidden" : "");
+    }), (a, i) => (s(), v(b, { name: "overlay-fade" }, {
+      default: g(() => [
+        e.modelValue ? (s(), d("div", {
+          key: 0,
+          class: r(["overlay", { "overlay--contained": e.contained }]),
+          onClick: z(l, ["self"])
+        }, [
+          y(a.$slots, "default", {}, void 0, !0)
+        ], 2)) : f("", !0)
+      ]),
+      _: 3
+    }));
+  }
+}, V = /* @__PURE__ */ u($, [["__scopeId", "data-v-11b69f56"]]), h = {
+  __name: "Icon",
+  props: {
+    icon: {
+      type: String,
+      required: !1
+    },
+    size: {
+      type: [String, Number],
+      default: 24
+    },
+    color: {
+      type: String,
+      default: null
+    }
+  },
+  setup(e) {
+    const t = e, n = {
+      "x-small": 12,
+      small: 16,
+      medium: 24,
+      large: 32,
+      "x-large": 40
+    }, o = c(() => t.icon ? ["icon", "mdi", t.icon] : ["icon"]), l = c(() => {
+      let a = t.size;
+      typeof t.size == "string" && n[t.size] && (a = n[t.size]);
+      const i = {
+        fontSize: `${a}px`
+      };
+      return t.color && (i.color = t.color), i;
+    });
+    return (a, i) => (s(), d("i", {
+      class: r(o.value),
+      style: _(l.value),
+      "aria-hidden": "true"
+    }, null, 6));
+  }
+}, C = /* @__PURE__ */ u(h, [["__scopeId", "data-v-4a07735a"]]), I = (e) => {
+  e.component("Overlay", V), e.component("Button", x), e.component("Icon", C);
+}, w = { install: I };
 export {
-  r as Button,
-  k as default,
-  v as install
+  x as Button,
+  C as Icon,
+  V as Overlay,
+  w as default,
+  I as install
 };

package/dist/treqit-ui-library.umd.cjs

@@ -1 +1 @@
-(function(n,t){typeof exports=="object"&&typeof module<"u"?t(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],t):(n=typeof globalThis<"u"?globalThis:n||self,t(n.TreqitUiLibrary={},n.Vue))})(this,(function(n,t){"use strict";const r=(e,l)=>{const i=e.__vccOpts||e;for(const[d,o]of l)i[d]=o;return i},u=["type","disabled"],c={key:0,class:"btn-loader"},a=r({__name:"Button",props:{variant:{type:String,default:"primary",validator:e=>["primary","secondary","destructive","flat","elevated","text","outlined","outlined-primary","outlined-secondary","rounded"].includes(e)},size:{type:String,default:"medium",validator:e=>["sm","small","medium","large","x-large"].includes(e)},type:{type:String,default:"button"},disabled:{type:Boolean,default:!1},loading:{type:Boolean,default:!1},full:{type:Boolean,default:!1}},emits:["click"],setup(e){const l=e,i=t.computed(()=>["btn",`btn--${l.variant}`,`btn--${l.size==="sm"?"small":l.size}`,{"btn--loading":l.loading,"btn--full":l.full}]);return(d,o)=>(t.openBlock(),t.createElementBlock("button",{type:e.type,class:t.normalizeClass(i.value),disabled:e.disabled||e.loading,onClick:o[0]||(o[0]=p=>d.$emit("click"))},[e.loading?(t.openBlock(),t.createElementBlock("div",c,[...o[1]||(o[1]=[t.createElementVNode("div",{class:"simple-spinner"},null,-1)])])):t.createCommentVNode("",!0),t.createElementVNode("span",{class:t.normalizeClass(["btn-content",{"content-hidden":e.loading}])},[t.renderSlot(d.$slots,"default",{},void 0,!0)],2)],10,u))}},[["__scopeId","data-v-8db92d47"]]),s=e=>{e.component("TreqitButton",a),e.component("Button",a)},f={install:s};n.Button=a,n.default=f,n.install=s,Object.defineProperties(n,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})}));
+(function(l,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(l=typeof globalThis<"u"?globalThis:l||self,e(l.TreqitUiLibrary={},l.Vue))})(this,(function(l,e){"use strict";const c=(t,n)=>{const o=t.__vccOpts||t;for(const[i,a]of n)o[i]=a;return o},p=["type","disabled"],y={key:0,class:"btn-loader"},r=c({__name:"Button",props:{variant:{type:String,default:"primary",validator:t=>["primary","secondary","destructive","flat","elevated","text","outlined","outlined-primary","outlined-secondary","rounded"].includes(t)},size:{type:String,default:"medium",validator:t=>["sm","small","medium","large","x-large"].includes(t)},type:{type:String,default:"button"},disabled:{type:Boolean,default:!1},loading:{type:Boolean,default:!1},full:{type:Boolean,default:!1}},emits:["click"],setup(t){const n=t,o=e.computed(()=>["btn",`btn--${n.variant}`,`btn--${n.size==="sm"?"small":n.size}`,{"btn--loading":n.loading,"btn--full":n.full}]);return(i,a)=>(e.openBlock(),e.createElementBlock("button",{type:t.type,class:e.normalizeClass(o.value),disabled:t.disabled||t.loading,onClick:a[0]||(a[0]=s=>i.$emit("click"))},[t.loading?(e.openBlock(),e.createElementBlock("div",y,[...a[1]||(a[1]=[e.createElementVNode("div",{class:"simple-spinner"},null,-1)])])):e.createCommentVNode("",!0),e.createElementVNode("span",{class:e.normalizeClass(["btn-content",{"content-hidden":t.loading}])},[e.renderSlot(i.$slots,"default",{},void 0,!0)],2)],10,p))}},[["__scopeId","data-v-8db92d47"]]),u=c({__name:"Overlay",props:{modelValue:{type:Boolean,default:!1},contained:{type:Boolean,default:!1}},emits:["update:modelValue"],setup(t,{emit:n}){const o=t,i=n;function a(){i("update:modelValue",!1)}return e.watch(()=>o.modelValue,s=>{!o.contained&&typeof document<"u"&&(document.body.style.overflow=s?"hidden":"")}),(s,d)=>(e.openBlock(),e.createBlock(e.Transition,{name:"overlay-fade"},{default:e.withCtx(()=>[t.modelValue?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(["overlay",{"overlay--contained":t.contained}]),onClick:e.withModifiers(a,["self"])},[e.renderSlot(s.$slots,"default",{},void 0,!0)],2)):e.createCommentVNode("",!0)]),_:3}))}},[["__scopeId","data-v-11b69f56"]]),m=c({__name:"Icon",props:{icon:{type:String,required:!1},size:{type:[String,Number],default:24},color:{type:String,default:null}},setup(t){const n=t,o={"x-small":12,small:16,medium:24,large:32,"x-large":40},i=e.computed(()=>n.icon?["icon","mdi",n.icon]:["icon"]),a=e.computed(()=>{let s=n.size;typeof n.size=="string"&&o[n.size]&&(s=o[n.size]);const d={fontSize:`${s}px`};return n.color&&(d.color=n.color),d});return(s,d)=>(e.openBlock(),e.createElementBlock("i",{class:e.normalizeClass(i.value),style:e.normalizeStyle(a.value),"aria-hidden":"true"},null,6))}},[["__scopeId","data-v-4a07735a"]]),f=t=>{t.component("Overlay",u),t.component("Button",r),t.component("Icon",m)},b={install:f};l.Button=r,l.Icon=m,l.Overlay=u,l.default=b,l.install=f,Object.defineProperties(l,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})}));

package/package.json

@@ -14,7 +14,7 @@
   ],
   "name": "treqit-ui-library",
   "private": false,
-  "version": "1.4.6",
+  "version": "1.4.8",
   "type": "module",
   "types": "./dist/index.d.ts",
   "scripts": {
@@ -26,6 +26,8 @@
     "vue": "^3.5.22"
   },
   "devDependencies": {
+    "@mdi/font": "^7.4.47",
+    "@mdi/js": "^7.4.47",
     "@types/node": "^24.6.0",
     "@vitejs/plugin-vue": "^6.0.1",
     "@vue/tsconfig": "^0.8.1",