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

package/dist/organisms/TopBar/Settings.js

@@ -1,25 +1,25 @@
-import{TopBarMenu as e}from"./TopBarMenu.js";import{TopBarButton as t}from"./TopBar.styles.js";import{useContext as n,useMemo as r,useRef as i,useState as a}from"react";import{Fragment as o,jsx as s,jsxs as c}from"react/jsx-runtime";import{ThemeProviderContext as l}from"src/providers/ThemeProvider/ThemeProvider";import{settings as u}from"@equinor/eds-icons";import d from"styled-components";import{Icon as f,Radio as p,Typography as m}from"@equinor/eds-core-react";import{elevation as h,spacings as g}from"src/atoms/style";import{Theme as _}from"src/atoms/enums";const v=d.div`
+import{spacings as e}from"../../atoms/style/spacings.js";import{elevation as t}from"../../atoms/style/index.js";import{Theme as n}from"../../atoms/enums/Theme.js";import{ThemeProviderContext as r}from"../../providers/ThemeProvider/ThemeProvider.js";import{TopBarMenu as i}from"./TopBarMenu.js";import{TopBarButton as a}from"./TopBar.styles.js";import{useContext as o,useMemo as s,useRef as c,useState as l}from"react";import{Icon as u,Radio as d,Typography as f}from"@equinor/eds-core-react";import p from"styled-components";import{Fragment as m,jsx as h,jsxs as g}from"react/jsx-runtime";import{settings as _}from"@equinor/eds-icons";const v=p.div`
   display: flex;
   flex-direction: row;
   align-items: center;
-  gap: ${g.x_small};
-  padding: 0 ${g.large} 0 ${g.small};
+  gap: ${e.x_small};
+  padding: 0 ${e.large} 0 ${e.small};
   justify-content: space-between;
   > span {
-    padding: ${g.small} ${g.x_small};
+    padding: ${e.small} ${e.x_small};
   }
-`,y=d.div`
+`,y=p.div`
   width: 64px;
   height: 32px;
   background-color: ${e=>e.$color};
-  box-shadow: ${h.raised};
+  box-shadow: ${t.raised};
   border-radius: 4px;
-`,b=d.div`
+`,b=p.div`
   display: flex;
   flex-direction: column;
-  gap: ${g.medium};
+  gap: ${e.medium};
   > div > p {
-    padding-top: ${g.small};
-    padding-left: ${g.medium};
+    padding-top: ${e.small};
+    padding-left: ${e.medium};
   }
-`,x=({allSettings:d,children:h})=>{let g=i(null),[x,S]=a(!1),C=n(l),w=()=>S(!1),T=()=>S(!x),E=r(()=>C?[{title:`Theme`,value:C.theme,onChange:e=>C.setTheme(e),items:[{label:`Light Mode`,name:`theme-group`,value:_.LIGHT,colorBox:`#ffffff`},{label:`Dark Mode`,name:`theme-group`,value:_.DARK,colorBox:`#243746`}]},...d??[]]:d??[],[d,C]);if(E.length===0)throw Error(`Empty settings in TopBar.Settings!`);return c(o,{children:[s(t,{variant:`ghost_icon`,onClick:T,ref:g,children:s(f,{data:u,size:24})}),c(e,{open:x,title:`Settings`,onClose:w,anchorEl:g.current,children:[s(b,{children:E.map((e,t)=>c(`div`,{children:[s(m,{variant:`overline`,children:e.title}),e.items.map((t,n)=>c(v,{children:[s(p,{id:t.label,disabled:t.disabled,label:t.label,name:e.title,value:`${t.label}-${n}`,checked:e.value===t.value,onChange:()=>e.onChange?.(t.value)}),t.colorBox&&s(y,{$color:t.colorBox,"data-testid":`colorbox-${t.colorBox}`}),t.text&&s(m,{variant:`h6`,children:t.text}),t.element&&t.element]},n))]},t))}),h]})]})};x.displayName=`TopBar.Settings`;export{x as Settings};
+`,x=({allSettings:e,children:t})=>{let p=c(null),[x,S]=l(!1),C=o(r),w=()=>S(!1),T=()=>S(!x),E=s(()=>C?[{title:`Theme`,value:C.theme,onChange:e=>C.setTheme(e),items:[{label:`Light Mode`,name:`theme-group`,value:n.LIGHT,colorBox:`#ffffff`},{label:`Dark Mode`,name:`theme-group`,value:n.DARK,colorBox:`#243746`}]},...e??[]]:e??[],[e,C]);if(E.length===0)throw Error(`Empty settings in TopBar.Settings!`);return g(m,{children:[h(a,{variant:`ghost_icon`,onClick:T,ref:p,children:h(u,{data:_,size:24})}),g(i,{open:x,title:`Settings`,onClose:w,anchorEl:p.current,children:[h(b,{children:E.map((e,t)=>g(`div`,{children:[h(f,{variant:`overline`,children:e.title}),e.items.map((t,n)=>g(v,{children:[h(d,{id:t.label,disabled:t.disabled,label:t.label,name:e.title,value:`${t.label}-${n}`,checked:e.value===t.value,onChange:()=>e.onChange?.(t.value)}),t.colorBox&&h(y,{$color:t.colorBox,"data-testid":`colorbox-${t.colorBox}`}),t.text&&h(f,{variant:`h6`,children:t.text}),t.element&&t.element]},n))]},t))}),t]})]})};x.displayName=`TopBar.Settings`;export{x as Settings};

package/dist/organisms/TopBar/TopBar.js

@@ -1 +1 @@
-import{AppAndFieldContainer as e,AppIdentifier as t,AppName as n,Bar as r,CircularProgress as i,EnvironmentTag as a}from"./TopBar.styles.js";import{FieldMenu as o}from"./FieldMenu/FieldMenu.js";import s,{forwardRef as c}from"react";import{jsx as l,jsxs as u}from"react/jsx-runtime";import{EnvironmentType as d}from"src/atoms/enums/Environment";import{Typography as f}from"@equinor/eds-core-react";import{ApplicationIcon as p}from"src/molecules/ApplicationIcon/ApplicationIcon";const m=c(({id:s,children:c,headerLink:m,applicationIcon:h,applicationName:g,environment:_,isFetching:v=!1,capitalize:y=!1,availableFields:b,onSelectField:x,currentField:S,showAccessITLink:C,itemNameSingular:w},T)=>u(r,{ref:T,children:[u(e,{id:s,children:[u(t,{tabIndex:0,to:m||`/`,children:[l(p,{name:h,size:32,withHover:!0}),l(n,{group:`navigation`,variant:`menu_title`,$capitalize:y,children:y?g.toLowerCase():g})]}),b&&x&&l(o,{availableFields:b,onSelect:x,currentField:S,showAccessITLink:C,itemNameSingular:w}),v&&l(i,{size:16})]}),(_===d.DEVELOP||_===d.STAGING||_===d.LOCALHOST)&&l(a,{$environmentType:_,children:l(f,{group:`heading`,variant:`h5`,children:_})}),c]}));m.displayName=`TopBar`;export{m as TopBar};
+import{EnvironmentType as e}from"../../atoms/enums/Environment.js";import{ApplicationIcon as t}from"../../molecules/ApplicationIcon/ApplicationIcon.js";import{AppAndFieldContainer as n,AppIdentifier as r,AppName as i,Bar as a,CircularProgress as o,EnvironmentTag as s}from"./TopBar.styles.js";import{FieldMenu as c}from"./FieldMenu/FieldMenu.js";import l,{forwardRef as u}from"react";import{Typography as d}from"@equinor/eds-core-react";import{jsx as f,jsxs as p}from"react/jsx-runtime";const m=u(({id:l,children:u,headerLink:m,applicationIcon:h,applicationName:g,environment:_,isFetching:v=!1,capitalize:y=!1,availableFields:b,onSelectField:x,currentField:S,showAccessITLink:C,itemNameSingular:w},T)=>p(a,{ref:T,children:[p(n,{id:l,children:[p(r,{tabIndex:0,to:m||`/`,children:[f(t,{name:h,size:32,withHover:!0}),f(i,{group:`navigation`,variant:`menu_title`,$capitalize:y,children:y?g.toLowerCase():g})]}),b&&x&&f(c,{availableFields:b,onSelect:x,currentField:S,showAccessITLink:C,itemNameSingular:w}),v&&f(o,{size:16})]}),(_===e.DEVELOP||_===e.STAGING||_===e.LOCALHOST)&&f(s,{$environmentType:_,children:f(d,{group:`heading`,variant:`h5`,children:_})}),u]}));m.displayName=`TopBar`;export{m as TopBar};

package/dist/organisms/TopBar/TopBar.styles.js

@@ -1,37 +1,37 @@
-import{Link as e}from"@tanstack/react-router";import{EnvironmentType as t}from"src/atoms/enums/Environment";import n,{css as r}from"styled-components";import{Button as i,CircularProgress as a,TopBar as o,Typography as s}from"@equinor/eds-core-react";import{colors as c,spacings as l}from"src/atoms/style";const u=n(o)`
-  border-bottom: 1px solid ${c.ui.background__medium.rgba};
-  padding-left: ${l.medium};
+import{EnvironmentType as e}from"../../atoms/enums/Environment.js";import{colors as t}from"../../atoms/style/colors.js";import{spacings as n}from"../../atoms/style/spacings.js";import{Button as r,CircularProgress as i,TopBar as a,Typography as o}from"@equinor/eds-core-react";import s,{css as c}from"styled-components";import{Link as l}from"@tanstack/react-router";const u=s(a)`
+  border-bottom: 1px solid ${t.ui.background__medium.rgba};
+  padding-left: ${n.medium};
   align-content: center;
   position: relative;
-`,d=n(e)`
+`,d=s(l)`
   display: flex;
   flex-direction: row;
   align-items: center;
-  gap: ${l.medium_small};
+  gap: ${n.medium_small};
   padding: 0;
-  outline-offset: ${l.x_small};
+  outline-offset: ${n.x_small};
   text-decoration: none;
   &:hover {
     border-radius: 4px;
     outline: none;
   }
-`,f=n(o.Header)`
+`,f=s(a.Header)`
   display: flex;
   align-items: center;
-  gap: ${l.medium};
-`,p=n(s)`
+  gap: ${n.medium};
+`,p=s(o)`
   text-transform: ${e=>e.$capitalize?`capitalize`:`none`};
-`,m=n(a)`
+`,m=s(i)`
   circle {
-    stroke: ${c.interactive.primary__resting.rgba};
+    stroke: ${t.interactive.primary__resting.rgba};
   }
   circle:first-child {
-    stroke: ${c.interactive.primary__hover_alt.rgba};
+    stroke: ${t.interactive.primary__hover_alt.rgba};
   }
-`;function h(e){let n=`none`,r=`none`;return e===t.LOCALHOST?(n=c.interactive.disabled__fill.rgba,r=c.interactive.disabled__text.rgba):e===t.DEVELOP?(n=c.ui.background__info.rgba,r=c.infographic.substitute__blue_overcast.rgba):e===t.STAGING&&(n=c.ui.background__warning.rgba,r=c.interactive.warning__text.rgba),`
-    background-color: ${n};
-    border: 1px solid ${r};
-  `}const g=n.div`
+`;function h(n){let r=`none`,i=`none`;return n===e.LOCALHOST?(r=t.interactive.disabled__fill.rgba,i=t.interactive.disabled__text.rgba):n===e.DEVELOP?(r=t.ui.background__info.rgba,i=t.infographic.substitute__blue_overcast.rgba):n===e.STAGING&&(r=t.ui.background__warning.rgba,i=t.interactive.warning__text.rgba),`
+    background-color: ${r};
+    border: 1px solid ${i};
+  `}const g=s.div`
   width: 214px;
   height: 36px;
   border-radius: 4px;
@@ -43,22 +43,22 @@ import{Link as e}from"@tanstack/react-router";import{EnvironmentType as t}from"s
   transform: translateX(-50%);
   text-transform: capitalize;
   ${e=>h(e.$environmentType)}
-`,_=n.div`
-  background-color: ${c.interactive.danger__resting.rgba};
+`,_=s.div`
+  background-color: ${t.interactive.danger__resting.rgba};
   width: 10px;
   height: 10px;
   border-radius: 50%;
   position: absolute;
   right: 2px;
   top: 4px;
-  border: 2px solid ${c.text.static_icons__primary_white.rgba};
+  border: 2px solid ${t.text.static_icons__primary_white.rgba};
   // Box-sizing is a quickfix for use in PWEX because of global styling
   box-sizing: content-box;
-`,v=n(i)`
+`,v=s(r)`
   &:hover ${_} {
-    border: 2px solid ${c.interactive.primary__hover_alt.rgba};
+    border: 2px solid ${t.interactive.primary__hover_alt.rgba};
   }
-  ${({$fieldSelector:e})=>{if(!e)return r`
+  ${({$fieldSelector:e})=>{if(!e)return c`
         height: 36px;
         width: 36px;
       `}}

package/dist/organisms/TopBar/TopBarMenu.js

@@ -1,11 +1,11 @@
-import e,{forwardRef as t,useEffect as n}from"react";import{jsx as r}from"react/jsx-runtime";import i from"styled-components";import{Menu as a}from"@equinor/eds-core-react";import{spacings as o}from"src/atoms/style";const s=i(a)`
+import{spacings as e}from"../../atoms/style/spacings.js";import t,{forwardRef as n,useEffect as r}from"react";import{Menu as i}from"@equinor/eds-core-react";import a from"styled-components";import{jsx as o}from"react/jsx-runtime";const s=a(i)`
   padding: 0 !important;
   min-width: 350px;
   width: fit-content;
   border-radius: 5px;
-  ${({$withGap:e})=>e&&` > div[role="menu"] {
-      gap: ${o.large}; 
+  ${({$withGap:t})=>t&&` > div[role="menu"] {
+      gap: ${e.large}; 
      
   }
   `}
-`,c=t(({open:e,onClose:t,children:i,anchorEl:a,isNotification:o,withGap:c=!1},l)=>(n(()=>{let n=()=>{e&&t()};return window.addEventListener(`resize`,n),()=>{window.removeEventListener(`resize`,n)}},[e,t]),e?r(s,{open:e,onClose:t,anchorEl:a,placement:o?`bottom`:`bottom-end`,"data-testid":`top-bar-menu`,ref:l,$withGap:c,children:i}):null));c.displayName=`TopBarMenu`;export{c as TopBarMenu};
+`,c=n(({open:e,onClose:t,children:n,anchorEl:i,isNotification:a,withGap:c=!1},l)=>(r(()=>{let n=()=>{e&&t()};return window.addEventListener(`resize`,n),()=>{window.removeEventListener(`resize`,n)}},[e,t]),e?o(s,{open:e,onClose:t,anchorEl:i,placement:a?`bottom`:`bottom-end`,"data-testid":`top-bar-menu`,ref:l,$withGap:c,children:n}):null));c.displayName=`TopBarMenu`;export{c as TopBarMenu};

package/dist/organisms/TopBar/TransferToAppDialog.js

@@ -1,8 +1,8 @@
-import e from"react";import{Fragment as t,jsx as n,jsxs as r}from"react/jsx-runtime";import{capitalize as i}from"src/atoms/utils";import{close as a}from"@equinor/eds-icons";import o from"styled-components";import{Button as s,Dialog as c,Icon as l,LinearProgress as u,Typography as d}from"@equinor/eds-core-react";import{spacings as f}from"src/atoms/style";import{useFakeProgress as p}from"src/atoms/hooks";import{AnimatedCheckmark as m}from"src/molecules/AnimatedCheckmark/AnimatedCheckmark";const h=o(c)`
+import{spacings as e}from"../../atoms/style/spacings.js";import{capitalize as t}from"../../atoms/utils/string.js";import{useFakeProgress as n}from"../../atoms/hooks/useFakeProgress.js";import{AnimatedCheckmark as r}from"../../molecules/AnimatedCheckmark/AnimatedCheckmark.js";import i from"react";import{Button as a,Dialog as o,Icon as s,LinearProgress as c,Typography as l}from"@equinor/eds-core-react";import u from"styled-components";import{Fragment as d,jsx as f,jsxs as p}from"react/jsx-runtime";import{close as m}from"@equinor/eds-icons";const h=u(o)`
   width: 400px;
   height: 323px;
-`,g=o.div`
-  gap: ${f.medium};
+`,g=u.div`
+  gap: ${e.medium};
   position: absolute;
   top: 50%;
   left: 50%;
@@ -14,20 +14,20 @@ import e from"react";import{Fragment as t,jsx as n,jsxs as r}from"react/jsx-runt
 
   width: 100%;
   max-width: 370px;
-  padding: ${f.medium} ${f.large};
-`,_=o(d)`
+  padding: ${e.medium} ${e.large};
+`,_=u(l)`
   span {
     text-transform: capitalize;
   }
-`,v=o.div`
+`,v=u.div`
   display: flex;
   flex-direction: column;
-  gap: ${f.large};
-`,y=o.div`
+  gap: ${e.large};
+`,y=u.div`
   display: flex;
   flex-direction: column;
-  gap: ${f.small};
+  gap: ${e.small};
   width: 100%;
   align-items: center;
-  padding: ${f.large} 0;
-`,b=({onClose:e,applicationName:o,url:f})=>{let{finished:b,progress:x}=p({onDone:()=>window.open(f,`_self`)});return n(t,{children:r(h,{open:!0,children:[r(c.Header,{children:[`Open link`,n(s,{variant:`ghost_icon`,onClick:e,"data-testid":`close-transfer-app`,children:n(l,{data:a})})]}),n(c.CustomContent,{children:n(g,{children:b?r(y,{children:[n(_,{variant:`h3`,children:n(`span`,{children:i(o)})}),n(m,{size:`small`})]}):r(v,{children:[r(d,{variant:`h3`,children:[`Transferring you to application.`,`.`.repeat(x/35)]}),n(u,{variant:`determinate`,value:x})]})})})]})})};export{b as TransferToAppDialog};
+  padding: ${e.large} 0;
+`,b=({onClose:e,applicationName:i,url:u})=>{let{finished:b,progress:x}=n({onDone:()=>window.open(u,`_self`)});return f(d,{children:p(h,{open:!0,children:[p(o.Header,{children:[`Open link`,f(a,{variant:`ghost_icon`,onClick:e,"data-testid":`close-transfer-app`,children:f(s,{data:m})})]}),f(o.CustomContent,{children:f(g,{children:b?p(y,{children:[f(_,{variant:`h3`,children:f(`span`,{children:t(i)})}),f(r,{size:`small`})]}):p(v,{children:[p(l,{variant:`h3`,children:[`Transferring you to application.`,`.`.repeat(x/35)]}),f(c,{variant:`determinate`,value:x})]})})})]})})};export{b as TransferToAppDialog};

package/dist/organisms/TopBar/Tutorials/TutorialItem.js

@@ -1,21 +1,21 @@
-import{jsx as e,jsxs as t}from"react/jsx-runtime";import{useTutorials as n}from"@equinor/subsurface-app-management";import{check as r,chevron_right as i}from"@equinor/eds-icons";import a from"styled-components";import{Icon as o,Typography as s}from"@equinor/eds-core-react";import{animation as c,colors as l,spacings as u}from"src/atoms/style";const d=a.button`
+import{animation as e}from"../../../atoms/style/animation.js";import{colors as t}from"../../../atoms/style/colors.js";import{spacings as n}from"../../../atoms/style/spacings.js";import{Icon 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{check as c,chevron_right as l}from"@equinor/eds-icons";import{useTutorials as u}from"@equinor/subsurface-app-management";const d=a.button`
   display: grid;
   align-items: center;
   grid-template-columns: 1fr auto;
-  row-gap: ${u.small};
-  padding: ${u.medium};
-  transition: background ${c.transitionMS};
+  row-gap: ${n.small};
+  padding: ${n.medium};
+  transition: background ${e.transitionMS};
   > header {
     display: flex;
     align-items: center;
-    gap: ${u.small};
+    gap: ${n.small};
     grid-column: span 2;
     > p {
-      color: ${l.interactive.primary__resting.rgba};
+      color: ${t.interactive.primary__resting.rgba};
       font-weight: 500;
     }
   }
   &:hover {
-    background: ${l.interactive.primary__hover_alt.rgba};
+    background: ${t.interactive.primary__hover_alt.rgba};
   }
-`,f=({onTutorialStart:a,onClose:c,id:u,name:f})=>{let{startTutorial:p,seenTutorialIDs:m}=n(),h=m.includes(u),g=()=>{p(u),a?.(u),c()};return t(d,{onClick:g,children:[h&&t(`header`,{children:[e(o,{data:r,size:16,color:l.interactive.primary__resting.rgba}),e(s,{varinat:`caption`,children:`COMPLETED`})]}),e(s,{variant:`h4`,children:f}),e(o,{data:i,color:l.interactive.primary__resting.rgba})]})};export{f as TutorialItem};
+`,f=({onTutorialStart:e,onClose:n,id:a,name:f})=>{let{startTutorial:p,seenTutorialIDs:m}=u(),h=m.includes(a);return s(d,{onClick:()=>{p(a),e?.(a),n()},children:[h&&s(`header`,{children:[o(r,{data:c,size:16,color:t.interactive.primary__resting.rgba}),o(i,{varinat:`caption`,children:`COMPLETED`})]}),o(i,{variant:`h4`,children:f}),o(r,{data:l,color:t.interactive.primary__resting.rgba})]})};export{f as TutorialItem};

package/dist/organisms/TopBar/Tutorials/Tutorials.js

@@ -1 +1 @@
-import{TutorialItem as e}from"./TutorialItem.js";import{Container as t,TutorialList as n}from"./Tutorials.styles.js";import{useRef as r,useState as i}from"react";import{Fragment as a,jsx as o,jsxs as s}from"react/jsx-runtime";import{useTutorials as c}from"@equinor/subsurface-app-management";import{youtube_alt as l}from"@equinor/eds-icons";import{Divider as u,Icon as d,Typography as f}from"@equinor/eds-core-react";import{TopBarButton as p}from"src/organisms/TopBar/TopBar.styles";import{TopBarMenu as m}from"src/organisms/TopBar/TopBarMenu";const h=({filterTutorials:h,onTutorialStart:g,..._})=>{let{allTutorials:v,tutorialsOnThisPage:y}=c(),[b,x]=i(!1),S=r(null),C=h?v.filter(h):v,w=h?y.filter(h):y,T=C.filter(e=>w.findIndex(t=>t.id===e.id)===-1),E=()=>x(e=>!e);return s(a,{children:[o(p,{variant:`ghost_icon`,ref:S,onClick:E,..._,children:o(d,{data:l})}),b&&o(m,{open:!0,onClose:E,anchorEl:S.current,children:s(t,{children:[s(f,{variant:`h4`,children:[`Available Tutorials (`,C.length,`)`]}),w.length>0&&s(n,{children:[o(f,{variant:`caption`,children:`For current page`}),w.map(t=>o(e,{onTutorialStart:g,onClose:E,...t},t.id))]}),w.length>0&&w.length>0&&o(u,{}),T.length>0&&s(n,{children:[o(f,{variant:`caption`,children:`For other pages`}),T.map(t=>o(e,{onTutorialStart:g,onClose:E,...t},t.id))]})]})})]})};export{h as Tutorials};
+import{TopBarMenu as e}from"../TopBarMenu.js";import{TopBarButton as t}from"../TopBar.styles.js";import{TutorialItem as n}from"./TutorialItem.js";import{Container as r,TutorialList as i}from"./Tutorials.styles.js";import{useRef as a,useState as o}from"react";import{Divider as s,Icon as c,Typography as l}from"@equinor/eds-core-react";import{Fragment as u,jsx as d,jsxs as f}from"react/jsx-runtime";import{youtube_alt as p}from"@equinor/eds-icons";import{useTutorials as m}from"@equinor/subsurface-app-management";const h=({filterTutorials:h,onTutorialStart:g,..._})=>{let{allTutorials:v,tutorialsOnThisPage:y}=m(),[b,x]=o(!1),S=a(null),C=h?v.filter(h):v,w=h?y.filter(h):y,T=C.filter(e=>w.findIndex(t=>t.id===e.id)===-1),E=()=>x(e=>!e);return f(u,{children:[d(t,{variant:`ghost_icon`,ref:S,onClick:E,..._,children:d(c,{data:p})}),b&&d(e,{open:!0,onClose:E,anchorEl:S.current,children:f(r,{children:[f(l,{variant:`h4`,children:[`Available Tutorials (`,C.length,`)`]}),w.length>0&&f(i,{children:[d(l,{variant:`caption`,children:`For current page`}),w.map(e=>d(n,{onTutorialStart:g,onClose:E,...e},e.id))]}),w.length>0&&w.length>0&&d(s,{}),T.length>0&&f(i,{children:[d(l,{variant:`caption`,children:`For other pages`}),T.map(e=>d(n,{onTutorialStart:g,onClose:E,...e},e.id))]})]})})]})};export{h as Tutorials};

package/dist/organisms/TopBar/Tutorials/Tutorials.styles.js

@@ -1,18 +1,18 @@
-import e from"styled-components";import{spacings as t}from"src/atoms/style";const n=e.div`
+import{spacings as e}from"../../../atoms/style/spacings.js";import t from"styled-components";const n=t.div`
   display: flex;
   flex-direction: column;
-  padding: ${t.large};
+  padding: ${e.large};
   width: 520px;
   > h4 {
-    margin-bottom: ${t.x_large};
+    margin-bottom: ${e.x_large};
   }
   > hr {
-    margin-bottom: ${t.x_large};
+    margin-bottom: ${e.x_large};
   }
-`,r=e.section`
+`,r=t.section`
   display: flex;
   flex-direction: column;
   > p:first-child {
-    margin-bottom: ${t.medium_small};
+    margin-bottom: ${e.medium_small};
   }
 `;export{n as Container,r as TutorialList};

package/dist/organisms/index.js

@@ -1 +1 @@
-import{DataGrid as e}from"./DataGrid/DataGrid.js";import{Template as t}from"./Template/Template.js";import{FieldSelector as n}from"./FieldSelector/FieldSelector.js";import{Filter as r}from"./Filter/index.js";import{SideBar as i}from"./SideBar/index.js";import{TopBar as a}from"./TopBar/index.js";import{Status as o}from"./Status/index.js";import{BadRequest as s}from"./Status/collections/BadRequest.js";import{GenericError as c}from"./Status/collections/GenericError.js";import{MissingAccessToApp as l}from"./Status/collections/MissingAccessToApp.js";import{MissingPermissions as u}from"./Status/collections/MissingPermissions.js";import{PageNotFound as d}from"./Status/collections/PageNotFound.js";import{ServerError as f}from"./Status/collections/ServerError.js";import{ApiResponseError as p}from"./Status/collections/ApiResponseError.js";import{TableOfContents as m}from"./TableOfContents/TableOfContents.js";import{PageTitle as h}from"./PageTitle/PageTitle.js";import{ReleaseNote as g}from"./ReleaseNote/ReleaseNote.js";import{ToggleGroup as _}from"./ToggleGroup/index.js";import{Faq as v}from"./Faq/Faq.js";import{Card as y}from"@equinor/eds-core-react";export{y as Card};
+import{Status as e}from"./Status/index.js";import{MissingAccessToApp as t}from"./Status/collections/MissingAccessToApp.js";import{DataGrid as n}from"./DataGrid/DataGrid.js";import{Template as r}from"./Template/Template.js";import{FieldSelector as i}from"./FieldSelector/FieldSelector.js";import{Filter as a}from"./Filter/index.js";import{SideBar as o}from"./SideBar/index.js";import{ReleaseNote as s}from"./ReleaseNote/ReleaseNote.js";import{TopBar as c}from"./TopBar/index.js";import{BadRequest as l}from"./Status/collections/BadRequest.js";import{GenericError as u}from"./Status/collections/GenericError.js";import{MissingPermissions as d}from"./Status/collections/MissingPermissions.js";import{PageNotFound as f}from"./Status/collections/PageNotFound.js";import{ServerError as p}from"./Status/collections/ServerError.js";import{ApiResponseError as m}from"./Status/collections/ApiResponseError.js";import{TableOfContents as h}from"./TableOfContents/TableOfContents.js";import{PageTitle as g}from"./PageTitle/PageTitle.js";import{ToggleGroup as _}from"./ToggleGroup/index.js";import{Faq as v}from"./Faq/Faq.js";import{Card as y}from"@equinor/eds-core-react";export{y as Card};

package/dist/providers/AuthProvider/AuthProvider.js

@@ -0,0 +1 @@
+import{auth as e,environment as t}from"../../atoms/utils/auth_environment.js";import{AuthProviderInner as n}from"./AuthProviderInner.js";import{createContext as r,useContext as i,useMemo as a,useState as o}from"react";import{MsalProvider as s}from"@azure/msal-react";import{jsx as c}from"react/jsx-runtime";const{msalApp:l}=e,{getIsMock:u,getMockUserPhoto:d,getMockRoles:f}=t,p=r(void 0),m=()=>{let e=i(p);if(e===void 0)throw Error(`useAuth must be used within a AuthContext provider`);return e},h={homeAccountId:`mock-home-account-id`,environment:`mock`,tenantId:`mock-tenant-id`,username:`MOCK@equinor.com`,localAccountId:`mock-local-account-id`,name:`Mock mocksnes`,idToken:`fake`,idTokenClaims:{id:`claim`},nativeAccountId:`accountid`,authorityType:`authority`,tenantProfiles:new Map},g=({children:e,loadingComponent:t,unauthorizedComponent:r,withoutLoader:i=!1,withoutBackend:m=!1})=>{let[g,_]=o(void 0),[v,y]=o(),[b,x]=o(`loading`),[S,C]=o(),w=a(()=>u(import.meta.env.VITE_IS_MOCK),[]),T=a(()=>d(import.meta.env.VITE_MOCK_USER_PHOTO),[]),E=a(()=>f(import.meta.env.VITE_MOCK_ROLES),[]);return w?(b===`loading`&&setTimeout(()=>{x(`authorized`)},1e3),c(p.Provider,{value:{roles:E,account:h,photo:T,logout:()=>console.log(`Logged out the user!`),authState:b},children:e})):c(p.Provider,{value:{roles:v,account:g,photo:S,logout:()=>l.logoutRedirect(),authState:b},children:c(s,{instance:l,children:c(n,{loadingComponent:t,unauthorizedComponent:r,account:g,setAccount:_,setRoles:y,setPhoto:C,authState:b,setAuthState:x,withoutLoader:i,withoutBackend:m,children:e})})})};export{g as AuthProvider,m as useAuth};

package/dist/providers/AuthProvider/AuthProviderInner.js

@@ -0,0 +1 @@
+import{auth as e,environment as t}from"../../atoms/utils/auth_environment.js";import{FullPageSpinner as n}from"../../molecules/FullPageSpinner/FullPageSpinner.js";import{MissingAccessToApp as r}from"../../organisms/Status/collections/MissingAccessToApp.js";import{useEffect as i,useRef as a,useState as o}from"react";import{useMsal as s,useMsalAuthentication as c}from"@azure/msal-react";import{InteractionRequiredAuthError as l,InteractionType as u}from"@azure/msal-browser";import{jsx as d}from"react/jsx-runtime";import{jwtDecode as f}from"jwt-decode";const{GRAPH_ENDPOINTS:p,GRAPH_REQUESTS_LOGIN:m,GRAPH_REQUESTS_PHOTO:h,GRAPH_REQUESTS_BACKEND:g,fetchMsGraph:_,isInIframe:v}=e,{getApiScope:y}=t,b=({children:e,account:t,setAccount:b,setPhoto:x,setRoles:S,authState:C,setAuthState:w,withoutLoader:T,loadingComponent:E,unauthorizedComponent:D,withoutBackend:O})=>{let{instance:k,accounts:A,inProgress:j}=s(),{login:M,result:N,error:P,acquireToken:F}=c(u.Silent,m),[I,L]=o(!1),R=a(!1);return i(()=>{I||(async()=>{console.log(`[AuthProvider] Initializing`),await k.initialize(),console.log(`[AuthProvider] Finished initializing`),L(!0)})().catch(e=>{console.error(`[AuthProvider] Error during initialization`,e)})},[k,I]),i(()=>{I&&(P instanceof l&&!v()&&C!==`unauthorized`?(console.error(P),console.log(`[AuthProvider] No account found, need to login via. redirect`),M(u.Redirect,m).catch(e=>{console.error(`[AuthProvider] Error during login`,e)})):N?.account&&!t?(console.log(`[AuthProvider] Found account in useMsalAuth result, setting that one as active`),k.setActiveAccount(N.account),b(N.account)):A.length>0&&!t?(console.log(`[AuthProvider] Found account in accounts array, setting that one as active`),k.setActiveAccount(A[0]),b(A[0])):P&&console.error(`[AuthProvider] Unexpected error:`,P))},[t,A,P,k,I,M,N,b,C]),i(()=>{if(!t||!I||R.current||j!==`none`)return;R.current=!0;let e=async()=>{try{let e=await F(u.Silent,h);if(e){let t=await _(p.PHOTO,e.accessToken);if(t.status===404)return null;let n=await t.blob(),r=(window.URL??window.webkitURL).createObjectURL(n);x(r)}}catch(e){console.error(e)}},n=async()=>{try{let e=await F(u.Silent,g(y(import.meta.env.VITE_API_SCOPE)));if(console.log(`[AuthProvider] Successfully acquired token`),e&&e.accessToken){console.log(`[AuthProvider] Decoding token`);let t=f(e.accessToken);if(console.log(`[AuthProvider] Token was valid`),t.roles)console.log(`[AuthProvider] Found roles`),S(t.roles);else throw Error(`Could not find roles in token`);w(`authorized`)}}catch(e){console.error(`[AuthProvider] Token error when trying to get roles!`,e),w(`unauthorized`)}};(async()=>{await e(),O?w(`authorized`):await n()})()},[t,F,P,I,j,w,x,S,O]),C===`unauthorized`?D??d(r,{}):T?e:C===`loading`||t===void 0?E??d(n,{variant:`application`}):e};export{b as AuthProviderInner};

package/dist/providers/LoadingProvider.js

@@ -1 +1 @@
-import{useAuth as e}from"src/providers/AuthProvider/AuthProvider";import{useEffect as t,useState as n}from"react";import{jsx as r}from"react/jsx-runtime";import{SAM_QUERIES as i}from"@equinor/subsurface-app-management";import{useIsFetching as a}from"@tanstack/react-query";import{FullPageSpinner as o}from"src/molecules/FullPageSpinner/FullPageSpinner";const s=({customQueryKeys:s=[],children:c})=>{let{authState:l}=e(),u=a({predicate:e=>i.some(t=>e.queryKey.includes(t))||s.some(t=>e.queryKey.includes(t))})>0,[d,f]=n(!0);return t(()=>{l===`authorized`&&!u&&d&&f(!1)},[l,u,d]),l===`authorized`?d?r(o,{variant:`application`,fixedPosition:!0,children:c}):c:r(o,{variant:`application`,fixedPosition:!0})};export{s as LoadingProvider};
+import{FullPageSpinner as e}from"../molecules/FullPageSpinner/FullPageSpinner.js";import{useAuth as t}from"./AuthProvider/AuthProvider.js";import{useEffect as n,useState as r}from"react";import{jsx as i}from"react/jsx-runtime";import{SAM_QUERIES as a}from"@equinor/subsurface-app-management";import{useIsFetching as o}from"@tanstack/react-query";const s=({customQueryKeys:s=[],children:c})=>{let{authState:l}=t(),u=o({predicate:e=>a.some(t=>e.queryKey.includes(t))||s.some(t=>e.queryKey.includes(t))})>0,[d,f]=r(!0);return n(()=>{l===`authorized`&&!u&&d&&f(!1)},[l,u,d]),l===`authorized`?d?i(e,{variant:`application`,fixedPosition:!0,children:c}):c:i(e,{variant:`application`,fixedPosition:!0})};export{s as LoadingProvider};

package/dist/providers/ReleaseNotesProvider.js

@@ -1 +1 @@
-import{createContext as e,useContext as t,useEffect as n,useState as r}from"react";import{jsx as i}from"react/jsx-runtime";import{useReleaseNotesQuery as a}from"@equinor/subsurface-app-management";import{EnvironmentType as o}from"src/atoms/enums/Environment";import{useLocalStorage as s}from"src/atoms/hooks/useLocalStorage";import{environment as c}from"src/atoms/utils";import{usingReleaseNoteDate as l}from"src/organisms/ReleaseNote/ReleaseNote.utils";import{environmentAndAppNameToURL as u}from"src/organisms/TopBar/Resources/ReleaseNotesDialog/ReleaseNotesDialog.utils";import{sortReleaseNotesByDate as d}from"src/providers/ReleaseNotesProvider.utils";const{getEnvironmentName:f,getAppName:p}=c,m=e(void 0),h=1e3*60*60*24*14,g=({children:e,enabled:t,popUpNewReleaseNote:c=!1})=>{let{data:g}=a({enabled:t}),[_,v]=r(!1),[y,b]=s(`release-notes-was-viewed-key`,``,h),x=g?.toSorted(d).at(0),S=p(import.meta.env.VITE_NAME),C=f(import.meta.env.VITE_ENVIRONMENT_NAME),w=C===o.LOCALHOST?o.DEVELOP:C,T=u(w,S);return n(()=>{if(!x||!c)return;let e=new Date(l(x)).getTime(),t=Date.now(),n=t-e;n<=h&&y!==x.releaseId&&(v(!0),b(x.releaseId))},[y,x,c,b]),i(m.Provider,{value:{open:_,setOpen:v,mostRecentReleaseNote:x,showAllReleaseNotesLink:T},children:e})};export{g as ReleaseNotesProvider};
+import{EnvironmentType as e}from"../atoms/enums/Environment.js";import{environment as t}from"../atoms/utils/auth_environment.js";import{useLocalStorage as n}from"../atoms/hooks/useLocalStorage.js";import{usingReleaseNoteDate as r}from"../organisms/ReleaseNote/ReleaseNote.utils.js";import{environmentAndAppNameToURL as i}from"../organisms/TopBar/Resources/ReleaseNotesDialog/ReleaseNotesDialog.utils.js";import{sortReleaseNotesByDate as a}from"./ReleaseNotesProvider.utils.js";import{createContext as o,useContext as s,useEffect as c,useState as l}from"react";import{jsx as u}from"react/jsx-runtime";import{useReleaseNotesQuery as d}from"@equinor/subsurface-app-management";const{getEnvironmentName:f,getAppName:p}=t,m=o(void 0),h=()=>{let e=s(m);if(e===void 0)throw Error(`useReleaseNotes must be used within a ReleaseNotesProvider`);return e},g=1e3*60*60*24*14,_=({children:t,enabled:o,popUpNewReleaseNote:s=!1})=>{let{data:h}=d({enabled:o}),[_,v]=l(!1),[y,b]=n(`release-notes-was-viewed-key`,``,g),x=h?.toSorted(a).at(0),S=p(import.meta.env.VITE_NAME),C=f(import.meta.env.VITE_ENVIRONMENT_NAME),w=C===e.LOCALHOST?e.DEVELOP:C,T=i(w,S);return c(()=>{if(!x||!s)return;let e=new Date(r(x)).getTime();Date.now()-e<=g&&y!==x.releaseId&&(v(!0),b(x.releaseId))},[y,x,s,b]),u(m.Provider,{value:{open:_,setOpen:v,mostRecentReleaseNote:x,showAllReleaseNotesLink:T},children:t})};export{_ as ReleaseNotesProvider,h as useReleaseNotes};

package/dist/providers/ReleaseNotesProvider.utils.js

@@ -0,0 +1 @@
+import{sortByDate as e}from"../atoms/utils/sort.js";const t=(t,n)=>e(t.releaseDate??t.createdDate,n.releaseDate??n.createdDate);export{t as sortReleaseNotesByDate};

package/dist/providers/SideBarProvider.js

@@ -1 +1 @@
-import{createContext as e,useContext as t,useReducer as n}from"react";import{jsx as r}from"react/jsx-runtime";const i=e(void 0),a=`amplify-sidebar-state`,o=()=>{let e=localStorage.getItem(a);return e?JSON.parse(e):{isOpen:!1}},s=e=>{localStorage.setItem(a,JSON.stringify(e))},c=(e,t)=>(s(t),t),l=({children:e})=>{let[t,a]=n(c,o()),s=e=>{a({isOpen:e})};return r(i.Provider,{value:{isOpen:t.isOpen,setIsOpen:s},children:e})};export{l as SideBarProvider};
+import{createContext as e,useContext as t,useReducer as n}from"react";import{jsx as r}from"react/jsx-runtime";function i(){let e=t(a);if(e===void 0)throw Error(`Sidebar hook must be used within Provider`);return e}const a=e(void 0),o=`amplify-sidebar-state`,s=()=>{let e=localStorage.getItem(o);return e?JSON.parse(e):{isOpen:!1}},c=e=>{localStorage.setItem(o,JSON.stringify(e))},l=(e,t)=>(c(t),t),u=({children:e})=>{let[t,i]=n(l,s());return r(a.Provider,{value:{isOpen:t.isOpen,setIsOpen:e=>{i({isOpen:e})}},children:e})};export{u as SideBarProvider,i as useSideBar};

package/dist/providers/SnackbarProvider/SnackbarProvider.js

@@ -0,0 +1 @@
+import{StyledSnackbar as e}from"./SnackbarProvider.styles.js";import{snackbarIcon as t}from"./SnackbarProvider.utils.js";import{createContext as n,useCallback as r,useContext as i,useState as a}from"react";import{Button as o,Icon as s,Snackbar as c,Typography as l}from"@equinor/eds-core-react";import{jsx as u,jsxs as d}from"react/jsx-runtime";import{close as f}from"@equinor/eds-icons";const p=n(void 0),m=()=>{let e=i(p);if(e===void 0)throw Error(`useSnackbar must be used within a SnackbarContextProvider`);return e},h=({children:n,...i})=>{let[m,h]=a(!1),[g,_]=a(void 0),[v,y]=a(i),[b,x]=a(),S=r((e,t)=>{_(typeof e==`string`?{text:e,variant:`info`}:e),y(t?.customProps??i),x(t?.action??void 0),h(!0)},[i]),C=e=>{x(t=>t&&{...t,disabled:e})},w=()=>h(!1),T=()=>{h(!1),v.onClose&&v.onClose()};return d(p.Provider,{value:{showSnackbar:S,setActionDisabledState:C,hideSnackbar:w},children:[n,d(e,{$variant:g?.variant,open:m,onClose:T,autoHideDuration:v.autoHideDuration,placement:v.placement,children:[g&&u(s,{data:t(g.variant)}),u(l,{variant:`body_short`,children:g?.text}),b&&u(c.Action,{children:u(o,{disabled:b.disabled,variant:`ghost`,onClick:b.handler,children:b.text})}),u(o,{variant:`ghost_icon`,onClick:T,children:u(s,{data:f})})]})]})};export{h as SnackbarProvider,m as useSnackbar};

package/dist/providers/SnackbarProvider/SnackbarProvider.styles.js

@@ -0,0 +1,41 @@
+import{colors as e}from"../../atoms/style/colors.js";import{spacings as t}from"../../atoms/style/spacings.js";import{Snackbar as n}from"@equinor/eds-core-react";import r,{css as i}from"styled-components";const a={info:{outline:e.text.static_icons__default.rgba,text:e.text.static_icons__primary_white.rgba,icon:e.text.static_icons__primary_white.rgba},warning:{outline:e.interactive.warning__highlight.rgba,text:e.ui.background__warning.rgba,icon:e.interactive.warning__resting.rgba},error:{outline:e.interactive.danger__highlight.rgba,text:e.ui.background__danger.rgba,icon:e.interactive.danger__resting.rgba}},o=r(n)`
+  display: grid;
+  align-items: center;
+  grid-template-columns: auto 1fr auto;
+  gap: ${t.small};
+  max-width: 512px;
+  min-width: calc(300px - ${t.medium} * 2);
+  background: ${e.text.static_icons__default.rgba};
+  padding: ${t.small} ${t.small} ${t.small}
+    ${t.medium};
+  min-height: unset;
+  &:has(div > button) {
+    grid-template-columns: auto 1fr auto auto;
+  }
+  > div > button:hover,
+  > button:hover {
+    color: ${e.text.static_icons__default.rgba};
+    background: ${e.ui.background__light.rgba};
+    svg {
+      fill: ${e.text.static_icons__default.rgba};
+    }
+  }
+  > button {
+    height: 36px;
+    width: 36px;
+  }
+  ${({$variant:e})=>{if(!e)return``;let{outline:t,text:n,icon:r}=a[e];return i`
+      outline: 1px solid ${t};
+
+      p,
+      button {
+        color: ${n};
+      }
+      svg {
+        fill: ${n};
+      }
+      > svg:first-child {
+        fill: ${r};
+      }
+    `}}
+`;export{o as StyledSnackbar};

package/dist/providers/SnackbarProvider/SnackbarProvider.utils.js

@@ -0,0 +1 @@
+import{error_outlined as e,info_circle as t,warning_outlined as n}from"@equinor/eds-icons";function r(r){switch(r){case`info`:return t;case`warning`:return n;case`error`:return e}}export{r as snackbarIcon};

package/dist/providers/StepperProvider.js

@@ -1 +1 @@
-import{createContext as e,useCallback as t,useContext as n,useState as r}from"react";import{jsx as i}from"react/jsx-runtime";import{useLocation as a,useNavigate as o,useParams as s}from"@tanstack/react-router";const c=e(void 0),l=({steps:e,children:n,isStepDisabled:l,...u})=>{let{step:d}=s({strict:!1}),f=o(),p=a().pathname.split(`/`).slice(0,-1).join(`/`),m=u.syncToURLParam?Number(d):u?.initialStep??0;if(u.syncToURLParam&&d&&isNaN(Number(d)))throw Error(`Step URL param must be a valid number when using "syncToURLParam"`);if(e.length<2)throw Error(`Stepper must have at least 2 steps`);let[h,g]=r(m),_=u.syncToURLParam?Number(d):h,[v,y]=r(0);if(m>=e.length||m<0)throw Error(`initialStep must be a valid index of the steps array`);let b=e=>{u.syncToURLParam?f({to:`${p}/${e}`}):g(e)},x=()=>{v!==0&&y(0)},S=()=>{if(`subSteps`in e[_]&&e[_].subSteps&&v<e[_].subSteps.length-1){y(e=>e+1);return}_!==e.length-1&&(b(_+1),x())},C=()=>{if(v>0&&`subSteps`in e[_]&&e[_].subSteps&&e[_].subSteps.length>0){y(e=>e-1);return}if(_===0)return;b(_-1);let t=e.at(_-1);t&&`subSteps`in t&&t.subSteps&&y(t.subSteps.length-1)},w=t(t=>l?l({step:e[t],stepIndex:t,currentStep:e[_],currentStepIndex:_}):!1,[l,_,e]);return i(c.Provider,{value:{steps:e,currentStep:_,currentSubStep:v,setCurrentStep:b,goToNextStep:S,goToPreviousStep:C,isStepAtIndexDisabled:w},children:n})};export{l as StepperProvider};
+import{createContext as e,useCallback as t,useContext as n,useState as r}from"react";import{jsx as i}from"react/jsx-runtime";import{useLocation as a,useNavigate as o,useParams as s}from"@tanstack/react-router";const c=e(void 0);function l(){let e=n(c);if(!e)throw Error(`useStepper must be used within a StepperProvider`);return e}const u=({steps:e,children:n,isStepDisabled:l,...u})=>{let{step:d}=s({strict:!1}),f=o(),p=a().pathname.split(`/`).slice(0,-1).join(`/`),m=u.syncToURLParam?Number(d):u?.initialStep??0;if(u.syncToURLParam&&d&&isNaN(Number(d)))throw Error(`Step URL param must be a valid number when using "syncToURLParam"`);if(e.length<2)throw Error(`Stepper must have at least 2 steps`);let[h,g]=r(m),_=u.syncToURLParam?Number(d):h,[v,y]=r(0);if(m>=e.length||m<0)throw Error(`initialStep must be a valid index of the steps array`);let b=e=>{u.syncToURLParam?f({to:`${p}/${e}`}):g(e)},x=()=>{v!==0&&y(0)},S=()=>{if(`subSteps`in e[_]&&e[_].subSteps&&v<e[_].subSteps.length-1){y(e=>e+1);return}_!==e.length-1&&(b(_+1),x())},C=()=>{if(v>0&&`subSteps`in e[_]&&e[_].subSteps&&e[_].subSteps.length>0){y(e=>e-1);return}if(_===0)return;b(_-1);let t=e.at(_-1);t&&`subSteps`in t&&t.subSteps&&y(t.subSteps.length-1)},w=t(t=>l?l({step:e[t],stepIndex:t,currentStep:e[_],currentStepIndex:_}):!1,[l,_,e]);return i(c.Provider,{value:{steps:e,currentStep:_,currentSubStep:v,setCurrentStep:b,goToNextStep:S,goToPreviousStep:C,isStepAtIndexDisabled:w},children:n})};export{u as StepperProvider,l as useStepper};

package/dist/providers/TableOfContentsProvider.js

@@ -1 +1 @@
-import{createContext as e,useCallback as t,useContext as n,useEffect as r,useMemo as i,useRef as a,useState as o}from"react";import{jsx as s}from"react/jsx-runtime";import{useLocation as c,useNavigate as l}from"@tanstack/react-router";import{useOnScreenMultiple as u}from"src/atoms/hooks/useOnScreenMultiple";import{getValues as d}from"src/providers/TableOfContentsProvider.utils";const f=e(void 0),p=({items:e,children:n,hashNavigation:p})=>{let m=l(),{hash:h}=c(),[g,_]=o(e[0]?.value),[v,y]=o([]),b=a(!1),x=i(()=>e.flatMap(e=>d([],e)),[e]);r(()=>{y(x.map(e=>document.getElementById(e)))},[x]),r(()=>{h.length||(b.current=!0)},[h]);let S=t(e=>{if(e.value===g)return!0;if(e.children&&g){let t=d([],e);return t.includes(g)}return!1},[g]),C=u(v),w=a(-1),T=t((e,t)=>{let n=x.findIndex(t=>t===e);if(p){_(x[n]),m({to:`.`,hash:`#${x[n]}`,hashScrollIntoView:!1,replace:!0});return}let r=v[n];if(r){let e=t?.behavior??`smooth`;r.scrollIntoView({block:`start`,behavior:e}),w.current=n;let i=1/0,a=0,o=()=>{let e=r?.getBoundingClientRect().top;if(e===i){if(a+=1,a>1){_(x[n]),w.current=-1;return}}else a=0,i=e;requestAnimationFrame(o)};requestAnimationFrame(o)}},[v,p,m,x]);return r(()=>{if(h&&!b.current){b.current=!0;let e=decodeURIComponent(h.replace(`#`,``));if(!e.length||!x.includes(e))return;_(e),m({to:`.`,hash:`#${e}`,hashScrollIntoView:{block:`start`,behavior:`instant`},replace:!0})}},[h,m,x]),r(()=>{if(C.length===0||C.length!==x.length||w.current!==-1||!b.current)return;let e=-1;for(let t=C.length-1;t>=0;t--)C[t]&&(e=t);e===-1||x.at(e)===void 0||(_(x[e]),p&&m({to:`.`,hash:`#${x[e]}`,hashScrollIntoView:!1,replace:!0}))},[T,p,m,x,C]),s(f.Provider,{value:{items:e,selected:g,setSelected:T,isActive:S},children:n})};export{p as TableOfContentsProvider};
+import{useOnScreenMultiple as e}from"../atoms/hooks/useOnScreenMultiple.js";import{getValues as t}from"./TableOfContentsProvider.utils.js";import{createContext as n,useCallback as r,useContext as i,useEffect as a,useMemo as o,useRef as s,useState as c}from"react";import{jsx as l}from"react/jsx-runtime";import{useLocation as u,useNavigate as d}from"@tanstack/react-router";const f=n(void 0);function p(){let e=i(f);if(e===void 0)throw Error(`'useTableOfContents' must be used within provider`);return e}const m=({items:n,children:i,hashNavigation:p})=>{let m=d(),{hash:h}=u(),[g,_]=c(n[0]?.value),[v,y]=c([]),b=s(!1),x=o(()=>n.flatMap(e=>t([],e)),[n]);a(()=>{y(x.map(e=>document.getElementById(e)))},[x]),a(()=>{h.length||(b.current=!0)},[h]);let S=r(e=>e.value===g?!0:e.children&&g?t([],e).includes(g):!1,[g]),C=e(v),w=s(-1),T=r((e,t)=>{let n=x.findIndex(t=>t===e);if(p){_(x[n]),m({to:`.`,hash:`#${x[n]}`,hashScrollIntoView:!1,replace:!0});return}let r=v[n];if(r){let e=t?.behavior??`smooth`;r.scrollIntoView({block:`start`,behavior:e}),w.current=n;let i=1/0,a=0,o=()=>{let e=r?.getBoundingClientRect().top;if(e===i){if(a+=1,a>1){_(x[n]),w.current=-1;return}}else a=0,i=e;requestAnimationFrame(o)};requestAnimationFrame(o)}},[v,p,m,x]);return a(()=>{if(h&&!b.current){b.current=!0;let e=decodeURIComponent(h.replace(`#`,``));if(!e.length||!x.includes(e))return;_(e),m({to:`.`,hash:`#${e}`,hashScrollIntoView:{block:`start`,behavior:`instant`},replace:!0})}},[h,m,x]),a(()=>{if(C.length===0||C.length!==x.length||w.current!==-1||!b.current)return;let e=-1;for(let t=C.length-1;t>=0;t--)C[t]&&(e=t);e===-1||x.at(e)===void 0||(_(x[e]),p&&m({to:`.`,hash:`#${x[e]}`,hashScrollIntoView:!1,replace:!0}))},[T,p,m,x,C]),l(f.Provider,{value:{items:n,selected:g,setSelected:T,isActive:S},children:i})};export{m as TableOfContentsProvider,p as useTableOfContents};

package/dist/providers/TableOfContentsProvider.utils.js

@@ -0,0 +1 @@
+function e(t,n){if(n.children){let r=[...t,n.value];for(let t of n.children)r.push(...e([],t));return r}return[...t,n.value]}export{e as getValues};

package/dist/providers/ThemeProvider/ThemeProvider.js

@@ -1 +1 @@
-import{THEME_LOCALSTORAGE_KEY as e}from"./ThemeProvider.constants.js";import{createContext as t,useContext as n,useEffect as r}from"react";import{jsx as i}from"react/jsx-runtime";import{useLocalStorage as a}from"src/atoms/hooks/useLocalStorage";import{Theme as o}from"src/atoms/enums/Theme";const s=t(void 0),c=({children:t})=>{let[n,c]=a(e,o.LIGHT);r(()=>{document.documentElement.setAttribute(`data-theme`,n)},[n]);let l=e=>{c(e)};return i(s.Provider,{value:{theme:n,setTheme:l},children:t})};export{c as ThemeProvider};
+import{useLocalStorage as e}from"../../atoms/hooks/useLocalStorage.js";import{THEME_LOCALSTORAGE_KEY as t}from"./ThemeProvider.constants.js";import{Theme as n}from"../../atoms/enums/Theme.js";import{createContext as r,useContext as i,useEffect as a}from"react";import{jsx as o}from"react/jsx-runtime";const s=r(void 0);function c(){let e=i(s);if(e===void 0)throw Error(`ThemeProvider must be used within Provider`);return e}const l=({children:r})=>{let[i,c]=e(t,n.LIGHT);return a(()=>{document.documentElement.setAttribute(`data-theme`,i)},[i]),o(s.Provider,{value:{theme:i,setTheme:e=>{c(e)}},children:r})};export{l as ThemeProvider,s as ThemeProviderContext,c as useThemeProvider};

package/dist/providers/TutorialHighlightingProvider/TutorialHighlightingProvider.constants.js

@@ -0,0 +1 @@
+const e={initial:{opacity:0},animate:{opacity:1},transition:{delay:.5,duration:.5}};export{e as TUTORIAL_HIGHLIGHT_ANIMATION_PROPS};

package/dist/providers/TutorialHighlightingProvider/TutorialHighlightingProvider.js

@@ -0,0 +1 @@
+import{TutorialHighlightingProviderInner as e}from"./TutorialHighlightingProviderInner.js";import{createContext as t,useContext as n}from"react";import{jsx as r}from"react/jsx-runtime";import{TutorialProvider as i}from"@equinor/subsurface-app-management";const a=t(void 0);function o(){let e=n(a);if(!e)throw Error(`useTutorialHighlighting must be used within a TutorialHighlightingProvider`);return e}const s=({children:t,contentRef:n,customStepContent:o})=>r(a.Provider,{value:{customStepContent:o??{}},children:r(i,{children:r(e,{contentRef:n,children:t})})});export{s as TutorialHighlightingProvider,o as useTutorialHighlighting};

package/dist/providers/TutorialHighlightingProvider/TutorialHighlightingProviderInner.js

@@ -0,0 +1,24 @@
+import{spacings as e}from"../../atoms/style/spacings.js";import{getHighlightElementBoundingBox as t}from"../../atoms/utils/tutorials.js";import{useReversedScrollY as n}from"./hooks/useReversedScrollY.js";import{TUTORIAL_HIGHLIGHT_ANIMATION_PROPS as r}from"./TutorialHighlightingProvider.constants.js";import{TutorialPopover as i}from"./TutorialPopover/TutorialPopover.js";import{useEffect as a,useState as o}from"react";import s from"styled-components";import{Fragment as c,jsx as l,jsxs as u}from"react/jsx-runtime";import{motion as d}from"framer-motion";import{useTutorials as f}from"@equinor/subsurface-app-management";import{useIsFetching as p}from"@tanstack/react-query";const m=s.svg`
+  position: fixed;
+  top: 0;
+  left: 0;
+  height: 100vh;
+  width: 100vw;
+  z-index: 9999999;
+  background: none;
+  pointer-events: none;
+`,h=s.div`
+  position: fixed;
+  top: 0;
+  left: 0;
+  display: flex;
+  flex-direction: column;
+  gap: ${e.medium};
+  z-index: 99999999;
+  justify-content: center;
+  align-items: center;
+  width: 100vw;
+  height: 100vh;
+  background: none;
+  pointer-events: none;
+`,g=({children:e,contentRef:s})=>{let{activeTutorial:g,activeStep:_,unseenTutorialsOnThisPage:v}=f(),y=p()>0,b=n(s),[x,S]=o({width:window.innerWidth,height:window.innerHeight});a(()=>{let e=()=>{S({width:window.innerWidth,height:window.innerHeight})};return window.addEventListener(`resize`,e),()=>window.removeEventListener(`resize`,e)},[]);let[C,w]=o([]);a(()=>{y||(async()=>{if(g&&_!==void 0){if(!g.steps[_].highlightElement)return w([]);let e=await t(g.id,_,x);return w(e?[e]:[])}let e=await Promise.all(v.map(e=>{if(e.steps.at(0)?.highlightElement)return t(e.id,0,x)}));return w(e.filter(e=>e!==void 0))})()},[_,g,y,v,x]);let T=g?[g]:v.filter(e=>e.steps[0].highlightElement&&C.some(e=>e.id)||!e.steps[0].highlightElement);return T.length>0?u(c,{children:[e,l(h,{children:T.map(e=>{let t=C.find(t=>t.id===e.id);return l(i,{isHighlighting:C.length>0,contentRef:s,...e,...t},e.id)})}),u(m,{children:[u(`mask`,{id:`tutorials-rectangles`,children:[l(`rect`,{width:`100%`,height:`100%`,fill:`white`}),l(d.g,{style:{translateY:b},children:C.map(e=>l(d.path,{"data-testid":`tutorial-mask-${e.id}`,initial:{opacity:0,d:`M ${e.left} ${e.top} h ${e.width} v ${e.height} h -${e.width} Z`},animate:{opacity:1,d:`M ${e.left} ${e.top} h ${e.width} v ${e.height} h -${e.width} Z`},fill:`black`},e.id))})]}),l(d.rect,{width:`100%`,height:`100%`,fill:`rgba(111, 111, 111, 0.35)`,mask:`url(#tutorials-rectangles)`,...r})]})]}):l(c,{children:e})};export{g as TutorialHighlightingProviderInner};

package/dist/providers/TutorialHighlightingProvider/TutorialPopover/StepIndicator.js

@@ -0,0 +1,20 @@
+import{animation as e}from"../../../atoms/style/animation.js";import{colors as t}from"../../../atoms/style/colors.js";import{spacings as n}from"../../../atoms/style/spacings.js";import{shape as r}from"../../../atoms/style/index.js";import i from"styled-components";import{jsx as a}from"react/jsx-runtime";import{useTutorials as o}from"@equinor/subsurface-app-management";const s=i.div`
+  display: grid;
+  gap: ${n.x_small};
+`,c=i.span`
+  overflow: hidden;
+  height: 4px;
+  width: 100%;
+  background: ${t.interactive.tutorial__inactive_step.rgba};
+  border-radius: ${r.rounded.borderRadius};
+  position: relative;
+  &:after {
+    content: '';
+    position: absolute;
+    background: ${t.interactive.tutorial__active_step.rgba};
+    width: 100%;
+    height: 100%;
+    transition: left ${e.transitionMS};
+    left: calc(${({$index:e,$activeIndex:t})=>(t-e)*100}%);
+  }
+`,l=({stepAmount:e})=>{let{activeStep:t}=o();return a(s,{style:{gridTemplateColumns:`repeat(${e}, 1fr)`},children:Array.from({length:e}).map((e,n)=>a(c,{$index:n,$activeIndex:t},n))})};export{l as StepIndicator};

package/dist/providers/TutorialHighlightingProvider/TutorialPopover/TutorialPopover.js

@@ -0,0 +1,75 @@
+import{colors as e}from"../../../atoms/style/colors.js";import{spacings as t}from"../../../atoms/style/spacings.js";import{elevation as n}from"../../../atoms/style/index.js";import{TUTORIAL_HIGHLIGHT_ANIMATION_PROPS as r}from"../TutorialHighlightingProvider.constants.js";import{useTutorialPopoverPosition as i}from"./hooks/useTutorialPopoverPosition.js";import{StepIndicator as a}from"./StepIndicator.js";import{useTutorialHighlighting as o}from"../TutorialHighlightingProvider.js";import{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,{css as p}from"styled-components";import{Fragment as m,jsx as h,jsxs as g}from"react/jsx-runtime";import{info_circle as _}from"@equinor/eds-icons";import{motion as v}from"framer-motion";import{useTutorialStepImage as y,useTutorials as b}from"@equinor/subsurface-app-management";function x(e){switch(e){case`top`:return p`
+        left: 50%;
+        top: 0;
+        transform: translate(-50%, 0) rotate(45deg);
+      `;case`top-right`:return p`
+        right: 0;
+        top: 0;
+        transform: translate(-50%, 0) rotate(45deg);
+      `;case`right`:return p`
+        right: 0;
+        top: 50%;
+        transform: translate(0, -50%) rotate(45deg);
+      `;case`bottom-right`:return p`
+        right: 0;
+        bottom: 0;
+        transform: translate(-50%, 0) rotate(45deg);
+      `;case`bottom`:return p`
+        left: 50%;
+        bottom: 0;
+        transform: translate(-50%, 0) rotate(45deg);
+      `;case`bottom-left`:return p`
+        left: 24px;
+        bottom: 0;
+        transform: translate(-50%, 0) rotate(45deg);
+      `;case`left`:return p`
+        left: 0;
+        top: 50%;
+        transform: translate(0, -50%) rotate(45deg);
+      `;case`top-left`:return p`
+        left: 24px;
+        top: 0;
+        transform: translate(-50%, 0) rotate(45deg);
+      `}}const S=f(v(l))`
+  width: 360px;
+  padding: ${t.medium};
+  background: ${e.ui.background__tutorial_card.rgba};
+  display: flex;
+  flex-direction: column;
+  gap: ${t.medium};
+  transition:
+    top 400ms,
+    left 400ms;
+  box-shadow: ${n.above_scrim};
+  pointer-events: auto;
+  > header {
+    display: flex;
+    gap: ${t.small};
+    align-items: center;
+  }
+  > img {
+    max-height: 170px;
+    object-fit: contain;
+  }
+  ${({$highlightingElement:t,$caretPosition:n})=>t&&p`
+      transform: translateX(-50%);
+      &:before {
+        z-index: -1;
+        content: '';
+        width: 32px;
+        height: 32px;
+        background: ${e.ui.background__tutorial_card.rgba};
+        position: absolute;
+        ${x(n)}
+      }
+    `}
+`,C=f.div`
+  display: flex;
+  justify-content: flex-end;
+  gap: ${t.small};
+  &:has(> :last-child:nth-child(3)) {
+    > button:first-child {
+      margin-right: auto;
+    }
+  }
+`,w=({contentRef:t,isHighlighting:n,id:l,top:f,left:p,width:v,height:x,name:w,steps:T})=>{let{customStepContent:E}=o(),{activeTutorial:D,activeStep:O,skipTutorial:k,startTutorial:A,goToNextStep:j,goToPreviousStep:M}=b(),{data:N}=y(D?.steps.at(O)?.imgUrl??void 0),[P,F]=s(void 0),{style:I,highlightingElement:L,caretPosition:R}=i({contentRef:t,top:f,left:p,width:v,height:x,popoverSize:P}),z=e=>{if(!e){F(void 0);return}F({width:e.clientWidth,height:e.clientHeight})},B=()=>{k(l)},V=()=>{A(l)};if(O!==void 0&&T[O].custom&&!E[T[O].id])throw Error(`[TutorialHighlightingProvider]: Custom step content not found, tutorial ID: ${l}, step ID: ${T[O].id}`);return!L&&n?null:!D||O===void 0?g(S,{ref:z,style:{...I},$highlightingElement:L,$caretPosition:R,...r,children:[g(`header`,{children:[h(u,{data:_,color:e.interactive.primary__resting.rgba}),h(d,{variant:`h6`,children:w})]}),g(C,{children:[h(c,{variant:`ghost`,onClick:B,children:`Skip`}),h(c,{onClick:V,children:`Start tour`})]})]}):g(S,{ref:z,style:{...I,width:T[O].custom?`auto`:void 0},$caretPosition:R,$highlightingElement:L,...r,children:[T[O].custom?E[T[O].id]:g(m,{children:[g(`header`,{children:[h(u,{data:_,color:e.interactive.primary__resting.rgba}),h(d,{variant:`h6`,children:T[O]?.title})]}),h(d,{variant:`body_short`,children:T[O]?.body}),N?h(`img`,{src:N,alt:T[O].title}):null]}),g(C,{children:[h(c,{variant:`outlined`,disabled:O===0,onClick:M,children:`Back`}),h(c,{variant:`ghost`,onClick:B,children:`Cancel`}),h(c,{onClick:j,children:O===T.length-1?`Finish`:`Next`})]}),h(a,{stepAmount:T.length})]})};export{w as TutorialPopover};

package/dist/providers/TutorialHighlightingProvider/TutorialPopover/hooks/useTutorialPopoverPosition.js

@@ -0,0 +1 @@
+import{useReversedScrollY as e}from"../../hooks/useReversedScrollY.js";import{useTransform as t}from"framer-motion";function n({top:n,left:r,width:i,height:a,popoverSize:o,contentRef:s}){let c=e(s),l=n&&a?n+a+16:void 0,u=r&&i?r+i/2:void 0,d=!!l&&!!u,f=`top`,p=(o?.width??0)/2+16,m=window.innerWidth-16,h=window.innerHeight-16,g=n!==void 0&&a!==void 0&&r!==void 0&&i!==void 0&&u!==void 0&&o!==void 0&&u<o.width/2,_=n!==void 0&&a!==void 0&&r!==void 0&&i!==void 0&&u!==void 0&&o!==void 0&&u+o.width>window.innerWidth;g?(u=r+i+o.width/2+16,l=n-o.height/2-16/4,f=`left`):_&&(u=r-o.width/2-16,l=n-o.height/2-16/4,f=`right`);let v=n!==void 0&&a!==void 0&&l!==void 0&&o!==void 0&&n+a/2+o.height>=window.innerHeight,y=n!==void 0&&a!==void 0&&l!==void 0&&o!==void 0&&l<o.height;y?l=n+a+16:v&&(l=n-o.height-a-32),g&&(y||v)?u=r+o?.width/2:_&&(y||v)&&(u=r+i-o?.width/2),y&&g?f=`top-left`:y&&_&&(f=`top-right`),v&&g?f=`bottom-left`:v&&_?f=`bottom-right`:v&&(f=`bottom`);let b=t(c,e=>{if(!d||!l)return null;let t=e+l;return t<32?32:t>h?h:t});return u&&u<p?u=p:u&&u>m&&(u=m),{style:{position:d?`absolute`:void 0,top:b,left:u},highlightingElement:d,caretPosition:f}}export{n as useTutorialPopoverPosition};

package/dist/providers/TutorialHighlightingProvider/hooks/useReversedScrollY.js

@@ -0,0 +1 @@
+import{useScroll as e,useTransform as t}from"framer-motion";function n(n){let{scrollY:r}=e({container:n});return t(r,e=>e>0?e*-1:0)}export{n as useReversedScrollY};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@equinor/amplify-component-lib",
-  "version": "9.16.0-beta.0",
+  "version": "9.16.0-beta.1",
   "description": "Frontend Typescript components for the Amplify team",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -95,7 +95,7 @@
     "resize-observer-polyfill": "^1.5.1",
     "resolve-tspaths": "^0.8.23",
     "storybook": "^9.1.1",
-    "tsdown": "^0.14.1",
+    "tsdown": "^0.14.2",
     "typescript": "^5.8.2",
     "typescript-eslint": "^8.26.1",
     "uuid": "^11.1.0",

package/dist/atoms/hooks/index.js

@@ -1 +0,0 @@
-import{useAmplifyKit as e}from"./useAmplifyKit.js";import{useDebounce as t}from"./useDebounce.js";import{useFakeProgress as n}from"./useFakeProgress.js";import{useLocalStorage as r}from"./useLocalStorage.js";import{usePrevious as i}from"./usePrevious.js";import{useSelect as a}from"./useSelect.js";import{usePrefetchRichTextImages as o}from"./usePrefetchRichTextImages.js";import{useFaqsInApplication as s}from"./useFaqsInApplication.js";import{useAuth as c}from"src/providers/AuthProvider/AuthProvider";import{useSnackbar as l}from"src/providers/SnackbarProvider/SnackbarProvider";import{useOnScreenMultiple as u}from"src/atoms/hooks/useOnScreenMultiple";import{useNotification as d}from"src/organisms/TopBar/Notifications/NotificationProvider";import{useReleaseNotes as f}from"src/providers/ReleaseNotesProvider";import{useSideBar as p}from"src/providers/SideBarProvider";import{useStepper as m}from"src/providers/StepperProvider";import{useTableOfContents as h}from"src/providers/TableOfContentsProvider";import{useThemeProvider as g}from"src/providers/ThemeProvider/ThemeProvider";export{c as useAuth,d as useNotification,u as useOnScreenMultiple,f as useReleaseNotes,p as useSideBar,l as useSnackbar,m as useStepper,h as useTableOfContents,g as useThemeProvider};

package/dist/providers/index.js

@@ -1 +0,0 @@
-import{SideBarProvider as e}from"./SideBarProvider.js";import{TableOfContentsProvider as t}from"./TableOfContentsProvider.js";import{ReleaseNotesProvider as n}from"./ReleaseNotesProvider.js";import{LoadingProvider as r}from"./LoadingProvider.js";import{ThemeProvider as i}from"./ThemeProvider/ThemeProvider.js";import{StepperProvider as a}from"./StepperProvider.js";import{AuthProvider as o}from"src/providers/AuthProvider/AuthProvider";import{SnackbarProvider as s}from"src/providers/SnackbarProvider/SnackbarProvider";import{TutorialHighlightingProvider as c}from"src/providers/TutorialHighlightingProvider/TutorialHighlightingProvider";export{o as AuthProvider,s as SnackbarProvider,c as TutorialHighlightingProvider};