gd-design-library 0.2.0 → 0.3.0

package/tokens/separator.js

@@ -0,0 +1 @@
+"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;

package/tokens/shadow.js

@@ -0,0 +1 @@
+"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;

package/tokens/skeleton.js

@@ -0,0 +1 @@
+"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;

package/tokens/slider.d.ts

@@ -14,25 +14,45 @@ export declare const slider: {
             opacity: string;
             cursor: string;
         };
-    };
-    thumb: {
-        isolation: string;
-        appearance: string;
-        backgroundColor: string;
-        borderRadius: string;
-        blockSize: string;
-        inlineSize: string;
-        boxSizing: string;
-        border: string;
-        marginTop: string;
-    };
-    track: {
-        blockSize: string;
-        borderRadius: string;
-        backgroundRepeat: string;
-        backgroundColor: string;
-        backgroundImage: string;
-        backgroundPositionX: string;
-        backgroundSize: string;
+        '&::-webkit-slider-thumb': {
+            isolation: string;
+            appearance: string;
+            backgroundColor: string;
+            borderRadius: string;
+            blockSize: string;
+            inlineSize: string;
+            boxSizing: string;
+            border: string;
+            marginTop: string;
+        };
+        '&::-webkit-slider-runnable-track': {
+            blockSize: string;
+            borderRadius: string;
+            backgroundRepeat: string;
+            backgroundColor: string;
+            backgroundImage: string;
+            backgroundPositionX: string;
+            backgroundSize: string;
+        };
+        '&::-moz-range-thumb': {
+            isolation: string;
+            appearance: string;
+            backgroundColor: string;
+            borderRadius: string;
+            blockSize: string;
+            inlineSize: string;
+            boxSizing: string;
+            border: string;
+            marginTop: string;
+        };
+        '&::-moz-range-track': {
+            blockSize: string;
+            borderRadius: string;
+            backgroundRepeat: string;
+            backgroundColor: string;
+            backgroundImage: string;
+            backgroundPositionX: string;
+            backgroundSize: string;
+        };
     };
 };

package/tokens/slider.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("./colors.js"),e=require("./cursors.js"),o={isolation:"isolate",appearance:"none",backgroundColor:r.colors.bg.fill.secondary.default,borderRadius:"50%",blockSize:"20px",inlineSize:"20px",boxSizing:"border-box",border:"2px solid currentColor",marginTop:"-6px"},a={blockSize:"8px",borderRadius:"inherit",backgroundRepeat:"no-repeat",backgroundColor:r.colors.border.default,backgroundImage:"linear-gradient(to right, transparent 0 100%), linear-gradient(to right, currentColor calc(100% * var(--gd-slider-fill-ratio)), transparent calc(100% * var(--gd-slider-fill-ratio)))",backgroundPositionX:"calc((0.75rem - 8px) / 2), 0",backgroundSize:"calc(100% - 0.75rem), auto"},t={default:{position:"relative",display:"block",inlineSize:"100%",color:r.colors.text.title,cursor:e.cursors.pointer,WebkitAppearance:"none",appearance:"none",padding:"0.4375rem 0",backgroundColor:r.colors.transparent,outline:"none","&[disabled]":{opacity:"50%",cursor:e.cursors.default},"&::-webkit-slider-thumb":o,"&::-webkit-slider-runnable-track":a,"&::-moz-range-thumb":o,"&::-moz-range-track":a}};exports.slider=t;

package/tokens/snackbar.d.ts

@@ -1,10 +1,10 @@
-import { FlexDirection } from '../components/layout';
+import { FlexDirection } from '../types';
 export declare const DEFAULT_SNACKBAR_WIDTH = "302px";
 export declare const snackbar: {
     container: {
         position: string;
         display: string;
-        flexDirection: string;
+        flexDirection: FlexDirection;
         gap: string;
         padding: string;
         boxSizing: string;
@@ -34,13 +34,12 @@ export declare const snackbar: {
     };
     snackbar: {
         default: {
-            position: "relative";
+            position: string;
             boxShadow: string;
             width: string;
-            fontFamily: "\"Fira Sans\", sans-serif";
             fontSize: string;
-            display: "flex";
-            flexDirection: "column";
+            display: string;
+            flexDirection: FlexDirection;
             gap: string;
             color: string;
             padding: string;
@@ -60,12 +59,6 @@ export declare const snackbar: {
         };
     };
     positions: {
-        default: {
-            bottom: number;
-            right: number;
-            alignItems: string;
-            flexDirection: FlexDirection;
-        };
         "top-left": {
             top: number;
             left: number;
@@ -103,7 +96,7 @@ export declare const snackbar: {
         };
     };
     closeButton: {
-        position: "absolute";
+        position: string;
         top: string;
         right: string;
         background: string;
@@ -121,15 +114,19 @@ export declare const snackbar: {
         };
         success: {
             name: string;
+            fill: string;
         };
         error: {
             name: string;
+            fill: string;
         };
         warning: {
             name: string;
+            fill: string;
         };
         info: {
             name: string;
+            fill: string;
         };
     };
     snackbarBody: {
@@ -141,13 +138,10 @@ export declare const snackbar: {
         display: string;
         flexDirection: FlexDirection;
         alignItems: string;
+        gap: string | number;
         flex: number;
     };
     actionsContainer: {
-        display: string;
-        justifyContent: string;
-        flexDirection: FlexDirection;
-        gap: string;
-        paddingTop: string;
+        paddingTop: string | number;
     };
 };

package/tokens/snackbar.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("../types/common.js"),v=require("../types/typography.js"),i=require("../types/layout.js"),t=require("../types/snackbar.js"),s=require("./utils.js"),n=require("./spacing.js"),T=require("./font.js"),o=require("./colors.js"),B=require("./borders.js"),F=require("./cursors.js"),R=require("./values.js"),V=require("./radius.js"),a=require("./icon.js"),P=require("./shadow.js"),e=require("./display.js"),C="302px";var c,l,g,p,d,u,b,m,f,x,h,S,k,w,I,y,D,q,z,A;const $={container:{position:"fixed",display:e.display.flex,flexDirection:i.FlexDirection.Column,gap:n.spacing[r.SizeVariant.Sm],padding:n.spacing[r.SizeVariant.Sm],boxSizing:"border-box",maxHeight:`calc(100vh - ${n.spacing[r.SizeVariant.Xs]})`,overflowY:"auto",overflowX:"hidden",scrollbarWidth:"thin",scrollbarColor:`${o.colors.transparent} ${o.colors.transparent}`,zIndex:R.values.zIndex.snackbar,"&::-webkit-scrollbar":{width:n.spacing[(c=r.SizeVariant)==null?void 0:c.Sm],background:o.colors.transparent},"&::-webkit-scrollbar-thumb":{background:o.colors.transparent,borderRadius:V.radius[(l=r.SizeVariant)==null?void 0:l.Sm]},"&::-webkit-scrollbar-track":{background:o.colors.transparent},"&:hover::-webkit-scrollbar-thumb":{background:"rgba(0, 0, 0, 0.3)"},"&.scrolling::-webkit-scrollbar-thumb":{background:"rgba(0, 0, 0, 0.3)"}},snackbar:{default:{position:"relative",boxShadow:(g=P.shadows.snackbar)==null?void 0:g.default,width:C,fontSize:T.font.size[(p=v.TypographyVariant)==null?void 0:p.Body1],display:e.display.flex,flexDirection:i.FlexDirection.Column,gap:n.spacing.sm,color:(d=o.colors.text)==null?void 0:d.default,padding:`${(u=n.spacing)==null?void 0:u.sm} ${(b=n.spacing)==null?void 0:b.md}`},background:{default:(m=o.colors.bg)==null?void 0:m.surface,variants:{success:o.colors.bg.toast.success,error:o.colors.bg.toast.error,warning:o.colors.bg.toast.warning,info:o.colors.bg.toast.info}},animation:{duration:"300ms",timing:"ease-out"}},positions:{[(f=t.SnackbarPosition)==null?void 0:f.TopLeft]:{top:0,left:0,alignItems:e.flexAlignItems.start},[(x=t.SnackbarPosition)==null?void 0:x.TopCenter]:{top:n.spacing.none,left:"50%",transform:"translateX(-50%)",alignItems:e.flexAlignItems.center},[(h=t.SnackbarPosition)==null?void 0:h.TopRight]:{top:n.spacing.none,right:n.spacing.none,alignItems:e.flexAlignItems.end},[(S=t.SnackbarPosition)==null?void 0:S.BottomLeft]:{bottom:n.spacing.none,left:n.spacing.none,alignItems:e.flexAlignItems.start,flexDirection:i.FlexDirection.ColumnReverse},[(k=t.SnackbarPosition)==null?void 0:k.BottomCenter]:{bottom:n.spacing.none,left:"50%",transform:"translateX(-50%)",alignItems:e.flexAlignItems.center,flexDirection:i.FlexDirection.ColumnReverse},[(w=t.SnackbarPosition)==null?void 0:w.BottomRight]:{bottom:n.spacing.none,right:n.spacing.none,alignItems:e.flexAlignItems.end,flexDirection:i.FlexDirection.ColumnReverse}},closeButton:{position:"absolute",top:n.spacing.sm,right:n.spacing.md,background:o.colors.transparent,border:B.borders.none,cursor:F.cursors.pointer,padding:3,width:(D=(y=(I=a.icon)==null?void 0:I.size)==null?void 0:y[r.SizeVariant.Sm])==null?void 0:D.width,height:(A=(z=(q=a.icon)==null?void 0:q.size)==null?void 0:z[r.SizeVariant.Sm])==null?void 0:A.height},icons:{close:{name:"cross",width:"100%",height:"100%"},success:{name:"success",fill:o.colors.icon.success},error:{name:"error",fill:o.colors.icon.error},warning:{name:"warning",fill:o.colors.icon.warning},info:{name:"info",fill:o.colors.icon.info}},snackbarBody:{display:e.display.flex,alignItems:e.flexAlignItems.start,gap:n.spacing.sm},snackbarContent:{display:e.display.flex,flexDirection:i.FlexDirection.Column,alignItems:e.flexAlignItems.start,gap:s.getSpacing(1),flex:1},actionsContainer:{paddingTop:s.getSpacing(1)}};exports.DEFAULT_SNACKBAR_WIDTH=C;exports.snackbar=$;

package/tokens/spacing.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("../types/common.js"),a={none:0,[i.SizeVariant.Xs]:"4px",[i.SizeVariant.Sm]:"8px",[i.SizeVariant.Md]:"16px",[i.SizeVariant.Lg]:"24px",[i.SizeVariant.Xl]:"32px",[i.SizeVariant.Xxl]:"40px"};exports.spacing=a;

package/tokens/stepper.d.ts

@@ -1,4 +1,4 @@
-import { Cursors } from '../components/core/types/cursors.types';
+import { Cursors } from '../types';
 export declare const stepper: {
     default: {
         display: string;

package/tokens/stepper.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../utils/helpers.js");require("react");const o=require("../types/common.js"),n=require("../types/typography.js"),d=require("../types/cursors.js"),t=require("../types/stepper.js"),i=require("./icon.js"),r=require("./colors.js"),c=require("./borders.js"),S=require("./radius.js"),s=require("./values.js"),u=require("./typography.js"),g=require("./font.js"),f=require("./spacing.js"),a=require("./display.js"),p=i.icon.size[o.SizeVariant.Xxl],l=104,m={default:{display:a.display.flex,flexDirection:"row",justifyContent:"space-between",width:"100%"},separator:{default:{width:"100%",position:"relative",zIndex:-100,top:`${p.height/2}px`,marginLeft:`-${l/2}px`,marginRight:`-${l/2}px`,transition:e.get(s.values,"transitions.stepper.separator"),borderTop:c.borders.generic({color:e.get(r.colors,"border.default"),width:s.values.borderMedium})},[t.StepStatus.Active]:{},[t.StepStatus.Complete]:{borderTopColor:e.get(r.colors,"border.primary.default")},[t.StepStatus.Inactive]:{}},step:{default:{display:a.display.flex,flexDirection:"column",alignItems:a.flexAlignItems.center,justifyContent:"space-between",minWidth:`${l}px`},[t.StepStatus.Active]:{},[t.StepStatus.Inactive]:{},[t.StepStatus.Complete]:{cursor:d.Cursors.Pointer}},stepIcon:{default:{display:a.display.flex,alignItems:a.flexAlignItems.center,justifyContent:"center",borderRadius:S.radius.round,border:c.borders.generic({width:s.values.borderMedium}),fontSize:u.typography[n.TypographyVariant.H5],transition:e.get(s.values,"transitions.stepper.stepIcon"),colors:e.get(r.colors,"text.default"),...p},[t.StepStatus.Active]:{default:{backgroundColor:e.get(r.colors,"bg.default"),borderColor:e.get(r.colors,"border.primary.default")},[t.StepValidationStatus.Success]:{},[t.StepValidationStatus.Error]:{backgroundColor:e.get(r.colors,"bg.fill.error.primary.default"),borderColor:e.get(r.colors,"bg.fill.error.primary.default")}},[t.StepStatus.Inactive]:{default:{backgroundColor:e.get(r.colors,"bg.default")},[t.StepValidationStatus.Success]:{},[t.StepValidationStatus.Error]:{}},[t.StepStatus.Complete]:{default:{fontWeight:g.font.weight.medium,backgroundColor:e.get(r.colors,"bg.fill.primary.default")},[t.StepValidationStatus.Success]:{},[t.StepValidationStatus.Error]:{backgroundColor:e.get(r.colors,"bg.fill.error.secondary.default"),borderColor:e.get(r.colors,"bg.fill.error.secondary.default")}},[t.StepValidationStatus.Success]:{default:{},[t.StepValidationStatus.Success]:{},[t.StepValidationStatus.Error]:{}}},stepLabel:{default:{marginTop:f.spacing[o.SizeVariant.Sm],fontSize:u.typography[n.TypographyVariant.Body1],colors:e.get(r.colors,"text.default")},[t.StepStatus.Active]:{},[t.StepStatus.Inactive]:{},[t.StepStatus.Complete]:{},[t.StepValidationStatus.Error]:{},[t.StepValidationStatus.Success]:{}},icons:{active:{name:"check",fill:e.get(r.colors,"icon.primary.active"),...e.get(i.icon,["size",o.SizeVariant.Md],{})},inactive:{name:"check",fill:e.get(r.colors,"icon.primary.default"),...e.get(i.icon,["size",o.SizeVariant.Md],{})},complete:{name:"check",fill:e.get(r.colors,"bg.fill.secondary.default"),...e.get(i.icon,["size",o.SizeVariant.Md],{})},error:{name:"cross",fill:e.get(r.colors,"icon.error"),...e.get(i.icon,["size",o.SizeVariant.Sm],{})},errorActive:{name:"cross",fill:e.get(r.colors,"neutral.white"),...e.get(i.icon,["size",o.SizeVariant.Sm],{})}}};exports.stepper=m;

package/tokens/switch.d.ts

@@ -23,6 +23,7 @@ export declare const switchToken: {
             gap: string;
             calculateJustify: string;
         };
+        disabled: {};
     };
     slider: {
         default: {
@@ -53,4 +54,15 @@ export declare const switchToken: {
             };
         };
     };
+    checkbox: {
+        border: number;
+        clip: string;
+        height: string;
+        margin: string;
+        overflow: string;
+        padding: number;
+        position: string;
+        whiteSpace: string;
+        width: string;
+    };
 };

package/tokens/switch.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require("react");const i=require("../utils/layout.js"),t=require("../types/label.js"),e=require("./colors.js"),o=require("./display.js"),r=require("./cursors.js"),l={default:{position:"relative",display:o.display.inlineBlock,width:"45px",height:"24px",flexShrink:0,borderRadius:"20px",cursor:r.cursors.pointer,"&[disabled]":{opacity:"50%",cursor:r.cursors.default}},label:{[t.LabelPosition.Right]:{order:1}},wrapper:{default:{display:o.display.inlineFlex,gap:"0.5rem",calculateJustify:i.calculateJustify("center")},disabled:{}},slider:{default:{position:"absolute",left:0,right:0,top:0,bottom:0,transition:"0.2s",backgroundColor:e.colors.bg.fill.disabled,borderRadius:"inherit","&::before":{position:"absolute",content:'""',borderRadius:"50%",width:"18px",height:"18px",left:"3px",bottom:"3px",transition:"0.2s",backgroundColor:e.colors.neutral.white}},checked:{backgroundColor:e.colors.primary.default,"&::before":{transform:"translateX(21px)"}}},checkbox:{border:0,clip:"rect(0 0 0 0)",height:"1px",margin:"-1px",overflow:"hidden",padding:0,position:"absolute",whiteSpace:"nowrap",width:"1px"}};exports.switchToken=l;

package/tokens/tabs.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("../utils/helpers.js");require("react");const n=require("../types/common.js"),a=require("../types/typography.js"),l=require("./icon.js"),r=require("./font.js"),e=require("./colors.js"),t=require("./borders.js"),d=require("./radius.js"),i=require("./values.js"),s={default:{display:"flex",flexDirection:"column",width:"100%"},header:{default:{display:"flex",flexDirection:"row",position:"relative","&::after":{content:'""',position:"absolute",width:"100%",bottom:0,zIndex:-100,borderBottom:t.borders.generic({width:i.values.borderThin,color:o.get(e.colors,"border.default")})}}},label:{default:{fontWeight:o.get(r.font,"weight.medium"),fontSize:o.get(r.font,["size",a.TypographyVariant.Body2]),color:o.get(e.colors,"text.default"),transition:"border 0.2s ease-in",borderBottom:t.borders.generic({width:i.values.borderMedium,color:e.colors.transparent}),flex:1,"&:hover":{".Tabs__noticeCounter":{backgroundColor:o.get(e.colors,"icon.primary.active")}}},active:{borderBottomColor:o.get(e.colors,"border.primary.default")},disabled:{default:{"&:hover":{".Tabs__noticeCounter":{backgroundColor:o.get(e.colors,"icon.primary.disabled")}},".Tabs__noticeCounter":{color:e.colors.neutral.white},borderBottom:t.borders.generic({width:i.values.borderThin,color:o.get(e.colors,"border.secondary.disabled")})},active:{borderBottomWidth:"2px",borderBottomColor:o.get(e.colors,"border.secondary.disabled")}}},panelsWrapper:{default:{}},panel:{default:{}},noticeCounter:{default:{display:"flex",alignItems:"center",justifyContent:"center",backgroundColor:o.get(e.colors,"icon.primary.default"),color:o.get(e.colors,"neutral.white"),fontWeight:o.get(r.font,"weight.normal"),fontSize:o.get(r.font,["size",a.TypographyVariant.Caption]),borderRadius:d.radius.round,...o.get(l.icon,["size",n.SizeVariant.Sm],{})},active:{backgroundColor:o.get(e.colors,"icon.primary.active")},disabled:{backgroundColor:o.get(e.colors,"icon.primary.disabled")}},tabButton:{default:{width:"100%"}}};exports.tabs=s;

package/tokens/textarea.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e={default:{},outlined:{primary:{"&:hover":{},"&:active":{},"&:focus":{},"&:disabled":{},"&:read-only":{}},secondary:{"&:hover":{},"&:active":{},"&:focus":{},"&:disabled":{},"&:read-only":{}},success:{"&:hover":{},"&:active":{},"&:focus":{},"&:disabled":{},"&:read-only":{}},warning:{"&:hover":{},"&:active":{},"&:focus":{},"&:disabled":{},"&:read-only":{}},error:{"&:hover":{},"&:active":{},"&:focus":{},"&:disabled":{},"&:read-only":{}}},contained:{},text:{}};exports.textarea=e;

package/tokens/toggle.d.ts

@@ -5,4 +5,5 @@ export declare const switchToggle: {
         padding: string;
         border: string;
     };
+    disabled: {};
 };

package/tokens/toggle.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../types/common.js"),r=require("./display.js"),o=require("./spacing.js"),i=require("./colors.js"),s=require("./borders.js"),t={default:{display:r.display.inlineFlex,position:"relative",padding:o.spacing[e.SizeVariant.Xs],border:s.borders.generic({color:i.colors.border.default})},disabled:{}};exports.switchToggle=t;

package/tokens/tooltip.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("../types/common.js"),o=require("./colors.js"),e=require("./display.js"),a=require("./spacing.js"),r=7;var l,n;const s={default:{position:"absolute",display:e.display.block,backgroundColor:o.colors.neutral["grey.40"],padding:`${(l=a.spacing)==null?void 0:l[t.SizeVariant.Md]} ${(n=a.spacing)==null?void 0:n[t.SizeVariant.Md]}`,whiteSpace:"nowrap","&::after":{position:"absolute",content:'""',border:`${r}px solid transparent`},"&.tooltip-bottom":{transform:"translateX(-50%)","&::after":{top:-r,left:"50%",borderLeftColor:o.colors.neutral["grey.40"],borderTopColor:o.colors.neutral["grey.40"],transform:"translateX(-50%) rotate(45deg)"}},"&.tooltip-top":{transform:"translateX(-50%)","&::after":{bottom:-r,left:"50%",borderRightColor:o.colors.neutral["grey.40"],borderBottomColor:o.colors.neutral["grey.40"],transform:"translateX(-50%) rotate(45deg)"}},"&.tooltip-left":{transform:"translateY(-50%)","&::after":{right:-r,top:"50%",borderRightColor:o.colors.neutral["grey.40"],borderTopColor:o.colors.neutral["grey.40"],transform:"translateY(-50%) rotate(45deg)"}},"&.tooltip-right":{transform:"translateY(-50%)","&::after":{left:-r,top:"50%",borderLeftColor:o.colors.neutral["grey.40"],borderBottomColor:o.colors.neutral["grey.40"],transform:"translateY(-50%) rotate(45deg) "}}},wrapper:{default:{display:e.display.inlineBlock,position:"relative"}}};exports.tooltip=s;

package/tokens/types/index.types.d.ts

@@ -4,7 +4,8 @@ export type SpacingKey = keyof typeof spacing;
 export declare enum Unit {
     Px = "px",
     Rem = "rem",
-    Percents = "%"
+    Percents = "%",
+    Em = "em"
 }
 export type FocusStyles = {
     inset: `${number}${Unit}`;

package/tokens/types/index.types.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});var r=(e=>(e.Px="px",e.Rem="rem",e.Percents="%",e.Em="em",e))(r||{});exports.Unit=r;

package/tokens/typography.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("../types/common.js"),t=require("../types/typography.js"),i=require("./font.js"),n=require("./spacing.js"),e={base:{fontFamily:i.font.family},[t.TypographyVariant.Inherit]:{fontSize:"inherit",fontWeight:"inherit",lineHeight:"inherit"},[t.TypographyVariant.H1]:{fontSize:i.font.size[t.TypographyVariant.H1],fontWeight:i.font.weight.normal,lineHeight:i.font.line.height[t.TypographyVariant.H1],marginTop:n.spacing[a.SizeVariant.Xl],marginBottom:n.spacing[a.SizeVariant.Xl]},[t.TypographyVariant.H2]:{fontSize:i.font.size[t.TypographyVariant.H2],fontWeight:i.font.weight.normal,lineHeight:i.font.line.height[t.TypographyVariant.H2],marginTop:n.spacing[a.SizeVariant.Lg],marginBottom:n.spacing[a.SizeVariant.Lg]},[t.TypographyVariant.H3]:{fontSize:i.font.size[t.TypographyVariant.H3],fontWeight:i.font.weight.normal,lineHeight:i.font.line.height[t.TypographyVariant.H3],marginTop:n.spacing[a.SizeVariant.Md],marginBottom:n.spacing[a.SizeVariant.Md]},[t.TypographyVariant.H4]:{fontSize:i.font.size[t.TypographyVariant.H4],fontWeight:i.font.weight.normal,lineHeight:i.font.line.height[t.TypographyVariant.H4],marginTop:n.spacing[a.SizeVariant.Md],marginBottom:n.spacing[a.SizeVariant.Md]},[t.TypographyVariant.H5]:{fontSize:i.font.size[t.TypographyVariant.H5],fontWeight:i.font.weight.normal,lineHeight:i.font.line.height[t.TypographyVariant.H5],marginTop:n.spacing[a.SizeVariant.Sm],marginBottom:n.spacing[a.SizeVariant.Sm]},[t.TypographyVariant.H6]:{fontSize:i.font.size[t.TypographyVariant.H6],fontWeight:i.font.weight.normal,lineHeight:i.font.line.height[t.TypographyVariant.H6],marginTop:n.spacing[a.SizeVariant.Sm],marginBottom:n.spacing[a.SizeVariant.Sm]},[t.TypographyVariant.Bold]:{fontWeight:i.font.weight.bold},[t.TypographyVariant.Italic]:{fontStyle:"italic"},[t.TypographyVariant.Body1]:{fontSize:i.font.size[t.TypographyVariant.Body1],fontWeight:i.font.weight.normal,lineHeight:i.font.line.height[t.TypographyVariant.Body1]},[t.TypographyVariant.Body2]:{fontSize:i.font.size[t.TypographyVariant.Body2],fontWeight:i.font.weight.normal,lineHeight:i.font.line.height[t.TypographyVariant.Body2]},[t.TypographyVariant.Caption]:{fontSize:i.font.size[t.TypographyVariant.Caption],fontWeight:i.font.weight.normal,lineHeight:i.font.line.height[t.TypographyVariant.Caption]},[t.TypographyVariant.Display]:{[a.SizeVariant.Xs]:{fontSize:i.font.size[a.SizeVariant.Xs],lineHeight:i.font.line.height[a.SizeVariant.Xs]},[a.SizeVariant.Sm]:{fontSize:i.font.size[a.SizeVariant.Sm],lineHeight:i.font.line.height[a.SizeVariant.Sm]},[a.SizeVariant.Md]:{fontSize:i.font.size[a.SizeVariant.Md],lineHeight:i.font.line.height[a.SizeVariant.Md]},[a.SizeVariant.Lg]:{fontSize:i.font.size[a.SizeVariant.Lg],lineHeight:i.font.line.height[a.SizeVariant.Lg]},[a.SizeVariant.Xl]:{fontSize:i.font.size[a.SizeVariant.Xl],lineHeight:i.font.line.height[a.SizeVariant.Xl]}},styleVariant:{[t.TypographyStyleVariant.Light]:{fontWeight:i.font.weight.light},[t.TypographyStyleVariant.Normal]:{fontWeight:i.font.weight.normal},[t.TypographyStyleVariant.Semibold]:{fontWeight:i.font.weight.medium},[t.TypographyStyleVariant.Bold]:{fontWeight:i.font.weight.bold},[t.TypographyStyleVariant.Italic]:{fontStyle:"italic"},[t.TypographyStyleVariant.Small]:{fontSize:i.font.size[t.TypographyVariant.Body2]},[t.TypographyStyleVariant.Uppercase]:{textTransform:"uppercase"},[t.TypographyStyleVariant.Lowercase]:{textTransform:"lowercase"},[t.TypographyStyleVariant.Underline]:{textDecoration:"underline"},[t.TypographyStyleVariant.Strike]:{textDecoration:"line-through"}}};exports.typography=e;

package/tokens/utils.d.ts

@@ -1,4 +1,4 @@
-import { CSSObject } from 'styled-components';
+import { CSSObject } from '@emotion/react';
 import { BoxComputedStyles, BoxStyles, EnumOrPrimitive, InlineBoxStyles, TabIndex } from '../types';
 import { FocusStyles, SpacingKey, Unit } from './types/index.types';
 import { colors } from './colors';
@@ -11,7 +11,12 @@ export declare const generateStateStyles: (color: keyof typeof colors) => {
         border: number;
     };
 };
-export declare const convertJsonToCssKeyframe: (keyframeJson?: Record<string, CSSObject>) => import('styled-components/dist/models/Keyframes').default;
+export declare const convertJsonToCssKeyframeCss: (keyframeJson?: Record<string, CSSObject>) => {
+    name: string;
+    styles: string;
+    anim: 1;
+    toString: () => string;
+} & string;
 export declare const convertToUnit: (value: string | number, unit?: EnumOrPrimitive<Unit>) => string;
 export declare const getSpacing: (sizeKey?: EnumOrPrimitive<SpacingKey> | number, unit?: EnumOrPrimitive<Unit>) => string | number;
 export declare const hexToRgba: (hex: string, alpha?: number) => string;
@@ -20,15 +25,15 @@ export declare const getFocusStyles: ({ inset, borderRadius, border }: FocusStyl
     '&::after': {
         content: string;
         position: string;
-        top: `${number}px` | `${number}rem` | `${number}%`;
-        right: `${number}px` | `${number}rem` | `${number}%`;
-        bottom: `${number}px` | `${number}rem` | `${number}%`;
-        left: `${number}px` | `${number}rem` | `${number}%`;
+        top: `${number}px` | `${number}rem` | `${number}%` | `${number}em`;
+        right: `${number}px` | `${number}rem` | `${number}%` | `${number}em`;
+        bottom: `${number}px` | `${number}rem` | `${number}%` | `${number}em`;
+        left: `${number}px` | `${number}rem` | `${number}%` | `${number}em`;
         border: string;
-        borderRadius: `${number}px` | `${number}rem` | `${number}%` | undefined;
+        borderRadius: `${number}px` | `${number}rem` | `${number}%` | `${number}em` | undefined;
     };
 };
-export declare const getBoxStyles: (boxStyles?: BoxStyles<TabIndex>) => {
+export declare const getBoxStyles: (boxStyles?: BoxStyles<number>) => {
     boxStyles: BoxComputedStyles<TabIndex>;
     restProps: BoxComputedStyles<TabIndex>;
 };

package/tokens/utils.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const S=require("@emotion/react"),l=require("../types/common.js"),s=require("./types/index.types.js"),g=require("./constants.js"),p=require("./colors.js"),u=require("./spacing.js"),f=require("./borders.js"),d=e=>{var t;return{focus:{outline:`${a(2,s.Unit.Rem)} solid ${(t=p.colors)==null?void 0:t[e]}`},disabled:{cursor:"not-allowed",border:0}}},$=(e={})=>{const t=Object.entries(e).reduce((r,n)=>{const[o,c]=n;for(const i in c)r+=`${o} { ${i}: ${c[i]} } `;return r},"");return S.keyframes`${t}`},a=(e,t=s.Unit.Px)=>{const r=typeof e=="number"?e:parseFloat(e);switch(t){case s.Unit.Rem:return`${r/16}${t}`;case s.Unit.Percents:return`${r/100}${t}`;default:return`${r}${t}`}},m=(e=l.SizeVariant.Sm,t=s.Unit.Px)=>{const r=typeof e=="number"?parseFloat(u.spacing[l.SizeVariant.Xs])*e:u.spacing[e];return a(r,t)},b=(e,t=1)=>{let r=0,n=0,o=0;return e.length===4?(r=parseInt(e[1]+e[1],16),n=parseInt(e[2]+e[2],16),o=parseInt(e[3]+e[3],16)):e.length===7&&(r=parseInt(e[1]+e[2],16),n=parseInt(e[3]+e[4],16),o=parseInt(e[5]+e[6],16)),`rgba(${isNaN(r)?0:r}, ${isNaN(n)?0:n}, ${isNaN(o)?0:o}, ${t})`},y=({inset:e,borderRadius:t,border:r=f.borders.focus})=>({position:"relative","&::after":{content:'""',position:"absolute",top:e,right:e,bottom:e,left:e,border:r,borderRadius:t}}),I=(e={})=>Object.entries(e).reduce((t,[r,n])=>{const o=r.replace("$",""),c=g.BOX_STYLE_PROPS.includes(o);return typeof n<"u"&&(t[c?"boxStyles":"restProps"][o]=n),t},{boxStyles:{},restProps:{}}),P=(e={})=>Object.entries(e).reduce((t,[r,n])=>{const o=g.BOX_STYLE_PROPS.includes(r)?`$${r}`:r;return n&&(t[o]=n),t},{}),T=(e,t="data:image/svg+xml")=>`url("${t},${encodeURIComponent(e)}")`;exports.convertJsonToCssKeyframeCss=$;exports.convertToInlineBoxStyles=P;exports.convertToUnit=a;exports.generateStateStyles=d;exports.getBoxStyles=I;exports.getFocusStyles=y;exports.getImgSrc=T;exports.getSpacing=m;exports.hexToRgba=b;

package/tokens/values.d.ts

@@ -41,9 +41,22 @@ export declare const values: {
             toggle: string;
             icon: string;
         };
+        select: {
+            arrowIconWrapper: string;
+        };
     };
     transform: {
         rotateUp: string;
         rotateReset: string;
     };
+    separator: {
+        thickness: {
+            xs: string;
+            sm: string;
+            md: string;
+            lg: string;
+            xl: string;
+            xxl: string;
+        };
+    };
 };

package/tokens/values.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("../constants/positioning.js"),e=require("../types/common.js"),r=require("./utils.js"),t=require("./radius.js"),n=require("./borders.js"),s=require("./types/index.types.js"),a={borderThin:r.convertToUnit(1,s.Unit.Rem),borderMedium:r.convertToUnit(2,s.Unit.Rem),borderThick:r.convertToUnit(4,s.Unit.Rem),borderNone:n.borders.none,border:{radius:{none:t.radius.none}},screenSmall:"480px",screenMedium:"768px",screenLarge:"1024px",screenXLarge:"1280px",responsiveSmall:"20%",responsiveMedium:"40%",responsiveLarge:"60%",responsiveXLarge:"80%",zIndex:{snackbar:o.Z_INDEX.HIGH},transitions:{stepper:{separator:"border 0.2s ease-in-out",stepIcon:"background 0.2s ease-in-out, border 0.2s ease-in-out"},button:{default:"background 0.2s ease-in-out, border 0.2s ease-in-out"},scroll:{scrollbar:"opacity 0.2s ease-in-out",thumb:"top 0.1s cubic-bezier(0.4,0,0.2,1)"},rating:{label:"transform 0.2s ease-in-out"},progressbar:{styledDeterminateFill:"width 300ms ease"},accordion:{toggle:"0.15s ease-out",icon:"transform 0.3s ease"},select:{arrowIconWrapper:"transform 0.3s ease"}},transform:{rotateUp:"rotate(180deg)",rotateReset:"rotate(0deg)"},separator:{thickness:{[e.SizeVariant.Xs]:"0.5px",[e.SizeVariant.Sm]:"1px",[e.SizeVariant.Md]:"2px",[e.SizeVariant.Lg]:"3px",[e.SizeVariant.Xl]:"4px",[e.SizeVariant.Xxl]:"5px"}}};exports.values=a;

package/tokens/wrapper.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("../constants/positioning.js"),e=require("../types/wrapper.js"),r={default:{justifyContent:"center",alignItems:"center",backdropFilter:"blur(2px)",backgroundColor:"rgba(0, 0, 0, 0.1)"},[e.WrapperVariant.Inline]:{display:"inline-flex"},[e.WrapperVariant.Section]:{display:"flex",top:0,left:0,width:"100%",height:"100%",position:"absolute",zIndex:t.Z_INDEX.HIGH},[e.WrapperVariant.FullPage]:{display:"flex",position:"fixed",top:0,left:0,width:"100vw",height:"100vh",zIndex:t.Z_INDEX.TOP}};exports.wrapper=r;

package/types/accesability.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});var r=(i=>(i[i.Default=0]="Default",i[i.Disabled=-1]="Disabled",i[i.HighPriority=1]="HighPriority",i))(r||{});exports.TabIndex=r;

package/types/button.d.ts

@@ -0,0 +1,28 @@
+export declare enum ButtonVariant {
+    Contained = "contained",
+    Outlined = "outlined",
+    Text = "text",
+    Inherit = "inherit"
+}
+export declare enum ButtonColorVariant {
+    Primary = "primary",
+    Secondary = "secondary"
+}
+export declare enum ButtonTypes {
+    Button = "button",
+    Submit = "submit",
+    Reset = "reset"
+}
+export declare enum ButtonAriaLabel {
+    Button = "Button",
+    Submit = "Submit",
+    Cancel = "Cancel",
+    Close = "Close"
+}
+export declare enum ButtonRole {
+    Button = "button",
+    Link = "link",
+    Checkbox = "checkbox",
+    Switch = "switch",
+    Tab = "tab"
+}

package/types/button.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});var r=(e=>(e.Contained="contained",e.Outlined="outlined",e.Text="text",e.Inherit="inherit",e))(r||{}),t=(e=>(e.Primary="primary",e.Secondary="secondary",e))(t||{}),i=(e=>(e.Button="button",e.Submit="submit",e.Reset="reset",e))(i||{}),n=(e=>(e.Button="button",e.Link="link",e.Checkbox="checkbox",e.Switch="switch",e.Tab="tab",e))(n||{});exports.ButtonColorVariant=t;exports.ButtonRole=n;exports.ButtonTypes=i;exports.ButtonVariant=r;

package/types/card.d.ts

@@ -0,0 +1,8 @@
+export declare enum CardVariant {
+    Vertical = "Vertical",
+    Horizontal = "Horizontal"
+}
+export declare enum CardSizeVariant {
+    Default = "default",
+    Sm = "sm"
+}

package/types/card.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});var t=(r=>(r.Vertical="Vertical",r.Horizontal="Horizontal",r))(t||{}),e=(r=>(r.Default="default",r.Sm="sm",r))(e||{});exports.CardSizeVariant=e;exports.CardVariant=t;

package/types/chat.d.ts

@@ -0,0 +1,5 @@
+export declare enum ChatLayoutVariant {
+    Auto = "auto",
+    Desktop = "desktop",
+    Drawer = "drawer"
+}

package/types/chat.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});var r=(e=>(e.Auto="auto",e.Desktop="desktop",e.Drawer="drawer",e))(r||{});exports.ChatLayoutVariant=r;

package/types/common.d.ts

@@ -0,0 +1,12 @@
+export declare enum SizeVariant {
+    Xs = "xs",
+    Sm = "sm",
+    Md = "md",
+    Lg = "lg",
+    Xl = "xl",
+    Xxl = "xxl"
+}
+export declare enum Orientation {
+    Vertical = "vertical",
+    Horizontal = "horizontal"
+}

package/types/common.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});var r=(l=>(l.Xs="xs",l.Sm="sm",l.Md="md",l.Lg="lg",l.Xl="xl",l.Xxl="xxl",l))(r||{}),o=(l=>(l.Vertical="vertical",l.Horizontal="horizontal",l))(o||{});exports.Orientation=o;exports.SizeVariant=r;

package/types/cursors.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});var t=(e=>(e.Default="default",e.Pointer="pointer",e.Text="text",e.Move="move",e.Wait="wait",e.Crosshair="crosshair",e.NotAllowed="not-allowed",e.Help="help",e.ZoomIn="zoom-in",e.ZoomOut="zoom-out",e.Grab="grab",e.Grabbing="grabbing",e))(t||{});exports.Cursors=t;

package/types/index.d.ts

@@ -2,3 +2,19 @@ export * from './keys';
 export * from './accesability';
 export * from './styles';
 export * from './misc';
+export * from './common';
+export * from './card';
+export * from './typography';
+export * from './layout';
+export * from './input';
+export * from './button';
+export * from './label';
+export * from './cursors';
+export * from './stepper';
+export * from './wrapper';
+export * from './link';
+export * from './list';
+export * from './skeleton';
+export * from './snackbar';
+export * from './chat';
+export * from './separator';

package/types/input.d.ts

@@ -0,0 +1,30 @@
+export declare enum InputVariantType {
+    Text = "text",
+    Password = "password",
+    Email = "email",
+    Search = "search",
+    Url = "url",
+    Tel = "tel",
+    Date = "date",
+    Time = "time",
+    Month = "month",
+    Week = "week",
+    Color = "color",
+    Range = "range",
+    Number = "number",
+    Radio = "radio",
+    Checkbox = "checkbox"
+}
+export declare enum InputColorVariant {
+    Primary = "primary",
+    Success = "success",
+    Warning = "warning",
+    Error = "error"
+}
+export declare enum InputRole {
+    Textbox = "textbox",
+    Checkbox = "checkbox",
+    Radio = "radio",
+    Radiogroup = "radiogroup",
+    Combobox = "combobox"
+}

package/types/input.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});var r=(o=>(o.Text="text",o.Password="password",o.Email="email",o.Search="search",o.Url="url",o.Tel="tel",o.Date="date",o.Time="time",o.Month="month",o.Week="week",o.Color="color",o.Range="range",o.Number="number",o.Radio="radio",o.Checkbox="checkbox",o))(r||{}),e=(o=>(o.Primary="primary",o.Success="success",o.Warning="warning",o.Error="error",o))(e||{}),c=(o=>(o.Textbox="textbox",o.Checkbox="checkbox",o.Radio="radio",o.Radiogroup="radiogroup",o.Combobox="combobox",o))(c||{});exports.InputColorVariant=e;exports.InputRole=c;exports.InputVariantType=r;

package/types/label.d.ts

@@ -0,0 +1,4 @@
+export declare enum LabelPosition {
+    Left = "left",
+    Right = "right"
+}

package/types/label.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});var e=(t=>(t.Left="left",t.Right="right",t))(e||{});exports.LabelPosition=e;

package/{components/layout/index.types.d.ts → types/layout.d.ts}

@@ -4,3 +4,5 @@ export declare const enum FlexDirection {
     Column = "column",
     ColumnReverse = "column-reverse"
 }
+export type AlignType = 'start' | 'center' | 'end' | 'stretch';
+export type JustifyType = 'start' | 'center' | 'end' | 'between' | 'around';

package/types/layout.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});var r=(e=>(e.Row="row",e.RowReverse="row-reverse",e.Column="column",e.ColumnReverse="column-reverse",e))(r||{});exports.FlexDirection=r;

package/types/link.d.ts

@@ -0,0 +1,18 @@
+export declare enum LinkVariant {
+    Primary = "primary",
+    Secondary = "secondary",
+    Inverted = "inverted",
+    Inherit = "inherit"
+}
+export declare enum LinkTarget {
+    Blank = "_blank",
+    Self = "_self",
+    Parent = "_parent",
+    Top = "_top",
+    Framename = "framename"
+}
+export declare enum LinkRel {
+    Nofollow = "nofollow",
+    Noopener = "noopener",
+    Noreferrer = "noreferrer"
+}

package/types/link.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});var r=(e=>(e.Primary="primary",e.Secondary="secondary",e.Inverted="inverted",e.Inherit="inherit",e))(r||{}),t=(e=>(e.Blank="_blank",e.Self="_self",e.Parent="_parent",e.Top="_top",e.Framename="framename",e))(t||{});exports.LinkTarget=t;exports.LinkVariant=r;

package/types/list.d.ts

@@ -0,0 +1,6 @@
+export declare enum ListVariant {
+    OrderedCircle = "ordered-circle",
+    OrderedSquare = "ordered-square",
+    UnorderedDot = "unordered-dot",
+    UnorderedCheck = "unordered-check"
+}

package/types/list.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});var r=(e=>(e.OrderedCircle="ordered-circle",e.OrderedSquare="ordered-square",e.UnorderedDot="unordered-dot",e.UnorderedCheck="unordered-check",e))(r||{});exports.ListVariant=r;

package/types/misc.d.ts

@@ -3,4 +3,15 @@ export type EnumOrPrimitive<T extends string | number> = T | `${T}`;
 export interface WithOptional<T = undefined> {
     value?: T;
 }
+/**
+ * Extracts keys from a given type `T` where the key starts with a given string prefix.
+ *
+ * @example
+ * type MarginKeys = ExtractKeysByPrefix<BoxCssComponentProps, 'margin'>;
+ *
+ * Result: "margin" | "marginTop" | "marginBottom" ...
+ */
+export type KeysByPrefix<T, Prefix extends string> = Extract<{
+    [K in keyof T]: K extends `${Prefix}${string}` ? K : never;
+}[keyof T], keyof T>;
 export type Maybe<T> = T | null;

package/types/separator.d.ts

@@ -0,0 +1,10 @@
+export declare enum SeparatorVariant {
+    Solid = "solid",
+    Dash = "dashed",
+    Dot = "dotted"
+}
+export declare enum SeparatorLabelPosition {
+    Start = "start",
+    Center = "center",
+    End = "end"
+}

package/types/separator.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});var t=(e=>(e.Solid="solid",e.Dash="dashed",e.Dot="dotted",e))(t||{}),d=(e=>(e.Start="start",e.Center="center",e.End="end",e))(d||{});exports.SeparatorLabelPosition=d;exports.SeparatorVariant=t;

package/types/skeleton.d.ts

@@ -0,0 +1,5 @@
+export declare enum SkeletonVariant {
+    Rectangular = "rectangular",
+    Rounded = "rounded",
+    Circular = "circular"
+}

package/types/skeleton.js

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});var e=(r=>(r.Rectangular="rectangular",r.Rounded="rounded",r.Circular="circular",r))(e||{});exports.SkeletonVariant=e;