@griddo/ax 12.5.1 → 12.6.0

package/src/components/DragAndDrop/index.tsx

@@ -1,4 +1,5 @@
-import React, { memo } from "react";
+import type React from "react";
+import { memo } from "react";
 import * as S from "./style";
 
 const DragAndDrop = (props: any) => {

package/src/components/EmptyState/index.tsx

@@ -1,6 +1,6 @@
 import React from "react";
 import { Button, Icon } from "@ax/components";
-import { IEmptyStateProps } from "@ax/types";
+import type { IEmptyStateProps } from "@ax/types";
 
 import * as S from "./style";
 

package/src/components/ErrorCenter/index.tsx

@@ -1,5 +1,5 @@
 import React from "react";
-import { IErrorItem } from "@ax/types";
+import type { IErrorItem } from "@ax/types";
 import { Icon } from "@ax/components";
 
 import * as S from "./style";

package/src/components/FieldContainer/index.tsx

@@ -1,6 +1,6 @@
 import React from "react";
 
-import { IPage, ISite, ILanguage } from "@ax/types";
+import type { IPage, ISite, ILanguage } from "@ax/types";
 import { getNullValue, getDefaultSchema, getDefaultTemplate, findObjectValue } from "@ax/helpers";
 
 import { FieldsBehavior, HiddenField } from "@ax/components";

package/src/components/Fields/AIReferenceField/AIConfigPanel/index.tsx

@@ -2,7 +2,7 @@ import React, { useEffect, useState } from "react";
 import { Button, FieldsBehavior, Icon } from "@ax/components";
 import { sites, structuredData } from "@ax/api";
 import { isReqOk } from "@ax/helpers";
-import { IState } from "..";
+import type { IState } from "..";
 
 import * as S from "./style";
 

package/src/components/Fields/AIReferenceField/index.tsx

@@ -1,7 +1,7 @@
 import React from "react";
 import { FloatingPanel, Icon } from "@ax/components";
 import { useModal } from "@ax/hooks";
-import { ISchemaField, ISite } from "@ax/types";
+import type { ISchemaField, ISite } from "@ax/types";
 import AIConfigPanel from "./AIConfigPanel";
 
 import * as S from "./style";

package/src/components/Fields/ArrayFieldGroup/helpers.ts

@@ -9,13 +9,7 @@ interface IGetArrayFieldsParams {
 	site: ISite | null;
 	actions: any;
 	onChange: (value: Record<string, unknown>, index: number) => void;
-	addComponentInArray: (
-		type: string,
-		key: string,
-		parentKey: string,
-		index: number,
-		isMultiple: boolean,
-	) => void;
+	addComponentInArray: (type: string, key: string, parentKey: string, index: number, isMultiple: boolean) => void;
 	replaceModuleInArray: (module: string, parent: any, key: string, parentKey: string, index: number) => void;
 	/** Each array variant resolves the field key differently (props.objKey vs field.key). */
 	getKey: (field: any) => string;

package/src/components/Fields/CheckGroup/index.tsx

@@ -1,7 +1,7 @@
 import React from "react";
 
-import { ICheck } from "@ax/types";
-import CheckField, { ICheckFieldProps } from "../CheckField";
+import type { ICheck } from "@ax/types";
+import CheckField, { type ICheckFieldProps } from "../CheckField";
 
 import * as S from "./style";
 

package/src/components/Fields/ColorPicker/Picker/index.tsx

@@ -1,4 +1,5 @@
-import React, { useState } from "react";
+import type React from "react";
+import { useState } from "react";
 import { hex3to6, defaultColors } from "./../helpers";
 
 import * as S from "./style";

package/src/components/Fields/ColorPicker/index.tsx

@@ -1,4 +1,5 @@
-import React, { useRef, useState, memo, useReducer, useCallback } from "react";
+import type React from "react";
+import { useRef, useState, memo, useReducer, useCallback } from "react";
 
 import { useHandleClickOutside } from "@ax/hooks";
 import { IconAction } from "@ax/components";

package/src/components/Fields/ComponentContainer/style.tsx

@@ -1,5 +1,5 @@
 import styled from "styled-components";
-import { CSS, Transform } from "@dnd-kit/utilities";
+import { CSS, type Transform } from "@dnd-kit/utilities";
 
 const IconWrapper = styled.div`
   background-color: ${(p) => p.theme.color.uiBackground03};

package/src/components/Fields/ConditionalField/index.tsx

@@ -17,9 +17,7 @@ const ConditionalField = (props: IConditionalFieldProps) => {
 	return (
 		<S.Wrapper>
 			<RadioGroup name="radio" value={safeValue} options={options} onChange={handleChange} disabled={disabled} />
-			<S.Content data-testid="conditionalFieldContent">
-				{visibleFields}
-			</S.Content>
+			<S.Content data-testid="conditionalFieldContent">{visibleFields}</S.Content>
 		</S.Wrapper>
 	);
 };

package/src/components/Fields/FormCategorySelect/index.tsx

@@ -1,8 +1,8 @@
 import React from "react";
 import { getSchemaFormCategories } from "@ax/helpers";
-import { ILanguage } from "@ax/types";
+import type { ILanguage } from "@ax/types";
 
-import MultiCheckSelectGroup, { IMultiCheckSelectGroupProps } from "../MultiCheckSelectGroup";
+import MultiCheckSelectGroup, { type IMultiCheckSelectGroupProps } from "../MultiCheckSelectGroup";
 
 const FormCategorySelect = (props: IFormCategorySelectProps): JSX.Element => {
 	const { categories } = props;

package/src/components/Fields/FormContainer/FormModal/index.tsx

@@ -1,7 +1,7 @@
-import React, { Dispatch, SetStateAction, useCallback, useEffect, useState } from "react";
+import React, { type Dispatch, type SetStateAction, useCallback, useEffect, useState } from "react";
 import { connect } from "react-redux";
 
-import { FormContent, GetFormsParams, IModal, IQueryValue, IRootState } from "@ax/types";
+import type { FormContent, GetFormsParams, IModal, IQueryValue, IRootState } from "@ax/types";
 import {
 	Button,
 	CategoryFilter,

package/src/components/Fields/FormContainer/index.tsx

@@ -2,7 +2,7 @@ import React, { useState } from "react";
 import { useModal, usePermission } from "@ax/hooks";
 import { trimText } from "@ax/helpers";
 import { ActionMenu, HiddenField, Icon } from "@ax/components";
-import { FormContent, ISite } from "@ax/types";
+import type { FormContent, ISite } from "@ax/types";
 
 import FormModal from "./FormModal";
 

package/src/components/Fields/FormFieldArray/index.tsx

@@ -1,6 +1,6 @@
 import React from "react";
 
-import MixableComponentArray, { IMixableComponentArrayProps } from "../ComponentArray/MixableComponentArray";
+import MixableComponentArray, { type IMixableComponentArrayProps } from "../ComponentArray/MixableComponentArray";
 
 const FormFieldArray = (props: IMixableComponentArrayProps): JSX.Element => {
 	const formFieldArrayProps: IMixableComponentArrayProps = {

package/src/components/Fields/IntegrationsField/IntegrationItem/CustomPanel/index.tsx

@@ -1,6 +1,6 @@
 import React, { useState } from "react";
 
-import { IIntegration } from "@ax/types";
+import type { IIntegration } from "@ax/types";
 import { FloatingPanel, Button, FieldsBehavior, NoteField } from "@ax/components";
 
 import * as S from "./style";

package/src/components/Fields/IntegrationsField/IntegrationItem/VariablesPanel/helpers.ts

@@ -1,4 +1,4 @@
-import { IIntegrationVariable } from "@ax/types";
+import type { IIntegrationVariable } from "@ax/types";
 
 const modifyVariableValue = (
 	variables: IIntegrationVariable[] | undefined,

package/src/components/Fields/IntegrationsField/IntegrationItem/VariablesPanel/index.tsx

@@ -1,6 +1,6 @@
 import React, { useCallback, useRef, useState } from "react";
 
-import { IIntegration, IIntegrationVariable, ILanguage } from "@ax/types";
+import type { IIntegration, IIntegrationVariable, ILanguage } from "@ax/types";
 import { FloatingPanel, Button, FieldsBehavior, NoteField } from "@ax/components";
 
 import * as S from "./style";

package/src/components/Fields/IntegrationsField/SideModal/SideModalOption/index.tsx

@@ -1,7 +1,7 @@
 import React, { memo } from "react";
 
 import Icon from "@ax/components/Icon";
-import { IIntegration } from "@ax/types";
+import type { IIntegration } from "@ax/types";
 
 import * as S from "./style";
 

package/src/components/Fields/LinkField/index.tsx

@@ -1,7 +1,7 @@
 import React, { memo } from "react";
 
 import { FieldsBehavior } from "@ax/components";
-import { ILinkField, IUrlField } from "@ax/types";
+import type { ILinkField, IUrlField } from "@ax/types";
 import { getNullValue } from "@ax/helpers";
 
 const LinkField = (props: ILinkFieldProps): JSX.Element => {

package/src/components/Fields/RadioGroup/index.tsx

@@ -1,5 +1,5 @@
-import React from "react";
-import RadioField, { IRadioFieldProps } from "../RadioField";
+import type React from "react";
+import RadioField, { type IRadioFieldProps } from "../RadioField";
 
 import * as S from "./style";
 

package/src/components/Fields/SliderField/index.tsx

@@ -1,4 +1,5 @@
-import React, { memo, useEffect, useRef } from "react";
+import type React from "react";
+import { memo, useEffect, useRef } from "react";
 
 import * as S from "./style";
 

package/src/components/Fields/TimeField/HourInput/index.tsx

@@ -1,4 +1,5 @@
-import React, { memo, useEffect, useRef, useState } from "react";
+import type React from "react";
+import { memo, useEffect, useRef, useState } from "react";
 import { isNumber } from "@ax/helpers";
 import { validateTimeAndCursor } from "./utils";
 

package/src/components/Fields/UrlField/utils.tsx

@@ -1,5 +1,5 @@
 import { getSchema } from "@ax/helpers";
-import { IPage, ISelectOption } from "@ax/types";
+import type { IPage, ISelectOption } from "@ax/types";
 
 const findSchemaComponentArrays = (component: string) => {
 	const keys: string[] = [];

package/src/components/Fields/VisualOption/index.tsx

@@ -1,4 +1,4 @@
-import React from "react";
+import type React from "react";
 
 import * as S from "./style";
 

package/src/components/Fields/Wysiwyg/atoms.tsx

@@ -132,8 +132,19 @@ interface ILinkPopoverProps {
 	x: number;
 	y: number;
 	selectedText?: string;
-	linkData?: { url: string; newTab: boolean; noFollow: boolean; isEditing: boolean; linkPageId?: number | null; isImageLink?: boolean } | null;
-	onInsert: (url: string, text: string, options?: { newTab: boolean; noFollow: boolean; linkTo?: number | null }) => void;
+	linkData?: {
+		url: string;
+		newTab: boolean;
+		noFollow: boolean;
+		isEditing: boolean;
+		linkPageId?: number | null;
+		isImageLink?: boolean;
+	} | null;
+	onInsert: (
+		url: string,
+		text: string,
+		options?: { newTab: boolean; noFollow: boolean; linkTo?: number | null },
+	) => void;
 	onClose: () => void;
 }
 

package/src/components/Fields/Wysiwyg/helpers.tsx

@@ -90,7 +90,7 @@ const getLanguageMenuHtml = (languages: { name: string; iso: string; featured?:
 const setLinkAttributes = (
 	element: HTMLElement | null,
 	url: string,
-	options?: { newTab?: boolean; noFollow?: boolean; linkTo?: number | null }
+	options?: { newTab?: boolean; noFollow?: boolean; linkTo?: number | null },
 ) => {
 	if (!element) return;
 	element.setAttribute("href", url);
@@ -140,4 +140,12 @@ const createPopupFunctions = (editor: any, editorEl: HTMLElement) => {
 	return { showPopup, showErrorPopup };
 };
 
-export { getRichTextConfig, parseClassNames, getLanguageMenuHtml, setLinkAttributes, getPopupPosition, createPopupFunctions, type IRichTextConfig };
+export {
+	getRichTextConfig,
+	parseClassNames,
+	getLanguageMenuHtml,
+	setLinkAttributes,
+	getPopupPosition,
+	createPopupFunctions,
+	type IRichTextConfig,
+};

package/src/components/FileGallery/FolderItem/index.tsx

@@ -1,6 +1,6 @@
 import React from "react";
 
-import { IFolder } from "@ax/types";
+import type { IFolder } from "@ax/types";
 import { Icon, Tooltip } from "@ax/components";
 import { trimText } from "@ax/helpers";
 

package/src/components/FileGallery/GridItem/index.tsx

@@ -1,5 +1,5 @@
 import React from "react";
-import { IFile } from "@ax/types";
+import type { IFile } from "@ax/types";
 import { getFileIcon, getFormattedDateWithTimezone, trimText } from "@ax/helpers";
 import { Tooltip } from "@ax/components";
 

package/src/components/FloatingButton/index.tsx

@@ -1,4 +1,4 @@
-import React from "react";
+import type React from "react";
 import { Icon } from "@ax/components";
 
 import * as S from "./style";

package/src/components/Gallery/FolderItem/index.tsx

@@ -1,6 +1,6 @@
 import React from "react";
 
-import { IFolder } from "@ax/types";
+import type { IFolder } from "@ax/types";
 import { Icon, Tooltip } from "@ax/components";
 import { trimText } from "@ax/helpers";
 

package/src/components/HeadingsPreviewModal/index.tsx

@@ -5,7 +5,13 @@ import type { HeadingFilter, HeadingNode } from "@ax/types";
 
 import ErrorsBanner from "./ErrorsBanner";
 import HeadingItem from "./HeadingItem";
-import { analyzeHeadings, extractUniqueHeadingTypes, filterHeadings, hasHiddenHeadings, parseHeadingsTree } from "./utils";
+import {
+	analyzeHeadings,
+	extractUniqueHeadingTypes,
+	filterHeadings,
+	hasHiddenHeadings,
+	parseHeadingsTree,
+} from "./utils";
 
 import * as S from "./style";
 
@@ -23,7 +29,10 @@ const HeadingsPreviewModal = (props: IHeadingsPreviewProps) => {
 	const listRef = useRef<HTMLDivElement>(null);
 
 	const filters = useMemo<HeadingFilter[]>(() => ["all", ...extractUniqueHeadingTypes(headings)], [headings]);
-	const filteredHeadings = useMemo(() => filterHeadings(headings, headingsFilter, toggleStatus), [headings, headingsFilter, toggleStatus]);
+	const filteredHeadings = useMemo(
+		() => filterHeadings(headings, headingsFilter, toggleStatus),
+		[headings, headingsFilter, toggleStatus],
+	);
 	const showToggleWrapper = useMemo(() => hasHiddenHeadings(headings, headingsFilter), [headings, headingsFilter]);
 	const errors = useMemo(() => analyzeHeadings(filteredHeadings, isFiltering), [filteredHeadings, isFiltering]);
 

package/src/components/HeadingsPreviewModal/utils.tsx

@@ -332,5 +332,12 @@ interface IFlatHeading {
 	isHidden: boolean;
 }
 
-export { parseHeadingsTree, extractUniqueHeadingTypes, filterHeadings, analyzeHeadings, getHeadColor, hasHiddenHeadings };
+export {
+	parseHeadingsTree,
+	extractUniqueHeadingTypes,
+	filterHeadings,
+	analyzeHeadings,
+	getHeadColor,
+	hasHiddenHeadings,
+};
 export type { IHeadingError };

package/src/components/Icon/components/Party.jsx

@@ -1,16 +1,10 @@
 import * as React from "react";
 const SvgParty = (props) => (
-  <svg
-    xmlns="http://www.w3.org/2000/svg"
-    width={24}
-    height={24}
-    fill="none"
-    {...props}
-  >
-    <path
-      fill="#5057FF"
-      d="M2 22 7 8l9 9-14 5Zm3.3-3.3 7.05-2.5-4.55-4.55-2.5 7.05Zm9.25-6.15L13.5 11.5l5.6-5.6a2.624 2.624 0 0 1 1.925-.8c.75 0 1.392.267 1.925.8l.6.6-1.05 1.05-.6-.6a1.187 1.187 0 0 0-.875-.35c-.35 0-.642.117-.875.35l-5.6 5.6Zm-4-4L9.5 7.5l.6-.6c.233-.233.35-.517.35-.85 0-.333-.117-.617-.35-.85l-.65-.65L10.5 3.5l.65.65c.533.533.8 1.167.8 1.9 0 .733-.267 1.367-.8 1.9l-.6.6Zm2 2L11.5 9.5l3.6-3.6c.233-.233.35-.525.35-.875s-.117-.642-.35-.875l-1.6-1.6 1.05-1.05 1.6 1.6c.533.533.8 1.175.8 1.925s-.267 1.392-.8 1.925l-3.6 3.6Zm4 4L15.5 13.5l1.6-1.6a2.624 2.624 0 0 1 1.925-.8c.75 0 1.392.267 1.925.8l1.6 1.6-1.05 1.05-1.6-1.6a1.187 1.187 0 0 0-.875-.35c-.35 0-.642.117-.875.35l-1.6 1.6Z"
-    />
-  </svg>
+	<svg xmlns="http://www.w3.org/2000/svg" width={24} height={24} fill="none" {...props}>
+		<path
+			fill="#5057FF"
+			d="M2 22 7 8l9 9-14 5Zm3.3-3.3 7.05-2.5-4.55-4.55-2.5 7.05Zm9.25-6.15L13.5 11.5l5.6-5.6a2.624 2.624 0 0 1 1.925-.8c.75 0 1.392.267 1.925.8l.6.6-1.05 1.05-.6-.6a1.187 1.187 0 0 0-.875-.35c-.35 0-.642.117-.875.35l-5.6 5.6Zm-4-4L9.5 7.5l.6-.6c.233-.233.35-.517.35-.85 0-.333-.117-.617-.35-.85l-.65-.65L10.5 3.5l.65.65c.533.533.8 1.167.8 1.9 0 .733-.267 1.367-.8 1.9l-.6.6Zm2 2L11.5 9.5l3.6-3.6c.233-.233.35-.525.35-.875s-.117-.642-.35-.875l-1.6-1.6 1.05-1.05 1.6 1.6c.533.533.8 1.175.8 1.925s-.267 1.392-.8 1.925l-3.6 3.6Zm4 4L15.5 13.5l1.6-1.6a2.624 2.624 0 0 1 1.925-.8c.75 0 1.392.267 1.925.8l1.6 1.6-1.05 1.05-1.6-1.6a1.187 1.187 0 0 0-.875-.35c-.35 0-.642.117-.875.35l-1.6 1.6Z"
+		/>
+	</svg>
 );
 export default SvgParty;

package/src/components/Icon/components/Republish.jsx

@@ -1,22 +1,16 @@
 import * as React from "react";
 const SvgRepublish = (props) => (
-  <svg
-    xmlns="http://www.w3.org/2000/svg"
-    width={24}
-    height={24}
-    fill="none"
-    {...props}
-  >
-    <path
-      fill="#AFC628"
-      d="M19.35 10.04A7.49 7.49 0 0 0 12 4C9.11 4 6.6 5.64 5.35 8.04A5.994 5.994 0 0 0 0 14c0 3.31 2.69 6 6 6h13c2.76 0 5-2.24 5-5 0-2.64-2.05-4.78-4.65-4.96ZM19 18H6c-2.21 0-4-1.79-4-4 0-2.05 1.53-3.76 3.56-3.97l1.07-.11.5-.95A5.469 5.469 0 0 1 12 6c2.62 0 4.88 1.86 5.39 4.43l.3 1.5 1.53.11A2.98 2.98 0 0 1 22 15c0 1.65-1.35 3-3 3Z"
-    />
-    <path
-      fill="#AFC628"
-      stroke="#AFC628"
-      strokeWidth={0.25}
-      d="M15.784 12.895a4.125 4.125 0 0 1-4.104 3.713 4.092 4.092 0 0 1-2.92-1.228l-.791.791-.214.213v-2.826h2.827l-.214.213-.864.865a3.046 3.046 0 0 0 2.176.922 3.078 3.078 0 0 0 3.048-2.69l.014-.11h1.056l-.014.137Zm-8.222-.688.014-.137a4.124 4.124 0 0 1 4.104-3.712c1.145 0 2.177.472 2.921 1.226l.79-.79.214-.213v2.826h-2.827l.214-.213.865-.866a3.05 3.05 0 0 0-2.177-.92 3.077 3.077 0 0 0-3.048 2.69l-.014.11H7.562Z"
-    />
-  </svg>
+	<svg xmlns="http://www.w3.org/2000/svg" width={24} height={24} fill="none" {...props}>
+		<path
+			fill="#AFC628"
+			d="M19.35 10.04A7.49 7.49 0 0 0 12 4C9.11 4 6.6 5.64 5.35 8.04A5.994 5.994 0 0 0 0 14c0 3.31 2.69 6 6 6h13c2.76 0 5-2.24 5-5 0-2.64-2.05-4.78-4.65-4.96ZM19 18H6c-2.21 0-4-1.79-4-4 0-2.05 1.53-3.76 3.56-3.97l1.07-.11.5-.95A5.469 5.469 0 0 1 12 6c2.62 0 4.88 1.86 5.39 4.43l.3 1.5 1.53.11A2.98 2.98 0 0 1 22 15c0 1.65-1.35 3-3 3Z"
+		/>
+		<path
+			fill="#AFC628"
+			stroke="#AFC628"
+			strokeWidth={0.25}
+			d="M15.784 12.895a4.125 4.125 0 0 1-4.104 3.713 4.092 4.092 0 0 1-2.92-1.228l-.791.791-.214.213v-2.826h2.827l-.214.213-.864.865a3.046 3.046 0 0 0 2.176.922 3.078 3.078 0 0 0 3.048-2.69l.014-.11h1.056l-.014.137Zm-8.222-.688.014-.137a4.124 4.124 0 0 1 4.104-3.712c1.145 0 2.177.472 2.921 1.226l.79-.79.214-.213v2.826h-2.827l.214-.213.865-.866a3.05 3.05 0 0 0-2.177-.92 3.077 3.077 0 0 0-3.048 2.69l-.014.11H7.562Z"
+		/>
+	</svg>
 );
 export default SvgRepublish;

package/src/components/Icon/components/Sync.jsx

@@ -1,16 +1,10 @@
 import * as React from "react";
 const SvgSync = (props) => (
-  <svg
-    xmlns="http://www.w3.org/2000/svg"
-    width={24}
-    height={24}
-    fill="none"
-    {...props}
-  >
-    <path
-      fill="#5057FF"
-      d="M4 12H1l4 4 4-4H6c0-3.31 2.69-6 6-6 1.01 0 1.97.25 2.8.7l1.46-1.46A7.93 7.93 0 0 0 12 4c-4.42 0-8 3.58-8 8Zm14 0c0 3.31-2.69 6-6 6a5.87 5.87 0 0 1-2.8-.7l-1.46 1.46A7.93 7.93 0 0 0 12 20c4.42 0 8-3.58 8-8h3l-4-4-4 4h3Z"
-    />
-  </svg>
+	<svg xmlns="http://www.w3.org/2000/svg" width={24} height={24} fill="none" {...props}>
+		<path
+			fill="#5057FF"
+			d="M4 12H1l4 4 4-4H6c0-3.31 2.69-6 6-6 1.01 0 1.97.25 2.8.7l1.46-1.46A7.93 7.93 0 0 0 12 4c-4.42 0-8 3.58-8 8Zm14 0c0 3.31-2.69 6-6 6a5.87 5.87 0 0 1-2.8-.7l-1.46 1.46A7.93 7.93 0 0 0 12 20c4.42 0 8-3.58 8-8h3l-4-4-4 4h3Z"
+		/>
+	</svg>
 );
 export default SvgSync;

package/src/components/KeywordsPreviewModal/index.tsx

@@ -54,7 +54,13 @@ const KeywordsPreviewModal = (props: IKeywordsPreviewProps) => {
 
 	return (
 		<S.Wrapper>
-			<FloatingPanel title="Keywords" toggleModal={handleCloseModal} closeOnOutsideClick={false} isOpen={isOpen} width={358}>
+			<FloatingPanel
+				title="Keywords"
+				toggleModal={handleCloseModal}
+				closeOnOutsideClick={false}
+				isOpen={isOpen}
+				width={358}
+			>
 				{isOpen && (
 					<S.KeywordsWrapper>
 						{keywordsFilter.length > 0 && (

package/src/components/Lists/index.tsx

@@ -1,4 +1,4 @@
-import React from "react";
+import type React from "react";
 import { Icon } from "@ax/components";
 import { ListTitle } from "./style";
 import * as S from "./style";

package/src/components/Nav/index.tsx

@@ -2,7 +2,7 @@ import React from "react";
 import { NavLink } from "react-router-dom";
 
 import { SubNav, MenuItem } from "@ax/components";
-import { INavItem } from "@ax/types";
+import type { INavItem } from "@ax/types";
 import { Restricted } from "@ax/guards";
 
 import * as S from "./style";

package/src/components/TableFilters/CustomizeFilters/index.tsx

@@ -1,6 +1,6 @@
 import React from "react";
 import { CheckGroup, FloatingMenu, Icon, ListTitle } from "@ax/components";
-import { IColumn } from "@ax/types";
+import type { IColumn } from "@ax/types";
 
 import * as S from "./style";
 

package/src/components/TableFilters/DateFilter/index.tsx

@@ -1,7 +1,7 @@
 import React from "react";
 
 import { Icon, FloatingMenu, ListTitle, ListItem } from "@ax/components";
-import { IQueryValue } from "@ax/types";
+import type { IQueryValue } from "@ax/types";
 
 import * as S from "./style";
 

package/src/components/TableFilters/LastAccessFilter/index.tsx

@@ -1,7 +1,7 @@
 import React from "react";
 
 import { Icon, FloatingMenu, ListTitle, ListItem } from "@ax/components";
-import { IQueryValue } from "@ax/types";
+import type { IQueryValue } from "@ax/types";
 
 import * as S from "./style";
 

package/src/components/TableFilters/NameFilter/index.tsx

@@ -1,7 +1,7 @@
 import React from "react";
 
 import { Icon, FloatingMenu, ListTitle, ListItem } from "@ax/components";
-import { IQueryValue } from "@ax/types";
+import type { IQueryValue } from "@ax/types";
 
 import * as S from "./style";
 

package/src/components/TableFilters/PermissionsFilter/index.tsx

@@ -1,7 +1,7 @@
 import React from "react";
 
 import { Icon, FloatingMenu, ListTitle, ListItem } from "@ax/components";
-import { IQueryValue } from "@ax/types";
+import type { IQueryValue } from "@ax/types";
 
 import * as S from "./style";
 

package/src/components/TableFilters/StateFilter/index.tsx

@@ -1,7 +1,7 @@
 import React, { useEffect, useState } from "react";
 
 import { Icon, FloatingMenu, ListTitle, ListItem } from "@ax/components";
-import { IQueryValue } from "@ax/types";
+import type { IQueryValue } from "@ax/types";
 
 import * as S from "./style";
 

package/src/components/TableFilters/StatusFilter/index.tsx

@@ -1,7 +1,7 @@
 import React from "react";
 
 import { Icon, FloatingMenu, ListTitle, ListItem } from "@ax/components";
-import { IQueryValue } from "@ax/types";
+import type { IQueryValue } from "@ax/types";
 
 import * as S from "./style";
 

package/src/components/TableFilters/TypeFilter/index.tsx

@@ -1,7 +1,7 @@
 import React, { useEffect, useState } from "react";
 import { CheckGroup, FloatingMenu, Icon, ListTitle } from "@ax/components";
 import { areEquals } from "@ax/helpers";
-import { IQueryValue } from "@ax/types";
+import type { IQueryValue } from "@ax/types";
 
 import * as S from "./style";
 

package/src/components/TableFilters/UsersFilter/index.tsx

@@ -1,7 +1,7 @@
 import React from "react";
 
 import { Icon, FloatingMenu, ListTitle, ListItem } from "@ax/components";
-import { IQueryValue } from "@ax/types";
+import type { IQueryValue } from "@ax/types";
 
 import * as S from "./style";
 

package/src/components/Tag/index.tsx

@@ -36,7 +36,13 @@ const Tag = (props: ITagProps): JSX.Element => {
 			);
 		case "square":
 			return (
-				<S.TagSquare color={color} textColor={textColor} className={className} data-testid="tag-square" title={text || ""}>
+				<S.TagSquare
+					color={color}
+					textColor={textColor}
+					className={className}
+					data-testid="tag-square"
+					title={text || ""}
+				>
 					{icon && (
 						<S.IconTag>
 							<Icon name={icon} size="16" />
@@ -47,7 +53,14 @@ const Tag = (props: ITagProps): JSX.Element => {
 			);
 		default:
 			return (
-				<S.TagFixed color={color} rounded={rounded} small={small} className={className} data-testid="tag-fixed" title={text || ""}>
+				<S.TagFixed
+					color={color}
+					rounded={rounded}
+					small={small}
+					className={className}
+					data-testid="tag-fixed"
+					title={text || ""}
+				>
 					<S.TagText>
 						<S.Title data-testid="tag-fixed-title">{displayText}</S.Title>
 						{deleteIcon}