@lobehub/ui 5.57.3 → 6.0.0-beta.1

package/es/dashboard/PageTabs/style.mjs

@@ -1,56 +1,38 @@
-import { createStaticStyles } from "antd-style";
 //#region src/dashboard/PageTabs/style.ts
-const styles = createStaticStyles(({ css, cssVar, responsive }) => ({
-	count: css`
-    display: inline-flex;
-    align-items: center;
-    justify-content: center;
-
-    min-inline-size: 1.5em;
-    padding-inline: ${cssVar.paddingXXS};
-    border-radius: ${cssVar.borderRadiusXS};
-
-    font-size: ${cssVar.fontSizeSM};
-    font-weight: 500;
-    font-variant-numeric: tabular-nums;
-    line-height: 1.4;
-    color: ${cssVar.colorTextSecondary};
-
-    background: ${cssVar.colorFillSecondary};
-  `,
-	list: css`
-    scrollbar-width: none;
-    overflow-x: auto;
-    flex-wrap: nowrap;
-    max-inline-size: 100%;
-
-    &::-webkit-scrollbar {
-      display: none;
-    }
-
-    && {
-      gap: ${cssVar.paddingXXS};
-      padding: ${cssVar.paddingXXS};
-    }
-  `,
-	panel: css`
-    padding-block-start: 16px;
-  `,
-	root: css`
-    min-inline-size: 0;
-  `,
-	tab: css`
-    flex: none;
-
-    && {
-      gap: ${cssVar.paddingXS};
-    }
-
-    ${responsive.mobile} {
-      min-block-size: 44px;
-    }
-  `
-}));
+const styles = {
+	count: {
+		kaIpWk: "lb1jq78ib",
+		kg3NbH: "lb1ha9ihy",
+		kGNEyG: "lb6s0dn4",
+		kWkggS: "lbjjy28o",
+		kMwMTN: "lbc77et8",
+		k1xSpc: "lb3nfvp2",
+		kGuDYH: "lbxobqjj",
+		kcqcaj: "lbss6m8b",
+		k63SB2: "lbk50ysn",
+		kjj79g: "lbl56j7k",
+		kLWn49: "lb37zpob",
+		k7Eaqz: "lb1et6avd",
+		$$css: true
+	},
+	list: {
+		kwnvtZ: "lbozqiw3",
+		ks0D6T: "lb193iq5w",
+		k5wCbM: "lb1rohswg",
+		kXHlph: "lbw2csxc",
+		kOuLrU: "lbfk6m8",
+		$$css: true
+	},
+	root: {
+		k7Eaqz: "lbeuugli",
+		$$css: true
+	},
+	tab: {
+		kUk6DE: "lb1okw0bk",
+		kAzted: "lb10nga59",
+		$$css: true
+	}
+};
 //#endregion
 export { styles };
 

package/es/dashboard/PageTabs/style.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/dashboard/PageTabs/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nexport const styles = createStaticStyles(({ css, cssVar, responsive }) => ({\n  count: css`\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n\n    min-inline-size: 1.5em;\n    padding-inline: ${cssVar.paddingXXS};\n    border-radius: ${cssVar.borderRadiusXS};\n\n    font-size: ${cssVar.fontSizeSM};\n    font-weight: 500;\n    font-variant-numeric: tabular-nums;\n    line-height: 1.4;\n    color: ${cssVar.colorTextSecondary};\n\n    background: ${cssVar.colorFillSecondary};\n  `,\n  list: css`\n    scrollbar-width: none;\n    overflow-x: auto;\n    flex-wrap: nowrap;\n    max-inline-size: 100%;\n\n    &::-webkit-scrollbar {\n      display: none;\n    }\n\n    && {\n      gap: ${cssVar.paddingXXS};\n      padding: ${cssVar.paddingXXS};\n    }\n  `,\n  panel: css`\n    padding-block-start: 16px;\n  `,\n  root: css`\n    min-inline-size: 0;\n  `,\n  tab: css`\n    flex: none;\n\n    && {\n      gap: ${cssVar.paddingXS};\n    }\n\n    ${responsive.mobile} {\n      min-block-size: 44px;\n    }\n  `,\n}));\n"],"mappings":";;AAEA,MAAa,SAAS,oBAAoB,EAAE,KAAK,QAAQ,kBAAkB;CACzE,OAAO,GAAG;;;;;;sBAMU,OAAO,WAAW;qBACnB,OAAO,eAAe;;iBAE1B,OAAO,WAAW;;;;aAItB,OAAO,mBAAmB;;kBAErB,OAAO,mBAAmB;;CAE1C,MAAM,GAAG;;;;;;;;;;;aAWE,OAAO,WAAW;iBACd,OAAO,WAAW;;;CAGjC,OAAO,GAAG;;;CAGV,MAAM,GAAG;;;CAGT,KAAK,GAAG;;;;aAIG,OAAO,UAAU;;;MAGxB,WAAW,OAAO;;;;AAIxB,EAAE"}
+{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/dashboard/PageTabs/style.ts"],"sourcesContent":["import * as stylex from '@stylexjs/stylex';\n\nimport { cssVar } from '@/styles/stylex/cssVar.stylex';\nimport { media } from '@/styles/stylex/media.stylex';\n\nexport const styles = stylex.create({\n  count: {\n    borderRadius: cssVar.borderRadiusXS,\n    paddingInline: cssVar.paddingXXS,\n    alignItems: 'center',\n    backgroundColor: cssVar.colorFillSecondary,\n    color: cssVar.colorTextSecondary,\n    display: 'inline-flex',\n    fontSize: cssVar.fontSizeSM,\n    fontVariantNumeric: 'tabular-nums',\n    fontWeight: 500,\n    justifyContent: 'center',\n    lineHeight: 1.4,\n    minInlineSize: '1.5em',\n  },\n  list: {\n    'flexWrap': 'nowrap',\n    'maxInlineSize': '100%',\n    'scrollbarWidth': 'none',\n    'overflowX': 'auto',\n    '::-webkit-scrollbar': {\n      display: 'none',\n    },\n  },\n  root: {\n    minInlineSize: 0,\n  },\n  tab: {\n    flex: 'none',\n    minBlockSize: { default: null, [media.mobile]: 44 },\n  },\n});\n"],"mappings":";AAKA,MAAa,SAAS;CACpB,OAAO;EACL,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,MAAM;EACJ,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,MAAM;EACJ,QAAQ;EACR,OAAO;CACT;CACA,KAAK;EACH,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;AACF"}

package/es/dashboard/PageTabs/type.d.mts

@@ -1,17 +1,16 @@
 import { ReactNode } from "react";
 //#region src/dashboard/PageTabs/type.d.ts
-interface PageTab<Value extends string> {
+export interface PageTab<Value extends string> {
   content: ReactNode;
   count?: ReactNode;
   label: string;
   value: Value;
 }
-interface PageTabsProps<Value extends string> {
+export interface PageTabsProps<Value extends string> {
   label: string;
   onChange: (value: Value) => void;
   tabs: PageTab<Value>[];
   value: Value;
 }
 //#endregion
-export { PageTab, PageTabsProps };
 //# sourceMappingURL=type.d.mts.map

package/es/dashboard/RouteProgress/RouteProgress.mjs

@@ -2,6 +2,7 @@
 import { styles } from "./style.mjs";
 import { useEffect, useState } from "react";
 import { jsx } from "react/jsx-runtime";
+import * as stylex from "@stylexjs/stylex";
 //#region src/dashboard/RouteProgress/RouteProgress.tsx
 const FADE_MS = 200;
 const CREEP_MS = 120;
@@ -29,7 +30,7 @@ function RouteProgress({ loading = false }) {
 	if (progress === null) return null;
 	return /* @__PURE__ */ jsx("div", {
 		"aria-hidden": true,
-		className: styles.bar,
+		...stylex.props(styles.bar),
 		style: {
 			opacity: progress >= 1 ? 0 : 1,
 			transform: `scaleX(${progress})`,

package/es/dashboard/RouteProgress/RouteProgress.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"RouteProgress.mjs","names":[],"sources":["../../../src/dashboard/RouteProgress/RouteProgress.tsx"],"sourcesContent":["'use client';\n\nimport { useEffect, useState } from 'react';\n\nimport { styles } from './style';\nimport type { RouteProgressProps } from './type';\n\nconst FADE_MS = 200;\nconst CREEP_MS = 120;\n\nfunction RouteProgress({ loading = false }: RouteProgressProps) {\n  const [progress, setProgress] = useState<number | null>(null);\n\n  useEffect(() => {\n    if (loading) {\n      const creep = window.setInterval(() => {\n        setProgress((value) => {\n          const from = value ?? 0;\n          return from >= 0.9 ? from : from + (0.9 - from) * 0.2;\n        });\n      }, CREEP_MS);\n      return () => window.clearInterval(creep);\n    }\n\n    const settle = window.setTimeout(() => {\n      setProgress((value) => (value === null ? null : 1));\n    }, 0);\n    const hide = window.setTimeout(() => setProgress(null), FADE_MS);\n    return () => {\n      window.clearTimeout(settle);\n      window.clearTimeout(hide);\n    };\n  }, [loading]);\n\n  if (progress === null) return null;\n  return (\n    <div\n      aria-hidden\n      className={styles.bar}\n      style={{\n        opacity: progress >= 1 ? 0 : 1,\n        transform: `scaleX(${progress})`,\n        transition: `transform ${FADE_MS}ms ease-out, opacity ${FADE_MS}ms ease-in`,\n      }}\n    />\n  );\n}\n\nRouteProgress.displayName = 'RouteProgress';\n\nexport default RouteProgress;\n"],"mappings":";;;;;AAOA,MAAM,UAAU;AAChB,MAAM,WAAW;AAEjB,SAAS,cAAc,EAAE,UAAU,SAA6B;CAC9D,MAAM,CAAC,UAAU,eAAe,SAAwB,IAAI;CAE5D,gBAAgB;EACd,IAAI,SAAS;GACX,MAAM,QAAQ,OAAO,kBAAkB;IACrC,aAAa,UAAU;KACrB,MAAM,OAAO,SAAS;KACtB,OAAO,QAAQ,KAAM,OAAO,QAAQ,KAAM,QAAQ;IACpD,CAAC;GACH,GAAG,QAAQ;GACX,aAAa,OAAO,cAAc,KAAK;EACzC;EAEA,MAAM,SAAS,OAAO,iBAAiB;GACrC,aAAa,UAAW,UAAU,OAAO,OAAO,CAAE;EACpD,GAAG,CAAC;EACJ,MAAM,OAAO,OAAO,iBAAiB,YAAY,IAAI,GAAG,OAAO;EAC/D,aAAa;GACX,OAAO,aAAa,MAAM;GAC1B,OAAO,aAAa,IAAI;EAC1B;CACF,GAAG,CAAC,OAAO,CAAC;CAEZ,IAAI,aAAa,MAAM,OAAO;CAC9B,OACE,oBAAC,OAAD;EACE,eAAA;EACA,WAAW,OAAO;EAClB,OAAO;GACL,SAAS,YAAY,IAAI,IAAI;GAC7B,WAAW,UAAU,SAAS;GAC9B,YAAY,aAAa,QAAQ,uBAAuB,QAAQ;EAClE;CACD,CAAA;AAEL;AAEA,cAAc,cAAc"}
+{"version":3,"file":"RouteProgress.mjs","names":[],"sources":["../../../src/dashboard/RouteProgress/RouteProgress.tsx"],"sourcesContent":["'use client';\n\nimport * as stylex from '@stylexjs/stylex';\nimport { useEffect, useState } from 'react';\n\nimport { styles } from './style';\nimport type { RouteProgressProps } from './type';\n\nconst FADE_MS = 200;\nconst CREEP_MS = 120;\n\nfunction RouteProgress({ loading = false }: RouteProgressProps) {\n  const [progress, setProgress] = useState<number | null>(null);\n\n  useEffect(() => {\n    if (loading) {\n      const creep = window.setInterval(() => {\n        setProgress((value) => {\n          const from = value ?? 0;\n          return from >= 0.9 ? from : from + (0.9 - from) * 0.2;\n        });\n      }, CREEP_MS);\n      return () => window.clearInterval(creep);\n    }\n\n    const settle = window.setTimeout(() => {\n      setProgress((value) => (value === null ? null : 1));\n    }, 0);\n    const hide = window.setTimeout(() => setProgress(null), FADE_MS);\n    return () => {\n      window.clearTimeout(settle);\n      window.clearTimeout(hide);\n    };\n  }, [loading]);\n\n  if (progress === null) return null;\n  return (\n    <div\n      aria-hidden\n      {...stylex.props(styles.bar)}\n      style={{\n        opacity: progress >= 1 ? 0 : 1,\n        transform: `scaleX(${progress})`,\n        transition: `transform ${FADE_MS}ms ease-out, opacity ${FADE_MS}ms ease-in`,\n      }}\n    />\n  );\n}\n\nRouteProgress.displayName = 'RouteProgress';\n\nexport default RouteProgress;\n"],"mappings":";;;;;;AAMA,MAAM,UAAU;AAChB,MAAM,WAAW;AACjB,SAAS,cAAc,EACrB,UAAU,SACW;CACrB,MAAM,CAAC,UAAU,eAAe,SAAwB,IAAI;CAC5D,gBAAgB;EACd,IAAI,SAAS;GACX,MAAM,QAAQ,OAAO,kBAAkB;IACrC,aAAY,UAAS;KACnB,MAAM,OAAO,SAAS;KACtB,OAAO,QAAQ,KAAM,OAAO,QAAQ,KAAM,QAAQ;IACpD,CAAC;GACH,GAAG,QAAQ;GACX,aAAa,OAAO,cAAc,KAAK;EACzC;EACA,MAAM,SAAS,OAAO,iBAAiB;GACrC,aAAY,UAAS,UAAU,OAAO,OAAO,CAAC;EAChD,GAAG,CAAC;EACJ,MAAM,OAAO,OAAO,iBAAiB,YAAY,IAAI,GAAG,OAAO;EAC/D,aAAa;GACX,OAAO,aAAa,MAAM;GAC1B,OAAO,aAAa,IAAI;EAC1B;CACF,GAAG,CAAC,OAAO,CAAC;CACZ,IAAI,aAAa,MAAM,OAAO;CAC9B,OAAO,oBAAC,OAAD;EAAK,eAAA;EAAY,GAAI,OAAO,MAAM,OAAO,GAAG;EAAG,OAAO;GAC3D,SAAS,YAAY,IAAI,IAAI;GAC7B,WAAW,UAAU,SAAS;GAC9B,YAAY,aAAa,QAAQ,uBAAuB,QAAQ;EAClE;CAAI,CAAA;AACN;AACA,cAAc,cAAc"}

package/es/dashboard/RouteProgress/style.mjs

@@ -1,18 +1,15 @@
-import { createStaticStyles } from "antd-style";
 //#region src/dashboard/RouteProgress/style.ts
-const styles = createStaticStyles(({ css, cssVar }) => ({ bar: css`
-    will-change: transform, opacity;
-
-    position: fixed;
-    z-index: 1000;
-    inset-block-start: 0;
-    inset-inline: 0;
-    transform-origin: 0 50%;
-
-    block-size: 2px;
-
-    background: ${cssVar.colorPrimary};
-  ` }));
+const styles = { bar: {
+	kkqhue: "lb17y0mx6",
+	kWkggS: "lb1hsafae",
+	kZKoxP: "lb36qwtl",
+	k87sOh: "lb13vifvy",
+	kVAEAm: "lbixxii4",
+	k3nNDw: "lb4uogl2",
+	k6sLGO: "lb1q1rmc8",
+	kY2c9j: "lbfo81ep",
+	$$css: true
+} };
 //#endregion
 export { styles };
 

package/es/dashboard/RouteProgress/style.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/dashboard/RouteProgress/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nexport const styles = createStaticStyles(({ css, cssVar }) => ({\n  bar: css`\n    will-change: transform, opacity;\n\n    position: fixed;\n    z-index: 1000;\n    inset-block-start: 0;\n    inset-inline: 0;\n    transform-origin: 0 50%;\n\n    block-size: 2px;\n\n    background: ${cssVar.colorPrimary};\n  `,\n}));\n"],"mappings":";;AAEA,MAAa,SAAS,oBAAoB,EAAE,KAAK,cAAc,EAC7D,KAAK,GAAG;;;;;;;;;;;kBAWQ,OAAO,aAAa;IAEtC,EAAE"}
+{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/dashboard/RouteProgress/style.ts"],"sourcesContent":["import * as stylex from '@stylexjs/stylex';\n\nimport { cssVar } from '@/styles/stylex/cssVar.stylex';\n\nexport const styles = stylex.create({\n  bar: {\n    insetInline: 0,\n    backgroundColor: cssVar.colorPrimary,\n    blockSize: 2,\n    insetBlockStart: 0,\n    position: 'fixed',\n    transformOrigin: '0 50%',\n    willChange: 'transform, opacity',\n    zIndex: 1000,\n  },\n});\n"],"mappings":";AAGA,MAAa,SAAS,EACpB,KAAK;CACH,QAAQ;CACR,QAAQ;CACR,QAAQ;CACR,QAAQ;CACR,QAAQ;CACR,QAAQ;CACR,QAAQ;CACR,QAAQ;CACR,OAAO;AACT,EACF"}

package/es/dashboard/RouteProgress/type.d.mts

@@ -1,8 +1,7 @@
 //#region src/dashboard/RouteProgress/type.d.ts
-interface RouteProgressProps {
+export interface RouteProgressProps {
   /** While true, the bar creeps toward the end. When it becomes false, the bar finishes and fades. */
   loading?: boolean;
 }
 //#endregion
-export { RouteProgressProps };
 //# sourceMappingURL=type.d.mts.map

package/es/dashboard/StatCard/StatCard.mjs

@@ -1,11 +1,12 @@
 "use client";
-import FlexBasic_default from "../../Flex/FlexBasic.mjs";
-import Block from "../../Block/Block.mjs";
+import { cssVar } from "../../styles/stylex/cssVar.stylex.mjs";
 import Icon from "../../Icon/Icon.mjs";
-import Text from "../../base-ui/Text/Text.mjs";
+import FlexBasic_default from "../../Flex/FlexBasic.mjs";
+import Text from "../../Text/Text.mjs";
 import { styles } from "../Surface/style.mjs";
 import { styles as styles$1 } from "./style.mjs";
 import { jsx, jsxs } from "react/jsx-runtime";
+import * as stylex from "@stylexjs/stylex";
 import { Minus, TrendingDown, TrendingUp } from "lucide-react";
 //#region src/dashboard/StatCard/StatCard.tsx
 const deltaIcon = {
@@ -13,20 +14,38 @@ const deltaIcon = {
 	flat: Minus,
 	up: TrendingUp
 };
+const deltaStyles = {
+	down: styles$1.deltaDown,
+	flat: styles$1.deltaFlat,
+	up: styles$1.deltaUp
+};
+const textStyles = {
+	hint: {
+		color: cssVar.colorTextTertiary,
+		fontSize: cssVar.fontSizeSM
+	},
+	label: {
+		color: cssVar.colorTextSecondary,
+		fontSize: cssVar.fontSizeSM
+	},
+	metricHint: {
+		color: cssVar.colorText,
+		fontSize: cssVar.fontSize
+	},
+	metricLabel: {
+		color: cssVar.colorText,
+		fontSize: cssVar.fontSize,
+		fontWeight: 500
+	}
+};
 function StatCard({ action, delta, direction = "flat", hint, label, mark, prominent = false, value, wash }) {
-	const deltaClass = {
-		down: styles$1.deltaDown,
-		flat: styles$1.deltaFlat,
-		up: styles$1.deltaUp
-	}[direction];
 	return /* @__PURE__ */ jsx("div", {
-		className: styles$1.lift,
-		children: /* @__PURE__ */ jsx(Block, {
-			className: `${styles$1.root} ${styles.card}${wash ? ` ${styles$1.wash} ${styles$1[wash]}` : ""} ${styles$1.frame}`,
-			variant: "borderless",
+		...stylex.props(styles$1.lift),
+		children: /* @__PURE__ */ jsx(FlexBasic_default, {
+			...stylex.props(styles$1.root, styles.card, wash && [styles$1.wash, styles$1[wash]], styles$1.frame),
 			children: /* @__PURE__ */ jsxs(FlexBasic_default, {
-				className: styles$1.body,
 				gap: prominent ? 0 : 8,
+				...stylex.props(styles$1.body),
 				children: [
 					/* @__PURE__ */ jsxs(FlexBasic_default, {
 						horizontal: true,
@@ -35,16 +54,16 @@ function StatCard({ action, delta, direction = "flat", hint, label, mark, promin
 						children: [/* @__PURE__ */ jsxs(FlexBasic_default, {
 							horizontal: true,
 							align: "center",
-							className: styles$1.copy,
 							gap: 6,
+							...stylex.props(styles$1.copy),
 							children: [/* @__PURE__ */ jsx(Text, {
 								ellipsis: true,
-								className: prominent ? styles$1.metricLabel : styles$1.label,
+								style: prominent ? textStyles.metricLabel : textStyles.label,
 								children: label
 							}), action]
 						}), mark ? /* @__PURE__ */ jsx("span", {
 							"aria-hidden": true,
-							className: styles$1.badge,
+							...stylex.props(styles$1.badge),
 							children: /* @__PURE__ */ jsx(Icon, {
 								icon: mark,
 								size: 14
@@ -52,23 +71,23 @@ function StatCard({ action, delta, direction = "flat", hint, label, mark, promin
 						}) : null]
 					}),
 					/* @__PURE__ */ jsx("div", {
-						className: prominent ? styles$1.metricValue : styles$1.value,
+						...stylex.props(prominent ? styles$1.metricValue : styles$1.value),
 						children: value
 					}),
 					delta || hint ? /* @__PURE__ */ jsxs(FlexBasic_default, {
 						horizontal: true,
 						align: "center",
-						className: prominent ? styles$1.metricFoot : void 0,
 						gap: 8,
 						wrap: "wrap",
+						...stylex.props(prominent && styles$1.metricFoot),
 						children: [delta ? /* @__PURE__ */ jsxs("span", {
-							className: `${styles$1.delta} ${deltaClass}`,
+							...stylex.props(styles$1.delta, deltaStyles[direction]),
 							children: [/* @__PURE__ */ jsx(Icon, {
 								icon: deltaIcon[direction],
 								size: 14
 							}), delta]
 						}) : null, hint ? /* @__PURE__ */ jsx(Text, {
-							className: prominent ? styles$1.metricHint : styles$1.hint,
+							style: prominent ? textStyles.metricHint : textStyles.hint,
 							children: hint
 						}) : null]
 					}) : null

package/es/dashboard/StatCard/StatCard.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"StatCard.mjs","names":["styles","surfaceStyles","Flexbox"],"sources":["../../../src/dashboard/StatCard/StatCard.tsx"],"sourcesContent":["'use client';\n\nimport { Minus, TrendingDown, TrendingUp } from 'lucide-react';\n\nimport Text from '@/base-ui/Text';\nimport Block from '@/Block';\nimport { Flexbox } from '@/Flex';\nimport Icon from '@/Icon';\n\nimport { styles as surfaceStyles } from '../Surface/style';\nimport { styles } from './style';\nimport type { StatCardProps, StatDirection } from './type';\n\nconst deltaIcon = {\n  down: TrendingDown,\n  flat: Minus,\n  up: TrendingUp,\n} satisfies Record<StatDirection, typeof Minus>;\n\nfunction StatCard({\n  action,\n  delta,\n  direction = 'flat',\n  hint,\n  label,\n  mark,\n  prominent = false,\n  value,\n  wash,\n}: StatCardProps) {\n  const deltaClass = {\n    down: styles.deltaDown,\n    flat: styles.deltaFlat,\n    up: styles.deltaUp,\n  }[direction];\n\n  return (\n    <div className={styles.lift}>\n      <Block\n        className={`${styles.root} ${surfaceStyles.card}${wash ? ` ${styles.wash} ${styles[wash]}` : ''} ${styles.frame}`}\n        variant=\"borderless\"\n      >\n        <Flexbox className={styles.body} gap={prominent ? 0 : 8}>\n          <Flexbox horizontal align=\"center\" justify=\"space-between\">\n            <Flexbox horizontal align=\"center\" className={styles.copy} gap={6}>\n              <Text ellipsis className={prominent ? styles.metricLabel : styles.label}>\n                {label}\n              </Text>\n              {action}\n            </Flexbox>\n            {mark ? (\n              <span aria-hidden className={styles.badge}>\n                <Icon icon={mark} size={14} />\n              </span>\n            ) : null}\n          </Flexbox>\n          <div className={prominent ? styles.metricValue : styles.value}>{value}</div>\n          {delta || hint ? (\n            <Flexbox\n              horizontal\n              align=\"center\"\n              className={prominent ? styles.metricFoot : undefined}\n              gap={8}\n              wrap=\"wrap\"\n            >\n              {delta ? (\n                <span className={`${styles.delta} ${deltaClass}`}>\n                  <Icon icon={deltaIcon[direction]} size={14} />\n                  {delta}\n                </span>\n              ) : null}\n              {hint ? (\n                <Text className={prominent ? styles.metricHint : styles.hint}>{hint}</Text>\n              ) : null}\n            </Flexbox>\n          ) : null}\n        </Flexbox>\n      </Block>\n    </div>\n  );\n}\n\nStatCard.displayName = 'StatCard';\n\nexport default StatCard;\n"],"mappings":";;;;;;;;;;AAaA,MAAM,YAAY;CAChB,MAAM;CACN,MAAM;CACN,IAAI;AACN;AAEA,SAAS,SAAS,EAChB,QACA,OACA,YAAY,QACZ,MACA,OACA,MACA,YAAY,OACZ,OACA,QACgB;CAChB,MAAM,aAAa;EACjB,MAAMA,SAAO;EACb,MAAMA,SAAO;EACb,IAAIA,SAAO;CACb,EAAE;CAEF,OACE,oBAAC,OAAD;EAAK,WAAWA,SAAO;EACrB,UAAA,oBAAC,OAAD;GACE,WAAW,GAAGA,SAAO,KAAK,GAAGC,OAAc,OAAO,OAAO,IAAID,SAAO,KAAK,GAAGA,SAAO,UAAU,GAAG,GAAGA,SAAO;GAC1G,SAAQ;GAER,UAAA,qBAACE,mBAAD;IAAS,WAAWF,SAAO;IAAM,KAAK,YAAY,IAAI;IAAtD,UAAA;KACE,qBAACE,mBAAD;MAAS,YAAA;MAAW,OAAM;MAAS,SAAQ;MAA3C,UAAA,CACE,qBAACA,mBAAD;OAAS,YAAA;OAAW,OAAM;OAAS,WAAWF,SAAO;OAAM,KAAK;OAAhE,UAAA,CACE,oBAAC,MAAD;QAAM,UAAA;QAAS,WAAW,YAAYA,SAAO,cAAcA,SAAO;QAC/D,UAAA;OACG,CAAA,GACL,MACM;MACR,CAAA,GAAA,OACC,oBAAC,QAAD;OAAM,eAAA;OAAY,WAAWA,SAAO;OAClC,UAAA,oBAAC,MAAD;QAAM,MAAM;QAAM,MAAM;OAAK,CAAA;MACzB,CAAA,IACJ,IACG;;KACT,oBAAC,OAAD;MAAK,WAAW,YAAYA,SAAO,cAAcA,SAAO;MAAQ,UAAA;KAAW,CAAA;KAC1E,SAAS,OACR,qBAACE,mBAAD;MACE,YAAA;MACA,OAAM;MACN,WAAW,YAAYF,SAAO,aAAa,KAAA;MAC3C,KAAK;MACL,MAAK;MALP,UAAA,CAOG,QACC,qBAAC,QAAD;OAAM,WAAW,GAAGA,SAAO,MAAM,GAAG;OAApC,UAAA,CACE,oBAAC,MAAD;QAAM,MAAM,UAAU;QAAY,MAAM;OAAK,CAAA,GAC5C,KACG;MACJ,CAAA,IAAA,MACH,OACC,oBAAC,MAAD;OAAM,WAAW,YAAYA,SAAO,aAAaA,SAAO;OAAO,UAAA;MAAW,CAAA,IACxE,IACG;KACP,CAAA,IAAA;IACG;;EACJ,CAAA;CACJ,CAAA;AAET;AAEA,SAAS,cAAc"}
+{"version":3,"file":"StatCard.mjs","names":["styles","Flexbox","surfaceStyles"],"sources":["../../../src/dashboard/StatCard/StatCard.tsx"],"sourcesContent":["'use client';\n\nimport * as stylex from '@stylexjs/stylex';\nimport { Minus, TrendingDown, TrendingUp } from 'lucide-react';\n\nimport { Flexbox } from '@/Flex';\nimport Icon from '@/Icon';\nimport { cssVar } from '@/styles/stylex/cssVar.stylex';\nimport Text from '@/Text';\n\nimport { styles as surfaceStyles } from '../Surface/style';\nimport { styles } from './style';\nimport type { StatCardProps, StatDirection } from './type';\n\nconst deltaIcon = {\n  down: TrendingDown,\n  flat: Minus,\n  up: TrendingUp,\n} satisfies Record<StatDirection, typeof Minus>;\n\nconst deltaStyles = {\n  down: styles.deltaDown,\n  flat: styles.deltaFlat,\n  up: styles.deltaUp,\n};\n\nconst textStyles = {\n  hint: { color: cssVar.colorTextTertiary, fontSize: cssVar.fontSizeSM },\n  label: { color: cssVar.colorTextSecondary, fontSize: cssVar.fontSizeSM },\n  metricHint: { color: cssVar.colorText, fontSize: cssVar.fontSize },\n  metricLabel: { color: cssVar.colorText, fontSize: cssVar.fontSize, fontWeight: 500 },\n};\n\nfunction StatCard({\n  action,\n  delta,\n  direction = 'flat',\n  hint,\n  label,\n  mark,\n  prominent = false,\n  value,\n  wash,\n}: StatCardProps) {\n  return (\n    <div {...stylex.props(styles.lift)}>\n      <Flexbox\n        {...stylex.props(\n          styles.root,\n          surfaceStyles.card,\n          wash && [styles.wash, styles[wash]],\n          styles.frame,\n        )}\n      >\n        <Flexbox gap={prominent ? 0 : 8} {...stylex.props(styles.body)}>\n          <Flexbox horizontal align=\"center\" justify=\"space-between\">\n            <Flexbox horizontal align=\"center\" gap={6} {...stylex.props(styles.copy)}>\n              <Text ellipsis style={prominent ? textStyles.metricLabel : textStyles.label}>\n                {label}\n              </Text>\n              {action}\n            </Flexbox>\n            {mark ? (\n              <span aria-hidden {...stylex.props(styles.badge)}>\n                <Icon icon={mark} size={14} />\n              </span>\n            ) : null}\n          </Flexbox>\n          <div {...stylex.props(prominent ? styles.metricValue : styles.value)}>{value}</div>\n          {delta || hint ? (\n            <Flexbox\n              horizontal\n              align=\"center\"\n              gap={8}\n              wrap=\"wrap\"\n              {...stylex.props(prominent && styles.metricFoot)}\n            >\n              {delta ? (\n                <span {...stylex.props(styles.delta, deltaStyles[direction])}>\n                  <Icon icon={deltaIcon[direction]} size={14} />\n                  {delta}\n                </span>\n              ) : null}\n              {hint ? (\n                <Text style={prominent ? textStyles.metricHint : textStyles.hint}>{hint}</Text>\n              ) : null}\n            </Flexbox>\n          ) : null}\n        </Flexbox>\n      </Flexbox>\n    </div>\n  );\n}\n\nStatCard.displayName = 'StatCard';\n\nexport default StatCard;\n"],"mappings":";;;;;;;;;;;AAWA,MAAM,YAAY;CAChB,MAAM;CACN,MAAM;CACN,IAAI;AACN;AACA,MAAM,cAAc;CAClB,MAAMA,SAAO;CACb,MAAMA,SAAO;CACb,IAAIA,SAAO;AACb;AACA,MAAM,aAAa;CACjB,MAAM;EACJ,OAAO,OAAO;EACd,UAAU,OAAO;CACnB;CACA,OAAO;EACL,OAAO,OAAO;EACd,UAAU,OAAO;CACnB;CACA,YAAY;EACV,OAAO,OAAO;EACd,UAAU,OAAO;CACnB;CACA,aAAa;EACX,OAAO,OAAO;EACd,UAAU,OAAO;EACjB,YAAY;CACd;AACF;AACA,SAAS,SAAS,EAChB,QACA,OACA,YAAY,QACZ,MACA,OACA,MACA,YAAY,OACZ,OACA,QACgB;CAChB,OAAO,oBAAC,OAAD;EAAK,GAAI,OAAO,MAAMA,SAAO,IAAI;EACpC,UAAA,oBAACC,mBAAD;GAAS,GAAI,OAAO,MAAMD,SAAO,MAAME,OAAc,MAAM,QAAQ,CAACF,SAAO,MAAMA,SAAO,KAAK,GAAGA,SAAO,KAAK;GAC1G,UAAA,qBAACC,mBAAD;IAAS,KAAK,YAAY,IAAI;IAAG,GAAI,OAAO,MAAMD,SAAO,IAAI;IAA7D,UAAA;KACE,qBAACC,mBAAD;MAAS,YAAA;MAAW,OAAM;MAAS,SAAQ;MAA3C,UAAA,CACE,qBAACA,mBAAD;OAAS,YAAA;OAAW,OAAM;OAAS,KAAK;OAAG,GAAI,OAAO,MAAMD,SAAO,IAAI;OAAvE,UAAA,CACE,oBAAC,MAAD;QAAM,UAAA;QAAS,OAAO,YAAY,WAAW,cAAc,WAAW;QACnE,UAAA;OACG,CAAA,GACL,MACM;MACR,CAAA,GAAA,OAAO,oBAAC,QAAD;OAAM,eAAA;OAAY,GAAI,OAAO,MAAMA,SAAO,KAAK;OACnD,UAAA,oBAAC,MAAD;QAAM,MAAM;QAAM,MAAM;OAAK,CAAA;MACzB,CAAA,IAAI,IACL;;KACT,oBAAC,OAAD;MAAK,GAAI,OAAO,MAAM,YAAYA,SAAO,cAAcA,SAAO,KAAK;MAAI,UAAA;KAAW,CAAA;KACjF,SAAS,OAAO,qBAACC,mBAAD;MAAS,YAAA;MAAW,OAAM;MAAS,KAAK;MAAG,MAAK;MAAO,GAAI,OAAO,MAAM,aAAaD,SAAO,UAAU;MAAtG,UAAA,CACZ,QAAQ,qBAAC,QAAD;OAAM,GAAI,OAAO,MAAMA,SAAO,OAAO,YAAY,UAAU;OAA3D,UAAA,CACL,oBAAC,MAAD;QAAM,MAAM,UAAU;QAAY,MAAM;OAAK,CAAA,GAC5C,KACG;MAAI,CAAA,IAAA,MACX,OAAO,oBAAC,MAAD;OAAM,OAAO,YAAY,WAAW,aAAa,WAAW;OAAO,UAAA;MAAW,CAAA,IAAI,IACnF;KAAI,CAAA,IAAA;IACR;;EACF,CAAA;CACN,CAAA;AACT;AACA,SAAS,cAAc"}

package/es/dashboard/StatCard/style.mjs

@@ -1,134 +1,104 @@
-import { createStaticStyles } from "antd-style";
 //#region src/dashboard/StatCard/style.ts
-const styles = createStaticStyles(({ css, cssVar, responsive }) => ({
-	badge: css`
-    display: inline-flex;
-    flex: none;
-    align-items: center;
-    justify-content: center;
-
-    inline-size: 24px;
-    block-size: 24px;
-    border: 1px solid ${cssVar.colorFillSecondary};
-    border-radius: ${cssVar.borderRadiusSM};
-
-    color: ${cssVar.colorTextTertiary};
-
-    background: ${cssVar.colorFillTertiary};
-  `,
-	body: css`
-    position: relative;
-    z-index: 1;
-  `,
-	copy: css`
-    flex-wrap: nowrap;
-    min-inline-size: 0;
-  `,
-	delta: css`
-    display: inline-flex;
-    gap: 2px;
-    align-items: center;
-
-    font-size: ${cssVar.fontSizeSM};
-    font-variant-numeric: tabular-nums;
-  `,
-	deltaDown: css`
-    color: ${cssVar.colorError};
-  `,
-	deltaFlat: css`
-    color: ${cssVar.colorTextTertiary};
-  `,
-	deltaUp: css`
-    color: ${cssVar.colorSuccess};
-  `,
-	frame: css`
-    &&& {
-      border-color: ${cssVar.colorBorderSecondary};
-    }
-  `,
-	gray: css`
-    &::before {
-      background: linear-gradient(
-        to bottom,
-        ${cssVar.colorBgElevated} 0%,
-        color-mix(in srgb, ${cssVar.colorText} 4%, ${cssVar.colorBgElevated}) 100%
-      );
-    }
-  `,
-	hint: css`
-    font-size: ${cssVar.fontSizeSM};
-    color: ${cssVar.colorTextTertiary};
-  `,
-	label: css`
-    font-size: ${cssVar.fontSizeSM};
-    color: ${cssVar.colorTextSecondary};
-  `,
-	lift: css`
-    display: flex;
-    min-inline-size: 0;
-    border-radius: ${cssVar.borderRadiusLG};
-    box-shadow: ${cssVar.boxShadowTertiary};
-  `,
-	metricFoot: css`
-    margin-block-start: 14px;
-  `,
-	metricHint: css`
-    && {
-      font-size: ${cssVar.fontSize};
-      color: ${cssVar.colorText};
-    }
-  `,
-	metricLabel: css`
-    && {
-      font-size: ${cssVar.fontSize};
-      font-weight: 500;
-      color: ${cssVar.colorText};
-    }
-  `,
-	metricValue: css`
-    && {
-      margin-block-start: 6px;
-
-      font-size: ${cssVar.fontSizeHeading2};
-      font-weight: 700;
-      font-variant-numeric: tabular-nums;
-      line-height: 1.05;
-      color: ${cssVar.colorText};
-    }
-  `,
-	root: css`
-    position: relative;
-
-    overflow: hidden;
-    flex: 1;
-
-    min-inline-size: 0;
-    padding: 16px;
-  `,
-	value: css`
-    font-size: ${cssVar.fontSizeHeading2};
-    font-weight: 600;
-    font-variant-numeric: tabular-nums;
-    line-height: 1.2;
-    color: ${cssVar.colorText};
-
-    ${responsive.mobile} {
-      font-size: ${cssVar.fontSizeHeading3};
-    }
-  `,
-	wash: css`
-    isolation: isolate;
-
-    &::before {
-      pointer-events: none;
-      content: '';
-
-      position: absolute;
-      z-index: 0;
-      inset: 0;
-    }
-  `
-}));
+const styles = {
+	badge: {
+		kVAM5u: "lb6d5vuu",
+		kaIpWk: "lb1vihcfj",
+		ksu8eU: "lb1y0btm7",
+		kMzoRj: "lbmkeg23",
+		kUk6DE: "lb1okw0bk",
+		kGNEyG: "lb6s0dn4",
+		kWkggS: "lbaljia1",
+		kZKoxP: "lbxk0z11",
+		kMwMTN: "lb53gy9q",
+		k1xSpc: "lb3nfvp2",
+		kzqmXN: "lbvy4d1p",
+		kjj79g: "lbl56j7k",
+		$$css: true
+	},
+	body: {
+		kVAEAm: "lb1n2onr6",
+		kY2c9j: "lb1vjfegm",
+		$$css: true
+	},
+	copy: {
+		kwnvtZ: "lbozqiw3",
+		k7Eaqz: "lbeuugli",
+		$$css: true
+	},
+	delta: {
+		kOIVth: "lb195vfkc",
+		kGNEyG: "lb6s0dn4",
+		k1xSpc: "lb3nfvp2",
+		kGuDYH: "lbxobqjj",
+		kcqcaj: "lbss6m8b",
+		$$css: true
+	},
+	deltaDown: {
+		kMwMTN: "lb12ap7uz",
+		$$css: true
+	},
+	deltaFlat: {
+		kMwMTN: "lb53gy9q",
+		$$css: true
+	},
+	deltaUp: {
+		kMwMTN: "lbs9y9h1",
+		$$css: true
+	},
+	frame: {
+		kVAM5u: "lb10cypdb",
+		$$css: true
+	},
+	gray: {
+		k3DiCg: "lbskafm8",
+		$$css: true
+	},
+	lift: {
+		kaIpWk: "lb1ndkxwp",
+		kGVxlE: "lb1c4gvbl",
+		k1xSpc: "lb78zum5",
+		k7Eaqz: "lbeuugli",
+		$$css: true
+	},
+	metricFoot: {
+		keoZOQ: "lb1hmvnq2",
+		$$css: true
+	},
+	metricValue: {
+		kMwMTN: "lb66ogz0",
+		kGuDYH: "lb1j9mzhl",
+		kcqcaj: "lbss6m8b",
+		k63SB2: "lb1xlr1w8",
+		kLWn49: "lb1f41ap9",
+		keoZOQ: "lb1k70j0n",
+		$$css: true
+	},
+	root: {
+		kmVPX3: "lb1tamke2",
+		kUk6DE: "lb98rzlu",
+		kVQacm: "lbb3r6kr",
+		k7Eaqz: "lbeuugli",
+		kVAEAm: "lb1n2onr6",
+		$$css: true
+	},
+	value: {
+		kMwMTN: "lb66ogz0",
+		kGuDYH: "lb1j9mzhl lb1nfhhgm",
+		kcqcaj: "lbss6m8b",
+		k63SB2: "lb1s688f",
+		kLWn49: "lb1u7k74",
+		$$css: true
+	},
+	wash: {
+		kHBbk8: "lbc8icb0",
+		kFcpXp: "lbxx281p",
+		kgeoSG: "lb1cpjm7i",
+		km8f2m: "lbkk1bqk",
+		kEoFBp: "lb1hmns74",
+		kxmVGU: "lb2hztxu",
+		$$css: true
+	}
+};
 //#endregion
 export { styles };
 

package/es/dashboard/StatCard/style.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/dashboard/StatCard/style.ts"],"sourcesContent":["import { createStaticStyles } from 'antd-style';\n\nexport const styles = createStaticStyles(({ css, cssVar, responsive }) => ({\n  badge: css`\n    display: inline-flex;\n    flex: none;\n    align-items: center;\n    justify-content: center;\n\n    inline-size: 24px;\n    block-size: 24px;\n    border: 1px solid ${cssVar.colorFillSecondary};\n    border-radius: ${cssVar.borderRadiusSM};\n\n    color: ${cssVar.colorTextTertiary};\n\n    background: ${cssVar.colorFillTertiary};\n  `,\n  body: css`\n    position: relative;\n    z-index: 1;\n  `,\n  copy: css`\n    flex-wrap: nowrap;\n    min-inline-size: 0;\n  `,\n  delta: css`\n    display: inline-flex;\n    gap: 2px;\n    align-items: center;\n\n    font-size: ${cssVar.fontSizeSM};\n    font-variant-numeric: tabular-nums;\n  `,\n  deltaDown: css`\n    color: ${cssVar.colorError};\n  `,\n  deltaFlat: css`\n    color: ${cssVar.colorTextTertiary};\n  `,\n  deltaUp: css`\n    color: ${cssVar.colorSuccess};\n  `,\n  frame: css`\n    &&& {\n      border-color: ${cssVar.colorBorderSecondary};\n    }\n  `,\n  gray: css`\n    &::before {\n      background: linear-gradient(\n        to bottom,\n        ${cssVar.colorBgElevated} 0%,\n        color-mix(in srgb, ${cssVar.colorText} 4%, ${cssVar.colorBgElevated}) 100%\n      );\n    }\n  `,\n  hint: css`\n    font-size: ${cssVar.fontSizeSM};\n    color: ${cssVar.colorTextTertiary};\n  `,\n  label: css`\n    font-size: ${cssVar.fontSizeSM};\n    color: ${cssVar.colorTextSecondary};\n  `,\n  lift: css`\n    display: flex;\n    min-inline-size: 0;\n    border-radius: ${cssVar.borderRadiusLG};\n    box-shadow: ${cssVar.boxShadowTertiary};\n  `,\n  metricFoot: css`\n    margin-block-start: 14px;\n  `,\n  metricHint: css`\n    && {\n      font-size: ${cssVar.fontSize};\n      color: ${cssVar.colorText};\n    }\n  `,\n  metricLabel: css`\n    && {\n      font-size: ${cssVar.fontSize};\n      font-weight: 500;\n      color: ${cssVar.colorText};\n    }\n  `,\n  metricValue: css`\n    && {\n      margin-block-start: 6px;\n\n      font-size: ${cssVar.fontSizeHeading2};\n      font-weight: 700;\n      font-variant-numeric: tabular-nums;\n      line-height: 1.05;\n      color: ${cssVar.colorText};\n    }\n  `,\n  root: css`\n    position: relative;\n\n    overflow: hidden;\n    flex: 1;\n\n    min-inline-size: 0;\n    padding: 16px;\n  `,\n  value: css`\n    font-size: ${cssVar.fontSizeHeading2};\n    font-weight: 600;\n    font-variant-numeric: tabular-nums;\n    line-height: 1.2;\n    color: ${cssVar.colorText};\n\n    ${responsive.mobile} {\n      font-size: ${cssVar.fontSizeHeading3};\n    }\n  `,\n  wash: css`\n    isolation: isolate;\n\n    &::before {\n      pointer-events: none;\n      content: '';\n\n      position: absolute;\n      z-index: 0;\n      inset: 0;\n    }\n  `,\n}));\n"],"mappings":";;AAEA,MAAa,SAAS,oBAAoB,EAAE,KAAK,QAAQ,kBAAkB;CACzE,OAAO,GAAG;;;;;;;;wBAQY,OAAO,mBAAmB;qBAC7B,OAAO,eAAe;;aAE9B,OAAO,kBAAkB;;kBAEpB,OAAO,kBAAkB;;CAEzC,MAAM,GAAG;;;;CAIT,MAAM,GAAG;;;;CAIT,OAAO,GAAG;;;;;iBAKK,OAAO,WAAW;;;CAGjC,WAAW,GAAG;aACH,OAAO,WAAW;;CAE7B,WAAW,GAAG;aACH,OAAO,kBAAkB;;CAEpC,SAAS,GAAG;aACD,OAAO,aAAa;;CAE/B,OAAO,GAAG;;sBAEU,OAAO,qBAAqB;;;CAGhD,MAAM,GAAG;;;;UAID,OAAO,gBAAgB;6BACJ,OAAO,UAAU,OAAO,OAAO,gBAAgB;;;;CAI1E,MAAM,GAAG;iBACM,OAAO,WAAW;aACtB,OAAO,kBAAkB;;CAEpC,OAAO,GAAG;iBACK,OAAO,WAAW;aACtB,OAAO,mBAAmB;;CAErC,MAAM,GAAG;;;qBAGU,OAAO,eAAe;kBACzB,OAAO,kBAAkB;;CAEzC,YAAY,GAAG;;;CAGf,YAAY,GAAG;;mBAEE,OAAO,SAAS;eACpB,OAAO,UAAU;;;CAG9B,aAAa,GAAG;;mBAEC,OAAO,SAAS;;eAEpB,OAAO,UAAU;;;CAG9B,aAAa,GAAG;;;;mBAIC,OAAO,iBAAiB;;;;eAI5B,OAAO,UAAU;;;CAG9B,MAAM,GAAG;;;;;;;;;CAST,OAAO,GAAG;iBACK,OAAO,iBAAiB;;;;aAI5B,OAAO,UAAU;;MAExB,WAAW,OAAO;mBACL,OAAO,iBAAiB;;;CAGzC,MAAM,GAAG;;;;;;;;;;;;AAYX,EAAE"}
+{"version":3,"file":"style.mjs","names":[],"sources":["../../../src/dashboard/StatCard/style.ts"],"sourcesContent":["import * as stylex from '@stylexjs/stylex';\n\nimport { cssVar } from '@/styles/stylex/cssVar.stylex';\nimport { media } from '@/styles/stylex/media.stylex';\n\nexport const styles = stylex.create({\n  badge: {\n    borderColor: cssVar.colorFillSecondary,\n    borderRadius: cssVar.borderRadiusSM,\n    borderStyle: 'solid',\n    borderWidth: 1,\n    flex: 'none',\n    alignItems: 'center',\n    backgroundColor: cssVar.colorFillTertiary,\n    blockSize: 24,\n    color: cssVar.colorTextTertiary,\n    display: 'inline-flex',\n    inlineSize: 24,\n    justifyContent: 'center',\n  },\n  body: {\n    position: 'relative',\n    zIndex: 1,\n  },\n  copy: {\n    flexWrap: 'nowrap',\n    minInlineSize: 0,\n  },\n  delta: {\n    gap: 2,\n    alignItems: 'center',\n    display: 'inline-flex',\n    fontSize: cssVar.fontSizeSM,\n    fontVariantNumeric: 'tabular-nums',\n  },\n  deltaDown: {\n    color: cssVar.colorError,\n  },\n  deltaFlat: {\n    color: cssVar.colorTextTertiary,\n  },\n  deltaUp: {\n    color: cssVar.colorSuccess,\n  },\n  frame: {\n    borderColor: cssVar.colorBorderSecondary,\n  },\n  gray: {\n    '::before': {\n      backgroundImage: `linear-gradient(to bottom, ${cssVar.colorBgElevated} 0%, color-mix(in srgb, ${cssVar.colorText} 4%, ${cssVar.colorBgElevated}) 100%)`,\n    },\n  },\n  lift: {\n    borderRadius: cssVar.borderRadiusLG,\n    boxShadow: cssVar.boxShadowTertiary,\n    display: 'flex',\n    minInlineSize: 0,\n  },\n  metricFoot: {\n    marginBlockStart: 14,\n  },\n  metricValue: {\n    color: cssVar.colorText,\n    fontSize: cssVar.fontSizeHeading2,\n    fontVariantNumeric: 'tabular-nums',\n    fontWeight: 700,\n    lineHeight: 1.05,\n    marginBlockStart: 6,\n  },\n  root: {\n    padding: 16,\n    flex: '1',\n    overflow: 'hidden',\n    minInlineSize: 0,\n    position: 'relative',\n  },\n  value: {\n    color: cssVar.colorText,\n    fontSize: { default: cssVar.fontSizeHeading2, [media.mobile]: cssVar.fontSizeHeading3 },\n    fontVariantNumeric: 'tabular-nums',\n    fontWeight: 600,\n    lineHeight: 1.2,\n  },\n  wash: {\n    'isolation': 'isolate',\n    '::before': {\n      inset: 0,\n      content: '\"\"',\n      pointerEvents: 'none',\n      position: 'absolute',\n      zIndex: 0,\n    },\n  },\n});\n"],"mappings":";AAKA,MAAa,SAAS;CACpB,OAAO;EACL,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,MAAM;EACJ,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,MAAM;EACJ,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,OAAO;EACL,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,WAAW;EACT,QAAQ;EACR,OAAO;CACT;CACA,WAAW;EACT,QAAQ;EACR,OAAO;CACT;CACA,SAAS;EACP,QAAQ;EACR,OAAO;CACT;CACA,OAAO;EACL,QAAQ;EACR,OAAO;CACT;CACA,MAAM;EACJ,QAAQ;EACR,OAAO;CACT;CACA,MAAM;EACJ,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,YAAY;EACV,QAAQ;EACR,OAAO;CACT;CACA,aAAa;EACX,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,MAAM;EACJ,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,OAAO;EACL,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;CACA,MAAM;EACJ,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,QAAQ;EACR,OAAO;CACT;AACF"}

package/es/dashboard/StatCard/type.d.mts

@@ -2,10 +2,10 @@ import { IconProps } from "../../Icon/type.mjs";
 import "../../Icon/index.mjs";
 import { ReactNode } from "react";
 //#region src/dashboard/StatCard/type.d.ts
-type StatDirection = 'up' | 'down' | 'flat';
+export type StatDirection = 'up' | 'down' | 'flat';
 /** Top-to-bottom gray wash. Decorative color fields stay in the app. */
-type StatWash = 'gray';
-interface StatCardProps {
+export type StatWash = 'gray';
+export interface StatCardProps {
   /** Control rendered on the label row, such as a menu. */
   action?: ReactNode;
   /** Change amount, colored by `direction`. */
@@ -22,5 +22,4 @@ interface StatCardProps {
   wash?: StatWash;
 }
 //#endregion
-export { StatCardProps, StatDirection, StatWash };
 //# sourceMappingURL=type.d.mts.map