@framingui/react-native 0.1.0

package/dist/layout.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"layout.d.ts","sourceRoot":"","sources":["../src/layout.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAC9C,OAAO,EAAgB,KAAK,gBAAgB,EAAE,MAAM,YAAY,CAAC;AAEjE,MAAM,MAAM,gBAAgB,GAAG,MAAM,GAAG,SAAS,GAAG,SAAS,GAAG,OAAO,CAAC;AACxE,MAAM,MAAM,eAAe,GAAG,OAAO,GAAG,SAAS,GAAG,OAAO,CAAC;AAC5D,MAAM,MAAM,iBAAiB,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,CAAC;AAC1D,MAAM,MAAM,eAAe,GAAG,SAAS,GAAG,SAAS,GAAG,aAAa,CAAC;AACpE,MAAM,MAAM,mBAAmB,GAAG,MAAM,GAAG,SAAS,GAAG,SAAS,CAAC;AAEjE,MAAM,WAAW,gBAAgB;IAC/B,UAAU,EAAE,MAAM,CAAC;IACnB,GAAG,EAAE,MAAM,CAAC;IACZ,MAAM,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,WAAW,eAAe;IAC9B,QAAQ,EAAE,MAAM,CAAC;IACjB,SAAS,EAAE,MAAM,CAAC;IAClB,UAAU,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,WAAW,mBAAmB;IAClC,GAAG,EAAE,MAAM,CAAC;IACZ,MAAM,EAAE,MAAM,CAAC;IACf,UAAU,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,WAAW,uBAAuB;IACtC,WAAW,EAAE,MAAM,CAAC,gBAAgB,EAAE,gBAAgB,CAAC,CAAC;IACxD,UAAU,EAAE,MAAM,CAAC,eAAe,EAAE,MAAM,CAAC,CAAC;IAC5C,YAAY,EAAE,MAAM,CAAC,iBAAiB,EAAE,MAAM,GAAG,IAAI,CAAC,CAAC;IACvD,UAAU,EAAE,MAAM,CAAC,eAAe,EAAE,eAAe,CAAC,CAAC;IACrD,QAAQ,EAAE,MAAM,CAAC,mBAAmB,EAAE,mBAAmB,CAAC,CAAC;CAC5D;AAED,wBAAgB,mBAAmB,CACjC,KAAK,GAAE,gBAA+B,GACrC,uBAAuB,CA6DzB;AAED,wBAAgB,mBAAmB,CACjC,KAAK,EAAE,gBAAgB,EACvB,KAAK,GAAE,gBAA+B,GACrC,IAAI,CAAC,SAAS,EAAE,mBAAmB,GAAG,YAAY,GAAG,eAAe,CAAC,CAOvE;AAED,wBAAgB,kBAAkB,CAChC,KAAK,EAAE,eAAe,EACtB,KAAK,GAAE,gBAA+B,GACrC,IAAI,CAAC,SAAS,EAAE,KAAK,CAAC,CAExB;AAED,wBAAgB,oBAAoB,CAClC,KAAK,EAAE,iBAAiB,EACxB,KAAK,GAAE,gBAA+B,GACrC,IAAI,CAAC,SAAS,EAAE,UAAU,GAAG,OAAO,GAAG,WAAW,CAAC,CAOrD;AAED,wBAAgB,aAAa,CAC3B,KAAK,EAAE,eAAe,EACtB,KAAK,GAAE,gBAA+B,GACrC,eAAe,CAEjB;AAED,wBAAgB,uBAAuB,CACrC,KAAK,EAAE,mBAAmB,EAC1B,KAAK,GAAE,gBAA+B,GACrC,IAAI,CAAC,SAAS,EAAE,YAAY,GAAG,eAAe,GAAG,mBAAmB,CAAC,CAOvE"}

package/dist/layout.js

@@ -0,0 +1,94 @@
+import { defaultTheme } from './theme.js';
+export function resolveLayoutTokens(theme = defaultTheme) {
+    return {
+        screenInset: {
+            none: { horizontal: 0, top: 0, bottom: 0 },
+            compact: {
+                horizontal: theme.spacing[4],
+                top: theme.spacing[4],
+                bottom: theme.spacing[5],
+            },
+            default: {
+                horizontal: theme.spacing[6],
+                top: theme.spacing[6],
+                bottom: theme.spacing[8],
+            },
+            roomy: {
+                horizontal: theme.spacing[8],
+                top: theme.spacing[8],
+                bottom: theme.spacing[10],
+            },
+        },
+        sectionGap: {
+            tight: theme.spacing[3],
+            default: theme.spacing[4],
+            loose: theme.spacing[6],
+        },
+        contentWidth: {
+            full: null,
+            form: 480,
+            prose: 680,
+        },
+        formRhythm: {
+            compact: {
+                fieldGap: theme.spacing[2],
+                helperGap: theme.spacing[1],
+                sectionGap: theme.spacing[4],
+            },
+            default: {
+                fieldGap: theme.spacing[3],
+                helperGap: theme.spacing[2],
+                sectionGap: theme.spacing[5],
+            },
+            comfortable: {
+                fieldGap: theme.spacing[4],
+                helperGap: theme.spacing[2],
+                sectionGap: theme.spacing[6],
+            },
+        },
+        safeArea: {
+            none: { top: 0, bottom: 0, horizontal: 0 },
+            compact: {
+                top: theme.spacing[3],
+                bottom: theme.spacing[4],
+                horizontal: theme.spacing[4],
+            },
+            default: {
+                top: theme.spacing[4],
+                bottom: theme.spacing[6],
+                horizontal: theme.spacing[6],
+            },
+        },
+    };
+}
+export function getScreenInsetStyle(token, theme = defaultTheme) {
+    const value = resolveLayoutTokens(theme).screenInset[token];
+    return {
+        paddingHorizontal: value.horizontal,
+        paddingTop: value.top,
+        paddingBottom: value.bottom,
+    };
+}
+export function getSectionGapStyle(token, theme = defaultTheme) {
+    return { gap: resolveLayoutTokens(theme).sectionGap[token] };
+}
+export function getContentWidthStyle(token, theme = defaultTheme) {
+    const maxWidth = resolveLayoutTokens(theme).contentWidth[token];
+    return {
+        alignSelf: maxWidth ? 'center' : 'auto',
+        maxWidth: maxWidth ?? undefined,
+        width: '100%',
+    };
+}
+export function getFormRhythm(token, theme = defaultTheme) {
+    return resolveLayoutTokens(theme).formRhythm[token];
+}
+export function getSafeAreaPaddingStyle(token, theme = defaultTheme) {
+    const value = resolveLayoutTokens(theme).safeArea[token];
+    return {
+        paddingBottom: value.bottom,
+        paddingHorizontal: value.horizontal,
+        paddingTop: value.top,
+    };
+}
+//# sourceMappingURL=layout.js.map

package/dist/layout.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"layout.js","sourceRoot":"","sources":["../src/layout.ts"],"names":[],"mappings":"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"}

package/dist/theme.d.ts

@@ -0,0 +1,39 @@
+import { type ReactNode } from 'react';
+import { type TextStyle, type ViewStyle } from 'react-native';
+import { baseColors, baseRadius, baseShadows, baseSpacing, baseTypography, type ShadowToken, type SpacingToken, type TypographyToken } from './tokens.js';
+type DeepPartial<T> = {
+    [K in keyof T]?: T[K] extends object ? DeepPartial<T[K]> : T[K];
+};
+export interface ReactNativeTheme {
+    id: string;
+    colors: typeof baseColors;
+    spacing: typeof baseSpacing;
+    radius: typeof baseRadius;
+    typography: typeof baseTypography;
+    shadows: typeof baseShadows;
+}
+export interface ReactNativeThemeInput {
+    id?: string;
+    colors?: DeepPartial<typeof baseColors>;
+    spacing?: DeepPartial<typeof baseSpacing>;
+    radius?: DeepPartial<typeof baseRadius>;
+    typography?: DeepPartial<typeof baseTypography>;
+    shadows?: DeepPartial<typeof baseShadows>;
+}
+export declare function createTheme(input?: ReactNativeThemeInput): ReactNativeTheme;
+export declare const defaultTheme: ReactNativeTheme;
+export interface ThemeProviderProps {
+    children: ReactNode;
+    theme?: ReactNativeTheme;
+}
+export declare function ThemeProvider({ children, theme }: ThemeProviderProps): import("react/jsx-runtime").JSX.Element;
+export declare function useTheme(): ReactNativeTheme;
+type NamedStyles<T> = {
+    [K in keyof T]: ViewStyle | TextStyle;
+};
+export declare function createThemedStyles<T extends NamedStyles<T>>(factory: (theme: ReactNativeTheme) => T): (theme?: ReactNativeTheme) => T;
+export declare function getThemeTextStyle(theme: ReactNativeTheme, token: TypographyToken): TextStyle;
+export declare function getThemeShadowStyle(theme: ReactNativeTheme, token: ShadowToken): ViewStyle;
+export declare function getThemeSpacing(theme: ReactNativeTheme, token: SpacingToken): number;
+export {};
+//# sourceMappingURL=theme.d.ts.map

package/dist/theme.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme.d.ts","sourceRoot":"","sources":["../src/theme.tsx"],"names":[],"mappings":"AAAA,OAAO,EAA6B,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAClE,OAAO,EAAc,KAAK,SAAS,EAAE,KAAK,SAAS,EAAE,MAAM,cAAc,CAAC;AAC1E,OAAO,EACL,UAAU,EACV,UAAU,EACV,WAAW,EACX,WAAW,EACX,cAAc,EACd,KAAK,WAAW,EAChB,KAAK,YAAY,EACjB,KAAK,eAAe,EACrB,MAAM,aAAa,CAAC;AAErB,KAAK,WAAW,CAAC,CAAC,IAAI;KACnB,CAAC,IAAI,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,CAAC,SAAS,MAAM,GAAG,WAAW,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;CAChE,CAAC;AAEF,MAAM,WAAW,gBAAgB;IAC/B,EAAE,EAAE,MAAM,CAAC;IACX,MAAM,EAAE,OAAO,UAAU,CAAC;IAC1B,OAAO,EAAE,OAAO,WAAW,CAAC;IAC5B,MAAM,EAAE,OAAO,UAAU,CAAC;IAC1B,UAAU,EAAE,OAAO,cAAc,CAAC;IAClC,OAAO,EAAE,OAAO,WAAW,CAAC;CAC7B;AAED,MAAM,WAAW,qBAAqB;IACpC,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,MAAM,CAAC,EAAE,WAAW,CAAC,OAAO,UAAU,CAAC,CAAC;IACxC,OAAO,CAAC,EAAE,WAAW,CAAC,OAAO,WAAW,CAAC,CAAC;IAC1C,MAAM,CAAC,EAAE,WAAW,CAAC,OAAO,UAAU,CAAC,CAAC;IACxC,UAAU,CAAC,EAAE,WAAW,CAAC,OAAO,cAAc,CAAC,CAAC;IAChD,OAAO,CAAC,EAAE,WAAW,CAAC,OAAO,WAAW,CAAC,CAAC;CAC3C;AA2BD,wBAAgB,WAAW,CAAC,KAAK,GAAE,qBAA0B,GAAG,gBAAgB,CAS/E;AAED,eAAO,MAAM,YAAY,kBAAgB,CAAC;AAI1C,MAAM,WAAW,kBAAkB;IACjC,QAAQ,EAAE,SAAS,CAAC;IACpB,KAAK,CAAC,EAAE,gBAAgB,CAAC;CAC1B;AAED,wBAAgB,aAAa,CAAC,EAAE,QAAQ,EAAE,KAAoB,EAAE,EAAE,kBAAkB,2CAEnF;AAED,wBAAgB,QAAQ,IAAI,gBAAgB,CAE3C;AAED,KAAK,WAAW,CAAC,CAAC,IAAI;KAAG,CAAC,IAAI,MAAM,CAAC,GAAG,SAAS,GAAG,SAAS;CAAE,CAAC;AAEhE,wBAAgB,kBAAkB,CAAC,CAAC,SAAS,WAAW,CAAC,CAAC,CAAC,EACzD,OAAO,EAAE,CAAC,KAAK,EAAE,gBAAgB,KAAK,CAAC,IAE/B,QAAO,gBAA+B,KAAG,CAAC,CACnD;AAED,wBAAgB,iBAAiB,CAAC,KAAK,EAAE,gBAAgB,EAAE,KAAK,EAAE,eAAe,GAAG,SAAS,CAE5F;AAED,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,gBAAgB,EAAE,KAAK,EAAE,WAAW,GAAG,SAAS,CAE1F;AAED,wBAAgB,eAAe,CAAC,KAAK,EAAE,gBAAgB,EAAE,KAAK,EAAE,YAAY,GAAG,MAAM,CAEpF"}

package/dist/theme.js

@@ -0,0 +1,53 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createContext, useContext } from 'react';
+import { StyleSheet } from 'react-native';
+import { baseColors, baseRadius, baseShadows, baseSpacing, baseTypography, } from './tokens.js';
+function mergeRecord(base, input) {
+    if (!input) {
+        return { ...base };
+    }
+    const mergedEntries = Object.entries(base).map(([key, value]) => {
+        const nextValue = input[key];
+        if (value !== null &&
+            typeof value === 'object' &&
+            !Array.isArray(value) &&
+            nextValue !== null &&
+            typeof nextValue === 'object' &&
+            !Array.isArray(nextValue)) {
+            return [key, mergeRecord(value, nextValue)];
+        }
+        return [key, nextValue ?? value];
+    });
+    return Object.fromEntries(mergedEntries);
+}
+export function createTheme(input = {}) {
+    return {
+        id: input.id ?? 'default',
+        colors: mergeRecord(baseColors, input.colors),
+        spacing: mergeRecord(baseSpacing, input.spacing),
+        radius: mergeRecord(baseRadius, input.radius),
+        typography: mergeRecord(baseTypography, input.typography),
+        shadows: mergeRecord(baseShadows, input.shadows),
+    };
+}
+export const defaultTheme = createTheme();
+const ThemeContext = createContext(defaultTheme);
+export function ThemeProvider({ children, theme = defaultTheme }) {
+    return _jsx(ThemeContext.Provider, { value: theme, children: children });
+}
+export function useTheme() {
+    return useContext(ThemeContext);
+}
+export function createThemedStyles(factory) {
+    return (theme = defaultTheme) => StyleSheet.create(factory(theme));
+}
+export function getThemeTextStyle(theme, token) {
+    return theme.typography[token];
+}
+export function getThemeShadowStyle(theme, token) {
+    return theme.shadows[token];
+}
+export function getThemeSpacing(theme, token) {
+    return theme.spacing[token];
+}
+//# sourceMappingURL=theme.js.map

package/dist/theme.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme.js","sourceRoot":"","sources":["../src/theme.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,aAAa,EAAE,UAAU,EAAkB,MAAM,OAAO,CAAC;AAClE,OAAO,EAAE,UAAU,EAAkC,MAAM,cAAc,CAAC;AAC1E,OAAO,EACL,UAAU,EACV,UAAU,EACV,WAAW,EACX,WAAW,EACX,cAAc,GAIf,MAAM,aAAa,CAAC;AAwBrB,SAAS,WAAW,CAAgC,IAAO,EAAE,KAAsB;IACjF,IAAI,CAAC,KAAK,EAAE,CAAC;QACX,OAAO,EAAE,GAAG,IAAI,EAAE,CAAC;IACrB,CAAC;IAED,MAAM,aAAa,GAAG,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,EAAE,KAAK,CAAC,EAAE,EAAE;QAC9D,MAAM,SAAS,GAAG,KAAK,CAAC,GAAc,CAAC,CAAC;QAExC,IACE,KAAK,KAAK,IAAI;YACd,OAAO,KAAK,KAAK,QAAQ;YACzB,CAAC,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC;YACrB,SAAS,KAAK,IAAI;YAClB,OAAO,SAAS,KAAK,QAAQ;YAC7B,CAAC,KAAK,CAAC,OAAO,CAAC,SAAS,CAAC,EACzB,CAAC;YACD,OAAO,CAAC,GAAG,EAAE,WAAW,CAAC,KAAK,EAAE,SAAsC,CAAC,CAAC,CAAC;QAC3E,CAAC;QAED,OAAO,CAAC,GAAG,EAAE,SAAS,IAAI,KAAK,CAAC,CAAC;IACnC,CAAC,CAAC,CAAC;IAEH,OAAO,MAAM,CAAC,WAAW,CAAC,aAAa,CAAM,CAAC;AAChD,CAAC;AAED,MAAM,UAAU,WAAW,CAAC,QAA+B,EAAE;IAC3D,OAAO;QACL,EAAE,EAAE,KAAK,CAAC,EAAE,IAAI,SAAS;QACzB,MAAM,EAAE,WAAW,CAAC,UAAU,EAAE,KAAK,CAAC,MAAM,CAAC;QAC7C,OAAO,EAAE,WAAW,CAAC,WAAW,EAAE,KAAK,CAAC,OAAO,CAAC;QAChD,MAAM,EAAE,WAAW,CAAC,UAAU,EAAE,KAAK,CAAC,MAAM,CAAC;QAC7C,UAAU,EAAE,WAAW,CAAC,cAAc,EAAE,KAAK,CAAC,UAAU,CAAC;QACzD,OAAO,EAAE,WAAW,CAAC,WAAW,EAAE,KAAK,CAAC,OAAO,CAAC;KACjD,CAAC;AACJ,CAAC;AAED,MAAM,CAAC,MAAM,YAAY,GAAG,WAAW,EAAE,CAAC;AAE1C,MAAM,YAAY,GAAG,aAAa,CAAmB,YAAY,CAAC,CAAC;AAOnE,MAAM,UAAU,aAAa,CAAC,EAAE,QAAQ,EAAE,KAAK,GAAG,YAAY,EAAsB;IAClF,OAAO,KAAC,YAAY,CAAC,QAAQ,IAAC,KAAK,EAAE,KAAK,YAAG,QAAQ,GAAyB,CAAC;AACjF,CAAC;AAED,MAAM,UAAU,QAAQ;IACtB,OAAO,UAAU,CAAC,YAAY,CAAC,CAAC;AAClC,CAAC;AAID,MAAM,UAAU,kBAAkB,CAChC,OAAuC;IAEvC,OAAO,CAAC,QAA0B,YAAY,EAAK,EAAE,CAAC,UAAU,CAAC,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC;AAC1F,CAAC;AAED,MAAM,UAAU,iBAAiB,CAAC,KAAuB,EAAE,KAAsB;IAC/E,OAAO,KAAK,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC;AACjC,CAAC;AAED,MAAM,UAAU,mBAAmB,CAAC,KAAuB,EAAE,KAAkB;IAC7E,OAAO,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;AAC9B,CAAC;AAED,MAAM,UAAU,eAAe,CAAC,KAAuB,EAAE,KAAmB;IAC1E,OAAO,KAAK,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC;AAC9B,CAAC"}

package/dist/tokens.d.ts

@@ -0,0 +1,345 @@
+export declare const baseColors: {
+    readonly background: {
+        readonly canvas: "#FFFFFF";
+        readonly muted: "#FAFAFA";
+        readonly subtle: "#F5F5F7";
+    };
+    readonly surface: {
+        readonly base: "#FFFFFF";
+        readonly muted: "#FAFAFA";
+        readonly danger: "#FFF0F0";
+    };
+    readonly text: {
+        readonly primary: "#111111";
+        readonly secondary: "#666666";
+        readonly tertiary: "#8A8A8E";
+        readonly inverse: "#FFFFFF";
+        readonly accent: "#0A84FF";
+        readonly danger: "#D93025";
+    };
+    readonly border: {
+        readonly subtle: "#ECECEF";
+        readonly default: "#E0E0E0";
+        readonly accent: "#0A84FF";
+        readonly danger: "#D93025";
+    };
+    readonly action: {
+        readonly primary: "#0A84FF";
+        readonly primaryPressed: "#0069D9";
+        readonly primaryDisabled: "#A7CCFF";
+    };
+};
+export declare const baseSpacing: {
+    readonly 0: 0;
+    readonly 1: 4;
+    readonly 2: 8;
+    readonly 3: 12;
+    readonly 4: 16;
+    readonly 5: 20;
+    readonly 6: 24;
+    readonly 8: 32;
+    readonly 10: 40;
+    readonly 12: 48;
+};
+export declare const baseRadius: {
+    readonly sm: 8;
+    readonly md: 12;
+    readonly lg: 16;
+    readonly full: 999;
+};
+export declare const baseTypography: {
+    readonly display: {
+        readonly fontSize: 32;
+        readonly lineHeight: 38;
+        readonly fontWeight: "700";
+    };
+    readonly title: {
+        readonly fontSize: 28;
+        readonly lineHeight: 34;
+        readonly fontWeight: "700";
+    };
+    readonly sectionTitle: {
+        readonly fontSize: 20;
+        readonly lineHeight: 26;
+        readonly fontWeight: "700";
+    };
+    readonly body: {
+        readonly fontSize: 16;
+        readonly lineHeight: 24;
+        readonly fontWeight: "400";
+    };
+    readonly bodyStrong: {
+        readonly fontSize: 16;
+        readonly lineHeight: 24;
+        readonly fontWeight: "600";
+    };
+    readonly button: {
+        readonly fontSize: 16;
+        readonly lineHeight: 20;
+        readonly fontWeight: "600";
+    };
+    readonly label: {
+        readonly fontSize: 14;
+        readonly lineHeight: 20;
+        readonly fontWeight: "500";
+    };
+    readonly caption: {
+        readonly fontSize: 14;
+        readonly lineHeight: 20;
+        readonly fontWeight: "400";
+    };
+};
+export declare const baseShadows: {
+    readonly card: {
+        readonly shadowColor: "#000000";
+        readonly shadowOpacity: 0.08;
+        readonly shadowRadius: 12;
+        readonly shadowOffset: {
+            readonly width: 0;
+            readonly height: 6;
+        };
+        readonly elevation: 2;
+    };
+    readonly focus: {
+        readonly shadowColor: "#0A84FF";
+        readonly shadowOpacity: 0.18;
+        readonly shadowRadius: 10;
+        readonly shadowOffset: {
+            readonly width: 0;
+            readonly height: 4;
+        };
+        readonly elevation: 2;
+    };
+};
+export declare const colors: {
+    readonly background: {
+        readonly canvas: "#FFFFFF";
+        readonly muted: "#FAFAFA";
+        readonly subtle: "#F5F5F7";
+    };
+    readonly surface: {
+        readonly base: "#FFFFFF";
+        readonly muted: "#FAFAFA";
+        readonly danger: "#FFF0F0";
+    };
+    readonly text: {
+        readonly primary: "#111111";
+        readonly secondary: "#666666";
+        readonly tertiary: "#8A8A8E";
+        readonly inverse: "#FFFFFF";
+        readonly accent: "#0A84FF";
+        readonly danger: "#D93025";
+    };
+    readonly border: {
+        readonly subtle: "#ECECEF";
+        readonly default: "#E0E0E0";
+        readonly accent: "#0A84FF";
+        readonly danger: "#D93025";
+    };
+    readonly action: {
+        readonly primary: "#0A84FF";
+        readonly primaryPressed: "#0069D9";
+        readonly primaryDisabled: "#A7CCFF";
+    };
+};
+export declare const spacing: {
+    readonly 0: 0;
+    readonly 1: 4;
+    readonly 2: 8;
+    readonly 3: 12;
+    readonly 4: 16;
+    readonly 5: 20;
+    readonly 6: 24;
+    readonly 8: 32;
+    readonly 10: 40;
+    readonly 12: 48;
+};
+export declare const radius: {
+    readonly sm: 8;
+    readonly md: 12;
+    readonly lg: 16;
+    readonly full: 999;
+};
+export declare const typography: {
+    readonly display: {
+        readonly fontSize: 32;
+        readonly lineHeight: 38;
+        readonly fontWeight: "700";
+    };
+    readonly title: {
+        readonly fontSize: 28;
+        readonly lineHeight: 34;
+        readonly fontWeight: "700";
+    };
+    readonly sectionTitle: {
+        readonly fontSize: 20;
+        readonly lineHeight: 26;
+        readonly fontWeight: "700";
+    };
+    readonly body: {
+        readonly fontSize: 16;
+        readonly lineHeight: 24;
+        readonly fontWeight: "400";
+    };
+    readonly bodyStrong: {
+        readonly fontSize: 16;
+        readonly lineHeight: 24;
+        readonly fontWeight: "600";
+    };
+    readonly button: {
+        readonly fontSize: 16;
+        readonly lineHeight: 20;
+        readonly fontWeight: "600";
+    };
+    readonly label: {
+        readonly fontSize: 14;
+        readonly lineHeight: 20;
+        readonly fontWeight: "500";
+    };
+    readonly caption: {
+        readonly fontSize: 14;
+        readonly lineHeight: 20;
+        readonly fontWeight: "400";
+    };
+};
+export declare const shadows: {
+    readonly card: {
+        readonly shadowColor: "#000000";
+        readonly shadowOpacity: 0.08;
+        readonly shadowRadius: 12;
+        readonly shadowOffset: {
+            readonly width: 0;
+            readonly height: 6;
+        };
+        readonly elevation: 2;
+    };
+    readonly focus: {
+        readonly shadowColor: "#0A84FF";
+        readonly shadowOpacity: 0.18;
+        readonly shadowRadius: 10;
+        readonly shadowOffset: {
+            readonly width: 0;
+            readonly height: 4;
+        };
+        readonly elevation: 2;
+    };
+};
+export declare const tokens: {
+    readonly colors: {
+        readonly background: {
+            readonly canvas: "#FFFFFF";
+            readonly muted: "#FAFAFA";
+            readonly subtle: "#F5F5F7";
+        };
+        readonly surface: {
+            readonly base: "#FFFFFF";
+            readonly muted: "#FAFAFA";
+            readonly danger: "#FFF0F0";
+        };
+        readonly text: {
+            readonly primary: "#111111";
+            readonly secondary: "#666666";
+            readonly tertiary: "#8A8A8E";
+            readonly inverse: "#FFFFFF";
+            readonly accent: "#0A84FF";
+            readonly danger: "#D93025";
+        };
+        readonly border: {
+            readonly subtle: "#ECECEF";
+            readonly default: "#E0E0E0";
+            readonly accent: "#0A84FF";
+            readonly danger: "#D93025";
+        };
+        readonly action: {
+            readonly primary: "#0A84FF";
+            readonly primaryPressed: "#0069D9";
+            readonly primaryDisabled: "#A7CCFF";
+        };
+    };
+    readonly spacing: {
+        readonly 0: 0;
+        readonly 1: 4;
+        readonly 2: 8;
+        readonly 3: 12;
+        readonly 4: 16;
+        readonly 5: 20;
+        readonly 6: 24;
+        readonly 8: 32;
+        readonly 10: 40;
+        readonly 12: 48;
+    };
+    readonly radius: {
+        readonly sm: 8;
+        readonly md: 12;
+        readonly lg: 16;
+        readonly full: 999;
+    };
+    readonly typography: {
+        readonly display: {
+            readonly fontSize: 32;
+            readonly lineHeight: 38;
+            readonly fontWeight: "700";
+        };
+        readonly title: {
+            readonly fontSize: 28;
+            readonly lineHeight: 34;
+            readonly fontWeight: "700";
+        };
+        readonly sectionTitle: {
+            readonly fontSize: 20;
+            readonly lineHeight: 26;
+            readonly fontWeight: "700";
+        };
+        readonly body: {
+            readonly fontSize: 16;
+            readonly lineHeight: 24;
+            readonly fontWeight: "400";
+        };
+        readonly bodyStrong: {
+            readonly fontSize: 16;
+            readonly lineHeight: 24;
+            readonly fontWeight: "600";
+        };
+        readonly button: {
+            readonly fontSize: 16;
+            readonly lineHeight: 20;
+            readonly fontWeight: "600";
+        };
+        readonly label: {
+            readonly fontSize: 14;
+            readonly lineHeight: 20;
+            readonly fontWeight: "500";
+        };
+        readonly caption: {
+            readonly fontSize: 14;
+            readonly lineHeight: 20;
+            readonly fontWeight: "400";
+        };
+    };
+    readonly shadows: {
+        readonly card: {
+            readonly shadowColor: "#000000";
+            readonly shadowOpacity: 0.08;
+            readonly shadowRadius: 12;
+            readonly shadowOffset: {
+                readonly width: 0;
+                readonly height: 6;
+            };
+            readonly elevation: 2;
+        };
+        readonly focus: {
+            readonly shadowColor: "#0A84FF";
+            readonly shadowOpacity: 0.18;
+            readonly shadowRadius: 10;
+            readonly shadowOffset: {
+                readonly width: 0;
+                readonly height: 4;
+            };
+            readonly elevation: 2;
+        };
+    };
+};
+export type TypographyToken = keyof typeof typography;
+export type ShadowToken = keyof typeof shadows;
+export type SpacingToken = keyof typeof spacing;
+//# sourceMappingURL=tokens.d.ts.map

package/dist/tokens.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tokens.d.ts","sourceRoot":"","sources":["../src/tokens.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA8Bb,CAAC;AAEX,eAAO,MAAM,WAAW;;;;;;;;;;;CAWd,CAAC;AAEX,eAAO,MAAM,UAAU;;;;;CAKb,CAAC;AAEX,eAAO,MAAM,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAyCmE,CAAC;AAE/F,eAAO,MAAM,WAAW;;;;;;;;;;;;;;;;;;;;;CAwBvB,CAAC;AAEF,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAAa,CAAC;AACjC,eAAO,MAAM,OAAO;;;;;;;;;;;CAAc,CAAC;AACnC,eAAO,MAAM,MAAM;;;;;CAAa,CAAC;AACjC,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAAiB,CAAC;AACzC,eAAO,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;CAAc,CAAC;AAEnC,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAMT,CAAC;AAEX,MAAM,MAAM,eAAe,GAAG,MAAM,OAAO,UAAU,CAAC;AACtD,MAAM,MAAM,WAAW,GAAG,MAAM,OAAO,OAAO,CAAC;AAC/C,MAAM,MAAM,YAAY,GAAG,MAAM,OAAO,OAAO,CAAC"}

package/dist/tokens.js

@@ -0,0 +1,126 @@
+export const baseColors = {
+    background: {
+        canvas: '#FFFFFF',
+        muted: '#FAFAFA',
+        subtle: '#F5F5F7',
+    },
+    surface: {
+        base: '#FFFFFF',
+        muted: '#FAFAFA',
+        danger: '#FFF0F0',
+    },
+    text: {
+        primary: '#111111',
+        secondary: '#666666',
+        tertiary: '#8A8A8E',
+        inverse: '#FFFFFF',
+        accent: '#0A84FF',
+        danger: '#D93025',
+    },
+    border: {
+        subtle: '#ECECEF',
+        default: '#E0E0E0',
+        accent: '#0A84FF',
+        danger: '#D93025',
+    },
+    action: {
+        primary: '#0A84FF',
+        primaryPressed: '#0069D9',
+        primaryDisabled: '#A7CCFF',
+    },
+};
+export const baseSpacing = {
+    0: 0,
+    1: 4,
+    2: 8,
+    3: 12,
+    4: 16,
+    5: 20,
+    6: 24,
+    8: 32,
+    10: 40,
+    12: 48,
+};
+export const baseRadius = {
+    sm: 8,
+    md: 12,
+    lg: 16,
+    full: 999,
+};
+export const baseTypography = {
+    display: {
+        fontSize: 32,
+        lineHeight: 38,
+        fontWeight: '700',
+    },
+    title: {
+        fontSize: 28,
+        lineHeight: 34,
+        fontWeight: '700',
+    },
+    sectionTitle: {
+        fontSize: 20,
+        lineHeight: 26,
+        fontWeight: '700',
+    },
+    body: {
+        fontSize: 16,
+        lineHeight: 24,
+        fontWeight: '400',
+    },
+    bodyStrong: {
+        fontSize: 16,
+        lineHeight: 24,
+        fontWeight: '600',
+    },
+    button: {
+        fontSize: 16,
+        lineHeight: 20,
+        fontWeight: '600',
+    },
+    label: {
+        fontSize: 14,
+        lineHeight: 20,
+        fontWeight: '500',
+    },
+    caption: {
+        fontSize: 14,
+        lineHeight: 20,
+        fontWeight: '400',
+    },
+};
+export const baseShadows = {
+    card: {
+        shadowColor: '#000000',
+        shadowOpacity: 0.08,
+        shadowRadius: 12,
+        shadowOffset: {
+            width: 0,
+            height: 6,
+        },
+        elevation: 2,
+    },
+    focus: {
+        shadowColor: '#0A84FF',
+        shadowOpacity: 0.18,
+        shadowRadius: 10,
+        shadowOffset: {
+            width: 0,
+            height: 4,
+        },
+        elevation: 2,
+    },
+};
+export const colors = baseColors;
+export const spacing = baseSpacing;
+export const radius = baseRadius;
+export const typography = baseTypography;
+export const shadows = baseShadows;
+export const tokens = {
+    colors,
+    spacing,
+    radius,
+    typography,
+    shadows,
+};
+//# sourceMappingURL=tokens.js.map

package/dist/tokens.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tokens.js","sourceRoot":"","sources":["../src/tokens.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,UAAU,GAAG;IACxB,UAAU,EAAE;QACV,MAAM,EAAE,SAAS;QACjB,KAAK,EAAE,SAAS;QAChB,MAAM,EAAE,SAAS;KAClB;IACD,OAAO,EAAE;QACP,IAAI,EAAE,SAAS;QACf,KAAK,EAAE,SAAS;QAChB,MAAM,EAAE,SAAS;KAClB;IACD,IAAI,EAAE;QACJ,OAAO,EAAE,SAAS;QAClB,SAAS,EAAE,SAAS;QACpB,QAAQ,EAAE,SAAS;QACnB,OAAO,EAAE,SAAS;QAClB,MAAM,EAAE,SAAS;QACjB,MAAM,EAAE,SAAS;KAClB;IACD,MAAM,EAAE;QACN,MAAM,EAAE,SAAS;QACjB,OAAO,EAAE,SAAS;QAClB,MAAM,EAAE,SAAS;QACjB,MAAM,EAAE,SAAS;KAClB;IACD,MAAM,EAAE;QACN,OAAO,EAAE,SAAS;QAClB,cAAc,EAAE,SAAS;QACzB,eAAe,EAAE,SAAS;KAC3B;CACO,CAAC;AAEX,MAAM,CAAC,MAAM,WAAW,GAAG;IACzB,CAAC,EAAE,CAAC;IACJ,CAAC,EAAE,CAAC;IACJ,CAAC,EAAE,CAAC;IACJ,CAAC,EAAE,EAAE;IACL,CAAC,EAAE,EAAE;IACL,CAAC,EAAE,EAAE;IACL,CAAC,EAAE,EAAE;IACL,CAAC,EAAE,EAAE;IACL,EAAE,EAAE,EAAE;IACN,EAAE,EAAE,EAAE;CACE,CAAC;AAEX,MAAM,CAAC,MAAM,UAAU,GAAG;IACxB,EAAE,EAAE,CAAC;IACL,EAAE,EAAE,EAAE;IACN,EAAE,EAAE,EAAE;IACN,IAAI,EAAE,GAAG;CACD,CAAC;AAEX,MAAM,CAAC,MAAM,cAAc,GAAG;IAC5B,OAAO,EAAE;QACP,QAAQ,EAAE,EAAE;QACZ,UAAU,EAAE,EAAE;QACd,UAAU,EAAE,KAAK;KAClB;IACD,KAAK,EAAE;QACL,QAAQ,EAAE,EAAE;QACZ,UAAU,EAAE,EAAE;QACd,UAAU,EAAE,KAAK;KAClB;IACD,YAAY,EAAE;QACZ,QAAQ,EAAE,EAAE;QACZ,UAAU,EAAE,EAAE;QACd,UAAU,EAAE,KAAK;KAClB;IACD,IAAI,EAAE;QACJ,QAAQ,EAAE,EAAE;QACZ,UAAU,EAAE,EAAE;QACd,UAAU,EAAE,KAAK;KAClB;IACD,UAAU,EAAE;QACV,QAAQ,EAAE,EAAE;QACZ,UAAU,EAAE,EAAE;QACd,UAAU,EAAE,KAAK;KAClB;IACD,MAAM,EAAE;QACN,QAAQ,EAAE,EAAE;QACZ,UAAU,EAAE,EAAE;QACd,UAAU,EAAE,KAAK;KAClB;IACD,KAAK,EAAE;QACL,QAAQ,EAAE,EAAE;QACZ,UAAU,EAAE,EAAE;QACd,UAAU,EAAE,KAAK;KAClB;IACD,OAAO,EAAE;QACP,QAAQ,EAAE,EAAE;QACZ,UAAU,EAAE,EAAE;QACd,UAAU,EAAE,KAAK;KAClB;CAC2F,CAAC;AAE/F,MAAM,CAAC,MAAM,WAAW,GAAG;IACzB,IAAI,EAAE;QACJ,WAAW,EAAE,SAAS;QACtB,aAAa,EAAE,IAAI;QACnB,YAAY,EAAE,EAAE;QAChB,YAAY,EAAE;YACZ,KAAK,EAAE,CAAC;YACR,MAAM,EAAE,CAAC;SACV;QACD,SAAS,EAAE,CAAC;KACb;IACD,KAAK,EAAE;QACL,WAAW,EAAE,SAAS;QACtB,aAAa,EAAE,IAAI;QACnB,YAAY,EAAE,EAAE;QAChB,YAAY,EAAE;YACZ,KAAK,EAAE,CAAC;YACR,MAAM,EAAE,CAAC;SACV;QACD,SAAS,EAAE,CAAC;KACb;CAIF,CAAC;AAEF,MAAM,CAAC,MAAM,MAAM,GAAG,UAAU,CAAC;AACjC,MAAM,CAAC,MAAM,OAAO,GAAG,WAAW,CAAC;AACnC,MAAM,CAAC,MAAM,MAAM,GAAG,UAAU,CAAC;AACjC,MAAM,CAAC,MAAM,UAAU,GAAG,cAAc,CAAC;AACzC,MAAM,CAAC,MAAM,OAAO,GAAG,WAAW,CAAC;AAEnC,MAAM,CAAC,MAAM,MAAM,GAAG;IACpB,MAAM;IACN,OAAO;IACP,MAAM;IACN,UAAU;IACV,OAAO;CACC,CAAC"}