admin-rte: Enable TypeScript strict mode

.changeset/admin-rte-strict-mode.md

@@ -0,0 +1,9 @@
+---
+"@dextinity/admin-rte": patch
+---
+
+Type `requiredValidator` and `ControlButton`'s `onButtonClick` more precisely
+
+`requiredValidator` is now generic over the field value. `FieldValidator` is invariant in it, so the previous single instantiation could not be passed to a `string`-valued `Field`.
+
+`ControlButton` receives its `onButtonClick` handler with a `MouseEvent<HTMLButtonElement>`, matching the `button` element the handler is attached to.

packages/admin/admin-rte/src/core/Controls/ControlButton.tsx

@@ -72,7 +72,7 @@ export interface IProps
     }> {
     disabled?: boolean;
     selected?: boolean;
-    onButtonClick?: (e: MouseEvent) => void;
+    onButtonClick?: (e: MouseEvent<HTMLButtonElement>) => void;
     icon?: ForwardRefExoticComponent<Omit<SvgIconProps, "ref"> & RefAttributes<SVGSVGElement>>;
 
     /** @deprecated use icon instead */

packages/admin/admin-rte/src/core/Controls/useBlockTypes.tsx

@@ -44,7 +44,7 @@ const createFeaturesFromBlocktypeMap =
             })),
     ];
 
-type BlockChangeEvent = SelectChangeEvent<DraftBlockType>;
+type BlockChangeEvent = SelectChangeEvent<unknown>;
 
 export interface BlockTypesApi {
     dropdownFeatures: IFeatureConfig[];
@@ -87,13 +87,15 @@ export default function useBlockTypes({
         (e: BlockChangeEvent) => {
             e.preventDefault();
 
-            if (!e.target.value) {
+            const blockType = typeof e.target.value === "string" ? e.target.value : undefined;
+
+            if (!blockType) {
                 const currentBlock = getCurrentBlock(editorState);
                 if (currentBlock) {
                     setEditorState(RichUtils.toggleBlockType(editorState, currentBlock.getType()));
                 }
             } else {
-                setEditorState(RichUtils.toggleBlockType(editorState, e.target.value));
+                setEditorState(RichUtils.toggleBlockType(editorState, blockType));
             }
             // keeps editor focused
             setTimeout(() => {

packages/admin/admin-rte/src/core/Controls/useInlineStyleType.tsx

@@ -1,7 +1,7 @@
 import { RteBold, RteItalic, RteStrikethrough, RteSub, RteSup, RteUnderlined } from "@dextinity/admin-icons";
 import * as detectBrowser from "detect-browser";
 import { type Editor, type EditorState, RichUtils } from "draft-js";
-import { type RefObject, useCallback, useMemo } from "react";
+import { type MouseEvent, type RefObject, useCallback, useMemo } from "react";
 import { FormattedMessage } from "react-intl";
 
 import type { SupportedThings } from "../Rte";

packages/admin/admin-rte/src/utils/requiredValidator.tsx

@@ -1,10 +1,11 @@
 import { convertFromRaw, type RawDraftContentState } from "draft-js";
 import type { FieldValidator } from "final-form";
+import type { ReactNode } from "react";
 import { FormattedMessage } from "react-intl";
 
 const requiredMessage = <FormattedMessage id="dextinity.form.required" defaultMessage="Required" />;
 
-export const requiredValidator: FieldValidator<string | RawDraftContentState | undefined> = (value) => {
+export const requiredValidator = <T extends string | RawDraftContentState | undefined>(...[value]: Parameters<FieldValidator<T>>): ReactNode => {
     if (value === undefined) {
         return requiredMessage;
     }

packages/admin/admin-rte/tsconfig.json

@@ -1,7 +1,8 @@
 {
     "compilerOptions": {
         "outDir": "lib",
-        "rootDir": "src"
+        "rootDir": "src",
+        "strict": true
     },
     "extends": "../tsconfig.base.json",
     "include": ["./src"]