@equinor/amplify-component-lib 9.16.0-beta.0 → 9.16.0-beta.1

package/dist/organisms/FieldSelector/SelectorCard/SelectorCard.js

@@ -1,4 +1,4 @@
-import e,{useMemo as t,useState as n}from"react";import{jsx as r,jsxs as i}from"react/jsx-runtime";import{arrow_forward as a}from"@equinor/eds-icons";import o from"styled-components";import{Button as s,Card as c,Icon as l,Typography as u}from"@equinor/eds-core-react";import{colors as d,elevation as f,shape as p,spacings as m}from"src/atoms/style";import{SingleSelect as h}from"src/molecules/Select/SingleSelect/SingleSelect";const g=o(c)`
+import{colors as e}from"../../../atoms/style/colors.js";import{spacings as t}from"../../../atoms/style/spacings.js";import{elevation as n,shape as r}from"../../../atoms/style/index.js";import{SingleSelect as i}from"../../../molecules/Select/SingleSelect/SingleSelect.js";import a,{useMemo as o,useState as s}from"react";import{Button as c,Card as l,Icon as u,Typography as d}from"@equinor/eds-core-react";import f from"styled-components";import{jsx as p,jsxs as m}from"react/jsx-runtime";import{arrow_forward as h}from"@equinor/eds-icons";const g=f(l)`
   position: absolute;
   left: 50%;
   top: 50%;
@@ -7,51 +7,51 @@ import e,{useMemo as t,useState as n}from"react";import{jsx as r,jsxs as i}from"
   transform: translate(-50%, -50%);
   width: 25rem;
   height: auto;
-  padding: ${m.large};
-  box-shadow: ${f.above_scrim};
-  border-radius: ${p.corners.borderRadius};
+  padding: ${t.large};
+  box-shadow: ${n.above_scrim};
+  border-radius: ${r.corners.borderRadius};
   display: flex;
   flex-direction: column;
-  gap: ${m.large};
+  gap: ${t.large};
   > h3 {
-    color: ${d.text.static_icons__default.rgba};
+    color: ${e.text.static_icons__default.rgba};
   }
   > div {
     display: flex;
     flex-direction: column;
-    gap: ${m.large};
+    gap: ${t.large};
     section {
       display: grid;
       grid-template-columns: 1fr auto;
       align-items: flex-end;
-      grid-gap: ${m.medium};
+      grid-gap: ${t.medium};
     }
   }
-`,_=o.div`
+`,_=f.div`
   display: flex;
   flex-direction: column;
-  gap: ${m.small};
+  gap: ${t.small};
   > h6 {
     text-transform: capitalize;
   }
-`,v=o.a`
-  padding: ${m.small} ${m.medium};
+`,v=f.a`
+  padding: ${t.small} ${t.medium};
   transition: background-color 200ms ease;
   font-size: 14px;
   line-height: 16px;
   font-weight: 500;
-  border-radius: ${p.corners.borderRadius};
+  border-radius: ${r.corners.borderRadius};
   text-decoration: none;
-  color: ${d.text.static_icons__default.rgba};
+  color: ${e.text.static_icons__default.rgba};
   &:focus-within {
-    outline: ${d.interactive.primary__resting.rgba} dashed 2px;
+    outline: ${e.interactive.primary__resting.rgba} dashed 2px;
   }
   &:active {
     outline: 0;
-    background-color: ${d.interactive.primary__selected_highlight.rgba};
+    background-color: ${e.interactive.primary__selected_highlight.rgba};
   }
   &:hover {
-    background-color: ${d.interactive.primary__hover_alt.rgba};
+    background-color: ${e.interactive.primary__hover_alt.rgba};
     cursor: pointer;
   }
-`,y=({availableFields:e,onSelect:o,itemNameSingular:c,showAccessITLink:d=!0})=>{let[f,p]=n(),m=()=>{f!==void 0&&o({name:f.name,uuid:f.uuid,country:f.country})},y=e=>{p(e)},b=t(()=>{let t=[];for(let n of e)n.name?t.push({label:n.name,value:n.name,...n}):console.error(`Field with no name found!:`,n);return t},[e]);return i(g,{children:[i(u,{variant:`h3`,children:[`Please select a `,c]}),i(`div`,{children:[i(`section`,{children:[r(h,{lightBackground:!0,value:f,items:b,placeholder:`Select a ${c}...`,onSelect:y}),r(s,{"data-testid":`nextButton`,variant:`contained_icon`,disabled:f===void 0,onClick:m,children:r(l,{data:a})})]}),d&&i(_,{children:[i(u,{variant:`overline`,children:[`Missing a `,c,`?`]}),r(v,{tabIndex:0,"data-testid":`missing-access`,href:`https://accessit.equinor.com/#`,target:`_blank`,children:`Go to AccessIT`})]})]})]})};export{y as SelectorCard};
+`,y=({availableFields:e,onSelect:t,itemNameSingular:n,showAccessITLink:r=!0})=>{let[a,l]=s(),f=()=>{a!==void 0&&t({name:a.name,uuid:a.uuid,country:a.country})},y=e=>{l(e)},b=o(()=>{let t=[];for(let n of e)n.name?t.push({label:n.name,value:n.name,...n}):console.error(`Field with no name found!:`,n);return t},[e]);return m(g,{children:[m(d,{variant:`h3`,children:[`Please select a `,n]}),m(`div`,{children:[m(`section`,{children:[p(i,{lightBackground:!0,value:a,items:b,placeholder:`Select a ${n}...`,onSelect:y}),p(c,{"data-testid":`nextButton`,variant:`contained_icon`,disabled:a===void 0,onClick:f,children:p(u,{data:h})})]}),r&&m(_,{children:[m(d,{variant:`overline`,children:[`Missing a `,n,`?`]}),p(v,{tabIndex:0,"data-testid":`missing-access`,href:`https://accessit.equinor.com/#`,target:`_blank`,children:`Go to AccessIT`})]})]})]})};export{y as SelectorCard};

package/dist/organisms/FieldSelector/SelectorCard/Skeleton.js

@@ -1,4 +1,4 @@
-import{tokens as e}from"../../../node_modules/@equinor/eds-tokens/dist/esm/base/index.js";import t from"react";import{jsx as n,jsxs as r}from"react/jsx-runtime";import i from"styled-components";import{Card as a}from"@equinor/eds-core-react";import{spacings as o}from"src/atoms/style";import{SkeletonBase as s}from"src/molecules/Skeleton/SkeletonBase/SkeletonBase";const{elevation:c,shape:l}=e,u=i(a)`
+import{tokens as e}from"../../../node_modules/@equinor/eds-tokens/dist/esm/base/index.js";import{spacings as t}from"../../../atoms/style/spacings.js";import{SkeletonBase as n}from"../../../molecules/Skeleton/SkeletonBase/SkeletonBase.js";import r from"react";import{Card as i}from"@equinor/eds-core-react";import a from"styled-components";import{jsx as o,jsxs as s}from"react/jsx-runtime";const{elevation:c,shape:l}=e,u=a(i)`
   position: absolute;
   left: 50%;
   top: 50%;
@@ -7,18 +7,18 @@ import{tokens as e}from"../../../node_modules/@equinor/eds-tokens/dist/esm/base/
   transform: translate(-50%, -50%);
   width: 25rem;
   align-items: center;
-  padding: ${o.large};
+  padding: ${t.large};
   box-shadow: ${c.raised};
   border-radius: ${l.corners.borderRadius};
   display: flex;
   flex-direction: row;
   justify-content: space-between;
-`,d=i(s)`
-  width: calc((25rem - 2 * ${o.large}) * 0.8);
+`,d=a(n)`
+  width: calc((25rem - 2 * ${t.large}) * 0.8);
   height: calc(${l.button.minHeight});
-`,f=i(s)`
+`,f=a(n)`
   width: ${l.icon_button.minWidth};
   height: ${l.icon_button.minHeight};
 
   border-radius: ${l.icon_button.borderRadius};
-`,p=()=>r(u,{children:[n(d,{role:`busy`}),n(f,{role:`busy`})]});export{p as SelectorSkeleton};
+`,p=()=>s(u,{children:[o(d,{role:`busy`}),o(f,{role:`busy`})]});export{p as SelectorSkeleton};

package/dist/organisms/Filter/AutoCompleteMenu.js

@@ -0,0 +1,10 @@
+import{colors as e}from"../../atoms/style/colors.js";import{findStartAndEndIndexOfSearch as t,getFilteredAutoCompleteOptions as n}from"./Filter.utils.js";import{useEffect as r,useRef as i,useState as a}from"react";import{Menu as o,Typography as s}from"@equinor/eds-core-react";import{styled as c}from"styled-components";import{jsx as l}from"react/jsx-runtime";const u=c(o)`
+  overflow-y: auto;
+  max-height: 250px;
+`,d=c(s)`
+  color: ${e.text.static_icons__tertiary.rgba};
+  > strong {
+    color: ${e.text.static_icons__default.rgba};
+    font-weight: unset;
+  }
+`;function f({anchorElement:e,searchElement:s,search:c,isFilterOpen:f,autoCompleteOptions:p,onAutoComplete:m}){let[h,g]=a(!1),_=i(``);r(()=>{!h&&c!==_.current?(_.current=c,g(!0)):c!==_.current&&(_.current=c)},[h,c]);let v=n({searchValue:c,autoCompleteOptions:p}),y=(e,t)=>{if(e.key===`ArrowUp`&&t===0){e.preventDefault(),s?.focus();return}if(e.key===`Enter`&&v[t]){m(v[t].key,v[t]),g(!1);return}};return!f||!h||!c||v.length===0?null:l(u,{open:!0,anchorEl:e,matchAnchorWidth:!0,onClose:()=>{g(!1)},children:v.map((e,n)=>{let[r,i]=t({searchValue:c,label:e.label}),a=[e.label.slice(0,r),l(`strong`,{children:e.label.slice(r,i+1)},`${e.value}-start`),e.label.slice(i+1)];return l(o.Item,{onKeyDown:e=>y(e,n),children:l(d,{children:a})},e.value)})})}export{f as AutoCompleteMenu};

package/dist/organisms/Filter/AutoCompleteText.js

@@ -0,0 +1,11 @@
+import{colors as e}from"../../atoms/style/colors.js";import{findStartAndEndIndexOfSearch as t,getFilteredAutoCompleteOptions as n}from"./Filter.utils.js";import{Typography as r}from"@equinor/eds-core-react";import{styled as i}from"styled-components";import{jsx as a,jsxs as o}from"react/jsx-runtime";const s=i(r)`
+  position: absolute;
+  left: 0;
+  color: ${e.text.static_icons__tertiary.rgba};
+  height: fit-content;
+  text-wrap: nowrap;
+  line-height: normal;
+  > span {
+    color: transparent;
+  }
+`;function c({search:e,autoCompleteOptions:r}){let i=n({autoCompleteOptions:r,searchValue:e});if(i.length===0)return null;let c=i[0],[l,u]=t({searchValue:e,label:c.label});return l===0?o(s,{children:[a(`span`,{children:e.slice(0,e.length)}),c.label.slice(u+1)]}):null}export{c as AutoCompleteText};

package/dist/organisms/Filter/ButtonWithMenu.js

@@ -1 +1 @@
-import{useRef as e,useState as t}from"react";import{Fragment as n,jsx as r,jsxs as i}from"react/jsx-runtime";import{Menu as a}from"@equinor/eds-core-react";const o=({onOpenChange:o,menuItems:s,children:c})=>{let[l,u]=t(!1),d=e(null),f=()=>{u(!l),o?.(!l)},p=()=>{u(!1),o?.(!1)};return i(n,{children:[r(`button`,{ref:d,onClick:f,children:c}),l&&r(a,{open:!0,anchorEl:d.current,onClose:p,children:s})]})};export{o as ButtonWithMenu};
+import{useRef as e,useState as t}from"react";import{Menu as n}from"@equinor/eds-core-react";import{Fragment as r,jsx as i,jsxs as a}from"react/jsx-runtime";const o=({onOpenChange:o,menuItems:s,children:c})=>{let[l,u]=t(!1),d=e(null);return a(r,{children:[i(`button`,{ref:d,onClick:()=>{u(!l),o?.(!l)},children:c}),l&&i(n,{open:!0,anchorEl:d.current,onClose:()=>{u(!1),o?.(!1)},children:s})]})};export{o as ButtonWithMenu};

package/dist/organisms/Filter/Filter.js

@@ -1 +1 @@
-import{Container as e,Content as t,SearchField as n,SearchFieldWrapper as r,Section as i,StyledChip as a,Wrapper as o}from"./Filter.styles.js";import{useRef as s,useState as c}from"react";import{jsx as l,jsxs as u}from"react/jsx-runtime";import{colors as d}from"src/atoms/style/colors";import{arrow_drop_down as f,arrow_drop_up as p,clear as m,info_circle as h,search as g}from"@equinor/eds-icons";import{Button as _,Icon as v,Typography as y}from"@equinor/eds-core-react";import{AnimatePresence as b,motion as x}from"framer-motion";import{AutoCompleteMenu as S}from"src/organisms/Filter/AutoCompleteMenu";import{AutoCompleteText as C}from"src/organisms/Filter/AutoCompleteText";import{getFilteredAutoCompleteOptions as w}from"src/organisms/Filter/Filter.utils";function T({values:T,search:E,onSearchChange:D,onSearchEnter:O,onClearFilter:k,onClearAllFilters:A,children:j,topContent:M,inlineContent:N,initialOpen:P=!1,placeholder:F=`Search...`,id:I,...L}){let R=s(null),z=s(null),[B,V]=c(P),[H,U]=c(void 0),W=s(P?`auto`:0),G=()=>{V(e=>!e),W.current===`auto`&&(W.current=0)},K=()=>{B||V(!0)},q=()=>{R.current?.focus()},J=e=>{if(!(`autoCompleteOptions`in L)){O(e);return}let t=w({searchValue:e,autoCompleteOptions:L.autoCompleteOptions});if(t.length===1){L.onAutoComplete(t[0].key,t[0]);return}O(e)},Y=e=>{if(e.key===`Enter`&&E!==``)J(E);else if(e.key===`Backspace`&&E===``){if(H===void 0){for(let e of Object.keys(T).toReversed())if(T[e].length>0){U(e);break}return}k(H,T[H].length-1),U(void 0)}},X=Object.values(T).some(e=>e.length>0);return u(o,{id:I,children:[M,u(e,{children:[u(i,{ref:z,onClick:q,children:[l(v,{data:g,color:d.text.static_icons__tertiary.rgba}),Object.keys(T).flatMap(e=>T[e].map(({label:t,icon:n},r,i)=>l(a,{onDelete:()=>k(e,r),leadingIconData:n,$tryingToRemove:H===e&&r===i.length-1,children:t},`${t}-${r}-${e}`))),u(r,{children:[`autoCompleteOptions`in L&&L.autoCompleteOptions&&l(C,{search:E,autoCompleteOptions:L.autoCompleteOptions}),l(n,{ref:R,id:`filter-search-${I}`,type:`search`,autoComplete:`off`,value:E,placeholder:X?void 0:F,onChange:D,onKeyDownCapture:Y,onFocus:K})]}),Object.values(T).some(e=>e.length>0)&&l(_,{variant:`ghost_icon`,onClick:A,"data-testid":`clear-all-x`,children:l(v,{data:m,size:18,color:d.text.static_icons__tertiary.rgba})})]}),N,u(`button`,{onClick:G,"data-testid":`toggle-open-button`,children:[l(y,{variant:`button`,group:`navigation`,as:`span`,children:`Filters`}),l(v,{data:B?p:f,color:d.text.static_icons__tertiary.rgba})]})]}),l(b,{children:B&&l(x.div,{animate:{height:`auto`},initial:{height:W.current},exit:{height:0},children:u(t,{children:[u(`span`,{children:[l(v,{data:h,size:16,color:d.text.static_icons__tertiary.rgba}),l(y,{variant:`label`,group:`input`,color:d.text.static_icons__tertiary.rgba,children:`Type a keyword and press enter`})]}),j]})})}),`autoCompleteOptions`in L&&L.autoCompleteOptions&&l(S,{isFilterOpen:B,search:E,anchorElement:z.current,autoCompleteOptions:L.autoCompleteOptions,onAutoComplete:L.onAutoComplete,searchElement:R.current})]})}export{T as Filter};
+import{colors as e}from"../../atoms/style/colors.js";import{Container as t,Content as n,SearchField as r,SearchFieldWrapper as i,Section as a,StyledChip as o,Wrapper as s}from"./Filter.styles.js";import{getFilteredAutoCompleteOptions as c}from"./Filter.utils.js";import{AutoCompleteMenu as l}from"./AutoCompleteMenu.js";import{AutoCompleteText as u}from"./AutoCompleteText.js";import{useRef as d,useState as f}from"react";import{Button as p,Icon as m,Typography as h}from"@equinor/eds-core-react";import{jsx as g,jsxs as _}from"react/jsx-runtime";import{arrow_drop_down as v,arrow_drop_up as y,clear as b,info_circle as x,search as S}from"@equinor/eds-icons";import{AnimatePresence as C,motion as w}from"framer-motion";function T({values:T,search:E,onSearchChange:D,onSearchEnter:O,onClearFilter:k,onClearAllFilters:A,children:j,topContent:M,inlineContent:N,initialOpen:P=!1,placeholder:F=`Search...`,id:I,...L}){let R=d(null),z=d(null),[B,V]=f(P),[H,U]=f(void 0),W=d(P?`auto`:0),G=()=>{V(e=>!e),W.current===`auto`&&(W.current=0)},K=()=>{B||V(!0)},q=()=>{R.current?.focus()},J=e=>{if(!(`autoCompleteOptions`in L)){O(e);return}let t=c({searchValue:e,autoCompleteOptions:L.autoCompleteOptions});if(t.length===1){L.onAutoComplete(t[0].key,t[0]);return}O(e)},Y=e=>{if(e.key===`Enter`&&E!==``)J(E);else if(e.key===`Backspace`&&E===``){if(H===void 0){for(let e of Object.keys(T).toReversed())if(T[e].length>0){U(e);break}return}k(H,T[H].length-1),U(void 0)}},X=Object.values(T).some(e=>e.length>0);return _(s,{id:I,children:[M,_(t,{children:[_(a,{ref:z,onClick:q,children:[g(m,{data:S,color:e.text.static_icons__tertiary.rgba}),Object.keys(T).flatMap(e=>T[e].map(({label:t,icon:n},r,i)=>g(o,{onDelete:()=>k(e,r),leadingIconData:n,$tryingToRemove:H===e&&r===i.length-1,children:t},`${t}-${r}-${e}`))),_(i,{children:[`autoCompleteOptions`in L&&L.autoCompleteOptions&&g(u,{search:E,autoCompleteOptions:L.autoCompleteOptions}),g(r,{ref:R,id:`filter-search-${I}`,type:`search`,autoComplete:`off`,value:E,placeholder:X?void 0:F,onChange:D,onKeyDownCapture:Y,onFocus:K})]}),Object.values(T).some(e=>e.length>0)&&g(p,{variant:`ghost_icon`,onClick:A,"data-testid":`clear-all-x`,children:g(m,{data:b,size:18,color:e.text.static_icons__tertiary.rgba})})]}),N,_(`button`,{onClick:G,"data-testid":`toggle-open-button`,children:[g(h,{variant:`button`,group:`navigation`,as:`span`,children:`Filters`}),g(m,{data:B?y:v,color:e.text.static_icons__tertiary.rgba})]})]}),g(C,{children:B&&g(w.div,{animate:{height:`auto`},initial:{height:W.current},exit:{height:0},children:_(n,{children:[_(`span`,{children:[g(m,{data:x,size:16,color:e.text.static_icons__tertiary.rgba}),g(h,{variant:`label`,group:`input`,color:e.text.static_icons__tertiary.rgba,children:`Type a keyword and press enter`})]}),j]})})}),`autoCompleteOptions`in L&&L.autoCompleteOptions&&g(l,{isFilterOpen:B,search:E,anchorElement:z.current,autoCompleteOptions:L.autoCompleteOptions,onAutoComplete:L.onAutoComplete,searchElement:R.current})]})}export{T as Filter};

package/dist/organisms/Filter/Filter.styles.js

@@ -1,109 +1,109 @@
-import e,{css as t}from"styled-components";import{colors as n,shape as r,spacings as i,typography as a}from"src/atoms/style";import{motion as o}from"framer-motion";import{Chip as s}from"src/molecules/Chip/Chip";const c=e.div`
+import{colors as e}from"../../atoms/style/colors.js";import{spacings as t}from"../../atoms/style/spacings.js";import{shape as n,typography as r}from"../../atoms/style/index.js";import{Chip as i}from"../../molecules/Chip/Chip.js";import a,{css as o}from"styled-components";import{motion as s}from"framer-motion";const c=a.div`
   width: 100%;
-  border: 1px solid ${n.ui.background__heavy.rgba};
-  background: ${n.ui.background__default.rgba};
-  border-radius: ${r.corners.borderRadius};
+  border: 1px solid ${e.ui.background__heavy.rgba};
+  background: ${e.ui.background__default.rgba};
+  border-radius: ${n.corners.borderRadius};
   overflow: hidden;
-`,l=e.div`
+`,l=a.div`
   display: flex;
   align-items: center;
   width: 100%;
-  outline: 1px solid ${n.ui.background__medium.rgba};
+  outline: 1px solid ${e.ui.background__medium.rgba};
   > button:not([data-testid='clear-all-x']) {
-    padding: 0 ${i.small} 0 ${i.medium_small};
+    padding: 0 ${t.small} 0 ${t.medium_small};
     display: flex;
-    gap: ${i.x_small};
+    gap: ${t.x_small};
     align-items: center;
     justify-content: center;
-    border-left: 1px solid ${n.ui.background__medium.rgba};
-    color: ${n.interactive.primary__resting.rgba};
+    border-left: 1px solid ${e.ui.background__medium.rgba};
+    color: ${e.interactive.primary__resting.rgba};
     align-self: stretch;
     span {
-      color: ${n.interactive.primary__resting.rgba};
+      color: ${e.interactive.primary__resting.rgba};
     }
 
     &:hover {
-      background: ${n.interactive.primary__hover_alt.rgba};
+      background: ${e.interactive.primary__hover_alt.rgba};
     }
   }
 
   > button:last-child {
-    border-left: 1px solid ${n.ui.background__medium.rgba};
+    border-left: 1px solid ${e.ui.background__medium.rgba};
     > span {
-      color: ${n.text.static_icons__secondary.rgba};
+      color: ${e.text.static_icons__secondary.rgba};
     }
     &:hover {
-      background: ${n.interactive.primary__hover_alt.rgba};
+      background: ${e.interactive.primary__hover_alt.rgba};
     }
   }
-`,u=e.section`
+`,u=a.section`
   > svg:first-child {
     flex-shrink: 0;
   }
-  min-height: calc(48px - (2 * ${i.medium_small}));
+  min-height: calc(48px - (2 * ${t.medium_small}));
   align-items: center;
   flex-grow: 1;
   display: flex;
   flex-wrap: wrap;
-  gap: ${i.x_small};
-  padding: ${i.medium_small} ${i.small};
+  gap: ${t.x_small};
+  padding: ${t.medium_small} ${t.small};
   cursor: text;
   &:hover {
-    background: ${n.ui.background__light_medium.rgba};
+    background: ${e.ui.background__light_medium.rgba};
   }
   &:focus-within {
-    border-bottom: 1px solid ${n.interactive.primary__resting.rgba};
-    padding-bottom: calc(${i.medium_small} - 1px);
+    border-bottom: 1px solid ${e.interactive.primary__resting.rgba};
+    padding-bottom: calc(${t.medium_small} - 1px);
   }
   > button[data-testid='clear-all-x'] {
     width: 24px;
     height: 24px;
     border-left: none;
-    margin-right: ${i.xx_small};
+    margin-right: ${t.xx_small};
     flex-shrink: 0;
     &:after {
       width: 24px;
       height: 24px;
     }
   }
-`,d=e.input`
+`,d=a.input`
   background: transparent;
   width: 0;
   flex-grow: 1;
   padding: 0;
   font-family: 'Equinor', sans-serif;
-  font-size: ${a.input.text.fontSize};
-  font-weight: ${a.input.text.fontWeight};
-  color: ${n.text.static_icons__default.rgba};
+  font-size: ${r.input.text.fontSize};
+  font-weight: ${r.input.text.fontWeight};
+  color: ${e.text.static_icons__default.rgba};
   outline: none;
   border: none;
   &::placeholder {
     opacity: 1;
-    color: ${n.text.static_icons__tertiary.rgba};
+    color: ${e.text.static_icons__tertiary.rgba};
   }
   &::-webkit-search-cancel-button,
   &::-webkit-search-results-button,
   &::-webkit-search-results-decoration {
     display: none;
   }
-`,f=e(o.div)`
-  border-bottom-left-radius: ${r.corners.borderRadius};
-  border-bottom-right-radius: ${r.corners.borderRadius};
-  background: ${n.ui.background__default.rgba};
+`,f=a(s.div)`
+  border-bottom-left-radius: ${n.corners.borderRadius};
+  border-bottom-right-radius: ${n.corners.borderRadius};
+  background: ${e.ui.background__default.rgba};
   overflow: hidden;
   display: flex;
   flex-direction: column;
-  gap: ${i.medium};
-  padding: ${i.medium};
+  gap: ${t.medium};
+  padding: ${t.medium};
   > span {
     display: flex;
-    gap: ${i.x_small};
+    gap: ${t.x_small};
   }
-`,p=e(s)`
-  ${({$tryingToRemove:e})=>{if(e)return t`
-        background: ${n.interactive.primary__hover_alt.rgba};
+`,p=a(i)`
+  ${({$tryingToRemove:t})=>{if(t)return o`
+        background: ${e.interactive.primary__hover_alt.rgba};
       `}}
-`,m=e.section`
+`,m=a.section`
   position: relative;
   flex-grow: 1;
   display: flex;

package/dist/organisms/Filter/Filter.utils.js

@@ -0,0 +1 @@
+function e({searchValue:e,option:t}){return e===``?!1:t.label.toLowerCase().includes(e.toLowerCase())}function t(e){let t=[];for(let n in e)t.push(...e[n].map(e=>({...e,key:n})));return t}function n({a:e,b:t,searchValue:n}){let r=n.toLowerCase(),i=e.toLowerCase().replace(r,``),a=t.toLowerCase().replace(r,``);return i.length-a.length}function r({searchValue:r,autoCompleteOptions:i}){return t(i).filter(t=>e({searchValue:r,option:t})).sort((e,t)=>n({a:e.label,b:t.label,searchValue:r})).sort((e,t)=>e.label.localeCompare(t.label))}function i({searchValue:e,label:t}){let n=t.toLowerCase().indexOf(e.toLowerCase());return[n,n+e.length-1]}export{i as findStartAndEndIndexOfSearch,r as getFilteredAutoCompleteOptions};

package/dist/organisms/Filter/QuickFilter.js

@@ -1 +1 @@
-import{ButtonWithMenu as e}from"./ButtonWithMenu.js";import{useState as t}from"react";import{jsx as n,jsxs as r}from"react/jsx-runtime";import{arrow_drop_down as i,arrow_drop_up as a}from"@equinor/eds-icons";import{Icon as o,Menu as s,Typography as c}from"@equinor/eds-core-react";function l({values:l,items:u,onQuickFilter:d,label:f=`Quick filter`}){let[p,m]=t(!1);return r(e,{onOpenChange:m,menuItems:Object.keys(u).flatMap(e=>u[e].map(t=>n(s.Item,{active:l[e]?.some(e=>e.value===t.value),onClick:()=>d(e,t),children:t.label},t.label))),children:[n(c,{as:`span`,variant:`button`,group:`navigation`,children:f}),n(o,{data:p?a:i})]})}export{l as QuickFilter};
+import{ButtonWithMenu as e}from"./ButtonWithMenu.js";import{useState as t}from"react";import{Icon as n,Menu as r,Typography as i}from"@equinor/eds-core-react";import{jsx as a,jsxs as o}from"react/jsx-runtime";import{arrow_drop_down as s,arrow_drop_up as c}from"@equinor/eds-icons";function l({values:l,items:u,onQuickFilter:d,label:f=`Quick filter`}){let[p,m]=t(!1);return o(e,{onOpenChange:m,menuItems:Object.keys(u).flatMap(e=>u[e].map(t=>a(r.Item,{active:l[e]?.some(e=>e.value===t.value),onClick:()=>d(e,t),children:t.label},t.label))),children:[a(i,{as:`span`,variant:`button`,group:`navigation`,children:f}),a(n,{data:p?c:s})]})}export{l as QuickFilter};

package/dist/organisms/Filter/SortMenu.js

@@ -1,5 +1,5 @@
-import{ButtonWithMenu as e}from"./ButtonWithMenu.js";import{jsx as t,jsxs as n}from"react/jsx-runtime";import{radio_button_selected as r,radio_button_unselected as i,sort as a}from"@equinor/eds-icons";import o from"styled-components";import{Icon as s,Menu as c,Typography as l}from"@equinor/eds-core-react";import{colors as u}from"src/atoms/style";const d=o(c.Item)`
+import{colors as e}from"../../atoms/style/colors.js";import{ButtonWithMenu as t}from"./ButtonWithMenu.js";import{Icon as n,Menu as r,Typography as i}from"@equinor/eds-core-react";import a from"styled-components";import{jsx as o,jsxs as s}from"react/jsx-runtime";import{radio_button_selected as c,radio_button_unselected as l,sort as u}from"@equinor/eds-icons";const d=a(r.Item)`
   > div {
     grid-template-columns: 1fr auto;
   }
-`;function f({value:o,onChange:c,items:f}){let p=f.find(e=>e.value===o),m=e=>{c(e)};return n(e,{menuItems:f.map(e=>n(d,{onClick:()=>{m(e.value)},children:[e.label,t(s,{color:e.value===o?u.interactive.primary__resting.rgba:u.text.static_icons__tertiary.rgba,data:e.value===o?r:i})]},e.label)),children:[n(l,{as:`span`,variant:`button`,group:`navigation`,children:[`Sort by `,p?.label]}),t(s,{data:a})]})}export{f as SortMenu};
+`;function f({value:r,onChange:a,items:f}){let p=f.find(e=>e.value===r),m=e=>{a(e)};return s(t,{menuItems:f.map(t=>s(d,{onClick:()=>{m(t.value)},children:[t.label,o(n,{color:t.value===r?e.interactive.primary__resting.rgba:e.text.static_icons__tertiary.rgba,data:t.value===r?c:l})]},t.label)),children:[s(i,{as:`span`,variant:`button`,group:`navigation`,children:[`Sort by `,p?.label]}),o(n,{data:u})]})}export{f as SortMenu};

package/dist/organisms/PageTitle/PageTitle.js

@@ -1 +1 @@
-import{useEffect as e}from"react";import{environment as t}from"src/atoms/utils";const n=t.getAppName(import.meta.env.VITE_NAME),r=({title:t,children:r})=>(e(()=>{document.title!==t&&(document.title=`${n} - ${t}`)},[t]),r);export{r as PageTitle};
+import{environment as e}from"../../atoms/utils/auth_environment.js";import{useEffect as t}from"react";const n=e.getAppName(import.meta.env.VITE_NAME),r=({title:e,children:r})=>(t(()=>{document.title!==e&&(document.title=`${n} - ${e}`)},[e]),r);export{r as PageTitle};

package/dist/organisms/ReleaseNote/MetaTags.js

@@ -0,0 +1,10 @@
+import{colors as e}from"../../atoms/style/colors.js";import{spacings as t}from"../../atoms/style/spacings.js";import{Chip as n}from"../../molecules/Chip/Chip.js";import{Icon as r}from"@equinor/eds-core-react";import i from"styled-components";import{jsx as a,jsxs as o}from"react/jsx-runtime";import{comment_notes as s}from"@equinor/eds-icons";import{ReleaseNoteType as c}from"@equinor/subsurface-app-management";const l={[c.FEATURE]:e.dataviz.lightblue.darker,[c.IMPROVEMENT]:e.interactive.warning__resting.rgba,[c.BUG_FIX]:e.interactive.danger__resting.rgba},u=i.div`
+  display: flex;
+  align-items: center;
+  gap: ${t.small};
+  margin-bottom: 1px; // Make room for the outline on the chips
+`,d=i.span`
+  width: 10px !important;
+  height: 10px !important;
+  border-radius: 50%;
+`,f=({children:e,tags:t})=>o(u,{children:[o(n,{children:[a(r,{data:s}),`Release Note`]}),t?.map(e=>o(n,{children:[a(d,{style:{background:l[e]}}),e]},e)),e]});export{f as MetaTags};

package/dist/organisms/ReleaseNote/ReleaseNote.d.ts

@@ -1,4 +1,4 @@
-import * as react100 from "react";
+import * as react101 from "react";
 import { ReactNode } from "react";
 import { ReleaseNote } from "@equinor/subsurface-app-management";
 
@@ -7,9 +7,9 @@ type ReleaseNoteProps = {
   actionMenu?: ReactNode;
   expanded?: boolean;
 } & ReleaseNote;
-declare const ReleaseNote$1: react100.ForwardRefExoticComponent<{
+declare const ReleaseNote$1: react101.ForwardRefExoticComponent<{
   actionMenu?: ReactNode;
   expanded?: boolean;
-} & ReleaseNote & react100.RefAttributes<HTMLDivElement>>;
+} & ReleaseNote & react101.RefAttributes<HTMLDivElement>>;
 //#endregion
 export { ReleaseNote$1 as ReleaseNote, ReleaseNoteProps };

package/dist/organisms/ReleaseNote/ReleaseNote.js

@@ -1,27 +1,27 @@
-import{RELEASE_NOTE_RICH_TEXT_COLLAPSED_HEIGHT as e}from"./ReleaseNote.constants.js";import{timeToRead as t,usingReleaseNoteDate as n}from"./ReleaseNote.utils.js";import{ToggleExpanded as r}from"./ToggleExpanded.js";import{forwardRef as i,useRef as a,useState as o}from"react";import{jsx as s,jsxs as c}from"react/jsx-runtime";import{ReleaseNotesService as l}from"@equinor/subsurface-app-management";import{formatDate as u,getImagesFromRichText as d}from"src/atoms/utils";import f from"styled-components";import{Typography as p}from"@equinor/eds-core-react";import{colors as m,shape as h,spacings as g}from"src/atoms/style";import{motion as _}from"framer-motion";import{RichTextDisplay as v}from"src/molecules/RichTextDisplay/RichTextDisplay";import{MetaTags as y}from"src/organisms/ReleaseNote/MetaTags";const b=f.div`
+import{colors as e}from"../../atoms/style/colors.js";import{spacings as t}from"../../atoms/style/spacings.js";import{shape as n}from"../../atoms/style/index.js";import{formatDate as r}from"../../atoms/utils/date.js";import{getImagesFromRichText as i}from"../../atoms/utils/richtext.js";import{timeToRead as a,usingReleaseNoteDate as o}from"./ReleaseNote.utils.js";import{RichTextDisplay as s}from"../../molecules/RichTextDisplay/RichTextDisplay.js";import{RELEASE_NOTE_RICH_TEXT_COLLAPSED_HEIGHT as c}from"./ReleaseNote.constants.js";import{ToggleExpanded as l}from"./ToggleExpanded.js";import{MetaTags as u}from"./MetaTags.js";import{forwardRef as d,useRef as f,useState as p}from"react";import{Typography as m}from"@equinor/eds-core-react";import h from"styled-components";import{jsx as g,jsxs as _}from"react/jsx-runtime";import{motion as v}from"framer-motion";import{ReleaseNotesService as y}from"@equinor/subsurface-app-management";const b=h.div`
   display: flex;
   flex-direction: column;
-  padding: ${g.medium};
+  padding: ${t.medium};
   position: relative;
-  background: ${m.ui.background__default.rgba};
-  border: 1px solid ${m.ui.background__heavy.rgba};
-  border-radius: ${h.corners.borderRadius};
+  background: ${e.ui.background__default.rgba};
+  border: 1px solid ${e.ui.background__heavy.rgba};
+  border-radius: ${n.corners.borderRadius};
   min-width: 800px;
   width: 100%;
   overflow: hidden;
   > h4 {
-    margin-top: ${g.large};
-    margin-bottom: ${g.medium};
+    margin-top: ${t.large};
+    margin-bottom: ${t.medium};
   }
   padding-bottom: calc(
-    68px + ${g.medium}
+    68px + ${t.medium}
   ); // Space for the expand button
-`,x=f.header`
+`,x=h.header`
   display: flex;
   justify-content: space-between;
   align-items: center;
-`,S=f.section`
+`,S=h.section`
   display: flex;
-  gap: ${g.medium};
+  gap: ${t.medium};
   align-items: center;
-`,C=i(({applicationName:i,releaseDate:f,createdDate:h,tags:C,version:w,title:T,body:E,actionMenu:D,expanded:O=!1},k)=>{let A=n({releaseDate:f,createdDate:h}),j=a(O?`auto`:e),[M,N]=o(O),[P,F]=o(d(E).length>0),I=a(new ResizeObserver(t=>{t.at(0)&&t[0].target.scrollHeight>e&&F(!0)})),L=()=>{N(e=>!e)},R=e=>{e&&I.current.observe(e)};return c(b,{ref:k,style:{paddingBottom:M?g.medium:void 0},children:[c(x,{children:[c(S,{children:[s(p,{variant:`caption`,color:m.text.static_icons__secondary.rgba,children:i}),c(p,{variant:`overline`,color:m.text.static_icons__tertiary.rgba,children:[u(A),w?` ・ ${w}`:``,` ・ `,t(E)]})]}),s(y,{tags:C,children:D})]}),s(p,{variant:`h4`,children:T}),s(_.div,{ref:R,initial:{height:j.current},animate:{height:M?`auto`:e},style:{overflow:M?`auto`:void 0},children:s(v,{value:E,onImageRead:l.getReleaseNoteImage,padding:`none`})}),P&&!O&&s(r,{expanded:M,onToggleExpanded:L})]})});C.displayName=`ReleaseNote`;export{C as ReleaseNote};
+`,C=d(({applicationName:n,releaseDate:d,createdDate:h,tags:C,version:w,title:T,body:E,actionMenu:D,expanded:O=!1},k)=>{let A=o({releaseDate:d,createdDate:h}),j=f(O?`auto`:c),[M,N]=p(O),[P,F]=p(i(E).length>0),I=f(new ResizeObserver(e=>{e.at(0)&&e[0].target.scrollHeight>c&&F(!0)}));return _(b,{ref:k,style:{paddingBottom:M?t.medium:void 0},children:[_(x,{children:[_(S,{children:[g(m,{variant:`caption`,color:e.text.static_icons__secondary.rgba,children:n}),_(m,{variant:`overline`,color:e.text.static_icons__tertiary.rgba,children:[r(A),w?` ・ ${w}`:``,` ・ `,a(E)]})]}),g(u,{tags:C,children:D})]}),g(m,{variant:`h4`,children:T}),g(v.div,{ref:e=>{e&&I.current.observe(e)},initial:{height:j.current},animate:{height:M?`auto`:c},style:{overflow:M?`auto`:void 0},children:g(s,{value:E,onImageRead:y.getReleaseNoteImage,padding:`none`})}),P&&!O&&g(l,{expanded:M,onToggleExpanded:()=>{N(e=>!e)}})]})});C.displayName=`ReleaseNote`;export{C as ReleaseNote};

package/dist/organisms/ReleaseNote/ReleaseNote.utils.js

@@ -1 +1 @@
-function e(e){let t=e.split(/\s/g).length,n=Math.ceil(t/238);return`${n} min read`}function t(e){return e.releaseDate??e.createdDate}export{e as timeToRead,t as usingReleaseNoteDate};
+function e(e){let t=e.split(/\s/g).length;return`${Math.ceil(t/238)} min read`}function t(e){return e.releaseDate??e.createdDate}export{e as timeToRead,t as usingReleaseNoteDate};

package/dist/organisms/ReleaseNote/ToggleExpanded.js

@@ -1,13 +1,13 @@
-import{jsx as e,jsxs as t}from"react/jsx-runtime";import{arrow_drop_down as n,arrow_drop_up as r}from"@equinor/eds-icons";import i from"styled-components";import{Icon as a}from"@equinor/eds-core-react";import{colors as o,spacings as s}from"src/atoms/style";import{Button as c}from"src/molecules/Button/Button";const l=i.div`
+import{colors as e}from"../../atoms/style/colors.js";import{spacings as t}from"../../atoms/style/spacings.js";import{Button as n}from"../../molecules/Button/Button.js";import{Icon as r}from"@equinor/eds-core-react";import i from"styled-components";import{jsx as a,jsxs as o}from"react/jsx-runtime";import{arrow_drop_down as s,arrow_drop_up as c}from"@equinor/eds-icons";const l=i.div`
   position: absolute;
   bottom: 0;
   left: 0;
-  gap: ${s.medium};
-  padding: ${s.medium};
+  gap: ${t.medium};
+  padding: ${t.medium};
   background: linear-gradient(
-    color-mix(in srgb, ${o.ui.background__default.rgba} 10%, transparent)
+    color-mix(in srgb, ${e.ui.background__default.rgba} 10%, transparent)
       0%,
-    ${o.ui.background__default.rgba} 15%
+    ${e.ui.background__default.rgba} 15%
   );
   width: 100%;
-`,u=({expanded:i,onToggleExpanded:o})=>e(l,{children:t(c,{variant:`ghost`,onClick:o,children:[`Show `,i?`less`:`more`,e(a,{data:i?r:n})]})});export{u as ToggleExpanded};
+`,u=({expanded:e,onToggleExpanded:t})=>a(l,{children:o(n,{variant:`ghost`,onClick:t,children:[`Show `,e?`less`:`more`,a(r,{data:e?c:s})]})});export{u as ToggleExpanded};

package/dist/organisms/SideBar/CreateItem.js

@@ -0,0 +1 @@
+import{useSideBar as e}from"../../providers/SideBarProvider.js";import{OptionalTooltip as t}from"../../molecules/OptionalTooltip/OptionalTooltip.js";import{CreateButton as n,MenuItemContainer as r}from"./CreateItem.styles.js";import{Icon as i}from"@equinor/eds-core-react";import{jsx as a,jsxs as o}from"react/jsx-runtime";import{add as s}from"@equinor/eds-icons";const c=({createLabel:c,onCreate:l,disabled:u=!1,active:d=!1})=>{let{isOpen:f}=e(),p=u?void 0:l;return f?a(r,{$active:d,onClick:p,"data-testid":`create-item-container`,children:o(n,{$open:!0,variant:`contained`,disabled:u,children:[a(i,{data:s}),c]})}):a(t,{title:c,placement:`right`,children:a(r,{$active:d,onClick:p,"data-testid":`create-item-container`,children:a(n,{variant:`contained`,disabled:u,children:a(i,{data:s})})})})};export{c as CreateItem};

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

@@ -0,0 +1,33 @@
+import{colors as e}from"../../atoms/style/colors.js";import{spacings as t}from"../../atoms/style/spacings.js";import{shape as n}from"../../atoms/style/index.js";import{Button as r}from"@equinor/eds-core-react";import i from"styled-components";const a=i.div`
+  display: flex;
+  align-self: stretch;
+  box-sizing: border-box;
+  padding: ${t.medium_small} 0 ${t.medium_small} 14px;
+  background: ${({$active:t})=>t?e.interactive.primary__selected_highlight.rgba:`transparent`};
+  cursor: pointer;
+  &:has(button:disabled) {
+    cursor: not-allowed;
+  }
+  &:hover:not(:has(button:disabled)) {
+    background: ${({$active:t})=>t?e.interactive.primary__selected_hover.rgba:e.interactive.primary__hover_alt.rgba};
+
+    > button {
+      border-color: ${e.interactive.primary__hover.rgba};
+      background: ${e.interactive.primary__hover.rgba};
+    }
+  }
+`,o=i(r)`
+  width: ${e=>e.$open?`fit-content`:`36px`};
+  height: 36px;
+  border-radius: ${n.icon_button.borderRadius};
+  transition: 0.1s ease-out;
+  &:hover {
+    border-radius: ${n.icon_button.borderRadius};
+  }
+  &:disabled {
+    border: 0 solid transparent;
+  }
+  > span {
+    ${e=>e.$open&&`margin-left: -11px`};
+  }
+`;export{o as CreateButton,a as MenuItemContainer};

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

@@ -0,0 +1 @@
+import{useSideBar as e}from"../../../providers/SideBarProvider.js";import{OptionalTooltip as t}from"../../../molecules/OptionalTooltip/OptionalTooltip.js";import{IconContainer as n,ItemText as r,Link as i,MenuItemWrapper as a}from"./MenuItem.styles.js";import{canNavigate as o,isCurrentUrl as s}from"./MenuItem.utils.js";import{useCallback as c,useMemo as l}from"react";import{Icon as u}from"@equinor/eds-core-react";import{jsx as d,jsxs as f}from"react/jsx-runtime";import{useLocation as p}from"@tanstack/react-router";import{Feature as m}from"@equinor/subsurface-app-management";const h=({icon:h,link:g,onClick:_,replace:v=!1,name:y,disabled:b=!1,featureUuid:x,...S})=>{let{pathname:C}=p(),w=s({currentUrl:C,link:g}),{isOpen:T}=e(),E=o({currentUrl:C,link:g,replace:v,disabled:b}),D=c(e=>{if(!E){e.preventDefault();return}_&&_()},[E,_]),O=l(()=>d(t,{title:y,placement:`right`,children:d(a,{children:f(i,{to:g,$active:w,"aria-disabled":b,$disabled:b,onClick:D,tabIndex:0,$open:!0,"data-testid":`sidebar-menu-item`,replace:v,...S,children:[d(n,{"data-testid":`icon-container`,children:d(u,{data:h,size:24})}),T&&d(r,{$active:w,$disabled:b,variant:`button`,group:`navigation`,children:y})]})})}),[b,D,h,w,T,g,y,S,v]);return x?d(m,{featureUuid:x,children:O}):O};export{h as BasicMenuItem};

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

@@ -0,0 +1,48 @@
+import{colors as e}from"../../../atoms/style/colors.js";import{spacings as t}from"../../../atoms/style/spacings.js";import{useSideBar as n}from"../../../providers/SideBarProvider.js";import{usePrevious as r}from"../../../atoms/hooks/usePrevious.js";import{OptionalTooltip as i}from"../../../molecules/OptionalTooltip/OptionalTooltip.js";import{IconContainer as a,ItemText as o,Link as s,MenuItemWrapper as c}from"./MenuItem.styles.js";import{isCurrentUrl as l}from"./MenuItem.utils.js";import{useEffect as u,useMemo as d,useRef as f,useState as p}from"react";import{Icon as m,Menu as h}from"@equinor/eds-core-react";import g,{css as _}from"styled-components";import{Fragment as v,jsx as y,jsxs as b}from"react/jsx-runtime";import{chevron_down as x,chevron_up as S}from"@equinor/eds-icons";import{Link as C,useLocation as w}from"@tanstack/react-router";const T=g.button`
+  position: relative;
+  width: 100%;
+  display: grid;
+  grid-template-columns: auto 1fr auto;
+  align-self: stretch;
+  align-items: center;
+  height: 64px;
+  min-width: 64px;
+  padding: ${t.medium};
+  gap: ${t.medium};
+  box-sizing: border-box;
+  border-bottom: 1px solid ${e.ui.background__medium.rgba};
+  background: ${({$active:t,$expanded:n})=>t?e.interactive.primary__selected_highlight.rgba:n?e.interactive.table__header__fill_resting.rgba:`transparent`};
+  text-decoration: none;
+  transition: background 0.1s ease-out;
+
+  &:hover {
+    text-decoration: none;
+    background: ${({$active:t,$expanded:n})=>t?e.interactive.primary__selected_hover.rgba:n?e.ui.background__medium.rgba:e.interactive.primary__hover_alt.rgba};
+    svg {
+      fill: ${e.interactive.primary__hover.rgba};
+    }
+  }
+
+  ${({$open:t})=>!t&&_`
+      &:after {
+        position: absolute;
+        right: -7px; // 1px border offset from 8px width
+        bottom: 0;
+        height: 0;
+        width: 0;
+        border-color: transparent;
+        border-bottom-color: ${e.interactive.primary__resting.rgba};
+        border-style: solid;
+        border-width: 8px;
+        content: '';
+        z-index: 500;
+      }
+    `}
+`,E=g(s)`
+  display: grid;
+  grid-template-columns: 32px 1fr;
+  height: unset;
+  > p:first-child {
+    grid-column: 2;
+  }
+`,D=({icon:t,name:s,items:g,..._})=>{let{pathname:D}=w(),O=r(D),{isOpen:k}=n(),A=r(k),j=g.some(e=>l({currentUrl:D,link:e.link})),M=f(null),[N,P]=p(!1),F=()=>P(e=>!e);u(()=>{(A&&!k&&N||O!==D&&N&&!k)&&P(!1)},[N,k,D,A,O]);let I=d(()=>y(i,{title:s,placement:`right`,children:y(c,{children:b(T,{ref:M,$open:k,$active:j,$expanded:N,onClick:F,..._,children:[y(a,{"data-testid":`icon-container`,children:y(m,{data:t,size:24,color:e.interactive.primary__resting.rgba})}),k&&b(v,{children:[y(o,{$active:!1,$disabled:!1,variant:`button`,group:`navigation`,children:s}),y(m,{data:N?S:x,size:24,color:e.interactive.primary__resting.rgba})]})]})})}),[N,t,j,k,s,_]);return N&&k?b(v,{children:[I,g.map((e,t)=>y(E,{to:e.link,$active:l({currentUrl:D,link:e.link}),$disabled:e.disabled||!1,children:y(o,{$active:j,$disabled:e.disabled||!1,variant:`button`,group:`navigation`,children:e.name})},t))]}):N?b(v,{children:[I,y(h,{open:!0,anchorEl:M.current,placement:`right-start`,onClose:F,children:g.map(e=>y(h.Item,{as:C,active:l({currentUrl:D,link:e.link}),style:{width:`256px`},to:e.link,children:e.name},e.link))})]}):I};export{D as CollapsableMenuItem};

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

@@ -0,0 +1 @@
+import{BasicMenuItem as e}from"./BasicMenuItem.js";import{CollapsableMenuItem as t}from"./CollapsableMenuItem.js";import{jsx as n}from"react/jsx-runtime";const r=r=>`items`in r?n(t,{...r}):n(e,{...r});export{r as MenuItem};

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

@@ -0,0 +1,37 @@
+import{colors as e}from"../../../atoms/style/colors.js";import{spacings as t}from"../../../atoms/style/spacings.js";import{Typography as n}from"@equinor/eds-core-react";import r from"styled-components";import{Link as i}from"@tanstack/react-router";const a=r.span`
+  width: 100%;
+`,o=r(i)`
+  display: flex;
+  align-self: stretch;
+  align-items: center;
+  justify-content: ${({$open:e})=>!e&&`center`};
+  height: 64px;
+  min-width: 64px;
+  padding: ${t.medium};
+  gap: ${t.medium};
+  box-sizing: border-box;
+  border-bottom: 1px solid ${e.ui.background__medium.rgba};
+  background: ${({$active:t})=>t&&e.interactive.primary__selected_highlight.rgba};
+  text-decoration: none;
+  transition: background 0.1s ease-out;
+  > div > svg {
+    fill: ${({$disabled:t})=>t?e.interactive.disabled__text.rgba:e.interactive.primary__resting.rgba};
+  }
+  &:hover {
+    cursor: ${({$disabled:e})=>!e&&`pointer`};
+    text-decoration: none;
+    background: ${({$active:t,$disabled:n})=>!n&&(t?e.interactive.primary__selected_hover.rgba:e.interactive.primary__hover_alt.rgba)};
+    > div > svg {
+      fill: ${({$disabled:t,$active:n})=>!t&&!n&&e.interactive.primary__hover.rgba};
+    }
+  }
+`,s=r.div`
+  display: flex;
+  padding: ${t.x_small};
+  align-items: center;
+  justify-content: center;
+  width: 32px;
+  height: 32px;
+`,c=r(n)`
+  color: ${({$disabled:t})=>t?e.interactive.disabled__text.rgba:e.text.static_icons__default.rgba};
+`;export{s as IconContainer,c as ItemText,o as Link,a as MenuItemWrapper};

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

@@ -0,0 +1 @@
+const e=({currentUrl:e,link:t})=>e.includes(t)&&t!==`/`||t===e,t=({currentUrl:e,link:t})=>e.split(`?`)[0]===t,n=({currentUrl:n,link:r,disabled:i,replace:a})=>{let o=e({currentUrl:n,link:r}),s=t({currentUrl:n,link:r});return!i&&(!o||o&&!s&&a)};export{n as canNavigate,e as isCurrentUrl};

package/dist/organisms/SideBar/SideBar.d.ts

@@ -1,4 +1,4 @@
-import * as react140 from "react";
+import * as react122 from "react";
 import { HTMLAttributes, ReactNode } from "react";
 
 //#region src/organisms/SideBar/SideBar.d.ts
@@ -16,6 +16,6 @@ interface SideBarWithCreate extends SideBarProps {
   createDisabled?: boolean;
   createActive?: boolean;
 }
-declare const SideBar: react140.ForwardRefExoticComponent<(SideBarWithCreate | BaseSideBar) & react140.RefAttributes<HTMLDivElement>>;
+declare const SideBar: react122.ForwardRefExoticComponent<(SideBarWithCreate | BaseSideBar) & react122.RefAttributes<HTMLDivElement>>;
 //#endregion
 export { SideBar };

package/dist/organisms/SideBar/SideBar.js

@@ -0,0 +1 @@
+import{useSideBar as e}from"../../providers/SideBarProvider.js";import{EquinorLogo as t}from"../../molecules/EquinorLogo/EquinorLogo.js";import{CreateItem as n}from"./CreateItem.js";import{BottomItemContainer as r,CenterItemContainer as i,EquinorIconContainer as a,NavigationContainer as o,TopItemContainer as s}from"./SideBar.styles.js";import{ToggleOpen as c}from"./ToggleOpen.js";import{forwardRef as l}from"react";import{jsx as u,jsxs as d}from"react/jsx-runtime";const f=l((l,f)=>{let{children:p,showCreate:m=!0,bottomItem:h}=l,{isOpen:g,setIsOpen:_}=e(),v=()=>{_(!g)};return d(o,{$width:g?`231px`:`64px`,ref:f,"data-testid":`sidebar`,children:[l.onCreate&&m&&u(s,{children:u(n,{createLabel:l.createLabel,onCreate:l.onCreate,disabled:l.createDisabled,active:l.createActive})}),u(i,{children:p}),d(r,{children:[h,u(c,{isOpen:g,toggle:v}),u(a,{children:u(t,{})})]})]})});f.displayName=`SideBar`;export{f as SideBar};