Refactor(web-react): Clean up shared non-dictionary types and constants

packages/web-react/src/components/FileUploader/constants.ts

@@ -10,3 +10,10 @@ export const DEFAULT_ERROR_MESSAGE_UNSUPPORTED_FILE = 'This file type is not sup
 export const DEFAULT_ICON_NAME = 'file';
 export const DEFAULT_BUTTON_LABEL = 'Remove';
 export const DEFAULT_EDIT_BUTTON_LABEL = 'Edit';
+
+export const FileUploaderCropCSS = {
+  TOP: '--file-uploader-attachment-image-top',
+  LEFT: '--file-uploader-attachment-image-left',
+  WIDTH: '--file-uploader-attachment-image-width',
+  HEIGHT: '--file-uploader-attachment-image-height',
+} as const;

packages/web-react/src/components/FileUploader/useFileUploaderStyleProps.ts

@@ -1,9 +1,8 @@
 import classNames from 'classnames';
 import { CSSProperties } from 'react';
-import { FileUploaderCropCSS } from '../../constants/dictionaries';
 import { useClassNamePrefix } from '../../hooks';
 import { FileMetadata, FileUploaderQueueLimitBehaviorType, Validation } from '../../types';
-import { IMAGE_DIMENSION } from './constants';
+import { FileUploaderCropCSS, IMAGE_DIMENSION } from './constants';
 
 export interface FileUploaderStyleProps extends Validation {
   imageObjectFit?: 'contain' | 'cover';

packages/web-react/src/components/ScrollView/useScrollPosition.ts

@@ -1,7 +1,7 @@
 import { UIEvent, MutableRefObject, useState, useEffect } from 'react';
 import { debounce } from '../../utils';
-import { ScrollViewDirectionType, AlignmentDictionaryType } from '../../types';
-import { Alignment, Direction } from '../../constants';
+import { PositionType, ScrollViewDirectionType } from '../../types';
+import { Direction, Position } from '../../constants';
 import { EDGE_DETECTION_INACCURACY_PX, DEBOUNCE_DELAY } from './constants';
 
 export interface UseScrollPositionProps {
@@ -17,7 +17,7 @@ export interface UseScrollPositionReturn {
 }
 
 export type CurrentPositionProps = {
-  [key in AlignmentDictionaryType]: number;
+  [key in PositionType]: number;
 };
 
 export const useScrollPosition = ({
@@ -37,17 +37,17 @@ export const useScrollPosition = ({
     const viewportPosition: DOMRect = viewportReference.current.getBoundingClientRect();
 
     return {
-      [Alignment.BOTTOM]: contentPosition.bottom - viewportPosition.bottom,
-      [Alignment.LEFT]: contentPosition.left - viewportPosition.left,
-      [Alignment.RIGHT]: contentPosition.right - viewportPosition.right,
-      [Alignment.TOP]: contentPosition.top - viewportPosition.top,
+      [Position.BOTTOM]: contentPosition.bottom - viewportPosition.bottom,
+      [Position.LEFT]: contentPosition.left - viewportPosition.left,
+      [Position.RIGHT]: contentPosition.right - viewportPosition.right,
+      [Position.TOP]: contentPosition.top - viewportPosition.top,
     };
   };
 
   const handleScrollViewState = () => {
     const isDirectionHorizontal = direction === Direction.HORIZONTAL;
-    const scrollPositionStart = isDirectionHorizontal ? Alignment.LEFT : Alignment.TOP;
-    const scrollPositionEnd = isDirectionHorizontal ? Alignment.RIGHT : Alignment.BOTTOM;
+    const scrollPositionStart = isDirectionHorizontal ? Position.LEFT : Position.TOP;
+    const scrollPositionEnd = isDirectionHorizontal ? Position.RIGHT : Position.BOTTOM;
     const currentPosition = getElementsPositionDifference();
 
     if (!currentPosition) {

packages/web-react/src/constants/dictionaries.ts

@@ -5,7 +5,7 @@ export const AlignmentX = {
   RIGHT: 'right',
 } as const;
 
-/* Colors */
+/* Color */
 export const ActionColors = {
   PRIMARY: 'primary',
   SECONDARY: 'secondary',
@@ -77,11 +77,3 @@ export const ValidationStates = {
   WARNING: 'warning',
   DANGER: 'danger',
 } as const;
-
-/* FileUploader CSS crop */
-export const FileUploaderCropCSS = {
-  TOP: '--file-uploader-attachment-image-top',
-  LEFT: '--file-uploader-attachment-image-left',
-  WIDTH: '--file-uploader-attachment-image-width',
-  HEIGHT: '--file-uploader-attachment-image-height',
-} as const;

packages/web-react/src/constants/index.ts

@@ -1,3 +1,3 @@
-export * from './alignment';
 export * from './dictionaries';
 export * from './direction';
+export * from './position';

packages/web-react/src/constants/alignment.ts → packages/web-react/src/constants/position.ts

@@ -1,4 +1,4 @@
-export const Alignment = {
+export const Position = {
   LEFT: 'left',
   RIGHT: 'right',
   TOP: 'top',

packages/web-react/src/types/shared/dictionaries.ts

@@ -10,10 +10,11 @@ import {
   ValidationStates,
 } from '../../constants';
 
+/* Alignment */
 export type AlignmentXDictionaryKeys = keyof typeof AlignmentX;
 export type AlignmentXDictionaryType<T = undefined> = (typeof AlignmentX)[AlignmentXDictionaryKeys] | T;
 
-/* Colors */
+/* Color */
 export type ActionColorsDictionaryKeys = keyof typeof ActionColors;
 export type ActionColorsDictionaryType<C = undefined> = (typeof ActionColors)[ActionColorsDictionaryKeys] | C;
 

packages/web-react/src/types/shared/index.ts

@@ -1,8 +1,6 @@
 import { ReactNode, ElementType, JSXElementConstructor } from 'react';
 
 export * from './adornments';
-export * from './alignments';
-export * from './colors';
 export * from './dialogs';
 export * from './dictionaries';
 export * from './directions';
@@ -12,6 +10,7 @@ export * from './element';
 export * from './events';
 export * from './inputs';
 export * from './item';
+export * from './positions';
 export * from './refs';
 export * from './rest';
 export * from './style';

packages/web-react/src/types/shared/positions.ts

@@ -0,0 +1,4 @@
+import { Position } from '../../constants';
+
+export type PositionKeys = keyof typeof Position;
+export type PositionType = (typeof Position)[PositionKeys];