lint

packages/tokens-studio-for-figma/src/app/components/BorderTokenForm.tsx

@@ -132,11 +132,11 @@ export default function BorderTokenForm({
             onSubmit={onSubmit}
           />
 
-          {isAliasMode &&
-            typeof internalEditToken.value === 'string' &&
-            checkIfContainsAlias(internalEditToken.value) && (
+          {isAliasMode
+            && typeof internalEditToken.value === 'string'
+            && checkIfContainsAlias(internalEditToken.value) && (
               <ResolvedTokenDisplay alias={alias} selectedToken={selectedToken} />
-            )}
+          )}
         </Stack>
       )}
     </Stack>

packages/tokens-studio-for-figma/src/app/components/ColorPickerTrigger.tsx

@@ -17,12 +17,10 @@ type Props = {
 
 export const ColorPickerTrigger: React.FC<React.PropsWithChildren<React.PropsWithChildren<Props>>> = ({
   onClick, background,
-}) => {
-  return (
-    <TriggerButton
-      type="button"
-      css={{ background }}
-      onClick={onClick}
-    />
-  )
-};
+}) => (
+  <TriggerButton
+    type="button"
+    css={{ background }}
+    onClick={onClick}
+  />
+);

packages/tokens-studio-for-figma/src/app/components/Input.tsx

@@ -140,9 +140,9 @@ const StyledPrefix = styled('div', {
     },
     isComposition: {
       true: {
-        padding: '0'
-      }
-    }
+        padding: '0',
+      },
+    },
   },
 });
 

packages/tokens-studio-for-figma/src/app/components/ManageThemesModal/CreateOrEditThemeForm.tsx

@@ -101,7 +101,10 @@ export const CreateOrEditThemeForm: React.FC<React.PropsWithChildren<React.Props
 
   return (
     <StyledForm id="form-create-or-edit-theme" onSubmit={handleSubmit(onSubmit)}>
-      <StyledNameInputBox css={{ width: '100%', position: 'sticky', top: 0, zIndex: 2 }}>
+      <StyledNameInputBox css={{
+        width: '100%', position: 'sticky', top: 0, zIndex: 2,
+      }}
+      >
         <StyledCreateOrEditThemeFormHeaderFlex>
           <IconButton
             tooltip={t('returnToOverview')}

packages/tokens-studio-for-figma/src/app/components/ManageThemesModal/ThemeListGroupHeader.tsx

@@ -3,6 +3,7 @@ import React, {
 } from 'react';
 import { useDispatch, useSelector } from 'react-redux';
 import { IconButton } from '@tokens-studio/ui';
+import { Xmark, Check } from 'iconoir-react';
 import { editProhibitedSelector } from '@/selectors';
 import { DragControlsContext } from '@/context';
 import { StyledDragButton } from '../StyledDragger/StyledDragButton';
@@ -13,7 +14,6 @@ import Input from '../Input';
 import IconPencil from '@/icons/pencil.svg';
 import { Dispatch } from '@/app/store';
 import { INTERNAL_THEMES_NO_GROUP } from '@/constants/InternalTokenGroup';
-import { Xmark, Check } from 'iconoir-react';
 
 type Props = React.PropsWithChildren<{
   groupName: string

packages/tokens-studio-for-figma/src/app/components/ManageThemesModal/TokenSetThemeItem.tsx

@@ -3,10 +3,10 @@ import {
   Box, Stack, ToggleGroup,
 } from '@tokens-studio/ui';
 import { Check, Xmark, CodeBrackets } from 'iconoir-react';
+import { useTranslation } from 'react-i18next';
 import { TreeItem } from '@/utils/tokenset';
 import { StyledThemeLabel } from './StyledThemeLabel';
 import { TokenSetStatus } from '@/constants/TokenSetStatus';
-import { useTranslation } from 'react-i18next';
 
 type Props = {
   item: TreeItem
@@ -98,4 +98,4 @@ export const TokenSetThemeItem: React.FC<React.PropsWithChildren<React.PropsWith
       </Stack>
     )
   );
-};
+};

packages/tokens-studio-for-figma/src/app/components/PresetProvider/DefaultPreset.tsx

@@ -1,6 +1,8 @@
 import React from 'react';
 import { useDispatch } from 'react-redux';
-import { Button, Heading, Stack, Text } from '@tokens-studio/ui';
+import {
+  Button, Heading, Stack, Text,
+} from '@tokens-studio/ui';
 import { Dispatch } from '@/app/store';
 import { track } from '@/utils/analytics';
 

packages/tokens-studio-for-figma/src/app/components/PresetProvider/FilePreset.tsx

@@ -1,6 +1,8 @@
 import React from 'react';
 import { useSelector } from 'react-redux';
-import { Button, Heading, Stack, Text } from '@tokens-studio/ui';
+import {
+  Button, Heading, Stack, Text,
+} from '@tokens-studio/ui';
 import { DeepTokensMap, ThemeObjectsList } from '@/types';
 import { SingleToken } from '@/types/tokens';
 import {

packages/tokens-studio-for-figma/src/app/components/SingleBoxShadowDownShiftInput.tsx

@@ -52,8 +52,8 @@ export default function SingleBoxShadowDownShiftInput({
       setInputValue={handleBoxshadowDownShiftInputChange}
       placeholder={name === 'color' ? t('colorOrAlias') : t('valueOrAlias')}
       prefix={
-        name === 'color' &&
-        resolvedColor && (
+        name === 'color'
+        && resolvedColor && (
           <ColorPickerTrigger background={resolvedColor} onClick={handleToggleInputHelper}>
             {value}
           </ColorPickerTrigger>

packages/tokens-studio-for-figma/src/app/components/StorageItemForm/TokensStudioForm.tsx

@@ -40,7 +40,9 @@ type Props = {
   errorMessage?: string;
 };
 
-export default function TokensStudioForm({ onChange, onSubmit, onCancel, values, hasErrored, errorMessage }: Props) {
+export default function TokensStudioForm({
+  onChange, onSubmit, onCancel, values, hasErrored, errorMessage,
+}: Props) {
   const { t } = useTranslation(['storage']);
   const [fetchOrgsError, setFetchOrgsError] = React.useState<string | null>(null);
   const [orgData, setOrgData] = React.useState<Organization[]>([]);
@@ -111,11 +113,10 @@ export default function TokensStudioForm({ onChange, onSubmit, onCancel, values,
   }, [values.secret]);
 
   const orgOptions = React.useMemo(
-    () =>
-      orgData?.map((org) => ({
-        label: org.name,
-        value: org.id,
-      })),
+    () => orgData?.map((org) => ({
+      label: org.name,
+      value: org.id,
+    })),
     [orgData],
   );
 
@@ -167,7 +168,8 @@ export default function TokensStudioForm({ onChange, onSubmit, onCancel, values,
     <form onSubmit={handleSubmit}>
       <Stack direction="column" gap={5}>
         <Text muted>
-          {t('providers.tokensstudio.descriptionFirstPart')}{' '}
+          {t('providers.tokensstudio.descriptionFirstPart')}
+          {' '}
           <Link
             href="https://q2gsw2tok1e.typeform.com/to/pJCwLVh2?typeform-source=tokens.studio"
             target="_blank"
@@ -201,14 +203,14 @@ export default function TokensStudioForm({ onChange, onSubmit, onCancel, values,
             onBlur={fetchOrgData}
             required
             type={isMasked ? 'password' : 'text'}
-            trailingAction={
+            trailingAction={(
               <IconButton
                 variant="invisible"
                 size="small"
                 onClick={toggleMask}
                 icon={isMasked ? <EyeClosedIcon /> : <EyeOpenIcon />}
               />
-            }
+            )}
           />
           {fetchOrgsError && <Text muted>{fetchOrgsError}</Text>}
         </FormField>

packages/tokens-studio-for-figma/src/app/components/modals/DuplicateTokenGroupModal.test.tsx

@@ -2,22 +2,24 @@ import React from 'react';
 import { Provider } from 'react-redux';
 import { TokenTypes } from '@/constants/TokenTypes';
 import { AnyTokenList } from '@/types/tokens';
-import { createMockStore, fireEvent, render, waitFor } from '../../../../tests/config/setupTest';
+import {
+  createMockStore, fireEvent, render, waitFor,
+} from '../../../../tests/config/setupTest';
 import DuplicateTokenGroupModal from './DuplicateTokenGroupModal';
 
 const tokens: Record<string, AnyTokenList> = {
   global: [
     {
       value: '#f0',
       type: TokenTypes.COLOR,
-      name: 'foo.bar.something.bar'
+      name: 'foo.bar.something.bar',
     },
     {
       value: '#fff',
       type: TokenTypes.COLOR,
-      name: 'otherfoo.something'
-    }
-  ]
+      name: 'otherfoo.something',
+    },
+  ],
 };
 
 const store = createMockStore({ tokenState: { tokens, activeTokenSet: 'global' } });
@@ -34,7 +36,7 @@ describe('DuplicateTokenGroupModal', () => {
           onClose={() => {}}
           handleNewTokenGroupNameChange={() => {}}
         />
-      </Provider>
+      </Provider>,
     );
   });
 
@@ -52,12 +54,12 @@ describe('DuplicateTokenGroupModal', () => {
           onClose={() => {}}
           handleNewTokenGroupNameChange={() => {}}
         />
-      </Provider>
+      </Provider>,
     );
 
     waitFor(async () => {
       expect(getByText('duplicate')).toBeDisabled();
-    })
+    });
   });
 
   it('should not disable duplication when there are no duplicates', () => {
@@ -74,11 +76,11 @@ describe('DuplicateTokenGroupModal', () => {
           onClose={() => {}}
           handleNewTokenGroupNameChange={() => {}}
         />
-      </Provider>
+      </Provider>,
     );
 
     waitFor(async () => {
       expect(getByText('duplicate')).not.toBeDisabled();
     });
   });
-});
+});

packages/tokens-studio-for-figma/src/app/components/modals/RenameTokenGroupModal.test.tsx

@@ -2,22 +2,24 @@ import React from 'react';
 import { Provider } from 'react-redux';
 import { TokenTypes } from '@/constants/TokenTypes';
 import { AnyTokenList } from '@/types/tokens';
-import { createMockStore, fireEvent, render, waitFor } from '../../../../tests/config/setupTest';
+import {
+  createMockStore, fireEvent, render, waitFor,
+} from '../../../../tests/config/setupTest';
 import RenameTokenGroupModal from './RenameTokenGroupModal';
 
 const tokens: Record<string, AnyTokenList> = {
   global: [
     {
       value: '#f0',
       type: TokenTypes.COLOR,
-      name: 'foo.bar.something.bar'
+      name: 'foo.bar.something.bar',
     },
     {
       value: '#fff',
       type: TokenTypes.COLOR,
-      name: 'otherfoo.something'
-    }
-  ]
+      name: 'otherfoo.something',
+    },
+  ],
 };
 
 const store = createMockStore({ tokenState: { tokens, activeTokenSet: 'global' } });
@@ -34,7 +36,7 @@ describe('RenameTokenGroupModal', () => {
           handleRenameTokenGroupSubmit={() => {}}
           handleNewTokenGroupNameChange={() => {}}
         />
-      </Provider>
+      </Provider>,
     );
   });
 
@@ -52,7 +54,7 @@ describe('RenameTokenGroupModal', () => {
           handleRenameTokenGroupSubmit={() => {}}
           handleNewTokenGroupNameChange={() => {}}
         />
-      </Provider>
+      </Provider>,
     );
 
     waitFor(async () => {
@@ -74,11 +76,11 @@ describe('RenameTokenGroupModal', () => {
           handleRenameTokenGroupSubmit={() => {}}
           handleNewTokenGroupNameChange={() => {}}
         />
-      </Provider>
+      </Provider>,
     );
 
     waitFor(async () => {
       expect(getByText('Change')).not.toBeDisabled();
     });
   });
-});
+});

packages/tokens-studio-for-figma/src/app/store/models/effects/settingsState/index.ts

@@ -9,4 +9,4 @@ export * from './setVariablesString';
 export * from './setCreateStylesWithVariableReferences';
 export * from './setIgnoreFirstPartForStyles';
 export * from './setRenameExistingStylesAndVariables';
-export * from './setRemoveStylesAndVariablesWithoutConnection'
+export * from './setRemoveStylesAndVariablesWithoutConnection';

packages/tokens-studio-for-figma/src/app/store/models/reducers/settingsState/index.ts

@@ -10,4 +10,4 @@ export * from './setVariablesString';
 export * from './setCreateStylesWithVariableReferences';
 export * from './setIgnoreFirstPartForStyles';
 export * from './setRenameExistingStylesAndVariables';
-export * from './setRemoveStylesAndVariablesWithoutConnection';
+export * from './setRemoveStylesAndVariablesWithoutConnection';