greenole-design-system 1.1.60 → 1.1.61

package/dist/base-components/Space/Space.types.d.ts

@@ -1,4 +1,4 @@
-export type SpaceHeight = "spacing-1" | "spacing-2" | "spacing-4" | "spacing-8" | "spacing-12" | "spacing-16" | "spacing-24" | "spacing-32" | "spacing-40" | "spacing-48" | "spacing-56" | "spacing-64" | "spacing-72" | "spacing-80" | "spacing-104";
+export type SpaceHeight = "spacing-1" | "spacing-2" | "spacing-3" | "spacing-4" | "spacing-5" | "spacing-6" | "spacing-8" | "spacing-10" | "spacing-12" | "spacing-16" | "spacing-20" | "spacing-24" | "spacing-32" | "spacing-40" | "spacing-48" | "spacing-56" | "spacing-64" | "spacing-72" | "spacing-80" | "spacing-96";
 export declare const spaceHeights: Record<SpaceHeight, number>;
 export interface SpaceProps {
     height?: SpaceHeight;

package/dist/greenole-design-system.cjs.js

@@ -1069,7 +1069,7 @@ See https://s-c.sh/2BAXzed for more info.`),window[B0]+=1);const t1={h1:F`
   );
   background-size: 200px 100%;
   animation: ${Un} 1.5s infinite linear;
-`,s8=({width:e="100%",height:t="16px",borderRadius:n="4px"})=>r.jsx(Wn,{width:e,height:t,borderRadius:n}),Yn={"spacing-1":1,"spacing-2":2,"spacing-4":4,"spacing-8":8,"spacing-12":12,"spacing-16":16,"spacing-24":24,"spacing-32":32,"spacing-40":40,"spacing-48":48,"spacing-56":56,"spacing-64":64,"spacing-72":72,"spacing-80":80,"spacing-104":104},Gn=H.div`
+`,s8=({width:e="100%",height:t="16px",borderRadius:n="4px"})=>r.jsx(Wn,{width:e,height:t,borderRadius:n}),Yn={"spacing-1":4,"spacing-2":8,"spacing-3":12,"spacing-4":16,"spacing-5":20,"spacing-6":24,"spacing-8":32,"spacing-10":40,"spacing-12":48,"spacing-16":64,"spacing-20":80,"spacing-24":96,"spacing-32":128,"spacing-40":160,"spacing-48":192,"spacing-56":224,"spacing-64":256,"spacing-72":288,"spacing-80":320,"spacing-96":384},Gn=H.div`
   display: flex;
   align-items: center;
   justify-content: center;

package/dist/greenole-design-system.cjs2.js

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n={neutral:{soft:"#F4F7FA",lightest:"#E6EBF2",lighter:"#C3CED8",light:"#9FADBA",medium:"#62768A",dark:"#2E4151",darker:"#202F3C",darkest:"#101C26"},brand:{softest:"#DEF8E2",soft:"#26C45B",main:"#118E34",medium:"#0B662A",darkest:"#033B12"},success:{soft:"#00DC7D",dark:"#1C904A"},danger:{base:"#E2222A",dark:"#B7151B"},warning:{base:"#FF9900"},link:{light:"#2981FD",dark:"#0351C1"},red:{500:"#FDE7E8",600:"#DD6764",700:"#CE0000",800:"#9B0000",900:"#670103"},orange:{400:"#FFFAF3",500:"#FDEDD8",600:"#F2B177",700:"#E49145",800:"#B75E13",900:"#773F0B"},yellow:{400:"#FFF4D2",500:"#FEE69F",600:"#FED871",700:"#F3C148",800:"#BF921C",900:"#7E610B"},green:{400:"#E2F8D9",500:"#B2E59C",600:"#93C57D",700:"#6AA758",800:"#397428",900:"#294D12"},cyan:{400:"#DDECED",500:"#A2C4C7",600:"#79A4B4",700:"#47818D",800:"#105057",900:"#0B333A"},blue:{400:"#DEECFF",500:"#C6DBF8",600:"#A2C4F1",700:"#699EEB",800:"#3978D7",900:"#1555CC"},purple:{400:"#EFE6FB",500:"#BA96EE",600:"#9E69E9",700:"#5300CF",800:"#4100CA",900:"#1800C2"},pink:{400:"#F9E4EE",500:"#F0BCD5",600:"#E2679E",700:"#B32867",800:"#9D2661",900:"#772155"},grey:{200:"#F8F8F8",300:"#EDEDED",400:"#C9C9C9",500:"#B4B4B4",600:"#999997",700:"#666667",800:"#434345",900:"#020202"}},b={dashboard:"#FAFAFC",card:"#FEFEFE"},h={light:{light:"#FEFEFE",dark:n.neutral.darkest,brand:n.brand.main,"brand-softest":n.brand.softest,"brand-soft":n.brand.soft,"brand-medium":n.brand.medium,"brand-darkest":n.brand.darkest,"background-dashboard":b.dashboard,"background-card":b.card,background:b.dashboard,"background-hover":n.neutral.lightest,surface:b.card,"surface-hover":n.neutral.lightest,"on-background":n.neutral.dark,"on-background-hover":n.neutral.darker,"on-surface":n.neutral.darkest,"on-surface-hover":n.neutral.dark,"on-brand":"#FFFFFF","on-brand-hover":"#FFFFFF",sidebar:n.brand.main,"on-sidebar":"#FFFFFF","sidebar-hover":n.brand.medium,"on-sidebar-hover":"#FFFFFF",danger:n.danger.base,"on-danger":"#FFFFFF","danger-dark":n.danger.dark,success:n.success.soft,"on-success":"#FFFFFF","success-dark":n.success.dark,warning:n.warning.base,"on-warning":n.neutral.darkest,link:n.link.light,"link-dark":n.link.dark,"neutral-soft":n.neutral.soft,"neutral-lightest":n.neutral.lightest,"neutral-lighter":n.neutral.lighter,"neutral-light":n.neutral.light,"neutral-medium":n.neutral.medium,"neutral-dark":n.neutral.dark,"neutral-darker":n.neutral.darker,"neutral-darkest":n.neutral.darkest,"box-shadow-dialog":"0 11px 15px -7px rgba(0, 0, 0, 0.2), 0 24px 38px 3px rgba(0, 0, 0, 0.14), 0 9px 46px 8px rgba(0, 0, 0, 0.12)"},dark:{light:n.neutral.darkest,dark:"#FEFEFE",brand:n.brand.soft,"brand-softest":n.brand.darkest,"brand-soft":n.brand.main,"brand-medium":n.brand.soft,"brand-darkest":n.brand.softest,background:"#1E1E1E","background-dashboard":"#1E1E1E","background-card":"#2D2C2C","background-hover":"#292828",surface:"#2D2C2C","surface-hover":"#323131","on-background":n.neutral.lighter,"on-background-hover":n.neutral.lightest,"on-surface":n.neutral.lightest,"on-surface-hover":n.neutral.lighter,"on-brand":n.neutral.darkest,"on-brand-hover":n.neutral.darkest,sidebar:n.brand.soft,"on-sidebar":n.neutral.darkest,"sidebar-hover":n.brand.main,"on-sidebar-hover":n.neutral.darkest,danger:n.danger.base,"on-danger":"#FFFFFF","danger-dark":n.danger.dark,success:n.success.soft,"on-success":"#FFFFFF","success-dark":n.success.dark,warning:n.warning.base,"on-warning":"#FFFFFF",link:n.link.light,"link-dark":n.link.dark,"neutral-soft":n.neutral.darkest,"neutral-lightest":n.neutral.darker,"neutral-lighter":n.neutral.dark,"neutral-light":n.neutral.medium,"neutral-medium":n.neutral.medium,"neutral-dark":n.neutral.light,"neutral-darker":n.neutral.lighter,"neutral-darkest":n.neutral.lightest,"box-shadow-dialog":"0 11px 15px -7px rgba(0, 0, 0, 0.4), 0 24px 38px 3px rgba(0, 0, 0, 0.3), 0 9px 46px 8px rgba(0, 0, 0, 0.25)"}},p={primary:"Roboto, sans-serif",mono:"monospace",sans:"Roboto, sans-serif"},i={h1:"56px",h2:"48px",h3:"40px",h4:"32px",h5:"24px",h6:"20px","subtitle-regular":"32px","subtitle-medium":"24px","body-xl":"18px","body-lg":"16px","body-md":"14px","body-sm":"12px",caption:"10px"},s={regular:400,medium:500,semibold:600,bold:700},a={h1:"150%",h2:"150%",h3:"40px",h4:"32px",h5:"24px","subtitle-regular":"24px","subtitle-medium":"24px","body-xl":"24px","body-lg":"24px","body-md":"20px","body-sm":"16px",caption:"16px",tight:"120%",normal:"150%",relaxed:"180%"},E={h1:{fontSize:i.h1,fontWeight:s.bold,lineHeight:a.h1},h2:{fontSize:i.h2,fontWeight:s.bold,lineHeight:a.h2},h3:{fontSize:i.h3,fontWeight:s.bold,lineHeight:a.h3},h4:{fontSize:i.h4,fontWeight:s.bold,lineHeight:a.h4},h5:{fontSize:i.h5,fontWeight:s.bold,lineHeight:a.h5},h6:{fontSize:i.h6,fontWeight:s.bold,lineHeight:"150%"},"subtitle-regular":{fontSize:i["subtitle-regular"],fontWeight:s.regular,lineHeight:a["subtitle-regular"]},"subtitle-medium":{fontSize:i["subtitle-medium"],fontWeight:s.medium,lineHeight:a["subtitle-medium"]},"body-xl-regular":{fontSize:i["body-xl"],fontWeight:s.regular,lineHeight:a["body-xl"]},"body-xl-medium":{fontSize:i["body-xl"],fontWeight:s.medium,lineHeight:a["body-xl"]},"body-xl-semibold":{fontSize:i["body-xl"],fontWeight:s.semibold,lineHeight:a["body-xl"]},"body-xl-bold":{fontSize:i["body-xl"],fontWeight:s.bold,lineHeight:a["body-xl"]},"body-lg-regular":{fontSize:i["body-lg"],fontWeight:s.regular,lineHeight:a["body-lg"]},"body-lg-medium":{fontSize:i["body-lg"],fontWeight:s.medium,lineHeight:a["body-lg"]},"body-lg-semibold":{fontSize:i["body-lg"],fontWeight:s.semibold,lineHeight:a["body-lg"]},"body-lg-bold":{fontSize:i["body-lg"],fontWeight:s.bold,lineHeight:a["body-lg"]},"body-md-regular":{fontSize:i["body-md"],fontWeight:s.regular,lineHeight:a["body-md"]},"body-md-medium":{fontSize:i["body-md"],fontWeight:s.medium,lineHeight:a["body-md"]},"body-md-semibold":{fontSize:i["body-md"],fontWeight:s.semibold,lineHeight:a["body-md"]},"body-md-bold":{fontSize:i["body-md"],fontWeight:s.bold,lineHeight:a["body-md"]},"body-sm-regular":{fontSize:i["body-sm"],fontWeight:s.regular,lineHeight:a["body-sm"]},"body-sm-medium":{fontSize:i["body-sm"],fontWeight:s.medium,lineHeight:a["body-sm"]},"body-sm-semibold":{fontSize:i["body-sm"],fontWeight:s.semibold,lineHeight:a["body-sm"]},"body-sm-bold":{fontSize:i["body-sm"],fontWeight:s.bold,lineHeight:a["body-sm"]},"caption-regular":{fontSize:i.caption,fontWeight:s.regular,lineHeight:a.caption},"caption-medium":{fontSize:i.caption,fontWeight:s.medium,lineHeight:a.caption},"caption-semibold":{fontSize:i.caption,fontWeight:s.semibold,lineHeight:a.caption},"caption-bold":{fontSize:i.caption,fontWeight:s.bold,lineHeight:a.caption}},x={4:"4px",8:"8px",12:"12px",16:"16px",24:"24px",32:"32px",40:"40px",48:"48px",56:"56px",64:"64px",72:"72px",80:"80px",104:"104px"},F={none:"0",4:"4px",8:"8px",12:"12px",16:"16px",full:"9999px"},k={none:"none",xs:"0 1px 2px 0 rgba(124, 124, 131, 0.04)",sm:"0 1px 3px 0 rgba(124, 124, 131, 0.08), 0 1px 2px 0 rgba(124, 124, 131, 0.04)",md:"0 2px 4px -2px rgba(124, 124, 131, 0.08), 0 4px 8px -2px rgba(124, 124, 131, 0.12)",lg:"0 4px 6px -2px rgba(124, 124, 131, 0.04), 0 12px 16px -4px rgba(124, 124, 131, 0.08)",dialog:"0 11px 15px -7px rgba(0, 0, 0, 0.2), 0 24px 38px 3px rgba(0, 0, 0, 0.14), 0 9px 46px 8px rgba(0, 0, 0, 0.12)"},l=e=>`  /* ${e} */
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n={neutral:{soft:"#F4F7FA",lightest:"#E6EBF2",lighter:"#C3CED8",light:"#9FADBA",medium:"#62768A",dark:"#2E4151",darker:"#202F3C",darkest:"#101C26"},brand:{softest:"#DEF8E2",soft:"#26C45B",main:"#118E34",medium:"#0B662A",darkest:"#033B12"},success:{soft:"#00DC7D",dark:"#1C904A"},danger:{base:"#E2222A",dark:"#B7151B"},warning:{base:"#FF9900"},link:{light:"#2981FD",dark:"#0351C1"},red:{500:"#FDE7E8",600:"#DD6764",700:"#CE0000",800:"#9B0000",900:"#670103"},orange:{400:"#FFFAF3",500:"#FDEDD8",600:"#F2B177",700:"#E49145",800:"#B75E13",900:"#773F0B"},yellow:{400:"#FFF4D2",500:"#FEE69F",600:"#FED871",700:"#F3C148",800:"#BF921C",900:"#7E610B"},green:{400:"#E2F8D9",500:"#B2E59C",600:"#93C57D",700:"#6AA758",800:"#397428",900:"#294D12"},cyan:{400:"#DDECED",500:"#A2C4C7",600:"#79A4B4",700:"#47818D",800:"#105057",900:"#0B333A"},blue:{400:"#DEECFF",500:"#C6DBF8",600:"#A2C4F1",700:"#699EEB",800:"#3978D7",900:"#1555CC"},purple:{400:"#EFE6FB",500:"#BA96EE",600:"#9E69E9",700:"#5300CF",800:"#4100CA",900:"#1800C2"},pink:{400:"#F9E4EE",500:"#F0BCD5",600:"#E2679E",700:"#B32867",800:"#9D2661",900:"#772155"},grey:{200:"#F8F8F8",300:"#EDEDED",400:"#C9C9C9",500:"#B4B4B4",600:"#999997",700:"#666667",800:"#434345",900:"#020202"}},b={dashboard:"#FAFAFC",card:"#FEFEFE"},h={light:{light:"#FEFEFE",dark:n.neutral.darkest,brand:n.brand.main,"brand-softest":n.brand.softest,"brand-soft":n.brand.soft,"brand-medium":n.brand.medium,"brand-darkest":n.brand.darkest,"background-dashboard":b.dashboard,"background-card":b.card,background:b.dashboard,"background-hover":n.neutral.lightest,surface:b.card,"surface-hover":n.neutral.lightest,"on-background":n.neutral.dark,"on-background-hover":n.neutral.darker,"on-surface":n.neutral.darkest,"on-surface-hover":n.neutral.dark,"on-brand":"#FFFFFF","on-brand-hover":"#FFFFFF",sidebar:n.brand.main,"on-sidebar":"#FFFFFF","sidebar-hover":n.brand.medium,"on-sidebar-hover":"#FFFFFF",danger:n.danger.base,"on-danger":"#FFFFFF","danger-dark":n.danger.dark,success:n.success.soft,"on-success":"#FFFFFF","success-dark":n.success.dark,warning:n.warning.base,"on-warning":n.neutral.darkest,link:n.link.light,"link-dark":n.link.dark,"neutral-soft":n.neutral.soft,"neutral-lightest":n.neutral.lightest,"neutral-lighter":n.neutral.lighter,"neutral-light":n.neutral.light,"neutral-medium":n.neutral.medium,"neutral-dark":n.neutral.dark,"neutral-darker":n.neutral.darker,"neutral-darkest":n.neutral.darkest,"box-shadow-dialog":"0 11px 15px -7px rgba(0, 0, 0, 0.2), 0 24px 38px 3px rgba(0, 0, 0, 0.14), 0 9px 46px 8px rgba(0, 0, 0, 0.12)"},dark:{light:n.neutral.darkest,dark:"#FEFEFE",brand:n.brand.soft,"brand-softest":n.brand.darkest,"brand-soft":n.brand.main,"brand-medium":n.brand.soft,"brand-darkest":n.brand.softest,background:"#1E1E1E","background-dashboard":"#1E1E1E","background-card":"#2D2C2C","background-hover":"#292828",surface:"#2D2C2C","surface-hover":"#323131","on-background":n.neutral.lighter,"on-background-hover":n.neutral.lightest,"on-surface":n.neutral.lightest,"on-surface-hover":n.neutral.lighter,"on-brand":n.neutral.darkest,"on-brand-hover":n.neutral.darkest,sidebar:n.brand.soft,"on-sidebar":n.neutral.darkest,"sidebar-hover":n.brand.main,"on-sidebar-hover":n.neutral.darkest,danger:n.danger.base,"on-danger":"#FFFFFF","danger-dark":n.danger.dark,success:n.success.soft,"on-success":"#FFFFFF","success-dark":n.success.dark,warning:n.warning.base,"on-warning":"#FFFFFF",link:n.link.light,"link-dark":n.link.dark,"neutral-soft":n.neutral.darkest,"neutral-lightest":n.neutral.darker,"neutral-lighter":n.neutral.dark,"neutral-light":n.neutral.medium,"neutral-medium":n.neutral.medium,"neutral-dark":n.neutral.light,"neutral-darker":n.neutral.lighter,"neutral-darkest":n.neutral.lightest,"box-shadow-dialog":"0 11px 15px -7px rgba(0, 0, 0, 0.4), 0 24px 38px 3px rgba(0, 0, 0, 0.3), 0 9px 46px 8px rgba(0, 0, 0, 0.25)"}},p={primary:"Roboto, sans-serif",mono:"monospace",sans:"Roboto, sans-serif"},i={h1:"56px",h2:"48px",h3:"40px",h4:"32px",h5:"24px",h6:"20px","subtitle-regular":"32px","subtitle-medium":"24px","body-xl":"18px","body-lg":"16px","body-md":"14px","body-sm":"12px",caption:"10px"},s={regular:400,medium:500,semibold:600,bold:700},a={h1:"150%",h2:"150%",h3:"40px",h4:"32px",h5:"24px","subtitle-regular":"24px","subtitle-medium":"24px","body-xl":"24px","body-lg":"24px","body-md":"20px","body-sm":"16px",caption:"16px",tight:"120%",normal:"150%",relaxed:"180%"},E={h1:{fontSize:i.h1,fontWeight:s.bold,lineHeight:a.h1},h2:{fontSize:i.h2,fontWeight:s.bold,lineHeight:a.h2},h3:{fontSize:i.h3,fontWeight:s.bold,lineHeight:a.h3},h4:{fontSize:i.h4,fontWeight:s.bold,lineHeight:a.h4},h5:{fontSize:i.h5,fontWeight:s.bold,lineHeight:a.h5},h6:{fontSize:i.h6,fontWeight:s.bold,lineHeight:"150%"},"subtitle-regular":{fontSize:i["subtitle-regular"],fontWeight:s.regular,lineHeight:a["subtitle-regular"]},"subtitle-medium":{fontSize:i["subtitle-medium"],fontWeight:s.medium,lineHeight:a["subtitle-medium"]},"body-xl-regular":{fontSize:i["body-xl"],fontWeight:s.regular,lineHeight:a["body-xl"]},"body-xl-medium":{fontSize:i["body-xl"],fontWeight:s.medium,lineHeight:a["body-xl"]},"body-xl-semibold":{fontSize:i["body-xl"],fontWeight:s.semibold,lineHeight:a["body-xl"]},"body-xl-bold":{fontSize:i["body-xl"],fontWeight:s.bold,lineHeight:a["body-xl"]},"body-lg-regular":{fontSize:i["body-lg"],fontWeight:s.regular,lineHeight:a["body-lg"]},"body-lg-medium":{fontSize:i["body-lg"],fontWeight:s.medium,lineHeight:a["body-lg"]},"body-lg-semibold":{fontSize:i["body-lg"],fontWeight:s.semibold,lineHeight:a["body-lg"]},"body-lg-bold":{fontSize:i["body-lg"],fontWeight:s.bold,lineHeight:a["body-lg"]},"body-md-regular":{fontSize:i["body-md"],fontWeight:s.regular,lineHeight:a["body-md"]},"body-md-medium":{fontSize:i["body-md"],fontWeight:s.medium,lineHeight:a["body-md"]},"body-md-semibold":{fontSize:i["body-md"],fontWeight:s.semibold,lineHeight:a["body-md"]},"body-md-bold":{fontSize:i["body-md"],fontWeight:s.bold,lineHeight:a["body-md"]},"body-sm-regular":{fontSize:i["body-sm"],fontWeight:s.regular,lineHeight:a["body-sm"]},"body-sm-medium":{fontSize:i["body-sm"],fontWeight:s.medium,lineHeight:a["body-sm"]},"body-sm-semibold":{fontSize:i["body-sm"],fontWeight:s.semibold,lineHeight:a["body-sm"]},"body-sm-bold":{fontSize:i["body-sm"],fontWeight:s.bold,lineHeight:a["body-sm"]},"caption-regular":{fontSize:i.caption,fontWeight:s.regular,lineHeight:a.caption},"caption-medium":{fontSize:i.caption,fontWeight:s.medium,lineHeight:a.caption},"caption-semibold":{fontSize:i.caption,fontWeight:s.semibold,lineHeight:a.caption},"caption-bold":{fontSize:i.caption,fontWeight:s.bold,lineHeight:a.caption}},x={1:"4px",2:"8px",3:"12px",4:"16px",5:"20px",6:"24px",8:"32px",10:"40px",12:"48px",16:"64px",20:"80px",24:"96px",32:"128px",40:"160px",48:"192px",56:"224px",64:"256px",72:"288px",80:"320px",96:"384px"},F={none:"0",4:"4px",8:"8px",12:"12px",16:"16px",full:"9999px"},k={none:"none",xs:"0 1px 2px 0 rgba(124, 124, 131, 0.04)",sm:"0 1px 3px 0 rgba(124, 124, 131, 0.08), 0 1px 2px 0 rgba(124, 124, 131, 0.04)",md:"0 2px 4px -2px rgba(124, 124, 131, 0.08), 0 4px 8px -2px rgba(124, 124, 131, 0.12)",lg:"0 4px 6px -2px rgba(124, 124, 131, 0.04), 0 12px 16px -4px rgba(124, 124, 131, 0.08)",dialog:"0 11px 15px -7px rgba(0, 0, 0, 0.2), 0 24px 38px 3px rgba(0, 0, 0, 0.14), 0 9px 46px 8px rgba(0, 0, 0, 0.12)"},l=e=>`  /* ${e} */
 `,o=(e,r)=>`  --${e}: ${r};
 `;function $(){let e=l("Neutral Scale / Gray");return Object.entries(n.neutral).forEach(([r,t])=>{e+=o(`neutral-${r}`,t)}),e}function v(){let e=l("Primary / Brand Color - Green");return e+=o("brandcolor-main",n.brand.main),e+=o("brandcolor-softest",n.brand.softest),e+=o("brandcolor-soft",n.brand.soft),e+=o("brandcolor-medium",n.brand.medium),e+=o("brandcolor-darkest",n.brand.darkest),e}function z(){let e="";return e+=l("Feedback - Success"),e+=o("sucess-soft",n.success.soft),e+=o("sucess-dark",n.success.dark),e+=l("Feedback - Danger"),e+=o("danger",n.danger.base),e+=o("danger-dark",n.danger.dark),e+=l("Feedback - Warning"),e+=o("warning",n.warning.base),e+=l("Feedback - Link"),e+=o("link-soft",n.link.light),e+=o("link-dark",n.link.dark),e}function H(){let e="";return["red","orange","yellow","green","cyan","blue","purple","pink","grey"].forEach(t=>{const c=t.charAt(0).toUpperCase()+t.slice(1);e+=l(c),Object.entries(n[t]).forEach(([g,f])=>{e+=o(`${t}-${g}`,f)})}),e}function w(){let e=l("Semantic Colors (Light Theme)");return Object.entries(h.light).forEach(([r,t])=>{r!=="box-shadow-dialog"&&(e+=o(`color-${r}`,t))}),e}function D(){let e=l("Background Colors");return e+=o("brackgrounds-dashboards",h.light["background-dashboard"]),e+=o("brackgrounds-card",h.light["background-card"]),e+=o("background-soft",h.light.background),e+=l("Background (Dark)"),e+=o("background-dark-softest","#3A3939"),e+=o("background-dark-softin","#323131"),e+=o("background-dark-soft","#2D2C2C"),e+=o("background-dark-medium","#292828"),e+=o("background-dark-hard","#1E1E1E"),e+=o("background-dark-hardest","#19191C"),e}function B(){let e=l("Hover (Light)");return e+=o("hover-soft",h.light["background-hover"]),e+=o("hover-medium",n.neutral.lighter),e+=o("hover-dark","#C8C8C8"),e+=l("Hover (Dark)"),e+=o("hover-dark-soft","#434343"),e+=o("hover-dark-medium","#353434"),e+=o("hover-dark-hard","#292828"),e}function W(){let e="";return e+=l("Typography - Font Families"),Object.entries(p).forEach(([r,t])=>{e+=o(`font-family-${r}`,t)}),e+=l("Typography - Font Sizes"),Object.entries(i).forEach(([r,t])=>{e+=o(`font-size-${r}`,t)}),e+=l("Typography - Line Heights"),Object.entries(a).forEach(([r,t])=>{["tight","normal","relaxed"].includes(r)||(e+=o(`line-height-${r}`,t))}),e+=o("line-height-tight",a.tight),e+=o("line-height-normal",a.normal),e+=o("line-height-relaxed",a.relaxed),e}function j(){let e=l("Spacing (in px)");return Object.entries(x).forEach(([r,t])=>{e+=o(`spacing-${r}`,t)}),e}function O(){let e="";return e+=l("Border Radius"),Object.entries(F).forEach(([r,t])=>{e+=o(`radius-${r}`,t)}),e+=l("Box Shadows"),Object.entries(k).forEach(([r,t])=>{r!=="none"&&(e+=o(`shadow-${r}`,t))}),e}function A(){let e=`:root {
 `;return e+=$(),e+=`

package/dist/greenole-design-system.js

@@ -5406,21 +5406,26 @@ const St = H.div`
     borderRadius: n
   }
 ), xn = {
-  "spacing-1": 1,
-  "spacing-2": 2,
-  "spacing-4": 4,
-  "spacing-8": 8,
-  "spacing-12": 12,
-  "spacing-16": 16,
-  "spacing-24": 24,
-  "spacing-32": 32,
-  "spacing-40": 40,
-  "spacing-48": 48,
-  "spacing-56": 56,
-  "spacing-64": 64,
-  "spacing-72": 72,
-  "spacing-80": 80,
-  "spacing-104": 104
+  "spacing-1": 4,
+  "spacing-2": 8,
+  "spacing-3": 12,
+  "spacing-4": 16,
+  "spacing-5": 20,
+  "spacing-6": 24,
+  "spacing-8": 32,
+  "spacing-10": 40,
+  "spacing-12": 48,
+  "spacing-16": 64,
+  "spacing-20": 80,
+  "spacing-24": 96,
+  "spacing-32": 128,
+  "spacing-40": 160,
+  "spacing-48": 192,
+  "spacing-56": 224,
+  "spacing-64": 256,
+  "spacing-72": 288,
+  "spacing-80": 320,
+  "spacing-96": 384
 }, bn = H.div`
   display: flex;
   align-items: center;

package/dist/greenole-design-system2.js

@@ -392,19 +392,26 @@ const n = {
     lineHeight: a.caption
   }
 }, x = {
-  4: "4px",
-  8: "8px",
-  12: "12px",
-  16: "16px",
-  24: "24px",
-  32: "32px",
-  40: "40px",
-  48: "48px",
-  56: "56px",
-  64: "64px",
-  72: "72px",
-  80: "80px",
-  104: "104px"
+  1: "4px",
+  2: "8px",
+  3: "12px",
+  4: "16px",
+  5: "20px",
+  6: "24px",
+  8: "32px",
+  10: "40px",
+  12: "48px",
+  16: "64px",
+  20: "80px",
+  24: "96px",
+  32: "128px",
+  40: "160px",
+  48: "192px",
+  56: "224px",
+  64: "256px",
+  72: "288px",
+  80: "320px",
+  96: "384px"
 }, F = {
   none: "0",
   4: "4px",

package/dist/greenole.css

@@ -185,19 +185,26 @@
   --line-height-normal: 150%;
   --line-height-relaxed: 180%;
   /* Spacing (in px) */
-  --spacing-4: 4px;
-  --spacing-8: 8px;
-  --spacing-12: 12px;
-  --spacing-16: 16px;
-  --spacing-24: 24px;
-  --spacing-32: 32px;
-  --spacing-40: 40px;
-  --spacing-48: 48px;
-  --spacing-56: 56px;
-  --spacing-64: 64px;
-  --spacing-72: 72px;
-  --spacing-80: 80px;
-  --spacing-104: 104px;
+  --spacing-1: 4px;
+  --spacing-2: 8px;
+  --spacing-3: 12px;
+  --spacing-4: 16px;
+  --spacing-5: 20px;
+  --spacing-6: 24px;
+  --spacing-8: 32px;
+  --spacing-10: 40px;
+  --spacing-12: 48px;
+  --spacing-16: 64px;
+  --spacing-20: 80px;
+  --spacing-24: 96px;
+  --spacing-32: 128px;
+  --spacing-40: 160px;
+  --spacing-48: 192px;
+  --spacing-56: 224px;
+  --spacing-64: 256px;
+  --spacing-72: 288px;
+  --spacing-80: 320px;
+  --spacing-96: 384px;
   /* Border Radius */
   --radius-4: 4px;
   --radius-8: 8px;

package/dist/index.css

@@ -1 +1 @@
-:root{--neutral-soft: #F4F7FA;--neutral-lightest: #E6EBF2;--neutral-lighter: #C3CED8;--neutral-light: #9FADBA;--neutral-medium: #62768A;--neutral-dark: #2E4151;--neutral-darker: #202F3C;--neutral-darkest: #101C26;--brandcolor-main: #118E34;--brandcolor-softest: #DEF8E2;--brandcolor-soft: #26C45B;--brandcolor-medium: #0B662A;--brandcolor-darkest: #033B12;--sucess-soft: #00DC7D;--sucess-dark: #1C904A;--danger: #E2222A;--danger-dark: #B7151B;--warning: #FF9900;--link-soft: #2981FD;--link-dark: #0351C1;--red-500: #FDE7E8;--red-600: #DD6764;--red-700: #CE0000;--red-800: #9B0000;--red-900: #670103;--orange-400: #FFFAF3;--orange-500: #FDEDD8;--orange-600: #F2B177;--orange-700: #E49145;--orange-800: #B75E13;--orange-900: #773F0B;--yellow-400: #FFF4D2;--yellow-500: #FEE69F;--yellow-600: #FED871;--yellow-700: #F3C148;--yellow-800: #BF921C;--yellow-900: #7E610B;--green-400: #E2F8D9;--green-500: #B2E59C;--green-600: #93C57D;--green-700: #6AA758;--green-800: #397428;--green-900: #294D12;--cyan-400: #DDECED;--cyan-500: #A2C4C7;--cyan-600: #79A4B4;--cyan-700: #47818D;--cyan-800: #105057;--cyan-900: #0B333A;--blue-400: #DEECFF;--blue-500: #C6DBF8;--blue-600: #A2C4F1;--blue-700: #699EEB;--blue-800: #3978D7;--blue-900: #1555CC;--purple-400: #EFE6FB;--purple-500: #BA96EE;--purple-600: #9E69E9;--purple-700: #5300CF;--purple-800: #4100CA;--purple-900: #1800C2;--pink-400: #F9E4EE;--pink-500: #F0BCD5;--pink-600: #E2679E;--pink-700: #B32867;--pink-800: #9D2661;--pink-900: #772155;--grey-200: #F8F8F8;--grey-300: #EDEDED;--grey-400: #C9C9C9;--grey-500: #B4B4B4;--grey-600: #999997;--grey-700: #666667;--grey-800: #434345;--grey-900: #020202;--color-light: #FEFEFE;--color-dark: #101C26;--color-brand: #118E34;--color-brand-softest: #DEF8E2;--color-brand-soft: #26C45B;--color-brand-medium: #0B662A;--color-brand-darkest: #033B12;--color-background-dashboard: #FAFAFC;--color-background-card: #FEFEFE;--color-background: #FAFAFC;--color-background-hover: #E6EBF2;--color-surface: #FEFEFE;--color-surface-hover: #E6EBF2;--color-on-background: #2E4151;--color-on-background-hover: #202F3C;--color-on-surface: #101C26;--color-on-surface-hover: #2E4151;--color-on-brand: #FFFFFF;--color-on-brand-hover: #FFFFFF;--color-sidebar: #118E34;--color-on-sidebar: #FFFFFF;--color-sidebar-hover: #0B662A;--color-on-sidebar-hover: #FFFFFF;--color-danger: #E2222A;--color-on-danger: #FFFFFF;--color-danger-dark: #B7151B;--color-success: #00DC7D;--color-on-success: #FFFFFF;--color-success-dark: #1C904A;--color-warning: #FF9900;--color-on-warning: #101C26;--color-link: #2981FD;--color-link-dark: #0351C1;--color-neutral-soft: #F4F7FA;--color-neutral-lightest: #E6EBF2;--color-neutral-lighter: #C3CED8;--color-neutral-light: #9FADBA;--color-neutral-medium: #62768A;--color-neutral-dark: #2E4151;--color-neutral-darker: #202F3C;--color-neutral-darkest: #101C26;--brackgrounds-dashboards: #FAFAFC;--brackgrounds-card: #FEFEFE;--background-soft: #FAFAFC;--background-dark-softest: #3A3939;--background-dark-softin: #323131;--background-dark-soft: #2D2C2C;--background-dark-medium: #292828;--background-dark-hard: #1E1E1E;--background-dark-hardest: #19191C;--hover-soft: #E6EBF2;--hover-medium: #C3CED8;--hover-dark: #C8C8C8;--hover-dark-soft: #434343;--hover-dark-medium: #353434;--hover-dark-hard: #292828;--font-family-primary: Roboto, sans-serif;--font-family-mono: monospace;--font-family-sans: Roboto, sans-serif;--font-size-h1: 56px;--font-size-h2: 48px;--font-size-h3: 40px;--font-size-h4: 32px;--font-size-h5: 24px;--font-size-h6: 20px;--font-size-subtitle-regular: 32px;--font-size-subtitle-medium: 24px;--font-size-body-xl: 18px;--font-size-body-lg: 16px;--font-size-body-md: 14px;--font-size-body-sm: 12px;--font-size-caption: 10px;--line-height-h1: 150%;--line-height-h2: 150%;--line-height-h3: 40px;--line-height-h4: 32px;--line-height-h5: 24px;--line-height-subtitle-regular: 24px;--line-height-subtitle-medium: 24px;--line-height-body-xl: 24px;--line-height-body-lg: 24px;--line-height-body-md: 20px;--line-height-body-sm: 16px;--line-height-caption: 16px;--line-height-tight: 120%;--line-height-normal: 150%;--line-height-relaxed: 180%;--spacing-4: 4px;--spacing-8: 8px;--spacing-12: 12px;--spacing-16: 16px;--spacing-24: 24px;--spacing-32: 32px;--spacing-40: 40px;--spacing-48: 48px;--spacing-56: 56px;--spacing-64: 64px;--spacing-72: 72px;--spacing-80: 80px;--spacing-104: 104px;--radius-4: 4px;--radius-8: 8px;--radius-12: 12px;--radius-16: 16px;--radius-none: 0;--radius-full: 9999px;--shadow-xs: 0 1px 2px 0 rgba(124, 124, 131, .04);--shadow-sm: 0 1px 3px 0 rgba(124, 124, 131, .08), 0 1px 2px 0 rgba(124, 124, 131, .04);--shadow-md: 0 2px 4px -2px rgba(124, 124, 131, .08), 0 4px 8px -2px rgba(124, 124, 131, .12);--shadow-lg: 0 4px 6px -2px rgba(124, 124, 131, .04), 0 12px 16px -4px rgba(124, 124, 131, .08);--shadow-dialog: 0 11px 15px -7px rgba(0, 0, 0, .2), 0 24px 38px 3px rgba(0, 0, 0, .14), 0 9px 46px 8px rgba(0, 0, 0, .12)}.tw-m-5{margin:1.25rem}.tw-my-10{margin-top:2.5rem;margin-bottom:2.5rem}.tw-my-6{margin-top:1.5rem;margin-bottom:1.5rem}.tw-mt-10{margin-top:2.5rem}.tw-mt-5{margin-top:1.25rem}.tw-flex{display:flex}.tw-h-1\.5{height:.375rem}.tw-h-2\.5{height:.625rem}.tw-h-3\.5{height:.875rem}.tw-h-\[200px\]{height:200px}.tw-h-\[20vh\]{height:20vh}.tw-h-auto{height:auto}.tw-w-\[150px\]{width:150px}.tw-w-\[200px\]{width:200px}.tw-flex-col{flex-direction:column}.tw-items-center{align-items:center}.tw-items-baseline{align-items:baseline}.tw-justify-center{justify-content:center}.tw-gap-10{gap:2.5rem}.tw-gap-4{gap:1rem}.tw-gap-40{gap:10rem}.tw-gap-5{gap:1.25rem}.tw-gap-\[8px\]{gap:8px}.tw-space-y-4>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(1rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1rem * var(--tw-space-y-reverse))}.tw-whitespace-nowrap{white-space:nowrap}.tw-rounded-xl{border-radius:.75rem}.tw-border{border-width:1px}.tw-border-gray-200{--tw-border-opacity: 1;border-color:rgb(229 231 235 / var(--tw-border-opacity, 1))}.tw-bg-\[var\(--blue-700\)\]{background-color:var(--blue-700)}.tw-bg-\[var\(--brandcolor-main\)\]{background-color:var(--brandcolor-main)}.tw-bg-\[var\(--green-700\)\]{background-color:var(--green-700)}.tw-bg-\[var\(--neutral-grey\)\]{background-color:var(--neutral-grey)}.tw-bg-\[var\(--red-700\)\]{background-color:var(--red-700)}.tw-bg-gray-100{--tw-bg-opacity: 1;background-color:rgb(243 244 246 / var(--tw-bg-opacity, 1))}.tw-bg-white{--tw-bg-opacity: 1;background-color:rgb(255 255 255 / var(--tw-bg-opacity, 1))}.tw-p-4{padding:1rem}.tw-p-6{padding:1.5rem}.tw-p-\[16px\]{padding:16px}@keyframes spin{to{transform:rotate(360deg)}}.spin{animation:spin 1s linear infinite}
+:root{--neutral-soft: #F4F7FA;--neutral-lightest: #E6EBF2;--neutral-lighter: #C3CED8;--neutral-light: #9FADBA;--neutral-medium: #62768A;--neutral-dark: #2E4151;--neutral-darker: #202F3C;--neutral-darkest: #101C26;--brandcolor-main: #118E34;--brandcolor-softest: #DEF8E2;--brandcolor-soft: #26C45B;--brandcolor-medium: #0B662A;--brandcolor-darkest: #033B12;--sucess-soft: #00DC7D;--sucess-dark: #1C904A;--danger: #E2222A;--danger-dark: #B7151B;--warning: #FF9900;--link-soft: #2981FD;--link-dark: #0351C1;--red-500: #FDE7E8;--red-600: #DD6764;--red-700: #CE0000;--red-800: #9B0000;--red-900: #670103;--orange-400: #FFFAF3;--orange-500: #FDEDD8;--orange-600: #F2B177;--orange-700: #E49145;--orange-800: #B75E13;--orange-900: #773F0B;--yellow-400: #FFF4D2;--yellow-500: #FEE69F;--yellow-600: #FED871;--yellow-700: #F3C148;--yellow-800: #BF921C;--yellow-900: #7E610B;--green-400: #E2F8D9;--green-500: #B2E59C;--green-600: #93C57D;--green-700: #6AA758;--green-800: #397428;--green-900: #294D12;--cyan-400: #DDECED;--cyan-500: #A2C4C7;--cyan-600: #79A4B4;--cyan-700: #47818D;--cyan-800: #105057;--cyan-900: #0B333A;--blue-400: #DEECFF;--blue-500: #C6DBF8;--blue-600: #A2C4F1;--blue-700: #699EEB;--blue-800: #3978D7;--blue-900: #1555CC;--purple-400: #EFE6FB;--purple-500: #BA96EE;--purple-600: #9E69E9;--purple-700: #5300CF;--purple-800: #4100CA;--purple-900: #1800C2;--pink-400: #F9E4EE;--pink-500: #F0BCD5;--pink-600: #E2679E;--pink-700: #B32867;--pink-800: #9D2661;--pink-900: #772155;--grey-200: #F8F8F8;--grey-300: #EDEDED;--grey-400: #C9C9C9;--grey-500: #B4B4B4;--grey-600: #999997;--grey-700: #666667;--grey-800: #434345;--grey-900: #020202;--color-light: #FEFEFE;--color-dark: #101C26;--color-brand: #118E34;--color-brand-softest: #DEF8E2;--color-brand-soft: #26C45B;--color-brand-medium: #0B662A;--color-brand-darkest: #033B12;--color-background-dashboard: #FAFAFC;--color-background-card: #FEFEFE;--color-background: #FAFAFC;--color-background-hover: #E6EBF2;--color-surface: #FEFEFE;--color-surface-hover: #E6EBF2;--color-on-background: #2E4151;--color-on-background-hover: #202F3C;--color-on-surface: #101C26;--color-on-surface-hover: #2E4151;--color-on-brand: #FFFFFF;--color-on-brand-hover: #FFFFFF;--color-sidebar: #118E34;--color-on-sidebar: #FFFFFF;--color-sidebar-hover: #0B662A;--color-on-sidebar-hover: #FFFFFF;--color-danger: #E2222A;--color-on-danger: #FFFFFF;--color-danger-dark: #B7151B;--color-success: #00DC7D;--color-on-success: #FFFFFF;--color-success-dark: #1C904A;--color-warning: #FF9900;--color-on-warning: #101C26;--color-link: #2981FD;--color-link-dark: #0351C1;--color-neutral-soft: #F4F7FA;--color-neutral-lightest: #E6EBF2;--color-neutral-lighter: #C3CED8;--color-neutral-light: #9FADBA;--color-neutral-medium: #62768A;--color-neutral-dark: #2E4151;--color-neutral-darker: #202F3C;--color-neutral-darkest: #101C26;--brackgrounds-dashboards: #FAFAFC;--brackgrounds-card: #FEFEFE;--background-soft: #FAFAFC;--background-dark-softest: #3A3939;--background-dark-softin: #323131;--background-dark-soft: #2D2C2C;--background-dark-medium: #292828;--background-dark-hard: #1E1E1E;--background-dark-hardest: #19191C;--hover-soft: #E6EBF2;--hover-medium: #C3CED8;--hover-dark: #C8C8C8;--hover-dark-soft: #434343;--hover-dark-medium: #353434;--hover-dark-hard: #292828;--font-family-primary: Roboto, sans-serif;--font-family-mono: monospace;--font-family-sans: Roboto, sans-serif;--font-size-h1: 56px;--font-size-h2: 48px;--font-size-h3: 40px;--font-size-h4: 32px;--font-size-h5: 24px;--font-size-h6: 20px;--font-size-subtitle-regular: 32px;--font-size-subtitle-medium: 24px;--font-size-body-xl: 18px;--font-size-body-lg: 16px;--font-size-body-md: 14px;--font-size-body-sm: 12px;--font-size-caption: 10px;--line-height-h1: 150%;--line-height-h2: 150%;--line-height-h3: 40px;--line-height-h4: 32px;--line-height-h5: 24px;--line-height-subtitle-regular: 24px;--line-height-subtitle-medium: 24px;--line-height-body-xl: 24px;--line-height-body-lg: 24px;--line-height-body-md: 20px;--line-height-body-sm: 16px;--line-height-caption: 16px;--line-height-tight: 120%;--line-height-normal: 150%;--line-height-relaxed: 180%;--spacing-1: 4px;--spacing-2: 8px;--spacing-3: 12px;--spacing-4: 16px;--spacing-5: 20px;--spacing-6: 24px;--spacing-8: 32px;--spacing-10: 40px;--spacing-12: 48px;--spacing-16: 64px;--spacing-20: 80px;--spacing-24: 96px;--spacing-32: 128px;--spacing-40: 160px;--spacing-48: 192px;--spacing-56: 224px;--spacing-64: 256px;--spacing-72: 288px;--spacing-80: 320px;--spacing-96: 384px;--radius-4: 4px;--radius-8: 8px;--radius-12: 12px;--radius-16: 16px;--radius-none: 0;--radius-full: 9999px;--shadow-xs: 0 1px 2px 0 rgba(124, 124, 131, .04);--shadow-sm: 0 1px 3px 0 rgba(124, 124, 131, .08), 0 1px 2px 0 rgba(124, 124, 131, .04);--shadow-md: 0 2px 4px -2px rgba(124, 124, 131, .08), 0 4px 8px -2px rgba(124, 124, 131, .12);--shadow-lg: 0 4px 6px -2px rgba(124, 124, 131, .04), 0 12px 16px -4px rgba(124, 124, 131, .08);--shadow-dialog: 0 11px 15px -7px rgba(0, 0, 0, .2), 0 24px 38px 3px rgba(0, 0, 0, .14), 0 9px 46px 8px rgba(0, 0, 0, .12)}.tw-m-5{margin:1.25rem}.tw-my-10{margin-top:2.5rem;margin-bottom:2.5rem}.tw-my-6{margin-top:1.5rem;margin-bottom:1.5rem}.tw-mt-10{margin-top:2.5rem}.tw-mt-5{margin-top:1.25rem}.tw-flex{display:flex}.tw-h-1\.5{height:.375rem}.tw-h-2\.5{height:.625rem}.tw-h-3\.5{height:.875rem}.tw-h-\[200px\]{height:200px}.tw-h-\[20vh\]{height:20vh}.tw-h-auto{height:auto}.tw-w-\[150px\]{width:150px}.tw-w-\[200px\]{width:200px}.tw-flex-col{flex-direction:column}.tw-items-center{align-items:center}.tw-items-baseline{align-items:baseline}.tw-justify-center{justify-content:center}.tw-gap-10{gap:2.5rem}.tw-gap-4{gap:1rem}.tw-gap-40{gap:10rem}.tw-gap-5{gap:1.25rem}.tw-gap-\[8px\]{gap:8px}.tw-space-y-4>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(1rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1rem * var(--tw-space-y-reverse))}.tw-whitespace-nowrap{white-space:nowrap}.tw-rounded-xl{border-radius:.75rem}.tw-border{border-width:1px}.tw-border-gray-200{--tw-border-opacity: 1;border-color:rgb(229 231 235 / var(--tw-border-opacity, 1))}.tw-bg-\[var\(--blue-700\)\]{background-color:var(--blue-700)}.tw-bg-\[var\(--brandcolor-main\)\]{background-color:var(--brandcolor-main)}.tw-bg-\[var\(--green-700\)\]{background-color:var(--green-700)}.tw-bg-\[var\(--neutral-grey\)\]{background-color:var(--neutral-grey)}.tw-bg-\[var\(--red-700\)\]{background-color:var(--red-700)}.tw-bg-gray-100{--tw-bg-opacity: 1;background-color:rgb(243 244 246 / var(--tw-bg-opacity, 1))}.tw-bg-white{--tw-bg-opacity: 1;background-color:rgb(255 255 255 / var(--tw-bg-opacity, 1))}.tw-p-4{padding:1rem}.tw-p-6{padding:1.5rem}.tw-p-\[16px\]{padding:16px}@keyframes spin{to{transform:rotate(360deg)}}.spin{animation:spin 1s linear infinite}

package/dist/index.d.ts

@@ -8,6 +8,7 @@ export { default as Typography } from './components/Typography/Typography';
 export { default as Button } from './base-components/Button/Button';
 export { default as CollapsibleMenu } from './base-components/CollapsibleMenu/CollapsibleMenu';
 export { default as Dropdown } from './base-components/Dropdown/Dropdown';
+export type { DropdownOptionsType, DropdownAsyncOptionsType, } from './base-components/Dropdown/Dropdown.types';
 export { default as DropdownMenu } from './base-components/DropdownMenu/DropdownMenu';
 export { default as Input } from './base-components/Input/Input';
 export { default as Loading } from './base-components/Loading/Loading';

package/dist/tailwind.config.js

@@ -93,10 +93,17 @@ module.exports = {
         relaxed: "var(--line-height-relaxed)"
       },
       spacing: {
+        "1": "var(--spacing-1)",
+        "2": "var(--spacing-2)",
+        "3": "var(--spacing-3)",
         "4": "var(--spacing-4)",
+        "5": "var(--spacing-5)",
+        "6": "var(--spacing-6)",
         "8": "var(--spacing-8)",
+        "10": "var(--spacing-10)",
         "12": "var(--spacing-12)",
         "16": "var(--spacing-16)",
+        "20": "var(--spacing-20)",
         "24": "var(--spacing-24)",
         "32": "var(--spacing-32)",
         "40": "var(--spacing-40)",
@@ -105,7 +112,7 @@ module.exports = {
         "64": "var(--spacing-64)",
         "72": "var(--spacing-72)",
         "80": "var(--spacing-80)",
-        "104": "var(--spacing-104)"
+        "96": "var(--spacing-96)"
       },
       borderRadius: {
         "4": "var(--radius-4)",

package/dist/tailwind.config.prefixed.js

@@ -94,10 +94,17 @@ module.exports = {
         relaxed: "var(--line-height-relaxed)"
       },
       spacing: {
+        "1": "var(--spacing-1)",
+        "2": "var(--spacing-2)",
+        "3": "var(--spacing-3)",
         "4": "var(--spacing-4)",
+        "5": "var(--spacing-5)",
+        "6": "var(--spacing-6)",
         "8": "var(--spacing-8)",
+        "10": "var(--spacing-10)",
         "12": "var(--spacing-12)",
         "16": "var(--spacing-16)",
+        "20": "var(--spacing-20)",
         "24": "var(--spacing-24)",
         "32": "var(--spacing-32)",
         "40": "var(--spacing-40)",
@@ -106,7 +113,7 @@ module.exports = {
         "64": "var(--spacing-64)",
         "72": "var(--spacing-72)",
         "80": "var(--spacing-80)",
-        "104": "var(--spacing-104)"
+        "96": "var(--spacing-96)"
       },
       borderRadius: {
         "4": "var(--radius-4)",

package/dist/tokens/index.d.ts

@@ -394,19 +394,26 @@ export declare const tokens: {
         };
     };
     readonly spacing: {
-        readonly 4: "4px";
-        readonly 8: "8px";
-        readonly 12: "12px";
-        readonly 16: "16px";
-        readonly 24: "24px";
-        readonly 32: "32px";
-        readonly 40: "40px";
-        readonly 48: "48px";
-        readonly 56: "56px";
-        readonly 64: "64px";
-        readonly 72: "72px";
-        readonly 80: "80px";
-        readonly 104: "104px";
+        readonly 1: "4px";
+        readonly 2: "8px";
+        readonly 3: "12px";
+        readonly 4: "16px";
+        readonly 5: "20px";
+        readonly 6: "24px";
+        readonly 8: "32px";
+        readonly 10: "40px";
+        readonly 12: "48px";
+        readonly 16: "64px";
+        readonly 20: "80px";
+        readonly 24: "96px";
+        readonly 32: "128px";
+        readonly 40: "160px";
+        readonly 48: "192px";
+        readonly 56: "224px";
+        readonly 64: "256px";
+        readonly 72: "288px";
+        readonly 80: "320px";
+        readonly 96: "384px";
     };
     readonly effects: {
         readonly radius: {

package/dist/tokens/spacing/scale.d.ts

@@ -1,16 +1,23 @@
 export declare const spacing: {
-    readonly 4: "4px";
-    readonly 8: "8px";
-    readonly 12: "12px";
-    readonly 16: "16px";
-    readonly 24: "24px";
-    readonly 32: "32px";
-    readonly 40: "40px";
-    readonly 48: "48px";
-    readonly 56: "56px";
-    readonly 64: "64px";
-    readonly 72: "72px";
-    readonly 80: "80px";
-    readonly 104: "104px";
+    readonly 1: "4px";
+    readonly 2: "8px";
+    readonly 3: "12px";
+    readonly 4: "16px";
+    readonly 5: "20px";
+    readonly 6: "24px";
+    readonly 8: "32px";
+    readonly 10: "40px";
+    readonly 12: "48px";
+    readonly 16: "64px";
+    readonly 20: "80px";
+    readonly 24: "96px";
+    readonly 32: "128px";
+    readonly 40: "160px";
+    readonly 48: "192px";
+    readonly 56: "224px";
+    readonly 64: "256px";
+    readonly 72: "288px";
+    readonly 80: "320px";
+    readonly 96: "384px";
 };
 export type Spacing = typeof spacing;

package/dist/tokens.css

@@ -193,19 +193,26 @@
   --line-height-relaxed: 180%;
 
   /* Spacing (in px) */
-  --spacing-4: 4px;
-  --spacing-8: 8px;
-  --spacing-12: 12px;
-  --spacing-16: 16px;
-  --spacing-24: 24px;
-  --spacing-32: 32px;
-  --spacing-40: 40px;
-  --spacing-48: 48px;
-  --spacing-56: 56px;
-  --spacing-64: 64px;
-  --spacing-72: 72px;
-  --spacing-80: 80px;
-  --spacing-104: 104px;
+  --spacing-1: 4px;
+  --spacing-2: 8px;
+  --spacing-3: 12px;
+  --spacing-4: 16px;
+  --spacing-5: 20px;
+  --spacing-6: 24px;
+  --spacing-8: 32px;
+  --spacing-10: 40px;
+  --spacing-12: 48px;
+  --spacing-16: 64px;
+  --spacing-20: 80px;
+  --spacing-24: 96px;
+  --spacing-32: 128px;
+  --spacing-40: 160px;
+  --spacing-48: 192px;
+  --spacing-56: 224px;
+  --spacing-64: 256px;
+  --spacing-72: 288px;
+  --spacing-80: 320px;
+  --spacing-96: 384px;
 
   /* Border Radius */
   --radius-4: 4px;

package/dist/tokens.tailwind.css

@@ -78,19 +78,26 @@
   --line-height-relaxed: 180%;
 
   /* Spacing */
-  --spacing-4: 4px;
-  --spacing-8: 8px;
-  --spacing-12: 12px;
-  --spacing-16: 16px;
-  --spacing-24: 24px;
-  --spacing-32: 32px;
-  --spacing-40: 40px;
-  --spacing-48: 48px;
-  --spacing-56: 56px;
-  --spacing-64: 64px;
-  --spacing-72: 72px;
-  --spacing-80: 80px;
-  --spacing-104: 104px;
+  --spacing-1: 4px;
+  --spacing-2: 8px;
+  --spacing-3: 12px;
+  --spacing-4: 16px;
+  --spacing-5: 20px;
+  --spacing-6: 24px;
+  --spacing-8: 32px;
+  --spacing-10: 40px;
+  --spacing-12: 48px;
+  --spacing-16: 64px;
+  --spacing-20: 80px;
+  --spacing-24: 96px;
+  --spacing-32: 128px;
+  --spacing-40: 160px;
+  --spacing-48: 192px;
+  --spacing-56: 224px;
+  --spacing-64: 256px;
+  --spacing-72: 288px;
+  --spacing-80: 320px;
+  --spacing-96: 384px;
 
   /* Border Radius */
   --radius-4: 4px;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "greenole-design-system",
-  "version": "1.1.60",
+  "version": "1.1.61",
   "type": "module",
   "main": "dist/greenole-design-system.cjs.js",
   "module": "dist/greenole-design-system.js",
@@ -25,7 +25,12 @@
     "./tailwind.config.prefixed.js": "./dist/tailwind.config.prefixed.js",
     "./tokens.css": "./dist/tokens.css",
     "./tokens.tailwind.css": "./dist/tokens.tailwind.css",
-    "./styles": "./dist/greenole.css"
+    "./styles": "./dist/greenole.css",
+    "./dist/index.css": "./dist/index.css",
+    "./dist/reset.css": "./dist/reset.css",
+    "./dist/base-components/Dropdown/Dropdown.types": {
+      "types": "./dist/base-components/Dropdown/Dropdown.types.d.ts"
+    }
   },
   "files": [
     "dist"