@axa-fr/design-system-look-and-feel-react 0.2.0-beta.306

package/dist/Svg/Svg.stories.d.ts

@@ -0,0 +1,7 @@
+import type { Meta, StoryObj } from "@storybook/react";
+import "./Svg.stories.css";
+import { Svg } from ".";
+declare const meta: Meta;
+export default meta;
+export declare const Default: StoryObj<typeof Svg>;
+export declare const Headphones: StoryObj<typeof Svg>;

package/dist/Svg/Svg.stories.js

@@ -0,0 +1,40 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import headphonesIcons from "@material-symbols/svg-400/outlined/headphones.svg";
+import homeIcons from "@material-symbols/svg-400/outlined/home.svg";
+import saveIcons from "@material-symbols/svg-400/outlined/save.svg";
+import closeIcons from "@material-symbols/svg-400/outlined/close.svg";
+import "./Svg.stories.css";
+import { Svg } from ".";
+const meta = {
+    title: "Components/Svg",
+    component: Svg,
+};
+export default meta;
+const MODIFIERS = {
+    "/public/headphones.svg": headphonesIcons,
+    "/public/home.svg": homeIcons,
+    "/public/save.svg": saveIcons,
+    "/public/close.svg": closeIcons,
+    "simulate svg error": "foo",
+};
+export const Default = {
+    name: "Svg",
+    render: ({ src, ...args }) => _jsx(Svg, { src: MODIFIERS[src], ...args }),
+    args: {
+        src: "/public/headphones.svg",
+        fill: "#00008f",
+        width: 24,
+        height: 24,
+        alt: "error",
+    },
+    argTypes: {
+        src: {
+            options: Object.keys(MODIFIERS),
+            control: { type: "select" },
+        },
+    },
+};
+export const Headphones = {
+    name: "Svg Headphones",
+    render: () => _jsx(Svg, { src: headphonesIcons, fill: "#00008f" }),
+};

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

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

package/dist/Svg/__tests__/Svg.test.js

@@ -0,0 +1,38 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { render, screen } from "@testing-library/react";
+import { axe } from "jest-axe";
+import { Svg } from "../Svg";
+const mocks = vi.hoisted(() => {
+    return {
+        SVGInjector: vi.fn(),
+    };
+});
+vi.mock("@tanem/svg-injector", () => mocks);
+describe("<Svg />", () => {
+    describe("render", () => {
+        it("renders correctly", () => {
+            mocks.SVGInjector.mockImplementationOnce((el, { afterEach }) => {
+                afterEach(undefined, el);
+            });
+            const svgSrc = "svgSrc";
+            render(_jsx(Svg, { src: "svgSrc", alt: "foo", "aria-label": "test" }));
+            const svg = screen.getByLabelText("test");
+            expect(svg).toBeInTheDocument();
+            expect(svg).toHaveAttribute("data-src", svgSrc);
+        });
+        it("renders fallback when src not found", async () => {
+            mocks.SVGInjector.mockImplementationOnce((_, { afterEach }) => {
+                afterEach("error");
+            });
+            render(_jsx(Svg, { src: "fake", alt: "foo", "aria-label": "test" }));
+            const svg = screen.getByText("foo");
+            expect(svg).toBeInTheDocument();
+        });
+    });
+    describe("A11Y", () => {
+        it("shouldn't have an accessibility violation <Svg />", async () => {
+            const { container } = render(_jsx(Svg, { src: "svgSrc", alt: "foo" }));
+            expect(await axe(container)).toHaveNoViolations();
+        });
+    });
+});

package/dist/Svg/index.d.ts

@@ -0,0 +1 @@
+export { Svg } from "./Svg";

package/dist/Svg/index.js

@@ -0,0 +1 @@
+export { Svg } from "./Svg";

package/dist/Svg/svgInjector.d.ts

@@ -0,0 +1,12 @@
+import { type AfterAll, type BeforeEach, type Errback, type EvalScripts } from "@tanem/svg-injector";
+type Options = {
+    afterAll?: AfterAll;
+    afterEach?: Errback;
+    beforeEach?: BeforeEach;
+    cacheRequests?: boolean;
+    evalScripts?: EvalScripts;
+    httpRequestWithCredentials?: boolean;
+    renumerateIRIElements?: boolean;
+};
+export declare const svgInjector: (element: HTMLElement | SVGSVGElement | null, { beforeEach, ...options }?: Options) => void;
+export {};

package/dist/Svg/svgInjector.js

@@ -0,0 +1,28 @@
+import { SVGInjector, } from "@tanem/svg-injector";
+import DOMPurify from "dompurify";
+const attributesToRestore = ["fill", "stroke"];
+const restoreAttributes = (element, svg) => {
+    const attributes = {};
+    element?.getAttributeNames().forEach((attribute) => {
+        if (attribute.startsWith("aria-") ||
+            attributesToRestore.includes(attribute)) {
+            attributes[attribute] = element.getAttribute(attribute);
+        }
+    });
+    Object.keys(attributes).forEach((attribute) => {
+        svg.setAttribute(attribute, attributes[attribute]);
+    });
+};
+export const svgInjector = (element, { beforeEach = () => { }, ...options } = {}) => {
+    SVGInjector(element, {
+        ...options,
+        beforeEach: (svg) => {
+            DOMPurify.sanitize(svg, {
+                USE_PROFILES: { svg: true, svgFilters: true },
+                IN_PLACE: true,
+            });
+            restoreAttributes(element, svg);
+            beforeEach(svg);
+        },
+    });
+};

package/dist/Tabs/Tabs.d.ts

@@ -0,0 +1,16 @@
+import "@axa-fr/design-system-look-and-feel-css/dist/Tabs/Tabs.scss";
+import { ReactNode } from "react";
+export declare enum Direction {
+    center = "center"
+}
+type TabsProps = {
+    items: {
+        title: string;
+        content: string | ReactNode;
+        icon?: ReactNode;
+    }[];
+    preSelectedTabIndex?: number;
+    direction?: Direction;
+};
+export declare const TabsClient: ({ items, preSelectedTabIndex, direction, }: TabsProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/Tabs/Tabs.js

@@ -0,0 +1,48 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import "@axa-fr/design-system-look-and-feel-css/dist/Tabs/Tabs.scss";
+import classNames from "classnames";
+import { useCallback, useRef, useState } from "react";
+export var Direction;
+(function (Direction) {
+    Direction["center"] = "center";
+})(Direction || (Direction = {}));
+export const TabsClient = ({ items, preSelectedTabIndex, direction, }) => {
+    const [selectedTabIndex, setSelectedTabIndex] = useState(preSelectedTabIndex || 0);
+    const buttonRefs = useRef([]);
+    const tablistRef = useRef(null);
+    const totalTabs = items.length;
+    const isActive = (index) => index === selectedTabIndex;
+    const onChangeTab = useCallback((e) => {
+        const firstTabIndex = 0;
+        const lastTabIndex = totalTabs - 1;
+        const goToNextTab = (nextTabIndex) => {
+            setSelectedTabIndex(nextTabIndex);
+            buttonRefs.current[nextTabIndex].focus();
+            e.stopPropagation();
+            e.preventDefault();
+        };
+        switch (e.key) {
+            case "ArrowRight":
+                goToNextTab(selectedTabIndex < lastTabIndex
+                    ? selectedTabIndex + 1
+                    : firstTabIndex);
+                break;
+            case "ArrowLeft":
+                goToNextTab(selectedTabIndex > firstTabIndex
+                    ? selectedTabIndex - 1
+                    : lastTabIndex);
+                break;
+            case "Home":
+                goToNextTab(firstTabIndex);
+                break;
+            case "End":
+                goToNextTab(lastTabIndex);
+                break;
+            default:
+                break;
+        }
+    }, [selectedTabIndex, totalTabs]);
+    return (_jsxs("div", { className: classNames("af-tabs-client", direction === Direction.center ? `af-tabs-client--center` : ""), children: [_jsx("div", { role: "tablist", ref: tablistRef, children: items.map((item, index) => (_jsxs("button", { role: "tab", id: `tab-${index}`, "aria-selected": isActive(index), "aria-controls": `tabpanel-${index}`, onKeyDown: onChangeTab, onClick: () => setSelectedTabIndex(index), ref: (element) => {
+                        buttonRefs.current[index] = element;
+                    }, type: "button", tabIndex: isActive(index) ? 0 : -1, children: [item.icon, _jsx("span", { children: item.title })] }, `tab-${item.title}`))) }), items.map((item, index) => (_jsx("div", { role: "tabpanel", "aria-hidden": !isActive(index), id: `tabpanel-${index}`, "aria-labelledby": `tab-${index}`, children: item.content }, `tabpanel-${item.title}`)))] }));
+};

package/dist/Tabs/Tabs.stories.d.ts

@@ -0,0 +1,17 @@
+import { Meta, StoryObj } from "@storybook/react";
+import { ReactNode } from "react";
+import { Direction, TabsClient } from "./Tabs";
+declare const meta: Meta<typeof TabsClient>;
+export default meta;
+type StoryProps = Omit<React.ComponentProps<typeof TabsClient>, "items" | "direction" | "preSelectedTabIndex"> & {
+    items: {
+        title: string;
+        content: string | ReactNode;
+        icon?: ReactNode;
+    }[];
+    preSelectedTabIndex?: number;
+    direction?: Direction;
+};
+export declare const TabsStory: StoryObj<StoryProps>;
+export declare const TabsCenterDirectionStory: StoryObj<StoryProps>;
+export declare const TabsWithReactNodeStory: StoryObj<typeof TabsClient>;

package/dist/Tabs/Tabs.stories.js

@@ -0,0 +1,89 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import accessTime from "@material-symbols/svg-400/outlined/schedule.svg";
+import bluetoothAudio from "@material-symbols/svg-400/outlined/bluetooth_searching.svg";
+import { Direction, TabsClient } from "./Tabs";
+import { Svg } from "../Svg";
+const meta = {
+    component: TabsClient,
+    title: "Components/Tabs",
+    parameters: {
+        layout: "fullscreen",
+    },
+};
+export default meta;
+export const TabsStory = {
+    name: "Tabs",
+    render: ({ items, preSelectedTabIndex, direction }) => {
+        const props = {
+            items,
+            preSelectedTabIndex,
+        };
+        if (direction === Direction.center) {
+            props.direction = Direction.center;
+        }
+        return _jsx(TabsClient, { ...props });
+    },
+    args: {
+        items: [
+            { title: "Tab 1", content: "Content 1" },
+            { title: "Tab 2", content: "Content 2", icon: _jsx(Svg, { src: accessTime }) },
+            { title: "Tab 3", content: "Content 3" },
+        ],
+        preSelectedTabIndex: 0,
+    },
+    argTypes: {
+        items: {
+            control: { type: "object" },
+        },
+        preSelectedTabIndex: {
+            control: { type: "number" },
+        },
+        direction: {
+            control: "select",
+            options: ["default", "center"],
+        },
+    },
+};
+export const TabsCenterDirectionStory = {
+    name: "TabsCenterDirection",
+    render: (args) => _jsx(TabsClient, { ...args }),
+    args: {
+        items: [
+            { title: "Center tab 1", content: "Content 1" },
+            {
+                title: "Center tab 2",
+                content: "Content 2",
+                icon: _jsx(Svg, { src: accessTime }),
+            },
+            {
+                title: "Center tab 3",
+                content: "Content 3",
+                icon: _jsx(Svg, { src: bluetoothAudio }),
+            },
+        ],
+        preSelectedTabIndex: 0,
+        direction: Direction.center,
+    },
+};
+export const TabsWithReactNodeStory = {
+    name: "TabsWithReactNode",
+    render: (args) => _jsx(TabsClient, { ...args }),
+    args: {
+        items: [
+            {
+                title: "ReactNode tab 1",
+                content: (_jsxs(_Fragment, { children: [_jsx("h2", { children: "Titre 1" }), _jsx("p", { children: "Content 1" })] })),
+            },
+            {
+                title: "ReactNode tab 2",
+                content: (_jsxs(_Fragment, { children: [_jsx("h2", { children: "Titre 2" }), _jsx("p", { children: "Content 2" })] })),
+            },
+            {
+                title: "ReactNode tab 3",
+                content: (_jsxs(_Fragment, { children: [_jsx("h2", { children: "Titre 3" }), _jsx("p", { children: "Content 3" })] })),
+            },
+        ],
+        direction: Direction.center,
+        preSelectedTabIndex: 0,
+    },
+};

package/dist/Tag/Tag.d.ts

@@ -0,0 +1,6 @@
+import { type ComponentProps } from "react";
+type TagProps = ComponentProps<"div"> & {
+    classModifier?: string;
+};
+export declare const Tag: ({ children, className, classModifier, ...divProps }: TagProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/Tag/Tag.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { useMemo } from "react";
+import { getComponentClassName } from "../utilities";
+export const Tag = ({ children, className, classModifier = "", ...divProps }) => {
+    const componentClassName = useMemo(() => getComponentClassName(className, classModifier, "af-tag"), [className, classModifier]);
+    return (_jsx("div", { className: componentClassName, ...divProps, children: _jsx("span", { className: "af-tag__label", children: children }) }));
+};

package/dist/Tag/Tag.stories.d.ts

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

package/dist/Tag/Tag.stories.js

@@ -0,0 +1,22 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Tag } from ".";
+const meta = {
+    title: "Components/Tag",
+    component: Tag,
+};
+export default meta;
+export const Default = {
+    name: "Tag",
+    render: (args) => _jsx(Tag, { ...args }),
+    args: {
+        children: "Texte",
+        classModifier: "",
+    },
+    argTypes: {
+        classModifier: {
+            options: ["", "success", "error", "warning", "info"],
+            control: { type: "select" },
+            defaultValue: "",
+        },
+    },
+};

package/dist/Tag/__test__/Tag.test.d.ts

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

package/dist/Tag/__test__/Tag.test.js

@@ -0,0 +1,18 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { render, screen } from "@testing-library/react";
+import { Tag } from "../Tag";
+describe("Tag", () => {
+    it("should render children correctly", () => {
+        const children = "Sample Tag";
+        render(_jsx(Tag, { children: children }));
+        const tagSpan = screen.getByText(children);
+        expect(tagSpan).toHaveClass("af-tag__label");
+        expect(tagSpan.parentElement).toHaveClass("af-tag");
+    });
+    it("should have custom classModifier", () => {
+        const children = "Sample Tag";
+        const classModifier = "modifier";
+        render(_jsx(Tag, { classModifier: classModifier, children: children }));
+        expect(screen.getByText(children).parentElement).toHaveClass(`af-tag af-tag--${classModifier}`);
+    });
+});

package/dist/Tag/index.d.ts

@@ -0,0 +1,2 @@
+import "@axa-fr/design-system-look-and-feel-css/dist/Tag/Tag.scss";
+export { Tag } from "./Tag";

package/dist/Tag/index.js

@@ -0,0 +1,2 @@
+import "@axa-fr/design-system-look-and-feel-css/dist/Tag/Tag.scss";
+export { Tag } from "./Tag";

package/dist/Title/Title.d.ts

@@ -0,0 +1,13 @@
+import { type ReactNode } from "react";
+import { TitleSize } from "./constants";
+type TitleProps = {
+    children: ReactNode;
+    firstSubtitle: string;
+    className?: string;
+    classModifier?: string;
+    icon?: ReactNode;
+    secondSubtitle?: string;
+    size?: TitleSize;
+};
+export declare const Title: ({ children: title, className, classModifier, firstSubtitle, icon, secondSubtitle, size, }: TitleProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/Title/Title.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback, useMemo, } from "react";
+import { IconBg } from "..";
+import { getComponentClassName } from "../utilities";
+import { TitleSize } from "./constants";
+import { TitleWithSubtitles } from "./TitleWithSubtitles";
+export const Title = ({ children: title, className, classModifier, firstSubtitle, icon, secondSubtitle, size = TitleSize.XL, }) => {
+    const componentClassName = useMemo(() => getComponentClassName(className, classModifier ? `${classModifier} ${size}` : size, "af-title"), [classModifier, className, size]);
+    const TitleWithSubtitlesPart = useCallback(({ ...args }) => (_jsx(TitleWithSubtitles, { title: title, firstSubtitle: firstSubtitle, ...args })), [title, firstSubtitle]);
+    return (_jsx("div", { className: componentClassName, children: icon && size === TitleSize.XL ? (_jsxs(_Fragment, { children: [_jsx(IconBg, { className: "af-title__icon af-icon-bg", children: icon }), _jsx("div", { className: "af-title__text-container", children: _jsx(TitleWithSubtitlesPart, { secondSubtitle: secondSubtitle }) })] })) : (_jsx(TitleWithSubtitlesPart, {})) }));
+};

package/dist/Title/Title.stories.d.ts

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

package/dist/Title/Title.stories.js

@@ -0,0 +1,45 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import article from "@material-symbols/svg-400/outlined/article-fill.svg";
+import { Title } from ".";
+import { Svg } from "../Svg";
+import { TitleSize } from "./constants";
+const meta = {
+    title: "Components/Title",
+    component: Title,
+};
+export default meta;
+export const TitleWithIcon = {
+    name: "Title With Icon",
+    render: (args) => _jsx(Title, { ...args }),
+    args: {
+        children: "Titre de la page",
+        firstSubtitle: "Sous-titre 1",
+        secondSubtitle: "Sous-titre 2",
+        icon: _jsx(Svg, { src: article }),
+        size: TitleSize.XL,
+    },
+    argTypes: {
+        size: {
+            options: Object.values(TitleSize),
+            control: { type: "select" },
+            defaultValue: TitleSize.XL,
+        },
+    },
+};
+export const TitleWithoutIcon = {
+    name: "Title Without Icon",
+    render: (args) => _jsx(Title, { ...args }),
+    args: {
+        children: "Titre de la page",
+        firstSubtitle: "Sous-titre 1",
+        secondSubtitle: "Sous-titre 2",
+        size: TitleSize.XL,
+    },
+    argTypes: {
+        size: {
+            options: Object.values(TitleSize),
+            control: { type: "select" },
+            defaultValue: TitleSize.XL,
+        },
+    },
+};

package/dist/Title/TitleWithSubtitles.d.ts

@@ -0,0 +1,8 @@
+import type { ReactNode } from "react";
+type TitleTextProps = {
+    title: ReactNode;
+    firstSubtitle?: string;
+    secondSubtitle?: string;
+};
+export declare const TitleWithSubtitles: ({ title, firstSubtitle, secondSubtitle, }: TitleTextProps) => import("react/jsx-runtime").JSX.Element;
+export {};

package/dist/Title/TitleWithSubtitles.js

@@ -0,0 +1,2 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+export const TitleWithSubtitles = ({ title, firstSubtitle, secondSubtitle, }) => (_jsxs(_Fragment, { children: [_jsx("h1", { className: "af-title__title", children: title }), firstSubtitle && (_jsx("span", { className: "af-title__subtitle", children: firstSubtitle })), secondSubtitle && (_jsx("span", { className: "af-title__subtitle", children: secondSubtitle }))] }));

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

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

package/dist/Title/__tests__/Title.test.js

@@ -0,0 +1,28 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { render, screen } from "@testing-library/react";
+import { Title } from "..";
+import { TitleSize } from "../constants";
+describe("Title", () => {
+    it("should render correctly", () => {
+        render(_jsx(Title, { firstSubtitle: "firstSubtitle", secondSubtitle: "secondSubtitle", icon: "icon", children: "Title" }));
+        expect(screen.getByRole("heading", { name: "Title", level: 1 })).toBeInTheDocument();
+        expect(screen.getByText("firstSubtitle")).toBeInTheDocument();
+        expect(screen.getByText("secondSubtitle")).toBeInTheDocument();
+        expect(screen.getByText("icon")).toBeInTheDocument();
+    });
+    it("should have custom class", () => {
+        render(_jsx(Title, { firstSubtitle: "firstSubtitle", className: "custom-class", children: "Title" }));
+        expect(screen.getByText("Title").parentElement).toHaveClass("custom-class");
+    });
+    it("should have custom class with modifier", () => {
+        render(_jsx(Title, { firstSubtitle: "firstSubtitle", className: "custom-class", classModifier: "modifier", children: "Title" }));
+        expect(screen.getByText("Title").parentElement).toHaveClass("custom-class custom-class--modifier");
+    });
+    it('should not display icon and second subtitle when size is "L"', () => {
+        render(_jsx(Title, { firstSubtitle: "firstSubtitle", secondSubtitle: "secondSubtitle", icon: "icon", size: TitleSize.L, children: "Title" }));
+        expect(screen.getByRole("heading", { name: "Title", level: 1 })).toBeInTheDocument();
+        expect(screen.getByText("firstSubtitle")).toBeInTheDocument();
+        expect(screen.queryByText("secondSubtitle")).not.toBeInTheDocument();
+        expect(screen.queryByText("icon")).not.toBeInTheDocument();
+    });
+});

package/dist/Title/__tests__/TitleWithSubtitles.test.d.ts

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

package/dist/Title/__tests__/TitleWithSubtitles.test.js

@@ -0,0 +1,14 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { render, screen } from "@testing-library/react";
+import { TitleWithSubtitles } from "../TitleWithSubtitles";
+describe("TitleWithSubtitles", () => {
+    it("should render title and the two subtitles", () => {
+        const title = "Sample Title";
+        const firstSubtitle = "First Subtitle";
+        const secondSubtitle = "Second Subtitle";
+        render(_jsx(TitleWithSubtitles, { title: title, firstSubtitle: firstSubtitle, secondSubtitle: secondSubtitle }));
+        screen.getByRole("heading", { name: title, level: 1 });
+        expect(screen.getByText(firstSubtitle)).toBeInTheDocument();
+        expect(screen.getByText(secondSubtitle)).toBeInTheDocument();
+    });
+});

package/dist/Title/constants.d.ts

@@ -0,0 +1,4 @@
+export declare enum TitleSize {
+    XL = "xl",
+    L = "l"
+}

package/dist/Title/constants.js

@@ -0,0 +1,5 @@
+export var TitleSize;
+(function (TitleSize) {
+    TitleSize["XL"] = "xl";
+    TitleSize["L"] = "l";
+})(TitleSize || (TitleSize = {}));

package/dist/Title/index.d.ts

@@ -0,0 +1,3 @@
+import "@axa-fr/design-system-look-and-feel-css/dist/Title/Title.scss";
+export { TitleSize } from "./constants";
+export { Title } from "./Title";

package/dist/Title/index.js

@@ -0,0 +1,3 @@
+import "@axa-fr/design-system-look-and-feel-css/dist/Title/Title.scss";
+export { TitleSize } from "./constants";
+export { Title } from "./Title";

package/dist/assets/svg/facebook.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 0 24 24" width="24"><path d="M5 3h14a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2m13 2h-2.5A3.5 3.5 0 0 0 12 8.5V11h-2v3h2v7h3v-7h3v-3h-3V9a1 1 0 0 1 1-1h2V5z"></path></svg>

package/dist/assets/svg/linkedin.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 0 24 24" width="24"><path d="M19 3a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h14m-.5 15.5v-5.3a3.26 3.26 0 0 0-3.26-3.26c-.85 0-1.84.52-2.32 1.3v-1.11h-2.79v8.37h2.79v-4.93c0-.77.62-1.4 1.39-1.4a1.4 1.4 0 0 1 1.4 1.4v4.93h2.79M6.88 8.56a1.68 1.68 0 0 0 1.68-1.68c0-.93-.75-1.69-1.68-1.69a1.69 1.69 0 0 0-1.69 1.69c0 .93.76 1.68 1.69 1.68m1.39 9.94v-8.37H5.5v8.37h2.77z"></path></svg>

package/dist/assets/svg/twitterx.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 0 24 24" width="24"><path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z"></path></svg>

package/dist/assets/svg/youtube.svg

@@ -0,0 +1 @@
+<svg xmlns="http://www.w3.org/2000/svg" height="24" viewBox="0 0 24 24" width="24"><path d="M10 15l5.19-3L10 9v6m11.56-7.83c.13.47.22 1.1.28 1.9.07.8.1 1.49.1 2.09L22 12c0 2.19-.16 3.8-.44 4.83-.25.9-.83 1.48-1.73 1.73-.47.13-1.33.22-2.65.28-1.3.07-2.49.1-3.59.1L12 19c-4.19 0-6.8-.16-7.83-.44-.9-.25-1.48-.83-1.73-1.73-.13-.47-.22-1.1-.28-1.9-.07-.8-.1-1.49-.1-2.09L2 12c0-2.19.16-3.8.44-4.83.25-.9.83-1.48 1.73-1.73.47-.13 1.33-.22 2.65-.28 1.3-.07 2.49-.1 3.59-.1L12 5c4.19 0 6.8.16 7.83.44.9.25 1.48.83 1.73 1.73z"></path></svg>

package/dist/index.d.ts

@@ -0,0 +1,29 @@
+import "@fontsource/source-sans-pro";
+export { Accordion } from "./Accordion/Accordion";
+export { Alert } from "./Alert/Alert";
+export type { AlertType } from "./Alert/Alert";
+export { ButtonClient as Button, Variants as ButtonVariants, } from "./Button/Button";
+export { Card } from "./Card";
+export { Checkbox, CheckboxSelect } from "./Form/Checkbox";
+export { FileUpload } from "./Form/FileUpload";
+export { Radio, RadioSelect } from "./Form/Radio";
+export { Select } from "./Form/Select";
+export { Text as TextInput } from "./Form/Text";
+export { IconBg } from "./IconBg";
+export { Footer } from "./Layout/Footer/Footer";
+export { Header } from "./Layout/Header";
+export { Link } from "./Link/Link";
+export { List } from "./List";
+export { ClickList } from "./List/ClickList";
+export { ContentItemDuo } from "./List/ContentItemDuo";
+export { ContentItemMono, ContentItemMonoSize } from "./List/ContentItemMono";
+export { ContentTabList } from "./List/ContentTabList";
+export { Loader } from "./Loader";
+export { Modal } from "./ModalClient/Modal";
+export type { ButtonAction as ModalButtonAction } from "./ModalClient/Modal";
+export { Pagination } from "./Pagination/Pagination";
+export { Stepper } from "./Stepper/Stepper";
+export { Svg } from "./Svg";
+export { TabsClient as Tabs } from "./Tabs/Tabs";
+export { Tag } from "./Tag";
+export { Title, TitleSize } from "./Title";

package/dist/index.js

@@ -0,0 +1,27 @@
+import "@fontsource/source-sans-pro";
+export { Accordion } from "./Accordion/Accordion";
+export { Alert } from "./Alert/Alert";
+export { ButtonClient as Button, Variants as ButtonVariants, } from "./Button/Button";
+export { Card } from "./Card";
+export { Checkbox, CheckboxSelect } from "./Form/Checkbox";
+export { FileUpload } from "./Form/FileUpload";
+export { Radio, RadioSelect } from "./Form/Radio";
+export { Select } from "./Form/Select";
+export { Text as TextInput } from "./Form/Text";
+export { IconBg } from "./IconBg";
+export { Footer } from "./Layout/Footer/Footer";
+export { Header } from "./Layout/Header";
+export { Link } from "./Link/Link";
+export { List } from "./List";
+export { ClickList } from "./List/ClickList";
+export { ContentItemDuo } from "./List/ContentItemDuo";
+export { ContentItemMono, ContentItemMonoSize } from "./List/ContentItemMono";
+export { ContentTabList } from "./List/ContentTabList";
+export { Loader } from "./Loader";
+export { Modal } from "./ModalClient/Modal";
+export { Pagination } from "./Pagination/Pagination";
+export { Stepper } from "./Stepper/Stepper";
+export { Svg } from "./Svg";
+export { TabsClient as Tabs } from "./Tabs/Tabs";
+export { Tag } from "./Tag";
+export { Title, TitleSize } from "./Title";

package/dist/utilities/helpers/getComponentClassName.d.ts

@@ -0,0 +1 @@
+export declare const getComponentClassName: (className?: string, classModifier?: string, defaultClassName?: string) => string;