@axa-fr/design-system-apollo-react 1.0.5-alpha.466 → 1.0.5-tags-slash-2-0-0-RC-4.480
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/BasePicture/BasePictureApollo.d.ts +2 -0
- package/dist/BasePicture/BasePictureApollo.js +2 -0
- package/dist/BasePicture/BasePictureCommon.d.ts +1 -0
- package/dist/BasePicture/BasePictureCommon.js +8 -0
- package/dist/BasePicture/BasePictureLF.d.ts +2 -0
- package/dist/BasePicture/BasePictureLF.js +2 -0
- package/dist/ContentItemMono/ContentItemMonoApollo.d.ts +1 -1
- package/dist/ContentItemMono/ContentItemMonoApollo.js +2 -1
- package/dist/ContentItemMono/ContentItemMonoCommon.d.ts +5 -3
- package/dist/ContentItemMono/ContentItemMonoCommon.js +2 -3
- package/dist/ContentItemMono/ContentItemMonoLF.d.ts +1 -1
- package/dist/ContentItemMono/ContentItemMonoLF.js +2 -1
- package/dist/Form/Dropdown/DropdownCommon.js +1 -1
- package/dist/Form/InputDate/InputDateApollo.d.ts +0 -1
- package/dist/Form/InputDate/InputDateCommon.d.ts +0 -1
- package/dist/Form/InputDate/InputDateCommon.js +3 -22
- package/dist/Form/InputDate/InputDateLF.d.ts +0 -1
- package/dist/Form/InputPhone/CountryCodeSelect.js +0 -4
- package/dist/Form/Radio/CardRadio/CardRadioCommon.d.ts +1 -1
- package/dist/Form/Radio/CardRadioOption/CardRadioOptionCommon.d.ts +4 -39
- package/dist/Form/Radio/CardRadioOption/CardRadioOptionCommon.js +2 -3
- package/dist/Form/TextArea/TextAreaCommon.js +1 -1
- package/dist/List/ClickItem/components/ClickItemPrefixApollo.js +2 -1
- package/dist/List/ClickItem/components/ClickItemPrefixCommon.d.ts +5 -4
- package/dist/List/ClickItem/components/ClickItemPrefixCommon.js +2 -3
- package/dist/List/ClickItem/components/ClickItemPrefixLF.js +2 -1
- package/dist/Modal/components/ModalCore.js +1 -1
- package/dist/Modal/components/ModalCoreBody.js +2 -2
- package/dist/Modal/components/ModalCoreFooterCommon.js +4 -2
- package/dist/Modal/components/ModalCoreHeaderCommon.js +1 -1
- package/dist/ProgressBar/ProgressBarApollo.d.ts +1 -1
- package/dist/ProgressBar/ProgressBarCommon.d.ts +4 -8
- package/dist/ProgressBar/ProgressBarCommon.js +5 -7
- package/dist/ProgressBar/ProgressBarLF.d.ts +1 -1
- package/dist/ProgressBarGroup/ProgressBarGroupCommon.js +1 -1
- package/dist/Stepper/StepperCommon.d.ts +1 -3
- package/dist/Stepper/StepperCommon.js +3 -3
- package/dist/index.d.ts +15 -15
- package/dist/index.js +13 -13
- package/dist/indexLF.d.ts +19 -19
- package/dist/indexLF.js +17 -17
- package/package.json +3 -3
- package/dist/BasePicture/BasePicture.d.ts +0 -5
- package/dist/BasePicture/BasePicture.js +0 -6
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const BasePicture: ({ className, src, ...rest }: React.ImgHTMLAttributes<HTMLImageElement>) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
import { useMemo } from "react";
|
|
3
|
+
import logo from "@axa-fr/design-system-apollo-css/logo-axa.svg";
|
|
4
|
+
import { getComponentClassName } from "../utilities/getComponentClassName";
|
|
5
|
+
export const BasePicture = ({ className, src, ...rest }) => {
|
|
6
|
+
const componentClassName = useMemo(() => getComponentClassName("af-basepicture", className), [className]);
|
|
7
|
+
return (_jsx("img", { className: componentClassName, alt: "", src: src || logo, ...rest }));
|
|
8
|
+
};
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import "@axa-fr/design-system-apollo-css/dist/ContentItemMono/ContentItemMonoApollo.scss";
|
|
2
|
-
import {
|
|
2
|
+
import { ContentItemProps } from "./ContentItemMonoCommon";
|
|
3
3
|
export declare const ContentItemMono: (props: ContentItemProps) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
2
|
import "@axa-fr/design-system-apollo-css/dist/ContentItemMono/ContentItemMonoApollo.scss";
|
|
3
|
+
import { BasePicture } from "../BasePicture/BasePictureApollo";
|
|
3
4
|
import { Icon } from "../Icon/IconApollo";
|
|
4
5
|
import { ContentItemMonoCommon, } from "./ContentItemMonoCommon";
|
|
5
|
-
export const ContentItemMono = (props) => (_jsx(ContentItemMonoCommon, { ...props, IconComponent: Icon }));
|
|
6
|
+
export const ContentItemMono = (props) => (_jsx(ContentItemMonoCommon, { ...props, BasePictureComponent: BasePicture, IconComponent: Icon }));
|
|
@@ -1,6 +1,7 @@
|
|
|
1
|
-
import
|
|
1
|
+
import { ComponentProps, ComponentType } from "react";
|
|
2
2
|
import { Icon } from "../Icon/IconCommon";
|
|
3
|
-
import {
|
|
3
|
+
import { BasePicture } from "../BasePicture/BasePictureCommon";
|
|
4
|
+
import { ContentItemCoreProps } from "./ContentItemMonoCore";
|
|
4
5
|
export type ContentMonoItemSize = "medium" | "large";
|
|
5
6
|
export type ContentMonoItemPictureProps = {
|
|
6
7
|
type: "picture";
|
|
@@ -24,6 +25,7 @@ export type ContentMonoItemStickProps = {
|
|
|
24
25
|
export type ContentItemProps = ContentMonoItemPictureProps | ContentMonoItemIconProps | ContentMonoItemStickProps;
|
|
25
26
|
export type ContentItemCommonProps = ContentItemProps & {
|
|
26
27
|
IconComponent: ComponentType<ComponentProps<typeof Icon>>;
|
|
28
|
+
BasePictureComponent: ComponentType<ComponentProps<typeof BasePicture>>;
|
|
27
29
|
};
|
|
28
|
-
export declare const getContentItemCoreProps: ({ IconComponent, type, ...props }: ContentItemCommonProps) => ContentItemCoreProps;
|
|
30
|
+
export declare const getContentItemCoreProps: ({ IconComponent, BasePictureComponent, type, ...props }: ContentItemCommonProps) => ContentItemCoreProps;
|
|
29
31
|
export declare const ContentItemMonoCommon: (props: ContentItemCommonProps) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
-
import { BasePicture } from "../BasePicture/BasePicture";
|
|
3
2
|
import { ContentItemMonoCore, } from "./ContentItemMonoCore";
|
|
4
|
-
export const getContentItemCoreProps = ({ IconComponent, type, ...props }) => {
|
|
3
|
+
export const getContentItemCoreProps = ({ IconComponent, BasePictureComponent, type, ...props }) => {
|
|
5
4
|
if (type === "icon") {
|
|
6
5
|
const { icon, title, subtitle1, subtitle2 } = props;
|
|
7
6
|
return {
|
|
@@ -14,7 +13,7 @@ export const getContentItemCoreProps = ({ IconComponent, type, ...props }) => {
|
|
|
14
13
|
if (type === "picture") {
|
|
15
14
|
return {
|
|
16
15
|
...props,
|
|
17
|
-
leftComponent: (_jsx(
|
|
16
|
+
leftComponent: (_jsx(BasePictureComponent, { src: props.picture, alt: props.title })),
|
|
18
17
|
};
|
|
19
18
|
}
|
|
20
19
|
return {
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
import "@axa-fr/design-system-apollo-css/dist/ContentItemMono/ContentItemMonoLF.scss";
|
|
2
|
-
import {
|
|
2
|
+
import { ContentItemProps } from "./ContentItemMonoCommon";
|
|
3
3
|
export declare const ContentItemMono: (props: ContentItemProps) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
2
|
import "@axa-fr/design-system-apollo-css/dist/ContentItemMono/ContentItemMonoLF.scss";
|
|
3
|
+
import { BasePicture } from "../BasePicture/BasePictureLF";
|
|
3
4
|
import { Icon } from "../Icon/IconLF";
|
|
4
5
|
import { ContentItemMonoCommon, } from "./ContentItemMonoCommon";
|
|
5
|
-
export const ContentItemMono = (props) => (_jsx(ContentItemMonoCommon, { ...props, IconComponent: Icon }));
|
|
6
|
+
export const ContentItemMono = (props) => (_jsx(ContentItemMonoCommon, { ...props, BasePictureComponent: BasePicture, IconComponent: Icon }));
|
|
@@ -6,7 +6,7 @@ const Dropdown = forwardRef(({ id, required, label, error, placeholder, children
|
|
|
6
6
|
let inputId = useId();
|
|
7
7
|
inputId = id || inputId;
|
|
8
8
|
const classname = classNames("af-form__dropdown-input", error && "af-form__dropdown-input--error");
|
|
9
|
-
return (_jsxs("div", { className: "af-form__dropdown-container", children: [_jsx(ItemLabelComponent, { label: label, description: description, buttonLabel: buttonLabel, onButtonClick: onButtonClick, sideButtonLabel: sideButtonLabel, onSideButtonClick: onSideButtonClick, required: required, inputId: inputId }), _jsxs("select", { className: classname, ...otherProps, ref: inputRef, id: inputId, children: [Boolean(placeholder) && _jsx("option", { value: "", children: placeholder }), children] }), helper ? (_jsx("span", { className: "af-form__input-helper", children: helper })) : null, _jsx(ItemMessageComponent, { id: idMessage, message: error || success, messageType: error ? "error" : "success" })] }));
|
|
9
|
+
return (_jsxs("div", { className: "af-form__dropdown-container", children: [_jsx(ItemLabelComponent, { label: label, description: description, buttonLabel: buttonLabel, onButtonClick: onButtonClick, sideButtonLabel: sideButtonLabel, onSideButtonClick: onSideButtonClick, required: required, inputId: inputId }), _jsxs("select", { className: classname, ...otherProps, ref: inputRef, id: inputId, children: [Boolean(placeholder) && (_jsx("option", { disabled: true, value: "", children: placeholder })), children] }), helper ? (_jsx("span", { className: "af-form__input-helper", children: helper })) : null, _jsx(ItemMessageComponent, { id: idMessage, message: error || success, messageType: error ? "error" : "success" })] }));
|
|
10
10
|
});
|
|
11
11
|
Dropdown.displayName = "Dropdown";
|
|
12
12
|
export { Dropdown };
|
|
@@ -10,7 +10,6 @@ export declare const InputDate: import("react").ForwardRefExoticComponent<Omit<O
|
|
|
10
10
|
helper?: string;
|
|
11
11
|
error?: string;
|
|
12
12
|
success?: string;
|
|
13
|
-
hidePicker?: boolean;
|
|
14
13
|
label: ComponentProps<typeof import("../ItemLabel/ItemLabelCommon").ItemLabel>["label"];
|
|
15
14
|
ItemLabelComponent: import("react").ComponentType<Omit<ComponentProps<typeof import("../ItemLabel/ItemLabelCommon").ItemLabel>, "ButtonComponent">>;
|
|
16
15
|
ItemMessageComponent: import("react").ComponentType<ComponentProps<typeof ItemMessage>>;
|
|
@@ -10,7 +10,6 @@ type InputDateProps = Omit<ComponentPropsWithRef<"input">, "value" | "min" | "ma
|
|
|
10
10
|
helper?: string;
|
|
11
11
|
error?: string;
|
|
12
12
|
success?: string;
|
|
13
|
-
hidePicker?: boolean;
|
|
14
13
|
label: ComponentProps<typeof ItemLabel>["label"];
|
|
15
14
|
ItemLabelComponent: ComponentType<Omit<ComponentProps<typeof ItemLabel>, "ButtonComponent">>;
|
|
16
15
|
ItemMessageComponent: ComponentType<ComponentProps<typeof ItemMessage>>;
|
|
@@ -1,33 +1,14 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { forwardRef,
|
|
2
|
+
import { forwardRef, useId, } from "react";
|
|
3
3
|
import { getComponentClassName } from "../../utilities/getComponentClassName";
|
|
4
4
|
import { formatInputDateValue } from "./InputDate.helper";
|
|
5
|
-
const InputDate = forwardRef(({ className, classModifier = "", defaultValue, value, helper, error, success, label, description, buttonLabel, onButtonClick, ItemLabelComponent, ItemMessageComponent, required, "aria-errormessage": ariaErrormessage, min, max,
|
|
6
|
-
const componentClassName = getComponentClassName("af-form__input-date", className ?? "",
|
|
5
|
+
const InputDate = forwardRef(({ className, classModifier = "", defaultValue, value, helper, error, success, label, description, buttonLabel, onButtonClick, ItemLabelComponent, ItemMessageComponent, required, "aria-errormessage": ariaErrormessage, min, max, ...otherProps }, inputRef) => {
|
|
6
|
+
const componentClassName = getComponentClassName("af-form__input-date", className ?? "", classModifier + (error || ariaErrormessage ? " error" : ""));
|
|
7
7
|
let inputId = useId();
|
|
8
8
|
inputId = otherProps.id ?? inputId;
|
|
9
9
|
const idMessage = useId();
|
|
10
10
|
const idHelp = useId();
|
|
11
11
|
const ariaDescribedby = [helper && idHelp, success && idMessage].filter(Boolean);
|
|
12
|
-
/* Stop keydown (space and enter) and click events for Firefox when picker is disabled */
|
|
13
|
-
useEffect(() => {
|
|
14
|
-
function handleKeydown(event) {
|
|
15
|
-
if (hidePicker && (event.keyCode === 13 || event.keyCode === 32)) {
|
|
16
|
-
event.preventDefault();
|
|
17
|
-
}
|
|
18
|
-
}
|
|
19
|
-
function handleClick(event) {
|
|
20
|
-
if (hidePicker) {
|
|
21
|
-
event.preventDefault();
|
|
22
|
-
}
|
|
23
|
-
}
|
|
24
|
-
window.addEventListener("keydown", handleKeydown);
|
|
25
|
-
window.addEventListener("click", handleClick);
|
|
26
|
-
return () => {
|
|
27
|
-
window.removeEventListener("keydown", handleKeydown);
|
|
28
|
-
window.removeEventListener("click", handleClick);
|
|
29
|
-
};
|
|
30
|
-
}, [hidePicker]);
|
|
31
12
|
return (_jsxs("div", { className: "af-form__input-container", children: [_jsx(ItemLabelComponent, { label: label, description: description, buttonLabel: buttonLabel, onButtonClick: onButtonClick, required: required, inputId: inputId }), _jsx("input", { ...otherProps, id: inputId, className: componentClassName, type: "date", ref: inputRef, defaultValue: formatInputDateValue(defaultValue), value: formatInputDateValue(value), "aria-errormessage": ariaErrormessage ?? (error ? idMessage : undefined), "aria-invalid": Boolean(error ?? ariaErrormessage), "aria-describedby": ariaDescribedby.length > 0 ? ariaDescribedby.join(" ") : undefined, required: required, min: formatInputDateValue(min), max: formatInputDateValue(max) }), helper ? (_jsx("span", { id: idHelp, className: "af-form__input-helper", children: helper })) : null, _jsx(ItemMessageComponent, { id: idMessage, message: error || success, messageType: error ? "error" : "success" })] }));
|
|
32
13
|
});
|
|
33
14
|
InputDate.displayName = "InputDate";
|
|
@@ -10,7 +10,6 @@ export declare const InputDate: import("react").ForwardRefExoticComponent<Omit<O
|
|
|
10
10
|
helper?: string;
|
|
11
11
|
error?: string;
|
|
12
12
|
success?: string;
|
|
13
|
-
hidePicker?: boolean;
|
|
14
13
|
label: ComponentProps<typeof import("../ItemLabel/ItemLabelCommon").ItemLabel>["label"];
|
|
15
14
|
ItemLabelComponent: import("react").ComponentType<Omit<ComponentProps<typeof import("../ItemLabel/ItemLabelCommon").ItemLabel>, "ButtonComponent">>;
|
|
16
15
|
ItemMessageComponent: import("react").ComponentType<ComponentProps<typeof ItemMessage>>;
|
|
@@ -17,10 +17,6 @@ const CountryCodeSelect = ({ options, defaultCountry, onChangeSelect, IconCompon
|
|
|
17
17
|
...provided,
|
|
18
18
|
display: "none",
|
|
19
19
|
}),
|
|
20
|
-
singleValue: (provided) => ({
|
|
21
|
-
...provided,
|
|
22
|
-
color: "inherit",
|
|
23
|
-
}),
|
|
24
20
|
};
|
|
25
21
|
const formatOptionLabel = ({ flag, code }) => (_jsxs("div", { className: "country-code-select-format-label", children: [_jsx(IconComponent, { src: flag }), code] }));
|
|
26
22
|
const handleChange = (newValue) => {
|
|
@@ -2,7 +2,7 @@ import { type ComponentProps, type ComponentType, type PropsWithChildren, type R
|
|
|
2
2
|
import { ItemMessage } from "../../ItemMessage/ItemMessageLF";
|
|
3
3
|
import { type CardRadioOptionProps } from "../CardRadioOption/CardRadioOptionCommon";
|
|
4
4
|
type RadioOption = Omit<CardRadioOptionProps, "name" | "type" | "isInvalid">;
|
|
5
|
-
export type CardRadioProps = Omit<CardRadioOptionProps, "value" | "label" | "type" | "isInvalid" | "icon" | "
|
|
5
|
+
export type CardRadioProps = Omit<CardRadioOptionProps, "value" | "label" | "type" | "isInvalid" | "icon" | "description" | "subtitle" | "children"> & {
|
|
6
6
|
type?: "vertical" | "horizontal";
|
|
7
7
|
/**
|
|
8
8
|
* @deprecated Use `label` instead.
|
|
@@ -1,50 +1,15 @@
|
|
|
1
1
|
import { type ComponentProps, type ComponentType, type ReactNode } from "react";
|
|
2
2
|
import type { Icon as IconCommon } from "../../../Icon/IconCommon";
|
|
3
|
-
import { BasePicture } from "../../../BasePicture/BasePicture";
|
|
4
3
|
import type { Radio } from "../Radio/RadioCommon";
|
|
5
|
-
type
|
|
4
|
+
export type CardRadioOptionProps = Omit<ComponentProps<typeof Radio>, "size"> & {
|
|
6
5
|
label: ReactNode;
|
|
6
|
+
type?: "vertical" | "horizontal";
|
|
7
7
|
description?: ReactNode;
|
|
8
8
|
subtitle?: ReactNode;
|
|
9
|
-
};
|
|
10
|
-
export type CardRadioOptionProps = (BaseCardRadioOptionProps & {
|
|
11
|
-
type?: "vertical" | "horizontal";
|
|
12
9
|
icon?: ComponentProps<typeof IconCommon>["src"];
|
|
13
|
-
|
|
14
|
-
basePictureProps?: undefined;
|
|
15
|
-
}) | (BaseCardRadioOptionProps & {
|
|
16
|
-
type: "horizontal";
|
|
17
|
-
src?: ComponentProps<typeof BasePicture>["src"];
|
|
18
|
-
basePictureProps?: Omit<ComponentProps<typeof BasePicture>, "src">;
|
|
19
|
-
icon?: undefined;
|
|
20
|
-
});
|
|
10
|
+
};
|
|
21
11
|
export type CardRadioOptionCommonProps = CardRadioOptionProps & {
|
|
22
12
|
RadioComponent: ComponentType<ComponentProps<typeof Radio>>;
|
|
23
13
|
IconComponent: ComponentType<ComponentProps<typeof IconCommon>>;
|
|
24
14
|
};
|
|
25
|
-
export declare const CardRadioOptionCommon: import("react").ForwardRefExoticComponent<
|
|
26
|
-
label: ReactNode;
|
|
27
|
-
description?: ReactNode;
|
|
28
|
-
subtitle?: ReactNode;
|
|
29
|
-
} & {
|
|
30
|
-
type?: "vertical" | "horizontal";
|
|
31
|
-
icon?: ComponentProps<typeof IconCommon>["src"];
|
|
32
|
-
src?: undefined;
|
|
33
|
-
basePictureProps?: undefined;
|
|
34
|
-
} & {
|
|
35
|
-
RadioComponent: ComponentType<ComponentProps<typeof Radio>>;
|
|
36
|
-
IconComponent: ComponentType<ComponentProps<typeof IconCommon>>;
|
|
37
|
-
}, "ref"> | Omit<Omit<Omit<import("../Radio/RadioCommon").RadioProps, "ref"> & import("react").RefAttributes<HTMLInputElement>, "size"> & {
|
|
38
|
-
label: ReactNode;
|
|
39
|
-
description?: ReactNode;
|
|
40
|
-
subtitle?: ReactNode;
|
|
41
|
-
} & {
|
|
42
|
-
type: "horizontal";
|
|
43
|
-
src?: ComponentProps<typeof BasePicture>["src"];
|
|
44
|
-
basePictureProps?: Omit<ComponentProps<typeof BasePicture>, "src">;
|
|
45
|
-
icon?: undefined;
|
|
46
|
-
} & {
|
|
47
|
-
RadioComponent: ComponentType<ComponentProps<typeof Radio>>;
|
|
48
|
-
IconComponent: ComponentType<ComponentProps<typeof IconCommon>>;
|
|
49
|
-
}, "ref">) & import("react").RefAttributes<HTMLInputElement>>;
|
|
50
|
-
export {};
|
|
15
|
+
export declare const CardRadioOptionCommon: import("react").ForwardRefExoticComponent<Omit<CardRadioOptionCommonProps, "ref"> & import("react").RefAttributes<HTMLInputElement>>;
|
|
@@ -1,12 +1,11 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { forwardRef, } from "react";
|
|
3
|
-
|
|
4
|
-
export const CardRadioOptionCommon = forwardRef(({ label, type, description, subtitle, icon, src, basePictureProps, isInvalid, className, RadioComponent, IconComponent, ...inputProps }, ref) => (_jsxs("label", { className: [
|
|
3
|
+
export const CardRadioOptionCommon = forwardRef(({ label, type = "vertical", description, subtitle, icon, isInvalid, className, RadioComponent, IconComponent, ...inputProps }, ref) => (_jsxs("label", { className: [
|
|
5
4
|
"af-card-radio-option",
|
|
6
5
|
isInvalid && "af-card-radio-option--invalid",
|
|
7
6
|
type === "horizontal" && "af-card-radio-option--horizontal",
|
|
8
7
|
className,
|
|
9
8
|
]
|
|
10
9
|
.filter(Boolean)
|
|
11
|
-
.join(" "), children: [icon ? _jsx(IconComponent, { src: icon, role: "presentation" }) : null,
|
|
10
|
+
.join(" "), children: [icon ? _jsx(IconComponent, { src: icon, role: "presentation" }) : null, _jsxs("div", { className: "af-card-radio-option__content", children: [_jsx("p", { className: "af-card-radio-option__label", children: label }), Boolean(description) && (_jsx("p", { className: "af-card-radio-option__description", children: description })), Boolean(subtitle) && (_jsx("p", { className: "af-card-radio-option__subtitle", children: subtitle }))] }), _jsx(RadioComponent, { ...inputProps, isInvalid: isInvalid, ref: ref })] })));
|
|
12
11
|
CardRadioOptionCommon.displayName = "CardRadioOptionCommon";
|
|
@@ -7,6 +7,6 @@ export const TextArea = forwardRef(({ id, className, classModifier = "", label,
|
|
|
7
7
|
const errorId = `${inputId}-error`;
|
|
8
8
|
return (_jsxs("div", { className: ["af-form__input-container", className]
|
|
9
9
|
.filter(Boolean)
|
|
10
|
-
.join(" "), children: [_jsx(ItemLabelComponent, { label: label, description: description, buttonLabel: buttonLabel, onButtonClick: onButtonClick, sideButtonLabel: sideButtonLabel, onSideButtonClick: onSideButtonClick, required: required, inputId: inputId }), _jsx("textarea", { id: inputId, className: "af-
|
|
10
|
+
.join(" "), children: [_jsx(ItemLabelComponent, { label: label, description: description, buttonLabel: buttonLabel, onButtonClick: onButtonClick, sideButtonLabel: sideButtonLabel, onSideButtonClick: onSideButtonClick, required: required, inputId: inputId }), _jsx("textarea", { id: inputId, className: "af-form__input-textarea", ref: inputRef, "aria-errormessage": error ? errorId : undefined, "aria-describedby": helper ? helperId : undefined, required: required, "aria-invalid": Boolean(error) || classModifier.includes("error") ? true : undefined, placeholder: placeholder, ...inputProps }), helper ? (_jsx("span", { id: helperId, className: "af-form__input-helper", children: helper })) : null, _jsx(ItemMessageComponent, { id: errorId, message: error })] }));
|
|
11
11
|
});
|
|
12
12
|
TextArea.displayName = "TextArea";
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
2
|
import { Icon } from "../../../Icon/IconApollo";
|
|
3
|
+
import { BasePicture } from "../../../BasePicture/BasePictureApollo";
|
|
3
4
|
import { ClickItemPrefixCommon, } from "./ClickItemPrefixCommon";
|
|
4
|
-
export const ClickItemPrefix = (props) => (_jsx(ClickItemPrefixCommon, { ...props, IconComponent: Icon }));
|
|
5
|
+
export const ClickItemPrefix = (props) => (_jsx(ClickItemPrefixCommon, { BasePictureComponent: BasePicture, ...props, IconComponent: Icon }));
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import
|
|
2
|
-
import { BasePicture } from "../../../BasePicture/
|
|
1
|
+
import { ComponentProps, ComponentType } from "react";
|
|
2
|
+
import { BasePicture } from "../../../BasePicture/BasePictureCommon";
|
|
3
3
|
import type { IconProps } from "../../../Icon/IconCommon";
|
|
4
|
-
import
|
|
4
|
+
import { ClickItemStates, ClickItemVariants } from "../ClickItemCommon";
|
|
5
5
|
export type ClickItemPrefixProps = {
|
|
6
6
|
state: ClickItemStates;
|
|
7
7
|
variant: ClickItemVariants;
|
|
@@ -10,5 +10,6 @@ export type ClickItemPrefixProps = {
|
|
|
10
10
|
};
|
|
11
11
|
export type ClickItemPrefixCommonProps = ClickItemPrefixProps & {
|
|
12
12
|
IconComponent: ComponentType<IconProps>;
|
|
13
|
+
BasePictureComponent: ComponentType<ComponentProps<typeof BasePicture>>;
|
|
13
14
|
};
|
|
14
|
-
export declare const ClickItemPrefixCommon: ({ state, variant, icon, basePictureProps, IconComponent, }: ClickItemPrefixCommonProps) => import("react/jsx-runtime").JSX.Element | null;
|
|
15
|
+
export declare const ClickItemPrefixCommon: ({ state, variant, icon, basePictureProps, IconComponent, BasePictureComponent, }: ClickItemPrefixCommonProps) => import("react/jsx-runtime").JSX.Element | null;
|
|
@@ -1,11 +1,10 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
-
|
|
3
|
-
export const ClickItemPrefixCommon = ({ state, variant, icon, basePictureProps, IconComponent, }) => {
|
|
2
|
+
export const ClickItemPrefixCommon = ({ state, variant, icon, basePictureProps, IconComponent, BasePictureComponent, }) => {
|
|
4
3
|
if (!(Boolean(basePictureProps) && variant === "agent") && !icon) {
|
|
5
4
|
return null;
|
|
6
5
|
}
|
|
7
6
|
if (Boolean(basePictureProps) && variant === "agent") {
|
|
8
|
-
return _jsx(
|
|
7
|
+
return _jsx(BasePictureComponent, { ...basePictureProps });
|
|
9
8
|
}
|
|
10
9
|
return (_jsx(IconComponent, { role: "presentation", src: icon ?? "", variant: state === "disabled" && variant !== "small" ? "disabled" : "primary" }));
|
|
11
10
|
};
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
2
|
import { Icon } from "../../../Icon/IconLF";
|
|
3
|
+
import { BasePicture } from "../../../BasePicture/BasePictureLF";
|
|
3
4
|
import { ClickItemPrefixCommon, } from "./ClickItemPrefixCommon";
|
|
4
|
-
export const ClickItemPrefix = (props) => (_jsx(ClickItemPrefixCommon, { ...props, IconComponent: Icon }));
|
|
5
|
+
export const ClickItemPrefix = (props) => (_jsx(ClickItemPrefixCommon, { BasePictureComponent: BasePicture, ...props, IconComponent: Icon }));
|
|
@@ -2,6 +2,6 @@ import { jsx as _jsx } from "react/jsx-runtime";
|
|
|
2
2
|
import { forwardRef } from "react";
|
|
3
3
|
const ModalCore = forwardRef(({ className, children, ...props }, ref) => (
|
|
4
4
|
// eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions, jsx-a11y/click-events-have-key-events
|
|
5
|
-
_jsx("dialog", { "aria-
|
|
5
|
+
_jsx("dialog", { "aria-label": props["aria-label"] ?? props.title, className: ["af-apollo-modal", className].filter(Boolean).join(" "), onClick: props.onClose, ref: ref, ...props, children: _jsx("section", { className: "af-apollo-modal__content", onClick: (e) => e.stopPropagation(), children: children }) })));
|
|
6
6
|
ModalCore.displayName = "ModalCore";
|
|
7
7
|
export { ModalCore };
|
|
@@ -5,8 +5,8 @@ export const ModalCoreBody = ({ children, className, ...otherProps }) => {
|
|
|
5
5
|
const bodyRef = useRef(null);
|
|
6
6
|
const { vertical: hasVerticalScroll } = useHasScroll(bodyRef);
|
|
7
7
|
return (_jsx("main", { className: [
|
|
8
|
-
"af-modal__body",
|
|
9
|
-
hasVerticalScroll ? "af-modal__body-vertical-scroll" : undefined,
|
|
8
|
+
"af-apollo-modal__body",
|
|
9
|
+
hasVerticalScroll ? "af-apollo-modal__body-vertical-scroll" : undefined,
|
|
10
10
|
className,
|
|
11
11
|
]
|
|
12
12
|
.filter(Boolean)
|
|
@@ -1,9 +1,11 @@
|
|
|
1
1
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
2
|
const renderFooterButtons = (ButtonComponent, buttons) => ButtonComponent &&
|
|
3
|
-
buttons.map(([variant, props]) => Boolean(props) && (_jsx(ButtonComponent, { variant: variant, ...props, className: [props?.className, "af-modal__footer-button"]
|
|
3
|
+
buttons.map(([variant, props]) => Boolean(props) && (_jsx(ButtonComponent, { variant: variant, ...props, className: [props?.className, "af-apollo-modal__footer-button"]
|
|
4
4
|
.filter(Boolean)
|
|
5
5
|
.join(" ") }, variant)));
|
|
6
|
-
export const ModalCoreFooterCommon = ({ className, buttonComponent: ButtonComponent, primaryButtonProps, secondaryButtonProps, tertiaryButtonProps, ...rest }) => (primaryButtonProps || secondaryButtonProps || tertiaryButtonProps) && (_jsx("footer", { className: ["af-modal__footer", className]
|
|
6
|
+
export const ModalCoreFooterCommon = ({ className, buttonComponent: ButtonComponent, primaryButtonProps, secondaryButtonProps, tertiaryButtonProps, ...rest }) => (primaryButtonProps || secondaryButtonProps || tertiaryButtonProps) && (_jsx("footer", { className: ["af-apollo-modal__footer", className]
|
|
7
|
+
.filter(Boolean)
|
|
8
|
+
.join(" "), ...rest, children: renderFooterButtons(ButtonComponent, [
|
|
7
9
|
["tertiary", tertiaryButtonProps],
|
|
8
10
|
["secondary", secondaryButtonProps],
|
|
9
11
|
["primary", primaryButtonProps],
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import close from "@material-symbols/svg-400/rounded/close.svg";
|
|
3
3
|
import { ClickIcon } from "../../ClickIcon/ClickIconCommon";
|
|
4
|
-
export const ModalCoreHeaderCommon = ({ className, headingComponent: HeadingComponent, headingProps, iconComponent: IconComponent, iconProps, onClose, closeButtonAriaLabel = "Fermer la boite de dialogue", ...props }) => (_jsxs("header", { className: ["af-modal__header", className].filter(Boolean).join(" "), ...props, children: [_jsx(ClickIcon, { className: "af-modal__header-close-btn", src: close, onClick: onClose, "aria-label": closeButtonAriaLabel }), _jsxs("div", { className: "af-modal__header-title", children: [IconComponent && iconProps ? (_jsx(IconComponent, { size: "M", ...iconProps })) : null, _jsx(HeadingComponent, { level: 2, ...headingProps })] })] }));
|
|
4
|
+
export const ModalCoreHeaderCommon = ({ className, headingComponent: HeadingComponent, headingProps, iconComponent: IconComponent, iconProps, onClose, closeButtonAriaLabel = "Fermer la boite de dialogue", ...props }) => (_jsxs("header", { className: ["af-apollo-modal__header", className].filter(Boolean).join(" "), ...props, children: [_jsx(ClickIcon, { className: "af-apollo-modal__header-close-btn", src: close, onClick: onClose, "aria-label": closeButtonAriaLabel }), _jsxs("div", { className: "af-apollo-modal__header-title", children: [IconComponent && iconProps ? (_jsx(IconComponent, { size: "M", ...iconProps })) : null, _jsx(HeadingComponent, { level: 2, ...headingProps })] })] }));
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import "@axa-fr/design-system-apollo-css/dist/ProgressBar/ProgressBarApollo.scss";
|
|
2
|
-
export { ProgressBar } from "./ProgressBarCommon";
|
|
2
|
+
export { ProgressBar, type ProgressBarProps } from "./ProgressBarCommon";
|
|
@@ -1,9 +1,5 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
1
|
+
export type ProgressBarProps = {
|
|
2
|
+
value: number;
|
|
3
|
+
active?: boolean;
|
|
4
4
|
};
|
|
5
|
-
export declare const ProgressBar: {
|
|
6
|
-
({ id, label, className, ...props }: ProgressBarProps): import("react/jsx-runtime").JSX.Element;
|
|
7
|
-
displayName: string;
|
|
8
|
-
};
|
|
9
|
-
export {};
|
|
5
|
+
export declare const ProgressBar: ({ value, active, }: ProgressBarProps) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,8 +1,6 @@
|
|
|
1
|
-
import { jsx as _jsx
|
|
2
|
-
|
|
3
|
-
export const ProgressBar = ({
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
return (_jsxs(_Fragment, { children: [Boolean(label) && (_jsx("label", { className: "af-progress-bar__label", htmlFor: inputId, children: label })), _jsx("progress", { id: inputId, className: ["af-progress-bar", className].filter(Boolean).join(" "), ...props })] }));
|
|
1
|
+
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
+
const MAX_STEPPER_PROGRESS = 100;
|
|
3
|
+
export const ProgressBar = ({ value = MAX_STEPPER_PROGRESS, active = true, }) => {
|
|
4
|
+
const clampedValue = Math.max(0, Math.min(value, MAX_STEPPER_PROGRESS));
|
|
5
|
+
return (_jsx("div", { role: "progressbar", className: "af-progressbar", "aria-valuemin": 0, "aria-valuemax": MAX_STEPPER_PROGRESS, "aria-valuenow": clampedValue, "aria-current": active, "aria-hidden": !active, "aria-label": `Progression : ${clampedValue}%`, children: _jsx("div", { className: "af-progressbar__progress", style: { width: `${clampedValue}%` } }) }));
|
|
7
6
|
};
|
|
8
|
-
ProgressBar.displayName = "ProgressBar";
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import "@axa-fr/design-system-apollo-css/dist/ProgressBar/ProgressBarLF.scss";
|
|
2
|
-
export { ProgressBar } from "./ProgressBarCommon";
|
|
2
|
+
export { ProgressBar, type ProgressBarProps } from "./ProgressBarCommon";
|
|
@@ -14,5 +14,5 @@ export const ProgressBarGroup = ({ currentStepProgress = INITIAL_STEPPER_PROGRES
|
|
|
14
14
|
}
|
|
15
15
|
return 0;
|
|
16
16
|
};
|
|
17
|
-
return (_jsx("div", { id: stepperId, role: "group", "aria-label": label, className: classNames("af-progress-bar-group", className), children: [...Array(nbSteps).keys()].map((index) => (_jsx(ProgressBarComponent, { value: getCurrentProgress(index),
|
|
17
|
+
return (_jsx("div", { id: stepperId, role: "group", "aria-label": label, className: classNames("af-progress-bar-group", className), children: [...Array(nbSteps).keys()].map((index) => (_jsx(ProgressBarComponent, { value: getCurrentProgress(index), active: index === currentStep }, `${stepperId}-${index}`))) }));
|
|
18
18
|
};
|
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
import { ComponentType, type HTMLAttributes } from "react";
|
|
2
|
-
import { type ItemMessageProps } from "../Form/ItemMessage/ItemMessageCommon";
|
|
3
2
|
import { ProgressBarGroupProps } from "../ProgressBarGroup/ProgressBarGroupCommon";
|
|
4
3
|
export type StepperProps = {
|
|
5
4
|
currentStepProgress?: number;
|
|
@@ -9,8 +8,7 @@ export type StepperProps = {
|
|
|
9
8
|
nbSteps?: 3 | 4 | 5 | 6 | 7 | 8;
|
|
10
9
|
helper?: string;
|
|
11
10
|
message?: string;
|
|
12
|
-
messageType?: ItemMessageProps["messageType"];
|
|
13
11
|
titleLevel?: 1 | 2 | 3;
|
|
14
12
|
ProgressBarGroupComponent: ComponentType<Omit<ProgressBarGroupProps, "ProgressBarComponent">>;
|
|
15
13
|
} & Omit<HTMLAttributes<HTMLDivElement>, "role">;
|
|
16
|
-
export declare const Stepper: ({ currentStepProgress, currentTitle, nbSteps, currentStep, currentSubtitle, className, ProgressBarGroupComponent, helper, message,
|
|
14
|
+
export declare const Stepper: ({ currentStepProgress, currentTitle, nbSteps, currentStep, currentSubtitle, className, ProgressBarGroupComponent, helper, message, titleLevel, ...props }: StepperProps) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { useId, } from "react";
|
|
3
|
-
import { ItemMessage
|
|
4
|
-
export const Stepper = ({ currentStepProgress, currentTitle, nbSteps, currentStep, currentSubtitle, className, ProgressBarGroupComponent, helper, message,
|
|
3
|
+
import { ItemMessage } from "../Form/ItemMessage/ItemMessageCommon";
|
|
4
|
+
export const Stepper = ({ currentStepProgress, currentTitle, nbSteps, currentStep, currentSubtitle, className, ProgressBarGroupComponent, helper, message, titleLevel = 2, ...props }) => {
|
|
5
5
|
const stepperId = useId();
|
|
6
6
|
const Title = `h${titleLevel}`;
|
|
7
|
-
return (_jsxs("div", { className: "af-stepper", ...props, children: [_jsxs("div", { className: "af-stepper__header", children: [_jsx(Title, { className: "af-stepper__title", "aria-describedby": stepperId, children: currentTitle }), Boolean(currentSubtitle) && (_jsx("p", { className: "af-stepper__subtitle", children: currentSubtitle }))] }), _jsx(ProgressBarGroupComponent, { label: currentTitle, className: className, currentStep: currentStep, nbSteps: nbSteps, currentStepProgress: currentStepProgress }), Boolean(helper) && _jsx("span", { className: "af-stepper__helper", children: helper }), _jsx(ItemMessage, { message: message, messageType:
|
|
7
|
+
return (_jsxs("div", { className: "af-stepper", ...props, children: [_jsxs("div", { className: "af-stepper__header", children: [_jsx(Title, { className: "af-stepper__title", "aria-describedby": stepperId, children: currentTitle }), Boolean(currentSubtitle) && (_jsx("p", { className: "af-stepper__subtitle", children: currentSubtitle }))] }), _jsx(ProgressBarGroupComponent, { label: currentTitle, className: className, currentStep: currentStep, nbSteps: nbSteps, currentStepProgress: currentStepProgress }), Boolean(helper) && _jsx("span", { className: "af-stepper__helper", children: helper }), _jsx(ItemMessage, { message: message, messageType: "success" })] }));
|
|
8
8
|
};
|
package/dist/index.d.ts
CHANGED
|
@@ -2,41 +2,37 @@ import "@axa-fr/design-system-apollo-css/dist/common/reboot.scss";
|
|
|
2
2
|
import "@axa-fr/design-system-apollo-css/dist/common/tokens.scss";
|
|
3
3
|
import "@axa-fr/design-system-apollo-css/dist/Grid/Grid.scss";
|
|
4
4
|
import "@fontsource/source-sans-pro";
|
|
5
|
-
export { Accordion,
|
|
5
|
+
export { Accordion, type AccordionVariants, accordionVariants, } from "./Accordion/AccordionApollo";
|
|
6
6
|
export { AccordionCore } from "./AccordionCore/AccordionCoreApollo";
|
|
7
|
-
export { BasePicture } from "./BasePicture/
|
|
7
|
+
export { BasePicture } from "./BasePicture/BasePictureApollo";
|
|
8
8
|
export { Button, buttonVariants, type ButtonVariants, } from "./Button/ButtonApollo";
|
|
9
9
|
export { CardMessage, cardMessageVariants, type CardMessageVariants, } from "./CardMessage/CardMessageApollo";
|
|
10
10
|
export { ClickIcon } from "./ClickIcon/ClickIconApollo";
|
|
11
|
+
export { ClickItem, clickItemStates, clickItemVariants, type ClickItemStates, type ClickItemVariants, } from "./List/ClickItem/ClickItemApollo";
|
|
11
12
|
export { ContentItemMono } from "./ContentItemMono/ContentItemMonoApollo";
|
|
12
13
|
export { DataAgent } from "./DataAgent/DataAgentApollo";
|
|
13
14
|
export { Divider } from "./Divider/DividerApollo";
|
|
15
|
+
export { Checkbox } from "./Form/Checkbox/Checkbox/CheckboxApollo";
|
|
14
16
|
export { CardCheckbox,
|
|
15
17
|
/** @deprecated Use `CardCheckbox` instead. */
|
|
16
18
|
CardCheckbox as CheckboxCard, } from "./Form/Checkbox/CardCheckbox/CardCheckboxApollo";
|
|
17
|
-
export { CardCheckboxOption } from "./Form/Checkbox/CardCheckboxOption/CardCheckboxOptionApollo";
|
|
18
|
-
export { Checkbox } from "./Form/Checkbox/Checkbox/CheckboxApollo";
|
|
19
19
|
export { CheckboxText } from "./Form/Checkbox/CheckboxText/CheckboxTextApollo";
|
|
20
|
-
export {
|
|
20
|
+
export { CardCheckboxOption } from "./Form/Checkbox/CardCheckboxOption/CardCheckboxOptionApollo";
|
|
21
21
|
export { InputDate } from "./Form/InputDate/InputDateApollo";
|
|
22
|
-
export { type OptionType } from "./Form/InputPhone/InputPhone.types";
|
|
23
|
-
export { InputPhone } from "./Form/InputPhone/InputPhoneApollo";
|
|
24
|
-
export { InputText } from "./Form/InputText/InputTextApollo";
|
|
25
|
-
export { InputTextAtom } from "./Form/InputTextAtom/InputTextAtomApollo";
|
|
26
|
-
export { ItemFile, itemFileVariants } from "./Form/ItemFile/ItemFileApollo";
|
|
27
22
|
export { ItemLabel } from "./Form/ItemLabel/ItemLabelApollo";
|
|
28
23
|
export { ItemMessage } from "./Form/ItemMessage/ItemMessageApollo";
|
|
29
|
-
export {
|
|
30
|
-
export { CardRadioOption } from "./Form/Radio/CardRadioOption/CardRadioOptionApollo";
|
|
31
|
-
export { Radio } from "./Form/Radio/Radio/RadioApollo";
|
|
24
|
+
export { ItemFile, itemFileVariants } from "./Form/ItemFile/ItemFileApollo";
|
|
32
25
|
export { TextArea } from "./Form/TextArea/TextAreaApollo";
|
|
26
|
+
export { Radio } from "./Form/Radio/Radio/RadioApollo";
|
|
27
|
+
export { CardRadioOption } from "./Form/Radio/CardRadioOption/CardRadioOptionApollo";
|
|
28
|
+
export { CardRadio } from "./Form/Radio/CardRadio/CardRadioApollo";
|
|
29
|
+
export { InputText } from "./Form/InputText/InputTextApollo";
|
|
33
30
|
export { DebugGrid } from "./Grid/DebugGridApollo";
|
|
34
31
|
export { Heading, type HeadingLevel } from "./Heading/HeadingApollo";
|
|
32
|
+
export { InputTextAtom } from "./Form/InputTextAtom/InputTextAtomApollo";
|
|
35
33
|
export { Icon, iconSizeVariants, iconVariants, type IconSizeVariants, type IconVariants, } from "./Icon/IconApollo";
|
|
36
34
|
export { ItemTabBar, itemTabBarVariants, type ItemTabBarVariants, } from "./ItemTabBar/ItemTabBarApollo";
|
|
37
|
-
export { Footer, type FooterProps } from "./Layout/Footer/FooterApollo";
|
|
38
35
|
export { Link, linkVariants, type LinkVariants } from "./Link/LinkApollo";
|
|
39
|
-
export { ClickItem, clickItemStates, clickItemVariants, type ClickItemStates, type ClickItemVariants, } from "./List/ClickItem/ClickItemApollo";
|
|
40
36
|
export { ContentItemDuo } from "./List/ContentItemDuo/ContentItemDuoApollo";
|
|
41
37
|
export { Message, messageVariants, type MessageVariants, } from "./Message/MessageApollo";
|
|
42
38
|
export { Modal, ModalCore, ModalCoreBody, ModalCoreFooter, ModalCoreHeader, } from "./Modal/ModalApollo";
|
|
@@ -48,3 +44,7 @@ export { Svg } from "./Svg/Svg";
|
|
|
48
44
|
export { Tag, tagVariants, type TagVariants } from "./Tag/TagApollo";
|
|
49
45
|
export { TimelineVertical } from "./TimelineVertical/TimelineVerticalApollo";
|
|
50
46
|
export { Toggle } from "./Toggle/ToggleApollo";
|
|
47
|
+
export { InputPhone } from "./Form/InputPhone/InputPhoneApollo";
|
|
48
|
+
export { type OptionType } from "./Form/InputPhone/InputPhone.types";
|
|
49
|
+
export { Dropdown } from "./Form/Dropdown/DropdownApollo";
|
|
50
|
+
export { Footer, type FooterProps } from "./Layout/Footer/FooterApollo";
|
package/dist/index.js
CHANGED
|
@@ -4,38 +4,35 @@ import "@axa-fr/design-system-apollo-css/dist/Grid/Grid.scss";
|
|
|
4
4
|
import "@fontsource/source-sans-pro";
|
|
5
5
|
export { Accordion, accordionVariants, } from "./Accordion/AccordionApollo";
|
|
6
6
|
export { AccordionCore } from "./AccordionCore/AccordionCoreApollo";
|
|
7
|
-
export { BasePicture } from "./BasePicture/
|
|
7
|
+
export { BasePicture } from "./BasePicture/BasePictureApollo";
|
|
8
8
|
export { Button, buttonVariants, } from "./Button/ButtonApollo";
|
|
9
9
|
export { CardMessage, cardMessageVariants, } from "./CardMessage/CardMessageApollo";
|
|
10
10
|
export { ClickIcon } from "./ClickIcon/ClickIconApollo";
|
|
11
|
+
export { ClickItem, clickItemStates, clickItemVariants, } from "./List/ClickItem/ClickItemApollo";
|
|
11
12
|
export { ContentItemMono } from "./ContentItemMono/ContentItemMonoApollo";
|
|
12
13
|
export { DataAgent } from "./DataAgent/DataAgentApollo";
|
|
13
14
|
export { Divider } from "./Divider/DividerApollo";
|
|
15
|
+
export { Checkbox } from "./Form/Checkbox/Checkbox/CheckboxApollo";
|
|
14
16
|
export { CardCheckbox,
|
|
15
17
|
/** @deprecated Use `CardCheckbox` instead. */
|
|
16
18
|
CardCheckbox as CheckboxCard, } from "./Form/Checkbox/CardCheckbox/CardCheckboxApollo";
|
|
17
|
-
export { CardCheckboxOption } from "./Form/Checkbox/CardCheckboxOption/CardCheckboxOptionApollo";
|
|
18
|
-
export { Checkbox } from "./Form/Checkbox/Checkbox/CheckboxApollo";
|
|
19
19
|
export { CheckboxText } from "./Form/Checkbox/CheckboxText/CheckboxTextApollo";
|
|
20
|
-
export {
|
|
20
|
+
export { CardCheckboxOption } from "./Form/Checkbox/CardCheckboxOption/CardCheckboxOptionApollo";
|
|
21
21
|
export { InputDate } from "./Form/InputDate/InputDateApollo";
|
|
22
|
-
export { InputPhone } from "./Form/InputPhone/InputPhoneApollo";
|
|
23
|
-
export { InputText } from "./Form/InputText/InputTextApollo";
|
|
24
|
-
export { InputTextAtom } from "./Form/InputTextAtom/InputTextAtomApollo";
|
|
25
|
-
export { ItemFile, itemFileVariants } from "./Form/ItemFile/ItemFileApollo";
|
|
26
22
|
export { ItemLabel } from "./Form/ItemLabel/ItemLabelApollo";
|
|
27
23
|
export { ItemMessage } from "./Form/ItemMessage/ItemMessageApollo";
|
|
28
|
-
export {
|
|
29
|
-
export { CardRadioOption } from "./Form/Radio/CardRadioOption/CardRadioOptionApollo";
|
|
30
|
-
export { Radio } from "./Form/Radio/Radio/RadioApollo";
|
|
24
|
+
export { ItemFile, itemFileVariants } from "./Form/ItemFile/ItemFileApollo";
|
|
31
25
|
export { TextArea } from "./Form/TextArea/TextAreaApollo";
|
|
26
|
+
export { Radio } from "./Form/Radio/Radio/RadioApollo";
|
|
27
|
+
export { CardRadioOption } from "./Form/Radio/CardRadioOption/CardRadioOptionApollo";
|
|
28
|
+
export { CardRadio } from "./Form/Radio/CardRadio/CardRadioApollo";
|
|
29
|
+
export { InputText } from "./Form/InputText/InputTextApollo";
|
|
32
30
|
export { DebugGrid } from "./Grid/DebugGridApollo";
|
|
33
31
|
export { Heading } from "./Heading/HeadingApollo";
|
|
32
|
+
export { InputTextAtom } from "./Form/InputTextAtom/InputTextAtomApollo";
|
|
34
33
|
export { Icon, iconSizeVariants, iconVariants, } from "./Icon/IconApollo";
|
|
35
34
|
export { ItemTabBar, itemTabBarVariants, } from "./ItemTabBar/ItemTabBarApollo";
|
|
36
|
-
export { Footer } from "./Layout/Footer/FooterApollo";
|
|
37
35
|
export { Link, linkVariants } from "./Link/LinkApollo";
|
|
38
|
-
export { ClickItem, clickItemStates, clickItemVariants, } from "./List/ClickItem/ClickItemApollo";
|
|
39
36
|
export { ContentItemDuo } from "./List/ContentItemDuo/ContentItemDuoApollo";
|
|
40
37
|
export { Message, messageVariants, } from "./Message/MessageApollo";
|
|
41
38
|
export { Modal, ModalCore, ModalCoreBody, ModalCoreFooter, ModalCoreHeader, } from "./Modal/ModalApollo";
|
|
@@ -47,3 +44,6 @@ export { Svg } from "./Svg/Svg";
|
|
|
47
44
|
export { Tag, tagVariants } from "./Tag/TagApollo";
|
|
48
45
|
export { TimelineVertical } from "./TimelineVertical/TimelineVerticalApollo";
|
|
49
46
|
export { Toggle } from "./Toggle/ToggleApollo";
|
|
47
|
+
export { InputPhone } from "./Form/InputPhone/InputPhoneApollo";
|
|
48
|
+
export { Dropdown } from "./Form/Dropdown/DropdownApollo";
|
|
49
|
+
export { Footer } from "./Layout/Footer/FooterApollo";
|
package/dist/indexLF.d.ts
CHANGED
|
@@ -1,46 +1,43 @@
|
|
|
1
|
-
import "@axa-fr/design-system-apollo-css/dist/Grid/Grid.scss";
|
|
2
1
|
import "@axa-fr/design-system-look-and-feel-css/dist/common/reboot.scss";
|
|
3
2
|
import "@axa-fr/design-system-look-and-feel-css/dist/common/tokens.scss";
|
|
3
|
+
import "@axa-fr/design-system-apollo-css/dist/Grid/Grid.scss";
|
|
4
4
|
import "@fontsource/source-sans-pro";
|
|
5
|
-
export { Accordion,
|
|
5
|
+
export { Accordion, type AccordionVariants, accordionVariants, } from "./Accordion/AccordionLF";
|
|
6
6
|
export { AccordionCore } from "./AccordionCore/AccordionCoreLF";
|
|
7
|
-
export { BasePicture } from "./BasePicture/
|
|
7
|
+
export { BasePicture } from "./BasePicture/BasePictureLF";
|
|
8
8
|
export { Button, buttonVariants, type ButtonVariants } from "./Button/ButtonLF";
|
|
9
9
|
export { CardMessage, cardMessageVariants, type CardMessageVariants, } from "./CardMessage/CardMessageLF";
|
|
10
10
|
export { ClickIcon } from "./ClickIcon/ClickIconLF";
|
|
11
|
+
export { ClickItem, clickItemStates, clickItemVariants, type ClickItemStates, type ClickItemVariants, } from "./List/ClickItem/ClickItemLF";
|
|
11
12
|
export { ContentItemMono } from "./ContentItemMono/ContentItemMonoLF";
|
|
12
13
|
export { DataAgent } from "./DataAgent/DataAgentLF";
|
|
13
14
|
export { Divider } from "./Divider/DividerLF";
|
|
15
|
+
export { Checkbox } from "./Form/Checkbox/Checkbox/CheckboxLF";
|
|
14
16
|
export { CardCheckbox,
|
|
15
17
|
/** @deprecated Use `CardCheckbox` instead. */
|
|
16
18
|
CardCheckbox as CheckboxCard, } from "./Form/Checkbox/CardCheckbox/CardCheckboxLF";
|
|
17
|
-
export { CardCheckboxOption } from "./Form/Checkbox/CardCheckboxOption/CardCheckboxOptionLF";
|
|
18
|
-
export { Checkbox } from "./Form/Checkbox/Checkbox/CheckboxLF";
|
|
19
19
|
export { CheckboxText } from "./Form/Checkbox/CheckboxText/CheckboxTextLF";
|
|
20
|
-
export {
|
|
21
|
-
export {
|
|
20
|
+
export { CardCheckboxOption } from "./Form/Checkbox/CardCheckboxOption/CardCheckboxOptionLF";
|
|
21
|
+
export { InputDate,
|
|
22
22
|
/** @deprecated Use `InputDate` instead. */
|
|
23
|
-
InputDate as DateInput,
|
|
24
|
-
export { type OptionType } from "./Form/InputPhone/InputPhone.types";
|
|
23
|
+
InputDate as DateInput, } from "./Form/InputDate/InputDateLF";
|
|
25
24
|
export { InputPhone } from "./Form/InputPhone/InputPhoneLF";
|
|
26
|
-
export { InputText,
|
|
27
|
-
/** @deprecated Use `InputText` instead. */
|
|
28
|
-
InputText as TextInput, } from "./Form/InputText/InputTextLF";
|
|
29
|
-
export { InputTextAtom } from "./Form/InputTextAtom/InputTextAtomLF";
|
|
30
|
-
export { ItemFile, itemFileVariants } from "./Form/ItemFile/ItemFileLF";
|
|
31
25
|
export { ItemLabel } from "./Form/ItemLabel/ItemLabelLF";
|
|
26
|
+
export { ItemFile, itemFileVariants } from "./Form/ItemFile/ItemFileLF";
|
|
32
27
|
export { ItemMessage } from "./Form/ItemMessage/ItemMessageLF";
|
|
33
|
-
export { CardRadio } from "./Form/Radio/CardRadio/CardRadioLF";
|
|
34
|
-
export { CardRadioOption } from "./Form/Radio/CardRadioOption/CardRadioOptionLF";
|
|
35
|
-
export { Radio } from "./Form/Radio/Radio/RadioLF";
|
|
36
28
|
export { TextArea } from "./Form/TextArea/TextAreaLF";
|
|
29
|
+
export { Radio } from "./Form/Radio/Radio/RadioLF";
|
|
30
|
+
export { CardRadioOption } from "./Form/Radio/CardRadioOption/CardRadioOptionLF";
|
|
31
|
+
export { CardRadio } from "./Form/Radio/CardRadio/CardRadioLF";
|
|
32
|
+
export { InputText,
|
|
33
|
+
/** @deprecated Use `InputText` instead. */
|
|
34
|
+
InputText as TextInput, } from "./Form/InputText/InputTextLF";
|
|
37
35
|
export { DebugGrid } from "./Grid/DebugGridLF";
|
|
38
36
|
export { Heading, type HeadingLevel } from "./Heading/HeadingLF";
|
|
37
|
+
export { InputTextAtom } from "./Form/InputTextAtom/InputTextAtomLF";
|
|
39
38
|
export { Icon, iconSizeVariants, iconVariants, type IconSizeVariants, type IconVariants, } from "./Icon/IconLF";
|
|
40
39
|
export { ItemTabBar, itemTabBarVariants, type ItemTabBarVariants, } from "./ItemTabBar/ItemTabBarLF";
|
|
41
|
-
export { Footer, type FooterProps } from "./Layout/Footer/FooterLF";
|
|
42
40
|
export { Link, linkVariants, type LinkVariants } from "./Link/LinkLF";
|
|
43
|
-
export { ClickItem, clickItemStates, clickItemVariants, type ClickItemStates, type ClickItemVariants, } from "./List/ClickItem/ClickItemLF";
|
|
44
41
|
export { ContentItemDuo } from "./List/ContentItemDuo/ContentItemDuoLF";
|
|
45
42
|
export { Message, messageVariants, type MessageVariants, } from "./Message/MessageLF";
|
|
46
43
|
export { Modal, ModalCore, ModalCoreBody, ModalCoreFooter, ModalCoreHeader, } from "./Modal/ModalLF";
|
|
@@ -52,3 +49,6 @@ export { Svg } from "./Svg/Svg";
|
|
|
52
49
|
export { Tag, tagVariants, type TagVariants } from "./Tag/TagLF";
|
|
53
50
|
export { TimelineVertical } from "./TimelineVertical/TimelineVerticalLF";
|
|
54
51
|
export { Toggle } from "./Toggle/ToggleLF";
|
|
52
|
+
export { type OptionType } from "./Form/InputPhone/InputPhone.types";
|
|
53
|
+
export { Dropdown } from "./Form/Dropdown/DropdownLF";
|
|
54
|
+
export { Footer, type FooterProps } from "./Layout/Footer/FooterLF";
|
package/dist/indexLF.js
CHANGED
|
@@ -1,45 +1,43 @@
|
|
|
1
|
-
import "@axa-fr/design-system-apollo-css/dist/Grid/Grid.scss";
|
|
2
1
|
import "@axa-fr/design-system-look-and-feel-css/dist/common/reboot.scss";
|
|
3
2
|
import "@axa-fr/design-system-look-and-feel-css/dist/common/tokens.scss";
|
|
3
|
+
import "@axa-fr/design-system-apollo-css/dist/Grid/Grid.scss";
|
|
4
4
|
import "@fontsource/source-sans-pro";
|
|
5
5
|
export { Accordion, accordionVariants, } from "./Accordion/AccordionLF";
|
|
6
6
|
export { AccordionCore } from "./AccordionCore/AccordionCoreLF";
|
|
7
|
-
export { BasePicture } from "./BasePicture/
|
|
7
|
+
export { BasePicture } from "./BasePicture/BasePictureLF";
|
|
8
8
|
export { Button, buttonVariants } from "./Button/ButtonLF";
|
|
9
9
|
export { CardMessage, cardMessageVariants, } from "./CardMessage/CardMessageLF";
|
|
10
10
|
export { ClickIcon } from "./ClickIcon/ClickIconLF";
|
|
11
|
+
export { ClickItem, clickItemStates, clickItemVariants, } from "./List/ClickItem/ClickItemLF";
|
|
11
12
|
export { ContentItemMono } from "./ContentItemMono/ContentItemMonoLF";
|
|
12
13
|
export { DataAgent } from "./DataAgent/DataAgentLF";
|
|
13
14
|
export { Divider } from "./Divider/DividerLF";
|
|
15
|
+
export { Checkbox } from "./Form/Checkbox/Checkbox/CheckboxLF";
|
|
14
16
|
export { CardCheckbox,
|
|
15
17
|
/** @deprecated Use `CardCheckbox` instead. */
|
|
16
18
|
CardCheckbox as CheckboxCard, } from "./Form/Checkbox/CardCheckbox/CardCheckboxLF";
|
|
17
|
-
export { CardCheckboxOption } from "./Form/Checkbox/CardCheckboxOption/CardCheckboxOptionLF";
|
|
18
|
-
export { Checkbox } from "./Form/Checkbox/Checkbox/CheckboxLF";
|
|
19
19
|
export { CheckboxText } from "./Form/Checkbox/CheckboxText/CheckboxTextLF";
|
|
20
|
-
export {
|
|
21
|
-
export {
|
|
20
|
+
export { CardCheckboxOption } from "./Form/Checkbox/CardCheckboxOption/CardCheckboxOptionLF";
|
|
21
|
+
export { InputDate,
|
|
22
22
|
/** @deprecated Use `InputDate` instead. */
|
|
23
|
-
InputDate as DateInput,
|
|
23
|
+
InputDate as DateInput, } from "./Form/InputDate/InputDateLF";
|
|
24
24
|
export { InputPhone } from "./Form/InputPhone/InputPhoneLF";
|
|
25
|
-
export { InputText,
|
|
26
|
-
/** @deprecated Use `InputText` instead. */
|
|
27
|
-
InputText as TextInput, } from "./Form/InputText/InputTextLF";
|
|
28
|
-
export { InputTextAtom } from "./Form/InputTextAtom/InputTextAtomLF";
|
|
29
|
-
export { ItemFile, itemFileVariants } from "./Form/ItemFile/ItemFileLF";
|
|
30
25
|
export { ItemLabel } from "./Form/ItemLabel/ItemLabelLF";
|
|
26
|
+
export { ItemFile, itemFileVariants } from "./Form/ItemFile/ItemFileLF";
|
|
31
27
|
export { ItemMessage } from "./Form/ItemMessage/ItemMessageLF";
|
|
32
|
-
export { CardRadio } from "./Form/Radio/CardRadio/CardRadioLF";
|
|
33
|
-
export { CardRadioOption } from "./Form/Radio/CardRadioOption/CardRadioOptionLF";
|
|
34
|
-
export { Radio } from "./Form/Radio/Radio/RadioLF";
|
|
35
28
|
export { TextArea } from "./Form/TextArea/TextAreaLF";
|
|
29
|
+
export { Radio } from "./Form/Radio/Radio/RadioLF";
|
|
30
|
+
export { CardRadioOption } from "./Form/Radio/CardRadioOption/CardRadioOptionLF";
|
|
31
|
+
export { CardRadio } from "./Form/Radio/CardRadio/CardRadioLF";
|
|
32
|
+
export { InputText,
|
|
33
|
+
/** @deprecated Use `InputText` instead. */
|
|
34
|
+
InputText as TextInput, } from "./Form/InputText/InputTextLF";
|
|
36
35
|
export { DebugGrid } from "./Grid/DebugGridLF";
|
|
37
36
|
export { Heading } from "./Heading/HeadingLF";
|
|
37
|
+
export { InputTextAtom } from "./Form/InputTextAtom/InputTextAtomLF";
|
|
38
38
|
export { Icon, iconSizeVariants, iconVariants, } from "./Icon/IconLF";
|
|
39
39
|
export { ItemTabBar, itemTabBarVariants, } from "./ItemTabBar/ItemTabBarLF";
|
|
40
|
-
export { Footer } from "./Layout/Footer/FooterLF";
|
|
41
40
|
export { Link, linkVariants } from "./Link/LinkLF";
|
|
42
|
-
export { ClickItem, clickItemStates, clickItemVariants, } from "./List/ClickItem/ClickItemLF";
|
|
43
41
|
export { ContentItemDuo } from "./List/ContentItemDuo/ContentItemDuoLF";
|
|
44
42
|
export { Message, messageVariants, } from "./Message/MessageLF";
|
|
45
43
|
export { Modal, ModalCore, ModalCoreBody, ModalCoreFooter, ModalCoreHeader, } from "./Modal/ModalLF";
|
|
@@ -51,3 +49,5 @@ export { Svg } from "./Svg/Svg";
|
|
|
51
49
|
export { Tag, tagVariants } from "./Tag/TagLF";
|
|
52
50
|
export { TimelineVertical } from "./TimelineVertical/TimelineVerticalLF";
|
|
53
51
|
export { Toggle } from "./Toggle/ToggleLF";
|
|
52
|
+
export { Dropdown } from "./Form/Dropdown/DropdownLF";
|
|
53
|
+
export { Footer } from "./Layout/Footer/FooterLF";
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@axa-fr/design-system-apollo-react",
|
|
3
|
-
"version": "1.0.5-
|
|
3
|
+
"version": "1.0.5-tags-slash-2-0-0-RC-4.480",
|
|
4
4
|
"description": "",
|
|
5
5
|
"main": "./dist/index.js",
|
|
6
6
|
"types": "./dist/index.d.ts",
|
|
@@ -46,8 +46,8 @@
|
|
|
46
46
|
},
|
|
47
47
|
"homepage": "https://github.com/AxaFrance/design-system#readme",
|
|
48
48
|
"peerDependencies": {
|
|
49
|
-
"@axa-fr/design-system-apollo-css": "1.0.5-
|
|
50
|
-
"@axa-fr/design-system-look-and-feel-css": "1.0.5-
|
|
49
|
+
"@axa-fr/design-system-apollo-css": "1.0.5-tags-slash-2-0-0-RC-4.480",
|
|
50
|
+
"@axa-fr/design-system-look-and-feel-css": "1.0.5-tags-slash-2-0-0-RC-4.480",
|
|
51
51
|
"@material-symbols/svg-400": ">= 0.19.0",
|
|
52
52
|
"react": ">= 18"
|
|
53
53
|
},
|
|
@@ -1,5 +0,0 @@
|
|
|
1
|
-
import type { ComponentProps } from "react";
|
|
2
|
-
import "@axa-fr/design-system-apollo-css/dist/BasePicture/BasePicture.scss";
|
|
3
|
-
type BasePictureProps = ComponentProps<"img">;
|
|
4
|
-
export declare const BasePicture: ({ className, src, ...props }: BasePictureProps) => import("react/jsx-runtime").JSX.Element;
|
|
5
|
-
export {};
|
|
@@ -1,6 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
2
|
-
import logo from "@axa-fr/design-system-apollo-css/logo-axa.svg";
|
|
3
|
-
import "@axa-fr/design-system-apollo-css/dist/BasePicture/BasePicture.scss";
|
|
4
|
-
export const BasePicture = ({ className, src, ...props }) => {
|
|
5
|
-
return (_jsx("img", { className: ["af-basepicture", className].filter(Boolean).join(" "), alt: "", src: src || logo, ...props }));
|
|
6
|
-
};
|