@veeqo/transfigure 0.0.6 → 0.0.7

package/dist/index60.js

@@ -1,8 +1,9 @@
-import h from "swr";
-import { fetcherV1 as B } from "./index51.js";
-const d = ({ type: e }) => {
+import { SWR_HOOK_OPTIONS as O } from "./index45.js";
+import S from "swr";
+import { fetcherV1 as h } from "./index51.js";
+const R = ({ type: e }) => {
   var o, t, i, n, r, m, u, c;
-  const { data: s, isLoading: _, isValidating: w, error: p, mutate: l } = h("/current_user", B), V = (t = (o = s == null ? void 0 : s.settings) == null ? void 0 : o.custom_view_positions) == null ? void 0 : t[e], f = (r = (n = (i = s == null ? void 0 : s.settings) == null ? void 0 : i.default_custom_views) == null ? void 0 : n[e]) == null ? void 0 : r.toString(), C = !!((m = s == null ? void 0 : s.permissions) != null && m.delete_company_custom_views), g = !!((u = s == null ? void 0 : s.permissions) != null && u.update_company_custom_views), v = !!((c = s == null ? void 0 : s.permissions) != null && c.share_custom_views);
+  const { data: s, isLoading: _, isValidating: p, error: w, mutate: l } = S("/current_user", h, O), V = (t = (o = s == null ? void 0 : s.settings) == null ? void 0 : o.custom_view_positions) == null ? void 0 : t[e], f = (r = (n = (i = s == null ? void 0 : s.settings) == null ? void 0 : i.default_custom_views) == null ? void 0 : n[e]) == null ? void 0 : r.toString(), C = !!((m = s == null ? void 0 : s.permissions) != null && m.delete_company_custom_views), g = !!((u = s == null ? void 0 : s.permissions) != null && u.update_company_custom_views), v = !!((c = s == null ? void 0 : s.permissions) != null && c.share_custom_views);
   return {
     canDeleteCustomViews: C,
     canUpdateCustomViews: g,
@@ -10,11 +11,11 @@ const d = ({ type: e }) => {
     orderedListOfCustomViews: V,
     defaultCustomViewId: f,
     isLoading: _,
-    isValidating: w,
-    error: p,
+    isValidating: p,
+    error: w,
     mutate: l
   };
 };
 export {
-  d as useCustomViews
+  R as useCustomViews
 };

package/dist/index77.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),t=require("@veeqo/ui"),a=require("react"),k=require("@veeqo/components"),S=require("./index80.cjs"),u=require("./index81.cjs"),T=require("./index82.cjs"),V=require("./index83.cjs"),s=require("./index84.cjs"),D=require("./index78.cjs"),H=require("./index85.cjs"),y=require("./index86.cjs"),O=require("./index57.cjs"),B=require("./index58.cjs"),{Glyph:X}=k.VeeqoCommon,Y=({onClose:r,columnDefintions:j,hiddenColumns:m,visibleColumns:h})=>{const[c,g]=a.useState(""),i=a.useMemo(()=>new Map(j.map(n=>[n.id,n])),[]),[l,p]=a.useState(()=>({[s.ColumnGroupIds.Hidden]:m,[s.ColumnGroupIds.Visible]:h})),v=a.useMemo(()=>{const n=l[s.ColumnGroupIds.Visible].map(o=>i.get(`${o}`));return y.filterColumnsBySearch(n,c)},[l,i,c]),f=a.useMemo(()=>{const n=l[s.ColumnGroupIds.Hidden].map(o=>i.get(`${o}`));return y.filterColumnsBySearch(n,c)},[l,i,c]),{Notifications:{notify:C}}=O.useStores(),{saveColumns:G}=H.usePersistColumns(),{mutate:q}=B.useViews(),[d,x]=a.useState(!1),w=()=>{g(""),p({[s.ColumnGroupIds.Hidden]:m,[s.ColumnGroupIds.Visible]:h})},M=async()=>{try{x(!0);const n=l[s.ColumnGroupIds.Visible];if(n.length<1){C({type:"error",text:"You must have at least one visible column."});return}await G({visibleColumns:n}),await q(),r==null||r()}catch{C({type:"error",text:"Failed to save columns"})}finally{x(!1)}},b=a.useCallback(n=>{g(n)},[]),I=a.useCallback(n=>{const o=i.get(`${n}`);return o?e.jsx(V.ColumnItem,{column:o,isDragOverlay:!0}):null},[i]);return e.jsx(t.Modal,{variant:"lg",style:{overflowY:"hidden"},shouldShow:!0,onClose:()=>r==null?void 0:r(),headerSlot:e.jsxs(u.HeaderContainer,{children:[e.jsxs(t.Stack,{direction:"horizontal",alignX:"between",alignY:"center",children:[e.jsxs(t.Stack,{direction:"horizontal",alignX:"start",alignY:"center",spacing:"sm",children:[e.jsx(D.TableManagementGlyph,{height:32,width:32}),e.jsx(t.Text,{variant:"headingLarge",as:"h1",children:"Table management"})]}),e.jsx(t.Button,{"aria-label":"Close modal",onClick:r,variant:"flat",iconSlot:e.jsx(X,{name:"close"})})]}),e.jsxs(t.Text,{variant:"subheadingMedium",children:["Show, hide, or change the order of the columns in the view, so you always see the data that's most important to you. Learn more with our"," ",e.jsx(t.Anchor,{href:"#",target:"_blank",children:"help guide (TODO)"}),"."]}),e.jsx(t.Text,{variant:"headingSmall",children:"Column management"}),e.jsx(u.ColumnSearch,{name:"column-search-query",placeholder:"Search",value:c,onChange:b,onClearClick:()=>b(""),fill:"100%"})]}),leftActions:[{label:"Reset",onClick:w,variant:"default",disabled:d}],rightActions:[{label:"Cancel",onClick:r,variant:"default",disabled:d},{label:"Save",onClick:M,variant:"primary",disabled:d,loading:d}],children:e.jsx(t.Stack,{spacing:"md",alignX:"stretch",children:e.jsx(t.Stack,{spacing:4,alignX:"stretch",children:e.jsx(T.DndContainer,{items:l,setItems:p,renderDragOverlay:I,children:e.jsx(u.Container,{children:e.jsxs(u.ColumnGroupsGrid,{columns:2,spacing:"xl",children:[e.jsx(S.ColumnGroup,{id:s.ColumnGroupIds.Visible,title:"Shown columns:",columns:v}),e.jsx(u.VerticalSeparator,{children:e.jsx(u.VerticalText,{children:"Drag & Drop columns"})}),e.jsx(S.ColumnGroup,{id:s.ColumnGroupIds.Hidden,title:"Hidden columns:",columns:f})]})})})})})})};exports.TableManagementModal=Y;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),r=require("@veeqo/ui"),a=require("react"),q=require("@veeqo/components"),x=require("./index79.cjs"),o=require("./index80.cjs"),M=require("./index81.cjs"),k=require("./index82.cjs"),t=require("./index83.cjs"),I=require("./index78.cjs"),T=require("./index84.cjs"),j=require("./index85.cjs"),{Glyph:w}=q.VeeqoCommon,D=({onClose:i,columnDefintions:S,hiddenColumns:h,visibleColumns:m})=>{const[c,g]=a.useState(""),s=a.useMemo(()=>new Map(S.map(n=>[n.id,n])),[]),[u,C]=a.useState(()=>({[t.ColumnGroupIds.Hidden]:h,[t.ColumnGroupIds.Visible]:m})),b=a.useMemo(()=>{const n=u[t.ColumnGroupIds.Visible].map(l=>s.get(`${l}`));return j.filterColumnsBySearch(n,c)},[u,s,c]),y=a.useMemo(()=>{const n=u[t.ColumnGroupIds.Hidden].map(l=>s.get(`${l}`));return j.filterColumnsBySearch(n,c)},[u,s,c]),{isSavingColumns:d,saveColumns:v}=T.usePersistColumns(),G=()=>{g(""),C({[t.ColumnGroupIds.Hidden]:h,[t.ColumnGroupIds.Visible]:m})},p=a.useCallback(n=>{g(n)},[]),f=a.useCallback(n=>{const l=s.get(`${n}`);return l?e.jsx(k.ColumnItem,{column:l,isDragOverlay:!0}):null},[s]);return e.jsx(r.Modal,{variant:"lg",style:{overflowY:"hidden"},shouldShow:!0,onClose:()=>i==null?void 0:i(),headerSlot:e.jsxs(o.HeaderContainer,{children:[e.jsxs(r.Stack,{direction:"horizontal",alignX:"between",alignY:"center",children:[e.jsxs(r.Stack,{direction:"horizontal",alignX:"start",alignY:"center",spacing:"sm",children:[e.jsx(I.TableManagementGlyph,{height:32,width:32}),e.jsx(r.Text,{variant:"headingLarge",as:"h1",children:"Table management"})]}),e.jsx(r.Button,{"aria-label":"Close modal",onClick:i,variant:"flat",iconSlot:e.jsx(w,{name:"close"})})]}),e.jsxs(r.Text,{variant:"subheadingMedium",children:["Show, hide, or change the order of the columns in the view, so you always see the data that's most important to you. Learn more with our"," ",e.jsx(r.Anchor,{href:"#",target:"_blank",children:"help guide (TODO)"}),"."]}),e.jsx(r.Text,{variant:"headingSmall",children:"Column management"}),e.jsx(o.ColumnSearch,{name:"column-search-query",placeholder:"Search",value:c,onChange:p,onClearClick:()=>p(""),fill:"100%"})]}),leftActions:[{label:"Reset",onClick:G,variant:"default",disabled:d}],rightActions:[{label:"Cancel",onClick:i,variant:"default",disabled:d},{label:"Save",onClick:()=>v({visibleColumns:m}),variant:"primary",disabled:d,loading:d}],children:e.jsx(r.Stack,{spacing:"md",alignX:"stretch",children:e.jsx(r.Stack,{spacing:4,alignX:"stretch",children:e.jsx(M.DndContainer,{items:u,setItems:C,renderDragOverlay:f,children:e.jsx(o.Container,{children:e.jsxs(o.ColumnGroupsGrid,{columns:2,spacing:"xl",children:[e.jsx(x.ColumnGroup,{id:t.ColumnGroupIds.Visible,title:"Shown columns:",columns:b}),e.jsx(o.VerticalSeparator,{children:e.jsx(o.VerticalText,{children:"Drag & Drop columns"})}),e.jsx(x.ColumnGroup,{id:t.ColumnGroupIds.Hidden,title:"Hidden columns:",columns:y})]})})})})})})};exports.TableManagementModal=D;

package/dist/index77.js

@@ -1,108 +1,88 @@
-import { jsx as e, jsxs as s } from "react/jsx-runtime";
-import { Modal as O, Stack as m, Text as d, Button as X, Anchor as Y } from "@veeqo/ui";
-import { useState as h, useMemo as u, useCallback as C } from "react";
-import { VeeqoCommon as A } from "@veeqo/components";
-import { ColumnGroup as w } from "./index80.js";
-import { Container as $, ColumnGroupsGrid as j, VerticalSeparator as q, VerticalText as z, HeaderContainer as B, ColumnSearch as L } from "./index81.js";
-import { DndContainer as Q } from "./index82.js";
-import { ColumnItem as R } from "./index83.js";
-import { ColumnGroupIds as n } from "./index84.js";
-import { TableManagementGlyph as F } from "./index78.js";
-import { usePersistColumns as N } from "./index85.js";
-import { filterColumnsBySearch as V } from "./index86.js";
-import { useStores as P } from "./index57.js";
-import { useViews as _ } from "./index58.js";
-const { Glyph: E } = A, ce = ({
-  onClose: a,
-  columnDefintions: k,
-  hiddenColumns: p,
-  visibleColumns: g
+import { jsx as e, jsxs as c } from "react/jsx-runtime";
+import { Modal as G, Stack as m, Text as h, Button as H, Anchor as T } from "@veeqo/ui";
+import { useState as b, useMemo as u, useCallback as S } from "react";
+import { VeeqoCommon as O } from "@veeqo/components";
+import { ColumnGroup as v } from "./index79.js";
+import { Container as X, ColumnGroupsGrid as A, VerticalSeparator as I, VerticalText as Y, HeaderContainer as $, ColumnSearch as j } from "./index80.js";
+import { DndContainer as q } from "./index81.js";
+import { ColumnItem as z } from "./index82.js";
+import { ColumnGroupIds as r } from "./index83.js";
+import { TableManagementGlyph as B } from "./index78.js";
+import { usePersistColumns as L } from "./index84.js";
+import { filterColumnsBySearch as y } from "./index85.js";
+const { Glyph: Q } = O, ne = ({
+  onClose: i,
+  columnDefintions: w,
+  hiddenColumns: g,
+  visibleColumns: d
 }) => {
-  const [o, f] = h(""), i = u(
-    () => new Map(k.map((t) => [t.id, t])),
+  const [l, p] = b(""), a = u(
+    () => new Map(w.map((n) => [n.id, n])),
     []
-  ), [r, b] = h(() => ({
-    [n.Hidden]: p,
-    [n.Visible]: g
-  })), x = u(() => {
-    const t = r[n.Visible].map((l) => i.get(`${l}`));
-    return V(t, o);
-  }, [r, i, o]), D = u(() => {
-    const t = r[n.Hidden].map((l) => i.get(`${l}`));
-    return V(t, o);
-  }, [r, i, o]), {
-    Notifications: { notify: v }
-  } = P(), { saveColumns: M } = N(), { mutate: G } = _(), [c, y] = h(!1), H = () => {
-    f(""), b({
-      [n.Hidden]: p,
-      [n.Visible]: g
+  ), [o, f] = b(() => ({
+    [r.Hidden]: g,
+    [r.Visible]: d
+  })), k = u(() => {
+    const n = o[r.Visible].map((t) => a.get(`${t}`));
+    return y(n, l);
+  }, [o, a, l]), D = u(() => {
+    const n = o[r.Hidden].map((t) => a.get(`${t}`));
+    return y(n, l);
+  }, [o, a, l]), { isSavingColumns: s, saveColumns: M } = L(), V = () => {
+    p(""), f({
+      [r.Hidden]: g,
+      [r.Visible]: d
     });
-  }, T = async () => {
-    try {
-      y(!0);
-      const t = r[n.Visible];
-      if (t.length < 1) {
-        v({ type: "error", text: "You must have at least one visible column." });
-        return;
-      }
-      await M({
-        visibleColumns: t
-      }), await G(), a == null || a();
-    } catch {
-      v({ type: "error", text: "Failed to save columns" });
-    } finally {
-      y(!1);
-    }
-  }, S = C(
-    (t) => {
-      f(t);
+  }, C = S(
+    (n) => {
+      p(n);
     },
     []
-  ), I = C(
-    (t) => {
-      const l = i.get(`${t}`);
-      return l ? /* @__PURE__ */ e(R, { column: l, isDragOverlay: !0 }) : null;
+  ), x = S(
+    (n) => {
+      const t = a.get(`${n}`);
+      return t ? /* @__PURE__ */ e(z, { column: t, isDragOverlay: !0 }) : null;
     },
-    [i]
+    [a]
   );
   return /* @__PURE__ */ e(
-    O,
+    G,
     {
       variant: "lg",
       style: { overflowY: "hidden" },
       shouldShow: !0,
-      onClose: () => a == null ? void 0 : a(),
-      headerSlot: /* @__PURE__ */ s(B, { children: [
-        /* @__PURE__ */ s(m, { direction: "horizontal", alignX: "between", alignY: "center", children: [
-          /* @__PURE__ */ s(m, { direction: "horizontal", alignX: "start", alignY: "center", spacing: "sm", children: [
-            /* @__PURE__ */ e(F, { height: 32, width: 32 }),
-            /* @__PURE__ */ e(d, { variant: "headingLarge", as: "h1", children: "Table management" })
+      onClose: () => i == null ? void 0 : i(),
+      headerSlot: /* @__PURE__ */ c($, { children: [
+        /* @__PURE__ */ c(m, { direction: "horizontal", alignX: "between", alignY: "center", children: [
+          /* @__PURE__ */ c(m, { direction: "horizontal", alignX: "start", alignY: "center", spacing: "sm", children: [
+            /* @__PURE__ */ e(B, { height: 32, width: 32 }),
+            /* @__PURE__ */ e(h, { variant: "headingLarge", as: "h1", children: "Table management" })
           ] }),
           /* @__PURE__ */ e(
-            X,
+            H,
             {
               "aria-label": "Close modal",
-              onClick: a,
+              onClick: i,
               variant: "flat",
-              iconSlot: /* @__PURE__ */ e(E, { name: "close" })
+              iconSlot: /* @__PURE__ */ e(Q, { name: "close" })
             }
           )
         ] }),
-        /* @__PURE__ */ s(d, { variant: "subheadingMedium", children: [
+        /* @__PURE__ */ c(h, { variant: "subheadingMedium", children: [
           "Show, hide, or change the order of the columns in the view, so you always see the data that's most important to you. Learn more with our",
           " ",
-          /* @__PURE__ */ e(Y, { href: "#", target: "_blank", children: "help guide (TODO)" }),
+          /* @__PURE__ */ e(T, { href: "#", target: "_blank", children: "help guide (TODO)" }),
           "."
         ] }),
-        /* @__PURE__ */ e(d, { variant: "headingSmall", children: "Column management" }),
+        /* @__PURE__ */ e(h, { variant: "headingSmall", children: "Column management" }),
         /* @__PURE__ */ e(
-          L,
+          j,
           {
             name: "column-search-query",
             placeholder: "Search",
-            value: o,
-            onChange: S,
-            onClearClick: () => S(""),
+            value: l,
+            onChange: C,
+            onClearClick: () => C(""),
             fill: "100%"
           }
         )
@@ -110,40 +90,40 @@ const { Glyph: E } = A, ce = ({
       leftActions: [
         {
           label: "Reset",
-          onClick: H,
+          onClick: V,
           variant: "default",
-          disabled: c
+          disabled: s
         }
       ],
       rightActions: [
         {
           label: "Cancel",
-          onClick: a,
+          onClick: i,
           variant: "default",
-          disabled: c
+          disabled: s
         },
         {
           label: "Save",
-          onClick: T,
+          onClick: () => M({ visibleColumns: d }),
           variant: "primary",
-          disabled: c,
-          loading: c
+          disabled: s,
+          loading: s
         }
       ],
-      children: /* @__PURE__ */ e(m, { spacing: "md", alignX: "stretch", children: /* @__PURE__ */ e(m, { spacing: 4, alignX: "stretch", children: /* @__PURE__ */ e(Q, { items: r, setItems: b, renderDragOverlay: I, children: /* @__PURE__ */ e($, { children: /* @__PURE__ */ s(j, { columns: 2, spacing: "xl", children: [
+      children: /* @__PURE__ */ e(m, { spacing: "md", alignX: "stretch", children: /* @__PURE__ */ e(m, { spacing: 4, alignX: "stretch", children: /* @__PURE__ */ e(q, { items: o, setItems: f, renderDragOverlay: x, children: /* @__PURE__ */ e(X, { children: /* @__PURE__ */ c(A, { columns: 2, spacing: "xl", children: [
         /* @__PURE__ */ e(
-          w,
+          v,
           {
-            id: n.Visible,
+            id: r.Visible,
             title: "Shown columns:",
-            columns: x
+            columns: k
           }
         ),
-        /* @__PURE__ */ e(q, { children: /* @__PURE__ */ e(z, { children: "Drag & Drop columns" }) }),
+        /* @__PURE__ */ e(I, { children: /* @__PURE__ */ e(Y, { children: "Drag & Drop columns" }) }),
         /* @__PURE__ */ e(
-          w,
+          v,
           {
-            id: n.Hidden,
+            id: r.Hidden,
             title: "Hidden columns:",
             columns: D
           }
@@ -153,5 +133,5 @@ const { Glyph: E } = A, ce = ({
   );
 };
 export {
-  ce as TableManagementModal
+  ne as TableManagementModal
 };

package/dist/index79.cjs

@@ -1,80 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("styled-components"),e=require("@veeqo/ui"),a=require("@veeqo/components"),r=t=>t&&t.__esModule?t:{default:t},o=r(i),{Glyph:l}=a.VeeqoCommon,s=o.default(e.BaseContainer)`
-  display: flex;
-  position: fixed;
-  width: 100vw;
-  left: 0;
-  bottom: 24px;
-  z-index: 18;
-
-  &.notification-enter {
-    opacity: 0;
-    transform: translateY(-16px);
-  }
-
-  &.notification-enter-active {
-    opacity: 1;
-    transform: translateY(0);
-    transition: 350ms ease;
-  }
-
-  &.notification-exit {
-    opacity: 0;
-    transform: translateY(16px);
-    transition: 350ms ease;
-  }
-  pointer-events: none;
-`,c=o.default(e.BaseContainer)`
-  display: inline-flex;
-  flex-direction: row;
-  align-items: center;
-  padding: 20px 24px 24px 24px;
-  border-radius: 4px;
-  margin: 0 auto;
-  background-color: #fff;
-  box-shadow: ${e.theme.shadows.lg};
-  pointer-events: all;
-`;o.default(e.Banner)`
-  display: inline-flex;
-  flex-direction: row;
-  align-items: center;
-  margin: 0 auto;
-  background-color: #fff;
-  box-shadow: ${e.theme.shadows.lg};
-  pointer-events: all;
-`;const d=o.default(e.Button)`
-  margin-right: 16px;
-`;o.default(e.Text)`
-  line-height: 20px;
-`;const n=o.default(e.Text)`
-  margin: ${t=>t.margin?t.margin:""};
-  color: ${t=>t.color};
-`,f=o.default(e.Text)`
-  margin-right: 8px;
-  color: ${t=>t.color};
-`,p=o.default(l)``,x=o.default(e.BaseContainer)`
-  display: flex;
-  flex-direction: row;
-  align-items: flex-end;
-  flex-grow: 2;
-  margin-left: 24px;
-  margin-right: 24px;
-`,u=o.default.button`
-  display: flex;
-  flex-direction: row;
-  width: 100%;
-  padding: 12px 16px;
-  cursor: pointer;
-
-  & > ${n} {
-    white-space: nowrap;
-    user-select: none;
-  }
-
-  &:hover {
-    background-color: ${e.theme.colors.neutral.grey.lightest};
-  }
-
-  &:hover > ${n} {
-    color: ${e.theme.colors.secondary.blue.base};
-  }
-`;exports.Bold=f;exports.Button=d;exports.Container=c;exports.Glyph=p;exports.Item=u;exports.Notification=s;exports.Text=n;exports.Wrap=x;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),o=require("@veeqo/ui"),s=require("@dnd-kit/sortable"),a=require("./index94.cjs"),l=require("./index95.cjs"),c=require("./index82.cjs"),u=require("./index83.cjs"),d=require("./index80.cjs"),m=({id:r,title:n,columns:i})=>e.jsxs(o.Stack,{spacing:"sm",alignX:"stretch",children:[e.jsx(d.StickyText,{variant:"bodyBold",children:n}),e.jsx(s.SortableContext,{id:r,items:i,strategy:s.verticalListSortingStrategy,children:e.jsx(l.DroppableArea,{id:r,spacing:"sm",alignX:"stretch",children:i.map(t=>e.jsx(a.SortableItem,{id:t.id,children:e.jsx(c.ColumnItem,{column:t,isHidden:r===u.ColumnGroupIds.Hidden})},t.id))})})]});exports.ColumnGroup=m;

package/dist/index79.js

@@ -1,97 +1,15 @@
-import o from "styled-components";
-import { BaseContainer as n, theme as e, Text as i, Button as a, Banner as l } from "@veeqo/ui";
-import { VeeqoCommon as s } from "@veeqo/components";
-const { Glyph: c } = s, f = o(n)`
-  display: flex;
-  position: fixed;
-  width: 100vw;
-  left: 0;
-  bottom: 24px;
-  z-index: 18;
-
-  &.notification-enter {
-    opacity: 0;
-    transform: translateY(-16px);
-  }
-
-  &.notification-enter-active {
-    opacity: 1;
-    transform: translateY(0);
-    transition: 350ms ease;
-  }
-
-  &.notification-exit {
-    opacity: 0;
-    transform: translateY(16px);
-    transition: 350ms ease;
-  }
-  pointer-events: none;
-`, m = o(n)`
-  display: inline-flex;
-  flex-direction: row;
-  align-items: center;
-  padding: 20px 24px 24px 24px;
-  border-radius: 4px;
-  margin: 0 auto;
-  background-color: #fff;
-  box-shadow: ${e.shadows.lg};
-  pointer-events: all;
-`;
-o(l)`
-  display: inline-flex;
-  flex-direction: row;
-  align-items: center;
-  margin: 0 auto;
-  background-color: #fff;
-  box-shadow: ${e.shadows.lg};
-  pointer-events: all;
-`;
-const g = o(a)`
-  margin-right: 16px;
-`;
-o(i)`
-  line-height: 20px;
-`;
-const r = o(i)`
-  margin: ${(t) => t.margin ? t.margin : ""};
-  color: ${(t) => t.color};
-`, h = o(i)`
-  margin-right: 8px;
-  color: ${(t) => t.color};
-`, u = o(c)``, w = o(n)`
-  display: flex;
-  flex-direction: row;
-  align-items: flex-end;
-  flex-grow: 2;
-  margin-left: 24px;
-  margin-right: 24px;
-`, y = o.button`
-  display: flex;
-  flex-direction: row;
-  width: 100%;
-  padding: 12px 16px;
-  cursor: pointer;
-
-  & > ${r} {
-    white-space: nowrap;
-    user-select: none;
-  }
-
-  &:hover {
-    background-color: ${e.colors.neutral.grey.lightest};
-  }
-
-  &:hover > ${r} {
-    color: ${e.colors.secondary.blue.base};
-  }
-`;
+import { jsxs as m, jsx as r } from "react/jsx-runtime";
+import { Stack as n } from "@veeqo/ui";
+import { SortableContext as p, verticalListSortingStrategy as a } from "@dnd-kit/sortable";
+import { SortableItem as s } from "./index94.js";
+import { DroppableArea as d } from "./index95.js";
+import { ColumnItem as l } from "./index82.js";
+import { ColumnGroupIds as c } from "./index83.js";
+import { StickyText as f } from "./index80.js";
+const I = ({ id: t, title: e, columns: o }) => /* @__PURE__ */ m(n, { spacing: "sm", alignX: "stretch", children: [
+  /* @__PURE__ */ r(f, { variant: "bodyBold", children: e }),
+  /* @__PURE__ */ r(p, { id: t, items: o, strategy: a, children: /* @__PURE__ */ r(d, { id: t, spacing: "sm", alignX: "stretch", children: o.map((i) => /* @__PURE__ */ r(s, { id: i.id, children: /* @__PURE__ */ r(l, { column: i, isHidden: t === c.Hidden }) }, i.id)) }) })
+] });
 export {
-  h as Bold,
-  g as Button,
-  m as Container,
-  u as Glyph,
-  y as Item,
-  f as Notification,
-  r as Text,
-  w as Wrap
+  I as ColumnGroup
 };

package/dist/index80.cjs

@@ -1 +1,104 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),o=require("@veeqo/ui"),s=require("@dnd-kit/sortable"),a=require("./index94.cjs"),l=require("./index95.cjs"),c=require("./index83.cjs"),u=require("./index84.cjs"),d=require("./index81.cjs"),m=({id:r,title:n,columns:i})=>e.jsxs(o.Stack,{spacing:"sm",alignX:"stretch",children:[e.jsx(d.StickyText,{variant:"bodyBold",children:n}),e.jsx(s.SortableContext,{id:r,items:i,strategy:s.verticalListSortingStrategy,children:e.jsx(l.DroppableArea,{id:r,spacing:"sm",alignX:"stretch",children:i.map(t=>e.jsx(a.SortableItem,{id:t.id,children:e.jsx(c.ColumnItem,{column:t,isHidden:r===u.ColumnGroupIds.Hidden})},t.id))})})]});exports.ColumnGroup=m;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("styled-components"),e=require("@veeqo/ui"),a=require("@veeqo/components"),i=o=>o&&o.__esModule?o:{default:o},t=i(l),{Glyph:n}=a.VeeqoCommon,s=t.default.div`
+  width: 1px;
+  position: absolute;
+  left: 50%;
+  transform: translateX(-50%);
+  border-left: 1px solid ${e.theme.colors.neutral.grey.dark};
+  height: 100%;
+  margin-top: 40px;
+`,c=t.default(e.Text)`
+  writing-mode: vertical-rl;
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
+  background: white;
+  padding: 30px 0;
+  text-align: center;
+  font-size: 10px;
+  color: ${e.theme.colors.neutral.ink.lightest};
+  height: max-content;
+`,d=t.default(e.Text)`
+  position: sticky;
+  top: 0;
+  background: #ffffff;
+  padding-bottom: ${e.theme.sizes[2]};
+  z-index: 1;
+`,u=t.default(e.Text)`
+  color: ${e.theme.colors.neutral.ink.light};
+`,g=t.default(e.Grid)`
+  // overflow-y: auto;
+  position: unset;
+`,r=t.default(n).attrs(()=>({name:"visibility-off"}))`
+  margin-left: auto;
+`,p=t.default(e.Stack)`
+  border-radius: 4px;
+  padding: 8px 12px;
+  background: #ffffff;
+  border: 1px solid ${e.theme.colors.neutral.ink.lightest};
+  transition: all ease 200ms;
+
+  ${({isHidden:o})=>o&&`
+      ${e.Text} {
+        color: ${e.theme.colors.neutral.ink.light};
+      }
+    `}
+
+  &:hover {
+    color: ${e.theme.colors.secondary.blue.base};
+    background: ${e.theme.colors.neutral.grey.lightest};
+    border: 1px solid ${e.theme.colors.neutral.grey.light};
+
+    ${e.Text} {
+      color: ${e.theme.colors.secondary.blue.base};
+    }
+
+    ${r} {
+      color: ${e.theme.colors.neutral.ink.light};
+    }
+  }
+
+  ${({isDragOverlay:o})=>o&&`
+      color: ${e.theme.colors.secondary.blue.base};
+      background: ${e.theme.colors.neutral.grey.lightest};
+      border: 1px solid ${e.theme.colors.neutral.grey.light};
+      cursor: grabbing;
+
+      ${e.Text} {
+        color: ${e.theme.colors.secondary.blue.base};
+      }
+    `}
+`,h=t.default.div`
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  height: 100%;
+  width: calc(100% - 2px);
+  border-radius: 4px;
+  border: 1px dashed ${e.theme.colors.neutral.grey.dark};
+  background: ${e.theme.colors.neutral.grey.lightest};
+`,f=t.default(e.Stack)`
+  flex: 1;
+  padding: 0;
+`,m=t.default(e.Search)`
+  input {
+    height: 40px;
+    box-sizing: border-box;
+  }
+
+  svg {
+    width: 16px;
+  }
+`,b=t.default.div`
+  position: relative;
+  min-height: 500px;
+`,x=t.default(e.BaseContainer)`
+  display: flex;
+  flex-direction: column;
+  gap: ${e.theme.sizes.base};
+  padding: ${e.theme.sizes.md};
+`,y=t.default.dialog`
+  display: contents;
+`;exports.ColumnGroupsGrid=g;exports.ColumnItemWrapper=p;exports.ColumnSearch=m;exports.Container=b;exports.DetailedText=u;exports.DndDragOverlayDialog=y;exports.DraggingOverlay=h;exports.DroppableAreaStack=f;exports.HeaderContainer=x;exports.StickyText=d;exports.VerticalSeparator=s;exports.VerticalText=c;exports.VisibilityOffIcon=r;