@react-cupertino-ui/shared 0.0.0

package/LICENSE

@@ -0,0 +1,24 @@
+MIT License
+
+Copyright (c) 2024 Anderson Lima
+
+This project is inspired by Apple's design principles but is not affiliated with, endorsed, or sponsored by Apple Inc.
+
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/dist/index.d.ts

@@ -0,0 +1,9 @@
+export * from "./lib/interfaces/BaseProps";
+export * from "./lib/utils";
+export * from "./lib/constants/animations";
+export * from "./lib/constants/themes";
+export * from "./lib/constants/tokens/glass";
+export * from "./lib/constants/tokens/colors";
+export * from "./lib/constants/tokens/spacing";
+export * from "./lib/constants/tokens/size";
+export * from "./lib/constants/tokens/breakpoints";

package/dist/index.js

@@ -0,0 +1,9 @@
+export * from "./lib/interfaces/BaseProps";
+export * from "./lib/utils";
+export * from "./lib/constants/animations";
+export * from "./lib/constants/themes";
+export * from "./lib/constants/tokens/glass";
+export * from "./lib/constants/tokens/colors";
+export * from "./lib/constants/tokens/spacing";
+export * from "./lib/constants/tokens/size";
+export * from "./lib/constants/tokens/breakpoints";

package/dist/lib/constants/animations.d.ts

@@ -0,0 +1,26 @@
+export declare const springConfig: {
+    readonly gentle: {
+        readonly tension: 120;
+        readonly friction: 14;
+    };
+    readonly wobbly: {
+        readonly tension: 180;
+        readonly friction: 12;
+    };
+    readonly stiff: {
+        readonly tension: 210;
+        readonly friction: 20;
+    };
+    readonly slow: {
+        readonly tension: 280;
+        readonly friction: 60;
+    };
+};
+export declare const transitions: {
+    readonly fast: "150ms cubic-bezier(0.25, 0.1, 0.25, 1)";
+    readonly normal: "250ms cubic-bezier(0.25, 0.1, 0.25, 1)";
+    readonly slow: "400ms cubic-bezier(0.25, 0.1, 0.25, 1)";
+    readonly spring: "500ms cubic-bezier(0.175, 0.885, 0.32, 1.275)";
+};
+export type SpringPreset = keyof typeof springConfig;
+export type TransitionPreset = keyof typeof transitions;

package/dist/lib/constants/animations.js

@@ -0,0 +1,24 @@
+export const springConfig = {
+    gentle: {
+        tension: 120,
+        friction: 14,
+    },
+    wobbly: {
+        tension: 180,
+        friction: 12,
+    },
+    stiff: {
+        tension: 210,
+        friction: 20,
+    },
+    slow: {
+        tension: 280,
+        friction: 60,
+    },
+};
+export const transitions = {
+    fast: "150ms cubic-bezier(0.25, 0.1, 0.25, 1)",
+    normal: "250ms cubic-bezier(0.25, 0.1, 0.25, 1)",
+    slow: "400ms cubic-bezier(0.25, 0.1, 0.25, 1)",
+    spring: "500ms cubic-bezier(0.175, 0.885, 0.32, 1.275)",
+};

package/dist/lib/constants/themes/dartk.d.ts

@@ -0,0 +1,55 @@
+export declare const darkTheme: {
+    colors: {
+        "--background": string;
+        "--foreground": string;
+        "--card": string;
+        "--card-foreground": string;
+        "--popover": string;
+        "--popover-foreground": string;
+        "--primary": string;
+        "--primary-foreground": string;
+        "--secondary": string;
+        "--secondary-foreground": string;
+        "--muted": string;
+        "--muted-foreground": string;
+        "--accent": string;
+        "--accent-foreground": string;
+        "--destructive": string;
+        "--destructive-foreground": string;
+    };
+    spacing: {
+        stack: {
+            xxxs: string;
+            xxs: string;
+            xs: string;
+            sm: string;
+            md: string;
+            lg: string;
+            xlg: string;
+            xxlg: string;
+        };
+        inline: {
+            xxxs: string;
+            xxs: string;
+            xs: string;
+            sm: string;
+            md: string;
+            lg: string;
+            xlg: string;
+            xxlg: string;
+        };
+    };
+    size: {
+        default: string;
+        sm: string;
+        lg: string;
+        icon: string;
+    };
+    breakpoints: {
+        mobile: string;
+        tablet: string;
+        desktop: string;
+        largeDesktop: string;
+    };
+};
+export type DarkTheme = typeof darkTheme;

package/dist/lib/constants/themes/dartk.js

@@ -0,0 +1,27 @@
+import breakpoints from "../tokens/breakpoints";
+import { darkColors as colors } from "../tokens/colors";
+import sizeTokens from "../tokens/size";
+import spacingTokens from "../tokens/spacing";
+export const darkTheme = {
+    colors: {
+        "--background": colors.foreground,
+        "--foreground": colors.background,
+        "--card": colors.foreground,
+        "--card-foreground": colors.background,
+        "--popover": colors.foreground,
+        "--popover-foreground": colors.background,
+        "--primary": colors.primaryForeground,
+        "--primary-foreground": colors.primary,
+        "--secondary": colors.secondaryForeground,
+        "--secondary-foreground": colors.secondary,
+        "--muted": colors.mutedForeground,
+        "--muted-foreground": colors.muted,
+        "--accent": colors.accentForeground,
+        "--accent-foreground": colors.accent,
+        "--destructive": colors.destructive,
+        "--destructive-foreground": colors.destructiveForeground,
+    },
+    spacing: spacingTokens,
+    size: sizeTokens,
+    breakpoints,
+};

package/dist/lib/constants/themes/index.d.ts

@@ -0,0 +1,271 @@
+export declare const themes: {
+    dark: {
+        colors: {
+            background: string;
+            foreground: string;
+            card: string;
+            cardForeground: string;
+            popover: string;
+            popoverForeground: string;
+            primary: string;
+            primaryForeground: string;
+            secondary: string;
+            secondaryForeground: string;
+            muted: string;
+            mutedForeground: string;
+            accent: string;
+            accentForeground: string;
+            destructive: string;
+            destructiveForeground: string;
+        };
+        glass: {
+            blur: {
+                sm: string;
+                md: string;
+                lg: string;
+            };
+            saturation: string;
+            opacity: {
+                surface: number;
+                hover: number;
+                pressed: number;
+                dark: number;
+            };
+            surface: {
+                light: string;
+                hover: string;
+                strong: string;
+                dark: string;
+            };
+            border: {
+                light: string;
+                dark: string;
+            };
+            shadow: {
+                light: string;
+                dark: string;
+            };
+            refraction: string;
+            glow: string;
+            press: {
+                duration: string;
+                scale: number;
+                rebound: number;
+            };
+        };
+        spacing: {
+            stack: {
+                xxxs: string;
+                xxs: string;
+                xs: string;
+                sm: string;
+                md: string;
+                lg: string;
+                xlg: string;
+                xxlg: string;
+            };
+            inline: {
+                xxxs: string;
+                xxs: string;
+                xs: string;
+                sm: string;
+                md: string;
+                lg: string;
+                xlg: string;
+                xxlg: string;
+            };
+        };
+        size: {
+            default: string;
+            sm: string;
+            lg: string;
+            icon: string;
+        };
+        breakpoints: {
+            mobile: string;
+            tablet: string;
+            desktop: string;
+            largeDesktop: string;
+        };
+    };
+    light: {
+        colors: {
+            background: string;
+            foreground: string;
+            card: string;
+            cardForeground: string;
+            popover: string;
+            popoverForeground: string;
+            primary: string;
+            primaryForeground: string;
+            secondary: string;
+            secondaryForeground: string;
+            muted: string;
+            mutedForeground: string;
+            accent: string;
+            accentForeground: string;
+            destructive: string;
+            destructiveForeground: string;
+        };
+        glass: {
+            blur: {
+                sm: string;
+                md: string;
+                lg: string;
+            };
+            saturation: string;
+            opacity: {
+                surface: number;
+                hover: number;
+                pressed: number;
+                dark: number;
+            };
+            surface: {
+                light: string;
+                hover: string;
+                strong: string;
+                dark: string;
+            };
+            border: {
+                light: string;
+                dark: string;
+            };
+            shadow: {
+                light: string;
+                dark: string;
+            };
+            refraction: string;
+            glow: string;
+            press: {
+                duration: string;
+                scale: number;
+                rebound: number;
+            };
+        };
+        spacing: {
+            stack: {
+                xxxs: string;
+                xxs: string;
+                xs: string;
+                sm: string;
+                md: string;
+                lg: string;
+                xlg: string;
+                xxlg: string;
+            };
+            inline: {
+                xxxs: string;
+                xxs: string;
+                xs: string;
+                sm: string;
+                md: string;
+                lg: string;
+                xlg: string;
+                xxlg: string;
+            };
+        };
+        size: {
+            default: string;
+            sm: string;
+            lg: string;
+            icon: string;
+        };
+        breakpoints: {
+            mobile: string;
+            tablet: string;
+            desktop: string;
+            largeDesktop: string;
+        };
+    };
+    lemon: {
+        colors: {
+            background: string;
+            foreground: string;
+            card: string;
+            cardForeground: string;
+            popover: string;
+            popoverForeground: string;
+            primary: string;
+            primaryForeground: string;
+            secondary: string;
+            secondaryForeground: string;
+            muted: string;
+            mutedForeground: string;
+            accent: string;
+            accentForeground: string;
+            destructive: string;
+            destructiveForeground: string;
+        };
+        glass: {
+            blur: {
+                sm: string;
+                md: string;
+                lg: string;
+            };
+            saturation: string;
+            opacity: {
+                surface: number;
+                hover: number;
+                pressed: number;
+                dark: number;
+            };
+            surface: {
+                light: string;
+                hover: string;
+                strong: string;
+                dark: string;
+            };
+            border: {
+                light: string;
+                dark: string;
+            };
+            shadow: {
+                light: string;
+                dark: string;
+            };
+            refraction: string;
+            glow: string;
+            press: {
+                duration: string;
+                scale: number;
+                rebound: number;
+            };
+        };
+        spacing: {
+            stack: {
+                xxxs: string;
+                xxs: string;
+                xs: string;
+                sm: string;
+                md: string;
+                lg: string;
+                xlg: string;
+                xxlg: string;
+            };
+            inline: {
+                xxxs: string;
+                xxs: string;
+                xs: string;
+                sm: string;
+                md: string;
+                lg: string;
+                xlg: string;
+                xxlg: string;
+            };
+        };
+        size: {
+            default: string;
+            sm: string;
+            lg: string;
+            icon: string;
+        };
+        breakpoints: {
+            mobile: string;
+            tablet: string;
+            desktop: string;
+            largeDesktop: string;
+        };
+    };
+};
+export default themes;
+export type ThemeTypes = typeof themes;

package/dist/lib/constants/themes/index.js

@@ -0,0 +1,29 @@
+import breakpoints from "../tokens/breakpoints";
+import { darkColors, lightColors, lemonColors } from "../tokens/colors";
+import glassTokens from "../tokens/glass";
+import sizeTokens from "../tokens/size";
+import spacingTokens from "../tokens/spacing";
+export const themes = {
+    dark: {
+        colors: darkColors,
+        glass: glassTokens,
+        spacing: spacingTokens,
+        size: sizeTokens,
+        breakpoints,
+    },
+    light: {
+        colors: lightColors,
+        glass: glassTokens,
+        spacing: spacingTokens,
+        size: sizeTokens,
+        breakpoints,
+    },
+    lemon: {
+        colors: lemonColors,
+        glass: glassTokens,
+        spacing: spacingTokens,
+        size: sizeTokens,
+        breakpoints,
+    },
+};
+export default themes;

package/dist/lib/constants/themes/lemon.d.ts

@@ -0,0 +1,55 @@
+export declare const lemonTheme: {
+    colors: {
+        "--background": string;
+        "--foreground": string;
+        "--card": string;
+        "--card-foreground": string;
+        "--popover": string;
+        "--popover-foreground": string;
+        "--primary": string;
+        "--primary-foreground": string;
+        "--secondary": string;
+        "--secondary-foreground": string;
+        "--muted": string;
+        "--muted-foreground": string;
+        "--accent": string;
+        "--accent-foreground": string;
+        "--destructive": string;
+        "--destructive-foreground": string;
+    };
+    spacing: {
+        stack: {
+            xxxs: string;
+            xxs: string;
+            xs: string;
+            sm: string;
+            md: string;
+            lg: string;
+            xlg: string;
+            xxlg: string;
+        };
+        inline: {
+            xxxs: string;
+            xxs: string;
+            xs: string;
+            sm: string;
+            md: string;
+            lg: string;
+            xlg: string;
+            xxlg: string;
+        };
+    };
+    size: {
+        default: string;
+        sm: string;
+        lg: string;
+        icon: string;
+    };
+    breakpoints: {
+        mobile: string;
+        tablet: string;
+        desktop: string;
+        largeDesktop: string;
+    };
+};
+export type LemonTheme = typeof lemonTheme;

package/dist/lib/constants/themes/lemon.js

@@ -0,0 +1,27 @@
+import breakpoints from "../tokens/breakpoints";
+import { darkColors as colors } from "../tokens/colors";
+import sizeTokens from "../tokens/size";
+import spacingTokens from "../tokens/spacing";
+export const lemonTheme = {
+    colors: {
+        "--background": colors.foreground,
+        "--foreground": colors.background,
+        "--card": colors.foreground,
+        "--card-foreground": colors.background,
+        "--popover": colors.foreground,
+        "--popover-foreground": colors.background,
+        "--primary": colors.primaryForeground,
+        "--primary-foreground": colors.primary,
+        "--secondary": colors.secondaryForeground,
+        "--secondary-foreground": colors.secondary,
+        "--muted": colors.mutedForeground,
+        "--muted-foreground": colors.muted,
+        "--accent": colors.accentForeground,
+        "--accent-foreground": colors.accent,
+        "--destructive": colors.destructive,
+        "--destructive-foreground": colors.destructiveForeground,
+    },
+    spacing: spacingTokens,
+    size: sizeTokens,
+    breakpoints,
+};

package/dist/lib/constants/themes/light.d.ts

@@ -0,0 +1,49 @@
+export declare const lightTheme: {
+    colors: {
+        "--background": string;
+        "--foreground": string;
+        "--card": string;
+        "--card-foreground": string;
+        "--popover": string;
+        "--popover-foreground": string;
+        "--primary": string;
+        "--primary-foreground": string;
+        "--secondary": string;
+        "--secondary-foreground": string;
+        "--muted": string;
+        "--muted-foreground": string;
+        "--accent": string;
+        "--accent-foreground": string;
+        "--destructive": string;
+        "--destructive-foreground": string;
+    };
+    spacing: {
+        stack: {
+            xxxs: string;
+            xxs: string;
+            xs: string;
+            sm: string;
+            md: string;
+            lg: string;
+            xlg: string;
+            xxlg: string;
+        };
+        inline: {
+            xxxs: string;
+            xxs: string;
+            xs: string;
+            sm: string;
+            md: string;
+            lg: string;
+            xlg: string;
+            xxlg: string;
+        };
+    };
+    size: {
+        default: string;
+        sm: string;
+        lg: string;
+        icon: string;
+    };
+};
+export type LightTheme = typeof lightTheme;

package/dist/lib/constants/themes/light.js

@@ -0,0 +1,25 @@
+import { lightColors as colors } from "../tokens/colors";
+import sizeTokens from "../tokens/size";
+import spacingTokens from "../tokens/spacing";
+export const lightTheme = {
+    colors: {
+        "--background": colors.foreground,
+        "--foreground": colors.background,
+        "--card": colors.foreground,
+        "--card-foreground": colors.background,
+        "--popover": colors.foreground,
+        "--popover-foreground": colors.background,
+        "--primary": colors.primaryForeground,
+        "--primary-foreground": colors.primary,
+        "--secondary": colors.secondaryForeground,
+        "--secondary-foreground": colors.secondary,
+        "--muted": colors.mutedForeground,
+        "--muted-foreground": colors.muted,
+        "--accent": colors.accentForeground,
+        "--accent-foreground": colors.accent,
+        "--destructive": colors.destructive,
+        "--destructive-foreground": colors.destructiveForeground,
+    },
+    spacing: spacingTokens,
+    size: sizeTokens,
+};

package/dist/lib/constants/tokens/breakpoints/index.d.ts

@@ -0,0 +1,8 @@
+export declare const breakpoints: {
+    mobile: string;
+    tablet: string;
+    desktop: string;
+    largeDesktop: string;
+};
+export default breakpoints;
+export type Breakpoints = typeof breakpoints;

package/dist/lib/constants/tokens/breakpoints/index.js

@@ -0,0 +1,7 @@
+export const breakpoints = {
+    mobile: "480px",
+    tablet: "768px",
+    desktop: "1024px",
+    largeDesktop: "1200px",
+};
+export default breakpoints;

package/dist/lib/constants/tokens/colors/dark-colors.d.ts

@@ -0,0 +1,19 @@
+export declare const darkColors: {
+    background: string;
+    foreground: string;
+    card: string;
+    cardForeground: string;
+    popover: string;
+    popoverForeground: string;
+    primary: string;
+    primaryForeground: string;
+    secondary: string;
+    secondaryForeground: string;
+    muted: string;
+    mutedForeground: string;
+    accent: string;
+    accentForeground: string;
+    destructive: string;
+    destructiveForeground: string;
+};
+export type DarkColors = typeof darkColors;

package/dist/lib/constants/tokens/colors/dark-colors.js

@@ -0,0 +1,18 @@
+export const darkColors = {
+    background: "0 0% 100%",
+    foreground: "20 14.3% 4.1%",
+    card: "0 0% 100%",
+    cardForeground: "20 14.3% 4.1%",
+    popover: "0 0% 100%",
+    popoverForeground: "20 14.3% 4.1%",
+    primary: "24 9.8% 10%",
+    primaryForeground: "60 9.1% 97.8%",
+    secondary: "60 4.8% 95.9%",
+    secondaryForeground: "24 9.8% 10%",
+    muted: "60 4.8% 95.9%",
+    mutedForeground: "25 5.3% 44.7%",
+    accent: "60 4.8% 95.9%",
+    accentForeground: "24 9.8% 10%",
+    destructive: "0 84.2% 60.2%",
+    destructiveForeground: "60 9.1% 97.8%",
+};

package/dist/lib/constants/tokens/colors/index.d.ts

@@ -0,0 +1,3 @@
+export * from "./dark-colors";
+export * from "./light-colors";
+export * from "./lemon-colors";

package/dist/lib/constants/tokens/colors/index.js

@@ -0,0 +1,3 @@
+export * from "./dark-colors";
+export * from "./light-colors";
+export * from "./lemon-colors";

package/dist/lib/constants/tokens/colors/lemon-colors.d.ts

@@ -0,0 +1,19 @@
+export declare const lemonColors: {
+    background: string;
+    foreground: string;
+    card: string;
+    cardForeground: string;
+    popover: string;
+    popoverForeground: string;
+    primary: string;
+    primaryForeground: string;
+    secondary: string;
+    secondaryForeground: string;
+    muted: string;
+    mutedForeground: string;
+    accent: string;
+    accentForeground: string;
+    destructive: string;
+    destructiveForeground: string;
+};
+export type LemonColors = typeof lemonColors;

package/dist/lib/constants/tokens/colors/lemon-colors.js

@@ -0,0 +1,18 @@
+export const lemonColors = {
+    background: "0 0% 100%",
+    foreground: "20 14.3% 4.1%",
+    card: "0 0% 100%",
+    cardForeground: "20 14.3% 4.1%",
+    popover: "0 0% 100%",
+    popoverForeground: "20 14.3% 4.1%",
+    primary: "24 9.8% 10%",
+    primaryForeground: "60 9.1% 97.8%",
+    secondary: "60 4.8% 95.9%",
+    secondaryForeground: "24 9.8% 10%",
+    muted: "60 4.8% 95.9%",
+    mutedForeground: "25 5.3% 44.7%",
+    accent: "60 4.8% 95.9%",
+    accentForeground: "24 9.8% 10%",
+    destructive: "0 84.2% 60.2%",
+    destructiveForeground: "60 9.1% 97.8%",
+};

package/dist/lib/constants/tokens/colors/light-colors.d.ts

@@ -0,0 +1,19 @@
+export declare const lightColors: {
+    background: string;
+    foreground: string;
+    card: string;
+    cardForeground: string;
+    popover: string;
+    popoverForeground: string;
+    primary: string;
+    primaryForeground: string;
+    secondary: string;
+    secondaryForeground: string;
+    muted: string;
+    mutedForeground: string;
+    accent: string;
+    accentForeground: string;
+    destructive: string;
+    destructiveForeground: string;
+};
+export type LightColors = typeof lightColors;

package/dist/lib/constants/tokens/colors/light-colors.js

@@ -0,0 +1,18 @@
+export const lightColors = {
+    background: "0 0% 100%",
+    foreground: "20 14.3% 4.1%",
+    card: "0 0% 100%",
+    cardForeground: "20 14.3% 4.1%",
+    popover: "0 0% 100%",
+    popoverForeground: "20 14.3% 4.1%",
+    primary: "24 9.8% 10%",
+    primaryForeground: "60 9.1% 97.8%",
+    secondary: "60 4.8% 95.9%",
+    secondaryForeground: "24 9.8% 10%",
+    muted: "60 4.8% 95.9%",
+    mutedForeground: "25 5.3% 44.7%",
+    accent: "60 4.8% 95.9%",
+    accentForeground: "24 9.8% 10%",
+    destructive: "0 84.2% 60.2%",
+    destructiveForeground: "60 9.1% 97.8%",
+};

package/dist/lib/constants/tokens/glass/index.d.ts

@@ -0,0 +1,37 @@
+export declare const glassTokens: {
+    blur: {
+        sm: string;
+        md: string;
+        lg: string;
+    };
+    saturation: string;
+    opacity: {
+        surface: number;
+        hover: number;
+        pressed: number;
+        dark: number;
+    };
+    surface: {
+        light: string;
+        hover: string;
+        strong: string;
+        dark: string;
+    };
+    border: {
+        light: string;
+        dark: string;
+    };
+    shadow: {
+        light: string;
+        dark: string;
+    };
+    refraction: string;
+    glow: string;
+    press: {
+        duration: string;
+        scale: number;
+        rebound: number;
+    };
+};
+export type GlassTokens = typeof glassTokens;
+export default glassTokens;

package/dist/lib/constants/tokens/glass/index.js

@@ -0,0 +1,36 @@
+export const glassTokens = {
+    blur: {
+        sm: "20px",
+        md: "32px",
+        lg: "48px",
+    },
+    saturation: "180%",
+    opacity: {
+        surface: 0.7,
+        hover: 0.82,
+        pressed: 0.6,
+        dark: 0.45,
+    },
+    surface: {
+        light: "rgba(255, 255, 255, 0.7)",
+        hover: "rgba(255, 255, 255, 0.85)",
+        strong: "rgba(255, 255, 255, 0.95)",
+        dark: "rgba(16, 16, 16, 0.6)",
+    },
+    border: {
+        light: "rgba(255, 255, 255, 0.18)",
+        dark: "rgba(255, 255, 255, 0.12)",
+    },
+    shadow: {
+        light: "0 8px 32px rgba(0, 0, 0, 0.12)",
+        dark: "0 20px 50px rgba(0, 0, 0, 0.45)",
+    },
+    refraction: "linear-gradient(135deg, rgba(255, 255, 255, 0.4) 0%, transparent 60%)",
+    glow: "0 0 40px rgba(0, 122, 255, 0.35)",
+    press: {
+        duration: "220ms",
+        scale: 0.97,
+        rebound: 1.02,
+    },
+};
+export default glassTokens;

package/dist/lib/constants/tokens/size/index.d.ts

@@ -0,0 +1,8 @@
+export declare const sizeTokens: {
+    default: string;
+    sm: string;
+    lg: string;
+    icon: string;
+};
+export default sizeTokens;
+export type SizeTokens = typeof sizeTokens;

package/dist/lib/constants/tokens/size/index.js

@@ -0,0 +1,7 @@
+export const sizeTokens = {
+    default: "0 0% 100%",
+    sm: "h-9 rounded-md px-3",
+    lg: "h-11 rounded-md px-8",
+    icon: "h-10 w-10",
+};
+export default sizeTokens;

package/dist/lib/constants/tokens/spacing/index.d.ts

@@ -0,0 +1,24 @@
+export declare const spacingTokens: {
+    stack: {
+        xxxs: string;
+        xxs: string;
+        xs: string;
+        sm: string;
+        md: string;
+        lg: string;
+        xlg: string;
+        xxlg: string;
+    };
+    inline: {
+        xxxs: string;
+        xxs: string;
+        xs: string;
+        sm: string;
+        md: string;
+        lg: string;
+        xlg: string;
+        xxlg: string;
+    };
+};
+export default spacingTokens;
+export type SpacingTokens = typeof spacingTokens;

package/dist/lib/constants/tokens/spacing/index.js

@@ -0,0 +1,23 @@
+export const spacingTokens = {
+    stack: {
+        xxxs: "1rem",
+        xxs: "2rem",
+        xs: "3rem",
+        sm: "4rem",
+        md: "5rem",
+        lg: "6rem",
+        xlg: "7rem",
+        xxlg: "8rem",
+    },
+    inline: {
+        xxxs: "0.5rem",
+        xxs: "1rem",
+        xs: "1.5rem",
+        sm: "2rem",
+        md: "2.5rem",
+        lg: "3rem",
+        xlg: "3.5rem",
+        xxlg: "4rem",
+    },
+};
+export default spacingTokens;

package/dist/lib/interfaces/BaseProps.d.ts

@@ -0,0 +1,27 @@
+import type React from "react";
+export interface BaseProps<TElement = HTMLElement> {
+    className?: string;
+    variant?: "default" | "glass" | "solid" | "destructive" | "outline" | "secondary" | "ghost" | "link";
+    size?: "default" | "sm" | "lg" | "icon";
+    asChild?: boolean;
+    onClick?: React.MouseEventHandler<TElement>;
+    children?: React.ReactNode;
+}
+type VariantClassMap = Record<string, string>;
+interface VariantOverrideOptions {
+    variants?: {
+        variant?: VariantClassMap;
+        size?: VariantClassMap;
+    };
+    defaultVariants?: {
+        variant?: string;
+        size?: string;
+    };
+}
+interface VariantInput {
+    className?: string;
+    variant?: string | null;
+    size?: string | null;
+}
+export declare const BaseVariants: (wrapperName: string, props: VariantInput, overrides?: VariantOverrideOptions) => string;
+export {};

package/dist/lib/interfaces/BaseProps.js

@@ -0,0 +1,36 @@
+import { cva } from "class-variance-authority";
+export const BaseVariants = (wrapperName, props, overrides) => {
+    const variantMap = {
+        default: "variant-default",
+        glass: "variant-glass",
+        solid: "variant-solid",
+        destructive: "variant-destructive",
+        outline: "variant-outline",
+        secondary: "variant-secondary",
+        ghost: "variant-ghost",
+        link: "variant-link",
+        ...(overrides?.variants?.variant || {}),
+    };
+    const sizeMap = {
+        default: "size-default",
+        sm: "size-sm",
+        lg: "size-lg",
+        icon: "size-icon",
+        ...(overrides?.variants?.size || {}),
+    };
+    const builder = cva(wrapperName, {
+        variants: {
+            variant: variantMap,
+            size: sizeMap,
+        },
+        defaultVariants: {
+            variant: overrides?.defaultVariants?.variant || "default",
+            size: overrides?.defaultVariants?.size || "default",
+        },
+    });
+    return builder({
+        variant: props.variant || undefined,
+        size: props.size || undefined,
+        className: props.className,
+    });
+};

package/dist/lib/utils.d.ts

@@ -0,0 +1,2 @@
+import { type ClassValue } from "clsx";
+export declare function cn(...inputs: ClassValue[]): string;

package/dist/lib/utils.js

@@ -0,0 +1,5 @@
+import { clsx } from "clsx";
+import { twMerge } from "tailwind-merge";
+export function cn(...inputs) {
+    return twMerge(clsx(inputs));
+}

package/package.json

@@ -0,0 +1,31 @@
+{
+  "name": "@react-cupertino-ui/shared",
+  "version": "0.0.0",
+  "description": "Shared utilities and tokens for React Cupertino UI",
+  "type": "module",
+  "main": "./dist/index.js",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "files": [
+    "dist"
+  ],
+  "sideEffects": false,
+  "scripts": {
+    "build": "tsc -p tsconfig.build.json"
+  },
+  "peerDependencies": {
+    "react": "^18.3.1"
+  },
+  "dependencies": {
+    "class-variance-authority": "^0.7.0",
+    "clsx": "^2.1.1",
+    "tailwind-merge": "^2.4.0"
+  },
+  "devDependencies": {
+    "typescript": "^5.2.2"
+  },
+  "gitHead": "a6b07a7a8a0ab6f4c80884b6fb9d5eb16ee6da1d",
+  "publishConfig": {
+    "access": "public"
+  }
+}