refactor: linting and package update fixes

e2e/tests/plugin-form-Nested.spec.ts

@@ -1,4 +1,4 @@
-import { Page, expect, test } from '@playwright/test'
+import { type Page, expect, test } from '@playwright/test'
 
 test.describe.configure({ mode: 'serial' })
 

e2e/tests/plugin-view_selector-car_garage.spec.ts

@@ -69,9 +69,11 @@ test('View selector - car garage', async ({ page }) => {
       page.getByRole('tab', { name: 'car Dimensions' })
     ).toBeVisible()
 
-    await page.getByTestId('form-text-widget-Next control date').last()
+    await page
+      .getByTestId('form-text-widget-Next control date')
+      .last()
 
-    .fill('2025-06-31')
+      .fill('2025-06-31')
     await page.getByRole('button', { name: 'Submit' }).click()
     await expect(page.getByRole('alert')).toHaveText(['Document updated'])
     await page

e2e/tsconfig.json

@@ -1,9 +1,5 @@
 {
   "extends": "../tsconfig.json",
-  "include": [
-    "tests"
-  ],
-  "exclude": [
-    "node_modules"
-  ]
+  "include": ["tests"],
+  "exclude": ["node_modules"]
 }

example/src/App.tsx

@@ -3,13 +3,13 @@ import {
   DMApplicationProvider,
   DmssAPI,
   EntityView,
-  ErrorResponse,
-  TApplication,
+  type ErrorResponse,
+  type TApplication,
 } from '@development-framework/dm-core'
 import { Button, Card, Icon, Typography } from '@equinor/eds-core-react'
 import { refresh } from '@equinor/eds-icons'
 
-import { AxiosError } from 'axios'
+import type { AxiosError } from 'axios'
 import { useContext, useEffect, useState } from 'react'
 import { RouterProvider, createBrowserRouter } from 'react-router-dom'
 import ViewPage from './ViewPage'

example/src/ViewPage.tsx

@@ -2,7 +2,7 @@ import {
   EntityView,
   ErrorGroup,
   Loading,
-  TValidEntity,
+  type TValidEntity,
   useDocument,
 } from '@development-framework/dm-core'
 import { Typography } from '@equinor/eds-core-react'

example/src/plugins/marmo-ui/containers/views/SignalPlot.tsx

@@ -1,7 +1,7 @@
 import {
-  IUIPlugin,
+  type IUIPlugin,
   Loading,
-  TGenericObject,
+  type TGenericObject,
   useDocument,
 } from '@development-framework/dm-core'
 // @ts-ignore

example/src/plugins/marmo-ui/containers/views/SignalTable/SignalTable.tsx

@@ -9,9 +9,9 @@ import { chevron_left, chevron_right } from '@equinor/eds-icons'
 import { useState } from 'react'
 
 import {
-  IUIPlugin,
+  type IUIPlugin,
   Loading,
-  TGenericObject,
+  type TGenericObject,
   useDocument,
 } from '@development-framework/dm-core'
 import { PaginationWrapper, SectionWrapper } from './styles'
@@ -86,6 +86,7 @@ const SignalTable = (props: { document: TGenericObject }) => {
           {rows
             .slice(page * rowsPerPage, page * rowsPerPage + rowsPerPage)
             .map((row: any) => (
+              // biome-ignore lint/a11y/useSemanticElements: <explanation>
               <Table.Row role='checkbox' tabIndex={-1} key={row.index}>
                 {columns.map((column) => {
                   const value = row[column.id]

example/src/plugins/marmo-ui/index.tsx

@@ -1,14 +1,14 @@
-import { TUiPluginMap } from '@development-framework/dm-core'
+import type { TUiPluginMap } from '@development-framework/dm-core'
 
 //views
 import { SignalPlot } from './containers/views/SignalPlot'
 import { SignalTable } from './containers/views/SignalTable/SignalTable'
 
-export default ({
+export default {
   'marmo-ess-plot-view': {
     component: SignalPlot,
   },
   'marmo-ess-table-view': {
     component: SignalTable,
   },
-} as TUiPluginMap)
+} as TUiPluginMap

example/tsconfig.json

@@ -3,20 +3,14 @@
     "baseUrl": "./src",
     "incremental": true,
     "paths": {
-      "@development-framework/dm-core/*": [
-        "../packages/dm-core/src/*"
-      ],
+      "@development-framework/dm-core/*": ["../packages/dm-core/src/*"],
       "@development-framework/dm-core-plugins/*": [
         "../packages/dm-core-plugins/src/*"
       ]
     },
     "target": "ESNext",
     "useDefineForClassFields": true,
-    "lib": [
-      "ES2020",
-      "DOM",
-      "DOM.Iterable"
-    ],
+    "lib": ["ES2020", "DOM", "DOM.Iterable"],
     "allowJs": true,
     "skipLibCheck": true,
     "esModuleInterop": false,
@@ -30,17 +24,8 @@
     "isolatedModules": true,
     "noEmit": true,
     "jsx": "react-jsx",
-    "types": [
-      "vite/client",
-      "vite-plugin-svgr/client",
-      "node"
-    ]
+    "types": ["vite/client", "vite-plugin-svgr/client", "node"]
   },
-  "include": [
-    "src"
-  ],
-  "exclude": [
-    "node_modules",
-    "tsconfig.tsbuildinfo"
-  ]
+  "include": ["src"],
+  "exclude": ["node_modules", "tsconfig.tsbuildinfo"]
 }

packages/dm-core-plugins/package.json

@@ -4,56 +4,53 @@
   "version": "1.57.0",
   "main": "dist/index.js",
   "dependencies": {
-    "@dnd-kit/core": "^6.0.8",
-    "@dnd-kit/modifiers": "^6.0.1",
-    "@dnd-kit/sortable": "^7.0.2",
+    "@dnd-kit/core": "^6.3.1",
+    "@dnd-kit/modifiers": "^9.0.0",
+    "@dnd-kit/sortable": "^10.0.0",
     "@development-framework/dm-core": "^1.46.0",
-    "@equinor/eds-core-react": ">0.33.0",
-    "@equinor/eds-icons": ">0.19.3",
-    "@equinor/eds-tokens": ">0.9.0",
-    "axios": "^1.4.0",
-    "dompurify": "^3.0.6",
-    "highlight.js": "^11.8.0",
+    "@equinor/eds-core-react": "^0.42.5",
+    "@equinor/eds-icons": "^0.21.0",
+    "@equinor/eds-tokens": "^0.9.2",
+    "axios": "^1.7.9",
+    "dompurify": "^3.2.3",
+    "highlight.js": "^11.10.0",
     "lodash": "^4.17.21",
-    "luxon": "^3.4.3",
-    "mermaid": "^10.0.0",
-    "react-hook-form": "^7.48.2",
-    "react-toastify": "^9.1.3",
-    "ts-node": "^10.9.1",
-    "yaml": "^2.3.2"
+    "luxon": "^3.5.0",
+    "mermaid": "^11.4.1",
+    "react-hook-form": "^7.54.0",
+    "react-toastify": "^10.0.6",
+    "ts-node": "^10.9.2",
+    "yaml": "^2.6.1"
   },
   "devDependencies": {
-    "@biomejs/biome": "1.4.1",
-    "@testing-library/dom": "^9.2.0",
-    "@testing-library/react": "^14.0.0",
-    "@testing-library/user-event": "14.4.3",
-    "@types/dompurify": "^3.0.4",
-    "@types/jest": "^29.5.0",
-    "@types/js-yaml": "^4.0.5",
-    "@types/lodash": "^4.14.202",
-    "@types/luxon": "^3.3.3",
-    "@types/node": "^20.10.0",
-    "@types/react-dom": "^18.2.7",
+    "@biomejs/biome": "1.9.4",
+    "@testing-library/dom": "^10.4.0",
+    "@testing-library/react": "^16.1.0",
+    "@testing-library/user-event": "14.5.2",
+    "@types/dompurify": "^3.2.0",
+    "@types/jest": "^29.5.14",
+    "@types/js-yaml": "^4.0.9",
+    "@types/lodash": "^4.17.13",
+    "@types/luxon": "^3.4.2",
+    "@types/node": "^22.10.2",
+    "@types/react-dom": "^19.0.2",
     "@types/react-router-dom": "^5.3.3",
-    "@types/styled-components": "^5.1.26",
-    "jest": "^29.5.0",
-    "jest-environment-jsdom": "^29.5.0",
-    "react-router-dom": ">=5.1.2",
-    "shx": " 0.3.4",
-    "ts-jest": "^29.1.0",
-    "ts-loader": "^9.3.1",
-    "typescript": "^5.1.6"
+    "@types/styled-components": "^5.1.34",
+    "jest": "^29.7.0",
+    "jest-environment-jsdom": "^29.7.0",
+    "react-router-dom": "^7.0.2",
+    "shx": "0.3.4",
+    "ts-jest": "^29.2.5",
+    "ts-loader": "^9.5.1",
+    "typescript": "^5.7.2"
   },
   "peerDependencies": {
-    "@types/react": "^18.2.8",
+    "@types/react": "^18.2.20",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
-    "styled-components": ">=5.1.0"
+    "styled-components": "^6.1.13"
   },
-  "files": [
-    "blueprints",
-    "dist"
-  ],
+  "files": ["blueprints", "dist"],
   "types": "dist/index.d.ts",
   "scripts": {
     "prebuild": "shx rm -rf dist",

packages/dm-core-plugins/src/blueprint-hierarchy/BlueprintHierarchyPlugin.tsx

@@ -1,15 +1,15 @@
 import { useEffect, useState } from 'react'
 
 import {
-  DmssAPI,
-  IUIPlugin,
+  type DmssAPI,
+  type IUIPlugin,
   Loading,
   useApplication,
   useDocument,
 } from '@development-framework/dm-core'
 import MermaidWrapper from './MermaidWrapper'
-import { Node, dfs, loader } from './loader'
-import { TAttributeType } from './types'
+import { type Node, dfs, loader } from './loader'
+import type { TAttributeType } from './types'
 
 const classElement = (node: Node) => {
   const primitiveAttributeElements = node

packages/dm-core-plugins/src/blueprint-hierarchy/loader.tsx

@@ -1,4 +1,4 @@
-import { IBlueprintType, TAttributeType } from './types'
+import type { IBlueprintType, TAttributeType } from './types'
 
 export class Node {
   public attribute: TAttributeType

packages/dm-core-plugins/src/blueprint/BlueprintAttribute.tsx

@@ -3,11 +3,11 @@ import {
   EPrimitiveTypes,
   INPUT_FIELD_WIDTH,
   Select,
-  TGenericObject,
+  type TGenericObject,
   truncatePathString,
 } from '@development-framework/dm-core'
 import { Input, Label, Radio, Switch, TextField } from '@equinor/eds-core-react'
-import { ChangeEvent } from 'react'
+import type { ChangeEvent } from 'react'
 import { Stack } from '../common'
 
 type TAttribute = {

packages/dm-core-plugins/src/blueprint/BlueprintPlugin.tsx

@@ -1,14 +1,14 @@
 import {
   INPUT_FIELD_WIDTH,
-  IUIPlugin,
+  type IUIPlugin,
   Loading,
-  TBlueprint,
+  type TBlueprint,
   useDocument,
 } from '@development-framework/dm-core'
 import { Button, Icon, TextField, Typography } from '@equinor/eds-core-react'
 import { save, undo } from '@equinor/eds-icons'
 import { isEqual } from 'lodash'
-import { ChangeEvent, useEffect, useMemo, useState } from 'react'
+import { type ChangeEvent, useEffect, useMemo, useState } from 'react'
 import styled from 'styled-components'
 import { Stack } from '../common'
 import { BlueprintAttributeList } from './BlueprintAttributeList'

packages/dm-core-plugins/src/common/AddRowButton/AddRowButton.tsx

@@ -1,7 +1,6 @@
 import { Icon } from '@equinor/eds-core-react'
 import { add } from '@equinor/eds-icons'
 import { tokens } from '@equinor/eds-tokens'
-import React from 'react'
 import styled from 'styled-components'
 
 const StyledButton = styled.button`

packages/dm-core-plugins/src/common/CollapseExpandButton/CollapseExpandButton.tsx

@@ -1,14 +1,14 @@
 import {
   Button,
-  ButtonProps,
+  type ButtonProps,
   EdsProvider,
   Icon,
   Tooltip,
 } from '@equinor/eds-core-react'
 import { chevron_right } from '@equinor/eds-icons'
 import styled from 'styled-components'
 
-const StyledButton = styled(Button)<{ expanded: boolean }>`
+const StyledButton = styled(Button)<{ $expanded: boolean }>`
     span {
         transition: transform ease-in-out 0.2s;
         transform: ${(props) => (props.expanded ? 'rotate(90deg)' : 'none')};
@@ -30,7 +30,7 @@ export function CollapseExpandButton(props: CollapseExpandButtonProps) {
           aria-expanded={isExpanded}
           aria-controls={props.controls}
           aria-label={isExpanded ? 'Collapse item' : 'Expand item'}
-          expanded={isExpanded}
+          $expanded={isExpanded}
           variant='ghost_icon'
           color={color}
           onClick={setIsExpanded}

packages/dm-core-plugins/src/common/Datepicker/Calendar.tsx

@@ -13,11 +13,11 @@ import {
   chevron_up,
 } from '@equinor/eds-icons'
 import { DateTime } from 'luxon'
-import { ReactElement, useEffect, useState } from 'react'
+import { type ReactElement, useEffect, useState } from 'react'
 import { Stack } from '../Stack/Stack'
 import {
   CALENDAR_MONTHS,
-  DateSelection,
+  type DateSelection,
   THIS_MONTH,
   THIS_YEAR,
   calendar,
@@ -136,6 +136,7 @@ export const Calendar = (props: CalendarProps): ReactElement => {
                 <StyledOptionButton
                   key={month}
                   variant='ghost'
+                  // biome-ignore lint/a11y/useSemanticElements:
                   role='radio'
                   aria-checked={index + 1 === activeMonth}
                   selected={index + 1 === activeMonth}

packages/dm-core-plugins/src/common/Datepicker/Datepicker.tsx

@@ -8,12 +8,12 @@ import {
 } from '@equinor/eds-core-react'
 import { calendar } from '@equinor/eds-icons'
 import { DateTime } from 'luxon'
-import { ReactElement, useEffect, useRef, useState } from 'react'
+import { type ReactElement, useEffect, useRef, useState } from 'react'
 import { createPortal } from 'react-dom'
 import { Stack } from '../Stack/Stack'
 import { Calendar } from './Calendar'
 import { Timefield } from './Timefield'
-import { DateSelection, zeroPad } from './calendarUtils'
+import { type DateSelection, zeroPad } from './calendarUtils'
 import { extractDateComponents, formatTime } from './datepickerUtils'
 
 interface DatepickerProps {

packages/dm-core-plugins/src/common/Datepicker/Timefield.tsx

@@ -1,5 +1,5 @@
 import { TextField, Typography } from '@equinor/eds-core-react'
-import { ReactElement } from 'react'
+import type { ReactElement } from 'react'
 
 interface TimefieldProps {
   useMinutes?: boolean

packages/dm-core-plugins/src/common/DeleteSoftButton.tsx

@@ -1,6 +1,6 @@
 import { Button, EdsProvider, Icon } from '@equinor/eds-core-react'
 import { close } from '@equinor/eds-icons'
-import { MouseEventHandler } from 'react'
+import type { MouseEventHandler } from 'react'
 
 interface DeleteSoftButtonProps {
   onClick: MouseEventHandler

packages/dm-core-plugins/src/common/LazyLoad/LazyLoad.tsx

@@ -1,4 +1,4 @@
-import React, { ComponentType, PropsWithChildren, useRef } from 'react'
+import { type ComponentType, type PropsWithChildren, useRef } from 'react'
 
 type LazyProps = {
   visible: boolean