[kibanaUtils] Don't import full semver client side

.eslintrc.js

@@ -156,6 +156,78 @@ const DEV_PATTERNS = [
   'x-pack/plugins/*/server/scripts/**/*',
 ];
 
+/** Restricted imports with suggested alternatives */
+const RESTRICTED_IMPORTS = [
+  {
+    name: 'lodash',
+    importNames: ['set', 'setWith'],
+    message: 'Please use @elastic/safer-lodash-set instead',
+  },
+  {
+    name: 'lodash.set',
+    message: 'Please use @elastic/safer-lodash-set instead',
+  },
+  {
+    name: 'lodash.setwith',
+    message: 'Please use @elastic/safer-lodash-set instead',
+  },
+  {
+    name: 'lodash/set',
+    message: 'Please use @elastic/safer-lodash-set instead',
+  },
+  {
+    name: 'lodash/setWith',
+    message: 'Please use @elastic/safer-lodash-set instead',
+  },
+  {
+    name: 'lodash/fp',
+    importNames: ['set', 'setWith', 'assoc', 'assocPath'],
+    message: 'Please use @elastic/safer-lodash-set instead',
+  },
+  {
+    name: 'lodash/fp/set',
+    message: 'Please use @elastic/safer-lodash-set instead',
+  },
+  {
+    name: 'lodash/fp/setWith',
+    message: 'Please use @elastic/safer-lodash-set instead',
+  },
+  {
+    name: 'lodash/fp/assoc',
+    message: 'Please use @elastic/safer-lodash-set instead',
+  },
+  {
+    name: 'lodash/fp/assocPath',
+    message: 'Please use @elastic/safer-lodash-set instead',
+  },
+  {
+    name: 'lodash',
+    importNames: ['template'],
+    message: 'lodash.template is unsafe, and not compatible with our content security policy.',
+  },
+  {
+    name: 'lodash.template',
+    message: 'lodash.template is unsafe, and not compatible with our content security policy.',
+  },
+  {
+    name: 'lodash/template',
+    message: 'lodash.template is unsafe, and not compatible with our content security policy.',
+  },
+  {
+    name: 'lodash/fp',
+    importNames: ['template'],
+    message: 'lodash.template is unsafe, and not compatible with our content security policy.',
+  },
+  {
+    name: 'lodash/fp/template',
+    message: 'lodash.template is unsafe, and not compatible with our content security policy.',
+  },
+  {
+    name: 'react-use',
+    message: 'Please use react-use/lib/{method} instead.',
+  },
+];
+
 module.exports = {
   root: true,
 
@@ -667,81 +739,7 @@ module.exports = {
         'no-restricted-imports': [
           2,
           {
-            paths: [
-              {
-                name: 'lodash',
-                importNames: ['set', 'setWith'],
-                message: 'Please use @elastic/safer-lodash-set instead',
-              },
-              {
-                name: 'lodash.set',
-                message: 'Please use @elastic/safer-lodash-set instead',
-              },
-              {
-                name: 'lodash.setwith',
-                message: 'Please use @elastic/safer-lodash-set instead',
-              },
-              {
-                name: 'lodash/set',
-                message: 'Please use @elastic/safer-lodash-set instead',
-              },
-              {
-                name: 'lodash/setWith',
-                message: 'Please use @elastic/safer-lodash-set instead',
-              },
-              {
-                name: 'lodash/fp',
-                importNames: ['set', 'setWith', 'assoc', 'assocPath'],
-                message: 'Please use @elastic/safer-lodash-set instead',
-              },
-              {
-                name: 'lodash/fp/set',
-                message: 'Please use @elastic/safer-lodash-set instead',
-              },
-              {
-                name: 'lodash/fp/setWith',
-                message: 'Please use @elastic/safer-lodash-set instead',
-              },
-              {
-                name: 'lodash/fp/assoc',
-                message: 'Please use @elastic/safer-lodash-set instead',
-              },
-              {
-                name: 'lodash/fp/assocPath',
-                message: 'Please use @elastic/safer-lodash-set instead',
-              },
-              {
-                name: 'lodash',
-                importNames: ['template'],
-                message:
-                  'lodash.template is unsafe, and not compatible with our content security policy.',
-              },
-              {
-                name: 'lodash.template',
-                message:
-                  'lodash.template is unsafe, and not compatible with our content security policy.',
-              },
-              {
-                name: 'lodash/template',
-                message:
-                  'lodash.template is unsafe, and not compatible with our content security policy.',
-              },
-              {
-                name: 'lodash/fp',
-                importNames: ['template'],
-                message:
-                  'lodash.template is unsafe, and not compatible with our content security policy.',
-              },
-              {
-                name: 'lodash/fp/template',
-                message:
-                  'lodash.template is unsafe, and not compatible with our content security policy.',
-              },
-              {
-                name: 'react-use',
-                message: 'Please use react-use/lib/{method} instead.',
-              },
-            ],
+            paths: RESTRICTED_IMPORTS,
           },
         ],
         'no-restricted-modules': [
@@ -834,6 +832,23 @@ module.exports = {
         ],
       },
     },
+    {
+      files: ['**/common/**/*.{js,mjs,ts,tsx}', '**/public/**/*.{js,mjs,ts,tsx}'],
+      rules: {
+        'no-restricted-imports': [
+          2,
+          {
+            paths: [
+              ...RESTRICTED_IMPORTS,
+              {
+                name: 'semver',
+                message: 'Please use "semver/*/{function}" instead',
+              },
+            ],
+          },
+        ],
+      },
+    },
 
     /**
      * APM and Observability overrides

packages/kbn-optimizer/limits.yml

@@ -8,7 +8,7 @@ pageLoadAssetSize:
   console: 46091
   core: 435325
   crossClusterReplication: 65408
-  dashboard: 374194
+  dashboard: 186763
   dashboardEnhanced: 65646
   devTools: 38637
   discover: 99999
@@ -99,7 +99,7 @@ pageLoadAssetSize:
   expressionMetricVis: 23121
   visTypeMetric: 23332
   bfetch: 22837
-  kibanaUtils: 97808
+  kibanaUtils: 79713
   data: 491273
   dataViews: 41532
   expressions: 140958

src/plugins/dashboard/common/saved_dashboard_references.ts

@@ -5,7 +5,7 @@
  * in compliance with, at your election, the Elastic License 2.0 or the Server
  * Side Public License, v 1.
  */
-import Semver from 'semver';
+import semverGt from 'semver/functions/gt';
 import { SavedObjectAttributes, SavedObjectReference } from '../../../core/types';
 import { DashboardContainerStateWithType, DashboardPanelState } from './types';
 import { EmbeddablePersistableStateService } from '../../embeddable/common/types';
@@ -23,7 +23,7 @@ export interface SavedObjectAttributesAndReferences {
 }
 
 const isPre730Panel = (panel: Record<string, string>): boolean => {
-  return 'version' in panel ? Semver.gt('7.3.0', panel.version) : true;
+  return 'version' in panel ? semverGt('7.3.0', panel.version) : true;
 };
 
 function dashboardAttributesToState(attributes: SavedObjectAttributes): {

src/plugins/kibana_utils/common/persistable_state/migrate_to_latest.ts

@@ -6,7 +6,7 @@
  * Side Public License, v 1.
  */
 
-import { compare } from 'semver';
+import compare from 'semver/functions/compare';
 import { SerializableRecord } from '@kbn/utility-types';
 import { VersionedState, MigrateFunctionsObject } from './types';
 

x-pack/plugins/fleet/public/components/agent_enrollment_flyout/steps.tsx

@@ -9,7 +9,9 @@ import React, { useCallback, useMemo } from 'react';
 import { EuiText, EuiButton, EuiSpacer } from '@elastic/eui';
 import { FormattedMessage } from '@kbn/i18n/react';
 import { i18n } from '@kbn/i18n';
-import semver from 'semver';
+import semverMajor from 'semver/functions/major';
+import semverMinor from 'semver/functions/minor';
+import semverPatch from 'semver/functions/patch';
 
 import type { AgentPolicy } from '../../types';
 import { useKibanaVersion } from '../../hooks';
@@ -21,9 +23,7 @@ export const DownloadStep = () => {
   const kibanaVersion = useKibanaVersion();
   const kibanaVersionURLString = useMemo(
     () =>
-      `${semver.major(kibanaVersion)}-${semver.minor(kibanaVersion)}-${semver.patch(
-        kibanaVersion
-      )}`,
+      `${semverMajor(kibanaVersion)}-${semverMinor(kibanaVersion)}-${semverPatch(kibanaVersion)}`,
     [kibanaVersion]
   );
   return {

x-pack/plugins/index_management/__jest__/client_integration/helpers/setup_environment.tsx

@@ -9,7 +9,7 @@ import React from 'react';
 import axios from 'axios';
 import axiosXhrAdapter from 'axios/lib/adapters/xhr';
 import { merge } from 'lodash';
-import { SemVer } from 'semver';
+import SemVer from 'semver/classes/semver';
 
 import {
   notificationServiceMock,

x-pack/plugins/index_management/public/application/app_context.tsx

@@ -7,7 +7,7 @@
 
 import React, { createContext, useContext } from 'react';
 import { ScopedHistory } from 'kibana/public';
-import { SemVer } from 'semver';
+import SemVer from 'semver/classes/semver';
 import { ManagementAppMountParams } from 'src/plugins/management/public';
 import { UsageCollectionSetup } from 'src/plugins/usage_collection/public';
 

x-pack/plugins/index_management/public/application/components/mappings_editor/__jest__/client_integration/helpers/setup_environment.tsx

@@ -6,7 +6,7 @@
  */
 
 import React from 'react';
-import { SemVer } from 'semver';
+import SemVer from 'semver/classes/semver';
 
 /* eslint-disable-next-line @kbn/eslint/no-restricted-paths */
 import '../../../../../../../../../../src/plugins/es_ui_shared/public/components/code_editor/jest_mock';

x-pack/plugins/index_management/public/application/components/mappings_editor/components/document_fields/fields/edit_field/edit_field.tsx

@@ -19,7 +19,7 @@ import {
   EuiSpacer,
   EuiCallOut,
 } from '@elastic/eui';
-import { SemVer } from 'semver';
+import SemVer from 'semver/classes/semver';
 
 import { documentationService } from '../../../../../../services/documentation';
 import { Form, FormHook, FormDataProvider } from '../../../../shared_imports';

x-pack/plugins/index_management/public/application/components/mappings_editor/components/document_fields/fields/field_types/boolean_type.tsx

@@ -6,7 +6,7 @@
  */
 
 import React from 'react';
-import { SemVer } from 'semver';
+import SemVer from 'semver/classes/semver';
 
 import { i18n } from '@kbn/i18n';
 

x-pack/plugins/index_management/public/application/components/mappings_editor/components/document_fields/fields/field_types/date_type.tsx

@@ -6,7 +6,7 @@
  */
 
 import React from 'react';
-import { SemVer } from 'semver';
+import SemVer from 'semver/classes/semver';
 import { i18n } from '@kbn/i18n';
 
 import { NormalizedField, Field as FieldType } from '../../../../types';

x-pack/plugins/index_management/public/application/components/mappings_editor/components/document_fields/fields/field_types/flattened_type.tsx

@@ -7,7 +7,7 @@
 
 import React from 'react';
 import { i18n } from '@kbn/i18n';
-import { SemVer } from 'semver';
+import SemVer from 'semver/classes/semver';
 
 import { NormalizedField, Field as FieldType } from '../../../../types';
 import { UseField, Field } from '../../../../shared_imports';

x-pack/plugins/index_management/public/application/components/mappings_editor/components/document_fields/fields/field_types/index.ts

@@ -6,7 +6,7 @@
  */
 
 import { ComponentType } from 'react';
-import { SemVer } from 'semver';
+import SemVer from 'semver/classes/semver';
 
 import { MainType, SubType, DataType, NormalizedField, NormalizedFields } from '../../../../types';
 

x-pack/plugins/index_management/public/application/components/mappings_editor/components/document_fields/fields/field_types/ip_type.tsx

@@ -6,7 +6,7 @@
  */
 
 import React from 'react';
-import { SemVer } from 'semver';
+import SemVer from 'semver/classes/semver';
 
 import { NormalizedField, Field as FieldType } from '../../../../types';
 import { getFieldConfig } from '../../../../lib';

x-pack/plugins/index_management/public/application/components/mappings_editor/components/document_fields/fields/field_types/keyword_type.tsx

@@ -6,7 +6,7 @@
  */
 
 import React from 'react';
-import { SemVer } from 'semver';
+import SemVer from 'semver/classes/semver';
 import { i18n } from '@kbn/i18n';
 
 import { documentationService } from '../../../../../../services/documentation';

x-pack/plugins/index_management/public/application/components/mappings_editor/components/document_fields/fields/field_types/numeric_type.tsx

@@ -7,7 +7,7 @@
 
 import React from 'react';
 import { i18n } from '@kbn/i18n';
-import { SemVer } from 'semver';
+import SemVer from 'semver/classes/semver';
 
 import { NormalizedField, Field as FieldType, ComboBoxOption } from '../../../../types';
 import { getFieldConfig } from '../../../../lib';

x-pack/plugins/index_management/public/application/components/mappings_editor/components/document_fields/fields/field_types/range_type.tsx

@@ -6,7 +6,7 @@
  */
 
 import React from 'react';
-import { SemVer } from 'semver';
+import SemVer from 'semver/classes/semver';
 
 import {
   NormalizedField,

x-pack/plugins/index_management/public/application/components/mappings_editor/components/document_fields/fields/field_types/text_type.tsx

@@ -8,7 +8,7 @@
 import React from 'react';
 import { EuiSpacer, EuiDualRange, EuiFormRow, EuiCallOut } from '@elastic/eui';
 import { i18n } from '@kbn/i18n';
-import { SemVer } from 'semver';
+import SemVer from 'semver/classes/semver';
 
 import { documentationService } from '../../../../../../services/documentation';
 import { NormalizedField, Field as FieldType } from '../../../../types';

x-pack/plugins/index_management/public/application/components/mappings_editor/components/document_fields/fields/field_types/token_count_type.tsx

@@ -6,7 +6,7 @@
  */
 
 import React from 'react';
-import { SemVer } from 'semver';
+import SemVer from 'semver/classes/semver';
 import { i18n } from '@kbn/i18n';
 
 import { documentationService } from '../../../../../../services/documentation';

x-pack/plugins/index_management/public/application/index.tsx

@@ -8,7 +8,7 @@
 import React from 'react';
 import { Provider } from 'react-redux';
 import { render, unmountComponentAtNode } from 'react-dom';
-import { SemVer } from 'semver';
+import SemVer from 'semver/classes/semver';
 
 import { CoreStart, CoreSetup } from '../../../../../src/core/public';
 

x-pack/plugins/index_management/public/application/lib/indices.ts

@@ -4,7 +4,7 @@
  * 2.0; you may not use this file except in compliance with the Elastic License
  * 2.0.
  */
-import { SemVer } from 'semver';
+import SemVer from 'semver/classes/semver';
 
 import { MAJOR_VERSION } from '../../../common';
 import { Index } from '../../../common';