@alveole/components 2.0.0-alpha.24 → 2.0.0-alpha.27

package/dist/ui/FormControl/TextInputPassword.d.ts

@@ -1,5 +1,8 @@
 import React from 'react';
+import { LucideIconName } from '../LucideIcon/LucideIcon.props';
 import { TextInputElement } from './TextInput.types';
+/** L'oeil montre l'action et non l'etat : ouvert pour reveler, barre pour masquer. */
+export declare const iconeDeLOeil: (masque: boolean) => LucideIconName;
 /** Le mot de passe : une saisie ordinaire, masquee, qu'un oeil permet de reveler. */
 export declare const TextInputPassword: React.ForwardRefExoticComponent<Omit<import("react-native").TextInputProps, "style"> & {
     type?: "text" | "email" | "tel" | "password";

package/dist/ui/FormControl/TextInputPassword.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TextInputPassword.d.ts","sourceRoot":"","sources":["../../../src/ui/FormControl/TextInputPassword.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAE,gBAAgB,EAAkB,MAAM,mBAAmB,CAAC;AAYrE,qFAAqF;AACrF,eAAO,MAAM,iBAAiB;;;;;;;;;;;0CAyB7B,CAAC"}
+{"version":3,"file":"TextInputPassword.d.ts","sourceRoot":"","sources":["../../../src/ui/FormControl/TextInputPassword.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,OAAO,EAAE,cAAc,EAAE,MAAM,gCAAgC,CAAC;AAChE,OAAO,EAAE,gBAAgB,EAAkB,MAAM,mBAAmB,CAAC;AAYrE,sFAAsF;AACtF,eAAO,MAAM,YAAY,GAAI,QAAQ,OAAO,KAAG,cAA6C,CAAC;AAE7F,qFAAqF;AACrF,eAAO,MAAM,iBAAiB;;;;;;;;;;;0CAyB7B,CAAC"}

package/dist/ui/FormControl/TextInputPassword.js

@@ -11,8 +11,10 @@ const boutonAccole = {
     paddingTop: 0,
     paddingBottom: 0,
 };
+/** L'oeil montre l'action et non l'etat : ouvert pour reveler, barre pour masquer. */
+export const iconeDeLOeil = (masque) => (masque ? 'Eye' : 'EyeOff');
 /** Le mot de passe : une saisie ordinaire, masquee, qu'un oeil permet de reveler. */
 export const TextInputPassword = React.forwardRef(function TextInputPassword(props, ref) {
     const [masque, setMasque] = React.useState(true);
-    return (_jsx(TextInputInline, { secureTextEntry: masque, autoComplete: "current-password", textContentType: "password", autoCapitalize: "none", endAdornment: _jsx(ButtonIcon, { size: "sm", variant: "tertiary", style: boutonAccole, icon: masque ? 'EyeClosed' : 'Eye', accessibilityLabel: masque ? 'Afficher le mot de passe' : 'Masquer le mot de passe', onPress: () => setMasque(actuel => !actuel) }), ...props, ref: ref }));
+    return (_jsx(TextInputInline, { secureTextEntry: masque, autoComplete: "current-password", textContentType: "password", autoCapitalize: "none", endAdornment: _jsx(ButtonIcon, { size: "sm", variant: "tertiary", style: boutonAccole, icon: iconeDeLOeil(masque), accessibilityLabel: masque ? 'Afficher le mot de passe' : 'Masquer le mot de passe', onPress: () => setMasque(actuel => !actuel) }), ...props, ref: ref }));
 });

package/dist/ui/Switch/Switch.d.ts

@@ -8,7 +8,10 @@ export type SwitchProps = Omit<TamaguiSwitchProps, 'value' | 'onChange'> & {
     error?: string;
     success?: string;
     noPadding?: boolean;
+    /** `md` par défaut ; `lg` reprend la taille d'avant la 2.0. */
+    size?: SwitchTaille;
 };
+export type SwitchTaille = 'sm' | 'md' | 'lg';
 export declare const Switch: React.ForwardRefExoticComponent<Omit<TamaguiSwitchProps, "onChange" | "value"> & {
     id?: string;
     label?: string;
@@ -16,5 +19,7 @@ export declare const Switch: React.ForwardRefExoticComponent<Omit<TamaguiSwitchP
     error?: string;
     success?: string;
     noPadding?: boolean;
+    /** `md` par défaut ; `lg` reprend la taille d'avant la 2.0. */
+    size?: SwitchTaille;
 } & React.RefAttributes<TamaguiElement>>;
 //# sourceMappingURL=Switch.d.ts.map

package/dist/ui/Switch/Switch.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Switch.d.ts","sourceRoot":"","sources":["../../../src/ui/Switch/Switch.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,aAAa,EAAS,MAAM,OAAO,CAAC;AAEpD,OAAO,EAAE,cAAc,EAA2B,WAAW,IAAI,kBAAkB,EAAE,MAAM,SAAS,CAAC;AASrG,MAAM,MAAM,aAAa,GAAG,cAAc,CAAC;AAC3C,MAAM,MAAM,WAAW,GAAG,IAAI,CAAC,kBAAkB,EAAE,OAAO,GAAG,UAAU,CAAC,GAAG;IACzE,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB,CAAC;AA4BF,eAAO,MAAM,MAAM;SAlCZ,MAAM;YACH,MAAM;YACN,aAAa;YACb,MAAM;cACJ,MAAM;gBACJ,OAAO;wCA6FnB,CAAC"}
+{"version":3,"file":"Switch.d.ts","sourceRoot":"","sources":["../../../src/ui/Switch/Switch.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,EAAE,aAAa,EAAS,MAAM,OAAO,CAAC;AAEpD,OAAO,EAAE,cAAc,EAA2B,WAAW,IAAI,kBAAkB,EAAE,MAAM,SAAS,CAAC;AASrG,MAAM,MAAM,aAAa,GAAG,cAAc,CAAC;AAC3C,MAAM,MAAM,WAAW,GAAG,IAAI,CAAC,kBAAkB,EAAE,OAAO,GAAG,UAAU,CAAC,GAAG;IACzE,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,KAAK,CAAC,EAAE,aAAa,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,+DAA+D;IAC/D,IAAI,CAAC,EAAE,YAAY,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,YAAY,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAuC9C,eAAO,MAAM,MAAM;SAjDZ,MAAM;YACH,MAAM;YACN,aAAa;YACb,MAAM;cACJ,MAAM;gBACJ,OAAO;IACnB,+DAA+D;WACxD,YAAY;wCA+GnB,CAAC"}

package/dist/ui/Switch/Switch.js

@@ -15,24 +15,28 @@ const SwitchLabel = ({ id, checked, disabled, onChange, children }) => Platform.
 // 4 px pour le padding et la bordure qu'Alveole pose de chaque cote. La v2 ne compte plus ces
 // 4 px, et le pouce debordait de sa piste. La taille de reference etait le token `$true` de la
 // config de l'application, 44 px ; la config v5 de Tamagui v3 ne le fournit plus, Alveole la fixe.
-const POUCE = Math.round(44 * 0.65);
-const DIMENSIONS_DE_LA_PISTE = { width: 2 * POUCE + 4, height: POUCE + 4, minHeight: POUCE + 4 };
+// `lg` garde ce pouce historique ; `md` et `sm` le réduisent.
+const POUCES = { sm: 16, md: 22, lg: Math.round(44 * 0.65) };
+const dimensionsDeLaPiste = (pouce) => ({ width: 2 * pouce + 4, height: pouce + 4, minHeight: pouce + 4 });
+// En mode contrôlé, `checked` fait foi et l'état local reste inutilisé.
+const useValeur = (checked, onCheckedChange) => {
+    const [model, setModel] = React.useState(Boolean(checked));
+    const onChange = (newValue) => {
+        setModel(newValue);
+        onCheckedChange?.(newValue);
+    };
+    return [checked ?? model, onChange];
+};
 export const Switch = React.forwardRef(function Switch(props, ref) {
-    const { checked, style, label, error, success, disabled, noPadding, onCheckedChange, ...switchProps } = props;
+    const { checked, style, label, error, success, disabled, noPadding, size = 'md', onCheckedChange, ...switchProps } = props;
     let { id } = props;
-    const isControlled = checked !== undefined;
-    const [model, setModel] = React.useState(Boolean(checked));
-    const value = isControlled ? checked : model;
+    const [value, onChange] = useValeur(checked, onCheckedChange);
     const styles = useStyles();
+    const pouceTaille = POUCES[size];
     const uniqId = useId();
     id = id || `switch--${uniqId}`;
-    const onChange = (newValue) => {
-        if (!isControlled)
-            setModel(newValue);
-        onCheckedChange?.(newValue);
-    };
     const { bouton, pouce, libelle } = apparenceDuSwitch(styles, { value, disabled, noPadding, style });
-    const Toggle = (_jsx(TamaguiSwitch, { id: id, ref: ref, borderWidth: 1, ...DIMENSIONS_DE_LA_PISTE, checked: value, onCheckedChange: onChange, style: bouton, disabled: disabled, accessibilityLabel: label, accessibilityRole: "switch", accessibilityState: { checked: Boolean(value), disabled: Boolean(disabled) }, ...focusRingProps(), ...switchProps, children: _jsx(TamaguiSwitch.Thumb, { ...animer('quicker'), width: POUCE, height: POUCE, style: pouce }) }));
+    const Toggle = (_jsx(TamaguiSwitch, { id: id, ref: ref, borderWidth: 1, ...dimensionsDeLaPiste(pouceTaille), checked: value, onCheckedChange: onChange, style: bouton, disabled: disabled, accessibilityLabel: label, accessibilityRole: "switch", accessibilityState: { checked: Boolean(value), disabled: Boolean(disabled) }, ...focusRingProps(), ...switchProps, children: _jsx(TamaguiSwitch.Thumb, { ...animer('quicker'), width: pouceTaille, height: pouceTaille, style: pouce }) }));
     const ToggleWithLabel = (_jsxs(_Fragment, { children: [_jsx(SwitchLabel, { id: id, checked: value, disabled: disabled, onChange: onChange, children: _jsxs(Box, { tag: "switch", style: styles.switch, children: [Toggle, !!label && (_jsx(Typography, { htmlFor: id, style: libelle, children: label }))] }) }), (error ?? success) && _jsx(FormControlCaption, { error: error, success: success })] }));
     return (_jsx(Box, { tag: "switch", gap: error || success ? '1W' : '0V', style: styles.switchContainer, children: !label ? Toggle : ToggleWithLabel }));
 });

package/dist/ui/Switch/Switch.stories.d.ts

@@ -10,6 +10,7 @@ declare const _default: {
         error?: string;
         success?: string;
         noPadding?: boolean;
+        size?: import("./Switch").SwitchTaille;
     } & import("react").RefAttributes<import("tamagui").TamaguiElement>>;
     styleFn: () => {
         switchContainer: {};
@@ -24,7 +25,6 @@ declare const _default: {
             backgroundColor: import("@alveole/theme").ThemeColor;
             cursor: "pointer";
             padding: number;
-            minHeight: string | number;
             marginTop: string;
             marginBottom: string;
         };
@@ -70,6 +70,7 @@ declare const _default: {
 };
 export default _default;
 export declare const Default: () => import("react").JSX.Element;
+export declare const Sizes: () => import("react").JSX.Element;
 export declare const Controlled: () => import("react").JSX.Element;
 export * as Sources from './Switch.stories.sources';
 //# sourceMappingURL=Switch.stories.d.ts.map

package/dist/ui/Switch/Switch.stories.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Switch.stories.d.ts","sourceRoot":"","sources":["../../../src/ui/Switch/Switch.stories.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAMA,wBAOkB;AAElB,eAAO,MAAM,OAAO,mCAOnB,CAAC;AAEF,eAAO,MAAM,UAAU,mCAGtB,CAAC;AAEF,OAAO,KAAK,OAAO,MAAM,0BAA0B,CAAC"}
+{"version":3,"file":"Switch.stories.d.ts","sourceRoot":"","sources":["../../../src/ui/Switch/Switch.stories.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAMA,wBAOkB;AAElB,eAAO,MAAM,OAAO,mCAOnB,CAAC;AAEF,eAAO,MAAM,KAAK,mCAMjB,CAAC;AAEF,eAAO,MAAM,UAAU,mCAGtB,CAAC;AAEF,OAAO,KAAK,OAAO,MAAM,0BAA0B,CAAC"}

package/dist/ui/Switch/Switch.stories.js

@@ -12,6 +12,7 @@ export default {
     styleFn: useStyles,
 };
 export const Default = () => (_jsxs(Box, { display: "flex", flexDirection: "column", gap: "3W", children: [_jsx(Switch, { label: "Non activ\u00E9" }), _jsx(Switch, { label: "Activ\u00E9", checked: true }), _jsx(Switch, { label: "D\u00E9sactiv\u00E9", disabled: true }), _jsx(Switch, { label: "Activ\u00E9 d\u00E9sactiv\u00E9", checked: true, disabled: true })] }));
+export const Sizes = () => (_jsxs(Box, { display: "flex", flexDirection: "column", gap: "3W", children: [_jsx(Switch, { label: "Sm", size: "sm", checked: true }), _jsx(Switch, { label: "Md", size: "md", checked: true }), _jsx(Switch, { label: "Lg", size: "lg", checked: true })] }));
 export const Controlled = () => {
     const [value, setValue] = useState(false);
     return _jsx(Switch, { label: value ? 'Activé' : 'Désactivé', checked: value, onCheckedChange: v => setValue(!!v) });

package/dist/ui/Switch/Switch.stories.sources.d.ts

@@ -1,7 +1,9 @@
 export declare const Default: () => string;
+export declare const Sizes: () => string;
 export declare const Controlled: () => string;
 export declare const storySources: {
     readonly Default: () => string;
+    readonly Sizes: () => string;
     readonly Controlled: () => string;
 };
 export type StorySourceName = keyof typeof storySources;

package/dist/ui/Switch/Switch.stories.sources.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Switch.stories.sources.d.ts","sourceRoot":"","sources":["../../../src/ui/Switch/Switch.stories.sources.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,OAAO,cAA4S,CAAC;AAEjU,eAAO,MAAM,UAAU,cAAgN,CAAC;AAExO,eAAO,MAAM,YAAY;;;CAGf,CAAC;AAEX,MAAM,MAAM,eAAe,GAAG,MAAM,OAAO,YAAY,CAAC"}
+{"version":3,"file":"Switch.stories.sources.d.ts","sourceRoot":"","sources":["../../../src/ui/Switch/Switch.stories.sources.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,OAAO,cAA4S,CAAC;AAEjU,eAAO,MAAM,KAAK,cAAsQ,CAAC;AAEzR,eAAO,MAAM,UAAU,cAAgN,CAAC;AAExO,eAAO,MAAM,YAAY;;;;CAIf,CAAC;AAEX,MAAM,MAAM,eAAe,GAAG,MAAM,OAAO,YAAY,CAAC"}

package/dist/ui/Switch/Switch.stories.sources.js

@@ -1,8 +1,10 @@
 // This file is generated. Do not edit manually.
 // Source: src/ui/Switch/Switch.stories.tsx
 export const Default = () => "export const Default = () => (\n  <Box display=\"flex\" flexDirection=\"column\" gap=\"3W\">\n    <Switch label=\"Non activé\" />\n    <Switch label=\"Activé\" checked />\n    <Switch label=\"Désactivé\" disabled />\n    <Switch label=\"Activé désactivé\" checked disabled />\n  </Box>\n);";
+export const Sizes = () => "export const Sizes = () => (\n  <Box display=\"flex\" flexDirection=\"column\" gap=\"3W\">\n    <Switch label=\"Sm\" size=\"sm\" checked />\n    <Switch label=\"Md\" size=\"md\" checked />\n    <Switch label=\"Lg\" size=\"lg\" checked />\n  </Box>\n);";
 export const Controlled = () => "export const Controlled = () => {\n  const [value, setValue] = useState(false);\n  return <Switch label={value ? 'Activé' : 'Désactivé'} checked={value} onCheckedChange={v => setValue(!!v)} />;\n};";
 export const storySources = {
     Default,
+    Sizes,
     Controlled,
 };

package/dist/ui/Switch/Switch.styles.d.ts

@@ -11,7 +11,6 @@ export declare const useStyles: () => {
         backgroundColor: import("@alveole/theme").ThemeColor;
         cursor: "pointer";
         padding: number;
-        minHeight: string | number;
         marginTop: string;
         marginBottom: string;
     };

package/dist/ui/Switch/Switch.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Switch.styles.d.ts","sourceRoot":"","sources":["../../../src/ui/Switch/Switch.styles.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAoDnB,CAAC"}
+{"version":3,"file":"Switch.styles.d.ts","sourceRoot":"","sources":["../../../src/ui/Switch/Switch.styles.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAmDnB,CAAC"}

package/dist/ui/Switch/Switch.styles.js

@@ -13,7 +13,6 @@ export const useStyles = makeStyles(({ text, color, spacing }) => ({
         backgroundColor: color.background.default,
         cursor: 'pointer',
         padding: 1,
-        minHeight: spacing('4W'),
         marginTop: 'auto',
         marginBottom: 'auto',
     },
@@ -33,7 +32,7 @@ export const useStyles = makeStyles(({ text, color, spacing }) => ({
         boxShadow: 'none',
     },
     switchThumbChecked: {
-        backgroundColor: color.primary,
+        backgroundColor: color.light.background['action-high-primary'],
     },
     switchThumbDisabled: {
         backgroundColor: color.background['disabled-grey'],

package/package.json

@@ -1,7 +1,12 @@
 {
   "name": "@alveole/components",
-  "version": "2.0.0-alpha.24",
+  "version": "2.0.0-alpha.27",
   "description": "Shared UI components.",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/captive-studio/alveole-js.git",
+    "directory": "packages/components"
+  },
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "exports": {
@@ -28,28 +33,28 @@
     "@react-native-community/datetimepicker": "9.2.1",
     "@react-native/jest-preset": "0.88.0",
     "@shopify/flash-list": "2.3.2",
-    "@tamagui/core": "3.1.10",
-    "@tamagui/toast": "3.1.10",
+    "@tamagui/core": "3.2.3",
+    "@tamagui/toast": "3.2.3",
     "@testing-library/react": "16.3.3",
     "@testing-library/react-native": "14.1.0",
     "@types/react-syntax-highlighter": "15.5.13",
     "babel-preset-expo": "58.0.20",
     "eslint": "10.14.0",
-    "expo": "58.0.22",
+    "expo": "58.0.23",
     "expo-application": "58.1.2",
-    "expo-asset": "58.0.19",
+    "expo-asset": "58.0.20",
     "expo-document-picker": "58.0.4",
     "expo-image-picker": "58.0.10",
     "expo-in-app-updates": "0.13.0",
     "expo-linear-gradient": "58.0.3",
-    "expo-modules-core": "58.0.29",
-    "expo-router": "58.0.29",
+    "expo-modules-core": "58.0.30",
+    "expo-router": "58.0.30",
     "expo-system-ui": "58.0.7",
     "expo-web-browser": "58.0.7",
     "jest": "29.7.0",
     "jest-environment-jsdom": "30.5.2",
     "jest-expo": "58.0.12",
-    "pdfjs-dist": "6.4.299",
+    "pdfjs-dist": "6.5.438",
     "react": "19.3.0",
     "react-dom": "19.3.0",
     "react-native": "0.88.1",
@@ -58,7 +63,7 @@
     "react-native-web": "0.21.4",
     "react-select": "5.10.2",
     "react-syntax-highlighter": "16.1.2",
-    "tamagui": "3.1.10",
+    "tamagui": "3.2.3",
     "test-renderer": "1.3.1"
   },
   "dependencies": {