@orangesk/orange-design-system 2.0.0-beta.35 → 2.0.0-beta.37

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

@@ -1,42 +1,39 @@
-import React from 'react';
-import { render } from '@testing-library/react';
+import { render } from "@testing-library/react";
 
-import { Sticker } from '../Sticker';
+import { Sticker } from "../Sticker";
 
-describe('rendering Sticker', () => {
-  describe('initial state', () => {
-    it('has default class sticker', () => {
+describe("rendering Sticker", () => {
+  describe("initial state", () => {
+    it("has default class sticker", () => {
       const { getByTestId } = render(<Sticker data-testid="test-id" />);
-      expect(getByTestId('test-id')).toHaveClass('sticker');
+      expect(getByTestId("test-id")).toHaveClass("sticker");
     });
   });
 
-  describe('passed props', () => {
-    it('renders children', () => {
+  describe("passed props", () => {
+    it("renders children", () => {
       const { getByText } = render(<Sticker>test</Sticker>);
-      expect(getByText('test')).toBeInTheDocument();
+      expect(getByText("test")).toBeInTheDocument();
     });
 
-    it('has class test-class when className is set to test-class', () => {
+    it("has class test-class when className is set to test-class", () => {
       const { getByTestId } = render(
-        <Sticker data-testid="test-id" className="test-class" />
+        <Sticker data-testid="test-id" className="test-class" />,
       );
-      expect(getByTestId('test-id')).toHaveClass('test-class');
+      expect(getByTestId("test-id")).toHaveClass("test-class");
     });
-    ['black', 'orange'].map(color => {
+    ["black", "orange"].map((color) => {
       it(`has sticker--${color} class when color is ${color}`, () => {
         const { container } = render(<Sticker color={color} />);
         expect(
-          container.getElementsByClassName(`sticker--${color}`).length
+          container.getElementsByClassName(`sticker--${color}`).length,
         ).toBe(1);
       });
     });
 
-    it('has sticker--small class when size is small', () => {
+    it("has sticker--small class when size is small", () => {
       const { container } = render(<Sticker size="small" />);
-      expect(
-        container.getElementsByClassName('sticker--small').length
-      ).toBe(1);
+      expect(container.getElementsByClassName("sticker--small").length).toBe(1);
     });
   });
 });

package/src/components/Table/Header.tsx

@@ -1,9 +1,8 @@
 "use client";
 
 import React from "react";
-
-import TableContext from "./TableContext";
 import { Cell } from "./Cell";
+import TableContext from "./TableContext";
 import { TableHeader } from "./types";
 
 interface SortOptions {

package/src/components/Table/Row.tsx

@@ -4,9 +4,8 @@ import React from "react";
 
 import { Button } from "../Button/";
 import { Icon } from "../Icon/";
-
-import TableContext from "./TableContext";
 import { Cell } from "./Cell";
+import TableContext from "./TableContext";
 import { TableRow } from "./types";
 
 interface RowProps {

package/src/components/Table/Rows.tsx

@@ -1,9 +1,8 @@
 "use client";
 
 import React from "react";
-
-import TableContext from "./TableContext";
 import { Row } from "./Row";
+import TableContext from "./TableContext";
 import { TableRow } from "./types";
 
 const Rows: React.FC = () => {

package/src/components/Table/Table.tsx

@@ -1,17 +1,16 @@
 "use client";
 
-import React, { useId } from "react";
 import cx from "classnames";
+import React, { useId } from "react";
 
 import ConditionalWrapper from "../../utils/ConditionalWrapper";
 import { useStatic } from "../../utils/hooks";
-
+import { Footer } from "./Footer";
 import { Header } from "./Header";
-import TableContext from "./TableContext";
 import { Rows } from "./Rows";
-import { Footer } from "./Footer";
 import TableStatic from "./Table.static";
-import { TableHeader, TableRow, ExpandableRowsCaptions } from "./types";
+import TableContext from "./TableContext";
+import { ExpandableRowsCaptions, TableHeader, TableRow } from "./types";
 
 interface TableProps extends React.TableHTMLAttributes<HTMLTableElement> {
   /** Caption helps users with screen readers to find a table and understand what it's about and decide if they want to read it. */

package/src/components/Table/index.ts

@@ -1,2 +1,2 @@
-export { Table } from "./Table";
 export { Footer } from "./Footer";
+export { Table } from "./Table";

package/src/components/Table/tests/Footer.unit.test.jsx

@@ -1,7 +1,6 @@
 import { render } from "@testing-library/react";
-
-import TableContext from "../TableContext";
 import { Footer } from "../Footer";
+import TableContext from "../TableContext";
 
 describe("rendering Footer", () => {
   const footers = [

package/src/components/Table/tests/Header.unit.test.jsx

@@ -1,7 +1,6 @@
 import { render } from "@testing-library/react";
-
-import TableContext from "../TableContext";
 import { Header } from "../Header.tsx";
+import TableContext from "../TableContext";
 
 describe("rendering Header", () => {
   const headers = [

package/src/components/Table/tests/Row.unit.test.jsx

@@ -1,7 +1,6 @@
 import { render } from "@testing-library/react";
-
-import TableContext from "../TableContext";
 import { Row } from "../Row";
+import TableContext from "../TableContext";
 
 describe("rendering Row", () => {
   const expandrow = {

package/src/components/Table/tests/Rows.unit.test.jsx

@@ -1,7 +1,6 @@
 import { render } from "@testing-library/react";
-
-import TableContext from "../TableContext";
 import { Rows } from "../Rows";
+import TableContext from "../TableContext";
 
 describe("rendering Rows", () => {
   const rows = [

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

@@ -1,21 +1,21 @@
 import { render } from "@testing-library/react";
-import { axe } from 'vitest-axe';
+import { axe } from "vitest-axe";
 
 import "../../../../__mocks__/resizeObserverMock";
 import { Table } from "../";
 import {
-  headers,
-  rows,
-  unsortedHeaders,
   ascendingHeaders,
-  descendingHeaders,
-  sortableRows,
   ascendingRowsByDate,
+  descendingHeaders,
   descendingRowsByDate,
   expandableTableRows,
   footer,
+  headers,
+  rows,
   scrollableHeaders,
   scrollableRows,
+  sortableRows,
+  unsortedHeaders,
 } from "../docsData";
 
 const defaultProps = {

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

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

package/src/components/Tabs/Tabs.tsx

@@ -1,12 +1,12 @@
 "use client";
 
-import React from "react";
 import cx from "classnames";
+import React from "react";
 
 import { useStatic } from "../../utils/hooks";
 import { Tab } from "./Tab";
-import TabsStatic from "./Tabs.static";
 import type { TabPanelProps } from "./TabPanel";
+import TabsStatic from "./Tabs.static";
 
 export const variants = ["standard", "light"] as const;
 

package/src/components/Tabs/index.ts

@@ -1,3 +1,3 @@
-export { Tabs } from "./Tabs";
-export { TabPanel } from "./TabPanel";
 export { Tab } from "./Tab";
+export { TabPanel } from "./TabPanel";
+export { Tabs } from "./Tabs";

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

@@ -1,8 +1,7 @@
-import { render, fireEvent, screen } from "@testing-library/react";
+import { fireEvent, render, screen } from "@testing-library/react";
 import userEvent from "@testing-library/user-event";
-
-import { Tabs } from "../Tabs";
 import { TabPanel } from "../TabPanel";
+import { Tabs } from "../Tabs";
 
 const arr = [1, 2, 3, 4];
 

package/src/components/Tag/Tag.tsx

@@ -1,5 +1,5 @@
-import React from "react";
 import cx from "classnames";
+import React from "react";
 import { TagButtonProps } from "./TagButton";
 
 export const colors = [

package/src/components/Tag/TagButton.tsx

@@ -1,5 +1,5 @@
-import React from "react";
 import cx from "classnames";
+import React from "react";
 
 import { Icon } from "@/components/Icon";
 import { CLASS_ROOT } from "./Tag";

package/src/components/Tag/index.ts

@@ -1,3 +1,3 @@
+export type { TagColor, TagSize } from "./Tag";
 export { Tag } from "./Tag";
 export { TagButton } from "./TagButton";
-export type { TagColor, TagSize } from "./Tag";

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

@@ -1,8 +1,7 @@
 import { render } from "@testing-library/react";
-import { axe } from 'vitest-axe';
-
-import { colors } from "../Tag";
+import { axe } from "vitest-axe";
 import { Tag, TagButton } from "..";
+import { colors } from "../Tag";
 
 const sizes = ["small", "large"];
 

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

@@ -1,8 +1,6 @@
 import { render } from "@testing-library/react";
-
-import { Tag } from "../Tag";
+import { colors, Tag } from "../Tag";
 import { TagButton } from "../TagButton";
-import { colors } from "../Tag";
 
 describe("rendering", () => {
   describe("initial state", () => {

package/src/components/Tag/tests/TagButton.conformance.test.jsx

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

package/src/components/Tag/tests/TagButton.unit.test.jsx

@@ -1,5 +1,5 @@
+import { fireEvent, render } from "@testing-library/react";
 import React from "react";
-import { render, fireEvent } from "@testing-library/react";
 
 import { TagButton } from "../TagButton";
 

package/src/components/Testimonial/Testimonial.tsx

@@ -1,33 +1,33 @@
-import React from 'react';
-import cx from 'classnames';
+import cx from "classnames";
+import React from "react";
 
 interface TestimonialProps {
   className?: string;
   children?: React.ReactNode;
-  color?: 'default' | 'orange';
+  color?: "default" | "orange";
   isDiv?: boolean;
   [key: string]: any;
 }
 
-const CLASS_ROOT = 'testimonial';
+const CLASS_ROOT = "testimonial";
 
-export const Testimonial: React.FC<TestimonialProps> = ({ 
-  className, 
-  children, 
-  color = 'default', 
-  isDiv = false, 
-  ...other 
+export const Testimonial: React.FC<TestimonialProps> = ({
+  className,
+  children,
+  color = "default",
+  isDiv = false,
+  ...other
 }) => {
-  const Tag = isDiv ? 'div' : 'p';
+  const Tag = isDiv ? "div" : "p";
 
   const classes = cx(
     CLASS_ROOT,
     {
-      [`testimonial--${color}`]: color === 'orange',
+      [`testimonial--${color}`]: color === "orange",
     },
-    className
+    className,
   );
-  
+
   return (
     <Tag className={classes} {...other}>
       {children}
@@ -35,4 +35,4 @@ export const Testimonial: React.FC<TestimonialProps> = ({
   );
 };
 
-Testimonial.displayName = 'Testimonial';
+Testimonial.displayName = "Testimonial";

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

@@ -1,17 +1,16 @@
-import React from 'react';
-import { render } from '@testing-library/react';
-import { axe } from 'vitest-axe';
+import { render } from "@testing-library/react";
+import { axe } from "vitest-axe";
 
-import { Testimonial } from '../';
+import { Testimonial } from "../";
 
 const example = <Testimonial />;
 
-it('is valid html', () => {
+it("is valid html", () => {
   const { container } = render(example);
   expect(container).toHTMLValidate();
 });
 
-it('is accessible', async () => {
+it("is accessible", async () => {
   const { container } = render(example);
   expect(await axe(container)).toHaveNoViolations();
 });

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

@@ -1,44 +1,43 @@
-import React from 'react';
-import { render } from '@testing-library/react';
+import { render } from "@testing-library/react";
 
-import { Testimonial } from '../';
+import { Testimonial } from "../";
 
-describe('rendering Testimonial', () => {
-  describe('initial state', () => {
-    it('has default class testimonial', () => {
+describe("rendering Testimonial", () => {
+  describe("initial state", () => {
+    it("has default class testimonial", () => {
       const { getByTestId } = render(<Testimonial data-testid="test-id" />);
-      expect(getByTestId('test-id')).toHaveClass('testimonial');
+      expect(getByTestId("test-id")).toHaveClass("testimonial");
     });
-    it('its rendered as paragraph', () => {
+    it("its rendered as paragraph", () => {
       const { getByTestId } = render(<Testimonial data-testid="test-id" />);
-      expect(getByTestId('test-id').tagName).toBe('P');
+      expect(getByTestId("test-id").tagName).toBe("P");
     });
   });
 
-  describe('passed props', () => {
-    it('renders children', () => {
+  describe("passed props", () => {
+    it("renders children", () => {
       const { getByText } = render(<Testimonial>test</Testimonial>);
-      expect(getByText('test')).toBeInTheDocument();
+      expect(getByText("test")).toBeInTheDocument();
     });
-    it('has additional class when className is set', () => {
+    it("has additional class when className is set", () => {
       const { getByTestId } = render(
-        <Testimonial className="test" data-testid="test-id" />
+        <Testimonial className="test" data-testid="test-id" />,
       );
-      expect(getByTestId('test-id')).toHaveClass('testimonial');
-      expect(getByTestId('test-id')).toHaveClass('test');
+      expect(getByTestId("test-id")).toHaveClass("testimonial");
+      expect(getByTestId("test-id")).toHaveClass("test");
     });
-    it('has additional className testimonial--orange prop color with value orange is passed', () => {
+    it("has additional className testimonial--orange prop color with value orange is passed", () => {
       const { getByTestId } = render(
-        <Testimonial className="test" data-testid="test-id" color="orange" />
+        <Testimonial className="test" data-testid="test-id" color="orange" />,
       );
-      expect(getByTestId('test-id')).toHaveClass('testimonial');
-      expect(getByTestId('test-id')).toHaveClass('testimonial--orange');
+      expect(getByTestId("test-id")).toHaveClass("testimonial");
+      expect(getByTestId("test-id")).toHaveClass("testimonial--orange");
     });
-    it('its rendered as div when isDiv prop is passed', () => {
+    it("its rendered as div when isDiv prop is passed", () => {
       const { getByTestId } = render(
-        <Testimonial data-testid="test-id" isDiv />
+        <Testimonial data-testid="test-id" isDiv />,
       );
-      expect(getByTestId('test-id').tagName).toBe('DIV');
+      expect(getByTestId("test-id").tagName).toBe("DIV");
     });
   });
 });

package/src/components/Tile/Tile.tsx

@@ -1,9 +1,8 @@
-import React, { ReactNode } from "react";
 import cx from "classnames";
-
-import { Image } from "../Image";
+import React, { ReactNode } from "react";
 import { Icon } from "../Icon";
 import { IconProps } from "../Icon/Icon";
+import { Image } from "../Image";
 
 export const tileColors = [
   "surface-primary",

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

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

package/src/components/Tooltip/InfoTooltip.tsx

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