@alveole/components 2.0.0-alpha.5 → 2.0.0-alpha.7

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 (247) hide show
  1. package/dist/core/A/A.d.ts +3 -1
  2. package/dist/core/A/A.d.ts.map +1 -1
  3. package/dist/core/A/A.js +2 -2
  4. package/dist/core/Box/Box.d.ts +8 -8
  5. package/dist/core/Box/Box.d.ts.map +1 -1
  6. package/dist/core/Box/Box.js +6 -3
  7. package/dist/core/Box/Box.stories.d.ts +5 -5
  8. package/dist/core/Box/Box.stories.js +1 -1
  9. package/dist/core/Box/Box.stories.sources.d.ts.map +1 -1
  10. package/dist/core/Box/Box.stories.sources.js +1 -1
  11. package/dist/core/Box/Box.types.d.ts +3 -3
  12. package/dist/core/Box/Box.types.d.ts.map +1 -1
  13. package/dist/core/Form/Form.web.d.ts.map +1 -1
  14. package/dist/core/Form/Form.web.js +4 -1
  15. package/dist/core/Grid/Grid.stories.d.ts +4 -4
  16. package/dist/core/Map/useGoogleMap.d.ts +2 -1
  17. package/dist/core/Map/useGoogleMap.d.ts.map +1 -1
  18. package/dist/core/Map/useGoogleMap.js +3 -2
  19. package/dist/core/MarkdownDescription/MarkdownDescription.d.ts.map +1 -1
  20. package/dist/core/MarkdownDescription/MarkdownDescription.js +0 -4
  21. package/dist/core/MarkdownDescription/markdownComponents.d.ts +0 -6
  22. package/dist/core/MarkdownDescription/markdownComponents.d.ts.map +1 -1
  23. package/dist/core/MarkdownDescription/markdownComponents.js +3 -2
  24. package/dist/core/Page/PageBackground.stories.d.ts +24 -0
  25. package/dist/core/Page/PageBackground.stories.d.ts.map +1 -0
  26. package/dist/core/Page/PageBackground.stories.js +25 -0
  27. package/dist/core/Page/PageBackground.stories.sources.d.ts +6 -0
  28. package/dist/core/Page/PageBackground.stories.sources.d.ts.map +1 -0
  29. package/dist/core/Page/PageBackground.stories.sources.js +6 -0
  30. package/dist/core/Page/PageContentScrollable.d.ts +5 -5
  31. package/dist/core/Page/index.d.ts +1 -0
  32. package/dist/core/Page/index.d.ts.map +1 -1
  33. package/dist/core/Page/index.js +1 -0
  34. package/dist/core/Typography/Typography.d.ts +5 -5
  35. package/dist/core/Typography/Typography.d.ts.map +1 -1
  36. package/dist/core/Typography/Typography.js +9 -4
  37. package/dist/core/Typography/Typography.stories.d.ts +2 -2
  38. package/dist/core/Typography/couleurDuTexte.d.ts +1 -1
  39. package/dist/core/Typography/couleurDuTexte.d.ts.map +1 -1
  40. package/dist/core/UpdateRequired/UpdateRequired.d.ts.map +1 -1
  41. package/dist/core/UpdateRequired/UpdateRequired.js +4 -1
  42. package/dist/core/animation/animer.d.ts +9 -0
  43. package/dist/core/animation/animer.d.ts.map +1 -0
  44. package/dist/core/animation/animer.js +5 -0
  45. package/dist/core/styleTamagui/aplatirStyle.d.ts +2 -0
  46. package/dist/core/styleTamagui/aplatirStyle.d.ts.map +1 -0
  47. package/dist/core/styleTamagui/aplatirStyle.js +9 -0
  48. package/dist/core/styleTamagui/definis.d.ts +4 -0
  49. package/dist/core/styleTamagui/definis.d.ts.map +1 -0
  50. package/dist/core/styleTamagui/definis.js +3 -0
  51. package/dist/core/styleTamagui/flexDuWeb.d.ts +23 -0
  52. package/dist/core/styleTamagui/flexDuWeb.d.ts.map +1 -0
  53. package/dist/core/styleTamagui/flexDuWeb.js +19 -0
  54. package/dist/core/styleTamagui/fondAuSurvol.d.ts +14 -0
  55. package/dist/core/styleTamagui/fondAuSurvol.d.ts.map +1 -0
  56. package/dist/core/styleTamagui/fondAuSurvol.js +8 -0
  57. package/dist/core/styleTamagui/sansEstompage.d.ts +4 -0
  58. package/dist/core/styleTamagui/sansEstompage.d.ts.map +1 -0
  59. package/dist/core/styleTamagui/sansEstompage.js +4 -0
  60. package/dist/core/styleTamagui/soulignement.d.ts +11 -0
  61. package/dist/core/styleTamagui/soulignement.d.ts.map +1 -0
  62. package/dist/core/styleTamagui/soulignement.js +5 -0
  63. package/dist/generated/version.d.ts +1 -1
  64. package/dist/generated/version.js +1 -1
  65. package/dist/pdfjs/pdf.min.mjs +4 -5
  66. package/dist/pdfjs/pdf.worker.min.mjs +4 -5
  67. package/dist/stories/index.d.ts +1 -0
  68. package/dist/stories/index.d.ts.map +1 -1
  69. package/dist/stories/index.js +1 -0
  70. package/dist/ui/Accordion/AccordionItem.d.ts.map +1 -1
  71. package/dist/ui/Accordion/AccordionItem.js +2 -1
  72. package/dist/ui/ActionMenu/ActionMenuItem.d.ts.map +1 -1
  73. package/dist/ui/ActionMenu/ActionMenuItem.js +5 -5
  74. package/dist/ui/Avatar/Avatar.d.ts.map +1 -1
  75. package/dist/ui/Avatar/Avatar.js +6 -1
  76. package/dist/ui/Badge/Badge.d.ts.map +1 -1
  77. package/dist/ui/Badge/Badge.js +3 -2
  78. package/dist/ui/Badge/Badge.stories.d.ts +16 -12
  79. package/dist/ui/Badge/Badge.stories.d.ts.map +1 -1
  80. package/dist/ui/Badge/Badge.styles.d.ts +16 -12
  81. package/dist/ui/Badge/Badge.styles.d.ts.map +1 -1
  82. package/dist/ui/Badge/Badge.styles.js +4 -2
  83. package/dist/ui/BottomSheet/BottomSheet.d.ts.map +1 -1
  84. package/dist/ui/BottomSheet/BottomSheet.js +2 -1
  85. package/dist/ui/BottomSheet/BottomSheet.stories.d.ts +6 -4
  86. package/dist/ui/BottomSheet/BottomSheet.stories.d.ts.map +1 -1
  87. package/dist/ui/BottomSheet/BottomSheet.styles.d.ts +6 -4
  88. package/dist/ui/BottomSheet/BottomSheet.styles.d.ts.map +1 -1
  89. package/dist/ui/BottomSheet/BottomSheet.styles.js +6 -4
  90. package/dist/ui/Breadcrumbs/Breadcrumbs.d.ts.map +1 -1
  91. package/dist/ui/Breadcrumbs/Breadcrumbs.js +2 -1
  92. package/dist/ui/Breadcrumbs/Breadcrumbs.stories.d.ts +5 -4
  93. package/dist/ui/Breadcrumbs/Breadcrumbs.stories.d.ts.map +1 -1
  94. package/dist/ui/Breadcrumbs/Breadcrumbs.styles.d.ts +5 -4
  95. package/dist/ui/Breadcrumbs/Breadcrumbs.styles.d.ts.map +1 -1
  96. package/dist/ui/Breadcrumbs/Breadcrumbs.styles.js +1 -4
  97. package/dist/ui/Button/ButtonContent.d.ts.map +1 -1
  98. package/dist/ui/Button/ButtonContent.js +7 -3
  99. package/dist/ui/Button/buttonIconStyling.d.ts +2 -2
  100. package/dist/ui/Button/buttonStyling.d.ts +9 -3
  101. package/dist/ui/Button/buttonStyling.d.ts.map +1 -1
  102. package/dist/ui/Button/buttonStyling.js +7 -3
  103. package/dist/ui/Checkbox/Checkbox.d.ts +6 -6
  104. package/dist/ui/Checkbox/Checkbox.stories.d.ts +7 -7
  105. package/dist/ui/Checkbox/Checkbox.styles.d.ts +1 -1
  106. package/dist/ui/Checkbox/Checkbox.styles.d.ts.map +1 -1
  107. package/dist/ui/Checkbox/Checkbox.styles.js +3 -4
  108. package/dist/ui/Checkbox/CheckboxContainer.d.ts +6 -6
  109. package/dist/ui/Checkbox/CheckboxContainer.d.ts.map +1 -1
  110. package/dist/ui/Checkbox/CheckboxContainer.js +4 -8
  111. package/dist/ui/Checkbox/CheckboxLabel.d.ts +1 -1
  112. package/dist/ui/Checkbox/CheckboxLabel.d.ts.map +1 -1
  113. package/dist/ui/Checkbox/CheckboxLabel.js +2 -2
  114. package/dist/ui/DataTable/DataTable.demo.deployments.js +1 -1
  115. package/dist/ui/DataTable/DataTable.stories.d.ts +3 -1
  116. package/dist/ui/DataTable/DataTable.stories.d.ts.map +1 -1
  117. package/dist/ui/DataTable/DataTable.styles.d.ts +3 -1
  118. package/dist/ui/DataTable/DataTable.styles.d.ts.map +1 -1
  119. package/dist/ui/DataTable/DataTable.styles.js +5 -1
  120. package/dist/ui/DataTable/DataTableCell.js +1 -1
  121. package/dist/ui/DataTable/DataTableRow.d.ts.map +1 -1
  122. package/dist/ui/DataTable/DataTableRow.js +4 -2
  123. package/dist/ui/DataTable/dataTableCellStyle.d.ts +2 -2
  124. package/dist/ui/DataTable/dataTableCellStyle.js +1 -1
  125. package/dist/ui/DateInput/DateInput.ios.d.ts +1 -1
  126. package/dist/ui/DateInput/DateInput.stories.d.ts +1 -1
  127. package/dist/ui/DateInput/DateInput.web.d.ts +1 -1
  128. package/dist/ui/DocumentViewer/DocumentViewer.stories.d.ts +1 -0
  129. package/dist/ui/DocumentViewer/DocumentViewer.stories.d.ts.map +1 -1
  130. package/dist/ui/DocumentViewer/DocumentViewer.stories.js +1 -1
  131. package/dist/ui/DocumentViewer/DocumentViewer.stories.sources.d.ts.map +1 -1
  132. package/dist/ui/DocumentViewer/DocumentViewer.stories.sources.js +1 -1
  133. package/dist/ui/DocumentViewer/DocumentViewer.styles.d.ts +1 -0
  134. package/dist/ui/DocumentViewer/DocumentViewer.styles.d.ts.map +1 -1
  135. package/dist/ui/DocumentViewer/DocumentViewer.styles.js +3 -0
  136. package/dist/ui/DocumentViewer/DocumentViewerImage.d.ts.map +1 -1
  137. package/dist/ui/DocumentViewer/pointeurWeb.d.ts +13 -3
  138. package/dist/ui/DocumentViewer/pointeurWeb.d.ts.map +1 -1
  139. package/dist/ui/DocumentViewer/pointeurWeb.js +1 -1
  140. package/dist/ui/DocumentViewer/useSurvolAvecZoom.d.ts +2 -2
  141. package/dist/ui/DocumentViewer/useSurvolAvecZoom.d.ts.map +1 -1
  142. package/dist/ui/FilterDate/FilterDate.d.ts +1 -1
  143. package/dist/ui/FilterDate/FilterDate.d.ts.map +1 -1
  144. package/dist/ui/Header/Header.d.ts.map +1 -1
  145. package/dist/ui/Header/Header.js +1 -1
  146. package/dist/ui/Link/Link.d.ts.map +1 -1
  147. package/dist/ui/Link/Link.js +2 -1
  148. package/dist/ui/Link/Link.stories.d.ts +0 -4
  149. package/dist/ui/Link/Link.stories.d.ts.map +1 -1
  150. package/dist/ui/Link/Link.styles.d.ts +0 -4
  151. package/dist/ui/Link/Link.styles.d.ts.map +1 -1
  152. package/dist/ui/Link/Link.styles.js +0 -4
  153. package/dist/ui/ListItem/ListItem.d.ts.map +1 -1
  154. package/dist/ui/ListItem/ListItem.js +2 -1
  155. package/dist/ui/ListItem/ListItem.stories.d.ts +4 -2
  156. package/dist/ui/ListItem/ListItem.stories.d.ts.map +1 -1
  157. package/dist/ui/ListItem/ListItem.styles.d.ts +4 -2
  158. package/dist/ui/ListItem/ListItem.styles.d.ts.map +1 -1
  159. package/dist/ui/ListItem/ListItem.styles.js +6 -2
  160. package/dist/ui/LucideIcon/catalogueLucide.d.ts +54 -0
  161. package/dist/ui/LucideIcon/catalogueLucide.d.ts.map +1 -1
  162. package/dist/ui/LucideIcon/vendor/lab.js +1 -1
  163. package/dist/ui/LucideIcon/vendor/lucide.d.ts +1769 -1587
  164. package/dist/ui/LucideIcon/vendor/lucide.js +3 -3
  165. package/dist/ui/ProgressBar/ProgressBar.stories.d.ts +1 -0
  166. package/dist/ui/ProgressBar/ProgressBar.stories.d.ts.map +1 -1
  167. package/dist/ui/ProgressBar/ProgressBar.styles.d.ts +1 -0
  168. package/dist/ui/ProgressBar/ProgressBar.styles.d.ts.map +1 -1
  169. package/dist/ui/ProgressBar/ProgressBar.styles.js +2 -0
  170. package/dist/ui/RadioGroup/RadioGroup.d.ts +2 -2
  171. package/dist/ui/RadioGroup/RadioGroup.d.ts.map +1 -1
  172. package/dist/ui/RadioGroup/RadioGroup.stories.d.ts +2 -4
  173. package/dist/ui/RadioGroup/RadioGroup.stories.d.ts.map +1 -1
  174. package/dist/ui/RadioGroup/RadioGroup.styles.d.ts +1 -3
  175. package/dist/ui/RadioGroup/RadioGroup.styles.d.ts.map +1 -1
  176. package/dist/ui/RadioGroup/RadioGroup.styles.js +3 -6
  177. package/dist/ui/RadioGroup/RadioGroupCard.d.ts.map +1 -1
  178. package/dist/ui/RadioGroup/RadioGroupCard.js +2 -2
  179. package/dist/ui/RadioGroup/RadioGroupItem.d.ts.map +1 -1
  180. package/dist/ui/RadioGroup/RadioGroupItem.js +2 -2
  181. package/dist/ui/RadioGroup/RadioInput.d.ts.map +1 -1
  182. package/dist/ui/RadioGroup/RadioInput.js +5 -7
  183. package/dist/ui/RadioGroup/index.d.ts +1 -1
  184. package/dist/ui/Select/SelectItem.js +1 -1
  185. package/dist/ui/Select/SelectList.styles.d.ts +1 -9
  186. package/dist/ui/Select/SelectList.styles.d.ts.map +1 -1
  187. package/dist/ui/Select/SelectList.styles.js +5 -6
  188. package/dist/ui/Select/selectItemStyle.d.ts +4 -4
  189. package/dist/ui/Select/selectItemStyle.d.ts.map +1 -1
  190. package/dist/ui/Select/selectItemStyle.js +7 -3
  191. package/dist/ui/Select/useDefilementVersSelection.d.ts +3 -2
  192. package/dist/ui/Select/useDefilementVersSelection.d.ts.map +1 -1
  193. package/dist/ui/Sidebar/Sidebar.stories.d.ts +0 -7
  194. package/dist/ui/Sidebar/Sidebar.stories.d.ts.map +1 -1
  195. package/dist/ui/Sidebar/Sidebar.styles.d.ts +0 -7
  196. package/dist/ui/Sidebar/Sidebar.styles.d.ts.map +1 -1
  197. package/dist/ui/Sidebar/Sidebar.styles.js +0 -3
  198. package/dist/ui/Sidebar/SidebarItem.d.ts.map +1 -1
  199. package/dist/ui/Sidebar/SidebarItem.js +13 -9
  200. package/dist/ui/Signature/Signature.d.ts +1 -1
  201. package/dist/ui/Signature/Signature.d.ts.map +1 -1
  202. package/dist/ui/Skeleton/Skeleton.stories.d.ts +1 -0
  203. package/dist/ui/Skeleton/Skeleton.stories.d.ts.map +1 -1
  204. package/dist/ui/Skeleton/Skeleton.styles.d.ts +1 -0
  205. package/dist/ui/Skeleton/Skeleton.styles.d.ts.map +1 -1
  206. package/dist/ui/Skeleton/Skeleton.styles.js +2 -0
  207. package/dist/ui/Switch/Switch.d.ts +1 -1
  208. package/dist/ui/Switch/Switch.d.ts.map +1 -1
  209. package/dist/ui/Switch/Switch.js +11 -8
  210. package/dist/ui/Switch/Switch.stories.d.ts +3 -2
  211. package/dist/ui/Switch/Switch.stories.d.ts.map +1 -1
  212. package/dist/ui/Switch/Switch.styles.d.ts +2 -1
  213. package/dist/ui/Switch/Switch.styles.d.ts.map +1 -1
  214. package/dist/ui/Switch/Switch.styles.js +5 -4
  215. package/dist/ui/Tabs/Tabs.d.ts +1 -1
  216. package/dist/ui/Tabs/Tabs.d.ts.map +1 -1
  217. package/dist/ui/Tabs/Tabs.js +1 -1
  218. package/dist/ui/Tabs/Tabs.stories.d.ts +26 -5
  219. package/dist/ui/Tabs/Tabs.stories.d.ts.map +1 -1
  220. package/dist/ui/Tabs/Tabs.styles.d.ts +26 -5
  221. package/dist/ui/Tabs/Tabs.styles.d.ts.map +1 -1
  222. package/dist/ui/Tabs/Tabs.styles.js +6 -2
  223. package/dist/ui/Tabs/TabsTab.js +1 -1
  224. package/dist/ui/Tabs/useTabsState.d.ts +1 -1
  225. package/dist/ui/Tabs/useTabsState.d.ts.map +1 -1
  226. package/dist/ui/Tabs/useTabsState.js +7 -4
  227. package/dist/ui/Toast/Toast.d.ts +3 -3
  228. package/dist/ui/Toast/Toast.d.ts.map +1 -1
  229. package/dist/ui/Toast/Toast.js +5 -7
  230. package/dist/ui/Toast/Toast.stories.d.ts +10 -7
  231. package/dist/ui/Toast/Toast.stories.d.ts.map +1 -1
  232. package/dist/ui/Toast/Toast.stories.js +12 -9
  233. package/dist/ui/Toast/Toast.stories.sources.js +1 -1
  234. package/dist/ui/Toast/ToastContext.d.ts +1 -0
  235. package/dist/ui/Toast/ToastContext.d.ts.map +1 -1
  236. package/dist/ui/Toast/ToastContext.js +1 -0
  237. package/dist/ui/Toast/Toasts.d.ts +2 -1
  238. package/dist/ui/Toast/Toasts.d.ts.map +1 -1
  239. package/dist/ui/Toast/Toasts.js +9 -5
  240. package/dist/ui/ToolbarTop/toolbarTopStyling.d.ts +2 -2
  241. package/package.json +27 -27
  242. package/dist/core/styleTamagui/versStyleTamagui.d.ts +0 -10
  243. package/dist/core/styleTamagui/versStyleTamagui.d.ts.map +0 -1
  244. package/dist/core/styleTamagui/versStyleTamagui.js +0 -8
  245. package/dist/ui/Toast/ToastBridge.d.ts +0 -11
  246. package/dist/ui/Toast/ToastBridge.d.ts.map +0 -1
  247. package/dist/ui/Toast/ToastBridge.js +0 -19
@@ -1,12 +1,20 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
2
2
  import { focusRingProps, useTheme } from '@alveole/theme';
3
3
  import React, { useId } from 'react';
4
- import { Label, Switch as TamaguiSwitch } from 'tamagui';
4
+ import { Switch as TamaguiSwitch } from 'tamagui';
5
+ import { Label } from 'tamagui/unstyled';
6
+ import { animer } from '../../core/animation/animer';
5
7
  import { Box } from '../../core/Box';
6
8
  import { Typography } from '../../core/Typography';
7
9
  import { FormControlCaption } from '../FormControl';
8
10
  import { apparenceDuSwitch } from './Switch.apparence';
9
11
  import { useStyles } from './Switch.styles';
12
+ // La piste du pouce, comme Tamagui v1 la dimensionnait : deux pouces de large, un de haut, plus
13
+ // 4 px pour le padding et la bordure qu'Alveole pose de chaque cote. La v2 ne compte plus ces
14
+ // 4 px, et le pouce debordait de sa piste. La taille de reference etait le token `$true` de la
15
+ // config de l'application, 44 px ; la config v5 de Tamagui v3 ne le fournit plus, Alveole la fixe.
16
+ const POUCE = Math.round(44 * 0.65);
17
+ const DIMENSIONS_DE_LA_PISTE = { width: 2 * POUCE + 4, height: POUCE + 4, minHeight: POUCE + 4 };
10
18
  export const Switch = React.forwardRef(function Switch(props, ref) {
11
19
  const { checked, style, label, error, success, disabled, noPadding, onCheckedChange, ...switchProps } = props;
12
20
  let { id } = props;
@@ -23,12 +31,7 @@ export const Switch = React.forwardRef(function Switch(props, ref) {
23
31
  onCheckedChange?.(newValue);
24
32
  };
25
33
  const { bouton, pouce, libelle } = apparenceDuSwitch(styles, { value, disabled, noPadding, style });
26
- const Toggle = (_jsx(TamaguiSwitch, { id: id, ref: ref, borderWidth: 1, checked: value, onCheckedChange: onChange, style: bouton, disabled: disabled, ...focusRingProps(),
27
- // Tamagui injecte sa propre regle `:focus-visible` en `!important` derriere un selecteur
28
- // `:root:root:root:root` : la regle CSS du theme ne peut pas la battre, et sans cette prop
29
- // c'est le gris translucide de Tamagui qui s'affiche. La valeur vient de `focusRing()`,
30
- // qui peint le meme bleu que la regle : un seul reglage, deux chemins pour l'appliquer.
31
- focusVisibleStyle: styles.switchButtonFocused, ...switchProps, children: _jsx(TamaguiSwitch.Thumb, { animation: "quicker", style: pouce }) }));
32
- const ToggleWithLabel = (_jsxs(_Fragment, { children: [_jsx(Label, { unstyled: true, htmlFor: id, width: '100%', children: _jsxs(Box, { tag: "switch", style: styles.switch, children: [Toggle, !!label && (_jsx(Typography, { htmlFor: id, style: libelle, children: label }))] }) }), (error ?? success) && _jsx(FormControlCaption, { error: error, success: success })] }));
34
+ const Toggle = (_jsx(TamaguiSwitch, { id: id, ref: ref, borderWidth: 1, ...DIMENSIONS_DE_LA_PISTE, checked: value, onCheckedChange: onChange, style: bouton, disabled: disabled, ...focusRingProps(), ...switchProps, children: _jsx(TamaguiSwitch.Thumb, { ...animer('quicker'), width: POUCE, height: POUCE, style: pouce }) }));
35
+ const ToggleWithLabel = (_jsxs(_Fragment, { children: [_jsx(Label, { htmlFor: id, width: '100%', children: _jsxs(Box, { tag: "switch", style: styles.switch, children: [Toggle, !!label && (_jsx(Typography, { htmlFor: id, style: libelle, children: label }))] }) }), (error ?? success) && _jsx(FormControlCaption, { error: error, success: success })] }));
33
36
  return (_jsx(Box, { tag: "switch", gap: error || success ? spacingValue('050') : 0, style: styles.switchContainer, children: !label ? Toggle : ToggleWithLabel }));
34
37
  });
@@ -3,7 +3,7 @@ declare const _default: {
3
3
  tags: "ui"[];
4
4
  experimental: false;
5
5
  description: string;
6
- component: import("react").ForwardRefExoticComponent<Omit<import("tamagui").SwitchProps, "value" | "onChange"> & {
6
+ component: import("react").ForwardRefExoticComponent<Omit<import("tamagui").SwitchProps, "onChange" | "value"> & {
7
7
  id?: string;
8
8
  label?: string;
9
9
  style?: import("react").CSSProperties;
@@ -13,7 +13,6 @@ declare const _default: {
13
13
  } & import("react").RefAttributes<import("tamagui").TamaguiElement>>;
14
14
  styleFn: () => {
15
15
  switchContainer: {};
16
- switchButtonFocused: import("@alveole/theme").FocusRingStyle;
17
16
  switch: {
18
17
  display: "flex";
19
18
  flexDirection: "row";
@@ -33,6 +32,7 @@ declare const _default: {
33
32
  backgroundColor: string;
34
33
  };
35
34
  switchButtonDisabled: {
35
+ opacity: 1;
36
36
  backgroundColor: string;
37
37
  cursor: "not-allowed";
38
38
  };
@@ -40,6 +40,7 @@ declare const _default: {
40
40
  borderWidth: number;
41
41
  borderColor: string;
42
42
  backgroundColor: string;
43
+ boxShadow: "none";
43
44
  };
44
45
  switchThumbChecked: {
45
46
  backgroundColor: string;
@@ -1 +1 @@
1
- {"version":3,"file":"Switch.stories.d.ts","sourceRoot":"","sources":["../../../src/ui/Switch/Switch.stories.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAMA,wBAOkB;AAElB,eAAO,MAAM,OAAO,mCAOnB,CAAC;AAEF,eAAO,MAAM,UAAU,mCAGtB,CAAC;AAEF,OAAO,KAAK,OAAO,MAAM,0BAA0B,CAAC"}
1
+ {"version":3,"file":"Switch.stories.d.ts","sourceRoot":"","sources":["../../../src/ui/Switch/Switch.stories.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAMA,wBAOkB;AAElB,eAAO,MAAM,OAAO,mCAOnB,CAAC;AAEF,eAAO,MAAM,UAAU,mCAGtB,CAAC;AAEF,OAAO,KAAK,OAAO,MAAM,0BAA0B,CAAC"}
@@ -1,6 +1,5 @@
1
1
  export declare const useStyles: () => {
2
2
  switchContainer: {};
3
- switchButtonFocused: import("@alveole/theme").FocusRingStyle;
4
3
  switch: {
5
4
  display: "flex";
6
5
  flexDirection: "row";
@@ -20,6 +19,7 @@ export declare const useStyles: () => {
20
19
  backgroundColor: string;
21
20
  };
22
21
  switchButtonDisabled: {
22
+ opacity: 1;
23
23
  backgroundColor: string;
24
24
  cursor: "not-allowed";
25
25
  };
@@ -27,6 +27,7 @@ export declare const useStyles: () => {
27
27
  borderWidth: number;
28
28
  borderColor: string;
29
29
  backgroundColor: string;
30
+ boxShadow: "none";
30
31
  };
31
32
  switchThumbChecked: {
32
33
  backgroundColor: string;
@@ -1 +1 @@
1
- {"version":3,"file":"Switch.styles.d.ts","sourceRoot":"","sources":["../../../src/ui/Switch/Switch.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoDnB,CAAC"}
1
+ {"version":3,"file":"Switch.styles.d.ts","sourceRoot":"","sources":["../../../src/ui/Switch/Switch.styles.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoDnB,CAAC"}
@@ -1,9 +1,7 @@
1
- import { focusRing, makeStyles } from '@alveole/theme';
1
+ import { makeStyles } from '@alveole/theme';
2
+ import { sansEstompage } from '../../core/styleTamagui/sansEstompage';
2
3
  export const useStyles = makeStyles(({ text, color, spacing }) => ({
3
4
  switchContainer: {},
4
- // Voir `Switch.tsx` : Tamagui impose sa propre bague en `!important`, seule sa prop
5
- // `focusVisibleStyle` peut la remplacer. La valeur vient de la meme source que la regle CSS.
6
- switchButtonFocused: focusRing('default'),
7
5
  switch: {
8
6
  display: 'flex',
9
7
  flexDirection: 'row',
@@ -25,11 +23,14 @@ export const useStyles = makeStyles(({ text, color, spacing }) => ({
25
23
  switchButtonDisabled: {
26
24
  backgroundColor: color.background['disabled-grey'],
27
25
  cursor: 'not-allowed',
26
+ ...sansEstompage,
28
27
  },
29
28
  switchThumb: {
30
29
  borderWidth: 1,
31
30
  borderColor: color.border['default-grey'],
32
31
  backgroundColor: color.background['default-active'],
32
+ // Tamagui v3 ombre son pouce ; celui d'Alveole est plat.
33
+ boxShadow: 'none',
33
34
  },
34
35
  switchThumbChecked: {
35
36
  backgroundColor: color.primary,
@@ -1,7 +1,7 @@
1
1
  import React from 'react';
2
2
  import { BoxProps } from '../../core/Box';
3
3
  import { Leading } from '../Leading';
4
- export type TabsProps = Omit<BoxProps, 'children'> & {
4
+ export type TabsProps = Omit<BoxProps, 'children' | 'onChange'> & {
5
5
  tabs: {
6
6
  label: string;
7
7
  leading?: Leading;
@@ -1 +1 @@
1
- {"version":3,"file":"Tabs.d.ts","sourceRoot":"","sources":["../../../src/ui/Tabs/Tabs.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAO,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC/C,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AAOrC,MAAM,MAAM,SAAS,GAAG,IAAI,CAAC,QAAQ,EAAE,UAAU,CAAC,GAAG;IACnD,IAAI,EAAE;QACJ,KAAK,EAAE,MAAM,CAAC;QACd,OAAO,CAAC,EAAE,OAAO,CAAC;QAClB,OAAO,CAAC,EAAE,MAAM,CAAC;QACjB,KAAK,EAAE,MAAM,CAAC;QACd,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC;QACzB,UAAU,CAAC,EAAE,OAAO,CAAC;QACrB,YAAY,CAAC,EAAE,MAAM,KAAK,CAAC,SAAS,CAAC;KACtC,EAAE,CAAC;IACJ,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC;;;;;;OAMG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B,CAAC;AAEF,eAAO,MAAM,IAAI,GAAI,OAAO,SAAS,sBAkEpC,CAAC"}
1
+ {"version":3,"file":"Tabs.d.ts","sourceRoot":"","sources":["../../../src/ui/Tabs/Tabs.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAO,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC/C,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AAOrC,MAAM,MAAM,SAAS,GAAG,IAAI,CAAC,QAAQ,EAAE,UAAU,GAAG,UAAU,CAAC,GAAG;IAChE,IAAI,EAAE;QACJ,KAAK,EAAE,MAAM,CAAC;QACd,OAAO,CAAC,EAAE,OAAO,CAAC;QAClB,OAAO,CAAC,EAAE,MAAM,CAAC;QACjB,KAAK,EAAE,MAAM,CAAC;QACd,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC;QACzB,UAAU,CAAC,EAAE,OAAO,CAAC;QACrB,YAAY,CAAC,EAAE,MAAM,KAAK,CAAC,SAAS,CAAC;KACtC,EAAE,CAAC;IACJ,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC;;;;;;OAMG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B,CAAC;AAEF,eAAO,MAAM,IAAI,GAAI,OAAO,SAAS,sBAkEpC,CAAC"}
@@ -27,5 +27,5 @@ export const Tabs = (props) => {
27
27
  const tab = tabs[index];
28
28
  if (tab)
29
29
  persist(toSlug(tab.label));
30
- }, orientation: "horizontal", size: "$4", activationMode: "manual", children: [_jsxs(TamaguiTabs.List, { disablePassBorderRadius: true, loop: false, style: styles.tabsList, ...focusRingProps(), children: [tabs.map(tab => (_jsx(TabsTab, { value: tab.value, label: tab.label, leading: tab.leading, counter: tab.counter, etat: etatDeLOnglet(tab.value), disabled: tabs.length < 2, onHover: setHoverTab, onInteraction: handleOnInteraction }, tab.value))), ongletCourant?.renderAction && _jsx(Box, { ml: 'auto', children: ongletCourant.renderAction() })] }), _jsx(Box, { style: { flex: 1, minHeight: 0 }, children: tabs.map((tab, idx) => (_jsx(TamaguiTabs.Content, { style: styles.tabsContent, value: tab.value, ...focusRingProps(), children: _jsx(TabsContent, { content: ongletCourant?.content, scrollable: ongletCourant?.scrollable }) }, idx))) })] }) }));
30
+ }, orientation: "horizontal", size: "$4", activationMode: "manual", children: [_jsxs(TamaguiTabs.List, { loop: false, style: styles.tabsList, ...focusRingProps(), children: [tabs.map(tab => (_jsx(TabsTab, { value: tab.value, label: tab.label, leading: tab.leading, counter: tab.counter, etat: etatDeLOnglet(tab.value), disabled: tabs.length < 2, onHover: setHoverTab, onInteraction: handleOnInteraction }, tab.value))), ongletCourant?.renderAction && _jsx(Box, { ml: 'auto', children: ongletCourant.renderAction() })] }), _jsx(Box, { style: { flex: 1, minHeight: 0 }, children: tabs.map((tab, idx) => (_jsx(TamaguiTabs.Content, { style: styles.tabsContent, value: tab.value, ...focusRingProps(), children: _jsx(TabsContent, { content: ongletCourant?.content, scrollable: ongletCourant?.scrollable }) }, idx))) })] }) }));
31
31
  };
@@ -28,9 +28,6 @@ declare const _default: {
28
28
  fontWeight?: import("react-native").TextStyle["fontWeight"];
29
29
  };
30
30
  tabsTab: {
31
- appearance: "none";
32
- backgroundColor: "transparent";
33
- cursor: "pointer";
34
31
  paddingTop: string | number;
35
32
  paddingBottom: string | number;
36
33
  paddingLeft: number;
@@ -44,6 +41,10 @@ declare const _default: {
44
41
  gap: string | number;
45
42
  borderTopLeftRadius: import("@alveole/theme").Radius;
46
43
  borderTopRightRadius: import("@alveole/theme").Radius;
44
+ opacity: 1;
45
+ appearance: "none";
46
+ backgroundColor: "transparent";
47
+ cursor: "pointer";
47
48
  };
48
49
  tabsTabActive: {
49
50
  borderBottomColor: string;
@@ -77,9 +78,19 @@ declare const _default: {
77
78
  gap: string | number;
78
79
  };
79
80
  tabs: {
80
- flex: number;
81
81
  minHeight: number;
82
82
  flexDirection: "column";
83
+ flexGrow: number;
84
+ flexShrink: number;
85
+ flexBasis: string;
86
+ flex?: undefined;
87
+ } | {
88
+ minHeight: number;
89
+ flexDirection: "column";
90
+ flex: number;
91
+ flexGrow?: undefined;
92
+ flexShrink?: undefined;
93
+ flexBasis?: undefined;
83
94
  };
84
95
  tabsList: {
85
96
  borderBottomLeftRadius: string | number;
@@ -92,9 +103,19 @@ declare const _default: {
92
103
  overflowX: "scroll";
93
104
  };
94
105
  tabsContent: {
95
- flex: number;
96
106
  minHeight: number;
97
107
  overflow: "hidden";
108
+ flexGrow: number;
109
+ flexShrink: number;
110
+ flexBasis: string;
111
+ flex?: undefined;
112
+ } | {
113
+ minHeight: number;
114
+ overflow: "hidden";
115
+ flex: number;
116
+ flexGrow?: undefined;
117
+ flexShrink?: undefined;
118
+ flexBasis?: undefined;
98
119
  };
99
120
  };
100
121
  };
@@ -1 +1 @@
1
- {"version":3,"file":"Tabs.stories.d.ts","sourceRoot":"","sources":["../../../src/ui/Tabs/Tabs.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAO1B,wBAQkB;AAElB,eAAO,MAAM,OAAO,yBAuBnB,CAAC;AAEF,OAAO,KAAK,OAAO,MAAM,wBAAwB,CAAC"}
1
+ {"version":3,"file":"Tabs.stories.d.ts","sourceRoot":"","sources":["../../../src/ui/Tabs/Tabs.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAO1B,wBAQkB;AAElB,eAAO,MAAM,OAAO,yBAuBnB,CAAC;AAEF,OAAO,KAAK,OAAO,MAAM,wBAAwB,CAAC"}
@@ -20,9 +20,6 @@ export declare const useStyles: () => {
20
20
  fontWeight?: import("react-native").TextStyle["fontWeight"];
21
21
  };
22
22
  tabsTab: {
23
- appearance: "none";
24
- backgroundColor: "transparent";
25
- cursor: "pointer";
26
23
  paddingTop: string | number;
27
24
  paddingBottom: string | number;
28
25
  paddingLeft: number;
@@ -36,6 +33,10 @@ export declare const useStyles: () => {
36
33
  gap: string | number;
37
34
  borderTopLeftRadius: import("@alveole/theme").Radius;
38
35
  borderTopRightRadius: import("@alveole/theme").Radius;
36
+ opacity: 1;
37
+ appearance: "none";
38
+ backgroundColor: "transparent";
39
+ cursor: "pointer";
39
40
  };
40
41
  tabsTabActive: {
41
42
  borderBottomColor: string;
@@ -69,9 +70,19 @@ export declare const useStyles: () => {
69
70
  gap: string | number;
70
71
  };
71
72
  tabs: {
72
- flex: number;
73
73
  minHeight: number;
74
74
  flexDirection: "column";
75
+ flexGrow: number;
76
+ flexShrink: number;
77
+ flexBasis: string;
78
+ flex?: undefined;
79
+ } | {
80
+ minHeight: number;
81
+ flexDirection: "column";
82
+ flex: number;
83
+ flexGrow?: undefined;
84
+ flexShrink?: undefined;
85
+ flexBasis?: undefined;
75
86
  };
76
87
  tabsList: {
77
88
  borderBottomLeftRadius: string | number;
@@ -84,9 +95,19 @@ export declare const useStyles: () => {
84
95
  overflowX: "scroll";
85
96
  };
86
97
  tabsContent: {
87
- flex: number;
88
98
  minHeight: number;
89
99
  overflow: "hidden";
100
+ flexGrow: number;
101
+ flexShrink: number;
102
+ flexBasis: string;
103
+ flex?: undefined;
104
+ } | {
105
+ minHeight: number;
106
+ overflow: "hidden";
107
+ flex: number;
108
+ flexGrow?: undefined;
109
+ flexShrink?: undefined;
110
+ flexBasis?: undefined;
90
111
  };
91
112
  };
92
113
  //# sourceMappingURL=Tabs.styles.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"Tabs.styles.d.ts","sourceRoot":"","sources":["../../../src/ui/Tabs/Tabs.styles.ts"],"names":[],"mappings":"AA8GA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAA2F,CAAC"}
1
+ {"version":3,"file":"Tabs.styles.d.ts","sourceRoot":"","sources":["../../../src/ui/Tabs/Tabs.styles.ts"],"names":[],"mappings":"AAkHA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAA2F,CAAC"}
@@ -1,4 +1,6 @@
1
1
  import { makeStyles } from '@alveole/theme';
2
+ import { flexDuWeb } from '../../core/styleTamagui/flexDuWeb';
3
+ import { sansEstompage } from '../../core/styleTamagui/sansEstompage';
2
4
  const coque = ({ color, spacing }) => ({
3
5
  container: {
4
6
  flex: 1,
@@ -8,7 +10,7 @@ const coque = ({ color, spacing }) => ({
8
10
  gap: spacing('3V'),
9
11
  },
10
12
  tabs: {
11
- flex: 1,
13
+ ...flexDuWeb(1),
12
14
  minHeight: 0,
13
15
  flexDirection: 'column',
14
16
  },
@@ -23,7 +25,7 @@ const coque = ({ color, spacing }) => ({
23
25
  overflowX: 'scroll', // On ajoute un scroll horizontal pour les petits écrans
24
26
  },
25
27
  tabsContent: {
26
- flex: 1,
28
+ ...flexDuWeb(1),
27
29
  minHeight: 0,
28
30
  overflow: 'hidden',
29
31
  },
@@ -33,6 +35,8 @@ const onglet = ({ color, spacing, radius }) => ({
33
35
  appearance: 'none',
34
36
  backgroundColor: 'transparent',
35
37
  cursor: 'pointer',
38
+ // L'onglet seul est desactive.
39
+ ...sansEstompage,
36
40
  paddingTop: spacing('1W'),
37
41
  paddingBottom: spacing('1W'),
38
42
  paddingLeft: 0,
@@ -11,5 +11,5 @@ export const TabsTab = (props) => {
11
11
  const { value, label, leading, counter, etat, disabled, onHover, onInteraction } = props;
12
12
  const styles = useStyles();
13
13
  const { onglet, enveloppe, icone, libelle } = apparenceDeLOnglet(styles, etat);
14
- return (_jsx(TamaguiTabs.Tab, { unstyled: true, onHoverIn: () => onHover(value), onHoverOut: () => onHover(null), onInteraction: onInteraction, value: value, disabled: disabled, style: onglet, ...focusRingProps(), children: _jsxs(Box, { style: enveloppe, children: [_jsx(LeadingSlot, { contenu: leading, apparence: { size: 'sm', color: 'currentColor', style: icone } }), _jsx(Typography, { style: libelle, children: label }), counter !== undefined && counter > 0 && (_jsx(Counter, { variant: etat.actif ? 'primary' : 'default', count: counter }))] }) }));
14
+ return (_jsx(TamaguiTabs.Tab, { unstyled: true, onMouseEnter: () => onHover(value), onMouseLeave: () => onHover(null), onInteraction: onInteraction, value: value, disabled: disabled, style: onglet, ...focusRingProps(), children: _jsxs(Box, { style: enveloppe, children: [_jsx(LeadingSlot, { contenu: leading, apparence: { size: 'sm', color: 'currentColor', style: icone } }), _jsx(Typography, { style: libelle, children: label }), counter !== undefined && counter > 0 && (_jsx(Counter, { variant: etat.actif ? 'primary' : 'default', count: counter }))] }) }));
15
15
  };
@@ -6,6 +6,6 @@ export declare const useTabsState: (initialValue: string, onChange?: (index: num
6
6
  setCurrentTab: (currentTab: string, index: number) => void;
7
7
  restoreCurrentTab: (currentTab: string) => void;
8
8
  setHoverTab: (hoverTab: string | null) => void;
9
- handleOnInteraction: (type: "hover" | "focus" | "select", layout: TabLayout | null) => void;
9
+ handleOnInteraction: (type: import("tamagui").InteractionType, layout: TabLayout | null) => void;
10
10
  };
11
11
  //# sourceMappingURL=useTabsState.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"useTabsState.d.ts","sourceRoot":"","sources":["../../../src/ui/Tabs/useTabsState.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAgB,MAAM,SAAS,CAAC;AAClD,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAgBjD,eAAO,MAAM,YAAY,GAAI,cAAc,MAAM,EAAE,WAAW,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI;;8BA4BlD,MAAM,KAAG,aAAa;gCAnBpB,MAAM,SAAS,MAAM;oCAOjB,MAAM;4BAEd,MAAM,GAAG,IAAI;;CAuB7C,CAAC"}
1
+ {"version":3,"file":"useTabsState.d.ts","sourceRoot":"","sources":["../../../src/ui/Tabs/useTabsState.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,SAAS,EAAgB,MAAM,SAAS,CAAC;AAClD,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAgBjD,eAAO,MAAM,YAAY,GAAI,cAAc,MAAM,EAAE,WAAW,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI;;8BA+BlD,MAAM,KAAG,aAAa;gCAtBpB,MAAM,SAAS,MAAM;oCAOjB,MAAM;4BAKd,MAAM,GAAG,IAAI;;CAuB7C,CAAC"}
@@ -14,19 +14,22 @@ export const useTabsState = (initialValue, onChange) => {
14
14
  hoverTab: null,
15
15
  });
16
16
  const setCurrentTab = (currentTab, index) => {
17
- setTabState({ ...tabState, currentTab });
17
+ setTabState(state => ({ ...state, currentTab }));
18
18
  onChange?.(index);
19
19
  };
20
20
  // Restaurer l'onglet actif depuis l'Anchor Namespace n'est pas une interaction : `onChange`
21
21
  // ne doit se declencher que sur un vrai clic, pas sur ce qui n'est qu'une reprise d'etat.
22
22
  const restoreCurrentTab = (currentTab) => setTabState(state => ({ ...state, currentTab }));
23
- const setHoverTab = (hoverTab) => setTabState({ ...tabState, hoverTab });
23
+ // Chaque mise a jour part de l'etat courant, jamais de celui du rendu : en Tamagui v3, l'onglet
24
+ // emet son interaction `hover` dans le meme evenement que `onMouseEnter`, et une ecriture a
25
+ // partir de l'etat du rendu effacait le survol tout juste pose.
26
+ const setHoverTab = (hoverTab) => setTabState(state => ({ ...state, hoverTab }));
24
27
  const handleOnInteraction = (type, layout) => {
25
28
  if (type === 'select') {
26
- setTabState({ ...tabState, prevActiveAt: tabState.activeAt, activeAt: layout });
29
+ setTabState(state => ({ ...state, prevActiveAt: state.activeAt, activeAt: layout }));
27
30
  }
28
31
  else {
29
- setTabState({ ...tabState, intentAt: layout });
32
+ setTabState(state => ({ ...state, intentAt: layout }));
30
33
  }
31
34
  };
32
35
  const etatDeLOnglet = (tabValue) => ({
@@ -1,4 +1,4 @@
1
- import { BoxProps } from '../../core/Box';
1
+ import { type ToastItemRenderProps } from '@tamagui/toast';
2
2
  import { Leading } from '../Leading';
3
3
  import type { ToastAPIOptions } from './ToastContext';
4
4
  type ToastVariant = NonNullable<ToastAPIOptions['variant']>;
@@ -10,7 +10,7 @@ export type ToastViewProps = {
10
10
  onClose?: () => void;
11
11
  };
12
12
  export declare function ToastView({ title, message, variant, leading, onClose }: ToastViewProps): import("react").JSX.Element;
13
- export type ToastProps = Omit<BoxProps, 'children'>;
14
- export declare function Toast(): import("react").JSX.Element | null;
13
+ export type ToastProps = ToastItemRenderProps;
14
+ export declare function Toast({ toast, index }: ToastProps): import("react").JSX.Element;
15
15
  export {};
16
16
  //# sourceMappingURL=Toast.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"Toast.d.ts","sourceRoot":"","sources":["../../../src/ui/Toast/Toast.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAO,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAE/C,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AAGrC,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAGtD,KAAK,YAAY,GAAG,WAAW,CAAC,eAAe,CAAC,SAAS,CAAC,CAAC,CAAC;AAE5D,MAAM,MAAM,cAAc,GAAG;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB,CAAC;AAEF,wBAAgB,SAAS,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,OAAmB,EAAE,OAAO,EAAE,OAAO,EAAE,EAAE,cAAc,+BAqBlG;AAED,MAAM,MAAM,UAAU,GAAG,IAAI,CAAC,QAAQ,EAAE,UAAU,CAAC,CAAC;AAEpD,wBAAgB,KAAK,uCAyBpB"}
1
+ {"version":3,"file":"Toast.d.ts","sourceRoot":"","sources":["../../../src/ui/Toast/Toast.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAyB,KAAK,oBAAoB,EAAE,MAAM,gBAAgB,CAAC;AAIlF,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AAGrC,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,gBAAgB,CAAC;AAGtD,KAAK,YAAY,GAAG,WAAW,CAAC,eAAe,CAAC,SAAS,CAAC,CAAC,CAAC;AAE5D,MAAM,MAAM,cAAc,GAAG;IAC3B,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,YAAY,CAAC;IACvB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;CACtB,CAAC;AAEF,wBAAgB,SAAS,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,OAAmB,EAAE,OAAO,EAAE,OAAO,EAAE,EAAE,cAAc,+BAqBlG;AAED,MAAM,MAAM,UAAU,GAAG,oBAAoB,CAAC;AAK9C,wBAAgB,KAAK,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE,UAAU,+BAQjD"}
@@ -1,5 +1,5 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import { Toast as TamaguiToast, useToastController, useToastState } from '@tamagui/toast';
2
+ import { Toast as TamaguiToast } from '@tamagui/toast';
3
3
  import { Pressable } from 'react-native';
4
4
  import { Box } from '../../core/Box';
5
5
  import { Typography } from '../../core/Typography';
@@ -10,11 +10,9 @@ export function ToastView({ title, message, variant = 'default', leading, onClos
10
10
  const styles = useStyles();
11
11
  return (_jsxs(Box, { style: styles.container, children: [_jsx(ToastType, { variant: variant, leading: leading }), _jsxs(Box, { style: styles.contenu, children: [_jsxs(Box, { style: styles.titleContainer, children: [_jsx(Typography, { style: styles.title, children: title }), _jsx(Pressable, { accessibilityRole: "button", accessibilityLabel: "Fermer la notification", onPress: onClose, children: _jsx(LucideIcon, { name: "X", size: "md" }) })] }), message && (_jsx(Box, { children: _jsx(Typography, { style: styles.message, children: message }) }))] })] }));
12
12
  }
13
- export function Toast() {
14
- const toast = useToastState();
15
- const controller = useToastController();
13
+ const horsEcran = { opacity: 0, y: 10, scale: 0.98 };
14
+ const animationDuToast = { enter: horsEcran, exit: horsEcran };
15
+ export function Toast({ toast, index }) {
16
16
  const styles = useStyles();
17
- if (!toast)
18
- return null;
19
- return (_jsx(TamaguiToast, { duration: toast.duration, enterStyle: { opacity: 0, y: 10, scale: 0.98 }, exitStyle: { opacity: 0, y: 10, scale: 0.98 }, viewportName: "app-toasts", style: styles.tamaguiToastContainer, children: _jsx(ToastView, { title: toast.title, message: toast.message, variant: toast.customData?.variant ?? 'default', leading: toast.customData?.leading, onClose: () => controller.hide() }) }, toast.id));
17
+ return (_jsx(TamaguiToast.Item, { toast: toast, index: index, ...animationDuToast, style: styles.tamaguiToastContainer, children: toast.jsx }));
20
18
  }
@@ -152,18 +152,21 @@ export default _default;
152
152
  * import { Toasts } from '@alveole/components';
153
153
  * import { ThemeProvider } from '@alveole/theme';
154
154
  * import { Stack } from 'expo-router';
155
+ * import { SafeAreaProvider } from 'react-native-safe-area-context';
155
156
  * import { TamaguiProvider } from 'tamagui';
156
157
  * import { tamaguiConfig } from '../tamagui.config';
157
158
  *
158
159
  * export default function RootLayout() {
159
160
  * return (
160
- * <TamaguiProvider config={tamaguiConfig} defaultTheme="light">
161
- * <ThemeProvider loader={false}>
162
- * <Toasts>
163
- * <Stack screenOptions={{ headerShown: false }} />
164
- * </Toasts>
165
- * </ThemeProvider>
166
- * </TamaguiProvider>
161
+ * <SafeAreaProvider>
162
+ * <TamaguiProvider config={tamaguiConfig} defaultTheme="light">
163
+ * <ThemeProvider loader={false}>
164
+ * <Toasts>
165
+ * <Stack screenOptions={{ headerShown: false }} />
166
+ * </Toasts>
167
+ * </ThemeProvider>
168
+ * </TamaguiProvider>
169
+ * </SafeAreaProvider>
167
170
  * );
168
171
  * }
169
172
  * ```
@@ -1 +1 @@
1
- {"version":3,"file":"Toast.stories.d.ts","sourceRoot":"","sources":["../../../src/ui/Toast/Toast.stories.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,KAAK,EAAa,MAAM,SAAS,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAM3C,wBASkB;AAElB;;;;;;;;;;;;;;;;;;;;;;GAsBG;AACH,eAAO,MAAM,GAAG,mCA+Bf,CAAC;AAEF,eAAO,MAAM,WAAW,mCAEvB,CAAC;AAEF,eAAO,MAAM,cAAc,mCAE1B,CAAC;AAEF,eAAO,MAAM,YAAY,mCAExB,CAAC;AAEF,eAAO,MAAM,cAAc,mCAE1B,CAAC;AAEF,eAAO,MAAM,cAAc,mCAE1B,CAAC;AAEF,eAAO,MAAM,0BAA0B,mCAA2E,CAAC;AAEnH,eAAO,MAAM,6BAA6B,mCAEzC,CAAC;AAEF,eAAO,MAAM,WAAW,mCAOvB,CAAC;AAEF,OAAO,KAAK,OAAO,MAAM,yBAAyB,CAAC"}
1
+ {"version":3,"file":"Toast.stories.d.ts","sourceRoot":"","sources":["../../../src/ui/Toast/Toast.stories.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,KAAK,EAAa,MAAM,SAAS,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAM3C,wBASkB;AAElB;;;;;;;;;;;;;;;;;;;;;;;;;GAyBG;AACH,eAAO,MAAM,GAAG,mCA+Bf,CAAC;AAEF,eAAO,MAAM,WAAW,mCAEvB,CAAC;AAEF,eAAO,MAAM,cAAc,mCAE1B,CAAC;AAEF,eAAO,MAAM,YAAY,mCAExB,CAAC;AAEF,eAAO,MAAM,cAAc,mCAE1B,CAAC;AAEF,eAAO,MAAM,cAAc,mCAE1B,CAAC;AAEF,eAAO,MAAM,0BAA0B,mCAA2E,CAAC;AAEnH,eAAO,MAAM,6BAA6B,mCAEzC,CAAC;AAEF,eAAO,MAAM,WAAW,mCAOvB,CAAC;AAEF,OAAO,KAAK,OAAO,MAAM,yBAAyB,CAAC"}
@@ -3,9 +3,9 @@ import { Box } from '../../core/Box';
3
3
  import { Button } from '../Button';
4
4
  import { Toast, ToastView } from './Toast';
5
5
  import { useStyles } from './Toast.styles';
6
- import { defaultDuration } from './ToastBridge';
6
+ import { defaultDuration } from './ToastContext';
7
+ import { useToast } from './Toasts';
7
8
  import { ToastType } from './ToastType';
8
- import { useToast } from './index';
9
9
  export default {
10
10
  title: 'Toast',
11
11
  tags: ['ui'],
@@ -23,18 +23,21 @@ export default {
23
23
  * import { Toasts } from '@alveole/components';
24
24
  * import { ThemeProvider } from '@alveole/theme';
25
25
  * import { Stack } from 'expo-router';
26
+ * import { SafeAreaProvider } from 'react-native-safe-area-context';
26
27
  * import { TamaguiProvider } from 'tamagui';
27
28
  * import { tamaguiConfig } from '../tamagui.config';
28
29
  *
29
30
  * export default function RootLayout() {
30
31
  * return (
31
- * <TamaguiProvider config={tamaguiConfig} defaultTheme="light">
32
- * <ThemeProvider loader={false}>
33
- * <Toasts>
34
- * <Stack screenOptions={{ headerShown: false }} />
35
- * </Toasts>
36
- * </ThemeProvider>
37
- * </TamaguiProvider>
32
+ * <SafeAreaProvider>
33
+ * <TamaguiProvider config={tamaguiConfig} defaultTheme="light">
34
+ * <ThemeProvider loader={false}>
35
+ * <Toasts>
36
+ * <Stack screenOptions={{ headerShown: false }} />
37
+ * </Toasts>
38
+ * </ThemeProvider>
39
+ * </TamaguiProvider>
40
+ * </SafeAreaProvider>
38
41
  * );
39
42
  * }
40
43
  * ```
@@ -21,5 +21,5 @@ export const storySources = {
21
21
  ToastsTypes,
22
22
  };
23
23
  export const storyDescriptions = {
24
- All: "Le fichier `_layout.tsx` doit inclure la balise `<Toasts>` pour fonctionner.\n\n```tsx\nimport { Toasts } from '@alveole/components';\nimport { ThemeProvider } from '@alveole/theme';\nimport { Stack } from 'expo-router';\nimport { TamaguiProvider } from 'tamagui';\nimport { tamaguiConfig } from '../tamagui.config';\n\nexport default function RootLayout() {\n return (\n <TamaguiProvider config={tamaguiConfig} defaultTheme=\"light\">\n <ThemeProvider loader={false}>\n <Toasts>\n <Stack screenOptions={{ headerShown: false }} />\n </Toasts>\n </ThemeProvider>\n </TamaguiProvider>\n );\n}\n```",
24
+ All: "Le fichier `_layout.tsx` doit inclure la balise `<Toasts>` pour fonctionner.\n\n```tsx\nimport { Toasts } from '@alveole/components';\nimport { ThemeProvider } from '@alveole/theme';\nimport { Stack } from 'expo-router';\nimport { SafeAreaProvider } from 'react-native-safe-area-context';\nimport { TamaguiProvider } from 'tamagui';\nimport { tamaguiConfig } from '../tamagui.config';\n\nexport default function RootLayout() {\n return (\n <SafeAreaProvider>\n <TamaguiProvider config={tamaguiConfig} defaultTheme=\"light\">\n <ThemeProvider loader={false}>\n <Toasts>\n <Stack screenOptions={{ headerShown: false }} />\n </Toasts>\n </ThemeProvider>\n </TamaguiProvider>\n </SafeAreaProvider>\n );\n}\n```",
25
25
  };
@@ -1,5 +1,6 @@
1
1
  import React from 'react';
2
2
  import { Leading } from '../Leading';
3
+ export declare const defaultDuration = 8000;
3
4
  export type ToastAPIOptions = {
4
5
  leading?: Leading;
5
6
  duration?: number;
@@ -1 +1 @@
1
- {"version":3,"file":"ToastContext.d.ts","sourceRoot":"","sources":["../../../src/ui/Toast/ToastContext.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AAErC,MAAM,MAAM,eAAe,GAAG;IAC5B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,MAAM,GAAG,SAAS,CAAC;CAChE,CAAC;AAEF,MAAM,MAAM,QAAQ,GAAG;IACrB,OAAO,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,eAAe,KAAK,IAAI,CAAC;CAC5E,CAAC;AAEF,eAAO,MAAM,YAAY,gCAA6C,CAAC"}
1
+ {"version":3,"file":"ToastContext.d.ts","sourceRoot":"","sources":["../../../src/ui/Toast/ToastContext.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,OAAO,EAAE,MAAM,YAAY,CAAC;AAErC,eAAO,MAAM,eAAe,OAAO,CAAC;AAEpC,MAAM,MAAM,eAAe,GAAG;IAC5B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,OAAO,CAAC,EAAE,SAAS,GAAG,SAAS,GAAG,OAAO,GAAG,MAAM,GAAG,SAAS,CAAC;CAChE,CAAC;AAEF,MAAM,MAAM,QAAQ,GAAG;IACrB,OAAO,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,eAAe,KAAK,IAAI,CAAC;CAC5E,CAAC;AAEF,eAAO,MAAM,YAAY,gCAA6C,CAAC"}
@@ -1,2 +1,3 @@
1
1
  import React from 'react';
2
+ export const defaultDuration = 8000;
2
3
  export const ToastContext = React.createContext(null);
@@ -1,5 +1,6 @@
1
1
  import React from 'react';
2
+ import { type ToastAPI } from './ToastContext';
2
3
  export type ToastsProps = React.PropsWithChildren<object>;
3
4
  export declare function Toasts(props: ToastsProps): React.JSX.Element;
4
- export declare function useToast(): import("./ToastContext").ToastAPI;
5
+ export declare function useToast(): ToastAPI;
5
6
  //# sourceMappingURL=Toasts.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"Toasts.d.ts","sourceRoot":"","sources":["../../../src/ui/Toast/Toasts.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,MAAM,MAAM,WAAW,GAAG,KAAK,CAAC,iBAAiB,CAAC,MAAM,CAAC,CAAC;AAE1D,wBAAgB,MAAM,CAAC,KAAK,EAAE,WAAW,qBAYxC;AAED,wBAAgB,QAAQ,sCAIvB"}
1
+ {"version":3,"file":"Toasts.d.ts","sourceRoot":"","sources":["../../../src/ui/Toast/Toasts.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAiC,KAAK,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAE9E,MAAM,MAAM,WAAW,GAAG,KAAK,CAAC,iBAAiB,CAAC,MAAM,CAAC,CAAC;AAmB1D,wBAAgB,MAAM,CAAC,KAAK,EAAE,WAAW,qBAaxC;AAED,wBAAgB,QAAQ,aAIvB"}
@@ -1,12 +1,16 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- import { ToastProvider, ToastViewport } from '@tamagui/toast';
2
+ import { Toast as TamaguiToast, toast } from '@tamagui/toast';
3
3
  import React from 'react';
4
- import { Toast } from './Toast';
5
- import { ToastBridge } from './ToastBridge';
6
- import { ToastContext } from './ToastContext';
4
+ import { Toast, ToastView } from './Toast';
5
+ import { defaultDuration, ToastContext } from './ToastContext';
6
+ const api = {
7
+ present: (title, message, opts) => {
8
+ toast.custom(id => (_jsx(ToastView, { title: title, message: message, variant: opts?.variant, leading: opts?.leading, onClose: () => toast.dismiss(id) })), { duration: opts?.duration });
9
+ },
10
+ };
7
11
  export function Toasts(props) {
8
12
  const { children } = props;
9
- return (_jsx(ToastProvider, { swipeDirection: "horizontal", children: _jsxs(ToastBridge, { children: [_jsx(Toast, {}), _jsx(ToastViewport, { name: "app-toasts", multipleToasts: true, bottom: 32, left: 0, right: 0 }), children] }) }));
13
+ return (_jsx(TamaguiToast, { position: "bottom-center", duration: defaultDuration, swipeDirection: "horizontal", children: _jsxs(ToastContext.Provider, { value: api, children: [children, _jsx(TamaguiToast.Viewport, { offset: 32, children: _jsx(TamaguiToast.List, { renderItem: item => _jsx(Toast, { ...item }) }) })] }) }));
10
14
  }
11
15
  export function useToast() {
12
16
  const ctx = React.useContext(ToastContext);
@@ -200,7 +200,7 @@ export declare const styleDuTitre: (styles: Styles, grandTitre: boolean, typogra
200
200
  fontVariantNumeric?: import("csstype").Property.FontVariantNumeric | undefined;
201
201
  fontVariantPosition?: import("csstype").Property.FontVariantPosition | undefined;
202
202
  fontVariationSettings?: import("csstype").Property.FontVariationSettings | undefined;
203
- fontWeight?: "100" | "200" | "300" | "400" | "500" | "600" | "800" | "black" | 100 | "medium" | "thin" | "light" | import("csstype").Property.FontWeight | "condensed" | "700" | "900" | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900 | "ultralight" | "regular" | "semibold" | "condensedBold" | "heavy" | undefined;
203
+ fontWeight?: "100" | "200" | "300" | "400" | "500" | "600" | "800" | "black" | "light" | "medium" | "thin" | import("csstype").Property.FontWeight | "700" | "900" | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900 | "ultralight" | "regular" | "semibold" | "condensedBold" | "condensed" | "heavy" | undefined;
204
204
  fontWidth?: import("csstype").Property.FontWidth | undefined;
205
205
  forcedColorAdjust?: import("csstype").Property.ForcedColorAdjust | undefined;
206
206
  gridAutoColumns?: import("csstype").Property.GridAutoColumns<string | number> | undefined;
@@ -1059,7 +1059,7 @@ export declare const styleDuSousTitre: (styles: Styles, grandTitre: boolean, typ
1059
1059
  fontVariantNumeric?: import("csstype").Property.FontVariantNumeric | undefined;
1060
1060
  fontVariantPosition?: import("csstype").Property.FontVariantPosition | undefined;
1061
1061
  fontVariationSettings?: import("csstype").Property.FontVariationSettings | undefined;
1062
- fontWeight?: "100" | "200" | "300" | "400" | "500" | "600" | "800" | "black" | 100 | "medium" | "thin" | "light" | import("csstype").Property.FontWeight | "condensed" | "700" | "900" | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900 | "ultralight" | "regular" | "semibold" | "condensedBold" | "heavy" | undefined;
1062
+ fontWeight?: "100" | "200" | "300" | "400" | "500" | "600" | "800" | "black" | "light" | "medium" | "thin" | import("csstype").Property.FontWeight | "700" | "900" | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900 | "ultralight" | "regular" | "semibold" | "condensedBold" | "condensed" | "heavy" | undefined;
1063
1063
  fontWidth?: import("csstype").Property.FontWidth | undefined;
1064
1064
  forcedColorAdjust?: import("csstype").Property.ForcedColorAdjust | undefined;
1065
1065
  gridAutoColumns?: import("csstype").Property.GridAutoColumns<string | number> | undefined;