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

package/dist/List/ClickList/ClickItem/ClickItem.d.ts

@@ -1,14 +1,2 @@
-import { type ComponentProps, type ReactNode } from "react";
-type TClickItem = {
-    classModifier?: string;
-    isDisabled?: boolean;
-} & Omit<ComponentProps<"button">, "disabled"> & ComponentProps<"a"> & {
-    label?: ReactNode;
-    parentClickComponent?: ({ children, }: {
-        children: ReactNode;
-    } & Record<string, unknown>) => ReactNode;
-    children?: ReactNode;
-    icon?: ReactNode;
-} & Record<string, unknown>;
-export declare const ClickItem: ({ label, children, icon, parentClickComponent: ClickComponent, isDisabled, className, classModifier, ...otherProps }: TClickItem) => import("react/jsx-runtime").JSX.Element;
-export {};
+import type { TClickItem } from "./types";
+export declare const ClickItem: ({ children, icon, parentClickComponent: ClickComponent, isDisabled, className, classModifier, ...otherProps }: TClickItem) => import("react/jsx-runtime").JSX.Element;

package/dist/List/ClickList/ClickItem/ClickItem.helpers.d.ts

@@ -0,0 +1,3 @@
+import type { ComponentProps, ComponentType, ElementType } from "react";
+import type { TParentClickComponentProps } from "./types";
+export declare const createClickItemParent: <TComponent extends ElementType>(Wrapper: ComponentType<TComponent> | TComponent, wrapperProps: ComponentProps<TComponent>) => ({ children, ...clickItemProps }: TParentClickComponentProps) => import("react/jsx-runtime").JSX.Element;

package/dist/List/ClickList/ClickItem/ClickItem.helpers.js

@@ -0,0 +1,5 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+export const createClickItemParent = (Wrapper, wrapperProps) => {
+    const ClickItemWrapper = ({ children, ...clickItemProps }) => (_jsx(Wrapper, { ...wrapperProps, ...clickItemProps, children: children }));
+    return ClickItemWrapper;
+};

package/dist/List/ClickList/ClickItem/ClickItem.js

@@ -3,7 +3,7 @@ import chevron from "@material-symbols/svg-400/outlined/chevron_right.svg";
 import { useMemo } from "react";
 import { Svg } from "../../../Svg";
 import { getComponentClassName } from "../../../utilities";
-export const ClickItem = ({ label, children, icon, parentClickComponent: ClickComponent = ({ children: parentClickComponentChildren, ...parentClickComponentProps }) => (_jsx("button", { type: "button", ...parentClickComponentProps, children: parentClickComponentChildren })), isDisabled = false, className, classModifier = "", ...otherProps }) => {
+export const ClickItem = ({ children, icon, parentClickComponent: ClickComponent = ({ children: parentClickComponentChildren, ...parentClickComponentProps }) => (_jsx("button", { type: "button", ...parentClickComponentProps, children: parentClickComponentChildren })), isDisabled = false, className, classModifier = "", ...otherProps }) => {
     const componentClassName = useMemo(() => getComponentClassName(className, `${classModifier}${isDisabled ? " disabled" : ""}`, "af-click-item"), [className, classModifier, isDisabled]);
-    return (_jsxs(ClickComponent, { className: componentClassName, disabled: isDisabled, "aria-disabled": isDisabled, ...otherProps, children: [_jsxs("div", { className: "af-click-item__content", children: [icon && _jsx("div", { className: "af-click-item__icon", children: icon }), _jsx("div", { className: "af-click-item__label", children: children || label })] }), _jsx("div", { className: "af-click-item__action", children: _jsx(Svg, { src: chevron, "aria-hidden": true }) })] }));
+    return (_jsxs(ClickComponent, { className: componentClassName, disabled: isDisabled, "aria-disabled": isDisabled, ...otherProps, children: [_jsxs("div", { className: "af-click-item__content", children: [icon && _jsx("div", { className: "af-click-item__icon", children: icon }), _jsx("div", { className: "af-click-item__label", children: children })] }), _jsx("div", { className: "af-click-item__action", children: _jsx(Svg, { src: chevron, "aria-hidden": true }) })] }));
 };

package/dist/List/ClickList/ClickItem/index.d.ts

@@ -1 +1,2 @@
 export { ClickItem } from "./ClickItem";
+export { createClickItemParent } from "./ClickItem.helpers";

package/dist/List/ClickList/ClickItem/index.js

@@ -1 +1,2 @@
 export { ClickItem } from "./ClickItem";
+export { createClickItemParent } from "./ClickItem.helpers";

package/dist/List/ClickList/index.d.ts

@@ -1,3 +1,3 @@
 import "@axa-fr/design-system-look-and-feel-css/dist/List/ClickList/ClickList.scss";
-export { ClickItem } from "./ClickItem";
+export { ClickItem, createClickItemParent } from "./ClickItem";
 export { ClickList } from "./ClickList";

package/dist/List/ClickList/index.js

@@ -1,3 +1,3 @@
 import "@axa-fr/design-system-look-and-feel-css/dist/List/ClickList/ClickList.scss";
-export { ClickItem } from "./ClickItem";
+export { ClickItem, createClickItemParent } from "./ClickItem";
 export { ClickList } from "./ClickList";

package/dist/List/ContentTabList/ContentTabItem/ContentTabItem.d.ts

@@ -2,5 +2,5 @@ import type { TContentTabItem } from "./types";
 type TContentTabItemProps = TContentTabItem & {
     isMobile?: boolean;
 };
-export declare const ContentTabItem: ({ title, subtitle, tag, tagProps, date, buttons, value, isMobile, }: TContentTabItemProps) => import("react/jsx-runtime").JSX.Element;
+export declare const ContentTabItem: ({ title, subtitle, tag, tagProps, date, actions, value, isMobile, }: TContentTabItemProps) => import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/List/ContentTabList/ContentTabItem/ContentTabItem.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { Button, Tag } from "../../..";
-export const ContentTabItem = ({ title, subtitle, tag, tagProps, date, buttons = [], value, isMobile = false, }) => (_jsxs(_Fragment, { children: [_jsxs("div", { className: "af-list-item__left-container", children: [Boolean(value) && (Boolean(tag) || Boolean(date)) && (_jsxs("div", { className: "af-list-item__additional-data-container", children: [Boolean(tag) && (_jsx(Tag, { classModifier: "warning", ...tagProps, children: tag })), Boolean(date) && _jsx("span", { className: "af-list-item__date", children: date })] })), _jsxs("div", { className: "af-list-item__label", children: [_jsx("span", { className: "af-list-item-label__title", children: title }), Boolean(subtitle) && (_jsx("span", { className: "af-list-item-label__subtitle", children: subtitle }))] }), !value && isMobile && (Boolean(tag) || Boolean(date)) && (_jsxs("div", { className: "af-list-item__additional-data-container", children: [Boolean(tag) && (_jsx(Tag, { classModifier: "warning", ...tagProps, children: tag })), Boolean(date) && _jsx("span", { className: "af-list-item__date", children: date })] }))] }), (buttons.length > 0 ||
+import { Tag } from "../../..";
+export const ContentTabItem = ({ title, subtitle, tag, tagProps, date, actions = [], value, isMobile = false, }) => (_jsxs(_Fragment, { children: [_jsxs("div", { className: "af-list-item__left-container", children: [Boolean(value) && (Boolean(tag) || Boolean(date)) && (_jsxs("div", { className: "af-list-item__additional-data-container", children: [Boolean(tag) && (_jsx(Tag, { classModifier: "warning", ...tagProps, children: tag })), Boolean(date) && _jsx("span", { className: "af-list-item__date", children: date })] })), _jsxs("div", { className: "af-list-item__label", children: [_jsx("span", { className: "af-list-item-label__title", children: title }), Boolean(subtitle) && (_jsx("span", { className: "af-list-item-label__subtitle", children: subtitle }))] }), !value && isMobile && (Boolean(tag) || Boolean(date)) && (_jsxs("div", { className: "af-list-item__additional-data-container", children: [Boolean(tag) && (_jsx(Tag, { classModifier: "warning", ...tagProps, children: tag })), Boolean(date) && _jsx("span", { className: "af-list-item__date", children: date })] }))] }), (actions.length > 0 ||
             Boolean(tag) ||
             Boolean(date) ||
-            Boolean(value)) && (_jsxs("div", { className: "af-list-item__right-container", children: [!value && (Boolean(tag) || Boolean(date)) && !isMobile && (_jsxs("div", { className: "af-list-item__additional-data-container", children: [Boolean(tag) && (_jsx(Tag, { classModifier: "warning", ...tagProps, children: tag })), Boolean(date) && (_jsx("span", { className: "af-list-item__date", children: date }))] })), buttons.map((button) => (_jsx("div", { className: "af-list-item__button-container", children: _jsx(Button, { ...button }) }, button?.id))), Boolean(value) && _jsx("span", { className: "af-list-item__value", children: value })] }))] }));
+            Boolean(value)) && (_jsxs("div", { className: "af-list-item__right-container", children: [!value && (Boolean(tag) || Boolean(date)) && !isMobile && (_jsxs("div", { className: "af-list-item__additional-data-container", children: [Boolean(tag) && (_jsx(Tag, { classModifier: "warning", ...tagProps, children: tag })), Boolean(date) && (_jsx("span", { className: "af-list-item__date", children: date }))] })), actions.map(({ id, component }) => (_jsx("div", { className: "af-list-item__action-container", children: component }, id))), Boolean(value) && _jsx("span", { className: "af-list-item__value", children: value })] }))] }));

package/dist/index.d.ts

@@ -16,7 +16,7 @@ export { Footer } from "./Layout/Footer/Footer";
 export { Header } from "./Layout/Header";
 export { Link } from "./Link";
 export { List } from "./List";
-export { ClickItem, ClickList } from "./List/ClickList";
+export { ClickItem, ClickList, createClickItemParent } from "./List/ClickList";
 export { ContentItemDuo } from "./List/ContentItemDuo";
 export { ContentItemMono, ContentItemMonoSize } from "./List/ContentItemMono";
 export { ContentTabList } from "./List/ContentTabList";

package/dist/index.js

@@ -15,7 +15,7 @@ export { Footer } from "./Layout/Footer/Footer";
 export { Header } from "./Layout/Header";
 export { Link } from "./Link";
 export { List } from "./List";
-export { ClickItem, ClickList } from "./List/ClickList";
+export { ClickItem, ClickList, createClickItemParent } from "./List/ClickList";
 export { ContentItemDuo } from "./List/ContentItemDuo";
 export { ContentItemMono, ContentItemMonoSize } from "./List/ContentItemMono";
 export { ContentTabList } from "./List/ContentTabList";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@axa-fr/design-system-look-and-feel-react",
-  "version": "0.3.0-ci.291",
+  "version": "0.3.0-ci.293",
   "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.291",
+    "@axa-fr/design-system-look-and-feel-css": "0.3.0-ci.293",
     "@material-symbols/svg-400": ">= 0.19.0",
     "react": ">= 18"
   },