@sincpro/mobile-ui 0.7.2 → 1.0.1

package/dist/Navigation/index.d.ts

@@ -1,36 +1,36 @@
-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 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 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, topSpacing, background, bottomDivider, className, testID, }: import("./Navigation.AppBar.js").AppBarProps) => import("react").JSX.Element) & {
+        Action: ({ icon, label, onPress, badge, accessibilityLabel, tone, onDark, bare, 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;
+    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,18 +1,18 @@
-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 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,

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,5 +1,5 @@
 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 });
 };

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,6 +1,6 @@
 import { jsx as _jsx } from "nativewind/jsx-runtime";
-import { cn } from "../theme/tw";
-import { fontFamilies, Typography, variantFontRole, } from "../theme/typography";
+import { cn } from "../theme/tw.js";
+import { fontFamilies, Typography, variantFontRole, } from "../theme/typography.js";
 import { 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];
@@ -9,10 +9,12 @@ function AppText({ variant = "body", color, bold = false, italic = false, underl
     // `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_");
+    // `bold`/`semibold` map to the IBM Plex Sans weights — but NOT when the active family is a
+    // branded face (a configured title face, or IBM Plex Mono): those carry their own weight, so
+    // forcing Plex Sans would erase the typeface. Keep the variant's family for those.
+    const isBrandedFace = typeof variantFamily === "string" &&
+        !variantFamily.startsWith("Inter_") &&
+        !variantFamily.startsWith("IBMPlexSans_");
     const textStyle = {
         ...baseStyle,
         ...(color ? { color } : {}),

package/dist/Typography/index.d.ts

@@ -1,7 +1,7 @@
-import { AppText } from "../Typography/Typography.Text";
+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>;
 };
 export { AppText };
 export default Typography;

package/dist/Typography/index.js

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

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,11 +1,14 @@
-import type { AppBarBackground } from "../Navigation/Navigation.AppBar";
+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. */
+    /** 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;

package/dist/layouts/AuthContainer.js

@@ -1,15 +1,15 @@
 import { jsx as _jsx, jsxs as _jsxs } from "nativewind/jsx-runtime";
-import { Display } from "../Display";
-import GradientSurface from "../Display/Display.GradientSurface";
-import { Pattern } from "../Display/Display.Pattern";
-import { useTheme } from "../theme";
-import { cn } from "../theme/tw";
+import { Display } from "../Display/index.js";
+import GradientSurface from "../Display/Display.GradientSurface.js";
+import { Pattern } from "../Display/Display.Pattern.js";
+import { useTheme } from "../theme/index.js";
+import { cn } from "../theme/tw.js";
 import { Keyboard, TouchableOpacity, TouchableWithoutFeedback, useWindowDimensions, View, } from "react-native";
 import { KeyboardAwareScrollView } from "react-native-keyboard-controller";
 import { SafeAreaView } from "react-native-safe-area-context";
 function AuthContainer({ header, children, onBackPress, background, className, }) {
     const { height: screenHeight } = useWindowDimensions();
     const theme = useTheme();
-    return (_jsxs(GradientSurface, { className: cn("flex-1", className), colors: background?.colors, end: background?.end ?? (background?.colors ? { x: 0, y: 1 } : undefined), preset: background?.surface ?? "night-green", radius: "none", start: background?.start ?? (background?.colors ? { x: 0, y: 0 } : undefined), style: { flex: 1 }, children: [background?.pattern ? (_jsx(Pattern, { color: background.patternColor ?? "#FFFFFF", kind: background.pattern, opacity: background.patternOpacity ?? 0.18 })) : null, _jsx(SafeAreaView, { className: "flex-1", edges: ["top"], children: _jsxs(View, { className: "flex-1", children: [_jsx(TouchableWithoutFeedback, { onPress: Keyboard.dismiss, children: _jsxs(View, { className: "justify-center items-center relative", style: { height: screenHeight * 0.3 }, children: [onBackPress && (_jsx(TouchableOpacity, { className: "absolute top-4 left-4 p-2 z-[1]", onPress: onBackPress, children: _jsx(Display.Icon, { color: background?.textColor ?? theme.text.inverse, name: "arrow-back", size: 24, type: "ionicons" }) })), header] }) }), _jsx(View, { className: "flex-1 bg-bg-card rounded-t-3xl shadow-lg", style: { minHeight: screenHeight * 0.7 }, children: _jsx(KeyboardAwareScrollView, { bottomOffset: 50, bounces: false, className: "flex-1", contentContainerClassName: "flex-grow pb-10", keyboardShouldPersistTaps: "handled", showsVerticalScrollIndicator: false, children: _jsx(View, { className: "p-4", children: children }) }) })] }) })] }));
+    return (_jsxs(GradientSurface, { className: cn("flex-1", className), colors: background?.colors, end: background?.end ?? (background?.colors ? { x: 0, y: 1 } : undefined), preset: background?.surface ?? "warm", radius: "none", start: background?.start ?? (background?.colors ? { x: 0, y: 0 } : undefined), style: { flex: 1 }, children: [background?.pattern ? (_jsx(Pattern, { color: background.patternColor ?? "#FFFFFF", kind: background.pattern, opacity: background.patternOpacity ?? 0.18 })) : null, _jsx(SafeAreaView, { className: "flex-1", edges: ["top"], children: _jsxs(View, { className: "flex-1", children: [_jsx(TouchableWithoutFeedback, { onPress: Keyboard.dismiss, children: _jsxs(View, { className: "justify-center items-center relative", style: { height: screenHeight * 0.3 }, children: [onBackPress && (_jsx(TouchableOpacity, { className: "absolute top-4 left-4 p-2 z-[1]", onPress: onBackPress, children: _jsx(Display.Icon, { color: background?.textColor ?? theme.text.inverse, name: "arrow-back", size: 24, type: "ionicons" }) })), header] }) }), _jsx(View, { className: "flex-1 bg-bg-card rounded-t-3xl shadow-lg", style: { minHeight: screenHeight * 0.7 }, children: _jsx(KeyboardAwareScrollView, { bottomOffset: 50, bounces: false, className: "flex-1", contentContainerClassName: "flex-grow pb-10", keyboardShouldPersistTaps: "handled", showsVerticalScrollIndicator: false, children: _jsx(View, { className: "p-4", children: children }) }) })] }) })] }));
 }
 export default AuthContainer;

package/dist/layouts/Container.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "nativewind/jsx-runtime";
-import { cn } from "../theme/tw";
+import { cn } from "../theme/tw.js";
 import { StatusBar } from "react-native";
 import { SafeAreaView } from "react-native-safe-area-context";
 const Container = ({ children, style, barStyle = "light-content", statusBarHidden = false, edges = ["top", "bottom", "left", "right"], className, }) => {

package/dist/layouts/GradientContainer.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx } from "nativewind/jsx-runtime";
-import { theme } from "../theme";
+import { theme } from "../theme/index.js";
 import { LinearGradient } from "expo-linear-gradient";
 const GradientContainer = ({ children, style, className }) => {
     const gradientColors = theme.gradient.primary;

package/dist/layouts/ScrollContainer.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "nativewind/jsx-runtime";
-import { cn } from "../theme/tw";
+import { cn } from "../theme/tw.js";
 import { KeyboardAvoidingView, Platform, ScrollView, StatusBar, View } from "react-native";
 import { SafeAreaView } from "react-native-safe-area-context";
 function ScrollContainer({ children, contentContainerStyle = {}, className, }) {

package/dist/layouts/TabNavigatorLayout.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "nativewind/jsx-runtime";
-import DisplayIcon from "../Display/Display.Icon";
-import Container from "../layouts/Container";
-import { Typography } from "../Typography";
+import DisplayIcon from "../Display/Display.Icon.js";
+import Container from "./Container.js";
+import { Typography } from "../Typography/index.js";
 import { Children, isValidElement } from "react";
 import { TouchableOpacity, View } from "react-native";
 import { useSafeAreaInsets } from "react-native-safe-area-context";
@@ -21,7 +21,7 @@ function TabNavigator({ items, currentPath, onTabPress, }) {
                             return;
                         }
                         onTabPress?.(path);
-                    }, children: [_jsx(TabIcon, { focused: focused, Icon: Icon }), _jsx(Text, { className: `text-xs mt-1.5 font-medium ${focused ? "text-primary" : "text-text-secondary"}`, children: label })] }, path));
+                    }, children: [_jsx(TabIcon, { focused: focused, Icon: Icon }), _jsx(Text, { className: `text-xs mt-1.5 font-medium ${focused ? "text-text-accent" : "text-text-secondary"}`, children: label })] }, path));
             }) }) }));
 }
 function Tabs({ children: tabsChildren }) {

package/dist/primitives/AspectRatio.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx } from "nativewind/jsx-runtime";
-import { cn } from "../theme/tw";
+import { cn } from "../theme/tw.js";
 import { View } from "react-native";
 function AspectRatio({ ratio = 1, className, style, children, ...rest }) {
     return (_jsx(View, { className: cn(className), style: [{ aspectRatio: ratio }, style], ...rest, children: children }));