@damarkuncoro/ui-library 0.0.1

package/lib/esm/theme/design-tokens.d.ts

@@ -0,0 +1,200 @@
+export declare const palette: {
+    readonly blue: {
+        readonly 400: "#60A5FA";
+        readonly 500: "#3B82F6";
+        readonly 600: "#2563EB";
+        readonly 700: "#1D4ED8";
+        readonly 800: "#1E40AF";
+    };
+    readonly gray: {
+        readonly 50: "#F9FAFB";
+        readonly 100: "#F3F4F6";
+        readonly 200: "#E5E7EB";
+        readonly 300: "#D1D5DB";
+        readonly 400: "#9CA3AF";
+        readonly 500: "#6B7280";
+        readonly 600: "#4B5563";
+        readonly 700: "#374151";
+        readonly 800: "#1F2937";
+        readonly 900: "#111827";
+    };
+    readonly red: {
+        readonly 400: "#F87171";
+        readonly 500: "#EF4444";
+        readonly 600: "#DC2626";
+        readonly 700: "#B91C1C";
+        readonly 900: "#7F1D1D";
+    };
+    readonly white: "#FFFFFF";
+    readonly black: "#000000";
+    readonly transparent: "transparent";
+};
+export declare const cssVars: {
+    readonly colors: {
+        readonly primary: {
+            readonly main: "var(--color-primary-main)";
+            readonly hover: "var(--color-primary-hover)";
+            readonly focus: "var(--color-primary-focus)";
+            readonly contrastText: "var(--color-primary-contrast)";
+        };
+        readonly secondary: {
+            readonly main: "var(--color-secondary-main)";
+            readonly hover: "var(--color-secondary-hover)";
+            readonly focus: "var(--color-secondary-focus)";
+            readonly contrastText: "var(--color-secondary-contrast)";
+        };
+        readonly danger: {
+            readonly main: "var(--color-danger-main)";
+            readonly hover: "var(--color-danger-hover)";
+            readonly focus: "var(--color-danger-focus)";
+            readonly contrastText: "var(--color-danger-contrast)";
+        };
+        readonly neutral: {
+            readonly border: "var(--color-neutral-border)";
+            readonly text: "var(--color-neutral-text)";
+            readonly textSecondary: "var(--color-neutral-text-secondary)";
+            readonly bg: "var(--color-neutral-bg)";
+            readonly bgSurface: "var(--color-neutral-bg-surface)";
+        };
+    };
+    readonly shadows: {
+        readonly focusRing: "var(--shadow-focus-ring)";
+    };
+};
+export declare const themes: {
+    light: {
+        '--color-primary-main': "#2563EB";
+        '--color-primary-hover': "#1D4ED8";
+        '--color-primary-focus': "#3B82F6";
+        '--color-primary-contrast': "#FFFFFF";
+        '--color-secondary-main': "#F3F4F6";
+        '--color-secondary-hover': "#E5E7EB";
+        '--color-secondary-focus': "#6B7280";
+        '--color-secondary-contrast': "#111827";
+        '--color-danger-main': "#DC2626";
+        '--color-danger-hover': "#B91C1C";
+        '--color-danger-focus': "#EF4444";
+        '--color-danger-contrast': "#FFFFFF";
+        '--color-neutral-border': "#D1D5DB";
+        '--color-neutral-text': "#374151";
+        '--color-neutral-text-secondary': "#6B7280";
+        '--color-neutral-bg': "#F9FAFB";
+        '--color-neutral-bg-surface': "#FFFFFF";
+        '--shadow-focus-ring': string;
+    };
+    dark: {
+        '--color-primary-main': "#3B82F6";
+        '--color-primary-hover': "#60A5FA";
+        '--color-primary-focus': "#2563EB";
+        '--color-primary-contrast': "#FFFFFF";
+        '--color-secondary-main': "#1F2937";
+        '--color-secondary-hover': "#374151";
+        '--color-secondary-focus': "#4B5563";
+        '--color-secondary-contrast': "#F3F4F6";
+        '--color-danger-main': "#EF4444";
+        '--color-danger-hover': "#F87171";
+        '--color-danger-focus': "#DC2626";
+        '--color-danger-contrast': "#FFFFFF";
+        '--color-neutral-border': "#4B5563";
+        '--color-neutral-text': "#F3F4F6";
+        '--color-neutral-text-secondary': "#9CA3AF";
+        '--color-neutral-bg': "#111827";
+        '--color-neutral-bg-surface': "#1F2937";
+        '--shadow-focus-ring': string;
+    };
+};
+export declare const tokens: {
+    readonly colors: {
+        readonly transparent: "transparent";
+        readonly white: "#FFFFFF";
+        readonly black: "#000000";
+        readonly primary: {
+            readonly main: "var(--color-primary-main)";
+            readonly hover: "var(--color-primary-hover)";
+            readonly focus: "var(--color-primary-focus)";
+            readonly contrastText: "var(--color-primary-contrast)";
+        };
+        readonly secondary: {
+            readonly main: "var(--color-secondary-main)";
+            readonly hover: "var(--color-secondary-hover)";
+            readonly focus: "var(--color-secondary-focus)";
+            readonly contrastText: "var(--color-secondary-contrast)";
+        };
+        readonly danger: {
+            readonly main: "var(--color-danger-main)";
+            readonly hover: "var(--color-danger-hover)";
+            readonly focus: "var(--color-danger-focus)";
+            readonly contrastText: "var(--color-danger-contrast)";
+        };
+        readonly neutral: {
+            readonly border: "var(--color-neutral-border)";
+            readonly text: "var(--color-neutral-text)";
+            readonly textSecondary: "var(--color-neutral-text-secondary)";
+            readonly bg: "var(--color-neutral-bg)";
+            readonly bgSurface: "var(--color-neutral-bg-surface)";
+        };
+    };
+    readonly shadows: {
+        readonly focusRing: "var(--shadow-focus-ring)";
+    };
+    readonly ui: {
+        readonly outlineOffset: "2px";
+        readonly outlineWidth: "2px";
+    };
+    readonly borderRadius: {
+        readonly sm: "4px";
+        readonly md: "6px";
+        readonly lg: "8px";
+        readonly full: "9999px";
+    };
+    readonly spacing: {
+        readonly 2: "8px";
+        readonly 3: "12px";
+        readonly 4: "16px";
+        readonly 6: "24px";
+    };
+    readonly sizing: {
+        readonly 8: "32px";
+        readonly 10: "40px";
+        readonly 12: "48px";
+        readonly icon: {
+            readonly sm: "14px";
+            readonly md: "16px";
+            readonly lg: "20px";
+        };
+    };
+    readonly typography: {
+        readonly fontFamily: {
+            readonly sans: "ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif";
+            readonly mono: "ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace";
+        };
+        readonly fontSize: {
+            readonly xs: "0.75rem";
+            readonly sm: "0.875rem";
+            readonly base: "1rem";
+            readonly lg: "1.125rem";
+            readonly xl: "1.25rem";
+        };
+        readonly fontWeight: {
+            readonly normal: "400";
+            readonly medium: "500";
+            readonly semibold: "600";
+            readonly bold: "700";
+        };
+        readonly lineHeight: {
+            readonly none: "1";
+            readonly tight: "1.25";
+            readonly snug: "1.375";
+            readonly normal: "1.5";
+            readonly relaxed: "1.625";
+            readonly loose: "2";
+        };
+    };
+    readonly opacity: {
+        readonly disabled: "0.5";
+    };
+    readonly transition: {
+        readonly base: "all 0.2s ease";
+    };
+};
+//# sourceMappingURL=design-tokens.d.ts.map

package/lib/esm/theme/design-tokens.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"design-tokens.d.ts","sourceRoot":"","sources":["../../../src/theme/design-tokens.ts"],"names":[],"mappings":"AAIA,eAAO,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA8BV,CAAC;AAGX,eAAO,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA+BV,CAAC;AAGX,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2DlB,CAAC;AAIF,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAuET,CAAC"}

package/lib/esm/theme/design-tokens.js

@@ -0,0 +1,174 @@
+export const palette = {
+    blue: {
+        400: '#60A5FA',
+        500: '#3B82F6',
+        600: '#2563EB',
+        700: '#1D4ED8',
+        800: '#1E40AF',
+    },
+    gray: {
+        50: '#F9FAFB',
+        100: '#F3F4F6',
+        200: '#E5E7EB',
+        300: '#D1D5DB',
+        400: '#9CA3AF',
+        500: '#6B7280',
+        600: '#4B5563',
+        700: '#374151',
+        800: '#1F2937',
+        900: '#111827',
+    },
+    red: {
+        400: '#F87171',
+        500: '#EF4444',
+        600: '#DC2626',
+        700: '#B91C1C',
+        900: '#7F1D1D',
+    },
+    white: '#FFFFFF',
+    black: '#000000',
+    transparent: 'transparent',
+};
+export const cssVars = {
+    colors: {
+        primary: {
+            main: 'var(--color-primary-main)',
+            hover: 'var(--color-primary-hover)',
+            focus: 'var(--color-primary-focus)',
+            contrastText: 'var(--color-primary-contrast)',
+        },
+        secondary: {
+            main: 'var(--color-secondary-main)',
+            hover: 'var(--color-secondary-hover)',
+            focus: 'var(--color-secondary-focus)',
+            contrastText: 'var(--color-secondary-contrast)',
+        },
+        danger: {
+            main: 'var(--color-danger-main)',
+            hover: 'var(--color-danger-hover)',
+            focus: 'var(--color-danger-focus)',
+            contrastText: 'var(--color-danger-contrast)',
+        },
+        neutral: {
+            border: 'var(--color-neutral-border)',
+            text: 'var(--color-neutral-text)',
+            textSecondary: 'var(--color-neutral-text-secondary)',
+            bg: 'var(--color-neutral-bg)',
+            bgSurface: 'var(--color-neutral-bg-surface)',
+        }
+    },
+    shadows: {
+        focusRing: 'var(--shadow-focus-ring)',
+    }
+};
+export const themes = {
+    light: {
+        '--color-primary-main': palette.blue[600],
+        '--color-primary-hover': palette.blue[700],
+        '--color-primary-focus': palette.blue[500],
+        '--color-primary-contrast': palette.white,
+        '--color-secondary-main': palette.gray[100],
+        '--color-secondary-hover': palette.gray[200],
+        '--color-secondary-focus': palette.gray[500],
+        '--color-secondary-contrast': palette.gray[900],
+        '--color-danger-main': palette.red[600],
+        '--color-danger-hover': palette.red[700],
+        '--color-danger-focus': palette.red[500],
+        '--color-danger-contrast': palette.white,
+        '--color-neutral-border': palette.gray[300],
+        '--color-neutral-text': palette.gray[700],
+        '--color-neutral-text-secondary': palette.gray[500],
+        '--color-neutral-bg': palette.gray[50],
+        '--color-neutral-bg-surface': palette.white,
+        '--shadow-focus-ring': '0 0 0 2px',
+    },
+    dark: {
+        '--color-primary-main': palette.blue[500],
+        '--color-primary-hover': palette.blue[400],
+        '--color-primary-focus': palette.blue[600],
+        '--color-primary-contrast': palette.white,
+        '--color-secondary-main': palette.gray[800],
+        '--color-secondary-hover': palette.gray[700],
+        '--color-secondary-focus': palette.gray[600],
+        '--color-secondary-contrast': palette.gray[100],
+        '--color-danger-main': palette.red[500],
+        '--color-danger-hover': palette.red[400],
+        '--color-danger-focus': palette.red[600],
+        '--color-danger-contrast': palette.white,
+        '--color-neutral-border': palette.gray[600],
+        '--color-neutral-text': palette.gray[100],
+        '--color-neutral-text-secondary': palette.gray[400],
+        '--color-neutral-bg': palette.gray[900],
+        '--color-neutral-bg-surface': palette.gray[800],
+        '--shadow-focus-ring': '0 0 0 2px',
+    }
+};
+export const tokens = {
+    colors: {
+        ...cssVars.colors,
+        transparent: 'transparent',
+        white: '#FFFFFF',
+        black: '#000000',
+    },
+    shadows: cssVars.shadows,
+    ui: {
+        outlineOffset: '2px',
+        outlineWidth: '2px',
+    },
+    borderRadius: {
+        sm: '4px',
+        md: '6px',
+        lg: '8px',
+        full: '9999px',
+    },
+    spacing: {
+        2: '8px',
+        3: '12px',
+        4: '16px',
+        6: '24px',
+    },
+    sizing: {
+        8: '32px',
+        10: '40px',
+        12: '48px',
+        icon: {
+            sm: '14px',
+            md: '16px',
+            lg: '20px',
+        },
+    },
+    typography: {
+        fontFamily: {
+            sans: 'ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif',
+            mono: 'ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace',
+        },
+        fontSize: {
+            xs: '0.75rem',
+            sm: '0.875rem',
+            base: '1rem',
+            lg: '1.125rem',
+            xl: '1.25rem',
+        },
+        fontWeight: {
+            normal: '400',
+            medium: '500',
+            semibold: '600',
+            bold: '700',
+        },
+        lineHeight: {
+            none: '1',
+            tight: '1.25',
+            snug: '1.375',
+            normal: '1.5',
+            relaxed: '1.625',
+            loose: '2',
+        }
+    },
+    opacity: {
+        disabled: '0.5',
+    },
+    transition: {
+        base: 'all 0.2s ease',
+    }
+};
+//# sourceMappingURL=design-tokens.js.map

package/lib/esm/theme/design-tokens.js.map

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

package/lib/esm/theme/index.d.ts

@@ -0,0 +1,3 @@
+export * from './design-tokens';
+export * from './theme-provider';
+//# sourceMappingURL=index.d.ts.map

package/lib/esm/theme/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/theme/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAC;AAChC,cAAc,kBAAkB,CAAC"}

package/lib/esm/theme/index.js

@@ -0,0 +1,3 @@
+export * from './design-tokens';
+export * from './theme-provider';
+//# sourceMappingURL=index.js.map

package/lib/esm/theme/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/theme/index.ts"],"names":[],"mappings":"AAAA,cAAc,iBAAiB,CAAC;AAChC,cAAc,kBAAkB,CAAC"}

package/lib/esm/theme/theme-provider.d.ts

@@ -0,0 +1,16 @@
+import React, { ReactNode } from 'react';
+type ThemeMode = 'light' | 'dark';
+interface ThemeContextType {
+    mode: ThemeMode;
+    setMode: (mode: ThemeMode) => void;
+    toggleMode: () => void;
+}
+interface ThemeProviderProps {
+    children: ReactNode;
+    defaultMode?: ThemeMode;
+    themeOverrides?: Partial<Record<ThemeMode, Record<string, string>>>;
+}
+export declare const ThemeProvider: React.FC<ThemeProviderProps>;
+export declare const useTheme: () => ThemeContextType;
+export {};
+//# sourceMappingURL=theme-provider.d.ts.map

package/lib/esm/theme/theme-provider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme-provider.d.ts","sourceRoot":"","sources":["../../../src/theme/theme-provider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAkD,SAAS,EAAE,MAAM,OAAO,CAAC;AAGzF,KAAK,SAAS,GAAG,OAAO,GAAG,MAAM,CAAC;AAElC,UAAU,gBAAgB;IACxB,IAAI,EAAE,SAAS,CAAC;IAChB,OAAO,EAAE,CAAC,IAAI,EAAE,SAAS,KAAK,IAAI,CAAC;IACnC,UAAU,EAAE,MAAM,IAAI,CAAC;CACxB;AAID,UAAU,kBAAkB;IAC1B,QAAQ,EAAE,SAAS,CAAC;IACpB,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,cAAc,CAAC,EAAE,OAAO,CAAC,MAAM,CAAC,SAAS,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC,CAAC,CAAC;CACrE;AAED,eAAO,MAAM,aAAa,EAAE,KAAK,CAAC,EAAE,CAAC,kBAAkB,CAsCtD,CAAC;AAEF,eAAO,MAAM,QAAQ,QAAO,gBAM3B,CAAC"}

package/lib/esm/theme/theme-provider.js

@@ -0,0 +1,34 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { createContext, useContext, useEffect, useState } from 'react';
+import { themes } from './design-tokens';
+const ThemeContext = createContext(undefined);
+export const ThemeProvider = ({ children, defaultMode = 'light', themeOverrides = {} }) => {
+    const [mode, setMode] = useState(defaultMode);
+    useEffect(() => {
+        const root = document.documentElement;
+        const defaultThemeValues = themes[mode];
+        const overrideValues = themeOverrides[mode] || {};
+        const finalThemeValues = { ...defaultThemeValues, ...overrideValues };
+        Object.entries(finalThemeValues).forEach(([key, value]) => {
+            root.style.setProperty(key, value);
+        });
+        if (mode === 'dark') {
+            root.classList.add('dark');
+        }
+        else {
+            root.classList.remove('dark');
+        }
+    }, [mode]);
+    const toggleMode = () => {
+        setMode((prev) => (prev === 'light' ? 'dark' : 'light'));
+    };
+    return (_jsx(ThemeContext.Provider, { value: { mode, setMode, toggleMode }, children: children }));
+};
+export const useTheme = () => {
+    const context = useContext(ThemeContext);
+    if (!context) {
+        throw new Error('useTheme must be used within a ThemeProvider');
+    }
+    return context;
+};
+//# sourceMappingURL=theme-provider.js.map

package/lib/esm/theme/theme-provider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"theme-provider.js","sourceRoot":"","sources":["../../../src/theme/theme-provider.tsx"],"names":[],"mappings":";AAAA,OAAc,EAAE,aAAa,EAAE,UAAU,EAAE,SAAS,EAAE,QAAQ,EAAa,MAAM,OAAO,CAAC;AACzF,OAAO,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AAUzC,MAAM,YAAY,GAAG,aAAa,CAA+B,SAAS,CAAC,CAAC;AAQ5E,MAAM,CAAC,MAAM,aAAa,GAAiC,CAAC,EAC1D,QAAQ,EACR,WAAW,GAAG,OAAO,EACrB,cAAc,GAAG,EAAE,EACpB,EAAE,EAAE;IACH,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAY,WAAW,CAAC,CAAC;IAGzD,SAAS,CAAC,GAAG,EAAE;QACb,MAAM,IAAI,GAAG,QAAQ,CAAC,eAAe,CAAC;QACtC,MAAM,kBAAkB,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC;QACxC,MAAM,cAAc,GAAG,cAAc,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC;QAElD,MAAM,gBAAgB,GAAG,EAAE,GAAG,kBAAkB,EAAE,GAAG,cAAc,EAAE,CAAC;QAEtE,MAAM,CAAC,OAAO,CAAC,gBAAgB,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,EAAE,KAAK,CAAC,EAAE,EAAE;YACxD,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,GAAG,EAAE,KAAK,CAAC,CAAC;QACrC,CAAC,CAAC,CAAC;QAIH,IAAI,IAAI,KAAK,MAAM,EAAE,CAAC;YACpB,IAAI,CAAC,SAAS,CAAC,GAAG,CAAC,MAAM,CAAC,CAAC;QAC7B,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;QAChC,CAAC;IAEH,CAAC,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC;IAEX,MAAM,UAAU,GAAG,GAAG,EAAE;QACtB,OAAO,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC,IAAI,KAAK,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC;IAC3D,CAAC,CAAC;IAEF,OAAO,CACL,KAAC,YAAY,CAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,UAAU,EAAE,YACxD,QAAQ,GACa,CACzB,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,QAAQ,GAAG,GAAqB,EAAE;IAC7C,MAAM,OAAO,GAAG,UAAU,CAAC,YAAY,CAAC,CAAC;IACzC,IAAI,CAAC,OAAO,EAAE,CAAC;QACb,MAAM,IAAI,KAAK,CAAC,8CAA8C,CAAC,CAAC;IAClE,CAAC;IACD,OAAO,OAAO,CAAC;AACjB,CAAC,CAAC"}

package/lib/esm/usage-example.d.ts

@@ -0,0 +1,2 @@
+export declare function App(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=usage-example.d.ts.map

package/lib/esm/usage-example.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"usage-example.d.ts","sourceRoot":"","sources":["../../src/usage-example.tsx"],"names":[],"mappings":"AAwFA,wBAAgB,GAAG,4CAMlB"}

package/lib/esm/usage-example.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Button, ButtonNative, Input, ThemeProvider, useTheme } from './index';
+const DemoContent = () => {
+    const { mode, toggleMode } = useTheme();
+    return (_jsx("div", { className: `min-h-screen p-8 transition-colors duration-300 ${mode === 'dark' ? 'bg-gray-900 text-white' : 'bg-gray-50 text-gray-900'}`, children: _jsxs("div", { className: "max-w-3xl mx-auto space-y-12", children: [_jsxs("header", { className: "flex items-center justify-between border-b border-gray-200 pb-6 dark:border-gray-700", children: [_jsxs("div", { children: [_jsx("h1", { className: "text-3xl font-bold", children: "UI Library Demo" }), _jsxs("p", { className: "mt-2 text-gray-500 dark:text-gray-400", children: ["Powered by ", _jsx("span", { className: "font-semibold text-primary-main", children: "Global Design Tokens" }), " \u2022 Current Theme: ", _jsx("span", { className: "font-mono font-bold uppercase", children: mode })] })] }), _jsx(Button, { onClick: toggleMode, variant: "outline", children: mode === 'light' ? '🌙 Switch to Dark' : '☀️ Switch to Light' })] }), _jsxs("section", { className: "space-y-4", children: [_jsx("h2", { className: "text-xl font-semibold", children: "1. Buttons (Themed)" }), _jsx("p", { className: "text-gray-600 dark:text-gray-400", children: "These buttons automatically adapt to the current theme colors." }), _jsxs("div", { className: "space-y-4 p-6 bg-white rounded-lg shadow-sm border border-gray-100 dark:bg-gray-800 dark:border-gray-700", children: [_jsxs("div", { className: "flex flex-wrap gap-4 items-center", children: [_jsx(Button, { variant: "primary", children: "Primary" }), _jsx(Button, { variant: "secondary", children: "Secondary" }), _jsx(Button, { variant: "outline", children: "Outline" }), _jsx(Button, { variant: "ghost", children: "Ghost" }), _jsx(Button, { variant: "danger", children: "Danger" }), _jsx(Button, { variant: "primary", disabled: true, children: "Disabled" }), _jsx(Button, { variant: "primary", isLoading: true, children: "Loading" })] }), _jsxs("div", { className: "flex flex-wrap gap-4 items-center border-t border-gray-100 dark:border-gray-700 pt-4", children: [_jsx("span", { className: "text-sm text-gray-500 w-full sm:w-auto", children: "Sizes:" }), _jsx(Button, { variant: "primary", size: "sm", children: "Small" }), _jsx(Button, { variant: "primary", size: "md", children: "Medium" }), _jsx(Button, { variant: "primary", size: "lg", children: "Large" })] })] })] }), _jsxs("section", { className: "space-y-4", children: [_jsx("h2", { className: "text-xl font-semibold", children: "2. Inputs (Themed)" }), _jsx("p", { className: "text-gray-600 dark:text-gray-400", children: "Inputs with support for icons and validation states." }), _jsxs("div", { className: "space-y-6 p-6 bg-white rounded-lg shadow-sm border border-gray-100 dark:bg-gray-800 dark:border-gray-700", children: [_jsxs("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-6", children: [_jsx(Input, { placeholder: "Default Input" }), _jsx(Input, { placeholder: "Filled Input", variant: "filled" }), _jsx(Input, { placeholder: "Flushed Input", variant: "flushed" }), _jsx(Input, { placeholder: "Invalid Input", isInvalid: true }), _jsx(Input, { placeholder: "With Left Icon", leftIcon: _jsx("span", { children: "\uD83D\uDD0D" }) }), _jsx(Input, { placeholder: "With Right Icon", rightIcon: _jsx("span", { children: "\uD83D\uDC41\uFE0F" }) }), _jsx(Input, { placeholder: "Disabled Input", disabled: true })] }), _jsxs("div", { className: "border-t border-gray-100 dark:border-gray-700 pt-4", children: [_jsx("span", { className: "block mb-4 text-sm text-gray-500", children: "Sizes:" }), _jsxs("div", { className: "grid grid-cols-1 md:grid-cols-3 gap-6", children: [_jsx(Input, { placeholder: "Small Input", size: "sm" }), _jsx(Input, { placeholder: "Medium Input", size: "md" }), _jsx(Input, { placeholder: "Large Input", size: "lg" })] })] })] })] }), _jsxs("section", { className: "space-y-4", children: [_jsx("h2", { className: "text-xl font-semibold", children: "3. Native Components" }), _jsx("p", { className: "text-gray-600 dark:text-gray-400", children: "Framework-agnostic components using inline styles." }), _jsxs("div", { className: "flex flex-wrap gap-4 items-center p-6 bg-white rounded-lg shadow-sm border border-gray-100 dark:bg-gray-800 dark:border-gray-700", children: [_jsx(ButtonNative, { variant: "primary", children: "Native Primary" }), _jsx(ButtonNative, { variant: "outline", children: "Native Outline" })] })] })] }) }));
+};
+export function App() {
+    return (_jsx(ThemeProvider, { defaultMode: "light", children: _jsx(DemoContent, {}) }));
+}
+//# sourceMappingURL=usage-example.js.map

package/lib/esm/usage-example.js.map

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

package/package.json

@@ -0,0 +1,48 @@
+{
+  "name": "@damarkuncoro/ui-library",
+  "version": "0.0.1",
+  "main": "lib/cjs/index.js",
+  "module": "lib/esm/index.js",
+  "types": "lib/esm/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./lib/esm/index.d.ts",
+      "import": "./lib/esm/index.js",
+      "require": "./lib/cjs/index.js"
+    },
+    "./package.json": "./package.json"
+  },
+  "files": [
+    "lib"
+  ],
+  "publishConfig": {
+    "access": "public"
+  },
+  "dependencies": {
+    "@damarkuncoro/meta-architecture": "latest"
+  },
+  "peerDependencies": {
+    "react": ">=18",
+    "react-dom": ">=18"
+  },
+  "devDependencies": {
+    "@testing-library/jest-dom": "^6.6.3",
+    "@testing-library/react": "^16.2.0",
+    "@types/node": "^25.2.0",
+    "@types/react": "^19.2.10",
+    "@types/react-dom": "^19.2.3",
+    "@vitejs/plugin-react": "^4.3.4",
+    "jsdom": "^26.0.0",
+    "react": "^19.2.4",
+    "react-dom": "^19.2.4",
+    "typescript": "^5.9.3",
+    "vite": "^6.0.11",
+    "vitest": "^4.0.18"
+  },
+  "author": "Damar Kuncoro",
+  "scripts": {
+    "build": "rm -rf lib && tsc -p tsconfig.build.esm.json && tsc -p tsconfig.build.cjs.json && echo '{\"type\": \"module\"}' > lib/esm/package.json && echo '{\"type\": \"commonjs\"}' > lib/cjs/package.json",
+    "test": "vitest",
+    "meta-architecture": "meta-architecture"
+  }
+}