@ds-autonomie/react-native 0.7.3 → 0.7.5

package/CHANGELOG.md

@@ -1,5 +1,18 @@
 # @ds-autonomie/react-native
 
+## 0.7.5
+
+### Patch Changes
+
+- Updated dependencies [33ff2b9]
+  - @ds-autonomie/assets@1.4.4
+
+## 0.7.4
+
+### Patch Changes
+
+- 10277ce: Modification du build suite à la mise à jour de esbuild
+
 ## 0.7.3
 
 ### Patch Changes

package/dist/chunks/chunk.3HDQMMF2.js

@@ -0,0 +1,81 @@
+import {
+  isIOS,
+  placeholderTextColor,
+  plateformStyles,
+  styles
+} from "./chunk.7H4YRP4X.js";
+
+// src/components/searchField/SearchField.tsx
+import React, { useEffect, useState } from "react";
+import {
+  View,
+  TextInput
+} from "react-native";
+import Icon from "react-native-vector-icons/MaterialIcons";
+var INIT_PLACEHOLDER = isIOS ? "Recherche" : "Rechercher un...";
+var SearchField = React.forwardRef(
+  function SearchField2({
+    onChangeText,
+    placeholder = INIT_PLACEHOLDER,
+    style,
+    value = "",
+    disabled = false,
+    ...props
+  }, ref) {
+    const [text, setText] = useState(value);
+    useEffect(
+      function onValueUpdate() {
+        setText(value);
+      },
+      [value]
+    );
+    function handleKeypress(text2) {
+      if (disabled) {
+        return;
+      }
+      onChangeText?.(text2);
+      setText(text2);
+    }
+    return /* @__PURE__ */ React.createElement(
+      View,
+      {
+        style: [
+          style,
+          styles.container,
+          isIOS && styles.iOScontainer,
+          disabled && styles.disabledContainer
+        ]
+      },
+      /* @__PURE__ */ React.createElement(
+        Icon,
+        {
+          name: "search",
+          ...plateformStyles,
+          accessibilityRole: "button",
+          accessibilityLabel: "search"
+        }
+      ),
+      /* @__PURE__ */ React.createElement(
+        TextInput,
+        {
+          ref,
+          ...props,
+          editable: !disabled,
+          accessibilityLabel: "search",
+          accessibilityRole: "search",
+          accessibilityState: { disabled },
+          onChangeText: handleKeypress,
+          placeholder,
+          placeholderTextColor,
+          returnKeyType: "search",
+          style: [styles.input, isIOS ? styles.iOSInput : styles.androidInput],
+          value: text
+        }
+      )
+    );
+  }
+);
+
+export {
+  SearchField
+};

package/dist/chunks/{chunk.B2JV2E47.js → chunk.3SUS24CI.js}

@@ -4,7 +4,7 @@ import {
 } from "./chunk.CZ5Y2AVH.js";
 import {
   Icon
-} from "./chunk.OQSCGAEY.js";
+} from "./chunk.CZOIMFLH.js";
 
 // src/components/toggle/Toggle.tsx
 import React, { useEffect, useState } from "react";
@@ -51,30 +51,38 @@ var Toggle = React.forwardRef(function Toggle2({ value = false, disabled = false
     }),
     [checked]
   );
-  return <Pressable
-    ref={ref}
-    {...restProps}
-    accessibilityLabel="switch"
-    accessibilityRole="switch"
-    accessibilityState={{ checked, disabled }}
-    accessible
-    aria-checked={checked}
-    aria-disabled={disabled}
-    aria-pressed={checked}
-    onPress={handlePress}
-    role="switch"
-    style={[toggleStyle, style]}
-  ><Animated.View
-    accessible={false}
-    focusable={false}
-    style={[styles.circle, toggleAnimatedStyles]}
-  >{checked ? <CheckedIcon /> : <DefaultIcon />}</Animated.View></Pressable>;
+  return /* @__PURE__ */ React.createElement(
+    Pressable,
+    {
+      ref,
+      ...restProps,
+      accessibilityLabel: "switch",
+      accessibilityRole: "switch",
+      accessibilityState: { checked, disabled },
+      accessible: true,
+      "aria-checked": checked,
+      "aria-disabled": disabled,
+      "aria-pressed": checked,
+      onPress: handlePress,
+      role: "switch",
+      style: [toggleStyle, style]
+    },
+    /* @__PURE__ */ React.createElement(
+      Animated.View,
+      {
+        accessible: false,
+        focusable: false,
+        style: [styles.circle, toggleAnimatedStyles]
+      },
+      checked ? /* @__PURE__ */ React.createElement(CheckedIcon, null) : /* @__PURE__ */ React.createElement(DefaultIcon, null)
+    )
+  );
 });
 function CheckedIcon() {
-  return <Icon name="check" color="hsla(120, 1%, 15%, 1)" />;
+  return /* @__PURE__ */ React.createElement(Icon, { name: "check", color: "hsla(120, 1%, 15%, 1)" });
 }
 function DefaultIcon() {
-  return <Icon name="close" color="hsla(0, 0%, 91%, 1)" />;
+  return /* @__PURE__ */ React.createElement(Icon, { name: "close", color: "hsla(0, 0%, 91%, 1)" });
 }
 
 export {

package/dist/chunks/chunk.7T73XPWE.js

@@ -0,0 +1,83 @@
+import {
+  checkboxCheckStyles,
+  checkboxContainerStyles
+} from "./chunk.H2AL2E3A.js";
+import {
+  Icon
+} from "./chunk.CZOIMFLH.js";
+
+// src/components/checkbox/Checkbox.tsx
+import theme from "@ds-autonomie/assets/js/dsa-theme";
+import React, { useEffect, useState } from "react";
+import { Pressable, View } from "react-native";
+var Checkbox = React.forwardRef(function Checkbox2({
+  value = false,
+  disabled = false,
+  error = false,
+  onValueChange,
+  style: styleProps,
+  ...restProps
+}, ref) {
+  const [checked, setChecked] = useState(value);
+  useEffect(
+    function onValueUpdate() {
+      setChecked(value);
+    },
+    [value]
+  );
+  function handlePress() {
+    if (disabled) {
+      return;
+    }
+    onValueChange?.(!checked);
+    setChecked(!checked);
+  }
+  return /* @__PURE__ */ React.createElement(
+    Pressable,
+    {
+      ref,
+      ...restProps,
+      accessibilityLabel: "checkbox",
+      accessibilityRole: "checkbox",
+      accessibilityState: { checked, disabled },
+      accessible: true,
+      "aria-checked": checked,
+      "aria-disabled": disabled,
+      "aria-invalid": error,
+      "aria-pressed": checked,
+      onPress: handlePress,
+      role: "checkbox",
+      hitSlop: 15,
+      style: [
+        styleProps,
+        checkboxContainerStyles.default,
+        checked && checkboxContainerStyles.active,
+        error && checkboxContainerStyles.error,
+        disabled && checkboxContainerStyles.disabled
+      ]
+    },
+    checked && /* @__PURE__ */ React.createElement(
+      View,
+      {
+        style: [
+          checkboxCheckStyles.default,
+          checked && checkboxCheckStyles.active,
+          error && checkboxCheckStyles.error,
+          disabled && checkboxCheckStyles.disabled
+        ]
+      },
+      /* @__PURE__ */ React.createElement(
+        Icon,
+        {
+          name: "check",
+          color: theme.primitives.color.neutral[100],
+          size: 18
+        }
+      )
+    )
+  );
+});
+
+export {
+  Checkbox
+};

package/dist/chunks/chunk.CZOIMFLH.js

@@ -0,0 +1,20 @@
+// src/components/icon/Icon.tsx
+import React, { forwardRef } from "react";
+import MaterialIcons from "react-native-vector-icons/MaterialIcons";
+var Icon = forwardRef(function Icon2({ size = 16, ...restProps }, ref) {
+  return /* @__PURE__ */ React.createElement(
+    MaterialIcons,
+    {
+      ...restProps,
+      ref,
+      size,
+      selectable: false,
+      importantForAccessibility: "no-hide-descendants",
+      accessibilityElementsHidden: true
+    }
+  );
+});
+
+export {
+  Icon
+};

package/dist/chunks/chunk.DBGHHBSM.js

@@ -0,0 +1,52 @@
+import {
+  tabItemStyles
+} from "./chunk.VPRSFOFO.js";
+import {
+  Icon
+} from "./chunk.CZOIMFLH.js";
+
+// src/components/tabs/tabItem/TabItem.tsx
+import theme from "@ds-autonomie/assets/js/dsa-theme";
+import React, { useState } from "react";
+import {
+  Text,
+  Pressable
+} from "react-native";
+var TabItem = React.forwardRef(function TabItem2({ icon, title, active = false, style, ...restProps }, ref) {
+  const [isFocus, setIsFocus] = useState(false);
+  return /* @__PURE__ */ React.createElement(
+    Pressable,
+    {
+      ref,
+      ...restProps,
+      accessibilityLabel: "tab",
+      accessibilityRole: "tab",
+      accessible: true,
+      accessibilityState: {
+        selected: active
+      },
+      role: "tab",
+      onFocus: () => setIsFocus(true),
+      style: [
+        style,
+        tabItemStyles.container,
+        active && tabItemStyles.selected,
+        isFocus && tabItemStyles.focus,
+        active && isFocus && tabItemStyles.focusSelected
+      ]
+    },
+    icon && /* @__PURE__ */ React.createElement(
+      Icon,
+      {
+        name: icon,
+        size: 18,
+        color: active ? theme.collection.tab.selected["on-enabled"] : theme.collection.tab.unselected["on-enabled"]
+      }
+    ),
+    /* @__PURE__ */ React.createElement(Text, { style: [tabItemStyles.text, active && tabItemStyles.selected] }, title)
+  );
+});
+
+export {
+  TabItem
+};

package/dist/chunks/chunk.EWMRU3E4.js

@@ -0,0 +1,67 @@
+import {
+  radioContainerStyles,
+  radioDotStyles
+} from "./chunk.YWEWQ2LT.js";
+
+// src/components/radio/Radio.tsx
+import React, { useEffect, useState } from "react";
+import { Pressable, View } from "react-native";
+var Radio = React.forwardRef(function Checkbox({
+  value = false,
+  disabled = false,
+  onValueChange,
+  style: styleProps,
+  ...restProps
+}, ref) {
+  const [checked, setChecked] = useState(value);
+  useEffect(
+    function onValueUpdate() {
+      setChecked(value);
+    },
+    [value]
+  );
+  function handlePress() {
+    if (disabled || checked) {
+      return;
+    }
+    onValueChange?.(true);
+    setChecked(true);
+  }
+  return /* @__PURE__ */ React.createElement(
+    Pressable,
+    {
+      ref,
+      ...restProps,
+      accessibilityLabel: "radio",
+      accessibilityRole: "radio",
+      accessibilityState: { checked, disabled },
+      accessible: true,
+      "aria-checked": checked,
+      "aria-disabled": disabled,
+      "aria-pressed": checked,
+      onPress: handlePress,
+      hitSlop: 14,
+      role: "radio",
+      style: [
+        styleProps,
+        radioContainerStyles.default,
+        checked && radioContainerStyles.active,
+        disabled && radioContainerStyles.disabled
+      ]
+    },
+    checked && /* @__PURE__ */ React.createElement(
+      View,
+      {
+        style: [
+          radioDotStyles.default,
+          checked && radioDotStyles.active,
+          disabled && radioDotStyles.disabled
+        ]
+      }
+    )
+  );
+});
+
+export {
+  Radio
+};

package/dist/chunks/chunk.ILCOTEXS.js

@@ -0,0 +1,64 @@
+import {
+  styles
+} from "./chunk.DE3QWY2X.js";
+import {
+  Icon
+} from "./chunk.CZOIMFLH.js";
+
+// src/components/listItem/ListItem.tsx
+import theme from "@ds-autonomie/assets/js/dsa-theme";
+import React from "react";
+import {
+  View,
+  Text,
+  Pressable
+} from "react-native";
+var ListItem = React.forwardRef(
+  function ListItem2({
+    label,
+    subtitle,
+    prefix,
+    isLast = false,
+    isFirst = false,
+    suffix,
+    style,
+    inset = false,
+    ...restProps
+  }, ref) {
+    const isLarge = subtitle !== void 0 && subtitle !== "" || suffix !== void 0 || prefix !== void 0 || inset;
+    return /* @__PURE__ */ React.createElement(
+      Pressable,
+      {
+        ref,
+        ...restProps,
+        accessibilityLabel: label,
+        accessible: true,
+        style: [
+          style,
+          styles.container,
+          isLarge && styles.large,
+          isLast && styles.lastItem,
+          inset && styles.inset,
+          inset && isLast && styles.insetLast,
+          inset && isFirst && styles.insetFirst
+        ]
+      },
+      prefix,
+      /* @__PURE__ */ React.createElement(View, { style: { flex: 1 } }, /* @__PURE__ */ React.createElement(Text, { numberOfLines: 1, style: styles.title }, label), subtitle && /* @__PURE__ */ React.createElement(Text, { style: styles.subtitle }, subtitle)),
+      suffix
+    );
+  }
+);
+var ChevronSuffix = ({ title }) => /* @__PURE__ */ React.createElement(View, { style: { flexDirection: "row", alignItems: "center" } }, /* @__PURE__ */ React.createElement(Text, { style: { color: theme.collection["list item"]["end slot"].detail } }, title), /* @__PURE__ */ React.createElement(
+  Icon,
+  {
+    color: theme.collection["list item"]["end slot"].chevron,
+    name: "chevron-right",
+    size: 20
+  }
+));
+ListItem.ChevronSuffix = ChevronSuffix;
+
+export {
+  ListItem
+};

package/dist/chunks/chunk.L65V2F7C.js

@@ -0,0 +1,26 @@
+import {
+  listTitleStyles
+} from "./chunk.523CLSSB.js";
+
+// src/components/listTitle/ListTitle.tsx
+import React from "react";
+import { View, Text } from "react-native";
+var ListTitle = React.forwardRef(
+  function ListTitle2({ style, children, ...restProps }, ref) {
+    return /* @__PURE__ */ React.createElement(
+      View,
+      {
+        ref,
+        ...restProps,
+        accessibilityRole: "text",
+        accessible: true,
+        style: [style, listTitleStyles.container]
+      },
+      /* @__PURE__ */ React.createElement(Text, { style: [listTitleStyles.text] }, children)
+    );
+  }
+);
+
+export {
+  ListTitle
+};

package/dist/chunks/chunk.MU3OHOLM.js

@@ -0,0 +1,26 @@
+import {
+  listCaptionStyles
+} from "./chunk.TWXAL56H.js";
+
+// src/components/listCaption/ListCaption.tsx
+import React from "react";
+import { View, Text } from "react-native";
+var ListCaption = React.forwardRef(
+  function ListCaption2({ style, children, ...restProps }, ref) {
+    return /* @__PURE__ */ React.createElement(
+      View,
+      {
+        ref,
+        ...restProps,
+        accessibilityRole: "text",
+        accessible: true,
+        style: [style, listCaptionStyles.container]
+      },
+      /* @__PURE__ */ React.createElement(Text, { style: [listCaptionStyles.text] }, children)
+    );
+  }
+);
+
+export {
+  ListCaption
+};

package/dist/chunks/{chunk.RNOZ5AW4.js → chunk.MWOLFH57.js}

@@ -9,10 +9,8 @@ var variants = Object.keys(
 var sizes = ["small", "medium"];
 function getIconColor({ pressed, disabled, variant }) {
   const buttonTheme = theme.collection.button[variant];
-  if (disabled)
-    return buttonTheme["on-disabled"];
-  if (pressed)
-    return buttonTheme["on-pressed"];
+  if (disabled) return buttonTheme["on-disabled"];
+  if (pressed) return buttonTheme["on-pressed"];
   return buttonTheme["on-enabled"];
 }
 function getContainerStyle({

package/dist/chunks/chunk.NQYY7B5O.js

@@ -0,0 +1,73 @@
+import {
+  getContainerStyle,
+  getIconColor,
+  getTextStyle
+} from "./chunk.MWOLFH57.js";
+import {
+  Icon
+} from "./chunk.CZOIMFLH.js";
+
+// src/components/button/Button.tsx
+import React from "react";
+import {
+  Pressable,
+  Text
+} from "react-native";
+var Button = React.forwardRef(function Toggle({
+  variant = "primary",
+  style,
+  disabled = false,
+  endIcon,
+  size = "medium",
+  startIcon,
+  children,
+  ...props
+}, ref) {
+  const hasOnlyOneIcon = [!!startIcon, !!endIcon].filter(Boolean).length === 1 && !children;
+  return /* @__PURE__ */ React.createElement(
+    Pressable,
+    {
+      ref,
+      ...props,
+      accessibilityLabel: "button",
+      accessibilityRole: "button",
+      accessible: true,
+      "aria-disabled": disabled,
+      accessibilityState: {
+        disabled
+      },
+      disabled,
+      role: "button",
+      style: ({ pressed }) => [
+        style,
+        getContainerStyle({ variant, size, hasOnlyOneIcon, disabled, pressed })
+      ]
+    },
+    ({ pressed }) => {
+      const iconColor = getIconColor({
+        pressed,
+        disabled,
+        variant
+      });
+      return /* @__PURE__ */ React.createElement(React.Fragment, null, startIcon && /* @__PURE__ */ React.createElement(Icon, { name: startIcon, color: iconColor, size: 24 }), children !== void 0 && /* @__PURE__ */ React.createElement(
+        Text,
+        {
+          style: [
+            getTextStyle({
+              variant,
+              size,
+              hasOnlyOneIcon,
+              disabled,
+              pressed
+            })
+          ]
+        },
+        children
+      ), endIcon && /* @__PURE__ */ React.createElement(Icon, { name: endIcon, color: iconColor, size: 24 }));
+    }
+  );
+});
+
+export {
+  Button
+};

package/dist/chunks/{chunk.I5NPEO25.js → chunk.PCMSFNR4.js}

@@ -91,26 +91,28 @@ var Tabs = ({
     });
   }, [animationRef, tabs, tabItemPositions.current.length]);
   const tabIndicatorWidth = tabItemPositions.current[value]?.width;
-  return <View
-    {...rest}
-    accessibilityRole="tablist"
-    style={[tabsStyles.container, style]}
-    onLayout={({ nativeEvent: { layout } }) => {
-      setTabContainerWidth(layout.width);
-    }}
-  >{React.createElement(
-    scrollable ? ScrollView : React.Fragment,
+  return /* @__PURE__ */ React.createElement(
+    View,
     {
-      ...scrollable && {
-        horizontal: true,
-        ref: scrollViewRef,
-        onScroll: onScrollHandler,
-        scrollEventThrottle: 1,
-        showsHorizontalScrollIndicator: false
+      ...rest,
+      accessibilityRole: "tablist",
+      style: [tabsStyles.container, style],
+      onLayout: ({ nativeEvent: { layout } }) => {
+        setTabContainerWidth(layout.width);
       }
     },
-    <>
-      {tabs.map(
+    React.createElement(
+      scrollable ? ScrollView : React.Fragment,
+      {
+        ...scrollable && {
+          horizontal: true,
+          ref: scrollViewRef,
+          onScroll: onScrollHandler,
+          scrollEventThrottle: 1,
+          showsHorizontalScrollIndicator: false
+        }
+      },
+      /* @__PURE__ */ React.createElement(React.Fragment, null, tabs.map(
         (tab, index) => React.cloneElement(tab, {
           onPress: () => onChange(index),
           onLayout: (event) => {
@@ -123,23 +125,25 @@ var Tabs = ({
           },
           active: index === value
         })
-      )}
-      <Animated.View
-        style={[
-          tabsStyles.indicator,
-          {
-            backgroundColor: theme.collection.tab.selected["on-enabled"],
-            transform: [
-              {
-                translateX: indicatorTransitionInterpolate ?? 0
-              }
-            ],
-            width: tabIndicatorWidth
-          }
-        ]}
-      />
-    </>
-  )}</View>;
+      ), /* @__PURE__ */ React.createElement(
+        Animated.View,
+        {
+          style: [
+            tabsStyles.indicator,
+            {
+              backgroundColor: theme.collection.tab.selected["on-enabled"],
+              transform: [
+                {
+                  translateX: indicatorTransitionInterpolate ?? 0
+                }
+              ],
+              width: tabIndicatorWidth
+            }
+          ]
+        }
+      ))
+    )
+  );
 };
 
 export {