@axa-fr/design-system-look-and-feel-react 0.2.0-beta.339 → 0.2.0-beta.352

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@axa-fr/design-system-look-and-feel-react",
-  "version": "0.2.0-beta.339",
+  "version": "0.2.0-beta.352",
   "description": "",
   "exports": {
     ".": {
@@ -17,14 +17,14 @@
   ],
   "scripts": {
     "prebuild": "rimraf dist",
-    "build": "tsc",
+    "build": "tsc -p tsconfig.build.json",
     "postbuild": "copyfiles --up 1 \"src/assets/svg/*.svg\" ./dist/",
     "start:storybook": "storybook dev -p 6009",
     "build:storybook": "storybook build",
     "eslint": "eslint \"src/**/*.{js,jsx,ts,tsx}\"",
     "eslint:fix": "eslint src --ext js,jsx,ts,tsx --fix",
-    "prettier": "prettier \"src/**/*.!(js|jsx|ts|tsx)\" --check",
-    "prettier:fix": "prettier \"src/**/*.!(js|jsx|ts|tsx)\" --write",
+    "prettier": "prettier \"src/**/*.!(js|jsx|ts|tsx|svg)\" --check",
+    "prettier:fix": "prettier \"src/**/*.!(js|jsx|ts|tsx|svg)\" --write",
     "tsc": "tsc --noEmit",
     "test": "vitest",
     "test:ui": "vitest --ui",
@@ -41,7 +41,7 @@
   },
   "homepage": "https://github.com/AxaFrance/design-system#readme",
   "peerDependencies": {
-    "@axa-fr/design-system-look-and-feel-css": "0.2.0-beta.339",
+    "@axa-fr/design-system-look-and-feel-css": "0.2.0-beta.352",
     "@material-symbols/svg-400": ">= 0.19.0",
     "react": ">= 18"
   },
@@ -59,18 +59,21 @@
     "react-select": "^5.8.0"
   },
   "devDependencies": {
+    "@chromatic-com/storybook": "^1.9.0",
     "@material-symbols/svg-400": "*",
-    "@storybook/addon-docs": "^7.6.14",
-    "@storybook/addon-essentials": "^7.6.14",
-    "@storybook/addon-interactions": "^7.6.14",
-    "@storybook/addon-links": "^7.6.14",
-    "@storybook/addon-mdx-gfm": "^7.6.14",
-    "@storybook/addon-onboarding": "^1.0.10",
-    "@storybook/addons": "^7.6.14",
-    "@storybook/blocks": "^7.6.14",
-    "@storybook/react": "^7.6.14",
-    "@storybook/react-vite": "^7.6.14",
-    "@storybook/test": "^7.6.14",
+    "@storybook/addon-docs": "^8.3.5",
+    "@storybook/addon-essentials": "^8.3.5",
+    "@storybook/addon-interactions": "^8.3.5",
+    "@storybook/addon-links": "^8.3.5",
+    "@storybook/addon-mdx-gfm": "^8.3.5",
+    "@storybook/addon-onboarding": "^8.3.5",
+    "@storybook/addons": "^7.6.17",
+    "@storybook/blocks": "^8.3.5",
+    "@storybook/manager-api": "^8.3.5",
+    "@storybook/react": "^8.3.5",
+    "@storybook/react-vite": "^8.3.5",
+    "@storybook/test": "^8.3.5",
+    "@storybook/theming": "^8.3.5",
     "@testing-library/dom": "^10.1.0",
     "@testing-library/jest-dom": "^6.5.0",
     "@testing-library/react": "^15.0.7",
@@ -95,6 +98,7 @@
     "eslint-plugin-prettier": "^5.1.3",
     "eslint-plugin-react": "^7.36.1",
     "eslint-plugin-react-hooks": "^4.6.0",
+    "eslint-plugin-storybook": "^0.9.0",
     "jest-axe": "^8.0.0",
     "jsdom": "^24.0.0",
     "prettier": "^3.3.3",
@@ -102,7 +106,7 @@
     "react": "^18.3.1",
     "react-dom": "^18.2.0",
     "rimraf": "^5.0.5",
-    "storybook": "^7.6.14",
+    "storybook": "^8.3.5",
     "tsc-files": "^1.1.4",
     "typescript": "^5.4.4",
     "vitest": "^2.0.5"

package/dist/Accordion/Accordion.stories.d.ts

@@ -1,7 +0,0 @@
-import { Meta, StoryObj } from "@storybook/react";
-import type { ComponentProps } from "react";
-import { Accordion } from ".";
-declare const meta: Meta<typeof Accordion>;
-export default meta;
-export declare const AccordionStory: StoryObj<ComponentProps<typeof Accordion>>;
-export declare const AccordionWithCardStory: StoryObj<ComponentProps<typeof Accordion>>;

package/dist/Accordion/Accordion.stories.js

@@ -1,40 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import callIcon from "@material-symbols/svg-400/outlined/call-fill.svg";
-import { Accordion } from ".";
-import { Card, Svg } from "..";
-const meta = {
-    component: Accordion,
-    title: "Components/Accordion",
-};
-export default meta;
-const defaultArgs = {
-    isTitleFirst: true,
-    icon: _jsx(Svg, { src: callIcon }),
-    title: "Titre onglet",
-    subtitle: "Titre onglet",
-    tagLabel: "En attente",
-    dateLabel: "01/01/2021",
-    dateProps: { dateTime: "2021-01-01" },
-    value: "+ 686,00 €",
-    children: `Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam semper magna et tempor blandit. 
-              Nulla vitae eros a odio pretium gravida. Sed eget tortor nec massa lobortis bibendum. Morbi eget 
-              ligula porttitor, euismod odio vestibulum, porta massa. Aenean vel venenatis tellus, sed iaculis nisl.`,
-    isOpen: undefined,
-    onClick: undefined,
-};
-export const AccordionStory = {
-    name: "Accordion",
-    render: (args) => _jsx(Accordion, { ...args }),
-    args: defaultArgs,
-    argTypes: {
-        dateLabel: { control: "text" },
-    },
-};
-export const AccordionWithCardStory = {
-    name: "Accordion With Card",
-    render: (args) => (_jsx(Card, { classModifier: "large accordion", tabIndex: undefined, children: _jsx(Accordion, { ...args }) })),
-    args: defaultArgs,
-    argTypes: {
-        dateLabel: { control: "text" },
-    },
-};

package/dist/Accordion/__tests__/Accordion.test.d.ts

@@ -1 +0,0 @@
-export {};

package/dist/Accordion/__tests__/Accordion.test.js

@@ -1,50 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { render, screen } from "@testing-library/react";
-import { Accordion } from "../Accordion";
-describe("Accordion", () => {
-    const originalWindowWidth = global.innerWidth;
-    beforeAll(() => {
-        global.innerWidth = originalWindowWidth;
-    });
-    it("renders correctly with all visual props", () => {
-        const icon = "Accordion Icon";
-        const title = "Accordion Title";
-        const subtitle = "Accordion Subtitle";
-        const children = "Accordion Content";
-        const tag = "Accordion Tag";
-        const date = "Accordion Date";
-        const value = "Accordion Value";
-        render(_jsx(Accordion, { icon: icon, title: title, subtitle: subtitle, tagLabel: tag, dateLabel: date, value: value, children: children }));
-        expect(screen.getByText(icon)).toBeInTheDocument();
-        expect(screen.getByText(title)).toBeInTheDocument();
-        expect(screen.getByText(subtitle)).toBeInTheDocument();
-        expect(screen.getByText(children)).toBeInTheDocument();
-        expect(screen.getByText(tag)).toBeInTheDocument();
-        expect(screen.getByText(date)).toBeInTheDocument();
-        expect(screen.getByText(value)).toBeInTheDocument();
-        expect(screen.getByText("Accordion Content").closest("details")).toHaveClass("af-accordion");
-    });
-    it("renders with isTitleFirst false", () => {
-        render(_jsx(Accordion, { icon: "icon", title: "Accordion Title", dateLabel: "date", isTitleFirst: false, children: "Accordion Content" }));
-        const summary = screen.getByText("Accordion Title").closest("summary");
-        expect(summary).not.toHaveClass("af-accordion__summary--title-first");
-        expect(screen.queryByText("icon")).toBeNull();
-        expect(screen
-            .getByText("date")
-            .compareDocumentPosition(screen.getByText("Accordion Title"))).toBe(Node.DOCUMENT_POSITION_FOLLOWING);
-    });
-    it("renders with isTitleFirst true", () => {
-        render(_jsx(Accordion, { icon: "icon", title: "Accordion Title", dateLabel: "date", isTitleFirst: true, children: "Accordion Content" }));
-        const summary = screen.getByText("Accordion Title").closest("summary");
-        expect(summary).toHaveClass("af-accordion__summary--title-first");
-        expect(screen.getByText("icon").parentElement).toHaveClass("af-accordion__title-container");
-        expect(screen
-            .getByText("date")
-            .compareDocumentPosition(screen.getByText("Accordion Title"))).toBe(Node.DOCUMENT_POSITION_PRECEDING);
-    });
-    it("renders on mobile", () => {
-        global.innerWidth = 500;
-        render(_jsx(Accordion, { icon: "icon", title: "Accordion Title", dateLabel: "date", children: "Accordion Content" }));
-        expect(screen.getByText("icon").parentElement).toHaveClass("af-accordion__summary");
-    });
-});

package/dist/Accordion/__tests__/AccordionTagDateContainer.test.d.ts

@@ -1 +0,0 @@
-export {};

package/dist/Accordion/__tests__/AccordionTagDateContainer.test.js

@@ -1,23 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { render, screen } from "@testing-library/react";
-import { AccordionTagDateContainer } from "../AccordionTagDateContainer";
-describe("AccordionTagDateContainer", () => {
-    it("renders correctly", () => {
-        const dateLabel = "01/01/2021";
-        const dateTime = "2021-01-01";
-        const tagLabel = "tag";
-        render(_jsx(AccordionTagDateContainer, { tagLabel: tagLabel, dateLabel: dateLabel, dateProps: { dateTime } }));
-        expect(screen.getByText(tagLabel).parentElement).toHaveClass("af-tag af-tag--warning");
-        expect(screen.getByText(dateLabel)).toHaveProperty("dateTime", dateTime);
-    });
-    it("should pass tagProps to Tag", () => {
-        const tag = "tag";
-        const tagProps = { classModifier: "success" };
-        render(_jsx(AccordionTagDateContainer, { tagLabel: tag, tagProps: tagProps }));
-        expect(screen.getByText(tag).parentElement).toHaveClass("af-tag af-tag--success");
-    });
-    it("should return null if no tag or date", () => {
-        const { container } = render(_jsx(AccordionTagDateContainer, {}));
-        expect(container).toBeEmptyDOMElement();
-    });
-});

package/dist/AccordionCore/AccordionCore.stories.d.ts

@@ -1,8 +0,0 @@
-import { Meta, StoryObj } from "@storybook/react";
-import type { ComponentProps } from "react";
-import { AccordionCore } from ".";
-declare const meta: Meta<typeof AccordionCore>;
-export default meta;
-export declare const AccordionCoreStory: StoryObj<ComponentProps<typeof AccordionCore>>;
-export declare const AccordionCoreWithCustomStyledSummaryStory: StoryObj<ComponentProps<typeof AccordionCore>>;
-export declare const AccordionCoreWithCardStory: StoryObj<ComponentProps<typeof AccordionCore>>;

package/dist/AccordionCore/AccordionCore.stories.js

@@ -1,41 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { AccordionCore } from ".";
-import { Card } from "..";
-const meta = {
-    component: AccordionCore,
-    title: "Components/AccordionCore",
-};
-export default meta;
-const defaultArgs = {
-    summary: "Titre onglet",
-    children: `Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam semper magna et tempor blandit. 
-              Nulla vitae eros a odio pretium gravida. Sed eget tortor nec massa lobortis bibendum. Morbi eget 
-              ligula porttitor, euismod odio vestibulum, porta massa. Aenean vel venenatis tellus, sed iaculis nisl.`,
-    isOpen: undefined,
-    onClick: undefined,
-};
-export const AccordionCoreStory = {
-    name: "AccordionCore",
-    render: (args) => _jsx(AccordionCore, { ...args }),
-    args: defaultArgs,
-};
-export const AccordionCoreWithCustomStyledSummaryStory = {
-    name: "AccordionCore With Custom Styled Summary",
-    render: (args) => _jsx(AccordionCore, { ...args }),
-    args: {
-        summary: (_jsx("div", { style: {
-                backgroundColor: "red",
-                paddingBottom: "32px",
-            } })),
-        children: `Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam semper magna et tempor blandit. 
-              Nulla vitae eros a odio pretium gravida. Sed eget tortor nec massa lobortis bibendum. Morbi eget 
-              ligula porttitor, euismod odio vestibulum, porta massa. Aenean vel venenatis tellus, sed iaculis nisl.`,
-        isOpen: undefined,
-        onClick: undefined,
-    },
-};
-export const AccordionCoreWithCardStory = {
-    name: "AccordionCore With Card",
-    render: (args) => (_jsx(Card, { classModifier: "large accordion", tabIndex: undefined, children: _jsx(AccordionCore, { ...args }) })),
-    args: defaultArgs,
-};

package/dist/AccordionCore/__tests__/AccordionCore.test.d.ts

@@ -1 +0,0 @@
-export {};

package/dist/AccordionCore/__tests__/AccordionCore.test.js

@@ -1,47 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { render, screen } from "@testing-library/react";
-import { AccordionCore } from "../AccordionCore";
-describe("AccordionCore", () => {
-    it("renders correctly with all visual props", () => {
-        const title = "Accordion Title";
-        const children = "Accordion Content";
-        render(_jsx(AccordionCore, { summary: title, children: children }));
-        expect(screen.getByText(title)).toBeInTheDocument();
-        expect(screen.getByText(children)).toBeInTheDocument();
-        expect(screen.getByText("Accordion Content").closest("details")).toHaveClass("af-accordion");
-        const details = screen.getByText(children).closest("details");
-        expect(details).not.toHaveAttribute("open");
-        const summary = screen.getByText("Accordion Title");
-        summary.click();
-        expect(details).toHaveAttribute("open");
-        summary.click();
-        expect(details).not.toHaveAttribute("open");
-    });
-    it("should have custom class with modifier", () => {
-        const className = "custom-class";
-        const classModifier = "modifier";
-        render(_jsx(AccordionCore, { summary: "Accordion Title", className: className, classModifier: classModifier, children: "Accordion Content" }));
-        expect(screen.getByText("Accordion Content").closest("details")).toHaveClass(`${className} ${className}--${classModifier}`);
-    });
-    it("renders Accordion with open details", () => {
-        render(_jsx(AccordionCore, { summary: "Accordion Title", isOpen: true, children: "Accordion Content" }));
-        const details = screen.getByText("Accordion Content").closest("details");
-        expect(details).toHaveAttribute("open");
-    });
-    it("renders Accordion with close details", () => {
-        render(_jsx(AccordionCore, { summary: "Accordion Title", isOpen: false, children: "Accordion Content" }));
-        const details = screen.getByText("Accordion Content").closest("details");
-        expect(details).not.toHaveAttribute("open");
-    });
-    it("use onClick prop when summary click", () => {
-        const onClick = vi.fn();
-        render(_jsx(AccordionCore, { summary: "Accordion Title", onClick: onClick, children: "Accordion Content" }));
-        const summary = screen.getByText("Accordion Title");
-        summary.click();
-        expect(onClick).toHaveBeenCalled();
-    });
-    it("renders with custom title summary", () => {
-        render(_jsx(AccordionCore, { summary: _jsx("p", { className: "custom-title", children: "Custom Title" }), children: "Accordion Content" }));
-        expect(screen.getByText("Custom Title")).toHaveClass("custom-title");
-    });
-});

package/dist/Alert/Alert.stories.d.ts

@@ -1,6 +0,0 @@
-import { Meta, StoryObj } from "@storybook/react";
-import { Alert } from "./Alert";
-declare const meta: Meta<typeof Alert>;
-export default meta;
-export declare const Default: StoryObj<typeof Alert>;
-export declare const WithButtonAction: StoryObj<typeof Alert>;

package/dist/Alert/Alert.stories.js

@@ -1,37 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { Alert } from "./Alert";
-import { Link } from "../Link/Link";
-import { ButtonClient, Variants } from "../Button/Button";
-const MODIFIERS = ["information", "neutral", "error", "validation", "warning"];
-const meta = {
-    title: "Components/Alert",
-    component: Alert,
-};
-export default meta;
-export const Default = {
-    name: "Default",
-    args: {
-        title: "My Alert title",
-        type: "information",
-        children: "Vestibulum nunc neque, sodales non luctus in, dictum vitae nisl. Curabitur vitae massa non nisl lacinia tempus. Pellentesque id nulla tortor.",
-        action: (_jsx(Link, { openInNewTab: true, href: "https://fakelink.com", children: "Plus de d\u00E9tails" })),
-        iconSize: 24,
-    },
-    argTypes: {
-        type: {
-            options: MODIFIERS,
-            control: { type: "select" },
-            defaultValue: "information",
-        },
-    },
-};
-export const WithButtonAction = {
-    name: "Alert with Button action",
-    args: {
-        title: "My Alert title",
-        type: "information",
-        children: "Vestibulum nunc neque, sodales non luctus in, dictum vitae nisl. Curabitur vitae massa non nisl lacinia tempus. Pellentesque id nulla tortor.",
-        action: _jsx(ButtonClient, { variant: Variants.ghost, children: "Actualiser" }),
-        iconSize: 24,
-    },
-};

package/dist/Alert/__tests__/Alert.test.d.ts

@@ -1 +0,0 @@
-export {};

package/dist/Alert/__tests__/Alert.test.js

@@ -1,33 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { render, screen } from "@testing-library/react";
-import { Alert, alertTypes } from "../Alert";
-import { Link } from "../../Link/Link";
-import { ButtonClient, Variants } from "../../Button/Button";
-const MoreDetails = () => (_jsx(Link, { openInNewTab: true, href: "https://fakelink.com", children: "Plus de d\u00E9tails" }));
-describe("Alert", () => {
-    it.each `
-    type                      | title         | children       | action                                                                | icon                     | iconSize     | expectLink | expectButton
-    ${undefined}              | ${undefined}  | ${undefined}   | ${undefined}                                                          | ${"wb_incandescent.svg"} | ${undefined} | ${false}   | ${false}
-    ${alertTypes.information} | ${"my title"} | ${"some text"} | ${(_jsx(MoreDetails, {}))}                                                  | ${"wb_incandescent.svg"} | ${undefined} | ${true}    | ${false}
-    ${alertTypes.error}       | ${"my title"} | ${"some text"} | ${(_jsx(MoreDetails, {}))}                                                  | ${"emergency_home.svg"}  | ${undefined} | ${true}    | ${false}
-    ${alertTypes.neutral}     | ${"my title"} | ${"some text"} | ${(_jsx(MoreDetails, {}))}                                                  | ${"error.svg"}           | ${undefined} | ${true}    | ${false}
-    ${alertTypes.validation}  | ${"my title"} | ${"some text"} | ${(_jsx(MoreDetails, {}))}                                                  | ${"check_circle.svg"}    | ${undefined} | ${true}    | ${false}
-    ${alertTypes.warning}     | ${"my title"} | ${"some text"} | ${(_jsx(ButtonClient, { variant: Variants.ghost, children: "Actualiser" }))} | ${"error.svg"}           | ${undefined} | ${false}   | ${true}
-  `("Should render correctly with type: $type, title: $title, children: $children, icon: $icon, action: $action, iconSize: $iconSize", ({ type, title, children, action, icon, iconSize, expectLink, expectButton, }) => {
-        const { container } = render(_jsx(Alert, { type, title, action, iconSize, children: children }));
-        if (title) {
-            expect(screen.getByText(RegExp(title))).toBeDefined();
-        }
-        if (children) {
-            expect(screen.getByText(RegExp(children))).toBeDefined();
-        }
-        expect(screen.getByRole("alert")).toHaveClass(`af-alert--${type || alertTypes.information}`);
-        if (expectLink && action) {
-            expect(screen.getByRole("link")).toHaveAttribute("href", "https://fakelink.com");
-        }
-        if (expectButton && action) {
-            expect(screen.getByRole("button", { name: /Actualiser/ })).toBeInTheDocument();
-        }
-        expect(container.querySelector(`[data-src$="${icon}"]`)).toBeDefined();
-    });
-});

package/dist/Button/Button.stories.d.ts

@@ -1,22 +0,0 @@
-import type { Meta, StoryObj } from "@storybook/react";
-import { ReactNode } from "react";
-import { ButtonClient, Variants } from "./Button";
-declare const meta: Meta<typeof ButtonClient>;
-export default meta;
-type StoryProps = Omit<React.ComponentProps<typeof ButtonClient>, "children" | "variant" | "disabled" | "iconLeft" | "iconRight"> & {
-    children: string;
-    variant: Variants;
-    disabled: boolean;
-    iconLeft: ReactNode;
-    iconRight: ReactNode;
-};
-type Story = StoryObj<StoryProps>;
-export declare const Playground: Story;
-export declare const Business: StoryObj<typeof ButtonClient>;
-export declare const Secondary: StoryObj<typeof ButtonClient>;
-export declare const SecondaryError: StoryObj<typeof ButtonClient>;
-export declare const Tertiary: StoryObj<typeof ButtonClient>;
-export declare const Ghost: StoryObj<typeof ButtonClient>;
-export declare const MultiExamples: StoryObj<typeof ButtonClient>;
-export declare const WithIconRight: StoryObj<typeof ButtonClient>;
-export declare const WithIconLeft: StoryObj<typeof ButtonClient>;

package/dist/Button/Button.stories.js

@@ -1,99 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import accountBalance from "@material-symbols/svg-400/outlined/account_balance.svg";
-import arrowBack from "@material-symbols/svg-400/outlined/arrow_back.svg";
-import biotech from "@material-symbols/svg-400/outlined/biotech.svg";
-import code from "@material-symbols/svg-400/outlined/code.svg";
-import fireExtinguisher from "@material-symbols/svg-400/outlined/fire_extinguisher.svg";
-import heartBroken from "@material-symbols/svg-400/outlined/heart_broken.svg";
-import { ButtonClient, Variants } from "./Button";
-import { Svg } from "../Svg";
-const meta = {
-    component: ButtonClient,
-    title: "Components/Button",
-    parameters: {
-        layout: "centered",
-    },
-    argTypes: { onClick: { action: "clicked" } },
-};
-export default meta;
-export const Playground = {
-    name: "Button",
-    render: ({ children: text, variant, disabled, iconLeft, iconRight, onClick, ...args }) => (_jsx(ButtonClient, { variant: variant, iconLeft: iconLeft, iconRight: iconRight, disabled: disabled, onClick: onClick, ...args, children: text })),
-    args: {
-        children: "Button",
-    },
-    argTypes: {
-        variant: {
-            options: Variants,
-            control: { type: "multi-select" },
-        },
-        iconLeft: {
-            control: { type: "input" },
-        },
-        iconRight: {
-            control: { type: "input" },
-        },
-    },
-};
-export const Business = {
-    name: "Button business",
-    args: {
-        children: "Button Business",
-        variant: Variants.business,
-    },
-};
-export const Secondary = {
-    name: "Button secondary",
-    args: {
-        children: "Button Secondary",
-        variant: Variants.secondary,
-    },
-};
-export const SecondaryError = {
-    name: "Button secondary error",
-    args: {
-        children: "Button Secondary Error",
-        variant: Variants.secondaryError,
-    },
-};
-export const Tertiary = {
-    name: "Button tertiary",
-    args: {
-        children: "Button Tertiary",
-        variant: Variants.tertiary,
-    },
-};
-export const Ghost = {
-    name: "Button ghost",
-    args: {
-        children: "Button Ghost",
-        variant: Variants.ghost,
-    },
-};
-export const MultiExamples = {
-    name: "Button examples",
-    render: () => {
-        return (_jsxs("div", { style: {
-                display: "flex",
-                justifyContent: "space-evenly",
-                alignItems: "center",
-                padding: "2rem",
-                flexWrap: "wrap",
-                gap: "2rem",
-            }, children: [_jsx(ButtonClient, { children: "Button Default" }), _jsx(ButtonClient, { disabled: true, children: "Button Disabled" }), _jsx(ButtonClient, { variant: Variants.business, children: "Button Business" }), _jsx(ButtonClient, { variant: Variants.business, disabled: true, children: "Button Business Disabled" }), _jsx(ButtonClient, { variant: Variants.secondary, children: "Button Secondary" }), _jsx(ButtonClient, { variant: Variants.secondary, disabled: true, children: "Button Secondary Disabled" }), _jsx(ButtonClient, { variant: Variants.secondaryError, children: "Button Secondary Error" }), _jsx(ButtonClient, { variant: Variants.secondaryError, disabled: true, children: "Button Secondary Error Disabled" }), _jsx(ButtonClient, { variant: Variants.tertiary, children: "Button Tertiary" }), _jsx(ButtonClient, { variant: Variants.tertiary, disabled: true, children: "Button Tertiary Disabled" }), _jsx(ButtonClient, { variant: Variants.ghost, children: "Button Ghost" }), _jsx(ButtonClient, { iconRight: _jsx(Svg, { src: arrowBack, fill: "white" }), children: "test" }), _jsx(ButtonClient, { variant: Variants.secondary, iconRight: _jsx(Svg, { src: code, fill: "#00008F" }), children: "With icon" }), _jsx(ButtonClient, { variant: Variants.tertiary, iconLeft: _jsx(Svg, { src: fireExtinguisher, fill: "#00008F" }), children: "With icon" }), _jsx(ButtonClient, { variant: Variants.business, iconRight: _jsx(Svg, { src: biotech, fill: "white" }), children: "With icon" }), _jsx(ButtonClient, { variant: Variants.ghost, iconLeft: _jsx(Svg, { src: accountBalance, fill: "#00008F" }), iconRight: _jsx(Svg, { src: heartBroken, fill: "#00008F" }), children: "With icon MULTI" })] }));
-    },
-};
-export const WithIconRight = {
-    name: "Button with right icon",
-    args: {
-        children: "With icon",
-        iconRight: _jsx(Svg, { src: heartBroken }),
-    },
-};
-export const WithIconLeft = {
-    name: "Button with left icon",
-    args: {
-        children: "With icon",
-        iconLeft: _jsx(Svg, { src: heartBroken }),
-    },
-};

package/dist/Card/Card.stories.d.ts

@@ -1,6 +0,0 @@
-import type { Meta, StoryObj } from "@storybook/react";
-import { Card } from ".";
-declare const meta: Meta<typeof Card>;
-export default meta;
-export declare const Default: StoryObj<typeof Card>;
-export declare const ButtonCard: StoryObj<typeof Card>;

package/dist/Card/Card.stories.js

@@ -1,40 +0,0 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { Card } from ".";
-const MODIFIERS = [" ", "elevation-2"];
-const CUSTOM_CHILDREN = (_jsxs(_Fragment, { children: [_jsx("h1", { className: "af-card__title", children: "My card title" }), _jsx("p", { children: "My card content" })] }));
-const meta = {
-    title: "Components/Card",
-    component: Card,
-};
-export default meta;
-export const Default = {
-    name: "Card",
-    render: (args) => _jsx(Card, { ...args }),
-    args: {
-        children: CUSTOM_CHILDREN,
-        classModifier: " ",
-    },
-    argTypes: {
-        classModifier: {
-            options: MODIFIERS,
-            control: { type: "select" },
-            defaultValue: " ",
-        },
-    },
-};
-export const ButtonCard = {
-    name: "Button Card",
-    render: (args) => _jsx(Card, { ...args }),
-    args: {
-        children: CUSTOM_CHILDREN,
-        classModifier: " ",
-    },
-    argTypes: {
-        classModifier: {
-            options: MODIFIERS,
-            control: { type: "select" },
-            defaultValue: " ",
-        },
-        onClick: { action: "onClick" },
-    },
-};

package/dist/Card/__tests__/Card.test.d.ts

@@ -1 +0,0 @@
-export {};

package/dist/Card/__tests__/Card.test.js

@@ -1,27 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { render, screen, waitFor } from "@testing-library/react";
-import userEvent from "@testing-library/user-event";
-import { Card } from "../Card";
-describe("Card", () => {
-    it("should render children", () => {
-        render(_jsx(Card, { children: "A card" }));
-        const card = screen.getByText("A card");
-        expect(card).toHaveClass("af-card");
-    });
-    it("should have custom class", () => {
-        render(_jsx(Card, { className: "custom-class", children: "A card" }));
-        expect(screen.getByText("A card")).toHaveClass("custom-class");
-    });
-    it("should have custom class with modifier", () => {
-        render(_jsx(Card, { className: "custom-class", classModifier: "modifier", children: "A card" }));
-        expect(screen.getByText("A card")).toHaveClass("custom-class custom-class--modifier");
-    });
-    it("should call onClick when card button clicked", async () => {
-        const onClick = vi.fn();
-        render(_jsx(Card, { onClick: onClick, children: "A card" }));
-        userEvent.click(screen.getByRole("button", { name: "A card" }));
-        await waitFor(() => {
-            expect(onClick).toHaveBeenCalled();
-        });
-    });
-});

package/dist/Form/Checkbox/Checkbox.stories.d.ts

@@ -1,6 +0,0 @@
-import { Meta, StoryObj } from "@storybook/react";
-import { ComponentProps } from "react";
-import { Checkbox } from "./Checkbox";
-declare const meta: Meta;
-export default meta;
-export declare const CheckboxStory: StoryObj<ComponentProps<typeof Checkbox>>;