@bug-on/m3-expressive 1.3.3 → 1.3.5

package/dist/{core-DyEy8H9Z.d.ts → core-Cckt8qEm.d.ts}

@@ -1,9 +1,8 @@
 import * as React$1 from 'react';
 import { ReactNode } from 'react';
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { ClassValue } from 'clsx';
 import './md3-BQhRygSi.js';
-import { a as Typography, F as FontVariationAxes } from './typography-339RV6v7.js';
+import { a as Typography, F as FontVariationAxes } from './typography-CKTjvlZ4.js';
 
 /**
  * useMediaQuery — SSR-safe responsive hook.
@@ -206,13 +205,17 @@ interface MaterialSymbolsPreconnectProps {
     /**
      * Array of Material Symbols font variants to load.
      * Include only variants used by application to minimize bandwidth.
-     * @default ["outlined"]
+     * @default ["rounded"]
      */
     variants?: Array<"outlined" | "rounded" | "sharp">;
+    /**
+     * Font display strategy.
+     * Using "block" hides text until font loads, preventing unsightly ligature text pop-in (e.g. "search").
+     * @default "block"
+     */
+    display?: "block" | "swap";
 }
-declare function MaterialSymbolsPreconnect({ variants, }: MaterialSymbolsPreconnectProps): react_jsx_runtime.JSX.Element;
-
-declare function cn(...inputs: ClassValue[]): string;
+declare function MaterialSymbolsPreconnect({ variants, display, }: MaterialSymbolsPreconnectProps): react_jsx_runtime.JSX.Element;
 
 /**
  * Props cho component {@link Icon}.
@@ -228,7 +231,7 @@ interface IconProps extends React$1.HTMLAttributes<HTMLSpanElement> {
     name: string;
     /**
      * Geometric style variant — maps to font family.
-     * @default "outlined"
+     * @default "rounded"
      */
     variant?: "outlined" | "rounded" | "sharp";
     /**
@@ -494,4 +497,4 @@ declare function MD3ThemeProvider({ children, sourceColor: initialSourceColor, d
 declare function useTheme(): ThemeContextValue;
 declare function useThemeMode(): Pick<ThemeContextValue, "mode" | "setMode" | "effectiveMode">;
 
-export { type ContrastLevel as C, type GenerateM3ThemeOptions as G, Icon as I, type MD3ColorScheme as M, Ripple as R, type SchemeVariant as S, type ThemeMode as T, type UseRippleStateOptions as U, type IconProps as a, MD3ThemeProvider as b, type MD3ThemeProviderProps as c, MaterialSymbolsPreconnect as d, type RippleOrigin as e, type RippleProps as f, applyTheme as g, cn as h, generateM3Theme as i, useMediaQuery as j, useRipple as k, useRippleState as l, useTheme as m, useThemeMode as n, resolveMode as r, useRipple$1 as u };
+export { type ContrastLevel as C, type GenerateM3ThemeOptions as G, Icon as I, type MD3ColorScheme as M, Ripple as R, type SchemeVariant as S, type ThemeMode as T, type UseRippleStateOptions as U, type IconProps as a, MD3ThemeProvider as b, type MD3ThemeProviderProps as c, MaterialSymbolsPreconnect as d, type RippleOrigin as e, type RippleProps as f, applyTheme as g, generateM3Theme as h, useMediaQuery as i, useRipple as j, useRippleState as k, useTheme as l, useThemeMode as m, resolveMode as r, useRipple$1 as u };

package/dist/{core-D8FdHY6I.d.mts → core-DDfG4pym.d.mts}

@@ -1,9 +1,8 @@
 import * as React$1 from 'react';
 import { ReactNode } from 'react';
 import * as react_jsx_runtime from 'react/jsx-runtime';
-import { ClassValue } from 'clsx';
 import './md3-BQhRygSi.mjs';
-import { a as Typography, F as FontVariationAxes } from './typography-339RV6v7.mjs';
+import { a as Typography, F as FontVariationAxes } from './typography-CKTjvlZ4.mjs';
 
 /**
  * useMediaQuery — SSR-safe responsive hook.
@@ -206,13 +205,17 @@ interface MaterialSymbolsPreconnectProps {
     /**
      * Array of Material Symbols font variants to load.
      * Include only variants used by application to minimize bandwidth.
-     * @default ["outlined"]
+     * @default ["rounded"]
      */
     variants?: Array<"outlined" | "rounded" | "sharp">;
+    /**
+     * Font display strategy.
+     * Using "block" hides text until font loads, preventing unsightly ligature text pop-in (e.g. "search").
+     * @default "block"
+     */
+    display?: "block" | "swap";
 }
-declare function MaterialSymbolsPreconnect({ variants, }: MaterialSymbolsPreconnectProps): react_jsx_runtime.JSX.Element;
-
-declare function cn(...inputs: ClassValue[]): string;
+declare function MaterialSymbolsPreconnect({ variants, display, }: MaterialSymbolsPreconnectProps): react_jsx_runtime.JSX.Element;
 
 /**
  * Props cho component {@link Icon}.
@@ -228,7 +231,7 @@ interface IconProps extends React$1.HTMLAttributes<HTMLSpanElement> {
     name: string;
     /**
      * Geometric style variant — maps to font family.
-     * @default "outlined"
+     * @default "rounded"
      */
     variant?: "outlined" | "rounded" | "sharp";
     /**
@@ -494,4 +497,4 @@ declare function MD3ThemeProvider({ children, sourceColor: initialSourceColor, d
 declare function useTheme(): ThemeContextValue;
 declare function useThemeMode(): Pick<ThemeContextValue, "mode" | "setMode" | "effectiveMode">;
 
-export { type ContrastLevel as C, type GenerateM3ThemeOptions as G, Icon as I, type MD3ColorScheme as M, Ripple as R, type SchemeVariant as S, type ThemeMode as T, type UseRippleStateOptions as U, type IconProps as a, MD3ThemeProvider as b, type MD3ThemeProviderProps as c, MaterialSymbolsPreconnect as d, type RippleOrigin as e, type RippleProps as f, applyTheme as g, cn as h, generateM3Theme as i, useMediaQuery as j, useRipple as k, useRippleState as l, useTheme as m, useThemeMode as n, resolveMode as r, useRipple$1 as u };
+export { type ContrastLevel as C, type GenerateM3ThemeOptions as G, Icon as I, type MD3ColorScheme as M, Ripple as R, type SchemeVariant as S, type ThemeMode as T, type UseRippleStateOptions as U, type IconProps as a, MD3ThemeProvider as b, type MD3ThemeProviderProps as c, MaterialSymbolsPreconnect as d, type RippleOrigin as e, type RippleProps as f, applyTheme as g, generateM3Theme as h, useMediaQuery as i, useRipple as j, useRippleState as k, useTheme as l, useThemeMode as m, resolveMode as r, useRipple$1 as u };

package/dist/core.d.mts

@@ -1,6 +1,5 @@
-export { I as Icon, a as IconProps, M as MD3ColorScheme, b as MD3ThemeProvider, c as MD3ThemeProviderProps, d as MaterialSymbolsPreconnect, R as Ripple, e as RippleOrigin, f as RippleProps, T as ThemeMode, U as UseRippleStateOptions, g as applyTheme, h as cn, i as generateM3Theme, r as resolveMode, u as useDOMRipple, j as useMediaQuery, k as useRipple, l as useRippleState, m as useTheme, n as useThemeMode } from './core-D8FdHY6I.mjs';
+export { I as Icon, a as IconProps, M as MD3ColorScheme, b as MD3ThemeProvider, c as MD3ThemeProviderProps, d as MaterialSymbolsPreconnect, R as Ripple, e as RippleOrigin, f as RippleProps, T as ThemeMode, U as UseRippleStateOptions, g as applyTheme, h as generateM3Theme, r as resolveMode, u as useDOMRipple, i as useMediaQuery, j as useRipple, k as useRippleState, l as useTheme, m as useThemeMode } from './core-DDfG4pym.mjs';
 export { M as MD3ColorStyle, a as MD3Shape, b as MD3Size, P as PolymorphicProps, c as PolymorphicRef } from './md3-BQhRygSi.mjs';
 import 'react';
 import 'react/jsx-runtime';
-import 'clsx';
-import './typography-339RV6v7.mjs';
+import './typography-CKTjvlZ4.mjs';

package/dist/core.d.ts

@@ -1,6 +1,5 @@
-export { I as Icon, a as IconProps, M as MD3ColorScheme, b as MD3ThemeProvider, c as MD3ThemeProviderProps, d as MaterialSymbolsPreconnect, R as Ripple, e as RippleOrigin, f as RippleProps, T as ThemeMode, U as UseRippleStateOptions, g as applyTheme, h as cn, i as generateM3Theme, r as resolveMode, u as useDOMRipple, j as useMediaQuery, k as useRipple, l as useRippleState, m as useTheme, n as useThemeMode } from './core-DyEy8H9Z.js';
+export { I as Icon, a as IconProps, M as MD3ColorScheme, b as MD3ThemeProvider, c as MD3ThemeProviderProps, d as MaterialSymbolsPreconnect, R as Ripple, e as RippleOrigin, f as RippleProps, T as ThemeMode, U as UseRippleStateOptions, g as applyTheme, h as generateM3Theme, r as resolveMode, u as useDOMRipple, i as useMediaQuery, j as useRipple, k as useRippleState, l as useTheme, m as useThemeMode } from './core-Cckt8qEm.js';
 export { M as MD3ColorStyle, a as MD3Shape, b as MD3Size, P as PolymorphicProps, c as PolymorphicRef } from './md3-BQhRygSi.js';
 import 'react';
 import 'react/jsx-runtime';
-import 'clsx';
-import './typography-339RV6v7.js';
+import './typography-CKTjvlZ4.js';

package/dist/core.js

@@ -4,9 +4,9 @@
 var React4 = require('react');
 var jsxRuntime = require('react/jsx-runtime');
 var materialColorUtilities = require('@material/material-color-utilities');
+var react = require('motion/react');
 var clsx = require('clsx');
 var tailwindMerge = require('tailwind-merge');
-var react = require('motion/react');
 var reactSlot = require('@radix-ui/react-slot');
 
 function _interopNamespace(e) {
@@ -130,7 +130,8 @@ function useRipple(options = {}) {
   return { rippleRef: ref, onPointerDown };
 }
 function MaterialSymbolsPreconnect({
-  variants = ["outlined"]
+  variants = ["rounded"],
+  display = "block"
 }) {
   return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
     /* @__PURE__ */ jsxRuntime.jsx("link", { rel: "preconnect", href: "https://fonts.googleapis.com" }),
@@ -145,7 +146,7 @@ function MaterialSymbolsPreconnect({
     variants.includes("outlined") && /* @__PURE__ */ jsxRuntime.jsx(
       "link",
       {
-        href: "https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200&display=swap",
+        href: `https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200&display=${display}`,
         rel: "stylesheet",
         precedence: "default"
       }
@@ -153,7 +154,7 @@ function MaterialSymbolsPreconnect({
     variants.includes("rounded") && /* @__PURE__ */ jsxRuntime.jsx(
       "link",
       {
-        href: "https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200&display=swap",
+        href: `https://fonts.googleapis.com/css2?family=Material+Symbols+Rounded:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200&display=${display}`,
         rel: "stylesheet",
         precedence: "default"
       }
@@ -161,7 +162,7 @@ function MaterialSymbolsPreconnect({
     variants.includes("sharp") && /* @__PURE__ */ jsxRuntime.jsx(
       "link",
       {
-        href: "https://fonts.googleapis.com/css2?family=Material+Symbols+Sharp:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200&display=swap",
+        href: `https://fonts.googleapis.com/css2?family=Material+Symbols+Sharp:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200&display=${display}`,
         rel: "stylesheet",
         precedence: "default"
       }
@@ -322,7 +323,7 @@ var IconComponent = React4__namespace.forwardRef(
   (_a, ref) => {
     var _b = _a, {
       name,
-      variant = "outlined",
+      variant = "rounded",
       fill = 0,
       weight = 400,
       grade = 0,
@@ -2996,7 +2997,6 @@ exports.MD3ThemeProvider = MD3ThemeProvider;
 exports.MaterialSymbolsPreconnect = MaterialSymbolsPreconnect;
 exports.Ripple = Ripple;
 exports.applyTheme = applyTheme;
-exports.cn = cn;
 exports.generateM3Theme = generateM3Theme;
 exports.resolveMode = resolveMode;
 exports.useDOMRipple = useRipple;