chore: remove lodash

packages/react/package.json

@@ -102,8 +102,6 @@
     "focus-visible": "^5.2.1",
     "history": "^5.0.0",
     "hsluv": "1.0.1",
-    "lodash.isempty": "^4.4.0",
-    "lodash.isobject": "^3.0.2",
     "react-compiler-runtime": "^19.1.0-rc.2",
     "react-intersection-observer": "^9.16.0",
     "styled-system": "^5.1.5",
@@ -139,10 +137,6 @@
     "@testing-library/react": "^16.3.0",
     "@testing-library/react-hooks": "^8.0.1",
     "@testing-library/user-event": "^14.5.2",
-    "@types/lodash.groupby": "4.6.9",
-    "@types/lodash.isempty": "4.4.9",
-    "@types/lodash.isobject": "3.0.9",
-    "@types/lodash.keyby": "4.6.9",
     "@types/node": "20.12.11",
     "@types/react": "18.3.11",
     "@types/react-dom": "18.3.1",
@@ -173,8 +167,6 @@
     "front-matter": "4.0.2",
     "gzip-size": "6.0.0",
     "jscodeshift": "0.15.0",
-    "lodash.groupby": "4.6.0",
-    "lodash.keyby": "4.6.0",
     "markdownlint": "^0.38.0",
     "mdast-util-from-markdown": "2.0.1",
     "mdast-util-frontmatter": "2.0.1",
@@ -231,5 +223,4 @@
       "optional": true
     }
   }
-}
-
+}

packages/react/script/components-json/build.ts

@@ -8,14 +8,22 @@ import Ajv from 'ajv'
 import {pascalCase, kebabCase} from 'change-case'
 import glob from 'fast-glob'
 import fs from 'fs'
-import keyBy from 'lodash.keyby'
 import prettier from '@prettier/sync'
 import chalk from 'chalk'
 import type {LintError} from 'markdownlint'
 import {lint as mdLint} from 'markdownlint/sync'
 import componentSchema from './component.schema.json'
 import outputSchema from './output.schema.json'
 
+const _keyBy = (array: Array<any>, key: string) => (array || []).reduce((r, x) => ({ ...r, [key ? x[key] : x]: x }), {})
+
+const keyBy = (collection: Object, key: string) => {
+  const c = collection || {};
+  return Array.isArray(c)
+  ? _keyBy(c, key)
+  : _keyBy(Object.values(c), key);
+}
+
 const args = parseArgs({
   options: {
     'storybook-data': {

packages/react/script/hooks-json/build.ts

@@ -1,10 +1,18 @@
 import glob from 'fast-glob'
 import fs from 'fs'
-import keyBy from 'lodash.keyby'
 import hookSchema from '../hooks-json/hook.schema.json'
 import outputSchema from './output.schema.json'
 import Ajv from 'ajv'
 
+const _keyBy = (array: Array<any>, key: string) => (array || []).reduce((r, x) => ({ ...r, [key ? x[key] : x]: x }), {})
+
+const keyBy = (collection: Object, key: string) => {
+  const c = collection || {};
+  return Array.isArray(c)
+  ? _keyBy(c, key)
+  : _keyBy(Object.values(c), key);
+}
+
 // Only includes fields we use in this script
 type Hook = {
   name: string

packages/react/src/__tests__/storybook.test.tsx

@@ -2,7 +2,6 @@ import fs from 'node:fs'
 import path from 'node:path'
 import {describe, expect, test} from 'vitest'
 import glob from 'fast-glob'
-import groupBy from 'lodash.groupby'
 
 const ROOT_DIRECTORY = path.resolve(__dirname, '..', '..')
 
@@ -87,7 +86,7 @@ const stories = await Promise.all(
 )
 
 const components = Object.entries(
-  groupBy(stories, ({name}) => {
+  Object.groupBy(stories, ({name}) => {
     return name
   }),
 )

packages/react/src/utils/theme.ts

@@ -3,8 +3,13 @@
 // eslint-disable-next-line @typescript-eslint/ban-ts-comment
 // @ts-nocheck
 
-import isEmpty from 'lodash.isempty'
-import isObject from 'lodash.isobject'
+function isObject(obj: unknown): obj is Object {
+  return typeof obj === 'object' && obj !== null
+}
+
+function isEmpty(obj: unknown): boolean {
+  return [Object, Array].includes((obj || {}).constructor) && !Object.entries((obj || {})).length;
+}
 
 function fontStack(fonts) {
   return fonts.map(font => (font.includes(' ') ? `"${font}"` : font)).join(', ')