@oneb/ui-vue 0.0.9 → 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/dropdown/index.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),g=require("../_plugin-vue_export-helper-f246444f.cjs"),h=require("../common/index.cjs"),k={title:{type:String},stick:{type:String,default:"right"}},y={variant:{type:String,default:"primary"},label:{type:String},icon:{type:[Function,Object]}},w=["data-opened"],v={key:0,class:"text-sm text-secondary-content px-3 py-2 text-left"},f=e.defineComponent({__name:"OneDropdown",props:k,emits:["open"],setup(a,{emit:l}){const d=a,s=e.ref(!1),n=e.ref(null),r=()=>{s.value=!s.value,s.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")}),c=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"),d.stick==="right"?o.push("right-0"):d.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":s.value},[e.renderSlot(o.$slots,"button",e.normalizeProps(e.guardReactiveProps({onToggle:r,isExpanded:s.value}))),s.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(()=>[s.value?(e.openBlock(),e.createElementBlock("div",{key:0,class:e.normalizeClass(["menu",c.value]),role:"menu","aria-orientation":"vertical",tabindex:"-1"},[o.title?(e.openBlock(),e.createElementBlock("div",v,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,w))}}),x=["onClick"],p=e.defineComponent({__name:"OneDropdownItem",props:y,emits:["click"],setup(a,{emit:l}){const d=a,s=e.inject("OneDropdown"),n=()=>{s!==void 0&&s.onToggle(),l("click")},r=e.computed(()=>{const t=[];return d.variant==="secondary"?t.push("text-secondary-content hover:bg-secondary-body-hover"):d.variant==="danger"?t.push("text-danger-content hover:bg-danger-10"):d.variant==="warning"?t.push("text-warning-content hover:bg-warning-10"):d.variant==="info"?t.push("text-info-content hover:bg-info-10"):t.push("hover:bg-secondary-body-hover"),t});return(t,c)=>(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,x))}}),b={},_={class:"border-t border-secondary-stroke my-1"};function C(a,l){return e.openBlock(),e.createElementBlock("div",_)}const V=g._export_sfc(b,[["render",C]]);function E(a,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 N(a,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 B={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}},S={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}},z=["onClick"],O={class:"space-y-2 text-center py-6",style:{width:"240px"}},A={class:"text-sm text-secondary-content"},D={class:"px-2"},$=e.defineComponent({__name:"OneUserMenu",props:B,setup(a){const l=a,d=e.computed(()=>{var r;return(r=l.menu)==null?void 0:r.map(t=>{let c={label:t.label};t.icon!=null&&(c={...c,icon:t.icon});const o=typeof t.click=="function"?t.click:()=>{};return{key:t.label,args:c,click:o}})}),s=()=>{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:c,isExpanded:o})=>{var i,u;return[e.createElementVNode("button",{onClick:c,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,z)]}),menu:e.withCtx(()=>{var c,o,i,u;return[e.createElementVNode("div",O,[e.createElementVNode("div",null,[e.createVNode(h.OneAvatar,{text:((c=r.user)==null?void 0:c.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",A,e.toDisplayString((u=r.user)==null?void 0:u.email),1)])]),e.createElementVNode("div",D,[e.createVNode(p,{icon:e.unref(E),label:r.accountLabel,class:"rounded",onClick:s},null,8,["icon","label"]),(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(d.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(N),label:r.logoutLabel,class:"rounded",onClick:n},null,8,["icon","label"])])]}),_:1}))}});function L(a,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 M=["onClick"],P={class:"space-x-2 flex items-center px-3 py-2",style:{width:"300px"}},j={class:"flex-shrink-0"},F={class:"w-full text-left"},T={class:"flex-shrink-0"},q={class:"px-3 py-2 border-t border-secondary-stroke"},H={class:"text-secondary-content text-left pb-1 text-sm"},I={class:"grid grid-cols-3 gap-1"},R=["onClick"],U={class:"block bg-white mx-auto flex-shrink-0 border border-secondary-stroke p-1 rounded-lg"},G={class:"w-full overflow-hidden text-ellipsis whitespace-nowrap text-center text-sm mt-1"},J=e.defineComponent({__name:"OneBrowserMenu",props:S,setup(a){const l=a,d=()=>{typeof l.onChange=="function"&&l.onChange()},s=n=>{typeof l.onApp=="function"&&l.onApp(n)};return(n,r)=>(e.openBlock(),e.createBlock(f,{stick:"right"},{button:e.withCtx(({onToggle:t,isExpanded:c})=>[e.createElementVNode("button",{onClick:t,class:e.normalizeClass(["p-1 rounded-md hover:bg-secondary-10",[c?"bg-secondary-25":""]])},[e.createVNode(e.unref(L),{class:"text-secondary-base",style:e.normalizeStyle(`width: ${n.iconSize}px; height: ${n.iconSize}px`)},null,8,["style"])],10,M)]),menu:e.withCtx(()=>{var t,c,o;return[e.createElementVNode("div",P,[e.createElementVNode("div",j,[e.createVNode(h.OneAvatar,{text:((t=n.workspace)==null?void 0:t.name)||"",src:(c=n.workspace)==null?void 0:c.photo_url,size:44,rounded:!1,class:"mx-auto"},null,8,["text","src"])]),e.createElementVNode("div",F,e.toDisplayString((o=n.workspace)==null?void 0:o.name),1),e.createElementVNode("div",T,[e.createElementVNode("button",{class:"text-sm border border-secondary-stroke rounded px-2 py-0.5 text-secondary-content hover:text-primary-content",onClick:d},e.toDisplayString(n.changeLabel),1)])]),e.createElementVNode("div",q,[e.createElementVNode("div",H,e.toDisplayString(n.appsTitle),1),e.createElementVNode("div",I,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(n.apps,i=>(e.openBlock(),e.createElementBlock("button",{key:i.id,onClick:u=>s(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",U,[e.createVNode(h.OneAvatar,{text:i.name,src:i.photo_url,size:44,rounded:!1},null,8,["text","src"])]),e.createElementVNode("span",G,e.toDisplayString(i.name),1)],8,R))),128))])])]}),_:1}))}});exports.OneBrowserMenu=J;exports.OneDropdown=f;exports.OneDropdownDivider=V;exports.OneDropdownItem=p;exports.OneUserMenu=$;
+"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;

package/dist/dropdown/index.js

@@ -1,452 +1,16 @@
-import { defineComponent as k, ref as S, provide as B, computed as w, openBlock as l, createElementBlock as u, renderSlot as z, normalizeProps as A, guardReactiveProps as L, createCommentVNode as m, createVNode as h, Transition as j, withCtx as y, normalizeClass as _, toDisplayString as f, inject as P, withModifiers as F, createBlock as v, resolveDynamicComponent as T, createElementVNode as e, unref as $, Fragment as O, renderList as D, mergeProps as V, normalizeStyle as E } from "vue";
-import { _ as I } from "../_plugin-vue_export-helper-dad06003.js";
-import { OneAvatar as x } 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]
-  }
-}, N = ["data-opened"], R = {
-  key: 0,
-  class: "text-sm text-secondary-content px-3 py-2 text-left"
-}, M = /* @__PURE__ */ k({
-  __name: "OneDropdown",
-  props: q,
-  emits: ["open"],
-  setup(d, { emit: s }) {
-    const p = d, c = S(!1), o = S(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"), p.stick === "right" ? n.push("right-0") : p.stick === "left" && n.push("left-0"), n;
-    });
-    return (n, a) => (l(), u("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(), u("div", {
-        key: 0,
-        class: "fixed top-0 left-0 w-screen h-screen z-10",
-        onClick: r
-      })) : m("", !0),
-      h(j, {
-        "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(), u("div", {
-            key: 0,
-            class: _(["menu", i.value]),
-            role: "menu",
-            "aria-orientation": "vertical",
-            tabindex: "-1"
-          }, [
-            n.title ? (l(), u("div", R, f(n.title), 1)) : m("", !0),
-            z(n.$slots, "menu", A(L({ onToggle: r })))
-          ], 2)) : m("", !0)
-        ]),
-        _: 3
-      })
-    ], 8, N));
-  }
-}), U = ["onClick"], C = /* @__PURE__ */ k({
-  __name: "OneDropdownItem",
-  props: H,
-  emits: ["click"],
-  setup(d, { emit: s }) {
-    const p = d, c = P("OneDropdown"), o = () => {
-      c !== void 0 && c.onToggle(), s("click");
-    }, r = w(() => {
-      const t = [];
-      return p.variant === "secondary" ? t.push("text-secondary-content hover:bg-secondary-body-hover") : p.variant === "danger" ? t.push("text-danger-content hover:bg-danger-10") : p.variant === "warning" ? t.push("text-warning-content hover:bg-warning-10") : p.variant === "info" ? t.push("text-info-content hover:bg-info-10") : t.push("hover:bg-secondary-body-hover"), t;
-    });
-    return (t, i) => (l(), u("button", {
-      class: _(["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, U));
-  }
-}), G = {}, J = { class: "border-t border-secondary-stroke my-1" };
-function K(d, s) {
-  return l(), u("div", J);
+import { c as O, _ as l, a as u, b as w } from "../OneBrowserMenu.vue_vue_type_script_setup_true_lang-8d34213c.js";
+import { openBlock as e, createElementBlock as r } from "vue";
+import { _ as o } from "../_plugin-vue_export-helper-dad06003.js";
+import "../common/index.js";
+const n = {}, s = { class: "border-t border-secondary-stroke my-1" };
+function t(c, _) {
+  return e(), r("div", s);
 }
-const we = /* @__PURE__ */ I(G, [["render", K]]);
-function Q(d, s) {
-  return l(), u("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 W(d, s) {
-  return l(), u("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 X = {
-  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
-  }
-}, Y = {
-  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
-  }
-}, Z = ["onClick"], ee = {
-  class: "space-y-2 text-center py-6",
-  style: { width: "240px" }
-}, te = { class: "text-sm text-secondary-content" }, ne = { class: "px-2" }, ve = /* @__PURE__ */ k({
-  __name: "OneUserMenu",
-  props: X,
-  setup(d) {
-    const s = d, p = 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(M, { stick: "right" }, {
-      button: y(({ onToggle: i, isExpanded: n }) => {
-        var a, g;
-        return [
-          e("button", {
-            onClick: i,
-            class: _(["p-1 rounded-full hover:bg-secondary-10", [n ? "bg-secondary-25" : ""]])
-          }, [
-            h(x, {
-              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, Z)
-        ];
-      }),
-      menu: y(() => {
-        var i, n, a, g;
-        return [
-          e("div", ee, [
-            e("div", null, [
-              h(x, {
-                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", te, f((g = r.user) == null ? void 0 : g.email), 1)
-            ])
-          ]),
-          e("div", ne, [
-            h(C, {
-              icon: $(Q),
-              label: r.accountLabel,
-              class: "rounded",
-              onClick: c
-            }, null, 8, ["icon", "label"]),
-            (l(!0), u(O, null, D(p.value, (b) => (l(), v(C, V({
-              key: b.key
-            }, b.args, {
-              onClick: b.click
-            }), null, 16, ["onClick"]))), 128)),
-            h(C, {
-              icon: $(W),
-              label: r.logoutLabel,
-              class: "rounded",
-              onClick: o
-            }, null, 8, ["icon", "label"])
-          ])
-        ];
-      }),
-      _: 1
-    }));
-  }
-});
-function oe(d, s) {
-  return l(), u("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 re = ["onClick"], se = {
-  class: "space-x-2 flex items-center px-3 py-2",
-  style: { width: "300px" }
-}, ie = { class: "flex-shrink-0" }, le = { class: "w-full text-left" }, ce = { class: "flex-shrink-0" }, ae = { class: "px-3 py-2 border-t border-secondary-stroke" }, ue = { class: "text-secondary-content text-left pb-1 text-sm" }, de = { class: "grid grid-cols-3 gap-1" }, pe = ["onClick"], he = { class: "block bg-white mx-auto flex-shrink-0 border border-secondary-stroke p-1 rounded-lg" }, fe = { class: "w-full overflow-hidden text-ellipsis whitespace-nowrap text-center text-sm mt-1" }, xe = /* @__PURE__ */ k({
-  __name: "OneBrowserMenu",
-  props: Y,
-  setup(d) {
-    const s = d, p = () => {
-      typeof s.onChange == "function" && s.onChange();
-    }, c = (o) => {
-      typeof s.onApp == "function" && s.onApp(o);
-    };
-    return (o, r) => (l(), v(M, { stick: "right" }, {
-      button: y(({ onToggle: t, isExpanded: i }) => [
-        e("button", {
-          onClick: t,
-          class: _(["p-1 rounded-md hover:bg-secondary-10", [i ? "bg-secondary-25" : ""]])
-        }, [
-          h($(oe), {
-            class: "text-secondary-base",
-            style: E(`width: ${o.iconSize}px; height: ${o.iconSize}px`)
-          }, null, 8, ["style"])
-        ], 10, re)
-      ]),
-      menu: y(() => {
-        var t, i, n;
-        return [
-          e("div", se, [
-            e("div", ie, [
-              h(x, {
-                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", le, f((n = o.workspace) == null ? void 0 : n.name), 1),
-            e("div", ce, [
-              e("button", {
-                class: "text-sm border border-secondary-stroke rounded px-2 py-0.5 text-secondary-content hover:text-primary-content",
-                onClick: p
-              }, f(o.changeLabel), 1)
-            ])
-          ]),
-          e("div", ae, [
-            e("div", ue, f(o.appsTitle), 1),
-            e("div", de, [
-              (l(!0), u(O, null, D(o.apps, (a) => (l(), u("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", he, [
-                  h(x, {
-                    text: a.name,
-                    src: a.photo_url,
-                    size: 44,
-                    rounded: !1
-                  }, null, 8, ["text", "src"])
-                ]),
-                e("span", fe, f(a.name), 1)
-              ], 8, pe))), 128))
-            ])
-          ])
-        ];
-      }),
-      _: 1
-    }));
-  }
-});
+const p = /* @__PURE__ */ o(n, [["render", t]]);
 export {
-  xe as OneBrowserMenu,
-  M as OneDropdown,
-  we as OneDropdownDivider,
-  C as OneDropdownItem,
-  ve as OneUserMenu
+  O as OneBrowserMenu,
+  l as OneDropdown,
+  p as OneDropdownDivider,
+  u as OneDropdownItem,
+  w as OneUserMenu
 };

package/dist/index.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("./button/index.cjs"),n=require("./card/index.cjs"),e=require("./form/index.cjs"),r=require("./dropdown/index.cjs"),O=require("./common/index.cjs");require("vue");require("./_plugin-vue_export-helper-f246444f.cjs");exports.OneButton=o.OneButton;exports.OneCard=n.OneCard;exports.OneCardBody=n.OneCardBody;exports.OneCardFooter=n.OneCardFooter;exports.OneCardHeader=n.OneCardHeader;exports.OneForm=e.OneForm;exports.OneFormFeedback=e.OneFormFeedback;exports.OneFormField=e.OneFormField;exports.OneFormInput=e.OneFormInput;exports.OneFormLabel=e.OneFormLabel;exports.OneBrowserMenu=r.OneBrowserMenu;exports.OneDropdown=r.OneDropdown;exports.OneDropdownDivider=r.OneDropdownDivider;exports.OneDropdownItem=r.OneDropdownItem;exports.OneUserMenu=r.OneUserMenu;exports.OneAvatar=O.OneAvatar;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("./button/index.cjs"),r=require("./card/index.cjs"),e=require("./form/index.cjs"),n=require("./OneBrowserMenu.vue_vue_type_script_setup_true_lang-4c394828.cjs"),O=require("./dropdown/index.cjs"),t=require("./common/index.cjs");require("vue");require("./_plugin-vue_export-helper-f246444f.cjs");exports.OneButton=o.OneButton;exports.OneCard=r.OneCard;exports.OneCardBody=r.OneCardBody;exports.OneCardFooter=r.OneCardFooter;exports.OneCardHeader=r.OneCardHeader;exports.OneForm=e.OneForm;exports.OneFormFeedback=e.OneFormFeedback;exports.OneFormField=e.OneFormField;exports.OneFormInput=e.OneFormInput;exports.OneFormLabel=e.OneFormLabel;exports.OneBrowserMenu=n._sfc_main$3;exports.OneDropdown=n._sfc_main;exports.OneDropdownItem=n._sfc_main$1;exports.OneUserMenu=n._sfc_main$2;exports.OneDropdownDivider=O.OneDropdownDivider;exports.OneAvatar=t.OneAvatar;

package/dist/index.js

@@ -1,25 +1,26 @@
 import { OneButton as O } from "./button/index.js";
-import { OneCard as t, OneCardBody as d, OneCardFooter as p, OneCardHeader as a } from "./card/index.js";
-import { OneForm as f, OneFormFeedback as i, OneFormField as x, OneFormInput as u, OneFormLabel as w } from "./form/index.js";
-import { OneBrowserMenu as D, OneDropdown as B, OneDropdownDivider as b, OneDropdownItem as l, OneUserMenu as s } from "./dropdown/index.js";
+import { OneCard as m, OneCardBody as t, OneCardFooter as d, OneCardHeader as p } from "./card/index.js";
+import { OneForm as f, OneFormFeedback as s, OneFormField as x, OneFormInput as i, OneFormLabel as u } from "./form/index.js";
+import { c as C, _ as D, a as b, b as B } from "./OneBrowserMenu.vue_vue_type_script_setup_true_lang-8d34213c.js";
+import { OneDropdownDivider as l } from "./dropdown/index.js";
 import { OneAvatar as I } from "./common/index.js";
 import "vue";
 import "./_plugin-vue_export-helper-dad06003.js";
 export {
   I as OneAvatar,
-  D as OneBrowserMenu,
+  C as OneBrowserMenu,
   O as OneButton,
-  t as OneCard,
-  d as OneCardBody,
-  p as OneCardFooter,
-  a as OneCardHeader,
-  B as OneDropdown,
-  b as OneDropdownDivider,
-  l as OneDropdownItem,
+  m as OneCard,
+  t as OneCardBody,
+  d as OneCardFooter,
+  p as OneCardHeader,
+  D as OneDropdown,
+  l as OneDropdownDivider,
+  b as OneDropdownItem,
   f as OneForm,
-  i as OneFormFeedback,
+  s as OneFormFeedback,
   x as OneFormField,
-  u as OneFormInput,
-  w as OneFormLabel,
-  s as OneUserMenu
+  i as OneFormInput,
+  u as OneFormLabel,
+  B as OneUserMenu
 };

package/dist/layout/index.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),y=require("../_plugin-vue_export-helper-f246444f.cjs"),k=require("../OneBrowserMenu.vue_vue_type_script_setup_true_lang-4c394828.cjs");require("../common/index.cjs");const _={};function x(r,o){return e.openBlock(),e.createElementBlock("div",null," header ")}const N=y._export_sfc(_,[["render",x]]),g={items:{required:!0,type:Array},slim:{type:Boolean,default:!0}},B={route:{required:!1,type:[Object,String]},routeName:{required:!1,type:String},handler:{required:!1,type:Function,default(){return()=>{}}},label:{type:String,required:!0},icon:{type:[Function,Object]},exact:{type:Boolean,required:!1,default:!1},slim:{type:Boolean,default:!0}},V={sidebarItems:g.items,logoSrc:{type:String},app:{required:!0,type:Object},user:{type:Object,required:!0},labels:{type:Object},handlers:{type:Object}},E=e.defineComponent({__name:"OneSidebarLink",props:B,setup(r){return(o,l)=>{const n=e.resolveComponent("RouterLink");return e.openBlock(),e.createBlock(n,{to:o.routeName?{name:o.routeName}:o.route,class:e.normalizeClass(["flex items-center w-full p-[8px] rounded-lg text-sm font-medium hover:bg-primary-10-hover hover:text-primary-base transition-all text-primary-content",[o.slim?"w-[44px] h-[44px] justify-center":"h-[44px] justify-start"]]),"active-class":o.exact?"":"bg-primary-10 !text-primary-base","exact-active-class":o.exact?"bg-primary-10 !text-primary-base":"",exact:o.exact},{default:e.withCtx(()=>[e.createElementVNode("div",{class:e.normalizeClass(["flex flex-nowrap items-center",[o.slim?"w-[24px] h-[24px]":"w-full"]])},[o.icon?(e.openBlock(),e.createBlock(e.resolveDynamicComponent(o.icon),{key:0,class:"w-[24px] h-[24px] flex-shrink-0"})):e.createCommentVNode("",!0),e.createElementVNode("div",{class:e.normalizeClass(["whitespace-nowrap overflow-hidden text-ellipsis transition-all text-left flex-shrink",[o.slim?"w-0":"pl-1.5 w-full"]])},e.toDisplayString(o.label),3)],2)]),_:1},8,["to","active-class","exact-active-class","exact","class"])}}}),C={class:""},S={class:"space-y-2 p-2"},v=e.defineComponent({__name:"OneSidebar",props:g,setup(r){return(o,l)=>(e.openBlock(),e.createElementBlock("div",C,[e.createElementVNode("div",S,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(o.items,n=>(e.openBlock(),e.createBlock(E,{key:n.label,icon:n.icon,label:n.label,route:n.route,"route-name":n.routeName,exact:n.exact||!1,slim:o.slim},null,8,["icon","label","route","route-name","exact","slim"]))),128))])]))}});function O(r,o){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:"M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25h16.5"})])}const j={class:"min-h-screen relative"},q={class:"header h-[56px] flex items-center flex-nowrap absolute top-0 left-0 w-screen"},L={class:"p-2 flex-shrink-0"},$={class:"w-10 h-10 bg-white rounded-lg border border-secondary-stroke flex items-center flex-shrink-0"},M=["src"],z={class:"text-xs"},A={class:"w-full"},D={class:"w-full flex justify-end pr-2"},I={class:"flex items-center space-x-1"},P={class:"body w-full h-full"},R=e.defineComponent({__name:"OneMainLayout",props:V,setup(r){const o=r,l=e.ref(window.localStorage.getItem("sidebar-slim")==="1");e.watch(l,t=>{window.localStorage.setItem("sidebar-slim",String(t?1:0))});const n=e.computed(()=>{var t,a;return{name:((t=o.app)==null?void 0:t.workspace)||"",photo_url:((a=o.app)==null?void 0:a.photo_url)||""}});return(t,a)=>{var s,c,i,p,u,d,m,h,f,b;const w=e.resolveComponent("RouterLink");return e.openBlock(),e.createElementBlock("div",j,[e.createElementVNode("div",q,[e.createElementVNode("div",L,[e.createElementVNode("button",{onClick:a[0]||(a[0]=F=>l.value=!l.value),class:"w-[44px] h-[44px] p-[8px] flex items-center justify-center hover:text-secondary-content"},[e.createVNode(e.unref(O),{class:"w-[24px] h-[24px]"})])]),e.createElementVNode("div",$,[t.logoSrc!=null?(e.openBlock(),e.createElementBlock("img",{key:0,src:t.logoSrc,class:"w-8 h-8 mx-auto",alt:"logo"},null,8,M)):e.createCommentVNode("",!0)]),t.app!=null?(e.openBlock(),e.createBlock(w,{key:0,to:"/",class:"pl-2 max-w-xs"},{default:e.withCtx(()=>[e.createElementVNode("div",null,e.toDisplayString(t.app.name),1),e.createElementVNode("div",z,e.toDisplayString(t.app.workspace),1)]),_:1})):e.createCommentVNode("",!0),e.createElementVNode("div",A,[e.createElementVNode("div",D,[e.createElementVNode("div",I,[e.createVNode(k._sfc_main$3,{workspace:n.value,apps:((s=t.app)==null?void 0:s.apps)||[],"change-label":((c=t.labels)==null?void 0:c.change)||"Change","apps-title":((i=t.labels)==null?void 0:i.apps)||"Apps","on-app":(p=t.handlers)==null?void 0:p.onApp,"on-change":(u=t.handlers)==null?void 0:u.onChange,onOpen:(d=t.handlers)==null?void 0:d.onBrowse},null,8,["workspace","apps","change-label","apps-title","on-app","on-change","onOpen"]),e.createVNode(k._sfc_main$2,{user:t.user,"account-label":((m=t.labels)==null?void 0:m.account)||"Account","logout-label":((h=t.labels)==null?void 0:h.logout)||"Logout","on-account":(f=t.handlers)==null?void 0:f.onAccount,"on-logout":(b=t.handlers)==null?void 0:b.onLogout},null,8,["user","account-label","logout-label","on-account","on-logout"])])])])]),e.createElementVNode("div",{class:e.normalizeClass(["sidebar transition-all absolute top-[56px] left-0 h-full",[l.value?"w-[60px]":"w-60"]])},[e.createVNode(v,{slim:l.value,items:t.sidebarItems},null,8,["slim","items"])],2),e.createElementVNode("div",P,[e.createElementVNode("div",{class:e.normalizeClass(["content transition-all pt-[56px]",[l.value?"pl-[60px]":"pl-60"]])},[e.renderSlot(t.$slots,"default")],2)])])}}});exports.OneHeader=N;exports.OneMainLayout=R;exports.OneSidebar=v;

package/dist/layout/index.d.ts

@@ -0,0 +1,3 @@
+export { default as OneHeader } from './OneHeader.vue';
+export { default as OneSidebar } from './OneSidebar.vue';
+export { default as OneMainLayout } from './OneMainLayout.vue';

package/dist/layout/index.js

@@ -0,0 +1,228 @@
+import { openBlock as a, createElementBlock as l, defineComponent as h, resolveComponent as O, createBlock as u, normalizeClass as p, withCtx as L, createElementVNode as s, resolveDynamicComponent as $, createCommentVNode as d, toDisplayString as m, Fragment as q, renderList as B, ref as N, watch as A, computed as I, createVNode as c, unref as M, renderSlot as R } from "vue";
+import { _ as F } from "../_plugin-vue_export-helper-dad06003.js";
+import { c as P, b as V } from "../OneBrowserMenu.vue_vue_type_script_setup_true_lang-8d34213c.js";
+import "../common/index.js";
+const D = {};
+function E(r, t) {
+  return a(), l("div", null, " header ");
+}
+const ce = /* @__PURE__ */ F(D, [["render", E]]), j = {
+  items: {
+    required: !0,
+    type: Array
+  },
+  slim: {
+    type: Boolean,
+    default: !0
+  }
+}, z = {
+  route: {
+    required: !1,
+    type: [Object, String]
+  },
+  routeName: {
+    required: !1,
+    type: String
+  },
+  handler: {
+    required: !1,
+    type: Function,
+    default() {
+      return () => {
+      };
+    }
+  },
+  label: {
+    type: String,
+    required: !0
+  },
+  icon: {
+    type: [Function, Object]
+  },
+  exact: {
+    type: Boolean,
+    required: !1,
+    default: !1
+  },
+  slim: {
+    type: Boolean,
+    default: !0
+  }
+}, H = {
+  sidebarItems: j.items,
+  logoSrc: {
+    type: String
+  },
+  app: {
+    required: !0,
+    type: Object
+  },
+  user: {
+    type: Object,
+    required: !0
+  },
+  labels: {
+    type: Object
+  },
+  handlers: {
+    type: Object
+  }
+}, G = /* @__PURE__ */ h({
+  __name: "OneSidebarLink",
+  props: z,
+  setup(r) {
+    return (t, n) => {
+      const o = O("RouterLink");
+      return a(), u(o, {
+        to: t.routeName ? { name: t.routeName } : t.route,
+        class: p(["flex items-center w-full p-[8px] rounded-lg text-sm font-medium hover:bg-primary-10-hover hover:text-primary-base transition-all text-primary-content", [t.slim ? "w-[44px] h-[44px] justify-center" : "h-[44px] justify-start"]]),
+        "active-class": t.exact ? "" : "bg-primary-10 !text-primary-base",
+        "exact-active-class": t.exact ? "bg-primary-10 !text-primary-base" : "",
+        exact: t.exact
+      }, {
+        default: L(() => [
+          s("div", {
+            class: p(["flex flex-nowrap items-center", [t.slim ? "w-[24px] h-[24px]" : "w-full"]])
+          }, [
+            t.icon ? (a(), u($(t.icon), {
+              key: 0,
+              class: "w-[24px] h-[24px] flex-shrink-0"
+            })) : d("", !0),
+            s("div", {
+              class: p(["whitespace-nowrap overflow-hidden text-ellipsis transition-all text-left flex-shrink", [t.slim ? "w-0" : "pl-1.5 w-full"]])
+            }, m(t.label), 3)
+          ], 2)
+        ]),
+        _: 1
+      }, 8, ["to", "active-class", "exact-active-class", "exact", "class"]);
+    };
+  }
+}), J = { class: "" }, K = { class: "space-y-2 p-2" }, Q = /* @__PURE__ */ h({
+  __name: "OneSidebar",
+  props: j,
+  setup(r) {
+    return (t, n) => (a(), l("div", J, [
+      s("div", K, [
+        (a(!0), l(q, null, B(t.items, (o) => (a(), u(G, {
+          key: o.label,
+          icon: o.icon,
+          label: o.label,
+          route: o.route,
+          "route-name": o.routeName,
+          exact: o.exact || !1,
+          slim: t.slim
+        }, null, 8, ["icon", "label", "route", "route-name", "exact", "slim"]))), 128))
+      ])
+    ]));
+  }
+});
+function T(r, t) {
+  return a(), l("svg", {
+    xmlns: "http://www.w3.org/2000/svg",
+    fill: "none",
+    viewBox: "0 0 24 24",
+    "stroke-width": "1.8",
+    stroke: "currentColor",
+    "aria-hidden": "true"
+  }, [
+    s("path", {
+      "stroke-linecap": "round",
+      "stroke-linejoin": "round",
+      d: "M3.75 6.75h16.5M3.75 12h16.5m-16.5 5.25h16.5"
+    })
+  ]);
+}
+const U = { class: "min-h-screen relative" }, W = { class: "header h-[56px] flex items-center flex-nowrap absolute top-0 left-0 w-screen" }, X = { class: "p-2 flex-shrink-0" }, Y = { class: "w-10 h-10 bg-white rounded-lg border border-secondary-stroke flex items-center flex-shrink-0" }, Z = ["src"], ee = { class: "text-xs" }, te = { class: "w-full" }, se = { class: "w-full flex justify-end pr-2" }, oe = { class: "flex items-center space-x-1" }, ae = { class: "body w-full h-full" }, ue = /* @__PURE__ */ h({
+  __name: "OneMainLayout",
+  props: H,
+  setup(r) {
+    const t = r, n = N(window.localStorage.getItem("sidebar-slim") === "1");
+    A(n, (e) => {
+      window.localStorage.setItem("sidebar-slim", String(e ? 1 : 0));
+    });
+    const o = I(() => {
+      var e, i;
+      return {
+        name: ((e = t.app) == null ? void 0 : e.workspace) || "",
+        photo_url: ((i = t.app) == null ? void 0 : i.photo_url) || ""
+      };
+    });
+    return (e, i) => {
+      var f, b, w, v, y, g, _, x, k, S;
+      const C = O("RouterLink");
+      return a(), l("div", U, [
+        s("div", W, [
+          s("div", X, [
+            s("button", {
+              onClick: i[0] || (i[0] = (ne) => n.value = !n.value),
+              class: "w-[44px] h-[44px] p-[8px] flex items-center justify-center hover:text-secondary-content"
+            }, [
+              c(M(T), { class: "w-[24px] h-[24px]" })
+            ])
+          ]),
+          s("div", Y, [
+            e.logoSrc != null ? (a(), l("img", {
+              key: 0,
+              src: e.logoSrc,
+              class: "w-8 h-8 mx-auto",
+              alt: "logo"
+            }, null, 8, Z)) : d("", !0)
+          ]),
+          e.app != null ? (a(), u(C, {
+            key: 0,
+            to: "/",
+            class: "pl-2 max-w-xs"
+          }, {
+            default: L(() => [
+              s("div", null, m(e.app.name), 1),
+              s("div", ee, m(e.app.workspace), 1)
+            ]),
+            _: 1
+          })) : d("", !0),
+          s("div", te, [
+            s("div", se, [
+              s("div", oe, [
+                c(P, {
+                  workspace: o.value,
+                  apps: ((f = e.app) == null ? void 0 : f.apps) || [],
+                  "change-label": ((b = e.labels) == null ? void 0 : b.change) || "Change",
+                  "apps-title": ((w = e.labels) == null ? void 0 : w.apps) || "Apps",
+                  "on-app": (v = e.handlers) == null ? void 0 : v.onApp,
+                  "on-change": (y = e.handlers) == null ? void 0 : y.onChange,
+                  onOpen: (g = e.handlers) == null ? void 0 : g.onBrowse
+                }, null, 8, ["workspace", "apps", "change-label", "apps-title", "on-app", "on-change", "onOpen"]),
+                c(V, {
+                  user: e.user,
+                  "account-label": ((_ = e.labels) == null ? void 0 : _.account) || "Account",
+                  "logout-label": ((x = e.labels) == null ? void 0 : x.logout) || "Logout",
+                  "on-account": (k = e.handlers) == null ? void 0 : k.onAccount,
+                  "on-logout": (S = e.handlers) == null ? void 0 : S.onLogout
+                }, null, 8, ["user", "account-label", "logout-label", "on-account", "on-logout"])
+              ])
+            ])
+          ])
+        ]),
+        s("div", {
+          class: p(["sidebar transition-all absolute top-[56px] left-0 h-full", [n.value ? "w-[60px]" : "w-60"]])
+        }, [
+          c(Q, {
+            slim: n.value,
+            items: e.sidebarItems
+          }, null, 8, ["slim", "items"])
+        ], 2),
+        s("div", ae, [
+          s("div", {
+            class: p(["content transition-all pt-[56px]", [n.value ? "pl-[60px]" : "pl-60"]])
+          }, [
+            R(e.$slots, "default")
+          ], 2)
+        ])
+      ]);
+    };
+  }
+});
+export {
+  ce as OneHeader,
+  ue as OneMainLayout,
+  Q as OneSidebar
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oneb/ui-vue",
-  "version": "0.0.9",
+  "version": "0.0.10",
   "type": "module",
   "license": "MIT",
   "files": [
@@ -41,6 +41,10 @@
       "types": "./dist/common/index.d.ts",
       "import": "./dist/common/index.js"
     },
+    "./layout": {
+      "types": "./dist/layout/index.d.ts",
+      "import": "./dist/layout/index.js"
+    },
     "./icons": {
       "types": "./dist/icons/outline/index.d.ts",
       "import": "./dist/icons/outline/esm/index.js",