@orangesk/orange-design-system 2.0.0-beta.36 → 2.0.0-beta.38

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@orangesk/orange-design-system",
-  "version": "2.0.0-beta.36",
+  "version": "2.0.0-beta.38",
   "private": false,
   "engines": {
     "node": ">=20.x"
@@ -26,15 +26,23 @@
   "scripts": {
     "dev": "npm run build:scss-exports && npm run build:search-index && next dev",
     "build": "npm run build:scss-exports && npm run build:search-index && next build && npm run sprite",
-    "build:bundle": "npm run build:scss-exports && npx rollup -c && npm run build:megamenu && npm run build:footer",
-    "build:megamenu": "npm run build:scss-exports && npx rollup -c rollup.megamenu.config.mjs",
-    "dev:megamenu": "npm run build:scss-exports && npx rollup -c rollup.megamenu.config.mjs --watch",
-    "build:footer": "npm run build:scss-exports && npx rollup -c rollup.footer.config.mjs",
-    "dev:footer": "npm run build:scss-exports && npx rollup -c rollup.footer.config.mjs --watch",
+    "build:bundle": "npm run build:scss-exports && pnpm exec rollup -c && npm run build:megamenu && npm run build:footer",
+    "build:megamenu": "npm run build:scss-exports && pnpm exec rollup -c rollup.megamenu.config.mjs",
+    "dev:megamenu": "npm run build:scss-exports && pnpm exec rollup -c rollup.megamenu.config.mjs --watch",
+    "build:footer": "npm run build:scss-exports && pnpm exec rollup -c rollup.footer.config.mjs",
+    "dev:footer": "npm run build:scss-exports && pnpm exec rollup -c rollup.footer.config.mjs --watch",
     "build:scss-exports": "node scripts/build-scss-exports.js",
     "build:search-index": "node scripts/mdx-search-index.js",
     "start": "next start",
-    "lint": "next lint",
+    "lint": "biome lint .",
+    "lint:fix": "biome lint --write .",
+    "lint:fix:unsafe": "biome lint --write --unsafe .",
+    "check": "biome check .",
+    "check:fix": "biome check --write .",
+    "imports:fix": "biome check --write --only=assist/source/organizeImports .",
+    "format": "biome format --write . && prettier --write '**/*.{mdx,scss}'",
+    "format:biome": "biome format --write .",
+    "format:prettier": "prettier --write '**/*.{mdx,scss}'",
     "test": "vitest",
     "test:visual:docker": "docker run --rm --init --ipc=host -e CI=1 -v \"$PWD\":/work -w /work mcr.microsoft.com/playwright:v1.58.2-noble bash -lc \"corepack enable && pnpm install --frozen-lockfile --ignore-scripts && pnpm run test:visual\"",
     "test:visual:docker:update": "docker run --rm --init --ipc=host -e CI=1 -v \"$PWD\":/work -w /work mcr.microsoft.com/playwright:v1.58.2-noble bash -lc \"corepack enable && pnpm install --frozen-lockfile --ignore-scripts && pnpm run test:visual:update\"",
@@ -47,8 +55,8 @@
     "@cloudfour/transition-hidden-element": "^2.0.2",
     "@mdx-js/loader": "^3.1.1",
     "@mdx-js/react": "^3.1.1",
-    "@next/mdx": "16.1.6",
-    "@orangesk/accessible-autocomplete": "^3.1.2",
+    "@next/mdx": "16.2.1",
+    "@orangesk/accessible-autocomplete": "3.2.0",
     "@popperjs/core": "^2.11.8",
     "@types/mdx": "^2.0.13",
     "a11y-dialog": "^8.1.5",
@@ -59,7 +67,7 @@
     "html-react-parser": "^5.2.17",
     "lorem-ipsum": "^2.0.8",
     "minisearch": "7.2.0",
-    "next": "16.1.6",
+    "next": "16.2.1",
     "normalize.css": "^8.0.1",
     "nouislider": "^15.8.1",
     "prism-react-renderer": "^2.4.1",
@@ -79,10 +87,10 @@
   },
   "devDependencies": {
     "@babel/core": "^7.29.0",
-    "@babel/preset-env": "^7.29.0",
+    "@babel/preset-env": "^7.29.2",
     "@babel/preset-react": "^7.28.5",
     "@babel/preset-typescript": "^7.28.5",
-    "@eslint/eslintrc": "3.3.5",
+    "@biomejs/biome": "latest",
     "@rollup/plugin-alias": "6.0.0",
     "@rollup/plugin-babel": "7.0.0",
     "@rollup/plugin-commonjs": "29.0.2",
@@ -91,7 +99,7 @@
     "@rollup/plugin-terser": "1.0.0",
     "@rollup/plugin-typescript": "^12.3.0",
     "@rollup/plugin-url": "^8.0.2",
-    "@rollup/rollup-darwin-arm64": "^4.59.0",
+    "@rollup/rollup-darwin-arm64": "^4.60.0",
     "@testing-library/dom": "^10.4.1",
     "@testing-library/jest-dom": "^6.9.1",
     "@testing-library/react": "^16.3.2",
@@ -100,33 +108,34 @@
     "@types/react": "19.2.14",
     "@types/react-dom": "19.2.3",
     "@types/wnumb": "^1.2.3",
-    "@vitejs/plugin-react": "^5.1.4",
-    "@vitest/browser": "^4.1.0",
-    "@vitest/browser-playwright": "^4.1.0",
-    "@vitest/coverage-v8": "^4.0.18",
-    "@vitest/ui": "^4.0.18",
-    "canvas": "^3.2.1",
-    "eslint": "latest",
-    "eslint-config-next": "16.1.6",
-    "eslint-config-prettier": "^10.1.8",
-    "eslint-plugin-unused-imports": "^4.4.1",
+    "@vitejs/plugin-react": "6.0.1",
+    "@vitest/browser": "^4.1.1",
+    "@vitest/browser-playwright": "^4.1.1",
+    "@vitest/coverage-v8": "^4.1.1",
+    "@vitest/ui": "^4.1.1",
+    "canvas": "^3.2.2",
     "fs-extra": "^11.3.4",
     "glob": "13.0.6",
-    "html-validate": "10.11.1",
+    "html-validate": "10.11.2",
     "husky": "^9.1.7",
     "identity-obj-proxy": "^3.0.0",
-    "jsdom": "28.1.0",
-    "lint-staged": "16.3.3",
+    "jsdom": "29.0.1",
+    "lint-staged": "16.4.0",
     "playwright": "^1.58.2",
     "prettier": "^3.8.1",
+    "rollup": "^4.60.0",
     "rollup-plugin-copy": "^3.5.0",
-    "rollup-plugin-dts": "^6.4.0",
+    "rollup-plugin-dts": "^6.4.1",
     "rollup-plugin-postcss": "^4.0.2",
     "sass": "^1.98.0",
     "svg-sprite": "^2.0.4",
-    "typescript": "^5.9.3",
-    "vitest": "^4.1.0",
+    "typescript": "6.0.2",
+    "vitest": "^4.1.1",
     "vitest-axe": "^0.1.0",
-    "vitest-browser-react": "^2.0.5"
+    "vitest-browser-react": "^2.1.0"
+  },
+  "lint-staged": {
+    "*.{js,jsx,ts,tsx,json,css}": "biome check --write --no-errors-on-unmatched",
+    "*.{mdx,scss}": "prettier --write"
   }
 }

package/src/assets/icons/discount-price.svg

@@ -0,0 +1,4 @@
+<svg width="32" height="32" viewBox="0 0 32 32" fill="none"
+  xmlns="http://www.w3.org/2000/svg">
+  <path d="M19.2154 18.6031C18.7324 18.6031 18.3358 18.9997 18.3358 19.5173C18.3358 20.0176 18.7324 20.4316 19.2154 20.4316C19.6983 20.4316 20.0949 20.0176 20.0949 19.5173C20.0949 18.9997 19.6983 18.6031 19.2154 18.6031ZM13.6783 12.4277C13.6783 11.9101 13.2643 11.5135 12.7813 11.5135C12.2984 11.5135 11.9018 11.9101 11.9018 12.4277C11.9018 12.928 12.2984 13.342 12.7813 13.342C13.2643 13.342 13.6783 12.928 13.6783 12.4277ZM28.7874 13.8422C29.4953 12.6224 29.0044 11.0578 27.7265 10.4612L26.48 9.87897C25.1911 9.27703 24.2352 8.13481 23.8702 6.75994L23.5169 5.43041C23.155 4.06721 21.7015 3.30829 20.3759 3.78991L19.083 4.25953C17.7462 4.74515 16.2623 4.61349 15.0321 3.89956L13.8422 3.2093C12.6224 2.50137 11.0578 2.99232 10.4612 4.27019L9.87897 5.51674C9.27703 6.80561 8.13481 7.76151 6.75994 8.12647L5.43041 8.47977C4.06721 8.84174 3.30829 10.2953 3.78991 11.6208L4.25953 12.9137C4.74515 14.2505 4.61349 15.7344 3.89956 16.9646L3.2093 18.1545C2.50137 19.3743 2.99232 20.9389 4.27019 21.5355L5.51674 22.1177C6.80561 22.7197 7.76151 23.8619 8.12647 25.2368L8.47977 26.5663C8.84174 27.9295 10.2953 28.6884 11.6208 28.2068L12.9137 27.7372C14.2505 27.2516 15.7344 27.3832 16.9646 28.0971L18.1545 28.7874C19.3743 29.4953 20.9389 29.0044 21.5355 27.7265L22.1177 26.48C22.7197 25.1911 23.8619 24.2352 25.2368 23.8702L26.5663 23.5169C27.9295 23.155 28.6884 21.7015 28.2068 20.3759L27.7372 19.083C27.2516 17.7462 27.3832 16.2623 28.0971 15.0321L28.7874 13.8422ZM10.1423 12.4277C10.1423 10.8752 11.3325 9.68499 12.7813 9.68499C14.2302 9.68499 15.4204 10.8925 15.4204 12.4277C15.4204 13.9629 14.2302 15.1704 12.7813 15.1704C11.3152 15.1704 10.1423 13.9802 10.1423 12.4277ZM14.0922 21.4145C13.7126 22.0701 13.3333 22.3977 12.8847 22.3977C12.3327 22.3977 11.9014 21.9664 11.9014 21.3971C11.9014 21.1212 11.9878 20.8279 12.1774 20.5002L17.8695 10.5649C18.2318 9.94396 18.5594 9.59899 19.077 9.59899C19.629 9.59899 20.0603 9.99562 20.0603 10.5649C20.0603 10.8235 19.9566 11.1342 19.767 11.4791L14.0922 21.4145ZM19.2154 22.2597C17.7492 22.2597 16.5763 21.0695 16.5763 19.517C16.5763 17.9645 17.7665 16.7743 19.2154 16.7743C20.6642 16.7743 21.8544 17.9818 21.8544 19.517C21.8544 21.0522 20.6642 22.2597 19.2154 22.2597Z" fill="currentColor" />
+</svg>

package/src/components/Accordion/Accordion.static.ts

@@ -46,7 +46,7 @@ export default class Accordion {
   private toggleAccordionItem(button: HTMLElement): void {
     const sectionId = button.getAttribute("aria-controls");
     const section = sectionId
-      ? this.element.querySelector(`#${sectionId}`)
+      ? this.element.querySelector<HTMLElement>(`#${sectionId}`)
       : null;
 
     if (!section) return;
@@ -61,11 +61,54 @@ export default class Accordion {
     // Toggle section visibility
     if (newState) {
       section.removeAttribute("hidden");
+      this.scrollTriggerIntoModalView(button);
     } else {
       section.setAttribute("hidden", "");
     }
   }
 
+  private scrollTriggerIntoModalView(button: HTMLElement): void {
+    const modalDialog = button.closest<HTMLElement>(".modal__dialog");
+
+    if (!modalDialog) return;
+
+    const scrollToTrigger = () => {
+      const dialogRect = modalDialog.getBoundingClientRect();
+      const buttonRect = button.getBoundingClientRect();
+      const stickyHeaderOffset = this.getStickyHeaderOffset(modalDialog);
+      const gap = 8;
+      const top =
+        buttonRect.top -
+        dialogRect.top +
+        modalDialog.scrollTop -
+        stickyHeaderOffset -
+        gap;
+
+      modalDialog.scrollTo({
+        top: Math.max(0, top),
+        behavior: "smooth",
+      });
+    };
+
+    if (typeof window.requestAnimationFrame === "function") {
+      window.requestAnimationFrame(scrollToTrigger);
+      return;
+    }
+
+    setTimeout(scrollToTrigger, 0);
+  }
+
+  private getStickyHeaderOffset(modalDialog: HTMLElement): number {
+    const modalHeader =
+      modalDialog.querySelector<HTMLElement>(".modal__header");
+
+    if (!modalHeader) return 0;
+
+    const dialogRect = modalDialog.getBoundingClientRect();
+    const headerRect = modalHeader.getBoundingClientRect();
+    return Math.max(0, headerRect.bottom - dialogRect.top);
+  }
+
   private init(): void {
     this.buttons = Array.from(
       this.element.querySelectorAll(this.config.buttonSelector),

package/src/components/Accordion/Accordion.tsx

@@ -1,11 +1,10 @@
 "use client";
 
-import React, { ReactNode } from "react";
 import cx from "classnames";
-
+import React, { ReactNode } from "react";
+import { useStatic } from "@/utils/hooks";
 import AccordionStatic from "./Accordion.static";
 import HeadingContext from "./HeadingContext";
-import { useStatic } from "@/utils/hooks";
 
 const CLASS_ROOT = "accordion";
 

package/src/components/Accordion/AccordionHeader.tsx

@@ -1,7 +1,7 @@
 "use client";
 
-import React from "react";
 import cx from "classnames";
+import React from "react";
 
 import { Icon } from "../Icon";
 

package/src/components/Accordion/AccordionItem.tsx

@@ -1,7 +1,7 @@
 "use client";
 
-import React, { ReactNode } from "react";
 import cx from "classnames";
+import React, { ReactNode } from "react";
 
 import { useHydrationSafeId } from "../../utils/hooks";
 
@@ -67,4 +67,5 @@ const AccordionItem: React.FC<AccordionItemProps> = ({
 };
 
 AccordionItem.displayName = "AccordionItem";
+
 export { AccordionItem };

package/src/components/Accordion/HeadingContext.tsx

@@ -1,5 +1,5 @@
 "use client";
 
-import { createContext } from 'react';
+import { createContext } from "react";
 
 export default createContext<number | null>(null);

package/src/components/Accordion/tests/Accordion.unit.test.jsx

@@ -1,11 +1,10 @@
-import { render, fireEvent } from "@testing-library/react";
+import { fireEvent, render } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
-
-import { AccordionItem } from "../AccordionItem";
 import { Accordion } from "../Accordion";
+import AccordionStatic from "../Accordion.static";
 import AccordionHeader from "../AccordionHeader";
+import { AccordionItem } from "../AccordionItem";
 import HeadingContext from "../HeadingContext";
-import AccordionStatic from "../Accordion.static";
 import testData from "./data";
 
 // Helper function to initialize accordion static behavior
@@ -179,6 +178,115 @@ describe("Accordion Component Tests", () => {
           getByTestId("item-test-id-2").getAttribute("aria-expanded"),
         ).toBe("true");
       });
+
+      it("scrolls modal dialog to clicked accordion button when inside modal", async () => {
+        accordion.unmount();
+
+        const { container, getByTestId } = render(
+          <div className="modal__dialog">
+            <div className="modal__header" />
+            <TestingAccordion />
+          </div>,
+        );
+
+        await waitForAccordionInteractivity(container);
+
+        const modalDialog = container.querySelector(".modal__dialog");
+        const modalHeader = container.querySelector(".modal__header");
+        const button = getByTestId("item-test-id-1");
+
+        modalDialog.scrollTop = 120;
+        modalDialog.getBoundingClientRect = vi.fn(() => ({
+          top: 40,
+        }));
+        modalHeader.getBoundingClientRect = vi.fn(() => ({
+          bottom: 120,
+        }));
+        button.getBoundingClientRect = vi.fn(() => ({
+          top: 170,
+        }));
+        modalDialog.scrollTo = vi.fn();
+
+        const rafSpy = vi
+          .spyOn(window, "requestAnimationFrame")
+          .mockImplementation((callback) => {
+            callback();
+            return 1;
+          });
+
+        fireEvent.click(getByTestId("item-test-id-1"));
+
+        expect(modalDialog.scrollTo).toHaveBeenCalledWith({
+          top: 162,
+          behavior: "smooth",
+        });
+
+        rafSpy.mockRestore();
+      });
+
+      it("does not scroll when accordion is outside modal dialog", async () => {
+        const { getByTestId } = accordion;
+
+        const rafSpy = vi.spyOn(window, "requestAnimationFrame");
+
+        fireEvent.click(getByTestId("item-test-id-1"));
+
+        expect(rafSpy).not.toHaveBeenCalled();
+
+        rafSpy.mockRestore();
+      });
+
+      it("scrolls to the clicked button when multiple items are open", async () => {
+        accordion.unmount();
+
+        const { container, getByTestId } = render(
+          <div className="modal__dialog">
+            <div className="modal__header" />
+            <TestingAccordion />
+          </div>,
+        );
+
+        await waitForAccordionInteractivity(container);
+
+        const modalDialog = container.querySelector(".modal__dialog");
+        const modalHeader = container.querySelector(".modal__header");
+        const firstButton = getByTestId("item-test-id-1");
+        const secondButton = getByTestId("item-test-id-2");
+
+        modalDialog.scrollTop = 50;
+        modalDialog.getBoundingClientRect = vi.fn(() => ({
+          top: 20,
+        }));
+        modalHeader.getBoundingClientRect = vi.fn(() => ({
+          bottom: 100,
+        }));
+        firstButton.getBoundingClientRect = vi.fn(() => ({
+          top: 120,
+        }));
+        secondButton.getBoundingClientRect = vi.fn(() => ({
+          top: 260,
+        }));
+        modalDialog.scrollTo = vi.fn();
+
+        const rafSpy = vi
+          .spyOn(window, "requestAnimationFrame")
+          .mockImplementation((callback) => {
+            callback();
+            return 1;
+          });
+
+        fireEvent.click(firstButton);
+        fireEvent.click(secondButton);
+
+        expect(firstButton.getAttribute("aria-expanded")).toBe("true");
+        expect(secondButton.getAttribute("aria-expanded")).toBe("true");
+        expect(modalDialog.scrollTo).toHaveBeenLastCalledWith({
+          top: 202,
+          behavior: "smooth",
+        });
+
+        rafSpy.mockRestore();
+      });
     });
 
     describe("keyboard interactions", () => {

package/src/components/Alert/Alert.tsx

@@ -1,9 +1,8 @@
-import React, { JSX } from "react";
 import cx from "classnames";
-
-import { Icon } from "../Icon";
-import { Buttons } from "../Buttons";
+import React, { JSX } from "react";
 import ConditionalWrapper from "../../utils/ConditionalWrapper";
+import { Buttons } from "../Buttons";
+import { Icon } from "../Icon";
 
 import data from "./data";
 

package/src/components/Alert/tests/Alert.conformance.test.jsx

@@ -1,8 +1,7 @@
 import { render } from "@testing-library/react";
-import { axe } from 'vitest-axe';
-
-import { Alert } from "../";
+import { axe } from "vitest-axe";
 import { Link } from "../../Link";
+import { Alert } from "../";
 
 const example = (
   <Alert

package/src/components/Alert/tests/Alert.test.jsx

@@ -1,4 +1,4 @@
-import { render, fireEvent } from "@testing-library/react";
+import { fireEvent, render } from "@testing-library/react";
 
 import { Alert } from "../";
 

package/src/components/Alert/tests/Alert.visual.test.jsx

@@ -1,9 +1,8 @@
 import { beforeEach, describe, expect, test } from "vitest";
 import { page } from "vitest/browser";
 import { render } from "vitest-browser-react";
-
-import { Alert } from "../";
 import { Button } from "../../Button";
+import { Alert } from "../";
 
 describe("Alert visual regression", () => {
   beforeEach(async () => {

package/src/components/AnchorNavigation/AnchorNavigation.tsx

@@ -1,10 +1,10 @@
 "use client";
 
-import React from "react";
 import cx from "classnames";
-import { Link } from "../Link";
-import { Container } from "../Container";
+import React from "react";
 import { useStatic } from "../../utils/hooks";
+import { Container } from "../Container";
+import { Link } from "../Link";
 import AnchorNavigationStatic from "./AnchorNavigation.static";
 
 interface AnchorNavigationItem {

package/src/components/AnchorNavigation/tests/AnchorNavigation.conformance.test.jsx

@@ -1,5 +1,5 @@
 import { render } from "@testing-library/react";
-import { axe } from 'vitest-axe';
+import { axe } from "vitest-axe";
 
 import { AnchorNavigation } from "../";
 

package/src/components/Bar/Bar.tsx

@@ -1,5 +1,5 @@
-import React from "react";
 import cx from "classnames";
+import React from "react";
 
 type BarAlign = "start" | "end" | "center";
 type BarSpace = "small" | "large";

package/src/components/Bar/BarBreak.tsx

@@ -1,5 +1,5 @@
-import React from "react";
 import cx from "classnames";
+import React from "react";
 
 interface BarBreakProps extends React.HTMLAttributes<HTMLElement> {
   /** HTML tag to render the compontent with */

package/src/components/Bar/BarItem.tsx

@@ -1,5 +1,5 @@
-import React from "react";
 import cx from "classnames";
+import React from "react";
 
 interface CommonProps {
   /** Bar item could shrink and wrap content if there is not enough empty space */

package/src/components/Bar/index.ts

@@ -1,3 +1,3 @@
 export { Bar } from "./Bar";
-export { BarItem } from "./BarItem";
 export { BarBreak } from "./BarBreak";
+export { BarItem } from "./BarItem";

package/src/components/Bar/tests/Bar.conformance.test.jsx

@@ -1,5 +1,5 @@
 import { render } from "@testing-library/react";
-import { axe } from 'vitest-axe';
+import { axe } from "vitest-axe";
 
 import { Bar, BarItem } from "../";
 

package/src/components/BlockAction/BlockAction.tsx

@@ -1,5 +1,5 @@
-import React, { ReactElement } from "react";
 import cx from "classnames";
+import React, { ReactElement } from "react";
 
 import { CloneElementWithClassName } from "./CloneElementWithClassName";
 import { Provider } from "./Context";

package/src/components/BlockAction/BlockActionControl.tsx

@@ -1,9 +1,8 @@
 "use client";
 
-import React, { useContext, ReactElement } from "react";
-
-import { Context } from "./Context";
+import React, { ReactElement, useContext } from "react";
 import { CloneElementWithClassName } from "./CloneElementWithClassName";
+import { Context } from "./Context";
 
 export interface BlockActionControlProps {
   /** 1 and only one single element */

package/src/components/BlockAction/BlockActionIndicator.tsx

@@ -1,10 +1,9 @@
 "use client";
 
-import React, { useContext, ReactElement } from "react";
 import cx from "classnames";
-
-import { Context } from "./Context";
+import React, { ReactElement, useContext } from "react";
 import { CloneElementWithClassName } from "./CloneElementWithClassName";
+import { Context } from "./Context";
 
 export interface BlockActionIndicatorProps {
   /** 1 and only one single element */

package/src/components/BlockAction/CloneElementWithClassName.tsx

@@ -1,5 +1,5 @@
-import React, { ReactElement } from "react";
 import cx from "classnames";
+import React, { ReactElement } from "react";
 
 interface CloneElementWithClassNameProps {
   className?: string;

package/src/components/BlockAction/Context.tsx

@@ -1,6 +1,6 @@
 "use client";
 
-import React, { useState, ReactNode, Dispatch, SetStateAction } from "react";
+import React, { Dispatch, ReactNode, SetStateAction, useState } from "react";
 
 interface ContextType {
   isIndicating: boolean;

package/src/components/BlockAction/index.tsx

@@ -1,9 +1,8 @@
 import React, { ReactElement } from "react";
-
-import { CloneElementWithClassName } from "./CloneElementWithClassName";
 import { BlockAction } from "./BlockAction";
 import { BlockActionControl } from "./BlockActionControl";
 import { BlockActionIndicator } from "./BlockActionIndicator";
+import { CloneElementWithClassName } from "./CloneElementWithClassName";
 
 export interface BlockActionOverrideProps {
   /** 1 and only one single element */
@@ -12,9 +11,7 @@ export interface BlockActionOverrideProps {
   [key: string]: any;
 }
 
-export { BlockAction };
-
-export { BlockActionControl };
+export { BlockAction, BlockActionControl };
 
 const BlockActionOverride: React.FC<BlockActionOverrideProps> = (props) => (
   <CloneElementWithClassName {...props} className="block-action__override" />
@@ -22,6 +19,4 @@ const BlockActionOverride: React.FC<BlockActionOverrideProps> = (props) => (
 
 BlockActionOverride.displayName = "BlockActionOverride";
 
-export { BlockActionOverride };
-
-export { BlockActionIndicator };
+export { BlockActionIndicator, BlockActionOverride };

package/src/components/BlockAction/styles/config.scss

@@ -1,10 +1,10 @@
-@use '../../../styles/tokens/color';
+@use "../../../styles/tokens/color";
 
 /// Generates indicator hover colors. Each key is a background color and matching hover color.
 /// @type Map
 $indicator-colors: (
-  'default': color.$orange-dark,
-  'black': color.$orange,
-  'orange': color.$white,
-  'orange-dark': color.$black,
-)
+  "default": color.$orange-dark,
+  "black": color.$orange,
+  "orange": color.$white,
+  "orange-dark": color.$black,
+);

package/src/components/BlockAction/tests/BlockActionControl.unit.test.jsx

@@ -1,4 +1,4 @@
-import { render, fireEvent } from "@testing-library/react";
+import { fireEvent, render } from "@testing-library/react";
 
 import { BlockActionControl } from "../BlockActionControl";
 import { Context } from "../Context";

package/src/components/BodyBanner/BodyBanner.tsx

@@ -1,8 +1,8 @@
-import React from "react";
 import cx from "classnames";
+import React from "react";
 import { Grid } from "@/components/Grid/Grid";
-import { GridCol } from "../Grid/GridCol";
 import { Button } from "../Button/Button";
+import { GridCol } from "../Grid/GridCol";
 
 const CLASS_ROOT = "body-banner";
 

package/src/components/BodyBanner/tests/BodyBanner.conformance.test.jsx

@@ -1,5 +1,5 @@
 import { render } from "@testing-library/react";
-import { axe } from 'vitest-axe';
+import { axe } from "vitest-axe";
 
 import { BodyBanner } from "../";
 

package/src/components/Breadcrumbs/BreadcrumbItem.tsx

@@ -1,5 +1,5 @@
-import React from "react";
 import cx from "classnames";
+import React from "react";
 
 interface BreadcrumbItemProps {
   /** Additional CSS classes */

package/src/components/Breadcrumbs/tests/Breadcrumbs.conformance.test.jsx

@@ -1,5 +1,5 @@
 import { render } from "@testing-library/react";
-import { axe } from 'vitest-axe';
+import { axe } from "vitest-axe";
 
 import { Breadcrumbs } from "../";
 

package/src/components/Button/Button.tsx

@@ -1,5 +1,5 @@
-import React from "react";
 import cx from "classnames";
+import React from "react";
 
 export type ButtonSize = "small" | "large";
 export type ButtonType = "primary" | "fill" | "ghost";