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

package/dist/molecules/Stepper/Stepper.js

@@ -1,14 +1,14 @@
-import{Step as e}from"./Step/Step.js";import{StepLine as t}from"./StepLine.js";import{useMemo as n}from"react";import{jsx as r,jsxs as i}from"react/jsx-runtime";import{useStepper as a}from"src/providers/StepperProvider";import o from"styled-components";import{spacings as s}from"src/atoms/style";import{SubTitle as c}from"src/molecules/Stepper/SubTitle/SubTitle";const l=o.div`
+import{spacings as e}from"../../atoms/style/spacings.js";import{useStepper as t}from"../../providers/StepperProvider.js";import{Step as n}from"./Step/Step.js";import{StepLine as r}from"./StepLine.js";import{SubTitle as i}from"./SubTitle/SubTitle.js";import{useMemo as a}from"react";import o from"styled-components";import{jsx as s,jsxs as c}from"react/jsx-runtime";const l=o.div`
   display: flex;
   flex-direction: column;
-  gap: ${s.xx_large};
+  gap: ${e.xx_large};
 `,u=o.div`
   display: grid;
   grid-template-columns:
     repeat(${({$stepAmount:e})=>e-1}, auto 1fr)
     auto;
-  grid-gap: ${s.small};
+  grid-gap: ${e.small};
   align-items: center;
   width: 100%;
   ${({$maxWidth:e})=>e&&`max-width: ${e}`}
-`,d=({onlyShowCurrentStepLabel:o=!1,maxWidth:s})=>{let{steps:d,currentStep:f}=a(),p=n(()=>{let n=[];return d.forEach((i,a)=>{n.push(r(e,{index:a,onlyShowCurrentStepLabel:o,children:i.label},`step-${a}`)),a!==d.length-1&&n.push(r(t,{done:f>a},`step-line-${a}`))}),n},[f,o,d]);return i(l,{children:[r(u,{$stepAmount:d.length,$maxWidth:s,"data-testid":`stepper-container`,children:p}),r(c,{})]})};export{d as Stepper};
+`,d=({onlyShowCurrentStepLabel:e=!1,maxWidth:o})=>{let{steps:d,currentStep:f}=t(),p=a(()=>{let t=[];return d.forEach((i,a)=>{t.push(s(n,{index:a,onlyShowCurrentStepLabel:e,children:i.label},`step-${a}`)),a!==d.length-1&&t.push(s(r,{done:f>a},`step-line-${a}`))}),t},[f,e,d]);return c(l,{children:[s(u,{$stepAmount:d.length,$maxWidth:o,"data-testid":`stepper-container`,children:p}),s(i,{})]})};export{d as Stepper};

package/dist/molecules/Stepper/SubTitle/SubStepIndicator.js

@@ -0,0 +1,25 @@
+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{useStepper as i}from"../../../providers/StepperProvider.js";import a from"styled-components";import{jsx as o}from"react/jsx-runtime";const s=a.div`
+  display: grid;
+  grid-template-columns: repeat(
+    ${({$amountOfSubSteps:e})=>e},
+    1fr
+  );
+  gap: ${n.small};
+  width: 300px;
+`,c=a.span`
+  width: 100%;
+  height: 5px;
+  position: relative;
+  background: ${t.interactive.primary__hover_alt.rgba};
+  border-radius: ${r.rounded.borderRadius};
+  overflow: hidden;
+  &:after {
+    content: '';
+    background: ${t.interactive.primary__resting.rgba};
+    position: absolute;
+    width: 100%;
+    height: 100%;
+    transition: left ${e.transitionMS};
+    left: ${({$index:e,$currentIndex:t})=>(t-e)*100}%;
+  }
+`,l=()=>{let{currentSubStep:e,steps:t,currentStep:n}=i(),r=t[n].subSteps.length;return o(s,{$amountOfSubSteps:r,children:Array(r).fill(null).map((t,n)=>o(c,{$index:n,$currentIndex:e},n))})};export{l as SubStepIndicator};

package/dist/molecules/Stepper/SubTitle/SubTitle.js

@@ -0,0 +1,7 @@
+import{colors as e}from"../../../atoms/style/colors.js";import{spacings as t}from"../../../atoms/style/spacings.js";import{useStepper as n}from"../../../providers/StepperProvider.js";import{SubStepIndicator as r}from"./SubStepIndicator.js";import{Typography as i}from"@equinor/eds-core-react";import a from"styled-components";import{jsx as o,jsxs as s}from"react/jsx-runtime";const c=a.div`
+  display: flex;
+  flex-direction: column;
+  gap: ${t.small};
+  align-self: center;
+  align-items: center;
+`,l=()=>{let{currentStep:t,currentSubStep:a,steps:l}=n(),u=`subSteps`in l[t]?l[t].subSteps:[],d=u?.at(a);return!d&&l[t].title===void 0||!u?null:l[t].title?s(c,{children:[o(i,{variant:`h3`,children:l[t].title}),l[t].description&&o(i,{variant:`caption`,children:l[t].description})]}):s(c,{children:[o(i,{variant:`caption`,color:e.text.static_icons__secondary.rgba,children:`${a+1} of ${u.length}`}),o(i,{variant:`h3`,children:d?.title}),d?.description&&o(i,{variant:`caption`,children:d.description}),o(r,{})]})};export{l as SubTitle};

package/dist/molecules/Tabs/Tab.js

@@ -1 +1 @@
-import{ActiveLine as e,Button as t,Count as n,Line as r}from"./Tab.styles.js";import{Fragment as i,jsx as a,jsxs as o}from"react/jsx-runtime";import{Icon as s,Typography as c}from"@equinor/eds-core-react";function l({value:l,label:u,selectedIndex:d,index:f,onChange:p,onHover:m,centered:h,animated:g,disabled:_,leadingIcon:v,count:y}){let b=()=>{p(l)},x=()=>{m&&m(l)};return o(t,{role:`tab`,"aria-selected":d===f,onClick:b,onMouseEnter:x,$centered:h,disabled:_,children:[v?a(s,{data:v,size:24}):null,a(c,{as:`label`,variant:`menu_tabs`,group:`navigation`,children:u}),y===void 0?null:a(n,{className:`count`,children:a(c,{as:`span`,variant:`breadcrumb`,group:`navigation`,children:y})}),g?o(i,{children:[a(r,{className:`static-line`}),a(e,{animate:{left:`${(d-f)*100}%`}})]}):a(r,{className:`static-line`,$active:d===f})]})}export{l as Tab};
+import{ActiveLine as e,Button as t,Count as n,Line as r}from"./Tab.styles.js";import{Icon as i,Typography as a}from"@equinor/eds-core-react";import{Fragment as o,jsx as s,jsxs as c}from"react/jsx-runtime";function l({value:l,label:u,selectedIndex:d,index:f,onChange:p,onHover:m,centered:h,animated:g,disabled:_,leadingIcon:v,count:y}){let b=()=>{p(l)},x=()=>{m&&m(l)};return c(t,{role:`tab`,"aria-selected":d===f,onClick:b,onMouseEnter:x,$centered:h,disabled:_,children:[v?s(i,{data:v,size:24}):null,s(a,{as:`label`,variant:`menu_tabs`,group:`navigation`,children:u}),y===void 0?null:s(n,{className:`count`,children:s(a,{as:`span`,variant:`breadcrumb`,group:`navigation`,children:y})}),g?c(o,{children:[s(r,{className:`static-line`}),s(e,{animate:{left:`${(d-f)*100}%`}})]}):s(r,{className:`static-line`,$active:d===f})]})}export{l as Tab};

package/dist/molecules/Tabs/Tab.styles.js

@@ -1,10 +1,10 @@
-import e from"styled-components";import{colors as t,shape as n,spacings as r}from"src/atoms/style";import{motion as i}from"framer-motion";const a=e.button`
+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 r from"styled-components";import{motion as i}from"framer-motion";const a=r.button`
   position: relative;
-  padding: ${r.medium};
+  padding: ${t.medium};
   display: flex;
   align-items: center;
   justify-content: ${({$centered:e})=>e?`center`:`flex-start`};
-  gap: ${r.small};
+  gap: ${t.small};
   width: auto;
   flex-grow: 1;
   height: 48px;
@@ -12,7 +12,7 @@ import e from"styled-components";import{colors as t,shape as n,spacings as r}fro
   cursor: pointer;
 
   > svg {
-    fill: ${t.text.static_icons__tertiary.rgba};
+    fill: ${e.text.static_icons__tertiary.rgba};
   }
 
   > label {
@@ -20,33 +20,33 @@ import e from"styled-components";import{colors as t,shape as n,spacings as r}fro
     pointer-events: none;
     display: block;
     height: 16px;
-    color: ${t.text.static_icons__tertiary.rgba};
+    color: ${e.text.static_icons__tertiary.rgba};
   }
 
   &[aria-selected='true'] {
     > svg {
-      fill: ${t.interactive.primary__resting.rgba};
+      fill: ${e.interactive.primary__resting.rgba};
     }
 
     > label {
-      color: ${t.interactive.primary__resting.rgba};
+      color: ${e.interactive.primary__resting.rgba};
     }
   }
 
   &:hover:not(:disabled) {
-    background: ${t.interactive.primary__hover_alt.rgba};
+    background: ${e.interactive.primary__hover_alt.rgba};
 
     &[aria-selected='true'] {
       > svg {
-        fill: ${t.interactive.primary__hover.rgba};
+        fill: ${e.interactive.primary__hover.rgba};
       }
 
       > label {
-        color: ${t.interactive.primary__hover.rgba};
+        color: ${e.interactive.primary__hover.rgba};
       }
 
       > span:not(.count):last-child {
-        background: ${t.interactive.primary__hover.rgba};
+        background: ${e.interactive.primary__hover.rgba};
       }
     }
   }
@@ -55,36 +55,36 @@ import e from"styled-components";import{colors as t,shape as n,spacings as r}fro
     cursor: not-allowed;
 
     > svg {
-      fill: ${t.interactive.disabled__fill.rgba};
+      fill: ${e.interactive.disabled__fill.rgba};
     }
 
     > label {
-      color: ${t.interactive.disabled__text.rgba};
+      color: ${e.interactive.disabled__text.rgba};
     }
 
     > span.static-line {
-      background: ${t.ui.background__medium.rgba};
+      background: ${e.ui.background__medium.rgba};
     }
   }
-`,o=e.span`
+`,o=r.span`
   position: absolute;
   height: 2px;
   width: 100%;
   bottom: 0;
   left: 0;
-  background: ${({$active:e})=>e?t.interactive.primary__resting.rgba:t.ui.background__heavy.rgba};
-`,s=e(i.span)`
+  background: ${({$active:t})=>t?e.interactive.primary__resting.rgba:e.ui.background__heavy.rgba};
+`,s=r(i.span)`
   position: absolute;
   height: 2px;
   width: 100%;
   bottom: 0;
-  background: ${t.interactive.primary__resting.rgba};
-`,c=e.span`
+  background: ${e.interactive.primary__resting.rgba};
+`,c=r.span`
   display: flex;
-  padding: ${r.x_small} ${r.small};
-  background: ${t.interactive.primary__resting.rgba};
+  padding: ${t.x_small} ${t.small};
+  background: ${e.interactive.primary__resting.rgba};
   border-radius: ${n.rounded.borderRadius};
   > span {
-    color: ${t.text.static_icons__primary_white.rgba};
+    color: ${e.text.static_icons__primary_white.rgba};
   }
 `;export{s as ActiveLine,a as Button,c as Count,o as Line};

package/dist/molecules/Tabs/Tabs.js

@@ -1,7 +1,7 @@
-import{Tab as e}from"./Tab.js";import{useEffect as t,useRef as n,useState as r}from"react";import{Fragment as i,jsx as a,jsxs as o}from"react/jsx-runtime";import{chevron_left as s,chevron_right as c}from"@equinor/eds-icons";import l from"styled-components";import{Button as u,Icon as d}from"@equinor/eds-core-react";import{spacings as f}from"src/atoms/style";const p=l.div`
+import{spacings as e}from"../../atoms/style/spacings.js";import{Tab as t}from"./Tab.js";import{useEffect as n,useRef as r,useState as i}from"react";import{Button as a,Icon as o}from"@equinor/eds-core-react";import s from"styled-components";import{Fragment as c,jsx as l,jsxs as u}from"react/jsx-runtime";import{chevron_left as d,chevron_right as f}from"@equinor/eds-icons";const p=s.div`
   display: flex;
   align-items: center;
-  gap: ${f.small};
+  gap: ${e.small};
   > button {
     flex-shrink: 0;
 
@@ -9,10 +9,10 @@ import{Tab as e}from"./Tab.js";import{useEffect as t,useRef as n,useState as r}f
       order: 2;
     }
   }
-`,m=l.div`
+`,m=s.div`
   display: flex;
   width: 100%;
   align-items: center;
   overflow: hidden;
   order: 1;
-`;function h({options:l,selected:f,centered:h=!0,animated:g=!0,scrollable:_=!0,amountPerScrollPage:v,onChange:y,onHover:b,ref:x,...S}){let C=n(null),[w,T]=r(!1),[E,D]=r(0),[O,k]=r(!0),[A,j]=r(!0);if(v!==void 0&&v<=0)throw Error(`[ACL - Tabs]: Amount per scroll page must be greater than 0`);if(v!==void 0&&!_)throw Error(`[ACL - Tabs]: amountPerScrollPage was set but scrollable is false!`);let M=l.findIndex(e=>e.value===f);t(()=>{if(!_||!C.current){w&&T(!1);return}let e=new ResizeObserver(([e])=>{let t=e.target;D(Math.round(e.borderBoxSize[0].inlineSize)),T(t.scrollWidth>t.clientWidth),t.scrollTo(0,0)});return e.observe(C.current,{box:`border-box`}),k(!0),j(!1),()=>{e.disconnect()}},[_,w]);let N=e=>()=>{if(!C.current||!E)return;let t=C.current.scrollLeft;e===`left`?(t-=E,t=Math.max(0,t)):(t+=E,t=Math.min(t,C.current.scrollWidth)),C.current.scrollTo({top:0,left:t,behavior:`smooth`}),k(t<=0),j(t+E>=C.current.scrollWidth)};return o(p,{...S,ref:x,children:[a(m,{ref:C,style:v&&w?{display:`grid`,gridTemplateColumns:`repeat(${l.length}, ${E/v}px)`}:void 0,children:l.map((t,n)=>a(e,{selectedIndex:M,index:n,onChange:y,onHover:b,centered:h,animated:g,...t},t.label))}),w?o(i,{children:[a(u,{"aria-label":`Scroll tabs left`,variant:`ghost_icon`,disabled:O,onClick:N(`left`),children:a(d,{data:s})}),a(u,{"aria-label":`Scroll tabs right`,variant:`ghost_icon`,disabled:A,onClick:N(`right`),children:a(d,{data:c})})]}):null]})}export{h as Tabs};
+`;function h({options:e,selected:s,centered:h=!0,animated:g=!0,scrollable:_=!0,amountPerScrollPage:v,onChange:y,onHover:b,ref:x,...S}){let C=r(null),[w,T]=i(!1),[E,D]=i(0),[O,k]=i(!0),[A,j]=i(!0);if(v!==void 0&&v<=0)throw Error(`[ACL - Tabs]: Amount per scroll page must be greater than 0`);if(v!==void 0&&!_)throw Error(`[ACL - Tabs]: amountPerScrollPage was set but scrollable is false!`);let M=e.findIndex(e=>e.value===s);n(()=>{if(!_||!C.current){w&&T(!1);return}let e=new ResizeObserver(([e])=>{let t=e.target;D(Math.round(e.borderBoxSize[0].inlineSize)),T(t.scrollWidth>t.clientWidth),t.scrollTo(0,0)});return e.observe(C.current,{box:`border-box`}),k(!0),j(!1),()=>{e.disconnect()}},[_,w]);let N=e=>()=>{if(!C.current||!E)return;let t=C.current.scrollLeft;e===`left`?(t-=E,t=Math.max(0,t)):(t+=E,t=Math.min(t,C.current.scrollWidth)),C.current.scrollTo({top:0,left:t,behavior:`smooth`}),k(t<=0),j(t+E>=C.current.scrollWidth)};return u(p,{...S,ref:x,children:[l(m,{ref:C,style:v&&w?{display:`grid`,gridTemplateColumns:`repeat(${e.length}, ${E/v}px)`}:void 0,children:e.map((e,n)=>l(t,{selectedIndex:M,index:n,onChange:y,onHover:b,centered:h,animated:g,...e},e.label))}),w?u(c,{children:[l(a,{"aria-label":`Scroll tabs left`,variant:`ghost_icon`,disabled:O,onClick:N(`left`),children:l(o,{data:d})}),l(a,{"aria-label":`Scroll tabs right`,variant:`ghost_icon`,disabled:A,onClick:N(`right`),children:l(o,{data:f})})]}):null]})}export{h as Tabs};

package/dist/molecules/TextField/TextField.js

@@ -0,0 +1,74 @@
+import{animation as e}from"../../atoms/style/animation.js";import{VARIANT_COLORS as t,colors as n}from"../../atoms/style/colors.js";import{spacings as r}from"../../atoms/style/spacings.js";import{shape as i}from"../../atoms/style/index.js";import{SkeletonBase as a}from"../Skeleton/SkeletonBase/SkeletonBase.js";import{getSkeletonHeight as o,getSkeletonTop as s}from"../../atoms/utils/skeleton.js";import{useRef as c}from"react";import{TextField as l}from"@equinor/eds-core-react";import u,{css as d}from"styled-components";import{jsx as f,jsxs as p}from"react/jsx-runtime";const m=u.div`
+  position: relative;
+  input,
+  textarea {
+    color: ${n.text.static_icons__default.rgba};
+    transition:
+      background ${e.transitionMS},
+      box-shadow ${e.transitionMS};
+    &::placeholder {
+      opacity: 1;
+    }
+    &:hover {
+      background: ${n.ui.background__light_medium.rgba};
+    }
+    &:disabled {
+      &::placeholder {
+        color: ${n.interactive.disabled__text.rgba};
+      }
+    }
+  }
+  div:focus-within {
+    outline: none !important;
+  }
+
+  ${({$variant:e,$disabled:r})=>r?d`
+        div {
+          outline: none !important;
+        }
+        p {
+          color: ${n.interactive.disabled__text.rgba} !important;
+        }
+      `:e===void 0?d`
+        input:hover,
+        textarea:hover {
+          box-shadow: inset 0 -2px 0 0
+            ${n.text.static_icons__tertiary.rgba};
+        }
+
+        div:focus-within {
+          input,
+          textarea {
+            box-shadow: inset 0 -2px 0 0
+              ${n.interactive.primary__resting.rgba};
+          }
+        }
+      `:d`
+      ${e===`dirty`&&d`
+        input,
+        textarea {
+          box-shadow: inset 0 -2px 0 0 ${t[e]};
+        }
+      `}
+
+      input:hover,
+      textarea:hover {
+        box-shadow: inset 0 -${e===`dirty`?2:1}px 0 0
+          ${t[e]};
+      }
+
+      div:focus-within {
+        outline: none !important;
+
+        input,
+        textarea {
+          box-shadow: inset 0 -2px 0 0 ${t[e]};
+        }
+      }
+    `}
+`,h=u(a)`
+  position: absolute;
+  left: ${r.small};
+  border-radius: ${i.corners.borderRadius};
+  transform: translateY(${r.x_small});
+`,g=e=>{let t={...e,variant:e.variant===`dirty`?void 0:e.variant},n=e.loading?void 0:e.variant,r=s(e),i=o(e),a=c(`${Math.max(20,Math.random()*80)}%`);return p(m,{$variant:n,$disabled:e.loading?!1:e.disabled,children:[f(l,{...t,disabled:e.loading||e.disabled}),e.loading&&f(h,{className:`skeleton`,role:`progressbar`,style:{top:r,height:i,width:a.current}})]})};export{g as TextField};

package/dist/molecules/Waves/Waves.js

@@ -1 +1 @@
-import{Container as e}from"./Waves.styles.js";import{WaveStatic as t}from"./WaveStatic.js";import{useEffect as n,useRef as r,useState as i}from"react";import{jsx as a}from"react/jsx-runtime";import{useScroll as o}from"framer-motion";const s=({gradientColors:s})=>{let c=r(null),[l,u]=i(c.current?.clientWidth??0),[d,f]=i(c.current?.clientHeight??0),{scrollY:p}=o({container:{current:document.getElementById(`content`)}}),m=e=>{c.current=e,c.current&&(u(c.current.clientWidth),f(c.current.clientHeight))};return n(()=>{let e=()=>{c.current&&(u(c.current.clientWidth),f(c.current.clientHeight))};return window.addEventListener(`resize`,e),()=>{window.removeEventListener(`resize`,e)}},[]),a(e,{ref:m,style:{top:p},children:a(t,{height:d,width:l,gradientColors:s})})};export{s as Waves};
+import{Container as e}from"./Waves.styles.js";import{WaveStatic as t}from"./WaveStatic.js";import{useEffect as n,useRef as r,useState as i}from"react";import{jsx as a}from"react/jsx-runtime";import{useScroll as o}from"framer-motion";const s=({gradientColors:s})=>{let c=r(null),[l,u]=i(c.current?.clientWidth??0),[d,f]=i(c.current?.clientHeight??0),{scrollY:p}=o({container:{current:document.getElementById(`content`)}});return n(()=>{let e=()=>{c.current&&(u(c.current.clientWidth),f(c.current.clientHeight))};return window.addEventListener(`resize`,e),()=>{window.removeEventListener(`resize`,e)}},[]),a(e,{ref:e=>{c.current=e,c.current&&(u(c.current.clientWidth),f(c.current.clientHeight))},style:{top:p},children:a(t,{height:d,width:l,gradientColors:s})})};export{s as Waves};

package/dist/molecules/index.d.ts

@@ -44,5 +44,5 @@ import { Checkbox as Checkbox$1, CheckboxProps as CheckboxProps$1 } from "./Sele
 import { Radio as Radio$1, RadioProps as RadioProps$1 } from "./SelectionControls/Radio/Radio.js";
 import { Switch as Switch$1, SwitchProps as SwitchProps$1 } from "./SelectionControls/Switch/Switch.js";
 import { Waves } from "./Waves/Waves.js";
-import { Accordion, AccordionHeaderActionsProps, AccordionHeaderProps, AccordionHeaderTitleProps, AccordionItemProps, AccordionPanelProps, AccordionProps, BreadcrumbProps, Breadcrumbs, BreadcrumbsProps, CircularProgress as CircularProgress$1, CircularProgressProps, Dialog as EDSDialog, DialogProps as EDSDialogProps, Divider as Divider$1, DividerProps, DotProgress as DotProgress$1, DotProgressProps, Icon as Icon$1, IconProps, LinearProgress as LinearProgress$1, LinearProgressProps, Menu as Menu$1, MenuProps, SearchProps as SearchProps$1, TextField, TextFieldProps, Typography as Typography$1, TypographyProps } from "@equinor/eds-core-react";
-export { Accordion, type AccordionHeaderActionsProps, type AccordionHeaderProps, type AccordionHeaderTitleProps, type AccordionItemProps, type AccordionPanelProps, type AccordionProps, type BreadcrumbProps, Breadcrumbs, type BreadcrumbsProps, CircularProgress$1 as CircularProgress, type CircularProgressProps, Divider$1 as Divider, type DividerProps, DotProgress$1 as DotProgress, type DotProgressProps, EDSDialog, type EDSDialogProps, Icon$1 as Icon, type IconProps, LinearProgress$1 as LinearProgress, type LinearProgressProps, Menu$1 as Menu, type MenuProps, type SearchProps$1 as SearchProps, TextField, type TextFieldProps, Typography$1 as Typography, type TypographyProps };
+import { Accordion, AccordionHeaderActionsProps, AccordionHeaderProps, AccordionHeaderTitleProps, AccordionItemProps, AccordionPanelProps, AccordionProps, BreadcrumbProps, Breadcrumbs, BreadcrumbsProps, CircularProgress as CircularProgress$1, CircularProgressProps, Dialog as EDSDialog, DialogProps as EDSDialogProps, Divider as Divider$1, DividerProps, DotProgress as DotProgress$1, DotProgressProps, Icon as Icon$1, IconProps, LinearProgress as LinearProgress$1, LinearProgressProps, Menu as Menu$1, MenuProps, SearchProps as SearchProps$1, TextField as TextField$1, TextFieldProps, Typography as Typography$1, TypographyProps } from "@equinor/eds-core-react";
+export { Accordion, type AccordionHeaderActionsProps, type AccordionHeaderProps, type AccordionHeaderTitleProps, type AccordionItemProps, type AccordionPanelProps, type AccordionProps, type BreadcrumbProps, Breadcrumbs, type BreadcrumbsProps, CircularProgress$1 as CircularProgress, type CircularProgressProps, Divider$1 as Divider, type DividerProps, DotProgress$1 as DotProgress, type DotProgressProps, EDSDialog, type EDSDialogProps, Icon$1 as Icon, type IconProps, LinearProgress$1 as LinearProgress, type LinearProgressProps, Menu$1 as Menu, type MenuProps, type SearchProps$1 as SearchProps, TextField$1 as TextField, type TextFieldProps, Typography$1 as Typography, type TypographyProps };

package/dist/molecules/index.js

@@ -1 +1 @@
-import{AnimatedCheckmark as e}from"./AnimatedCheckmark/AnimatedCheckmark.js";import{ApplicationIcon as t}from"./ApplicationIcon/ApplicationIcon.js";import{Badge as n}from"./Badge/Badge.js";import{Banner as r}from"./Banner/Banner.js";import{Button as i}from"./Button/Button.js";import{Chip as a}from"./Chip/Chip.js";import{ContentMenu as o}from"./ContentMenu/ContentMenu.js";import{DatePicker as s}from"./DatePicker/DatePicker.js";import{DateRangePicker as c}from"./DateRangePicker/DateRangePicker.js";import{Dialog as l}from"./Dialog/Dialog.js";import{EquinorLogo as u}from"./EquinorLogo/EquinorLogo.js";import{FileProgress as ee}from"./FileProgress/FileProgress.js";import{FileUploadArea as te}from"./FileUploadArea/FileUploadArea.js";import{FullPageSpinner as d}from"./FullPageSpinner/FullPageSpinner.js";import{IconCell as f}from"./IconCell/IconCell.js";import{InfoElement as p}from"./InfoElement/InfoElement.js";import{OptionalTooltip as m}from"./OptionalTooltip/OptionalTooltip.js";import{ProfileAvatar as h}from"./ProfileAvatar/ProfileAvatar.js";import{RichTextDisplay as g}from"./RichTextDisplay/RichTextDisplay.js";import{DEFAULT_FEATURES as _,RichTextEditorFeatures as v}from"./RichTextEditor/RichTextEditor.types.js";import{TableMenuBar as y,TextTable as b}from"./RichTextEditor/MenuBar/Table/TableBar.js";import{AmplifyBar as x,EditorMenu as S,EditorText as C}from"./RichTextEditor/MenuBar/MenuBar.js";import{RichTextEditor as w}from"./RichTextEditor/RichTextEditor.js";import{RichText as T}from"./RichTextEditor/index.js";import{AmplifyKit as E}from"./RichTextEditor/custom-extensions/AmplifyKit.js";import{Tabs as D}from"./Tabs/Tabs.js";import{Search as O}from"./Search/Search.js";import{SingleFilterMenu as k}from"./SingleFilterMenu/SingleFilterMenu.js";import{SkeletonBase as ne,skeletonBaseloading as A}from"./Skeleton/SkeletonBase/SkeletonBase.js";import{SkeletonGradient as j}from"./Skeleton/SkeletonGradient/SkeletonGradient.js";import{Stepper as M}from"./Stepper/Stepper.js";import{OptionDrawer as N}from"./OptionDrawer/OptionDrawer.js";import{ComboBox as P}from"./Select/ComboBox/ComboBox.js";import{ComboBoxChip as F}from"./Select/Select.styles.js";import{SingleSelect as I}from"./Select/SingleSelect/SingleSelect.js";import{FeedBackIcon as L}from"./FeedBackIcon/FeedBackIcon.js";import{ListItem as R}from"./ListItem/ListItem.js";import{Checkbox as z}from"./SelectionControls/Checkbox/Checkbox.js";import{Radio as B}from"./SelectionControls/Radio/Radio.js";import{Switch as V}from"./SelectionControls/Switch/Switch.js";import{Waves as H}from"./Waves/Waves.js";import{Accordion as U,Breadcrumbs as W,CircularProgress as G,Dialog as K,Divider as q,DotProgress as J,Icon as Y,LinearProgress as X,Menu as Z,TextField as Q,Typography as $}from"@equinor/eds-core-react";export{U as Accordion,W as Breadcrumbs,G as CircularProgress,q as Divider,J as DotProgress,K as EDSDialog,Y as Icon,X as LinearProgress,Z as Menu,Q as TextField,$ as Typography};
+import{FullPageSpinner as e}from"./FullPageSpinner/FullPageSpinner.js";import{DEFAULT_FEATURES as t,RichTextEditorFeatures as n}from"./RichTextEditor/RichTextEditor.types.js";import{AmplifyKit as r}from"./RichTextEditor/custom-extensions/AmplifyKit.js";import{AnimatedCheckmark as i}from"./AnimatedCheckmark/AnimatedCheckmark.js";import{ApplicationIcon as a}from"./ApplicationIcon/ApplicationIcon.js";import{Badge as o}from"./Badge/Badge.js";import{Banner as s}from"./Banner/Banner.js";import{Button as c}from"./Button/Button.js";import{Chip as l}from"./Chip/Chip.js";import{SkeletonBase as u,skeletonBaseloading as ee}from"./Skeleton/SkeletonBase/SkeletonBase.js";import{ContentMenu as te}from"./ContentMenu/ContentMenu.js";import{DatePicker as d}from"./DatePicker/DatePicker.js";import{DateRangePicker as f}from"./DateRangePicker/DateRangePicker.js";import{OptionalTooltip as p}from"./OptionalTooltip/OptionalTooltip.js";import{Dialog as m}from"./Dialog/Dialog.js";import{EquinorLogo as h}from"./EquinorLogo/EquinorLogo.js";import{FileProgress as g}from"./FileProgress/FileProgress.js";import{FileUploadArea as _}from"./FileUploadArea/FileUploadArea.js";import{IconCell as v}from"./IconCell/IconCell.js";import{InfoElement as y}from"./InfoElement/InfoElement.js";import{ProfileAvatar as b}from"./ProfileAvatar/ProfileAvatar.js";import{RichTextDisplay as x}from"./RichTextDisplay/RichTextDisplay.js";import{TableMenuBar as S,TextTable as C}from"./RichTextEditor/MenuBar/Table/TableBar.js";import{AmplifyBar as w,EditorMenu as T,EditorText as E}from"./RichTextEditor/MenuBar/MenuBar.js";import{RichTextEditor as D}from"./RichTextEditor/RichTextEditor.js";import{RichText as O}from"./RichTextEditor/index.js";import{Tabs as k}from"./Tabs/Tabs.js";import{Search as ne}from"./Search/Search.js";import{SingleFilterMenu as A}from"./SingleFilterMenu/SingleFilterMenu.js";import{SkeletonGradient as j}from"./Skeleton/SkeletonGradient/SkeletonGradient.js";import{Stepper as M}from"./Stepper/Stepper.js";import{OptionDrawer as N}from"./OptionDrawer/OptionDrawer.js";import{ComboBoxChip as P}from"./Select/Select.styles.js";import{ComboBox as F}from"./Select/ComboBox/ComboBox.js";import{SingleSelect as I}from"./Select/SingleSelect/SingleSelect.js";import{FeedBackIcon as L}from"./FeedBackIcon/FeedBackIcon.js";import{ListItem as R}from"./ListItem/ListItem.js";import{Checkbox as z}from"./SelectionControls/Checkbox/Checkbox.js";import{Radio as B}from"./SelectionControls/Radio/Radio.js";import{Switch as V}from"./SelectionControls/Switch/Switch.js";import{Waves as H}from"./Waves/Waves.js";import{Accordion as U,Breadcrumbs as W,CircularProgress as G,Dialog as K,Divider as q,DotProgress as J,Icon as Y,LinearProgress as X,Menu as Z,TextField as Q,Typography as $}from"@equinor/eds-core-react";export{U as Accordion,W as Breadcrumbs,G as CircularProgress,q as Divider,J as DotProgress,K as EDSDialog,Y as Icon,X as LinearProgress,Z as Menu,Q as TextField,$ as Typography};

package/dist/organisms/DataGrid/DataGrid.js

@@ -1,4 +1,4 @@
-import{jsx as e}from"react/jsx-runtime";import t from"styled-components";import{colors as n,spacings as r}from"src/atoms/style";import{EdsDataGrid as i}from"@equinor/eds-data-grid-react";const a=t.div`
+import{colors as e}from"../../atoms/style/colors.js";import{spacings as t}from"../../atoms/style/spacings.js";import n from"styled-components";import{jsx as r}from"react/jsx-runtime";import{EdsDataGrid as i}from"@equinor/eds-data-grid-react";const a=n.div`
   table,
   thead,
   th {
@@ -12,24 +12,24 @@ import{jsx as e}from"react/jsx-runtime";import t from"styled-components";import{
     border: none;
   }
   th {
-    color: ${n.text.static_icons__default.rgba};
+    color: ${e.text.static_icons__default.rgba};
     > div {
       justify-content: space-between;
       > svg {
         height: 18px;
         width: 18px;
-        fill: ${n.interactive.primary__resting.rgba};
+        fill: ${e.interactive.primary__resting.rgba};
       }
     }
   }
   th,
   td {
-    padding: ${r.medium_small} ${r.small};
+    padding: ${t.medium_small} ${t.small};
   }
   tr:hover,
   th:hover,
   th:has(svg) {
-    background: ${n.interactive.primary__hover_alt.rgba};
+    background: ${e.interactive.primary__hover_alt.rgba};
   }
   ${({$enableSorting:e})=>!e&&`
     cursor: default;
@@ -38,4 +38,4 @@ import{jsx as e}from"react/jsx-runtime";import t from"styled-components";import{
       cursor: default;
     }
     `}
-`,o=t=>e(a,{$enableSorting:t.enableSorting??!1,"data-testid":`table-wrapper`,children:e(i,{...t})});export{o as DataGrid};
+`,o=e=>r(a,{$enableSorting:e.enableSorting??!1,"data-testid":`table-wrapper`,children:r(i,{...e})});export{o as DataGrid};

package/dist/organisms/Faq/Category/Category.js

@@ -0,0 +1,9 @@
+import{spacings as e}from"../../../atoms/style/spacings.js";import{Status as t}from"../../Status/index.js";import{Question as n}from"./Question.js";import{useMemo as r,useState as i}from"react";import{Typography as a}from"@equinor/eds-core-react";import o from"styled-components";import{jsx as s,jsxs as c}from"react/jsx-runtime";const l=o.div`
+  display: flex;
+  flex-direction: column;
+  gap: ${e.medium};
+  width: 100%;
+  &:has(> div > div > svg) {
+    transform: translateY(50%);
+  }
+`,u=({categoryName:e,faqs:o,selectedTab:u})=>{let[d]=i(void 0),f=r(()=>o.toSorted((e,t)=>{let n=e.orderBy??0,r=t.orderBy??0;return n-r}),[o]),p=r(()=>d?f.filter(t=>t.question.toLowerCase().includes(d.toLowerCase())||t.answer.toLowerCase().includes(d.toLowerCase())||e.toLowerCase().includes(d.toLowerCase())):f,[e,d,f]);return u!==void 0&&p.length===0?s(l,{children:c(t,{center:!1,children:[s(t.Title,{title:`No Questions Found`}),s(t.Description,{text:`No questions or answers matches your search in this category`})]})}):p.length===0?null:c(l,{children:[s(a,{variant:`h4`,children:e}),p.map(e=>s(n,{...e},e.id))]})};export{u as Category};

package/dist/organisms/Faq/Category/Question.js

@@ -0,0 +1,22 @@
+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{formatDate as i}from"../../../atoms/utils/date.js";import{Button as a}from"../../../molecules/Button/Button.js";import{RichTextDisplay as o}from"../../../molecules/RichTextDisplay/RichTextDisplay.js";import{useState as s}from"react";import{Icon as c,Typography as l}from"@equinor/eds-core-react";import u from"styled-components";import{jsx as d,jsxs as f}from"react/jsx-runtime";import{chevron_down as p,chevron_up as m}from"@equinor/eds-icons";import{AnimatePresence as h,motion as g}from"framer-motion";import{FaqService as _}from"@equinor/subsurface-app-management";const v=u.div`
+  background: ${t.ui.background__default.rgba};
+  width: 100%;
+  display: grid;
+  grid-template-columns: 1fr auto auto;
+  align-items: center;
+  padding: ${n.medium};
+  border: 1px solid ${t.ui.background__heavy.rgba};
+  border-radius: ${r.corners.borderRadius};
+  cursor: pointer;
+  transition: border-color ${e.transitionMS};
+  > button {
+    margin-left: ${n.medium};
+    transition: background ${e.transitionMS};
+  }
+  &:hover {
+    border-color: ${t.interactive.primary__resting.rgba};
+    > button {
+      background: ${t.interactive.primary__hover_alt.rgba};
+    }
+  }
+`,y=({question:e,answer:t,createdDate:n})=>{let[r,u]=s(!1);return f(v,{onClick:()=>u(e=>!e),children:[d(l,{variant:`h4`,children:e}),d(l,{variant:`caption`,children:i(n)}),d(a,{variant:`ghost_icon`,children:d(c,{data:r?m:p})}),d(h,{children:r&&d(g.div,{style:{overflow:`hidden`},initial:{height:0},animate:{height:`auto`},exit:{height:0},children:d(o,{value:t,onImageRead:_.getFaqImage})})})]})};export{y as Question};

package/dist/organisms/Faq/CategorySkeleton.js

@@ -0,0 +1,29 @@
+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"../../molecules/Button/Button.js";import{SkeletonBase as i}from"../../molecules/Skeleton/SkeletonBase/SkeletonBase.js";import{Icon as a}from"@equinor/eds-core-react";import o from"styled-components";import{jsx as s,jsxs as c}from"react/jsx-runtime";import{chevron_down as l}from"@equinor/eds-icons";const u=o.div`
+  display: flex;
+  flex-direction: column;
+  gap: ${t.medium};
+`,d=o(i)`
+  height: 32px;
+  width: 12rem;
+  border-radius: ${n.corners.borderRadius};
+`,f=o.div`
+  background: ${e.ui.background__default.rgba};
+  width: 100%;
+  display: grid;
+  grid-template-columns: 1fr auto auto;
+  align-items: center;
+  padding: ${t.medium};
+  border: 1px solid ${e.ui.background__heavy.rgba};
+  border-radius: ${n.corners.borderRadius};
+  > button {
+    margin-left: ${t.medium};
+  }
+`,p=o(i)`
+  height: 32px;
+  width: 50%;
+  border-radius: ${n.corners.borderRadius};
+`,m=o(i)`
+  height: 16px;
+  width: 5rem;
+  border-radius: ${n.corners.borderRadius};
+`,h=()=>c(u,{children:[s(d,{}),[,,,].fill(0).map((e,t)=>c(f,{children:[s(p,{$offset:t*100}),s(m,{$offset:t*100}),s(r,{variant:`ghost_icon`,children:s(a,{data:l})})]},`card-${t}`))]});export{h as CategorySkeleton};

package/dist/organisms/Faq/Faq.js

@@ -1 +1 @@
-import{Container as e}from"./Faq.styles.js";import{Header as t}from"./Header.js";import{useMemo as n,useState as r}from"react";import{Fragment as i,jsx as a,jsxs as o}from"react/jsx-runtime";import{Typography as s}from"@equinor/eds-core-react";import{Status as c}from"src/organisms/Status";import{useFaqsInApplication as l}from"src/atoms/hooks/useFaqsInApplication";import{Category as u}from"src/organisms/Faq/Category/Category";import{CategorySkeleton as d}from"src/organisms/Faq/CategorySkeleton";const f=()=>{let{data:f,isLoading:p}=l(),[m,h]=r(void 0),g=n(()=>{if(!f)return;if(!m)return f;let e=f.find(e=>e.id==Number(m));return[e]},[f,m]);return o(e,{children:[a(s,{variant:`h1`,bold:!0,children:`FAQ`}),a(t,{selectedTab:m,setSelectedTab:h}),g&&g.length>0?g.map(e=>a(u,{...e,selectedTab:m},e.id)):p?o(i,{children:[a(d,{}),a(d,{}),a(d,{})]}):a(c,{center:!1,children:a(c.Title,{title:`No FAQs available yet`})})]})};export{f as Faq};
+import{Status as e}from"../Status/index.js";import{useFaqsInApplication as t}from"../../atoms/hooks/useFaqsInApplication.js";import{Container as n}from"./Faq.styles.js";import{Header as r}from"./Header.js";import{Category as i}from"./Category/Category.js";import{CategorySkeleton as a}from"./CategorySkeleton.js";import{useMemo as o,useState as s}from"react";import{Typography as c}from"@equinor/eds-core-react";import{Fragment as l,jsx as u,jsxs as d}from"react/jsx-runtime";const f=()=>{let{data:f,isLoading:p}=t(),[m,h]=s(void 0),g=o(()=>{if(f)return m?[f.find(e=>e.id==Number(m))]:f},[f,m]);return d(n,{children:[u(c,{variant:`h1`,bold:!0,children:`FAQ`}),u(r,{selectedTab:m,setSelectedTab:h}),g&&g.length>0?g.map(e=>u(i,{...e,selectedTab:m},e.id)):p?d(l,{children:[u(a,{}),u(a,{}),u(a,{})]}):u(e,{center:!1,children:u(e.Title,{title:`No FAQs available yet`})})]})};export{f as Faq};

package/dist/organisms/Faq/Faq.styles.js

@@ -1,8 +1,8 @@
-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;
-  gap: ${t.x_large};
-  margin: ${t.large} 0;
+  gap: ${e.x_large};
+  margin: ${e.large} 0;
   height: fit-content;
   width: 100%;
 `;export{n as Container};

package/dist/organisms/Faq/Header.js

@@ -1,14 +1,14 @@
-import{useMemo as e,useState as t}from"react";import{jsx as n,jsxs as r}from"react/jsx-runtime";import i from"styled-components";import{Search as a}from"@equinor/eds-core-react";import{colors as o,spacings as s}from"src/atoms/style";import{useFaqsInApplication as c}from"src/atoms";import{Tabs as l}from"src/molecules/Tabs/Tabs";const u=i.div`
+import{colors as e}from"../../atoms/style/colors.js";import{spacings as t}from"../../atoms/style/spacings.js";import{useFaqsInApplication as n}from"../../atoms/hooks/useFaqsInApplication.js";import{Tabs as r}from"../../molecules/Tabs/Tabs.js";import{useMemo as i,useState as a}from"react";import{Search as o}from"@equinor/eds-core-react";import s from"styled-components";import{jsx as c,jsxs as l}from"react/jsx-runtime";const u=s.div`
   position: sticky;
   top: 0;
   display: flex;
   flex-direction: column;
-  gap: ${s.medium};
-  background: ${o.ui.background__light.rgba};
-  padding: ${s.x_large} 0;
-  margin: calc(${s.x_large} * -1) 0;
+  gap: ${t.medium};
+  background: ${e.ui.background__light.rgba};
+  padding: ${t.x_large} 0;
+  margin: calc(${t.x_large} * -1) 0;
   z-index: 400;
   > div[role='search'] > div {
-    background: ${o.ui.background__default.rgba};
+    background: ${e.ui.background__default.rgba};
   }
-`,d=({setSelectedTab:i,selectedTab:o})=>{let{data:s}=c(),[d,f]=t(``),p=e(()=>s?[{value:`all`,label:`All categories`},...s.map(e=>({value:e.id.toString(),label:e.categoryName}))]:[{value:`all`,label:`All categories`}],[s]),m=e=>{f(e.target.value)},h=e=>{i(e===`all`?void 0:e)};return r(u,{children:[n(l,{style:{maxWidth:`100%`,width:`fit-content`},selected:o??`all`,onChange:h,options:p}),n(a,{value:d,onChange:m,placeholder:`Search for answer by keyword`})]})};export{d as Header};
+`,d=({setSelectedTab:e,selectedTab:t})=>{let{data:s}=n(),[d,f]=a(``),p=i(()=>s?[{value:`all`,label:`All categories`},...s.map(e=>({value:e.id.toString(),label:e.categoryName}))]:[{value:`all`,label:`All categories`}],[s]);return l(u,{children:[c(r,{style:{maxWidth:`100%`,width:`fit-content`},selected:t??`all`,onChange:t=>{e(t===`all`?void 0:t)},options:p}),c(o,{value:d,onChange:e=>{f(e.target.value)},placeholder:`Search for answer by keyword`})]})};export{d as Header};

package/dist/organisms/FieldSelector/ChangingField.js

@@ -1,5 +1,5 @@
-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 a from"styled-components";import{LinearProgress as o,Typography as s}from"@equinor/eds-core-react";import{colors as c,spacings as l}from"src/atoms/style";import{useFakeProgress as u}from"src/atoms/hooks";import{AnimatedCheckmark as d}from"src/molecules/AnimatedCheckmark/AnimatedCheckmark";const f=a.div`
-  gap: ${l.medium};
+import{colors as e}from"../../atoms/style/colors.js";import{spacings as t}from"../../atoms/style/spacings.js";import{capitalize as n}from"../../atoms/utils/string.js";import{useFakeProgress as r}from"../../atoms/hooks/useFakeProgress.js";import{AnimatedCheckmark as i}from"../../molecules/AnimatedCheckmark/AnimatedCheckmark.js";import a from"react";import{LinearProgress as o,Typography as s}from"@equinor/eds-core-react";import c from"styled-components";import{Fragment as l,jsx as u,jsxs as d}from"react/jsx-runtime";const f=c.div`
+  gap: ${t.medium};
   position: absolute;
   top: 50%;
   left: 50%;
@@ -8,17 +8,17 @@ import e from"react";import{Fragment as t,jsx as n,jsxs as r}from"react/jsx-runt
   flex-direction: column;
   justify-content: center;
   align-items: center;
-  min-height: calc(100vh - (${l.xxx_large} * 4));
+  min-height: calc(100vh - (${t.xxx_large} * 4));
   width: 100%;
   max-width: 370px;
-`,p=a(o)`
-  background-color: ${c.interactive.primary__hover_alt.rgba};
+`,p=c(o)`
+  background-color: ${e.interactive.primary__hover_alt.rgba};
 
   div {
-    background-color: ${c.interactive.primary__resting.rgba};
+    background-color: ${e.interactive.primary__resting.rgba};
   }
-`,m=a(s)`
+`,m=c(s)`
   span {
     text-transform: capitalize;
   }
-`,h=({fieldName:e,onChangedField:a,finishedText:o})=>{let{finished:c,progress:l}=u({onDone:a});return n(f,{children:c?r(t,{children:[r(m,{variant:`h3`,children:[`Changed to `,n(`span`,{children:i(e)})]}),n(d,{}),n(s,{variant:`h6`,children:o})]}):r(t,{children:[r(s,{variant:`h3`,children:[`Changing field.`,`.`.repeat(l/35)]}),n(p,{variant:`determinate`,value:l})]})})};export{h as ChangingField};
+`,h=({fieldName:e,onChangedField:t,finishedText:a})=>{let{finished:o,progress:c}=r({onDone:t});return u(f,{children:o?d(l,{children:[d(m,{variant:`h3`,children:[`Changed to `,u(`span`,{children:n(e)})]}),u(i,{}),u(s,{variant:`h6`,children:a})]}):d(l,{children:[d(s,{variant:`h3`,children:[`Changing field.`,`.`.repeat(c/35)]}),u(p,{variant:`determinate`,value:c})]})})};export{h as ChangingField};

package/dist/organisms/FieldSelector/FieldSelector.js

@@ -1,9 +1,9 @@
-import{tokens as e}from"../../node_modules/@equinor/eds-tokens/dist/esm/base/index.js";import{Template as t}from"../Template/Template.js";import{SelectorCard as n}from"./SelectorCard/SelectorCard.js";import{SelectorSkeleton as r}from"./SelectorCard/Skeleton.js";import{ChangingField as i}from"./ChangingField.js";import{useRef as a,useState as o}from"react";import{jsx as s,jsxs as c}from"react/jsx-runtime";import l from"styled-components";import{Waves as u}from"src/molecules/Waves/Waves";const{colors:d}=e,f=l.div`
+import{tokens as e}from"../../node_modules/@equinor/eds-tokens/dist/esm/base/index.js";import{Waves as t}from"../../molecules/Waves/Waves.js";import{Template as n}from"../Template/Template.js";import{SelectorCard as r}from"./SelectorCard/SelectorCard.js";import{SelectorSkeleton as i}from"./SelectorCard/Skeleton.js";import{ChangingField as a}from"./ChangingField.js";import{useRef as o,useState as s}from"react";import c from"styled-components";import{jsx as l,jsxs as u}from"react/jsx-runtime";const{colors:d}=e,f=c.div`
   > svg {
     margin-bottom: -10px;
     background-color: ${d.ui.background__light.rgba};
   }
-`,p=l.div`
+`,p=c.div`
   background-color: ${d.ui.background__light.rgba};
   overflow: hidden;
   display: flex;
@@ -11,4 +11,4 @@ import{tokens as e}from"../../node_modules/@equinor/eds-tokens/dist/esm/base/ind
   height: calc(100vh - 64px);
   max-height: calc(100vh - 64px);
   width: 100vw;
-`,m=({setField:e,fields:l,isLoading:d,onChangedField:m,finishedText:h,showAccessITLink:g=!0,itemNameSingular:_=`field`})=>{let[v,y]=o(!1),b=a(``),x=t=>{t.name&&t.uuid&&(e({uuid:t.uuid,name:t.name,country:t.country??``}),b.current=t.name,y(!0))};return v?s(i,{fieldName:b.current,onChangedField:m,finishedText:h}):c(p,{className:`${t.FullWidth} ${t.WithoutScrollGutter}`,children:[s(f,{children:s(u,{})}),d?s(r,{}):s(n,{itemNameSingular:_,availableFields:l,onSelect:x,showAccessITLink:g})]})};export{m as FieldSelector};
+`,m=({setField:e,fields:c,isLoading:d,onChangedField:m,finishedText:h,showAccessITLink:g=!0,itemNameSingular:_=`field`})=>{let[v,y]=s(!1),b=o(``);return v?l(a,{fieldName:b.current,onChangedField:m,finishedText:h}):u(p,{className:`${n.FullWidth} ${n.WithoutScrollGutter}`,children:[l(f,{children:l(t,{})}),d?l(i,{}):l(r,{itemNameSingular:_,availableFields:c,onSelect:t=>{t.name&&t.uuid&&(e({uuid:t.uuid,name:t.name,country:t.country??``}),b.current=t.name,y(!0))},showAccessITLink:g})]})};export{m as FieldSelector};