@veracity/vui 4.1.0 → 5.0.0-alpha.0

package/dist/notification/notificationIcon.js.map

@@ -1 +1 @@
-{"version":3,"file":"notificationIcon.js","names":[],"sources":["../../src/notification/notificationIcon.tsx"],"sourcesContent":["import { useStyleConfig, vui } from '../core'\nimport type { IconProps } from '../icon'\nimport Icon from '../icon'\nimport { cs } from '../utils'\nimport { notificationStatusMapping } from './consts'\nimport { useNotificationContext } from './context'\n\n/** Displays an icon based on the status within the Notification. */\nexport const NotificationIcon = vui<'svg', IconProps>((props, ref) => {\n  const { className, alignSelf, ...rest } = props\n  const mergedProps = { ...useNotificationContext(), ...props }\n  const styles = useStyleConfig('Notification', useNotificationContext())\n\n  const { status = '' } = mergedProps\n  const { iconProps } = notificationStatusMapping[status] ?? {}\n\n  const marginTop = alignSelf === 'center' ? '0' : '16px'\n\n  return (\n    <Icon\n      alignSelf={alignSelf}\n      className={cs('vui-notificationIcon', className)}\n      ml=\"16px\"\n      mt={marginTop}\n      ref={ref}\n      size=\"md\"\n      variant=\"loading\"\n      {...styles.icon}\n      {...iconProps}\n      {...rest}\n    />\n  )\n})\n\nNotificationIcon.displayName = 'NotificationIcon'\n\nexport default NotificationIcon\n"],"mappings":";;;;;;;;;;AAQA,MAAa,mBAAmB,KAAuB,OAAO,QAAQ;CACpE,MAAM,EAAE,WAAW,WAAW,GAAG,SAAS;CAC1C,MAAM,cAAc;EAAE,GAAG,wBAAwB;EAAE,GAAG;EAAO;CAC7D,MAAM,SAAS,eAAe,gBAAgB,wBAAwB,CAAC;CAEvE,MAAM,EAAE,SAAS,OAAO;CACxB,MAAM,EAAE,cAAc,0BAA0B,WAAW,EAAE;CAE7D,MAAM,YAAY,cAAc,WAAW,MAAM;AAEjD,QACE,oBAAC;EACY;EACX,WAAW,GAAG,wBAAwB,UAAU;EAChD,IAAG;EACH,IAAI;EACC;EACL,MAAK;EACL,SAAQ;EACR,GAAI,OAAO;EACX,GAAI;EACJ,GAAI;GACJ;EAEJ;AAEF,iBAAiB,cAAc"}
+{"version":3,"file":"notificationIcon.js","names":[],"sources":["../../src/notification/notificationIcon.tsx"],"sourcesContent":["import { useStyleConfig, vui } from '../core'\nimport type { IconProps } from '../icon'\nimport Icon from '../icon'\nimport { cs } from '../utils'\nimport { notificationStatusMapping, INTENT_ICON_MAP, LOADING_ICON_PROPS } from './consts'\nimport { useNotificationContext } from './context'\n\n/** Displays an icon based on the status or intent within the Notification. */\nexport const NotificationIcon = vui<'svg', IconProps>((props, ref) => {\n  const { className, alignSelf, ...rest } = props\n  const mergedProps = { ...useNotificationContext(), ...props }\n  const styles = useStyleConfig('Notification', useNotificationContext())\n\n  const { status = '', statusMapping, intent, isLoading } = mergedProps\n\n  const resolvedIconProps = isLoading\n    ? LOADING_ICON_PROPS\n    : ({ ...notificationStatusMapping, ...statusMapping }[status]?.iconProps ??\n      (intent ? INTENT_ICON_MAP[intent] : undefined))\n\n  return (\n    <Icon\n      alignSelf={alignSelf}\n      className={cs('vui-notificationIcon', className)}\n      ref={ref}\n      size=\"md\"\n      variant=\"loading\"\n      {...styles.icon}\n      mt={alignSelf === 'center' ? 0 : styles.icon?.mt}\n      {...resolvedIconProps}\n      {...rest}\n    />\n  )\n})\n\nNotificationIcon.displayName = 'NotificationIcon'\n\nexport default NotificationIcon\n"],"mappings":";;;;;;;;;;AAQA,MAAa,mBAAmB,KAAuB,OAAO,QAAQ;CACpE,MAAM,EAAE,WAAW,WAAW,GAAG,SAAS;CAC1C,MAAM,cAAc;EAAE,GAAG,wBAAwB;EAAE,GAAG;EAAO;CAC7D,MAAM,SAAS,eAAe,gBAAgB,wBAAwB,CAAC;CAEvE,MAAM,EAAE,SAAS,IAAI,eAAe,QAAQ,cAAc;CAE1D,MAAM,oBAAoB,YACtB,qBACC;EAAE,GAAG;EAA2B,GAAG;EAAe,CAAC,SAAS,cAC5D,SAAS,gBAAgB,UAAU;AAExC,QACE,oBAAC;EACY;EACX,WAAW,GAAG,wBAAwB,UAAU;EAC3C;EACL,MAAK;EACL,SAAQ;EACR,GAAI,OAAO;EACX,IAAI,cAAc,WAAW,IAAI,OAAO,MAAM;EAC9C,GAAI;EACJ,GAAI;GACJ;EAEJ;AAEF,iBAAiB,cAAc"}

package/dist/notification/notificationText.js

@@ -12,11 +12,6 @@ const NotificationText = vui((props, ref) => {
 	const styles = useStyleConfig("Notification", useNotificationContext());
 	return /* @__PURE__ */ jsx(T, {
 		className: cs("vui-notificationText", className),
-		flex: "1",
-		lineHeight: "24px",
-		minW: 0,
-		mx: "16px",
-		my: "16px",
 		ref,
 		...styles.text,
 		...rest
@@ -26,5 +21,5 @@ NotificationText.displayName = "NotificationText";
 
 //#endregion
 export { NotificationText as default };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.0"
 //# sourceMappingURL=notificationText.js.map

package/dist/notification/notificationText.js.map

@@ -1 +1 @@
-{"version":3,"file":"notificationText.js","names":[],"sources":["../../src/notification/notificationText.tsx"],"sourcesContent":["import { useStyleConfig, vui } from '../core'\nimport type { TProps } from '../t'\nimport T from '../t'\nimport { cs } from '../utils'\nimport { useNotificationContext } from './context'\n\n/** Displays text within the Notification. */\nexport const NotificationText = vui<'p', TProps>((props, ref) => {\n  const { className, ...rest } = props\n  const styles = useStyleConfig('Notification', useNotificationContext())\n\n  return (\n    <T\n      className={cs('vui-notificationText', className)}\n      flex=\"1\"\n      lineHeight=\"24px\"\n      minW={0}\n      mx=\"16px\"\n      my=\"16px\"\n      ref={ref}\n      {...styles.text}\n      {...rest}\n    />\n  )\n})\n\nNotificationText.displayName = 'NotificationText'\nexport default NotificationText\n"],"mappings":";;;;;;;;;AAOA,MAAa,mBAAmB,KAAkB,OAAO,QAAQ;CAC/D,MAAM,EAAE,WAAW,GAAG,SAAS;CAC/B,MAAM,SAAS,eAAe,gBAAgB,wBAAwB,CAAC;AAEvE,QACE,oBAAC;EACC,WAAW,GAAG,wBAAwB,UAAU;EAChD,MAAK;EACL,YAAW;EACX,MAAM;EACN,IAAG;EACH,IAAG;EACE;EACL,GAAI,OAAO;EACX,GAAI;GACJ;EAEJ;AAEF,iBAAiB,cAAc"}
+{"version":3,"file":"notificationText.js","names":[],"sources":["../../src/notification/notificationText.tsx"],"sourcesContent":["import { useStyleConfig, vui } from '../core'\nimport type { TProps } from '../t'\nimport T from '../t'\nimport { cs } from '../utils'\nimport { useNotificationContext } from './context'\n\n/** Displays text within the Notification. */\nexport const NotificationText = vui<'p', TProps>((props, ref) => {\n  const { className, ...rest } = props\n  const styles = useStyleConfig('Notification', useNotificationContext())\n\n  return <T className={cs('vui-notificationText', className)} ref={ref} {...styles.text} {...rest} />\n})\n\nNotificationText.displayName = 'NotificationText'\nexport default NotificationText\n"],"mappings":";;;;;;;;;AAOA,MAAa,mBAAmB,KAAkB,OAAO,QAAQ;CAC/D,MAAM,EAAE,WAAW,GAAG,SAAS;CAC/B,MAAM,SAAS,eAAe,gBAAgB,wBAAwB,CAAC;AAEvE,QAAO,oBAAC;EAAE,WAAW,GAAG,wBAAwB,UAAU;EAAO;EAAK,GAAI,OAAO;EAAM,GAAI;GAAQ;EACnG;AAEF,iBAAiB,cAAc"}

package/dist/notification/notificationTitle.js

@@ -22,5 +22,5 @@ NotificationTitle.displayName = "NotificationTitle";
 
 //#endregion
 export { NotificationTitle as default };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.0"
 //# sourceMappingURL=notificationTitle.js.map

package/dist/notification/theme.js

@@ -1,65 +1,111 @@
 //#region src/notification/theme.ts
-const baseStyle = {};
-const defaultProps = { variant: "subtleBlue" };
+/** Token references per semantic intent. */
+const intentTokens = {
+	info: {
+		feedbackSubtle: "var(--vui-feedback-info-subtle)",
+		feedbackSolid: "var(--vui-feedback-info-solid)",
+		dismissColor: "var(--vui-feedback-info-solid)",
+		actionSolid: "var(--vui-action-brand-solid)",
+		actionSolidInverse: "var(--vui-action-brand-solid-inverse)",
+		actionSolidHover: "var(--vui-action-brand-solid-hover)",
+		actionSolidPressed: "var(--vui-action-brand-solid-pressed)"
+	},
+	danger: {
+		feedbackSubtle: "var(--vui-feedback-danger-subtle)",
+		feedbackSolid: "var(--vui-feedback-danger-solid)",
+		dismissColor: "var(--vui-feedback-danger-solid)",
+		actionSolid: "var(--vui-action-danger-solid)",
+		actionSolidInverse: "var(--vui-action-danger-solid-inverse)",
+		actionSolidHover: "var(--vui-action-danger-solid-hover)",
+		actionSolidPressed: "var(--vui-action-danger-solid-pressed)"
+	},
+	warning: {
+		feedbackSubtle: "var(--vui-feedback-warning-subtle)",
+		feedbackSolid: "var(--vui-feedback-warning-solid)",
+		dismissColor: "var(--vui-feedback-warning-solid)",
+		actionSolid: "var(--vui-action-yellow-solid)",
+		actionSolidInverse: "var(--vui-action-yellow-solid-inverse)",
+		actionSolidHover: "var(--vui-action-yellow-solid-hover)",
+		actionSolidPressed: "var(--vui-action-yellow-solid-pressed)"
+	},
+	success: {
+		feedbackSubtle: "var(--vui-feedback-success-subtle)",
+		feedbackSolid: "var(--vui-feedback-success-solid)",
+		dismissColor: "var(--vui-action-success-subtle-inverse)",
+		actionSolid: "var(--vui-action-success-solid)",
+		actionSolidInverse: "var(--vui-action-success-solid-inverse)",
+		actionSolidHover: "var(--vui-action-success-solid-hover)",
+		actionSolidPressed: "var(--vui-action-success-solid-pressed)"
+	}
+};
+/** Variant styles per visual hierarchy, composed from intent tokens. */
+const hierarchyRules = { inline: (t) => ({
+	container: {
+		bg: t.feedbackSubtle,
+		borderColor: t.feedbackSolid,
+		color: t.feedbackSolid,
+		"--vui-dismiss-fg": t.dismissColor
+	},
+	action: {
+		bg: t.actionSolid,
+		borderColor: t.actionSolid,
+		color: t.actionSolidInverse,
+		hoverBg: t.actionSolidHover,
+		hoverColor: t.actionSolidInverse,
+		activeBg: t.actionSolidPressed,
+		activeColor: t.actionSolidInverse
+	}
+}) };
+const baseStyle = {
+	container: {
+		borderRadius: "var(--vui-notification-border-radius, 0)",
+		borderWidth: "var(--vui-notification-border-width, 1px)",
+		bg: "var(--vui-feedback-neutral-subtle)",
+		borderColor: "var(--vui-feedback-neutral-solid)",
+		color: "var(--vui-feedback-neutral-solid)"
+	},
+	button: {
+		mt: "var(--vui-notification-button-margin-top, 8px)",
+		mr: "var(--vui-notification-button-margin-right, 8px)",
+		mb: "var(--vui-notification-button-margin-bottom, 0)",
+		ml: "var(--vui-notification-button-margin-left, 0)"
+	},
+	icon: {
+		ml: "var(--vui-notification-icon-margin-left, 16px)",
+		mt: "var(--vui-notification-icon-margin-top, 16px)"
+	},
+	text: {
+		flex: "1",
+		lineHeight: "var(--vui-notification-text-line-height, 24px)",
+		minW: 0,
+		mx: "var(--vui-notification-text-margin-x, 16px)",
+		my: "var(--vui-notification-text-margin-y, 16px)"
+	},
+	actionBox: {
+		my: "var(--vui-notification-action-margin-y, 8px)",
+		mx: "var(--vui-notification-action-margin-x, 8px)"
+	}
+};
 const parts = [
 	"container",
 	"button",
 	"icon",
 	"text",
-	"title"
+	"title",
+	"actionBox",
+	"action"
 ];
 const sizes = {};
+const generatedVariants = Object.fromEntries(Object.entries(intentTokens).flatMap(([intentKey, tokens]) => Object.entries(hierarchyRules).map(([hierarchyKey, buildVariant]) => [`${hierarchyKey}${intentKey.charAt(0).toUpperCase()}${intentKey.slice(1)}`, buildVariant(tokens)])));
 const variants = {
-	subtleBlue: {
-		container: {
-			bg: "skyBlue.95",
-			borderColor: "seaBlue.main",
-			color: "seaBlue.main"
-		},
-		button: { borderColor: "transparent" }
-	},
-	subtleRed: { container: {
-		bg: "energyRed.95",
-		borderColor: "energyRed.45",
-		color: "energyRed.45"
-	} },
-	subtleYellow: { container: {
-		bg: "sunflower.85",
-		borderColor: "sunflower.15",
-		color: "sunflower.15"
-	} },
-	subtleGreen: { container: {
-		bg: "landGreen.95",
-		borderColor: "landGreen.30",
-		color: "landGreen.30"
-	} },
-	bannerBlue: {
-		container: {
-			bg: "skyBlue.95",
-			borderColor: "skyBlue.95",
-			color: "seaBlue.main"
-		},
-		button: { borderColor: "transparent" }
-	},
-	bannerRed: { container: {
-		bg: "energyRed.95",
-		borderColor: "energyRed.95",
-		color: "energyRed.45"
-	} },
-	bannerYellow: { container: {
-		bg: "sunflower.85",
-		borderColor: "sunflower.85",
-		color: "sunflower.15"
-	} },
-	bannerGreen: { container: {
-		bg: "landGreen.95",
-		borderColor: "landGreen.95",
-		color: "landGreen.30"
-	} }
+	...generatedVariants,
+	subtleBlue: generatedVariants.inlineInfo,
+	subtleRed: generatedVariants.inlineDanger,
+	subtleYellow: generatedVariants.inlineWarning,
+	subtleGreen: generatedVariants.inlineSuccess
 };
 var theme_default = {
 	baseStyle,
-	defaultProps,
 	parts,
 	sizes,
 	variants
@@ -67,5 +113,5 @@ var theme_default = {
 
 //#endregion
 export { theme_default as default };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.0"
 //# sourceMappingURL=theme.js.map

package/dist/notification/theme.js.map

@@ -1 +1 @@
-{"version":3,"file":"theme.js","names":[],"sources":["../../src/notification/theme.ts"],"sourcesContent":["const baseStyle = {}\n\nconst defaultProps = {\n  variant: 'subtleBlue',\n}\n\nconst parts = ['container', 'button', 'icon', 'text', 'title']\n\nconst sizes = {}\n\nconst variants = {\n  subtleBlue: {\n    container: {\n      bg: 'skyBlue.95',\n      borderColor: 'seaBlue.main',\n      color: 'seaBlue.main',\n    },\n    button: {\n      borderColor: 'transparent',\n    },\n  },\n  subtleRed: {\n    container: {\n      bg: 'energyRed.95',\n      borderColor: 'energyRed.45',\n      color: 'energyRed.45',\n    },\n  },\n  subtleYellow: {\n    container: {\n      bg: 'sunflower.85',\n      borderColor: 'sunflower.15',\n      color: 'sunflower.15',\n    },\n  },\n  subtleGreen: {\n    container: {\n      bg: 'landGreen.95',\n      borderColor: 'landGreen.30',\n      color: 'landGreen.30',\n    },\n  },\n  bannerBlue: {\n    container: {\n      bg: 'skyBlue.95',\n      borderColor: 'skyBlue.95',\n      color: 'seaBlue.main',\n    },\n    button: {\n      borderColor: 'transparent',\n    },\n  },\n  bannerRed: {\n    container: {\n      bg: 'energyRed.95',\n      borderColor: 'energyRed.95',\n      color: 'energyRed.45',\n    },\n  },\n  bannerYellow: {\n    container: {\n      bg: 'sunflower.85',\n      borderColor: 'sunflower.85',\n      color: 'sunflower.15',\n    },\n  },\n  bannerGreen: {\n    container: {\n      bg: 'landGreen.95',\n      borderColor: 'landGreen.95',\n      color: 'landGreen.30',\n    },\n  },\n}\n\nexport default {\n  baseStyle,\n  defaultProps,\n  parts,\n  sizes,\n  variants,\n}\n"],"mappings":";AAAA,MAAM,YAAY,EAAE;AAEpB,MAAM,eAAe,EACnB,SAAS,cACV;AAED,MAAM,QAAQ;CAAC;CAAa;CAAU;CAAQ;CAAQ;CAAQ;AAE9D,MAAM,QAAQ,EAAE;AAEhB,MAAM,WAAW;CACf,YAAY;EACV,WAAW;GACT,IAAI;GACJ,aAAa;GACb,OAAO;GACR;EACD,QAAQ,EACN,aAAa,eACd;EACF;CACD,WAAW,EACT,WAAW;EACT,IAAI;EACJ,aAAa;EACb,OAAO;EACR,EACF;CACD,cAAc,EACZ,WAAW;EACT,IAAI;EACJ,aAAa;EACb,OAAO;EACR,EACF;CACD,aAAa,EACX,WAAW;EACT,IAAI;EACJ,aAAa;EACb,OAAO;EACR,EACF;CACD,YAAY;EACV,WAAW;GACT,IAAI;GACJ,aAAa;GACb,OAAO;GACR;EACD,QAAQ,EACN,aAAa,eACd;EACF;CACD,WAAW,EACT,WAAW;EACT,IAAI;EACJ,aAAa;EACb,OAAO;EACR,EACF;CACD,cAAc,EACZ,WAAW;EACT,IAAI;EACJ,aAAa;EACb,OAAO;EACR,EACF;CACD,aAAa,EACX,WAAW;EACT,IAAI;EACJ,aAAa;EACb,OAAO;EACR,EACF;CACF;AAED,oBAAe;CACb;CACA;CACA;CACA;CACA;CACD"}
+{"version":3,"file":"theme.js","names":[],"sources":["../../src/notification/theme.ts"],"sourcesContent":["// ---------------------------------------------------------------------------\n// Generated variant approach — mirrors button/theme.ts\n//\n// Each intent defines its token references once.\n// Each hierarchy rule composes container/button/action styles from those tokens.\n// Canonical variants are produced via Object.fromEntries — no hand-written\n// duplication; adding a new intent or hierarchy is a 1-line change.\n// ---------------------------------------------------------------------------\n\ninterface IntentTokens {\n  feedbackSubtle: string // container background\n  feedbackSolid: string // container border + text color\n  dismissColor: string // dismiss button color (usually feedbackSolid; exception: success)\n  actionSolid: string // action button background + border\n  actionSolidInverse: string // action button text\n  actionSolidHover: string\n  actionSolidPressed: string\n}\n\n/** Token references per semantic intent. */\nconst intentTokens: Record<string, IntentTokens> = {\n  info: {\n    feedbackSubtle: 'var(--vui-feedback-info-subtle)',\n    feedbackSolid: 'var(--vui-feedback-info-solid)',\n    dismissColor: 'var(--vui-feedback-info-solid)',\n    actionSolid: 'var(--vui-action-brand-solid)',\n    actionSolidInverse: 'var(--vui-action-brand-solid-inverse)',\n    actionSolidHover: 'var(--vui-action-brand-solid-hover)',\n    actionSolidPressed: 'var(--vui-action-brand-solid-pressed)',\n  },\n  danger: {\n    feedbackSubtle: 'var(--vui-feedback-danger-subtle)',\n    feedbackSolid: 'var(--vui-feedback-danger-solid)',\n    dismissColor: 'var(--vui-feedback-danger-solid)',\n    actionSolid: 'var(--vui-action-danger-solid)',\n    actionSolidInverse: 'var(--vui-action-danger-solid-inverse)',\n    actionSolidHover: 'var(--vui-action-danger-solid-hover)',\n    actionSolidPressed: 'var(--vui-action-danger-solid-pressed)',\n  },\n  warning: {\n    feedbackSubtle: 'var(--vui-feedback-warning-subtle)',\n    feedbackSolid: 'var(--vui-feedback-warning-solid)',\n    dismissColor: 'var(--vui-feedback-warning-solid)',\n    actionSolid: 'var(--vui-action-yellow-solid)',\n    actionSolidInverse: 'var(--vui-action-yellow-solid-inverse)',\n    actionSolidHover: 'var(--vui-action-yellow-solid-hover)',\n    actionSolidPressed: 'var(--vui-action-yellow-solid-pressed)',\n  },\n  success: {\n    feedbackSubtle: 'var(--vui-feedback-success-subtle)',\n    feedbackSolid: 'var(--vui-feedback-success-solid)',\n    // success uses subtle-inverse for the dismiss button (design exception)\n    dismissColor: 'var(--vui-action-success-subtle-inverse)',\n    actionSolid: 'var(--vui-action-success-solid)',\n    actionSolidInverse: 'var(--vui-action-success-solid-inverse)',\n    actionSolidHover: 'var(--vui-action-success-solid-hover)',\n    actionSolidPressed: 'var(--vui-action-success-solid-pressed)',\n  },\n}\n\n/** Variant styles per visual hierarchy, composed from intent tokens. */\nconst hierarchyRules: Record<string, (t: IntentTokens) => object> = {\n  inline: t => ({\n    container: {\n      bg: t.feedbackSubtle,\n      borderColor: t.feedbackSolid,\n      color: t.feedbackSolid,\n      '--vui-dismiss-fg': t.dismissColor,\n    },\n    action: {\n      bg: t.actionSolid,\n      borderColor: t.actionSolid,\n      color: t.actionSolidInverse,\n      hoverBg: t.actionSolidHover,\n      hoverColor: t.actionSolidInverse,\n      activeBg: t.actionSolidPressed,\n      activeColor: t.actionSolidInverse,\n    },\n  }),\n}\n\n// ---------------------------------------------------------------------------\n\nconst baseStyle = {\n  container: {\n    borderRadius: 'var(--vui-notification-border-radius, 0)',\n    borderWidth: 'var(--vui-notification-border-width, 1px)',\n    bg: 'var(--vui-feedback-neutral-subtle)',\n    borderColor: 'var(--vui-feedback-neutral-solid)',\n    color: 'var(--vui-feedback-neutral-solid)',\n  },\n  button: {\n    mt: 'var(--vui-notification-button-margin-top, 8px)',\n    mr: 'var(--vui-notification-button-margin-right, 8px)',\n    mb: 'var(--vui-notification-button-margin-bottom, 0)',\n    ml: 'var(--vui-notification-button-margin-left, 0)',\n  },\n  icon: {\n    ml: 'var(--vui-notification-icon-margin-left, 16px)',\n    mt: 'var(--vui-notification-icon-margin-top, 16px)',\n  },\n  text: {\n    flex: '1',\n    lineHeight: 'var(--vui-notification-text-line-height, 24px)',\n    minW: 0,\n    mx: 'var(--vui-notification-text-margin-x, 16px)',\n    my: 'var(--vui-notification-text-margin-y, 16px)',\n  },\n  actionBox: {\n    my: 'var(--vui-notification-action-margin-y, 8px)',\n    mx: 'var(--vui-notification-action-margin-x, 8px)',\n  },\n}\n\nconst parts = ['container', 'button', 'icon', 'text', 'title', 'actionBox', 'action']\n\nconst sizes = {}\n\n// Generated: inlineInfo, inlineDanger, inlineWarning, inlineSuccess\n// Legacy aliases: subtleBlue, subtleRed, subtleYellow, subtleGreen → kept for backward compatibility\nconst generatedVariants = Object.fromEntries(\n  Object.entries(intentTokens).flatMap(([intentKey, tokens]) =>\n    Object.entries(hierarchyRules).map(([hierarchyKey, buildVariant]) => [\n      `${hierarchyKey}${intentKey.charAt(0).toUpperCase()}${intentKey.slice(1)}`,\n      buildVariant(tokens),\n    ]),\n  ),\n)\n\nconst variants = {\n  ...generatedVariants,\n  // Legacy aliases — kept for backward compatibility\n  subtleBlue: generatedVariants.inlineInfo,\n  subtleRed: generatedVariants.inlineDanger,\n  subtleYellow: generatedVariants.inlineWarning,\n  subtleGreen: generatedVariants.inlineSuccess,\n}\n\nexport default {\n  baseStyle,\n  parts,\n  sizes,\n  variants,\n}\n"],"mappings":";;AAoBA,MAAM,eAA6C;CACjD,MAAM;EACJ,gBAAgB;EAChB,eAAe;EACf,cAAc;EACd,aAAa;EACb,oBAAoB;EACpB,kBAAkB;EAClB,oBAAoB;EACrB;CACD,QAAQ;EACN,gBAAgB;EAChB,eAAe;EACf,cAAc;EACd,aAAa;EACb,oBAAoB;EACpB,kBAAkB;EAClB,oBAAoB;EACrB;CACD,SAAS;EACP,gBAAgB;EAChB,eAAe;EACf,cAAc;EACd,aAAa;EACb,oBAAoB;EACpB,kBAAkB;EAClB,oBAAoB;EACrB;CACD,SAAS;EACP,gBAAgB;EAChB,eAAe;EAEf,cAAc;EACd,aAAa;EACb,oBAAoB;EACpB,kBAAkB;EAClB,oBAAoB;EACrB;CACF;;AAGD,MAAM,iBAA8D,EAClE,SAAQ,OAAM;CACZ,WAAW;EACT,IAAI,EAAE;EACN,aAAa,EAAE;EACf,OAAO,EAAE;EACT,oBAAoB,EAAE;EACvB;CACD,QAAQ;EACN,IAAI,EAAE;EACN,aAAa,EAAE;EACf,OAAO,EAAE;EACT,SAAS,EAAE;EACX,YAAY,EAAE;EACd,UAAU,EAAE;EACZ,aAAa,EAAE;EAChB;CACF,GACF;AAID,MAAM,YAAY;CAChB,WAAW;EACT,cAAc;EACd,aAAa;EACb,IAAI;EACJ,aAAa;EACb,OAAO;EACR;CACD,QAAQ;EACN,IAAI;EACJ,IAAI;EACJ,IAAI;EACJ,IAAI;EACL;CACD,MAAM;EACJ,IAAI;EACJ,IAAI;EACL;CACD,MAAM;EACJ,MAAM;EACN,YAAY;EACZ,MAAM;EACN,IAAI;EACJ,IAAI;EACL;CACD,WAAW;EACT,IAAI;EACJ,IAAI;EACL;CACF;AAED,MAAM,QAAQ;CAAC;CAAa;CAAU;CAAQ;CAAQ;CAAS;CAAa;CAAS;AAErF,MAAM,QAAQ,EAAE;AAIhB,MAAM,oBAAoB,OAAO,YAC/B,OAAO,QAAQ,aAAa,CAAC,SAAS,CAAC,WAAW,YAChD,OAAO,QAAQ,eAAe,CAAC,KAAK,CAAC,cAAc,kBAAkB,CACnE,GAAG,eAAe,UAAU,OAAO,EAAE,CAAC,aAAa,GAAG,UAAU,MAAM,EAAE,IACxE,aAAa,OAAO,CACrB,CAAC,CACH,CACF;AAED,MAAM,WAAW;CACf,GAAG;CAEH,YAAY,kBAAkB;CAC9B,WAAW,kBAAkB;CAC7B,cAAc,kBAAkB;CAChC,aAAa,kBAAkB;CAChC;AAED,oBAAe;CACb;CACA;CACA;CACA;CACD"}

package/dist/notification/utils.js

@@ -0,0 +1,38 @@
+//#region src/notification/utils.ts
+/** Canonical hierarchy keys recognised by the two-prop API. */
+const HIERARCHY_KEYS = new Set(["inline", "banner"]);
+/** The banner hierarchy key — banner variants map to inline for theme lookup but carry extra overrides. */
+const BANNER_HIERARCHY = "banner";
+const INLINE_HIERARCHY = "inline";
+/** Default intent applied when none is specified. */
+const DEFAULT_INTENT = "info";
+/** Default variant hierarchy applied when none is specified. */
+const DEFAULT_VARIANT = "inline";
+/**
+* Capitalises the first character of a string.
+* Mirrors button/utils.ts — used to compose theme keys the same way theme.ts generates them.
+*/
+const capitalize = (s) => s.charAt(0).toUpperCase() + s.slice(1);
+/**
+* Converts a two-prop variant+intent pair into the combined theme key used
+* internally (e.g. `resolveNotificationVariant('inline', 'info') => { themeKey: 'inlineInfo', isBanner: false }`).
+* When `intent` is omitted, `DEFAULT_INTENT` ('info') is used.
+*
+* If `variant` is already a fully-qualified legacy key (e.g. `'inlineBlue'`)
+* it is returned unchanged so the new API is backward-compatible.
+*
+* Returns `{ themeKey: 'inlineInfo', isBanner: false }` (the default) when `variant` is absent.
+*/
+const resolveNotificationVariant = (variant = DEFAULT_VARIANT, intent = DEFAULT_INTENT) => {
+	const resolved = !variant ? `${DEFAULT_VARIANT}${capitalize(DEFAULT_INTENT)}` : !HIERARCHY_KEYS.has(variant) ? variant : `${variant}${capitalize(intent)}`;
+	const isBanner = resolved.startsWith(BANNER_HIERARCHY);
+	return {
+		themeKey: isBanner ? resolved.replace(BANNER_HIERARCHY, INLINE_HIERARCHY) : resolved,
+		isBanner
+	};
+};
+
+//#endregion
+export { DEFAULT_VARIANT, resolveNotificationVariant };
+globalThis.__vuiVersion__ = "5.0.0-alpha.0"
+//# sourceMappingURL=utils.js.map

package/dist/notification/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","names":[],"sources":["../../src/notification/utils.ts"],"sourcesContent":["/**\n * Notification utilities — pure functions shared by consts.ts and notification.tsx.\n * Kept separate to avoid circular imports.\n */\n\nimport type { NotificationIntent, NotificationVariantHierarchy, NotificationVariantLegacy } from './notification.types'\n\n/** Canonical hierarchy keys recognised by the two-prop API. */\nconst HIERARCHY_KEYS = new Set<string>(['inline', 'banner'])\n\n/** The banner hierarchy key — banner variants map to inline for theme lookup but carry extra overrides. */\nconst BANNER_HIERARCHY = 'banner'\nconst INLINE_HIERARCHY = 'inline'\n\n/** Default intent applied when none is specified. */\nexport const DEFAULT_INTENT: NotificationIntent = 'info'\n\n/** Default variant hierarchy applied when none is specified. */\nexport const DEFAULT_VARIANT: NotificationVariantHierarchy = 'inline'\n\n/**\n * Capitalises the first character of a string.\n * Mirrors button/utils.ts — used to compose theme keys the same way theme.ts generates them.\n */\nconst capitalize = (s: string) => s.charAt(0).toUpperCase() + s.slice(1)\n\nexport interface ResolvedNotificationVariant {\n  /** The theme key to pass to useStyleConfig (banner variants map to their inline counterpart). */\n  themeKey: string\n  /** True when the resolved variant is a banner hierarchy — component uses this to add elevation + border overrides. */\n  isBanner: boolean\n}\n\n/**\n * Converts a two-prop variant+intent pair into the combined theme key used\n * internally (e.g. `resolveNotificationVariant('inline', 'info') => { themeKey: 'inlineInfo', isBanner: false }`).\n * When `intent` is omitted, `DEFAULT_INTENT` ('info') is used.\n *\n * If `variant` is already a fully-qualified legacy key (e.g. `'inlineBlue'`)\n * it is returned unchanged so the new API is backward-compatible.\n *\n * Returns `{ themeKey: 'inlineInfo', isBanner: false }` (the default) when `variant` is absent.\n */\nexport const resolveNotificationVariant = (\n  variant: NotificationVariantHierarchy | NotificationVariantLegacy | string | undefined = DEFAULT_VARIANT,\n  intent: NotificationIntent | string | undefined = DEFAULT_INTENT,\n): ResolvedNotificationVariant => {\n  const resolved = !variant\n    ? `${DEFAULT_VARIANT}${capitalize(DEFAULT_INTENT)}`\n    : !HIERARCHY_KEYS.has(variant)\n      ? variant // Already a combined legacy key — pass through unchanged\n      : `${variant}${capitalize(intent)}` // New two-prop API\n\n  const isBanner = resolved.startsWith(BANNER_HIERARCHY)\n  const themeKey = isBanner ? resolved.replace(BANNER_HIERARCHY, INLINE_HIERARCHY) : resolved\n\n  return { themeKey, isBanner }\n}\n"],"mappings":";;AAQA,MAAM,iBAAiB,IAAI,IAAY,CAAC,UAAU,SAAS,CAAC;;AAG5D,MAAM,mBAAmB;AACzB,MAAM,mBAAmB;;AAGzB,MAAa,iBAAqC;;AAGlD,MAAa,kBAAgD;;;;;AAM7D,MAAM,cAAc,MAAc,EAAE,OAAO,EAAE,CAAC,aAAa,GAAG,EAAE,MAAM,EAAE;;;;;;;;;;;AAmBxE,MAAa,8BACX,UAAyF,iBACzF,SAAkD,mBAClB;CAChC,MAAM,WAAW,CAAC,UACd,GAAG,kBAAkB,WAAW,eAAe,KAC/C,CAAC,eAAe,IAAI,QAAQ,GAC1B,UACA,GAAG,UAAU,WAAW,OAAO;CAErC,MAAM,WAAW,SAAS,WAAW,iBAAiB;AAGtD,QAAO;EAAE,UAFQ,WAAW,SAAS,QAAQ,kBAAkB,iBAAiB,GAAG;EAEhE;EAAU"}

package/dist/onedesign-tokens/dist/js/rem/button.js

@@ -61,5 +61,5 @@ const buttonDisabledOpacity = "0.5";
 
 //#endregion
 export { buttonDisabledCursor, buttonDisabledOpacity, buttonTypePrimaryActiveBackgroundColorDark, buttonTypePrimaryActiveBackgroundColorLight, buttonTypePrimaryActiveBorderColorDark, buttonTypePrimaryActiveBorderColorLight, buttonTypePrimaryActiveTextColorDark, buttonTypePrimaryActiveTextColorLight, buttonTypePrimaryDefaultBackgroundColorDark, buttonTypePrimaryDefaultBackgroundColorLight, buttonTypePrimaryDefaultBorderColorDark, buttonTypePrimaryDefaultBorderColorLight, buttonTypePrimaryDefaultTextColorDark, buttonTypePrimaryDefaultTextColorLight, buttonTypePrimaryFocusOutline, buttonTypePrimaryHoverBackgroundColorDark, buttonTypePrimaryHoverBackgroundColorLight, buttonTypePrimaryHoverBorderColorDark, buttonTypePrimaryHoverBorderColorLight, buttonTypePrimaryHoverTextColorDark, buttonTypePrimaryHoverTextColorLight, buttonTypeSecondaryActiveBackgroundColorDark, buttonTypeSecondaryActiveBackgroundColorLight, buttonTypeSecondaryActiveBorderColorDark, buttonTypeSecondaryActiveBorderColorLight, buttonTypeSecondaryActiveTextColorDark, buttonTypeSecondaryActiveTextColorLight, buttonTypeSecondaryDefaultBackgroundColorDark, buttonTypeSecondaryDefaultBackgroundColorLight, buttonTypeSecondaryDefaultBorderColorDark, buttonTypeSecondaryDefaultBorderColorLight, buttonTypeSecondaryDefaultTextColorDark, buttonTypeSecondaryDefaultTextColorLight, buttonTypeSecondaryFocusOutline, buttonTypeSecondaryHoverBackgroundColorDark, buttonTypeSecondaryHoverBackgroundColorLight, buttonTypeSecondaryHoverBorderColorDark, buttonTypeSecondaryHoverBorderColorLight, buttonTypeSecondaryHoverTextColorDark, buttonTypeSecondaryHoverTextColorLight, buttonTypeTertiaryActiveBackgroundColorDark, buttonTypeTertiaryActiveBackgroundColorLight, buttonTypeTertiaryActiveBorderColorDark, buttonTypeTertiaryActiveBorderColorLight, buttonTypeTertiaryActiveTextColorDark, buttonTypeTertiaryActiveTextColorLight, buttonTypeTertiaryDefaultBackgroundColorDark, buttonTypeTertiaryDefaultBackgroundColorLight, buttonTypeTertiaryDefaultBorderColorDark, buttonTypeTertiaryDefaultBorderColorLight, buttonTypeTertiaryDefaultTextColorDark, buttonTypeTertiaryDefaultTextColorLight, buttonTypeTertiaryFocusOutline, buttonTypeTertiaryHoverBackgroundColorDark, buttonTypeTertiaryHoverBackgroundColorLight, buttonTypeTertiaryHoverBorderColorDark, buttonTypeTertiaryHoverBorderColorLight, buttonTypeTertiaryHoverTextColorDark, buttonTypeTertiaryHoverTextColorLight };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.0"
 //# sourceMappingURL=button.js.map

package/dist/p/p.js

@@ -36,5 +36,5 @@ P.displayName = "P";
 
 //#endregion
 export { PBase, P as default };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.0"
 //# sourceMappingURL=p.js.map

package/dist/p/p.types.d.ts

@@ -1,4 +1,5 @@
 import { ThemingProps } from "../theme/types.js";
+import "../theme/index.js";
 import { TypographyProps } from "../system/typography.js";
 import { SystemProps } from "../system/system.js";
 import "../system/index.js";

package/dist/p/p.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"p.types.d.ts","names":[],"sources":["../../src/p/p.types.ts"],"mappings":";;;;;;KAGY,MAAA,GAAS,WAAA,GACnB,YAAA;8CAEE,KAAA,GAAQ,eAAA;EAER,MAAA,GAAS,eAAA,mBALK;EAOd,UAAA,GAAa,eAAA,oBAPI;EASjB,IAAA,oBANQ;EAQR,MAAA,GAAS,eAAA;AAAA"}
+{"version":3,"file":"p.types.d.ts","names":[],"sources":["../../src/p/p.types.ts"],"mappings":";;;;;;;KAGY,MAAA,GAAS,WAAA,GACnB,YAAA;8CAEE,KAAA,GAAQ,eAAA;EAER,MAAA,GAAS,eAAA,mBALD;EAOR,UAAA,GAAa,eAAA;EAEb,IAAA,oBARF;EAUE,MAAA,GAAS,eAAA;AAAA"}

package/dist/p/theme.js

@@ -35,5 +35,5 @@ var theme_default = {
 
 //#endregion
 export { theme_default as default };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.0"
 //# sourceMappingURL=theme.js.map

package/dist/pagination/context.js

@@ -5,5 +5,5 @@ const [PaginationProvider, usePaginationContext] = createContext({ isOptional: t
 
 //#endregion
 export { PaginationProvider, usePaginationContext };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.0"
 //# sourceMappingURL=context.js.map

package/dist/pagination/helpers.js

@@ -24,5 +24,5 @@ function getPaginationItems(page, pageCount) {
 
 //#endregion
 export { getPaginationItems };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.0"
 //# sourceMappingURL=helpers.js.map

package/dist/pagination/pagination.js

@@ -64,5 +64,5 @@ Pagination.displayName = "Pagination";
 
 //#endregion
 export { Pagination as default };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.0"
 //# sourceMappingURL=pagination.js.map

package/dist/pagination/pagination.types.d.ts

@@ -1,6 +1,7 @@
 import { RenderProps } from "../utils/types.js";
 import "../utils/index.js";
 import { ThemingProps } from "../theme/types.js";
+import "../theme/index.js";
 import { ButtonProps } from "../button/button.types.js";
 import "../button/index.js";
 import { BoxProps } from "../box/box.types.js";

package/dist/pagination/pagination.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"pagination.types.d.ts","names":[],"sources":["../../src/pagination/pagination.types.ts"],"mappings":";;;;;;;;;;;;KASY,qBAAA,GAAwB,WAAA;mEAElC,QAAA;EAEA,IAAA;AAAA;AAAA,KAGU,iBAAA,GAAoB,uBAAA,GAA0B,YAAA;AAAA,KAE9C,cAAA;AAAA,KAEA,uBAAA,GAA0B,WAAA;EAXF,sDAalC,SAAA;AAAA;AAAA,KAGU,eAAA,GAAkB,IAAA,CAAK,QAAA,wBACjC,YAAA,iBACA,kBAAA;EAdI,kEAgBF,QAAA,GAAW,WAAA,CAAY,iBAAA,GAbE;EAezB,QAAA,GAAW,GAAA,CAAI,OAAA,EAfa;EAiB5B,KAAA,GAAQ,cAAA,IAfA;EAiBR,UAAA,GAAa,GAAA,CAAI,OAAA;EAEjB,OAAA,GAAU,GAAA,CAAI,OAAA;AAAA"}
+{"version":3,"file":"pagination.types.d.ts","names":[],"sources":["../../src/pagination/pagination.types.ts"],"mappings":";;;;;;;;;;;;;KASY,qBAAA,GAAwB,WAAA;mEAElC,QAAA;EAEA,IAAA;AAAA;AAAA,KAGU,iBAAA,GAAoB,uBAAA,GAA0B,YAAA;AAAA,KAE9C,cAAA;AAAA,KAEA,uBAAA,GAA0B,WAAA;EAXS,sDAa7C,SAAA;AAAA;AAAA,KAGU,eAAA,GAAkB,IAAA,CAAK,QAAA,wBACjC,YAAA,iBACA,kBAAA;EAdI,kEAgBF,QAAA,GAAW,WAAA,CAAY,iBAAA,GAbf;EAeR,QAAA,GAAW,GAAA,CAAI,OAAA;EAEf,KAAA,GAAQ,cAAA,IAjB0D;EAmBlE,UAAA,GAAa,GAAA,CAAI,OAAA,EAjBK;EAmBtB,OAAA,GAAU,GAAA,CAAI,OAAA;AAAA"}

package/dist/pagination/paginationButton.js

@@ -28,5 +28,5 @@ PaginationButton.displayName = "PaginationButton";
 
 //#endregion
 export { PaginationButton as default };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.0"
 //# sourceMappingURL=paginationButton.js.map

package/dist/pagination/paginationEllipsis.js

@@ -24,5 +24,5 @@ PaginationEllipsis.displayName = "PaginationEllipsis";
 
 //#endregion
 export { PaginationEllipsis as default };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.0"
 //# sourceMappingURL=paginationEllipsis.js.map

package/dist/pagination/paginationGoToPage.js

@@ -53,5 +53,5 @@ PaginationGoToPage.displayName = "PaginationGoToPage";
 
 //#endregion
 export { PaginationGoToPage as default };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.0"
 //# sourceMappingURL=paginationGoToPage.js.map

package/dist/pagination/paginationNavigation.js

@@ -41,5 +41,5 @@ PaginationNavigation.displayName = "PaginationNavigation";
 
 //#endregion
 export { PaginationNavigation as default };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.0"
 //# sourceMappingURL=paginationNavigation.js.map

package/dist/pagination/paginationPrevNext.js

@@ -33,5 +33,5 @@ PaginationPrevNext.displayName = "PaginationPrevNext";
 
 //#endregion
 export { PaginationPrevNext as default };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.0"
 //# sourceMappingURL=paginationPrevNext.js.map

package/dist/pagination/paginationResults.js

@@ -25,5 +25,5 @@ PaginationResults.displayName = "PaginationResults";
 
 //#endregion
 export { PaginationResults as default };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.0"
 //# sourceMappingURL=paginationResults.js.map

package/dist/pagination/theme.js

@@ -40,5 +40,5 @@ var theme_default = {
 
 //#endregion
 export { theme_default as default };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.0"
 //# sourceMappingURL=theme.js.map

package/dist/pagination/usePagination.js

@@ -39,5 +39,5 @@ function usePagination(props) {
 
 //#endregion
 export { usePagination as default };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.0"
 //# sourceMappingURL=usePagination.js.map

package/dist/panel/panel.js

@@ -25,5 +25,5 @@ Panel.displayName = "Panel";
 
 //#endregion
 export { Panel as default };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.0"
 //# sourceMappingURL=panel.js.map

package/dist/panel/panel.types.d.ts

@@ -1,4 +1,5 @@
 import { ThemingProps } from "../theme/types.js";
+import "../theme/index.js";
 import { BoxProps } from "../box/box.types.js";
 import "../box/index.js";
 

package/dist/panel/panel.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"panel.types.d.ts","names":[],"sources":["../../src/panel/panel.types.ts"],"mappings":";;;;;KAGY,UAAA,GAAa,IAAA,CAAK,QAAA,wBAAgC,YAAA"}
+{"version":3,"file":"panel.types.d.ts","names":[],"sources":["../../src/panel/panel.types.ts"],"mappings":";;;;;;KAGY,UAAA,GAAa,IAAA,CAAK,QAAA,wBAAgC,YAAA"}

package/dist/panel/theme.js

@@ -18,5 +18,5 @@ var theme_default = {
 
 //#endregion
 export { theme_default as default };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.0"
 //# sourceMappingURL=theme.js.map

package/dist/popover/context.js

@@ -5,5 +5,5 @@ const [PopoverProvider, usePopoverContext] = createContext({ isOptional: true })
 
 //#endregion
 export { PopoverProvider, usePopoverContext };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.0"
 //# sourceMappingURL=context.js.map

package/dist/popover/popover.js

@@ -45,5 +45,5 @@ Popover.displayName = "Popover";
 
 //#endregion
 export { Popover as default };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.0"
 //# sourceMappingURL=popover.js.map

package/dist/popover/popoverContent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"popoverContent.d.ts","names":[],"sources":["../../src/popover/popoverContent.tsx"],"mappings":";;;;;;cASa,cAAA,EAAc,YAAA,QAmCzB,QAAA"}
+{"version":3,"file":"popoverContent.d.ts","names":[],"sources":["../../src/popover/popoverContent.tsx"],"mappings":";;;;;;cASa,cAAA,EAAc,YAAA,QAoCzB,QAAA"}

package/dist/popover/popoverContent.js

@@ -21,6 +21,7 @@ const PopoverContent = vui((props, ref) => {
 	if (!isMounted) return null;
 	return /* @__PURE__ */ jsx(FloatingPortal, { children: /* @__PURE__ */ jsx(FloatingFocusManager, {
 		context,
+		initialFocus: -1,
 		modal: false,
 		children: /* @__PURE__ */ jsx(Box, {
 			bg: "white",
@@ -28,6 +29,7 @@ const PopoverContent = vui((props, ref) => {
 			boxShadow: "2",
 			className: cs("vui-popoverContent", className),
 			overflowY: "auto",
+			zIndex: "popover",
 			ref: mergeRefs(setPopper, ref),
 			ring: 0,
 			style: {
@@ -45,5 +47,5 @@ PopoverContent.displayName = "PopoverContent";
 
 //#endregion
 export { PopoverContent as default };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.0"
 //# sourceMappingURL=popoverContent.js.map

package/dist/popover/popoverContent.js.map

@@ -1 +1 @@
-{"version":3,"file":"popoverContent.js","names":[],"sources":["../../src/popover/popoverContent.tsx"],"sourcesContent":["import { FloatingFocusManager, FloatingPortal } from '@floating-ui/react'\n\nimport Box from '../box'\nimport { useStyleConfig, vui } from '../core'\nimport { cs, mergeRefs } from '../utils'\nimport { usePopoverContext } from './context'\nimport type { PopoverContentProps } from './popover.types'\n\n/** Displays provided content in an overlaying wrapper. */\nexport const PopoverContent = vui<'div', PopoverContentProps>((props, ref) => {\n  const { children, className, ...rest } = props\n  const popoverProps = usePopoverContext() ?? {}\n  const { context, floatingStyles, getFloatingProps, isLazy, isMounted, isOpen, setPopper, transitionStyles } =\n    popoverProps\n  const styles = useStyleConfig('Popover', { ...popoverProps, ...props })\n\n  const shouldRenderChildren = isLazy ? isOpen : true\n\n  // Use isMounted for render control - handles transition timing\n  if (!isMounted) {\n    return null\n  }\n\n  return (\n    <FloatingPortal>\n      <FloatingFocusManager context={context} modal={false}>\n        <Box\n          bg=\"white\"\n          borderRadius=\"md\"\n          boxShadow=\"2\"\n          className={cs('vui-popoverContent', className)}\n          overflowY=\"auto\"\n          ref={mergeRefs(setPopper, ref)}\n          ring={0}\n          style={{ ...floatingStyles, ...transitionStyles }}\n          {...(getFloatingProps?.() ?? {})}\n          {...styles.content}\n          {...rest}\n        >\n          {shouldRenderChildren ? children : null}\n        </Box>\n      </FloatingFocusManager>\n    </FloatingPortal>\n  )\n})\n\nPopoverContent.displayName = 'PopoverContent'\n\nexport default PopoverContent\n"],"mappings":";;;;;;;;;;;AASA,MAAa,iBAAiB,KAAiC,OAAO,QAAQ;CAC5E,MAAM,EAAE,UAAU,WAAW,GAAG,SAAS;CACzC,MAAM,eAAe,mBAAmB,IAAI,EAAE;CAC9C,MAAM,EAAE,SAAS,gBAAgB,kBAAkB,QAAQ,WAAW,QAAQ,WAAW,qBACvF;CACF,MAAM,SAAS,eAAe,WAAW;EAAE,GAAG;EAAc,GAAG;EAAO,CAAC;CAEvE,MAAM,uBAAuB,SAAS,SAAS;AAG/C,KAAI,CAAC,UACH,QAAO;AAGT,QACE,oBAAC,4BACC,oBAAC;EAA8B;EAAS,OAAO;YAC7C,oBAAC;GACC,IAAG;GACH,cAAa;GACb,WAAU;GACV,WAAW,GAAG,sBAAsB,UAAU;GAC9C,WAAU;GACV,KAAK,UAAU,WAAW,IAAI;GAC9B,MAAM;GACN,OAAO;IAAE,GAAG;IAAgB,GAAG;IAAkB;GACjD,GAAK,oBAAoB,IAAI,EAAE;GAC/B,GAAI,OAAO;GACX,GAAI;aAEH,uBAAuB,WAAW;IAC/B;GACe,GACR;EAEnB;AAEF,eAAe,cAAc"}
+{"version":3,"file":"popoverContent.js","names":[],"sources":["../../src/popover/popoverContent.tsx"],"sourcesContent":["import { FloatingFocusManager, FloatingPortal } from '@floating-ui/react'\n\nimport Box from '../box'\nimport { useStyleConfig, vui } from '../core'\nimport { cs, mergeRefs } from '../utils'\nimport { usePopoverContext } from './context'\nimport type { PopoverContentProps } from './popover.types'\n\n/** Displays provided content in an overlaying wrapper. */\nexport const PopoverContent = vui<'div', PopoverContentProps>((props, ref) => {\n  const { children, className, ...rest } = props\n  const popoverProps = usePopoverContext() ?? {}\n  const { context, floatingStyles, getFloatingProps, isLazy, isMounted, isOpen, setPopper, transitionStyles } =\n    popoverProps\n  const styles = useStyleConfig('Popover', { ...popoverProps, ...props })\n\n  const shouldRenderChildren = isLazy ? isOpen : true\n\n  // Use isMounted for render control - handles transition timing\n  if (!isMounted) {\n    return null\n  }\n\n  return (\n    <FloatingPortal>\n      <FloatingFocusManager context={context} initialFocus={-1} modal={false}>\n        <Box\n          bg=\"white\"\n          borderRadius=\"md\"\n          boxShadow=\"2\"\n          className={cs('vui-popoverContent', className)}\n          overflowY=\"auto\"\n          zIndex=\"popover\"\n          ref={mergeRefs(setPopper, ref)}\n          ring={0}\n          style={{ ...floatingStyles, ...transitionStyles }}\n          {...(getFloatingProps?.() ?? {})}\n          {...styles.content}\n          {...rest}\n        >\n          {shouldRenderChildren ? children : null}\n        </Box>\n      </FloatingFocusManager>\n    </FloatingPortal>\n  )\n})\n\nPopoverContent.displayName = 'PopoverContent'\n\nexport default PopoverContent\n"],"mappings":";;;;;;;;;;;AASA,MAAa,iBAAiB,KAAiC,OAAO,QAAQ;CAC5E,MAAM,EAAE,UAAU,WAAW,GAAG,SAAS;CACzC,MAAM,eAAe,mBAAmB,IAAI,EAAE;CAC9C,MAAM,EAAE,SAAS,gBAAgB,kBAAkB,QAAQ,WAAW,QAAQ,WAAW,qBACvF;CACF,MAAM,SAAS,eAAe,WAAW;EAAE,GAAG;EAAc,GAAG;EAAO,CAAC;CAEvE,MAAM,uBAAuB,SAAS,SAAS;AAG/C,KAAI,CAAC,UACH,QAAO;AAGT,QACE,oBAAC,4BACC,oBAAC;EAA8B;EAAS,cAAc;EAAI,OAAO;YAC/D,oBAAC;GACC,IAAG;GACH,cAAa;GACb,WAAU;GACV,WAAW,GAAG,sBAAsB,UAAU;GAC9C,WAAU;GACV,QAAO;GACP,KAAK,UAAU,WAAW,IAAI;GAC9B,MAAM;GACN,OAAO;IAAE,GAAG;IAAgB,GAAG;IAAkB;GACjD,GAAK,oBAAoB,IAAI,EAAE;GAC/B,GAAI,OAAO;GACX,GAAI;aAEH,uBAAuB,WAAW;IAC/B;GACe,GACR;EAEnB;AAEF,eAAe,cAAc"}

package/dist/popover/popoverTrigger.js

@@ -38,5 +38,5 @@ PopoverTrigger.displayName = "PopoverTrigger";
 
 //#endregion
 export { PopoverTrigger as default };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.0"
 //# sourceMappingURL=popoverTrigger.js.map

package/dist/popover/theme.js

@@ -14,5 +14,5 @@ var theme_default = {
 
 //#endregion
 export { theme_default as default };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.0"
 //# sourceMappingURL=theme.js.map

package/dist/popover/usePopover.js

@@ -95,5 +95,5 @@ function usePopover(props = {}) {
 
 //#endregion
 export { usePopover as default };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.0"
 //# sourceMappingURL=usePopover.js.map

package/dist/portal/portal.js

@@ -17,5 +17,5 @@ Portal.displayName = "Portal";
 
 //#endregion
 export { Portal as default };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.0"
 //# sourceMappingURL=portal.js.map

package/dist/progress/progress.js

@@ -52,5 +52,5 @@ Progress.displayName = "Progress";
 
 //#endregion
 export { ProgressBase, Progress as default };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.0"
 //# sourceMappingURL=progress.js.map

package/dist/progress/progress.types.d.ts

@@ -1,4 +1,5 @@
 import { ThemingProps } from "../theme/types.js";
+import "../theme/index.js";
 import { SystemProps } from "../system/system.js";
 import "../system/index.js";
 

package/dist/progress/progress.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"progress.types.d.ts","names":[],"sources":["../../src/progress/progress.types.ts"],"mappings":";;;;;KAGY,aAAA,GAAgB,WAAA,GAC1B,YAAA;EACE,KAAA;EACA,cAAA;AAAA"}
+{"version":3,"file":"progress.types.d.ts","names":[],"sources":["../../src/progress/progress.types.ts"],"mappings":";;;;;;KAGY,aAAA,GAAgB,WAAA,GAC1B,YAAA;EACE,KAAA;EACA,cAAA;AAAA"}

package/dist/progress/theme.js

@@ -57,5 +57,5 @@ var theme_default = {
 
 //#endregion
 export { theme_default as default };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.0"
 //# sourceMappingURL=theme.js.map

package/dist/progressCircular/consts.js

@@ -13,5 +13,5 @@ const maxValue = 100;
 
 //#endregion
 export { absCenterStyles, labelBottom, maxValue };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.0"
 //# sourceMappingURL=consts.js.map

package/dist/progressCircular/progressCircular.js

@@ -94,5 +94,5 @@ ProgressCircular.displayName = "ProgressCircular";
 
 //#endregion
 export { ProgressCircularBase, ProgressCircular as default };
-globalThis.__vuiVersion__ = "4.1.0"
+globalThis.__vuiVersion__ = "5.0.0-alpha.0"
 //# sourceMappingURL=progressCircular.js.map