@alveole/components 2.0.0-alpha.16 → 2.0.0-alpha.18

package/dist/core/Grid/Grid.stories.sources.js

@@ -1,14 +1,14 @@
 // This file is generated. Do not edit manually.
 // Source: src/core/Grid/Grid.stories.tsx
-export const TwoEqualColumns = () => "export const TwoEqualColumns = () => (\n  <Grid gap={8}>\n    <Grid.Column size={6}>\n      <Col label=\"6 colonnes\" />\n    </Grid.Column>\n    <Grid.Column size={6}>\n      <Col label=\"6 colonnes\" />\n    </Grid.Column>\n  </Grid>\n);";
-export const AsymmetricColumns = () => "export const AsymmetricColumns = () => (\n  <Grid gap={8}>\n    <Grid.Column size={4}>\n      <Col label=\"4 colonnes\" />\n    </Grid.Column>\n    <Grid.Column size={8}>\n      <Col color={colColorAlt} label=\"8 colonnes\" />\n    </Grid.Column>\n  </Grid>\n);";
-export const ThreeColumns = () => "export const ThreeColumns = () => (\n  <Grid gap={8}>\n    <Grid.Column size={4}>\n      <Col label=\"4 colonnes\" />\n    </Grid.Column>\n    <Grid.Column size={4}>\n      <Col color={colColorAlt} label=\"4 colonnes\" />\n    </Grid.Column>\n    <Grid.Column size={4}>\n      <Col label=\"4 colonnes\" />\n    </Grid.Column>\n  </Grid>\n);";
-export const FourColumns = () => "export const FourColumns = () => (\n  <Grid gap={8}>\n    <Grid.Column size={3}>\n      <Col label=\"3\" />\n    </Grid.Column>\n    <Grid.Column size={3}>\n      <Col color={colColorAlt} label=\"3\" />\n    </Grid.Column>\n    <Grid.Column size={3}>\n      <Col label=\"3\" />\n    </Grid.Column>\n    <Grid.Column size={3}>\n      <Col color={colColorAlt} label=\"3\" />\n    </Grid.Column>\n  </Grid>\n);";
-export const FullWidthColumn = () => "export const FullWidthColumn = () => (\n  <Grid gap={8}>\n    <Grid.Column size={12}>\n      <Col label=\"12 colonnes (pleine largeur)\" />\n    </Grid.Column>\n    <Grid.Column size={6}>\n      <Col label=\"6 colonnes\" />\n    </Grid.Column>\n    <Grid.Column size={6}>\n      <Col color={colColorAlt} label=\"6 colonnes\" />\n    </Grid.Column>\n  </Grid>\n);";
-export const ResponsiveColumns = () => "export const ResponsiveColumns = () => (\n  <Grid gap={8}>\n    <Grid.Column size={{ mobile: 12, desktop: 6 }}>\n      <Col label=\"12 mobile / 6 desktop\" />\n    </Grid.Column>\n    <Grid.Column size={{ mobile: 12, desktop: 6 }}>\n      <Col color={colColorAlt} label=\"12 mobile / 6 desktop\" />\n    </Grid.Column>\n  </Grid>\n);";
-export const ResponsiveThreeColumns = () => "export const ResponsiveThreeColumns = () => (\n  <Grid gap={8}>\n    <Grid.Column size={{ mobile: 12, tablet: 6, desktop: 4 }}>\n      <Col label=\"12 mobile / 6 tablet / 4 desktop\" />\n    </Grid.Column>\n    <Grid.Column size={{ mobile: 12, tablet: 6, desktop: 4 }}>\n      <Col color={colColorAlt} label=\"12 mobile / 6 tablet / 4 desktop\" />\n    </Grid.Column>\n    <Grid.Column size={{ mobile: 12, tablet: 12, desktop: 4 }}>\n      <Col label=\"12 mobile / 12 tablet / 4 desktop\" />\n    </Grid.Column>\n  </Grid>\n);";
-export const WithLargeGap = () => "export const WithLargeGap = () => (\n  <Grid gap={24}>\n    <Grid.Column size={4}>\n      <Col label=\"gap 24\" />\n    </Grid.Column>\n    <Grid.Column size={4}>\n      <Col color={colColorAlt} label=\"gap 24\" />\n    </Grid.Column>\n    <Grid.Column size={4}>\n      <Col label=\"gap 24\" />\n    </Grid.Column>\n  </Grid>\n);";
-export const EqualHeightCards = () => "export const EqualHeightCards = () => (\n  <Grid gap={16}>\n    <Grid.Column size={{ mobile: 12, tablet: 6, desktop: 4 }}>\n      <Card>\n        <Card.Header titre=\"Titre court\" sousTitre=\"Une ligne\" />\n        <Card.Actions>\n          <Button variant=\"secondary\" title=\"Voir\" size=\"sm\" />\n        </Card.Actions>\n      </Card>\n    </Grid.Column>\n    <Grid.Column size={{ mobile: 12, tablet: 6, desktop: 4 }}>\n      <Card>\n        <Card.Header\n          titre=\"Un titre bien plus long qui passe sur deux lignes\"\n          sousTitre=\"Un sous-titre lui aussi assez long pour occuper plusieurs lignes dans la carte\"\n        />\n        <Card.Actions>\n          <Button variant=\"secondary\" title=\"Voir\" size=\"sm\" />\n        </Card.Actions>\n      </Card>\n    </Grid.Column>\n    <Grid.Column size={{ mobile: 12, tablet: 6, desktop: 4 }}>\n      <A href=\"/components/Card\">\n        <Card>\n          <Card.Header titre=\"Carte cliquable\" />\n        </Card>\n      </A>\n    </Grid.Column>\n  </Grid>\n);";
+export const TwoEqualColumns = () => "export const TwoEqualColumns = () => (\n  <Grid gap=\"1W\">\n    <Grid.Column size={6}>\n      <Col label=\"6 colonnes\" />\n    </Grid.Column>\n    <Grid.Column size={6}>\n      <Col label=\"6 colonnes\" />\n    </Grid.Column>\n  </Grid>\n);";
+export const AsymmetricColumns = () => "export const AsymmetricColumns = () => (\n  <Grid gap=\"1W\">\n    <Grid.Column size={4}>\n      <Col label=\"4 colonnes\" />\n    </Grid.Column>\n    <Grid.Column size={8}>\n      <Col color={colColorAlt} label=\"8 colonnes\" />\n    </Grid.Column>\n  </Grid>\n);";
+export const ThreeColumns = () => "export const ThreeColumns = () => (\n  <Grid gap=\"1W\">\n    <Grid.Column size={4}>\n      <Col label=\"4 colonnes\" />\n    </Grid.Column>\n    <Grid.Column size={4}>\n      <Col color={colColorAlt} label=\"4 colonnes\" />\n    </Grid.Column>\n    <Grid.Column size={4}>\n      <Col label=\"4 colonnes\" />\n    </Grid.Column>\n  </Grid>\n);";
+export const FourColumns = () => "export const FourColumns = () => (\n  <Grid gap=\"1W\">\n    <Grid.Column size={3}>\n      <Col label=\"3\" />\n    </Grid.Column>\n    <Grid.Column size={3}>\n      <Col color={colColorAlt} label=\"3\" />\n    </Grid.Column>\n    <Grid.Column size={3}>\n      <Col label=\"3\" />\n    </Grid.Column>\n    <Grid.Column size={3}>\n      <Col color={colColorAlt} label=\"3\" />\n    </Grid.Column>\n  </Grid>\n);";
+export const FullWidthColumn = () => "export const FullWidthColumn = () => (\n  <Grid gap=\"1W\">\n    <Grid.Column size={12}>\n      <Col label=\"12 colonnes (pleine largeur)\" />\n    </Grid.Column>\n    <Grid.Column size={6}>\n      <Col label=\"6 colonnes\" />\n    </Grid.Column>\n    <Grid.Column size={6}>\n      <Col color={colColorAlt} label=\"6 colonnes\" />\n    </Grid.Column>\n  </Grid>\n);";
+export const ResponsiveColumns = () => "export const ResponsiveColumns = () => (\n  <Grid gap=\"1W\">\n    <Grid.Column size={{ mobile: 12, desktop: 6 }}>\n      <Col label=\"12 mobile / 6 desktop\" />\n    </Grid.Column>\n    <Grid.Column size={{ mobile: 12, desktop: 6 }}>\n      <Col color={colColorAlt} label=\"12 mobile / 6 desktop\" />\n    </Grid.Column>\n  </Grid>\n);";
+export const ResponsiveThreeColumns = () => "export const ResponsiveThreeColumns = () => (\n  <Grid gap=\"1W\">\n    <Grid.Column size={{ mobile: 12, tablet: 6, desktop: 4 }}>\n      <Col label=\"12 mobile / 6 tablet / 4 desktop\" />\n    </Grid.Column>\n    <Grid.Column size={{ mobile: 12, tablet: 6, desktop: 4 }}>\n      <Col color={colColorAlt} label=\"12 mobile / 6 tablet / 4 desktop\" />\n    </Grid.Column>\n    <Grid.Column size={{ mobile: 12, tablet: 12, desktop: 4 }}>\n      <Col label=\"12 mobile / 12 tablet / 4 desktop\" />\n    </Grid.Column>\n  </Grid>\n);";
+export const WithLargeGap = () => "export const WithLargeGap = () => (\n  <Grid gap=\"3W\">\n    <Grid.Column size={4}>\n      <Col label=\"gap 24\" />\n    </Grid.Column>\n    <Grid.Column size={4}>\n      <Col color={colColorAlt} label=\"gap 24\" />\n    </Grid.Column>\n    <Grid.Column size={4}>\n      <Col label=\"gap 24\" />\n    </Grid.Column>\n  </Grid>\n);";
+export const EqualHeightCards = () => "export const EqualHeightCards = () => (\n  <Grid gap=\"2W\">\n    <Grid.Column size={{ mobile: 12, tablet: 6, desktop: 4 }}>\n      <Card>\n        <Card.Header titre=\"Titre court\" sousTitre=\"Une ligne\" />\n        <Card.Actions>\n          <Button variant=\"secondary\" title=\"Voir\" size=\"sm\" />\n        </Card.Actions>\n      </Card>\n    </Grid.Column>\n    <Grid.Column size={{ mobile: 12, tablet: 6, desktop: 4 }}>\n      <Card>\n        <Card.Header\n          titre=\"Un titre bien plus long qui passe sur deux lignes\"\n          sousTitre=\"Un sous-titre lui aussi assez long pour occuper plusieurs lignes dans la carte\"\n        />\n        <Card.Actions>\n          <Button variant=\"secondary\" title=\"Voir\" size=\"sm\" />\n        </Card.Actions>\n      </Card>\n    </Grid.Column>\n    <Grid.Column size={{ mobile: 12, tablet: 6, desktop: 4 }}>\n      <A href=\"/components/Card\">\n        <Card>\n          <Card.Header titre=\"Carte cliquable\" />\n        </Card>\n      </A>\n    </Grid.Column>\n  </Grid>\n);";
 export const storySources = {
     TwoEqualColumns,
     AsymmetricColumns,

package/dist/core/Highlight/Highlight.stories.d.ts

@@ -10,7 +10,7 @@ declare const _default: {
             width: "100%";
             flexGrow: number;
             flexShrink: number;
-            backgroundColor: string;
+            backgroundColor: import("@alveole/theme").ThemeColor;
         };
         highlightContainerStandalone: {
             borderRadius: import("@alveole/theme").Radius;
@@ -22,13 +22,13 @@ declare const _default: {
         highlight: {
             borderRadius: import("@alveole/theme").Radius;
             borderWidth: number;
-            borderColor: string;
+            borderColor: import("@alveole/theme").ThemeColor;
             overflow: "scroll";
             padding: import("@alveole/theme").Spacing;
             minWidth: "100%";
             flexGrow: number;
             flexShrink: number;
-            backgroundColor: string;
+            backgroundColor: import("@alveole/theme").ThemeColor;
         };
         highlightEmbedded: {
             overflow: "scroll";
@@ -36,7 +36,7 @@ declare const _default: {
             minWidth: "100%";
             flexGrow: number;
             flexShrink: number;
-            backgroundColor: string;
+            backgroundColor: import("@alveole/theme").ThemeColor;
         };
     };
 };

package/dist/core/Highlight/Highlight.styles.d.ts

@@ -3,7 +3,7 @@ export declare const useStyles: () => {
         width: "100%";
         flexGrow: number;
         flexShrink: number;
-        backgroundColor: string;
+        backgroundColor: import("@alveole/theme").ThemeColor;
     };
     highlightContainerStandalone: {
         borderRadius: import("@alveole/theme").Radius;
@@ -15,13 +15,13 @@ export declare const useStyles: () => {
     highlight: {
         borderRadius: import("@alveole/theme").Radius;
         borderWidth: number;
-        borderColor: string;
+        borderColor: import("@alveole/theme").ThemeColor;
         overflow: "scroll";
         padding: import("@alveole/theme").Spacing;
         minWidth: "100%";
         flexGrow: number;
         flexShrink: number;
-        backgroundColor: string;
+        backgroundColor: import("@alveole/theme").ThemeColor;
     };
     highlightEmbedded: {
         overflow: "scroll";
@@ -29,7 +29,7 @@ export declare const useStyles: () => {
         minWidth: "100%";
         flexGrow: number;
         flexShrink: number;
-        backgroundColor: string;
+        backgroundColor: import("@alveole/theme").ThemeColor;
     };
 };
 //# sourceMappingURL=Highlight.styles.d.ts.map

package/dist/core/Highlight/Highlight.theme.d.ts

@@ -7,9 +7,7 @@ export declare const BASE_STYLE_KEY = "base";
 export declare const styleNatif: (style?: CSSProperties) => TextStyle;
 export declare const feuilleDeColoration: (syntaxStyle: Record<string, CSSProperties>, fond: string) => NativeSyntaxStyle;
 /** Le texte de base : la couleur du theme, puis la chasse fixe. */
-export declare const styleDuTexteDeBase: (feuille: NativeSyntaxStyle) => TextStyle | {
-    readonly fontFamily: "ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, 'Liberation Mono', monospace";
-};
+export declare const styleDuTexteDeBase: (feuille: NativeSyntaxStyle) => TextStyle;
 /**
  * La surface du bloc. Le theme de coloration ne fournit que les couleurs de jetons : la surface
  * vient du design system, posee apres la base du theme, et le style de l'appelant en dernier.

package/dist/core/Highlight/Highlight.theme.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Highlight.theme.d.ts","sourceRoot":"","sources":["../../../src/core/Highlight/Highlight.theme.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AACtC,OAAO,EAAc,SAAS,EAAE,MAAM,cAAc,CAAC;AACrD,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAE/C,KAAK,MAAM,GAAG,UAAU,CAAC,OAAO,SAAS,CAAC,CAAC;AAE3C,MAAM,MAAM,iBAAiB,GAAG,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC;AAE1D,eAAO,MAAM,cAAc,SAAS,CAAC;AAkCrC,eAAO,MAAM,UAAU,GAAI,QAAO,aAAkB,KAAG,SAUtD,CAAC;AAkCF,eAAO,MAAM,mBAAmB,GAAI,aAAa,MAAM,CAAC,MAAM,EAAE,aAAa,CAAC,EAAE,MAAM,MAAM,KAAG,iBAgB9F,CAAC;AAEF,mEAAmE;AACnE,eAAO,MAAM,kBAAkB,GAAI,SAAS,iBAAiB;;CAC4C,CAAC;AAE1G;;;;;GAKG;AACH,eAAO,MAAM,gBAAgB,GAC3B,QAAQ,MAAM,EACd,SAAS,iBAAiB,EAC1B,0BAA0B;IAAE,OAAO,EAAE,YAAY,GAAG,UAAU,CAAC;IAAC,WAAW,EAAE,SAAS,CAAA;CAAE,cAOtF,CAAC"}
+{"version":3,"file":"Highlight.theme.d.ts","sourceRoot":"","sources":["../../../src/core/Highlight/Highlight.theme.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AACtC,OAAO,EAAc,SAAS,EAAE,MAAM,cAAc,CAAC;AACrD,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAE/C,KAAK,MAAM,GAAG,UAAU,CAAC,OAAO,SAAS,CAAC,CAAC;AAE3C,MAAM,MAAM,iBAAiB,GAAG,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC;AAE1D,eAAO,MAAM,cAAc,SAAS,CAAC;AAkCrC,eAAO,MAAM,UAAU,GAAI,QAAO,aAAkB,KAAG,SAMrD,CAAC;AAkCH,eAAO,MAAM,mBAAmB,GAAI,aAAa,MAAM,CAAC,MAAM,EAAE,aAAa,CAAC,EAAE,MAAM,MAAM,KAAG,iBAgB9F,CAAC;AAEF,mEAAmE;AACnE,eAAO,MAAM,kBAAkB,GAAI,SAAS,iBAAiB,KAAG,SAC+C,CAAC;AAEhH;;;;;GAKG;AACH,eAAO,MAAM,gBAAgB,GAC3B,QAAQ,MAAM,EACd,SAAS,iBAAiB,EAC1B,0BAA0B;IAAE,OAAO,EAAE,YAAY,GAAG,UAAU,CAAC;IAAC,WAAW,EAAE,SAAS,CAAA;CAAE,KACvF,SAMO,CAAC"}

package/dist/core/Highlight/Highlight.theme.js

@@ -27,20 +27,13 @@ const estGraisseNative = accepteSeulement([
     '800',
     '900',
 ]);
-export const styleNatif = (style = {}) => {
-    const nativeStyle = {};
-    if (typeof style.color === 'string')
-        nativeStyle.color = style.color;
-    if (typeof style.background === 'string')
-        nativeStyle.backgroundColor = style.background;
-    if (typeof style.backgroundColor === 'string')
-        nativeStyle.backgroundColor = style.backgroundColor;
-    if (estGraisseNative(style.fontWeight))
-        nativeStyle.fontWeight = style.fontWeight;
-    if (estStyleDePoliceNatif(style.fontStyle))
-        nativeStyle.fontStyle = style.fontStyle;
-    return nativeStyle;
-};
+export const styleNatif = (style = {}) => ({
+    ...(typeof style.color === 'string' && { color: style.color }),
+    ...(typeof style.background === 'string' && { backgroundColor: style.background }),
+    ...(typeof style.backgroundColor === 'string' && { backgroundColor: style.backgroundColor }),
+    ...(estGraisseNative(style.fontWeight) && { fontWeight: style.fontWeight }),
+    ...(estStyleDePoliceNatif(style.fontStyle) && { fontStyle: style.fontStyle }),
+});
 const getSyntaxStyleKeys = (selector) => {
     if (selector.includes('pre[') || selector.includes('code[')) {
         return [BASE_STYLE_KEY];
@@ -81,7 +74,7 @@ export const feuilleDeColoration = (syntaxStyle, fond) => {
     }, {});
 };
 /** Le texte de base : la couleur du theme, puis la chasse fixe. */
-export const styleDuTexteDeBase = (feuille) => StyleSheet.flatten([{ color: feuille[BASE_STYLE_KEY]?.color }, feuille[BASE_STYLE_KEY], MonospaceFont]);
+export const styleDuTexteDeBase = (feuille) => StyleSheet.flatten([{ color: feuille[BASE_STYLE_KEY]?.color }, feuille[BASE_STYLE_KEY], MonospaceFont]) ?? {};
 /**
  * La surface du bloc. Le theme de coloration ne fournit que les couleurs de jetons : la surface
  * vient du design system, posee apres la base du theme, et le style de l'appelant en dernier.
@@ -93,4 +86,4 @@ export const styleDeLaSurface = (styles, feuille, { variant, styleFourni }) => S
     variant === 'embedded' ? styles.highlightEmbedded : styles.highlight,
     { overflow: 'visible' },
     styleFourni,
-]);
+]) ?? {};

package/dist/core/Map/Map.js

@@ -2,5 +2,5 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { Box } from '../Box';
 import { Typography } from '../Typography';
 export const Map = (_) => {
-    return (_jsx(Box, { p: '075', children: _jsx(Typography, { textAlign: 'center', children: "La carte n\u2019est pas disponible sur le mobile" }) }));
+    return (_jsx(Box, { p: "3V", children: _jsx(Typography, { textAlign: 'center', children: "La carte n\u2019est pas disponible sur le mobile" }) }));
 };

package/dist/core/MarkdownDescription/MarkdownDescription.js

@@ -32,5 +32,5 @@ export const MarkdownDescription = ({ children, taille = 'MD', color: textColor
         linkColor,
     };
     const components = Platform.OS === 'web' ? createMarkdownComponents(styles) : createNativeMarkdownComponents(styles);
-    return (_jsx(Box, { tag: "markdown-description", display: "flex", gap: 8, style: { alignSelf: 'stretch' }, children: _jsx(ReactMarkdown, { remarkPlugins: [remarkGfm, replierLesCoupuresDeLigne], rehypePlugins: Platform.OS === 'web' ? [] : [preparerMarkdownNatif], skipHtml: Platform.OS !== 'web', components: components, children: children }) }));
+    return (_jsx(Box, { tag: "markdown-description", display: "flex", gap: "1W", style: { alignSelf: 'stretch' }, children: _jsx(ReactMarkdown, { remarkPlugins: [remarkGfm, replierLesCoupuresDeLigne], rehypePlugins: Platform.OS === 'web' ? [] : [preparerMarkdownNatif], skipHtml: Platform.OS !== 'web', components: components, children: children }) }));
 };

package/dist/core/MarkdownDescription/markdownComponents.d.ts

@@ -1,4 +1,4 @@
-import { Theme } from '@alveole/theme';
+import { Theme, ThemeColor } from '@alveole/theme';
 import React from 'react';
 import type { Components } from 'react-markdown';
 import { TextStyle as RNTextStyle } from 'react-native';
@@ -16,8 +16,8 @@ export type MarkdownComponentsStyles = {
     titres: Theme['text']['Titres'];
     /** Couleur des titres : `textColor` s'il est fourni, sinon `title-grey`. */
     titleColor: string;
-    borderColor: string;
-    headerBg: string;
+    borderColor: ThemeColor;
+    headerBg: ThemeColor;
     linkColor: string;
 };
 type TextComponentStyles = Pick<MarkdownComponentsStyles, 'bodyStyle' | 'boldStyle' | 'textColor'>;

package/dist/core/MarkdownDescription/markdownComponents.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"markdownComponents.d.ts","sourceRoot":"","sources":["../../../src/core/MarkdownDescription/markdownComponents.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAmB,KAAK,EAAE,MAAM,gBAAgB,CAAC;AACxD,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AACjD,OAAO,EAAE,SAAS,IAAI,WAAW,EAAE,MAAM,cAAc,CAAC;AAIxD,OAAO,EAAa,cAAc,EAAE,MAAM,cAAc,CAAC;AAczD,eAAO,MAAM,eAAe,GAAI,YAAY,MAAM,KAAG,cAAc,CAAC,UAAU,CAG7E,CAAC;AAEF,KAAK,WAAW,GAAG;IAAE,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAAE,CAAC;AAClD,KAAK,SAAS,GAAG,IAAI,CAAC,WAAW,EAAE,UAAU,GAAG,YAAY,GAAG,YAAY,GAAG,YAAY,GAAG,eAAe,CAAC,CAAC;AAE9G,MAAM,MAAM,wBAAwB,GAAG;IACrC,SAAS,EAAE,SAAS,CAAC;IACrB,SAAS,EAAE,SAAS,CAAC;IACrB,qFAAqF;IACrF,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC,QAAQ,CAAC,CAAC;IAChC,4EAA4E;IAC5E,UAAU,EAAE,MAAM,CAAC;IACnB,WAAW,EAAE,MAAM,CAAC;IACpB,QAAQ,EAAE,MAAM,CAAC;IACjB,SAAS,EAAE,MAAM,CAAC;CACnB,CAAC;AAEF,KAAK,mBAAmB,GAAG,IAAI,CAAC,wBAAwB,EAAE,WAAW,GAAG,WAAW,GAAG,WAAW,CAAC,CAAC;AAEnG,eAAO,MAAM,oBAAoB,GAAI,qCAAqC,mBAAmB;yBACtE,WAAW;8BAKN,WAAW;0BAKf,WAAW;CAKjC,CAAC;AAGH,eAAO,MAAM,uBAAuB,GAAI,QAAQ,KAAK,CAAC,MAAM,CAAC,CAAC,QAAQ,CAAC,EAAE,YAAY,MAAM;0BACnE,WAAW;0BAKX,WAAW;0BAKX,WAAW;0BAKX,WAAW;CAKjC,CAAC;AA+HH,eAAO,MAAM,wBAAwB,GAAI,QAAQ,wBAAwB,KAAG,UAQ1E,CAAC"}
+{"version":3,"file":"markdownComponents.d.ts","sourceRoot":"","sources":["../../../src/core/MarkdownDescription/markdownComponents.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA6B,KAAK,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAC9E,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AACjD,OAAO,EAAE,SAAS,IAAI,WAAW,EAAE,MAAM,cAAc,CAAC;AAIxD,OAAO,EAAa,cAAc,EAAE,MAAM,cAAc,CAAC;AAczD,eAAO,MAAM,eAAe,GAAI,YAAY,MAAM,KAAG,cAAc,CAAC,UAAU,CAG7E,CAAC;AAEF,KAAK,WAAW,GAAG;IAAE,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAAE,CAAC;AAClD,KAAK,SAAS,GAAG,IAAI,CAAC,WAAW,EAAE,UAAU,GAAG,YAAY,GAAG,YAAY,GAAG,YAAY,GAAG,eAAe,CAAC,CAAC;AAE9G,MAAM,MAAM,wBAAwB,GAAG;IACrC,SAAS,EAAE,SAAS,CAAC;IACrB,SAAS,EAAE,SAAS,CAAC;IACrB,qFAAqF;IACrF,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC,QAAQ,CAAC,CAAC;IAChC,4EAA4E;IAC5E,UAAU,EAAE,MAAM,CAAC;IACnB,WAAW,EAAE,UAAU,CAAC;IACxB,QAAQ,EAAE,UAAU,CAAC;IACrB,SAAS,EAAE,MAAM,CAAC;CACnB,CAAC;AAEF,KAAK,mBAAmB,GAAG,IAAI,CAAC,wBAAwB,EAAE,WAAW,GAAG,WAAW,GAAG,WAAW,CAAC,CAAC;AAEnG,eAAO,MAAM,oBAAoB,GAAI,qCAAqC,mBAAmB;yBACtE,WAAW;8BAKN,WAAW;0BAKf,WAAW;CAKjC,CAAC;AAGH,eAAO,MAAM,uBAAuB,GAAI,QAAQ,KAAK,CAAC,MAAM,CAAC,CAAC,QAAQ,CAAC,EAAE,YAAY,MAAM;0BACnE,WAAW;0BAKX,WAAW;0BAKX,WAAW;0BAKX,WAAW;CAKjC,CAAC;AA+HH,eAAO,MAAM,wBAAwB,GAAI,QAAQ,wBAAwB,KAAG,UAQ1E,CAAC"}

package/dist/core/MarkdownDescription/markdownComponents.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { FOCUS_ATTRIBUTE } from '@alveole/theme';
+import { FOCUS_ATTRIBUTE, Spacings } from '@alveole/theme';
 import { AnchorHeading } from '../AnchorHeading';
 import { Box } from '../Box';
 import { Code } from '../Code';
@@ -32,9 +32,9 @@ export const createHeadingComponents = (titres, titleColor) => ({
     h4: ({ children: c }) => (_jsx(AnchorHeading, { as: "h4", style: titres['H6 - XXS'], color: titleColor, children: c })),
 });
 const createListComponents = (bodyStyle) => ({
-    ul: ({ children: c }) => (_jsx(Box, { display: "flex", gap: 4, children: c })),
-    ol: ({ children: c }) => (_jsx(Box, { display: "flex", gap: 4, children: c })),
-    li: ({ children: c }) => (_jsxs(Box, { display: "flex", flexDirection: "row", gap: 8, style: { alignItems: 'flex-start' }, children: [_jsx(Typography, { style: bodyStyle, children: '•' }), _jsx(Typography, { style: [bodyStyle, { flex: 1 }], children: c })] })),
+    ul: ({ children: c }) => (_jsx(Box, { display: "flex", gap: "1V", children: c })),
+    ol: ({ children: c }) => (_jsx(Box, { display: "flex", gap: "1V", children: c })),
+    li: ({ children: c }) => (_jsxs(Box, { display: "flex", flexDirection: "row", gap: "1W", style: { alignItems: 'flex-start' }, children: [_jsx(Typography, { style: bodyStyle, children: '•' }), _jsx(Typography, { style: [bodyStyle, { flex: 1 }], children: c })] })),
 });
 const createLinkComponents = ({ linkColor }) => ({
     a: ({ href, children: c }) => (_jsx(Typography, { tag: "a", color: linkColor, textDecorationLine: soulignementDuLien, href, [FOCUS_ATTRIBUTE]: 'ring', children: c })),
@@ -43,7 +43,7 @@ const createBlockComponents = (borderColor) => ({
     pre: ({ children: c }) => _jsx(Box, { display: "flex", children: c }),
     // `tag="blockquote"` pose un vrai `<blockquote>` DOM, qui garde la marge par
     // défaut du user-agent (`margin: 1em 40px`) tant qu'on ne la remet pas à zéro.
-    blockquote: ({ children: c }) => (_jsx(Box, { tag: "blockquote", display: "flex", pl: 12, style: { margin: 0, borderLeftWidth: 2, borderLeftColor: borderColor }, children: c })),
+    blockquote: ({ children: c }) => (_jsx(Box, { tag: "blockquote", display: "flex", pl: "3V", style: { margin: Spacings['0V'], borderLeftWidth: 2, borderLeftColor: borderColor }, children: c })),
 });
 const createCodeComponents = () => ({
     // react-markdown ne passe plus de prop `inline` depuis la v9, et un bloc sans
@@ -59,7 +59,7 @@ const createCodeComponents = () => ({
     },
 });
 const createTableComponents = ({ bodyStyle, boldStyle, borderColor, headerBg }) => ({
-    table: ({ children: c }) => (_jsx(Box, { tag: "div", borderWidth: 1, borderColor: borderColor, borderRadius: 8, overflow: "hidden", children: _jsx(Box, { tag: "table", style: { display: 'table', borderCollapse: 'collapse', width: '100%' }, children: c }) })),
+    table: ({ children: c }) => (_jsx(Box, { tag: "div", borderWidth: 1, borderColor: borderColor, borderRadius: "md", overflow: "hidden", children: _jsx(Box, { tag: "table", style: { display: 'table', borderCollapse: 'collapse', width: '100%' }, children: c }) })),
     thead: ({ children: c }) => (_jsx(Box, { tag: "thead", style: { display: 'table-header-group' }, children: c })),
     tbody: ({ children: c }) => (_jsx(Box, { tag: "tbody", style: { display: 'table-row-group' }, children: c })),
     tr: ({ children: c }) => (_jsx(Box, { tag: "tr", style: { display: 'table-row' }, children: c })),
@@ -68,8 +68,8 @@ const createTableComponents = ({ bodyStyle, boldStyle, borderColor, headerBg })
     // sérialise les props de la vue, dont le contexte du thème, circulaire, ce qui
     // remplace l'avertissement par un « Converting circular structure to JSON » qui
     // fait planter le rendu.
-    th: ({ children: c }) => (_jsx(Box, { tag: "th", borderWidth: 1, borderColor: borderColor, pt: 8, pb: 8, pl: 12, pr: 12, style: { display: 'table-cell', textAlign: 'left', backgroundColor: headerBg }, children: _jsx(Typography, { style: boldStyle, children: c }) })),
-    td: ({ children: c }) => (_jsx(Box, { tag: "td", borderWidth: 1, borderColor: borderColor, pt: 8, pb: 8, pl: 12, pr: 12, style: { display: 'table-cell' }, children: _jsx(Typography, { style: bodyStyle, children: c }) })),
+    th: ({ children: c }) => (_jsx(Box, { tag: "th", borderWidth: 1, borderColor: borderColor, pt: "1W", pb: "1W", pl: "3V", pr: "3V", style: { display: 'table-cell', textAlign: 'left', backgroundColor: headerBg }, children: _jsx(Typography, { style: boldStyle, children: c }) })),
+    td: ({ children: c }) => (_jsx(Box, { tag: "td", borderWidth: 1, borderColor: borderColor, pt: "1W", pb: "1W", pl: "3V", pr: "3V", style: { display: 'table-cell' }, children: _jsx(Typography, { style: bodyStyle, children: c }) })),
 });
 export const createMarkdownComponents = (styles) => ({
     ...createTextComponents(styles),

package/dist/core/MarkdownDescription/markdownNatif.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"markdownNatif.d.ts","sourceRoot":"","sources":["../../../src/core/MarkdownDescription/markdownNatif.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAIjD,OAAO,EAA4B,wBAAwB,EAAE,MAAM,sBAAsB,CAAC;AAE1F,KAAK,KAAK,GAAG;IACX,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,GAAG,OAAO,CAAC,CAAC;IACvD,QAAQ,CAAC,EAAE,KAAK,EAAE,CAAC;CACpB,CAAC;AAwCF,eAAO,MAAM,qBAAqB,gBAjBT,KAAK,KAAG,IAiBkB,CAAC;AAuBpD,eAAO,MAAM,8BAA8B,GAAI,QAAQ,wBAAwB,KAAG,UAwChF,CAAC"}
+{"version":3,"file":"markdownNatif.d.ts","sourceRoot":"","sources":["../../../src/core/MarkdownDescription/markdownNatif.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAIjD,OAAO,EAA4B,wBAAwB,EAAE,MAAM,sBAAsB,CAAC;AAE1F,KAAK,KAAK,GAAG;IACX,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,GAAG,OAAO,CAAC,CAAC;IACvD,QAAQ,CAAC,EAAE,KAAK,EAAE,CAAC;CACpB,CAAC;AAwCF,eAAO,MAAM,qBAAqB,gBAjBT,KAAK,KAAG,IAiBkB,CAAC;AAuBpD,eAAO,MAAM,8BAA8B,GAAI,QAAQ,wBAAwB,KAAG,UAwChF,CAAC"}

package/dist/core/MarkdownDescription/markdownNatif.js

@@ -1,4 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Spacings } from '@alveole/theme';
 import { Linking } from 'react-native';
 import { Box } from '../Box';
 import { Typography } from '../Typography';
@@ -50,20 +51,20 @@ const tableauxNatifs = ({ bodyStyle, boldStyle, borderColor, headerBg }) => ({
     thead: ({ children }) => _jsx(Box, { style: { backgroundColor: headerBg }, children: children }),
     tbody: ({ children }) => _jsx(Box, { children: children }),
     tr: ({ children }) => _jsx(Box, { style: { flexDirection: 'row' }, children: children }),
-    th: ({ children }) => (_jsx(Box, { p: 8, borderWidth: 1, borderColor: borderColor, style: { flex: 1, minWidth: 0 }, children: _jsx(Typography, { style: boldStyle, children: children }) })),
-    td: ({ children }) => (_jsx(Box, { p: 8, borderWidth: 1, borderColor: borderColor, style: { flex: 1, minWidth: 0 }, children: _jsx(Typography, { style: bodyStyle, children: children }) })),
+    th: ({ children }) => (_jsx(Box, { p: "1W", borderWidth: 1, borderColor: borderColor, style: { flex: 1, minWidth: 0 }, children: _jsx(Typography, { style: boldStyle, children: children }) })),
+    td: ({ children }) => (_jsx(Box, { p: "1W", borderWidth: 1, borderColor: borderColor, style: { flex: 1, minWidth: 0 }, children: _jsx(Typography, { style: bodyStyle, children: children }) })),
 });
 export const createNativeMarkdownComponents = (styles) => ({
     ...createMarkdownComponents(styles),
     ...tableauxNatifs(styles),
-    section: ({ children }) => _jsx(Box, { style: { gap: 8 }, children: children }),
+    section: ({ children }) => _jsx(Box, { style: { gap: Spacings['1W'] }, children: children }),
     sup: ({ children }) => _jsx(Typography, { style: styles.bodyStyle, children: children }),
     h5: ({ children }) => (_jsx(Typography, { style: styles.titres['H6 - XXS'], color: styles.titleColor, children: children })),
     h6: ({ children }) => (_jsx(Typography, { style: styles.titres['H6 - XXS'], color: styles.titleColor, children: children })),
     a: ({ href, children }) => (_jsx(Typography, { style: styles.bodyStyle, color: styles.linkColor, textDecorationLine: "underline", accessibilityRole: "link", onPress: href ? () => void Linking.openURL(href) : undefined, children: children })),
     li: ({ children, node }) => {
         const marque = node?.properties?.['data-marker'];
-        return (_jsxs(Box, { style: { flexDirection: 'row', gap: 8, alignItems: 'flex-start' }, children: [_jsx(Typography, { style: styles.bodyStyle, children: typeof marque === 'string' ? marque : '•' }), _jsx(Box, { style: { flex: 1, gap: 4 }, children: children })] }));
+        return (_jsxs(Box, { style: { flexDirection: 'row', gap: Spacings['1W'], alignItems: 'flex-start' }, children: [_jsx(Typography, { style: styles.bodyStyle, children: typeof marque === 'string' ? marque : '•' }), _jsx(Box, { style: { flex: 1, gap: Spacings['1V'] }, children: children })] }));
     },
     br: () => _jsx(Typography, { children: '\n' }),
     hr: () => _jsx(Box, { style: { borderTopWidth: 1, borderColor: styles.borderColor } }),

package/dist/core/Page/PageContent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PageContent.d.ts","sourceRoot":"","sources":["../../../src/core/Page/PageContent.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAMzC,MAAM,MAAM,gBAAgB,GAAG,SAAS,CAAC;AAEzC,eAAO,MAAM,WAAW,GAAI,OAAO,gBAAgB,sBAiElD,CAAC"}
+{"version":3,"file":"PageContent.d.ts","sourceRoot":"","sources":["../../../src/core/Page/PageContent.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAK1B,OAAO,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAMzC,MAAM,MAAM,gBAAgB,GAAG,SAAS,CAAC;AAEzC,eAAO,MAAM,WAAW,GAAI,OAAO,gBAAgB,sBAmElD,CAAC"}

package/dist/core/Page/PageContent.js

@@ -22,7 +22,7 @@ export const PageContent = (props) => {
         setIsScrolled(scrolled);
         onScrollChange?.(scrollY);
     }, [onScrollChange]);
-    const renderPageWithSidebar = (children) => (_jsxs(Box, { style: styles.sidebarContainer, overflow: mobileOrTablet && sideBarController?.open ? 'hidden' : undefined, children: [sidebar, _jsxs(Box, { flex: 1, children: [mobileOrTablet && (_jsx(Box, { tag: "mobile-menu", style: statusBar?.backgroundColor ? { backgroundColor: statusBar.backgroundColor } : undefined, children: _jsx(Box, { pt: Platform.OS === 'android' ? top : 0, children: renderToolbar?.({ isScrolled }) }) })), _jsx(Box, { flex: 1, children: children })] })] }));
+    const renderPageWithSidebar = (children) => (_jsxs(Box, { style: styles.sidebarContainer, overflow: mobileOrTablet && sideBarController?.open ? 'hidden' : undefined, children: [sidebar, _jsxs(Box, { flex: 1, children: [mobileOrTablet && (_jsx(Box, { tag: "mobile-menu", style: statusBar?.backgroundColor ? { backgroundColor: statusBar.backgroundColor } : undefined, children: _jsx(Box, { style: { paddingTop: Platform.OS === 'android' ? top : undefined }, children: renderToolbar?.({ isScrolled }) }) })), _jsx(Box, { flex: 1, children: children })] })] }));
     const isScrollable = React.useMemo(() => scrollable === true ||
         (scrollable === 'desktop-only' && isVariant('desktop')) ||
         (scrollable === 'mobile-only' && mobileOrTablet), [isVariant, mobileOrTablet, scrollable]);

package/dist/core/Page/PageContentScrollable.d.ts

@@ -8,24 +8,24 @@ export type PageContentScrollableProps = PageProps & {
     onEndReachedThreshold?: number;
     onScrollChange?: (scrollY: number) => void;
 };
-export declare const PageContentScrollable: React.ForwardRefExoticComponent<Omit<import("tamagui").ViewProps, "flex" | "backgroundColor" | "borderColor" | "borderRadius" | "borderWidth" | "opacity" | "display" | "flexDirection" | "flexWrap" | "overflow" | "gap" | "style" | "justify" | keyof import("../..").SizeStyle | "p" | "pl" | "pr" | "pt" | "pb" | "m" | "ml" | "mr" | "mt" | "mb" | "tag"> & Omit<import("@tamagui/core").RNTamaguiViewNonStyleProps, "tag"> & Pick<import("tamagui").ViewProps, "flex" | "opacity" | "display" | "flexDirection" | "flexWrap" | "overflow"> & {
+export declare const PageContentScrollable: React.ForwardRefExoticComponent<Omit<import("tamagui").ViewProps, "flex" | "display" | "overflow" | "backgroundColor" | "borderColor" | "borderRadius" | "borderWidth" | "opacity" | "flexDirection" | "flexWrap" | "gap" | "style" | "justify" | keyof import("../..").SizeStyle | "p" | "pl" | "pr" | "pt" | "pb" | "m" | "ml" | "mr" | "mt" | "mb" | "tag"> & Omit<import("@tamagui/core").RNTamaguiViewNonStyleProps, "tag"> & Pick<import("tamagui").ViewProps, "flex" | "display" | "overflow" | "opacity" | "flexDirection" | "flexWrap"> & {
     justify?: import("tamagui").ViewProps["justifyContent"];
 } & import("../..").SizeStyle & {
-    p?: number | import("@alveole/theme").SpacingKey;
-    pl?: number | import("@alveole/theme").SpacingKey;
-    pr?: number | import("@alveole/theme").SpacingKey;
-    pt?: number | import("@alveole/theme").SpacingKey;
-    pb?: number | import("@alveole/theme").SpacingKey;
-    m?: number | `${string}%` | import("@alveole/theme").SpacingKey | "auto";
-    ml?: number | `${string}%` | import("@alveole/theme").SpacingKey | "auto";
-    mr?: number | `${string}%` | import("@alveole/theme").SpacingKey | "auto";
-    mt?: number | `${string}%` | import("@alveole/theme").SpacingKey | "auto";
-    mb?: number | `${string}%` | import("@alveole/theme").SpacingKey | "auto";
-    backgroundColor?: import("tamagui").ViewProps["backgroundColor"];
+    p?: "0V" | "0,5V" | "1V" | "1,5V" | "1W" | "3V" | "2W" | "3W" | "4W" | "5W" | "6W" | "8W" | "12W" | "15W";
+    pl?: "0V" | "0,5V" | "1V" | "1,5V" | "1W" | "3V" | "2W" | "3W" | "4W" | "5W" | "6W" | "8W" | "12W" | "15W";
+    pr?: "0V" | "0,5V" | "1V" | "1,5V" | "1W" | "3V" | "2W" | "3W" | "4W" | "5W" | "6W" | "8W" | "12W" | "15W";
+    pt?: "0V" | "0,5V" | "1V" | "1,5V" | "1W" | "3V" | "2W" | "3W" | "4W" | "5W" | "6W" | "8W" | "12W" | "15W";
+    pb?: "0V" | "0,5V" | "1V" | "1,5V" | "1W" | "3V" | "2W" | "3W" | "4W" | "5W" | "6W" | "8W" | "12W" | "15W";
+    m?: `${string}%` | ("0V" | "0,5V" | "1V" | "1,5V" | "1W" | "3V" | "2W" | "3W" | "4W" | "5W" | "6W" | "8W" | "12W" | "15W") | "auto";
+    ml?: `${string}%` | ("0V" | "0,5V" | "1V" | "1,5V" | "1W" | "3V" | "2W" | "3W" | "4W" | "5W" | "6W" | "8W" | "12W" | "15W") | "auto";
+    mr?: `${string}%` | ("0V" | "0,5V" | "1V" | "1,5V" | "1W" | "3V" | "2W" | "3W" | "4W" | "5W" | "6W" | "8W" | "12W" | "15W") | "auto";
+    mt?: `${string}%` | ("0V" | "0,5V" | "1V" | "1,5V" | "1W" | "3V" | "2W" | "3W" | "4W" | "5W" | "6W" | "8W" | "12W" | "15W") | "auto";
+    mb?: `${string}%` | ("0V" | "0,5V" | "1V" | "1,5V" | "1W" | "3V" | "2W" | "3W" | "4W" | "5W" | "6W" | "8W" | "12W" | "15W") | "auto";
+    backgroundColor?: (import("@alveole/theme").ThemeColor | "transparent") | Partial<Record<"default" | "hover" | "press" | "focus" | "focusVisible" | "disabled", import("@alveole/theme").ThemeColor | "transparent">>;
     borderWidth?: import("tamagui").ViewProps["borderWidth"];
-    borderRadius?: number | string;
-    borderColor?: import("tamagui").ViewProps["borderColor"];
-    gap?: number | import("@alveole/theme").SpacingKey;
+    borderRadius?: import("@alveole/theme").RadiusKey;
+    borderColor?: (import("@alveole/theme").ThemeColor | "transparent") | Partial<Record<"default" | "hover" | "press" | "focus" | "focusVisible" | "disabled", import("@alveole/theme").ThemeColor | "transparent">>;
+    gap?: "0V" | "0,5V" | "1V" | "1,5V" | "1W" | "3V" | "2W" | "3W" | "4W" | "5W" | "6W" | "8W" | "12W" | "15W";
 } & {
     tag?: string;
 } & {

package/dist/core/Page/usePageStatusBar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"usePageStatusBar.d.ts","sourceRoot":"","sources":["../../../src/core/Page/usePageStatusBar.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,kBAAkB,EAAE,MAAM,cAAc,CAAC;AAOlD,eAAO,MAAM,cAAc,GAAI,WAAW,QAAQ,CAAC,kBAAkB,CAAC,SAIrE,CAAC;AAKF,eAAO,MAAM,gBAAgB,GAAI,YAAY,kBAAkB,SA0B9D,CAAC"}
+{"version":3,"file":"usePageStatusBar.d.ts","sourceRoot":"","sources":["../../../src/core/Page/usePageStatusBar.ts"],"names":[],"mappings":"AAIA,OAAO,EAAE,kBAAkB,EAAE,MAAM,cAAc,CAAC;AASlD,eAAO,MAAM,cAAc,GAAI,WAAW,QAAQ,CAAC,kBAAkB,CAAC,SAGrE,CAAC;AAKF,eAAO,MAAM,gBAAgB,GAAI,YAAY,kBAAkB,SA0B9D,CAAC"}

package/dist/core/Page/usePageStatusBar.js

@@ -1,15 +1,15 @@
 import { useFocusEffect } from 'expo-router';
 import * as SystemUI from 'expo-system-ui';
 import React from 'react';
-import { AppState, Platform, StatusBar } from 'react-native';
+import { AppState, StatusBar } from 'react-native';
 const DEFAULT_STATUS_BAR = {
     barStyle: 'dark-content',
     backgroundColor: 'white',
 };
+// Pas de `StatusBar.setBackgroundColor` : sans effet en edge-to-edge, mode par défaut des apps
+// Expo, et retiré de React Native 0.88. Le fond sous la barre est celui que pose expo-system-ui.
 export const applyStatusBar = (statusBar) => {
     StatusBar.setBarStyle(statusBar.barStyle);
-    if (Platform.OS === 'android')
-        StatusBar.setBackgroundColor(statusBar.backgroundColor);
     void SystemUI.setBackgroundColorAsync(statusBar.backgroundColor);
 };
 // La barre de statut est un état global de l'OS : la poser au focus de la page et la restaurer à

package/dist/core/Section/Section.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Section.stories.d.ts","sourceRoot":"","sources":["../../../src/core/Section/Section.stories.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAMA,wBAQkB;AAKlB,eAAO,MAAM,OAAO,mCAMnB,CAAC;AAEF,eAAO,MAAM,YAAY,mCAMxB,CAAC;AAEF,eAAO,MAAM,WAAW,mCAUvB,CAAC;AAEF,eAAO,MAAM,aAAa,mCAMzB,CAAC;AAEF,eAAO,MAAM,WAAW,mCAUvB,CAAC;AAEF,OAAO,KAAK,OAAO,MAAM,2BAA2B,CAAC"}
+{"version":3,"file":"Section.stories.d.ts","sourceRoot":"","sources":["../../../src/core/Section/Section.stories.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAOA,wBAQkB;AAMlB,eAAO,MAAM,OAAO,mCAMnB,CAAC;AAEF,eAAO,MAAM,YAAY,mCAMxB,CAAC;AAEF,eAAO,MAAM,WAAW,mCAUvB,CAAC;AAEF,eAAO,MAAM,aAAa,mCAMzB,CAAC;AAEF,eAAO,MAAM,WAAW,mCAUvB,CAAC;AAEF,OAAO,KAAK,OAAO,MAAM,2BAA2B,CAAC"}

package/dist/core/Section/Section.stories.js

@@ -1,4 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { CustomPalette, enCouleursDuTheme } from '@alveole/theme';
 import { Box } from '../Box';
 import { Typography } from '../Typography';
 import { Section } from './Section';
@@ -11,17 +12,18 @@ export default {
     component: Section,
     styleFn: useStyles,
 };
-const paddingColor = '#b9c47f';
-const innerBoxColor = '#88b2bd';
+const { background } = enCouleursDuTheme(CustomPalette).light;
+const paddingColor = background['contrast-success'];
+const innerBoxColor = background['contrast-info'];
 export const Default = () => (_jsx(Section, { children: _jsx(Box, { children: _jsx(Typography, { children: "Section" }) }) }));
-export const WithPaddingY = () => (_jsx(Section, { backgroundColor: paddingColor, withPaddingY: true, children: _jsx(Box, { backgroundColor: innerBoxColor, p: '050', children: _jsx(Typography, { children: "Section avec background et padding Y" }) }) }));
+export const WithPaddingY = () => (_jsx(Section, { backgroundColor: paddingColor, withPaddingY: true, children: _jsx(Box, { backgroundColor: innerBoxColor, p: "1W", children: _jsx(Typography, { children: "Section avec background et padding Y" }) }) }));
 export const WidthMdSize = () => {
     const styles = useStyles();
-    return (_jsx(Section, { backgroundColor: paddingColor, size: "md", children: _jsx(Box, { backgroundColor: innerBoxColor, p: '050', children: _jsxs(Typography, { children: ["Section avec background et size md (", styles.sectionContainerMD.maxWidth, "px)"] }) }) }));
+    return (_jsx(Section, { backgroundColor: paddingColor, size: "md", children: _jsx(Box, { backgroundColor: innerBoxColor, p: "1W", children: _jsxs(Typography, { children: ["Section avec background et size md (", styles.sectionContainerMD.maxWidth, "px)"] }) }) }));
 };
-export const WidthFullSize = () => (_jsx(Section, { backgroundColor: paddingColor, size: "full", children: _jsx(Box, { backgroundColor: innerBoxColor, p: '050', children: _jsx(Typography, { children: "Section avec background et size full (taille par d\u00E9faut)" }) }) }));
+export const WidthFullSize = () => (_jsx(Section, { backgroundColor: paddingColor, size: "full", children: _jsx(Box, { backgroundColor: innerBoxColor, p: "1W", children: _jsx(Typography, { children: "Section avec background et size full (taille par d\u00E9faut)" }) }) }));
 export const WidthSmSize = () => {
     const styles = useStyles();
-    return (_jsx(Section, { backgroundColor: paddingColor, size: "sm", children: _jsx(Box, { backgroundColor: innerBoxColor, p: '050', children: _jsxs(Typography, { children: ["Section avec background et size sm (", styles.sectionContainerSM.maxWidth, "px)"] }) }) }));
+    return (_jsx(Section, { backgroundColor: paddingColor, size: "sm", children: _jsx(Box, { backgroundColor: innerBoxColor, p: "1W", children: _jsxs(Typography, { children: ["Section avec background et size sm (", styles.sectionContainerSM.maxWidth, "px)"] }) }) }));
 };
 export * as Sources from './Section.stories.sources';

package/dist/core/Section/Section.stories.sources.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Section.stories.sources.d.ts","sourceRoot":"","sources":["../../../src/core/Section/Section.stories.sources.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,OAAO,cAAuI,CAAC;AAE5J,eAAO,MAAM,YAAY,cAA+P,CAAC;AAEzR,eAAO,MAAM,WAAW,cAAiW,CAAC;AAE1X,eAAO,MAAM,aAAa,cAAqR,CAAC;AAEhT,eAAO,MAAM,WAAW,cAAiW,CAAC;AAE1X,eAAO,MAAM,YAAY;;;;;;CAMf,CAAC;AAEX,MAAM,MAAM,eAAe,GAAG,MAAM,OAAO,YAAY,CAAC"}
+{"version":3,"file":"Section.stories.sources.d.ts","sourceRoot":"","sources":["../../../src/core/Section/Section.stories.sources.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,OAAO,cAAuI,CAAC;AAE5J,eAAO,MAAM,YAAY,cAA8P,CAAC;AAExR,eAAO,MAAM,WAAW,cAAgW,CAAC;AAEzX,eAAO,MAAM,aAAa,cAAoR,CAAC;AAE/S,eAAO,MAAM,WAAW,cAAgW,CAAC;AAEzX,eAAO,MAAM,YAAY;;;;;;CAMf,CAAC;AAEX,MAAM,MAAM,eAAe,GAAG,MAAM,OAAO,YAAY,CAAC"}

package/dist/core/Section/Section.stories.sources.js

@@ -1,10 +1,10 @@
 // This file is generated. Do not edit manually.
 // Source: src/core/Section/Section.stories.tsx
 export const Default = () => "export const Default = () => (\n  <Section>\n    <Box>\n      <Typography>Section</Typography>\n    </Box>\n  </Section>\n);";
-export const WithPaddingY = () => "export const WithPaddingY = () => (\n  <Section backgroundColor={paddingColor} withPaddingY>\n    <Box backgroundColor={innerBoxColor} p={'050'}>\n      <Typography>Section avec background et padding Y</Typography>\n    </Box>\n  </Section>\n);";
-export const WidthMdSize = () => "export const WidthMdSize = () => {\n  const styles = useStyles();\n\n  return (\n    <Section backgroundColor={paddingColor} size=\"md\">\n      <Box backgroundColor={innerBoxColor} p={'050'}>\n        <Typography>Section avec background et size md ({styles.sectionContainerMD.maxWidth}px)</Typography>\n      </Box>\n    </Section>\n  );\n};";
-export const WidthFullSize = () => "export const WidthFullSize = () => (\n  <Section backgroundColor={paddingColor} size=\"full\">\n    <Box backgroundColor={innerBoxColor} p={'050'}>\n      <Typography>Section avec background et size full (taille par défaut)</Typography>\n    </Box>\n  </Section>\n);";
-export const WidthSmSize = () => "export const WidthSmSize = () => {\n  const styles = useStyles();\n\n  return (\n    <Section backgroundColor={paddingColor} size=\"sm\">\n      <Box backgroundColor={innerBoxColor} p={'050'}>\n        <Typography>Section avec background et size sm ({styles.sectionContainerSM.maxWidth}px)</Typography>\n      </Box>\n    </Section>\n  );\n};";
+export const WithPaddingY = () => "export const WithPaddingY = () => (\n  <Section backgroundColor={paddingColor} withPaddingY>\n    <Box backgroundColor={innerBoxColor} p=\"1W\">\n      <Typography>Section avec background et padding Y</Typography>\n    </Box>\n  </Section>\n);";
+export const WidthMdSize = () => "export const WidthMdSize = () => {\n  const styles = useStyles();\n\n  return (\n    <Section backgroundColor={paddingColor} size=\"md\">\n      <Box backgroundColor={innerBoxColor} p=\"1W\">\n        <Typography>Section avec background et size md ({styles.sectionContainerMD.maxWidth}px)</Typography>\n      </Box>\n    </Section>\n  );\n};";
+export const WidthFullSize = () => "export const WidthFullSize = () => (\n  <Section backgroundColor={paddingColor} size=\"full\">\n    <Box backgroundColor={innerBoxColor} p=\"1W\">\n      <Typography>Section avec background et size full (taille par défaut)</Typography>\n    </Box>\n  </Section>\n);";
+export const WidthSmSize = () => "export const WidthSmSize = () => {\n  const styles = useStyles();\n\n  return (\n    <Section backgroundColor={paddingColor} size=\"sm\">\n      <Box backgroundColor={innerBoxColor} p=\"1W\">\n        <Typography>Section avec background et size sm ({styles.sectionContainerSM.maxWidth}px)</Typography>\n      </Box>\n    </Section>\n  );\n};";
 export const storySources = {
     Default,
     WithPaddingY,

package/dist/core/ThemeProvider/ThemeProvider.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ThemeProvider.stories.d.ts","sourceRoot":"","sources":["../../../src/core/ThemeProvider/ThemeProvider.stories.tsx"],"names":[],"mappings":";;;;;;;;AAOA,wBAQkB;AA6BlB;;;;;;;;;;;;;;;GAeG;AACH,eAAO,MAAM,WAAW,mCAevB,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkCG;AACH,eAAO,MAAM,gBAAgB,mCA8C5B,CAAC;AAEF,OAAO,KAAK,OAAO,MAAM,iCAAiC,CAAC"}
+{"version":3,"file":"ThemeProvider.stories.d.ts","sourceRoot":"","sources":["../../../src/core/ThemeProvider/ThemeProvider.stories.tsx"],"names":[],"mappings":";;;;;;;;AAOA,wBAQkB;AAkClB;;;;;;;;;;;;;;;GAeG;AACH,eAAO,MAAM,WAAW,mCAevB,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkCG;AACH,eAAO,MAAM,gBAAgB,mCA8C5B,CAAC;AAEF,OAAO,KAAK,OAAO,MAAM,iCAAiC,CAAC"}

package/dist/core/ThemeProvider/ThemeProvider.stories.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useTheme } from '@alveole/theme';
+import { RadiusList, Spacings, useTheme } from '@alveole/theme';
 import { Box } from '../Box';
 import { Highlight } from '../Highlight';
 import { Typography } from '../Typography';
@@ -16,13 +16,18 @@ export default {
 // démonstration.
 const ModeBadge = ({ children }) => {
     const { color, text } = useTheme();
-    return (_jsxs(Box, { display: "flex", flexDirection: "row", gap: 8, style: {
+    return (_jsxs(Box, { display: "flex", flexDirection: "row", gap: "1W", style: {
             alignItems: 'center',
-            paddingHorizontal: 12,
-            paddingVertical: 8,
-            borderRadius: 8,
+            paddingHorizontal: Spacings['3V'],
+            paddingVertical: Spacings['1W'],
+            borderRadius: RadiusList.md,
             backgroundColor: color.light.background['default-grey'],
-        }, children: [_jsx(Box, { style: { width: 8, height: 8, borderRadius: 4, backgroundColor: color.light.background['active-primary'] } }), _jsx(Typography, { style: text['Corps de texte'].SM.Regular, children: children })] }));
+        }, children: [_jsx(Box, { style: {
+                    width: 8,
+                    height: 8,
+                    borderRadius: RadiusList.full,
+                    backgroundColor: color.light.background['active-primary'],
+                } }), _jsx(Typography, { style: text['Corps de texte'].SM.Regular, children: children })] }));
 };
 /**
  * Mode par défaut : les variables CSS sont injectées au runtime via des balises `<style>`,
@@ -40,7 +45,7 @@ const ModeBadge = ({ children }) => {
  * }
  * ```
  */
-export const UsageDefaut = () => (_jsxs(Box, { display: "flex", flexDirection: "column", gap: 12, children: [_jsx(ModeBadge, { children: "Mode actif : injection dynamique via balises <style>" }), _jsx(Highlight, { language: "tsx", children: `import { ThemeProvider } from '@alveole/theme';
+export const UsageDefaut = () => (_jsxs(Box, { display: "flex", flexDirection: "column", gap: "3V", children: [_jsx(ModeBadge, { children: "Mode actif : injection dynamique via balises <style>" }), _jsx(Highlight, { language: "tsx", children: `import { ThemeProvider } from '@alveole/theme';
 
 export default function RootLayout() {
   return (
@@ -86,7 +91,7 @@ export default function RootLayout() {
  */
 export const UsageCSSStatique = () => {
     const { color, text } = useTheme();
-    return (_jsxs(Box, { display: "flex", flexDirection: "column", gap: 12, children: [_jsx(ModeBadge, { children: "Mode actif : CSS pr\u00E9-compil\u00E9 - aucune balise <style> inject\u00E9e" }), _jsx(Highlight, { language: "tsx", children: `import '@alveole/theme/dist/default.css';
+    return (_jsxs(Box, { display: "flex", flexDirection: "column", gap: "3V", children: [_jsx(ModeBadge, { children: "Mode actif : CSS pr\u00E9-compil\u00E9 - aucune balise <style> inject\u00E9e" }), _jsx(Highlight, { language: "tsx", children: `import '@alveole/theme/dist/default.css';
 import { ThemeProvider } from '@alveole/theme';
 
 export default function RootLayout() {
@@ -95,10 +100,10 @@ export default function RootLayout() {
       {children}
     </ThemeProvider>
   );
-}` }), _jsxs(Box, { display: "flex", flexDirection: "column", gap: 8, style: {
-                    paddingHorizontal: 12,
-                    paddingVertical: 10,
-                    borderRadius: 8,
+}` }), _jsxs(Box, { display: "flex", flexDirection: "column", gap: "1W", style: {
+                    paddingHorizontal: Spacings['3V'],
+                    paddingVertical: Spacings['3V'],
+                    borderRadius: RadiusList.md,
                     backgroundColor: color.light.background['action-high-error'],
                 }, children: [_jsx(Typography, { style: { ...text['Corps de texte'].SM.Medium, color: color.light.text['action-high-error'] }, children: "Limitation : incompatible avec color custom" }), _jsx(Typography, { style: { ...text['Corps de texte'].SM.Regular, color: color.light.text['action-high-error'] }, children: "Si l'app passe un prop `color` au ThemeProvider, les variables overrid\u00E9es ne seront pas inject\u00E9es. Dans ce cas, retirer `staticCSS`." })] }), _jsx(Highlight, { language: "tsx", children: `// ❌ Les overrides color sont ignorés avec staticCSS
 <ThemeProvider staticCSS color={{ light: { background: { 'default-grey': '#eee' } } }}>

package/dist/core/ThemeProvider/ThemeProvider.stories.sources.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ThemeProvider.stories.sources.d.ts","sourceRoot":"","sources":["../../../src/core/ThemeProvider/ThemeProvider.stories.sources.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,WAAW,cAAyb,CAAC;AAEld,eAAO,MAAM,gBAAgB,cAA2rD,CAAC;AAEztD,eAAO,MAAM,YAAY;;;CAGf,CAAC;AAEX,MAAM,MAAM,eAAe,GAAG,MAAM,OAAO,YAAY,CAAC;AAExD,eAAO,MAAM,iBAAiB,EAAE,OAAO,CAAC,MAAM,CAAC,eAAe,EAAE,MAAM,CAAC,CAGtE,CAAC"}
+{"version":3,"file":"ThemeProvider.stories.sources.d.ts","sourceRoot":"","sources":["../../../src/core/ThemeProvider/ThemeProvider.stories.sources.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,WAAW,cAA2b,CAAC;AAEpd,eAAO,MAAM,gBAAgB,cAAouD,CAAC;AAElwD,eAAO,MAAM,YAAY;;;CAGf,CAAC;AAEX,MAAM,MAAM,eAAe,GAAG,MAAM,OAAO,YAAY,CAAC;AAExD,eAAO,MAAM,iBAAiB,EAAE,OAAO,CAAC,MAAM,CAAC,eAAe,EAAE,MAAM,CAAC,CAGtE,CAAC"}

package/dist/core/ThemeProvider/ThemeProvider.stories.sources.js

@@ -1,7 +1,7 @@
 // This file is generated. Do not edit manually.
 // Source: src/core/ThemeProvider/ThemeProvider.stories.tsx
-export const UsageDefaut = () => "export const UsageDefaut = () => (\n  <Box display=\"flex\" flexDirection=\"column\" gap={12}>\n    <ModeBadge>Mode actif : injection dynamique via balises &lt;style&gt;</ModeBadge>\n    <Highlight language=\"tsx\">\n      {`import { ThemeProvider } from '@alveole/theme';\n\nexport default function RootLayout() {\n  return (\n    <ThemeProvider>\n      {children}\n    </ThemeProvider>\n  );\n}`}\n    </Highlight>\n  </Box>\n);";
-export const UsageCSSStatique = () => "export const UsageCSSStatique = () => {\n  const { color, text } = useTheme();\n\n  return (\n    <Box display=\"flex\" flexDirection=\"column\" gap={12}>\n      <ModeBadge>Mode actif : CSS pré-compilé - aucune balise &lt;style&gt; injectée</ModeBadge>\n      <Highlight language=\"tsx\">\n        {`import '@alveole/theme/dist/default.css';\nimport { ThemeProvider } from '@alveole/theme';\n\nexport default function RootLayout() {\n  return (\n    <ThemeProvider staticCSS>\n      {children}\n    </ThemeProvider>\n  );\n}`}\n      </Highlight>\n      <Box\n        display=\"flex\"\n        flexDirection=\"column\"\n        gap={8}\n        style={{\n          paddingHorizontal: 12,\n          paddingVertical: 10,\n          borderRadius: 8,\n          backgroundColor: color.light.background['action-high-error'],\n        }}\n      >\n        <Typography style={{ ...text['Corps de texte'].SM.Medium, color: color.light.text['action-high-error'] }}>\n          Limitation : incompatible avec color custom\n        </Typography>\n        <Typography style={{ ...text['Corps de texte'].SM.Regular, color: color.light.text['action-high-error'] }}>\n          Si l&apos;app passe un prop `color` au ThemeProvider, les variables overridées ne seront pas injectées. Dans\n          ce cas, retirer `staticCSS`.\n        </Typography>\n      </Box>\n      <Highlight language=\"tsx\">\n        {`// ❌ Les overrides color sont ignorés avec staticCSS\n<ThemeProvider staticCSS color={{ light: { background: { 'default-grey': '#eee' } } }}>\n\n// ✅ Sans staticCSS, les overrides fonctionnent\n<ThemeProvider color={{ light: { background: { 'default-grey': '#eee' } } }}>`}\n      </Highlight>\n    </Box>\n  );\n};";
+export const UsageDefaut = () => "export const UsageDefaut = () => (\n  <Box display=\"flex\" flexDirection=\"column\" gap=\"3V\">\n    <ModeBadge>Mode actif : injection dynamique via balises &lt;style&gt;</ModeBadge>\n    <Highlight language=\"tsx\">\n      {`import { ThemeProvider } from '@alveole/theme';\n\nexport default function RootLayout() {\n  return (\n    <ThemeProvider>\n      {children}\n    </ThemeProvider>\n  );\n}`}\n    </Highlight>\n  </Box>\n);";
+export const UsageCSSStatique = () => "export const UsageCSSStatique = () => {\n  const { color, text } = useTheme();\n\n  return (\n    <Box display=\"flex\" flexDirection=\"column\" gap=\"3V\">\n      <ModeBadge>Mode actif : CSS pré-compilé - aucune balise &lt;style&gt; injectée</ModeBadge>\n      <Highlight language=\"tsx\">\n        {`import '@alveole/theme/dist/default.css';\nimport { ThemeProvider } from '@alveole/theme';\n\nexport default function RootLayout() {\n  return (\n    <ThemeProvider staticCSS>\n      {children}\n    </ThemeProvider>\n  );\n}`}\n      </Highlight>\n      <Box\n        display=\"flex\"\n        flexDirection=\"column\"\n        gap=\"1W\"\n        style={{\n          paddingHorizontal: Spacings['3V'],\n          paddingVertical: Spacings['3V'],\n          borderRadius: RadiusList.md,\n          backgroundColor: color.light.background['action-high-error'],\n        }}\n      >\n        <Typography style={{ ...text['Corps de texte'].SM.Medium, color: color.light.text['action-high-error'] }}>\n          Limitation : incompatible avec color custom\n        </Typography>\n        <Typography style={{ ...text['Corps de texte'].SM.Regular, color: color.light.text['action-high-error'] }}>\n          Si l&apos;app passe un prop `color` au ThemeProvider, les variables overridées ne seront pas injectées. Dans\n          ce cas, retirer `staticCSS`.\n        </Typography>\n      </Box>\n      <Highlight language=\"tsx\">\n        {`// ❌ Les overrides color sont ignorés avec staticCSS\n<ThemeProvider staticCSS color={{ light: { background: { 'default-grey': '#eee' } } }}>\n\n// ✅ Sans staticCSS, les overrides fonctionnent\n<ThemeProvider color={{ light: { background: { 'default-grey': '#eee' } } }}>`}\n      </Highlight>\n    </Box>\n  );\n};";
 export const storySources = {
     UsageDefaut,
     UsageCSSStatique,

package/dist/core/Typography/Typography.stories.d.ts

@@ -30,5 +30,6 @@ export declare const TypographyStyleUnderline: () => import("react").JSX.Element
 export declare const TypographyStyleLineThrough: () => import("react").JSX.Element;
 export declare const TypographyTransformCapitalize: () => import("react").JSX.Element;
 export declare const TypographyTransformUppercase: () => import("react").JSX.Element;
+export declare const TypographyAligneeADroite: () => import("react").JSX.Element;
 export * as Sources from './Typography.stories.sources';
 //# sourceMappingURL=Typography.stories.d.ts.map

package/dist/core/Typography/Typography.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Typography.stories.d.ts","sourceRoot":"","sources":["../../../src/core/Typography/Typography.stories.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAGA,wBAOkB;AAElB,eAAO,MAAM,iBAAiB,mCAAoD,CAAC;AAEnF,eAAO,MAAM,yBAAyB,mCAIrC,CAAC;AAEF,eAAO,MAAM,qBAAqB,mCAAsE,CAAC;AAEzG,eAAO,MAAM,wBAAwB,mCAAkF,CAAC;AAExH,eAAO,MAAM,0BAA0B,mCAA+E,CAAC;AAEvH,eAAO,MAAM,6BAA6B,mCAEzC,CAAC;AAEF,eAAO,MAAM,4BAA4B,mCAAwE,CAAC;AAElH,OAAO,KAAK,OAAO,MAAM,8BAA8B,CAAC"}
+{"version":3,"file":"Typography.stories.d.ts","sourceRoot":"","sources":["../../../src/core/Typography/Typography.stories.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAGA,wBAOkB;AAElB,eAAO,MAAM,iBAAiB,mCAAoD,CAAC;AAEnF,eAAO,MAAM,yBAAyB,mCAIrC,CAAC;AAEF,eAAO,MAAM,qBAAqB,mCAAsE,CAAC;AAEzG,eAAO,MAAM,wBAAwB,mCAAkF,CAAC;AAExH,eAAO,MAAM,0BAA0B,mCAA+E,CAAC;AAEvH,eAAO,MAAM,6BAA6B,mCAEzC,CAAC;AAEF,eAAO,MAAM,4BAA4B,mCAAwE,CAAC;AAGlH,eAAO,MAAM,wBAAwB,mCAIpC,CAAC;AAEF,OAAO,KAAK,OAAO,MAAM,8BAA8B,CAAC"}