@equinor/amplify-component-lib 8.8.0 → 8.8.1

package/dist/atoms/style/colors.d.ts

@@ -449,3 +449,4 @@ export declare const colors: {
     };
 };
 export declare const VARIANT_COLORS: Record<Variants, string>;
+export declare const VARIANT_HELPER_COLORS: Record<Variants, string>;

package/dist/atoms/style/colors.js

@@ -1 +1 @@
-import{tokens as a}from"../../node_modules/@equinor/eds-tokens/dist/esm/base/index.js";const{colors:r}=a,i={...r,dataviz:{darkblue:{default:"var(--amplify_dataviz_darkblue_default, rgba(0, 71, 153, 1))",darker:"var(--amplify_dataviz_darkblue_darker, rgba(4, 48, 98, 1))",lighter:"var(--amplify_dataviz_darkblue_lighter, rgba(191, 220, 252, 1))"},lightblue:{default:"var(--amplify_dataviz_lightblue_default, rgba(133, 208, 250, 1))",darker:"var(--amplify_dataviz_lightblue_darker, rgba(35, 170, 246, 1))",lighter:"var(--amplify_dataviz_lightblue_lighter, rgba(211, 238, 253, 1))"},lightgreen:{default:"var(--amplify_dataviz_lightgreen_default, rgba(10, 194, 154, 1))",darker:"var(--amplify_dataviz_lightgreen_darker, rgba(8, 145, 115, 1))",lighter:"var(--amplify_dataviz_lightgreen_lighter, rgba(220, 241, 236, 1))"},darkgreen:{default:"var(--amplify_dataviz_darkgreen_default, rgba(0, 102, 76, 1))",darker:"var(--amplify_dataviz_darkgreen_darker, rgba(0, 61, 46, 1))",lighter:"var(--amplify_dataviz_darkgreen_lighter, rgba(200, 237, 227, 1))"},darkpink:{default:"var(--amplify_dataviz_darkpink_default, rgba(169, 30, 88, 1))",darker:"var(--amplify_dataviz_darkpink_darker, rgba(135, 18, 67, 1))",lighter:"var(--amplify_dataviz_darkpink_lighter, rgba(252, 212, 229, 1))"},lightpink:{default:"var(--amplify_dataviz_lightpink_default, rgba(255, 128, 138, 1))",darker:"var(--amplify_dataviz_lightpink_darker, rgba(225, 81, 93, 1))",lighter:"var(--amplify_dataviz_lightpink_lighter, rgba(255, 219, 222, 1))"},darkyellow:{default:"var(--amplify_dataviz_darkyellow_default, rgba(160, 112, 28, 1))",darker:"var(--amplify_dataviz_darkyellow_darker, rgba(121, 85, 21, 1))",lighter:"var(--amplify_dataviz_darkyellow_lighter, rgba(244, 226, 195, 1))"},lightyellow:{default:"var(--amplify_dataviz_lightyellow_default, rgba(253, 203, 53, 1))",darker:"var(--amplify_dataviz_lightyellow_darker, rgba(227, 171, 2, 1))",lighter:"var(--amplify_dataviz_lightyellow_lighter, rgba(255, 240, 194, 1))"},darkpurple:{default:"var(--amplify_dataviz_darkpurple_default, rgba(147, 20, 219, 1))",darker:"var(--amplify_dataviz_darkpurple_darker, rgba(97, 1, 152, 1))",lighter:"var(--amplify_dataviz_darkpurple_lighter, rgba(232, 209, 246, 1))"},lightpurple:{default:"var(--amplify_dataviz_lightpurple_default, rgba(186, 153, 255, 1))",darker:"var(--amplify_dataviz_lightpurple_darker, rgba(155, 89, 242, 1))",lighter:"var(--amplify_dataviz_lightpurple_lighter, rgba(234, 224, 255, 1))"},darkgray:{default:"var(--amplify_dataviz_darkgray_default, rgba(122, 122, 122,1))",darker:"var(--amplify-dataviz_darkgray_darker, rgba(86, 86, 86,1))",lighter:"var(--amplify-dataviz_darkgray_lighter, rgba(173, 173, 173, 1))"},lightgray:{default:"var(--amplify_dataviz_lightgray_default, rgba(144, 155, 162, 1))",darker:"var(--amplify_dataviz_lightgray_darker, rgba(91, 102, 108, 1))",lighter:"var(--amplify_dataviz_lightgray_lighter,  rgba(194, 200, 204, 1))"}}},l={warning:i.interactive.warning__resting.rgba,error:i.interactive.danger__resting.rgba,success:i.interactive.success__resting.rgba,dirty:i.infographic.substitute__blue_ocean.rgba};export{l as VARIANT_COLORS,i as colors};
+import{tokens as a}from"../../node_modules/@equinor/eds-tokens/dist/esm/base/index.js";const{colors:r}=a,i={...r,dataviz:{darkblue:{default:"var(--amplify_dataviz_darkblue_default, rgba(0, 71, 153, 1))",darker:"var(--amplify_dataviz_darkblue_darker, rgba(4, 48, 98, 1))",lighter:"var(--amplify_dataviz_darkblue_lighter, rgba(191, 220, 252, 1))"},lightblue:{default:"var(--amplify_dataviz_lightblue_default, rgba(133, 208, 250, 1))",darker:"var(--amplify_dataviz_lightblue_darker, rgba(35, 170, 246, 1))",lighter:"var(--amplify_dataviz_lightblue_lighter, rgba(211, 238, 253, 1))"},lightgreen:{default:"var(--amplify_dataviz_lightgreen_default, rgba(10, 194, 154, 1))",darker:"var(--amplify_dataviz_lightgreen_darker, rgba(8, 145, 115, 1))",lighter:"var(--amplify_dataviz_lightgreen_lighter, rgba(220, 241, 236, 1))"},darkgreen:{default:"var(--amplify_dataviz_darkgreen_default, rgba(0, 102, 76, 1))",darker:"var(--amplify_dataviz_darkgreen_darker, rgba(0, 61, 46, 1))",lighter:"var(--amplify_dataviz_darkgreen_lighter, rgba(200, 237, 227, 1))"},darkpink:{default:"var(--amplify_dataviz_darkpink_default, rgba(169, 30, 88, 1))",darker:"var(--amplify_dataviz_darkpink_darker, rgba(135, 18, 67, 1))",lighter:"var(--amplify_dataviz_darkpink_lighter, rgba(252, 212, 229, 1))"},lightpink:{default:"var(--amplify_dataviz_lightpink_default, rgba(255, 128, 138, 1))",darker:"var(--amplify_dataviz_lightpink_darker, rgba(225, 81, 93, 1))",lighter:"var(--amplify_dataviz_lightpink_lighter, rgba(255, 219, 222, 1))"},darkyellow:{default:"var(--amplify_dataviz_darkyellow_default, rgba(160, 112, 28, 1))",darker:"var(--amplify_dataviz_darkyellow_darker, rgba(121, 85, 21, 1))",lighter:"var(--amplify_dataviz_darkyellow_lighter, rgba(244, 226, 195, 1))"},lightyellow:{default:"var(--amplify_dataviz_lightyellow_default, rgba(253, 203, 53, 1))",darker:"var(--amplify_dataviz_lightyellow_darker, rgba(227, 171, 2, 1))",lighter:"var(--amplify_dataviz_lightyellow_lighter, rgba(255, 240, 194, 1))"},darkpurple:{default:"var(--amplify_dataviz_darkpurple_default, rgba(147, 20, 219, 1))",darker:"var(--amplify_dataviz_darkpurple_darker, rgba(97, 1, 152, 1))",lighter:"var(--amplify_dataviz_darkpurple_lighter, rgba(232, 209, 246, 1))"},lightpurple:{default:"var(--amplify_dataviz_lightpurple_default, rgba(186, 153, 255, 1))",darker:"var(--amplify_dataviz_lightpurple_darker, rgba(155, 89, 242, 1))",lighter:"var(--amplify_dataviz_lightpurple_lighter, rgba(234, 224, 255, 1))"},darkgray:{default:"var(--amplify_dataviz_darkgray_default, rgba(122, 122, 122,1))",darker:"var(--amplify-dataviz_darkgray_darker, rgba(86, 86, 86,1))",lighter:"var(--amplify-dataviz_darkgray_lighter, rgba(173, 173, 173, 1))"},lightgray:{default:"var(--amplify_dataviz_lightgray_default, rgba(144, 155, 162, 1))",darker:"var(--amplify_dataviz_lightgray_darker, rgba(91, 102, 108, 1))",lighter:"var(--amplify_dataviz_lightgray_lighter,  rgba(194, 200, 204, 1))"}}},e={warning:i.interactive.warning__resting.rgba,error:i.interactive.danger__resting.rgba,success:i.interactive.success__resting.rgba,dirty:i.infographic.substitute__blue_ocean.rgba},l={warning:i.interactive.warning__hover.rgba,error:i.interactive.danger__hover.rgba,success:i.interactive.success__hover.rgba,dirty:i.infographic.substitute__blue_ocean.rgba};export{e as VARIANT_COLORS,l as VARIANT_HELPER_COLORS,i as colors};

package/dist/molecules/Select/ComboBox/ComboBox.d.ts

@@ -1,6 +1,12 @@
 import { CommonSelectProps, GroupedSelectProps, ListSelectProps, MultiSelectCommon, SelectOptionRequired } from '../Select.types';
 export type ComboBoxProps<T extends SelectOptionRequired> = CommonSelectProps & MultiSelectCommon<T> & (GroupedSelectProps<T> | ListSelectProps<T>);
 /**
+ * @param clearable - If users should be able to clear the input, defaults to true
+ * @param loading - Show loader, defaults to false
+ * @param lightBackground - If the input should have white background, defaults to false
+ * @param sortValues - Sort the provided values, defaults to true
+ * @param inDialog - Fixes weird issue that EDS menus has when it's used in dialogs, defaults to false
+ * @param showHelperIcon - Show helper variant icon, defaults to true
  * @param syncParentChildSelection - Syncs parents/child selections, default is true
  */
 export declare function ComboBox<T extends SelectOptionRequired>(props: ComboBoxProps<T>): import("react/jsx-runtime").JSX.Element;

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

package/dist/molecules/Select/Select.styles.js

@@ -1,23 +1,26 @@
-import{Button as t,Menu as e,Typography as r}from"@equinor/eds-core-react";export{Button}from"@equinor/eds-core-react";import{VARIANT_COLORS as a,colors as i}from"../../atoms/style/colors.js";import{spacings as o}from"../../atoms/style/spacings.js";import{Chip as n}from"../Chip/Chip.js";import s,{css as l}from"styled-components";const d=s.div`
+import{Button as t,Menu as e,Typography as r}from"@equinor/eds-core-react";export{Button}from"@equinor/eds-core-react";import{VARIANT_HELPER_COLORS as a,colors as i,VARIANT_COLORS as o}from"../../atoms/style/colors.js";import{spacings as n}from"../../atoms/style/spacings.js";import{Chip as s}from"../Chip/Chip.js";import l,{css as d}from"styled-components";const c=l.div`
   display: flex;
   flex-direction: column;
-  gap: ${o.small};
-`,c=s.span`
+  gap: ${n.small};
+`,p=l.span`
   display: flex;
-  gap: ${o.small};
+  gap: ${n.small};
   align-items: center;
-  margin-left: ${o.small};
-  width: calc(100% - ${o.small});
+  margin-left: ${n.small};
+  width: calc(100% - ${n.small});
   > label {
     margin: 0;
   }
-  ${({$variant:t})=>t?l`
+  ${({$variant:t})=>t?d`
+      > label {
+        color: ${a[t]};
+      }
       > svg {
         flex-shrink: 0;
         fill: ${a[t]};
       }
     `:""}
-`,p=s.div`
+`,g=l.div`
   position: relative;
   display: grid;
   grid-template-columns: 1fr auto;
@@ -27,17 +30,17 @@ import{Button as t,Menu as e,Typography as r}from"@equinor/eds-core-react";expor
     cursor: pointer;
   }
 
-  ${({$variant:t})=>t?"dirty"===t?l`
-        box-shadow: inset 0 -2px 0 0 ${a[t]};
+  ${({$variant:t})=>t?"dirty"===t?d`
+        box-shadow: inset 0 -2px 0 0 ${o[t]};
         &:hover {
-          box-shadow: inset 0 -2px 0 0 ${a[t]};
+          box-shadow: inset 0 -2px 0 0 ${o[t]};
         }
-      `:l`
-      outline: 1px solid ${a[t]};
+      `:d`
+      outline: 1px solid ${o[t]};
       &:hover {
-        box-shadow: inset 0 -1px 0 0 ${a[t]};
+        box-shadow: inset 0 -1px 0 0 ${o[t]};
       }
-    `:l`
+    `:d`
         box-shadow: inset 0 -1px 0 0 ${i.text.static_icons__tertiary.rgba};
         &:hover {
           box-shadow: inset 0 -2px 0 0 ${i.text.static_icons__tertiary.rgba};
@@ -85,11 +88,11 @@ import{Button as t,Menu as e,Typography as r}from"@equinor/eds-core-react";expor
       width: calc(100% - 24px);
     }
   }
-`,g=s.section`
+`,b=l.section`
   position: relative;
   display: flex;
   flex-wrap: wrap;
-  gap: ${o.x_small};
+  gap: ${n.x_small};
   min-height: 24px;
   input[type='search'] {
     background: transparent;
@@ -127,7 +130,7 @@ import{Button as t,Menu as e,Typography as r}from"@equinor/eds-core-react";expor
       }
     }
   }
-`,b=s(t)`
+`,h=l(t)`
   position: absolute;
   top: 50%;
   transform: translate(0, -50%);
@@ -142,9 +145,9 @@ import{Button as t,Menu as e,Typography as r}from"@equinor/eds-core-react";expor
     height: 24px;
     left: 0;
   }
-`,h=s(n)`
+`,u=l(s)`
   background: ${({$tryingToRemove:t,$lightBackground:e})=>t?i.interactive.primary__hover_alt.rgba:e?i.ui.background__light.rgba:i.ui.background__default.rgba} !important;
-`,u=s(e.Item)`
+`,x=l(e.Item)`
   flex-grow: 1;
   border-radius: 2px;
   ${({$paddedLeft:t})=>t&&"margin-left: 36px"};
@@ -162,26 +165,26 @@ import{Button as t,Menu as e,Typography as r}from"@equinor/eds-core-react";expor
   &:focus-visible {
     outline: 2px dashed ${i.interactive.primary__resting.rgba};
   }
-`,x=s.hr`
-  height: calc(100% + ${o.medium} * 2);
+`,m=l.hr`
+  height: calc(100% + ${n.medium} * 2);
   justify-self: center;
-  width: ${o.x_large};
-`,m=s(r)`
+  width: ${n.x_large};
+`,_=l(r)`
   position: absolute;
   color: ${i.text.static_icons__tertiary.rgba};
   top: calc(50%);
   transform: translate(0, -50%);
-`,_=s(m)`
+`,f=l(_)`
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
   color: ${i.text.static_icons__default.rgba};
   max-width: 100%;
-`,f=s(r)`
-  margin: ${o.medium};
-`,$=s(r)`
-  margin-left: ${o.medium};
-`,v=s(e)`
+`,$=l(r)`
+  margin: ${n.medium};
+`,v=l(r)`
+  margin-left: ${n.medium};
+`,w=l(e)`
   max-height: 20rem;
   max-width: inherit;
   overflow-y: auto;
@@ -189,11 +192,11 @@ import{Button as t,Menu as e,Typography as r}from"@equinor/eds-core-react";expor
     width: inherit;
     max-width: inherit;
   }
-`,w=s.div`
+`,y=l.div`
   display: flex;
   align-items: center;
-  padding: 0 ${o.small};
-`,y=s(t)`
+  padding: 0 ${n.small};
+`,k=l(t)`
   width: 36px;
   height: 36px;
-`;export{b as ClearButton,p as Container,c as HelperWrapper,x as MenuItemSpacer,w as MenuItemWrapper,$ as NoItemsFoundText,f as NoTagFoundText,m as PlaceholderText,g as Section,y as SmallButton,h as StyledChip,v as StyledMenu,u as StyledMenuItem,_ as ValueText,d as Wrapper};
+`;export{h as ClearButton,g as Container,p as HelperWrapper,m as MenuItemSpacer,y as MenuItemWrapper,v as NoItemsFoundText,$ as NoTagFoundText,_ as PlaceholderText,b as Section,k as SmallButton,u as StyledChip,w as StyledMenu,x as StyledMenuItem,f as ValueText,c as Wrapper};

package/dist/molecules/Select/Select.types.d.ts

@@ -58,6 +58,7 @@ export interface CommonSelectProps {
     variant?: Variants;
     label?: string;
     helperText?: string;
+    showHelperIcon?: boolean;
     placeholder?: string;
     sortValues?: boolean;
     disabled?: boolean;

package/dist/molecules/Select/SingleSelect/SingleSelect.d.ts

@@ -1,3 +1,11 @@
 import { CommonSelectProps, GroupedSelectProps, ListSelectProps, SelectOptionRequired, SingleSelectCommon } from '../Select.types';
 export type SingleSelectProps<T extends SelectOptionRequired> = CommonSelectProps & SingleSelectCommon<T> & (GroupedSelectProps<T> | ListSelectProps<T>);
+/**
+ * @param clearable - If users should be able to clear the input, defaults to true
+ * @param loading - Show loader, defaults to false
+ * @param lightBackground - If the input should have white background, defaults to false
+ * @param sortValues - Sort the provided values, defaults to true
+ * @param inDialog - Fixes weird issue that EDS menus has when it's used in dialogs, defaults to false
+ * @param showHelperIcon - Show helper variant icon, defaults to true
+ */
 export declare function SingleSelect<T extends SelectOptionRequired>(props: SingleSelectProps<T>): import("react/jsx-runtime").JSX.Element;

package/dist/molecules/TextField/TextField.js

@@ -1,7 +1,10 @@
-import{jsx as t}from"react/jsx-runtime";import{TextField as i}from"@equinor/eds-core-react";import{colors as e,VARIANT_COLORS as r}from"../../atoms/style/colors.js";import o,{css as a}from"styled-components";const n=o.div`
+import{jsx as t}from"react/jsx-runtime";import{TextField as i}from"@equinor/eds-core-react";import{colors as e,VARIANT_COLORS as o}from"../../atoms/style/colors.js";import r,{css as a}from"styled-components";const n=r.div`
   input,
   textarea {
     color: ${e.text.static_icons__default.rgba};
+    &::placeholder {
+      opacity: 1;
+    }
   }
   div:focus-within {
     outline: none !important;
@@ -30,13 +33,13 @@ import{jsx as t}from"react/jsx-runtime";import{TextField as i}from"@equinor/eds-
       ${"dirty"===t&&a`
         input,
         textarea {
-          box-shadow: inset 0 -2px 0 0 ${r[t]};
+          box-shadow: inset 0 -2px 0 0 ${o[t]};
         }
       `}
 
       input:hover,
       textarea:hover {
-        box-shadow: inset 0 -${"dirty"===t?2:1}px 0 0 ${r[t]};
+        box-shadow: inset 0 -${"dirty"===t?2:1}px 0 0 ${o[t]};
       }
 
       div:focus-within {
@@ -44,8 +47,8 @@ import{jsx as t}from"react/jsx-runtime";import{TextField as i}from"@equinor/eds-
 
         input,
         textarea {
-          box-shadow: inset 0 -2px 0 0 ${r[t]};
+          box-shadow: inset 0 -2px 0 0 ${o[t]};
         }
       }
     `}
-`,s=e=>{const r={...e,variant:"dirty"!==e.variant?e.variant:void 0};return t(n,{$variant:e.variant,$disabled:e.disabled,children:t(i,{...r})})};export{s as TextField};
+`,s=e=>{const o={...e,variant:"dirty"!==e.variant?e.variant:void 0};return t(n,{$variant:e.variant,$disabled:e.disabled,children:t(i,{...o})})};export{s as TextField};

package/dist/organisms/Template/Template.js

@@ -1,4 +1,4 @@
-import{tokens as o}from"../../node_modules/@equinor/eds-tokens/dist/esm/base/index.js";import"../../atoms/style/colors.js";import{spacings as i}from"../../atoms/style/spacings.js";import{darkTokens as e}from"../../atoms/style/darkTokens.js";import{lightTokens as t}from"../../atoms/style/lightTokens.js";import{spacingTokens as n}from"../../atoms/style/spacingTokens.js";import s,{createGlobalStyle as a}from"styled-components";const{colors:r}=o,d=s.div`
+import{tokens as o}from"../../node_modules/@equinor/eds-tokens/dist/esm/base/index.js";import"../../atoms/style/colors.js";import{spacings as i}from"../../atoms/style/spacings.js";import{darkTokens as t}from"../../atoms/style/darkTokens.js";import{lightTokens as e}from"../../atoms/style/lightTokens.js";import{spacingTokens as n}from"../../atoms/style/spacingTokens.js";import s,{createGlobalStyle as a}from"styled-components";const{colors:r}=o,d=s.div`
   display: flex;
   flex-direction: column;
   min-height: 100vh;
@@ -12,18 +12,19 @@ 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;
-  /* 231px and 64px is width of Sidebar when open/closed, + 1px because of border */
-  min-width: calc(
-    100% - ${o=>o.$open?"232px":"65px"} -
-      ${i.xxx_large} * 2
-  );
+  /* 231px and 64px is width of Sidebar when open/closed */
+  min-width: calc(100% - ${o=>o.$open?"231px":"64px"});
   &:not(:has(.select-field)) {
     padding: 0 ${i.xxx_large};
   }
 `,c=a`
-  ${e}
   ${t}
+  ${e}
   ${n}
+  
+  * {
+      box-sizing: border-box;
+  }
 
   button {
     border: none;

package/package.json

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