zero-to-app 2.0.0 → 3.0.0

package/dist/brand/brand-config.d.ts

@@ -0,0 +1,65 @@
+import { BorderRadius, Colors, FooterLinks, LogoConfig, Name, NavigationConfig, Shape, Spacing } from './brand-types';
+import { type PaletteOptions } from './palette-generator';
+export interface Brand {
+    colors: Colors;
+    darkColors?: Colors;
+    spacing: Spacing;
+    borderRadius: BorderRadius;
+    shape: Shape;
+    name: Name;
+    logo: LogoConfig;
+    footerLinks: FooterLinks;
+    navigation: NavigationConfig;
+}
+/**
+ * Configuration interface for creating a brand.
+ * Supports both manual color specification and seed-based palette generation.
+ */
+export interface BrandConfig {
+    name: string;
+    /**
+     * Colors for the brand. Can be:
+     * 1. Complete Colors object (manual specification)
+     * 2. Object with colorSeed for automatic M3 palette generation
+     */
+    colors: Colors | {
+        colorSeed: PaletteOptions;
+    };
+    /** Optional dark theme colors (generated from seed if not provided) */
+    darkColors?: Colors | {
+        colorSeed: PaletteOptions;
+    };
+    spacing: Spacing;
+    borderRadius: BorderRadius;
+    shape?: Shape;
+    logo?: LogoConfig;
+    footerLinks?: FooterLinks;
+    navigation?: NavigationConfig;
+}
+/**
+ * Creates a brand configuration from the provided config.
+ * Supports both manual color specification and automatic M3 palette generation.
+ *
+ * @param config Configuration with brand values
+ * @returns Brand configuration object with generated or manual colors
+ *
+ * @example
+ * // Manual color specification
+ * const manualBrand = createBrand({
+ *   name: 'My App',
+ *   colors: { primary: '#ff0000', secondary: '#00ff00', ... },
+ *   spacing: { xs: 4, sm: 8, md: 12, lg: 16, xl: 20, xxl: 24, xxxl: 40 },
+ *   borderRadius: { xs: 4, sm: 8, md: 12, lg: 16, xl: 28, full: 9999 },
+ * });
+ *
+ * @example
+ * // Seed-based palette generation (recommended for M3 compliance)
+ * const generatedBrand = createBrand({
+ *   name: 'My App',
+ *   colors: { colorSeed: { primary: '#6750A4' } },
+ *   spacing: { xs: 4, sm: 8, md: 12, lg: 16, xl: 20, xxl: 24, xxxl: 40 },
+ *   borderRadius: { xs: 4, sm: 8, md: 12, lg: 16, xl: 28, full: 9999 },
+ * });
+ */
+export declare const createBrand: (config: BrandConfig) => Brand;
+//# sourceMappingURL=brand-config.d.ts.map

package/dist/brand/brand-config.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"brand-config.d.ts","sourceRoot":"","sources":["../../brand/brand-config.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAE,MAAM,EAAE,WAAW,EAAE,UAAU,EAAE,IAAI,EAAE,gBAAgB,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,eAAe,CAAC;AACtH,OAAO,EAA2C,KAAK,cAAc,EAAE,MAAM,qBAAqB,CAAC;AAEnG,MAAM,WAAW,KAAK;IACpB,MAAM,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,OAAO,EAAE,OAAO,CAAC;IACjB,YAAY,EAAE,YAAY,CAAC;IAC3B,KAAK,EAAE,KAAK,CAAC;IACb,IAAI,EAAE,IAAI,CAAC;IACX,IAAI,EAAE,UAAU,CAAC;IACjB,WAAW,EAAE,WAAW,CAAC;IACzB,UAAU,EAAE,gBAAgB,CAAC;CAC9B;AAED;;;GAGG;AACH,MAAM,WAAW,WAAW;IAC1B,IAAI,EAAE,MAAM,CAAC;IACb;;;;OAIG;IACH,MAAM,EAAE,MAAM,GAAG;QAAE,SAAS,EAAE,cAAc,CAAA;KAAE,CAAC;IAC/C,uEAAuE;IACvE,UAAU,CAAC,EAAE,MAAM,GAAG;QAAE,SAAS,EAAE,cAAc,CAAA;KAAE,CAAC;IACpD,OAAO,EAAE,OAAO,CAAC;IACjB,YAAY,EAAE,YAAY,CAAC;IAC3B,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,IAAI,CAAC,EAAE,UAAU,CAAC;IAClB,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,UAAU,CAAC,EAAE,gBAAgB,CAAC;CAC/B;AASD;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,eAAO,MAAM,WAAW,GAAI,QAAQ,WAAW,KAAG,KAmCjD,CAAC"}

package/dist/brand/brand-config.js

@@ -0,0 +1,68 @@
+import { generateLightColors, generateDarkColors } from './palette-generator';
+/**
+ * Type guard to check if colors config uses seed-based generation
+ */
+function isColorSeed(colors) {
+    return 'colorSeed' in colors && colors.colorSeed !== undefined;
+}
+/**
+ * Creates a brand configuration from the provided config.
+ * Supports both manual color specification and automatic M3 palette generation.
+ *
+ * @param config Configuration with brand values
+ * @returns Brand configuration object with generated or manual colors
+ *
+ * @example
+ * // Manual color specification
+ * const manualBrand = createBrand({
+ *   name: 'My App',
+ *   colors: { primary: '#ff0000', secondary: '#00ff00', ... },
+ *   spacing: { xs: 4, sm: 8, md: 12, lg: 16, xl: 20, xxl: 24, xxxl: 40 },
+ *   borderRadius: { xs: 4, sm: 8, md: 12, lg: 16, xl: 28, full: 9999 },
+ * });
+ *
+ * @example
+ * // Seed-based palette generation (recommended for M3 compliance)
+ * const generatedBrand = createBrand({
+ *   name: 'My App',
+ *   colors: { colorSeed: { primary: '#6750A4' } },
+ *   spacing: { xs: 4, sm: 8, md: 12, lg: 16, xl: 20, xxl: 24, xxxl: 40 },
+ *   borderRadius: { xs: 4, sm: 8, md: 12, lg: 16, xl: 28, full: 9999 },
+ * });
+ */
+export const createBrand = (config) => {
+    // Resolve light theme colors
+    const lightColors = isColorSeed(config.colors)
+        ? generateLightColors(config.colors.colorSeed)
+        : config.colors;
+    // Resolve dark theme colors
+    let darkColors;
+    if (config.darkColors) {
+        darkColors = isColorSeed(config.darkColors)
+            ? generateDarkColors(config.darkColors.colorSeed)
+            : config.darkColors;
+    }
+    else if (isColorSeed(config.colors)) {
+        // Auto-generate dark theme from the same seed
+        darkColors = generateDarkColors(config.colors.colorSeed);
+    }
+    return {
+        name: config.name,
+        colors: lightColors,
+        darkColors,
+        spacing: config.spacing,
+        borderRadius: config.borderRadius,
+        shape: config.shape ?? { surfaceBorderRadius: 12, buttonBorderRadius: 8 },
+        logo: config.logo ?? {
+            light: undefined,
+            dark: undefined,
+        },
+        footerLinks: config.footerLinks ?? {
+            links: [],
+        },
+        navigation: config.navigation ?? {
+            items: [],
+        },
+    };
+};
+//# sourceMappingURL=brand-config.js.map

package/dist/brand/brand-config.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"brand-config.js","sourceRoot":"","sources":["../../brand/brand-config.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,mBAAmB,EAAE,kBAAkB,EAAuB,MAAM,qBAAqB,CAAC;AAoCnG;;GAEG;AACH,SAAS,WAAW,CAAC,MAA8C;IACjE,OAAO,WAAW,IAAI,MAAM,IAAI,MAAM,CAAC,SAAS,KAAK,SAAS,CAAC;AACjE,CAAC;AAED;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,MAAmB,EAAS,EAAE;IACxD,6BAA6B;IAC7B,MAAM,WAAW,GAAW,WAAW,CAAC,MAAM,CAAC,MAAM,CAAC;QACpD,CAAC,CAAC,mBAAmB,CAAC,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC;QAC9C,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC;IAElB,4BAA4B;IAC5B,IAAI,UAA8B,CAAC;IACnC,IAAI,MAAM,CAAC,UAAU,EAAE,CAAC;QACtB,UAAU,GAAG,WAAW,CAAC,MAAM,CAAC,UAAU,CAAC;YACzC,CAAC,CAAC,kBAAkB,CAAC,MAAM,CAAC,UAAU,CAAC,SAAS,CAAC;YACjD,CAAC,CAAC,MAAM,CAAC,UAAU,CAAC;IACxB,CAAC;SAAM,IAAI,WAAW,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,CAAC;QACtC,8CAA8C;QAC9C,UAAU,GAAG,kBAAkB,CAAC,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC;IAC3D,CAAC;IAED,OAAO;QACL,IAAI,EAAE,MAAM,CAAC,IAAI;QACjB,MAAM,EAAE,WAAW;QACnB,UAAU;QACV,OAAO,EAAE,MAAM,CAAC,OAAO;QACvB,YAAY,EAAE,MAAM,CAAC,YAAY;QACjC,KAAK,EAAE,MAAM,CAAC,KAAK,IAAI,EAAE,mBAAmB,EAAE,EAAE,EAAE,kBAAkB,EAAE,CAAC,EAAE;QACzE,IAAI,EAAE,MAAM,CAAC,IAAI,IAAI;YACnB,KAAK,EAAE,SAAS;YAChB,IAAI,EAAE,SAAS;SAChB;QACD,WAAW,EAAE,MAAM,CAAC,WAAW,IAAI;YACjC,KAAK,EAAE,EAAE;SACV;QACD,UAAU,EAAE,MAAM,CAAC,UAAU,IAAI;YAC/B,KAAK,EAAE,EAAE;SACV;KACF,CAAC;AACJ,CAAC,CAAC"}

package/dist/brand/brand-context.d.ts

@@ -0,0 +1,55 @@
+import React from 'react';
+import { Brand } from './brand-config';
+type BrandProviderProps = {
+    brand: Brand;
+    children: React.ReactNode;
+};
+export declare const BrandProvider: ({ brand, children }: BrandProviderProps) => import("react/jsx-runtime").JSX.Element;
+/**
+ * Hook to access the current brand configuration.
+ * Must be used within a `<ZeroToApp>` or `<BrandProvider>` provider.
+ *
+ * @returns The brand configuration containing colors, spacing, logo, etc.
+ * @throws Error if used outside of a ZeroToApp or BrandProvider
+ *
+ * @example
+ * ```tsx
+ * function MyHeader() {
+ *   const { values: theme } = useThemeContext();
+ *   const brand = useBrandConfig();
+ *
+ *   return (
+ *     <View style={{ padding: theme.spacing.md }}>
+ *       <Image source={brand.logo.light} />
+ *       <Text style={{ color: theme.primary }}>
+ *         {brand.name}
+ *       </Text>
+ *     </View>
+ *   );
+ * }
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // Access brand colors directly (Internal use)
+ * function ColoredBox() {
+ *   const { values: theme } = useThemeContext();
+ *   const { colors } = useBrandConfig();
+ *
+ *   return (
+ *     <View style={{
+ *       backgroundColor: colors.primaryContainer,
+ *       padding: theme.spacing.lg,
+ *       borderRadius: theme.borderRadius.sm,
+ *     }}>
+ *       <Text style={{ color: colors.onPrimaryContainer }}>
+ *         Brand colored content
+ *       </Text>
+ *     </View>
+ *   );
+ * }
+ * ```
+ */
+export declare const useBrandConfig: () => Brand;
+export {};
+//# sourceMappingURL=brand-context.d.ts.map

package/dist/brand/brand-context.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"brand-context.d.ts","sourceRoot":"","sources":["../../brand/brand-context.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoC,MAAM,OAAO,CAAC;AACzD,OAAO,EAAE,KAAK,EAAE,MAAM,gBAAgB,CAAC;AASvC,KAAK,kBAAkB,GAAG;IACxB,KAAK,EAAE,KAAK,CAAC;IACb,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B,CAAC;AAEF,eAAO,MAAM,aAAa,GAAI,qBAAqB,kBAAkB,4CAEpE,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4CG;AACH,eAAO,MAAM,cAAc,QAAO,KA0BjC,CAAC"}

package/dist/brand/brand-context.js

@@ -0,0 +1,76 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createContext, useContext } from 'react';
+// Create the context
+const BrandContext = createContext(undefined);
+export const BrandProvider = ({ brand, children }) => {
+    return _jsx(BrandContext.Provider, { value: brand, children: children });
+};
+/**
+ * Hook to access the current brand configuration.
+ * Must be used within a `<ZeroToApp>` or `<BrandProvider>` provider.
+ *
+ * @returns The brand configuration containing colors, spacing, logo, etc.
+ * @throws Error if used outside of a ZeroToApp or BrandProvider
+ *
+ * @example
+ * ```tsx
+ * function MyHeader() {
+ *   const { values: theme } = useThemeContext();
+ *   const brand = useBrandConfig();
+ *
+ *   return (
+ *     <View style={{ padding: theme.spacing.md }}>
+ *       <Image source={brand.logo.light} />
+ *       <Text style={{ color: theme.primary }}>
+ *         {brand.name}
+ *       </Text>
+ *     </View>
+ *   );
+ * }
+ * ```
+ *
+ * @example
+ * ```tsx
+ * // Access brand colors directly (Internal use)
+ * function ColoredBox() {
+ *   const { values: theme } = useThemeContext();
+ *   const { colors } = useBrandConfig();
+ *
+ *   return (
+ *     <View style={{
+ *       backgroundColor: colors.primaryContainer,
+ *       padding: theme.spacing.lg,
+ *       borderRadius: theme.borderRadius.sm,
+ *     }}>
+ *       <Text style={{ color: colors.onPrimaryContainer }}>
+ *         Brand colored content
+ *       </Text>
+ *     </View>
+ *   );
+ * }
+ * ```
+ */
+export const useBrandConfig = () => {
+    const context = useContext(BrandContext);
+    if (context === undefined) {
+        throw new Error('useBrandConfig must be used within a <ZeroToApp> provider.\n\n' +
+            'Make sure your component is inside a ZeroToApp provider:\n\n' +
+            '  import { ZeroToApp, createBrand } from "zero-to-app";\n\n' +
+            '  const brand = createBrand({\n' +
+            '    name: "My App",\n' +
+            '    colors: { colorSeed: { primary: "#6750A4" } },\n' +
+            '    spacing: { xs: 4, sm: 8, md: 12, lg: 16, xl: 20, xxl: 24, xxxl: 40 },\n' +
+            '    borderRadius: { xs: 4, sm: 8, md: 12, lg: 16, xl: 28, full: 9999 },\n' +
+            '    shape: { surfaceBorderRadius: 12, buttonBorderRadius: 8 },\n' +
+            '  });\n\n' +
+            '  function App() {\n' +
+            '    return (\n' +
+            '      <ZeroToApp brand={brand}>\n' +
+            '        <YourComponent />\n' +
+            '      </ZeroToApp>\n' +
+            '    );\n' +
+            '  }');
+    }
+    return context;
+};
+//# sourceMappingURL=brand-context.js.map

package/dist/brand/brand-context.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"brand-context.js","sourceRoot":"","sources":["../../brand/brand-context.tsx"],"names":[],"mappings":";AAAA,OAAc,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAMzD,qBAAqB;AACrB,MAAM,YAAY,GAAG,aAAa,CAA+B,SAAS,CAAC,CAAC;AAQ5E,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAsB,EAAE,EAAE;IACvE,OAAO,KAAC,YAAY,CAAC,QAAQ,IAAC,KAAK,EAAE,KAAK,YAAG,QAAQ,GAAyB,CAAC;AACjF,CAAC,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4CG;AACH,MAAM,CAAC,MAAM,cAAc,GAAG,GAAU,EAAE;IACxC,MAAM,OAAO,GAAG,UAAU,CAAC,YAAY,CAAC,CAAC;IAEzC,IAAI,OAAO,KAAK,SAAS,EAAE,CAAC;QAC1B,MAAM,IAAI,KAAK,CACb,gEAAgE;YAC9D,8DAA8D;YAC9D,6DAA6D;YAC7D,iCAAiC;YACjC,uBAAuB;YACvB,sDAAsD;YACtD,6EAA6E;YAC7E,2EAA2E;YAC3E,kEAAkE;YAClE,WAAW;YACX,sBAAsB;YACtB,gBAAgB;YAChB,mCAAmC;YACnC,6BAA6B;YAC7B,sBAAsB;YACtB,UAAU;YACV,KAAK,CACR,CAAC;IACJ,CAAC;IAED,OAAO,OAAO,CAAC;AACjB,CAAC,CAAC"}

package/dist/brand/brand-types.d.ts

@@ -0,0 +1,92 @@
+import { ImageSourcePropType } from 'react-native';
+export type Name = string;
+export interface Shape {
+    surfaceBorderRadius: number;
+    buttonBorderRadius: number;
+}
+export interface BorderRadius {
+    xs: number;
+    sm: number;
+    md: number;
+    lg: number;
+    xl: number;
+    full: number;
+}
+/**
+ * Material Design 3 color tokens - 26 core tokens
+ * All colors should be accessible with minimum 3:1 contrast for text on colors
+ * Reference: https://m3.material.io/styles/color/the-color-system/color-roles
+ */
+export interface Colors {
+    primary: string;
+    onPrimary: string;
+    primaryContainer: string;
+    onPrimaryContainer: string;
+    secondary: string;
+    onSecondary: string;
+    secondaryContainer: string;
+    onSecondaryContainer: string;
+    tertiary: string;
+    onTertiary: string;
+    tertiaryContainer: string;
+    onTertiaryContainer: string;
+    error: string;
+    onError: string;
+    errorContainer: string;
+    onErrorContainer: string;
+    surface: string;
+    onSurface: string;
+    onSurfaceVariant: string;
+    surfaceContainerLowest: string;
+    surfaceContainerLow: string;
+    surfaceContainer: string;
+    surfaceContainerHigh: string;
+    surfaceContainerHighest: string;
+    outline: string;
+    outlineVariant: string;
+    inverseSurface: string;
+    inverseOnSurface: string;
+    inversePrimary: string;
+    scrim: string;
+    shadow: string;
+}
+export interface Spacing {
+    xs: number;
+    sm: number;
+    md: number;
+    lg: number;
+    xl: number;
+    xxl: number;
+    xxxl: number;
+}
+export type LogoSource = ImageSourcePropType | string;
+export interface LogoConfig {
+    light?: LogoSource;
+    dark?: LogoSource;
+}
+export interface FooterLink {
+    text: string;
+    route: string;
+}
+export interface FooterLinks {
+    links: FooterLink[];
+    aboutText?: string;
+}
+export type IconLibrary = 'Feather' | 'MaterialIcons' | 'Ionicons' | 'FontAwesome' | 'AntDesign' | 'Entypo' | 'EvilIcons' | 'Foundation' | 'MaterialCommunityIcons' | 'Octicons' | 'SimpleLineIcons' | 'Zocial';
+export interface PlatformIcon {
+    library?: IconLibrary;
+    name: string;
+}
+export interface NavigationIcon {
+    web?: PlatformIcon | string;
+    mobile?: PlatformIcon | string;
+}
+export interface NavigationItem {
+    route: string;
+    title: string;
+    icon: NavigationIcon;
+}
+export interface NavigationConfig {
+    items: NavigationItem[];
+}
+//# sourceMappingURL=brand-types.d.ts.map

package/dist/brand/brand-types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"brand-types.d.ts","sourceRoot":"","sources":["../../brand/brand-types.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,mBAAmB,EAAE,MAAM,cAAc,CAAC;AAEnD,MAAM,MAAM,IAAI,GAAG,MAAM,CAAC;AAC1B,MAAM,WAAW,KAAK;IACpB,mBAAmB,EAAE,MAAM,CAAC;IAC5B,kBAAkB,EAAE,MAAM,CAAC;CAC5B;AAED,MAAM,WAAW,YAAY;IAC3B,EAAE,EAAE,MAAM,CAAC;IACX,EAAE,EAAE,MAAM,CAAC;IACX,EAAE,EAAE,MAAM,CAAC;IACX,EAAE,EAAE,MAAM,CAAC;IACX,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;CACd;AAED;;;;GAIG;AACH,MAAM,WAAW,MAAM;IAErB,OAAO,EAAE,MAAM,CAAC;IAChB,SAAS,EAAE,MAAM,CAAC;IAClB,gBAAgB,EAAE,MAAM,CAAC;IACzB,kBAAkB,EAAE,MAAM,CAAC;IAG3B,SAAS,EAAE,MAAM,CAAC;IAClB,WAAW,EAAE,MAAM,CAAC;IACpB,kBAAkB,EAAE,MAAM,CAAC;IAC3B,oBAAoB,EAAE,MAAM,CAAC;IAG7B,QAAQ,EAAE,MAAM,CAAC;IACjB,UAAU,EAAE,MAAM,CAAC;IACnB,iBAAiB,EAAE,MAAM,CAAC;IAC1B,mBAAmB,EAAE,MAAM,CAAC;IAG5B,KAAK,EAAE,MAAM,CAAC;IACd,OAAO,EAAE,MAAM,CAAC;IAChB,cAAc,EAAE,MAAM,CAAC;IACvB,gBAAgB,EAAE,MAAM,CAAC;IAGzB,OAAO,EAAE,MAAM,CAAC;IAChB,SAAS,EAAE,MAAM,CAAC;IAClB,gBAAgB,EAAE,MAAM,CAAC;IACzB,sBAAsB,EAAE,MAAM,CAAC;IAC/B,mBAAmB,EAAE,MAAM,CAAC;IAC5B,gBAAgB,EAAE,MAAM,CAAC;IACzB,oBAAoB,EAAE,MAAM,CAAC;IAC7B,uBAAuB,EAAE,MAAM,CAAC;IAGhC,OAAO,EAAE,MAAM,CAAC;IAChB,cAAc,EAAE,MAAM,CAAC;IAGvB,cAAc,EAAE,MAAM,CAAC;IACvB,gBAAgB,EAAE,MAAM,CAAC;IACzB,cAAc,EAAE,MAAM,CAAC;IAGvB,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,WAAW,OAAO;IACtB,EAAE,EAAE,MAAM,CAAC;IACX,EAAE,EAAE,MAAM,CAAC;IACX,EAAE,EAAE,MAAM,CAAC;IACX,EAAE,EAAE,MAAM,CAAC;IACX,EAAE,EAAE,MAAM,CAAC;IACX,GAAG,EAAE,MAAM,CAAC;IACZ,IAAI,EAAE,MAAM,CAAC;CACd;AAGD,MAAM,MAAM,UAAU,GAAG,mBAAmB,GAAG,MAAM,CAAC;AAEtD,MAAM,WAAW,UAAU;IACzB,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,IAAI,CAAC,EAAE,UAAU,CAAC;CACnB;AAED,MAAM,WAAW,UAAU;IACzB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,WAAW;IAC1B,KAAK,EAAE,UAAU,EAAE,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAGD,MAAM,MAAM,WAAW,GACnB,SAAS,GACT,eAAe,GACf,UAAU,GACV,aAAa,GACb,WAAW,GACX,QAAQ,GACR,WAAW,GACX,YAAY,GACZ,wBAAwB,GACxB,UAAU,GACV,iBAAiB,GACjB,QAAQ,CAAC;AAGb,MAAM,WAAW,YAAY;IAC3B,OAAO,CAAC,EAAE,WAAW,CAAC;IACtB,IAAI,EAAE,MAAM,CAAC;CACd;AAID,MAAM,WAAW,cAAc;IAG7B,GAAG,CAAC,EAAE,YAAY,GAAG,MAAM,CAAC;IAC5B,MAAM,CAAC,EAAE,YAAY,GAAG,MAAM,CAAC;CAChC;AAED,MAAM,WAAW,cAAc;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,EAAE,cAAc,CAAC;CACtB;AAED,MAAM,WAAW,gBAAgB;IAC/B,KAAK,EAAE,cAAc,EAAE,CAAC;CACzB"}

package/dist/brand/brand-types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=brand-types.js.map

package/dist/brand/brand-types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"brand-types.js","sourceRoot":"","sources":["../../brand/brand-types.ts"],"names":[],"mappings":""}

package/dist/brand/default-brand.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Default brand configuration using Material Design 3 reference colors.
+ * Uses seed-based palette generation for automatic light/dark theme creation.
+ *
+ * Seed color: #6750A4 (Material Design 3 reference purple)
+ * This generates a complete, accessible color palette following M3 guidelines.
+ *
+ * Reference: https://m3.material.io/styles/color/the-color-system/color-roles
+ */
+export declare const defaultBrand: import("./brand-config").Brand;
+//# sourceMappingURL=default-brand.d.ts.map

package/dist/brand/default-brand.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"default-brand.d.ts","sourceRoot":"","sources":["../../brand/default-brand.ts"],"names":[],"mappings":"AAEA;;;;;;;;GAQG;AACH,eAAO,MAAM,YAAY,gCAoBvB,CAAC"}

package/dist/brand/default-brand.js

@@ -0,0 +1,32 @@
+import { createBrand } from './brand-config';
+/**
+ * Default brand configuration using Material Design 3 reference colors.
+ * Uses seed-based palette generation for automatic light/dark theme creation.
+ *
+ * Seed color: #6750A4 (Material Design 3 reference purple)
+ * This generates a complete, accessible color palette following M3 guidelines.
+ *
+ * Reference: https://m3.material.io/styles/color/the-color-system/color-roles
+ */
+export const defaultBrand = createBrand({
+    name: 'Zero to App',
+    // Use seed-based palette generation (recommended)
+    // This automatically generates all 26 M3 color tokens and matching dark theme
+    colors: {
+        colorSeed: {
+            primary: '#6750A4', // Material purple reference
+        },
+    },
+    spacing: {
+        xs: 4,
+        sm: 8,
+        md: 12,
+        lg: 16,
+        xl: 20,
+        xxl: 24,
+        xxxl: 40,
+    },
+    borderRadius: { xs: 4, sm: 8, md: 12, lg: 16, xl: 28, full: 9999 },
+    shape: { surfaceBorderRadius: 10, buttonBorderRadius: 9999 },
+});
+//# sourceMappingURL=default-brand.js.map

package/dist/brand/default-brand.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"default-brand.js","sourceRoot":"","sources":["../../brand/default-brand.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAE7C;;;;;;;;GAQG;AACH,MAAM,CAAC,MAAM,YAAY,GAAG,WAAW,CAAC;IACtC,IAAI,EAAE,aAAa;IACnB,kDAAkD;IAClD,8EAA8E;IAC9E,MAAM,EAAE;QACN,SAAS,EAAE;YACT,OAAO,EAAE,SAAS,EAAE,4BAA4B;SACjD;KACF;IACD,OAAO,EAAE;QACP,EAAE,EAAE,CAAC;QACL,EAAE,EAAE,CAAC;QACL,EAAE,EAAE,EAAE;QACN,EAAE,EAAE,EAAE;QACN,EAAE,EAAE,EAAE;QACN,GAAG,EAAE,EAAE;QACP,IAAI,EAAE,EAAE;KACT;IACD,YAAY,EAAE,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE;IAClE,KAAK,EAAE,EAAE,mBAAmB,EAAE,EAAE,EAAE,kBAAkB,EAAE,IAAI,EAAE;CAC7D,CAAC,CAAC"}

package/dist/brand/index.d.ts

@@ -1,4 +1,6 @@
-export { createBrand, type Brand, type BrandConfig } from './brandConfig';
-export * from './brandTypes';
-export { useBrand, BrandProvider } from './brandContext';
+export { createBrand, type Brand, type BrandConfig } from './brand-config';
+export * from './brand-types';
+export { useBrandConfig, BrandProvider } from './brand-context';
+export { defaultBrand } from './default-brand';
+export { generateLightColors, generateDarkColors, contrastRatio, hasContrastRatio, generateHighContrastColors, type PaletteOptions, } from './palette-generator';
 //# sourceMappingURL=index.d.ts.map

package/dist/brand/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../brand/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,WAAW,EAAE,KAAK,KAAK,EAAE,KAAK,WAAW,EAAE,MAAM,eAAe,CAAC;AAC1E,cAAc,cAAc,CAAC;AAC7B,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../brand/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,WAAW,EAAE,KAAK,KAAK,EAAE,KAAK,WAAW,EAAE,MAAM,gBAAgB,CAAC;AAC3E,cAAc,eAAe,CAAC;AAC9B,OAAO,EAAE,cAAc,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChE,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAG/C,OAAO,EACL,mBAAmB,EACnB,kBAAkB,EAClB,aAAa,EACb,gBAAgB,EAChB,0BAA0B,EAC1B,KAAK,cAAc,GACpB,MAAM,qBAAqB,CAAC"}

package/dist/brand/index.js

@@ -1,5 +1,8 @@
 // Export brand from local files
-export { createBrand } from './brandConfig';
-export * from './brandTypes';
-export { useBrand, BrandProvider } from './brandContext';
+export { createBrand } from './brand-config';
+export * from './brand-types';
+export { useBrandConfig, BrandProvider } from './brand-context';
+export { defaultBrand } from './default-brand';
+// Material Color Utilities
+export { generateLightColors, generateDarkColors, contrastRatio, hasContrastRatio, generateHighContrastColors, } from './palette-generator';
 //# sourceMappingURL=index.js.map

package/dist/brand/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../brand/index.ts"],"names":[],"mappings":"AAAA,gCAAgC;AAChC,OAAO,EAAE,WAAW,EAAgC,MAAM,eAAe,CAAC;AAC1E,cAAc,cAAc,CAAC;AAC7B,OAAO,EAAE,QAAQ,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../brand/index.ts"],"names":[],"mappings":"AAAA,gCAAgC;AAChC,OAAO,EAAE,WAAW,EAAgC,MAAM,gBAAgB,CAAC;AAC3E,cAAc,eAAe,CAAC;AAC9B,OAAO,EAAE,cAAc,EAAE,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAChE,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAE/C,2BAA2B;AAC3B,OAAO,EACL,mBAAmB,EACnB,kBAAkB,EAClB,aAAa,EACb,gBAAgB,EAChB,0BAA0B,GAE3B,MAAM,qBAAqB,CAAC"}

package/dist/brand/palette-generator.d.ts

@@ -0,0 +1,64 @@
+/**
+ * Material Design 3 Color Palette Generator
+ * Uses @material/material-color-utilities to generate tonal palettes from seed colors
+ * Reference: https://m3.material.io/styles/color/the-color-system/color-roles
+ */
+import { TonalPalette } from '@material/material-color-utilities';
+import type { Colors } from './brand-types';
+export interface PaletteOptions {
+    /** Seed color for primary palette (hex format) */
+    primary: string;
+    /** Optional seed color for secondary palette (generated from primary if not provided) */
+    secondary?: string;
+    /** Optional seed color for tertiary palette (generated from primary if not provided) */
+    tertiary?: string;
+    /** Optional seed color for error palette (uses M3 default if not provided) */
+    error?: string;
+    /** Optional seed color for neutral palette (generated from primary if not provided) */
+    neutral?: string;
+    /** Optional seed color for neutral variant palette (generated from primary if not provided) */
+    neutralVariant?: string;
+}
+/**
+ * Generates a complete Material Design 3 light theme color scheme from seed colors
+ * @param options Seed colors for generating palettes
+ * @returns Complete Colors object for light theme
+ */
+export declare function generateLightColors(options: PaletteOptions): Colors;
+/**
+ * Generates a complete Material Design 3 dark theme color scheme from seed colors
+ * @param options Seed colors for generating palettes
+ * @returns Complete Colors object for dark theme
+ */
+export declare function generateDarkColors(options: PaletteOptions): Colors;
+/**
+ * Compute the WCAG 2.1 contrast ratio between two hex colors.
+ * Returns a value between 1 (no contrast) and 21 (black on white).
+ * https://www.w3.org/TR/WCAG21/#dfn-contrast-ratio
+ */
+export declare function contrastRatio(foreground: string, background: string): number;
+/**
+ * Check if two colors meet a minimum WCAG contrast ratio.
+ * @param foreground Foreground color (hex)
+ * @param background Background color (hex)
+ * @param minRatio Minimum contrast ratio (default: 4.5 for AA compliance)
+ * @returns true if contrast meets minimum ratio
+ */
+export declare function hasContrastRatio(foreground: string, background: string, minRatio?: number): boolean;
+/**
+ * Generate high-contrast color adjustments
+ * Increases contrast for accessibility compliance
+ */
+export declare function generateHighContrastColors(baseColors: Colors): Colors;
+/**
+ * Adapter: Convert a TonalPalette into a simple map of tones -> hex strings.
+ * This provides a stable, serializable shape consumers in the codebase expect
+ * (e.g. lookups by tone value) and isolates callers from potential upstream
+ * API changes in the material-color-utilities package.
+ */
+export declare function tonalPaletteToHexMap(palette: TonalPalette): Record<number, string>;
+/**
+ * Helper: generate a hex-map directly from a seed color
+ */
+export declare function generateTonalHexMapFromSeed(seedColor: string): Record<number, string>;
+//# sourceMappingURL=palette-generator.d.ts.map

package/dist/brand/palette-generator.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"palette-generator.d.ts","sourceRoot":"","sources":["../../brand/palette-generator.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AAEH,OAAO,EAGL,YAAY,EAEb,MAAM,oCAAoC,CAAC;AAC5C,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AAE5C,MAAM,WAAW,cAAc;IAC7B,kDAAkD;IAClD,OAAO,EAAE,MAAM,CAAC;IAChB,yFAAyF;IACzF,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,wFAAwF;IACxF,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,8EAA8E;IAC9E,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,uFAAuF;IACvF,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,+FAA+F;IAC/F,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB;AAmED;;;;GAIG;AACH,wBAAgB,mBAAmB,CAAC,OAAO,EAAE,cAAc,GAAG,MAAM,CAuEnE;AAED;;;;GAIG;AACH,wBAAgB,kBAAkB,CAAC,OAAO,EAAE,cAAc,GAAG,MAAM,CAuElE;AAeD;;;;GAIG;AACH,wBAAgB,aAAa,CAAC,UAAU,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,GAAG,MAAM,CAM5E;AAED;;;;;;GAMG;AACH,wBAAgB,gBAAgB,CAC9B,UAAU,EAAE,MAAM,EAClB,UAAU,EAAE,MAAM,EAClB,QAAQ,GAAE,MAAY,GACrB,OAAO,CAET;AAED;;;GAGG;AACH,wBAAgB,0BAA0B,CAAC,UAAU,EAAE,MAAM,GAAG,MAAM,CAiBrE;AAED;;;;;GAKG;AACH,wBAAgB,oBAAoB,CAAC,OAAO,EAAE,YAAY,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAWlF;AAED;;GAEG;AACH,wBAAgB,2BAA2B,CAAC,SAAS,EAAE,MAAM,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAGrF"}