@equinor/amplify-component-lib 8.7.5 → 8.8.1

package/dist/atoms/hooks/useSelect.d.ts

@@ -12,8 +12,7 @@ declare const useSelect: <T extends SelectOptionRequired>(props: SelectComponent
     handleToggleOpen: () => void;
     handleOnClose: () => void;
     handleOnOpen: () => void;
-    handleOnRemoveItem: (item: T) => void;
-    handleOnMouseEnterItem: (index: number) => void;
+    handleOnRemoveItem: (item: SelectOption<T>) => void;
     search: string;
     searchRef: import("react").MutableRefObject<HTMLInputElement | null>;
     itemRefs: import("react").MutableRefObject<(HTMLButtonElement | null)[]>;

package/dist/atoms/hooks/useSelect.js

@@ -1 +1 @@
-import{useState as e,useRef as n,useMemo as r,useEffect as t}from"react";const l=l=>{const{loading:u,disabled:a,sortValues:c,onSearchChange:o,onOpenCallback:d}=l,[s,v]=e(!1),[i,h]=e(""),m=n(null),f=n([]),p=n(-1),[g,y]=e(void 0),k=n(!1),I=n(0),O=r((()=>{let e,n=[];return"values"in l?n=l.values:l.value&&(n=[l.value]),c?(e=l.groups?l.groups.flatMap((e=>e.items)):l.items.flatMap((e=>[{...e},...e.children||[]])),n.sort(((n,r)=>e.findIndex((e=>e.value===n.value))-e.findIndex((e=>e.value===r.value))))):n}),[l,c]);t((()=>{void 0!==d&&d(s)}),[d,s]),t((()=>{k.current&&I.current!==O.length&&(I.current=O.length,k.current=!1,m.current?.focus())}),[O.length]);const A=()=>{s||a||u||(m.current?.focus(),v(!0))},S=()=>{v(!1),h(""),p.current=0},w=e=>{!("values"in l)||u||a||l.onSelect(l.values.filter((n=>n.value!==e.value)),e)};return{handleOnAddItem:()=>{"onAddItem"in l&&l.onAddItem&&(l.onAddItem(i),h(""))},handleOnItemSelect:e=>{"value"in l?l.onSelect(e):l.onSelect(((e,n)=>{const r=structuredClone(e);return r.some((e=>e.value===n.value))?r.filter((e=>e.value!==n.value)):[n,...r.filter((e=>void 0===e.children||0===e.children.length||e.children.every((e=>e.value===n.value))))]})(l.values,e),e),""!==i&&h(""),k.current=!0},handleOnItemKeyDown:e=>{"ArrowDown"===e.key&&p.current<f.current.length-1?(p.current+=1,f.current.at(p.current)?.focus()):"ArrowUp"===e.key&&p.current>0?(p.current-=1,f.current.at(p.current)?.focus()):"ArrowUp"===e.key&&0===p.current&&(p.current=-1,m.current?.focus())},handleOnSearchKeyDown:e=>{"Enter"===e.key&&""!==i&&"onAddItem"in l&&l.onAddItem?(l.onAddItem(i),h("")):"Space"===e.key||"Enter"===e.key?A():"Escape"===e.key?(m.current?.blur(),S()):"ArrowDown"!==e.key&&"ArrowUp"!==e.key||!f.current.at(0)?"Backspace"===e.key&&void 0===g&&"values"in l&&""===i?y(O?.at(-1)):"Backspace"===e.key&&g&&(w(g),y(void 0)):(f.current[0]?.focus(),p.current=0)},handleOnClear:()=>{"value"in l?l.onSelect(void 0):l.onSelect([])},handleOnSearchChange:e=>{" "===e.target.value||u||a||(h(e.target.value),o?.(e.target.value),s||v(!0))},handleToggleOpen:()=>{a||u||(s?S():A())},handleOnClose:S,handleOnOpen:A,handleOnRemoveItem:w,handleOnMouseEnterItem:e=>{p.current=e,f.current.at(e)?.focus()},search:i,searchRef:m,itemRefs:f,selectedValues:O,open:s,tryingToRemoveItem:g}};export{l as useSelect};
+import{useState as e,useRef as n,useMemo as r,useEffect as t}from"react";import{flattenOptions as l}from"../../molecules/Select/Select.utils.js";const a=a=>{const{loading:u,disabled:c,sortValues:o,onSearchChange:d,onOpenCallback:s}=a,[i,v]=e(!1),[h,m]=e(""),p=n(null),f=n([]),g=n(-1),[y,k]=e(void 0),S=n(!1),I=n(0),A=r((()=>{let e,n=[];return"values"in a?n=a.values:a.value&&(n=[a.value]),o?(e=a.groups?a.groups.flatMap((e=>e.items)):a.items.flatMap((e=>[{...e},...e.children||[]])),n.sort(((n,r)=>e.findIndex((e=>e.value===n.value))-e.findIndex((e=>e.value===r.value))))):n}),[a,o]);t((()=>{void 0!==s&&s(i)}),[s,i]),t((()=>{S.current&&I.current!==A.length&&(I.current=A.length,S.current=!1,p.current?.focus())}),[A.length]);const O=()=>{i||c||u||(p.current?.focus(),v(!0))},w=()=>{v(!1),m(""),g.current=0},C=e=>{!("values"in a)||u||c||a.onSelect(a.values.filter((n=>n.value!==e.value)),e)};return{handleOnAddItem:()=>{"onAddItem"in a&&a.onAddItem&&(a.onAddItem(h),m(""))},handleOnItemSelect:e=>{"value"in a?a.onSelect(e):a.onSelect(((e,n)=>{const r=structuredClone(e);return r.some((e=>e.value===n.value))?r.filter((e=>e.value!==n.value)):"values"in a&&void 0!==a.syncParentChildSelection&&!a.syncParentChildSelection?[n,...r]:[n,...r.filter((e=>(!(void 0===n.children||n.children.length>0)||!l([n]).some((n=>n.value===e.value)))&&(void 0===e.children||0===e.children.length||l([e]).every((e=>e.value!==n.value)))))]})(a.values,e),e),""!==h&&m(""),S.current=!0},handleOnItemKeyDown:e=>{"ArrowDown"===e.key&&g.current<f.current.length-1?(g.current+=1,f.current.at(g.current)?.focus()):"ArrowUp"===e.key&&g.current>0?(g.current-=1,f.current.at(g.current)?.focus()):"ArrowUp"===e.key&&0===g.current&&(g.current=-1,p.current?.focus())},handleOnSearchKeyDown:e=>{"Enter"===e.key&&""!==h&&"onAddItem"in a&&a.onAddItem?(a.onAddItem(h),m("")):"Space"===e.key||"Enter"===e.key?O():"Escape"===e.key?(p.current?.blur(),w()):"ArrowDown"!==e.key&&"ArrowUp"!==e.key||!f.current.at(0)?"Backspace"===e.key&&void 0===y&&"values"in a&&""===h?k(A?.at(-1)):"Backspace"===e.key&&y&&(C(y),k(void 0)):(f.current[0]?.focus(),g.current=0)},handleOnClear:()=>{"value"in a?a.onSelect(void 0):a.onSelect([])},handleOnSearchChange:e=>{" "===e.target.value||u||c||(m(e.target.value),d?.(e.target.value),i||v(!0))},handleToggleOpen:()=>{c||u||(i?w():O())},handleOnClose:w,handleOnOpen:O,handleOnRemoveItem:C,search:h,searchRef:p,itemRefs:f,selectedValues:A,open:i,tryingToRemoveItem:y}};export{a as useSelect};

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/AddTagItem.d.ts

@@ -2,7 +2,6 @@ import { FC } from 'react';
 import { MultiSelectMenuItemProps, SelectOptionRequired } from './Select.types';
 interface AddTagItemProps {
     itemRefs: MultiSelectMenuItemProps<SelectOptionRequired>['itemRefs'];
-    onMouseEnterItem: MultiSelectMenuItemProps<SelectOptionRequired>['onMouseEnterItem'];
     onItemKeyDown: MultiSelectMenuItemProps<SelectOptionRequired>['onItemKeyDown'];
     onAddItem: () => void;
     index: number;

package/dist/molecules/Select/AddTagItem.js

@@ -1 +1 @@
-import{jsx as e,jsxs as r}from"react/jsx-runtime";import{Icon as o}from"@equinor/eds-core-react";import{add_box as t}from"@equinor/eds-icons";import{colors as n}from"../../atoms/style/colors.js";import{MenuItemWrapper as i,StyledMenuItem as s}from"./Select.styles.js";const m=({itemRefs:m,onMouseEnterItem:c,onItemKeyDown:a,index:d,onAddItem:l,children:p})=>e(i,{children:r(s,{index:d,ref:e=>{m.current[d]=e},onClick:l,onKeyDownCapture:e=>{e.preventDefault(),"Enter"===e.key?l():a(e)},onMouseEnter:()=>{c(d)},children:[e(o,{data:t,color:n.interactive.primary__resting.rgba}),r("span",{children:['Add "',p,'" as new tag']})]})});export{m as AddTagItem};
+import{jsx as e,jsxs as r}from"react/jsx-runtime";import{Icon as o}from"@equinor/eds-core-react";import{add_box as t}from"@equinor/eds-icons";import{colors as n}from"../../atoms/style/colors.js";import{MenuItemWrapper as i,StyledMenuItem as m}from"./Select.styles.js";const s=({itemRefs:s,onItemKeyDown:c,index:a,onAddItem:d,children:l})=>e(i,{children:r(m,{index:a,ref:e=>{s.current[a]=e},onClick:d,onKeyDownCapture:e=>{e.preventDefault(),"Enter"===e.key?d():c(e)},children:[e(o,{data:t,color:n.interactive.primary__resting.rgba}),r("span",{children:['Add "',l,'" as new tag']})]})});export{s as AddTagItem};

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

@@ -1,3 +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/GroupedSelectMenu.js

@@ -1 +1 @@
-import{jsx as e}from"react/jsx-runtime";import{useMemo as t}from"react";import{Menu as i}from"@equinor/eds-core-react";import{NoItemsFoundText as m}from"./Select.styles.js";import{getCumulativeArrayFromNumberedArray as n}from"./Select.utils.js";import{SelectMenuItem as o}from"./SelectMenuItem.js";const l=l=>{const{onItemSelect:r,onItemKeyDown:s,itemRefs:c,groups:u,search:a,onMouseEnterItem:f}=l,p=t((()=>{if(""===a)return u;const e=new RegExp(a,"i");return u.map((t=>({title:t.title,items:t.items.filter((t=>t.label.match(e)))}))).filter((e=>e.items.length>0))}),[u,a]),d=t((()=>{const e=p.map((e=>e.items.length));return n(e)}),[p]);return 0===p.length?e(m,{children:"No items found"}):"values"in l?p.map(((t,m)=>e(i.Section,{index:m,title:t.title,children:t.items.map(((i,n)=>e(o,{index:n+d[m],childOffset:0,item:i,multiselect:!0,itemRefs:c,onItemKeyDown:s,onItemSelect:r,onMouseEnterItem:f,values:l.values},`${t.title}-${m}-item-${i.value}`)))},`${t.title}-${m}`))):p.map(((t,m)=>e(i.Section,{index:m,title:t.title,children:t.items.map(((i,n)=>e(o,{index:n+d[m],childOffset:0,item:i,itemRefs:c,onItemKeyDown:s,onItemSelect:r,onMouseEnterItem:f},`${t.title}-${m}-item-${i.value}`)))},`${t.title}-${m}`)))};export{l as GroupedSelectMenu};
+import{jsx as e}from"react/jsx-runtime";import{useMemo as t}from"react";import{Menu as i}from"@equinor/eds-core-react";import{NoItemsFoundText as m}from"./Select.styles.js";import{getCumulativeArrayFromNumberedArray as l}from"./Select.utils.js";import{SelectMenuItem as n}from"./SelectMenuItem.js";const r=r=>{const{onItemSelect:o,onItemKeyDown:s,itemRefs:c,groups:a,search:f}=r,u=t((()=>{if(""===f)return a;const e=new RegExp(f,"i");return a.map((t=>({title:t.title,items:t.items.filter((t=>t.label.match(e)))}))).filter((e=>e.items.length>0))}),[a,f]),p=t((()=>{const e=u.map((e=>e.items.length));return l(e)}),[u]);return 0===u.length?e(m,{children:"No items found"}):"values"in r?u.map(((t,m)=>e(i.Section,{index:m,title:t.title,children:t.items.map(((i,l)=>e(n,{index:l+p[m],childOffset:0,item:i,multiselect:!0,itemRefs:c,onItemKeyDown:s,onItemSelect:o,values:r.values},`${t.title}-${m}-item-${i.value}`)))},`${t.title}-${m}`))):u.map(((t,m)=>e(i.Section,{index:m,title:t.title,children:t.items.map(((i,l)=>e(n,{index:l+p[m],childOffset:0,item:i,itemRefs:c,onItemKeyDown:s,onItemSelect:o},`${t.title}-${m}-item-${i.value}`)))},`${t.title}-${m}`)))};export{r as GroupedSelectMenu};

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

@@ -1,2 +1,2 @@
 import { ListSelectProps, MultiSelectCommon, SelectMenuProps, SelectOptionRequired, SingleSelectCommon } from './Select.types';
-export declare const ListSelectMenu: <T extends SelectOptionRequired>(props: ListSelectProps<T> & SelectMenuProps<T> & (Omit<MultiSelectCommon<T>, "onAddItem"> | SingleSelectCommon<T>)) => import("react/jsx-runtime").JSX.Element | import("react/jsx-runtime").JSX.Element[];
+export declare const ListSelectMenu: <T extends SelectOptionRequired>(props: ListSelectProps<T> & SelectMenuProps<T> & (Omit<MultiSelectCommon<T>, "onAddItem" | "syncParentChildSelection"> | SingleSelectCommon<T>)) => import("react/jsx-runtime").JSX.Element | import("react/jsx-runtime").JSX.Element[];

package/dist/molecules/Select/ListSelectMenu.js

@@ -1 +1 @@
-import{jsx as e,jsxs as t,Fragment as n}from"react/jsx-runtime";import{useMemo as m}from"react";import{Menu as o}from"@equinor/eds-core-react";import{AddTagItem as i}from"./AddTagItem.js";import{NoItemsFoundText as r,NoTagFoundText as l}from"./Select.styles.js";import{flattenOptions as s,getChildOffset as a}from"./Select.utils.js";import{SelectMenuItem as c}from"./SelectMenuItem.js";const d=d=>{const{search:u,items:f,onItemSelect:I,itemRefs:h,onItemKeyDown:p,onMouseEnterItem:x,selectableParent:g}=d,S=m((()=>{if(""===u)return f;const e=new RegExp(u,"i");return s(f).map((({value:e,label:t})=>({value:e,label:t}))).filter((t=>t.label.match(e)))}),[f,u]);if(0===S.length&&!d.onAddItem)return e(r,{children:"No items found"});const v=S.some((e=>e.children&&e.children.length>0));if("values"in d){const m=S.map(((e,t)=>({childOffset:a(S,t),index:t,item:e,itemRefs:h,onItemKeyDown:p,onItemSelect:I,onMouseEnterItem:x,itemValue:e.value,values:d.values,selectableParent:g,parentHasNestedItems:v})));return"onAddItem"in d&&d.onAddItem&&""!==u?t(n,{children:[e(o.Section,{title:"Add tag",index:0,children:e(i,{index:0,itemRefs:h,onItemKeyDown:p,onMouseEnterItem:x,onAddItem:d.onAddItem,children:u})}),e(o.Section,{title:"Tag search results",index:1,children:m.length>0?m.map(((t,n)=>e(c,{multiselect:!0,...t,index:n+1},`menu-item-${n}-${t.itemValue}`))):t(l,{children:['No tag for "',u,'" found.']})})]}):m.map(((t,n)=>e(c,{multiselect:!0,...t},`menu-item-${n}-${t.itemValue}`)))}return S.map(((t,n)=>e(c,{childOffset:a(S,n),index:n,item:t,itemRefs:h,onItemKeyDown:p,onItemSelect:I,onMouseEnterItem:x,selectableParent:g,parentHasNestedItems:v},`menu-item-${n}-${t.value}`)))};export{d as ListSelectMenu};
+import{jsx as e,jsxs as t,Fragment as n}from"react/jsx-runtime";import{useMemo as m}from"react";import{Menu as i}from"@equinor/eds-core-react";import{AddTagItem as o}from"./AddTagItem.js";import{NoItemsFoundText as r,NoTagFoundText as l}from"./Select.styles.js";import{flattenOptions as s,getChildOffset as d}from"./Select.utils.js";import{SelectMenuItem as a}from"./SelectMenuItem.js";const c=c=>{const{search:u,items:f,onItemSelect:h,itemRefs:p,onItemKeyDown:I}=c,x=m((()=>{if(""===u)return f;const e=new RegExp(u,"i");return s(f).map((({value:e,label:t})=>({value:e,label:t}))).filter((t=>t.label.match(e)))}),[f,u]);if(0===x.length&&!c.onAddItem)return e(r,{children:"No items found"});const g=x.some((e=>e.children&&e.children.length>0));if("values"in c){const m=x.map(((e,t)=>({childOffset:d(x,t),index:t,item:e,itemRefs:p,onItemKeyDown:I,onItemSelect:h,itemValue:e.value,values:c.values,parentHasNestedItems:g})));return"onAddItem"in c&&c.onAddItem&&""!==u?t(n,{children:[e(i.Section,{title:"Add tag",index:0,children:e(o,{index:0,itemRefs:p,onItemKeyDown:I,onAddItem:c.onAddItem,children:u})}),e(i.Section,{title:"Tag search results",index:1,children:m.length>0?m.map(((t,n)=>e(a,{multiselect:!0,...t,index:n+1},`menu-item-${n}-${t.itemValue}`))):t(l,{children:['No tag for "',u,'" found.']})})]}):m.map(((t,n)=>e(a,{multiselect:!0,...t},`menu-item-${n}-${t.itemValue}`)))}return x.map(((t,n)=>e(a,{childOffset:d(x,n),index:n,item:t,itemRefs:p,onItemKeyDown:I,onItemSelect:h,parentHasNestedItems:g},`menu-item-${n}-${t.value}`)))};export{c as ListSelectMenu};

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 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{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:M=!0,placeholder:_="Select...",label:q,helperText:E,meta:T,id:z=`amplify-combobox-${q}`,variant:A,inDialog:V=!1}=u,{handleOnAddItem:W,handleOnClear:F,handleOnItemKeyDown:H,handleOnItemSelect:P,handleOnSearchChange:G,handleOnSearchKeyDown:L,handleToggleOpen:N,itemRefs:J,search:Q,selectedValues:U,handleOnClose:X,handleOnOpen:Y,handleOnRemoveItem:Z,handleOnMouseEnterItem:ee,open:te,searchRef:ne,tryingToRemoveItem:oe}=p({...u,clearable:j,loading:D,disabled:R,lightBackground:B,underlineHighlight:K,sortValues:M,placeholder:_}),re=n(null),le=n(null),ae=o((()=>!!q||!!T),[q,T]),ie=o((()=>!!E),[E]),ce=o((()=>{switch(A){case"error":return s;case"warning":return c;case"success":return i}}),[A]);w(le.current,(e=>{V&&te&&e.target&&re.current&&le.current&&!re.current.contains(e.target)&&!le.current?.contains(e.target)&&X()}));const se=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:oe?.value===t.value,$lightBackground:B,children:t.label},t.value)))),[U,oe,B,u,Z]);return t("div",{children:[ae&&e(r,{label:q,meta:T,htmlFor:z}),t(x,{children:[t(y,{"data-testid":"combobox-container",ref:re,onClick:Y,"aria-expanded":te,$variant:A,$lightBackground:B,children:[t(I,{children:[""===Q&&0===U.length&&e(O,{children:_}),(""===Q||"values"in u&&U.length>0)&&se,e("input",{id:z,disabled:R||D,ref:ne,type:"search",role:"combobox",value:Q,autoComplete:"off",onChange:G,onKeyDownCapture:L})]}),D?e(l,{size:16}):e(a,{onClick:N,data:te?d:m,color:$.interactive.primary__resting.rgba}),j&&U.length>0&&!D&&e(k,{id:"clear",variant:"ghost_icon",onClick:F,"data-testid":"clearBtn",children:e(a,{data:h,size:18})})]}),ie&&t(C,{$variant:A,children:[ce&&e(a,{data:ce,size:16}),e(r,{label:E,htmlFor:z})]})]}),te&&e(S,{ref:le,open:!0,id:"combobox-menu",anchorEl:re.current,onClose:X,placement:"bottom",style:{width:`${re.current?.clientWidth}px`,maxWidth:`${re.current?.clientWidth}px`},children:u.groups?e(g,{...u,search:Q,itemRefs:J,onItemSelect:P,onItemKeyDown:H,onMouseEnterItem:ee}):e(b,{...u,search:Q,itemRefs:J,onAddItem:"values"in u&&u.onAddItem?W:void 0,onItemSelect:P,onItemKeyDown:H,onMouseEnterItem:ee,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 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;
   }
-`,u=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;
-`,h=s(e.Item)`
+`,x=l(e.Item)`
   flex-grow: 1;
   border-radius: 2px;
   ${({$paddedLeft:t})=>t&&"margin-left: 36px"};
@@ -156,37 +159,32 @@ import{Button as t,Menu as e,Typography as r}from"@equinor/eds-core-react";expor
   }
 
   &:hover {
-    background: none;
-  }
-
-  &:focus {
-    outline: none;
     background: ${i.interactive.primary__hover_alt.rgba};
   }
 
   &:focus-visible {
-    background: ${i.interactive.primary__hover_alt.rgba};
+    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};
-`,v=s(r)`
-  margin-left: ${o.medium};
-`,$=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;
@@ -194,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,v as NoItemsFoundText,f as NoTagFoundText,m as PlaceholderText,g as Section,y as SmallButton,u as StyledChip,$ as StyledMenu,h 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

@@ -14,7 +14,7 @@ export interface SingleSelectCommon<T extends SelectOptionRequired> {
 export interface MultiSelectCommon<T extends SelectOptionRequired> {
     values: SelectOption<T>[];
     onSelect: (values: SelectOption<T>[], selectedValue?: SelectOption<T>) => void;
-    selectableParent?: boolean;
+    syncParentChildSelection?: boolean;
     onAddItem?: (item: string) => void;
 }
 export interface GroupedSelectProps<T extends SelectOptionRequired> {
@@ -34,8 +34,6 @@ export interface SelectMenuProps<T extends SelectOptionRequired> {
     itemRefs: MutableRefObject<(HTMLButtonElement | null)[]>;
     onItemKeyDown: (event: KeyboardEvent<HTMLButtonElement>) => void;
     onItemSelect: (item: SelectOption<T>) => void;
-    onMouseEnterItem: (index: number) => void;
-    selectableParent?: boolean;
 }
 interface SelectMenuItemProps<T extends SelectOptionRequired> {
     item: SelectOption<T>;
@@ -60,6 +58,7 @@ export interface CommonSelectProps {
     variant?: Variants;
     label?: string;
     helperText?: string;
+    showHelperIcon?: boolean;
     placeholder?: string;
     sortValues?: boolean;
     disabled?: boolean;

package/dist/molecules/Select/SelectMenuItem.js

@@ -1 +1 @@
-import{jsx as e,jsxs as r,Fragment as n}from"react/jsx-runtime";import{useState as t,useRef as o,useMemo as c}from"react";import{Icon as i}from"@equinor/eds-core-react";import{checkbox_outline as l,checkbox as a,checkbox_indeterminate as u,chevron_down as s,chevron_right as d}from"@equinor/eds-icons";import{tokens as m}from"../../node_modules/@equinor/eds-tokens/dist/esm/base/index.js";import{MenuItemSpacer as p,MenuItemWrapper as h,SmallButton as f,StyledMenuItem as v}from"./Select.styles.js";import{getChildOffset as y,flattenOptions as g}from"./Select.utils.js";const{colors:w}=m,k=m=>{const{index:b,childOffset:_,depth:x=0,item:C,multiselect:I,itemRefs:A,onItemKeyDown:D,onMouseEnterItem:$,onItemSelect:M,selectableParent:E=!0,parentHasNestedItems:K=!1}=m,[j,O]=t(!1),S=o(-1),q=o([]),P=("values"in m?m.values.map((({value:e})=>e)):[]).includes(C.value),R=c((()=>{if(!I||!C.children||0===C.children.length)return l;if(P)return a;if([C,...C.children].some((e=>m.values.find((r=>r.value===e.value)))))return u;const e=m.values.map((({value:e})=>e)),r=g([C])?.map((({value:e})=>e));return r.some((r=>e.includes(r)))?u:l}),[C,I,m,P]),H=c((()=>new Array(x).fill(0).map(((r,n)=>e(p,{},`spacer-${r+n}`)))),[x]),L=()=>{if(M(C),!I)return void O((e=>!e));const e=!m.values.map((({value:e})=>e)).includes(C.value);O(e)},N=()=>{$(b)},U=e=>{e.stopPropagation(),O((e=>!e))},z=e=>{"ArrowDown"===e.key?S.current+=1:"ArrowUp"===e.key&&(S.current-=1),S.current<=-1?(A.current[b]?.focus(),S.current=-1):S.current+_===q.current.length?(S.current=-1,D(e),O(!1)):S.current>=0&&S.current<q.current.length-_&&q.current[S.current+_]?.focus()},B=e=>{j||"ArrowDown"!==e.key&&"ArrowUp"!==e.key?"ArrowRight"===e.key||"ArrowLeft"===e.key?O((e=>!e)):j&&"ArrowDown"===e.key&&-1===S.current&&(S.current=0,q.current[S.current+_]?.focus()):D(e)},F=e=>{S.current=e,q.current.at(e)?.focus()};return C.children&&C.children.length>0&&I?r(n,{children:[r(h,{children:[H,e(f,{variant:"ghost_icon",onClick:U,"data-testid":"toggle-button",children:e(i,{color:w.interactive.primary__resting.rgba,data:j?s:d})}),r(v,{$depth:x,ref:e=>{A.current[b]=e},index:b,closeMenuOnClick:!1,onKeyDownCapture:B,onMouseEnter:N,onClick:L,children:[e(i,{color:E?w.interactive.primary__resting.rgba:w.interactive.disabled__fill.rgba,data:R}),e("span",{children:C.label})]})]}),j&&C.children.map(((r,n)=>e(k,{index:_+n,childOffset:_+y(C.children,n),depth:x+1,multiselect:!0,item:r,itemRefs:q,values:m.values,onItemKeyDown:z,onItemSelect:M,onMouseEnterItem:F,selectableParent:E,parentHasNestedItems:!0},`child-${n}-${r.value}-${C.value}`)))]}):I?r(h,{children:[H,r(v,{$depth:x,$paddedLeft:K,ref:e=>{A.current[b]=e},index:b,tabIndex:x,closeMenuOnClick:!1,onKeyDownCapture:D,onClick:L,onMouseEnter:N,children:[e(i,{color:w.interactive.primary__resting.rgba,data:P?a:l}),e("span",{children:C.label})]})]}):e(h,{children:e(v,{$depth:x,ref:e=>{A.current[b]=e},index:b,onKeyDownCapture:D,onClick:L,onMouseEnter:N,children:e("span",{children:C.label})})})};export{k as SelectMenuItem};
+import{jsx as e,jsxs as r,Fragment as n}from"react/jsx-runtime";import{useState as t,useRef as i,useMemo as c}from"react";import{Icon as o}from"@equinor/eds-core-react";import{checkbox_outline as l,checkbox as a,checkbox_indeterminate as u,chevron_down as s,chevron_right as d}from"@equinor/eds-icons";import{tokens as m}from"../../node_modules/@equinor/eds-tokens/dist/esm/base/index.js";import{MenuItemSpacer as p,MenuItemWrapper as h,SmallButton as f,StyledMenuItem as v}from"./Select.styles.js";import{getChildOffset as y,flattenOptions as w}from"./Select.utils.js";const{colors:g}=m,k=m=>{const{index:b,childOffset:x,depth:C=0,item:A,multiselect:D,itemRefs:$,onItemKeyDown:_,onItemSelect:I,parentHasNestedItems:K=!1}=m,[j,O]=t(!1),S=i(-1),q=i([]),R=("values"in m?m.values.map((({value:e})=>e)):[]).includes(A.value),H=c((()=>{if(!D||!A.children||0===A.children.length)return l;if(R)return a;if([A,...A.children].some((e=>m.values.find((r=>r.value===e.value)))))return u;const e=m.values.map((({value:e})=>e)),r=w([A])?.map((({value:e})=>e));return r.some((r=>e.includes(r)))?u:l}),[A,D,m,R]),L=c((()=>new Array(C).fill(0).map(((r,n)=>e(p,{},`spacer-${r+n}`)))),[C]),M=()=>{I(A)},N=e=>{e.stopPropagation(),O((e=>!e))},U=e=>{"ArrowDown"===e.key?S.current+=1:"ArrowUp"===e.key&&(S.current-=1),S.current<=-1?($.current[b]?.focus(),S.current=-1):S.current+x===q.current.length?(S.current=-1,_(e),O(!1)):S.current>=0&&S.current<q.current.length-x&&q.current[S.current+x]?.focus()},P=e=>{!j&&"ArrowDown"===e.key||"ArrowUp"===e.key?_(e):"ArrowRight"===e.key||"ArrowLeft"===e.key?O((e=>!e)):j&&"ArrowDown"===e.key&&-1===S.current&&(S.current=0,q.current[S.current+x]?.focus())};return A.children&&A.children.length>0&&D?r(n,{children:[r(h,{children:[L,e(f,{variant:"ghost_icon",onClick:N,"data-testid":"toggle-button",children:e(o,{color:g.interactive.primary__resting.rgba,data:j?s:d})}),r(v,{$depth:C,ref:e=>{$.current[b]=e},index:b,closeMenuOnClick:!1,onKeyDownCapture:P,onClick:M,children:[e(o,{color:g.interactive.primary__resting.rgba,data:H}),e("span",{children:A.label})]})]}),j&&A.children.map(((r,n)=>e(k,{index:x+n,childOffset:x+y(A.children,n),depth:C+1,multiselect:!0,item:r,itemRefs:q,values:m.values,onItemKeyDown:U,onItemSelect:I,parentHasNestedItems:!0},`child-${n}-${r.value}-${A.value}`)))]}):D?r(h,{children:[L,r(v,{$depth:C,$paddedLeft:K,ref:e=>{$.current[b]=e},index:b,tabIndex:C,closeMenuOnClick:!1,onKeyDownCapture:_,onClick:M,children:[e(o,{color:g.interactive.primary__resting.rgba,data:R?a:l}),e("span",{children:A.label})]})]}):e(h,{children:e(v,{$depth:C,ref:e=>{$.current[b]=e},index:b,onKeyDownCapture:_,onClick:M,children:e("span",{children:A.label})})})};export{k as SelectMenuItem};

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/TableOfContents/TableOfContents.constants.js

@@ -1 +1 @@
-import"../../atoms/style/colors.js";import{spacings as o}from"../../atoms/style/spacings.js";const s={buttons:"39px",border:"34px"},t={buttons:o.x_small,border:"0"};export{t as GAP,s as HEIGHT};
+import"../../atoms/style/colors.js";import{spacings as o}from"../../atoms/style/spacings.js";const r={buttons:"39px",border:"34px",borderHorizontal:"34px"},t={buttons:o.x_small,border:"0",borderHorizontal:"0"};export{t as GAP,r as HEIGHT};

package/dist/organisms/TableOfContents/TableOfContents.js

@@ -1 +1 @@
-import{jsx as e}from"react/jsx-runtime";import{useMemo as t}from"react";import{TableOfContentsContainer as r,BorderItemsContainer as o}from"./TableOfContents.styles.js";import{TableOfContentsItem as n}from"./TableOfContentsItem.js";import{useTableOfContents as i}from"../../providers/TableOfContentsProvider.js";import{getValues as a}from"../../providers/TableOfContentsProvider.utils.js";const s=({variant:s="buttons",onlyShowSelectedChildren:l=!0,isLink:d=!1})=>{const{items:m,selected:c}=i(),u=t((()=>{for(const[e,t]of m.entries()){const r=a([],t);if(t.value===c||c&&r.includes(c))return e}return-1}),[m,c]);return e(r,"border"===s?{className:"page-menu",$variant:s,layoutRoot:!0,children:m.map(((t,r)=>e(o,{"data-testid":`border-items-container-${t.value}`,$index:r,$activeIndex:u,"aria-selected":u===r,children:e(n,{variant:s,...t,onlyShowSelectedChildren:l,isLink:d})},t.value)))}:{className:"page-menu",$variant:s,layoutRoot:!0,children:m.map((t=>e(n,{variant:s,...t,onlyShowSelectedChildren:l,isLink:d},t.value)))})};export{s as TableOfContents};
+import{jsx as e}from"react/jsx-runtime";import{useMemo as t}from"react";import{TableOfContentsContainer as n,BorderItemsContainer as r,BorderItemsHorizontalContainer as a}from"./TableOfContents.styles.js";import{TableOfContentsItem as o}from"./TableOfContentsItem.js";import{useTableOfContents as i}from"../../providers/TableOfContentsProvider.js";import{getValues as l}from"../../providers/TableOfContentsProvider.utils.js";const s=({variant:s="buttons",onlyShowSelectedChildren:d=!0,isLink:c=!1})=>{const{items:m,selected:u}=i(),v=t((()=>{for(const[e,t]of m.entries()){const n=l([],t);if(t.value===u||u&&n.includes(u))return e}return-1}),[m,u]);return e(n,"border"===s?{className:"page-menu",$variant:s,layoutRoot:!0,"data-testid":"table-of-contents-container",children:m.map(((t,n)=>e(r,{"data-testid":`border-items-container-${t.value}`,$index:n,$activeIndex:v,"aria-selected":v===n,children:e(o,{variant:s,...t,onlyShowSelectedChildren:d,isLink:c})},t.value)))}:"borderHorizontal"===s?{className:"page-menu",$variant:s,layoutRoot:!0,"data-testid":"table-of-contents-container",children:m.map(((t,n)=>e(a,{$index:n,$activeIndex:v,"aria-selected":v===n,children:e(o,{variant:s,...t,onlyShowSelectedChildren:d,isLink:c})},t.value)))}:{className:"page-menu",$variant:s,layoutRoot:!0,children:m.map((t=>e(o,{variant:s,...t,onlyShowSelectedChildren:d,isLink:c},t.value)))})};export{s as TableOfContents};

package/dist/organisms/TableOfContents/TableOfContents.styles.d.ts

@@ -10,6 +10,11 @@ interface LinkProps extends ButtonProps {
 export declare const Link: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<Omit<import("react-router-dom").LinkProps & import("react").RefAttributes<HTMLAnchorElement>, "ref"> & {
     ref?: ((instance: HTMLAnchorElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLAnchorElement> | null | undefined;
 }, LinkProps>> & string & Omit<import("react").ForwardRefExoticComponent<import("react-router-dom").LinkProps & import("react").RefAttributes<HTMLAnchorElement>>, keyof import("react").Component<any, {}, any>>;
+interface BorderItemsHorizontalContainerProps {
+    $activeIndex: number;
+    $index: number;
+}
+export declare const BorderItemsHorizontalContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, BorderItemsHorizontalContainerProps>> & string;
 interface BorderItemsContainerProps {
     $activeIndex: number;
     $index: number;

package/dist/organisms/TableOfContents/TableOfContents.styles.js

@@ -110,6 +110,20 @@ import{Link as t}from"react-router-dom";import{tokens as e}from"../../node_modul
           }
         `}}}
 `,u=a.div`
+  display: flex;
+  flex-direction:;
+  position: relative;
+  &:after {
+    position: absolute;
+    left: 0;
+    bottom: ${({$activeIndex:t,$index:e})=>100*(t-e)+"%"};
+    content: '';
+    width: 100%;
+    height: 2px;
+    background: ${s.interactive.primary__resting.rgba};
+    z-index: 100;
+  }
+`,f=a.div`
   display: flex;
   flex-direction: column;
   position: relative;
@@ -123,7 +137,7 @@ import{Link as t}from"react-router-dom";import{tokens as e}from"../../node_modul
     background: ${s.interactive.primary__resting.rgba};
     z-index: 100;
   }
-`,f=a(r.div)`
+`,p=a(r.div)`
   display: flex;
   flex-direction: column;
   position: relative;
@@ -131,9 +145,9 @@ import{Link as t}from"react-router-dom";import{tokens as e}from"../../node_modul
     min-height: ${o[t]};
     ${"buttons"===t&&`gap: ${i.x_small};`}
   `}
-`,p=a(r.div)`
+`,g=a(r.div)`
   display: flex;
-  flex-direction: column;
+  flex-direction: ${({$variant:t})=>"borderHorizontal"===t?"row":"column"};
   height: fit-content;
   overflow: hidden;
   ${({$variant:t})=>{switch(t){case"buttons":return`gap: ${i.small};`;case"border":return n`
@@ -145,8 +159,19 @@ import{Link as t}from"react-router-dom";import{tokens as e}from"../../node_modul
             height: 100%;
             background: ${s.ui.background__medium.rgba};
           }
+        `;case"borderHorizontal":return n`
+          &:after {
+            position: absolute;
+            left: 0;
+            bottom: 0;
+            content: '';
+            width: 100%;
+            height: 2px;
+            background: ${s.ui.background__medium.rgba};
+          }
         `}}}
-`,m=a(r.div)`
+  data-testid="table-of-contents-container"
+`,b=a(r.div)`
   display: flex;
   flex-direction: column;
   ${({$shouldShowChildren:t})=>t?null:n`
@@ -162,4 +187,4 @@ import{Link as t}from"react-router-dom";import{tokens as e}from"../../node_modul
   }
 
   ${({$variant:t})=>"buttons"===t&&`gap:${i.x_small};`}
-`;export{u as BorderItemsContainer,d as Button,m as ChildContainer,c as Link,p as TableOfContentsContainer,f as TableOfContentsItemContainer};
+`;export{f as BorderItemsContainer,u as BorderItemsHorizontalContainer,d as Button,b as ChildContainer,c as Link,g as TableOfContentsContainer,p as TableOfContentsItemContainer};

package/dist/organisms/TableOfContents/TableOfContents.types.d.ts

@@ -1 +1 @@
-export type TableOfContentsVariants = 'buttons' | 'border';
+export type TableOfContentsVariants = 'buttons' | 'border' | 'borderHorizontal';

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/dist/organisms/TopBar/Account/ImpersonateMenu/CreateNewUser/CreateNewUser.js

@@ -1 +1 @@
-import{jsxs as e,jsx as o}from"react/jsx-runtime";import{useState as r,useMemo as t}from"react";import{Button as i,Icon as s,Typography as l,DotProgress as m}from"@equinor/eds-core-react";import{arrow_back as a}from"@equinor/eds-icons";import{useAllAppRoles as n}from"../hooks/useAllAppRoles.js";import{useCreateImpersonation as p}from"../hooks/useCreateImpersonation.js";import{Container as c,Header as u,Section as d}from"./CreateNewUser.styles.js";import{environment as j}from"../../../../../atoms/utils/auth_environment.js";import"../../../../../molecules/AnimatedCheckmark/AnimatedCheckmark.styles.js";import"../../../../../molecules/ApplicationIcon/ApplicationIcon.js";import"../../../../../molecules/Badge/Badge.styles.js";import"../../../../../molecules/Banner/Banner.styles.js";import"../../../../../molecules/Chip/Chip.js";import"../../../../../molecules/ContentMenu/ContentMenu.js";import"../../../../../molecules/Dialog/Dialog.styles.js";import"../../../../../molecules/EquinorLogo/EquinorLogo.js";import"../../../../../atoms/style/colors.js";import"../../../../../molecules/FileProgress/CompactFileProgress.styles.js";import"../../../../../molecules/RichTextEditor/custom-extensions/AmplifyKit.js";import"../../../../../molecules/RichTextEditor/MenuBar/MenuBar.js";import"@tiptap/react";import"../../../../../molecules/RichTextEditor/RichTextEditor.styles.js";import"../../../../../molecules/RichTextEditor/RichTextEditor.types.js";import"../../../../../node_modules/lodash/lodash.js";import"@equinor/subsurface-app-management";import"@microsoft/signalr";import"@tanstack/react-query";import"../../../../../atoms/enums/Environment.js";import"../../../Notifications/NotificationProvider.js";import"../../../../../providers/AuthProvider/AuthProvider.js";import"../../../../../providers/ReleaseNotesProvider.js";import"../../../../../providers/SideBarProvider.js";import"../../../../../providers/SnackbarProvider/SnackbarProvider.js";import"../../../../../providers/TableOfContentsProvider.js";import"../../../../../providers/ThemeProvider/ThemeProvider.js";import"../../../../../providers/TutorialStepsProvider.js";import"../../../../../atoms/enums/Errors.js";import"../../../../../atoms/enums/Theme.js";import"../../../../ErrorPage/illustrations/GlitchAnimation.js";import"../../../../ErrorPage/illustrations/QuestioningAnimation.js";import"proj4";import"html2canvas";import"../../../../../molecules/FileProgress/RegularFileProgress.styles.js";import"../../../../../molecules/FileUploadArea/FileUploadArea.js";import"../../../../../molecules/FullPageSpinner/FullPageSpinner.js";import"../../../../../molecules/InfoElement/InfoElement.js";import"../../../../../molecules/OptionalTooltip/OptionalTooltip.js";import"../../../../../molecules/ProfileAvatar/ProfileAvatar.js";import"../../../../../molecules/RichTextEditor/MenuBar/MenuBar.styles.js";import"../../../../../molecules/RichTextEditor/MenuBar/MenuButton.js";import"../../../../../molecules/Search/Search.js";import"react-router-dom";import"../../../../../molecules/Sieve/Sieve.styles.js";import"../../../../../molecules/SingleFilterMenu/SingleFilterMenu.js";import"../../../../../molecules/Skeleton/SkeletonBase/SkeletonBase.js";import"../../../../../molecules/Stepper/Stepper.js";import"../../../../../molecules/OptionDrawer/OptionDrawer.js";import"../../../../../molecules/Select/Select.styles.js";import"../../../../../molecules/ListItem/ListItem.js";import"../../../../../molecules/SelectionControls/Checkbox/Checkbox.js";import"../../../../../molecules/SelectionControls/Radio/Radio.js";import{Switch as h}from"../../../../../molecules/SelectionControls/Switch/Switch.js";import{TextField as v}from"../../../../../molecules/TextField/TextField.js";const g=({onBack:g,onClose:C})=>{const[f,S]=r([]),[P,A]=r(""),[k,y]=r(""),{data:E,isLoading:T}=n(),{mutateAsync:x,isPending:B}=p(),R=t((()=>""===P||""===k||0===f.length),[P,k,f.length]);return e(c,{children:[e(u,{children:[o(i,{variant:"ghost_icon",onClick:g,children:o(s,{data:a})}),o(l,{variant:"h6",children:"Create new user"})]}),e(d,{children:[o(v,{id:"first-name",label:"First name",placeholder:"Add first name...",value:P,onChange:e=>{A(e.target.value)}}),o(v,{id:"last-name",label:"Last name",placeholder:"Add last name...",value:k,onChange:e=>{y(e.target.value)}})]}),e(d,{children:[o(l,{variant:"label",group:"navigation",children:"Roles"}),T&&o(m,{color:"primary"}),E?.map((e=>o(h,{label:e.value,onChange:()=>(e=>{S((o=>o.includes(e)?o.filter((o=>o!==e)):[...o,e]))})(e.value)},e.id)))]}),e(d,{children:[o(i,{variant:"outlined",onClick:g,children:"Cancel"}),o(i,B?{children:o(m,{})}:{onClick:async()=>{await x({firstName:P,lastName:k,roles:f,uniqueName:`${P}.${k}`.toLowerCase(),appName:j.getAppName(import.meta.env.VITE_NAME),activeUsers:[]}),C()},disabled:R,children:"Create and impersonate"})]})]})};export{g as CreateNewUser};
+import{jsxs as e,jsx as o}from"react/jsx-runtime";import{useState as r,useMemo as t}from"react";import{Button as i,Icon as s,Typography as l,DotProgress as m}from"@equinor/eds-core-react";import{arrow_back as a}from"@equinor/eds-icons";import{useAllAppRoles as n}from"../hooks/useAllAppRoles.js";import{useCreateImpersonation as p}from"../hooks/useCreateImpersonation.js";import{Container as c,Header as u,Section as d}from"./CreateNewUser.styles.js";import{environment as j}from"../../../../../atoms/utils/auth_environment.js";import"../../../../../molecules/AnimatedCheckmark/AnimatedCheckmark.styles.js";import"../../../../../molecules/ApplicationIcon/ApplicationIcon.js";import"../../../../../molecules/Badge/Badge.styles.js";import"../../../../../molecules/Banner/Banner.styles.js";import"../../../../../molecules/Chip/Chip.js";import"../../../../../molecules/ContentMenu/ContentMenu.js";import"../../../../../molecules/Dialog/Dialog.styles.js";import"../../../../../molecules/EquinorLogo/EquinorLogo.js";import"../../../../../atoms/style/colors.js";import"../../../../../molecules/FileProgress/CompactFileProgress.styles.js";import"../../../../../molecules/RichTextEditor/custom-extensions/AmplifyKit.js";import"../../../../../molecules/RichTextEditor/MenuBar/MenuBar.js";import"@tiptap/react";import"../../../../../molecules/RichTextEditor/RichTextEditor.styles.js";import"../../../../../molecules/RichTextEditor/RichTextEditor.types.js";import"../../../../../node_modules/lodash/lodash.js";import"@equinor/subsurface-app-management";import"@microsoft/signalr";import"@tanstack/react-query";import"../../../../../atoms/enums/Environment.js";import"../../../Notifications/NotificationProvider.js";import"../../../../../providers/AuthProvider/AuthProvider.js";import"../../../../../providers/ReleaseNotesProvider.js";import"../../../../../providers/SideBarProvider.js";import"../../../../../providers/SnackbarProvider/SnackbarProvider.js";import"../../../../../providers/TableOfContentsProvider.js";import"../../../../../providers/ThemeProvider/ThemeProvider.js";import"../../../../../providers/TutorialStepsProvider.js";import"../../../../../atoms/enums/Errors.js";import"../../../../../atoms/enums/Theme.js";import"../../../../ErrorPage/illustrations/GlitchAnimation.js";import"../../../../ErrorPage/illustrations/QuestioningAnimation.js";import"proj4";import"html2canvas";import"../../../../../molecules/FileProgress/RegularFileProgress.styles.js";import"../../../../../molecules/FileUploadArea/FileUploadArea.js";import"../../../../../molecules/FullPageSpinner/FullPageSpinner.js";import"../../../../../molecules/InfoElement/InfoElement.js";import"../../../../../molecules/OptionalTooltip/OptionalTooltip.js";import"../../../../../molecules/ProfileAvatar/ProfileAvatar.js";import"../../../../../molecules/RichTextEditor/MenuBar/MenuBar.styles.js";import"../../../../../molecules/RichTextEditor/MenuBar/MenuButton.js";import"../../../../../molecules/Search/Search.js";import"react-router-dom";import"../../../../../molecules/Sieve/Sieve.styles.js";import"../../../../../molecules/SingleFilterMenu/SingleFilterMenu.js";import"../../../../../molecules/Skeleton/SkeletonBase/SkeletonBase.js";import"../../../../../molecules/Stepper/Stepper.js";import"../../../../../molecules/OptionDrawer/OptionDrawer.js";import{ComboBox as h}from"../../../../../molecules/Select/ComboBox/ComboBox.js";import"../../../../../molecules/Select/Select.styles.js";import"../../../../../molecules/ListItem/ListItem.js";import"../../../../../molecules/SelectionControls/Checkbox/Checkbox.js";import"../../../../../molecules/SelectionControls/Radio/Radio.js";import"../../../../../molecules/SelectionControls/Switch/Switch.js";import{TextField as v}from"../../../../../molecules/TextField/TextField.js";const g=({onBack:g,onClose:C})=>{const[S,f]=r([]),[P,A]=r(""),[k,y]=r(""),{data:E,isLoading:T}=n(),x=t((()=>E?.map((e=>({value:e.value,label:e.value})))??[]),[E]),{mutateAsync:B,isPending:R}=p(),b=t((()=>""===P||""===k||0===S.length),[P,k,S.length]);return e(c,{children:[e(u,{children:[o(i,{variant:"ghost_icon",onClick:g,children:o(s,{data:a})}),o(l,{variant:"h6",children:"Create new user"})]}),e(d,{children:[o(v,{id:"first-name",label:"First name",placeholder:"Add first name...",value:P,onChange:e=>{A(e.target.value)}}),o(v,{id:"last-name",label:"Last name",placeholder:"Add last name...",value:k,onChange:e=>{y(e.target.value)}})]}),e(d,{children:[o(l,{variant:"label",group:"navigation",children:"Roles"}),T&&o(m,{color:"primary"}),o(h,{placeholder:"Select roles...",values:S,onSelect:e=>{f(e)},items:x})]}),e(d,{children:[o(i,{variant:"outlined",onClick:g,children:"Cancel"}),o(i,R?{children:o(m,{})}:{onClick:async()=>{await B({firstName:P,lastName:k,roles:S.map((e=>e.value)).sort(),uniqueName:`${P}.${k}`.toLowerCase(),appName:j.getAppName(import.meta.env.VITE_NAME),activeUsers:[]}),C()},disabled:b,children:"Create and impersonate"})]})]})};export{g as CreateNewUser};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@equinor/amplify-component-lib",
-  "version": "8.7.5",
+  "version": "8.8.1",
   "description": "Frontend Typescript components for the Amplify team",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -141,7 +141,7 @@
     "eslint-plugin-storybook": "^0.8.0",
     "jest-environment-jsdom": "^29.7.0",
     "jest-styled-components": "^7.2.0",
-    "msw": "^2.3.5",
+    "msw": "^2.4.9",
     "msw-storybook-addon": "^2.0.3",
     "ora": "^8.1.0",
     "prettier": "^3.3.3",