@axa-fr/canopee-react 2.0.0-alpha.7 → 2.0.0-alpha.71

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.
Files changed (180) hide show
  1. package/dist/client.d.ts +17 -16
  2. package/dist/client.js +17 -16
  3. package/dist/distributeur/ButtonMultiActions/ButtonMultiActions.d.ts +10 -0
  4. package/dist/distributeur/ButtonMultiActions/ButtonMultiActions.js +51 -0
  5. package/dist/distributeur/ButtonMultiActions/index.d.ts +2 -0
  6. package/dist/distributeur/ButtonMultiActions/index.js +1 -0
  7. package/dist/distributeur/Card/BaseCard.d.ts +14 -0
  8. package/dist/distributeur/Card/BaseCard.js +23 -0
  9. package/dist/distributeur/CardButton/CardButton.d.ts +18 -0
  10. package/dist/distributeur/CardButton/CardButton.js +12 -0
  11. package/dist/distributeur/Form/Experimental/InputContainer.d.ts +4 -1
  12. package/dist/distributeur/Form/Experimental/InputContainer.js +2 -2
  13. package/dist/distributeur/Form/Experimental/InputUnit.d.ts +1 -1
  14. package/dist/distributeur/Form/Experimental/InputUnit.js +1 -1
  15. package/dist/distributeur/Form/Experimental/ItemMessage.d.ts +1 -1
  16. package/dist/distributeur/Form/Experimental/ItemMessage.js +1 -1
  17. package/dist/distributeur/Form/Experimental/Label.d.ts +1 -2
  18. package/dist/distributeur/Form/Experimental/Legend.d.ts +12 -0
  19. package/dist/distributeur/Form/Experimental/Legend.js +3 -0
  20. package/dist/distributeur/Form/Experimental/Radio/AddRadioCard.d.ts +7 -0
  21. package/dist/distributeur/Form/Experimental/Radio/AddRadioCard.js +14 -0
  22. package/dist/distributeur/Form/Experimental/Radio/RadioButton.d.ts +13 -0
  23. package/dist/distributeur/Form/Experimental/Radio/RadioButton.js +3 -0
  24. package/dist/distributeur/Form/Experimental/Radio/RadioCard.d.ts +10 -0
  25. package/dist/distributeur/Form/Experimental/Radio/RadioCard.js +13 -0
  26. package/dist/distributeur/Form/Experimental/Radio/RadioGroup.d.ts +8 -0
  27. package/dist/distributeur/Form/Experimental/Radio/RadioGroup.js +10 -0
  28. package/dist/distributeur/Form/Experimental/Radio/RadioInput.d.ts +18 -0
  29. package/dist/distributeur/Form/Experimental/Radio/RadioInput.js +34 -0
  30. package/dist/distributeur/Form/Experimental/Radio/RadioItem.d.ts +4 -0
  31. package/dist/distributeur/Form/Experimental/Radio/RadioItem.js +10 -0
  32. package/dist/distributeur/Form/Experimental/Radio/RadioText.d.ts +6 -0
  33. package/dist/distributeur/Form/Experimental/Radio/RadioText.js +3 -0
  34. package/dist/distributeur/Form/Experimental/Radio/_radioInputOptions.d.ts +8 -0
  35. package/dist/distributeur/Form/Experimental/Radio/_radioInputOptions.js +7 -0
  36. package/dist/distributeur/Form/Experimental/index.d.ts +6 -0
  37. package/dist/distributeur/Form/Experimental/index.js +6 -0
  38. package/dist/distributeur/Form/Experimental/types.d.ts +1 -1
  39. package/dist/distributeur/Form/Experimental/useInput.hook.js +1 -1
  40. package/dist/distributeur/Title/Title.js +1 -1
  41. package/dist/distributeur-experimental.d.ts +2 -0
  42. package/dist/distributeur-experimental.js +2 -0
  43. package/dist/distributeur.d.ts +3 -0
  44. package/dist/distributeur.js +3 -0
  45. package/dist/prospect-client/AccordionCore/AccordionCoreCommon.d.ts +3 -5
  46. package/dist/prospect-client/AccordionCore/AccordionCoreCommon.js +10 -4
  47. package/dist/prospect-client/AppName/AppName.d.ts +44 -0
  48. package/dist/prospect-client/AppName/AppName.js +23 -0
  49. package/dist/prospect-client/Card/CardApollo.d.ts +1 -1
  50. package/dist/prospect-client/Card/CardApollo.js +1 -1
  51. package/dist/prospect-client/Card/CardCommon.d.ts +30 -2
  52. package/dist/prospect-client/Card/CardCommon.js +18 -1
  53. package/dist/prospect-client/Card/CardLF.d.ts +1 -1
  54. package/dist/prospect-client/Card/CardLF.js +1 -1
  55. package/dist/prospect-client/CardMessage/CardMessageCommon.js +6 -4
  56. package/dist/prospect-client/ContentItemDuoAction/ContentItemDuoActionCommon.d.ts +2 -2
  57. package/dist/prospect-client/ContentItemDuoAction/ContentItemDuoActionCommon.js +5 -2
  58. package/dist/prospect-client/ContentItemMono/ContentItemMonoCommon.d.ts +0 -4
  59. package/dist/prospect-client/ContentItemMono/ContentItemMonoCommon.js +2 -3
  60. package/dist/prospect-client/DataAgent/DataAgentCommon.js +2 -2
  61. package/dist/prospect-client/Divider/DividerCommon.js +6 -2
  62. package/dist/prospect-client/Form/Checkbox/CardCheckbox/CardCheckboxApollo.d.ts +1 -0
  63. package/dist/prospect-client/Form/Checkbox/CardCheckbox/CardCheckboxCommon.d.ts +1 -17
  64. package/dist/prospect-client/Form/Checkbox/CardCheckbox/CardCheckboxCommon.js +4 -4
  65. package/dist/prospect-client/Form/Checkbox/CardCheckbox/CardCheckboxLF.d.ts +1 -0
  66. package/dist/prospect-client/Form/Checkbox/Checkbox/CheckboxCommon.d.ts +2 -6
  67. package/dist/prospect-client/Form/Checkbox/Checkbox/CheckboxCommon.js +6 -2
  68. package/dist/prospect-client/Form/Checkbox/CheckboxText/CheckboxTextCommon.d.ts +1 -5
  69. package/dist/prospect-client/Form/Checkbox/CheckboxText/CheckboxTextCommon.js +3 -3
  70. package/dist/prospect-client/Form/Dropdown/DropdownCommon.d.ts +2 -10
  71. package/dist/prospect-client/Form/Dropdown/DropdownCommon.js +3 -3
  72. package/dist/prospect-client/Form/InputDate/InputDateCommon.d.ts +2 -10
  73. package/dist/prospect-client/Form/InputDate/InputDateCommon.js +4 -5
  74. package/dist/prospect-client/Form/InputPhone/InputPhoneCommon.d.ts +2 -10
  75. package/dist/prospect-client/Form/InputPhone/InputPhoneCommon.js +9 -5
  76. package/dist/prospect-client/Form/InputText/InputTextCommon.d.ts +3 -11
  77. package/dist/prospect-client/Form/InputText/InputTextCommon.js +6 -5
  78. package/dist/prospect-client/Form/ItemLabel/ItemLabelCommon.d.ts +2 -22
  79. package/dist/prospect-client/Form/ItemLabel/ItemLabelCommon.js +4 -5
  80. package/dist/prospect-client/Form/ItemMultiSelect/ItemMultiSelectApollo.d.ts +7 -0
  81. package/dist/prospect-client/Form/ItemMultiSelect/ItemMultiSelectApollo.js +6 -0
  82. package/dist/prospect-client/Form/ItemMultiSelect/ItemMultiSelectCommon.d.ts +8 -0
  83. package/dist/prospect-client/Form/ItemMultiSelect/ItemMultiSelectCommon.js +9 -0
  84. package/dist/prospect-client/Form/ItemMultiSelect/ItemMultiSelectLF.d.ts +7 -0
  85. package/dist/prospect-client/Form/ItemMultiSelect/ItemMultiSelectLF.js +6 -0
  86. package/dist/prospect-client/Form/MultiSelectList/MultiSelectListApollo.d.ts +4 -0
  87. package/dist/prospect-client/Form/MultiSelectList/MultiSelectListApollo.js +5 -0
  88. package/dist/prospect-client/Form/MultiSelectList/MultiSelectListCommon.d.ts +11 -0
  89. package/dist/prospect-client/Form/MultiSelectList/MultiSelectListCommon.js +2 -0
  90. package/dist/prospect-client/Form/MultiSelectList/MultiSelectListLF.d.ts +4 -0
  91. package/dist/prospect-client/Form/MultiSelectList/MultiSelectListLF.js +5 -0
  92. package/dist/prospect-client/Form/Radio/CardRadio/CardRadioCommon.d.ts +1 -5
  93. package/dist/prospect-client/Form/Radio/CardRadio/CardRadioCommon.js +4 -4
  94. package/dist/prospect-client/Form/Radio/CardRadioGroup/CardRadioGroupCommon.d.ts +3 -27
  95. package/dist/prospect-client/Form/Radio/CardRadioGroup/CardRadioGroupCommon.js +4 -6
  96. package/dist/prospect-client/Form/Radio/Radio/RadioCommon.d.ts +2 -5
  97. package/dist/prospect-client/Form/Radio/Radio/RadioCommon.js +6 -4
  98. package/dist/prospect-client/Form/TextArea/TextAreaCommon.d.ts +2 -6
  99. package/dist/prospect-client/Form/TextArea/TextAreaCommon.js +3 -3
  100. package/dist/prospect-client/Header/HeaderApollo.d.ts +4 -0
  101. package/dist/prospect-client/Header/HeaderApollo.js +8 -0
  102. package/dist/prospect-client/Header/HeaderCommon.d.ts +22 -0
  103. package/dist/prospect-client/Header/HeaderCommon.js +37 -0
  104. package/dist/prospect-client/Header/HeaderLF.d.ts +4 -0
  105. package/dist/prospect-client/Header/HeaderLF.js +8 -0
  106. package/dist/prospect-client/Icon/IconCommon.d.ts +1 -1
  107. package/dist/prospect-client/Icon/IconCommon.js +8 -9
  108. package/dist/prospect-client/ItemTabBar/ItemTabBarCommon.js +5 -2
  109. package/dist/prospect-client/Layout/ExitLayout/ExitLayoutApollo.d.ts +12 -0
  110. package/dist/prospect-client/Layout/ExitLayout/ExitLayoutApollo.js +12 -0
  111. package/dist/prospect-client/Layout/ExitLayout/ExitLayoutLF.d.ts +12 -0
  112. package/dist/prospect-client/Layout/ExitLayout/ExitLayoutLF.js +12 -0
  113. package/dist/prospect-client/Layout/ExitLayout/ExitLayoutSkeleton.d.ts +23 -0
  114. package/dist/prospect-client/Layout/ExitLayout/ExitLayoutSkeleton.js +17 -0
  115. package/dist/prospect-client/Link/LinkCommon.d.ts +1 -5
  116. package/dist/prospect-client/Link/LinkCommon.js +2 -2
  117. package/dist/prospect-client/List/ClickItem/ClickItemCommon.d.ts +1 -0
  118. package/dist/prospect-client/List/ContentItemDuo/ContentItemDuoCommon.d.ts +1 -5
  119. package/dist/prospect-client/List/ContentItemDuo/ContentItemDuoCommon.js +3 -7
  120. package/dist/prospect-client/List/List/ListCommon.d.ts +27 -2
  121. package/dist/prospect-client/List/List/ListCommon.js +12 -0
  122. package/dist/prospect-client/MenuBurger/MenuBurgerApollo.d.ts +4 -0
  123. package/dist/prospect-client/MenuBurger/MenuBurgerApollo.js +8 -0
  124. package/dist/prospect-client/MenuBurger/MenuBurgerCommon.d.ts +60 -0
  125. package/dist/prospect-client/MenuBurger/MenuBurgerCommon.js +34 -0
  126. package/dist/prospect-client/MenuBurger/MenuBurgerLF.d.ts +4 -0
  127. package/dist/prospect-client/MenuBurger/MenuBurgerLF.js +8 -0
  128. package/dist/prospect-client/MessageBar/MessageBarAction.d.ts +8 -0
  129. package/dist/prospect-client/MessageBar/MessageBarAction.js +11 -0
  130. package/dist/prospect-client/MessageBar/MessageBarApollo.d.ts +5 -0
  131. package/dist/prospect-client/MessageBar/MessageBarApollo.js +7 -0
  132. package/dist/prospect-client/MessageBar/MessageBarCommon.d.ts +26 -0
  133. package/dist/prospect-client/MessageBar/MessageBarCommon.js +33 -0
  134. package/dist/prospect-client/MessageBar/MessageBarDescription.d.ts +6 -0
  135. package/dist/prospect-client/MessageBar/MessageBarDescription.js +8 -0
  136. package/dist/prospect-client/MessageBar/MessageBarLF.d.ts +5 -0
  137. package/dist/prospect-client/MessageBar/MessageBarLF.js +7 -0
  138. package/dist/prospect-client/MessageBar/MessageBarSummary.d.ts +11 -0
  139. package/dist/prospect-client/MessageBar/MessageBarSummary.js +2 -0
  140. package/dist/prospect-client/MessageBar/types.d.ts +1 -0
  141. package/dist/prospect-client/MessageBar/types.js +1 -0
  142. package/dist/prospect-client/Modal/ModalApollo.d.ts +1 -1
  143. package/dist/prospect-client/Modal/ModalApollo.js +1 -3
  144. package/dist/prospect-client/Modal/ModalCommon.d.ts +1 -1
  145. package/dist/prospect-client/Modal/ModalCommon.js +1 -1
  146. package/dist/prospect-client/Modal/ModalLF.d.ts +1 -1
  147. package/dist/prospect-client/Modal/ModalLF.js +1 -3
  148. package/dist/prospect-client/Modal/components/ModalCoreHeaderCommon.d.ts +0 -7
  149. package/dist/prospect-client/Modal/components/ModalCoreHeaderCommon.js +2 -12
  150. package/dist/prospect-client/Modal/types.d.ts +0 -15
  151. package/dist/prospect-client/ProgressBarGroup/ProgressBarGroupCommon.d.ts +1 -5
  152. package/dist/prospect-client/ProgressBarGroup/ProgressBarGroupCommon.js +1 -1
  153. package/dist/prospect-client/Skeleton/Skeleton.d.ts +61 -0
  154. package/dist/prospect-client/Skeleton/Skeleton.js +41 -0
  155. package/dist/prospect-client/SkeletonGrid/SkeletonGrid.d.ts +51 -0
  156. package/dist/prospect-client/SkeletonGrid/SkeletonGrid.js +37 -0
  157. package/dist/prospect-client/SkeletonList/SkeletonListApollo.d.ts +7 -0
  158. package/dist/prospect-client/SkeletonList/SkeletonListApollo.js +8 -2
  159. package/dist/prospect-client/SkeletonList/SkeletonListCommon.d.ts +21 -4
  160. package/dist/prospect-client/SkeletonList/SkeletonListCommon.js +18 -2
  161. package/dist/prospect-client/SkeletonList/SkeletonListLF.d.ts +7 -0
  162. package/dist/prospect-client/SkeletonList/SkeletonListLF.js +8 -2
  163. package/dist/prospect-client/Stepper/StepperApollo.js +2 -1
  164. package/dist/prospect-client/Stepper/StepperCommon.d.ts +11 -6
  165. package/dist/prospect-client/Stepper/StepperCommon.js +2 -3
  166. package/dist/prospect-client/Stepper/StepperLF.js +2 -1
  167. package/dist/prospect-client/TabMenu/TabMenu.js +1 -1
  168. package/dist/prospect-client/Tag/TagCommon.js +6 -2
  169. package/dist/prospect-client/Toggle/ToggleCommon.js +2 -2
  170. package/dist/prospect.d.ts +11 -6
  171. package/dist/prospect.js +11 -6
  172. package/package.json +2 -2
  173. package/dist/prospect-client/Skeleton/SkeletonApollo.d.ts +0 -2
  174. package/dist/prospect-client/Skeleton/SkeletonApollo.js +0 -2
  175. package/dist/prospect-client/Skeleton/SkeletonCommon.d.ts +0 -19
  176. package/dist/prospect-client/Skeleton/SkeletonCommon.js +0 -11
  177. package/dist/prospect-client/Skeleton/SkeletonLF.d.ts +0 -2
  178. package/dist/prospect-client/Skeleton/SkeletonLF.js +0 -2
  179. package/dist/prospect-client/utilities/getComponentClassName.d.ts +0 -4
  180. package/dist/prospect-client/utilities/getComponentClassName.js +0 -30
@@ -1,18 +1,23 @@
1
- import { type ComponentType, type HTMLAttributes } from "react";
1
+ import { type ComponentType, type HTMLAttributes, type ReactNode } from "react";
2
2
  import { type ItemMessageProps } from "../Form/ItemMessage/ItemMessageCommon";
3
3
  import { type ProgressBarGroupProps } from "../ProgressBarGroup/ProgressBarGroupCommon";
4
+ import type { HeadingCommonProps } from "../Heading/HeadingCommon";
5
+ import type { HeadingLevel } from "../Heading/types";
4
6
  export type StepperProps = {
5
7
  currentStepProgress?: number;
6
8
  currentStep: number;
7
- currentSubtitle?: string;
8
- currentTitle?: string;
9
+ currentSubtitle?: ReactNode;
10
+ currentTitle?: ReactNode;
9
11
  nbSteps?: 2 | 3 | 4 | 5 | 6 | 7 | 8;
10
12
  helper?: string;
13
+ icon?: string;
14
+ iconProps?: HeadingCommonProps["iconProps"];
11
15
  message?: string;
12
16
  messageType?: ItemMessageProps["messageType"];
13
- titleLevel?: 1 | 2 | 3;
14
- } & Omit<HTMLAttributes<HTMLDivElement>, "role">;
17
+ titleLevel?: HeadingLevel;
18
+ } & Omit<HTMLAttributes<HTMLDivElement>, "role" | "title">;
15
19
  export type StepperCommonProps = StepperProps & {
16
20
  ProgressBarGroupComponent: ComponentType<ProgressBarGroupProps>;
21
+ HeadingComponent: ComponentType<HeadingCommonProps>;
17
22
  };
18
- export declare const StepperCommon: ({ currentStepProgress, currentTitle, nbSteps, currentStep, currentSubtitle, className, ProgressBarGroupComponent, helper, message, messageType, titleLevel, ...props }: StepperCommonProps) => import("react/jsx-runtime").JSX.Element;
23
+ export declare const StepperCommon: ({ currentStepProgress, currentTitle, nbSteps, currentStep, currentSubtitle, className, ProgressBarGroupComponent, HeadingComponent, helper, icon, iconProps, message, messageType, titleLevel, ...props }: StepperCommonProps) => import("react/jsx-runtime").JSX.Element;
@@ -2,8 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import { useId, } from "react";
3
3
  import { ItemMessage, } from "../Form/ItemMessage/ItemMessageCommon";
4
4
  import {} from "../ProgressBarGroup/ProgressBarGroupCommon";
5
- export const StepperCommon = ({ currentStepProgress, currentTitle, nbSteps, currentStep, currentSubtitle, className, ProgressBarGroupComponent, helper, message, messageType = "success", titleLevel = 2, ...props }) => {
5
+ export const StepperCommon = ({ currentStepProgress, currentTitle, nbSteps, currentStep, currentSubtitle, className, ProgressBarGroupComponent, HeadingComponent, helper, icon, iconProps, message, messageType = "success", titleLevel = 2, ...props }) => {
6
6
  const titleId = useId();
7
- const Title = `h${titleLevel}`;
8
- return (_jsxs("div", { className: "af-stepper", ...props, tabIndex: undefined, children: [_jsxs("div", { className: "af-stepper__header", children: [_jsx(Title, { id: titleId, className: "af-stepper__title", children: currentTitle }), Boolean(currentSubtitle) && (_jsx("p", { className: "af-stepper__subtitle", children: currentSubtitle }))] }), _jsx(ProgressBarGroupComponent, { className: className, currentStep: currentStep, stepsCount: nbSteps, currentStepProgress: currentStepProgress, "aria-labelledby": titleId }), Boolean(helper) && _jsx("span", { className: "af-stepper__helper", children: helper }), _jsx(ItemMessage, { message: message, messageType: messageType })] }));
7
+ return (_jsxs("div", { className: "af-stepper", ...props, tabIndex: undefined, children: [_jsx("div", { className: "af-stepper__header", id: titleId, children: _jsx(HeadingComponent, { level: titleLevel, icon: icon, iconProps: iconProps, firstSubtitle: currentSubtitle, children: currentTitle }) }), _jsx(ProgressBarGroupComponent, { className: className, currentStep: currentStep, stepsCount: nbSteps, currentStepProgress: currentStepProgress, "aria-labelledby": titleId }), Boolean(helper) && _jsx("span", { className: "af-stepper__helper", children: helper }), _jsx(ItemMessage, { message: message, messageType: messageType })] }));
9
8
  };
@@ -1,5 +1,6 @@
1
1
  import { jsx as _jsx } from "react/jsx-runtime";
2
2
  import "@axa-fr/canopee-css/client/Stepper/StepperLF.css";
3
+ import { Heading } from "../Heading/HeadingLF";
3
4
  import { ProgressBarGroup } from "../ProgressBarGroup/ProgressBarGroupLF";
4
5
  import { StepperCommon } from "./StepperCommon";
5
- export const Stepper = (props) => (_jsx(StepperCommon, { ...props, ProgressBarGroupComponent: ProgressBarGroup }));
6
+ export const Stepper = (props) => (_jsx(StepperCommon, { ...props, ProgressBarGroupComponent: ProgressBarGroup, HeadingComponent: Heading }));
@@ -33,7 +33,7 @@ export const TabMenu = ({ items, className, initialPosition = 0, ...props }) =>
33
33
  className,
34
34
  }), ...props,
35
35
  // eslint-disable-next-line jsx-a11y/no-noninteractive-tabindex
36
- tabIndex: 0, onKeyDown: (e) => handleKeys(e.key), children: _jsx("ul", { className: "af-tab-menu__list", children: items.map((item, index) => (_jsx("li", { role: "presentation", children: _jsx(ItemMenu, { ref: (el) => {
36
+ tabIndex: 0, onKeyDown: (e) => handleKeys(e.key), children: _jsx("ul", { className: "af-tab-menu__list", children: items.map((item, index) => (_jsx("li", { children: _jsx(ItemMenu, { ref: (el) => {
37
37
  itemRefs.current[index] = el;
38
38
  }, ...item, isActive: index === position ? true : item.isActive, tabIndex: index === position ? 0 : -1, children: item.label }) }, item.href))) }) }));
39
39
  };
@@ -1,6 +1,6 @@
1
1
  import { jsx as _jsx } from "react/jsx-runtime";
2
2
  import { useMemo } from "react";
3
- import { getComponentClassName } from "../utilities/getComponentClassName";
3
+ import { getClassName } from "../utilities/getClassName";
4
4
  export const tagVariants = {
5
5
  info: "info",
6
6
  success: "success",
@@ -9,6 +9,10 @@ export const tagVariants = {
9
9
  neutral: "neutral",
10
10
  };
11
11
  export const Tag = ({ children, className, variant = "info", ...divProps }) => {
12
- const componentClassName = useMemo(() => getComponentClassName("af-tag", className, variant), [className, variant]);
12
+ const componentClassName = useMemo(() => getClassName({
13
+ baseClassName: "af-tag",
14
+ className,
15
+ modifiers: [variant],
16
+ }), [className, variant]);
13
17
  return (_jsx("div", { className: componentClassName, ...divProps, children: _jsx("span", { className: "af-tag__label", children: children }) }));
14
18
  };
@@ -2,10 +2,10 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import check from "@material-symbols/svg-400/rounded/check.svg";
3
3
  import close from "@material-symbols/svg-400/rounded/close.svg";
4
4
  import { useId } from "react";
5
- import { getComponentClassName } from "../utilities/getComponentClassName";
5
+ import { getClassName } from "../utilities/getClassName";
6
6
  export const ToggleCommon = ({ className, IconComponent, ...inputProps }) => {
7
7
  let inputId = useId();
8
8
  inputId = inputProps.id ?? inputId;
9
- return (_jsxs("label", { className: getComponentClassName("af-toggle", className), htmlFor: inputId, children: [_jsx("div", { className: "af-toggle__root", children: _jsxs("span", { className: "af-toggle__handle", children: [_jsx(IconComponent, { src: check, "aria-hidden": "true", className: "af-toggle__icon af-toggle__icon--check", size: "XS" }), _jsx(IconComponent, { src: close, "aria-hidden": "true", className: "af-toggle__icon af-toggle__icon--close", size: "XS" })] }) }), _jsx("input", { ...inputProps, type: "checkbox", id: inputId })] }));
9
+ return (_jsxs("label", { className: getClassName({ baseClassName: "af-toggle", className }), htmlFor: inputId, children: [_jsx("div", { className: "af-toggle__root", children: _jsxs("span", { className: "af-toggle__handle", children: [_jsx(IconComponent, { src: check, "aria-hidden": "true", className: "af-toggle__icon af-toggle__icon--check", size: "XS" }), _jsx(IconComponent, { src: close, "aria-hidden": "true", className: "af-toggle__icon af-toggle__icon--close", size: "XS" })] }) }), _jsx("input", { ...inputProps, type: "checkbox", id: inputId })] }));
10
10
  };
11
11
  ToggleCommon.displayName = "ToggleCommon";
@@ -5,9 +5,10 @@ import "@fontsource/source-sans-pro";
5
5
  export { Accordion, accordionVariants, type AccordionVariants, } from "./prospect-client/Accordion/AccordionApollo";
6
6
  export { AccordionContextual, accordionContextualVariants, type AccordionContextualVariants, } from "./prospect-client/AccordionContextual/AccordionContextualApollo";
7
7
  export { AccordionCore } from "./prospect-client/AccordionCore/AccordionCoreApollo";
8
+ export { AppName, type AppNameProps } from "./prospect-client/AppName/AppName";
8
9
  export { BasePicture } from "./prospect-client/BasePicture/BasePicture";
9
10
  export { Button, buttonVariants, type ButtonVariants, } from "./prospect-client/Button/ButtonApollo";
10
- export { Card, type CardProps } from "./prospect-client/Card/CardApollo";
11
+ export { Card, cardVariants, type CardProps, type CardVariants, } from "./prospect-client/Card/CardApollo";
11
12
  export { CardMessage, cardMessageVariants, type CardMessageVariants, } from "./prospect-client/CardMessage/CardMessageApollo";
12
13
  export { ClickIcon } from "./prospect-client/ClickIcon/ClickIconApollo";
13
14
  export { ContentItemDuoAction, type ContentItemDuoActionState, } from "./prospect-client/ContentItemDuoAction/ContentItemDuoActionApollo";
@@ -15,9 +16,7 @@ export { ContentItemMono } from "./prospect-client/ContentItemMono/ContentItemMo
15
16
  export { DataAgent, type DataAgentProps, } from "./prospect-client/DataAgent/DataAgentApollo";
16
17
  export { Divider } from "./prospect-client/Divider/DividerApollo";
17
18
  export { Fieldset, type FieldsetProps, } from "./prospect-client/Fieldset/FieldsetApollo";
18
- export { CardCheckbox,
19
- /** @deprecated Use `CardCheckbox` instead. */
20
- CardCheckbox as CheckboxCard, } from "./prospect-client/Form/Checkbox/CardCheckbox/CardCheckboxApollo";
19
+ export { CardCheckbox, type CardCheckboxProps, } from "./prospect-client/Form/Checkbox/CardCheckbox/CardCheckboxApollo";
21
20
  export { CardCheckboxOption } from "./prospect-client/Form/Checkbox/CardCheckboxOption/CardCheckboxOptionApollo";
22
21
  export { Checkbox } from "./prospect-client/Form/Checkbox/Checkbox/CheckboxApollo";
23
22
  export { CheckboxText } from "./prospect-client/Form/Checkbox/CheckboxText/CheckboxTextApollo";
@@ -32,6 +31,8 @@ export { InputText } from "./prospect-client/Form/InputText/InputTextApollo";
32
31
  export { InputTextAtom } from "./prospect-client/Form/InputTextAtom/InputTextAtomApollo";
33
32
  export { ItemLabel } from "./prospect-client/Form/ItemLabel/ItemLabelApollo";
34
33
  export { ItemMessage, itemMessageVariants, type ItemMessageVariants, } from "./prospect-client/Form/ItemMessage/ItemMessageApollo";
34
+ export { ItemMultiSelect, type ItemMultiSelectProps, } from "./prospect-client/Form/ItemMultiSelect/ItemMultiSelectApollo";
35
+ export { MultiSelectList, type MultiSelectListProps, } from "./prospect-client/Form/MultiSelectList/MultiSelectListApollo";
35
36
  export { CardRadio } from "./prospect-client/Form/Radio/CardRadio/CardRadioApollo";
36
37
  export { CardRadioGroup } from "./prospect-client/Form/Radio/CardRadioGroup/CardRadioGroupApollo";
37
38
  export { Radio } from "./prospect-client/Form/Radio/Radio/RadioApollo";
@@ -39,11 +40,13 @@ export { RadioText, type RadioTextProps, } from "./prospect-client/Form/Radio/Ra
39
40
  export { TextArea } from "./prospect-client/Form/TextArea/TextAreaApollo";
40
41
  export { DebugGrid } from "./prospect-client/Grid/DebugGridApollo";
41
42
  export { Heading, type HeadingLevel, type HeadingProps, } from "./prospect-client/Heading/HeadingApollo";
43
+ export { Header, type HeaderProps, } from "./prospect-client/Header/HeaderApollo";
42
44
  export { Icon, iconSizeVariants, iconVariants, type IconSizeVariants, type IconVariants, } from "./prospect-client/Icon/IconApollo";
43
45
  export { ItemTabBar, type ItemTabBarProps, } from "./prospect-client/ItemTabBar/ItemTabBarApollo";
44
46
  export { ItemMenu, type ItemMenuProps, } from "./prospect-client/ItemMenu/ItemMenuApollo";
47
+ export { MenuBurger, type MenuBurgerProps, } from "./prospect-client/MenuBurger/MenuBurgerApollo";
45
48
  export { TabMenu, type TabMenuProps } from "./prospect-client/TabMenu/TabMenu";
46
- export { ExitLayout, type ExitLayoutProps, type ExitLayoutWithSubComponents, } from "./prospect-client/Layout/ExitLayout/ExitLayoutApollo";
49
+ export { ExitLayout, type ExitLayoutProps, type ExitLayoutWithSubComponents, ExitLayoutSkeleton, type ExitLayoutSkeletonProps, } from "./prospect-client/Layout/ExitLayout/ExitLayoutApollo";
47
50
  export { Footer, type FooterProps, } from "./prospect-client/Layout/Footer/FooterApollo";
48
51
  export { FormLayout, type FormLayoutProps, } from "./prospect-client/Layout/FormLayout/FormLayout";
49
52
  export { LevelSelector, type LevelSelectorProps, } from "./prospect-client/LevelSelector/LevelSelectorApollo";
@@ -61,7 +64,8 @@ export { ItemPagination, type ItemPaginationProps, } from "./prospect-client/Pag
61
64
  export { Pagination } from "./prospect-client/Pagination/PaginationApollo";
62
65
  export { ProgressBar } from "./prospect-client/ProgressBar/ProgressBarApollo";
63
66
  export { ProgressBarGroup } from "./prospect-client/ProgressBarGroup/ProgressBarGroupApollo";
64
- export { Skeleton, type SkeletonProps, } from "./prospect-client/Skeleton/SkeletonApollo";
67
+ export { Skeleton, skeletonSizeVariants, skeletonVariants, type SkeletonActionSizeVariant, type SkeletonCircleSizeVariant, type SkeletonProps, type SkeletonSizeVariant, type SkeletonVariant, } from "./prospect-client/Skeleton/Skeleton";
68
+ export { SkeletonGrid, type SkeletonGridProps, } from "./prospect-client/SkeletonGrid/SkeletonGrid";
65
69
  export { SkeletonList, type SkeletonListProps, } from "./prospect-client/SkeletonList/SkeletonListApollo";
66
70
  export { Spinner, spinnerVariants, type SpinnerVariants, } from "./prospect-client/Spinner/SpinnerApollo";
67
71
  export { Stepper } from "./prospect-client/Stepper/StepperApollo";
@@ -74,3 +78,4 @@ export { TagList, type TagListProps, } from "./prospect-client/TagList/TagListAp
74
78
  export { TimelineVertical } from "./prospect-client/TimelineVertical/TimelineVerticalApollo";
75
79
  export { Toggle } from "./prospect-client/Toggle/ToggleApollo";
76
80
  export type { GridContainerProps } from "./prospect-client/utilities/types/GridContainerProps";
81
+ export { MessageBar, type MessageBarProps, type MessageBarVariant, } from "./prospect-client/MessageBar/MessageBarApollo";
package/dist/prospect.js CHANGED
@@ -5,9 +5,10 @@ import "@fontsource/source-sans-pro";
5
5
  export { Accordion, accordionVariants, } from "./prospect-client/Accordion/AccordionApollo";
6
6
  export { AccordionContextual, accordionContextualVariants, } from "./prospect-client/AccordionContextual/AccordionContextualApollo";
7
7
  export { AccordionCore } from "./prospect-client/AccordionCore/AccordionCoreApollo";
8
+ export { AppName } from "./prospect-client/AppName/AppName";
8
9
  export { BasePicture } from "./prospect-client/BasePicture/BasePicture";
9
10
  export { Button, buttonVariants, } from "./prospect-client/Button/ButtonApollo";
10
- export { Card } from "./prospect-client/Card/CardApollo";
11
+ export { Card, cardVariants, } from "./prospect-client/Card/CardApollo";
11
12
  export { CardMessage, cardMessageVariants, } from "./prospect-client/CardMessage/CardMessageApollo";
12
13
  export { ClickIcon } from "./prospect-client/ClickIcon/ClickIconApollo";
13
14
  export { ContentItemDuoAction, } from "./prospect-client/ContentItemDuoAction/ContentItemDuoActionApollo";
@@ -15,9 +16,7 @@ export { ContentItemMono } from "./prospect-client/ContentItemMono/ContentItemMo
15
16
  export { DataAgent, } from "./prospect-client/DataAgent/DataAgentApollo";
16
17
  export { Divider } from "./prospect-client/Divider/DividerApollo";
17
18
  export { Fieldset, } from "./prospect-client/Fieldset/FieldsetApollo";
18
- export { CardCheckbox,
19
- /** @deprecated Use `CardCheckbox` instead. */
20
- CardCheckbox as CheckboxCard, } from "./prospect-client/Form/Checkbox/CardCheckbox/CardCheckboxApollo";
19
+ export { CardCheckbox, } from "./prospect-client/Form/Checkbox/CardCheckbox/CardCheckboxApollo";
21
20
  export { CardCheckboxOption } from "./prospect-client/Form/Checkbox/CardCheckboxOption/CardCheckboxOptionApollo";
22
21
  export { Checkbox } from "./prospect-client/Form/Checkbox/Checkbox/CheckboxApollo";
23
22
  export { CheckboxText } from "./prospect-client/Form/Checkbox/CheckboxText/CheckboxTextApollo";
@@ -32,6 +31,8 @@ export { InputText } from "./prospect-client/Form/InputText/InputTextApollo";
32
31
  export { InputTextAtom } from "./prospect-client/Form/InputTextAtom/InputTextAtomApollo";
33
32
  export { ItemLabel } from "./prospect-client/Form/ItemLabel/ItemLabelApollo";
34
33
  export { ItemMessage, itemMessageVariants, } from "./prospect-client/Form/ItemMessage/ItemMessageApollo";
34
+ export { ItemMultiSelect, } from "./prospect-client/Form/ItemMultiSelect/ItemMultiSelectApollo";
35
+ export { MultiSelectList, } from "./prospect-client/Form/MultiSelectList/MultiSelectListApollo";
35
36
  export { CardRadio } from "./prospect-client/Form/Radio/CardRadio/CardRadioApollo";
36
37
  export { CardRadioGroup } from "./prospect-client/Form/Radio/CardRadioGroup/CardRadioGroupApollo";
37
38
  export { Radio } from "./prospect-client/Form/Radio/Radio/RadioApollo";
@@ -39,11 +40,13 @@ export { RadioText, } from "./prospect-client/Form/Radio/RadioText/RadioTextApol
39
40
  export { TextArea } from "./prospect-client/Form/TextArea/TextAreaApollo";
40
41
  export { DebugGrid } from "./prospect-client/Grid/DebugGridApollo";
41
42
  export { Heading, } from "./prospect-client/Heading/HeadingApollo";
43
+ export { Header, } from "./prospect-client/Header/HeaderApollo";
42
44
  export { Icon, iconSizeVariants, iconVariants, } from "./prospect-client/Icon/IconApollo";
43
45
  export { ItemTabBar, } from "./prospect-client/ItemTabBar/ItemTabBarApollo";
44
46
  export { ItemMenu, } from "./prospect-client/ItemMenu/ItemMenuApollo";
47
+ export { MenuBurger, } from "./prospect-client/MenuBurger/MenuBurgerApollo";
45
48
  export { TabMenu } from "./prospect-client/TabMenu/TabMenu";
46
- export { ExitLayout, } from "./prospect-client/Layout/ExitLayout/ExitLayoutApollo";
49
+ export { ExitLayout, ExitLayoutSkeleton, } from "./prospect-client/Layout/ExitLayout/ExitLayoutApollo";
47
50
  export { Footer, } from "./prospect-client/Layout/Footer/FooterApollo";
48
51
  export { FormLayout, } from "./prospect-client/Layout/FormLayout/FormLayout";
49
52
  export { LevelSelector, } from "./prospect-client/LevelSelector/LevelSelectorApollo";
@@ -61,7 +64,8 @@ export { ItemPagination, } from "./prospect-client/Pagination/ItemPagination/Ite
61
64
  export { Pagination } from "./prospect-client/Pagination/PaginationApollo";
62
65
  export { ProgressBar } from "./prospect-client/ProgressBar/ProgressBarApollo";
63
66
  export { ProgressBarGroup } from "./prospect-client/ProgressBarGroup/ProgressBarGroupApollo";
64
- export { Skeleton, } from "./prospect-client/Skeleton/SkeletonApollo";
67
+ export { Skeleton, skeletonSizeVariants, skeletonVariants, } from "./prospect-client/Skeleton/Skeleton";
68
+ export { SkeletonGrid, } from "./prospect-client/SkeletonGrid/SkeletonGrid";
65
69
  export { SkeletonList, } from "./prospect-client/SkeletonList/SkeletonListApollo";
66
70
  export { Spinner, spinnerVariants, } from "./prospect-client/Spinner/SpinnerApollo";
67
71
  export { Stepper } from "./prospect-client/Stepper/StepperApollo";
@@ -73,3 +77,4 @@ export { Tag, tagVariants, } from "./prospect-client/Tag/TagApollo";
73
77
  export { TagList, } from "./prospect-client/TagList/TagListApollo";
74
78
  export { TimelineVertical } from "./prospect-client/TimelineVertical/TimelineVerticalApollo";
75
79
  export { Toggle } from "./prospect-client/Toggle/ToggleApollo";
80
+ export { MessageBar, } from "./prospect-client/MessageBar/MessageBarApollo";
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@axa-fr/canopee-react",
3
- "version": "2.0.0-alpha.7",
3
+ "version": "2.0.0-alpha.71",
4
4
  "description": "Package React - Design System Canopée",
5
5
  "exports": {
6
6
  "./distributeur": {
@@ -53,7 +53,7 @@
53
53
  },
54
54
  "homepage": "https://github.com/AxaFrance/design-system#readme",
55
55
  "peerDependencies": {
56
- "@axa-fr/canopee-css": "2.0.0-alpha.7",
56
+ "@axa-fr/canopee-css": "2.0.0-alpha.71",
57
57
  "@material-symbols/svg-400": ">= 0.19.0",
58
58
  "@material-symbols/svg-700": ">= 0.19.0",
59
59
  "react": ">= 19"
@@ -1,2 +0,0 @@
1
- import "@axa-fr/canopee-css/prospect/Skeleton/SkeletonApollo.css";
2
- export { Skeleton, type SkeletonProps } from "./SkeletonCommon";
@@ -1,2 +0,0 @@
1
- import "@axa-fr/canopee-css/prospect/Skeleton/SkeletonApollo.css";
2
- export { Skeleton } from "./SkeletonCommon";
@@ -1,19 +0,0 @@
1
- import type { ReactNode } from "react";
2
- type isLoadingAndChildrenProps = {
3
- children: ReactNode;
4
- isLoading: boolean;
5
- } | {
6
- children?: undefined;
7
- isLoading?: boolean;
8
- };
9
- export type SkeletonProps = {
10
- className?: string;
11
- grid: number[][];
12
- "aria-busy"?: boolean;
13
- "aria-label"?: string;
14
- maxCols?: number;
15
- colGap?: number;
16
- rowGap?: number;
17
- } & isLoadingAndChildrenProps;
18
- export declare const Skeleton: ({ className, grid, "aria-busy": ariaBusy, "aria-label": ariaLabel, maxCols, colGap, rowGap, isLoading, children, }: SkeletonProps) => string | number | bigint | boolean | import("react/jsx-runtime").JSX.Element | Iterable<ReactNode> | Promise<string | number | bigint | boolean | import("react").ReactPortal | import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>> | Iterable<ReactNode> | null | undefined> | null | undefined;
19
- export {};
@@ -1,11 +0,0 @@
1
- import { jsx as _jsx } from "react/jsx-runtime";
2
- import { getClassName } from "../utilities/getClassName";
3
- const CLASS_NAME = "af-skeleton";
4
- export const Skeleton = ({ className, grid = [], "aria-busy": ariaBusy = true, "aria-label": ariaLabel = "Chargement", maxCols = 12, colGap = 16, rowGap = 8, isLoading = true, children, }) => isLoading ? (_jsx("div", { className: getClassName({
5
- baseClassName: `${CLASS_NAME}-container`,
6
- className,
7
- }), "aria-label": ariaLabel, role: "status", "aria-busy": ariaBusy, style: {
8
- "--max-cols": maxCols,
9
- "--col-gap": `calc(${colGap} / var(--font-size-base) * 1rem)`,
10
- "--row-gap": `calc(${rowGap} / var(--font-size-base) * 1rem)`,
11
- }, children: grid.map((cols, indexRow) => cols.map((colSize, indexCol) => (_jsx("div", { style: { "--col-size": colSize }, className: CLASS_NAME }, `${indexRow}-${indexCol}`)))) })) : (children);
@@ -1,2 +0,0 @@
1
- import "@axa-fr/canopee-css/client/Skeleton/SkeletonLF.css";
2
- export { Skeleton, type SkeletonProps } from "./SkeletonCommon";
@@ -1,2 +0,0 @@
1
- import "@axa-fr/canopee-css/client/Skeleton/SkeletonLF.css";
2
- export { Skeleton } from "./SkeletonCommon";
@@ -1,4 +0,0 @@
1
- /**
2
- * @deprecated This function is deprecated and will be removed in a future release. Use getClassName instead.
3
- */
4
- export declare const getComponentClassName: (defaultClassName: string, className?: string, classModifier?: string) => string;
@@ -1,30 +0,0 @@
1
- import classNames from "classnames";
2
- const getLastClassName = (defaultClassName) => {
3
- if (!defaultClassName) {
4
- return null;
5
- }
6
- return defaultClassName.split(" ").filter(Boolean).at(-1);
7
- };
8
- const listClassModifier = (classModifier) => {
9
- if (!classModifier) {
10
- return [];
11
- }
12
- return classModifier.split(" ");
13
- };
14
- /**
15
- * @deprecated This function is deprecated and will be removed in a future release. Use getClassName instead.
16
- */
17
- export const getComponentClassName = (defaultClassName, className, classModifier) => {
18
- // Fail fast, when no defaultClassName we don't want to loop on modifier
19
- if (!defaultClassName) {
20
- return "";
21
- }
22
- const classWithoutModifier = getLastClassName(defaultClassName);
23
- const modifiers = listClassModifier(classModifier);
24
- const modifiersObject = modifiers
25
- .filter((it) => /\S/.test(it))
26
- .map((it) => {
27
- return `${classWithoutModifier}--${it}`;
28
- });
29
- return classNames(defaultClassName, className, modifiersObject);
30
- };