@orfium/ictinus 4.55.0-next.3 → 4.55.0-next.5

package/dist/components/Filter/Filter.js

@@ -1 +1 @@
-import{jsx as e,jsxs as t}from"@emotion/react/jsx-runtime";import a from"lodash/debounce.js";import i,{useMemo as l}from"react";import{errorHandler as s,generateTestDataId as o}from"../../utils/helpers.js";import r from"../utils/ClickAwayListener/ClickAwayListener.js";import{FilterBase as n}from"./components/FilterBase/FilterBase.js";import c from"./components/Options/Options.js";import d from"./components/SearchInput/SearchInput.js";import{menuStyle as m}from"./Filter.style.js";import{errors as u}from"./utils.js";import{handleSearch as p}from"../utils/handleSearch.js";const f=i.forwardRef(((f,h)=>{var b;const{items:v,onSelect:y,selectedItem:S,defaultValue:j,styleType:C,label:T="",buttonType:g="primary",filterType:I="preset",isDisabled:O=!1,dataTestId:L,isSearchable:V=!1,minCharactersToSearch:w=0,onAsyncSearch:k,isLoading:A=!1,isVirtualized:D=!1,onClear:F=(()=>{})}=f;s(u,f);const[B,x]=i.useState(!1),[z,N]=i.useState(""),R=Boolean(null==S?void 0:S.value)&&(null==S?void 0:S.value)!==j.value,U=B?"triangleUp":"triangleDown",q=l((()=>k?v:v.filter((e=>!z||e.label.toLowerCase().includes(z.toLowerCase())))),[z,v,k]),E=""===z&&!!v.length,G=i.useCallback(a((e=>{null==k||k(e)}),400),[]);return e(r,Object.assign({onClick:()=>x(!1)},{children:e(n,Object.assign({ref:h,dataTestId:L,handleOpen:()=>{N(""),x(!B)},isDisabled:O,onClear:F,selectedItemLabel:null!==(b=null==S?void 0:S.label)&&void 0!==b?b:j.label,isOpen:B,hasSelectedValue:R,label:T,iconName:U,filterType:I,buttonType:g,styleType:C},{children:B&&t("div",Object.assign({css:m(),"data-testid":o("filter-menu",L)},{children:[V&&e(d,{value:z,onChange:e=>{p({event:e,isSearchable:V,isAsync:"function"==typeof k,setSearchValue:N,onChange:G,minCharactersToSearch:w})},dataTestId:L,isLoading:A},void 0),e(c,{dataTestId:L,items:q,isVirtualized:D,defaultValue:j,isSearchable:V,selectedItem:S,onSelect:e=>{x(!1),y(e)},isDefaultOptionVisible:E},void 0)]}),void 0)}),void 0)}),void 0)}));f.displayName="Filter";export{f as default};
+import{jsx as e,jsxs as t}from"@emotion/react/jsx-runtime";import a from"lodash/debounce.js";import i,{useMemo as l}from"react";import{errorHandler as s,generateTestDataId as o}from"../../utils/helpers.js";import{FilterBase as r}from"./components/FilterBase/FilterBase.js";import n from"./components/Options/Options.js";import c from"./components/SearchInput/SearchInput.js";import{menuStyle as d}from"./Filter.style.js";import{errors as m}from"./utils.js";import u from"../utils/ClickAwayListener/ClickAwayListener.js";import{handleSearch as p}from"../utils/handleSearch.js";const f=i.forwardRef(((f,h)=>{var b;const{items:v,onSelect:y,selectedItem:S,defaultValue:j,styleType:C,label:T="",buttonType:g="primary",filterType:I="preset",isDisabled:O=!1,dataTestId:L,isSearchable:V=!1,minCharactersToSearch:w=0,onAsyncSearch:k,isLoading:A=!1,isVirtualized:D=!1,onClear:F=(()=>{})}=f;s(m,f);const[B,x]=i.useState(!1),[z,N]=i.useState(""),R=Boolean(null==S?void 0:S.value)&&(null==S?void 0:S.value)!==j.value,U=B?"triangleUp":"triangleDown",q=l((()=>k?v:v.filter((e=>!z||e.label.toLowerCase().includes(z.toLowerCase())))),[z,v,k]),E=""===z&&!!v.length,G=i.useCallback(a((e=>{null==k||k(e)}),400),[]);return e(u,Object.assign({onClick:()=>x(!1)},{children:e(r,Object.assign({ref:h,dataTestId:L,handleOpen:()=>{N(""),x(!B)},isDisabled:O,onClear:F,selectedItemLabel:null!==(b=null==S?void 0:S.label)&&void 0!==b?b:j.label,isOpen:B,hasSelectedValue:R,label:T,iconName:U,filterType:I,buttonType:g,styleType:C},{children:B&&t("div",Object.assign({css:d(),"data-testid":o("filter-menu",L)},{children:[V&&e(c,{value:z,onChange:e=>{p({event:e,isSearchable:V,isAsync:"function"==typeof k,setSearchValue:N,onChange:G,minCharactersToSearch:w})},dataTestId:L,isLoading:A},void 0),e(n,{dataTestId:L,items:q,isVirtualized:D,defaultValue:j,isSearchable:V,selectedItem:S,onSelect:e=>{x(!1),y(e)},isDefaultOptionVisible:E},void 0)]}),void 0)}),void 0)}),void 0)}));f.displayName="Filter";export{f as default};

package/dist/components/Filter/Filter.style.js

@@ -1,9 +1,9 @@
-import{css as e}from"@emotion/react";import{rem as t}from"../../theme/utils.js";import{getFocus as o}from"../../theme/states/focus.js";import{getHover as l}from"../../theme/states/hover.js";import{getPressed as i}from"../../theme/states/pressed.js";import{HAS_SELECTED_VALUE_COLOR_SHADE as r,getBorder as a,borderStyleParams as s,getTextColor as d,getBackgroundColor as n,focusBorderWidth as p,transparentFocusBorderWidth as c}from"./utils.js";const h=()=>()=>({position:"relative",display:"inline-block",height:t(36)}),g=()=>()=>({display:"flex",alignItems:"center",gap:t(4),height:"100%"}),b=({isDisabled:e,isOpen:a,hasSelectedValue:s,calculatedColor:d,styleType:n})=>h=>{const g=!e&&!a,b="filled"===n?p:c;return{background:"none",border:"none",display:"flex",padding:"0",alignItems:"center",height:"100%",minWidth:t(110),":hover > div":{backgroundColor:g?s?l({theme:h,color:d.color,shade:r}).backgroundColor:l({theme:h}).backgroundColor:void 0},":active > div":{backgroundColor:g?s?i({theme:h,color:d.color,shade:r}).backgroundColor:i({theme:h}).backgroundColor:void 0},":focus-visible > div":{border:o({theme:h,borderWidth:b}).styleBorder},":focus-visible > span":{borderTop:o({theme:h,borderWidth:b}).styleBorder,borderBottom:o({theme:h,borderWidth:b}).styleBorder}}},u=({calculatedColor:e,isDisabled:t,isOpen:o,styleType:l,hasSelectedValue:i,filterType:r})=>p=>({fontSize:p.globals.typography.fontSizes[13],cursor:t?"not-allowed":"pointer",height:"100%",opacity:t?.5:1,transition:"all 150ms linear",color:d({theme:p,isOpen:o,calculatedColor:e,hasSelectedValue:i}),backgroundColor:n({theme:p,isOpen:o,styleType:l,hasSelectedValue:i,calculatedColor:e}),border:`${s} ${a({styleType:l,theme:p,hasSelectedValue:i,filterType:r,calculatedColor:e,isOpen:o})}`,display:"flex",justifyContent:"center",width:"100%","&:hover":{border:`${s} ${a({styleType:l,theme:p,hasSelectedValue:i,filterType:r,calculatedColor:e,isOpen:o,state:"hover"})}`}}),m=e=>o=>{const{isOpen:l,calculatedColor:i,styleType:r,hasSelectedValue:d,filterType:n}=e;return{height:"100%",width:t(1),position:"relative",minWidth:t(1),transition:"all 150ms linear",backgroundColor:a({styleType:r,theme:o,hasSelectedValue:d,filterType:n,calculatedColor:i,isOpen:l,isDivider:!0}),borderTop:`${s} ${a({styleType:r,theme:o,hasSelectedValue:d,filterType:n,calculatedColor:i,isOpen:l})}`,borderBottom:`${s} ${a({styleType:r,theme:o,hasSelectedValue:d,filterType:n,calculatedColor:i,isOpen:l})}`}},y=e=>o=>Object.assign(Object.assign({},u(e)(o)),{borderLeft:"0 !important",paddingLeft:t(4),paddingRight:t(4),display:"flex",alignItems:"center",justifyContent:"center",width:t(34),borderTopRightRadius:o.globals.spacing.get("8"),borderBottomRightRadius:o.globals.spacing.get("8")}),f=e=>t=>{const{filterType:o}=e,l="preset"===o;return Object.assign(Object.assign({},u(e)(t)),{padding:`0 ${l?t.globals.spacing.get("6"):t.globals.spacing.get("3")} 0 ${t.globals.spacing.get("6")}`,borderRadius:t.globals.spacing.get("8"),borderRight:l?void 0:"0 !important",borderTopRightRadius:l?void 0:0,borderBottomRightRadius:l?void 0:0})},v=()=>()=>({lineHeight:t(15),marginLeft:0}),T=(e,t)=>o=>({fontWeight:e||t?o.globals.typography.weights.get("bold"):o.globals.typography.weights.get("regular"),display:"flex",alignItems:"center",div:{flex:"none"},span:{fontWeight:o.globals.typography.weights.get("bold")}}),C=()=>e`
+import{css as e}from"@emotion/react";import{rem as t}from"../../theme/utils.js";import{HAS_SELECTED_VALUE_COLOR_SHADE as o,getBorder as l,borderStyleParams as i,getTextColor as r,getBackgroundColor as a,focusBorderWidth as s,transparentFocusBorderWidth as d}from"./utils.js";import{getFocus as n}from"../../theme/states/focus.js";import{getHover as p}from"../../theme/states/hover.js";import{getPressed as c}from"../../theme/states/pressed.js";const h=()=>()=>({position:"relative",display:"inline-block",height:t(36)}),g=()=>()=>({display:"flex",alignItems:"center",gap:t(4),height:"100%"}),b=({isDisabled:e,isOpen:l,hasSelectedValue:i,calculatedColor:r,styleType:a})=>h=>{const g=!e&&!l,b="filled"===a?s:d;return{background:"none",border:"none",display:"flex",padding:"0",alignItems:"center",height:"100%",minWidth:t(110),":hover > div":{backgroundColor:g?i?p({theme:h,color:r.color,shade:o}).backgroundColor:p({theme:h}).backgroundColor:void 0},":active > div":{backgroundColor:g?i?c({theme:h,color:r.color,shade:o}).backgroundColor:c({theme:h}).backgroundColor:void 0},":focus-visible > div":{border:n({theme:h,borderWidth:b}).styleBorder},":focus-visible > span":{borderTop:n({theme:h,borderWidth:b}).styleBorder,borderBottom:n({theme:h,borderWidth:b}).styleBorder}}},u=({calculatedColor:e,isDisabled:t,isOpen:o,styleType:s,hasSelectedValue:d,filterType:n})=>p=>({fontSize:p.globals.typography.fontSize[13],cursor:t?"not-allowed":"pointer",height:"100%",opacity:t?.5:1,transition:"all 150ms linear",color:r({theme:p,isOpen:o,calculatedColor:e,hasSelectedValue:d}),backgroundColor:a({theme:p,isOpen:o,styleType:s,hasSelectedValue:d,calculatedColor:e}),border:`${i} ${l({styleType:s,theme:p,hasSelectedValue:d,filterType:n,calculatedColor:e,isOpen:o})}`,display:"flex",justifyContent:"center",width:"100%","&:hover":{border:`${i} ${l({styleType:s,theme:p,hasSelectedValue:d,filterType:n,calculatedColor:e,isOpen:o,state:"hover"})}`}}),m=e=>o=>{const{isOpen:r,calculatedColor:a,styleType:s,hasSelectedValue:d,filterType:n}=e;return{height:"100%",width:t(1),position:"relative",minWidth:t(1),transition:"all 150ms linear",backgroundColor:l({styleType:s,theme:o,hasSelectedValue:d,filterType:n,calculatedColor:a,isOpen:r,isDivider:!0}),borderTop:`${i} ${l({styleType:s,theme:o,hasSelectedValue:d,filterType:n,calculatedColor:a,isOpen:r})}`,borderBottom:`${i} ${l({styleType:s,theme:o,hasSelectedValue:d,filterType:n,calculatedColor:a,isOpen:r})}`}},y=e=>o=>Object.assign(Object.assign({},u(e)(o)),{borderLeft:"0 !important",paddingLeft:t(4),paddingRight:t(4),display:"flex",alignItems:"center",justifyContent:"center",width:t(34),borderTopRightRadius:o.globals.spacing.get("8"),borderBottomRightRadius:o.globals.spacing.get("8")}),f=e=>t=>{const{filterType:o}=e,l="preset"===o;return Object.assign(Object.assign({},u(e)(t)),{padding:`0 ${l?t.globals.spacing.get("6"):t.globals.spacing.get("3")} 0 ${t.globals.spacing.get("6")}`,borderRadius:t.globals.spacing.get("8"),borderRight:l?void 0:"0 !important",borderTopRightRadius:l?void 0:0,borderBottomRightRadius:l?void 0:0})},v=()=>()=>({lineHeight:t(15),marginLeft:0}),T=(e,t)=>o=>({fontWeight:e||t?o.globals.typography.fontWeight.get("bold"):o.globals.typography.fontWeight.get("regular"),display:"flex",alignItems:"center",div:{flex:"none"},span:{fontWeight:o.globals.typography.fontWeight.get("bold")}}),C=()=>e`
   text-overflow: ellipsis;
   overflow: hidden;
   white-space: nowrap;
   display: inline-block;
-`,w=()=>o=>e`
+`,$=()=>o=>e`
     position: absolute;
     top: ${t(48)};
     min-width: ${t(280)};
@@ -16,4 +16,4 @@ import{css as e}from"@emotion/react";import{rem as t}from"../../theme/utils.js";
     overflow: hidden;
     min-width: 100%;
     max-width: ${t(620)};
-  `;export{u as buttonBaseStyle,g as buttonSpanStyle,f as buttonStyle,b as buttonWrapperStyle,v as childrenWrapperStyle,y as dividedButtonStyle,m as divider,T as labelSpanStyle,w as menuStyle,C as valueSpanStyle,h as wrapperStyle};
+  `;export{u as buttonBaseStyle,g as buttonSpanStyle,f as buttonStyle,b as buttonWrapperStyle,v as childrenWrapperStyle,y as dividedButtonStyle,m as divider,T as labelSpanStyle,$ as menuStyle,C as valueSpanStyle,h as wrapperStyle};

package/dist/components/Filter/components/Options/Options.style.js

@@ -2,6 +2,6 @@ import{css as o}from"@emotion/react";import{flexCenter as t}from"../../../../the
     color: ${i.utils.getColor("lightGrey",750)};
     height: ${e(48)};
     padding: 0 ${e(16)};
-    font-size: ${i.globals.typography.fontSizes.get("3")};
+    font-size: ${i.globals.typography.fontSize.get("3")};
     ${t};
   `;export{i as emptyStyle};

package/dist/components/Filter/components/SearchInput/SearchInput.js

@@ -1 +1 @@
-import{jsxs as o,jsx as e}from"@emotion/react/jsx-runtime";import t from"../../../../hooks/useTheme.js";import{useMemo as r}from"react";import{generateTestDataId as i}from"../../../../utils/helpers.js";import s from"../../../Icon/Icon.js";import a from"../../../Loader/Loader.js";import l from"../../../TextField/TextField.js";import{iconWrapper as d,textFieldWrapper as m}from"./SearchInput.style.js";const n=({onChange:n,value:c,dataTestId:p,isLoading:u})=>{const h=t(),f=r((()=>o("div",Object.assign({css:d()},{children:[u&&e(a,{},void 0),e(s,{size:20,name:"search",color:h.utils.getColor("lightGrey",650)},void 0)]}),void 0)),[h.utils,u]);return e("div",Object.assign({css:m()(h)},{children:e(l,{autoFocus:!0,styleType:"filled",onChange:n,"data-testid":i("filter-input",p),status:"normal",placeholder:"Search",value:c,rightIcon:f},void 0)}),void 0)};export{n as default};
+import{jsxs as o,jsx as e}from"@emotion/react/jsx-runtime";import t from"../../../../hooks/useTheme.js";import{useMemo as r}from"react";import{generateTestDataId as i}from"../../../../utils/helpers.js";import{iconWrapper as s,textFieldWrapper as a}from"./SearchInput.style.js";import l from"../../../Icon/Icon.js";import d from"../../../Loader/Loader.js";import m from"../../../TextField/TextField.js";const n=({onChange:n,value:c,dataTestId:p,isLoading:u})=>{const h=t(),f=r((()=>o("div",Object.assign({css:s()},{children:[u&&e(d,{},void 0),e(l,{size:20,name:"search",color:h.utils.getColor("lightGrey",650)},void 0)]}),void 0)),[h.utils,u]);return e("div",Object.assign({css:a()(h)},{children:e(m,{autoFocus:!0,styleType:"filled",onChange:n,"data-testid":i("filter-input",p),status:"normal",placeholder:"Search",value:c,rightIcon:f},void 0)}),void 0)};export{n as default};

package/dist/components/IconButton/IconButton.js

@@ -1 +1 @@
-import{jsx as o}from"@emotion/react/jsx-runtime";import r from"react";import{useTypeColorToColorMatch as t}from"../../hooks/useTypeColorToColorMatch.js";import{defineBackgroundColor as e}from"../Button/utils.js";import s from"../Icon/Icon.js";import{sxProp as i}from"./IconButton.style.js";import m from"../ButtonBase/ButtonBase.js";import n from"../../hooks/useTheme.js";const a=r.forwardRef(((r,a)=>{const{iconSize:c,color:l="",type:p="primary",isFilled:f=!0,name:u,isTransparent:d}=r,j=n(),{calculateColorBetweenColorAndType:B}=t(),h=B(l,p),y=f&&!d?j.utils.getAAColorFromSwatches(h.color,h.shade):e(j,h,p,!0,!0),T=i({size:r.size});return o(m,Object.assign({},r,{ref:a,sx:T,dataTestPrefixId:"icon-"},{children:o(s,{name:u,color:y,size:c},void 0)}),void 0)}));a.displayName="IconButton";export{a as default};
+import{jsx as o}from"@emotion/react/jsx-runtime";import t from"../../hooks/useTheme.js";import r from"react";import e from"../Button/Button.tokens.js";import n from"../Icon/Icon.js";import s from"../ButtonBase/ButtonBase.js";const i=r.forwardRef(((r,i)=>{const{name:a,type:m="primary",shape:c="circle",dataTestPrefixId:f}=r,p=t(),d=e(p).color[m].textColor;return o(s,Object.assign({},r,{ref:i,isIconButton:!0,shape:c,dataTestPrefixId:f?`${f}-icon-`:"icon-"},{children:o(n,{name:a,color:d},void 0)}),void 0)}));i.displayName="IconButton";export{i as default};

package/dist/components/Label/Label.style.js

@@ -1,17 +1,17 @@
-import{css as t}from"@emotion/react";import{BASE_SHADE as o}from"../../theme/palette.js";import{rem as e}from"../../theme/utils.js";const r=e(3),s=({isAnimated:e,hasError:s})=>a=>t`
+import{css as t}from"@emotion/react";import{BASE_SHADE as o}from"../../theme/palette.js";import{rem as e}from"../../theme/utils.js";const r=e(3),a=({isAnimated:e,hasError:a})=>i=>t`
       transition: transform 0.25s, opacity 0.25s ease-in-out;
       transform-origin: 0 0;
       width: 100%;
       position: absolute;
       user-select: none;
       transform: ${e?`translate(${r}, -95%) scale(0.8);`:`translate(${r}, 0)`};
-      font-size: ${a.globals.typography.fontSizes.get("4")};
-      font-weight: ${a.globals.typography.weights.get("regular")};
-      color: ${s?a.utils.getColor("error",o,"normal"):a.utils.getColor("lightGrey",650)};
+      font-size: ${i.globals.typography.fontSize.get("4")};
+      font-weight: ${i.globals.typography.fontWeight.get("regular")};
+      color: ${a?i.utils.getColor("error",o,"normal"):i.utils.getColor("lightGrey",650)};
       align-items: center;
       display: flex;
       top: 0;
       bottom: 0;
       margin: auto;
       white-space: nowrap;
-    `;export{r as LABEL_TRANSFORM_LEFT_SPACING,s as labelStyle};
+    `;export{r as LABEL_TRANSFORM_LEFT_SPACING,a as labelStyle};

package/dist/components/List/List.style.js

@@ -1,14 +1,25 @@
-import{css as i}from"@emotion/react";import{rem as t}from"../../theme/utils.js";const o=({width:t,isSearchable:o})=>e=>i`
-      border: ${o?"initial":`1px solid ${e.utils.getColor("lightGrey",100)}`};
-      border-radius: ${o?"initial":e.globals.spacing.get("3")};
+import{css as i}from"@emotion/react";import{rem as t}from"../../theme/utils.js";const o=({width:t,isSearchable:o})=>r=>i`
+      border: ${o?"initial":`1px solid ${r.utils.getColor("lightGrey",100)}`};
+      border-radius: ${o?"initial":r.globals.spacing.get("3")};
       width: ${`${t}px`||"100%"};
-    `,e=({width:o,height:e,isSearchable:r})=>a=>i`
+    `,r=i`
+  display: flex;
+  flex-direction: column;
+  cursor: inherit;
+`,e=i`
+  cursor: inherit;
+`,l=({width:o,height:r,isSearchable:e})=>l=>i`
       padding-left: 0;
       margin-top: 0;
       margin-bottom: 0;
-      border-radius: ${r?"initial":a.globals.spacing.get("3")};
+      border-radius: ${e?"initial":l.globals.spacing.get("3")};
       width: ${o?t(o):"100%"};
-      height: ${e?t(e):"100%"};
+      height: ${r?t(r):"100%"};
       overflow: auto;
       overflow-x: hidden;
-    `;export{e as listStyle,o as wrapperStyle};
+    `,a=t=>i`
+  font-size: ${t.globals.typography.fontSize.get("1")};
+  font-weight: ${t.globals.typography.fontWeight.get("regular")};
+  color: ${t.utils.getColor("lightGrey",650)};
+  cursor: inherit;
+`;export{e as listLabel,a as listLabelHelperText,r as listLabelWithHelper,l as listStyle,o as wrapperStyle};

package/dist/components/List/ListItem/ListItem.js

@@ -1 +1 @@
-import{jsx as e}from"@emotion/react/jsx-runtime";import i,{useCallback as t}from"react";import{renderContent as s}from"../utils.js";import{listItemStyle as o,contentStyle as r}from"./ListItem.style.js";const d=i.forwardRef((({size:i,content:d,index:l,isSelected:n=!1,isHighlighted:a=!1,isDisabled:c=!1,handleOptionClick:m,searchTerm:u,dataTestId:p,isGroupItem:f},h)=>{const g=t((()=>{d&&m&&!c&&m(d)}),[d,c,m]);return e("div",Object.assign({css:o({size:i,isSelected:n,isHighlighted:a,isDisabled:c,isGroupItem:f}),ref:n?h:null,onClick:g,onMouseDown:e=>{e.preventDefault()},"data-testid":null!=p?p:"ictinus_list_item_"+l},{children:e("div",Object.assign({css:r()},{children:s(d,u)}),void 0)}),void 0)}));d.displayName="ListItem";export{d as default};
+import{jsx as e}from"@emotion/react/jsx-runtime";import i,{useCallback as t}from"react";import{listItemStyle as s,contentStyle as o}from"./ListItem.style.js";import{renderContent as r}from"../utils.js";const d=i.forwardRef((({size:i,content:d,index:l,isSelected:n=!1,isHighlighted:a=!1,isDisabled:c=!1,handleOptionClick:m,searchTerm:u,dataTestId:p,isGroupItem:f},h)=>{const g=t((()=>{d&&m&&!c&&m(d)}),[d,c,m]);return e("div",Object.assign({css:s({size:i,isSelected:n,isHighlighted:a,isDisabled:c,isGroupItem:f}),ref:n?h:null,onClick:g,onMouseDown:e=>{e.preventDefault()},"data-testid":null!=p?p:"ictinus_list_item_"+l},{children:e("div",Object.assign({css:o()},{children:r(d,u)}),void 0)}),void 0)}));d.displayName="ListItem";export{d as default};

package/dist/components/List/ListItem/ListItem.style.js

@@ -1,12 +1,12 @@
-import{css as o}from"@emotion/react";import{rem as e}from"../../../theme/utils.js";const i=({size:i,isSelected:t,isHighlighted:l,isDisabled:r,isGroupItem:s})=>g=>o`
-      height: ${e("normal"===i?56:46)};
-      font-size: ${g.globals.typography.fontSizes.get("normal"===i?"4":"3")};
-      background-color: ${t?g.utils.getColor("blue",50):g.globals.colors.white};
+import{css as o}from"@emotion/react";import{rem as e}from"../../../theme/utils.js";const t=({size:t,isSelected:i,isHighlighted:l,isDisabled:r,isGroupItem:s})=>g=>o`
+      height: ${e("normal"===t?56:46)};
+      font-size: ${g.globals.typography.fontSize.get("normal"===t?"4":"3")};
+      background-color: ${i?g.utils.getColor("blue",50):g.globals.colors.white};
       display: flex;
       align-items: center;
       padding: 0px ${g.globals.spacing.get("6")} 0px
         ${s?g.globals.spacing.get("9"):g.globals.spacing.get("6")};
-      font-weight: ${t&&g.globals.typography.weights.get("medium")};
+      font-weight: ${i&&g.globals.typography.fontWeight.get("medium")};
       cursor: pointer;
 
       ${l&&"font-weight: 500;"}
@@ -16,7 +16,7 @@ import{css as o}from"@emotion/react";import{rem as e}from"../../../theme/utils.j
       }
 
       ${r&&"\n        opacity: 0.5;\n        cursor: not-allowed;\n    "}
-    `,t=()=>o`
+    `,i=()=>o`
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
@@ -27,4 +27,4 @@ import{css as o}from"@emotion/react";import{rem as e}from"../../../theme/utils.j
   > div {
     flex: 1;
   }
-`;export{t as contentStyle,i as listItemStyle};
+`;export{i as contentStyle,t as listItemStyle};

package/dist/components/List/ListItemGroup/ListGroupTitle/ListGroupTitle.style.js

@@ -1,16 +1,16 @@
-import{css as o}from"@emotion/react";import{rem as e}from"../../../../theme/utils.js";const t=({size:t,isDisabled:l})=>i=>o`
-      height: ${e("normal"===t?56:46)};
-      font-size: ${i.globals.typography.fontSizes["normal"===t?"13":"11"]};
+import{css as o}from"@emotion/react";import{rem as t}from"../../../../theme/utils.js";const e=({size:e,isDisabled:l})=>i=>o`
+      height: ${t("normal"===e?56:46)};
+      font-size: ${i.globals.typography.fontSize["normal"===e?"13":"11"]};
       background-color: ${i.globals.colors.white};
       color: ${i.utils.getColor("lightGrey",650)};
       display: flex;
       align-items: center;
       padding: 0px ${i.globals.spacing.get("6")};
-      font-weight: ${i.globals.typography.weights.get("bold")};
+      font-weight: ${i.globals.typography.fontWeight.get("bold")};
 
       ${l&&"\n        opacity: 0.5;\n        cursor: not-allowed;\n    "}
     `,l=()=>o`
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
-`;export{l as contentStyle,t as listGroupTitleStyle};
+`;export{l as contentStyle,e as listGroupTitleStyle};

package/dist/components/List/ListItemGroup/ListItemGroup.js

@@ -1 +1 @@
-import{jsxs as e,jsx as t}from"@emotion/react/jsx-runtime";import i from"react";import{generateUniqueID as s}from"../../../utils/helpers.js";import{listStyle as r}from"../List.style.js";import o from"../ListItem/ListItem.js";import{isSelected as d}from"../utils.js";import m from"./ListGroupTitle/ListGroupTitle.js";const l=i.forwardRef((({size:i,content:l,groupIndex:n,selectedItem:a,searchTerm:c,handleOptionClick:p,dataTestId:u},f)=>{var I;return e("li",{children:[t(m,{content:l,size:i,index:n,searchTerm:c,dataTestId:u},void 0),t("ul",Object.assign({css:r({})},{children:null===(I=l.options)||void 0===I?void 0:I.map(((e,r)=>t("li",{children:t(o,{content:e,size:i,index:""+n+r,ref:f,searchTerm:c,isDisabled:null==e?void 0:e.isDisabled,dataTestId:u,handleOptionClick:p,isSelected:d({item:e,selectedItem:a}),isGroupItem:!0},void 0)},s("list_item"+n+r))))}),void 0)]},void 0)}));l.displayName="ListItemGroup";export{l as default};
+import{jsxs as e,jsx as t}from"@emotion/react/jsx-runtime";import i from"react";import{generateUniqueID as s}from"../../../utils/helpers.js";import r from"./ListGroupTitle/ListGroupTitle.js";import{listStyle as o}from"../List.style.js";import d from"../ListItem/ListItem.js";import{isSelected as m}from"../utils.js";const l=i.forwardRef((({size:i,content:l,groupIndex:n,selectedItem:a,searchTerm:c,handleOptionClick:p,dataTestId:u},f)=>{var I;return e("li",{children:[t(r,{content:l,size:i,index:n,searchTerm:c,dataTestId:u},void 0),t("ul",Object.assign({css:o({})},{children:null===(I=l.options)||void 0===I?void 0:I.map(((e,r)=>t("li",{children:t(d,{content:e,size:i,index:""+n+r,ref:f,searchTerm:c,isDisabled:null==e?void 0:e.isDisabled,dataTestId:u,handleOptionClick:p,isSelected:m({item:e,selectedItem:a}),isGroupItem:!0},void 0)},s("list_item"+n+r))))}),void 0)]},void 0)}));l.displayName="ListItemGroup";export{l as default};

package/dist/components/List/utils.js

@@ -1 +1 @@
-import{jsx as e,jsxs as i,Fragment as t}from"@emotion/react/jsx-runtime";import o from"react";import r from"react-highlight-words";import l from"../Icon/Icon.js";const a=6,n=5,s=277,c=265,m=({item:e,selectedItem:i})=>{if(e&&o.isValidElement(e))return!1;const t=e=>e&&!o.isValidElement(e)&&"object"==typeof e&&!Array.isArray(e)&&"value"in e&&(null==e?void 0:e.value)?e.value:e;return("string"==typeof e||"number"==typeof e?e:t(e))===("string"==typeof i||"number"==typeof i?i:t(i))},d=(a,n)=>n&&a&&!o.isValidElement(a)&&"object"==typeof a&&!Array.isArray(a)&&"label"in a&&(null==a?void 0:a.label)?e(r,{highlightClassName:"search-text",highlightTag:"strong",searchWords:[n],autoEscape:!0,textToHighlight:a.label},void 0):a&&!o.isValidElement(a)&&"object"==typeof a&&!Array.isArray(a)&&"label"in a&&(null==a?void 0:a.label)?i(t,{children:[e("div",{children:a.label},void 0)," ",(null==a?void 0:a.iconProps)&&e(l,Object.assign({},a.iconProps),void 0)]},void 0):a;export{s as MAX_LARGE_HEIGHT,a as MAX_NON_VIRTUALIZED_ITEMS_FILTER,n as MAX_NON_VIRTUALIZED_ITEMS_SELECT,c as MAX_SMALL_HEIGHT,m as isSelected,d as renderContent};
+import{jsx as e,jsxs as i,Fragment as l}from"@emotion/react/jsx-runtime";import t from"react";import r from"react-highlight-words";import{listLabel as o,listLabelWithHelper as s,listLabelHelperText as n}from"./List.style.js";import a from"../Icon/Icon.js";const c=6,d=5,m=277,h=265,b=({item:e,selectedItem:i})=>{if(e&&t.isValidElement(e))return!1;const l=e=>e&&!t.isValidElement(e)&&"object"==typeof e&&!Array.isArray(e)&&"value"in e&&(null==e?void 0:e.value)?e.value:e;return("string"==typeof e||"number"==typeof e?e:l(e))===("string"==typeof i||"number"==typeof i?i:l(i))},p=l=>l&&!t.isValidElement(l)&&"object"==typeof l&&!Array.isArray(l)&&"label"in l&&(null==l?void 0:l.label)&&"helperText"in l&&(null==l?void 0:l.helperText)?i("div",Object.assign({css:s},{children:[e("div",Object.assign({css:o},{children:l.label}),void 0),e("div",Object.assign({css:n},{children:l.helperText}),void 0)]}),void 0):l.label,v=(s,n)=>n&&s&&!t.isValidElement(s)&&"object"==typeof s&&!Array.isArray(s)&&"label"in s&&(null==s?void 0:s.label)?e(r,{highlightClassName:"search-text",highlightTag:"strong",searchWords:[n],autoEscape:!0,textToHighlight:s.label},void 0):s&&!t.isValidElement(s)&&"object"==typeof s&&!Array.isArray(s)&&"label"in s&&(null==s?void 0:s.label)?i(l,{children:[e("div",Object.assign({css:o},{children:p(s)}),void 0),(null==s?void 0:s.iconProps)&&e(a,Object.assign({},s.iconProps),void 0)]},void 0):s;export{m as MAX_LARGE_HEIGHT,c as MAX_NON_VIRTUALIZED_ITEMS_FILTER,d as MAX_NON_VIRTUALIZED_ITEMS_SELECT,h as MAX_SMALL_HEIGHT,b as isSelected,v as renderContent};

package/dist/components/Loader/components/Spinner/Spinner.js

@@ -1 +1 @@
-import{jsx as t}from"@emotion/react/jsx-runtime";import{generateTestDataId as o}from"../../../../utils/helpers.js";import{spinnerContainer as r}from"./Spinner.style.js";const s=({dataTestId:s,color:e})=>t("div",{"data-testid":o("spinner",s),css:r(e)},void 0);export{s as default};
+import{jsx as t}from"@emotion/react/jsx-runtime";import{spinnerContainer as o}from"./Spinner.style.js";import{generateTestDataId as r}from"../../../../utils/helpers.js";const s=({dataTestId:s,color:e})=>t("div",{"data-testid":r("spinner",s),css:o(e)},void 0);export{s as default};

package/dist/components/Menu/Menu.js

@@ -1 +1 @@
-import{jsx as o,jsxs as i}from"@emotion/react/jsx-runtime";import t from"../../hooks/useTheme.js";import{useTypeColorToColorMatch as e}from"../../hooks/useTypeColorToColorMatch.js";import s from"lodash/isEmpty.js";import*as r from"react";import l from"../Button/Button.js";import{defineBackgroundColor as n}from"../Button/utils.js";import c from"../Icon/Icon.js";import a from"../utils/ClickAwayListener/ClickAwayListener.js";import{optionsStyle as m}from"../utils/DropdownOptions/index.js";import{wrapperStyle as d}from"./Menu.style.js";import p from"../Avatar/Avatar.js";import u from"../List/List.js";const f=f=>{const{items:j,onSelect:v,color:h="",size:C="md",buttonText:b="More",menuPosition:y="left",buttonType:g="primary",rightIconName:k,isFilled:z=!0,isDisabled:A=!1,leftIconName:O,iconSize:T=16,avatar:w,dataTestId:I}=f,[L,S]=r.useState(!1),x=t(),{calculateColorBetweenColorAndType:B}=e(),D=B(h,g),F=z?x.utils.getAAColorFromSwatches(D.color,D.shade):n(x,D,g,!0,!0);return o(a,Object.assign({onClick:()=>S(!1)},{children:i("div",Object.assign({css:d(),"data-testid":I},{children:[o(l,Object.assign({size:C,onClick:()=>S(!L),type:g,color:h,isDisabled:A,isFilled:z,iconRight:k?o(c,{name:k,color:F,size:T},void 0):null,iconLeft:s(w)?O?o(c,{name:O,color:F,size:T},void 0):null:o(p,Object.assign({size:1,src:null==w?void 0:w.src,color:null==w?void 0:w.color},{children:null==w?void 0:w.letter}),void 0)},{children:o("span",{children:b},void 0)}),void 0),L&&o("div",Object.assign({css:m({menuPosition:y})(x)},{children:j&&o(u,{data:j,rowSize:"small",handleOptionClick:o=>{S(!1),v(o)}},void 0)}),void 0)]}),void 0)}),void 0)};export{f as default};
+import{jsx as t,jsxs as i}from"@emotion/react/jsx-runtime";import o from"../../hooks/useTheme.js";import e from"lodash/isEmpty.js";import*as s from"react";import{wrapperStyle as r}from"./Menu.style.js";import n from"../Button/Button.js";import a from"../utils/ClickAwayListener/ClickAwayListener.js";import{optionsStyle as m}from"../utils/DropdownOptions/index.js";import l from"../List/List.js";const d=d=>{const{items:c,onSelect:p,buttonText:u="More",menuPosition:f="left",buttonType:v="primary",rightIconName:j,isDisabled:h=!1,leftIconName:b,avatar:y,dataTestId:g}=d,[k,O]=s.useState(!1),C=o();return t(a,Object.assign({onClick:()=>O(!1)},{children:i("div",Object.assign({css:r(),"data-testid":g},{children:[t(n,Object.assign({type:v,onClick:()=>O(!k),isDisabled:h,iconRightName:j,iconLeftName:b,avatar:e(y)?void 0:{src:null==y?void 0:y.src,label:null==y?void 0:y.letter}},{children:t("span",{children:u},void 0)}),void 0),k&&t("div",Object.assign({css:m({menuPosition:f})(C)},{children:c&&t(l,{data:c,rowSize:"small",handleOptionClick:t=>{O(!1),p(t)}},void 0)}),void 0)]}),void 0)}),void 0)};export{d as default};

package/dist/components/Modal/Modal.js

@@ -1 +1 @@
-import{jsx as o,jsxs as e}from"@emotion/react/jsx-runtime";import{useEffect as s}from"react";import t from"../../hooks/useEscape.js";import{generateTestDataId as i}from"../../utils/helpers.js";import d from"../Card/Card.js";import n from"../IconButton/IconButton.js";import r from"../utils/ClickAwayListener/ClickAwayListener.js";import{backgroundContainer as a,cardSizing as c,closeContainer as l,modalContainer as m}from"./Modal.style.js";import j from"./ModalContent/ModalContent.js";const p=({isOpen:p=!1,onClose:v,dataTestId:f,children:u,contentProps:h,isContentPadded:C=!0})=>(t((()=>{v()})),s((()=>(p&&(document.body.style.overflow="hidden"),()=>{document.body.style.overflow="unset"})),[p]),p?o("div",Object.assign({css:a,"data-testid":i("modal-container",f)},{children:o(r,Object.assign({onClick:v},{children:o("div",Object.assign({css:c},{children:e(d,Object.assign({elevated:"02",radius:"3"},{children:[o("div",Object.assign({css:l},{children:o(n,{name:"close",isFilled:!1,isTransparent:!0,color:"lightGrey-650",size:"sm",onClick:v,dataTestId:"modal-close"},void 0)}),void 0),o("div",Object.assign({css:m({isContentPadded:C})},{children:h?o(j,Object.assign({},h),void 0):u}),void 0)]}),void 0)}),void 0)}),void 0)}),void 0):null);export{p as default};
+import{jsx as o,jsxs as t}from"@emotion/react/jsx-runtime";import{useEffect as e}from"react";import{backgroundContainer as s,cardSizing as i,closeContainer as d,modalContainer as n}from"./Modal.style.js";import r from"./ModalContent/ModalContent.js";import a from"../../hooks/useEscape.js";import{generateTestDataId as c}from"../../utils/helpers.js";import l from"../Card/Card.js";import m from"../IconButton/IconButton.js";import j from"../utils/ClickAwayListener/ClickAwayListener.js";const p=({isOpen:p=!1,onClose:v,dataTestId:f,children:u,contentProps:C,isContentPadded:h=!0})=>(a((()=>{v()})),e((()=>(p&&(document.body.style.overflow="hidden"),()=>{document.body.style.overflow="unset"})),[p]),p?o("div",Object.assign({css:s,"data-testid":c("modal-container",f)},{children:o(j,Object.assign({onClick:v},{children:o("div",Object.assign({css:i},{children:t(l,Object.assign({elevated:"02",radius:"3"},{children:[o("div",Object.assign({css:d},{children:o(m,{type:"tertiary",name:"close",onClick:v,dataTestId:"modal-close"},void 0)}),void 0),o("div",Object.assign({css:n({isContentPadded:h})},{children:C?o(r,Object.assign({},C),void 0):u}),void 0)]}),void 0)}),void 0)}),void 0)}),void 0):null);export{p as default};

package/dist/components/Modal/ModalContent/ModalContent.js

@@ -1 +1 @@
-import{jsxs as e,jsx as t}from"@emotion/react/jsx-runtime";import{generateTestDataId as s}from"../../../utils/helpers.js";import a from"../../Button/Button.js";import{modalContentContainer as i,labelContainer as o,headingContainer as d,messageContainer as n,actionsContainer as r}from"./ModalContent.style.js";const c=({label:c,heading:l,message:m,primaryCTA:p,primaryCTALabel:g,secondaryCTA:h,secondaryCTALabel:j,dataTestId:y})=>e("div",Object.assign({role:"dialog",css:i,"data-testid":s("modal-content",y)},{children:[Boolean(c)&&t("p",Object.assign({css:o},{children:c}),void 0),t("h5",Object.assign({css:d,"data-testid":s("modal-content-header",y)},{children:l}),void 0),t("p",Object.assign({css:n,"data-testid":s("modal-content-message",y)},{children:m}),void 0),e("div",Object.assign({css:r},{children:[Boolean(h&&j)&&t(a,Object.assign({type:"primary",isFilled:!1,onClick:h,size:"md",dataTestId:"modal-content-secondaryCTA",isTransparent:!0},{children:j}),void 0),Boolean(p&&g)&&t(a,Object.assign({type:"primary",onClick:p,size:"md",dataTestId:"modal-content-primaryCTA"},{children:g}),void 0)]}),void 0)]}),void 0);export{c as default};
+import{jsxs as e,jsx as t}from"@emotion/react/jsx-runtime";import{modalContentContainer as o,labelContainer as s,headingContainer as a,messageContainer as d,actionsContainer as i}from"./ModalContent.style.js";import{generateTestDataId as n}from"../../../utils/helpers.js";import c from"../../Button/Button.js";const r=({label:r,heading:l,message:m,primaryCTA:g,primaryCTALabel:h,secondaryCTA:j,secondaryCTALabel:p,dataTestId:b})=>e("div",Object.assign({role:"dialog",css:o,"data-testid":n("modal-content",b)},{children:[Boolean(r)&&t("p",Object.assign({css:s},{children:r}),void 0),t("h5",Object.assign({css:a,"data-testid":n("modal-content-header",b)},{children:l}),void 0),t("p",Object.assign({css:d,"data-testid":n("modal-content-message",b)},{children:m}),void 0),e("div",Object.assign({css:i},{children:[Boolean(j&&p)&&t(c,Object.assign({onClick:j,dataTestId:"modal-content-secondaryCTA"},{children:p}),void 0),Boolean(g&&h)&&t(c,Object.assign({onClick:g,dataTestId:"modal-content-primaryCTA"},{children:h}),void 0)]}),void 0)]}),void 0);export{r as default};

package/dist/components/Modal/ModalContent/ModalContent.style.js

@@ -6,17 +6,17 @@ import{css as t}from"@emotion/react";import{rem as o}from"../../../theme/utils.j
   flex-wrap: wrap;
   text-align: left;
   color: ${o.utils.getColor("lightGrey",700,"flat")};
-  font-weight: ${o.globals.typography.weights.get("regular")};
+  font-weight: ${o.globals.typography.fontWeight.get("regular")};
 `,l=o=>t`
-  font-size: ${o.globals.typography.fontSizes.get("3")};
+  font-size: ${o.globals.typography.fontSize.get("3")};
   margin: 0 0 ${o.globals.spacing.get("3")} 0;
 `,g=o=>t`
-  font-size: ${o.globals.typography.fontSizes.get("9")};
+  font-size: ${o.globals.typography.fontSize.get("9")};
   color: ${o.utils.getColor("darkGrey",850)};
-  font-weight: ${o.globals.typography.weights.get("medium")};
+  font-weight: ${o.globals.typography.fontWeight.get("medium")};
   margin: 0 0 ${o.globals.spacing.get("9")} 0;
 `,i=e=>t`
-  font-size: ${e.globals.typography.fontSizes.get("4")};
+  font-size: ${e.globals.typography.fontSize.get("4")};
   color: ${e.utils.getColor("lightGrey",750)};
   max-height: ${o(430)};
   overflow-y: hidden;

package/dist/components/Notification/Notification.style.js

@@ -1,16 +1,16 @@
-import{css as o}from"@emotion/react";import{tint as t}from"polished";import{rem as i}from"../../theme/utils.js";const e=(o,t)=>o.utils.getColor(t,550,"normal"),n=(n,l,r)=>o`
-  border: ${i(1)} solid ${r.utils.getColor(n,100,"normal")};
+import{css as o}from"@emotion/react";import{tint as t}from"polished";import{rem as i}from"../../theme/utils.js";const n=(o,t)=>o.utils.getColor(t,550,"normal"),e=(e,l,r)=>o`
+  border: ${i(1)} solid ${r.utils.getColor(e,100,"normal")};
 
   &[notification-type='banner'] {
     box-shadow: ${r.globals.elevation["02"]};
   }
 
-  ${"outlined"===l?`\n        border: ${i(2)} solid ${e(r,n)};\n        background: white;\n      `:`\n        background: ${t(.95,e(r,n))};\n`}
+  ${"outlined"===l?`\n        border: ${i(2)} solid ${n(r,e)};\n        background: white;\n      `:`\n        background: ${t(.95,n(r,e))};\n`}
 `,l=()=>t=>o`
       display: flex;
       flex-direction: row;
       justify-content: flex-end;
-      margin-top: ${t.globals.spacing.get("6")};
+      padding-top: ${t.globals.spacing.get("6")};
       position: sticky;
       bottom: ${t.globals.spacing.get("6")};
       top: 100%;
@@ -19,6 +19,6 @@ import{css as o}from"@emotion/react";import{tint as t}from"polished";import{rem
       margin-left: ${t.globals.spacing.get("6")};
     `,g=()=>t=>o`
       padding-right: ${t.globals.spacing.get("4")};
-    `,s=()=>t=>o`
-      font-weight: ${t.globals.typography.weights.get("bold")};
-    `;export{r as actionContainer,l as actionsContainer,s as boldMessageContainer,g as iconContainer,n as notificationsContainerPerType,e as typeToThemePalette};
+    `,a=()=>t=>o`
+      font-weight: ${t.globals.typography.fontWeight.get("bold")};
+    `;export{r as actionContainer,l as actionsContainer,a as boldMessageContainer,g as iconContainer,e as notificationsContainerPerType,n as typeToThemePalette};

package/dist/components/Notification/NotificationVisual/NotificationVisual.js

@@ -1 +1 @@
-import{jsxs as i,jsx as s}from"@emotion/react/jsx-runtime";import{generateTestDataId as t}from"../../../utils/helpers.js";import e from"../../Button/Button.js";import{boldMessageContainer as n,actionsContainer as r,actionContainer as a}from"../Notification.style.js";import{visualContainer as o,descriptionContainer as c}from"./NotificationVisual.style.js";const d=({title:d,primaryCTALabel:l="OK",primaryCTA:m,secondaryCTALabel:v="Cancel",secondaryCTA:p,description:j,dataTestId:b})=>i("div",Object.assign({css:o()},{children:[s("div",Object.assign({css:n()},{children:d}),void 0),s("div",Object.assign({css:c()},{children:j}),void 0),i("div",Object.assign({css:r()},{children:[s("div",Object.assign({css:a(),"data-testid":t("visual-secondary",b)},{children:s(e,Object.assign({type:"link",isTransparent:!0,size:"sm",onClick:p},{children:v}),void 0)}),void 0),s("div",Object.assign({css:a(),"data-testid":t("visual-primary",b)},{children:s(e,Object.assign({type:"link",isTransparent:!0,size:"sm",onClick:m},{children:l}),void 0)}),void 0)]}),void 0)]}),void 0);export{d as default};
+import{jsxs as i,jsx as t}from"@emotion/react/jsx-runtime";import{visualContainer as s,descriptionContainer as a}from"./NotificationVisual.style.js";import{generateTestDataId as e}from"../../../utils/helpers.js";import{boldMessageContainer as o}from"../Notification.style.js";import r from"../subcomponents/NotificationActionsArea/NotificationActionsArea.js";const d=({title:d,primaryCTALabel:c="OK",primaryCTA:n,secondaryCTALabel:l="Cancel",secondaryCTA:m,description:p,dataTestId:A})=>{const f=n&&c||m&&l;return i("div",Object.assign({css:s()},{children:[t("div",Object.assign({css:o(),"data-testid":e("visual-title",A)},{children:d}),void 0),t("div",Object.assign({css:a(),"data-testid":e("visual-description",A)},{children:p}),void 0),f&&t(r,{primaryCTA:n,primaryCTALabel:c,secondaryCTA:m,secondaryCTALabel:l,dataTestPrefixId:"visual",dataTestId:A},void 0)]}),void 0)};export{d as default};

package/dist/components/Notification/NotificationVisual/NotificationVisual.style.js

@@ -1,8 +1,8 @@
-import{css as t}from"@emotion/react";import{rem as o}from"../../../theme/utils.js";const i=()=>o=>t`
-      margin: ${o.globals.spacing.get("6")};
-    `,a=()=>i=>t`
-      margin-top: ${i.globals.spacing.get("4")};
-      max-height: ${o(180)};
+import{css as o}from"@emotion/react";import{rem as t}from"../../../theme/utils.js";const i=()=>t=>o`
+        padding: ${t.globals.spacing.get("6")};
+      `,a=()=>i=>o`
+      padding-top: ${i.globals.spacing.get("4")};
+      max-height: ${t(180)};
       overflow: auto;
-      max-width: fit-content;
+      width: ${t(547)};
     `;export{a as descriptionContainer,i as visualContainer};

package/dist/components/Notification/Snackbar/Snackbar.js

@@ -1 +1 @@
-import{jsxs as s,jsx as i}from"@emotion/react/jsx-runtime";import e from"../../../hooks/useTheme.js";import{generateTestDataId as o}from"../../../utils/helpers.js";import t from"../../Button/Button.js";import{iconContainer as c,boldMessageContainer as n,actionContainer as a,actionsContainer as r}from"../Notification.style.js";import{typeToIconName as d}from"../subcomponents/CompactNotification/CompactNotification.js";import{cardContainer as l,topContainer as m,infoContainer as p,descriptionContainer as v}from"./Snackbar.style.js";import b from"../../Icon/Icon.js";const j=({message:j,type:h,styleType:g="elevated",primaryCTALabel:y="OK",primaryCTA:f,secondaryCTALabel:O="Cancel",secondaryCTA:C,description:k,closeCTA:T,dataTestId:u})=>{const{utils:A}=e();return s("div",Object.assign({css:l(h,g),"notification-type":"snackbar"},{children:[s("div",Object.assign({css:m()},{children:[s("div",Object.assign({css:p()},{children:[i("div",Object.assign({css:c()},{children:i(b,{name:d(h),color:h,size:20},void 0)}),void 0),i("div",Object.assign({css:n()},{children:j}),void 0)]}),void 0),i("span",Object.assign({css:a(),onClick:T,"data-testid":o("snackbar-close",u)},{children:i(b,{name:"close",color:A.getColor("lightGrey",650),size:20},void 0)}),void 0)]}),void 0),i("div",Object.assign({css:v()},{children:k}),void 0),s("div",Object.assign({css:r()},{children:[i("div",Object.assign({css:a(),"data-testid":o("snackbar-secondary",u)},{children:i(t,Object.assign({type:"link",isTransparent:!0,size:"sm",onClick:C},{children:O}),void 0)}),void 0),i("div",Object.assign({css:a(),"data-testid":o("snackbar-primary",u)},{children:i(t,Object.assign({type:"link",isTransparent:!0,size:"sm",onClick:f},{children:y}),void 0)}),void 0)]}),void 0)]}),void 0)};export{j as default};
+import{jsxs as i,jsx as s}from"@emotion/react/jsx-runtime";import{cardContainer as o,topContainer as e,infoContainer as t,descriptionContainer as a}from"./Snackbar.style.js";import c from"../../../hooks/useTheme.js";import{generateTestDataId as r}from"../../../utils/helpers.js";import{iconContainer as n,boldMessageContainer as d,actionContainer as m}from"../Notification.style.js";import{typeToIconName as l}from"../subcomponents/CompactNotification/CompactNotification.js";import p from"../subcomponents/NotificationActionsArea/NotificationActionsArea.js";import b from"../../Icon/Icon.js";const v=({message:v,type:f,styleType:j="elevated",primaryCTALabel:y="OK",primaryCTA:C,secondaryCTALabel:T="Cancel",secondaryCTA:A,description:h,closeCTA:g,dataTestId:u})=>{const{utils:O}=c(),k=C&&y||A&&T;return i("div",Object.assign({css:o(f,j),"notification-type":"snackbar"},{children:[i("div",Object.assign({css:e()},{children:[i("div",Object.assign({css:t()},{children:[s("div",Object.assign({css:n()},{children:s(b,{name:l(f),color:f,size:20},void 0)}),void 0),s("div",Object.assign({css:d()},{children:v}),void 0)]}),void 0),s("span",Object.assign({css:m(),onClick:g,"data-testid":r("snackbar-close",u)},{children:s(b,{name:"close",color:O.getColor("lightGrey",650),size:20},void 0)}),void 0)]}),void 0),s("div",Object.assign({css:a(),"data-testid":r("snackbar-description",u)},{children:h}),void 0),k&&s(p,{primaryCTA:C,primaryCTALabel:y,secondaryCTA:A,secondaryCTALabel:T,dataTestPrefixId:"snackbar",dataTestId:u},void 0)]}),void 0)};export{v as default};

package/dist/components/Notification/Snackbar/Snackbar.style.js

@@ -1,26 +1,24 @@
-import{css as o}from"@emotion/react";import{rem as e}from"../../../theme/utils.js";import{typeToThemePalette as t}from"../Notification.style.js";const i=(i,n)=>l=>o`
+import{css as o}from"@emotion/react";import{rem as e}from"../../../theme/utils.js";import{typeToThemePalette as t}from"../Notification.style.js";const i=(i,l)=>n=>o`
       display: flex;
       flex-direction: column;
       overflow: hidden;
-      padding: ${l.globals.spacing.get("6")};
+      padding: ${n.globals.spacing.get("6")};
       box-sizing: border-box;
-      min-height: ${e(164)};
       max-height: ${e(294)};
       border-radius: ${e(8)};
-      background: ${l.globals.colors.white};
-      ${((o,i,n)=>"outlined"===i?`\n        border: ${e(2)} solid ${t(n,o)};\n      `:` \n    border-left: ${t(n,o)} ${e(4)} solid;\n    box-shadow: ${n.globals.elevation["02"]};\n`)(i,n,l)};
-    `,n=()=>e=>o`
+      background: ${n.globals.colors.white};
+      ${((o,i,l)=>"outlined"===i?`\n        border: ${e(2)} solid ${t(l,o)};\n      `:`\n    border-left: ${t(l,o)} ${e(4)} solid;\n    box-shadow: ${l.globals.elevation["02"]};\n`)(i,l,n)};
+    `,l=()=>e=>o`
       display: flex;
       align-items: center;
       justify-content: space-between;
       padding-bottom: ${e.globals.spacing.get("6")};
-    `,l=()=>()=>o`
+    `,n=()=>()=>o`
     display: flex;
     align-items: center;
-  `,a=()=>t=>o`
-      padding-bottom: ${t.globals.spacing.get("6")};
-      font-size: ${t.globals.typography.fontSizes.get("3")};
+  `,s=()=>t=>o`
+      font-size: ${t.globals.typography.fontSize.get("3")};
       max-height: ${e(194)};
       overflow: auto;
-      max-width: fit-content;
-    `;export{i as cardContainer,a as descriptionContainer,l as infoContainer,n as topContainer};
+      width: ${e(547)};
+    `;export{i as cardContainer,s as descriptionContainer,n as infoContainer,l as topContainer};

package/dist/components/Notification/subcomponents/CompactNotification/CompactNotification.js

@@ -1 +1 @@
-import{jsxs as i,jsx as t}from"@emotion/react/jsx-runtime";import s from"../../../../hooks/useTheme.js";import{generateTestDataId as e}from"../../../../utils/helpers.js";import o from"../../../Button/Button.js";import n from"../../../Icon/Icon.js";import{iconContainer as a,actionContainer as r}from"../../Notification.style.js";import{notificationsContainer as c,infoContainer as d,headContainer as l,messageContainer as m,actionsContainer as p,primaryActionContainer as v}from"./CompactNotification.style.js";const j=i=>"warning"===i?"alert":i,f=({hasIcon:f=!1,message:g,variant:h,type:b,styleType:y="elevated",primaryCTALabel:u,primaryCTA:O,closeCTA:C,title:T,dataTestId:k})=>{const{utils:I}=s();return i("div",Object.assign({css:c(b,y),"data-testid":e(h,k)},"banner"==h&&{"notification-type":"banner"},{children:[i("div",Object.assign({css:d()},{children:[f&&t("div",Object.assign({css:a()},{children:t(n,{name:j(b),color:b,size:20},void 0)}),void 0),"banner"===h&&t("div",Object.assign({css:l(),"data-testid":e(`${h}-title`,k)},{children:T}),void 0),t("div",Object.assign({css:m(),"data-testid":e(`${h}-message`,k)},{children:g}),void 0)]}),void 0),i("div",Object.assign({css:p()},{children:[O&&u&&t(o,Object.assign({css:v(),type:"link",size:"sm",onClick:O,"data-testid":e("notification-primary",k)},{children:u}),void 0),C&&t("span",Object.assign({css:r(),onClick:C,"data-testid":e("notification-close",k)},{children:t(n,{name:"close",color:I.getColor("lightGrey",650),size:20},void 0)}),void 0)]}),void 0)]}),void 0)};export{f as default,j as typeToIconName};
+import{jsxs as i,jsx as t}from"@emotion/react/jsx-runtime";import{notificationsContainer as s,infoContainer as e,headContainer as o,messageContainer as a,actionsContainer as n,primaryActionContainer as r}from"./CompactNotification.style.js";import c from"../../../../hooks/useTheme.js";import{generateTestDataId as d}from"../../../../utils/helpers.js";import l from"../../../Button/Button.js";import m from"../../../Icon/Icon.js";import{iconContainer as p,actionContainer as v}from"../../Notification.style.js";const j=i=>"warning"===i?"alert":i,f=({hasIcon:f=!1,message:g,variant:h,type:b,styleType:y="elevated",primaryCTALabel:u,primaryCTA:O,closeCTA:C,title:T,dataTestId:I})=>{const{utils:k}=c();return i("div",Object.assign({css:s(b,y),"data-testid":d(h,I)},"banner"==h&&{"notification-type":"banner"},{children:[i("div",Object.assign({css:e()},{children:[f&&t("div",Object.assign({css:p()},{children:t(m,{name:j(b),color:b,size:20},void 0)}),void 0),"banner"===h&&t("div",Object.assign({css:o(),"data-testid":d(`${h}-title`,I)},{children:T}),void 0),t("div",Object.assign({css:a(),"data-testid":d(`${h}-message`,I)},{children:g}),void 0)]}),void 0),i("div",Object.assign({css:n()},{children:[O&&u&&t(l,Object.assign({type:"tertiary",css:r(),onClick:O,"data-testid":d("notification-primary",I)},{children:u}),void 0),C&&t("span",Object.assign({css:v(),onClick:C,"data-testid":d("notification-close",I)},{children:t(m,{name:"close",color:k.getColor("lightGrey",650),size:20},void 0)}),void 0)]}),void 0)]}),void 0)};export{f as default,j as typeToIconName};

package/dist/components/Notification/subcomponents/CompactNotification/CompactNotification.style.js

@@ -1,28 +1,28 @@
-import{css as t}from"@emotion/react";import{rem as e}from"../../../../theme/utils.js";import{notificationsContainerPerType as i}from"../../Notification.style.js";const o=(o,g)=>s=>t`
+import{css as t}from"@emotion/react";import{rem as e}from"../../../../theme/utils.js";import{notificationsContainerPerType as i}from"../../Notification.style.js";const o=(o,g)=>a=>t`
       box-sizing: border-box;
       display: flex;
       justify-content: space-between;
       overflow: hidden;
       width: 100%;
       min-height: ${e(46)};
-      border-radius: ${s.globals.spacing.get("3")};
-      color: ${s.utils.getColor("darkGrey",850)};
-      font-size: ${s.globals.typography.fontSizes.get("3")};
-      ${i(o,g,s)};
+      border-radius: ${a.globals.spacing.get("3")};
+      color: ${a.utils.getColor("darkGrey",850)};
+      font-size: ${a.globals.typography.fontSize.get("3")};
+      ${i(o,g,a)};
     `,g=()=>e=>t`
       display: flex;
       align-items: center;
       padding: 0 ${e.globals.spacing.get("6")};
-    `,s=()=>e=>t`
-      padding: ${e.globals.spacing.get("6")} 0;
     `,a=()=>e=>t`
+      padding: ${e.globals.spacing.get("6")} 0;
+    `,l=()=>e=>t`
       display: flex;
       align-items: center;
       padding-right: ${e.globals.spacing.get("6")};
-      font-weight: ${e.globals.typography.weights.get("medium")};
-    `,l=()=>e=>t`
+      font-weight: ${e.globals.typography.fontWeight.get("medium")};
+    `,s=()=>e=>t`
       padding-right: ${e.globals.spacing.get("3")};
-      font-weight: ${e.globals.typography.weights.get("medium")};
-    `,r=()=>()=>t`
+      font-weight: ${e.globals.typography.fontWeight.get("medium")};
+    `,n=()=>()=>t`
     cursor: pointer;
-  `;export{a as actionsContainer,l as headContainer,g as infoContainer,s as messageContainer,o as notificationsContainer,r as primaryActionContainer};
+  `;export{l as actionsContainer,s as headContainer,g as infoContainer,a as messageContainer,o as notificationsContainer,n as primaryActionContainer};

package/dist/components/Notification/subcomponents/NotificationActionsArea/NotificationActionsArea.js

@@ -0,0 +1 @@
+import{jsxs as t,jsx as i}from"@emotion/react/jsx-runtime";import{generateTestDataId as e}from"../../../../utils/helpers.js";import s from"../../../Button/Button.js";import{actionsContainer as r,actionContainer as a}from"../../Notification.style.js";const o=({primaryCTA:o,primaryCTALabel:d,secondaryCTA:c,secondaryCTALabel:n,dataTestPrefixId:l,dataTestId:m})=>t("div",Object.assign({css:r()},{children:[c&&n&&i("div",Object.assign({css:a(),"data-testid":e(`${l}-secondary`,m)},{children:i(s,Object.assign({type:"tertiary",onClick:c},{children:n}),void 0)}),void 0),o&&d&&i("div",Object.assign({css:a(),"data-testid":e(`${l}-primary`,m)},{children:i(s,Object.assign({type:"tertiary",onClick:o},{children:d}),void 0)}),void 0)]}),void 0);export{o as default};

package/dist/components/Overlay/Overlay.js

@@ -1 +1 @@
-import{jsx as i,jsxs as s}from"@emotion/react/jsx-runtime";import e from"../../hooks/useEscape.js";import o from"react";import{generateTestDataId as t}from"../../utils/helpers.js";import{backdropStyle as r,overlayStyle as a,closeIconContainer as n,contentStyle as c}from"./Overlay.style.js";import l from"../IconButton/IconButton.js";import d from"../utils/ClickAwayListener/ClickAwayListener.js";const h=({anchor:i,size:s})=>"top"===i||"bottom"===i?{display:"flex",height:s,width:"100%"}:{display:"flex",height:"100%",width:s},m=o.forwardRef((({isOpen:o,onClose:m,anchor:p="left",size:f,dataTestId:v,children:y},j)=>(e((()=>{m()})),i("div",Object.assign({css:r({isOpen:o,anchor:p}),"data-testid":t("overlay-container",v)},{children:i(d,Object.assign({onClick:()=>m(),cssStyles:h({anchor:p,size:f})},{children:s("div",Object.assign({ref:j,css:a({isOpen:o,anchor:p})},{children:[i("div",Object.assign({css:n()},{children:i(l,{name:"close",isFilled:!1,isTransparent:!0,color:"lightGrey-650",size:"sm",onClick:m,dataTestId:"overlay-close"},void 0)}),void 0),i("div",Object.assign({css:c()},{children:y}),void 0)]}),void 0)}),void 0)}),void 0))));m.displayName="Overlay";export{m as default};
+import{jsx as e,jsxs as i}from"@emotion/react/jsx-runtime";import s from"../../hooks/useEscape.js";import o from"react";import{generateTestDataId as t}from"../../utils/helpers.js";import{backdropStyle as r,overlayStyle as a,closeIconContainer as c,contentStyle as n}from"./Overlay.style.js";import d from"../IconButton/IconButton.js";import l from"../utils/ClickAwayListener/ClickAwayListener.js";const h=({anchor:e,size:i})=>"top"===e||"bottom"===e?{display:"flex",height:i,width:"100%"}:{display:"flex",height:"100%",width:i},m=o.forwardRef((({isOpen:o,onClose:m,anchor:p="left",size:f,dataTestId:v,children:y},j)=>(s((()=>{m()})),e("div",Object.assign({css:r({isOpen:o,anchor:p}),"data-testid":t("overlay-container",v)},{children:e(l,Object.assign({onClick:()=>m(),cssStyles:h({anchor:p,size:f})},{children:i("div",Object.assign({ref:j,css:a({isOpen:o,anchor:p})},{children:[e("div",Object.assign({css:c()},{children:e(d,{type:"tertiary",name:"close",onClick:m,dataTestId:"overlay-close"},void 0)}),void 0),e("div",Object.assign({css:n()},{children:y}),void 0)]}),void 0)}),void 0)}),void 0))));m.displayName="Overlay";export{m as default};

package/dist/components/Pagination/Pagination.js

@@ -1 +1 @@
-import{jsxs as e,jsx as i}from"@emotion/react/jsx-runtime";import a from"../../hooks/usePagination.js";import o from"../../hooks/useTheme.js";import s from"../IconButton/IconButton.js";const n=({page:n=1,count:r,onChange:t=(()=>{}),isEnhancedPaginationVisible:l=!1,isNextPageDisabled:d,isPrevPageDisabled:c})=>{const g=o(),{currentPage:m,hasNextPage:p,hasPrevPage:v,navigateToFirstPage:P,navigateToLastPage:h,navigateToNextPage:u,navigateToPrevPage:f}=a({page:n,count:r,onChange:t});return e("div",Object.assign({css:{flex:1,display:"flex",alignItems:"center",justifyContent:"space-between",color:g.utils.getColor("darkGrey",850),"> *":{padding:g.globals.spacing.get("4")}}},{children:[l&&i(s,{color:"darkGrey-850",name:"arrowToLeft",onClick:P,iconSize:20,size:"sm",isTransparent:!0,isFilled:!1,isDisabled:c||!v},void 0),i(s,{color:"darkGrey-850",name:"arrowLeft",iconSize:20,size:"sm",isTransparent:!0,isFilled:!1,onClick:f,isDisabled:c||!v},void 0),e("div",{children:["Page ",m," of ",r]},void 0),i(s,{color:"darkGrey-850",name:"arrowRight",iconSize:20,size:"sm",isTransparent:!0,isFilled:!1,onClick:u,isDisabled:d||!p},void 0),l&&i(s,{color:"darkGrey-850",name:"arrowToRight",iconSize:20,size:"sm",isTransparent:!0,isFilled:!1,onClick:h,isDisabled:d||!p},void 0)]}),void 0)};export{n as default};
+import{jsxs as e,jsx as a}from"@emotion/react/jsx-runtime";import i from"../../hooks/usePagination.js";import t from"../../hooks/useTheme.js";import o from"../IconButton/IconButton.js";const n=({page:n=1,count:r,onChange:s=(()=>{}),isEnhancedPaginationVisible:g=!1,isNextPageDisabled:l,isPrevPageDisabled:d})=>{const c=t(),{currentPage:m,hasNextPage:p,hasPrevPage:v,navigateToFirstPage:P,navigateToLastPage:h,navigateToNextPage:u,navigateToPrevPage:f}=i({page:n,count:r,onChange:s});return e("div",Object.assign({css:{flex:1,display:"flex",alignItems:"center",justifyContent:"space-between",color:c.utils.getColor("darkGrey",850),"> *":{padding:c.globals.spacing.get("4")}}},{children:[g&&a(o,{name:"arrowToLeft",onClick:P,type:"tertiary",isDisabled:d||!v},void 0),a(o,{name:"arrowLeft",type:"tertiary",onClick:f,isDisabled:d||!v},void 0),e("div",{children:["Page ",m," of ",r]},void 0),a(o,{name:"arrowRight",type:"tertiary",onClick:u,isDisabled:l||!p},void 0),g&&a(o,{name:"arrowToRight",type:"tertiary",onClick:h,isDisabled:l||!p},void 0)]}),void 0)};export{n as default};

package/dist/components/Radio/Radio.js

@@ -1 +1 @@
-import{jsxs as e,jsx as s}from"@emotion/react/jsx-runtime";import*as i from"react";import o from"../../hooks/useTheme.js";import{generateTestDataId as a}from"../../utils/helpers.js";import d from"../RadioGroup/useRadioGroup.js";import{wrapperStyles as r,inputStyles as t,customRadioWrapperStyles as n,customRadioStyles as u,customRadioInnerHover as l}from"./Radio.style.js";const c=i.forwardRef(((c,m)=>{const{isChecked:p,onChange:h,value:v="on",name:f,isDisabled:j=!1,id:g,isRequired:R=!1,isFilled:b=!0,dataTestId:k}=c,[C,y]=i.useState(!1),[F,O]=i.useState(!1),q=d(),x=o(),D=()=>{y(!0)},G=()=>{y(!1)},M=null!=p?p:q?(q&&q.value)===v:F,S=null!=f?f:q&&q.name;return e("span",Object.assign({css:r(j),"data-testid":a("radio-input",k)},{children:[s("input",{css:t,onFocus:D,onBlur:G,onMouseLeave:G,onMouseOver:D,type:"radio",onChange:e=>{j||(void 0===p&&O(e.target.checked),h&&h(e),q&&q.onChange(e))},name:S,value:v,disabled:j,id:g,required:R,checked:M,ref:m},void 0),e("span",Object.assign({css:n(C,j)(x)},{children:[s("span",{css:u({isChecked:M,isDisabled:j,isFilled:b})(x)},void 0),s("span",{css:l(C,j)(x)},void 0)]}),void 0)]}),void 0)}));c.displayName="Radio";export{c as default};
+import{jsxs as e,jsx as s}from"@emotion/react/jsx-runtime";import*as i from"react";import{wrapperStyles as o,inputStyles as a,customRadioWrapperStyles as d,customRadioStyles as r,customRadioInnerHover as t}from"./Radio.style.js";import n from"../../hooks/useTheme.js";import{generateTestDataId as u}from"../../utils/helpers.js";import l from"../RadioGroup/useRadioGroup.js";const c=i.forwardRef(((c,m)=>{const{isChecked:p,onChange:h,value:v="on",name:f,isDisabled:j=!1,id:g,isRequired:R=!1,isFilled:b=!0,dataTestId:k}=c,[C,y]=i.useState(!1),[F,O]=i.useState(!1),q=l(),x=n(),D=()=>{y(!0)},G=()=>{y(!1)},M=null!=p?p:q?(q&&q.value)===v:F,S=null!=f?f:q&&q.name;return e("span",Object.assign({css:o(j),"data-testid":u("radio-input",k)},{children:[s("input",{css:a,onFocus:D,onBlur:G,onMouseLeave:G,onMouseOver:D,type:"radio",onChange:e=>{j||(void 0===p&&O(e.target.checked),h&&h(e),q&&q.onChange(e))},name:S,value:v,disabled:j,id:g,required:R,checked:M,ref:m},void 0),e("span",Object.assign({css:d(C,j)(x)},{children:[s("span",{css:r({isChecked:M,isDisabled:j,isFilled:b})(x)},void 0),s("span",{css:t(C,j)(x)},void 0)]}),void 0)]}),void 0)}));c.displayName="Radio";export{c as default};

package/dist/components/Select/Select.js

@@ -1 +1 @@
-import{__rest as e}from"tslib";import{jsxs as s,jsx as i}from"@emotion/react/jsx-runtime";import o from"lodash/debounce.js";import t,{useEffect as a,useMemo as l}from"react";import{generateTestDataId as r}from"../../utils/helpers.js";import n from"../../hooks/useCombinedRefs.js";import c from"../../hooks/useTheme.js";import d from"../Icon/Icon.js";import u from"../TextField/TextField.js";import m from"../utils/ClickAwayListener/ClickAwayListener.js";import{handleSearch as h}from"../utils/handleSearch.js";import p from"./components/SelectMenu/SelectMenu.js";import{rightIconContainer as f,selectWrapper as v}from"./Select.style.js";import C from"../Loader/Loader.js";const b={label:"",value:""},S=()=>{},g=t.forwardRef(((g,y)=>{const{handleSelectedOption:j=(()=>{}),defaultValue:L,selectedOption:k=b,isMulti:O=!1,options:T,isAsync:w=!1,isLoading:I=!1,asyncSearch:z=(()=>{}),status:V="normal",minCharactersToSearch:A=0,hasHighlightSearch:D=!1,isSearchable:x=!0,isVirtualized:M=!1,styleType:R,isDisabled:F,isLocked:H,dataTestId:G,onClear:K}=g,N=e(g,["handleSelectedOption","defaultValue","selectedOption","isMulti","options","isAsync","isLoading","asyncSearch","status","minCharactersToSearch","hasHighlightSearch","isSearchable","isVirtualized","styleType","isDisabled","isLocked","dataTestId","onClear"]),q=c(),[B,E]=t.useState(!1),J=t.useRef(null),P=n(J,y),[Q,U]=t.useState(L||k),[W,X]=t.useState("");a((()=>{U(L||k)}),[L,k]);const Y=t.useCallback(o((e=>{z(e)}),400),[]),Z=t.useCallback((e=>{h({event:e,isSearchable:x,isAsync:w,setSearchValue:X,onChange:Y,minCharactersToSearch:A})}),[Y,w,x,A]),$=l((()=>w?T:T.filter((e=>{var s;return!W||e.label.toLowerCase().includes(W.toLowerCase())||!!(null===(s=e.options)||void 0===s?void 0:s.find((e=>e.label.toLowerCase().includes(W.toLowerCase()))))})).map((e=>{var s;return e.label.toLowerCase().includes(W.toLowerCase())?e:Object.assign(Object.assign({},e),{options:null===(s=e.options)||void 0===s?void 0:s.filter((e=>e.label.toLowerCase().includes(W.toLowerCase())))})}))),[W,T,w]),_=l((()=>x?W||Q.value?"close":"search":"triangleDown"),[Q.value,x,W]),ee=t.useCallback((()=>{x&&B&&E(!B),x&&(W||Q.value)&&(X(""),U(b),z(""),K&&K())}),[z,Q.value,x,K,B,W]),se=l((()=>s("div",Object.assign({css:f(B,x)},{children:[I&&i(C,{},void 0),i(d,{size:x?20:12,name:_,color:q.utils.getColor("lightGrey",650),onClick:ee,dataTestId:"select-right-icon"},void 0)]}),void 0)),[B,I,x,_,q.utils,ee]);return i(m,Object.assign({onClick:()=>{E(!1),X("")}},{children:s("div",Object.assign({},!(F||H)&&{onClick:()=>{var e,s;B?x||(E(!1),null===(s=null==P?void 0:P.current)||void 0===s||s.blur()):(E(!0),null===(e=null==P?void 0:P.current)||void 0===e||e.focus())}},{css:v({isSearchable:x})},{children:[i(u,Object.assign({styleType:R,rightIcon:se,onKeyDown:e=>{8===e.keyCode&&(U(b),Y(""))},onInput:Z,onChange:S,isReadOnly:!x,isDisabled:F,isLocked:H,dataTestId:r("select-input",G)},N,{status:V,value:W||Q.label,ref:P,autoComplete:"off"}),void 0),B&&i(p,{filteredOptions:$,handleOptionClick:e=>{U(e),E(!1),x&&X(""),j(e)},selectedOption:Q.value,size:N.size,status:V,isLoading:I,isVirtualized:M,searchTerm:D?W:void 0},void 0)]}),void 0)}),void 0)}));g.displayName="Select";export{g as default};
+import{__rest as e}from"tslib";import{jsxs as t,jsx as s}from"@emotion/react/jsx-runtime";import i from"lodash/debounce.js";import o,{useEffect as l,useMemo as a}from"react";import{generateTestDataId as n}from"../../utils/helpers.js";import r from"./components/MultiselectTextField/MultiselectTextField.js";import c from"./components/SelectMenu/SelectMenu.js";import d from"./hooks/useMultiselectUtils.js";import{rightIconContainer as u,selectWrapper as p}from"./Select.style.js";import m from"../../hooks/useCombinedRefs.js";import h from"../../hooks/useTheme.js";import f from"../Icon/Icon.js";import v from"../TextField/TextField.js";import b from"../utils/ClickAwayListener/ClickAwayListener.js";import{handleSearch as O}from"../utils/handleSearch.js";import C from"../Loader/Loader.js";import S from"../utils/PositionInScreen/PositionInScreen.js";const g={label:"",value:""},j=()=>{},y=o.forwardRef(((y,L)=>{const{handleSelectedOption:k=(()=>{}),defaultValue:T,selectedOption:w=g,isMulti:I=!1,options:M,isAsync:D=!1,isLoading:A=!1,asyncSearch:V=(()=>{}),status:x="normal",minCharactersToSearch:z=0,hasHighlightSearch:F=!1,isSearchable:R=!0,isVirtualized:H=!1,styleType:P,isDisabled:W,isLocked:G,dataTestId:K,onClear:N,onOptionDelete:U,selectedOptions:Y=[]}=y,q=e(y,["handleSelectedOption","defaultValue","selectedOption","isMulti","options","isAsync","isLoading","asyncSearch","status","minCharactersToSearch","hasHighlightSearch","isSearchable","isVirtualized","styleType","isDisabled","isLocked","dataTestId","onClear","onOptionDelete","selectedOptions"]),B=h(),[E,J]=o.useState(!1),Q=o.useRef(null),X=m(Q,L),Z=null!=T?T:w,[$,_]=o.useState(Z),[ee,te]=o.useState(""),se=ee||$.label,{multiSelectedOptions:ie,setMultiSelectedOpts:oe,availableMultiSelectOptions:le,setAvailableMultiSelectOptions:ae,handleOptionDelete:ne,handleClearAllOptions:re}=d({selectedOptions:Y,options:M,setOpen:J,setSearchValue:te,isSearchable:R,onClear:N,onOptionDelete:U,isMulti:I});l((()=>{_(Z)}),[Z]);const ce=o.useCallback(i((e=>{V(e)}),400),[]),de=o.useCallback((e=>{open||J(!0),O({event:e,isSearchable:R,isAsync:D,setSearchValue:te,onChange:ce,minCharactersToSearch:z})}),[ce,D,R,z,open]),ue=a((()=>{const e=I?le:M;return D?e:e.filter((e=>{var t;return!ee||e.label.toLowerCase().includes(ee.toLowerCase())||!!(null===(t=e.options)||void 0===t?void 0:t.find((e=>e.label.toLowerCase().includes(ee.toLowerCase()))))})).map((e=>{var t;return e.label.toLowerCase().includes(ee.toLowerCase())?e:Object.assign(Object.assign({},e),{options:null===(t=e.options)||void 0===t?void 0:t.filter((e=>e.label.toLowerCase().includes(ee.toLowerCase())))})}))}),[D,I,le,M,ee]),pe=a((()=>R?ee||$.value?"close":"search":"triangleDown"),[$.value,R,ee]),me=o.useCallback((()=>{R&&E&&J(!E),R&&(ee||$.value)&&(te(""),_(g),V(""),N&&N())}),[V,$.value,R,N,E,ee]),he=a((()=>t("div",Object.assign({css:u(E,R)},{children:[A&&s(C,{},void 0),s(f,{size:R?20:12,name:pe,color:B.utils.getColor("lightGrey",650),onClick:me,dataTestId:"select-right-icon"},void 0)]}),void 0)),[E,A,R,pe,B.utils,me]);return s(b,Object.assign({onClick:()=>{J(!1),te("")}},{children:s("div",Object.assign({},!(W||G)&&{onClick:()=>{var e,t;E?R||(J(!1),null===(t=null==X?void 0:X.current)||void 0===t||t.blur()):(J(!0),null===(e=null==X?void 0:X.current)||void 0===e||e.focus())}},{css:p({isSearchable:R})},{children:s(S,Object.assign({isVisible:E,hasWrapperWidth:!0,offsetY:8,parent:I?s(r,Object.assign({selectedOptions:ie,onInput:de,onOptionDelete:ne,onClearAllOptions:re,isLoading:A,isDisabled:W,isLocked:G,readOnly:!R,dataTestId:n("select-input",K)},q,{status:x,value:se,autoComplete:"off"}),void 0):s(v,Object.assign({styleType:P,rightIcon:he,onKeyDown:e=>{8===e.keyCode&&(_(g),ce(""))},onInput:de,onChange:j,readOnly:!R,disabled:W,isLocked:G,dataTestId:n("select-input",K)},q,{status:x,value:se,ref:X,autoComplete:"off"}),void 0)},{children:s(c,{filteredOptions:ue,handleOptionClick:e=>{I?(oe([...ie,e]),ae(le.filter((t=>t.value!==e.value)))):_(e),J(!1),R&&te(""),k(e)},selectedOption:$.value,size:q.size,status:x,isLoading:A,isVirtualized:H,searchTerm:F?ee:void 0},void 0)}),void 0)}),void 0)}),void 0)}));y.displayName="Select";export{y as default};

package/dist/components/Select/components/MultiselectTextField/MultiselectTextField.js

@@ -0,0 +1 @@
+import{__rest as e}from"tslib";import{jsx as i,Fragment as s,jsxs as l}from"@emotion/react/jsx-runtime";import o from"../../../../hooks/useTheme.js";import t from"lodash/omit";import r,{useMemo as a}from"react";import{generateUniqueID as d}from"../../../../utils/helpers.js";import{chipStyle as n,chipContent as c,textInputBaseOverrides as p,inputContainer as m,rightIconsContainer as h,rightIconStyles as u,inputOverrides as v}from"./MultiselectTextField.style.js";import g from"../../../Chip/Chip.js";import b from"../../../Icon/Icon.js";import f from"../../../Label/Label.js";import j from"../../../Loader/Loader.js";import y from"../../../TextInputBase/TextInputBase.js";import{inputStyle as O}from"../../../TextInputBase/TextInputBase.style.js";const L=r.forwardRef(((L,T)=>{const{selectedOptions:k,value:x,isDisabled:I,isLocked:C,status:D,isLean:R,isDark:B,isReadOnly:z,label:q,id:w,placeholder:A,isRequired:F=!1,styleType:G,onOptionDelete:M,onClearAllOptions:$,isLoading:E,rightIcon:K}=L,N=e(L,["selectedOptions","value","isDisabled","isLocked","status","isLean","isDark","isReadOnly","label","id","placeholder","isRequired","styleType","onOptionDelete","onClearAllOptions","isLoading","rightIcon"]),V=r.useRef(null),W=o(),_=Boolean(x||(null==k?void 0:k.length)&&(null==k?void 0:k.length)>0),H=a((()=>!q&&A?F?`${A} *`:A:q),[q,A,F]),J=a((()=>C?"lock":_?"close":"search"),[_,C]),P=a((()=>i(s,{children:null==k?void 0:k.map(((e,s)=>{var l;return i("span",Object.assign({css:n()},{children:i(g,Object.assign({onClear:C||I?void 0:()=>M(e),fill:"lightGrey",dataTestId:`chip_${s}`},{children:i("div",Object.assign({title:e.label,css:c({maxWidth:null===(l=V.current)||void 0===l?void 0:l.getBoundingClientRect().width})},{children:e.label}),void 0)}),void 0)}),d("chip"+s))}))},void 0)),[I,C,M,k]),Q=a((()=>K?"string"==typeof K?i(b,{name:K,size:20,color:W.utils.getColor("lightGrey",650)},void 0):K:i(b,{size:20,name:J,color:W.utils.getColor("lightGrey",650),onClick:_&&!C?$:void 0,dataTestId:"select-right-icon"},void 0)),[_,J,C,$,K,W.utils]);return i("div",Object.assign({ref:V},{children:l(y,Object.assign({isDisabled:I,isLocked:C,status:D,isLean:R,size:"md",styleType:G},N,{sx:p({hasValue:_,isLoading:E})(W)},{children:[l("div",Object.assign({css:m()},{children:[P,i("input",Object.assign({readOnly:z,onKeyDown:e=>{""===x&&"Backspace"===e.key&&M()},css:O({size:"md",placeholder:A,label:q,isDark:B,isLean:R,sx:v()}),placeholder:H,required:F,id:w,disabled:I||C},t(N,"dataTestId"),{value:x,ref:T}),void 0),q&&i(f,{size:"md",htmlFor:w,label:q,isRequired:F,isAnimated:_,hasError:"error"===D},void 0)]}),void 0),!I&&l("div",Object.assign({css:h()},{children:[E&&i(j,{},void 0),i("div",Object.assign({css:u({isClickable:_&&!C})},{children:Q}),void 0)]}),void 0)]}),void 0)}),void 0)}));L.displayName="MultiselectTextField";export{L as default};

package/dist/components/Select/components/MultiselectTextField/MultiselectTextField.style.js

@@ -0,0 +1,29 @@
+import{css as t}from"@emotion/react";import{rem as i}from"polished";import{getTextFieldHeight as o}from"../../../../utils/size-utils.js";import{LABEL_TRANSFORM_LEFT_SPACING as e}from"../../../Label/Label.style.js";const a=({maxWidth:o})=>()=>t`
+      white-space: nowrap;
+      overflow: hidden;
+      text-overflow: ellipsis;
+      max-width: ${o?i(o-120):"unset"};
+    `,s=()=>i=>t`
+      position: absolute !important;
+      bottom: 0;
+      right: ${i.globals.spacing.get("5")};
+      top: 0;
+      display: flex;
+      align-items: center;
+    `,l=({isClickable:i})=>()=>t`
+      cursor: ${i?"pointer":"auto"};
+    `,r=()=>o=>t`
+      position: relative;
+      margin-right: ${o.globals.spacing.get("2")};
+      & > div {
+        height: ${i(20)};
+        border-radius: ${i(4)};
+      }
+    `,n=()=>i=>t`
+      position: static;
+      width: 100%;
+      display: flex;
+      flex-wrap: wrap;
+      row-gap: ${i.globals.spacing.get("2")};
+      z-index: 2;
+    `,p=({hasValue:t,isLoading:a})=>s=>{const l={fontWeight:`${s.globals.typography.fontWeight.get("bold")} !important`,transform:`translate(${e}, -82%) scale(0.8) !important`,bottom:"auto"};return{wrapper:Object.assign({height:"unset",minHeight:`${o("md")} !important`},t?{label:l}:{"input:focus":{label:l},label:{transform:`translate(${e}, -8px)`}}),textField:{padding:a?`${i(21)} ${i(80)} ${i(5)} ${s.globals.spacing.get("5")}`:`${i(21)} ${i(40)} ${i(5)} ${s.globals.spacing.get("5")}`}}},g=()=>({input:{top:"unset",flex:"1 1 0%",minWidth:"20%","&:focus, &:not(:placeholder-shown)":{"& + label":{transform:`translate(${e}, -82%) scale(0.8)`}}}});export{a as chipContent,r as chipStyle,n as inputContainer,g as inputOverrides,l as rightIconStyles,s as rightIconsContainer,p as textInputBaseOverrides};