@gridsuite/commons-ui 0.134.0 → 0.135.0

package/README.md

@@ -7,6 +7,16 @@ Library for sharing GridSuite apps commons components
 The commons-ui library have a demo app in which you can call your components to test them.
 The `npm start` command install the library's dependencies then launches the demo app.
 
+##### Development Scripts
+
+- **`npm run type-check`** - Runs TypeScript type checking without emitting files. This ensures all developers use the project's local TypeScript version from `node_modules` rather than a potentially different globally-installed version. Run this to verify your code has no type errors before committing.
+
+- **`npm run build`** - Builds the library. Note: This automatically runs `npm run prebuild` first.
+
+- **`npm run prebuild`** - Runs linting and type checking before the build. This script is executed automatically by npm before `npm run build` and ensures that the build is not executed if linting or type checking fails. You don't need to call this manually unless you want to verify code quality without building.
+
+##### Local Testing
+
 If you want to test your library integration with a consumer application my-app you have first
 to build commons-ui via
 

package/dist/components/parameters/common/widget/parameter-line-slider.js

@@ -1,4 +1,4 @@
-import { jsxs, Fragment, jsx } from "react/jsx-runtime";
+import { jsxs, jsx } from "react/jsx-runtime";
 import { Grid } from "@mui/material";
 import { FormattedMessage } from "react-intl";
 import { parametersStyles } from "../../parameters-style.js";
@@ -35,7 +35,8 @@ function sanitizePercentageValue(value) {
 const styles = {
   container: {
     ...parametersStyles.controlItem,
-    paddingRight: 2
+    paddingTop: 3,
+    paddingRight: 3
   }
 };
 function ParameterLineSlider({
@@ -46,9 +47,9 @@ function ParameterLineSlider({
   minValue = 0,
   maxValue = 100
 }) {
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
+  return /* @__PURE__ */ jsxs(Grid, { container: true, sx: styles.container, children: [
     /* @__PURE__ */ jsx(Grid, { item: true, xs: 8, sx: parametersStyles.parameterName, children: /* @__PURE__ */ jsx(FormattedMessage, { id: label }) }),
-    /* @__PURE__ */ jsx(Grid, { item: true, container: true, xs: 4, sx: styles.container, children: /* @__PURE__ */ jsx(
+    /* @__PURE__ */ jsx(Grid, { item: true, xs: 4, children: /* @__PURE__ */ jsx(
       SliderInput,
       {
         name,

package/dist/components/parameters/loadflow/load-flow-parameters-utils.js

@@ -124,6 +124,7 @@ const setLimitReductions = (provider, defaultLimitReductions, formMethods) => {
   } else {
     formMethods.setValue(PARAM_LIMIT_REDUCTION, DEFAULT_LIMIT_REDUCTION_VALUE);
     formMethods.setValue(LIMIT_REDUCTIONS_FORM, []);
+    formMethods.clearErrors(LIMIT_REDUCTIONS_FORM);
   }
 };
 const mapLimitReductions = (vlLimits, formLimits, indexVl) => {

package/dist/components/parameters/loadflow/use-load-flow-parameters-form.js

@@ -58,6 +58,7 @@ const useLoadFlowParametersForm = (parametersBackend, enableDeveloperMode, param
   ] = parametersBackend;
   const [currentProvider, setCurrentProvider] = useState(params?.provider);
   const [selectedTab, setSelectedTab] = useState(TabValues.GENERAL);
+  const [limitReductionNumber, setLimitReductionNumber] = useState(0);
   const [tabIndexesWithError, setTabIndexesWithError] = useState([]);
   const { snackError } = useSnackMessage();
   const handleTabChange = useCallback((event, newValue) => {
@@ -83,12 +84,10 @@ const useLoadFlowParametersForm = (parametersBackend, enableDeveloperMode, param
       [PROVIDER]: yup.string().required(),
       [PARAM_LIMIT_REDUCTION]: yup.number().nullable(),
       ...getCommonLoadFlowParametersFormSchema().fields,
-      ...getLimitReductionsFormSchema(
-        params?.limitReductions ? params.limitReductions[0]?.temporaryLimitReductions.length : 0
-      ).fields,
+      ...getLimitReductionsFormSchema(limitReductionNumber).fields,
       ...getSpecificLoadFlowParametersFormSchema(specificParameters).fields
     }).concat(getNameElementEditorSchema(name));
-  }, [name, params?.limitReductions, specificParameters]);
+  }, [name, limitReductionNumber, specificParameters]);
   const formMethods = useForm({
     defaultValues: {
       ...getNameElementEditorEmptyFormData(name, description),
@@ -240,12 +239,28 @@ const useLoadFlowParametersForm = (parametersBackend, enableDeveloperMode, param
     reset(toLoadFlowFormValues(params));
   }, [paramsLoaded, params, reset, specificParamsDescriptions, toLoadFlowFormValues]);
   useEffect(() => {
-    if (watchProvider !== currentProvider) {
+    if (watchProvider && watchProvider !== currentProvider) {
       setCurrentProvider(watchProvider);
       setSpecificParameters(watchProvider, specificParamsDescriptions, formMethods);
       setLimitReductions(watchProvider, defaultLimitReductions, formMethods);
+      if (watchProvider === PARAM_PROVIDER_OPENLOADFLOW) {
+        if (currentProvider) {
+          setLimitReductionNumber(defaultLimitReductions?.at(0)?.temporaryLimitReductions?.length ?? 0);
+        } else {
+          setLimitReductionNumber(params?.limitReductions?.at(0)?.temporaryLimitReductions?.length ?? 0);
+        }
+      } else {
+        setLimitReductionNumber(0);
+      }
     }
-  }, [currentProvider, defaultLimitReductions, formMethods, specificParamsDescriptions, watchProvider]);
+  }, [
+    currentProvider,
+    defaultLimitReductions,
+    formMethods,
+    params?.limitReductions,
+    specificParamsDescriptions,
+    watchProvider
+  ]);
   return {
     formMethods,
     formSchema,

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@gridsuite/commons-ui",
-    "version": "0.134.0",
+    "version": "0.135.0",
     "description": "common react components for gridsuite applications",
     "author": "gridsuite team",
     "homepage": "https://github.com/gridsuite",
@@ -23,13 +23,16 @@
     "scripts": {
         "start": "vite demo/ --config vite.config.ts",
         "start:open": "vite demo/ --config vite.config.ts --open",
-        "build": "tsc && vite build",
+        "build": "vite build",
         "build:pack": "tsc && vite build && npm pack",
         "prepublishOnly": "npm run build",
         "test": "jest",
         "test:coverage": "jest --coverage",
         "test:watch": "jest --watch",
-        "lint": "eslint . --ext js,mjs,jsx,ts,mts,tsx --max-warnings 0",
+        "type-check": "tsc",
+        "prebuild": "npm run lint && npm run type-check",
+        "lint": "eslint . --max-warnings 0",
+        "lint:fix": "eslint . --fix",
         "lint:format": "prettier --check --cache .",
         "licenses-check": "license-checker --summary --excludePrivatePackages --production --onlyAllow \"$( jq -r .onlyAllow[] license-checker-config.json | tr '\n' ';')\" --excludePackages \"$( jq -r .excludePackages[] license-checker-config.json | tr '\n' ';')\""
     },
@@ -80,17 +83,19 @@
         "@babel/preset-typescript": "^7.27.1",
         "@emotion/react": "^11.14.0",
         "@emotion/styled": "^11.14.1",
+        "@eslint/compat": "^1.4.1",
+        "@eslint/js": "^9.38.0",
         "@hookform/resolvers": "^4.1.3",
         "@jest/globals": "^30.1.2",
         "@mui/icons-material": "^5.18.0",
         "@mui/lab": "5.0.0-alpha.175",
         "@mui/material": "^5.18.0",
         "@react-hook/window-size": "^3.1.1",
+        "@stylistic/eslint-plugin": "^3.1.0",
         "@testing-library/jest-dom": "^6.8.0",
         "@testing-library/react": "^16.3.0",
         "@testing-library/user-event": "^14.6.1",
         "@types/autosuggest-highlight": "^3.2.3",
-        "@types/eslint": "^8.56.12",
         "@types/eslint-config-prettier": "^6.11.3",
         "@types/jest": "^30.0.0",
         "@types/json-logic-js": "^2.0.8",
@@ -101,25 +106,21 @@
         "@types/react": "^18.3.24",
         "@types/react-dom": "^18.3.7",
         "@types/react-resizable": "^3.0.8",
-        "@typescript-eslint/eslint-plugin": "^7.18.0",
-        "@typescript-eslint/parser": "^7.18.0",
         "@vitejs/plugin-react": "^5.0.4",
         "ag-grid-community": "^33.1.0",
         "ag-grid-react": "^33.3.2",
         "babel-eslint": "^10.1.0",
         "babel-preset-airbnb": "^5.0.0",
         "babel-preset-vite": "^1.1.3",
-        "eslint": "^8.57.1",
-        "eslint-config-airbnb": "^19.0.4",
-        "eslint-config-airbnb-typescript": "^18.0.0",
+        "eslint": "^9.38.0",
+        "eslint-config-airbnb-extended": "^2.3.2",
         "eslint-config-prettier": "^10.1.8",
-        "eslint-config-react-app": "^7.0.1",
-        "eslint-plugin-flowtype": "^8.0.3",
-        "eslint-plugin-import": "^2.32.0",
+        "eslint-import-resolver-typescript": "^4.4.4",
+        "eslint-plugin-import-x": "^4.16.1",
         "eslint-plugin-jsx-a11y": "^6.10.2",
         "eslint-plugin-prettier": "^5.5.4",
         "eslint-plugin-react": "^7.37.5",
-        "eslint-plugin-react-hooks": "^4.6.2",
+        "eslint-plugin-react-hooks": "^7.0.1",
         "glob": "^11.0.3",
         "identity-obj-proxy": "^3.0.0",
         "jest": "^30.1.3",
@@ -136,10 +137,11 @@
         "react-resizable": "^3.0.5",
         "react-router": "^7.8.2",
         "ts-node": "^10.9.2",
-        "typescript": "~5.6.3",
+        "typescript": "~5.9.3",
+        "typescript-eslint": "^8.46.2",
         "vite": "^7.1.12",
+        "vite-plugin-checker": "^0.8.0",
         "vite-plugin-dts": "^4.5.4",
-        "vite-plugin-eslint": "^1.8.1",
         "vite-plugin-lib-inject-css": "^2.2.2",
         "vite-plugin-svgr": "^4.5.0",
         "yup": "^1.7.0"