Merge branch 'main' into add-render-prop-to-link

.changeset/chatty-geckos-obey.md

@@ -0,0 +1,5 @@
+---
+"@salt-ds/core": patch
+---
+
+Updated ToggleButton's styling to align to Button's new styling.

.changeset/chilly-frogs-scream.md

@@ -0,0 +1,5 @@
+---
+"@salt-ds/core": patch
+---
+
+Fixed `color="secondary"` not working for the Link component.

.changeset/cool-fishes-appear.md

@@ -0,0 +1,5 @@
+---
+"@salt-ds/lab": patch
+---
+
+Updated TabstripNext and TabNext to follow the new design guidelines and added dismissing and adding tabs.

.changeset/hot-tomatoes-hide.md

@@ -0,0 +1,5 @@
+---
+"@salt-ds/theme": patch
+---
+
+Fixed target characteristic tokens being incorrect in Salt Next.

.changeset/olive-ears-add.md

@@ -0,0 +1,5 @@
+---
+"@salt-ds/core": patch
+---
+
+Fixed focus rings not appearing on Checkbox or Radio Button.

.changeset/plenty-monkeys-give.md

@@ -0,0 +1,28 @@
+---
+"@salt-ds/lab": minor
+---
+
+Added `DialogHeader` component to lab. `DialogHeader`'s update follows our standardized header for container components and app regions, and it can be added to provide a structured header for dialog. The header includes a title and actions that follows our Header Block pattern.
+
+```typescript
+<Dialog open={open} onOpenChange={onOpenChange} id={id}>
+  <DialogHeader
+    header={<H2>Terms and conditions</H2>}
+    actions={
+      <Button
+        aria-label="Close overlay"
+        appearance="transparent"
+        sentiment="neutral"
+      >
+        <CloseIcon aria-hidden />
+      </Button>
+    }
+  />
+  <DialogContent>
+    <div>
+      Only Chase Cards that we determine are eligible can be added to the
+    Wallet.
+    </div>
+  </DialogContent>
+</Dialog>;
+```

.changeset/silent-ties-sing.md

@@ -0,0 +1,5 @@
+---
+"@salt-ds/core": patch
+---
+
+Added padding between the content and scrollbar when `OverlayPanelContent` is scrollable.

.changeset/slow-bags-give.md

@@ -0,0 +1,5 @@
+---
+"@salt-ds/core": patch
+---
+
+Fixed Tooltip to prioritize its `status` prop over the status inherited from a parent FormField.

.storybook/main.ts

@@ -34,6 +34,11 @@ const config: StorybookConfig = {
 
     const customConfig: UserConfig = {
       plugins: [cssInline(), cssVariableDocgen()],
+      server: {
+        watch: {
+          ignored: ["**/coverage/**"],
+        },
+      },
     };
 
     if (configType === "PRODUCTION" && config.root) {

.storybook/toolbar/ThemeNextToolbar.tsx

@@ -8,7 +8,7 @@ import {
 import { BeakerIcon, CheckIcon } from "@storybook/icons";
 import { useGlobals } from "@storybook/manager-api";
 import { clsx } from "clsx";
-import React, { type AnchorHTMLAttributes } from "react";
+import type { AnchorHTMLAttributes } from "react";
 
 import "./ThemeNextToolbar.css";
 

CONTRIBUTING.md

@@ -27,7 +27,7 @@ The repo contains below packages under `/packages`
 
 1. Add the icon to the `packages/icons/src/SVG` folder. The icon should be named using kebab casing e.g. `icon-name.svg`.
 2. Navigate to `packages/icons` e.g. `cd packages/icons`.
-3. Run `yarn build` to build the icons.
+3. Run `yarn build:icons` to build the icons.
 4. Write a changeset using `yarn changeset`, this should have the format:
 
 ```md

biome.jsonc

@@ -1,5 +1,5 @@
 {
-  "$schema": "https://biomejs.dev/schemas/1.9.1/schema.json",
+  "$schema": "https://biomejs.dev/schemas/1.9.4/schema.json",
   "vcs": {
     "enabled": true,
     "clientKind": "git",
@@ -50,6 +50,7 @@
         "useSemanticElements": "off"
       },
       "correctness": {
+        "noUnusedImports": "error",
         "useExhaustiveDependencies": {
           "level": "warn",
           "options": {

cypress.config.ts

@@ -52,12 +52,18 @@ async function getViteConfig(config: UserConfig) {
       resolve: {
         alias: {
           "@salt-ds/core": path.resolve(__dirname, "./dist/salt-ds-core"),
+          "@salt-ds/countries": path.resolve(
+            __dirname,
+            "./dist/salt-ds-countries",
+          ),
           "@salt-ds/data-grid": path.resolve(
             __dirname,
             "./dist/salt-ds-data-grid",
           ),
-          "@salt-ds/lab": path.resolve(__dirname, "./dist/salt-ds-lab"),
           "@salt-ds/icons": path.resolve(__dirname, "./dist/salt-ds-icons"),
+          "@salt-ds/lab": path.resolve(__dirname, "./dist/salt-ds-lab"),
+          "@salt-ds/styles": path.resolve(__dirname, "./dist/salt-ds-styles"),
+          "@salt-ds/window": path.resolve(__dirname, "./dist/salt-ds-window"),
         },
       },
       optimizeDeps: {

cypress/tsconfig.json

@@ -1,6 +1,7 @@
 {
   "extends": "../tsconfig.json",
   "compilerOptions": {
+    "jsx": "react-jsx",
     "types": ["cypress"]
   },
   "include": ["**/*.ts", "**/*.tsx"]

declarations.d.ts

@@ -3,6 +3,11 @@ declare module "*.css" {
   export default content;
 }
 
+declare module "*?inline" {
+  const src: string;
+  export default src;
+}
+
 declare module "*.scss" {
   const content: Record<string, string>;
   export default content;

docs/components/LineBlock.tsx

@@ -1,4 +1,3 @@
-import type { ReactNode } from "react";
 import { ReplacementToken } from "./ReplacementToken";
 
 import "./LineBlock.css";

package.json

@@ -11,20 +11,9 @@
     "docs",
     "site"
   ],
-  "modular": {
-    "type": "root"
-  },
   "scripts": {
     "start": "yarn storybook",
-    "build": "yarn build:core && yarn build:lab && yarn build:icons && yarn build:countries && yarn build:theme && yarn build:data-grid && yarn build:ag-grid-theme && yarn build:window && yarn build:styles && yarn bundle:css",
-    "build:core": "modular build @salt-ds/core",
-    "build:icons": "modular build @salt-ds/icons",
-    "build:countries": "modular build @salt-ds/countries",
-    "build:lab": "modular build @salt-ds/lab",
-    "build:theme": "yarn workspace @salt-ds/theme build",
-    "build:data-grid": "modular build @salt-ds/data-grid",
-    "build:window": "modular build @salt-ds/window",
-    "build:styles": "modular build @salt-ds/styles",
+    "build": "yarn workspaces foreach --exclude @salt-ds/site -Apt run build && yarn bundle:css",
     "build:ag-grid-theme": "yarn workspace @salt-ds/ag-grid-theme build",
     "bundle:css": "yarn bundle:core:css && yarn bundle:lab:css && yarn copy:icon:css && yarn copy:countries:css",
     "bundle:core:css": "yarn workspace @salt-ds/core bundle:css",
@@ -50,11 +39,11 @@
     "chromatic": "chromatic"
   },
   "dependencies": {
-    "@biomejs/biome": "^1.9.1",
-    "@biomejs/js-api": "^0.6.2",
-    "@biomejs/wasm-nodejs": "^1.9.1",
+    "@biomejs/biome": "1.9.4",
+    "@biomejs/js-api": "0.7.1",
+    "@biomejs/wasm-nodejs": "1.9.4",
     "@changesets/cli": "^2.27.7",
-    "@cypress/code-coverage": "^3.12.35",
+    "@cypress/code-coverage": "^3.13.6",
     "@faker-js/faker": "^8.0.0",
     "@fontsource/open-sans": "^4.5.13",
     "@fontsource/pt-mono": "^5.0.12",
@@ -79,7 +68,6 @@
     "@tanstack/react-query": "^5.0.0",
     "@testing-library/cypress": "^10.0.0",
     "@testing-library/dom": "^10.0.0",
-    "@testing-library/react": "^16.0.0",
     "@types/no-scroll": "^2.1.0",
     "@types/node": "^20.0.0",
     "@types/react": "^18.3.3",
@@ -92,53 +80,47 @@
     "ag-grid-react": "^31.3.4",
     "axe-core": "^4.9.0",
     "chromatic": "^11.10.1",
-    "ci-info": "^3.3.1",
+    "ci-info": "^4.0.0",
     "clsx": "^2.0.0",
-    "cypress": "^13.8.0",
+    "cypress": "^13.15.2",
     "cypress-axe": "^1.5.0",
-    "cypress-real-events": "^1.12.0",
+    "cypress-real-events": "^1.13.0",
     "deepmerge": "^4.2.2",
     "dom-accessibility-api": "^0.7.0",
     "mockdate": "^3.0.5",
-    "modular-scripts": "patch:modular-scripts@npm:3.6.0#.yarn/patches/modular-scripts-npm-3.6.0-d967962075.patch",
     "msw": "^2.3.5",
     "msw-storybook-addon": "^2.0.3",
     "prettier": "^3.3.3",
     "react": "^18.3.1",
     "react-docgen-typescript": "2.2.2",
     "react-dom": "^18.3.1",
     "rifm": "^0.12.0",
-    "sass": "^1.52.3",
     "storybook": "^8.3.0",
     "stylelint": "^16.0.0",
     "typescript": "4.6.4",
-    "vite": "^4.5.5",
+    "vite": "^5.0.0",
     "vite-plugin-istanbul": "^6.0.0",
     "vite-tsconfig-paths": "^4.2.0",
     "vitest": "^2.0.0",
-    "webpack": "5.94.0",
     "yup": "^1.0.2"
   },
   "resolutions": {
     "@changesets/assemble-release-plan@npm:^6.0.3": "patch:@changesets/assemble-release-plan@npm%3A6.0.3#~/.yarn/patches/@changesets-assemble-release-plan-npm-6.0.3-29726de363.patch",
     "@salt-ds/lab": "workspace:*",
-    "modular-scripts/rollup": "2.79.1",
     "next": "^14.0.0",
-    "webpack-dev-server": "4.9.3",
-    "webpack": "5.94.0",
-    "recursive-readdir": "2.2.3",
-    "@storybook/test@npm:8.2.4": "patch:@storybook/test@npm%3A8.2.4#~/.yarn/patches/@storybook-test-npm-8.2.4-0a53c854b7.patch",
-    "@joshwooding/vite-plugin-react-docgen-typescript": "0.4.0"
+    "whatwg-url": "^14.0.0",
+    "@joshwooding/vite-plugin-react-docgen-typescript": "0.4.0",
+    "cookie": "^0.7.0"
   },
   "browserslist": {
     "production": [
-      "chrome 79",
-      ">0.2%",
-      "not dead",
-      "not op_mini all"
+      "chrome >= 86",
+      "firefox >= 86",
+      "edge >= 85",
+      "iOS >= 15.4",
+      "safari >= 15.4"
     ],
     "development": [
-      "chrome 79",
       "last 1 chrome version",
       "last 1 firefox version",
       "last 1 safari version"
@@ -147,5 +129,16 @@
   "packageManager": "yarn@4.5.0",
   "msw": {
     "workerDirectory": "docs/public"
+  },
+  "devDependencies": {
+    "@rollup/plugin-commonjs": "^28.0.1",
+    "@rollup/plugin-json": "^6.1.0",
+    "@rollup/plugin-node-resolve": "^15.3.0",
+    "browserslist-to-esbuild": "^2.1.1",
+    "execa": "^9.0.0",
+    "get-tsconfig": "^4.7.5",
+    "rollup": "^4.24.2",
+    "rollup-plugin-esbuild": "^6.1.1",
+    "rollup-plugin-postcss": "^4.0.2"
   }
 }

packages/ag-grid-theme/package.json

@@ -25,6 +25,6 @@
     "del": "^7.0.0"
   },
   "peerDependencies": {
-    "@salt-ds/theme": "^1.23.0"
+    "@salt-ds/theme": "workspace:^"
   }
 }