@axa-fr/design-system-look-and-feel-react 0.3.0-ci.289 → 0.3.0-ci.291

package/dist/Link/Link.d.ts

@@ -1,7 +1,10 @@
-import { ComponentPropsWithoutRef, PropsWithChildren } from "react";
-import "@axa-fr/design-system-look-and-feel-css/dist/Link/Link.scss";
+import { ComponentPropsWithoutRef, PropsWithChildren, type ReactNode } from "react";
 type LinkProps = {
     openInNewTab?: boolean;
+    leftIcon?: ReactNode;
+    rightIcon?: ReactNode;
+    className?: string;
+    classModifier?: string;
 } & ComponentPropsWithoutRef<"a">;
-export declare const Link: ({ href, openInNewTab, children, ...props }: PropsWithChildren<LinkProps>) => import("react/jsx-runtime").JSX.Element;
+export declare const Link: ({ href, openInNewTab, leftIcon, rightIcon, children, className, classModifier, ...props }: PropsWithChildren<LinkProps>) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/Link/Link.js

@@ -1,11 +1,14 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import "@axa-fr/design-system-look-and-feel-css/dist/Link/Link.scss";
 import openInNew from "@material-symbols/svg-400/outlined/open_in_new.svg";
+import { useMemo, } from "react";
 import { Svg } from "../Svg";
-export const Link = ({ href, openInNewTab, children, ...props }) => {
+import { getComponentClassName } from "../utilities";
+export const Link = ({ href, openInNewTab = false, leftIcon, rightIcon, children, className, classModifier = "", ...props }) => {
     const newTabProps = openInNewTab && {
         target: "_blank",
         rel: "noopener noreferrer",
     };
-    return (_jsxs("a", { className: `af-link ${openInNewTab ? " af-link--openInNewTab" : ""}`, href: href, ...newTabProps, ...props, children: [children, newTabProps && _jsx(Svg, { src: openInNew })] }));
+    const componentClassName = useMemo(() => getComponentClassName(className, `${classModifier}${!className && openInNewTab ? " openInNewTab" : ""}`, "af-link"), [classModifier, className, openInNewTab]);
+    return (_jsxs("a", { className: componentClassName, href: href, ...newTabProps, ...props, children: [leftIcon, children, (openInNewTab || Boolean(rightIcon)) &&
+                (rightIcon ?? _jsx(Svg, { src: openInNew }))] }));
 };

package/dist/Link/index.d.ts

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

package/dist/Link/index.js

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

package/dist/Title/Title.d.ts

@@ -1,5 +1,5 @@
 import { type ReactNode } from "react";
-import { TitleSize, TitleLevel } from "./constants";
+import { TitleLevel, TitleSize } from "./constants";
 type TitleProps = {
     children: ReactNode;
     firstSubtitle?: string;

package/dist/Title/Title.js

@@ -6,6 +6,6 @@ import { TitleSize } from "./constants";
 import { TitleWithSubtitles } from "./TitleWithSubtitles";
 export const Title = ({ children: title, className, classModifier, firstSubtitle, icon, secondSubtitle, size = TitleSize.XL, level = size === TitleSize.L ? 2 : 1, }) => {
     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, level: level }) })] })) : (_jsx(TitleWithSubtitlesPart, { level: level })) }));
+    const TitleWithSubtitlesPart = useCallback(({ ...args }) => (_jsx(TitleWithSubtitles, { title: title, firstSubtitle: firstSubtitle, level: level, ...args })), [title, firstSubtitle, level]);
+    return (_jsx("header", { className: componentClassName, children: icon && size === TitleSize.XL ? (_jsxs(_Fragment, { children: [_jsx(IconBg, { className: "af-title__icon af-icon-bg", children: icon }), _jsx(TitleWithSubtitlesPart, { secondSubtitle: secondSubtitle })] })) : (_jsx(TitleWithSubtitlesPart, {})) }));
 };

package/dist/Title/TitleWithSubtitles.d.ts

@@ -1,5 +1,5 @@
 import { type ReactNode } from "react";
-import { TitleLevel } from "./constants";
+import type { TitleLevel } from ".";
 type TitleTextProps = {
     title: ReactNode;
     firstSubtitle?: string;

package/dist/Title/TitleWithSubtitles.js

@@ -1,6 +1,5 @@
 import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { useMemo } from "react";
 export const TitleWithSubtitles = ({ title, firstSubtitle, secondSubtitle, level = 1, }) => {
-    const HLevel = useMemo(() => `h${level}`, [level]);
+    const HLevel = `h${level}`;
     return (_jsxs(_Fragment, { children: [_jsx(HLevel, { 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/index.d.ts

@@ -14,7 +14,7 @@ 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 { Link } from "./Link";
 export { List } from "./List";
 export { ClickItem, ClickList } from "./List/ClickList";
 export { ContentItemDuo } from "./List/ContentItemDuo";

package/dist/index.js

@@ -13,7 +13,7 @@ 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 { Link } from "./Link";
 export { List } from "./List";
 export { ClickItem, ClickList } from "./List/ClickList";
 export { ContentItemDuo } from "./List/ContentItemDuo";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@axa-fr/design-system-look-and-feel-react",
-  "version": "0.3.0-ci.289",
+  "version": "0.3.0-ci.291",
   "description": "",
   "exports": {
     ".": {
@@ -45,7 +45,7 @@
   },
   "homepage": "https://github.com/AxaFrance/design-system#readme",
   "peerDependencies": {
-    "@axa-fr/design-system-look-and-feel-css": "0.3.0-ci.289",
+    "@axa-fr/design-system-look-and-feel-css": "0.3.0-ci.291",
     "@material-symbols/svg-400": ">= 0.19.0",
     "react": ">= 18"
   },