Merge pull request #676 from equinor/fix/export-style-seperately

Fix/export style seperately

package.json

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

src/atoms/enums/Errors.ts

@@ -0,0 +1,8 @@
+export enum ErrorType {
+  ERROR_400 = '400',
+  ERROR_401 = '401',
+  ERROR_403 = '403',
+  ERROR_404 = '404',
+  ERROR_500 = '500',
+  DEFAULT = 'default',
+}

src/atoms/enums/index.ts

@@ -0,0 +1,2 @@
+export * from './Errors';
+export * from './Environment';

src/atoms/hooks/useReleaseNotesQuery.ts

@@ -4,7 +4,7 @@ import {
 } from '@equinor/subsurface-app-management';
 import { useQuery } from '@tanstack/react-query';
 
-import { environment } from 'src/atoms/utils';
+import { environment } from '../utils/auth_environment';
 
 const { getAppName } = environment;
 

src/atoms/hooks/useSignalRMessages.ts

@@ -6,8 +6,8 @@ import { LogLevel } from '@microsoft/signalr';
 import { HubConnection } from '@microsoft/signalr/dist/esm/HubConnection';
 import { useQuery } from '@tanstack/react-query';
 
+import { EnvironmentType } from 'src/atoms/enums/Environment';
 import { usePrevious } from 'src/atoms/hooks/usePrevious';
-import { EnvironmentType } from 'src/atoms/types/Environment';
 import { environment } from 'src/atoms/utils/auth_environment';
 
 /* c8 ignore start */

src/atoms/index.ts

@@ -1,5 +1,6 @@
 export * from './hooks';
-export * as style from './style';
+export * from './style';
 export type * from './types';
+export * from './enums';
 export * from './icons';
 export * from './utils';

src/atoms/style/colors.ts

@@ -14,7 +14,7 @@ export const colors = {
     lightblue: {
       default:
         'var(--amplify_dataviz_lightblue_default, rgba(133, 208, 250, 1))',
-      darker: 'var(--amplify_dataviz_lightblue_darker, rgba(35, 170, 246, 1)t',
+      darker: 'var(--amplify_dataviz_lightblue_darker, rgba(35, 170, 246, 1))',
       lighter:
         'var(--amplify_dataviz_lightblue_lighter, rgba(211, 238, 253, 1))',
     },

src/atoms/types/Errors.ts

@@ -1,13 +1,6 @@
 import { ReactNode } from 'react';
 
-export enum ErrorType {
-  ERROR_400 = '400',
-  ERROR_401 = '401',
-  ERROR_403 = '403',
-  ERROR_404 = '404',
-  ERROR_500 = '500',
-  DEFAULT = 'default',
-}
+import { ErrorType } from 'src/atoms';
 
 export interface ErrorContentType {
   type: ErrorType;

src/atoms/types/SideBar.ts

@@ -0,0 +1,9 @@
+import { IconData } from '@equinor/eds-icons';
+
+export interface SideBarMenuItem {
+  icon: IconData;
+  name: string;
+  link: string;
+  onClick?: () => void;
+  replace?: boolean;
+}

src/atoms/types/index.ts

@@ -1,5 +1,5 @@
-export * from 'src/atoms/types/Environment';
 export * from 'src/atoms/types/Errors';
 export * from 'src/atoms/types/Field';
 export * from 'src/atoms/types/Guidelines';
 export * from 'src/atoms/types/Icon';
+export * from 'src/atoms/types/SideBar';

src/atoms/utils/auth_environment.ts

@@ -1,6 +1,6 @@
 import { PublicClientApplication } from '@azure/msal-browser';
 
-import { EnvironmentType } from 'src/atoms/types/Environment';
+import { EnvironmentType } from 'src/atoms/enums/Environment';
 
 const OPTIONAL_ENV_VARIABLES = [
   'IS_MOCK',

src/atoms/utils/errors.test.tsx

@@ -1,5 +1,5 @@
 import { getErrorContent, getListOfErrors } from './errors';
-import { ErrorType } from 'src/atoms/types/Errors';
+import { ErrorType } from 'src/atoms';
 
 test('Shows default values without props', () => {
   const defaultError = getErrorContent('Amplify portal', ErrorType.DEFAULT);

src/atoms/utils/errors.tsx

@@ -1,4 +1,5 @@
-import { ErrorContentType, ErrorType } from 'src/atoms/types/Errors';
+import { ErrorType } from 'src/atoms';
+import { ErrorContentType } from 'src/atoms/types/Errors';
 import { GlitchAnimation } from 'src/organisms/ErrorPage/illustrations/GlitchAnimation';
 import { QuestioningAnimation } from 'src/organisms/ErrorPage/illustrations/QuestioningAnimation';
 

src/molecules/FileProgress/RegularFileProgress.tsx

@@ -9,7 +9,7 @@ import {
 } from '@equinor/eds-icons';
 
 import { colors } from 'src/atoms/style';
-import { size } from 'src/atoms/utils';
+import { formatBytes } from 'src/atoms/utils';
 import {
   FileProgressPropsExtension,
   RegularFileProgressBaseProps,
@@ -23,8 +23,6 @@ import {
   RegularFileProgressWrapper,
 } from 'src/molecules/FileProgress/RegularFileProgress.styles';
 
-const { formatBytes } = size;
-
 interface RegularFileProgressProps
   extends RegularFileProgressBaseProps,
     FileProgressPropsExtension {}

src/molecules/RichTextEditor/RichTextEditor.tsx

@@ -7,7 +7,7 @@ import {
   OnImageUploadFn,
   RichTextEditorFeatures,
 } from './RichTextEditor.types';
-import { richtext } from 'src/atoms';
+import { getFeatures } from 'src/atoms/utils/richtext';
 
 export interface RichTextEditorProps {
   value: string | null | undefined;
@@ -38,7 +38,7 @@ export const RichTextEditor: FC<RichTextEditorProps> = ({
   lightBackground,
   border = true,
 }) => {
-  const usedFeatured = richtext.getFeatures({
+  const usedFeatured = getFeatures({
     features,
     extendFeatures,
     removeFeatures,

src/organisms/DataGrid/DataGrid.tsx

@@ -1,12 +1,11 @@
 import { EdsDataGrid, EdsDataGridProps } from '@equinor/eds-data-grid-react';
 import { tokens } from '@equinor/eds-tokens';
 
-import { style } from 'src/index';
+import { spacings } from 'src/index';
 
 import styled from 'styled-components';
 
 const { colors } = tokens;
-const { spacings } = style;
 
 interface WrapperProps {
   $enableSorting: boolean;

src/organisms/ErrorPage/ErrorPage.stories.tsx

@@ -3,7 +3,7 @@ import { Meta, StoryFn } from '@storybook/react';
 import { GlitchAnimation } from './illustrations/GlitchAnimation';
 import { QuestioningAnimation } from './illustrations/QuestioningAnimation';
 import { ErrorPage } from '.';
-import { ErrorType } from 'src/atoms/types/Errors';
+import { ErrorType } from 'src/atoms';
 import { getErrorContent } from 'src/atoms/utils/errors';
 
 const meta: Meta = {

src/organisms/ErrorPage/ErrorPage.test.tsx

@@ -1,7 +1,7 @@
 import { faker } from '@faker-js/faker';
 
 import { ErrorPage } from '.';
-import { ErrorType } from 'src/atoms/types/Errors';
+import { ErrorType } from 'src/atoms';
 import { getErrorContent } from 'src/atoms/utils/errors';
 import { render, screen, userEvent } from 'src/tests/test-utils';
 

src/organisms/ErrorPage/collections/PageNotFound.tsx

@@ -2,7 +2,7 @@ import { FC } from 'react';
 import { useNavigate } from 'react-router';
 
 import { ErrorPage } from '..';
-import { ErrorType } from 'src/atoms/types/Errors';
+import { ErrorType } from 'src/atoms';
 import { environment, errors } from 'src/atoms/utils';
 
 const { getErrorContent } = errors;

src/organisms/ErrorPage/collections/Unauthorized.tsx

@@ -1,10 +1,9 @@
 import { FC } from 'react';
 
 import { ErrorPage } from '..';
-import { ErrorType } from 'src/atoms/types/Errors';
-import { environment, errors } from 'src/atoms/utils';
-
-const { getErrorContent } = errors;
+import { ErrorType } from 'src/atoms';
+import { getErrorContent } from 'src/atoms/utils';
+import { environment } from 'src/atoms/utils/auth_environment';
 
 import styled from 'styled-components';
 

src/organisms/SideBar/MenuItem.tsx

@@ -1,24 +1,16 @@
 import { forwardRef, HTMLAttributes, MouseEvent, useMemo } from 'react';
 
 import { Icon } from '@equinor/eds-core-react';
-import { IconData } from '@equinor/eds-icons';
 
 import { IconContainer, ItemText, Link } from './MenuItem.styles';
+import { SideBarMenuItem } from 'src/atoms/types/SideBar';
 import { OptionalTooltip } from 'src/molecules/OptionalTooltip/OptionalTooltip';
 import { useSideBar } from 'src/providers/SideBarProvider';
 
-export interface MenuItemType {
-  icon: IconData;
-  name: string;
-  link: string;
-  onClick?: () => void;
-  replace?: boolean;
-}
-
 export type MenuItemProps = {
   currentUrl?: string;
   disabled?: boolean;
-} & MenuItemType &
+} & SideBarMenuItem &
   HTMLAttributes<HTMLAnchorElement>;
 
 export const MenuItem = forwardRef<HTMLAnchorElement, MenuItemProps>(

src/organisms/SideBar/SideBar.stories.tsx

@@ -4,7 +4,7 @@ import { dashboard, favorite_outlined, history } from '@equinor/eds-icons';
 import { Meta, StoryFn } from '@storybook/react';
 
 import { SideBar } from '.';
-import { MenuItemType } from 'src/organisms/SideBar/MenuItem';
+import { SideBarMenuItem } from 'src/atoms/types/SideBar';
 import { SideBarProvider } from 'src/providers/SideBarProvider';
 
 const meta: Meta = {
@@ -33,7 +33,7 @@ const meta: Meta = {
 export default meta;
 
 export const Primary: StoryFn = (args) => {
-  const menuItems: MenuItemType[] = [
+  const menuItems: SideBarMenuItem[] = [
     {
       name: 'Dashboard',
       icon: dashboard,

src/organisms/SideBar/SideBar.test.tsx

@@ -4,12 +4,13 @@ import { MemoryRouter, Route, Routes } from 'react-router-dom';
 import { add, home, star_half } from '@equinor/eds-icons';
 import { faker } from '@faker-js/faker';
 
+import { SideBarMenuItem } from 'src/atoms/types/SideBar';
 import { SideBar } from 'src/organisms/SideBar/index';
-import { MenuItem, MenuItemType } from 'src/organisms/SideBar/MenuItem';
+import { MenuItem } from 'src/organisms/SideBar/MenuItem';
 import { SideBarProvider } from 'src/providers/SideBarProvider';
 import { render, screen, userEvent, within } from 'src/tests/test-utils';
 
-const defaultMenuItems: MenuItemType[] = [
+const defaultMenuItems: SideBarMenuItem[] = [
   {
     name: 'Home',
     icon: home,
@@ -194,7 +195,7 @@ test('Hides create button when showCreate=false', async () => {
 });
 
 test('Renders bottom item when provided', () => {
-  const bottomItemProps: MenuItemType = {
+  const bottomItemProps: SideBarMenuItem = {
     name: faker.animal.dog(),
     icon: star_half,
     link: faker.internet.url(),

src/organisms/SideBar/index.ts

@@ -1,7 +1,5 @@
-import {
-  MenuItem,
-  MenuItemType as ItemType,
-} from 'src/organisms/SideBar/MenuItem';
+import { SideBarMenuItem as ItemType } from 'src/atoms/types/SideBar';
+import { MenuItem } from 'src/organisms/SideBar/MenuItem';
 import { SideBar as BaseSideBar } from 'src/organisms/SideBar/SideBar';
 
 type SidebarType = typeof BaseSideBar & {

src/organisms/TopBar/Resources/Feedback/Feedback.utils.ts

@@ -8,7 +8,7 @@ import {
   FeedbackType,
   UrgencyOption,
 } from './Feedback.types';
-import { EnvironmentType } from 'src/atoms/types/Environment';
+import { EnvironmentType } from 'src/atoms/enums/Environment';
 import { date, environment, string } from 'src/atoms/utils';
 
 const { capitalize } = string;

src/organisms/TopBar/Resources/ReleaseNotesDialog/FilterHeader/FilterHeader.test.tsx

@@ -6,7 +6,7 @@ import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
 
 import { ReleaseNoteType } from '../ReleaseNotesTypes/ReleaseNotesTypes.types';
 import { FilterHeader } from './FilterHeader';
-import { EnvironmentType } from 'src/atoms/types/Environment';
+import { EnvironmentType } from 'src/atoms/enums/Environment';
 import { AuthProvider, ReleaseNotesProvider } from 'src/providers';
 import { render, screen, userEvent } from 'src/tests/test-utils';
 

src/organisms/TopBar/Resources/ReleaseNotesDialog/FilterHeader/FilterHeader.tsx

@@ -14,7 +14,7 @@ import {
   SieveWrapper,
   Wrapper,
 } from './FilterHeader.styles';
-import { EnvironmentType } from 'src/atoms/types/Environment';
+import { EnvironmentType } from 'src/atoms/enums/Environment';
 import { environment } from 'src/atoms/utils';
 import { FilterOption } from 'src/molecules/Sieve/Filter';
 import { Sieve } from 'src/molecules/Sieve/Sieve';

src/organisms/TopBar/TopBar.stories.tsx

@@ -6,9 +6,9 @@ import { Meta, StoryFn } from '@storybook/react';
 
 import { FAKE_ACCOUNT, FAKE_ACCOUNT_PHOTO } from './Account/stories/data';
 import { TopBar, TopBarType } from '.';
-import { EnvironmentType } from 'src/atoms/types/Environment';
+import { EnvironmentType } from 'src/atoms/enums/Environment';
+import { SideBarMenuItem } from 'src/atoms/types/SideBar';
 import { SideBar } from 'src/organisms/SideBar';
-import { MenuItemType } from 'src/organisms/SideBar/MenuItem';
 import { Template } from 'src/organisms/Template/Template';
 import { SideBarProvider } from 'src/providers/SideBarProvider';
 
@@ -83,7 +83,7 @@ export const Primary: StoryFn<TopBarType> = ({ ...args }) => {
 };
 
 export const FullPageExample: StoryFn<TopBarType> = ({ ...args }) => {
-  const menuItems: MenuItemType[] = [
+  const menuItems: SideBarMenuItem[] = [
     {
       name: 'Dashboard',
       icon: dashboard,

src/organisms/TopBar/TopBar.styles.ts

@@ -6,8 +6,8 @@ import {
 } from '@equinor/eds-core-react';
 import { tokens } from '@equinor/eds-tokens';
 
+import { EnvironmentType } from 'src/atoms/enums/Environment';
 import { spacings } from 'src/atoms/style';
-import { EnvironmentType } from 'src/atoms/types/Environment';
 
 import styled from 'styled-components';
 

src/organisms/TopBar/TopBar.test.tsx

@@ -3,8 +3,8 @@ import { tokens } from '@equinor/eds-tokens';
 import { faker } from '@faker-js/faker';
 
 import { TopBar } from '.';
+import { EnvironmentType } from 'src/atoms/enums/Environment';
 import { spacings } from 'src/atoms/style';
-import { EnvironmentType } from 'src/atoms/types/Environment';
 import { Field } from 'src/atoms/types/Field';
 import { act, render, screen, userEvent, waitFor } from 'src/tests/test-utils';
 

src/organisms/TopBar/TopBar.tsx

@@ -9,7 +9,7 @@ import {
   CircularProgress,
   EnvironmentTag,
 } from './TopBar.styles';
-import { EnvironmentType } from 'src/atoms/types/Environment';
+import { EnvironmentType } from 'src/atoms/enums/Environment';
 import { Field } from 'src/atoms/types/Field';
 import { Typography } from 'src/molecules';
 import { ApplicationIcon } from 'src/molecules/ApplicationIcon/ApplicationIcon';

src/providers/AuthProvider/AuthProvider.tsx

@@ -12,7 +12,7 @@ import { AccountInfo } from '@azure/msal-browser';
 import { MsalProvider } from '@azure/msal-react';
 
 import { AuthProviderInner } from './AuthProviderInner';
-import { auth, environment } from 'src/atoms/utils';
+import { auth, environment } from 'src/atoms/utils/auth_environment';
 
 const { msalApp } = auth;
 const { getIsMock } = environment;