@veeqo/transfigure 0.0.21 → 0.0.23

package/dist/index9.js

@@ -1,40 +1,45 @@
-import { DATE_RANGE_OPTIONS as s, getDateRange as o, DateRanges as r } from "@veeqo/ui";
-import { BusinessLogicManager as n } from "./index8.js";
-const _ = ["due_date"], d = ["product_count"], i = "filter[search]", l = r.TODAY, u = o(l), c = s.find(
-  ({ value: e }) => e === l
-), E = "25", T = "1", A = "order", b = 200, p = [10, 25, 50, 100], L = "page[number]", D = "page[size]", S = ["order_id", "shipping_rates", "package", "action"], h = ["price"], F = "api/v2/orders", M = {
-  DATE_RANGE_FILTERS: _,
-  SEARCH_FILTER_ID: i,
-  NUMBER_RANGE_FILTERS: d,
-  DEFAULT_DATE_SELECTION: l,
-  DEFAULT_DATE_RANGE: u,
-  DEFAULT_DATE_PRESET: c,
-  DEFAULT_PAGE_SIZE: E,
-  DEFAULT_PAGE_NUMBER: T,
-  VIEW_TYPE: A,
+import { jsx as l } from "react/jsx-runtime";
+import { DATE_RANGE_OPTIONS as r, getDateRange as n, DateRanges as i } from "@veeqo/ui";
+import { BusinessLogicManager as _ } from "./index8.js";
+import { VeeqoCommon as t } from "@veeqo/components";
+const d = ["due_date"], u = ["product_count"], c = "filter[search]", o = i.TODAY, p = n(o), E = r.find(
+  ({ value: e }) => e === o
+), T = "25", A = "1", h = "order", b = 200, m = [10, 25, 50, 100], y = "page[number]", L = "page[size]", g = ["order_id", "shipping_rates", "package", "action"], f = ["price"], D = "api/v2/orders", S = {
+  DATE_RANGE_FILTERS: d,
+  SEARCH_FILTER_ID: c,
+  NUMBER_RANGE_FILTERS: u,
+  DEFAULT_DATE_SELECTION: o,
+  DEFAULT_DATE_RANGE: p,
+  DEFAULT_DATE_PRESET: E,
+  DEFAULT_PAGE_SIZE: T,
+  DEFAULT_PAGE_NUMBER: A,
+  VIEW_TYPE: h,
   FILTERS_DEBOUCE_INTERVAL_MS: b,
-  PAGE_SIZE_OPTIONS: p,
-  PAGE_NUMBER_FILTER_ID: L,
-  PAGE_SIZE_FILTER_ID: D,
-  DEFAULT_VISIBLE_COLUMNS: S,
-  DEFAULT_HIDDEN_COLUMNS: h,
-  TABLE_DATA_URL: F
-}, R = () => {
-  const e = /* @__PURE__ */ new Map(), t = /* @__PURE__ */ new Map();
+  PAGE_SIZE_OPTIONS: m,
+  PAGE_NUMBER_FILTER_ID: y,
+  PAGE_SIZE_FILTER_ID: L,
+  DEFAULT_VISIBLE_COLUMNS: g,
+  DEFAULT_HIDDEN_COLUMNS: f,
+  TABLE_DATA_URL: D
+}, F = () => {
+  const e = /* @__PURE__ */ new Map(), a = /* @__PURE__ */ new Map();
   return e.set("order_number", {
     id: "order_number",
     label: "Order number",
     filterType: "text",
-    isFilterAllowed: !0
-  }), t.set("order", {
+    isFilterAllowed: !0,
+    glyph: /* @__PURE__ */ l(t.Glyph, { name: "filter" })
+  }), a.set("order", {
     id: "order",
     label: "Order",
-    fields: [e.get("order_number")]
+    fields: [e.get("order_number")],
+    glyph: /* @__PURE__ */ l(t.Glyph, { name: "filter" })
   }), e.set("shoe_size", {
     id: "shoe_size",
     label: "Shoe size",
     filterType: "radio",
     isFilterAllowed: !0,
+    glyph: /* @__PURE__ */ l(t.Glyph, { name: "filter" }),
     options: [
       {
         label: "One",
@@ -57,30 +62,34 @@ const _ = ["due_date"], d = ["product_count"], i = "filter[search]", l = r.TODAY
         value: "5"
       }
     ]
-  }), t.set("shoe", {
+  }), a.set("shoe", {
     id: "shoe",
     label: "Shoe",
-    fields: [e.get("shoe_size")]
+    fields: [e.get("shoe_size")],
+    glyph: /* @__PURE__ */ l(t.Glyph, { name: "filter" })
   }), e.set("channel_id", {
     id: "channel_id",
     label: "Channel",
     filterType: "checkbox",
     isFilterAllowed: !0,
+    glyph: /* @__PURE__ */ l(t.Glyph, { name: "filter" }),
     fetchAsyncFilterOptions: {
       URL: "/channels",
       labelProperty: "name",
       valueProperty: "id",
       fetcher: "fetcherV1"
     }
-  }), t.set("channel", {
+  }), a.set("channel", {
     id: "channel",
     label: "Channel",
-    fields: [e.get("channel_id")]
+    fields: [e.get("channel_id")],
+    glyph: /* @__PURE__ */ l(t.Glyph, { name: "filter" })
   }), e.set("product_count", {
     id: "product_count",
     label: "Product count",
     filterType: "number_range",
     isFilterAllowed: !0,
+    glyph: /* @__PURE__ */ l(t.Glyph, { name: "filter" }),
     options: [
       {
         label: "Min",
@@ -91,15 +100,17 @@ const _ = ["due_date"], d = ["product_count"], i = "filter[search]", l = r.TODAY
         value: "100"
       }
     ]
-  }), t.set("product_count", {
+  }), a.set("product_count", {
     id: "product_count",
     label: "Product count",
-    fields: [e.get("product_count")]
+    fields: [e.get("product_count")],
+    glyph: /* @__PURE__ */ l(t.Glyph, { name: "filter" })
   }), e.set("due_date", {
     id: "due_date",
     label: "Due date",
     filterType: "date_range",
     isFilterAllowed: !0,
+    glyph: /* @__PURE__ */ l(t.Glyph, { name: "filter" }),
     options: [
       {
         label: "Today",
@@ -142,28 +153,31 @@ const _ = ["due_date"], d = ["product_count"], i = "filter[search]", l = r.TODAY
         value: "YEAR_TO_DATE"
       }
     ]
-  }), t.set("due", {
+  }), a.set("due", {
     id: "due",
     label: "Due",
-    fields: [e.get("due_date")]
+    fields: [e.get("due_date")],
+    glyph: /* @__PURE__ */ l(t.Glyph, { name: "filter" })
   }), e.set("max_products", {
     id: "max_products",
     label: "Max products",
     filterType: "number",
-    isFilterAllowed: !0
-  }), t.set("max_count", {
+    isFilterAllowed: !0,
+    glyph: /* @__PURE__ */ l(t.Glyph, { name: "filter" })
+  }), a.set("max_count", {
     id: "max_count",
     label: "Max count",
-    fields: [e.get("max_products")]
-  }), { FIELDS_MAP: e, GROUP_MAP: t };
+    fields: [e.get("max_products")],
+    glyph: /* @__PURE__ */ l(t.Glyph, { name: "filter" })
+  }), { FIELDS_MAP: e, GROUP_MAP: a };
 }, O = (e) => {
-  const t = R(), a = { ...M, ...t, ...e };
-  n.setBusinessLogic(a);
+  const a = F(), s = { ...S, ...a, ...e };
+  _.setBusinessLogic(s);
 };
 export {
-  _ as DATE_RANGE_FILTERS,
-  d as NUMBER_RANGE_FILTERS,
-  M as customAppBusinessLogic,
-  R as generateMockedFilterMaps,
+  d as DATE_RANGE_FILTERS,
+  u as NUMBER_RANGE_FILTERS,
+  S as customAppBusinessLogic,
+  F as generateMockedFilterMaps,
   O as setMockedBusinessLogic
 };

package/dist/index90.cjs

@@ -1 +1,80 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const d=(t,r)=>{if(!r)return t;const i=r.toLowerCase();return t.filter(e=>{var s,a;return((s=e==null?void 0:e.title)==null?void 0:s.toLowerCase().includes(i))||((a=e==null?void 0:e.id)==null?void 0:a.toLowerCase().includes(i))})};exports.filterColumnsBySearch=d;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("styled-components"),t=require("@veeqo/ui"),r=require("@veeqo/components"),l=require("framer-motion"),s=require("./index102.cjs"),c=e=>e&&e.__esModule?e:{default:e},o=c(a),{Glyph:i}=r.VeeqoCommon,d=o.default(l.motion(t.BaseContainer)).attrs(()=>({variants:s.notificationVariants,initial:"initial",animate:"animate",exit:"exit"}))`
+  display: flex;
+  position: fixed;
+  width: 100vw;
+  left: 0;
+  bottom: 24px;
+  z-index: 1001;
+
+  &.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;
+`,f=o.default(t.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: ${t.theme.shadows.lg};
+  pointer-events: all;
+`,p=o.default(t.Banner)`
+  display: inline-flex;
+  flex-direction: row;
+  align-items: center;
+  margin: 0 auto;
+  background-color: #fff;
+  box-shadow: ${t.theme.shadows.lg};
+  pointer-events: all;
+`,u=o.default(t.Button)`
+  margin-right: 16px;
+`,x=o.default(t.Text)`
+  line-height: 20px;
+`,n=o.default(t.Text)`
+  margin: ${e=>e.margin?e.margin:""};
+  color: ${e=>e.color};
+`,m=o.default(t.Text)`
+  margin-right: 8px;
+  color: ${e=>e.color};
+`,g=o.default(i)``,h=o.default(t.BaseContainer)`
+  display: flex;
+  flex-direction: row;
+  align-items: flex-end;
+  flex-grow: 2;
+  margin-left: 24px;
+  margin-right: 24px;
+`;o.default(t.AnimatedDropdown)``;const y=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: ${t.theme.colors.neutral.grey.lightest};
+  }
+
+  &:hover > ${n} {
+    color: ${t.theme.colors.secondary.blue.base};
+  }
+`;exports.Bold=m;exports.Button=u;exports.Container=f;exports.Glyph=g;exports.Hint=x;exports.Item=y;exports.Notification=d;exports.Pill=p;exports.Text=n;exports.UIGlyph=i;exports.Wrap=h;

package/dist/index90.js

@@ -1,13 +1,105 @@
-const a = (t, r) => {
-  if (!r) return t;
-  const i = r.toLowerCase();
-  return t.filter(
-    (e) => {
-      var s, C;
-      return ((s = e == null ? void 0 : e.title) == null ? void 0 : s.toLowerCase().includes(i)) || ((C = e == null ? void 0 : e.id) == null ? void 0 : C.toLowerCase().includes(i));
-    }
-  );
-};
+import t from "styled-components";
+import { BaseContainer as n, theme as i, Text as e, Banner as a, Button as s, AnimatedDropdown as l } from "@veeqo/ui";
+import { VeeqoCommon as c } from "@veeqo/components";
+import { motion as p } from "framer-motion";
+import { notificationVariants as x } from "./index102.js";
+const { Glyph: m } = c, u = t(p(n)).attrs(() => ({
+  variants: x,
+  initial: "initial",
+  animate: "animate",
+  exit: "exit"
+}))`
+  display: flex;
+  position: fixed;
+  width: 100vw;
+  left: 0;
+  bottom: 24px;
+  z-index: 1001;
+
+  &.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;
+`, y = t(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: ${i.shadows.lg};
+  pointer-events: all;
+`, $ = t(a)`
+  display: inline-flex;
+  flex-direction: row;
+  align-items: center;
+  margin: 0 auto;
+  background-color: #fff;
+  box-shadow: ${i.shadows.lg};
+  pointer-events: all;
+`, b = t(s)`
+  margin-right: 16px;
+`, v = t(e)`
+  line-height: 20px;
+`, r = t(e)`
+  margin: ${(o) => o.margin ? o.margin : ""};
+  color: ${(o) => o.color};
+`, B = t(e)`
+  margin-right: 8px;
+  color: ${(o) => o.color};
+`, k = t(m)``, C = t(n)`
+  display: flex;
+  flex-direction: row;
+  align-items: flex-end;
+  flex-grow: 2;
+  margin-left: 24px;
+  margin-right: 24px;
+`;
+t(l)``;
+const G = t.button`
+  display: flex;
+  flex-direction: row;
+  width: 100%;
+  padding: 12px 16px;
+  cursor: pointer;
+
+  & > ${r} {
+    white-space: nowrap;
+    user-select: none;
+  }
+
+  &:hover {
+    background-color: ${i.colors.neutral.grey.lightest};
+  }
+
+  &:hover > ${r} {
+    color: ${i.colors.secondary.blue.base};
+  }
+`;
 export {
-  a as filterColumnsBySearch
+  B as Bold,
+  b as Button,
+  y as Container,
+  k as Glyph,
+  v as Hint,
+  G as Item,
+  u as Notification,
+  $ as Pill,
+  r as Text,
+  m as UIGlyph,
+  C as Wrap
 };

package/dist/index91.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const d=require("react/jsx-runtime"),n=require("react"),l=require("./index108.cjs"),v=({children:i,style:o,className:c})=>{const r=n.useRef(null),[u,f]=n.useState(0);return n.useEffect(()=>{const e=r.current,s=()=>{if(e){const{top:a}=e.getBoundingClientRect();f(a)}};s();const t=new ResizeObserver(s);return e&&t.observe(e),()=>{e&&t.unobserve(e),t.disconnect()}},[]),d.jsx(l.AdaptiveStyledContainer,{style:o,className:c,offset:u,ref:r,children:i})};exports.AdaptiveHeightContainer=v;
+"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("./index103.cjs"),l=require("./index104.cjs"),c=require("./index94.cjs"),u=require("./index95.cjs"),d=require("./index92.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/index91.js

@@ -1,26 +1,15 @@
-import { jsx as p } from "react/jsx-runtime";
-import { useRef as a, useState as d, useEffect as m } from "react";
-import { AdaptiveStyledContainer as v } from "./index108.js";
-const R = ({
-  children: o,
-  style: s,
-  className: f
-}) => {
-  const r = a(null), [i, c] = d(0);
-  return m(() => {
-    const e = r.current, n = () => {
-      if (e) {
-        const { top: u } = e.getBoundingClientRect();
-        c(u);
-      }
-    };
-    n();
-    const t = new ResizeObserver(n);
-    return e && t.observe(e), () => {
-      e && t.unobserve(e), t.disconnect();
-    };
-  }, []), /* @__PURE__ */ p(v, { style: s, className: f, offset: i, ref: r, children: o });
-};
+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 "./index103.js";
+import { DroppableArea as d } from "./index104.js";
+import { ColumnItem as l } from "./index94.js";
+import { ColumnGroupIds as c } from "./index95.js";
+import { StickyText as f } from "./index92.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 {
-  R as AdaptiveHeightContainer
+  I as ColumnGroup
 };

package/dist/index92.cjs

@@ -1,19 +1,104 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("styled-components"),e=require("@veeqo/ui"),s=t=>t&&t.__esModule?t:{default:t},o=s(r),i=o.default(e.Button).attrs(()=>({role:"option",variant:"flat"}))`
-  margin: ${e.theme.sizes.xs};
-  min-width: 180px;
-  justify-content: flex-start;
-  font-size: ${e.theme.text.body.fontSize};
+"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 {
-    background-color: ${e.theme.colors.neutral.grey.lightest};
     color: ${e.theme.colors.secondary.blue.base};
-    cursor: pointer;
+    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;
   }
-`,n=o.default(e.Card.Surface).attrs(()=>({role:"listbox",elevation:4}))`
-  margin-top: ${e.theme.sizes.xs};
-  background-color: white;
-`,l=o.default.hr`
-  width: 100%;
-  border-top: 1px solid ${e.theme.colors.neutral.grey.dark};
-  margin: 0;
-`;exports.Divider=l;exports.Item=i;exports.MenuItems=n;
+`,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;