@sincpro/mobile-ui 0.7.2 → 1.1.0

package/dist/Navigation/Navigation.Tabs.js

@@ -1,8 +1,8 @@
 import { jsx as _jsx, jsxs as _jsxs } from "nativewind/jsx-runtime";
-import Icon from "../Display/Display.Icon";
-import { useTheme } from "../theme";
-import { cn } from "../theme/tw";
-import { Typography } from "../Typography";
+import Icon from "../Display/Display.Icon.js";
+import { useTheme } from "../theme/index.js";
+import { cn } from "../theme/tw.js";
+import { Typography } from "../Typography/index.js";
 import { createContext, useCallback, useContext, useState } from "react";
 import { TouchableOpacity, View } from "react-native";
 const TabsContext = createContext(null);
@@ -34,7 +34,7 @@ function TabsTrigger({ value, children, icon, iconLayout = "left" }) {
     const theme = useTheme();
     const { value: active, setValue, variant } = useTabs();
     const selected = active === value;
-    const iconColor = selected ? theme.primary : theme.text.secondary;
+    const iconColor = selected ? theme.text.accent : theme.text.secondary;
     if (variant === "filled") {
         return (_jsx(TouchableOpacity, { accessibilityRole: "tab", accessibilityState: { selected }, activeOpacity: 0.7, className: "flex-1 items-center justify-center rounded-lg py-2", onPress: () => setValue(value), style: selected ? { backgroundColor: theme.bg.card, ...theme.shadow.sm } : {}, children: _jsxs(View, { className: cn("items-center", iconLayout === "left" && icon ? "flex-row gap-1.5" : "gap-1"), children: [icon && iconLayout === "top" && _jsx(Icon, { color: iconColor, name: icon, size: 16 }), icon && iconLayout === "left" && _jsx(Icon, { color: iconColor, name: icon, size: 14 }), _jsx(Typography.Text, { semibold: selected, style: { color: iconColor }, variant: "bodySmall", children: children })] }) }));
     }

package/dist/Navigation/index.d.ts

@@ -1,36 +1,40 @@
-import BottomNav from "../Navigation/Navigation.BottomNav";
-import CollapsingHeader from "../Navigation/Navigation.CollapsingHeader";
-import FloatingBar from "../Navigation/Navigation.FloatingBar";
-import HeaderToolbar from "../Navigation/Navigation.HeaderToolbar";
-import Menu from "../Navigation/Navigation.Menu";
-import { MenuSection } from "../Navigation/Navigation.MenuSection";
-import RowItem from "../Navigation/Navigation.RowItem";
-import SearchBar from "../Navigation/Navigation.SearchBar";
-import SegmentedControl from "../Navigation/Navigation.SegmentedControl";
-import Steps from "../Navigation/Navigation.Steps";
-import TabIcon from "../Navigation/Navigation.TabIcon";
-export type { AppBarBackground } from "../Navigation/Navigation.AppBar";
-export type { MenuSectionProps } from "../Navigation/Navigation.MenuSection";
+import BottomNav from "./Navigation.BottomNav.js";
+import CollapsingHeader from "./Navigation.CollapsingHeader.js";
+import FloatingBar from "./Navigation.FloatingBar.js";
+import HeaderToolbar from "./Navigation.HeaderToolbar.js";
+import Menu from "./Navigation.Menu.js";
+import { MenuSection } from "./Navigation.MenuSection.js";
+import RowItem from "./Navigation.RowItem.js";
+import SearchBar from "./Navigation.SearchBar.js";
+import SearchSuggestions from "./Navigation.SearchSuggestions.js";
+import SegmentedControl from "./Navigation.SegmentedControl.js";
+import Steps from "./Navigation.Steps.js";
+import TabIcon from "./Navigation.TabIcon.js";
+export type { AppBarBackground } from "./Navigation.AppBar.js";
+export type { MenuSectionProps } from "./Navigation.MenuSection.js";
+export type { SearchBarProps } from "./Navigation.SearchBar.js";
+export type { SearchSuggestion, SearchSuggestionsProps, } from "./Navigation.SearchSuggestions.js";
 export declare const Navigation: {
-    AppBar: (({ title, subtitle, onBack, leading, actions, subheader, variant, tone, accentBar, backVariant, border, safeArea, topSpacing, background, bottomDivider, className, testID, }: import("../Navigation/Navigation.AppBar").AppBarProps) => import("react").JSX.Element) & {
-        Action: ({ icon, label, onPress, badge, accessibilityLabel, tone, onDark, bare, testID, }: import("../Navigation/Navigation.AppBar").AppBarActionProps) => import("react").JSX.Element;
+    AppBar: (({ title, subtitle, onBack, leading, actions, subheader, variant, tone, accentBar, backVariant, border, safeArea, accessibleSizing, topSpacing, background, bottomDivider, className, testID, }: import("./Navigation.AppBar.js").AppBarProps) => import("react").JSX.Element) & {
+        Action: ({ icon, label, onPress, badge, accessibilityLabel, tone, onDark, bare, accessibleSizing, testID, }: import("./Navigation.AppBar.js").AppBarActionProps) => import("react").JSX.Element;
     };
     BottomNav: typeof BottomNav;
     CollapsingHeader: typeof CollapsingHeader;
     FloatingBar: typeof FloatingBar;
     SearchBar: typeof SearchBar;
-    Header: ({ title, logo, logoSource, backButton, handleBackButton, className, }: import("../Navigation/Navigation.Header").HeaderProps) => import("react").JSX.Element;
+    SearchSuggestions: typeof SearchSuggestions;
+    Header: ({ title, logo, logoSource, backButton, handleBackButton, className, }: import("./Navigation.Header.js").HeaderProps) => import("react").JSX.Element;
     HeaderToolbar: typeof HeaderToolbar;
-    TabItem: import("react").FC<import("../Navigation/Navigation.TabItem").TabIconProps>;
+    TabItem: import("react").FC<import("./Navigation.TabItem.js").TabIconProps>;
     TabIcon: typeof TabIcon;
     RowItem: typeof RowItem;
     SegmentedControl: typeof SegmentedControl;
-    Tabs: (({ value, defaultValue, onValueChange, variant, className, children, }: import("../Navigation/Navigation.Tabs").TabsProps) => import("react").JSX.Element) & {
+    Tabs: (({ value, defaultValue, onValueChange, variant, className, children, }: import("./Navigation.Tabs.js").TabsProps) => import("react").JSX.Element) & {
         List: ({ children, className }: {
             children: import("react").ReactNode;
             className?: string;
         }) => import("react").JSX.Element;
-        Trigger: ({ value, children, icon, iconLayout }: import("../Navigation/Navigation.Tabs").TabsTriggerProps) => import("react").JSX.Element;
+        Trigger: ({ value, children, icon, iconLayout }: import("./Navigation.Tabs.js").TabsTriggerProps) => import("react").JSX.Element;
         Content: ({ value, children }: {
             value: string;
             children: import("react").ReactNode;

package/dist/Navigation/index.js

@@ -1,24 +1,26 @@
-import AppBar from "../Navigation/Navigation.AppBar";
-import BottomNav from "../Navigation/Navigation.BottomNav";
-import CollapsingHeader from "../Navigation/Navigation.CollapsingHeader";
-import FloatingBar from "../Navigation/Navigation.FloatingBar";
-import Header from "../Navigation/Navigation.Header";
-import HeaderToolbar from "../Navigation/Navigation.HeaderToolbar";
-import Menu from "../Navigation/Navigation.Menu";
-import { MenuSection } from "../Navigation/Navigation.MenuSection";
-import RowItem from "../Navigation/Navigation.RowItem";
-import SearchBar from "../Navigation/Navigation.SearchBar";
-import SegmentedControl from "../Navigation/Navigation.SegmentedControl";
-import Steps from "../Navigation/Navigation.Steps";
-import TabIcon from "../Navigation/Navigation.TabIcon";
-import TabItem from "../Navigation/Navigation.TabItem";
-import Tabs from "../Navigation/Navigation.Tabs";
+import AppBar from "./Navigation.AppBar.js";
+import BottomNav from "./Navigation.BottomNav.js";
+import CollapsingHeader from "./Navigation.CollapsingHeader.js";
+import FloatingBar from "./Navigation.FloatingBar.js";
+import Header from "./Navigation.Header.js";
+import HeaderToolbar from "./Navigation.HeaderToolbar.js";
+import Menu from "./Navigation.Menu.js";
+import { MenuSection } from "./Navigation.MenuSection.js";
+import RowItem from "./Navigation.RowItem.js";
+import SearchBar from "./Navigation.SearchBar.js";
+import SearchSuggestions from "./Navigation.SearchSuggestions.js";
+import SegmentedControl from "./Navigation.SegmentedControl.js";
+import Steps from "./Navigation.Steps.js";
+import TabIcon from "./Navigation.TabIcon.js";
+import TabItem from "./Navigation.TabItem.js";
+import Tabs from "./Navigation.Tabs.js";
 export const Navigation = {
     AppBar,
     BottomNav,
     CollapsingHeader,
     FloatingBar,
     SearchBar,
+    SearchSuggestions,
     Header,
     HeaderToolbar,
     TabItem,

package/dist/Typography/Typography.Heading.d.ts

@@ -1,4 +1,4 @@
-import { typographyVariants } from "../theme/typography";
+import { typographyVariants } from "../theme/typography.js";
 import { FC } from "react";
 import type { TextProps } from "react-native";
 export interface TypographyProps extends TextProps {

package/dist/Typography/Typography.Heading.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx } from "nativewind/jsx-runtime";
-import { AppText } from "../Typography/Typography.Text";
+import { AppText } from "./Typography.Text.js";
 const Heading = ({ variant = "h1", ...props }) => {
-    return _jsx(AppText, { variant: variant, ...props });
+    return _jsx(AppText, { accessibilityRole: "header", variant: variant, ...props });
 };
 export default Heading;

package/dist/Typography/Typography.SelectableText.d.ts

@@ -0,0 +1,10 @@
+import { typographyVariants } from "../theme/typography.js";
+import { type TextInputProps } from "react-native";
+export type SelectableTextProps = Pick<TextInputProps, "accessibilityLabel" | "testID" | "style" | "allowFontScaling" | "onSelectionChange"> & {
+    value: string;
+    variant?: keyof typeof typographyVariants;
+    semibold?: boolean;
+    className?: string;
+};
+declare function SelectableText({ value, variant, semibold, className, style, ...props }: SelectableTextProps): import("react").JSX.Element;
+export default SelectableText;

package/dist/Typography/Typography.SelectableText.js

@@ -0,0 +1,16 @@
+import { jsx as _jsx } from "nativewind/jsx-runtime";
+import { cn } from "../theme/tw.js";
+import { resolveTextFontFamily, typographyVariants, } from "../theme/typography.js";
+import { TextInput } from "react-native";
+function SelectableText({ value, variant = "body", semibold = false, className, style, ...props }) {
+    return (_jsx(TextInput, { ...props, className: cn("text-text-primary", className), editable: false, multiline: true, readOnly: true, scrollEnabled: false, showSoftInputOnFocus: false, style: [
+            typographyVariants[variant],
+            {
+                fontFamily: resolveTextFontFamily(variant, false, semibold),
+                padding: 0,
+                textAlignVertical: "top",
+            },
+            style,
+        ], underlineColorAndroid: "transparent", value: value }));
+}
+export default SelectableText;

package/dist/Typography/Typography.Text.d.ts

@@ -1,4 +1,4 @@
-import { typographyVariants } from "../theme/typography";
+import { typographyVariants } from "../theme/typography.js";
 import type React from "react";
 import { type TextProps } from "react-native";
 /**
@@ -9,7 +9,7 @@ import { type TextProps } from "react-native";
  *
  * Reason: Custom fonts (Montserrat) not in Tailwind, complex typography system
  *
- * @deprecated color prop - Use className instead: className="text-primary" or className="text-text-secondary"
+ * @deprecated color prop - Use className instead: e.g. className="text-text-primary" or className="text-text-accent"
  */
 interface AppTextProps extends TextProps {
     variant?: keyof typeof typographyVariants;

package/dist/Typography/Typography.Text.js

@@ -1,29 +1,15 @@
 import { jsx as _jsx } from "nativewind/jsx-runtime";
-import { cn } from "../theme/tw";
-import { fontFamilies, Typography, variantFontRole, } from "../theme/typography";
-import { Text } from "react-native";
+import { cn } from "../theme/tw.js";
+import { resolveTextFontFamily, Typography, } from "../theme/typography.js";
+import { StyleSheet, Text } from "react-native";
 function AppText({ variant = "body", color, bold = false, italic = false, underline = false, align = "left", transform = "none", semibold = false, style, className, children, ...props }) {
     const baseStyle = Typography.variants[variant];
     const textClassName = cn("text-text-primary", align === "center" && "text-center", align === "right" && "text-right", align === "justify" && "text-justify", transform === "uppercase" && "uppercase", transform === "lowercase" && "lowercase", transform === "capitalize" && "capitalize", underline && "underline", italic && "italic", className);
-    // Resolve the family LIVE from the configurable registry by the variant's role, so
-    // `configureFonts(...)` (app/Storybook) takes effect. Falls back to the variant's baked
-    // family if a role is somehow missing.
-    const variantFamily = fontFamilies[variantFontRole[variant]] ?? baseStyle.fontFamily;
-    // `bold`/`semibold` map to the Inter weights — but NOT when the active family is a branded
-    // face (a configured title face, or Fira Code mono): those carry their own weight, so
-    // forcing Inter would erase the typeface. Keep the variant's family for those.
-    const isBrandedFace = typeof variantFamily === "string" && !variantFamily.startsWith("Inter_");
     const textStyle = {
         ...baseStyle,
         ...(color ? { color } : {}),
-        fontFamily: isBrandedFace
-            ? variantFamily
-            : bold
-                ? fontFamilies.extraBold
-                : semibold
-                    ? fontFamilies.semiBold
-                    : variantFamily,
-        ...(Array.isArray(style) ? Object.assign({}, ...style) : style),
+        fontFamily: resolveTextFontFamily(variant, bold, semibold),
+        ...StyleSheet.flatten(style),
     };
     return (_jsx(Text, { className: textClassName, style: textStyle, ...props, children: children }));
 }

package/dist/Typography/index.d.ts

@@ -1,7 +1,10 @@
-import { AppText } from "../Typography/Typography.Text";
+import SelectableText from "./Typography.SelectableText.js";
+import { AppText } from "./Typography.Text.js";
 export declare const Typography: {
     Text: typeof AppText;
-    Heading: import("react").FC<import("../Typography/Typography.Heading").TypographyProps>;
+    Heading: import("react").FC<import("./Typography.Heading.js").TypographyProps>;
+    SelectableText: typeof SelectableText;
 };
 export { AppText };
+export { SelectableText };
 export default Typography;

package/dist/Typography/index.js

@@ -1,8 +1,11 @@
-import Heading from "../Typography/Typography.Heading";
-import { AppText } from "../Typography/Typography.Text";
+import Heading from "./Typography.Heading.js";
+import SelectableText from "./Typography.SelectableText.js";
+import { AppText } from "./Typography.Text.js";
 export const Typography = {
     Text: AppText,
     Heading,
+    SelectableText,
 };
 export { AppText };
+export { SelectableText };
 export default Typography;

package/dist/branding.d.ts

@@ -1,6 +1,28 @@
 import { type ImageSourcePropType } from "react-native";
+/**
+ * Centralized brand assets. Set once at app boot via `setBranding({ ... })`. Components
+ * that need the brand logo or mesh symbol read these getters — no need to thread an
+ * asset through every consumer.
+ *
+ * @example
+ *   // app boot (e.g. createAppShell / app entrypoint)
+ *   setBranding({
+ *     logo: require("./assets/logo.png"),
+ *     mesh: require("./assets/brand-mesh.png"),
+ *     meshSize: 56,
+ *   });
+ */
 export interface BrandingConfig {
+    /** Brand logo (used by `Display.Logo`, `widgets.ScreenHeader`, etc.). */
     logo?: ImageSourcePropType;
+    /** Brand symbol / icon used by `Display.Pattern kind="mesh"` as the tiled texture. */
+    mesh?: ImageSourcePropType;
+    /** Tile size in px (overrides `theme.pattern.size` for the brand mesh). */
+    meshSize?: number;
 }
 export declare function setBranding(config: BrandingConfig): void;
 export declare function getBrandingLogo(): ImageSourcePropType | undefined;
+export declare function getBrandingMesh(): ImageSourcePropType | undefined;
+export declare function getBrandingMeshSize(): number | undefined;
+/** Test-only — reset to initial empty state. Not part of the public API. */
+export declare function __resetBranding(): void;

package/dist/branding.js

@@ -1,7 +1,24 @@
-let activeLogo;
+const state = { logo: undefined, mesh: undefined, meshSize: undefined };
 export function setBranding(config) {
-    activeLogo = config.logo;
+    if (config.logo !== undefined)
+        state.logo = config.logo;
+    if (config.mesh !== undefined)
+        state.mesh = config.mesh;
+    if (config.meshSize !== undefined)
+        state.meshSize = config.meshSize;
 }
 export function getBrandingLogo() {
-    return activeLogo;
+    return state.logo;
+}
+export function getBrandingMesh() {
+    return state.mesh;
+}
+export function getBrandingMeshSize() {
+    return state.meshSize;
+}
+/** Test-only — reset to initial empty state. Not part of the public API. */
+export function __resetBranding() {
+    state.logo = undefined;
+    state.mesh = undefined;
+    state.meshSize = undefined;
 }

package/dist/icons/AddItemIcon.d.ts

@@ -1,4 +1,4 @@
-import { CustomIconProps } from "../icons/props";
+import { CustomIconProps } from "./props.js";
 import React from "react";
 declare const AddItemIcon: React.FC<CustomIconProps>;
 export default AddItemIcon;

package/dist/icons/ArrangeCircle.d.ts

@@ -1,4 +1,4 @@
-import { CustomIconProps } from "../icons/props";
+import { CustomIconProps } from "./props.js";
 import React from "react";
 declare const ArrangeCircleIcon: React.FC<CustomIconProps>;
 export default ArrangeCircleIcon;

package/dist/icons/ArrowDownIcon.d.ts

@@ -1,4 +1,4 @@
-import { CustomIconProps } from "../icons/props";
+import { CustomIconProps } from "./props.js";
 import React from "react";
 declare function ArrowDownIcon({ size, color }: CustomIconProps): React.JSX.Element;
 export default ArrowDownIcon;

package/dist/icons/ArrowUpIcon.d.ts

@@ -1,4 +1,4 @@
-import { CustomIconProps } from "../icons/props";
+import { CustomIconProps } from "./props.js";
 import React from "react";
 declare function ArrowUpIcon({ size, color }: CustomIconProps): React.JSX.Element;
 export default ArrowUpIcon;

package/dist/icons/BoxIcon.d.ts

@@ -1,4 +1,4 @@
-import { CustomIconProps } from "../icons/props";
+import { CustomIconProps } from "./props.js";
 import React from "react";
 declare const BoxIcon: React.FC<CustomIconProps>;
 export default BoxIcon;

package/dist/icons/BoxTimeIcon.d.ts

@@ -1,4 +1,4 @@
-import { CustomIconProps } from "../icons/props";
+import { CustomIconProps } from "./props.js";
 import React from "react";
 declare const BoxTimeIcon: React.FC<CustomIconProps>;
 export default BoxTimeIcon;

package/dist/icons/CalendarIcon.d.ts

@@ -1,4 +1,4 @@
-import { CustomIconProps } from "../icons/props";
+import { CustomIconProps } from "./props.js";
 import React from "react";
 declare const CalendarIcon: React.FC<CustomIconProps>;
 export default CalendarIcon;

package/dist/icons/CardIcon.d.ts

@@ -1,4 +1,4 @@
-import { CustomIconProps } from "../icons/props";
+import { CustomIconProps } from "./props.js";
 import React from "react";
 declare const CardIcon: React.FC<CustomIconProps>;
 export default CardIcon;

package/dist/icons/CashierIcon.d.ts

@@ -1,4 +1,4 @@
-import { CustomIconProps } from "../icons/props";
+import { CustomIconProps } from "./props.js";
 import React from "react";
 declare const CashierIcon: React.FC<CustomIconProps>;
 export default CashierIcon;

package/dist/icons/DuoIcon.d.ts

@@ -1,4 +1,4 @@
-import { CustomIconProps } from "../icons/props";
+import { CustomIconProps } from "./props.js";
 import React from "react";
 declare const DuoIcon: React.FC<CustomIconProps>;
 export default DuoIcon;

package/dist/icons/HomeIcon.d.ts

@@ -1,4 +1,4 @@
-import { CustomIconProps } from "../icons/props";
+import { CustomIconProps } from "./props.js";
 import React from "react";
 declare const HomeIcon: React.FC<CustomIconProps>;
 export default HomeIcon;

package/dist/icons/HomeIconOutlined.d.ts

@@ -1,4 +1,4 @@
-import { CustomIconProps } from "../icons/props";
+import { CustomIconProps } from "./props.js";
 import React from "react";
 declare const HomeIconOutlined: React.FC<CustomIconProps>;
 export default HomeIconOutlined;

package/dist/icons/LogoIcon.d.ts

@@ -1,4 +1,4 @@
-import { CustomIconProps } from "../icons/props";
+import { CustomIconProps } from "./props.js";
 import React from "react";
 declare const LogoIcon: React.FC<CustomIconProps>;
 export default LogoIcon;

package/dist/icons/MoneyReceiveIcon.d.ts

@@ -1,4 +1,4 @@
-import { CustomIconProps } from "../icons/props";
+import { CustomIconProps } from "./props.js";
 import React from "react";
 declare const MoneyReceiveIcon: React.FC<CustomIconProps>;
 export default MoneyReceiveIcon;

package/dist/icons/PinIcon.d.ts

@@ -1,4 +1,4 @@
-import { CustomIconProps } from "../icons/props";
+import { CustomIconProps } from "./props.js";
 import React from "react";
 declare const PinIcon: React.FC<CustomIconProps>;
 export default PinIcon;

package/dist/icons/PrinterIcon.d.ts

@@ -1,4 +1,4 @@
-import { CustomIconProps } from "../icons/props";
+import { CustomIconProps } from "./props.js";
 import React from "react";
 /**
  * @deprecated Device-coupled (printer hardware); relocated to the core. Import from

package/dist/icons/ProfileIcon.d.ts

@@ -1,4 +1,4 @@
-import { CustomIconProps } from "../icons/props";
+import { CustomIconProps } from "./props.js";
 import React from "react";
 declare const ProfileIcon: React.FC<CustomIconProps>;
 export default ProfileIcon;

package/dist/icons/SettingsIcon.d.ts

@@ -1,4 +1,4 @@
-import { CustomIconProps } from "../icons/props";
+import { CustomIconProps } from "./props.js";
 import React from "react";
 declare const SettingsIcon: React.FC<CustomIconProps>;
 export default SettingsIcon;

package/dist/icons/SinpeIcon.d.ts

@@ -1,4 +1,4 @@
-import { CustomIconProps } from "../icons/props";
+import { CustomIconProps } from "./props.js";
 import React from "react";
 declare const SinpeIcon: React.FC<CustomIconProps>;
 export default SinpeIcon;

package/dist/icons/ToggleOffIcon.d.ts

@@ -1,4 +1,4 @@
-import { CustomIconProps } from "../icons/props";
+import { CustomIconProps } from "./props.js";
 import React from "react";
 declare const ToggleOffIcon: React.FC<CustomIconProps>;
 export default ToggleOffIcon;

package/dist/icons/WalletMoneyIcon.d.ts

@@ -1,4 +1,4 @@
-import { CustomIconProps } from "../icons/props";
+import { CustomIconProps } from "./props.js";
 import React from "react";
 declare const WalletMoneyIcon: React.FC<CustomIconProps>;
 export default WalletMoneyIcon;

package/dist/index.d.ts

@@ -1,23 +1,24 @@
-export { Actions } from "./Actions";
-export { Dialog } from "./Dialog";
-export { Display } from "./Display";
-export { Feedback } from "./Feedback";
-export { Form } from "./Form";
-export { Navigation } from "./Navigation";
-export { Typography } from "./Typography";
-export { Box, Row, Stack } from "./primitives";
-export { type BrandingConfig, getBrandingLogo, setBranding, } from "./branding";
-export { cn, tv, type VariantProps } from "./theme/tw";
-export { fontFamilies, fontSizes, fontWeights, letterSpacing, lineHeights, typographyVariants, } from "./theme/typography";
-export { BottomInsetContext } from "./layouts/BottomInset";
-export { default as Container } from "./layouts/Container";
-export { default as GradientContainer } from "./layouts/GradientContainer";
-export { default as PlainLayout } from "./layouts/PlainLayout";
-export { default as ScrollContainer } from "./layouts/ScrollContainer";
-export { default as TabNavigatorLayout } from "./layouts/TabNavigatorLayout";
-export { default as AuthFormView } from "./views/AuthFormView";
-export { default as FormViewV2 } from "./views/FormViewV2";
-export { default as ListViewV2 } from "./views/ListViewV2";
-export { default as JSONViewer } from "./widgets/JSONViewer";
-export { default as ScreenHeader } from "./widgets/ScreenHeader";
-export * from "./widgets/ScreenHeader";
+export { Actions } from "./Actions/index.js";
+export { Dialog } from "./Dialog/index.js";
+export { Display } from "./Display/index.js";
+export { Feedback } from "./Feedback/index.js";
+export { Form } from "./Form/index.js";
+export { Navigation } from "./Navigation/index.js";
+export { Typography } from "./Typography/index.js";
+export { Box, Row, Stack } from "./primitives/index.js";
+export { type BrandingConfig, getBrandingLogo, getBrandingMesh, getBrandingMeshSize, setBranding, } from "./branding.js";
+export { cn, tv, type VariantProps } from "./theme/tw.js";
+export { fontFamilies, fontSizes, fontWeights, letterSpacing, lineHeights, typographyVariants, } from "./theme/typography.js";
+export { BottomInsetContext } from "./layouts/BottomInset.js";
+export { default as Container } from "./layouts/Container.js";
+export { default as GradientContainer } from "./layouts/GradientContainer.js";
+export { default as PlainLayout } from "./layouts/PlainLayout.js";
+export { default as ScrollContainer } from "./layouts/ScrollContainer.js";
+export { default as TabNavigatorLayout } from "./layouts/TabNavigatorLayout.js";
+export { default as AppSplashView } from "./views/AppSplashView.js";
+export { default as AuthFormView } from "./views/AuthFormView.js";
+export { default as FormViewV2 } from "./views/FormViewV2.js";
+export { default as ListViewV2 } from "./views/ListViewV2.js";
+export { default as JSONViewer } from "./widgets/JSONViewer.js";
+export { default as ScreenHeader } from "./widgets/ScreenHeader.js";
+export * from "./widgets/ScreenHeader.js";

package/dist/index.js

@@ -1,30 +1,32 @@
 // Design System - Compound Components
-export { Actions } from "./Actions";
-export { Dialog } from "./Dialog";
-export { Display } from "./Display";
-export { Feedback } from "./Feedback";
-export { Form } from "./Form";
-export { Navigation } from "./Navigation";
-export { Typography } from "./Typography";
+export { Actions } from "./Actions/index.js";
+export { Dialog } from "./Dialog/index.js";
+export { Display } from "./Display/index.js";
+export { Feedback } from "./Feedback/index.js";
+export { Form } from "./Form/index.js";
+export { Navigation } from "./Navigation/index.js";
+export { Typography } from "./Typography/index.js";
 // Primitives (NativeWind-based - Layout utilities)
-export { Box, Row, Stack } from "./primitives";
-// Branding (logo del app, configurado una vez; Display.Logo lo usa como fallback)
-export { getBrandingLogo, setBranding, } from "./branding";
+export { Box, Row, Stack } from "./primitives/index.js";
+// Branding (logo + brand mesh symbol, configurado una vez; Display.Logo y
+// Display.Pattern leen de acá como fallback)
+export { getBrandingLogo, getBrandingMesh, getBrandingMeshSize, setBranding, } from "./branding.js";
 // Theme
-export { cn, tv } from "./theme/tw";
-export { fontFamilies, fontSizes, fontWeights, letterSpacing, lineHeights, typographyVariants, } from "./theme/typography";
+export { cn, tv } from "./theme/tw.js";
+export { fontFamilies, fontSizes, fontWeights, letterSpacing, lineHeights, typographyVariants, } from "./theme/typography.js";
 // Layouts
-export { BottomInsetContext } from "./layouts/BottomInset";
-export { default as Container } from "./layouts/Container";
-export { default as GradientContainer } from "./layouts/GradientContainer";
-export { default as PlainLayout } from "./layouts/PlainLayout";
-export { default as ScrollContainer } from "./layouts/ScrollContainer";
-export { default as TabNavigatorLayout } from "./layouts/TabNavigatorLayout";
+export { BottomInsetContext } from "./layouts/BottomInset.js";
+export { default as Container } from "./layouts/Container.js";
+export { default as GradientContainer } from "./layouts/GradientContainer.js";
+export { default as PlainLayout } from "./layouts/PlainLayout.js";
+export { default as ScrollContainer } from "./layouts/ScrollContainer.js";
+export { default as TabNavigatorLayout } from "./layouts/TabNavigatorLayout.js";
 // Views
-export { default as AuthFormView } from "./views/AuthFormView";
-export { default as FormViewV2 } from "./views/FormViewV2";
-export { default as ListViewV2 } from "./views/ListViewV2";
+export { default as AppSplashView } from "./views/AppSplashView.js";
+export { default as AuthFormView } from "./views/AuthFormView.js";
+export { default as FormViewV2 } from "./views/FormViewV2.js";
+export { default as ListViewV2 } from "./views/ListViewV2.js";
 // Widgets
-export { default as JSONViewer } from "./widgets/JSONViewer";
-export { default as ScreenHeader } from "./widgets/ScreenHeader";
-export * from "./widgets/ScreenHeader";
+export { default as JSONViewer } from "./widgets/JSONViewer.js";
+export { default as ScreenHeader } from "./widgets/ScreenHeader.js";
+export * from "./widgets/ScreenHeader.js";

package/dist/layouts/AuthContainer.d.ts

@@ -1,12 +1,18 @@
-import type { AppBarBackground } from "../Navigation/Navigation.AppBar";
+import { type KeyboardFormProps } from "../Form/Form.KeyboardForm.js";
+import type { AppBarBackground } from "../Navigation/Navigation.AppBar.js";
 import { ReactNode } from "react";
 interface AuthContainerProps {
     header: ReactNode;
     children: ReactNode;
     onBackPress?: () => void;
     className?: string;
-    /** Gradient + pattern surface for the header area. Defaults to `night-green` preset. */
+    keyboardToolbar?: boolean;
+    keyboardFormProps?: Omit<KeyboardFormProps, "children" | "toolbar">;
+    /** Gradient + optional texture surface for the header area. Defaults to the `warm`
+     *  preset. Set `background.pattern` to opt-in a texture (`dots` / `grid` /
+     *  `diagonals`); compose `<Display.Pattern kind="mesh" />` outside if you want the
+     *  brand symbol. */
     background?: AppBarBackground;
 }
-declare function AuthContainer({ header, children, onBackPress, background, className, }: AuthContainerProps): import("react").JSX.Element;
+declare function AuthContainer({ header, children, onBackPress, background, className, keyboardToolbar, keyboardFormProps, }: AuthContainerProps): import("react").JSX.Element;
 export default AuthContainer;