@equinor/amplify-component-lib 8.6.0 → 8.6.2

package/dist/molecules/Select/Select.js

@@ -1 +1 @@
-import{jsx as e,jsxs as t}from"react/jsx-runtime";import{useRef as n,useMemo as r}from"react";import{Label as o,CircularProgress as l,Icon as a}from"@equinor/eds-core-react";import{thumbs_up as i,warning_filled as c,error_filled as s,arrow_drop_up as d,arrow_drop_down as m,clear as h}from"@equinor/eds-icons";import{tokens as u}from"../../node_modules/@equinor/eds-tokens/dist/esm/base/index.js";import{useSelect as p}from"../../atoms/hooks/useSelect.js";import{GroupedSelectMenu as g}from"./GroupedSelectMenu.js";import{ValueText as b,StyledChip as f,Wrapper as v,Container as x,Section as y,PlaceholderText as O,ClearButton as k,HelperWrapper as C,StyledMenu as I}from"./Select.styles.js";import{SelectMenu as S}from"./SelectMenu.js";import{useOutsideClick as w}from"../../node_modules/@equinor/eds-utils/dist/esm/hooks/useOutsideClick.js";const{colors:$}=u,j=u=>{const{clearable:j=!0,loading:D=!1,disabled:R=!1,lightBackground:B=!1,underlineHighlight:K=!1,sortValues:M=!0,placeholder:_="Select...",label:q,helperText:E,meta:T,id:z=`amplify-combobox-${q}`,variant:V,inDialog:W=!1}=u,{handleOnClear:F,handleOnItemKeyDown:H,handleOnItemSelect:P,handleOnSearchChange:G,handleOnSearchKeyDown:N,handleToggleOpen:A,itemRefs:J,search:L,selectedValues:Q,handleOnClose:U,handleOnOpen:X,handleOnRemoveItem:Y,handleOnMouseEnterItem:Z,open:ee,searchRef:te,tryingToRemoveItem:ne}=p({...u,clearable:j,loading:D,disabled:R,lightBackground:B,underlineHighlight:K,sortValues:M,placeholder:_}),re=n(null),oe=n(null),le=r((()=>!!q||!!T),[q,T]),ae=r((()=>!!E),[E]),ie=r((()=>{switch(V){case"error":return s;case"warning":return c;case"success":return i}}),[V]);w(oe.current,(e=>{W&&ee&&e.target&&re.current&&oe.current&&!re.current.contains(e.target)&&!oe.current?.contains(e.target)&&U()}));const ce=r((()=>"value"in u&&u.value?e(b,{children:u.value.label}):Q.map((t=>e(f,{"data-testid":"amplify-combobox-chip",className:"amplify-combo-box-chip",onDelete:()=>Y(t),$tryingToRemove:ne?.value===t.value,$lightBackground:B,children:t.label},t.value)))),[Q,ne,B,u,Y]);return t("div",{children:[t(v,{children:[le&&e(o,{label:q,meta:T,htmlFor:z}),t(x,{"data-testid":"combobox-container",ref:re,onClick:X,"aria-expanded":ee,$variant:V,$lightBackground:B,children:[t(y,{children:[""===L&&0===Q.length&&e(O,{children:_}),(""===L||"values"in u&&Q.length>0)&&ce,e("input",{id:z,disabled:R||D,ref:te,type:"search",role:"combobox",value:L,autoComplete:"off",onChange:G,onKeyDownCapture:N})]}),D?e(l,{size:16}):e(a,{onClick:A,data:ee?d:m,color:$.interactive.primary__resting.rgba}),j&&Q.length>0&&!D&&e(k,{id:"clear",variant:"ghost_icon",onClick:F,"data-testid":"clearBtn",children:e(a,{data:h,size:18})})]}),ae&&t(C,{$variant:V,children:[ie&&e(a,{data:ie,size:16}),e(o,{label:E,htmlFor:z})]})]}),ee&&e(I,{ref:oe,open:!0,id:"combobox-menu",anchorEl:re.current,onClose:U,placement:"bottom",style:{width:`${re.current?.clientWidth}px`,maxWidth:`${re.current?.clientWidth}px`},children:u.groups?e(g,{...u,search:L,itemRefs:J,onItemSelect:P,onItemKeyDown:H,onMouseEnterItem:Z}):e(S,{...u,search:L,itemRefs:J,onItemSelect:P,onItemKeyDown:H,onMouseEnterItem:Z,selectableParent:"values"in u&&u.selectableParent})})]})};export{j as Select};
+import{jsx as e,jsxs as t}from"react/jsx-runtime";import{useRef as n,useMemo as r}from"react";import{Label as o,CircularProgress as l,Icon as a}from"@equinor/eds-core-react";import{thumbs_up as i,warning_filled as c,error_filled as s,arrow_drop_up as d,arrow_drop_down as m,clear as h}from"@equinor/eds-icons";import{tokens as u}from"../../node_modules/@equinor/eds-tokens/dist/esm/base/index.js";import{useSelect as p}from"../../atoms/hooks/useSelect.js";import{GroupedSelectMenu as g}from"./GroupedSelectMenu.js";import{ValueText as b,StyledChip as f,Wrapper as v,Container as x,Section as y,PlaceholderText as O,ClearButton as k,HelperWrapper as C,StyledMenu as I}from"./Select.styles.js";import{SelectMenu as S}from"./SelectMenu.js";import{useOutsideClick as w}from"../../node_modules/@equinor/eds-utils/dist/esm/hooks/useOutsideClick.js";const{colors:$}=u,j=u=>{const{clearable:j=!0,loading:D=!1,disabled:R=!1,lightBackground:B=!1,underlineHighlight:K=!1,sortValues:M=!0,placeholder:_="Select...",label:q,helperText:E,meta:T,id:z=`amplify-combobox-${q}`,variant:V,inDialog:W=!1}=u,{handleOnClear:F,handleOnItemKeyDown:H,handleOnItemSelect:P,handleOnSearchChange:G,handleOnSearchKeyDown:N,handleToggleOpen:A,itemRefs:J,search:L,selectedValues:Q,handleOnClose:U,handleOnOpen:X,handleOnRemoveItem:Y,handleOnMouseEnterItem:Z,open:ee,searchRef:te,tryingToRemoveItem:ne}=p({...u,clearable:j,loading:D,disabled:R,lightBackground:B,underlineHighlight:K,sortValues:M,placeholder:_}),re=n(null),oe=n(null),le=r((()=>!!q||!!T),[q,T]),ae=r((()=>!!E),[E]),ie=r((()=>{switch(V){case"error":return s;case"warning":return c;case"success":return i}}),[V]);w(oe.current,(e=>{W&&ee&&e.target&&re.current&&oe.current&&!re.current.contains(e.target)&&!oe.current?.contains(e.target)&&U()}));const ce=r((()=>"value"in u&&u.value?e(b,{children:u.value.label}):Q.map((t=>e(f,{"data-testid":"amplify-combobox-chip",className:"amplify-combo-box-chip",onDelete:()=>Y(t),$tryingToRemove:ne?.value===t.value,$lightBackground:B,children:t.label},t.value)))),[Q,ne,B,u,Y]);return t("div",{children:[le&&e(o,{label:q,meta:T,htmlFor:z}),t(v,{children:[t(x,{"data-testid":"combobox-container",ref:re,onClick:X,"aria-expanded":ee,$variant:V,$lightBackground:B,children:[t(y,{children:[""===L&&0===Q.length&&e(O,{children:_}),(""===L||"values"in u&&Q.length>0)&&ce,e("input",{id:z,disabled:R||D,ref:te,type:"search",role:"combobox",value:L,autoComplete:"off",onChange:G,onKeyDownCapture:N})]}),D?e(l,{size:16}):e(a,{onClick:A,data:ee?d:m,color:$.interactive.primary__resting.rgba}),j&&Q.length>0&&!D&&e(k,{id:"clear",variant:"ghost_icon",onClick:F,"data-testid":"clearBtn",children:e(a,{data:h,size:18})})]}),ae&&t(C,{$variant:V,children:[ie&&e(a,{data:ie,size:16}),e(o,{label:E,htmlFor:z})]})]}),ee&&e(I,{ref:oe,open:!0,id:"combobox-menu",anchorEl:re.current,onClose:U,placement:"bottom",style:{width:`${re.current?.clientWidth}px`,maxWidth:`${re.current?.clientWidth}px`},children:u.groups?e(g,{...u,search:L,itemRefs:J,onItemSelect:P,onItemKeyDown:H,onMouseEnterItem:Z}):e(S,{...u,search:L,itemRefs:J,onItemSelect:P,onItemKeyDown:H,onMouseEnterItem:Z,selectableParent:"values"in u&&u.selectableParent})})]})};export{j as Select};

package/dist/organisms/SideBar/MenuItem.styles.js

@@ -28,6 +28,7 @@ import{Link as e}from"react-router-dom";import{tokens as o}from"../../node_modul
     text-decoration: none;
   }
 `,m=r.div`
+  display: flex;
   padding: ${t.x_small};
   align-items: center;
   justify-content: center;

package/dist/organisms/Template/Template.js

@@ -12,9 +12,9 @@ import{tokens as o}from"../../node_modules/@equinor/eds-tokens/dist/esm/base/ind
   min-height: calc(100vh - 64px);
   max-height: calc(100vh - 64px);
   overflow: auto;
-  /* 256px and 72px is width of Sidebar when open/closed, + 1px because of border */
+  /* 231px and 64px is width of Sidebar when open/closed, + 1px because of border */
   min-width: calc(
-    100% - ${o=>o.$open?"257px":"73px"} -
+    100% - ${o=>o.$open?"232px":"65px"} -
       ${i.xxx_large} * 2
   );
   &:not(:has(.select-field)) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@equinor/amplify-component-lib",
-  "version": "8.6.0",
+  "version": "8.6.2",
   "description": "Frontend Typescript components for the Amplify team",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",