@oneb/ui-vue 0.0.8 → 0.0.10

package/dist/OneBrowserMenu.vue_vue_type_script_setup_true_lang-4c394828.cjs

@@ -0,0 +1 @@
+"use strict";const e=require("vue"),h=require("./common/index.cjs"),g={title:{type:String},stick:{type:String,default:"right"}},k={variant:{type:String,default:"primary"},label:{type:String},icon:{type:[Function,Object]}},y=["data-opened"],w={key:0,class:"text-sm text-secondary-content px-3 py-2 text-left"},f=e.defineComponent({__name:"OneDropdown",props:g,emits:["open"],setup(d,{emit:l}){const a=d,c=e.ref(!1),n=e.ref(null),r=()=>{c.value=!c.value,c.value&&l("open")};e.provide("OneDropdown",{onToggle:r});const t=e.computed(()=>{const o=n.value!=null&&n.value.offsetLeft<270;return n.value!=null&&n.value.offsetTop+270>window.innerHeight?"up"+(o?"-right":"-left"):"down"+(o?"-right":"-left")}),s=e.computed(()=>{const o=["absolute z-10 w-fit rounded-md bg-white","py-1 shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none","overflow-auto max-h-[540px] min-w-[150px] max-w-[540px]"];return t.value==="up"?o.push("bottom-1 mb-10"):t.value==="down"?o.push("top-1 mt-10"):t.value==="up-right"?o.push("left-0 bottom-1 mb-10"):t.value==="down-right"&&o.push("left-0 top-1 mt-10"),a.stick==="right"?o.push("right-0"):a.stick==="left"&&o.push("left-0"),o});return(o,i)=>(e.openBlock(),e.createElementBlock("div",{class:"relative inline-block",ref_key:"menuRef",ref:n,"data-opened":c.value},[e.renderSlot(o.$slots,"button",e.normalizeProps(e.guardReactiveProps({onToggle:r,isExpanded:c.value}))),c.value?(e.openBlock(),e.createElementBlock("div",{key:0,class:"fixed top-0 left-0 w-screen h-screen z-10",onClick:r})):e.createCommentVNode("",!0),e.createVNode(e.Transition,{"enter-active-class":"transition ease-out duration-100","enter-from-class":"transform opacity-0 scale-95","enter-to-class":"transform opacity-100 scale-100","leave-active-class":"transition ease-in duration-75","leave-from-class":"transform opacity-100 scale-100","leave-to-class":"transform opacity-0 scale-95"},{default:e.withCtx(()=>[c.value?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(["menu",s.value]),role:"menu","aria-orientation":"vertical",tabindex:"-1"},[o.title?(e.openBlock(),e.createElementBlock("div",w,e.toDisplayString(o.title),1)):e.createCommentVNode("",!0),e.renderSlot(o.$slots,"menu",e.normalizeProps(e.guardReactiveProps({onToggle:r})))],2)):e.createCommentVNode("",!0)]),_:3})],8,y))}}),v=["onClick"],p=e.defineComponent({__name:"OneDropdownItem",props:k,emits:["click"],setup(d,{emit:l}){const a=d,c=e.inject("OneDropdown"),n=()=>{c!==void 0&&c.onToggle(),l("click")},r=e.computed(()=>{const t=[];return a.variant==="secondary"?t.push("text-secondary-content hover:bg-secondary-body-hover"):a.variant==="danger"?t.push("text-danger-content hover:bg-danger-10"):a.variant==="warning"?t.push("text-warning-content hover:bg-warning-10"):a.variant==="info"?t.push("text-info-content hover:bg-info-10"):t.push("hover:bg-secondary-body-hover"),t});return(t,s)=>(e.openBlock(),e.createElementBlock("button",{class:e.normalizeClass(["px-3 py-1.5 flex items-center space-x-3 w-full whitespace-nowrap",r.value]),onClick:e.withModifiers(n,["prevent"])},[t.icon?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(t.icon),{key:0,class:"w-4 h-4"})):e.createCommentVNode("",!0),e.createElementVNode("span",null,e.toDisplayString(t.label),1)],10,v))}});function x(d,l){return e.openBlock(),e.createElementBlock("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24","stroke-width":"1.8",stroke:"currentColor","aria-hidden":"true"},[e.createElementVNode("path",{"stroke-linecap":"round","stroke-linejoin":"round",d:"M15.75 6a3.75 3.75 0 11-7.5 0 3.75 3.75 0 017.5 0zM4.501 20.118a7.5 7.5 0 0114.998 0A17.933 17.933 0 0112 21.75c-2.676 0-5.216-.584-7.499-1.632z"})])}function b(d,l){return e.openBlock(),e.createElementBlock("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24","stroke-width":"1.8",stroke:"currentColor","aria-hidden":"true"},[e.createElementVNode("path",{"stroke-linecap":"round","stroke-linejoin":"round",d:"M15.75 9V5.25A2.25 2.25 0 0013.5 3h-6a2.25 2.25 0 00-2.25 2.25v13.5A2.25 2.25 0 007.5 21h6a2.25 2.25 0 002.25-2.25V15m3 0l3-3m0 0l-3-3m3 3H9"})])}const _={user:{type:Object,required:!0},menu:{type:Array,default:()=>[]},iconSize:{type:String,default:"34"},accountLabel:{type:String,default:"Account"},logoutLabel:{type:String,default:"Logout"},onAccount:{type:Function},onLogout:{type:Function}},C={workspace:{type:Object,required:!0},apps:{type:Array,required:!0},iconSize:{type:String,default:"24"},appsTitle:{type:String,default:"Apps"},changeLabel:{type:String,default:"Change"},onChange:{type:Function},onApp:{type:Function}},V=["onClick"],E={class:"space-y-2 text-center py-6",style:{width:"240px"}},N={class:"text-sm text-secondary-content"},B={class:"px-2"},S=e.defineComponent({__name:"OneUserMenu",props:_,setup(d){const l=d,a=e.computed(()=>{var r;return(r=l.menu)==null?void 0:r.map(t=>{let s={label:t.label};t.icon!=null&&(s={...s,icon:t.icon});const o=typeof t.click=="function"?t.click:()=>{};return{key:t.label,args:s,click:o}})}),c=()=>{typeof l.onAccount=="function"&&l.onAccount()},n=()=>{typeof l.onLogout=="function"&&l.onLogout()};return(r,t)=>(e.openBlock(),e.createBlock(f,{stick:"right"},{button:e.withCtx(({onToggle:s,isExpanded:o})=>{var i,u;return[e.createElementVNode("button",{onClick:s,class:e.normalizeClass(["p-1 rounded-full hover:bg-secondary-10",[o?"bg-secondary-25":""]])},[e.createVNode(h.OneAvatar,{text:((i=r.user)==null?void 0:i.name)||"",size:r.iconSize,src:(u=r.user)==null?void 0:u.photo_url,rounded:!0},null,8,["text","size","src"])],10,V)]}),menu:e.withCtx(()=>{var s,o,i,u;return[e.createElementVNode("div",E,[e.createElementVNode("div",null,[e.createVNode(h.OneAvatar,{text:((s=r.user)==null?void 0:s.name)||"",size:80,src:(o=r.user)==null?void 0:o.photo_url,rounded:!0,class:"mx-auto"},null,8,["text","src"])]),e.createElementVNode("div",null,[e.createElementVNode("div",null,e.toDisplayString((i=r.user)==null?void 0:i.name),1),e.createElementVNode("div",N,e.toDisplayString((u=r.user)==null?void 0:u.email),1)])]),e.createElementVNode("div",B,[e.createVNode(p,{icon:e.unref(x),label:r.accountLabel,class:"rounded",onClick:c},null,8,["icon","label"]),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(a.value,m=>(e.openBlock(),e.createBlock(p,e.mergeProps({key:m.key},m.args,{onClick:m.click}),null,16,["onClick"]))),128)),e.createVNode(p,{icon:e.unref(b),label:r.logoutLabel,class:"rounded",onClick:n},null,8,["icon","label"])])]}),_:1}))}});function z(d,l){return e.openBlock(),e.createElementBlock("svg",{xmlns:"http://www.w3.org/2000/svg",fill:"none",viewBox:"0 0 24 24","stroke-width":"1.8",stroke:"currentColor","aria-hidden":"true"},[e.createElementVNode("rect",{width:"2.94",height:"2.94",x:"17.16",y:"3.9",fill:"currentColor","stroke-width":"1.8",rx:"1.1"}),e.createElementVNode("rect",{width:"2.94",height:"2.94",x:"10.53",y:"3.9",fill:"currentColor","stroke-width":"1.8",rx:"1.1"}),e.createElementVNode("rect",{width:"2.94",height:"2.94",x:"3.9",y:"3.9",fill:"currentColor","stroke-width":"1.8",rx:"1.1"}),e.createElementVNode("rect",{width:"2.94",height:"2.94",x:"17.16",y:"10.53",fill:"currentColor","stroke-width":"1.8",rx:"1.1"}),e.createElementVNode("rect",{width:"2.94",height:"2.94",x:"10.53",y:"10.53",fill:"currentColor","stroke-width":"1.8",rx:"1.1"}),e.createElementVNode("rect",{width:"2.94",height:"2.94",x:"3.9",y:"10.53",fill:"currentColor","stroke-width":"1.8",rx:"1.1"}),e.createElementVNode("rect",{width:"2.94",height:"2.94",x:"17.16",y:"17.16",fill:"currentColor","stroke-width":"1.8",rx:"1.1"}),e.createElementVNode("rect",{width:"2.94",height:"2.94",x:"10.53",y:"17.16",fill:"currentColor","stroke-width":"1.8",rx:"1.1"}),e.createElementVNode("rect",{width:"2.94",height:"2.94",x:"3.9",y:"17.16",fill:"currentColor","stroke-width":"1.8",rx:"1.1"})])}const $=["onClick"],A={class:"space-x-2 flex items-center px-3 py-2",style:{width:"300px"}},L={class:"flex-shrink-0"},D={class:"w-full text-left"},O={class:"flex-shrink-0"},P={class:"px-3 py-2 border-t border-secondary-stroke"},M={class:"text-secondary-content text-left pb-1 text-sm"},j={class:"grid grid-cols-3 gap-1"},F=["onClick"],T={class:"block bg-white mx-auto flex-shrink-0 border border-secondary-stroke p-1 rounded-lg"},q={class:"w-full overflow-hidden text-ellipsis whitespace-nowrap text-center text-sm mt-1"},R=e.defineComponent({__name:"OneBrowserMenu",props:C,setup(d){const l=d,a=()=>{typeof l.onChange=="function"&&l.onChange()},c=n=>{typeof l.onApp=="function"&&l.onApp(n)};return(n,r)=>(e.openBlock(),e.createBlock(f,{stick:"right"},{button:e.withCtx(({onToggle:t,isExpanded:s})=>[e.createElementVNode("button",{onClick:t,class:e.normalizeClass(["p-1 rounded-md hover:bg-secondary-10",[s?"bg-secondary-25":""]])},[e.createVNode(e.unref(z),{class:"text-secondary-base",style:e.normalizeStyle(`width: ${n.iconSize}px; height: ${n.iconSize}px`)},null,8,["style"])],10,$)]),menu:e.withCtx(()=>{var t,s,o;return[e.createElementVNode("div",A,[e.createElementVNode("div",L,[e.createVNode(h.OneAvatar,{text:((t=n.workspace)==null?void 0:t.name)||"",src:(s=n.workspace)==null?void 0:s.photo_url,size:44,rounded:!1,class:"mx-auto"},null,8,["text","src"])]),e.createElementVNode("div",D,e.toDisplayString((o=n.workspace)==null?void 0:o.name),1),e.createElementVNode("div",O,[e.createElementVNode("button",{class:"text-sm border border-secondary-stroke rounded px-2 py-0.5 text-secondary-content hover:text-primary-content",onClick:a},e.toDisplayString(n.changeLabel),1)])]),e.createElementVNode("div",P,[e.createElementVNode("div",M,e.toDisplayString(n.appsTitle),1),e.createElementVNode("div",j,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(n.apps,i=>(e.openBlock(),e.createElementBlock("button",{key:i.id,onClick:u=>c(i),class:"p-1.5 flex flex-col items-center justify-center rounded hover:bg-secondary-10",style:{width:"88px",height:"88px"}},[e.createElementVNode("span",T,[e.createVNode(h.OneAvatar,{text:i.name,src:i.photo_url,size:44,rounded:!1},null,8,["text","src"])]),e.createElementVNode("span",q,e.toDisplayString(i.name),1)],8,F))),128))])])]}),_:1}))}});exports._sfc_main=f;exports._sfc_main$1=p;exports._sfc_main$2=S;exports._sfc_main$3=R;

package/dist/OneBrowserMenu.vue_vue_type_script_setup_true_lang-8d34213c.js

@@ -0,0 +1,446 @@
+import { defineComponent as x, ref as $, provide as B, computed as w, openBlock as l, createElementBlock as d, renderSlot as z, normalizeProps as A, guardReactiveProps as L, createCommentVNode as m, createVNode as h, Transition as P, withCtx as y, normalizeClass as b, toDisplayString as f, inject as D, withModifiers as F, createBlock as v, resolveDynamicComponent as T, createElementVNode as e, unref as S, Fragment as O, renderList as M, mergeProps as V, normalizeStyle as E } from "vue";
+import { OneAvatar as k } from "./common/index.js";
+const q = {
+  title: {
+    type: String
+  },
+  stick: {
+    type: String,
+    default: "right"
+  }
+}, H = {
+  variant: {
+    type: String,
+    default: "primary"
+  },
+  label: {
+    type: String
+  },
+  icon: {
+    type: [Function, Object]
+  }
+}, I = ["data-opened"], N = {
+  key: 0,
+  class: "text-sm text-secondary-content px-3 py-2 text-left"
+}, j = /* @__PURE__ */ x({
+  __name: "OneDropdown",
+  props: q,
+  emits: ["open"],
+  setup(p, { emit: s }) {
+    const u = p, c = $(!1), o = $(null), r = () => {
+      c.value = !c.value, c.value && s("open");
+    };
+    B("OneDropdown", {
+      onToggle: r
+    });
+    const t = w(() => {
+      const n = o.value != null && o.value.offsetLeft < 270;
+      return o.value != null && o.value.offsetTop + 270 > window.innerHeight ? "up" + (n ? "-right" : "-left") : "down" + (n ? "-right" : "-left");
+    }), i = w(() => {
+      const n = [
+        "absolute z-10 w-fit rounded-md bg-white",
+        "py-1 shadow-lg ring-1 ring-black ring-opacity-5 focus:outline-none",
+        "overflow-auto max-h-[540px] min-w-[150px] max-w-[540px]"
+      ];
+      return t.value === "up" ? n.push("bottom-1 mb-10") : t.value === "down" ? n.push("top-1 mt-10") : t.value === "up-right" ? n.push("left-0 bottom-1 mb-10") : t.value === "down-right" && n.push("left-0 top-1 mt-10"), u.stick === "right" ? n.push("right-0") : u.stick === "left" && n.push("left-0"), n;
+    });
+    return (n, a) => (l(), d("div", {
+      class: "relative inline-block",
+      ref_key: "menuRef",
+      ref: o,
+      "data-opened": c.value
+    }, [
+      z(n.$slots, "button", A(L({ onToggle: r, isExpanded: c.value }))),
+      c.value ? (l(), d("div", {
+        key: 0,
+        class: "fixed top-0 left-0 w-screen h-screen z-10",
+        onClick: r
+      })) : m("", !0),
+      h(P, {
+        "enter-active-class": "transition ease-out duration-100",
+        "enter-from-class": "transform opacity-0 scale-95",
+        "enter-to-class": "transform opacity-100 scale-100",
+        "leave-active-class": "transition ease-in duration-75",
+        "leave-from-class": "transform opacity-100 scale-100",
+        "leave-to-class": "transform opacity-0 scale-95"
+      }, {
+        default: y(() => [
+          c.value ? (l(), d("div", {
+            key: 0,
+            class: b(["menu", i.value]),
+            role: "menu",
+            "aria-orientation": "vertical",
+            tabindex: "-1"
+          }, [
+            n.title ? (l(), d("div", N, f(n.title), 1)) : m("", !0),
+            z(n.$slots, "menu", A(L({ onToggle: r })))
+          ], 2)) : m("", !0)
+        ]),
+        _: 3
+      })
+    ], 8, I));
+  }
+}), R = ["onClick"], C = /* @__PURE__ */ x({
+  __name: "OneDropdownItem",
+  props: H,
+  emits: ["click"],
+  setup(p, { emit: s }) {
+    const u = p, c = D("OneDropdown"), o = () => {
+      c !== void 0 && c.onToggle(), s("click");
+    }, r = w(() => {
+      const t = [];
+      return u.variant === "secondary" ? t.push("text-secondary-content hover:bg-secondary-body-hover") : u.variant === "danger" ? t.push("text-danger-content hover:bg-danger-10") : u.variant === "warning" ? t.push("text-warning-content hover:bg-warning-10") : u.variant === "info" ? t.push("text-info-content hover:bg-info-10") : t.push("hover:bg-secondary-body-hover"), t;
+    });
+    return (t, i) => (l(), d("button", {
+      class: b(["px-3 py-1.5 flex items-center space-x-3 w-full whitespace-nowrap", r.value]),
+      onClick: F(o, ["prevent"])
+    }, [
+      t.icon ? (l(), v(T(t.icon), {
+        key: 0,
+        class: "w-4 h-4"
+      })) : m("", !0),
+      e("span", null, f(t.label), 1)
+    ], 10, R));
+  }
+});
+function U(p, s) {
+  return l(), d("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    fill: "none",
+    viewBox: "0 0 24 24",
+    "stroke-width": "1.8",
+    stroke: "currentColor",
+    "aria-hidden": "true"
+  }, [
+    e("path", {
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round",
+      d: "M15.75 6a3.75 3.75 0 11-7.5 0 3.75 3.75 0 017.5 0zM4.501 20.118a7.5 7.5 0 0114.998 0A17.933 17.933 0 0112 21.75c-2.676 0-5.216-.584-7.499-1.632z"
+    })
+  ]);
+}
+function G(p, s) {
+  return l(), d("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    fill: "none",
+    viewBox: "0 0 24 24",
+    "stroke-width": "1.8",
+    stroke: "currentColor",
+    "aria-hidden": "true"
+  }, [
+    e("path", {
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round",
+      d: "M15.75 9V5.25A2.25 2.25 0 0013.5 3h-6a2.25 2.25 0 00-2.25 2.25v13.5A2.25 2.25 0 007.5 21h6a2.25 2.25 0 002.25-2.25V15m3 0l3-3m0 0l-3-3m3 3H9"
+    })
+  ]);
+}
+const J = {
+  user: {
+    type: Object,
+    required: !0
+  },
+  menu: {
+    type: Array,
+    default: () => []
+  },
+  iconSize: {
+    type: String,
+    default: "34"
+  },
+  accountLabel: {
+    type: String,
+    default: "Account"
+  },
+  logoutLabel: {
+    type: String,
+    default: "Logout"
+  },
+  onAccount: {
+    type: Function
+  },
+  onLogout: {
+    type: Function
+  }
+}, K = {
+  workspace: {
+    type: Object,
+    required: !0
+  },
+  apps: {
+    type: Array,
+    required: !0
+  },
+  iconSize: {
+    type: String,
+    default: "24"
+  },
+  appsTitle: {
+    type: String,
+    default: "Apps"
+  },
+  changeLabel: {
+    type: String,
+    default: "Change"
+  },
+  onChange: {
+    type: Function
+  },
+  onApp: {
+    type: Function
+  }
+}, Q = ["onClick"], W = {
+  class: "space-y-2 text-center py-6",
+  style: { width: "240px" }
+}, X = { class: "text-sm text-secondary-content" }, Y = { class: "px-2" }, he = /* @__PURE__ */ x({
+  __name: "OneUserMenu",
+  props: J,
+  setup(p) {
+    const s = p, u = w(() => {
+      var r;
+      return (r = s.menu) == null ? void 0 : r.map((t) => {
+        let i = { label: t.label };
+        t.icon != null && (i = { ...i, icon: t.icon });
+        const n = typeof t.click == "function" ? t.click : () => {
+        };
+        return {
+          key: t.label,
+          args: i,
+          click: n
+        };
+      });
+    }), c = () => {
+      typeof s.onAccount == "function" && s.onAccount();
+    }, o = () => {
+      typeof s.onLogout == "function" && s.onLogout();
+    };
+    return (r, t) => (l(), v(j, { stick: "right" }, {
+      button: y(({ onToggle: i, isExpanded: n }) => {
+        var a, g;
+        return [
+          e("button", {
+            onClick: i,
+            class: b(["p-1 rounded-full hover:bg-secondary-10", [n ? "bg-secondary-25" : ""]])
+          }, [
+            h(k, {
+              text: ((a = r.user) == null ? void 0 : a.name) || "",
+              size: r.iconSize,
+              src: (g = r.user) == null ? void 0 : g.photo_url,
+              rounded: !0
+            }, null, 8, ["text", "size", "src"])
+          ], 10, Q)
+        ];
+      }),
+      menu: y(() => {
+        var i, n, a, g;
+        return [
+          e("div", W, [
+            e("div", null, [
+              h(k, {
+                text: ((i = r.user) == null ? void 0 : i.name) || "",
+                size: 80,
+                src: (n = r.user) == null ? void 0 : n.photo_url,
+                rounded: !0,
+                class: "mx-auto"
+              }, null, 8, ["text", "src"])
+            ]),
+            e("div", null, [
+              e("div", null, f((a = r.user) == null ? void 0 : a.name), 1),
+              e("div", X, f((g = r.user) == null ? void 0 : g.email), 1)
+            ])
+          ]),
+          e("div", Y, [
+            h(C, {
+              icon: S(U),
+              label: r.accountLabel,
+              class: "rounded",
+              onClick: c
+            }, null, 8, ["icon", "label"]),
+            (l(!0), d(O, null, M(u.value, (_) => (l(), v(C, V({
+              key: _.key
+            }, _.args, {
+              onClick: _.click
+            }), null, 16, ["onClick"]))), 128)),
+            h(C, {
+              icon: S(G),
+              label: r.logoutLabel,
+              class: "rounded",
+              onClick: o
+            }, null, 8, ["icon", "label"])
+          ])
+        ];
+      }),
+      _: 1
+    }));
+  }
+});
+function Z(p, s) {
+  return l(), d("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    fill: "none",
+    viewBox: "0 0 24 24",
+    "stroke-width": "1.8",
+    stroke: "currentColor",
+    "aria-hidden": "true"
+  }, [
+    e("rect", {
+      width: "2.94",
+      height: "2.94",
+      x: "17.16",
+      y: "3.9",
+      fill: "currentColor",
+      "stroke-width": "1.8",
+      rx: "1.1"
+    }),
+    e("rect", {
+      width: "2.94",
+      height: "2.94",
+      x: "10.53",
+      y: "3.9",
+      fill: "currentColor",
+      "stroke-width": "1.8",
+      rx: "1.1"
+    }),
+    e("rect", {
+      width: "2.94",
+      height: "2.94",
+      x: "3.9",
+      y: "3.9",
+      fill: "currentColor",
+      "stroke-width": "1.8",
+      rx: "1.1"
+    }),
+    e("rect", {
+      width: "2.94",
+      height: "2.94",
+      x: "17.16",
+      y: "10.53",
+      fill: "currentColor",
+      "stroke-width": "1.8",
+      rx: "1.1"
+    }),
+    e("rect", {
+      width: "2.94",
+      height: "2.94",
+      x: "10.53",
+      y: "10.53",
+      fill: "currentColor",
+      "stroke-width": "1.8",
+      rx: "1.1"
+    }),
+    e("rect", {
+      width: "2.94",
+      height: "2.94",
+      x: "3.9",
+      y: "10.53",
+      fill: "currentColor",
+      "stroke-width": "1.8",
+      rx: "1.1"
+    }),
+    e("rect", {
+      width: "2.94",
+      height: "2.94",
+      x: "17.16",
+      y: "17.16",
+      fill: "currentColor",
+      "stroke-width": "1.8",
+      rx: "1.1"
+    }),
+    e("rect", {
+      width: "2.94",
+      height: "2.94",
+      x: "10.53",
+      y: "17.16",
+      fill: "currentColor",
+      "stroke-width": "1.8",
+      rx: "1.1"
+    }),
+    e("rect", {
+      width: "2.94",
+      height: "2.94",
+      x: "3.9",
+      y: "17.16",
+      fill: "currentColor",
+      "stroke-width": "1.8",
+      rx: "1.1"
+    })
+  ]);
+}
+const ee = ["onClick"], te = {
+  class: "space-x-2 flex items-center px-3 py-2",
+  style: { width: "300px" }
+}, ne = { class: "flex-shrink-0" }, oe = { class: "w-full text-left" }, re = { class: "flex-shrink-0" }, se = { class: "px-3 py-2 border-t border-secondary-stroke" }, ie = { class: "text-secondary-content text-left pb-1 text-sm" }, le = { class: "grid grid-cols-3 gap-1" }, ce = ["onClick"], ae = { class: "block bg-white mx-auto flex-shrink-0 border border-secondary-stroke p-1 rounded-lg" }, ue = { class: "w-full overflow-hidden text-ellipsis whitespace-nowrap text-center text-sm mt-1" }, fe = /* @__PURE__ */ x({
+  __name: "OneBrowserMenu",
+  props: K,
+  setup(p) {
+    const s = p, u = () => {
+      typeof s.onChange == "function" && s.onChange();
+    }, c = (o) => {
+      typeof s.onApp == "function" && s.onApp(o);
+    };
+    return (o, r) => (l(), v(j, { stick: "right" }, {
+      button: y(({ onToggle: t, isExpanded: i }) => [
+        e("button", {
+          onClick: t,
+          class: b(["p-1 rounded-md hover:bg-secondary-10", [i ? "bg-secondary-25" : ""]])
+        }, [
+          h(S(Z), {
+            class: "text-secondary-base",
+            style: E(`width: ${o.iconSize}px; height: ${o.iconSize}px`)
+          }, null, 8, ["style"])
+        ], 10, ee)
+      ]),
+      menu: y(() => {
+        var t, i, n;
+        return [
+          e("div", te, [
+            e("div", ne, [
+              h(k, {
+                text: ((t = o.workspace) == null ? void 0 : t.name) || "",
+                src: (i = o.workspace) == null ? void 0 : i.photo_url,
+                size: 44,
+                rounded: !1,
+                class: "mx-auto"
+              }, null, 8, ["text", "src"])
+            ]),
+            e("div", oe, f((n = o.workspace) == null ? void 0 : n.name), 1),
+            e("div", re, [
+              e("button", {
+                class: "text-sm border border-secondary-stroke rounded px-2 py-0.5 text-secondary-content hover:text-primary-content",
+                onClick: u
+              }, f(o.changeLabel), 1)
+            ])
+          ]),
+          e("div", se, [
+            e("div", ie, f(o.appsTitle), 1),
+            e("div", le, [
+              (l(!0), d(O, null, M(o.apps, (a) => (l(), d("button", {
+                key: a.id,
+                onClick: (g) => c(a),
+                class: "p-1.5 flex flex-col items-center justify-center rounded hover:bg-secondary-10",
+                style: { width: "88px", height: "88px" }
+              }, [
+                e("span", ae, [
+                  h(k, {
+                    text: a.name,
+                    src: a.photo_url,
+                    size: 44,
+                    rounded: !1
+                  }, null, 8, ["text", "src"])
+                ]),
+                e("span", ue, f(a.name), 1)
+              ], 8, ce))), 128))
+            ])
+          ])
+        ];
+      }),
+      _: 1
+    }));
+  }
+});
+export {
+  j as _,
+  C as a,
+  he as b,
+  fe as c
+};

package/dist/card/index.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),o=require("../_plugin-vue_export-helper-f246444f.cjs"),n={},s={class:"mb-4 bg-white border border-block rounded"};function c(r,t){return e.openBlock(),e.createElementBlock("div",s,[e.renderSlot(r.$slots,"default")])}const d=o._export_sfc(n,[["render",c]]),l={},a={class:"p-3"};function i(r,t){return e.openBlock(),e.createElementBlock("div",a,[e.renderSlot(r.$slots,"default")])}const _=o._export_sfc(l,[["render",i]]),p={title:{type:String,required:!1},description:{type:String,required:!1}},u={class:"p-3 bg-gray-50 rounded-t flex items-center justify-between space-x-3 border-b border-secondary-stroke"},f={class:"w-full"},m={key:0,class:"text-lg font-medium"},k={key:1,class:"text-xs text-gray-700 pt-2"},b={class:"flex items-center space-x-2"},y=e.defineComponent({__name:"OneCardHeader",props:p,setup(r){return(t,C)=>(e.openBlock(),e.createElementBlock("div",u,[e.createElementVNode("div",f,[t.title?(e.openBlock(),e.createElementBlock("p",m,e.toDisplayString(t.title),1)):e.createCommentVNode("",!0),t.description?(e.openBlock(),e.createElementBlock("p",k,e.toDisplayString(t.description),1)):e.createCommentVNode("",!0)]),e.createElementVNode("div",b,[e.renderSlot(t.$slots,"default")])]))}}),g={},B={class:"p-3 bg-gray-50 rounded-b border-t border-secondary-stroke"};function h(r,t){return e.openBlock(),e.createElementBlock("div",B,[e.renderSlot(r.$slots,"default")])}const $=o._export_sfc(g,[["render",h]]);exports.OneCard=d;exports.OneCardBody=_;exports.OneCardFooter=$;exports.OneCardHeader=y;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),o=require("../_plugin-vue_export-helper-f246444f.cjs"),n={},s={class:"mb-4 bg-white border border-block rounded"};function c(r,t){return e.openBlock(),e.createElementBlock("div",s,[e.renderSlot(r.$slots,"default")])}const d=o._export_sfc(n,[["render",c]]),l={},a={class:"p-3 xl:p-6 space-y-3 xl:space-y-4"};function i(r,t){return e.openBlock(),e.createElementBlock("div",a,[e.renderSlot(r.$slots,"default")])}const _=o._export_sfc(l,[["render",i]]),p={title:{type:String,required:!1},description:{type:String,required:!1}},u={class:"p-3 bg-gray-50 rounded-t flex items-center justify-between space-x-3 border-b border-secondary-stroke"},f={class:"w-full"},m={key:0,class:"text-lg font-medium"},y={key:1,class:"text-xs text-gray-700 pt-2"},k={class:"flex items-center space-x-2"},b=e.defineComponent({__name:"OneCardHeader",props:p,setup(r){return(t,C)=>(e.openBlock(),e.createElementBlock("div",u,[e.createElementVNode("div",f,[t.title?(e.openBlock(),e.createElementBlock("p",m,e.toDisplayString(t.title),1)):e.createCommentVNode("",!0),t.description?(e.openBlock(),e.createElementBlock("p",y,e.toDisplayString(t.description),1)):e.createCommentVNode("",!0)]),e.createElementVNode("div",k,[e.renderSlot(t.$slots,"default")])]))}}),h={},B={class:"p-3 xl:p-6 rounded-b border-t border-secondary-stroke"},x={class:"flex items-center justify-end space-x-3"};function $(r,t){return e.openBlock(),e.createElementBlock("div",B,[e.createElementVNode("div",x,[e.renderSlot(r.$slots,"default")])])}const g=o._export_sfc(h,[["render",$]]);exports.OneCard=d;exports.OneCardBody=_;exports.OneCardFooter=g;exports.OneCardHeader=b;

package/dist/card/index.js

@@ -1,18 +1,18 @@
-import { openBlock as r, createElementBlock as s, renderSlot as o, defineComponent as i, createElementVNode as d, toDisplayString as c, createCommentVNode as a } from "vue";
-import { _ as n } from "../_plugin-vue_export-helper-dad06003.js";
+import { openBlock as s, createElementBlock as r, renderSlot as o, defineComponent as i, createElementVNode as n, toDisplayString as d, createCommentVNode as a } from "vue";
+import { _ as c } from "../_plugin-vue_export-helper-dad06003.js";
 const _ = {}, l = { class: "mb-4 bg-white border border-block rounded" };
 function p(t, e) {
-  return r(), s("div", l, [
+  return s(), r("div", l, [
     o(t.$slots, "default")
   ]);
 }
-const B = /* @__PURE__ */ n(_, [["render", p]]), f = {}, u = { class: "p-3" };
+const H = /* @__PURE__ */ c(_, [["render", p]]), f = {}, u = { class: "p-3 xl:p-6 space-y-3 xl:space-y-4" };
 function m(t, e) {
-  return r(), s("div", u, [
+  return s(), r("div", u, [
     o(t.$slots, "default")
   ]);
 }
-const H = /* @__PURE__ */ n(f, [["render", m]]), b = {
+const j = /* @__PURE__ */ c(f, [["render", m]]), h = {
   title: {
     type: String,
     required: !1
@@ -21,36 +21,38 @@ const H = /* @__PURE__ */ n(f, [["render", m]]), b = {
     type: String,
     required: !1
   }
-}, h = { class: "p-3 bg-gray-50 rounded-t flex items-center justify-between space-x-3 border-b border-secondary-stroke" }, y = { class: "w-full" }, $ = {
+}, y = { class: "p-3 bg-gray-50 rounded-t flex items-center justify-between space-x-3 border-b border-secondary-stroke" }, b = { class: "w-full" }, $ = {
   key: 0,
   class: "text-lg font-medium"
-}, g = {
+}, x = {
   key: 1,
   class: "text-xs text-gray-700 pt-2"
-}, k = { class: "flex items-center space-x-2" }, q = /* @__PURE__ */ i({
+}, g = { class: "flex items-center space-x-2" }, q = /* @__PURE__ */ i({
   __name: "OneCardHeader",
-  props: b,
+  props: h,
   setup(t) {
-    return (e, O) => (r(), s("div", h, [
-      d("div", y, [
-        e.title ? (r(), s("p", $, c(e.title), 1)) : a("", !0),
-        e.description ? (r(), s("p", g, c(e.description), 1)) : a("", !0)
+    return (e, S) => (s(), r("div", y, [
+      n("div", b, [
+        e.title ? (s(), r("p", $, d(e.title), 1)) : a("", !0),
+        e.description ? (s(), r("p", x, d(e.description), 1)) : a("", !0)
       ]),
-      d("div", k, [
+      n("div", g, [
         o(e.$slots, "default")
       ])
     ]));
   }
-}), C = {}, v = { class: "p-3 bg-gray-50 rounded-b border-t border-secondary-stroke" };
-function x(t, e) {
-  return r(), s("div", v, [
-    o(t.$slots, "default")
+}), k = {}, v = { class: "p-3 xl:p-6 rounded-b border-t border-secondary-stroke" }, C = { class: "flex items-center justify-end space-x-3" };
+function O(t, e) {
+  return s(), r("div", v, [
+    n("div", C, [
+      o(t.$slots, "default")
+    ])
   ]);
 }
-const E = /* @__PURE__ */ n(C, [["render", x]]);
+const E = /* @__PURE__ */ c(k, [["render", O]]);
 export {
-  B as OneCard,
-  H as OneCardBody,
+  H as OneCard,
+  j as OneCardBody,
   E as OneCardFooter,
   q as OneCardHeader
 };

package/dist/common/avatar.d.ts

@@ -0,0 +1,21 @@
+import type { ExtractPropTypes } from "vue";
+export declare const avatarProps: {
+    size: {
+        type: PropType<string | number>;
+        default: string;
+    };
+    rounded: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    text: {
+        type: StringConstructor;
+        required: boolean;
+        default: string;
+    };
+    src: {
+        type: PropType<string>;
+        required: boolean;
+    };
+};
+export type AvatarProps = ExtractPropTypes<typeof avatarProps>;

package/dist/common/index.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),p={size:{type:[String,Number],default:"50"},rounded:{type:Boolean,default:!1},text:{type:String,required:!1,default:""},src:{type:[String,null],required:!1}},m=["src"],y=e.defineComponent({__name:"OneAvatar",props:p,setup(s){const t=s,n=e.computed(()=>{const r=t.text.trim().split(" ");return r.length<2?t.text.slice(0,2).toUpperCase():r.map(l=>l.slice(0,1)).join("").toUpperCase()}),a=e.computed(()=>({fill:"rgba(255, 255, 255, .75)",fontSize:`${Number(t.size)*.4}px`})),c=e.computed(()=>{const r=t.text.split("").map(o=>o.charCodeAt(0)).reduce((o,d)=>o+d,0),u=`hsl(${360/26*r}, 68%, 48%)`;return{width:`${t.size}px`,height:`${t.size}px`,borderRadius:t.rounded?"100%":"9%",background:u}}),i=e.computed(()=>({width:`${t.size}px`,height:`${t.size}px`,borderRadius:t.rounded?"100%":"9%"}));return(r,l)=>(e.openBlock(),e.createElementBlock("div",{style:e.normalizeStyle(i.value),class:"overflow-hidden"},[r.src?(e.openBlock(),e.createElementBlock("img",{key:0,src:r.src,alt:"",class:"w-full h-full"},null,8,m)):(e.openBlock(),e.createElementBlock("svg",{key:1,style:e.normalizeStyle(c.value),class:"block"},[n.value?(e.openBlock(),e.createElementBlock("text",{key:0,x:"50%",y:"50%","text-anchor":"middle","dominant-baseline":"central",class:"font-light",style:e.normalizeStyle(a.value)},e.toDisplayString(n.value),5)):e.createCommentVNode("",!0)],4))],4))}});exports.OneAvatar=y;

package/dist/common/index.d.ts

@@ -0,0 +1,2 @@
+export { default as OneAvatar } from './OneAvatar.vue';
+export type { AvatarProps } from './avatar';

package/dist/common/index.js

@@ -0,0 +1,72 @@
+import { defineComponent as f, computed as r, openBlock as s, createElementBlock as n, normalizeStyle as a, toDisplayString as y, createCommentVNode as g } from "vue";
+const x = {
+  size: {
+    type: [String, Number],
+    default: "50"
+  },
+  rounded: {
+    type: Boolean,
+    default: !1
+  },
+  text: {
+    type: String,
+    required: !1,
+    default: ""
+  },
+  src: {
+    type: [String, null],
+    required: !1
+  }
+}, v = ["src"], S = /* @__PURE__ */ f({
+  __name: "OneAvatar",
+  props: x,
+  setup(c) {
+    const e = c, i = r(() => {
+      const t = e.text.trim().split(" ");
+      return t.length < 2 ? e.text.slice(0, 2).toUpperCase() : t.map((l) => l.slice(0, 1)).join("").toUpperCase();
+    }), u = r(() => ({
+      fill: "rgba(255, 255, 255, .75)",
+      fontSize: `${Number(e.size) * 0.4}px`
+    })), d = r(() => {
+      const t = e.text.split("").map((o) => o.charCodeAt(0)).reduce((o, h) => o + h, 0), m = `hsl(${360 / 26 * t}, 68%, 48%)`;
+      return {
+        width: `${e.size}px`,
+        height: `${e.size}px`,
+        borderRadius: e.rounded ? "100%" : "9%",
+        background: m
+      };
+    }), p = r(() => ({
+      width: `${e.size}px`,
+      height: `${e.size}px`,
+      borderRadius: e.rounded ? "100%" : "9%"
+    }));
+    return (t, l) => (s(), n("div", {
+      style: a(p.value),
+      class: "overflow-hidden"
+    }, [
+      t.src ? (s(), n("img", {
+        key: 0,
+        src: t.src,
+        alt: "",
+        class: "w-full h-full"
+      }, null, 8, v)) : (s(), n("svg", {
+        key: 1,
+        style: a(d.value),
+        class: "block"
+      }, [
+        i.value ? (s(), n("text", {
+          key: 0,
+          x: "50%",
+          y: "50%",
+          "text-anchor": "middle",
+          "dominant-baseline": "central",
+          class: "font-light",
+          style: a(u.value)
+        }, y(i.value), 5)) : g("", !0)
+      ], 4))
+    ], 4));
+  }
+});
+export {
+  S as OneAvatar
+};

package/dist/dropdown/index.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../index-f88ecb85.cjs");require("vue");require("../_plugin-vue_export-helper-f246444f.cjs");exports.OneBrowserMenu=e._sfc_main$3;exports.OneDropdown=e._sfc_main;exports.OneDropdownDivider=e.OneDropdownDivider;exports.OneDropdownItem=e._sfc_main$1;exports.OneUserMenu=e._sfc_main$2;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../OneBrowserMenu.vue_vue_type_script_setup_true_lang-4c394828.cjs"),r=require("vue"),n=require("../_plugin-vue_export-helper-f246444f.cjs");require("../common/index.cjs");const o={},t={class:"border-t border-secondary-stroke my-1"};function _(s,i){return r.openBlock(),r.createElementBlock("div",t)}const c=n._export_sfc(o,[["render",_]]);exports.OneBrowserMenu=e._sfc_main$3;exports.OneDropdown=e._sfc_main;exports.OneDropdownItem=e._sfc_main$1;exports.OneUserMenu=e._sfc_main$2;exports.OneDropdownDivider=c;