@alveole/components 2.0.0-alpha.1 → 2.0.0-alpha.11

package/dist/core/A/A.d.ts

@@ -1,5 +1,6 @@
 import { Href } from 'expo-router';
 import React, { CSSProperties } from 'react';
+import { BoxProps } from '../Box';
 import { CibleDuLien } from './ouvertureDuLien';
 export type CanAccessHref = (href: Href & string) => boolean;
 /** Contexte optionnel pour fournir la logique d'accès aux liens (ex. droits métier). Non fourni = tous les liens sont cliquables. */
@@ -11,7 +12,8 @@ export type AProps = React.PropsWithChildren<{
     /** default: "push" */
     direction?: 'push' | 'replace' | 'dismiss';
     style?: CSSProperties;
-    hoverStyle?: CSSProperties;
+    /** Fond du lien, clauses de Tamagui comprises (`{ hover: ... }`, ADR 0031). */
+    backgroundColor?: BoxProps['backgroundColor'];
     /** Override la logique d'accès (sinon utilise LinkAccessContext si fourni, sinon accès autorisé). */
     canAccessHref?: CanAccessHref;
     /** Marque le lien comme représentant l'emplacement courant. "page" pour la page affichée. */

package/dist/core/A/A.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"A.d.ts","sourceRoot":"","sources":["../../../src/core/A/A.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,IAAI,EAAQ,MAAM,aAAa,CAAC;AACzC,OAAO,KAAK,EAAE,EAAE,aAAa,EAA6B,MAAM,OAAO,CAAC;AAKxE,OAAO,EAAE,WAAW,EAAmB,MAAM,mBAAmB,CAAC;AAEjE,MAAM,MAAM,aAAa,GAAG,CAAC,IAAI,EAAE,IAAI,GAAG,MAAM,KAAK,OAAO,CAAC;AAE7D,qIAAqI;AACrI,eAAO,MAAM,iBAAiB,qCAA4C,CAAC;AAE3E,0GAA0G;AAC1G,eAAO,MAAM,gBAAgB,GAAI,gBAAgB,aAAa,KAAG,aAGhE,CAAC;AAEF,MAAM,MAAM,MAAM,GAAG,KAAK,CAAC,iBAAiB,CAAC;IAC3C,IAAI,EAAE,IAAI,GAAG,MAAM,CAAC;IACpB,sBAAsB;IACtB,SAAS,CAAC,EAAE,MAAM,GAAG,SAAS,GAAG,SAAS,CAAC;IAC3C,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,UAAU,CAAC,EAAE,aAAa,CAAC;IAC3B,qGAAqG;IACrG,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B,6FAA6F;IAC7F,WAAW,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,UAAU,GAAG,MAAM,GAAG,MAAM,CAAC;IAC7D,gIAAgI;IAChI,MAAM,CAAC,EAAE,WAAW,CAAC;CACtB,CAAC,CAAC;AAEH,eAAO,MAAM,CAAC,GAAI,OAAO,MAAM,sBA8D9B,CAAC"}
+{"version":3,"file":"A.d.ts","sourceRoot":"","sources":["../../../src/core/A/A.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,IAAI,EAAQ,MAAM,aAAa,CAAC;AACzC,OAAO,KAAK,EAAE,EAAE,aAAa,EAA6B,MAAM,OAAO,CAAC;AAExE,OAAO,EAAO,QAAQ,EAAE,MAAM,QAAQ,CAAC;AAGvC,OAAO,EAAE,WAAW,EAAmB,MAAM,mBAAmB,CAAC;AAEjE,MAAM,MAAM,aAAa,GAAG,CAAC,IAAI,EAAE,IAAI,GAAG,MAAM,KAAK,OAAO,CAAC;AAE7D,qIAAqI;AACrI,eAAO,MAAM,iBAAiB,qCAA4C,CAAC;AAE3E,0GAA0G;AAC1G,eAAO,MAAM,gBAAgB,GAAI,gBAAgB,aAAa,KAAG,aAGhE,CAAC;AAEF,MAAM,MAAM,MAAM,GAAG,KAAK,CAAC,iBAAiB,CAAC;IAC3C,IAAI,EAAE,IAAI,GAAG,MAAM,CAAC;IACpB,sBAAsB;IACtB,SAAS,CAAC,EAAE,MAAM,GAAG,SAAS,GAAG,SAAS,CAAC;IAC3C,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,+EAA+E;IAC/E,eAAe,CAAC,EAAE,QAAQ,CAAC,iBAAiB,CAAC,CAAC;IAC9C,qGAAqG;IACrG,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B,6FAA6F;IAC7F,WAAW,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG,UAAU,GAAG,MAAM,GAAG,MAAM,CAAC;IAC7D,gIAAgI;IAChI,MAAM,CAAC,EAAE,WAAW,CAAC;CACtB,CAAC,CAAC;AAEH,eAAO,MAAM,CAAC,GAAI,OAAO,MAAM,sBAqE9B,CAAC"}

package/dist/core/A/A.js

@@ -2,7 +2,7 @@ import { jsxs as _jsxs, jsx as _jsx, Fragment as _Fragment } from "react/jsx-run
 import { focusRingProps } from '@alveole/theme';
 import { Link } from 'expo-router';
 import { createContext, useContext } from 'react';
-import { Pressable } from 'react-native';
+import { Platform, Pressable } from 'react-native';
 import { Box } from '../Box';
 import { GridColumnContext } from '../Grid';
 import { useStyles } from './A.styles';
@@ -15,7 +15,7 @@ export const useCanAccessHref = (canAccessProp) => {
     return canAccessProp ?? canAccessFromContext ?? (() => true);
 };
 export const A = (props) => {
-    const { children, href, direction = 'push', style, hoverStyle, ariaCurrent, target, canAccessHref: canAccessProp, } = props;
+    const { children, href, direction = 'push', style, backgroundColor, ariaCurrent, target, canAccessHref: canAccessProp, } = props;
     const styles = useStyles();
     // Sur le web, ce Pressable rend le `<a>` lui-meme : il porte donc une couleur de texte, que
     // `ViewStyle` ne connait pas. `TextStyle` l'etend et la decrit.
@@ -23,7 +23,10 @@ export const A = (props) => {
     const canAccess = useCanAccessHref(canAccessProp);
     const fill = useContext(GridColumnContext) ? styles.fill : undefined;
     const { navigateurIntegre, propsDuPressable, annonce } = ouvertureDuLien(href, target);
-    const contenu = (_jsxs(Box, { tag: "a-pressable", style: { ...styles.pressable, ...fill, ...style }, hoverStyle: hoverStyle, children: [children, annonce] }));
+    const contenu = (_jsxs(Box, { tag: "a-pressable", style: { ...styles.pressable, ...fill, ...style }, backgroundColor: backgroundColor, 
+        // En natif, les clauses de survol des descendants ne doivent pas capter le toucher
+        // destiné au Pressable du lien. Le web garde ses interactions et son survol.
+        pointerEvents: Platform.OS === 'web' ? 'auto' : 'none', children: [children, annonce] }));
     const lienNavigateurIntegre = (_jsx(Pressable, { accessibilityRole: "link", "aria-current": ariaCurrent, ...propsDuPressable, style: { ...styleDuLien, ...fill }, ...focusRingProps(), children: contenu }));
     const expoLink = (_jsx(Link, { href: href, asChild: true, replace: direction === 'replace', push: direction === 'push', dismissTo: direction === 'dismiss', children: _jsx(Pressable, { accessibilityRole: "link", "aria-current": ariaCurrent, ...propsDuPressable, style: { ...styleDuLien, ...fill }, ...focusRingProps(), children: contenu }) }));
     if (!canAccess(href))

package/dist/core/Box/Box.d.ts

@@ -1,11 +1,11 @@
 import { RNTamaguiViewNonStyleProps, TamaguiElement, ViewProps as TamaguiViewProps } from '@tamagui/core';
-import React, { CSSProperties } from 'react';
+import React from 'react';
 import { BoxStyle } from './Box.types';
-export type BoxProps = Pick<TamaguiViewProps, 'exitStyle' | 'focusStyle' | 'pressStyle' | 'disabledStyle'> & RNTamaguiViewNonStyleProps & BoxStyle & {
-    hoverStyle?: CSSProperties;
+export type BoxProps = Omit<TamaguiViewProps, keyof BoxStyle | 'tag' | 'style'> & Omit<RNTamaguiViewNonStyleProps, 'tag'> & BoxStyle & {
+    tag?: string;
 };
 export type BoxElement = TamaguiElement;
-export declare const Box: React.ForwardRefExoticComponent<Pick<import("tamagui").StackProps, "pressStyle" | "focusStyle" | "disabledStyle" | "exitStyle"> & RNTamaguiViewNonStyleProps & Pick<import("tamagui").StackProps, "display" | "flex" | "flexWrap" | "flexDirection" | "opacity" | "overflow"> & {
+export declare const Box: React.ForwardRefExoticComponent<Omit<TamaguiViewProps, "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<RNTamaguiViewNonStyleProps, "tag"> & Pick<TamaguiViewProps, "flex" | "opacity" | "display" | "flexDirection" | "flexWrap" | "overflow"> & {
     justify?: TamaguiViewProps["justifyContent"];
 } & import("../..").SizeStyle & {
     p?: number | import("@alveole/theme").SpacingKey;
@@ -18,12 +18,12 @@ export declare const Box: React.ForwardRefExoticComponent<Pick<import("tamagui")
     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?: string;
-    borderWidth?: number;
+    backgroundColor?: TamaguiViewProps["backgroundColor"];
+    borderWidth?: TamaguiViewProps["borderWidth"];
     borderRadius?: number | string;
-    borderColor?: string;
+    borderColor?: TamaguiViewProps["borderColor"];
     gap?: number | import("@alveole/theme").SpacingKey;
 } & {
-    hoverStyle?: CSSProperties;
+    tag?: string;
 } & React.RefAttributes<TamaguiElement>>;
 //# sourceMappingURL=Box.d.ts.map

package/dist/core/Box/Box.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Box.d.ts","sourceRoot":"","sources":["../../../src/core/Box/Box.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,0BAA0B,EAE1B,cAAc,EAEd,SAAS,IAAI,gBAAgB,EAC9B,MAAM,eAAe,CAAC;AACvB,OAAO,KAAK,EAAE,EAAE,aAAa,EAAE,MAAM,OAAO,CAAC;AAE7C,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAGvC,MAAM,MAAM,QAAQ,GAAG,IAAI,CAAC,gBAAgB,EAAE,WAAW,GAAG,YAAY,GAAG,YAAY,GAAG,eAAe,CAAC,GACxG,0BAA0B,GAC1B,QAAQ,GAAG;IACT,UAAU,CAAC,EAAE,aAAa,CAAC;CAC5B,CAAC;AAGJ,MAAM,MAAM,UAAU,GAAG,cAAc,CAAC;AAExC,eAAO,MAAM,GAAG;;;;;;;;;;;;;;;;;;;iBANC,aAAa;wCAgD5B,CAAC"}
+{"version":3,"file":"Box.d.ts","sourceRoot":"","sources":["../../../src/core/Box/Box.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,0BAA0B,EAE1B,cAAc,EAEd,SAAS,IAAI,gBAAgB,EAC9B,MAAM,eAAe,CAAC;AACvB,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,EAAE,QAAQ,EAAE,MAAM,aAAa,CAAC;AAMvC,MAAM,MAAM,QAAQ,GAAG,IAAI,CAAC,gBAAgB,EAAE,MAAM,QAAQ,GAAG,KAAK,GAAG,OAAO,CAAC,GAC7E,IAAI,CAAC,0BAA0B,EAAE,KAAK,CAAC,GACvC,QAAQ,GAAG;IAGT,GAAG,CAAC,EAAE,MAAM,CAAC;CACd,CAAC;AAGJ,MAAM,MAAM,UAAU,GAAG,cAAc,CAAC;AAExC,eAAO,MAAM,GAAG;;;;;;;;;;;;;;;;;;;UANN,MAAM;wCAiDd,CAAC"}

package/dist/core/Box/Box.js

@@ -1,11 +1,13 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { styled, View as TamaguiView, } from '@tamagui/core';
 import React from 'react';
-import { versStyleTamagui } from '../styleTamagui/versStyleTamagui';
+import { aplatirStyle } from '../styleTamagui/aplatirStyle';
+import { definis } from '../styleTamagui/definis';
+import { correctionFlexDuWeb } from '../styleTamagui/flexDuWeb';
 import { resolveSpacing } from './resolveSpacing';
 const StyledView = styled(TamaguiView, { name: 'Box' });
 export const Box = React.forwardRef(function Box(props, ref) {
-    const { tag, style, borderRadius, hoverStyle, mt, mb, mr, ml, m, pt, pb, pl, pr, p, gap, ...viewProps } = props;
+    const { tag, style, borderRadius, mt, mb, mr, ml, m, pt, pb, pl, pr, p, gap, ...viewProps } = props;
     const radius = {
         borderBottomRightRadius: borderRadius,
         borderTopRightRadius: borderRadius,
@@ -29,5 +31,6 @@ export const Box = React.forwardRef(function Box(props, ref) {
     const spacings = {
         gap: resolveSpacing(gap),
     };
-    return (_jsx(StyledView, { ref: ref, tag: tag ?? 'box', style: style, ...radius, hoverStyle: versStyleTamagui(hoverStyle), ...viewProps, ...margins, ...paddings, ...spacings }));
+    const correctionFlex = correctionFlexDuWeb(style);
+    return (_jsx(StyledView, { ref: ref, render: tag ?? 'box', style: correctionFlex ? { ...aplatirStyle(style), ...correctionFlex } : style, ...radius, ...viewProps, ...definis(margins), ...definis(paddings), ...definis(spacings) }));
 });

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

@@ -4,7 +4,7 @@ declare const _default: {
     experimental: false;
     description: string;
     shortDescription: string;
-    component: import("react").ForwardRefExoticComponent<Pick<import("tamagui").StackProps, "pressStyle" | "focusStyle" | "disabledStyle" | "exitStyle"> & import("@tamagui/core").RNTamaguiViewNonStyleProps & Pick<import("tamagui").StackProps, "display" | "flex" | "flexWrap" | "flexDirection" | "opacity" | "overflow"> & {
+    component: import("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"> & {
         justify?: import("tamagui").ViewProps["justifyContent"];
     } & import("../..").SizeStyle & {
         p?: number | import("@alveole/theme").SpacingKey;
@@ -17,13 +17,13 @@ declare const _default: {
         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?: string;
-        borderWidth?: number;
+        backgroundColor?: import("tamagui").ViewProps["backgroundColor"];
+        borderWidth?: import("tamagui").ViewProps["borderWidth"];
         borderRadius?: number | string;
-        borderColor?: string;
+        borderColor?: import("tamagui").ViewProps["borderColor"];
         gap?: number | import("@alveole/theme").SpacingKey;
     } & {
-        hoverStyle?: import("react").CSSProperties;
+        tag?: string;
     } & import("react").RefAttributes<import("tamagui").TamaguiElement>>;
     styleFn: () => string;
 };

package/dist/core/Box/Box.stories.js

@@ -13,5 +13,5 @@ export default {
 export const BoxDefault = () => (_jsx(Box, { tag: "box", children: _jsx(Typography, { children: "Contenu par d\u00E9faut" }) }));
 export const BoxPadded = () => (_jsx(Box, { tag: "padded", p: 16, children: _jsx(Typography, { children: "Box avec padding" }) }));
 export const BoxPaddedWithBackground = () => (_jsx(Box, { tag: "padded-with-background", backgroundColor: '#f0f0f0', p: 16, children: _jsx(Typography, { children: "Box avec fond gris clair et padding" }) }));
-export const BoxHovered = () => (_jsx(Box, { tag: "hovered", hoverStyle: { background: '#f0f0f0' }, children: _jsx(Typography, { children: "Box avec fond gris changeant au hover" }) }));
+export const BoxHovered = () => (_jsx(Box, { tag: "hovered", backgroundColor: "hover:#f0f0f0", children: _jsx(Typography, { children: "Box avec fond gris changeant au hover" }) }));
 export * as Sources from './Box.stories.sources';

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

@@ -1 +1 @@
-{"version":3,"file":"Box.stories.sources.d.ts","sourceRoot":"","sources":["../../../src/core/Box/Box.stories.sources.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,UAAU,cAAgI,CAAC;AAExJ,eAAO,MAAM,SAAS,cAAuI,CAAC;AAE9J,eAAO,MAAM,uBAAuB,cAAoN,CAAC;AAEzP,eAAO,MAAM,UAAU,cAA8L,CAAC;AAEtN,eAAO,MAAM,YAAY;;;;;CAKf,CAAC;AAEX,MAAM,MAAM,eAAe,GAAG,MAAM,OAAO,YAAY,CAAC"}
+{"version":3,"file":"Box.stories.sources.d.ts","sourceRoot":"","sources":["../../../src/core/Box/Box.stories.sources.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,UAAU,cAAgI,CAAC;AAExJ,eAAO,MAAM,SAAS,cAAuI,CAAC;AAE9J,eAAO,MAAM,uBAAuB,cAAoN,CAAC;AAEzP,eAAO,MAAM,UAAU,cAAyL,CAAC;AAEjN,eAAO,MAAM,YAAY;;;;;CAKf,CAAC;AAEX,MAAM,MAAM,eAAe,GAAG,MAAM,OAAO,YAAY,CAAC"}

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

@@ -3,7 +3,7 @@
 export const BoxDefault = () => "export const BoxDefault = () => (\n  <Box tag=\"box\">\n    <Typography>Contenu par défaut</Typography>\n  </Box>\n);";
 export const BoxPadded = () => "export const BoxPadded = () => (\n  <Box tag=\"padded\" p={16}>\n    <Typography>Box avec padding</Typography>\n  </Box>\n);";
 export const BoxPaddedWithBackground = () => "export const BoxPaddedWithBackground = () => (\n  <Box tag=\"padded-with-background\" backgroundColor={'#f0f0f0'} p={16}>\n    <Typography>Box avec fond gris clair et padding</Typography>\n  </Box>\n);";
-export const BoxHovered = () => "export const BoxHovered = () => (\n  <Box tag=\"hovered\" hoverStyle={{ background: '#f0f0f0' }}>\n    <Typography>Box avec fond gris changeant au hover</Typography>\n  </Box>\n);";
+export const BoxHovered = () => "export const BoxHovered = () => (\n  <Box tag=\"hovered\" backgroundColor=\"hover:#f0f0f0\">\n    <Typography>Box avec fond gris changeant au hover</Typography>\n  </Box>\n);";
 export const storySources = {
     BoxDefault,
     BoxPadded,

package/dist/core/Box/Box.types.d.ts

@@ -15,10 +15,10 @@ export type BoxAdvancedStyle = SizeStyle & {
     mr?: number | `${string}%` | SpacingKey | 'auto';
     mt?: number | `${string}%` | SpacingKey | 'auto';
     mb?: number | `${string}%` | SpacingKey | 'auto';
-    backgroundColor?: string;
-    borderWidth?: number;
+    backgroundColor?: ViewProps['backgroundColor'];
+    borderWidth?: ViewProps['borderWidth'];
     borderRadius?: number | string;
-    borderColor?: string;
+    borderColor?: ViewProps['borderColor'];
     gap?: number | SpacingKey;
 };
 export type BoxStyle = BoxBaseStyle & BoxAdvancedStyle;

package/dist/core/Box/Box.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Box.types.d.ts","sourceRoot":"","sources":["../../../src/core/Box/Box.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAC5C,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAC1C,OAAO,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AAEjD,MAAM,MAAM,YAAY,GAAG,IAAI,CAC7B,SAAS,EACT,SAAS,GAAG,MAAM,GAAG,UAAU,GAAG,eAAe,GAAG,SAAS,GAAG,UAAU,CAC3E,GAAG;IACF,OAAO,CAAC,EAAE,SAAS,CAAC,gBAAgB,CAAC,CAAC;CACvC,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG,SAAS,GAAG;IACzC,CAAC,CAAC,EAAE,MAAM,GAAG,UAAU,CAAC;IACxB,EAAE,CAAC,EAAE,MAAM,GAAG,UAAU,CAAC;IACzB,EAAE,CAAC,EAAE,MAAM,GAAG,UAAU,CAAC;IACzB,EAAE,CAAC,EAAE,MAAM,GAAG,UAAU,CAAC;IACzB,EAAE,CAAC,EAAE,MAAM,GAAG,UAAU,CAAC;IAEzB,CAAC,CAAC,EAAE,MAAM,GAAG,GAAG,MAAM,GAAG,GAAG,UAAU,GAAG,MAAM,CAAC;IAChD,EAAE,CAAC,EAAE,MAAM,GAAG,GAAG,MAAM,GAAG,GAAG,UAAU,GAAG,MAAM,CAAC;IACjD,EAAE,CAAC,EAAE,MAAM,GAAG,GAAG,MAAM,GAAG,GAAG,UAAU,GAAG,MAAM,CAAC;IACjD,EAAE,CAAC,EAAE,MAAM,GAAG,GAAG,MAAM,GAAG,GAAG,UAAU,GAAG,MAAM,CAAC;IACjD,EAAE,CAAC,EAAE,MAAM,GAAG,GAAG,MAAM,GAAG,GAAG,UAAU,GAAG,MAAM,CAAC;IAEjD,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC/B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,GAAG,CAAC,EAAE,MAAM,GAAG,UAAU,CAAC;CAC3B,CAAC;AAEF,MAAM,MAAM,QAAQ,GAAG,YAAY,GAAG,gBAAgB,CAAC"}
+{"version":3,"file":"Box.types.d.ts","sourceRoot":"","sources":["../../../src/core/Box/Box.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAC5C,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAC1C,OAAO,EAAE,SAAS,EAAE,MAAM,sBAAsB,CAAC;AAEjD,MAAM,MAAM,YAAY,GAAG,IAAI,CAC7B,SAAS,EACT,SAAS,GAAG,MAAM,GAAG,UAAU,GAAG,eAAe,GAAG,SAAS,GAAG,UAAU,CAC3E,GAAG;IACF,OAAO,CAAC,EAAE,SAAS,CAAC,gBAAgB,CAAC,CAAC;CACvC,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG,SAAS,GAAG;IACzC,CAAC,CAAC,EAAE,MAAM,GAAG,UAAU,CAAC;IACxB,EAAE,CAAC,EAAE,MAAM,GAAG,UAAU,CAAC;IACzB,EAAE,CAAC,EAAE,MAAM,GAAG,UAAU,CAAC;IACzB,EAAE,CAAC,EAAE,MAAM,GAAG,UAAU,CAAC;IACzB,EAAE,CAAC,EAAE,MAAM,GAAG,UAAU,CAAC;IAEzB,CAAC,CAAC,EAAE,MAAM,GAAG,GAAG,MAAM,GAAG,GAAG,UAAU,GAAG,MAAM,CAAC;IAChD,EAAE,CAAC,EAAE,MAAM,GAAG,GAAG,MAAM,GAAG,GAAG,UAAU,GAAG,MAAM,CAAC;IACjD,EAAE,CAAC,EAAE,MAAM,GAAG,GAAG,MAAM,GAAG,GAAG,UAAU,GAAG,MAAM,CAAC;IACjD,EAAE,CAAC,EAAE,MAAM,GAAG,GAAG,MAAM,GAAG,GAAG,UAAU,GAAG,MAAM,CAAC;IACjD,EAAE,CAAC,EAAE,MAAM,GAAG,GAAG,MAAM,GAAG,GAAG,UAAU,GAAG,MAAM,CAAC;IAGjD,eAAe,CAAC,EAAE,SAAS,CAAC,iBAAiB,CAAC,CAAC;IAC/C,WAAW,CAAC,EAAE,SAAS,CAAC,aAAa,CAAC,CAAC;IACvC,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IAC/B,WAAW,CAAC,EAAE,SAAS,CAAC,aAAa,CAAC,CAAC;IACvC,GAAG,CAAC,EAAE,MAAM,GAAG,UAAU,CAAC;CAC3B,CAAC;AAEF,MAAM,MAAM,QAAQ,GAAG,YAAY,GAAG,gBAAgB,CAAC"}

package/dist/core/Form/Form.web.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Form.web.d.ts","sourceRoot":"","sources":["../../../src/core/Form/Form.web.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAiB,MAAM,OAAO,CAAC;AAEtC,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAC;AAGxC,eAAO,MAAM,IAAI,GAAI,OAAO,SAAS,sBAcpC,CAAC"}
+{"version":3,"file":"Form.web.d.ts","sourceRoot":"","sources":["../../../src/core/Form/Form.web.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAiB,MAAM,OAAO,CAAC;AAGtC,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,QAAQ,CAAC;AAGxC,eAAO,MAAM,IAAI,GAAI,OAAO,SAAS,sBAgBpC,CAAC"}

package/dist/core/Form/Form.web.js

@@ -9,7 +9,10 @@ export const Form = (props) => {
     const webFormProps = {
         onSubmit: (e) => {
             e.preventDefault();
-            const button = formRef.current?.querySelector('button[role="button"][aria-selected="true"]');
+            const form = formRef.current;
+            if (!(form instanceof HTMLElement))
+                return;
+            const button = form.querySelector('button[role="button"][aria-selected="true"]');
             if (button instanceof HTMLElement)
                 button.click();
         },

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

@@ -4,7 +4,7 @@ declare const _default: {
     experimental: false;
     description: string;
     shortDescription: string;
-    component: ((props: Pick<import("..").BoxProps, "children" | "gap"> & import("../..").SizeStyle & {
+    component: ((props: Pick<import("..").BoxProps, "gap" | "children"> & import("../..").SizeStyle & {
         p?: number | import("@alveole/theme").SpacingKey;
         pl?: number | import("@alveole/theme").SpacingKey;
         pr?: number | import("@alveole/theme").SpacingKey;
@@ -15,10 +15,10 @@ declare const _default: {
         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?: string;
-        borderWidth?: number;
+        backgroundColor?: import("tamagui").ViewProps["backgroundColor"];
+        borderWidth?: import("tamagui").ViewProps["borderWidth"];
         borderRadius?: number | string;
-        borderColor?: string;
+        borderColor?: import("tamagui").ViewProps["borderColor"];
         gap?: number | import("@alveole/theme").SpacingKey;
     }) => import("react").JSX.Element) & {
         Column: (props: import("./Grid").GridColumnProps) => import("react").JSX.Element;

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

@@ -1 +1 @@
-{"version":3,"file":"Highlight.d.ts","sourceRoot":"","sources":["../../../src/core/Highlight/Highlight.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,aAAa,EAAa,MAAM,OAAO,CAAC;AAKxD,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAC;AAMvE,MAAM,MAAM,cAAc,GAAG,IAAI,CAAC,sBAAsB,EAAE,UAAU,CAAC,GAAG;IACtE,QAAQ,EAAE,MAAM,GAAG,YAAY,GAAG,KAAK,GAAG,MAAM,GAAG,MAAM,GAAG,WAAW,GAAG,MAAM,CAAC;IACjF,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB;;;;OAIG;IACH,OAAO,CAAC,EAAE,YAAY,GAAG,UAAU,CAAC;CACrC,CAAC;AAMF,eAAO,MAAM,SAAS,GAAI,wCAAuD,cAAc,sBAwE9F,CAAC"}
+{"version":3,"file":"Highlight.d.ts","sourceRoot":"","sources":["../../../src/core/Highlight/Highlight.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAE,aAAa,EAAa,MAAM,OAAO,CAAC;AAKxD,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAC;AAMvE,MAAM,MAAM,cAAc,GAAG,IAAI,CAAC,sBAAsB,EAAE,UAAU,CAAC,GAAG;IACtE,QAAQ,EAAE,MAAM,GAAG,YAAY,GAAG,KAAK,GAAG,MAAM,GAAG,MAAM,GAAG,WAAW,GAAG,MAAM,CAAC;IACjF,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB;;;;OAIG;IACH,OAAO,CAAC,EAAE,YAAY,GAAG,UAAU,CAAC;CACrC,CAAC;AAMF,eAAO,MAAM,SAAS,GAAI,wCAAuD,cAAc,sBA2E9F,CAAC"}

package/dist/core/Highlight/Highlight.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import React from 'react';
-import { ScrollView, StyleSheet, Text, View } from 'react-native';
+import { Platform, ScrollView, StyleSheet, Text, View } from 'react-native';
 // Le type est importé en `import type` : il est effacé à l'exécution, donc l'index du
 // paquet, qui charge aussi toute la moitié highlight.js, n'est jamais évalué.
 import { CustomPalette, focusRingProps } from '@alveole/theme';
@@ -32,7 +32,10 @@ export const Highlight = ({ children, language, style, variant = 'standalone' })
         }
         return acc;
     }, []);
-    const renderer = ({ rows }) => (_jsx(ScrollView, { horizontal: true, focusable: true, ...focusRingProps(), 
+    const renderer = ({ rows }) => (_jsx(ScrollView, { horizontal: true, focusable: true, 
+        // En natif, ScrollView grandit par défaut. Dans la page défilante du catalogue,
+        // le code doit garder sa hauteur de contenu au lieu de remplir la hauteur disponible.
+        style: Platform.OS === 'web' ? undefined : { flexGrow: 0, flexShrink: 0 }, ...focusRingProps(), 
         // `styles.highlight` pose `overflow: scroll`, ce qui ferait défiler le conteneur de
         // contenu en doublon du `ScrollView` qui l'entoure. C'est ce doublon intérieur qu'axe
         // signalait : il défile sans pouvoir recevoir le focus, que porte l'extérieur.

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

@@ -1 +1 @@
-{"version":3,"file":"Highlight.styles.d.ts","sourceRoot":"","sources":["../../../src/core/Highlight/Highlight.styles.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;CAsBpB,CAAC"}
+{"version":3,"file":"Highlight.styles.d.ts","sourceRoot":"","sources":["../../../src/core/Highlight/Highlight.styles.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;CAsBpB,CAAC"}

package/dist/core/Highlight/Highlight.styles.js

@@ -1,8 +1,9 @@
 import { makeStyles } from '@alveole/theme';
+import { Platform } from 'react-native';
 export const useStyles = makeStyles(({ color, radius, spacingValue }) => {
     const base = {
         overflow: 'scroll',
-        padding: spacingValue('2W'),
+        padding: spacingValue(Platform.OS === 'web' ? '2W' : '1W'),
         width: '100%',
         backgroundColor: color.light.background['alt-grey'],
     };

package/dist/core/Map/useGoogleMap.d.ts

@@ -1,4 +1,5 @@
 import * as React from 'react';
+import type { TamaguiElement } from 'tamagui';
 import { GoogleNamespace } from './googleMaps.types';
 import { LatLng, MapProps } from './Map.props';
 declare global {
@@ -8,6 +9,6 @@ declare global {
 }
 export declare const shouldFitToMarkers: (fitToMarkers: boolean | undefined, center: LatLng | undefined, markersCount: number) => boolean;
 export declare function useGoogleMap(props: MapProps): {
-    containerRef: React.RefObject<HTMLDivElement | null>;
+    containerRef: React.RefObject<TamaguiElement | null>;
 };
 //# sourceMappingURL=useGoogleMap.d.ts.map

package/dist/core/Map/useGoogleMap.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useGoogleMap.d.ts","sourceRoot":"","sources":["../../../src/core/Map/useGoogleMap.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAA2B,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAC9E,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAU,MAAM,aAAa,CAAC;AAEvD,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,MAAM;QACd,MAAM,CAAC,EAAE,eAAe,CAAC;KAC1B;CACF;AAqCD,eAAO,MAAM,kBAAkB,GAC7B,cAAc,OAAO,GAAG,SAAS,EACjC,QAAQ,MAAM,GAAG,SAAS,EAC1B,cAAc,MAAM,KACnB,OAAwD,CAAC;AAqH5D,wBAAgB,YAAY,CAAC,KAAK,EAAE,QAAQ;;EAuC3C"}
+{"version":3,"file":"useGoogleMap.d.ts","sourceRoot":"","sources":["../../../src/core/Map/useGoogleMap.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAC9C,OAAO,EAA2B,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAC9E,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAU,MAAM,aAAa,CAAC;AAEvD,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,MAAM;QACd,MAAM,CAAC,EAAE,eAAe,CAAC;KAC1B;CACF;AAqCD,eAAO,MAAM,kBAAkB,GAC7B,cAAc,OAAO,GAAG,SAAS,EACjC,QAAQ,MAAM,GAAG,SAAS,EAC1B,cAAc,MAAM,KACnB,OAAwD,CAAC;AAsH5D,wBAAgB,YAAY,CAAC,KAAK,EAAE,QAAQ;;EAuC3C"}

package/dist/core/Map/useGoogleMap.js

@@ -89,13 +89,14 @@ function useMapInit({ containerRef, mapRef, center, markers, zoom, mapOptions, r
             await loadGoogleMaps();
             if (cancelled)
                 return;
-            if (!containerRef.current)
+            const container = containerRef.current;
+            if (!(container instanceof HTMLElement))
                 return;
             const google = window.google;
             if (!google?.maps)
                 throw new Error('Google Maps not available on window');
             const initialCenter = center ?? markers[0]?.position ?? { lat: 48.8566, lng: 2.3522 };
-            mapRef.current = new google.maps.Map(containerRef.current, {
+            mapRef.current = new google.maps.Map(container, {
                 center: initialCenter,
                 zoom,
                 clickableIcons: false,

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

@@ -1 +1 @@
-{"version":3,"file":"MarkdownDescription.d.ts","sourceRoot":"","sources":["../../../src/core/MarkdownDescription/MarkdownDescription.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAQ1B,MAAM,MAAM,wBAAwB,GAAG;IACrC,QAAQ,EAAE,MAAM,CAAC;IACjB;;;OAGG;IACH,MAAM,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;IACrB,uFAAuF;IACvF,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,eAAO,MAAM,mBAAmB,GAAI,wCAA+C,wBAAwB,sBAsD1G,CAAC"}
+{"version":3,"file":"MarkdownDescription.d.ts","sourceRoot":"","sources":["../../../src/core/MarkdownDescription/MarkdownDescription.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAQ1B,MAAM,MAAM,wBAAwB,GAAG;IACrC,QAAQ,EAAE,MAAM,CAAC;IACjB;;;OAGG;IACH,MAAM,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;IACrB,uFAAuF;IACvF,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB,CAAC;AAEF,eAAO,MAAM,mBAAmB,GAAI,wCAA+C,wBAAwB,sBAkD1G,CAAC"}

package/dist/core/MarkdownDescription/MarkdownDescription.js

@@ -2,16 +2,13 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { useTheme } from '@alveole/theme';
 import { Platform } from 'react-native';
 import { Box } from '../Box';
-import { Typography } from '../Typography';
 import { createMarkdownComponents } from './markdownComponents';
+import { createNativeMarkdownComponents, preparerMarkdownNatif } from './markdownNatif';
 import { replierLesCoupuresDeLigne } from './replierLesCoupuresDeLigne';
 export const MarkdownDescription = ({ children, taille = 'MD', color: textColor }) => {
     const { text, color } = useTheme();
     const bodyStyle = text['Corps de texte'][taille].Regular;
     const boldStyle = text['Corps de texte'][taille].Bold;
-    if (Platform.OS !== 'web') {
-        return (_jsx(Typography, { style: bodyStyle, color: textColor, children: children }));
-    }
     const ReactMarkdown = require('react-markdown').default;
     const remarkGfm = require('remark-gfm').default;
     const borderColor = color.light.border['default-grey'];
@@ -24,9 +21,7 @@ export const MarkdownDescription = ({ children, taille = 'MD', color: textColor
     // de la couleur) exige qu'un lien au milieu d'un bloc de texte se distingue de son
     // entourage par autre chose que sa seule couleur.
     const linkColor = color.light.text['default-info'];
-    const linkStyle = { textDecoration: 'underline' };
-    const linkHoverStyle = { textDecoration: 'none' };
-    const components = createMarkdownComponents({
+    const styles = {
         bodyStyle,
         boldStyle,
         textColor,
@@ -35,8 +30,7 @@ export const MarkdownDescription = ({ children, taille = 'MD', color: textColor
         borderColor,
         headerBg,
         linkColor,
-        linkStyle,
-        linkHoverStyle,
-    });
-    return (_jsx(Box, { tag: "markdown-description", display: "flex", gap: 8, children: _jsx(ReactMarkdown, { remarkPlugins: [remarkGfm, replierLesCoupuresDeLigne], components: components, children: children }) }));
+    };
+    const components = Platform.OS === 'web' ? createMarkdownComponents(styles) : createNativeMarkdownComponents(styles);
+    return (_jsx(Box, { tag: "markdown-description", display: "flex", gap: 8, 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

@@ -8,7 +8,7 @@ type AvecEnfants = {
     children?: React.ReactNode;
 };
 type TextStyle = Pick<RNTextStyle, 'fontSize' | 'lineHeight' | 'fontWeight' | 'fontFamily' | 'letterSpacing'>;
-type MarkdownComponentsStyles = {
+export type MarkdownComponentsStyles = {
     bodyStyle: TextStyle;
     boldStyle: TextStyle;
     /** Couleur du texte courant, hors titres et liens. Vide garde le gris par defaut. */
@@ -19,12 +19,6 @@ type MarkdownComponentsStyles = {
     borderColor: string;
     headerBg: string;
     linkColor: string;
-    linkStyle: {
-        textDecoration: 'underline';
-    };
-    linkHoverStyle: {
-        textDecoration: 'none';
-    };
 };
 type TextComponentStyles = Pick<MarkdownComponentsStyles, 'bodyStyle' | 'boldStyle' | 'textColor'>;
 export declare const createTextComponents: ({ bodyStyle, boldStyle, textColor }: TextComponentStyles) => {

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;AAGxD,OAAO,EAAa,cAAc,EAAE,MAAM,cAAc,CAAC;AAazD,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,KAAK,wBAAwB,GAAG;IAC9B,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;IAClB,SAAS,EAAE;QAAE,cAAc,EAAE,WAAW,CAAA;KAAE,CAAC;IAC3C,cAAc,EAAE;QAAE,cAAc,EAAE,MAAM,CAAA;KAAE,CAAC;CAC5C,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;AAEH,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;AAgIH,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,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;AAGxD,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;AAEH,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

@@ -3,6 +3,7 @@ import { FOCUS_ATTRIBUTE } from '@alveole/theme';
 import { Box } from '../Box';
 import { Code } from '../Code';
 import { Highlight } from '../Highlight';
+import { soulignementDuLien } from '../styleTamagui/soulignement';
 import { Typography } from '../Typography';
 const HIGHLIGHT_LANGUAGES = [
     'json',
@@ -33,8 +34,8 @@ const createListComponents = (bodyStyle) => ({
     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 })] })),
 });
-const createLinkComponents = ({ linkColor, linkStyle, linkHoverStyle }) => ({
-    a: ({ href, children: c }) => (_jsx(Typography, { tag: "a", href: href, color: linkColor, style: linkStyle, hoverStyle: linkHoverStyle, [FOCUS_ATTRIBUTE]: 'ring', children: c })),
+const createLinkComponents = ({ linkColor }) => ({
+    a: ({ href, children: c }) => (_jsx(Typography, { tag: "a", color: linkColor, textDecorationLine: soulignementDuLien, href, [FOCUS_ATTRIBUTE]: 'ring', children: c })),
 });
 const createBlockComponents = (borderColor) => ({
     pre: ({ children: c }) => _jsx(Box, { display: "flex", children: c }),

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

@@ -0,0 +1,13 @@
+import type { Components } from 'react-markdown';
+import { MarkdownComponentsStyles } from './markdownComponents';
+type Noeud = {
+    type: string;
+    tagName?: string;
+    value?: string;
+    properties?: Record<string, string | number | boolean>;
+    children?: Noeud[];
+};
+export declare const preparerMarkdownNatif: () => (noeud: Noeud) => void;
+export declare const createNativeMarkdownComponents: (styles: MarkdownComponentsStyles) => Components;
+export {};
+//# sourceMappingURL=markdownNatif.d.ts.map

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

@@ -0,0 +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"}

package/dist/core/MarkdownDescription/markdownNatif.js

@@ -0,0 +1,73 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Linking } from 'react-native';
+import { Box } from '../Box';
+import { Typography } from '../Typography';
+import { createMarkdownComponents } from './markdownComponents';
+const CONTENEURS = new Set(['ul', 'ol', 'li', 'blockquote', 'table', 'thead', 'tbody', 'tr', 'section']);
+const BLOCS = new Set(['p', 'ul', 'ol', 'blockquote', 'pre']);
+// Les listes compactes de Markdown ont du texte directement sous `li`. En natif,
+// chaque suite de texte doit être dans un paragraphe, même avant une sous-liste.
+const paragraphesDeListe = (children) => {
+    const resultat = [];
+    let inline = [];
+    const terminer = () => {
+        if (inline.length)
+            resultat.push({ type: 'element', tagName: 'p', properties: {}, children: inline });
+        inline = [];
+    };
+    for (const enfant of children) {
+        if (BLOCS.has(enfant.tagName ?? '')) {
+            terminer();
+            resultat.push(enfant);
+        }
+        else
+            inline.push(enfant);
+    }
+    terminer();
+    return resultat;
+};
+const preparer = (noeud) => {
+    if (!noeud.children)
+        return;
+    // Les retours entre blocs HTML sont décoratifs. Une View native ne peut pas
+    // recevoir ces chaînes de texte, contrairement à un élément DOM.
+    if (noeud.type === 'root' || CONTENEURS.has(noeud.tagName ?? '')) {
+        noeud.children = noeud.children.filter(enfant => enfant.type !== 'text' || !!enfant.value?.trim());
+    }
+    if (noeud.tagName === 'li')
+        noeud.children = paragraphesDeListe(noeud.children);
+    if (noeud.tagName === 'ol') {
+        const debut = Number(noeud.properties?.start ?? 1);
+        noeud.children.forEach((enfant, index) => {
+            enfant.properties = { ...enfant.properties, 'data-marker': `${debut + index}.` };
+        });
+    }
+    noeud.children.forEach(preparer);
+};
+export const preparerMarkdownNatif = () => preparer;
+const tableauxNatifs = ({ bodyStyle, boldStyle, borderColor, headerBg }) => ({
+    table: ({ children }) => (_jsx(Box, { borderWidth: 1, borderColor: borderColor, children: children })),
+    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 }) })),
+});
+export const createNativeMarkdownComponents = (styles) => ({
+    ...createMarkdownComponents(styles),
+    ...tableauxNatifs(styles),
+    section: ({ children }) => _jsx(Box, { style: { gap: 8 }, 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 })] }));
+    },
+    br: () => _jsx(Typography, { children: '\n' }),
+    hr: () => _jsx(Box, { style: { borderTopWidth: 1, borderColor: styles.borderColor } }),
+    del: ({ children }) => _jsx(Typography, { style: { textDecorationLine: 'line-through' }, children: children }),
+    input: ({ checked }) => _jsx(Typography, { children: checked ? '☑ ' : '☐ ' }),
+    img: ({ alt }) => _jsx(Typography, { style: styles.bodyStyle, children: alt }),
+});

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

@@ -40,6 +40,11 @@ export declare const WithPageMetaProvider: () => null;
  * démontre que le scroll se fait bien au sein de la page.
  */
 export declare const WithScrollable: () => import("react").JSX.Element;
+/**
+ * Active le fond en dégradé vertical (`default-grey` → `alt-grey`) via `gradient`.
+ * Désactivé par défaut : le fond est uni.
+ */
+export declare const WithGradient: () => import("react").JSX.Element;
 /**
  * Intégration avec un contrôleur de sidebar via `useSidebar()`.
  *

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

@@ -1 +1 @@
-{"version":3,"file":"Page.stories.d.ts","sourceRoot":"","sources":["../../../src/core/Page/Page.stories.tsx"],"names":[],"mappings":";;;;;;;;;AAIA,wBAUkB;AAElB,eAAO,MAAM,OAAO,mCAInB,CAAC;AAEF,eAAO,MAAM,MAAM,mCAIlB,CAAC;AAEF,eAAO,MAAM,cAAc,mCAI1B,CAAC;AAEF,eAAO,MAAM,gBAAgB,mCAY5B,CAAC;AAEF;;;;;;;;;;;;;;;;;;GAkBG;AACH,eAAO,MAAM,oBAAoB,YAAa,CAAC;AAE/C;;;;;;GAMG;AACH,eAAO,MAAM,cAAc,mCAI1B,CAAC;AAEF;;;;;;;;;;;;;;;GAeG;AACH,eAAO,MAAM,WAAW,YAAa,CAAC;AAEtC,OAAO,KAAK,OAAO,MAAM,wBAAwB,CAAC"}
+{"version":3,"file":"Page.stories.d.ts","sourceRoot":"","sources":["../../../src/core/Page/Page.stories.tsx"],"names":[],"mappings":";;;;;;;;;AAIA,wBAUkB;AAElB,eAAO,MAAM,OAAO,mCAInB,CAAC;AAEF,eAAO,MAAM,MAAM,mCAIlB,CAAC;AAEF,eAAO,MAAM,cAAc,mCAI1B,CAAC;AAEF,eAAO,MAAM,gBAAgB,mCAY5B,CAAC;AAEF;;;;;;;;;;;;;;;;;;GAkBG;AACH,eAAO,MAAM,oBAAoB,YAAa,CAAC;AAE/C;;;;;;GAMG;AACH,eAAO,MAAM,cAAc,mCAI1B,CAAC;AAEF;;;GAGG;AACH,eAAO,MAAM,YAAY,mCAIxB,CAAC;AAEF;;;;;;;;;;;;;;;GAeG;AACH,eAAO,MAAM,WAAW,YAAa,CAAC;AAEtC,OAAO,KAAK,OAAO,MAAM,wBAAwB,CAAC"}

package/dist/core/Page/Page.stories.js

@@ -46,6 +46,11 @@ export const WithPageMetaProvider = () => null;
  * démontre que le scroll se fait bien au sein de la page.
  */
 export const WithScrollable = () => (_jsx(Page, { title: "Page scrollable", scrollable: true, children: _jsx(Typography, { children: "Page avec du scroll." }) }));
+/**
+ * Active le fond en dégradé vertical (`default-grey` → `alt-grey`) via `gradient`.
+ * Désactivé par défaut : le fond est uni.
+ */
+export const WithGradient = () => (_jsx(Page, { title: "Page avec d\u00E9grad\u00E9", gradient: true, children: _jsx(Typography, { children: "Page avec un fond en d\u00E9grad\u00E9." }) }));
 /**
  * Intégration avec un contrôleur de sidebar via `useSidebar()`.
  *

package/dist/core/Page/Page.stories.sources.d.ts

@@ -4,6 +4,7 @@ export declare const WithMetaRobots: () => string;
 export declare const WithMultipleMeta: () => string;
 export declare const WithPageMetaProvider: () => string;
 export declare const WithScrollable: () => string;
+export declare const WithGradient: () => string;
 export declare const WithSidebar: () => string;
 export declare const storySources: {
     readonly Default: () => string;
@@ -12,6 +13,7 @@ export declare const storySources: {
     readonly WithMultipleMeta: () => string;
     readonly WithPageMetaProvider: () => string;
     readonly WithScrollable: () => string;
+    readonly WithGradient: () => string;
     readonly WithSidebar: () => string;
 };
 export type StorySourceName = keyof typeof storySources;

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

@@ -1 +1 @@
-{"version":3,"file":"Page.stories.sources.d.ts","sourceRoot":"","sources":["../../../src/core/Page/Page.stories.sources.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,OAAO,cAAmK,CAAC;AAExL,eAAO,MAAM,MAAM,cAA2O,CAAC;AAE/P,eAAO,MAAM,cAAc,cAAoP,CAAC;AAEhR,eAAO,MAAM,gBAAgB,cAAsa,CAAC;AAEpc,eAAO,MAAM,oBAAoB,cAA0D,CAAC;AAE5F,eAAO,MAAM,cAAc,cAAiK,CAAC;AAE7L,eAAO,MAAM,WAAW,cAAiD,CAAC;AAE1E,eAAO,MAAM,YAAY;;;;;;;;CAQf,CAAC;AAEX,MAAM,MAAM,eAAe,GAAG,MAAM,OAAO,YAAY,CAAC;AAExD,eAAO,MAAM,iBAAiB,EAAE,OAAO,CAAC,MAAM,CAAC,eAAe,EAAE,MAAM,CAAC,CAItE,CAAC"}
+{"version":3,"file":"Page.stories.sources.d.ts","sourceRoot":"","sources":["../../../src/core/Page/Page.stories.sources.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,OAAO,cAAmK,CAAC;AAExL,eAAO,MAAM,MAAM,cAA2O,CAAC;AAE/P,eAAO,MAAM,cAAc,cAAoP,CAAC;AAEhR,eAAO,MAAM,gBAAgB,cAAsa,CAAC;AAEpc,eAAO,MAAM,oBAAoB,cAA0D,CAAC;AAE5F,eAAO,MAAM,cAAc,cAAiK,CAAC;AAE7L,eAAO,MAAM,YAAY,cAAwK,CAAC;AAElM,eAAO,MAAM,WAAW,cAAiD,CAAC;AAE1E,eAAO,MAAM,YAAY;;;;;;;;;CASf,CAAC;AAEX,MAAM,MAAM,eAAe,GAAG,MAAM,OAAO,YAAY,CAAC;AAExD,eAAO,MAAM,iBAAiB,EAAE,OAAO,CAAC,MAAM,CAAC,eAAe,EAAE,MAAM,CAAC,CAKtE,CAAC"}

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

@@ -6,6 +6,7 @@ export const WithMetaRobots = () => "export const WithMetaRobots = () => (\n  <P
 export const WithMultipleMeta = () => "export const WithMultipleMeta = () => (\n  <Page\n    title=\"Page complète\"\n    description=\"Avec plusieurs balises meta\"\n    meta={[\n      { name: 'robots', content: 'noindex, nofollow' },\n      { name: 'author', content: 'Alvéole' },\n      { httpEquiv: 'X-UA-Compatible', content: 'IE=edge' },\n    ]}\n  >\n    <Typography>Page avec plusieurs balises meta personnalisées.</Typography>\n  </Page>\n);";
 export const WithPageMetaProvider = () => "export const WithPageMetaProvider = () => null;";
 export const WithScrollable = () => "export const WithScrollable = () => (\n  <Page title=\"Page scrollable\" scrollable>\n    <Typography>Page avec du scroll.</Typography>\n  </Page>\n);";
+export const WithGradient = () => "export const WithGradient = () => (\n  <Page title=\"Page avec dégradé\" gradient>\n    <Typography>Page avec un fond en dégradé.</Typography>\n  </Page>\n);";
 export const WithSidebar = () => "export const WithSidebar = () => null;";
 export const storySources = {
     Default,
@@ -14,10 +15,12 @@ export const storySources = {
     WithMultipleMeta,
     WithPageMetaProvider,
     WithScrollable,
+    WithGradient,
     WithSidebar,
 };
 export const storyDescriptions = {
     WithPageMetaProvider: "Configure des meta globales pour toutes les pages via `PageMetaProvider` dans `app/_layout.tsx`.\nLes meta du provider sont injectées en premier ; la prop `meta` de chaque `<Page>` les complète ou les écrase.\n\n```tsx\nimport { PageMetaProvider } from '@alveole/components';\n\nexport default function RootLayout() {\n  return (\n    <PageMetaProvider meta={[{ name: 'robots', content: 'noindex, nofollow' }]}>\n      <Stack />\n    </PageMetaProvider>\n  );\n}\n\n// Une page peut surcharger ou ajouter des meta sans répéter le noindex :\n<Page title=\"Ma page\" meta={[{ name: 'author', content: 'Alvéole' }]} />\n```",
     WithScrollable: "Rend la page scrollable via l'attribut `scrollable`. Accepte aussi `mobile-only` ou `desktop-only`\npour limiter le scroll à une plateforme.\n\nCi-dessous, 4 Box de 300px de haut chacune : le contenu dépasse la hauteur de l'écran, ce qui\ndémontre que le scroll se fait bien au sein de la page.",
+    WithGradient: "Active le fond en dégradé vertical (`default-grey` → `alt-grey`) via `gradient`.\nDésactivé par défaut : le fond est uni.",
     WithSidebar: "Intégration avec un contrôleur de sidebar via `useSidebar()`.\n\n```tsx\nconst sidebarController = useSidebar();\nreturn (\n  <Page\n    sideBarController={sidebarController}\n    sidebar={<AdminNavigation sidebarController={sidebarController} />}\n    title=\"Mon titre\"\n  >\n    ...\n  </Page>\n);\n```",
 };