@wasto/cms-components 1.5.15 → 1.5.18

package/dist/index.d.mts

@@ -95,9 +95,11 @@ type AppHeaderLogoElement = {
     id: string;
     type: "logo";
     slot: AppHeaderSlot;
-    sourceType: "url" | "media";
+    sourceType: "url" | "media" | "bundled";
     url?: string;
     mediaId?: string;
+    /** `require(...)` d’un asset embarqué à l’export (ImageSource). */
+    module?: number;
 };
 type AppHeaderTitleElement = {
     id: string;
@@ -133,15 +135,20 @@ type HeaderProps = {
         canGoBack: () => boolean;
         goBack: () => void;
     };
-    /** Flotte au-dessus du contenu (ex. carte) : fond transparent. */
+    /** Flotte au-dessus du contenu (ex. carte) : fond transparent + safe-area top. */
     readonly overlay?: boolean;
     /**
      * Config layout (`header.elements`) — logo / actions.
      * Si fournie (même vide), le fallback titre d’écran ne s’applique pas.
      */
     readonly headerConfig?: AppHeaderConfig | null;
+    /**
+     * Padding safe-area top. Défaut `true` (header custom RN = edge-to-edge,
+     * il faut l’inset). Passer `false` seulement si le parent inset déjà.
+     */
+    readonly safeTop?: boolean;
 };
-declare function Header({ options, route, navigation, overlay, headerConfig, }: HeaderProps): ReactNode;
+declare function Header({ options, route, navigation, overlay, headerConfig, safeTop, }: HeaderProps): ReactNode;
 
 type LocationsMapProps = {
     fullScreen?: boolean;

package/dist/index.d.ts

@@ -95,9 +95,11 @@ type AppHeaderLogoElement = {
     id: string;
     type: "logo";
     slot: AppHeaderSlot;
-    sourceType: "url" | "media";
+    sourceType: "url" | "media" | "bundled";
     url?: string;
     mediaId?: string;
+    /** `require(...)` d’un asset embarqué à l’export (ImageSource). */
+    module?: number;
 };
 type AppHeaderTitleElement = {
     id: string;
@@ -133,15 +135,20 @@ type HeaderProps = {
         canGoBack: () => boolean;
         goBack: () => void;
     };
-    /** Flotte au-dessus du contenu (ex. carte) : fond transparent. */
+    /** Flotte au-dessus du contenu (ex. carte) : fond transparent + safe-area top. */
     readonly overlay?: boolean;
     /**
      * Config layout (`header.elements`) — logo / actions.
      * Si fournie (même vide), le fallback titre d’écran ne s’applique pas.
      */
     readonly headerConfig?: AppHeaderConfig | null;
+    /**
+     * Padding safe-area top. Défaut `true` (header custom RN = edge-to-edge,
+     * il faut l’inset). Passer `false` seulement si le parent inset déjà.
+     */
+    readonly safeTop?: boolean;
 };
-declare function Header({ options, route, navigation, overlay, headerConfig, }: HeaderProps): ReactNode;
+declare function Header({ options, route, navigation, overlay, headerConfig, safeTop, }: HeaderProps): ReactNode;
 
 type LocationsMapProps = {
     fullScreen?: boolean;

package/dist/index.js

@@ -8264,6 +8264,7 @@ var DEFAULT_HEADER_ACTIONS = [
   }
 ];
 function resolveLogoUri(apiUrl, el) {
+  if (el.sourceType === "bundled") return null;
   const url = (el.url || "").trim();
   if (url) return url;
   if (el.sourceType === "media" || el.mediaId) {
@@ -8286,6 +8287,17 @@ function HeaderLogo({
   element
 }) {
   const { apiUrl } = useWasto();
+  if (element.sourceType === "bundled" && element.module != null) {
+    return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
+      import_react_native34.Image,
+      {
+        source: element.module,
+        style: styles29.logo,
+        resizeMode: "contain",
+        accessibilityLabel: "Logo"
+      }
+    );
+  }
   const uri = resolveLogoUri(apiUrl, element);
   if (!uri) return null;
   return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(HeaderLogoImage, { uri });
@@ -8295,8 +8307,10 @@ function CityLogoFallback() {
   const appData = useOptionalAppData();
   const logoMediaId = typeof appData?.city?.logoMediaId === "string" ? appData.city.logoMediaId : null;
   const uri = publicMediaUrl(apiUrl, logoMediaId);
-  if (!uri) return null;
-  return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(HeaderLogoImage, { uri });
+  if (uri) return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(HeaderLogoImage, { uri });
+  const cityName = typeof appData?.city?.name === "string" ? appData.city.name.trim() : "";
+  if (cityName) return /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(Title, { text: cityName, level: "1" });
+  return null;
 }
 function HeaderActionButton({
   onPress,
@@ -8320,14 +8334,17 @@ function Header({
   route,
   navigation,
   overlay = false,
-  headerConfig
+  headerConfig,
+  safeTop
 }) {
   const { theme } = useTheme();
   const t = resolveTheme(theme);
   const themedStyles = createThemedStyles14(theme);
-  const topInset = useSafeAreaPadding(["top"]);
+  const applyTopInset = safeTop ?? true;
+  const topInset = useSafeAreaPadding(applyTopInset ? ["top"] : []);
   const { hasUnread } = useAnnouncements();
   const { push } = useAppNavigation();
+  const { apiUrl } = useWasto();
   const screenTitle = (0, import_react35.useMemo)(
     () => options.title ?? route.name,
     [options.title, route.name]
@@ -8338,7 +8355,11 @@ function Header({
     return raw.filter((el) => el.type !== "title");
   }, [headerConfig]);
   const hasCustomActions = elements.some((el) => el.type === "action");
-  const hasLogo = elements.some((el) => el.type === "logo");
+  const hasResolvableLogo = elements.some((el) => {
+    if (el.type !== "logo") return false;
+    if (el.sourceType === "bundled" && el.module != null) return true;
+    return resolveLogoUri(apiUrl, el) != null;
+  });
   const bySlot = (0, import_react35.useMemo)(() => {
     const left = [];
     const center = [];
@@ -8461,7 +8482,7 @@ function Header({
             }
           ) : null,
           bySlot.left.map(renderElement),
-          !hasLogo ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(CityLogoFallback, {}) : null
+          !hasResolvableLogo ? /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(CityLogoFallback, {}) : null
         ] }),
         /* @__PURE__ */ (0, import_jsx_runtime41.jsx)(
           import_react_native34.View,

package/dist/index.mjs

@@ -8342,6 +8342,7 @@ var DEFAULT_HEADER_ACTIONS = [
   }
 ];
 function resolveLogoUri(apiUrl, el) {
+  if (el.sourceType === "bundled") return null;
   const url = (el.url || "").trim();
   if (url) return url;
   if (el.sourceType === "media" || el.mediaId) {
@@ -8364,6 +8365,17 @@ function HeaderLogo({
   element
 }) {
   const { apiUrl } = useWasto();
+  if (element.sourceType === "bundled" && element.module != null) {
+    return /* @__PURE__ */ jsx41(
+      Image11,
+      {
+        source: element.module,
+        style: styles29.logo,
+        resizeMode: "contain",
+        accessibilityLabel: "Logo"
+      }
+    );
+  }
   const uri = resolveLogoUri(apiUrl, element);
   if (!uri) return null;
   return /* @__PURE__ */ jsx41(HeaderLogoImage, { uri });
@@ -8373,8 +8385,10 @@ function CityLogoFallback() {
   const appData = useOptionalAppData();
   const logoMediaId = typeof appData?.city?.logoMediaId === "string" ? appData.city.logoMediaId : null;
   const uri = publicMediaUrl(apiUrl, logoMediaId);
-  if (!uri) return null;
-  return /* @__PURE__ */ jsx41(HeaderLogoImage, { uri });
+  if (uri) return /* @__PURE__ */ jsx41(HeaderLogoImage, { uri });
+  const cityName = typeof appData?.city?.name === "string" ? appData.city.name.trim() : "";
+  if (cityName) return /* @__PURE__ */ jsx41(Title, { text: cityName, level: "1" });
+  return null;
 }
 function HeaderActionButton({
   onPress,
@@ -8398,14 +8412,17 @@ function Header({
   route,
   navigation,
   overlay = false,
-  headerConfig
+  headerConfig,
+  safeTop
 }) {
   const { theme } = useTheme();
   const t = resolveTheme(theme);
   const themedStyles = createThemedStyles14(theme);
-  const topInset = useSafeAreaPadding(["top"]);
+  const applyTopInset = safeTop ?? true;
+  const topInset = useSafeAreaPadding(applyTopInset ? ["top"] : []);
   const { hasUnread } = useAnnouncements();
   const { push } = useAppNavigation();
+  const { apiUrl } = useWasto();
   const screenTitle = useMemo20(
     () => options.title ?? route.name,
     [options.title, route.name]
@@ -8416,7 +8433,11 @@ function Header({
     return raw.filter((el) => el.type !== "title");
   }, [headerConfig]);
   const hasCustomActions = elements.some((el) => el.type === "action");
-  const hasLogo = elements.some((el) => el.type === "logo");
+  const hasResolvableLogo = elements.some((el) => {
+    if (el.type !== "logo") return false;
+    if (el.sourceType === "bundled" && el.module != null) return true;
+    return resolveLogoUri(apiUrl, el) != null;
+  });
   const bySlot = useMemo20(() => {
     const left = [];
     const center = [];
@@ -8539,7 +8560,7 @@ function Header({
             }
           ) : null,
           bySlot.left.map(renderElement),
-          !hasLogo ? /* @__PURE__ */ jsx41(CityLogoFallback, {}) : null
+          !hasResolvableLogo ? /* @__PURE__ */ jsx41(CityLogoFallback, {}) : null
         ] }),
         /* @__PURE__ */ jsx41(
           View29,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@wasto/cms-components",
-  "version": "1.5.15",
+  "version": "1.5.18",
   "description": "Wast'O CMS React Native components",
   "main": "./src/index.ts",
   "module": "./src/index.ts",

package/src/components/header/Header.tsx

@@ -27,9 +27,11 @@ export type AppHeaderLogoElement = {
     id: string;
     type: "logo";
     slot: AppHeaderSlot;
-    sourceType: "url" | "media";
+    sourceType: "url" | "media" | "bundled";
     url?: string;
     mediaId?: string;
+    /** `require(...)` d’un asset embarqué à l’export (ImageSource). */
+    module?: number;
 };
 
 export type AppHeaderTitleElement = {
@@ -86,19 +88,25 @@ export type HeaderProps = {
         canGoBack: () => boolean;
         goBack: () => void;
     };
-    /** Flotte au-dessus du contenu (ex. carte) : fond transparent. */
+    /** Flotte au-dessus du contenu (ex. carte) : fond transparent + safe-area top. */
     readonly overlay?: boolean;
     /**
      * Config layout (`header.elements`) — logo / actions.
      * Si fournie (même vide), le fallback titre d’écran ne s’applique pas.
      */
     readonly headerConfig?: AppHeaderConfig | null;
+    /**
+     * Padding safe-area top. Défaut `true` (header custom RN = edge-to-edge,
+     * il faut l’inset). Passer `false` seulement si le parent inset déjà.
+     */
+    readonly safeTop?: boolean;
 };
 
 function resolveLogoUri(
     apiUrl: string,
     el: AppHeaderLogoElement,
 ): string | null {
+    if (el.sourceType === "bundled") return null;
     const url = (el.url || "").trim();
     if (url) return url;
     // Fallback média (export parfois laisse mediaId si rewrite manqué)
@@ -125,6 +133,16 @@ function HeaderLogo({
     readonly element: AppHeaderLogoElement;
 }): ReactNode {
     const { apiUrl } = useWasto();
+    if (element.sourceType === "bundled" && element.module != null) {
+        return (
+            <Image
+                source={element.module}
+                style={styles.logo as ImageStyle}
+                resizeMode="contain"
+                accessibilityLabel="Logo"
+            />
+        );
+    }
     const uri = resolveLogoUri(apiUrl, element);
     if (!uri) return null;
     return <HeaderLogoImage uri={uri} />;
@@ -138,8 +156,11 @@ function CityLogoFallback(): ReactNode {
             ? appData.city.logoMediaId
             : null;
     const uri = publicMediaUrl(apiUrl, logoMediaId);
-    if (!uri) return null;
-    return <HeaderLogoImage uri={uri} />;
+    if (uri) return <HeaderLogoImage uri={uri} />;
+    const cityName =
+        typeof appData?.city?.name === "string" ? appData.city.name.trim() : "";
+    if (cityName) return <Title text={cityName} level="1" />;
+    return null;
 }
 
 function HeaderActionButton({
@@ -172,13 +193,17 @@ export function Header({
     navigation,
     overlay = false,
     headerConfig,
+    safeTop,
 }: HeaderProps): ReactNode {
     const { theme } = useTheme();
     const t = resolveTheme(theme);
     const themedStyles = createThemedStyles(theme);
-    const topInset = useSafeAreaPadding(["top"]);
+    // Header custom = plein écran sous le notch → inset requis (Page ne le re-ajoute plus).
+    const applyTopInset = safeTop ?? true;
+    const topInset = useSafeAreaPadding(applyTopInset ? ["top"] : []);
     const { hasUnread } = useAnnouncements();
     const { push } = useAppNavigation();
+    const { apiUrl } = useWasto();
 
     const screenTitle = useMemo(
         () => options.title ?? route.name,
@@ -193,7 +218,12 @@ export function Header({
         return raw.filter((el) => el.type !== "title");
     }, [headerConfig]);
     const hasCustomActions = elements.some((el) => el.type === "action");
-    const hasLogo = elements.some((el) => el.type === "logo");
+    // Logo CMS sans URI / sans module bundlé → fallback ville.
+    const hasResolvableLogo = elements.some((el) => {
+        if (el.type !== "logo") return false;
+        if (el.sourceType === "bundled" && el.module != null) return true;
+        return resolveLogoUri(apiUrl, el) != null;
+    });
 
     const bySlot = useMemo(() => {
         const left: AppHeaderElement[] = [];
@@ -320,7 +350,7 @@ export function Header({
                                 </HeaderActionButton>
                             ) : null}
                             {bySlot.left.map(renderElement)}
-                            {!hasLogo ? <CityLogoFallback /> : null}
+                            {!hasResolvableLogo ? <CityLogoFallback /> : null}
                         </View>
                         <View
                             style={styles.slotCenter}