@veracity/vui 5.3.0-alpha.manual.2608050712 → 5.3.0

package/dist/toast/useToast.js

@@ -12,6 +12,7 @@ const DEFAULT_DURATION_BY_STATUS = {
 	info: "fast",
 	success: "fast",
 	warning: "fast",
+	danger: "slow",
 	error: "slow",
 	loading: "sticky"
 };
@@ -36,7 +37,7 @@ const useToast = () => {
 		if (options?.dismissible !== void 0) console.warn("[VUI] Toast: `dismissible` is deprecated. Use `showDismissButton` to control dismiss button visibility.");
 		const id = options?.id ? options.id : uid("toast");
 		const showDismissButton = options?.showDismissButton ?? options?.dismissible ?? true;
-		const status = options?.status ?? "info";
+		const status = options?.status === "error" ? "danger" : options?.status ?? "info";
 		const { duration = DEFAULT_DURATION_BY_STATUS[status], action, icon, size, text, textLayout, title } = options || {};
 		const handleClose = () => {
 			const timeoutId = timeoutMapRef.current.get(id);
@@ -63,29 +64,34 @@ const useToast = () => {
 			removeToast(id);
 		}, getDurationTime(duration)));
 	}, [addToast, removeToast]);
+	const showInfo = useCallback((text, options) => showToast({
+		text,
+		status: "info",
+		...options
+	}), [showToast]);
+	const showSuccess = useCallback((text, options) => showToast({
+		text,
+		status: "success",
+		...options
+	}), [showToast]);
+	const showWarning = useCallback((text, options) => showToast({
+		text,
+		status: "warning",
+		...options
+	}), [showToast]);
+	const showDanger = useCallback((text, options) => showToast({
+		text,
+		status: "danger",
+		...options
+	}), [showToast]);
 	return {
 		showToast,
 		hideToast: removeToast,
-		showInfo: useCallback((text, options) => showToast({
-			text,
-			status: "info",
-			...options
-		}), [showToast]),
-		showSuccess: useCallback((text, options) => showToast({
-			text,
-			status: "success",
-			...options
-		}), [showToast]),
-		showWarning: useCallback((text, options) => showToast({
-			text,
-			status: "warning",
-			...options
-		}), [showToast]),
-		showError: useCallback((text, options) => showToast({
-			text,
-			status: "error",
-			...options
-		}), [showToast]),
+		showInfo,
+		showSuccess,
+		showWarning,
+		showDanger,
+		showError: showDanger,
 		showLoading: useCallback((text, options) => showToast({
 			text,
 			status: "loading",
@@ -96,5 +102,5 @@ const useToast = () => {
 
 //#endregion
 export { defaultDuration, fastToastDuration, slowToastDuration, useToast };
-globalThis.__vuiVersion__ = "5.3.0-alpha.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=useToast.js.map

package/dist/toast/useToast.js.map

@@ -1 +1 @@
-{"version":3,"file":"useToast.js","names":["_exhaustive"],"sources":["../../src/toast/useToast.tsx"],"sourcesContent":["import type { ReactNode } from 'react'\n\nimport { useCallback, useEffect, useRef } from 'react'\n\nimport type { ToastDuration, ToastOptions } from './toast.types'\n\nimport { useVuiContext } from '../core/vuiProvider/context'\nimport { uid } from '../utils'\nimport { ToastItem } from './Toaster'\n\nexport const defaultDuration = 'fast'\nexport const fastToastDuration = 4000\nexport const slowToastDuration = 8000\n\nconst DEFAULT_DURATION_BY_STATUS: Record<string, ToastDuration> = {\n  info: 'fast',\n  success: 'fast',\n  warning: 'fast',\n  error: 'slow',\n  loading: 'sticky',\n}\n\nconst getDurationTime = (duration: Exclude<ToastDuration, 'sticky'>): number => {\n  switch (duration) {\n    case 'fast':\n      return fastToastDuration\n    case 'slow':\n      return slowToastDuration\n    default: {\n      const _exhaustive: never = duration\n      throw new Error(`[VUI] useToast: unhandled duration \"${_exhaustive}\"`)\n    }\n  }\n}\n\nexport const useToast = () => {\n  const { addToast, removeToast } = useVuiContext()\n  const timeoutMapRef = useRef<Map<string, ReturnType<typeof setTimeout>>>(new Map())\n\n  useEffect(() => {\n    const timeouts = timeoutMapRef.current\n    return () => {\n      timeouts.forEach(clearTimeout)\n      timeouts.clear()\n    }\n  }, [])\n\n  const showToast = useCallback(\n    (options?: ToastOptions): void => {\n      if (process.env.NODE_ENV !== 'production' && options?.dismissible !== undefined) {\n        console.warn(\n          '[VUI] Toast: `dismissible` is deprecated. Use `showDismissButton` to control dismiss button visibility.',\n        )\n      }\n      const id = options?.id ? options.id : uid('toast')\n      const showDismissButton = options?.showDismissButton ?? options?.dismissible ?? true\n      const status = options?.status ?? 'info'\n      const { duration = DEFAULT_DURATION_BY_STATUS[status], action, icon, size, text, textLayout, title } = options || {}\n\n      const handleClose = () => {\n        const timeoutId = timeoutMapRef.current.get(id)\n        if (timeoutId !== undefined) clearTimeout(timeoutId)\n        timeoutMapRef.current.delete(id)\n        removeToast(id)\n      }\n\n      const toast = {\n        id,\n        component: (\n          <ToastItem\n            action={action}\n            icon={icon}\n            showDismissButton={showDismissButton}\n            size={size}\n            status={status}\n            text={text}\n            textLayout={textLayout}\n            title={title}\n            onClose={handleClose}\n          />\n        ),\n      }\n\n      addToast(toast)\n\n      if (duration && duration !== 'sticky') {\n        timeoutMapRef.current.set(\n          id,\n          setTimeout(() => {\n            timeoutMapRef.current.delete(id)\n            removeToast(id)\n          }, getDurationTime(duration)),\n        )\n      }\n    },\n    [addToast, removeToast],\n  )\n\n  const showInfo = useCallback(\n    (text: ReactNode, options?: Omit<ToastOptions, 'text' | 'status'>) =>\n      showToast({ text, status: 'info', ...options }),\n    [showToast],\n  )\n\n  const showSuccess = useCallback(\n    (text: ReactNode, options?: Omit<ToastOptions, 'text' | 'status'>) =>\n      showToast({ text, status: 'success', ...options }),\n    [showToast],\n  )\n\n  const showWarning = useCallback(\n    (text: ReactNode, options?: Omit<ToastOptions, 'text' | 'status'>) =>\n      showToast({ text, status: 'warning', ...options }),\n    [showToast],\n  )\n\n  const showError = useCallback(\n    (text: ReactNode, options?: Omit<ToastOptions, 'text' | 'status'>) =>\n      showToast({ text, status: 'error', ...options }),\n    [showToast],\n  )\n\n  const showLoading = useCallback(\n    (text: ReactNode, options?: Omit<ToastOptions, 'text' | 'status'>) =>\n      showToast({ text, status: 'loading', ...options }),\n    [showToast],\n  )\n\n  return {\n    showToast,\n    hideToast: removeToast,\n    showInfo,\n    showSuccess,\n    showWarning,\n    showError,\n    showLoading,\n  }\n}\n"],"mappings":";;;;;;;AAUA,MAAa,kBAAkB;AAC/B,MAAa,oBAAoB;AACjC,MAAa,oBAAoB;AAEjC,MAAM,6BAA4D;CAChE,MAAM;CACN,SAAS;CACT,SAAS;CACT,OAAO;CACP,SAAS;AACX;AAEA,MAAM,mBAAmB,aAAuD;CAC9E,QAAQ,UAAR;EACE,KAAK,QACH,OAAO;EACT,KAAK,QACH,OAAO;EACT,SAEE,MAAM,IAAI,MAAM,uCAAuCA,SAAY,EAAE;CAEzE;AACF;AAEA,MAAa,iBAAiB;CAC5B,MAAM,EAAE,UAAU,gBAAgB,cAAc;CAChD,MAAM,gBAAgB,uBAAmD,IAAI,IAAI,CAAC;CAElF,gBAAgB;EACd,MAAM,WAAW,cAAc;EAC/B,aAAa;GACX,SAAS,QAAQ,YAAY;GAC7B,SAAS,MAAM;EACjB;CACF,GAAG,CAAC,CAAC;CAEL,MAAM,YAAY,aACf,YAAiC;EAChC,IAA6C,SAAS,gBAAgB,QACpE,QAAQ,KACN,yGACF;EAEF,MAAM,KAAK,SAAS,KAAK,QAAQ,KAAK,IAAI,OAAO;EACjD,MAAM,oBAAoB,SAAS,qBAAqB,SAAS,eAAe;EAChF,MAAM,SAAS,SAAS,UAAU;EAClC,MAAM,EAAE,WAAW,2BAA2B,SAAS,QAAQ,MAAM,MAAM,MAAM,YAAY,UAAU,WAAW,CAAC;EAEnH,MAAM,oBAAoB;GACxB,MAAM,YAAY,cAAc,QAAQ,IAAI,EAAE;GAC9C,IAAI,cAAc,QAAW,aAAa,SAAS;GACnD,cAAc,QAAQ,OAAO,EAAE;GAC/B,YAAY,EAAE;EAChB;EAmBA,SAAS;GAhBP;GACA,WACE,oBAAC,WAAD;IACU;IACF;IACa;IACb;IACE;IACF;IACM;IACL;IACP,SAAS;GACV;EAIQ,CAAC;EAEd,IAAI,YAAY,aAAa,UAC3B,cAAc,QAAQ,IACpB,IACA,iBAAiB;GACf,cAAc,QAAQ,OAAO,EAAE;GAC/B,YAAY,EAAE;EAChB,GAAG,gBAAgB,QAAQ,CAAC,CAC9B;CAEJ,GACA,CAAC,UAAU,WAAW,CACxB;CAgCA,OAAO;EACL;EACA,WAAW;EACX,UAjCe,aACd,MAAiB,YAChB,UAAU;GAAE;GAAM,QAAQ;GAAQ,GAAG;EAAQ,CAAC,GAChD,CAAC,SAAS,CA8BH;EACP,aA5BkB,aACjB,MAAiB,YAChB,UAAU;GAAE;GAAM,QAAQ;GAAW,GAAG;EAAQ,CAAC,GACnD,CAAC,SAAS,CAyBA;EACV,aAvBkB,aACjB,MAAiB,YAChB,UAAU;GAAE;GAAM,QAAQ;GAAW,GAAG;EAAQ,CAAC,GACnD,CAAC,SAAS,CAoBA;EACV,WAlBgB,aACf,MAAiB,YAChB,UAAU;GAAE;GAAM,QAAQ;GAAS,GAAG;EAAQ,CAAC,GACjD,CAAC,SAAS,CAeF;EACR,aAbkB,aACjB,MAAiB,YAChB,UAAU;GAAE;GAAM,QAAQ;GAAW,GAAG;EAAQ,CAAC,GACnD,CAAC,SAAS,CAUA;CACZ;AACF"}
+{"version":3,"file":"useToast.js","names":["_exhaustive"],"sources":["../../src/toast/useToast.tsx"],"sourcesContent":["import type { ReactNode } from 'react'\n\nimport { useCallback, useEffect, useRef } from 'react'\n\nimport type { ToastDuration, ToastOptions, ToastStatus } from './toast.types'\n\nimport { useVuiContext } from '../core/vuiProvider/context'\nimport { uid } from '../utils'\nimport { ToastItem } from './Toaster'\n\nexport const defaultDuration = 'fast'\nexport const fastToastDuration = 4000\nexport const slowToastDuration = 8000\n\nconst DEFAULT_DURATION_BY_STATUS: Record<string, ToastDuration> = {\n  info: 'fast',\n  success: 'fast',\n  warning: 'fast',\n  danger: 'slow',\n  error: 'slow',\n  loading: 'sticky',\n}\n\nconst getDurationTime = (duration: Exclude<ToastDuration, 'sticky'>): number => {\n  switch (duration) {\n    case 'fast':\n      return fastToastDuration\n    case 'slow':\n      return slowToastDuration\n    default: {\n      const _exhaustive: never = duration\n      throw new Error(`[VUI] useToast: unhandled duration \"${_exhaustive}\"`)\n    }\n  }\n}\n\nexport const useToast = () => {\n  const { addToast, removeToast } = useVuiContext()\n  const timeoutMapRef = useRef<Map<string, ReturnType<typeof setTimeout>>>(new Map())\n\n  useEffect(() => {\n    const timeouts = timeoutMapRef.current\n    return () => {\n      timeouts.forEach(clearTimeout)\n      timeouts.clear()\n    }\n  }, [])\n\n  const showToast = useCallback(\n    (options?: ToastOptions): void => {\n      if (process.env.NODE_ENV !== 'production' && options?.dismissible !== undefined) {\n        console.warn(\n          '[VUI] Toast: `dismissible` is deprecated. Use `showDismissButton` to control dismiss button visibility.',\n        )\n      }\n      const id = options?.id ? options.id : uid('toast')\n      const showDismissButton = options?.showDismissButton ?? options?.dismissible ?? true\n      // Normalise deprecated 'error' status to 'danger'.\n      const status = (options?.status === 'error' ? 'danger' : (options?.status ?? 'info')) as ToastStatus\n      const {\n        duration = DEFAULT_DURATION_BY_STATUS[status],\n        action,\n        icon,\n        size,\n        text,\n        textLayout,\n        title,\n      } = options || {}\n\n      const handleClose = () => {\n        const timeoutId = timeoutMapRef.current.get(id)\n        if (timeoutId !== undefined) clearTimeout(timeoutId)\n        timeoutMapRef.current.delete(id)\n        removeToast(id)\n      }\n\n      const toast = {\n        id,\n        component: (\n          <ToastItem\n            action={action}\n            icon={icon}\n            showDismissButton={showDismissButton}\n            size={size}\n            status={status}\n            text={text}\n            textLayout={textLayout}\n            title={title}\n            onClose={handleClose}\n          />\n        ),\n      }\n\n      addToast(toast)\n\n      if (duration && duration !== 'sticky') {\n        timeoutMapRef.current.set(\n          id,\n          setTimeout(() => {\n            timeoutMapRef.current.delete(id)\n            removeToast(id)\n          }, getDurationTime(duration)),\n        )\n      }\n    },\n    [addToast, removeToast],\n  )\n\n  const showInfo = useCallback(\n    (text: ReactNode, options?: Omit<ToastOptions, 'text' | 'status'>) =>\n      showToast({ text, status: 'info', ...options }),\n    [showToast],\n  )\n\n  const showSuccess = useCallback(\n    (text: ReactNode, options?: Omit<ToastOptions, 'text' | 'status'>) =>\n      showToast({ text, status: 'success', ...options }),\n    [showToast],\n  )\n\n  const showWarning = useCallback(\n    (text: ReactNode, options?: Omit<ToastOptions, 'text' | 'status'>) =>\n      showToast({ text, status: 'warning', ...options }),\n    [showToast],\n  )\n\n  const showDanger = useCallback(\n    (text: ReactNode, options?: Omit<ToastOptions, 'text' | 'status'>) =>\n      showToast({ text, status: 'danger', ...options }),\n    [showToast],\n  )\n\n  /** @deprecated Use `showDanger` instead. */\n  const showError = showDanger\n\n  const showLoading = useCallback(\n    (text: ReactNode, options?: Omit<ToastOptions, 'text' | 'status'>) =>\n      showToast({ text, status: 'loading', ...options }),\n    [showToast],\n  )\n\n  return {\n    showToast,\n    hideToast: removeToast,\n    showInfo,\n    showSuccess,\n    showWarning,\n    showDanger,\n    showError,\n    showLoading,\n  }\n}\n"],"mappings":";;;;;;;AAUA,MAAa,kBAAkB;AAC/B,MAAa,oBAAoB;AACjC,MAAa,oBAAoB;AAEjC,MAAM,6BAA4D;CAChE,MAAM;CACN,SAAS;CACT,SAAS;CACT,QAAQ;CACR,OAAO;CACP,SAAS;AACX;AAEA,MAAM,mBAAmB,aAAuD;CAC9E,QAAQ,UAAR;EACE,KAAK,QACH,OAAO;EACT,KAAK,QACH,OAAO;EACT,SAEE,MAAM,IAAI,MAAM,uCAAuCA,SAAY,EAAE;CAEzE;AACF;AAEA,MAAa,iBAAiB;CAC5B,MAAM,EAAE,UAAU,gBAAgB,cAAc;CAChD,MAAM,gBAAgB,uBAAmD,IAAI,IAAI,CAAC;CAElF,gBAAgB;EACd,MAAM,WAAW,cAAc;EAC/B,aAAa;GACX,SAAS,QAAQ,YAAY;GAC7B,SAAS,MAAM;EACjB;CACF,GAAG,CAAC,CAAC;CAEL,MAAM,YAAY,aACf,YAAiC;EAChC,IAA6C,SAAS,gBAAgB,QACpE,QAAQ,KACN,yGACF;EAEF,MAAM,KAAK,SAAS,KAAK,QAAQ,KAAK,IAAI,OAAO;EACjD,MAAM,oBAAoB,SAAS,qBAAqB,SAAS,eAAe;EAEhF,MAAM,SAAU,SAAS,WAAW,UAAU,WAAY,SAAS,UAAU;EAC7E,MAAM,EACJ,WAAW,2BAA2B,SACtC,QACA,MACA,MACA,MACA,YACA,UACE,WAAW,CAAC;EAEhB,MAAM,oBAAoB;GACxB,MAAM,YAAY,cAAc,QAAQ,IAAI,EAAE;GAC9C,IAAI,cAAc,QAAW,aAAa,SAAS;GACnD,cAAc,QAAQ,OAAO,EAAE;GAC/B,YAAY,EAAE;EAChB;EAmBA,SAAS;GAhBP;GACA,WACE,oBAAC,WAAD;IACU;IACF;IACa;IACb;IACE;IACF;IACM;IACL;IACP,SAAS;GACV;EAIQ,CAAC;EAEd,IAAI,YAAY,aAAa,UAC3B,cAAc,QAAQ,IACpB,IACA,iBAAiB;GACf,cAAc,QAAQ,OAAO,EAAE;GAC/B,YAAY,EAAE;EAChB,GAAG,gBAAgB,QAAQ,CAAC,CAC9B;CAEJ,GACA,CAAC,UAAU,WAAW,CACxB;CAEA,MAAM,WAAW,aACd,MAAiB,YAChB,UAAU;EAAE;EAAM,QAAQ;EAAQ,GAAG;CAAQ,CAAC,GAChD,CAAC,SAAS,CACZ;CAEA,MAAM,cAAc,aACjB,MAAiB,YAChB,UAAU;EAAE;EAAM,QAAQ;EAAW,GAAG;CAAQ,CAAC,GACnD,CAAC,SAAS,CACZ;CAEA,MAAM,cAAc,aACjB,MAAiB,YAChB,UAAU;EAAE;EAAM,QAAQ;EAAW,GAAG;CAAQ,CAAC,GACnD,CAAC,SAAS,CACZ;CAEA,MAAM,aAAa,aAChB,MAAiB,YAChB,UAAU;EAAE;EAAM,QAAQ;EAAU,GAAG;CAAQ,CAAC,GAClD,CAAC,SAAS,CACZ;CAWA,OAAO;EACL;EACA,WAAW;EACX;EACA;EACA;EACA;EACA;EACA,aAdkB,aACjB,MAAiB,YAChB,UAAU;GAAE;GAAM,QAAQ;GAAW,GAAG;EAAQ,CAAC,GACnD,CAAC,SAAS,CAWA;CACZ;AACF"}

package/dist/tooltip/consts.js

@@ -6,5 +6,5 @@ const bg = {
 
 //#endregion
 export { bg };
-globalThis.__vuiVersion__ = "5.3.0-alpha.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=consts.js.map

package/dist/tooltip/tooltip.js

@@ -112,5 +112,5 @@ Tooltip.displayName = "Tooltip";
 
 //#endregion
 export { Tooltip, Tooltip as default };
-globalThis.__vuiVersion__ = "5.3.0-alpha.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=tooltip.js.map

package/dist/tooltip/tooltip.js.map

@@ -1 +1 @@
-{"version":3,"file":"tooltip.js","names":["zIndices"],"sources":["../../src/tooltip/tooltip.tsx"],"sourcesContent":["import {\n  arrow,\n  autoUpdate,\n  flip,\n  FloatingArrow,\n  FloatingPortal,\n  offset,\n  safePolygon,\n  shift,\n  useFloating,\n  useHover,\n  useInteractions,\n  useRole,\n  useTransitionStyles,\n} from '@floating-ui/react'\nimport { cloneElement, isValidElement, useMemo, useRef, useState } from 'react'\n\nimport type { TooltipProps } from './tooltip.types'\n\nimport { useTh, useUp, v } from '../core'\nimport { Link } from '../link'\nimport { useModalContext } from '../modal/context'\nimport { zIndices } from '../theme'\nimport { isString } from '../utils'\nimport { bg } from './consts'\nimport { TooltipContent } from './tooltipContent'\n\nconst stripHtmlTags = (html: string): string => {\n  const withoutTags = html.replace(/<[^>]*>/g, '')\n  // Decode HTML entities\n  const textarea = document.createElement('textarea')\n  textarea.innerHTML = withoutTags\n  return textarea.value\n}\n\n/**\n * A simple text popup hint.\n *\n * Displayed on mouse enter, and is hidden on mouse leave.\n *\n * */\nexport const Tooltip = (props: TooltipProps) => {\n  const {\n    children,\n    fontSize = '16px',\n    linkText,\n    linkProps,\n    minWidth,\n    maxWidth = '400px',\n    text = '',\n    placement = 'top',\n    disabled = false,\n    visible = false,\n    offset: offsetProp = [0, 0],\n    whiteSpace = 'pre-wrap',\n    wordBreak = 'break-word',\n    portalRoot = undefined,\n  } = props\n\n  const isDesktop = useUp('md')\n  const [isOpen, setIsOpen] = useState(visible)\n  const arrowRef = useRef(null)\n\n  const middleware = useMemo(\n    () => [\n      offset({ mainAxis: offsetProp[1] + 6, crossAxis: offsetProp[0] }), // +6 for arrow\n      flip(),\n      shift(),\n      arrow({ element: arrowRef }),\n    ],\n\n    [offsetProp[0], offsetProp[1]],\n  )\n\n  const { refs, floatingStyles, context } = useFloating({\n    open: visible || isOpen,\n    onOpenChange: setIsOpen,\n    placement,\n    middleware,\n    whileElementsMounted: autoUpdate,\n  })\n  // Opacity-only transition - no position movement\n  const { isMounted, styles: transitionStyles } = useTransitionStyles(context, {\n    duration: 150,\n    initial: { opacity: 0 },\n    open: { opacity: 1 },\n    close: { opacity: 0 },\n  })\n  const hover = useHover(context, { move: false, handleClose: safePolygon() })\n  const role = useRole(context, { role: 'tooltip' })\n  const { getReferenceProps, getFloatingProps } = useInteractions([hover, role])\n\n  const darkBlue18 = useTh(`colors.${bg.regular}`)\n  const sandstone55 = useTh(`colors.${bg.disabled}`)\n  const arrowColor = disabled ? sandstone55 : darkBlue18\n\n  const strippedText = useMemo(() => (isString(text) ? stripHtmlTags(text) : ''), [text])\n  \n  // Get parent modal context to determine if tooltip is inside a modal\n  const modalContext = useModalContext()\n  // If inside a modal, use popover z-index + offset; otherwise use standard tooltip z-index\n  const zIndex = modalContext?.zIndex ? zIndices.popover + 10 : zIndices.tooltip\n\n  const content = isString(text) ? (\n    <TooltipContent\n      disabled={disabled}\n      fontSize={fontSize}\n      maxWidth={maxWidth}\n      minWidth={minWidth}\n      whiteSpace={whiteSpace}\n      wordBreak={wordBreak}\n    >\n      <v.div>\n        {strippedText}\n        {!!linkText && (\n          <>\n            &nbsp;\n            <Link variant=\"white\" {...linkProps}>\n              {linkText}\n            </Link>\n          </>\n        )}\n      </v.div>\n    </TooltipContent>\n  ) : (\n    <TooltipContent disabled={disabled} fontSize={fontSize} maxWidth={maxWidth} minWidth={minWidth}>\n      {text}\n    </TooltipContent>\n  )\n\n  // Clone the child element to add ref and props.\n  // Compose refs so any existing ref on the child is preserved alongside the floating reference ref.\n  const childRef = isValidElement(children) ? ((children as any).ref ?? (children as any).props?.ref) : null\n  const composedRef =\n    childRef != null\n      ? (el: Element | null) => {\n          refs.setReference(el)\n          if (typeof childRef === 'function') childRef(el)\n          else if (childRef && typeof childRef === 'object') (childRef as React.MutableRefObject<unknown>).current = el\n        }\n      : refs.setReference\n  const childElement = isValidElement(children)\n    ? cloneElement(children as React.ReactElement<any>, {\n        ref: composedRef,\n        ...getReferenceProps(),\n      })\n    : children\n\n  return (\n    <>\n      {childElement}\n      {isMounted && (\n        <FloatingPortal key={portalRoot ? 'custom' : 'default'} root={portalRoot ?? undefined}>\n          <div\n            ref={refs.setFloating}\n            style={{ ...floatingStyles, ...transitionStyles, zIndex }}\n            {...getFloatingProps()}\n          >\n            {content}\n            {isDesktop && <FloatingArrow ref={arrowRef} context={context} fill={arrowColor} width={12} height={6} />}\n          </div>\n        </FloatingPortal>\n      )}\n    </>\n  )\n}\n\nTooltip.displayName = 'Tooltip'\n\nexport default Tooltip\n"],"mappings":";;;;;;;;;;;;;;AA2BA,MAAM,iBAAiB,SAAyB;CAC9C,MAAM,cAAc,KAAK,QAAQ,YAAY,EAAE;CAE/C,MAAM,WAAW,SAAS,cAAc,UAAU;CAClD,SAAS,YAAY;CACrB,OAAO,SAAS;AAClB;;;;;;;AAQA,MAAa,WAAW,UAAwB;CAC9C,MAAM,EACJ,UACA,WAAW,QACX,UACA,WACA,UACA,WAAW,SACX,OAAO,IACP,YAAY,OACZ,WAAW,OACX,UAAU,OACV,QAAQ,aAAa,CAAC,GAAG,CAAC,GAC1B,aAAa,YACb,YAAY,cACZ,aAAa,WACX;CAEJ,MAAM,YAAY,MAAM,IAAI;CAC5B,MAAM,CAAC,QAAQ,aAAa,SAAS,OAAO;CAC5C,MAAM,WAAW,OAAO,IAAI;CAE5B,MAAM,aAAa,cACX;EACJ,OAAO;GAAE,UAAU,WAAW,KAAK;GAAG,WAAW,WAAW;EAAG,CAAC;EAChE,KAAK;EACL,MAAM;EACN,MAAM,EAAE,SAAS,SAAS,CAAC;CAC7B,GAEA,CAAC,WAAW,IAAI,WAAW,EAAE,CAC/B;CAEA,MAAM,EAAE,MAAM,gBAAgB,YAAY,YAAY;EACpD,MAAM,WAAW;EACjB,cAAc;EACd;EACA;EACA,sBAAsB;CACxB,CAAC;CAED,MAAM,EAAE,WAAW,QAAQ,qBAAqB,oBAAoB,SAAS;EAC3E,UAAU;EACV,SAAS,EAAE,SAAS,EAAE;EACtB,MAAM,EAAE,SAAS,EAAE;EACnB,OAAO,EAAE,SAAS,EAAE;CACtB,CAAC;CAGD,MAAM,EAAE,mBAAmB,qBAAqB,gBAAgB,CAFlD,SAAS,SAAS;EAAE,MAAM;EAAO,aAAa,YAAY;CAAE,CAEL,GADxD,QAAQ,SAAS,EAAE,MAAM,UAAU,CAC2B,CAAC,CAAC;CAE7E,MAAM,aAAa,MAAM,UAAU,GAAG,SAAS;CAC/C,MAAM,cAAc,MAAM,UAAU,GAAG,UAAU;CACjD,MAAM,aAAa,WAAW,cAAc;CAE5C,MAAM,eAAe,cAAe,SAAS,IAAI,IAAI,cAAc,IAAI,IAAI,IAAK,CAAC,IAAI,CAAC;CAKtF,MAAM,SAFe,gBAEK,CAAC,EAAE,SAASA,iBAAS,UAAU,KAAKA,iBAAS;CAEvE,MAAM,UAAU,SAAS,IAAI,IAC3B,oBAAC,gBAAD;EACY;EACA;EACA;EACA;EACE;EACD;YAEX,qBAAC,EAAE,KAAH,aACG,cACA,CAAC,CAAC,YACD,8CAAE,QAEA,oBAAC,MAAD;GAAM,SAAQ;GAAQ,GAAI;aACvB;EACG,EACN,IAEC;CACO,KAEhB,oBAAC,gBAAD;EAA0B;EAAoB;EAAoB;EAAoB;YACnF;CACa;CAKlB,MAAM,WAAW,eAAe,QAAQ,IAAM,SAAiB,OAAQ,SAAiB,OAAO,MAAO;CACtG,MAAM,cACJ,YAAY,QACP,OAAuB;EACtB,KAAK,aAAa,EAAE;EACpB,IAAI,OAAO,aAAa,YAAY,SAAS,EAAE;OAC1C,IAAI,YAAY,OAAO,aAAa,UAAU,AAAC,SAA6C,UAAU;CAC7G,IACA,KAAK;CAQX,OACE,8CARmB,eAAe,QAAQ,IACxC,aAAa,UAAqC;EAChD,KAAK;EACL,GAAG,kBAAkB;CACvB,CAAC,IACD,UAKC,aACC,oBAAC,gBAAD;EAAwD,MAAM,cAAc;YAC1E,qBAAC,OAAD;GACE,KAAK,KAAK;GACV,OAAO;IAAE,GAAG;IAAgB,GAAG;IAAkB;GAAO;GACxD,GAAI,iBAAiB;aAHvB,CAKG,SACA,aAAa,oBAAC,eAAD;IAAe,KAAK;IAAmB;IAAS,MAAM;IAAY,OAAO;IAAI,QAAQ;GAAI,EACpG;;CACS,GATK,aAAa,WAAW,SAS7B,CAElB;AAEN;AAEA,QAAQ,cAAc"}
+{"version":3,"file":"tooltip.js","names":["zIndices"],"sources":["../../src/tooltip/tooltip.tsx"],"sourcesContent":["import {\n  arrow,\n  autoUpdate,\n  flip,\n  FloatingArrow,\n  FloatingPortal,\n  offset,\n  safePolygon,\n  shift,\n  useFloating,\n  useHover,\n  useInteractions,\n  useRole,\n  useTransitionStyles,\n} from '@floating-ui/react'\nimport { cloneElement, isValidElement, useMemo, useRef, useState } from 'react'\n\nimport type { TooltipProps } from './tooltip.types'\n\nimport { useTh, useUp, v } from '../core'\nimport { Link } from '../link'\nimport { useModalContext } from '../modal/context'\nimport { zIndices } from '../theme'\nimport { isString } from '../utils'\nimport { bg } from './consts'\nimport { TooltipContent } from './tooltipContent'\n\nconst stripHtmlTags = (html: string): string => {\n  const withoutTags = html.replace(/<[^>]*>/g, '')\n  // Decode HTML entities\n  const textarea = document.createElement('textarea')\n  textarea.innerHTML = withoutTags\n  return textarea.value\n}\n\n/**\n * A simple text popup hint.\n *\n * Displayed on mouse enter, and is hidden on mouse leave.\n *\n * */\nexport const Tooltip = (props: TooltipProps) => {\n  const {\n    children,\n    fontSize = '16px',\n    linkText,\n    linkProps,\n    minWidth,\n    maxWidth = '400px',\n    text = '',\n    placement = 'top',\n    disabled = false,\n    visible = false,\n    offset: offsetProp = [0, 0],\n    whiteSpace = 'pre-wrap',\n    wordBreak = 'break-word',\n    portalRoot = undefined,\n  } = props\n\n  const isDesktop = useUp('md')\n  const [isOpen, setIsOpen] = useState(visible)\n  const arrowRef = useRef(null)\n\n  const middleware = useMemo(\n    () => [\n      offset({ mainAxis: offsetProp[1] + 6, crossAxis: offsetProp[0] }), // +6 for arrow\n      flip(),\n      shift(),\n      arrow({ element: arrowRef }),\n    ],\n\n    [offsetProp[0], offsetProp[1]],\n  )\n\n  const { refs, floatingStyles, context } = useFloating({\n    open: visible || isOpen,\n    onOpenChange: setIsOpen,\n    placement,\n    middleware,\n    whileElementsMounted: autoUpdate,\n  })\n  // Opacity-only transition - no position movement\n  const { isMounted, styles: transitionStyles } = useTransitionStyles(context, {\n    duration: 150,\n    initial: { opacity: 0 },\n    open: { opacity: 1 },\n    close: { opacity: 0 },\n  })\n  const hover = useHover(context, { move: false, handleClose: safePolygon() })\n  const role = useRole(context, { role: 'tooltip' })\n  const { getReferenceProps, getFloatingProps } = useInteractions([hover, role])\n\n  const darkBlue18 = useTh(`colors.${bg.regular}`)\n  const sandstone55 = useTh(`colors.${bg.disabled}`)\n  const arrowColor = disabled ? sandstone55 : darkBlue18\n\n  const strippedText = useMemo(() => (isString(text) ? stripHtmlTags(text) : ''), [text])\n\n  // Get parent modal context to determine if tooltip is inside a modal\n  const modalContext = useModalContext()\n  // If inside a modal, use popover z-index + offset; otherwise use standard tooltip z-index\n  const zIndex = modalContext?.zIndex ? zIndices.popover + 10 : zIndices.tooltip\n\n  const content = isString(text) ? (\n    <TooltipContent\n      disabled={disabled}\n      fontSize={fontSize}\n      maxWidth={maxWidth}\n      minWidth={minWidth}\n      whiteSpace={whiteSpace}\n      wordBreak={wordBreak}\n    >\n      <v.div>\n        {strippedText}\n        {!!linkText && (\n          <>\n            &nbsp;\n            <Link variant=\"white\" {...linkProps}>\n              {linkText}\n            </Link>\n          </>\n        )}\n      </v.div>\n    </TooltipContent>\n  ) : (\n    <TooltipContent disabled={disabled} fontSize={fontSize} maxWidth={maxWidth} minWidth={minWidth}>\n      {text}\n    </TooltipContent>\n  )\n\n  // Clone the child element to add ref and props.\n  // Compose refs so any existing ref on the child is preserved alongside the floating reference ref.\n  const childRef = isValidElement(children) ? ((children as any).ref ?? (children as any).props?.ref) : null\n  const composedRef =\n    childRef != null\n      ? (el: Element | null) => {\n          refs.setReference(el)\n          if (typeof childRef === 'function') childRef(el)\n          else if (childRef && typeof childRef === 'object') (childRef as React.MutableRefObject<unknown>).current = el\n        }\n      : refs.setReference\n  const childElement = isValidElement(children)\n    ? cloneElement(children as React.ReactElement<any>, {\n        ref: composedRef,\n        ...getReferenceProps(),\n      })\n    : children\n\n  return (\n    <>\n      {childElement}\n      {isMounted && (\n        <FloatingPortal key={portalRoot ? 'custom' : 'default'} root={portalRoot ?? undefined}>\n          <div\n            ref={refs.setFloating}\n            style={{ ...floatingStyles, ...transitionStyles, zIndex }}\n            {...getFloatingProps()}\n          >\n            {content}\n            {isDesktop && <FloatingArrow ref={arrowRef} context={context} fill={arrowColor} width={12} height={6} />}\n          </div>\n        </FloatingPortal>\n      )}\n    </>\n  )\n}\n\nTooltip.displayName = 'Tooltip'\n\nexport default Tooltip\n"],"mappings":";;;;;;;;;;;;;;AA2BA,MAAM,iBAAiB,SAAyB;CAC9C,MAAM,cAAc,KAAK,QAAQ,YAAY,EAAE;CAE/C,MAAM,WAAW,SAAS,cAAc,UAAU;CAClD,SAAS,YAAY;CACrB,OAAO,SAAS;AAClB;;;;;;;AAQA,MAAa,WAAW,UAAwB;CAC9C,MAAM,EACJ,UACA,WAAW,QACX,UACA,WACA,UACA,WAAW,SACX,OAAO,IACP,YAAY,OACZ,WAAW,OACX,UAAU,OACV,QAAQ,aAAa,CAAC,GAAG,CAAC,GAC1B,aAAa,YACb,YAAY,cACZ,aAAa,WACX;CAEJ,MAAM,YAAY,MAAM,IAAI;CAC5B,MAAM,CAAC,QAAQ,aAAa,SAAS,OAAO;CAC5C,MAAM,WAAW,OAAO,IAAI;CAE5B,MAAM,aAAa,cACX;EACJ,OAAO;GAAE,UAAU,WAAW,KAAK;GAAG,WAAW,WAAW;EAAG,CAAC;EAChE,KAAK;EACL,MAAM;EACN,MAAM,EAAE,SAAS,SAAS,CAAC;CAC7B,GAEA,CAAC,WAAW,IAAI,WAAW,EAAE,CAC/B;CAEA,MAAM,EAAE,MAAM,gBAAgB,YAAY,YAAY;EACpD,MAAM,WAAW;EACjB,cAAc;EACd;EACA;EACA,sBAAsB;CACxB,CAAC;CAED,MAAM,EAAE,WAAW,QAAQ,qBAAqB,oBAAoB,SAAS;EAC3E,UAAU;EACV,SAAS,EAAE,SAAS,EAAE;EACtB,MAAM,EAAE,SAAS,EAAE;EACnB,OAAO,EAAE,SAAS,EAAE;CACtB,CAAC;CAGD,MAAM,EAAE,mBAAmB,qBAAqB,gBAAgB,CAFlD,SAAS,SAAS;EAAE,MAAM;EAAO,aAAa,YAAY;CAAE,CAEL,GADxD,QAAQ,SAAS,EAAE,MAAM,UAAU,CAC2B,CAAC,CAAC;CAE7E,MAAM,aAAa,MAAM,UAAU,GAAG,SAAS;CAC/C,MAAM,cAAc,MAAM,UAAU,GAAG,UAAU;CACjD,MAAM,aAAa,WAAW,cAAc;CAE5C,MAAM,eAAe,cAAe,SAAS,IAAI,IAAI,cAAc,IAAI,IAAI,IAAK,CAAC,IAAI,CAAC;CAKtF,MAAM,SAFe,gBAEK,CAAC,EAAE,SAASA,iBAAS,UAAU,KAAKA,iBAAS;CAEvE,MAAM,UAAU,SAAS,IAAI,IAC3B,oBAAC,gBAAD;EACY;EACA;EACA;EACA;EACE;EACD;YAEX,qBAAC,EAAE,KAAH,aACG,cACA,CAAC,CAAC,YACD,8CAAE,QAEA,oBAAC,MAAD;GAAM,SAAQ;GAAQ,GAAI;aACvB;EACG,EACN,IAEC;CACO,KAEhB,oBAAC,gBAAD;EAA0B;EAAoB;EAAoB;EAAoB;YACnF;CACa;CAKlB,MAAM,WAAW,eAAe,QAAQ,IAAM,SAAiB,OAAQ,SAAiB,OAAO,MAAO;CACtG,MAAM,cACJ,YAAY,QACP,OAAuB;EACtB,KAAK,aAAa,EAAE;EACpB,IAAI,OAAO,aAAa,YAAY,SAAS,EAAE;OAC1C,IAAI,YAAY,OAAO,aAAa,UAAU,AAAC,SAA6C,UAAU;CAC7G,IACA,KAAK;CAQX,OACE,8CARmB,eAAe,QAAQ,IACxC,aAAa,UAAqC;EAChD,KAAK;EACL,GAAG,kBAAkB;CACvB,CAAC,IACD,UAKC,aACC,oBAAC,gBAAD;EAAwD,MAAM,cAAc;YAC1E,qBAAC,OAAD;GACE,KAAK,KAAK;GACV,OAAO;IAAE,GAAG;IAAgB,GAAG;IAAkB;GAAO;GACxD,GAAI,iBAAiB;aAHvB,CAKG,SACA,aAAa,oBAAC,eAAD;IAAe,KAAK;IAAmB;IAAS,MAAM;IAAY,OAAO;IAAI,QAAQ;GAAI,EACpG;;CACS,GATK,aAAa,WAAW,SAS7B,CAElB;AAEN;AAEA,QAAQ,cAAc"}

package/dist/tooltip/tooltipContent.js

@@ -24,5 +24,5 @@ TooltipContent.displayName = "TooltipContent";
 
 //#endregion
 export { TooltipContent };
-globalThis.__vuiVersion__ = "5.3.0-alpha.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=tooltipContent.js.map

package/dist/tree/context.js

@@ -5,5 +5,5 @@ const [TreeProvider, useTreeContext] = createContext({ isOptional: true });
 
 //#endregion
 export { TreeProvider, useTreeContext };
-globalThis.__vuiVersion__ = "5.3.0-alpha.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=context.js.map

package/dist/tree/theme.js

@@ -76,5 +76,5 @@ var theme_default = {
 
 //#endregion
 export { theme_default as default };
-globalThis.__vuiVersion__ = "5.3.0-alpha.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=theme.js.map

package/dist/tree/tree.js

@@ -99,5 +99,5 @@ Tree.displayName = "Tree";
 
 //#endregion
 export { Tree, Tree as default, TreeBase };
-globalThis.__vuiVersion__ = "5.3.0-alpha.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=tree.js.map

package/dist/tree/treeIcon.js

@@ -22,5 +22,5 @@ TreeIcon.displayName = "TreeIcon";
 
 //#endregion
 export { TreeIcon, TreeIcon as default };
-globalThis.__vuiVersion__ = "5.3.0-alpha.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=treeIcon.js.map

package/dist/tree/treeItem.js

@@ -126,5 +126,5 @@ TreeItem.displayName = "TreeItem";
 
 //#endregion
 export { TreeItem, TreeItem as default, TreeItemBase };
-globalThis.__vuiVersion__ = "5.3.0-alpha.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=treeItem.js.map

package/dist/tree/treeText.js

@@ -24,5 +24,5 @@ TreeText.displayName = "TreeText";
 
 //#endregion
 export { TreeText, TreeText as default };
-globalThis.__vuiVersion__ = "5.3.0-alpha.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=treeText.js.map

package/dist/tree/useTreeState.js

@@ -14,5 +14,5 @@ const useTreeState = (activeItemId) => {
 
 //#endregion
 export { useTreeState };
-globalThis.__vuiVersion__ = "5.3.0-alpha.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=useTreeState.js.map

package/dist/tutorial/consts.js

@@ -7,5 +7,5 @@ const tutorialColors = {
 
 //#endregion
 export { tutorialColors };
-globalThis.__vuiVersion__ = "5.3.0-alpha.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=consts.js.map

package/dist/tutorial/tutorial.js

@@ -41,5 +41,5 @@ Tutorial.displayName = "Tutorial";
 
 //#endregion
 export { Tutorial };
-globalThis.__vuiVersion__ = "5.3.0-alpha.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=tutorial.js.map

package/dist/tutorial/tutorialCard.js

@@ -65,7 +65,9 @@ function TutorialCard({ actionLabel = "Action", className, title, readMoreLink,
 					children: useContentTitle ? steps[activeStep]?.step?.title : title
 				}), !isFinalStep && /* @__PURE__ */ jsx(DismissButton, {
 					"aria-label": "close",
-					onClick: onDismiss
+					icon: "uiTimes",
+					onClick: onDismiss,
+					scale: 2
 				})]
 			}),
 			/* @__PURE__ */ jsx(Box, {
@@ -156,5 +158,5 @@ TutorialCard.displayName = "TutorialCard";
 
 //#endregion
 export { TutorialCard };
-globalThis.__vuiVersion__ = "5.3.0-alpha.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=tutorialCard.js.map

package/dist/tutorial/tutorialCard.js.map

@@ -1 +1 @@
-{"version":3,"file":"tutorialCard.js","names":[],"sources":["../../src/tutorial/tutorialCard.tsx"],"sourcesContent":["import { useEffect, useState } from 'react'\n\nimport { styled } from '../core'\nimport { Box, Button, Card, DismissButton, H4, Icon, IconButton } from '../index'\nimport { tutorialColors } from './consts'\n\nconst TutorialHeader = styled(Box)`\n  display: flex;\n  flex-direction: row;\n  flex: 0;\n  flex-grow: 0;\n  -webkit-flex-grow: 0;\n  align-content: center;\n  align-items: center;\n  justify-content: space-between;\n  min-height: 48px;\n  --vui-dismiss-fg: var(--vui-action-contrast-solid);\n`\nimport type { TutorialCardProps, TutorialDataStep, TutorialStepWrapper } from './tutorial.types'\n\nimport { TutorialStep } from './tutorialStep'\n\nexport function TutorialCard({\n  actionLabel = 'Action',\n  className,\n  title,\n  readMoreLink,\n  steps: propsSteps = [],\n  showSkipButton,\n  onAction,\n  onDismiss,\n  onFinish,\n  includeFinalPage,\n  useContentTitle,\n}: TutorialCardProps) {\n  const [steps, setSteps] = useState<TutorialStepWrapper[]>([])\n  const [activeStep, setActiveStep] = useState<number>(0)\n\n  useEffect(() => {\n    if (title && propsSteps.length) {\n      const s = propsSteps.map((step, key) => ({ active: false, step, key }))\n\n      const finalStep: TutorialDataStep = {\n        title: `Completed!`,\n        content: `${readMoreLink ? 'To learn more, please visit:' : 'Thank you!'}`,\n      }\n\n      if (readMoreLink) finalStep.readMoreLink = readMoreLink\n\n      includeFinalPage ? setSteps([...s, { step: finalStep, key: propsSteps.length }]) : setSteps([...s])\n    }\n  }, [title, propsSteps])\n\n  const isStartStep = activeStep === 0\n  const isFinalStep = includeFinalPage ? activeStep === propsSteps.length : activeStep === propsSteps.length - 1\n\n  return (\n    <Card\n      bg={tutorialColors.bg}\n      className={className}\n      color={tutorialColors.color}\n      column\n      justifyContent=\"space-between\"\n      minH={400}\n      px={3}\n      py={2}\n      w={580}\n    >\n      <TutorialHeader className={className + '__header'}>\n        <H4 color={tutorialColors.color}>{useContentTitle ? steps[activeStep]?.step?.title : title}</H4>\n        {!isFinalStep && <DismissButton aria-label=\"close\" onClick={onDismiss} />}\n      </TutorialHeader>\n      <Box flex={5} row>\n        {steps?.map?.(s => (\n          <TutorialStep\n            active={s.key === activeStep}\n            content={s.step.content}\n            key={s.step.title}\n            readMoreLink={s.step.readMoreLink}\n            title={s.step.title}\n            useContentTitle={useContentTitle}\n          />\n        ))}\n      </Box>\n      <Box alignItems=\"center\" justifyContent=\"space-between\" mt={0}>\n        <Box alignItems=\"center\" justifyContent=\"space-between\" w=\"-webkit-fill-available\">\n          <IconButton\n            aria-label=\"previous\"\n            color={tutorialColors.buttonColor}\n            disabled={isStartStep}\n            icon=\"uiArrowLeft\"\n            onClick={() => setActiveStep(activeStep - 1)}\n            scale={2}\n            transition=\"none\"\n            variant=\"tertiary\"\n          />\n          <Box className=\"vuiTutorialStepDots\">\n            {steps?.map?.(s => (\n              <Icon\n                color={s.key === activeStep ? tutorialColors.color : 'darkBlue.30'}\n                cursor=\"pointer\"\n                hoverColor={tutorialColors.buttonColor}\n                key={s.key}\n                name=\"uiDotFull\"\n                onClick={() => setActiveStep(s.key)}\n              />\n            ))}\n          </Box>\n          <IconButton\n            aria-label=\"next\"\n            color={tutorialColors.buttonColor}\n            disabled={isFinalStep}\n            icon=\"uiArrowRight\"\n            onClick={() => setActiveStep(activeStep + 1)}\n            scale={2}\n            transition=\"none\"\n            variant=\"tertiary\"\n          />\n        </Box>\n        {(showSkipButton || isFinalStep || !!onAction) && (\n          <Box alignItems=\"center\" justifyContent=\"space-between\">\n            {showSkipButton && !isFinalStep && (\n              <Button mx={1} onClick={onDismiss} variant=\"secondary\" intent=\"contrast\">\n                Skip\n              </Button>\n            )}\n            {isFinalStep && (\n              <Button mx={1} onClick={onFinish} variant=\"primary\" intent=\"contrast\" minW=\"82px\">\n                I got it\n              </Button>\n            )}\n            {!!onAction && (\n              <Button\n                ml={1}\n                mr={showSkipButton || isFinalStep ? 12 : 2}\n                onClick={onAction}\n                variant=\"primary\"\n                intent=\"contrast\"\n              >\n                {actionLabel}\n              </Button>\n            )}\n          </Box>\n        )}\n      </Box>\n    </Card>\n  )\n}\n\nTutorialCard.displayName = 'TutorialCard'\n"],"mappings":"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"}
+{"version":3,"file":"tutorialCard.js","names":[],"sources":["../../src/tutorial/tutorialCard.tsx"],"sourcesContent":["import { useEffect, useState } from 'react'\n\nimport { styled } from '../core'\nimport { Box, Button, Card, DismissButton, H4, Icon, IconButton } from '../index'\nimport { tutorialColors } from './consts'\n\nconst TutorialHeader = styled(Box)`\n  display: flex;\n  flex-direction: row;\n  flex: 0;\n  flex-grow: 0;\n  -webkit-flex-grow: 0;\n  align-content: center;\n  align-items: center;\n  justify-content: space-between;\n  min-height: 48px;\n  --vui-dismiss-fg: var(--vui-action-contrast-solid);\n`\nimport type { TutorialCardProps, TutorialDataStep, TutorialStepWrapper } from './tutorial.types'\n\nimport { TutorialStep } from './tutorialStep'\n\nexport function TutorialCard({\n  actionLabel = 'Action',\n  className,\n  title,\n  readMoreLink,\n  steps: propsSteps = [],\n  showSkipButton,\n  onAction,\n  onDismiss,\n  onFinish,\n  includeFinalPage,\n  useContentTitle,\n}: TutorialCardProps) {\n  const [steps, setSteps] = useState<TutorialStepWrapper[]>([])\n  const [activeStep, setActiveStep] = useState<number>(0)\n\n  useEffect(() => {\n    if (title && propsSteps.length) {\n      const s = propsSteps.map((step, key) => ({ active: false, step, key }))\n\n      const finalStep: TutorialDataStep = {\n        title: `Completed!`,\n        content: `${readMoreLink ? 'To learn more, please visit:' : 'Thank you!'}`,\n      }\n\n      if (readMoreLink) finalStep.readMoreLink = readMoreLink\n\n      includeFinalPage ? setSteps([...s, { step: finalStep, key: propsSteps.length }]) : setSteps([...s])\n    }\n  }, [title, propsSteps])\n\n  const isStartStep = activeStep === 0\n  const isFinalStep = includeFinalPage ? activeStep === propsSteps.length : activeStep === propsSteps.length - 1\n\n  return (\n    <Card\n      bg={tutorialColors.bg}\n      className={className}\n      color={tutorialColors.color}\n      column\n      justifyContent=\"space-between\"\n      minH={400}\n      px={3}\n      py={2}\n      w={580}\n    >\n      <TutorialHeader className={className + '__header'}>\n        <H4 color={tutorialColors.color}>{useContentTitle ? steps[activeStep]?.step?.title : title}</H4>\n        {!isFinalStep && <DismissButton aria-label=\"close\" icon=\"uiTimes\" onClick={onDismiss} scale={2} />}\n      </TutorialHeader>\n      <Box flex={5} row>\n        {steps?.map?.(s => (\n          <TutorialStep\n            active={s.key === activeStep}\n            content={s.step.content}\n            key={s.step.title}\n            readMoreLink={s.step.readMoreLink}\n            title={s.step.title}\n            useContentTitle={useContentTitle}\n          />\n        ))}\n      </Box>\n      <Box alignItems=\"center\" justifyContent=\"space-between\" mt={0}>\n        <Box alignItems=\"center\" justifyContent=\"space-between\" w=\"-webkit-fill-available\">\n          <IconButton\n            aria-label=\"previous\"\n            color={tutorialColors.buttonColor}\n            disabled={isStartStep}\n            icon=\"uiArrowLeft\"\n            onClick={() => setActiveStep(activeStep - 1)}\n            scale={2}\n            transition=\"none\"\n            variant=\"tertiary\"\n          />\n          <Box className=\"vuiTutorialStepDots\">\n            {steps?.map?.(s => (\n              <Icon\n                color={s.key === activeStep ? tutorialColors.color : 'darkBlue.30'}\n                cursor=\"pointer\"\n                hoverColor={tutorialColors.buttonColor}\n                key={s.key}\n                name=\"uiDotFull\"\n                onClick={() => setActiveStep(s.key)}\n              />\n            ))}\n          </Box>\n          <IconButton\n            aria-label=\"next\"\n            color={tutorialColors.buttonColor}\n            disabled={isFinalStep}\n            icon=\"uiArrowRight\"\n            onClick={() => setActiveStep(activeStep + 1)}\n            scale={2}\n            transition=\"none\"\n            variant=\"tertiary\"\n          />\n        </Box>\n        {(showSkipButton || isFinalStep || !!onAction) && (\n          <Box alignItems=\"center\" justifyContent=\"space-between\">\n            {showSkipButton && !isFinalStep && (\n              <Button mx={1} onClick={onDismiss} variant=\"secondary\" intent=\"contrast\">\n                Skip\n              </Button>\n            )}\n            {isFinalStep && (\n              <Button mx={1} onClick={onFinish} variant=\"primary\" intent=\"contrast\" minW=\"82px\">\n                I got it\n              </Button>\n            )}\n            {!!onAction && (\n              <Button\n                ml={1}\n                mr={showSkipButton || isFinalStep ? 12 : 2}\n                onClick={onAction}\n                variant=\"primary\"\n                intent=\"contrast\"\n              >\n                {actionLabel}\n              </Button>\n            )}\n          </Box>\n        )}\n      </Box>\n    </Card>\n  )\n}\n\nTutorialCard.displayName = 'TutorialCard'\n"],"mappings":"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"}

package/dist/tutorial/tutorialStep.js

@@ -20,5 +20,5 @@ TutorialStep.displayName = "TutorialStep";
 
 //#endregion
 export { TutorialStep };
-globalThis.__vuiVersion__ = "5.3.0-alpha.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=tutorialStep.js.map

package/dist/utils/array.js

@@ -18,5 +18,5 @@ function toggleItem(array, item) {
 
 //#endregion
 export { compareBy, toggleItem };
-globalThis.__vuiVersion__ = "5.3.0-alpha.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=array.js.map

package/dist/utils/assertion.js

@@ -32,5 +32,5 @@ function isString(value) {
 
 //#endregion
 export { isArray, isFunction, isJsx, isNumber, isObject, isReactText, isString };
-globalThis.__vuiVersion__ = "5.3.0-alpha.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=assertion.js.map

package/dist/utils/consts.js

@@ -6,5 +6,5 @@ const dimmedBorderColor = "grey.40";
 
 //#endregion
 export { __DEV__, activeClassName, activeItemShade, dimmedBorderColor };
-globalThis.__vuiVersion__ = "5.3.0-alpha.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=consts.js.map

package/dist/utils/dates.js

@@ -55,5 +55,5 @@ const getCurrentYear = () => {
 
 //#endregion
 export { formatIsoDate, generateDateByUTCValue, getCurrentYear, getDateUTCValue, isValidDate, parseIsoDate, sameDate, sameYear, sameYearSameMonth, utcDateToLocale, validateDateFormat };
-globalThis.__vuiVersion__ = "5.3.0-alpha.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=dates.js.map

package/dist/utils/dom.js

@@ -12,5 +12,5 @@ const removeBodyClass = (className) => document.body.classList.remove(className)
 
 //#endregion
 export { addBodyClass, addElement, removeBodyClass, removeElement };
-globalThis.__vuiVersion__ = "5.3.0-alpha.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=dom.js.map

package/dist/utils/formatDate.js

@@ -79,5 +79,5 @@ function formatDate(date, format = "DD MM YYYY", options) {
 
 //#endregion
 export { dateFormats, formatDate };
-globalThis.__vuiVersion__ = "5.3.0-alpha.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=formatDate.js.map

package/dist/utils/function.js

@@ -16,5 +16,5 @@ function runIfFn(valueOrFn, ...args) {
 
 //#endregion
 export { callAll, noop, runIfFn };
-globalThis.__vuiVersion__ = "5.3.0-alpha.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=function.js.map

package/dist/utils/images.js

@@ -20,5 +20,5 @@ function loadImageUrl(url) {
 
 //#endregion
 export { loadImageUrl };
-globalThis.__vuiVersion__ = "5.3.0-alpha.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=images.js.map

package/dist/utils/number.js

@@ -6,5 +6,5 @@ function random(start = 0, end = 1e6) {
 
 //#endregion
 export { random };
-globalThis.__vuiVersion__ = "5.3.0-alpha.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=number.js.map

package/dist/utils/object.js

@@ -32,5 +32,5 @@ function objectFilter(object, fn) {
 
 //#endregion
 export { filterUndefined, merge, objectFilter };
-globalThis.__vuiVersion__ = "5.3.0-alpha.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=object.js.map

package/dist/utils/react.js

@@ -109,5 +109,5 @@ function useIsMounted() {
 
 //#endregion
 export { assignRef, createContext$1 as createContext, mergeRefs, useCallbackRef, useClickOutside, useControlled, useIds, useIsMounted };
-globalThis.__vuiVersion__ = "5.3.0-alpha.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=react.js.map

package/dist/utils/string.js

@@ -19,5 +19,5 @@ const generateMenuItemId = (title, level = 0) => {
 
 //#endregion
 export { generateMenuItemId, normalizeToId };
-globalThis.__vuiVersion__ = "5.3.0-alpha.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=string.js.map

package/dist/utils/styles.js

@@ -75,5 +75,5 @@ const ellipsisOverflow = {
 
 //#endregion
 export { HSLToRGBA, cs, ellipsisOverflow, hexToRGBA, parseHSL, vuiColorToRGBA };
-globalThis.__vuiVersion__ = "5.3.0-alpha.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=styles.js.map

package/dist/utils/uid.js

@@ -3,5 +3,5 @@ const uid = (prefix) => `${prefix ? `${prefix}_` : ""}${Date.now().toString(36)
 
 //#endregion
 export { uid };
-globalThis.__vuiVersion__ = "5.3.0-alpha.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=uid.js.map

package/dist/utils/window.js

@@ -3,5 +3,5 @@ const isActivePath = (path) => !!path && window.location.pathname.includes(path)
 
 //#endregion
 export { isActivePath };
-globalThis.__vuiVersion__ = "5.3.0-alpha.2"
+globalThis.__vuiVersion__ = "5.3.0"
 //# sourceMappingURL=window.js.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@veracity/vui",
-  "version": "5.3.0-alpha.manual.2608050712",
+  "version": "5.3.0",
   "description": "Veracity UI is a React component library crafted for use within Veracity applications and pages. Based on Styled Components and @xstyled.",
   "keywords": [
     "tanstack-intent"

package/dist/stepper/index.d.ts

@@ -1,6 +0,0 @@
-import { StepperIndicatorProps, StepperIndicatorSize, StepperIndicatorVariant } from "./stepperIndicatorTypes.js";
-import { StepperOrientation, StepperProps, StepperSize, StepperStepProps } from "./stepperTypes.js";
-import { Stepper } from "./stepper.js";
-import { StepperIndicator } from "./stepperIndicator.js";
-import { StepperStep } from "./stepperStep.js";
-export { Stepper, StepperIndicator, type StepperIndicatorProps, type StepperIndicatorSize, type StepperIndicatorVariant, type StepperOrientation, type StepperProps, type StepperSize, StepperStep, type StepperStepProps };

package/dist/stepper/stepper.d.ts

@@ -1,9 +0,0 @@
-import { VuiComponent } from "../core/vui.js";
-import { StepperProps } from "./stepperTypes.js";
-import "../index.js";
-//#region src/stepper/stepper.d.ts
-declare const Stepper: VuiComponent<"div", StepperProps>;
-//#endregion
-export { Stepper, Stepper as default };
-
-//# sourceMappingURL=stepper.d.ts.map

package/dist/stepper/stepper.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"stepper.d.ts","names":[],"sources":["../../src/stepper/stepper.tsx"],"mappings":";;;;cA2Ba,SAAO,oBAAA"}

package/dist/stepper/stepper.js

@@ -1,47 +0,0 @@
-import { filterUndefined } from "../utils/object.js";
-import { cs } from "../utils/styles.js";
-import styled from "../core/styled.js";
-import vui from "../core/vui.js";
-import { CLASS } from "./stepperConsts.js";
-import { StepperProvider } from "./stepperContext.js";
-import { useMemo } from "react";
-import { jsx } from "react/jsx-runtime";
-
-//#region src/stepper/stepper.tsx
-const StepperHorizontalBase = styled.divBox`
-  display: flex;
-  overflow: hidden;
-  width: 100%;
-
-  .${CLASS.step}:last-of-type .${CLASS.tail} {
-    display: none;
-  }
-`;
-const StepperVerticalBase = styled.divBox`
-  width: 100%;
-
-  .${CLASS.step}:last-of-type > .${CLASS.tail} {
-    display: none;
-  }
-`;
-const Stepper = vui((props, ref) => {
-	const { children, className, orientation = "horizontal", size, ...rest } = props;
-	return /* @__PURE__ */ jsx(StepperProvider, {
-		value: useMemo(() => filterUndefined({
-			orientation,
-			size
-		}), [orientation, size]),
-		children: /* @__PURE__ */ jsx(orientation === "vertical" ? StepperVerticalBase : StepperHorizontalBase, {
-			className: cs("vui-stepper", className),
-			ref,
-			...rest,
-			children
-		})
-	});
-});
-Stepper.displayName = "Stepper";
-
-//#endregion
-export { Stepper, Stepper as default };
-globalThis.__vuiVersion__ = "5.3.0-alpha.2"
-//# sourceMappingURL=stepper.js.map

package/dist/stepper/stepper.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"stepper.js","names":[],"sources":["../../src/stepper/stepper.tsx"],"sourcesContent":["import { useMemo } from 'react'\n\nimport type { StepperProps } from './stepperTypes'\n\nimport { styled, useStyleConfig, vui } from '../core'\nimport { cs, filterUndefined } from '../utils'\nimport { CLASS } from './stepperConsts'\nimport { StepperProvider } from './stepperContext'\n\nconst StepperHorizontalBase = styled.divBox`\n  display: flex;\n  overflow: hidden;\n  width: 100%;\n\n  .${CLASS.step}:last-of-type .${CLASS.tail} {\n    display: none;\n  }\n`\n\nconst StepperVerticalBase = styled.divBox`\n  width: 100%;\n\n  .${CLASS.step}:last-of-type > .${CLASS.tail} {\n    display: none;\n  }\n`\n\nexport const Stepper = vui<'div', StepperProps>((props, ref) => {\n  const { children, className, orientation = 'horizontal', size, ...rest } = props\n  const context = useMemo(() => filterUndefined({ orientation, size }), [orientation, size])\n\n  const Base = orientation === 'vertical' ? StepperVerticalBase : StepperHorizontalBase\n\n  return (\n    <StepperProvider value={context}>\n      <Base className={cs('vui-stepper', className)} ref={ref} {...rest}>\n        {children}\n      </Base>\n    </StepperProvider>\n  )\n})\n\nStepper.displayName = 'Stepper'\n\nexport default Stepper\n"],"mappings":";;;;;;;;;;AASA,MAAM,wBAAwB,OAAO,MAAM;;;;;KAKtC,MAAM,KAAK,iBAAiB,MAAM,KAAK;;;;AAK5C,MAAM,sBAAsB,OAAO,MAAM;;;KAGpC,MAAM,KAAK,mBAAmB,MAAM,KAAK;;;;AAK9C,MAAa,UAAU,KAA0B,OAAO,QAAQ;CAC9D,MAAM,EAAE,UAAU,WAAW,cAAc,cAAc,MAAM,GAAG,SAAS;CAK3E,OACE,oBAAC,iBAAD;EAAiB,OALH,cAAc,gBAAgB;GAAE;GAAa;EAAK,CAAC,GAAG,CAAC,aAAa,IAAI,CAKxD;YAC5B,oBAJS,gBAAgB,aAAa,sBAAsB,uBAI5D;GAAM,WAAW,GAAG,eAAe,SAAS;GAAQ;GAAK,GAAI;GAC1D;EACG;CACS;AAErB,CAAC;AAED,QAAQ,cAAc"}

package/dist/stepper/stepperConsts.js

@@ -1,29 +0,0 @@
-//#region src/stepper/stepperConsts.ts
-const STEP = "vui-stepperStep";
-const CLASS = {
-	step: STEP,
-	tail: `${STEP}Tail`,
-	tailLeft: `${STEP}TailLeft`,
-	tailRight: `${STEP}TailRight`,
-	tailLeftIcon: `${STEP}TailLeftIcon`,
-	tailRightIcon: `${STEP}TailRightIcon`,
-	title: `${STEP}Title`
-};
-const CSS_VARS = {
-	vertGap: "--vui-stepper-vert-gap",
-	horizTailHeight: "--vui-stepper-horiz-tail-height",
-	vertTailMaxWidth: "--vui-stepper-vert-tail-max-width",
-	tailColor: "--vui-stepper-tail-color",
-	iconTailColor: "--vui-stepper-icon-tail-color",
-	titleColor: "--vui-stepper-title-color",
-	descColor: "--vui-stepper-desc-color",
-	indicatorBg: "--vui-stepper-indicator-bg",
-	indicatorBorder: "--vui-stepper-indicator-border",
-	indicatorColor: "--vui-stepper-indicator-color",
-	indicatorOutline: "--vui-stepper-indicator-outline"
-};
-
-//#endregion
-export { CLASS, CSS_VARS };
-globalThis.__vuiVersion__ = "5.3.0-alpha.2"
-//# sourceMappingURL=stepperConsts.js.map

package/dist/stepper/stepperConsts.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"stepperConsts.js","names":[],"sources":["../../src/stepper/stepperConsts.ts"],"sourcesContent":["import type { StepperIndicatorVariant } from './stepperIndicatorTypes'\n\nexport const boldTitles: StepperIndicatorVariant[] = ['active', 'error']\n\nconst STEP = 'vui-stepperStep'\n\nexport const CLASS = {\n  step: STEP,\n  tail: `${STEP}Tail`,\n  tailLeft: `${STEP}TailLeft`,\n  tailRight: `${STEP}TailRight`,\n  tailLeftIcon: `${STEP}TailLeftIcon`,\n  tailRightIcon: `${STEP}TailRightIcon`,\n  title: `${STEP}Title`,\n} as const\n\nexport const CSS_VARS = {\n  // Layout (raw CSS values — work as var() fallbacks)\n  vertGap: '--vui-stepper-vert-gap',\n  horizTailHeight: '--vui-stepper-horiz-tail-height',\n  vertTailMaxWidth: '--vui-stepper-vert-tail-max-width',\n  // Colors (xstyled tokens — set after th.color() resolution)\n  tailColor: '--vui-stepper-tail-color',\n  iconTailColor: '--vui-stepper-icon-tail-color',\n  titleColor: '--vui-stepper-title-color',\n  descColor: '--vui-stepper-desc-color',\n  // Indicator circle / icon colors\n  indicatorBg: '--vui-stepper-indicator-bg',\n  indicatorBorder: '--vui-stepper-indicator-border',\n  indicatorColor: '--vui-stepper-indicator-color',\n  // Indicator ring (CSS class only — xstyled breaks if used as prop value)\n  indicatorOutline: '--vui-stepper-indicator-outline',\n} as const\n"],"mappings":";AAIA,MAAM,OAAO;AAEb,MAAa,QAAQ;CACnB,MAAM;CACN,MAAM,GAAG,KAAK;CACd,UAAU,GAAG,KAAK;CAClB,WAAW,GAAG,KAAK;CACnB,cAAc,GAAG,KAAK;CACtB,eAAe,GAAG,KAAK;CACvB,OAAO,GAAG,KAAK;AACjB;AAEA,MAAa,WAAW;CAEtB,SAAS;CACT,iBAAiB;CACjB,kBAAkB;CAElB,WAAW;CACX,eAAe;CACf,YAAY;CACZ,WAAW;CAEX,aAAa;CACb,iBAAiB;CACjB,gBAAgB;CAEhB,kBAAkB;AACpB"}

package/dist/stepper/stepperContext.js

@@ -1,9 +0,0 @@
-import { createContext } from "../utils/react.js";
-
-//#region src/stepper/stepperContext.ts
-const [StepperProvider, useStepperContext] = createContext({ isOptional: true });
-
-//#endregion
-export { StepperProvider, useStepperContext };
-globalThis.__vuiVersion__ = "5.3.0-alpha.2"
-//# sourceMappingURL=stepperContext.js.map

package/dist/stepper/stepperContext.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"stepperContext.js","names":[],"sources":["../../src/stepper/stepperContext.ts"],"sourcesContent":["import type { Dict } from '../utils'\n\nimport { createContext } from '../utils'\n\nconst [StepperProvider, useStepperContext] = createContext<Dict>({ isOptional: true })\n\nexport { StepperProvider, useStepperContext }\n"],"mappings":";;;AAIA,MAAM,CAAC,iBAAiB,qBAAqB,cAAoB,EAAE,YAAY,KAAK,CAAC"}

package/dist/stepper/stepperIndicator.d.ts

@@ -1,13 +0,0 @@
-import { VuiComponent } from "../core/vui.js";
-import { StepperIndicatorProps } from "./stepperIndicatorTypes.js";
-import "../index.js";
-//#region src/stepper/stepperIndicator.d.ts
-/**
- * Renders a step indicator circle with a number, icon, or status variant.
- * Sub-component of the Stepper namespace.
- */
-declare const StepperIndicator: VuiComponent<"div", StepperIndicatorProps>;
-//#endregion
-export { StepperIndicator, StepperIndicator as default };
-
-//# sourceMappingURL=stepperIndicator.d.ts.map

package/dist/stepper/stepperIndicator.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"stepperIndicator.d.ts","names":[],"sources":["../../src/stepper/stepperIndicator.tsx"],"mappings":";;;;;;;;cA6Ca,kBAAgB,oBAAA"}