@orfium/ictinus 5.0.0-next.7 → 5.0.0-next.8

package/dist/components/Avatar/Avatar.js

@@ -0,0 +1 @@
+import{jsxs as o,jsx as r}from"@emotion/react/jsx-runtime";import s from"react";import{calculateActualColorFromComponentProp as e}from"../../utils/themeFunctions.js";import i from"../Icon/Icon.js";import{avatarStyle as t}from"./Avatar.style.js";import{iconSizeBasedOnAvatar as m}from"./utils.js";import a from"../../hooks/useTheme.js";const c=s.forwardRef((({src:s="",iconName:c="user",size:l="md",color:n="lightGrey-600",children:d,className:f},h)=>{const p=a(),u=e(n);return o("div",Object.assign({ref:h,className:f,css:t({size:l,fill:u.color,fillShade:u.shade})},{children:[s&&r("img",{src:s},void 0),!s&&!d&&c&&r(i,{color:p.utils.getAAColorFromSwatches(u.color,u.shade),name:c,size:m(l)},void 0),!s&&d]}),void 0)}));c.displayName="Avatar";export{c as default};

package/dist/components/Avatar/Avatar.style.js

@@ -0,0 +1,25 @@
+import{css as e}from"@emotion/react";import{rem as t}from"../../theme/utils.js";import{flex as r}from"../../theme/functions.js";const o=e=>{switch(e){case"md":return 24;case"sm":return 20;case"xs":return 16;default:return 46}},i=({size:i,fill:s,fillShade:l})=>n=>e`
+      ${r};
+      width: ${t(o(i))};
+      height: ${t(o(i))};
+      border-radius: 100%;
+      border: ${t(1)} solid ${n.utils.getColor("lightGrey",100)};
+      box-sizing: border-box;
+      background: ${n.utils.getColor(s,l)};
+      overflow: hidden;
+      position: relative;
+      font-size: ${((e,t)=>{switch(t){case"md":return e.globals.typography.fontSizes[11];case"sm":return e.globals.typography.fontSizes.get("1");case"xs":return e.globals.typography.fontSizes[8];default:return e.globals.typography.fontSizes.get("4")}})(n,i)};
+      font-weight: ${n.globals.typography.weights.get("medium")};
+      align-items: center;
+      flex-shrink: 0;
+      line-height: 1;
+      user-select: none;
+      justify-content: center;
+      color: ${n.utils.getAAColorFromSwatches(s,l)};
+
+      img {
+        border-radius: 100%;
+        width: 100%;
+        height: 100%;
+      }
+    `;export{i as avatarStyle,o as sizeBasedOnProp};

package/dist/components/Avatar/AvatarStack/AvatarStack.js

@@ -0,0 +1 @@
+import{jsx as t,jsxs as r}from"@emotion/react/jsx-runtime";import e,{useCallback as s}from"react";import{errorHandler as a,generateTestDataId as i}from"../../../utils/helpers.js";import o from"../Avatar.js";import{avatarWrapperStyle as c,avatarStackStyle as d}from"./AvatarStack.style.js";import{errors as l}from"./utils.js";const n=e.forwardRef((({maxAvatars:n=4,size:m="md",color:h="lightGrey-600",dataTestId:v="",children:f},p)=>{a(l,{maxAvatars:n});const g=e.Children.toArray(f),j=g.length>n?g.length-n:0,z=s((()=>g.slice(0,g.length-j).map(((r,e)=>t("div",Object.assign({css:c({zIndex:g.length-e,size:m})},{children:r}),e)))),[g,j,m]);return r("div",Object.assign({ref:p,"data-testid":i("avatarstack",v),css:d({size:m})},{children:[z(),j?t("div",Object.assign({css:c({zIndex:0,size:m})},{children:r(o,Object.assign({size:m,color:h},{children:["+",j]}),void 0)}),void 0):null]}),void 0)}));n.displayName="AvatarStack";export{n as default};

package/dist/components/Avatar/AvatarStack/AvatarStack.style.js

@@ -0,0 +1,10 @@
+import{css as t}from"@emotion/react";import{flex as i}from"../../../theme/functions.js";import{rem as o}from"../../../theme/utils.js";import{sizeBasedOnProp as e}from"../Avatar.style.js";const m=({size:m})=>()=>t`
+      ${i};
+
+      div:last-child {
+        width: ${o(e(m))};
+      }
+    `,r=({zIndex:i,size:m})=>()=>t`
+      z-index: ${i};
+      width: ${o(.8*e(m))};
+    `;export{m as avatarStackStyle,r as avatarWrapperStyle};

package/dist/components/Avatar/AvatarStack/utils.js

@@ -0,0 +1 @@
+import{PropsValidationError as r}from"../../../utils/errors.js";const o=[{condition:({maxAvatars:r=4})=>Boolean(r<1),error:new r("maxAvatars prop must be greater than 0")}];export{o as errors};

package/dist/components/Avatar/utils.js

@@ -0,0 +1 @@
+const e=e=>{switch(e){case"md":return 16;case"sm":return 12;case"xs":return 10;default:return 28}};export{e as iconSizeBasedOnAvatar};

package/dist/components/Breadcrumb/Breadcrumb.js

@@ -0,0 +1 @@
+import{jsx as r}from"@emotion/react/jsx-runtime";import t from"lodash/isEmpty";import e from"lodash/uniqueId";import*as o from"react";import{Link as m}from"react-router-dom";import{breadcrumbLinkStyles as a,breadcrumbStyles as i}from"./Breadcrumb.style.js";import s from"./BreadcrumbItem/BreadcrumbItem.js";const c=(r,t)=>t===r.length-1,d=({children:d,data:n=[]})=>{const l=o.useCallback(((t,e)=>{const{to:o,label:i}=t,s=c(n,e);return o?r(m,Object.assign({css:a(s),to:o},{children:i}),o):r("div",{children:i},void 0)}),[n]),u=o.Children.toArray(d),p=t(n)?u:n.map(l),b=o.useMemo((()=>(t,o)=>{const m=e("data_item_"),a=c(p,o);return r(s,{childComponent:t,isLastItem:a},m)}),[p]);return r("ol",Object.assign({"aria-label":"Breadcrumb",css:i()},{children:p.map(b)}),void 0)};export{d as default};

package/dist/components/Breadcrumb/Breadcrumb.style.js

@@ -0,0 +1,13 @@
+import{css as o}from"@emotion/react";import{flex as r}from"../../theme/functions.js";const t=()=>()=>o`
+  ${r};
+  flex-wrap: nowrap;
+  list-style: none;
+  padding: 0;
+  margin: 0;
+`,e=r=>t=>o`
+  text-decoration: none;
+  color: inherit;
+  &:hover {
+    color: ${r?t.utils.getColor("blue",650):t.utils.getColor("darkGrey",650)};
+  }
+`;export{e as breadcrumbLinkStyles,t as breadcrumbStyles};

package/dist/components/Breadcrumb/BreadcrumbItem/BreadcrumbItem.js

@@ -0,0 +1 @@
+import{jsx as t,jsxs as i}from"@emotion/react/jsx-runtime";import{breadcrumbItemStyles as e}from"./BreadcrumbItem.style.js";import o from"../Separator/Separator.js";const r=({childComponent:r,isLastItem:s=!1})=>t("li",{children:i("div",Object.assign({css:e({isActive:s})},{children:[r,t(o,{isLastItem:s},void 0)]}),void 0)},void 0);export{r as default};

package/dist/components/Breadcrumb/BreadcrumbItem/BreadcrumbItem.style.js

@@ -0,0 +1,7 @@
+import{css as t}from"@emotion/react";import{BASE_SHADE as o}from"../../../theme/palette.js";const e=({isActive:e})=>r=>t`
+      display: flex;
+      cursor: default;
+      font-size: ${r.globals.typography.fontSizes[15]};
+      font-weight: ${e?r.globals.typography.weights.get("medium"):r.globals.typography.weights.get("regular")};
+      color: ${e?r.utils.getColor("primary",o,"normal"):r.utils.getColor("lightGrey",650)};
+    `;export{e as breadcrumbItemStyles};

package/dist/components/Breadcrumb/Separator/Separator.js

@@ -0,0 +1 @@
+import{jsx as t}from"@emotion/react/jsx-runtime";import o from"../../Icon/Icon.js";import{separatorStyles as r}from"./Separator.style.js";const e=e=>{const{isLastItem:i=!1}=e;return i?null:t("span",Object.assign({css:r()},{children:t(o,{name:"triangleRight",color:"lightGrey",variant:650,size:12},void 0)}),void 0)};export{e as default};

package/dist/components/Breadcrumb/Separator/Separator.style.js

@@ -0,0 +1,4 @@
+import{css as o}from"@emotion/react";const t=()=>t=>o`
+      margin: auto ${t.globals.spacing.get("6")};
+      cursor: default;
+    `;export{t as separatorStyles};

package/dist/components/Button/Button.js

@@ -0,0 +1 @@
+import{jsx as i,jsxs as o}from"@emotion/react/jsx-runtime";import{useLoading as n}from"../../hooks/useLoading.js";import s,{useRef as t}from"react";import e from"../ButtonBase/ButtonBase.js";import{buttonSpanStyle as r,iconStyle as a,childrenWrapperStyle as l}from"./Button.style.js";import d from"./ButtonLoader/ButtonLoader.js";const c=s.forwardRef(((c,p)=>{var u;const{size:m="md",type:h="primary",color:f="",isFilled:g=!0,isTransparent:j=!1,iconLeft:v=null,iconRight:B=null,isDisabled:L=!1,children:b,onClick:y}=c,{isLoading:O,handleAsyncOperation:C}=n(y),k=t(null),R=null===(u=null==k?void 0:k.current)||void 0===u?void 0:u.clientWidth;return i(e,Object.assign({},c,{ref:p,isLoading:O,onClick:C},{children:o("span",Object.assign({css:r()},{children:[v&&i("span",Object.assign({css:a()},{children:v}),void 0),i("span",Object.assign({ref:k,css:l({type:h,isLoading:O,isFilled:g,size:m,color:f,isTransparent:j,iconLeft:v,iconRight:B,isDisabled:L,hasChildren:Boolean(s.Children.count(b))})},{children:O?i(d,{innerButtonWidth:R,color:f,type:h},void 0):b}),void 0),B&&i("span",Object.assign({css:a()},{children:B}),void 0)]}),void 0)}),void 0)}));c.displayName="Button";export{c as default};

package/dist/components/Button/Button.style.js

@@ -0,0 +1 @@
+const n=()=>()=>({display:"flex",alignItems:"center",justifyContent:"center"}),e=()=>()=>({display:"inline-flex"}),t=({iconLeft:n,iconRight:e,hasChildren:t})=>i=>{const g=t&&e;return{marginLeft:t&&n?i.globals.spacing.get("4"):0,marginRight:g?i.globals.spacing.get("4"):0}};export{n as buttonSpanStyle,t as childrenWrapperStyle,e as iconStyle};

package/dist/components/Button/ButtonLoader/ButtonLoader.js

@@ -0,0 +1 @@
+import{jsx as o}from"@emotion/react/jsx-runtime";import{useTypeColorToColorMatch as r}from"../../../hooks/useTypeColorToColorMatch.js";import{centralizedLoader as e}from"./ButtonLoader.style.js";import t from"../../Loader/Loader.js";import s from"../../../hooks/useTheme.js";const i=({innerButtonWidth:i,type:m="primary",color:n=""})=>{const a=s(),{calculateColorBetweenColorAndType:l}=r(),c=l(n,m),p=a.utils.getAAColorFromSwatches(c.color,c.shade);return o("div",Object.assign({css:e(i)},{children:o(t,{type:"spinner",color:p},void 0)}),void 0)};i.displayName="Button";export{i as default};

package/dist/components/Button/ButtonLoader/ButtonLoader.style.js

@@ -0,0 +1,5 @@
+import{css as t}from"@emotion/react";import{flex as o}from"../../../theme/functions.js";import{rem as e}from"../../../theme/utils.js";const m=m=>t`
+  width: ${m?e(m):"auto"};
+  ${o};
+  justify-content: center;
+`;export{m as centralizedLoader};

package/dist/components/Button/utils.js

@@ -0,0 +1 @@
+import t from"lodash/isEmpty";import"polished";import"../../theme/palette.js";import{getColorFromType as o}from"../../utils/themeFunctions.js";const r=(r,e,s,p,i)=>!i&&p?"transparent":e&&!t(e)?r.utils.getColor(e.color,e.shade):i&&s?o(s,r):"transparent";export{r as defineBackgroundColor};

package/dist/components/ButtonBase/ButtonBase.js

@@ -0,0 +1 @@
+import{jsx as o}from"@emotion/react/jsx-runtime";import t from"react";import{useTypeColorToColorMatch as e}from"../../hooks/useTypeColorToColorMatch.js";import{generateTestDataId as i}from"../../utils/helpers.js";import{buttonBaseStyle as s}from"./ButtonBase.style.js";const r=t.forwardRef(((r,l)=>{const{size:n="md",type:a="primary",color:c="",isBlock:d=!1,isFilled:u=!0,isTransparent:p=!1,iconLeft:m=null,iconRight:f=null,isDisabled:h=!1,isLoading:y=!1,children:B,dataTestId:C="",dataTestPrefixId:b="",buttonType:T="button",onClick:g,onBlur:j,sx:k}=r,{calculateColorBetweenColorAndType:x}=e(),L=x(c,a),R=`${b}button`;return o("button",Object.assign({ref:l,type:T,"data-testid":i(R,C),css:s({type:a,isLoading:y,isFilled:u,size:n,isBlock:d,color:c,isTransparent:p,calculatedColor:L,isDisabled:h,iconLeft:m,iconRight:f,sx:k,childrenCount:t.Children.count(B)}),onClick:o=>{g&&g(o)},onBlur:j,disabled:h||y},{children:B}),void 0)}));r.displayName="ButtonBase";export{r as default};

package/dist/components/ButtonBase/ButtonBase.style.js

@@ -0,0 +1 @@
+import{css as o}from"@emotion/react";import{rem as e}from"../../theme/utils.js";import{getDisabled as t}from"../../theme/states/disabled.js";import{getFocus as r}from"../../theme/states/focus.js";import{getHover as s}from"../../theme/states/hover.js";import{getPressed as i}from"../../theme/states/pressed.js";import{buttonConfig as a}from"./config.js";import{defineBackgroundColor as l,calculateButtonColor as n}from"./utils.js";const d=o=>{var t;return e(null!==(t=a.sizes[o])&&void 0!==t?t:a.sizes.default)},c=(o,e)=>a.fontSize[e]?o.globals.typography.fontSizes[a.fontSize[e]]:o.globals.typography.fontSizes.get(a.fontSize.default),g=({type:g,isFilled:m,calculatedColor:u,size:p,isBlock:b,isTransparent:h,childrenCount:f,sx:y})=>j=>{const k=l(j,u,g,f>0),z=!m&&!h,C=z||h,v=z?a.types.outlined.border.width:0,S={fontSize:c(j,p||"default"),fontWeight:j.globals.typography.weights.get("medium"),color:n({type:g,isBackgroundTransparent:Boolean(C),backGroundColor:k,calculatedColor:u,theme:j}),width:b?"100%":void 0,backgroundColor:C?"transparent":k,padding:"lg"===p?j.globals.spacing.get("6"):`0 ${j.globals.spacing.get("6")}`,height:d(p||"default"),borderRadius:j.globals.spacing.get("3"),border:z?`solid ${e(v)} ${k}`:"none",cursor:"pointer",transition:"background-color,border 150ms linear",":focus-visible:not(:disabled)":{outline:r({theme:j,borderWidth:v}).styleOutline},":hover:not(:disabled)":{backgroundColor:s({theme:j,color:u.color,shade:C?0:u.shade}).backgroundColor},":active:not(:disabled)":{backgroundColor:i({theme:j,color:u.color,shade:C?0:u.shade}).backgroundColor},":disabled":t()};return o(Object.assign(Object.assign({},S),null==y?void 0:y.container))};export{g as buttonBaseStyle,d as heightBasedOnSize};

package/dist/components/ButtonBase/config.js

@@ -0,0 +1 @@
+const e={sizes:{lg:56,md:46,sm:36,default:46},fontSize:{sm:13,default:"4"},types:{link:{color:{name:"blue",shade:550}},outlined:{border:{width:1}}}};export{e as buttonConfig};

package/dist/components/ButtonBase/utils.js

@@ -0,0 +1 @@
+import o from"lodash/isEmpty";import{getColorFromType as r}from"../../utils/themeFunctions.js";import{buttonConfig as t}from"./config.js";const e=(t,e,s,n)=>"link"===s?"transparent":e&&!o(e)?t.utils.getColor(e.color,e.shade):n&&s?r(s,t):"transparent",s=({type:o,isBackgroundTransparent:r,backGroundColor:e,calculatedColor:s,theme:n})=>{if("link"===o){const o=t.types.link.color;return n.utils.getColor(o.name,o.shade)}return r?e:n.utils.getAAColorFromSwatches(s.color,s.shade)};export{s as calculateButtonColor,e as defineBackgroundColor};

package/dist/components/Card/Card.js

@@ -0,0 +1 @@
+import{jsx as e}from"@emotion/react/jsx-runtime";import{cardStyle as r}from"./Card.style.js";const s=({elevated:s,isTransparent:t=!1,radius:a,children:i})=>e("div",Object.assign({css:r({elevated:s,isTransparent:t,radius:a})},{children:i}),void 0);export{s as default};

package/dist/components/Card/Card.style.js

@@ -0,0 +1,7 @@
+import{css as o}from"@emotion/react";const a=({elevated:a,isTransparent:e,radius:s})=>t=>o`
+      ${a&&r(t,a,e,s)};
+    `,r=(a,r,e,s)=>o`
+  box-shadow: ${a.globals.elevation[r]};
+  background: ${e?"transparent":a.globals.colors.white};
+  border-radius: ${s?a.globals.spacing.get(s):0};
+`;export{r as cardElevation,a as cardStyle};

package/dist/components/Chart/BarChart/BarChart.js

@@ -0,0 +1 @@
+import{jsxs as o,jsx as t}from"@emotion/react/jsx-runtime";import e from"../../../hooks/useTheme.js";import i from"lodash/max";import{useMemo as a,useCallback as r}from"react";import{CartesianGrid as l,XAxis as s,Tooltip as n,Bar as m,LabelList as c,Cell as d,YAxis as p,BarChart as u}from"recharts";import f from"../Wrapper.js";import v from"./components/CustomLabel/CustomLabel.js";import g from"./components/CustomTooltip/CustomTooltip.js";import h from"./components/CustomTooltipContent/CustomTooltipContent.js";import{getBarColors as b,getColoringOptions as y,getValues as C,customTickFormatter as j}from"./utils.js";const k=({colors:o,y:i,width:a,payload:r})=>{const l=e(),s="string"==typeof r.value&&o[r.value]?o[r.value]:l.globals.colors.black;return t("g",{children:t("foreignObject",Object.assign({y:i-10,width:a,height:"20",style:{overflow:"visible"}},{children:t(g,{content:r.value,fill:s},void 0)}),void 0)},void 0)},x=f(u),L=({data:u})=>{const f=e(),g=a((()=>b(u,f.globals.colors.flat.darkBlue[100])),[u,f.globals.colors.flat.darkBlue]),L=r((o=>i(u.map(o))),[u]),O=r((o=>y(u,o)),[u]),T=L((o=>o.name.length)),w=L((o=>o.value)),B=T&&9.5*T<160?9.5*T:160,{maxDomainValue:K,tickCount:z}=C(w),G=O((()=>!1)),$=O((o=>o.name));return o(x,Object.assign({data:u,margin:{top:5,right:60,left:20,bottom:15},layout:"vertical",barCategoryGap:"20%",maxBarSize:32},{children:[t(l,{offset:{left:0},horizontal:!1},void 0),t(s,{type:"number",axisLine:!1,tickLine:!1,tickMargin:24,tickCount:z,domain:[0,K],tickFormatter:o=>j(o,K)},void 0),t(n,{cursor:{fill:f.utils.getColor("lightGrey",50)},content:t(h,{},void 0)},void 0),o(m,Object.assign({dataKey:"value"},{children:[t(c,{dataKey:"barLabel",position:"right",content:t(v,{colors:G},void 0)},void 0),u.map(((o,e)=>t(d,{fill:g[e]},`cell-${o.name}-${o.value}`)))," "]}),void 0),t(p,{type:"category",dataKey:"name",tick:o=>t(k,Object.assign({},o,{colors:$}),void 0),width:B,axisLine:!1,tickLine:!1},void 0)]}),void 0)};export{L as default};

package/dist/components/Chart/BarChart/components/CustomLabel/CustomLabel.js

@@ -0,0 +1 @@
+import{jsx as o}from"@emotion/react/jsx-runtime";import e from"../../../../../hooks/useTheme.js";const t=({colors:t,value:i,x:s,y:r,width:l,height:n,index:c})=>{const a=e(),d=s&&l?s+l+16:16,h=r&&n?r+n/2:0,m=c&&t[c]?t[c]:a.globals.colors.black;return o("text",Object.assign({x:d,y:h},{children:o("tspan",Object.assign({dy:"0.335em",fontWeight:"bold",fill:m},{children:i}),void 0)}),void 0)};export{t as default};

package/dist/components/Chart/BarChart/components/CustomTooltip/CustomTooltip.js

@@ -0,0 +1 @@
+import{jsxs as t,jsx as o}from"@emotion/react/jsx-runtime";import{useRef as e,useState as r,useEffect as i,useCallback as n}from"react";import{tickStyle as s,tooltipStyle as c,tooltipArrowStyle as d}from"./CustomTooltip.style.js";const l=({content:l,fill:u})=>{const m=e(null),[v,a]=r(!1),[f,h]=r(!1);i((()=>{h(!!m.current&&m.current.scrollWidth>m.current.clientWidth)}),[h]);const p=n((()=>{a(!0)}),[a]),j=n((()=>{a(!1)}),[a]);return t("div",Object.assign({ref:m,onMouseEnter:p,onMouseLeave:j,css:s(u)},{children:[l,v&&f&&t("div",{children:[o("div",Object.assign({css:c()},{children:l}),void 0),o("div",{css:d()},void 0)]},void 0)]}),void 0)};export{l as default};

package/dist/components/Chart/BarChart/components/CustomTooltip/CustomTooltip.style.js

@@ -0,0 +1,28 @@
+import{css as o}from"@emotion/react";import{rem as t}from"../../../../../theme/utils.js";const r=t=>()=>o`
+      width: inherit;
+      height: inherit;
+      color: ${t};
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+    `,e=()=>t=>o`
+      display: block;
+      position: fixed;
+      top: -33%;
+      left: 106%;
+      color: ${t.globals.colors.white};
+      background-color: ${t.utils.getColor("darkGrey",750)};
+      opacity: 90%;
+      border-radius: ${t.globals.spacing.get("3")};
+      padding: ${t.globals.spacing.get("4")};
+    `,i=()=>r=>o`
+      content: '';
+      position: absolute;
+      border-style: solid;
+      margin-top: ${t(-5)};
+      border-width: ${t(5)};
+      border-color: transparent ${r.utils.getColor("darkGrey",750)} transparent transparent;
+      top: 50%;
+      left: 100%;
+      opacity: 90%;
+    `;export{r as tickStyle,i as tooltipArrowStyle,e as tooltipStyle};

package/dist/components/Chart/BarChart/components/CustomTooltipContent/CustomTooltipContent.js

@@ -0,0 +1 @@
+import{jsx as i,jsxs as o}from"@emotion/react/jsx-runtime";import{tooltipStyle as n,tooltipUlStyle as d,tooltipLiStyle as e}from"./CustomTooltipContent.style.js";const l=({payload:l})=>{var s,t,c;const r=l&&(null===(c=null===(t=null===(s=l[0])||void 0===s?void 0:s.payload)||void 0===t?void 0:t.options)||void 0===c?void 0:c.hoverInfo);return r?i("div",Object.assign({className:"custom-tooltip",css:n()},{children:i("ul",Object.assign({css:d()},{children:r.map((({name:n,value:d,percentage:l})=>o("li",Object.assign({css:e()},{children:[i("div",{children:n},void 0),o("div",{children:[i("span",{children:i("b",{children:d},void 0)},void 0),l&&o("span",{children:["(",l,")"]},void 0)]},void 0)]}),`${n}${d}`)))}),void 0)}),void 0):null};export{l as default};

package/dist/components/Chart/BarChart/components/CustomTooltipContent/CustomTooltipContent.style.js

@@ -0,0 +1 @@
+import{rem as g}from"../../../../../theme/utils.js";const a=()=>a=>({fontSize:a.globals.typography.fontSizes.get("3"),padding:`${a.globals.spacing.get("4")} ${a.globals.spacing.get("6")}`,margin:a.globals.spacing.get("4"),color:a.globals.colors.white,background:a.utils.getColor("darkGrey",750),opacity:"90%",borderRadius:a.globals.spacing.get("3"),minWidth:g(200),whiteSpace:"nowrap"}),l=()=>()=>({padding:"0px",margin:"0px"}),t=()=>g=>({listStyleType:"none",color:g.globals.colors.white,width:"100%",display:"flex",justifyContent:"space-between",height:g.globals.spacing.get("6"),padding:`${g.globals.spacing.get("4")} 0px`,"div:last-child":{marginLeft:g.globals.spacing.get("6"),span:{marginLeft:g.globals.spacing.get("3")}}});export{t as tooltipLiStyle,a as tooltipStyle,l as tooltipUlStyle};

package/dist/components/Chart/BarChart/utils.js

@@ -0,0 +1 @@
+import{lighten as o}from"polished";const l=o=>{const l=o||0,i=.05*(l?Math.pow(10,null==l?void 0:l.toString().length):0),n=i*(Math.floor(l/i)+1),t=n/i;return{maxDomainValue:n,tickCount:t%2?n/i+1:t/2+1}},i=(o,l)=>0===o?`${o}`:l>1e9||1e9===o?o/1e9+"B":l>1e6||1e6===o?o/1e6+"M":l>=1e3||1e3===o?o/1e3+"K":`${o}`,n=(l,i)=>l.map((l=>{var n,t,d,r;return(null===(n=null==l?void 0:l.options)||void 0===n?void 0:n.color)?"all"===(null===(t=null==l?void 0:l.options)||void 0===t?void 0:t.coloringOption)?o(.2,null===(d=null==l?void 0:l.options)||void 0===d?void 0:d.color):null===(r=null==l?void 0:l.options)||void 0===r?void 0:r.color:i})),t=(o,l)=>o.reduce(((o,i,n)=>{var t,d,r;return"all"!==(null===(t=i.options)||void 0===t?void 0:t.coloringOption)||(l&&l(i)?o[l(i)]=null===(d=i.options)||void 0===d?void 0:d.color:o[n]=null===(r=i.options)||void 0===r?void 0:r.color),o}),{});export{i as customTickFormatter,n as getBarColors,t as getColoringOptions,l as getValues};

package/dist/components/Chart/DonutChart/DonutChart.js

@@ -0,0 +1 @@
+import{jsx as e,jsxs as t}from"@emotion/react/jsx-runtime";import{useMemo as o}from"react";import{Pie as r,Cell as a,Label as n,PieChart as i}from"recharts";import l from"../Wrapper.js";import m from"./components/CustomLabel/CustomLabel.js";const s=l(i),d=({data:i,value:l,units:d})=>{const u=o((()=>i.map((e=>(null==e?void 0:e.color)||""))),[i]);return e(s,{children:t(r,Object.assign({data:i,innerRadius:"85%",outerRadius:"100%",paddingAngle:0,startAngle:90,endAngle:-270,dataKey:"value",blendStroke:!0},{children:[i.map(((t,o)=>e(a,{fill:u[o]},`cell--${t.name}-${t.value}`))),e(n,{position:"center",content:e(m,{value:l,units:d},void 0)},void 0)]}),void 0)},void 0)};export{d as default};

package/dist/components/Chart/DonutChart/components/CustomLabel/CustomLabel.js

@@ -0,0 +1 @@
+import{jsxs as e,jsx as i}from"@emotion/react/jsx-runtime";import t from"../../../../../hooks/useTheme.js";import{flexContainer as s,labelUnitStyle as o}from"./CustomLabel.style.js";const n=({viewBox:n,value:l,units:c})=>{const{cx:r,cy:a}=n,d=t();return e("g",{children:[i("text",Object.assign({x:r,y:a,className:"recharts-text recharts-label",textAnchor:"middle",dominantBaseline:"central"},{children:i("tspan",Object.assign({x:"50%",dy:"-7",alignmentBaseline:"middle",fontSize:d.globals.typography.fontSizes.get("4"),fill:d.globals.colors.black},{children:l}),void 0)}),void 0),i("foreignObject",Object.assign({y:"52%",width:"100%",height:a&&a/2.5},{children:i("div",Object.assign({css:s()},{children:i("div",Object.assign({css:o()},{children:c}),void 0)}),void 0)}),void 0)]},void 0)};export{n as default};

package/dist/components/Chart/DonutChart/components/CustomLabel/CustomLabel.style.js

@@ -0,0 +1,10 @@
+import{css as t}from"@emotion/react";const e=()=>()=>t`
+    display: flex;
+    width: 100%;
+    justify-content: center;
+  `,o=()=>e=>t`
+      width: 80%;
+      font-size: ${e.globals.typography.fontSizes.get("2")};
+      color: ${e.utils.getColor("lightGrey",650)};
+      text-align: center;
+    `;export{e as flexContainer,o as labelUnitStyle};

package/dist/components/Chart/LineChart/LineChart.js

@@ -0,0 +1 @@
+import{jsxs as t,jsx as e}from"@emotion/react/jsx-runtime";import{useMemo as o}from"react";import{XAxis as i,YAxis as r,CartesianGrid as l,Legend as a,Tooltip as n,Area as s,AreaChart as c}from"recharts";import{rem as m}from"../../../theme/utils.js";import d from"../../../hooks/useTheme.js";import p from"../Wrapper.js";import f from"./components/CustomTooltip/CustomTooltip.js";import g from"./components/GradientLine/GradientLine.js";import{getKeyNames as u,colorPicker as h}from"./utils.js";const b=p(c),v=({data:c,labelX:p,labelY:v,isLegendVisible:k=!1,color:j})=>{const y=d(),L=o((()=>u(c)),[c]),x=o((()=>h({theme:y,uniqueKeyNames:L,color:j})),[y,L,j]),O=Object.entries(x);return L.length<=Object.keys(y.globals.colors.flat).length?t(b,Object.assign({data:c,margin:{top:10,right:20,left:20,bottom:50},aspect:1.5},{children:[e("defs",{children:O.map((([t,o])=>e(g,{dataLabel:t,color:o},`color${t}`)))},void 0),e(i,{dataKey:"name",tickMargin:31,axisLine:!1,tickLine:!1,label:p&&{value:p,angle:0,position:"bottom",offset:35}},void 0),e(r,{tick:{textAnchor:"start"},tickMargin:40,axisLine:!1,tickLine:!1,label:v&&{value:v,angle:-90,position:"left",offset:15}},void 0),e(l,{vertical:!1},void 0),k&&e(a,{align:"left",iconType:"circle",iconSize:16,wrapperStyle:{paddingTop:m(50),paddingLeft:m(13)}},void 0),e(n,{cursor:{stroke:y.utils.getColor("lightGrey",650),strokeWidth:1},content:e(f,{},void 0)},void 0),O.map((([t,o])=>e(s,{type:"linear",dataKey:t,stroke:o,fillOpacity:1,fill:`url(#color${t})`,activeDot:{r:3,stroke:"none"},dot:{r:3,fill:o}},t)))]}),void 0):t("p",{children:["You must define less than ",Object.keys(y.globals.colors.flat).length," different data"]},void 0)};export{v as default};

package/dist/components/Chart/LineChart/components/CustomTooltip/CustomTooltip.js

@@ -0,0 +1 @@
+import{jsxs as s,jsx as i}from"@emotion/react/jsx-runtime";import{tooltipStyle as e,tooltipHrStyle as l,tooltipUlStyle as o,tooltipLiStyle as t}from"./CustomTooltip.style.js";const a=({label:a,payload:c})=>s("div",Object.assign({className:"custom-tooltip",css:e()},{children:[s("p",Object.assign({className:"label",style:{margin:"0px"}},{children:[`${a}`," "]}),void 0),c&&c.length>1&&i("hr",{css:l()},void 0),c&&i("ul",Object.assign({css:o()},{children:c.map((({name:e,value:l})=>s("li",Object.assign({css:t()},{children:[i("div",{children:e},void 0)," ",i("div",{children:l},void 0)]}),e)))}),void 0)]}),void 0);export{a as default};

package/dist/components/Chart/LineChart/components/CustomTooltip/CustomTooltip.style.js

@@ -0,0 +1 @@
+import{rem as o}from"../../../../../theme/utils.js";const t=()=>t=>({fontSize:t.globals.typography.fontSizes.get("3"),padding:t.globals.spacing.get("4"),color:t.globals.colors.white,background:t.utils.getColor("darkGrey",750),opacity:"90%",borderRadius:t.globals.spacing.get("3"),minWidth:o(200),whiteSpace:"nowrap"}),e=()=>t=>({margin:`${t.globals.spacing.get("6")} 0`,height:o(1),borderWidth:0,backgroundColor:t.globals.colors.white,opacity:"10%"}),i=()=>()=>({padding:0,margin:0}),l=()=>t=>({listStyleType:"none",color:t.globals.colors.white,width:"100%",display:"flex",justifyContent:"space-between",height:t.globals.spacing.get("6"),padding:`0px 0px ${o(-5)}`});export{e as tooltipHrStyle,l as tooltipLiStyle,t as tooltipStyle,i as tooltipUlStyle};

package/dist/components/Chart/LineChart/components/GradientLine/GradientLine.js

@@ -0,0 +1 @@
+import{jsxs as o,jsx as t}from"@emotion/react/jsx-runtime";import r from"react";var e=r.memo((({dataLabel:r,color:e})=>o("linearGradient",Object.assign({id:`color${r}`,x1:"0",y1:"0",x2:"0",y2:"1"},{children:[t("stop",{offset:"5%",stopColor:`${e}`,stopOpacity:.4},void 0),t("stop",{offset:"95%",stopColor:`${e}`,stopOpacity:0},void 0)]}),void 0)));export{e as default};

package/dist/components/Chart/LineChart/utils.js

@@ -0,0 +1 @@
+import o from"lodash/flatten";import r from"lodash/keys";import t from"lodash/omit";import e from"lodash/sampleSize";import m from"lodash/uniq";const l=e=>m(o(e.map((o=>r(t(o,"name")))))),a=({theme:o,uniqueKeyNames:r,color:t})=>{const m=e(o.globals.colors.flat,r.length);return r.reduce(((o,r,e)=>{var l;const a="function"==typeof t&&t(r)?t(r):null===(l=m[e])||void 0===l?void 0:l[400];return o[r]=a,o}),{})};export{a as colorPicker,l as getKeyNames};

package/dist/components/Chart/Wrapper.js

@@ -0,0 +1 @@
+import{__rest as e}from"tslib";import{jsx as r}from"@emotion/react/jsx-runtime";import{ResponsiveContainer as t}from"recharts";function i(i){return n=>{var{children:o}=n,s=e(n,["children"]);return"test"!==process.env.NODE_ENV?r(t,Object.assign({aspect:null==s?void 0:s.aspect},{children:r(i,Object.assign({},s,{children:o}),void 0)}),void 0):r(i,Object.assign({width:1e3,height:500},s,{children:o}),void 0)}}export{i as default};

package/dist/components/CheckBox/CheckBox.js

@@ -0,0 +1 @@
+import{jsxs as e,jsx as o}from"@emotion/react/jsx-runtime";import{useTypeColorToColorMatch as s}from"../../hooks/useTypeColorToColorMatch.js";import*as i from"react";import{useEffect as t}from"react";import{generateUniqueID as r,generateTestDataId as c}from"../../utils/helpers.js";import{wrapperStyle as a,checkboxWrapperStyle as l,checkboxStyle as d,markerStyle as n,labelStyle as m}from"./CheckBox.style.js";import h from"../Icon/Icon.js";import p from"../../hooks/useTheme.js";const k=i.forwardRef(((k,u)=>{const{label:f,isChecked:b,onClick:C,isDisabled:v=!1,isIntermediate:g=!1,dataTestIdSuffix:j,isFilled:x=!0,id:y=r()}=k,[T,I]=i.useState(Boolean(b)),F=i.useRef(null),O=p(),{calculateColorBetweenColorAndType:w}=s(),{color:A,shade:B}=w("","primary");t((()=>{void 0!==b&&I(b)}),[b]);return e("span",Object.assign({ref:u,css:a({isDisabled:v})},{children:[e("span",Object.assign({css:l({isDisabled:v}),onClick:e=>{var o;e.stopPropagation(),e.currentTarget===e.target&&(null===(o=null==F?void 0:F.current)||void 0===o||o.click())}},{children:[o("input",{"data-testid":c("checkbox",j),css:d({isIntermediate:g,isChecked:T,isFilled:x}),id:`styled-checkbox-${y}`,type:"checkbox",onClick:e=>e.stopPropagation(),onChange:e=>{const o=!T;void 0===b&&I(o),!v&&C&&C(o,e)},disabled:v,checked:T,ref:F},void 0),o("label",Object.assign({htmlFor:`styled-checkbox-${y}`,css:n({isChecked:T})},{children:o(h,{name:g?"minus":"checkmark",size:24,color:O.utils.getAAColorFromSwatches(A,B)},void 0)}),void 0)]}),void 0),f&&o("span",Object.assign({css:m()},{children:f}),void 0)]}),void 0)}));k.displayName="Checkbox";export{k as default};

package/dist/components/CheckBox/CheckBox.style.js

@@ -0,0 +1,73 @@
+import{css as e}from"@emotion/react";import{rem as i}from"../../theme/utils.js";import{BASE_SHADE as t}from"../../theme/palette.js";const o=({isDisabled:i})=>()=>e`
+      opacity: ${i?.3:1};
+      justify-content: center;
+      align-items: center;
+      display: flex;
+    `,l=({isDisabled:t})=>()=>{const o=!t&&"&:hover {\n    &:before {\n      display: block;\n      background: rgba(0, 0, 0, 0.05);\n    }\n  }";return e`
+      border-radius: 100%;
+      display: flex;
+      width: ${i(48)};
+      height: ${i(48)};
+      justify-content: center;
+      align-items: center;
+      position: relative;
+
+      &:before {
+        display: none;
+        border-radius: 100%;
+        transition: all 0.2s;
+        content: ' ';
+        width: ${i(48)};
+        height: ${i(48)};
+        position: absolute;
+      }
+
+      ${o}
+    `},r=({isChecked:o,isFilled:l})=>r=>e`
+      border: 0;
+      border-radius: ${i(2)};
+      width: ${i(24)};
+      height: ${i(24)};
+
+      position: absolute;
+      opacity: 0; // hide it
+
+      & + label {
+        position: relative;
+        cursor: pointer;
+        padding: 0;
+      }
+
+      // Box.
+      & + label:before {
+        content: '';
+        transition: all 0.2s;
+        display: inline-block;
+        vertical-align: text-top;
+        width: ${i(24)};
+        height: ${i(24)};
+        ${(({isChecked:e,isFilled:o,theme:l})=>e?`background: ${l.utils.getColor("primary",t,"normal")}`:o?`background: ${l.utils.getColor("lightGrey",300)}`:`background: inherit; box-shadow: inset 0px 0px 0px ${i("2px")} ${l.utils.getColor("lightGrey",300)};`)({isChecked:o,isFilled:l,theme:r})};
+        border-radius: ${i(4)};
+      }
+
+      // Disabled state label.
+      &:disabled + label {
+        cursor: not-allowed;
+      }
+    `,s=({isChecked:i})=>e`
+    span {
+      padding: 0;
+    }
+
+    svg {
+      position: absolute;
+      top: 0;
+      display: ${i?"block":"none"};
+    }
+  `,a=()=>t=>e`
+      padding-left: ${i(4)};
+      font-size: ${t.globals.typography.fontSizes[15]};
+      font-weight: ${t.globals.typography.weights.get("regular")};
+      color: ${t.utils.getColor("darkGrey",750)};
+      white-space: nowrap;
+    `;export{r as checkboxStyle,l as checkboxWrapperStyle,a as labelStyle,s as markerStyle,o as wrapperStyle};

package/dist/components/Chip/Chip.js

@@ -0,0 +1 @@
+import{__rest as e}from"tslib";import{jsxs as i,jsx as s}from"@emotion/react/jsx-runtime";import t,{Fragment as r}from"react";import{errorHandler as o,generateTestDataId as d}from"../../utils/helpers.js";import{BASE_SHADE as a}from"../../theme/palette.js";import{closeIconWrapperStyle as l,chipStyle as c}from"./Chip.style.js";import n from"./components/Badge/Badge.js";import{defaultProps as m,errors as p}from"./utils.js";import b from"../Avatar/Avatar.js";import f from"../Icon/Icon.js";const v=t.forwardRef(((t,v)=>{var{styleType:h=m.styleType,isDisabled:y=m.isDisabled,dataTestId:j=m.dataTestId}=t,u=e(t,["styleType","isDisabled","dataTestId"]);const{onClick:g,isChecked:k,thumbnail:C,fill:T,isSelected:I,onClear:S,children:D,badgeNumber:N}=u;o(p,{styleType:h,isSelected:I,isChecked:k,badgeNumber:N,isDisabled:y});const O=i(r,{children:[k&&s(f,{size:14,name:"checkmark",color:"darkGrey",variant:850},void 0),C&&s("div",{children:s(b,Object.assign({size:"xs",color:`${T}-${a}`,src:C.src},{children:C.name}),void 0)},void 0),s("div",{children:D},void 0),N&&s(n,{fill:T,badgeNumber:N,isSelected:I,dataTestId:j},void 0),S&&s("div",Object.assign({css:l(y)},{children:s(f,{size:14,name:"close",color:"darkGrey",variant:850,onClick:e=>{e.stopPropagation(),y||S()}},void 0)}),void 0)]},void 0);return"read-only"===h?s("div",Object.assign({ref:v,"data-testid":d("chip",j),css:c({styleType:h,fill:T,isSelected:I}),"aria-readonly":"true"},{children:O}),void 0):s("button",Object.assign({role:"button",ref:v,"data-testid":d("chip",j),css:c({styleType:h,fill:T,isSelected:I,onClear:S,onClick:g}),onClick:g,disabled:y},{children:O}),void 0)}));v.displayName="Chip";export{v as default};

package/dist/components/Chip/Chip.style.js

@@ -0,0 +1,33 @@
+import{css as o}from"@emotion/react";import{flexCenterVertical as e}from"../../theme/functions.js";import{rem as t}from"../../theme/utils.js";import{getDisabled as r}from"../../theme/states/disabled.js";import{getFocus as s}from"../../theme/states/focus.js";import{getHover as i}from"../../theme/states/hover.js";import{getPressed as l}from"../../theme/states/pressed.js";const n=({styleType:n,fill:a="greyScale",isSelected:g,onClear:c,onClick:d})=>m=>{const h="interactive"===n,b="read-only"===n||c||g;return o`
+      ${e};
+      height: ${m.globals.spacing.get("8")};
+      border-radius: ${m.globals.spacing.get("8")};
+      font-size: ${m.globals.typography.fontSizes.get("2")};
+      font-weight: ${m.globals.typography.weights.get("medium")};
+      line-height: normal;
+      box-sizing: border-box;
+      padding: ${m.globals.spacing.get("3")} ${m.globals.spacing.get("4")};
+      background-color: ${b?m.utils.getColor(a,50):m.globals.colors.white};
+      color: ${m.utils.getAAColorFromSwatches(a,50)};
+      border: ${t(1)} solid
+        ${b?m.utils.getColor(a,550):m.utils.getColor("lightGrey",200)};
+      cursor: ${d?"pointer":"auto"};
+      width: fit-content;
+      transition: background-color 150ms linear;
+
+      &:hover:not(:disabled) {
+        background: ${b?i({theme:m,color:a,shade:50}).backgroundColor:i({theme:m}).backgroundColor};
+      }
+
+      &:focus-visible:not(:disabled) {
+        outline: ${h?s({theme:m,borderWidth:1}).styleOutline:"none"};
+      }
+
+      ${h&&`\n    &:active:not(:disabled) {\n      background: ${l({theme:m,color:a,shade:50}).backgroundColor};\n    }\n\n\n      :disabled {\n        opacity: ${r().opacity};\n        cursor: ${r().cursor};\n      }\n    `}
+
+      > :not(:last-child) {
+        margin-right: ${m.globals.spacing.get("3")};
+      }
+    `},a=e=>()=>o`
+    cursor: ${e?r().cursor:"pointer"};
+  `;export{n as chipStyle,a as closeIconWrapperStyle};

package/dist/components/Chip/Chip.types.js

@@ -0,0 +1 @@
+const e="read-only",t="interactive",n=[e,t];export{t as INTERACTIVE,e as READ_ONLY,n as styleType};

package/dist/components/Chip/components/Badge/Badge.js

@@ -0,0 +1 @@
+import{jsx as e}from"@emotion/react/jsx-runtime";import{generateTestDataId as t}from"../../../../utils/helpers.js";import{badgeStyle as s}from"./Badge.style.js";const i=({fill:i,isSelected:d,badgeNumber:r,dataTestId:a})=>e("div",Object.assign({"data-testid":t("badge",a),css:s({fill:i,isSelected:d})},{children:r}),void 0);export{i as default};

package/dist/components/Chip/components/Badge/Badge.style.js

@@ -0,0 +1,14 @@
+import{css as t}from"@emotion/react";import{flex as e}from"../../../../theme/functions.js";const o=({fill:o="greyScale",isSelected:i})=>l=>t`
+      ${e};
+      width: ${l.globals.spacing.get("6")};
+      height: ${l.globals.spacing.get("6")};
+      border-radius: 100%;
+      background: ${i?l.utils.getColor(o,550):l.utils.getColor("lightGrey",200)};
+      font-size: ${l.globals.typography.fontSizes.get("1")};
+      font-weight: ${l.globals.typography.weights.get("medium")};
+      align-items: center;
+      flex-shrink: 0;
+      line-height: normal;
+      justify-content: center;
+      color: ${i?l.utils.getAAColorFromSwatches(o,550):l.utils.getAAColorFromSwatches("lightGrey",200)};
+    `;export{o as badgeStyle};

package/dist/components/Chip/utils.js

@@ -0,0 +1 @@
+import{PropsValidationError as e}from"../../utils/errors.js";import{READ_ONLY as s,INTERACTIVE as t}from"./Chip.types.js";const i={isDisabled:!1,styleType:s,dataTestId:""},r=[{condition:({styleType:e,isSelected:t,isChecked:i,badgeNumber:r,isDisabled:o})=>Boolean(e===s&&(t||i||r||o)),error:new e("The properties isSelected, isChecked, badgeNumber and disabled are only for Interactive style type Chips.")},{condition:({styleType:e,thumbnail:s})=>Boolean(e===t&&s),error:new e("The property thumbnail is only for Read-Only style type Chips.")}];export{i as defaultProps,r as errors};

package/dist/components/DatePicker/DatePickInput/DatePickInput.js

@@ -0,0 +1 @@
+import{jsx as e}from"@emotion/react/jsx-runtime";import t from"dayjs";import o from"react";import{getLocaleFormat as a,generateTestDataId as r}from"../../../utils/helpers.js";import{FilterBase as l}from"../../Filter/components/FilterBase/FilterBase.js";import i from"../../Icon/Icon.js";import s from"../../TextField/TextField.js";import{rangeInputsWrapper as n}from"./DatePickInput.style.js";const d=()=>{},c=o.forwardRef((({handleFocus:c,filterConfig:m={},handleClear:p,dataTestId:f,isRangePicker:y,inputProps:u,selectedDay:D,dateFormatOverride:h="MM/DD/YYYY",isOpen:T},I)=>{const j=o.useCallback((e=>o=>o?t(o).format(a(e)):"")(h),[h]),F=j(D.from),b=j(D.to),g=((e,t)=>({selectDate:"Select Date"+(e?"s":""),to:e?`- ${t}`:""}))(y,b),{buttonType:v="primary",styleType:$="filled",filterType:O}=m;return e("div",Object.assign({css:n()},{children:O?e(l,{isDatePicker:!0,dataTestId:r("filter",f),isDisabled:!1,buttonType:v,styleType:$,handleOpen:c,filterType:O,onClear:p,selectedItemLabel:D.from&&`${g.selectDate} : ${F} ${g.to}`,isOpen:T,hasSelectedValue:Boolean(D.from&&`${F} - ${b}`),label:D.from?"":g.selectDate,iconName:D.from?"calendarFilled":"calendarEmpty"},void 0):e(s,y?Object.assign({ref:I},u,{onFocus:c,onKeyDown:p,dataTestId:f,onChange:d,placeholder:"Date (start) - Date (end)",value:D.from&&`${F} - ${b}`,rightIcon:e(i,{name:"calendarEmpty",color:"#676767"},void 0)}):Object.assign({ref:I},u,{onFocus:c,onKeyDown:p,dataTestId:f,onChange:d,placeholder:"Select date",value:D.to&&F,rightIcon:e(i,{name:"calendarEmpty",color:"#676767"},void 0)}),void 0)}),void 0)}));c.displayName="DatePickInput";export{c as default};

package/dist/components/DatePicker/DatePickInput/DatePickInput.style.js

@@ -0,0 +1,3 @@
+import{css as t}from"@emotion/react";import{rem as o}from"../../../theme/utils.js";const m=()=>m=>t`
+  max-width: ${o(280)};
+`;export{m as rangeInputsWrapper};

package/dist/components/DatePicker/DatePicker.js

@@ -0,0 +1 @@
+import{jsx as t}from"@emotion/react/jsx-runtime";import{useState as e,useCallback as o,useEffect as i}from"react";import s from"../utils/ClickAwayListener/ClickAwayListener.js";import a from"../utils/PositionInScreen/PositionInScreen.js";import{datePickerStyles as r}from"./DatePicker.style.js";import d from"./DatePickInput/DatePickInput.js";import n from"./OverlayComponent/OverlayComponent.js";import{currentDay as l,initDates as m,datepickerPropValue as c}from"./utils.js";const f=[{value:"last-7-days",label:"Last 7 days",dates:[l.subtract(7,"day"),l]},{value:"last-30-days",label:"Last 30 days",dates:[l.subtract(30,"day"),l]},{value:"custom",label:"Custom",dates:[l]}],v=({isRangePicker:l=!1,onChange:v,disableDates:u,value:p={from:null==c?void 0:c.toDate(),to:null==c?void 0:c.toDate()},inputProps:y,dateFormatOverride:O,isClearable:b=!1,filterConfig:j,isDefaultNow:g=!0,dataTestId:C})=>{const[k,D]=e(!1),[P,A]=e(""),[h,I]=e(m(p,g)),[T,w]=e(m(p,g)),L=o((t=>{const e=f.find((e=>e.value===t));e&&I(Array.isArray(e.dates)?{from:e.dates[0],to:e.dates[1]}:{from:e.dates,to:e.dates}),A(t)}),[]),S=o((t=>{var e,o;const i={from:t.to&&(null===(e=t.from)||void 0===e?void 0:e.isAfter(t.to))?t.to:t.from,to:t.to&&(null===(o=t.from)||void 0===o?void 0:o.isAfter(t.to))?t.from:t.to};i.to&&D(!1),w(i),v&&v(i)}),[v]);i((()=>{l&&S(h)}),[S,l,h]);const x=o((t=>{const e=t.startOf("day"),o=t.endOf("day");return I(l?t=>t.from&&t.to?{from:e,to:void 0}:t.from?Object.assign(Object.assign({},t),{to:o}):Object.assign(Object.assign({},t),{from:e}):i=>i.from&&i.to&&t.isBetween(i.from,i.to)?{from:void 0,to:void 0}:{from:e,to:o})}),[l]),F=o((()=>{D(!1)}),[]),R=o((()=>{D(!0)}),[]),B=o((t=>!(!b&&"added"!==(null==j?void 0:j.filterType))&&((null==j?void 0:j.filterType)?(D(!1),w({to:void 0,from:void 0})):27===t.keyCode?D(!1):8===t.keyCode?w((t=>t.from&&t.to?Object.assign(Object.assign({},t),{to:void 0}):{to:void 0,from:void 0})):void 0)),[b,null==j?void 0:j.filterType]),N=o((()=>{S(h)}),[S,h]);return t(s,Object.assign({onClick:F},{children:t(a,Object.assign({isVisible:k,parent:()=>t(d,{filterConfig:j,isRangePicker:l,selectedDay:T,inputProps:y,dateFormatOverride:O,handleFocus:R,handleClear:B,isOpen:k,dataTestId:C},void 0)},{children:t("div",Object.assign({css:r()},{children:t(n,{selectedOption:P,setSelectedOption:L,extraOptions:f,isRangePicker:l,onDaySelect:x,selectedDays:h,disabledDates:u,onCancel:F,onApply:N},void 0)}),void 0)}),void 0)}),void 0)};export{v as default,f as extraOptions};

package/dist/components/DatePicker/DatePicker.style.js

@@ -0,0 +1,7 @@
+import{css as o}from"@emotion/react";const t=()=>t=>o`
+      position: absolute;
+      background-color: ${t.globals.colors.white};
+      z-index: 10;
+      margin-top: ${t.globals.spacing.get("4")};
+      box-shadow: ${t.globals.elevation["02"]};
+    `;export{t as datePickerStyles};

package/dist/components/DatePicker/Day/Day.js

@@ -0,0 +1 @@
+import{jsx as e}from"@emotion/react/jsx-runtime";import{useTypeColorToColorMatch as s}from"../../../hooks/useTypeColorToColorMatch.js";import i from"react";import{currentDay as t}from"../utils.js";import{emptyDayStyle as o,dayWrapperStyle as a,dayStyle as r}from"./Day.style.js";var l=i.memo((({day:l,month:d,year:c,onSelect:n,isSelected:m=!1,isBetween:u=!1,isLast:y=!1,isFirst:p=!1,isDisabled:h=!1})=>{const{calculateColorBetweenColorAndType:v}=s(),C=v("","primary"),b=i.useMemo((()=>l&&t.month(d).date(l).year(c)),[c,l,d]),f=i.useMemo((()=>t.month()===d&&t.year()===c&&t.date()===l),[c,d,l]),j=i.useCallback((e=>{e.preventDefault(),n&&b&&n(b)}),[n,b]);return e("td",l?Object.assign({style:{padding:0},onClick:h?void 0:j},{children:e("div",Object.assign({css:a({isSelected:m,isBetween:u,calculatedColor:C,isLast:y,isFirst:p,isToday:f,isDisabled:h})},{children:e("div",Object.assign({css:r({isSelected:m,isBetween:u,calculatedColor:C,isLast:y,isFirst:p,isToday:f,isDisabled:h})},{children:l}),void 0)}),void 0)}):{css:o({isBetween:u})},void 0)}));export{l as default};

package/dist/components/DatePicker/Day/Day.style.js

@@ -0,0 +1,35 @@
+import{css as t}from"@emotion/react";import{rem as e}from"../../../theme/utils.js";import{getHover as r}from"../../../theme/states/hover.js";import"../../../theme/palette.js";const o=({isSelected:r,isBetween:o,calculatedColor:i,isLast:n,isFirst:a,isToday:l,isDisabled:s})=>d=>t`
+      vertical-align: middle;
+      text-align: center;
+      cursor: pointer;
+      position: relative;
+      color: ${r?d.utils.getAAColorFromSwatches(i.color,i.shade):d.utils.getColor("darkGrey",850)};
+      width: ${e(40)};
+      padding: 0 ${e(4)};
+      font-weight: ${l&&"bold"};
+      opacity: ${s?.5:1};
+      background: ${n||a?"transparent":(r||o)&&void 0!==o&&d.utils.getColor("blue",50)};
+      border-bottom-right-radius: ${n&&r&&"100%"};
+      border-top-right-radius: ${n&&r&&"100%"};
+      border-bottom-left-radius: ${a&&r&&"100%"};
+      border-top-left-radius: ${a&&r&&"100%"};
+
+      ${(r||n||a)&&`&:after {\n    z-index: -1;\n    content: ' ';\n    height: 100%;\n    width: 50%;\n    position: absolute;\n    top: 0;\n     background: ${n&&a?"transparent":(r||o)&&void 0!==o&&d.utils.getColor("blue",50)};\n  left: ${n?"0":"initial"};\n  right: ${a?"0":"initial"};\n  border-bottom-right-radius: ${n&&r&&"100%"};\n  border-top-right-radius: ${n&&r&&"100%"};\n  border-bottom-left-radius: ${a&&r&&"100%"};\n  border-top-left-radius: ${a&&r&&"100%"};\n  }`}
+    `,i=({isBetween:e})=>r=>t`
+      vertical-align: middle;
+      text-align: center;
+      cursor: pointer;
+      position: relative;
+      background: ${e?r.utils.getColor("blue",50):"transparent"};
+    `,n=({isSelected:o,calculatedColor:i,isToday:n,isDisabled:a,isBetween:l})=>s=>t`
+      border: ${e(1)} solid ${n?s.utils.getColor("lightGrey",450):"transparent"};
+      border-radius: ${(n||o)&&"100%"};
+      width: ${e(39)};
+      height: ${e(39)};
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      background: ${o?s.utils.getColor(i.color,i.shade):"transparent"};
+
+      ${!a&&`&:hover {\n            border-radius: 100%;\n            background: ${!o&&(l?r({theme:s,color:"blue",shade:50}).backgroundColor:r({theme:s}).backgroundColor)};\n          }`}
+    `;export{n as dayStyle,o as dayWrapperStyle,i as emptyDayStyle};

package/dist/components/DatePicker/Month/Month.js

@@ -0,0 +1 @@
+import{jsxs as e,jsx as t}from"@emotion/react/jsx-runtime";import o from"dayjs";import r from"dayjs/plugin/isBetween";import a from"lodash/chunk";import s from"lodash/inRange";import*as n from"react";import{useCallback as i}from"react";import d from"../Day/Day.js";import{currentDay as m}from"../utils.js";import{weekDaysWrapperStyle as l,weekDayStyle as c,datesWrapperStyle as y}from"./Month.style.js";import{calculateSelectedDay as f,calculateDisabledDays as u,calculatedDayIsBetween as h,calculateSelectedDayPosition as p}from"./Month.utils.js";o.extend(r);const j=["Monday","Tuesday","Wednesday","Thurdsday","Friday","Saturday","Sunday"];var D=n.memo((({year:o,month:r,onDaySelect:D,selectedDays:b,disabledDates:g})=>{const v=n.useMemo((()=>{const e=m.month(r).year(o).date(1),t=e.daysInMonth(),n=e.day(),i=function(e,t){const o=new Date(e,t-1,1).getDay(),r=new Date(e,t,0).getDate();return Math.ceil((r+o)/7)}(o,r),d=Array(7*i).fill(null).reduce(((e,o,r)=>{const a=r+1;return[...e,s(a,n,t+n)?a-n+1:void 0]}),[]);return a(d,7)}),[o,r]),B=i(f,[]),$=i(u,[]),M=i(h,[]),w=i(p,[]);return e(n.Fragment,{children:[t("div",Object.assign({css:l()},{children:j.map((e=>t("div",Object.assign({css:c()},{children:e.substr(0,2)}),e)))}),void 0),t("table",Object.assign({css:y()},{children:t("tbody",{children:v.map(((e,a)=>t("tr",{children:e.map(((e,s)=>t(d,{year:o,month:r,day:e,onSelect:D,isDisabled:Boolean($(e,r,o,g)),isSelected:Boolean(B(e,r,o,b.from,b.to)),isBetween:Boolean(M(e,r,o,b.from,b.to)),isLast:Boolean(w(e,"last",r,o,b.from,b.to)),isFirst:Boolean(w(e,"first",r,o,b.from,b.to))},`${o}-${r}-${a}-${s}-day`)))},`${o}-${r}-${a}-week`)))},void 0)}),void 0)]},void 0)}));export{D as default};

package/dist/components/DatePicker/Month/Month.style.js

@@ -0,0 +1,17 @@
+import{css as o}from"@emotion/react";import{rem as t}from"../../../theme/utils.js";const e=()=>e=>o`
+      display: flex;
+      justify-content: space-around;
+      border-top: ${t(1)} solid;
+      border-bottom: ${t(1)} solid;
+      border-color: ${e.utils.getColor("lightGrey",100)};
+    `,r=()=>e=>o`
+      color: ${e.utils.getColor("lightGrey",650)};
+      padding: ${e.globals.spacing.get("6")} 0;
+      width: ${t(39)};
+      font-size: ${e.globals.typography.fontSizes.get("3")};
+      text-align: center;
+      font-weight: ${e.globals.typography.weights.get("medium")};
+    `,l=()=>t=>o`
+      border-collapse: separate;
+      border-spacing: 0 ${t.globals.spacing.get("4")};
+    `;export{l as datesWrapperStyle,r as weekDayStyle,e as weekDaysWrapperStyle};

package/dist/components/DatePicker/Month/Month.utils.js

@@ -0,0 +1 @@
+import e from"dayjs";import{currentDay as r}from"../utils.js";const t=(t,o,n,i)=>{if(!t)return!1;const l=r.month(o).year(n).date(t);return(null==i?void 0:i.after)&&(null==i?void 0:i.before)?!l.isBetween(e(null==i?void 0:i.after),e(null==i?void 0:i.before)):(null==i?void 0:i.after)?l.isAfter(e(null==i?void 0:i.after)):(null==i?void 0:i.before)?l.isBefore(e(null==i?void 0:i.before)):(null==i?void 0:i.daysOfWeek)?null==i?void 0:i.daysOfWeek.includes(l.day()):!!(null==i?void 0:i.days)&&Boolean(null==i?void 0:i.days.find((r=>e(r).isSame(e(l),"day"))))},o=(t,o,n,i,l)=>{if(!t)return!1;const d=r.month(o).year(n).date(t);return i&&l&&e(d).isBetween(i,l)},n=(e,t="first",o,n,i,l)=>{if(e&&i&&l){const d=i.isAfter(l)?l:i,a=i.isAfter(l)?i:l,u="last"===t?a:d;return u&&u.isSame(r.month(o).year(n).date(e),"day")}return e&&(null==i?void 0:i.isSame(r.month(o).year(n).date(e),"day"))},i=(e,t,o,n,i)=>{if(!e)return!1;const l=r.month(t).year(o).date(e);return[null==n?void 0:n.format("D,M,YYYY"),null==i?void 0:i.format("D,M,YYYY")].includes(l.format("D,M,YYYY"))};export{t as calculateDisabledDays,i as calculateSelectedDay,n as calculateSelectedDayPosition,o as calculatedDayIsBetween};

package/dist/components/DatePicker/OverlayComponent/OverlayComponent.js

@@ -0,0 +1 @@
+import{jsxs as e,jsx as s}from"@emotion/react/jsx-runtime";import*as t from"react";import{useState as i,useCallback as o}from"react";import r from"../../Button/Button.js";import{currentDay as a}from"../utils.js";import n from"./components/MonthWrapper/MonthWrapper.js";import{overlayWrapperStyle as c,optionsWrapperStyle as d,optionStyle as l,buttonsMonthsWrapperStyle as m,monthsWrapperStyle as p,buttonsWrapperStyle as h}from"./OverlayComponent.style.js";var v=t.memo((({selectedOption:t,setSelectedOption:v=(()=>{}),isRangePicker:b=!1,extraOptions:g=[],onDaySelect:y,selectedDays:j,disabledDates:f,onCancel:D=(()=>{}),onApply:O=(()=>{})})=>{const[k,u]=i(a),[w,A]=i(a),C=o(((e="back")=>{u((s=>s.month(s.month()+("forward"===e?1:-1)))),A((s=>s.month(s.month()+("forward"===e?1:-1))))}),[k,w]);return e("div",Object.assign({css:c()},{children:[g.length>0&&b&&s("div",Object.assign({css:d()},{children:g.map((e=>s("div",Object.assign({css:l({isSelected:t===e.value}),onClick:()=>v(e.value)},{children:e.label}),e.value)))}),void 0),e("div",Object.assign({css:m({isRangePicker:b})},{children:[e("div",Object.assign({css:p({isRangePicker:b})},{children:[s(n,{date:k,onDaySelect:y,selectedDays:j,setDate:u,handleArrow:C,showedArrows:b?"left":"both",disabledDates:f,isRangePicker:b},void 0),b&&s(n,{date:w.month(w.month()+1),onDaySelect:y,selectedDays:j,setDate:A,handleArrow:C,showedArrows:b?"right":"both",disabledDates:f,isRangePicker:b},void 0)]}),void 0),!b&&e("div",Object.assign({css:h()},{children:[s(r,Object.assign({isFilled:!1,size:"sm",onClick:D,type:"primary"},{children:"Cancel"}),void 0),s(r,Object.assign({size:"sm",onClick:O,type:"primary",isDisabled:Boolean(!j.from||!j.to)},{children:"Apply"}),void 0)]}),void 0)]}),void 0)]}),void 0)}));export{v as default};

package/dist/components/DatePicker/OverlayComponent/OverlayComponent.style.js

@@ -0,0 +1,47 @@
+import{css as t}from"@emotion/react";import{flex as o}from"../../../theme/functions.js";const e=()=>e=>t`
+      ${o};
+      border: 1px solid ${e.utils.getColor("lightGrey",100)};
+      border-radius: ${e.globals.spacing.get("3")};
+      width: fit-content;
+    `,i=()=>o=>t`
+      background-color: ${o.utils.getColor("lightGrey",null,"pale")};
+    `,n=({isSelected:o})=>e=>t`
+      white-space: nowrap;
+      padding: ${e.globals.spacing.get("6")};
+      font-weight: ${o?e.globals.typography.weights.get("medium"):e.globals.typography.weights.get("regular")};
+      cursor: pointer;
+      background-color: ${o?e.utils.getColor("blue",50):"transparent"};
+      position: relative;
+      font-size: ${e.globals.typography.fontSizes[13]};
+
+      &:hover {
+        background-color: ${e.utils.getColor("lightGrey",50)};
+      }
+
+      ${o&&"&:after {\n    content: '';\n    position: absolute;\n    right: -10px;\n    top: 0;\n    bottom: 0;\n    margin: auto;\n    width: 0;\n    height: 0;\n    border-left: 15px solid transparent;\n    border-right: 15px solid transparent;\n    border-top: 15px solid #fff;\n    clear: both;\n    transform: rotate(90deg);\n  }"}
+    `,r=({isRangePicker:o})=>e=>t`
+      display: flex;
+      flex-direction: column;
+      position: relative;
+      margin-bottom: ${o&&e.globals.spacing.get("6")};
+    `,g=({isRangePicker:o})=>e=>t`
+      display: flex;
+      flex-direction: row;
+      position: relative;
+      padding: 0 ${e.globals.spacing.get("8")};
+      z-index: 10;
+
+      > div:first-of-type {
+        margin-right: ${o?e.globals.spacing.get("8"):0};
+      }
+    `,l=()=>o=>t`
+      display: flex;
+      justify-content: flex-end;
+      margin-bottom: ${o.globals.spacing.get("6")};
+      margin-right: ${o.globals.spacing.get("8")};
+
+      > button {
+        margin: ${o.globals.spacing.get("4")} 0 ${o.globals.spacing.get("4")}
+          ${o.globals.spacing.get("4")};
+      }
+    `;export{r as buttonsMonthsWrapperStyle,l as buttonsWrapperStyle,g as monthsWrapperStyle,n as optionStyle,i as optionsWrapperStyle,e as overlayWrapperStyle};

package/dist/components/DatePicker/OverlayComponent/components/MonthWrapper/MonthWrapper.js

@@ -0,0 +1 @@
+import{jsx as e,jsxs as o}from"@emotion/react/jsx-runtime";import t from"../../../../../hooks/useTheme.js";import i from"lodash/range";import r,{useState as n,useMemo as s}from"react";import a from"../../../Month/Month.js";import{monthWrapperStyle as l,monthHeaderWrapperStyle as c,monthHeaderNavigationIconWrapperStyle as d,monthHeaderTitleWrapperStyle as m,monthHeaderTitleStyle as h}from"./MonthWrapper.style.js";import v from"../../../../Button/Button.js";import g from"../../../../Icon/Icon.js";import f from"../../../../Select/components/SelectMenu/SelectMenu.js";import p from"../../../../utils/ClickAwayListener/ClickAwayListener.js";var u=r.memo((({setDate:u,onDaySelect:M=(()=>{}),selectedDays:b,date:j,handleArrow:k=(()=>{}),showedArrows:Y="both",disabledDates:y,isRangePicker:O=!1})=>{const[C,D]=n(!1),w=t(),S=s((()=>function(e){const o=(new Date).getFullYear()+10,t=(new Date).getFullYear()-10;return i(t,o).map((o=>({value:o.toString(),label:`${e.format("MMMM")} ${o.toString()}`})))}(j)),[j]);return e(r.Fragment,{children:o("div",Object.assign({css:l()},{children:[o("div",Object.assign({css:c()},{children:[("left"===Y||"both"===Y)&&e("div",Object.assign({onClick:()=>k("back"),css:d({position:"left"})},{children:e(g,{name:"chevronSmallLeft",color:w.utils.getColor("darkGrey",850),size:25},void 0)}),void 0),o(p,Object.assign({onClick:()=>{D(!1)}},{children:[o("div",Object.assign({css:m({isRangePicker:O})},{children:[e("div",Object.assign({css:h({isRangePicker:O})},{children:O?o("div",{children:[j.format("MMMM")," ",j.format("YYYY")]},void 0):o(v,Object.assign({onClick:()=>D(!C),color:"neutralWhite-100",iconRight:e(g,{name:"triangleDown",size:10,color:w.utils.getColor("darkGrey",850)},void 0)},{children:[j.format("MMMM")," ",j.format("YYYY")]}),void 0)}),void 0),C&&e(f,{filteredOptions:S,handleOptionClick:e=>{u(j.year(Number(e.value))),D(!1)},selectedOption:j.format("YYYY")},void 0)]}),void 0),("right"===Y||"both"===Y)&&e("div",Object.assign({onClick:()=>k("forward"),css:d({position:"right"})},{children:e(g,{name:"chevronSmallRight",color:w.utils.getColor("darkGrey",850),size:25},void 0)}),void 0)]}),void 0)]}),void 0),e(a,{year:j.year(),month:j.month(),onDaySelect:M,selectedDays:b,disabledDates:y},void 0)]}),void 0)},void 0)}));export{u as default};