@korioinc/next-core 2.0.3 → 2.0.6

package/dist/api-client/index.d.ts

@@ -1,32 +1,3 @@
-type RequestMethod = 'GET' | 'POST' | 'PUT' | 'DELETE' | 'PATCH';
-type NextFetchOptions = {
-    revalidate?: number | false;
-    tags?: string[];
-};
-interface RequestOptions extends Omit<RequestInit, 'method' | 'headers' | 'body' | 'cache' | 'credentials'> {
-    method?: RequestMethod;
-    headers?: Record<string, string>;
-    body?: unknown;
-    params?: Record<string, string>;
-    cache?: RequestCache;
-    credentials?: RequestCredentials;
-    next?: NextFetchOptions;
-}
-/**
- * Generic API response type
- */
-export interface ApiResponse<T> {
-    data: T;
-    success: boolean;
-    message?: string;
-    error?: unknown;
-}
-/**
- * Reusable API request function
- * @param endpoint - API endpoint path (without base URL)
- * @param options - Request options
- * @returns Promise with the response data
- */
-export declare function requestApi<T = unknown>(endpoint: string, options?: RequestOptions): Promise<T>;
-export {};
+export { requestApi } from './server';
+export type { ApiResponse } from './server';
 //# sourceMappingURL=index.d.ts.map

package/dist/api-client/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/api-client/index.ts"],"names":[],"mappings":"AAMA,KAAK,aAAa,GAAG,KAAK,GAAG,MAAM,GAAG,KAAK,GAAG,QAAQ,GAAG,OAAO,CAAC;AAEjE,KAAK,gBAAgB,GAAG;IAAE,UAAU,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC;IAAC,IAAI,CAAC,EAAE,MAAM,EAAE,CAAA;CAAE,CAAC;AAEzE,UAAU,cAAe,SAAQ,IAAI,CAAC,WAAW,EAAE,QAAQ,GAAG,SAAS,GAAG,MAAM,GAAG,OAAO,GAAG,aAAa,CAAC;IACzG,MAAM,CAAC,EAAE,aAAa,CAAC;IACvB,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACjC,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAChC,KAAK,CAAC,EAAE,YAAY,CAAC;IACrB,WAAW,CAAC,EAAE,kBAAkB,CAAC;IACjC,IAAI,CAAC,EAAE,gBAAgB,CAAC;CACzB;AAED;;GAEG;AACH,MAAM,WAAW,WAAW,CAAC,CAAC;IAC5B,IAAI,EAAE,CAAC,CAAC;IACR,OAAO,EAAE,OAAO,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB;AAED;;;;;GAKG;AACH,wBAAsB,UAAU,CAAC,CAAC,GAAG,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,OAAO,GAAE,cAAmB,GAAG,OAAO,CAAC,CAAC,CAAC,CAsGxG"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/api-client/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,UAAU,CAAC;AACtC,YAAY,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC"}

package/dist/api-client/index.js

@@ -1,95 +1 @@
-import { cookies } from 'next/headers';
-import { getConfig } from '@korioinc/next-conf';
-import { deleteCookie, getCookie, setCookie } from 'cookies-next/server';
-/**
- * Reusable API request function
- * @param endpoint - API endpoint path (without base URL)
- * @param options - Request options
- * @returns Promise with the response data
- */
-export async function requestApi(endpoint, options = {}) {
-    const { method = 'GET', headers = {}, body, params, cache, credentials, next } = options;
-    // Get configuration
-    const cfg = getConfig();
-    const apiConfig = cfg.api;
-    // Prepare URL
-    const url = new URL(`${apiConfig.baseUrl}${endpoint.startsWith('/') ? endpoint : `/${endpoint}`}`);
-    if (params) {
-        Object.entries(params).forEach(([key, value]) => {
-            url.searchParams.append(key, value.toString());
-        });
-    }
-    // Get access token from cookie
-    const cookieCfg = cfg.cookie;
-    const accessTokenName = cookieCfg.accessTokenName;
-    const accessToken = await getCookie(accessTokenName, { cookies });
-    // Prepare headers with defaults
-    const requestHeaders = {
-        Accept: 'application/json',
-        ...headers,
-    };
-    // Add Authorization header if token exists
-    if (accessToken) {
-        requestHeaders['Authorization'] = `Bearer ${accessToken}`;
-    }
-    // Add Content-Type for requests with body
-    if (body && !requestHeaders['Content-Type'] && !(body instanceof FormData)) {
-        requestHeaders['Content-Type'] = 'application/json';
-    }
-    // Prepare request options
-    const requestOptions = {
-        method,
-        headers: requestHeaders,
-        credentials: credentials || 'same-origin',
-    };
-    // Add cache and revalidation options
-    if (cache) {
-        requestOptions.cache = cache;
-    }
-    if (next) {
-        requestOptions.next = next;
-    }
-    // Add body for non-GET requests if provided
-    if (method !== 'GET' && body) {
-        requestOptions.body = body instanceof FormData ? body : JSON.stringify(body);
-    }
-    try {
-        const response = await fetch(url.toString(), requestOptions);
-        const refreshedToken = response.headers.get('x-refreshed-token');
-        if (refreshedToken) {
-            // Update the access token cookie
-            await setCookie(accessTokenName, refreshedToken, {
-                cookies,
-                path: '/',
-                domain: cookieCfg.domain,
-                maxAge: cookieCfg.maxAge,
-                sameSite: 'lax',
-            });
-        }
-        // Handle non-OK responses
-        if (!response.ok) {
-            const errorData = await response.json().catch(() => ({
-                message: `API error: ${response.status} ${response.statusText}`,
-            }));
-            // Delete cookie on 401 Unauthorized
-            if (response.status === 401) {
-                deleteCookie(accessTokenName, {
-                    cookies,
-                    path: '/',
-                    domain: cookieCfg.domain,
-                });
-            }
-            throw new Error(errorData.message || `API error: ${response.status}`);
-        }
-        if (response.status === 204) {
-            return undefined;
-        }
-        // Parse JSON response
-        const jsonResponse = await response.json();
-        return jsonResponse;
-    }
-    catch (error) {
-        console.error(`Failed API request to ${endpoint}:`, error);
-        throw error;
-    }
-}
+export { requestApi } from './server';

package/dist/api-client/server.d.ts

@@ -0,0 +1,32 @@
+type RequestMethod = 'GET' | 'POST' | 'PUT' | 'DELETE' | 'PATCH';
+type NextFetchOptions = {
+    revalidate?: number | false;
+    tags?: string[];
+};
+interface RequestOptions extends Omit<RequestInit, 'method' | 'headers' | 'body' | 'cache' | 'credentials'> {
+    method?: RequestMethod;
+    headers?: Record<string, string>;
+    body?: unknown;
+    params?: Record<string, string>;
+    cache?: RequestCache;
+    credentials?: RequestCredentials;
+    next?: NextFetchOptions;
+}
+/**
+ * Generic API response type
+ */
+export interface ApiResponse<T> {
+    data: T;
+    success: boolean;
+    message?: string;
+    error?: unknown;
+}
+/**
+ * Reusable API request function (server-only)
+ * @param endpoint - API endpoint path (without base URL)
+ * @param options - Request options
+ * @returns Promise with the response data
+ */
+export declare function requestApi<T = unknown>(endpoint: string, options?: RequestOptions): Promise<T>;
+export {};
+//# sourceMappingURL=server.d.ts.map

package/dist/api-client/server.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"server.d.ts","sourceRoot":"","sources":["../../src/api-client/server.ts"],"names":[],"mappings":"AAMA,KAAK,aAAa,GAAG,KAAK,GAAG,MAAM,GAAG,KAAK,GAAG,QAAQ,GAAG,OAAO,CAAC;AAEjE,KAAK,gBAAgB,GAAG;IAAE,UAAU,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC;IAAC,IAAI,CAAC,EAAE,MAAM,EAAE,CAAA;CAAE,CAAC;AAEzE,UAAU,cAAe,SAAQ,IAAI,CAAC,WAAW,EAAE,QAAQ,GAAG,SAAS,GAAG,MAAM,GAAG,OAAO,GAAG,aAAa,CAAC;IACzG,MAAM,CAAC,EAAE,aAAa,CAAC;IACvB,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACjC,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAChC,KAAK,CAAC,EAAE,YAAY,CAAC;IACrB,WAAW,CAAC,EAAE,kBAAkB,CAAC;IACjC,IAAI,CAAC,EAAE,gBAAgB,CAAC;CACzB;AAED;;GAEG;AACH,MAAM,WAAW,WAAW,CAAC,CAAC;IAC5B,IAAI,EAAE,CAAC,CAAC;IACR,OAAO,EAAE,OAAO,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,KAAK,CAAC,EAAE,OAAO,CAAC;CACjB;AAED;;;;;GAKG;AACH,wBAAsB,UAAU,CAAC,CAAC,GAAG,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,OAAO,GAAE,cAAmB,GAAG,OAAO,CAAC,CAAC,CAAC,CAsGxG"}

package/dist/api-client/server.js

@@ -0,0 +1,95 @@
+import { cookies } from 'next/headers';
+import { getConfig } from '@korioinc/next-conf';
+import { deleteCookie, getCookie, setCookie } from 'cookies-next/server';
+/**
+ * Reusable API request function (server-only)
+ * @param endpoint - API endpoint path (without base URL)
+ * @param options - Request options
+ * @returns Promise with the response data
+ */
+export async function requestApi(endpoint, options = {}) {
+    const { method = 'GET', headers = {}, body, params, cache, credentials, next } = options;
+    // Get configuration
+    const cfg = getConfig();
+    const apiConfig = cfg.api;
+    // Prepare URL
+    const url = new URL(`${apiConfig.baseUrl}${endpoint.startsWith('/') ? endpoint : `/${endpoint}`}`);
+    if (params) {
+        Object.entries(params).forEach(([key, value]) => {
+            url.searchParams.append(key, value.toString());
+        });
+    }
+    // Get access token from cookie
+    const cookieCfg = cfg.cookie;
+    const accessTokenName = cookieCfg.accessTokenName;
+    const accessToken = await getCookie(accessTokenName, { cookies });
+    // Prepare headers with defaults
+    const requestHeaders = {
+        Accept: 'application/json',
+        ...headers,
+    };
+    // Add Authorization header if token exists
+    if (accessToken) {
+        requestHeaders['Authorization'] = `Bearer ${accessToken}`;
+    }
+    // Add Content-Type for requests with body
+    if (body && !requestHeaders['Content-Type'] && !(body instanceof FormData)) {
+        requestHeaders['Content-Type'] = 'application/json';
+    }
+    // Prepare request options
+    const requestOptions = {
+        method,
+        headers: requestHeaders,
+        credentials: credentials || 'same-origin',
+    };
+    // Add cache and revalidation options
+    if (cache) {
+        requestOptions.cache = cache;
+    }
+    if (next) {
+        requestOptions.next = next;
+    }
+    // Add body for non-GET requests if provided
+    if (method !== 'GET' && body) {
+        requestOptions.body = body instanceof FormData ? body : JSON.stringify(body);
+    }
+    try {
+        const response = await fetch(url.toString(), requestOptions);
+        const refreshedToken = response.headers.get('x-refreshed-token');
+        if (refreshedToken) {
+            // Update the access token cookie
+            await setCookie(accessTokenName, refreshedToken, {
+                cookies,
+                path: '/',
+                domain: cookieCfg.domain,
+                maxAge: cookieCfg.maxAge,
+                sameSite: 'lax',
+            });
+        }
+        // Handle non-OK responses
+        if (!response.ok) {
+            const errorData = await response.json().catch(() => ({
+                message: `API error: ${response.status} ${response.statusText}`,
+            }));
+            // Delete cookie on 401 Unauthorized
+            if (response.status === 401) {
+                deleteCookie(accessTokenName, {
+                    cookies,
+                    path: '/',
+                    domain: cookieCfg.domain,
+                });
+            }
+            throw new Error(errorData.message || `API error: ${response.status}`);
+        }
+        if (response.status === 204) {
+            return undefined;
+        }
+        // Parse JSON response
+        const jsonResponse = await response.json();
+        return jsonResponse;
+    }
+    catch (error) {
+        console.error(`Failed API request to ${endpoint}:`, error);
+        throw error;
+    }
+}

package/dist/components/locale-switcher/index.js

@@ -65,5 +65,5 @@ export default function LocaleSwitcher({ languages } = {}) {
     if (!currentLanguage) {
         return null;
     }
-    return (_jsxs(Menu, { as: 'div', className: 'relative', children: [_jsx(MenuButton, { className: 'border-input bg-card hover:bg-accent hover:text-accent-foreground relative inline-flex h-9 w-9 items-center justify-center rounded-md border transition-colors', children: currentLanguage.flag }), _jsx(Transition, { as: Fragment, enter: 'transition ease-out duration-100', enterFrom: 'transform opacity-0 scale-95', enterTo: 'transform opacity-100 scale-100', leave: 'transition ease-in duration-75', leaveFrom: 'transform opacity-100 scale-100', leaveTo: 'transform opacity-0 scale-95', children: _jsx(MenuItems, { anchor: 'bottom end', className: 'bg-popover border-border z-50 w-36 rounded-md border shadow-lg ring-1 ring-black/5 [--anchor-gap:4px] focus:outline-none', children: _jsx("div", { className: 'py-1', children: availableLanguages.map((language) => (_jsx(MenuItem, { children: _jsxs("button", { onClick: () => changeLanguage(language.code), className: 'data-[focus]:bg-accent data-[focus]:text-accent-foreground text-foreground group flex w-full items-center gap-2 px-3 py-2 text-sm transition-colors', children: [language.flag, _jsx("span", { children: language.name }), currentLocale === language.code && (_jsx("svg", { className: 'ml-auto h-4 w-4', fill: 'none', stroke: 'currentColor', viewBox: '0 0 24 24', children: _jsx("path", { strokeLinecap: 'round', strokeLinejoin: 'round', strokeWidth: 2, d: 'M5 13l4 4L19 7' }) }))] }) }, language.code))) }) }) })] }));
+    return (_jsxs(Menu, { as: 'div', className: 'relative', children: [_jsx(MenuButton, { className: 'border-glass bg-glass hover:bg-glass-backdrop relative inline-flex h-9 w-9 items-center justify-center rounded-md border transition-colors', children: currentLanguage.flag }), _jsx(Transition, { as: Fragment, enter: 'transition ease-out duration-100', enterFrom: 'transform opacity-0 scale-95', enterTo: 'transform opacity-100 scale-100', leave: 'transition ease-in duration-75', leaveFrom: 'transform opacity-100 scale-100', leaveTo: 'transform opacity-0 scale-95', children: _jsx(MenuItems, { anchor: 'bottom end', className: 'glass-backdrop border-glass z-50 w-36 rounded-md border ring-1 ring-black/5 [--anchor-gap:4px] focus:outline-none', children: _jsx("div", { className: 'py-1', children: availableLanguages.map((language) => (_jsx(MenuItem, { children: _jsxs("button", { onClick: () => changeLanguage(language.code), className: 'data-[focus]:bg-glass-backdrop text-foreground group flex w-full items-center gap-2 px-3 py-2 text-sm transition-colors', children: [language.flag, _jsx("span", { children: language.name }), currentLocale === language.code && (_jsx("svg", { className: 'ml-auto h-4 w-4', fill: 'none', stroke: 'currentColor', viewBox: '0 0 24 24', children: _jsx("path", { strokeLinecap: 'round', strokeLinejoin: 'round', strokeWidth: 2, d: 'M5 13l4 4L19 7' }) }))] }) }, language.code))) }) }) })] }));
 }

package/dist/components/theme-switcher/index.js

@@ -15,6 +15,6 @@ const ThemeSwitcher = () => {
     if (!mounted) {
         return (_jsx("button", { className: 'border-input bg-card relative inline-flex h-9 w-9 items-center justify-center rounded-md border opacity-0', "aria-hidden": 'true', children: _jsx("div", { className: 'h-5 w-5' }) }));
     }
-    return (_jsxs("button", { onClick: toggleTheme, className: 'border-input bg-card hover:bg-accent hover:text-accent-foreground relative inline-flex h-9 w-9 items-center justify-center rounded-md border transition-colors', "aria-label": `Switch theme (current: ${theme})`, title: `Theme: ${theme === 'light' ? 'Light' : 'Dark'} (click to change)`, children: [_jsxs("svg", { xmlns: 'http://www.w3.org/2000/svg', viewBox: '0 0 24 24', fill: 'none', stroke: 'currentColor', strokeWidth: '2', strokeLinecap: 'round', strokeLinejoin: 'round', className: `absolute h-5 w-5 transition-all ${theme !== 'dark' ? 'scale-100 rotate-0 opacity-100' : 'scale-0 rotate-90 opacity-0'}`, children: [_jsx("circle", { cx: '12', cy: '12', r: '5' }), _jsx("line", { x1: '12', y1: '1', x2: '12', y2: '3' }), _jsx("line", { x1: '12', y1: '21', x2: '12', y2: '23' }), _jsx("line", { x1: '4.22', y1: '4.22', x2: '5.64', y2: '5.64' }), _jsx("line", { x1: '18.36', y1: '18.36', x2: '19.78', y2: '19.78' }), _jsx("line", { x1: '1', y1: '12', x2: '3', y2: '12' }), _jsx("line", { x1: '21', y1: '12', x2: '23', y2: '12' }), _jsx("line", { x1: '4.22', y1: '19.78', x2: '5.64', y2: '18.36' }), _jsx("line", { x1: '18.36', y1: '5.64', x2: '19.78', y2: '4.22' })] }), _jsx("svg", { xmlns: 'http://www.w3.org/2000/svg', viewBox: '0 0 24 24', fill: 'none', stroke: 'currentColor', strokeWidth: '2', strokeLinecap: 'round', strokeLinejoin: 'round', className: `absolute h-5 w-5 transition-all ${theme === 'dark' ? 'scale-100 rotate-0 opacity-100' : 'scale-0 -rotate-90 opacity-0'}`, children: _jsx("path", { d: 'M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z' }) })] }));
+    return (_jsxs("button", { onClick: toggleTheme, className: 'border-glass bg-glass hover:bg-glass-backdrop relative inline-flex h-9 w-9 items-center justify-center rounded-md border transition-colors', "aria-label": `Switch theme (current: ${theme})`, title: `Theme: ${theme === 'light' ? 'Light' : 'Dark'} (click to change)`, children: [_jsxs("svg", { xmlns: 'http://www.w3.org/2000/svg', viewBox: '0 0 24 24', fill: 'none', stroke: 'currentColor', strokeWidth: '2', strokeLinecap: 'round', strokeLinejoin: 'round', className: `absolute h-5 w-5 transition-all ${theme !== 'dark' ? 'scale-100 rotate-0 opacity-100' : 'scale-0 rotate-90 opacity-0'}`, children: [_jsx("circle", { cx: '12', cy: '12', r: '5' }), _jsx("line", { x1: '12', y1: '1', x2: '12', y2: '3' }), _jsx("line", { x1: '12', y1: '21', x2: '12', y2: '23' }), _jsx("line", { x1: '4.22', y1: '4.22', x2: '5.64', y2: '5.64' }), _jsx("line", { x1: '18.36', y1: '18.36', x2: '19.78', y2: '19.78' }), _jsx("line", { x1: '1', y1: '12', x2: '3', y2: '12' }), _jsx("line", { x1: '21', y1: '12', x2: '23', y2: '12' }), _jsx("line", { x1: '4.22', y1: '19.78', x2: '5.64', y2: '18.36' }), _jsx("line", { x1: '18.36', y1: '5.64', x2: '19.78', y2: '4.22' })] }), _jsx("svg", { xmlns: 'http://www.w3.org/2000/svg', viewBox: '0 0 24 24', fill: 'none', stroke: 'currentColor', strokeWidth: '2', strokeLinecap: 'round', strokeLinejoin: 'round', className: `absolute h-5 w-5 transition-all ${theme === 'dark' ? 'scale-100 rotate-0 opacity-100' : 'scale-0 -rotate-90 opacity-0'}`, children: _jsx("path", { d: 'M21 12.79A9 9 0 1 1 11.21 3 7 7 0 0 0 21 12.79z' }) })] }));
 };
 export default ThemeSwitcher;

package/dist/styles/globals.css

@@ -71,10 +71,11 @@
   --color-code-number: var(--code-number);
   --color-selection: var(--selection);
   --color-selection-foreground: var(--selection-foreground);
+  --color-glass: var(--glass);
+  --color-glass-backdrop: var(--glass-backdrop);
 }
 
 :root {
-  --radius: 0.625rem;
   --background: oklch(1 0 0);
   --foreground: oklch(0.145 0 0);
   --card: oklch(1 0 0);
@@ -114,6 +115,35 @@
   --code-number: oklch(0.56 0 0);
   --selection: oklch(0.145 0 0);
   --selection-foreground: oklch(1 0 0);
+  --radius: 0.625rem;
+
+  /************************************************************/
+  /* liquid glass (light) */
+  /************************************************************/
+  --glass: oklch(0.8985 0.0271 250 / 0.22);
+  --glass-backdrop: oklch(0.8764 0.0271 255 / 0.32);
+  --glass-surface: oklch(0.962 0.014 250 / 0.42);
+  --glass-surface-backdrop: oklch(0.975 0.018 255 / 0.52);
+  --glass-border: oklch(0.92 0.02 250 / 0.78);
+  --glass-border-subtle: oklch(0.88 0.015 250 / 0.5);
+  --glass-shine: oklch(1 0 0 / 1);
+  --glass-shine-subtle: oklch(1 0 0 / 0.88);
+  --glass-shadow-color: oklch(0.25 0.02 250 / 0.08);
+  --glass-shadow-ambient: oklch(0.35 0.015 250 / 0.055);
+  --glass-glow: oklch(0.65 0.18 250 / 0.32);
+  --glass-blur: 14px;
+  --glass-blur-backdrop: 8px;
+
+  --mesh-1: oklch(0.6008 0.1493 249.6 / 0.251);
+  --mesh-2: oklch(0.6498 0.1201 300.4 / 0.2);
+  --mesh-3: oklch(0.7 0.1201 220.3 / 0.18);
+  --mesh-4: oklch(0.5994 0.1998 320.1 / 0.302);
+
+  --aurora-1: oklch(0.6496 0.1802 250.1 / 0.451);
+  --aurora-2: oklch(0.7006 0.1494 279.7 / 0.4);
+  --aurora-3: oklch(0.7492 0.1199 200.4 / 0.349);
+
+  --noise-opacity: 0.025;
 }
 
 .dark {
@@ -156,6 +186,34 @@
   --code-number: oklch(0.72 0 0);
   --selection: oklch(0.922 0 0);
   --selection-foreground: oklch(0.205 0 0);
+
+  /************************************************************/
+  /* liquid glass (dark) */
+  /************************************************************/
+  --glass: oklch(0.32 0.0198 252.2 / 0.52);
+  --glass-backdrop: oklch(0.36 0.0206 254.9 / 0.62);
+  --glass-surface: oklch(0.1792 0.0198 252.2 / 0.42);
+  --glass-surface-backdrop: oklch(0.2195 0.0206 254.9 / 0.52);
+  --glass-border: oklch(1 0 0 / 0.122);
+  --glass-border-subtle: oklch(1 0 0 / 0.078);
+  --glass-shine: oklch(1 0 0 / 0.149);
+  --glass-shine-subtle: oklch(1 0 0 / 0.078);
+  --glass-shadow-color: oklch(0 0 0 / 0.21);
+  --glass-shadow-ambient: oklch(0 0 0 / 0.11);
+  --glass-glow: oklch(0.6991 0.1648 249.1 / 0.302);
+  --glass-blur: 12px;
+  --glass-blur-backdrop: 8px;
+
+  --mesh-1: oklch(0.4035 0.121 252.1 / 0.349);
+  --mesh-2: oklch(0.4504 0.1802 299.9 / 0.302);
+  --mesh-3: oklch(0.5014 0.0917 220.6 / 0.251);
+  --mesh-4: oklch(0.5016 0.2405 320.2 / 0.349);
+
+  --aurora-1: oklch(0.5057 0.1589 253.6 / 0.502);
+  --aurora-2: oklch(0.4499 0.2002 280 / 0.451);
+  --aurora-3: oklch(0.5581 0.0949 201.4 / 0.4);
+
+  --noise-opacity: 0.035;
 }
 
 @layer base {
@@ -218,6 +276,54 @@
   @apply after:border-border relative after:absolute after:inset-0 after:border after:mix-blend-darken dark:after:mix-blend-lighten;
 }
 
+@utility glass {
+  background:
+    linear-gradient(
+      135deg,
+      color-mix(in oklab, var(--glass-shine) 12%, transparent) 0%,
+      color-mix(in oklab, var(--glass-shine) 8%, transparent) 30%,
+      color-mix(in oklab, var(--glass-shine) 4%, transparent) 70%,
+      color-mix(in oklab, var(--glass-shine) 6%, transparent) 100%
+    ),
+    var(--glass-surface);
+  /*backdrop-filter: blur(var(--glass-blur)) saturate(1.2);*/
+  box-shadow:
+    0 1px 2px var(--glass-shadow-ambient),
+    0 5px 10px var(--glass-shadow-color),
+    inset 0 1px 0 var(--glass-shine-subtle);
+}
+
+@utility glass-backdrop {
+  background:
+    linear-gradient(
+      135deg,
+      color-mix(in oklab, var(--glass-shine) 12%, transparent) 0%,
+      color-mix(in oklab, var(--glass-shine) 8%, transparent) 30%,
+      color-mix(in oklab, var(--glass-shine) 4%, transparent) 70%,
+      color-mix(in oklab, var(--glass-shine) 6%, transparent) 100%
+    ),
+    var(--glass-surface-backdrop);
+  backdrop-filter: blur(var(--glass-blur-backdrop)) saturate(1.2);
+  box-shadow:
+    0 1px 2px var(--glass-shadow-ambient),
+    0 5px 10px var(--glass-shadow-color),
+    inset 0 1px 0 var(--glass-shine-subtle);
+}
+
+@utility border-glass {
+  border-color: var(--glass-border);
+  position: relative;
+
+  &::after {
+    content: '';
+    position: absolute;
+    inset: 0;
+    border-radius: inherit;
+    pointer-events: none;
+    box-shadow: inset 0 1px 0 var(--glass-shine-subtle);
+  }
+}
+
 @utility step {
   counter-increment: step;
   @apply relative;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@korioinc/next-core",
-  "version": "2.0.3",
+  "version": "2.0.6",
   "type": "module",
   "exports": {
     "./ads": {
@@ -79,7 +79,7 @@
     "tsc-alias": "^1.8.16",
     "tw-animate-css": "^1.4.0",
     "typescript": "^5.9.3",
-    "@korioinc/next-configs": "2.0.3"
+    "@korioinc/next-configs": "2.0.6"
   },
   "dependencies": {
     "@floating-ui/react": "^0.27.16",
@@ -94,7 +94,7 @@
     "schema-dts": "^1.1.5",
     "tailwind-merge": "^3.4.0",
     "valtio": "^2.2.0",
-    "@korioinc/next-conf": "2.0.3"
+    "@korioinc/next-conf": "2.0.6"
   },
   "publishConfig": {
     "access": "public",