gd-design-library 0.3.3 → 0.3.5

package/tokens/rating.js

@@ -1 +1,73 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("../utils/helpers.js");require("react");const e=require("../types/common.js"),r=require("./cursors.js"),i=require("./display.js"),a=require("./values.js"),s={default:{display:i.display.inlineFlex,gap:0,position:"relative",overflow:"hidden"},progress:{default:{position:"absolute",display:i.display.flex,overflow:"hidden",left:0,svg:{flexShrink:0,flexGrow:0}}},radioInput:{default:{display:i.display.none}},label:{default:{cursor:r.cursors.pointer},active:{"&:hover":{transform:"scale(1.2)",transition:t.get(a.values,"transitions.rating.label")}},readOnly:{cursor:r.cursors.default}},size:{[e.SizeVariant.Sm]:{width:12,height:12},[e.SizeVariant.Md]:{width:24,height:24},[e.SizeVariant.Lg]:{width:48,height:48},[e.SizeVariant.Xl]:{width:60,height:60}},icons:{rateActive:{name:"star"},rateInactive:{name:"starOutlined"}}};exports.rating=s;
+import { cursors as i } from "./cursors.js";
+import { display as e } from "./display.js";
+import { values as r } from "./values.js";
+import { get as o } from "../utils/helpers.js";
+import { SizeVariant as t } from "../types/common.js";
+const f = {
+  default: {
+    display: e.inlineFlex,
+    gap: 0,
+    position: "relative",
+    overflow: "hidden"
+  },
+  progress: {
+    default: {
+      position: "absolute",
+      display: e.flex,
+      overflow: "hidden",
+      left: 0,
+      svg: {
+        flexShrink: 0,
+        flexGrow: 0
+      }
+    }
+  },
+  radioInput: {
+    default: {
+      display: e.none
+    }
+  },
+  label: {
+    default: {
+      cursor: i.pointer
+    },
+    active: {
+      "&:hover": {
+        transform: "scale(1.2)",
+        transition: o(r, "transitions.rating.label")
+      }
+    },
+    readOnly: {
+      cursor: i.default
+    }
+  },
+  size: {
+    [t.Sm]: {
+      width: 12,
+      height: 12
+    },
+    [t.Md]: {
+      width: 24,
+      height: 24
+    },
+    [t.Lg]: {
+      width: 48,
+      height: 48
+    },
+    [t.Xl]: {
+      width: 60,
+      height: 60
+    }
+  },
+  icons: {
+    rateActive: {
+      name: "star"
+    },
+    rateInactive: {
+      name: "starOutlined"
+    }
+  }
+};
+export {
+  f as rating
+};

package/tokens/reset.js

@@ -1 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});;/* empty css           */const e={};exports.reset=e;
+const e = {};
+export {
+  e as reset
+};

package/tokens/row.js

@@ -1 +1,8 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e={default:{display:"flex"}};exports.row=e;
+const e = {
+  default: {
+    display: "flex"
+  }
+};
+export {
+  e as row
+};

package/tokens/scroll.js

@@ -1 +1,99 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("../constants/positioning.js"),n=require("./colors.js"),r=require("./display.js"),e=require("./spacing.js"),o=require("./values.js"),t=8,l={container:{default:{position:"relative",display:r.display.flex,overflow:"auto",isolation:"isolate",maxBlockSize:"100%","&::-webkit-scrollbar, &::-webkit-scrollbar-thumb":{background:"transparent",width:"0",height:"0"}}},content:{default:{position:"relative",zIndex:i.Z_INDEX.ZERO,flex:1,flexBasis:"auto",height:"max-content"}},scrollbars:{default:{position:"sticky",top:"0",left:"0",zIndex:i.Z_INDEX.FIRST,minWidth:"calc(100% - 1px)",minHeight:"calc(100% - 1px)",maxWidth:"calc(100% - 1px)",maxHeight:"calc(100% - 1px)",float:"left",marginRight:"calc(-100% + 1px)",marginInlineStart:"0",marginInlineEnd:"calc(-100% + 1px)",pointerEvents:"none"}},scrollbar:{default:{position:"absolute",pointerEvents:"auto",opacity:.2,transition:o.values.transitions.scroll.scrollbar,"&:hover":{opacity:1}},vertical:{right:0,bottom:`${t}px`,top:0,width:`${t}px`},horizontal:{left:0,bottom:0,right:`${t}px`,height:`${t}px`}},thumb:{default:{position:"absolute",cursor:"pointer",pointerEvents:"auto",background:n.colors.neutral["grey.80"],backgroundClip:"content-box",boxSizing:"border-box"},vertical:{right:0,bottom:0,top:0,width:`${t}px`,minHeight:e.spacing.md,transition:o.values.transitions.scroll.thumb},horizontal:{left:0,right:0,bottom:0,height:`${t}px`,minWidth:e.spacing.md,transition:o.values.transitions.scroll.thumb}}};exports.scroll=l;
+import { colors as n } from "./colors.js";
+import { display as a } from "./display.js";
+import { spacing as i } from "./spacing.js";
+import { values as o } from "./values.js";
+import { Z_INDEX as r } from "../constants/positioning.js";
+const t = 8, m = {
+  container: {
+    default: {
+      position: "relative",
+      display: a.flex,
+      overflow: "auto",
+      isolation: "isolate",
+      maxBlockSize: "100%",
+      "&::-webkit-scrollbar, &::-webkit-scrollbar-thumb": {
+        background: "transparent",
+        width: "0",
+        height: "0"
+      }
+    }
+  },
+  content: {
+    default: {
+      position: "relative",
+      zIndex: r.ZERO,
+      flex: 1,
+      flexBasis: "auto",
+      height: "max-content"
+    }
+  },
+  scrollbars: {
+    default: {
+      position: "sticky",
+      top: "0",
+      left: "0",
+      zIndex: r.FIRST,
+      minWidth: "calc(100% - 1px)",
+      minHeight: "calc(100% - 1px)",
+      maxWidth: "calc(100% - 1px)",
+      maxHeight: "calc(100% - 1px)",
+      float: "left",
+      marginRight: "calc(-100% + 1px)",
+      marginInlineStart: "0",
+      marginInlineEnd: "calc(-100% + 1px)",
+      pointerEvents: "none"
+    }
+  },
+  scrollbar: {
+    default: {
+      position: "absolute",
+      pointerEvents: "auto",
+      opacity: 0.2,
+      transition: o.transitions.scroll.scrollbar,
+      "&:hover": {
+        opacity: 1
+      }
+    },
+    vertical: {
+      right: 0,
+      bottom: `${t}px`,
+      top: 0,
+      width: `${t}px`
+    },
+    horizontal: {
+      left: 0,
+      bottom: 0,
+      right: `${t}px`,
+      height: `${t}px`
+    }
+  },
+  thumb: {
+    default: {
+      position: "absolute",
+      cursor: "pointer",
+      pointerEvents: "auto",
+      background: n.neutral["grey.80"],
+      backgroundClip: "content-box",
+      boxSizing: "border-box"
+    },
+    vertical: {
+      right: 0,
+      bottom: 0,
+      top: 0,
+      width: `${t}px`,
+      minHeight: i.md,
+      transition: o.transitions.scroll.thumb
+    },
+    horizontal: {
+      left: 0,
+      right: 0,
+      bottom: 0,
+      height: `${t}px`,
+      minWidth: i.md,
+      transition: o.transitions.scroll.thumb
+    }
+  }
+};
+export {
+  m as scroll
+};

package/tokens/search.js

@@ -1 +1,45 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("./spacing.js"),r=require("./colors.js"),i=require("./display.js"),n={default:{},input:{default:{width:"100%",boxSizing:"border-box"}},dropdownHeader:{row:{},link:{default:{},typography:{}},icon:{}},renderer:{row:{width:"100%",padding:`${e.spacing.md} ${e.spacing.md} 0`},link:{display:i.display.flex,alignItems:i.flexAlignItems.center,"&:after":{borderBottom:"none"},"& svg":{marginLeft:e.spacing.md}},linkIcon:{fill:r.colors.icon.primary.active,name:"arrowRight",width:10,height:10}}};exports.search=n;
+import { spacing as r } from "./spacing.js";
+import { colors as i } from "./colors.js";
+import { flexAlignItems as o, display as e } from "./display.js";
+const a = {
+  default: {},
+  input: {
+    default: {
+      width: "100%",
+      boxSizing: "border-box"
+    }
+  },
+  dropdownHeader: {
+    row: {},
+    link: {
+      default: {},
+      typography: {}
+    },
+    icon: {}
+  },
+  renderer: {
+    row: {
+      width: "100%",
+      padding: `${r.md} ${r.md} 0`
+    },
+    link: {
+      display: e.flex,
+      alignItems: o.center,
+      "&:after": {
+        borderBottom: "none"
+      },
+      "& svg": {
+        marginLeft: r.md
+      }
+    },
+    linkIcon: {
+      fill: i.icon.primary.active,
+      name: "arrowRight",
+      width: 10,
+      height: 10
+    }
+  }
+};
+export {
+  a as search
+};

package/tokens/searchModal.js

@@ -1 +1,159 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const p=require("../utils/helpers.js");require("react");const s=require("../utils/layout.js"),n=require("../types/common.js"),o=require("../types/typography.js"),r=require("../types/layout.js"),c=require("../types/button.js"),e=require("./utils.js"),a=require("./typography.js"),l=require("./icon.js"),t=require("./display.js"),g=require("./cursors.js"),d=require("./font.js"),i=require("./colors.js"),u={default:{},wrapper:{padding:`${e.getSpacing(4)} ${e.getSpacing(3)}`,overflowY:"auto"},input:{default:{'& input[type="search"]':{padding:`${e.getSpacing(3)} 0 ${e.getSpacing(3)} ${e.getSpacing(7)}`,height:"54px",fontSize:d.font.size[o.TypographyVariant.Body2],"&::placeholder":{color:p.get(i.colors,["neutral","grey.60"])},"&::-webkit-search-cancel-button":{appearance:t.display.none},"&::-ms-clear":{display:t.display.none}}},endIcon:{margin:`0 ${e.getSpacing(3)} 0 0`,padding:e.getSpacing(2),cursor:g.cursors.pointer},icons:{close:{name:"cross",width:12,height:12}}},loader:{default:{display:t.display.flex,flexDirection:r.FlexDirection.Column,gap:e.getSpacing(2)}},items:{default:{display:t.display.flex,flexDirection:r.FlexDirection.Column},newSearchBtn:{styles:{textAlign:"left",color:i.colors.text.default,padding:`${e.getSpacing(2)} ${e.getSpacing(4)}`,...a.typography[o.TypographyVariant.Body2],".gd-button__content":{justifyContent:t.flexAlignItems.start}},attrs:{variant:c.ButtonVariant.Text}},noResult:{display:t.display.flex,flexDirection:r.FlexDirection.Row,alignItems:t.flexAlignItems.center,gap:e.getSpacing(2),padding:`${e.getSpacing(2)} ${e.getSpacing(4)}`,color:i.colors.text.caption,...a.typography[o.TypographyVariant.Body2]},groupTitle:{textAlign:"left",padding:`${e.getSpacing(2)} ${e.getSpacing(4)}`,color:i.colors.text.caption,...a.typography[o.TypographyVariant.Body2]},item:{styles:{textAlign:"left",gap:e.getSpacing(2),padding:`${e.getSpacing()} ${e.getSpacing(4)}`,color:i.colors.text.default,".gd-button__content":{display:t.display.block},...a.typography[o.TypographyVariant.Body2]},attrs:{variant:c.ButtonVariant.Text}},itemRow:{alignItems:t.flexAlignItems.center,justifyContent:s.calculateJustify("between"),gap:e.getSpacing(2),flexWrap:"noWrap"},itemColumn:{gap:e.getSpacing(.5),minWidth:0,flexWrap:"noWrap"},itemContent:{default:{},title:{flex:1,minWidth:0,whiteSpace:"nowrap",textOverflow:"ellipsis",overflow:"hidden"},description:{flex:1,minWidth:0,whiteSpace:"nowrap",textOverflow:"ellipsis",overflow:"hidden",color:i.colors.text.caption},date:{flex:"0 0",whiteSpace:"nowrap",color:i.colors.text.caption}},icons:{newChat:{name:"edit",fill:i.colors.icon.primary.default,...l.icon.size[n.SizeVariant.Sm]},noResults:{name:"search",...l.icon.size[n.SizeVariant.Sm]},item:{fill:i.colors.icon.primary.default,...l.icon.size[n.SizeVariant.Sm]}}}};exports.searchModal=u;
+import { getSpacing as t } from "./utils.js";
+import { typography as r } from "./typography.js";
+import { icon as n } from "./icon.js";
+import { flexAlignItems as a, display as o } from "./display.js";
+import { cursors as m } from "./cursors.js";
+import { font as c } from "./font.js";
+import { colors as e } from "./colors.js";
+import { calculateJustify as f } from "../utils/layout.js";
+import { ButtonVariant as d } from "../types/button.js";
+import { FlexDirection as l } from "../types/layout.js";
+import { get as s } from "../utils/helpers.js";
+import { SizeVariant as p } from "../types/common.js";
+import { TypographyVariant as i } from "../types/typography.js";
+const z = {
+  default: {},
+  wrapper: {
+    padding: `${t(4)} ${t(3)}`,
+    overflowY: "auto"
+  },
+  input: {
+    default: {
+      '& input[type="search"]': {
+        padding: `${t(3)} 0 ${t(3)} ${t(7)}`,
+        height: "54px",
+        fontSize: c.size[i.Body2],
+        "&::placeholder": {
+          color: s(e, ["neutral", "grey.60"])
+        },
+        "&::-webkit-search-cancel-button": {
+          appearance: o.none
+        },
+        "&::-ms-clear": {
+          display: o.none
+        }
+      }
+    },
+    endIcon: {
+      margin: `0 ${t(3)} 0 0`,
+      padding: t(2),
+      cursor: m.pointer
+    },
+    icons: {
+      close: {
+        name: "cross",
+        width: 12,
+        height: 12
+      }
+    }
+  },
+  loader: {
+    default: {
+      display: o.flex,
+      flexDirection: l.Column,
+      gap: t(2)
+    }
+  },
+  items: {
+    default: {
+      display: o.flex,
+      flexDirection: l.Column
+    },
+    newSearchBtn: {
+      styles: {
+        textAlign: "left",
+        color: e.text.default,
+        padding: `${t(2)} ${t(4)}`,
+        ...r[i.Body2],
+        ".gd-button__content": {
+          justifyContent: a.start
+        }
+      },
+      attrs: {
+        variant: d.Text
+      }
+    },
+    noResult: {
+      display: o.flex,
+      flexDirection: l.Row,
+      alignItems: a.center,
+      gap: t(2),
+      padding: `${t(2)} ${t(4)}`,
+      color: e.text.caption,
+      ...r[i.Body2]
+    },
+    groupTitle: {
+      textAlign: "left",
+      padding: `${t(2)} ${t(4)}`,
+      color: e.text.caption,
+      ...r[i.Body2]
+    },
+    item: {
+      styles: {
+        textAlign: "left",
+        gap: t(2),
+        padding: `${t()} ${t(4)}`,
+        color: e.text.default,
+        ".gd-button__content": {
+          display: o.block
+        },
+        ...r[i.Body2]
+      },
+      attrs: {
+        variant: d.Text
+      }
+    },
+    itemRow: {
+      alignItems: a.center,
+      justifyContent: f("between"),
+      gap: t(2),
+      flexWrap: "noWrap"
+    },
+    itemColumn: {
+      gap: t(0.5),
+      minWidth: 0,
+      flexWrap: "noWrap"
+    },
+    itemContent: {
+      default: {},
+      title: {
+        flex: 1,
+        minWidth: 0,
+        whiteSpace: "nowrap",
+        textOverflow: "ellipsis",
+        overflow: "hidden"
+      },
+      description: {
+        flex: 1,
+        minWidth: 0,
+        whiteSpace: "nowrap",
+        textOverflow: "ellipsis",
+        overflow: "hidden",
+        color: e.text.caption
+      },
+      date: {
+        flex: "0 0",
+        whiteSpace: "nowrap",
+        color: e.text.caption
+      }
+    },
+    icons: {
+      newChat: {
+        name: "edit",
+        fill: e.icon.primary.default,
+        ...n.size[p.Sm]
+      },
+      noResults: {
+        name: "search",
+        ...n.size[p.Sm]
+      },
+      item: {
+        fill: e.icon.primary.default,
+        ...n.size[p.Sm]
+      }
+    }
+  }
+};
+export {
+  z as searchModal
+};

package/tokens/select.js

@@ -1 +1,99 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("../types/typography.js"),T=require("../types/layout.js"),i=require("../types/button.js"),a=require("../types/cursors.js"),s=require("../constants/positioning.js"),z=require("./values.js"),o=require("./spacing.js"),t=require("./colors.js"),r=require("./font.js"),_=require("./shadow.js"),e=require("./display.js");var l,c,d,u,p,f,g,y,m,b,w,h,x,I,q,v,A,C,W,D,S;const j={default:{position:"relative",display:"inline-block"},initiatorWrapper:{},dropdown:{position:"absolute",textAlign:"left",top:"100%",left:"auto",minWidth:"100%",background:(c=(l=t.colors)==null?void 0:l.bg)==null?void 0:c.surface,boxShadow:(u=(d=_.shadows)==null?void 0:d.select)==null?void 0:u.default,fontFamily:(p=r.font)==null?void 0:p.family,fontSize:(g=(f=r.font)==null?void 0:f.size)==null?void 0:g[n.TypographyVariant.Body1],fontWeight:(m=(y=r.font)==null?void 0:y.weight)==null?void 0:m.normal,listStyleType:"none",margin:(b=o.spacing)==null?void 0:b.none,padding:(w=o.spacing)==null?void 0:w.none,zIndex:s.Z_INDEX.LOW},button:{default:{borderColor:(x=(h=t.colors)==null?void 0:h.border)==null?void 0:x.default,padding:(I=o.spacing)==null?void 0:I.sm,width:"100%",display:(q=e.display)==null?void 0:q.flex,flexDirection:"row",justifyContent:"space-between",alignItems:(v=e.flexAlignItems)==null?void 0:v.center,minWidth:"300px",textAlign:n.TextAlign.Left,".gd-button__content":{justifyContent:e.flexAlignItems.start}},attrs:{variant:i.ButtonVariant.Outlined,color:i.ButtonColorVariant.Primary}},item:{default:{cursor:a.Cursors.Pointer,"&:hover, &.active":{backgroundColor:(D=(W=(C=(A=t.colors)==null?void 0:A.bg)==null?void 0:C.fill)==null?void 0:W.secondary)==null?void 0:D.hover}},disabled:{opacity:.5,cursor:a.Cursors.NotAllowed,pointerEvents:"none"}},arrowIconWrapper:{default:{transition:z.values.transitions.select.arrowIconWrapper},transform:{open:{transform:"rotate(180deg)"},close:{transform:"rotate(0deg)"}}},arrowIcon:{name:"arrowDown",fill:(S=t.colors)==null?void 0:S.neutral["grey.90"],width:18,height:18},adornment:{default:{display:e.display.flex,alignItems:e.flexAlignItems.center,flexDirection:T.FlexDirection.Row,position:"relative",zIndex:s.Z_INDEX.FIRST}}};exports.select=j;
+import { Z_INDEX as i } from "../constants/positioning.js";
+import { values as S } from "./values.js";
+import { spacing as o } from "./spacing.js";
+import { colors as t } from "./colors.js";
+import { font as r } from "./font.js";
+import { shadows as T } from "./shadow.js";
+import { flexAlignItems as e, display as n } from "./display.js";
+import { FlexDirection as k } from "../types/layout.js";
+import { Cursors as a } from "../types/cursors.js";
+import { ButtonColorVariant as B, ButtonVariant as F } from "../types/button.js";
+import { TextAlign as V, TypographyVariant as _ } from "../types/typography.js";
+var l, s, d, f, m, p, c, u, g, y, w, x, b, h, I, v, W, C, A, D, z;
+const H = {
+  default: {
+    position: "relative",
+    display: "inline-block"
+  },
+  initiatorWrapper: {},
+  dropdown: {
+    position: "absolute",
+    textAlign: "left",
+    top: "100%",
+    left: "auto",
+    minWidth: "100%",
+    background: (s = (l = t) == null ? void 0 : l.bg) == null ? void 0 : s.surface,
+    boxShadow: (f = (d = T) == null ? void 0 : d.select) == null ? void 0 : f.default,
+    fontFamily: (m = r) == null ? void 0 : m.family,
+    fontSize: (c = (p = r) == null ? void 0 : p.size) == null ? void 0 : c[_.Body1],
+    fontWeight: (g = (u = r) == null ? void 0 : u.weight) == null ? void 0 : g.normal,
+    listStyleType: "none",
+    margin: (y = o) == null ? void 0 : y.none,
+    padding: (w = o) == null ? void 0 : w.none,
+    zIndex: i.LOW
+  },
+  button: {
+    default: {
+      borderColor: (b = (x = t) == null ? void 0 : x.border) == null ? void 0 : b.default,
+      padding: (h = o) == null ? void 0 : h.sm,
+      width: "100%",
+      display: (I = n) == null ? void 0 : I.flex,
+      flexDirection: "row",
+      justifyContent: "space-between",
+      alignItems: (v = e) == null ? void 0 : v.center,
+      minWidth: "300px",
+      textAlign: V.Left,
+      ".gd-button__content": {
+        justifyContent: e.start
+      }
+    },
+    attrs: {
+      variant: F.Outlined,
+      color: B.Primary
+    }
+  },
+  item: {
+    default: {
+      cursor: a.Pointer,
+      "&:hover, &.active": {
+        backgroundColor: (D = (A = (C = (W = t) == null ? void 0 : W.bg) == null ? void 0 : C.fill) == null ? void 0 : A.secondary) == null ? void 0 : D.hover
+      }
+    },
+    disabled: {
+      opacity: 0.5,
+      cursor: a.NotAllowed,
+      pointerEvents: "none"
+    }
+  },
+  arrowIconWrapper: {
+    default: {
+      transition: S.transitions.select.arrowIconWrapper
+    },
+    transform: {
+      open: {
+        transform: "rotate(180deg)"
+      },
+      close: {
+        transform: "rotate(0deg)"
+      }
+    }
+  },
+  arrowIcon: {
+    name: "arrowDown",
+    fill: (z = t) == null ? void 0 : z.neutral["grey.90"],
+    width: 18,
+    height: 18
+  },
+  adornment: {
+    default: {
+      display: n.flex,
+      alignItems: e.center,
+      flexDirection: k.Row,
+      position: "relative",
+      zIndex: i.FIRST
+    }
+  }
+};
+export {
+  H as select
+};

package/tokens/separator.js

@@ -1 +1,63 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("../types/common.js"),a=require("../types/typography.js"),r=require("../types/layout.js"),t=require("./display.js"),e=require("./utils.js"),n={default:{alignItems:t.flexAlignItems.center,justifyItems:t.flexAlignItems.center,gap:e.getSpacing(4)},[i.Orientation.Horizontal]:{width:"100%",display:t.display.flex,flexDirection:r.FlexDirection.Row},[i.Orientation.Vertical]:{height:"100%",display:t.display.flex,flexDirection:r.FlexDirection.Column},line:{default:{},[i.Orientation.Horizontal]:{width:"100%"},[i.Orientation.Vertical]:{height:"100%"}},label:{default:{},attrs:{[i.SizeVariant.Xs]:{$variant:a.TypographyVariant.Caption,$as:a.TypographyVariant.Caption},[i.SizeVariant.Sm]:{$variant:a.TypographyVariant.Body2,$as:a.TypographyVariant.Body2},[i.SizeVariant.Md]:{$variant:a.TypographyVariant.Body1,$as:a.TypographyVariant.Body1},[i.SizeVariant.Lg]:{$variant:a.TypographyVariant.H6,$as:a.TypographyVariant.H6},[i.SizeVariant.Xl]:{$variant:a.TypographyVariant.H5,$as:a.TypographyVariant.H5},[i.SizeVariant.Xxl]:{$variant:a.TypographyVariant.H4,$as:a.TypographyVariant.H4}}}};exports.separator=n;
+import { display as r, flexAlignItems as e } from "./display.js";
+import { getSpacing as n } from "./utils.js";
+import { TypographyVariant as a } from "../types/typography.js";
+import { FlexDirection as o } from "../types/layout.js";
+import { SizeVariant as t, Orientation as i } from "../types/common.js";
+const d = {
+  default: {
+    alignItems: e.center,
+    justifyItems: e.center,
+    gap: n(4)
+  },
+  [i.Horizontal]: {
+    width: "100%",
+    display: r.flex,
+    flexDirection: o.Row
+  },
+  [i.Vertical]: {
+    height: "100%",
+    display: r.flex,
+    flexDirection: o.Column
+  },
+  line: {
+    default: {},
+    [i.Horizontal]: {
+      width: "100%"
+    },
+    [i.Vertical]: {
+      height: "100%"
+    }
+  },
+  label: {
+    default: {},
+    attrs: {
+      [t.Xs]: {
+        $variant: a.Caption,
+        $as: a.Caption
+      },
+      [t.Sm]: {
+        $variant: a.Body2,
+        $as: a.Body2
+      },
+      [t.Md]: {
+        $variant: a.Body1,
+        $as: a.Body1
+      },
+      [t.Lg]: {
+        $variant: a.H6,
+        $as: a.H6
+      },
+      [t.Xl]: {
+        $variant: a.H5,
+        $as: a.H5
+      },
+      [t.Xxl]: {
+        $variant: a.H4,
+        $as: a.H4
+      }
+    }
+  }
+};
+export {
+  d as separator
+};

package/tokens/shadow.js

@@ -1 +1,24 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("./utils.js"),a=require("./colors.js"),e=`0 4px 12px ${t.hexToRgba(a.colors.neutral.black,.1)}`,o=`0px 8px 18px 3px ${t.hexToRgba(a.colors.neutral.black,.2)}`,l={modal:{default:e},snackbar:{default:e},select:{default:o},card:{default:o},inlineNotification:{default:e}};exports.DEFAULT_SHADOW=e;exports.SHADOW_3=o;exports.shadows=l;
+import { hexToRgba as o } from "./utils.js";
+import { colors as l } from "./colors.js";
+const a = `0 4px 12px ${o(l.neutral.black, 0.1)}`, t = `0px 8px 18px 3px ${o(l.neutral.black, 0.2)}`, r = {
+  modal: {
+    default: a
+  },
+  snackbar: {
+    default: a
+  },
+  select: {
+    default: t
+  },
+  card: {
+    default: t
+  },
+  inlineNotification: {
+    default: a
+  }
+};
+export {
+  a as DEFAULT_SHADOW,
+  t as SHADOW_3,
+  r as shadows
+};

package/tokens/skeleton.js

@@ -1 +1,77 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("../types/common.js"),t=require("../types/skeleton.js"),n=require("./utils.js"),r=require("./radius.js"),o=require("./colors.js"),e=require("./spacing.js"),a={default:{display:"flex",position:"relative",backgroundColor:n.hexToRgba(o.colors.neutral["grey.30"],.7),alignItems:"center",justifyContent:"center",width:"100%",height:"auto",overflow:"hidden","&:empty::before":{content:'" "'}},[t.SkeletonVariant.Rounded]:{borderRadius:r.radius[i.SizeVariant.Sm]},[t.SkeletonVariant.Rectangular]:{borderRadius:r.radius.none},[t.SkeletonVariant.Circular]:{borderRadius:r.radius.round},cards:{search:{default:{},container:{padding:e.spacing.md,boxSizing:"border-box",flexWrap:"nowrap",flexDirection:"column"},header:{width:"100%",marginBottom:e.spacing.sm},row:{width:"100%",marginBottom:e.spacing.md,gap:e.spacing.xs},columnImage:{default:{flex:1},image:{width:"85px",height:"85px"}},columnText:{default:{flex:3},description:{width:"100%",height:e.spacing[i.SizeVariant.Lg],marginBottom:e.spacing.sm},price:{width:"50%",height:e.spacing[i.SizeVariant.Lg],marginBottom:e.spacing.sm}}}}};exports.skeleton=a;
+import { hexToRgba as i } from "./utils.js";
+import { radius as e } from "./radius.js";
+import { colors as a } from "./colors.js";
+import { spacing as o } from "./spacing.js";
+import { SkeletonVariant as r } from "../types/skeleton.js";
+import { SizeVariant as t } from "../types/common.js";
+const s = {
+  default: {
+    display: "flex",
+    position: "relative",
+    backgroundColor: i(a.neutral["grey.30"], 0.7),
+    alignItems: "center",
+    justifyContent: "center",
+    width: "100%",
+    height: "auto",
+    overflow: "hidden",
+    "&:empty::before": {
+      content: '" "'
+    }
+  },
+  [r.Rounded]: {
+    borderRadius: e[t.Sm]
+  },
+  [r.Rectangular]: {
+    borderRadius: e.none
+  },
+  [r.Circular]: {
+    borderRadius: e.round
+  },
+  cards: {
+    search: {
+      default: {},
+      container: {
+        padding: o.md,
+        boxSizing: "border-box",
+        flexWrap: "nowrap",
+        flexDirection: "column"
+      },
+      header: {
+        width: "100%",
+        marginBottom: o.sm
+      },
+      row: {
+        width: "100%",
+        marginBottom: o.md,
+        gap: o.xs
+      },
+      columnImage: {
+        default: {
+          flex: 1
+        },
+        image: {
+          width: "85px",
+          height: "85px"
+        }
+      },
+      columnText: {
+        default: {
+          flex: 3
+        },
+        description: {
+          width: "100%",
+          height: o[t.Lg],
+          marginBottom: o.sm
+        },
+        price: {
+          width: "50%",
+          height: o[t.Lg],
+          marginBottom: o.sm
+        }
+      }
+    }
+  }
+};
+export {
+  s as skeleton
+};