chore(deps): update npm non-major dependencies

[renovate]

This PR contains the following updates:

Package	Change	Age	Adoption	Passing	Confidence
@eslint/js (source)	9.15.0 -> 9.16.0
class-variance-authority	0.7.0 -> 0.7.1
dotenv	16.4.5 -> 16.4.7
drizzle-kit (source)	^0.28.0 -> ^0.29.0
drizzle-orm (source)	^0.36.0 -> ^0.37.0
eslint (source)	9.15.0 -> 9.16.0
eslint-import-resolver-typescript	3.6.3 -> 3.7.0
globals	15.12.0 -> 15.13.0
knip (source)	5.37.2 -> 5.39.1
lucide-react (source)	^0.461.0 -> ^0.464.0
prettier (source)	3.3.3 -> 3.4.2
react-day-picker (source)	9.4.0 -> 9.4.1
react-easy-crop (source)	5.1.0 -> 5.2.0
tailwindcss (source)	3.4.15 -> 3.4.16
typescript-eslint (source)	8.16.0 -> 8.17.0
vitest (source)	2.1.5 -> 2.1.8

---

Release Notes

eslint/eslint (@​eslint/js)

v9.16.0

Compare Source

joe-bell/cva (class-variance-authority)

v0.7.1

Compare Source

What's Changed

• Add LICENSE Comments by @​joe-bell in https://github.com/joe-bell/cva/pull/283
• chore: move clsx dependency to caret/semver range by @​philwolstenholme in https://github.com/joe-bell/cva/pull/316

New Contributors

• @​philwolstenholme made their first contribution in https://github.com/joe-bell/cva/pull/316

Full Changelog: joe-bell/cva@v0.7.0...v0.7.1

motdotla/dotenv (dotenv)

v16.4.7

Compare Source

Changed

• Ignore .tap folder when publishing. (oops, sorry about that everyone. - @​motdotla) #​848

v16.4.6

Compare Source

Changed

• Clean up stale dev dependencies #​847
• Various README updates clarifying usage and alternative solutions using dotenvx

drizzle-team/drizzle-orm (drizzle-kit)

v0.29.0

Compare Source

Drizzle ORM version 0.29.0 will require a minimum Drizzle Kit version of 0.20.0, and vice versa. Therefore, when upgrading to a newer version of Drizzle ORM, you will also need to upgrade Drizzle Kit. This may result in some breaking changes throughout the versions, especially if you need to upgrade Drizzle Kit and your Drizzle ORM version is older than <0.28.0

New Features

🎉 MySQL unsigned option for bigint

You can now specify bigint unsigned type

const table = mysqlTable('table', {
  id: bigint('id', { mode: 'number', unsigned: true }),
});

Read more in docs

🎉 Improved query builder types

Starting from 0.29.0 by default, as all the query builders in Drizzle try to conform to SQL as much as possible, you can only invoke most of the methods once. For example, in a SELECT statement there might only be one WHERE clause, so you can only invoke .where() once:

const query = db
  .select()
  .from(users)
  .where(eq(users.id, 1))
  .where(eq(users.name, 'John')); // ❌ Type error - where() can only be invoked once

This behavior is useful for conventional query building, i.e. when you create the whole query at once. However, it becomes a problem when you want to build a query dynamically, i.e. if you have a shared function that takes a query builder and enhances it. To solve this problem, Drizzle provides a special 'dynamic' mode for query builders, which removes the restriction of invoking methods only once. To enable it, you need to call .$dynamic() on a query builder.

Let's see how it works by implementing a simple withPagination function that adds LIMIT and OFFSET clauses to a query based on the provided page number and an optional page size:

function withPagination<T extends PgSelect>(
  qb: T,
  page: number,
  pageSize: number = 10,
) {
  return qb.limit(pageSize).offset(page * pageSize);
}

const query = db.select().from(users).where(eq(users.id, 1));
withPagination(query, 1); // ❌ Type error - the query builder is not in dynamic mode

const dynamicQuery = query.$dynamic();
withPagination(dynamicQuery, 1); // ✅ OK

Note that the withPagination function is generic, which allows you to modify the result type of the query builder inside it, for example by adding a join:

function withFriends<T extends PgSelect>(qb: T) {
  return qb.leftJoin(friends, eq(friends.userId, users.id));
}

let query = db.select().from(users).where(eq(users.id, 1)).$dynamic();
query = withFriends(query);

Read more in docs

🎉 Possibility to specify name for primary keys and foreign keys

There is an issue when constraint names exceed the 64-character limit of the database. This causes the database engine to truncate the name, potentially leading to issues. Starting from 0.29.0, you have the option to specify custom names for both primaryKey() and foreignKey(). We have also deprecated the old primaryKey() syntax, which can still be used but will be removed in future releases

const table = pgTable('table', {
  id: integer('id'),
  name: text('name'),
}, (table) => ({
  cpk: primaryKey({ name: 'composite_key', columns: [table.id, table.name] }),
  cfk: foreignKey({
    name: 'fkName',
    columns: [table.id],
    foreignColumns: [table.name],
  }),
}));

Read more in docs

🎉 Read Replicas Support

You can now use the Drizzle withReplica function to specify different database connections for read replicas and the main instance for write operations. By default, withReplicas will use a random read replica for read operations and the main instance for all other data modification operations. You can also specify custom logic for choosing which read replica connection to use. You have the freedom to make any weighted, custom decision for that. Here are some usage examples:

const primaryDb = drizzle(client);
const read1 = drizzle(client);
const read2 = drizzle(client);

const db = withReplicas(primaryDb, [read1, read2]);

// read from primary
db.$primary.select().from(usersTable);

// read from either read1 connection or read2 connection
db.select().from(usersTable)

// use primary database for delete operation
db.delete(usersTable).where(eq(usersTable.id, 1))

Implementation example of custom logic for selecting read replicas, where the first replica has a 70% chance of being chosen, and the second replica has a 30% chance of being chosen. Note that you can implement any type of random selection for read replicas

const db = withReplicas(primaryDb, [read1, read2], (replicas) => {
    const weight = [0.7, 0.3];
    let cumulativeProbability = 0;
    const rand = Math.random();

    for (const [i, replica] of replicas.entries()) {
      cumulativeProbability += weight[i]!;
      if (rand < cumulativeProbability) return replica;
    }
    return replicas[0]!
});

withReplicas function is available for all dialects in Drizzle ORM

Read more in docs

🎉 Set operators support (UNION, UNION ALL, INTERSECT, INTERSECT ALL, EXCEPT, EXCEPT ALL)

Huge thanks to @​Angelelz for the significant contribution he made, from API discussions to proper type checks and runtime logic, along with an extensive set of tests. This greatly assisted us in delivering this feature in this release

Usage examples:
All set operators can be used in a two ways: import approach or builder approach

Import approach

import { union } from 'drizzle-orm/pg-core'

const allUsersQuery = db.select().from(users);
const allCustomersQuery = db.select().from(customers);

const result = await union(allUsersQuery, allCustomersQuery)

Builder approach

const result = await db.select().from(users).union(db.select().from(customers));

Read more in docs

🎉 New MySQL Proxy Driver

A new driver has been released, allowing you to create your own implementation for an HTTP driver using a MySQL database. You can find usage examples in the ./examples/mysql-proxy folder

You need to implement two endpoints on your server that will be used for queries and migrations(Migrate endpoint is optional and only if you want to use drizzle migrations). Both the server and driver implementation are up to you, so you are not restricted in any way. You can add custom mappings, logging, and much more

You can find both server and driver implementation examples in the ./examples/mysql-proxy folder

// Driver
import axios from 'axios';
import { eq } from 'drizzle-orm/expressions';
import { drizzle } from 'drizzle-orm/mysql-proxy';
import { migrate } from 'drizzle-orm/mysql-proxy/migrator';
import { cities, users } from './schema';

async function main() {
  const db = drizzle(async (sql, params, method) => {
    try {
      const rows = await axios.post(`${process.env.REMOTE_DRIVER}/query`, {
        sql,
        params,
        method,
      });

      return { rows: rows.data };
    } catch (e: any) {
      console.error('Error from pg proxy server:', e.response.data);
      return { rows: [] };
    }
  });

  await migrate(db, async (queries) => {
    try {
      await axios.post(`${process.env.REMOTE_DRIVER}/migrate`, { queries });
    } catch (e) {
      console.log(e);
      throw new Error('Proxy server cannot run migrations');
    }
  }, { migrationsFolder: 'drizzle' });

  await db.insert(cities).values({ id: 1, name: 'name' });

  await db.insert(users).values({
    id: 1,
    name: 'name',
    email: 'email',
    cityId: 1,
  });

  const usersToCityResponse = await db.select().from(users).leftJoin(
    cities,
    eq(users.cityId, cities.id),
  );
}

🎉 New PostgreSQL Proxy Driver

Same as MySQL you can now implement your own http driver for PostgreSQL database. You can find usage examples in the ./examples/pg-proxy folder

You need to implement two endpoints on your server that will be used for queries and migrations (Migrate endpoint is optional and only if you want to use drizzle migrations). Both the server and driver implementation are up to you, so you are not restricted in any way. You can add custom mappings, logging, and much more

You can find both server and driver implementation examples in the ./examples/pg-proxy folder

import axios from 'axios';
import { eq } from 'drizzle-orm/expressions';
import { drizzle } from 'drizzle-orm/pg-proxy';
import { migrate } from 'drizzle-orm/pg-proxy/migrator';
import { cities, users } from './schema';

async function main() {
  const db = drizzle(async (sql, params, method) => {
    try {
      const rows = await axios.post(`${process.env.REMOTE_DRIVER}/query`, { sql, params, method });

      return { rows: rows.data };
    } catch (e: any) {
      console.error('Error from pg proxy server:', e.response.data);
      return { rows: [] };
    }
  });

  await migrate(db, async (queries) => {
    try {
      await axios.post(`${process.env.REMOTE_DRIVER}/query`, { queries });
    } catch (e) {
      console.log(e);
      throw new Error('Proxy server cannot run migrations');
    }
  }, { migrationsFolder: 'drizzle' });

  const insertedCity = await db.insert(cities).values({ id: 1, name: 'name' }).returning();
  const insertedUser = await db.insert(users).values({ id: 1, name: 'name', email: 'email', cityId: 1 });
  const usersToCityResponse = await db.select().from(users).leftJoin(cities, eq(users.cityId, cities.id));
}

🎉 D1 Batch API support

Reference: https://developers.cloudflare.com/d1/platform/client-api/#dbbatch

Batch API usage example:

const batchResponse = await db.batch([
  db.insert(usersTable).values({ id: 1, name: 'John' }).returning({
    id: usersTable.id,
  }),
  db.update(usersTable).set({ name: 'Dan' }).where(eq(usersTable.id, 1)),
  db.query.usersTable.findMany({}),
  db.select().from(usersTable).where(eq(usersTable.id, 1)),
  db.select({ id: usersTable.id, invitedBy: usersTable.invitedBy }).from(
    usersTable,
  ),
]);

Type for batchResponse in this example would be:

type BatchResponse = [
  {
    id: number;
  }[],
  D1Result,
  {
    id: number;
    name: string;
    verified: number;
    invitedBy: number | null;
  }[],
  {
    id: number;
    name: string;
    verified: number;
    invitedBy: number | null;
  }[],
  {
    id: number;
    invitedBy: number | null;
  }[],
];

All possible builders that can be used inside db.batch:

`db.all()`,
`db.get()`,
`db.values()`,
`db.run()`,
`db.query.<table>.findMany()`,
`db.query.<table>.findFirst()`,
`db.select()...`,
`db.update()...`,
`db.delete()...`,
`db.insert()...`,

More usage examples here: integration-tests/tests/d1-batch.test.ts and in docs

---

Drizzle Kit 0.20.0

1. New way to define drizzle.config using defineConfig function
2. Possibility to access Cloudflare D1 with Drizzle Studio using wrangler.toml file
3. Drizzle Studio is migrating to https://local.drizzle.studio/
4. bigint unsigned support
5. primaryKeys and foreignKeys now can have custom names
6. Environment variables are now automatically fetched
7. Some bug fixes and improvements

You can read more about drizzle-kit updates here

eslint/eslint (eslint)

v9.16.0

Compare Source

Features

• 8f70eb1 feat: Add ignoreComputedKeys option in sort-keys rule (#​19162) (Milos Djermanovic)

Documentation

• 9eefc8f docs: fix typos in use-isnan (#​19190) (루밀LuMir)
• 0c8cea8 docs: switch the order of words in no-unreachable (#​19189) (루밀LuMir)
• 0c19417 docs: add missing backtick to no-async-promise-executor (#​19188) (루밀LuMir)
• 8df9276 docs: add backtick in -0 in description of no-compare-neg-zero (#​19186) (루밀LuMir)
• 7e16e3f docs: fix caseSensitive option's title of sort-keys (#​19183) (Tanuj Kanti)
• 0c6b842 docs: fix typos in migration-guide.md (#​19180) (루밀LuMir)
• 353266e docs: fix a typo in debug.md (#​19179) (루밀LuMir)
• 5ff318a docs: delete unnecessary horizontal rule(---) in nodejs-api (#​19175) (루밀LuMir)
• 576bcc5 docs: mark more rules as handled by TypeScript (#​19164) (Tanuj Kanti)
• 742d054 docs: note that no-restricted-syntax can be used with any language (#​19148) (Milos Djermanovic)

Chores

• feb703b chore: upgrade to @eslint/[email protected] (#​19195) (Francesco Trotta)
• df9bf95 chore: package.json update for @​eslint/js release (Jenkins)
• f831893 chore: add type for ignoreComputedKeys option of sort-keys (#​19184) (Tanuj Kanti)
• 3afb8a1 chore: update dependency @​eslint/json to ^0.8.0 (#​19177) (Milos Djermanovic)
• 1f77c53 chore: add repository.directory property to package.json (#​19165) (루밀LuMir)
• d460594 chore: update dependency @​arethetypeswrong/cli to ^0.17.0 (#​19147) (renovate[bot])
• 45cd4ea refactor: update default options in rules (#​19136) (Milos Djermanovic)

import-js/eslint-import-resolver-typescript (eslint-import-resolver-typescript)

v3.7.0

Compare Source

Minor Changes

• #​326 93ea130 Thanks @​SukkaW! - This version has implemented the eslint-plugin-import-x's v3 resolver interface. This allows you to use import/require to reference eslint-import-resolver-typescript directly in your ESLint flat config:

  Previously

  // eslint.config.js
  module.exports = {
    settings: {
      'import-x/resolver': {
        typescript: {
          alwaysTryTypes: true,
        },
        // or
        require.resolve('eslint-import-resolver-typescript'):
          alwaysTryTypes: true,
        }
      }
    }
  }

  Now

  // eslint.config.js
  const {
    createTypeScriptImportResolver,
  } = require('eslint-import-resolver-typescript')
  
  module.exports = {
    settings: {
      'import-x/resolver-next': [
        createTypeScriptImportResolver({
          alwaysTryTypes: true,
        }),
      ],
    },
  }

  Note that this only works with eslint-plugin-import-x@>=4.5.0. You can't use createTypeScriptImportResolver with the older versions of eslint-plugin-import-x or any existing versions of eslint-plugin-import.

sindresorhus/globals (globals)

v15.13.0

Compare Source

webpro-nl/knip (knip)

v5.39.1

Compare Source

• Fix case sensitivity in package name check (resolves #​869) (d6dab3d)

v5.39.0

Compare Source

v5.38.4

Compare Source

v5.38.3

Compare Source

• Fix traces for default export (resolves #​860) (90d1f5c)
• Fix typo (204ce6d)

v5.38.2

Compare Source

• Fix for certain failing cases of --include-libs (resolves #​855) (5242ddd)

v5.38.1

Compare Source

• Fix regression re. isIncludeEntryExports → skipExportsAnalysis from scripts/plugins (resolves #​857) (b8379de)

v5.38.0

Compare Source

lucide-icons/lucide (lucide-react)

v0.464.0: New icons 0.464.0

Compare Source

Modified Icons 🔨

• paperclip (#​2482) by @​jguddas
• picture-in-picture (#​2481) by @​jguddas

v0.463.0: New icons 0.463.0

Compare Source

Modified Icons 🔨

• layers (#​2596) by @​jguddas

v0.462.0: New icons 0.462.0

Compare Source

New icons 🎨

• image-upscale (#​2462) by @​jguddas

Modified Icons 🔨

• grid-2x2 (#​2628) by @​jguddas
• ship (#​2548) by @​jguddas
• shuffle (#​2478) by @​jguddas
• venetian-mask (#​1950) by @​jguddas

prettier/prettier (prettier)

v3.4.2

Compare Source

diff

Treat U+30A0 & U+30FB in Katakana Block as CJK (#​16796 by @​tats-u)

Prettier doesn't treat U+30A0 & U+30FB as Japanese. U+30FB is commonly used in Japanese to represent the delimitation of first and last names of non-Japanese people or “and”. The following “C言語・C++・Go・Rust” means “C language & C++ & Go & Rust” in Japanese.

<!-- Input (--prose-wrap=never) -->

C言
語
・
C++
・
Go
・
Rust

<!-- Prettier 3.4.1 -->
C言語・ C++ ・ Go ・ Rust

<!-- Prettier 3.4.2 -->
C言語・C++・Go・Rust

U+30A0 can be used as the replacement of the - in non-Japanese names (e.g. “Saint-Saëns” (Charles Camille Saint-Saëns) can be represented as “サン゠サーンス” in Japanese), but substituted by ASCII hyphen (U+002D) or U+FF1D (full width hyphen) in many cases (e.g. “サン=サーンス” or “サン＝サーンス”).

Fix comments print on class methods with decorators (#​16891 by @​fisker)

// Input
class A {
  @​decorator
  /** 
   * The method description
   *
  */
  async method(foo: Foo, bar: Bar) {
    console.log(foo);
  }
}

// Prettier 3.4.1
class A {
  @​decorator
  async /**
   * The method description
   *
   */
  method(foo: Foo, bar: Bar) {
    console.log(foo);
  }
}

// Prettier 3.4.2
class A {
  @​decorator
  /**
   * The method description
   *
   */
  async method(foo: Foo, bar: Bar) {
    console.log(foo);
  }
}

Fix non-idempotent formatting (#​16899 by @​seiyab)

This bug fix is not language-specific. You may see similar change in any languages. This fixes regression in 3.4.0 so change caused by it should yield same formatting as 3.3.3.

// Input
<div>
  foo
  <span>longlonglonglonglonglonglonglonglonglonglonglonglonglonglongl foo</span>
  , abc
</div>;

// Prettier 3.4.1 (first)
<div>
  foo
  <span>
    longlonglonglonglonglonglonglonglonglonglonglonglonglonglongl foo
  </span>, abc
</div>;

// Prettier 3.4.1 (second)
<div>
  foo
  <span>longlonglonglonglonglonglonglonglonglonglonglonglonglonglongl foo</span>
  , abc
</div>;

// Prettier 3.4.2
<div>
  foo
  <span>longlonglonglonglonglonglonglonglonglonglonglonglonglonglongl foo</span>
  , abc
</div>;

v3.4.1

Compare Source

diff

Remove unnecessary parentheses around assignment in v-on (#​16887 by @​fisker)

<!-- Input -->
<template>
  <button @&#8203;click="foo += 2">Click</button>
</template>

<!-- Prettier 3.4.0 -->
<template>
  <button @&#8203;click="(foo += 2)">Click</button>
</template>

<!-- Prettier 3.4.1 -->
<template>
  <button @&#8203;click="foo += 2">Click</button>
</template>

v3.4.0

Compare Source

diff

🔗 Release Notes

gpbl/react-day-picker (react-day-picker)

v9.4.1

Compare Source

This release improves support for screen readers and fixes a VoiceOver issue when navigating the calendar.

What's Changed

• fix(a11y): improve screen reader and VoiceOver support by @​gpbl in https://github.com/gpbl/react-day-picker/pull/2609
• feat(a11y): added role and aria-label props by @​gpbl in https://github.com/gpbl/react-day-picker/pull/2609
• chore(style): remove unused CSS variable by @​gpbl in https://github.com/gpbl/react-day-picker/pull/2610
• chore: use callbacks for dropdown event handlers by @​gpbl in https://github.com/gpbl/react-day-picker/pull/2602

Full Changelog: gpbl/react-day-picker@v9.4.0...v9.4.1

ValentinH/react-easy-crop (react-easy-crop)

v5.2.0

Compare Source

🎉 This release contains work from a new contributor! 🎉

Thank you, null@​IanSymplectic, for all your work!

🚀 Enhancement

• Updated keyboard support #​575 (@​IanSymplectic)

Authors: 1

• @​IanSymplectic

tailwindlabs/tailwindcss (tailwindcss)

v3.4.16

Compare Source

Fixed

• Ensure the TypeScript types for PluginsConfig allow undefined values (#​14668)

Changed

• Bumped lilconfig to v3.x (#​15289)

typescript-eslint/typescript-eslint (typescript-eslint)

v8.17.0

Compare Source

This was a version bump only for typescript-eslint to align it with other projects, there were no code changes.

You can read about our versioning strategy and releases on our website.

vitest-dev/vitest (vitest)

v2.1.8

Compare Source

   🐞 Bug Fixes

• Support Node 21  -  by @​sheremet-va (92f7a)

    View changes on GitHub

v2.1.7

Compare Source

   🐞 Bug Fixes

• Revert support for Vite 6  -  by @​sheremet-va (fbe5c)
  • This introduced some breaking changes (https://github.com/vitest-dev/vitest/issues/6992). We will enable support at a later time. In the meantime, you can still use pnpm.overrides or yarn resolutions to override the vite version in the vitest package - the APIs are compatible.

    View changes on GitHub

v2.1.6

Compare Source

🚀 Features

• Support VIte 6

    View changes on GitHub

---

Configuration

📅 Schedule: Branch creation - At any time (no schedule defined), Automerge - At any time (no schedule defined).

🚦 Automerge: Enabled.

♻ Rebasing: Whenever PR is behind base branch, or you tick the rebase/retry checkbox.

👻 Immortal: This PR will be recreated if closed unmerged. Get config help if that's undesired.

---

• If you want to rebase/retry this PR, check this box

---

This PR was generated by Mend Renovate. View the repository job log.