@giddaa-housing/ui 1.0.0 → 1.2.0

package/dist/toast.js

@@ -1,225 +1,174 @@
-import {
-  Button
-} from "./chunk-B4H6RNDH.js";
-import "./chunk-HL3ZSYES.js";
-import {
-  cn
-} from "./chunk-Y4TTYVNE.js";
-
-// src/toast.tsx
-import { Toast as BaseToast } from "@base-ui/react/toast";
+import { t as cn } from "./cn-BI_4DMBf.js";
+import { Button } from "./button.js";
 import { Check, Info, X } from "lucide-react";
 import { jsx, jsxs } from "react/jsx-runtime";
-var DEFAULT_TOAST_SIDE = "top";
-var DEFAULT_TOAST_ALIGN = "end";
-var toastManager = BaseToast.createToastManager();
-var toast = Object.assign(
-  (options) => toastManager.add(options),
-  {
-    success: (options) => toastManager.add({
-      ...options,
-      data: { type: "success", ...options.data }
-    }),
-    info: (options) => toastManager.add({
-      ...options,
-      data: { type: "info", ...options.data }
-    }),
-    warning: (options) => toastManager.add({
-      ...options,
-      data: { type: "warning", ...options.data }
-    }),
-    error: (options) => toastManager.add({
-      ...options,
-      data: { type: "error", ...options.data }
-    }),
-    loading: (options) => toastManager.add({
-      ...options,
-      data: { type: "loading", ...options.data }
-    }),
-    dismiss: (toastId) => toastManager.close(toastId?.toString()),
-    update: (toastId, options) => toastManager.update(toastId.toString(), options),
-    promise: toastManager.promise
-  }
-);
+import { Toast } from "@base-ui/react/toast";
+//#region src/toast.tsx
+const DEFAULT_TOAST_SIDE = "top";
+const DEFAULT_TOAST_ALIGN = "end";
+const toastManager = Toast.createToastManager();
+const toast = Object.assign((options) => toastManager.add(options), {
+	success: (options) => toastManager.add({
+		...options,
+		data: {
+			type: "success",
+			...options.data
+		}
+	}),
+	info: (options) => toastManager.add({
+		...options,
+		data: {
+			type: "info",
+			...options.data
+		}
+	}),
+	warning: (options) => toastManager.add({
+		...options,
+		data: {
+			type: "warning",
+			...options.data
+		}
+	}),
+	error: (options) => toastManager.add({
+		...options,
+		data: {
+			type: "error",
+			...options.data
+		}
+	}),
+	loading: (options) => toastManager.add({
+		...options,
+		data: {
+			type: "loading",
+			...options.data
+		}
+	}),
+	dismiss: (toastId) => toastManager.close(toastId?.toString()),
+	update: (toastId, options) => toastManager.update(toastId.toString(), options),
+	promise: toastManager.promise
+});
 function ToastProvider({ children }) {
-  return /* @__PURE__ */ jsxs(BaseToast.Provider, { limit: 4, timeout: 5e3, toastManager, children: [
-    children,
-    /* @__PURE__ */ jsx(BaseToast.Portal, { children: /* @__PURE__ */ jsx(BaseToast.Viewport, { className: "fixed inset-0 z-9999 pointer-events-none outline-none", children: /* @__PURE__ */ jsx(ToastList, {}) }) })
-  ] });
+	return /* @__PURE__ */ jsxs(Toast.Provider, {
+		limit: 4,
+		timeout: 5e3,
+		toastManager,
+		children: [children, /* @__PURE__ */ jsx(Toast.Portal, { children: /* @__PURE__ */ jsx(Toast.Viewport, {
+			className: "fixed inset-0 z-9999 pointer-events-none outline-none",
+			children: /* @__PURE__ */ jsx(ToastList, {})
+		}) })]
+	});
 }
 function ToastList() {
-  const { toasts } = BaseToast.useToastManager();
-  const placementStacks = /* @__PURE__ */ new Map();
-  return toasts.map((item) => {
-    const placement = getToastPlacement(item);
-    const stack = placementStacks.get(placement.key) ?? {
-      domIndex: 0,
-      visibleIndex: 0,
-      offsetY: 0,
-      frontmostHeight: item.height
-    };
-    const placementIndex = item.transitionStatus === "ending" ? stack.domIndex : stack.visibleIndex;
-    const style = {
-      "--toast-placement-index": placementIndex,
-      "--toast-placement-offset-y": `${stack.offsetY}px`,
-      "--toast-placement-frontmost-height": stack.frontmostHeight ? `${stack.frontmostHeight}px` : void 0
-    };
-    stack.offsetY += item.height ?? 0;
-    stack.domIndex += 1;
-    if (item.transitionStatus !== "ending") {
-      stack.visibleIndex += 1;
-    }
-    placementStacks.set(placement.key, stack);
-    return /* @__PURE__ */ jsx(
-      BaseToast.Root,
-      {
-        toast: item,
-        className: cn(
-          toastRootBaseClassName,
-          getToastPositionClassName(placement),
-          getToastStackClassName(placement),
-          getToastExitClassName(placement.side)
-        ),
-        swipeDirection: getSwipeDirections(item),
-        style,
-        children: /* @__PURE__ */ jsxs(
-          BaseToast.Content,
-          {
-            className: "grid grid-cols-[16px_minmax(0,1fr)_24px] items-start gap-3 overflow-hidden px-2.5 py-3.5 pl-3 transition-opacity duration-250 data-behind:pointer-events-none data-behind:opacity-0 data-expanded:pointer-events-auto data-expanded:opacity-100",
-            children: [
-              /* @__PURE__ */ jsx(ToastIcon, { type: item.data?.type }),
-              /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex flex-col gap-1.5", children: [
-                item.title ? /* @__PURE__ */ jsx(BaseToast.Title, { className: "text-gdt-sm font-semibold text-fg-primary" }) : null,
-                item.description ? /* @__PURE__ */ jsx(BaseToast.Description, { className: "text-gdt-sm text-fg-secondary" }) : null,
-                /* @__PURE__ */ jsx(
-                  BaseToast.Action,
-                  {
-                    className: cn(
-                      "cursor-pointer border-0 bg-transparent p-0 font-inherit text-gdt-sm font-semibold inline-flex w-fit items-center hover:underline underline-offset-2",
-                      item.data?.type === "success" && "text-fg-brand",
-                      item.data?.type === "info" && "text-fg-primary",
-                      item.data?.type === "warning" && "text-fg-accent",
-                      item.data?.type === "error" && "text-fg-danger"
-                    )
-                  }
-                )
-              ] }),
-              /* @__PURE__ */ jsx(
-                BaseToast.Close,
-                {
-                  render: /* @__PURE__ */ jsx(Button, { variant: "ghost", size: "icon-xs" }),
-                  "aria-label": "Close toast",
-                  children: /* @__PURE__ */ jsx(X, { className: "size-4" })
-                }
-              )
-            ]
-          }
-        )
-      },
-      item.id
-    );
-  });
+	const { toasts } = Toast.useToastManager();
+	const placementStacks = /* @__PURE__ */ new Map();
+	return toasts.map((item) => {
+		const placement = getToastPlacement(item);
+		const stack = placementStacks.get(placement.key) ?? {
+			domIndex: 0,
+			visibleIndex: 0,
+			offsetY: 0,
+			frontmostHeight: item.height
+		};
+		const style = {
+			"--toast-placement-index": item.transitionStatus === "ending" ? stack.domIndex : stack.visibleIndex,
+			"--toast-placement-offset-y": `${stack.offsetY}px`,
+			"--toast-placement-frontmost-height": stack.frontmostHeight ? `${stack.frontmostHeight}px` : void 0
+		};
+		stack.offsetY += item.height ?? 0;
+		stack.domIndex += 1;
+		if (item.transitionStatus !== "ending") stack.visibleIndex += 1;
+		placementStacks.set(placement.key, stack);
+		return /* @__PURE__ */ jsx(Toast.Root, {
+			toast: item,
+			className: cn(toastRootBaseClassName, getToastPositionClassName(placement), getToastStackClassName(placement), getToastExitClassName(placement.side)),
+			swipeDirection: getSwipeDirections(item),
+			style,
+			children: /* @__PURE__ */ jsxs(Toast.Content, {
+				className: "grid grid-cols-[16px_minmax(0,1fr)_24px] items-start gap-3 overflow-hidden px-2.5 py-3.5 pl-3 transition-opacity duration-250 data-behind:pointer-events-none data-behind:opacity-0 data-expanded:pointer-events-auto data-expanded:opacity-100",
+				children: [
+					/* @__PURE__ */ jsx(ToastIcon, { type: item.data?.type }),
+					/* @__PURE__ */ jsxs("div", {
+						className: "min-w-0 flex flex-col gap-1.5",
+						children: [
+							item.title ? /* @__PURE__ */ jsx(Toast.Title, { className: "text-gdt-sm font-semibold text-fg-primary" }) : null,
+							item.description ? /* @__PURE__ */ jsx(Toast.Description, { className: "text-gdt-sm text-fg-secondary" }) : null,
+							/* @__PURE__ */ jsx(Toast.Action, { className: cn("cursor-pointer border-0 bg-transparent p-0 font-inherit text-gdt-sm font-semibold inline-flex w-fit items-center hover:underline underline-offset-2", item.data?.type === "success" && "text-fg-brand", item.data?.type === "info" && "text-fg-primary", item.data?.type === "warning" && "text-fg-accent", item.data?.type === "error" && "text-fg-danger") })
+						]
+					}),
+					/* @__PURE__ */ jsx(Toast.Close, {
+						render: /* @__PURE__ */ jsx(Button, {
+							variant: "ghost",
+							size: "icon-xs"
+						}),
+						"aria-label": "Close toast",
+						children: /* @__PURE__ */ jsx(X, { className: "size-4" })
+					})
+				]
+			})
+		}, item.id);
+	});
 }
 function ToastIcon({ type }) {
-  if (!type) return null;
-  return /* @__PURE__ */ jsxs(
-    "span",
-    {
-      className: cn(
-        "inline-flex size-5 items-center justify-center rounded-full text-canvas",
-        type === "success" && "bg-status-success",
-        type === "info" && "bg-status-info",
-        type === "warning" && "bg-status-warning text-fg-on-accent",
-        type === "error" && "bg-status-danger"
-      ),
-      "aria-hidden": "true",
-      children: [
-        type === "success" ? /* @__PURE__ */ jsx(Check, { size: 10, strokeWidth: 3 }) : null,
-        type === "info" ? /* @__PURE__ */ jsx(Info, { size: 11, strokeWidth: 2.8 }) : null,
-        type === "warning" ? /* @__PURE__ */ jsx("span", { className: "text-[11px] leading-none font-extrabold", children: "!" }) : null,
-        type === "error" ? /* @__PURE__ */ jsx(X, { size: 10, strokeWidth: 3 }) : null
-      ]
-    }
-  );
+	if (!type) return null;
+	return /* @__PURE__ */ jsxs("span", {
+		className: cn("inline-flex size-5 items-center justify-center rounded-full text-canvas", type === "success" && "bg-status-success", type === "info" && "bg-status-info", type === "warning" && "bg-status-warning text-fg-on-accent", type === "error" && "bg-status-danger"),
+		"aria-hidden": "true",
+		children: [
+			type === "success" ? /* @__PURE__ */ jsx(Check, {
+				size: 10,
+				strokeWidth: 3
+			}) : null,
+			type === "info" ? /* @__PURE__ */ jsx(Info, {
+				size: 11,
+				strokeWidth: 2.8
+			}) : null,
+			type === "warning" ? /* @__PURE__ */ jsx("span", {
+				className: "text-[11px] leading-none font-extrabold",
+				children: "!"
+			}) : null,
+			type === "error" ? /* @__PURE__ */ jsx(X, {
+				size: 10,
+				strokeWidth: 3
+			}) : null
+		]
+	});
 }
-var toastRootBaseClassName = "[--gap:12px] [--peek:12px] [--anchor-x:0px] [--anchor-y:0px] [--scale:calc(max(0,1-(var(--toast-placement-index)*0.04)))] [--shrink:calc(1-var(--scale))] [--height:var(--toast-placement-frontmost-height,var(--toast-height))] absolute z-[calc(1000-var(--toast-placement-index))] h-[var(--height)] min-h-[var(--height)] w-[min(335px,calc(100vw-32px))] overflow-visible rounded-lg border border-line bg-surface-overlay text-fg-primary shadow-[var(--elevation-e2-shadow)] pointer-events-auto select-none [transform:translateX(calc(var(--anchor-x)+var(--toast-swipe-movement-x,0px)))_translateY(var(--collapsed-y))_scale(var(--scale))] [transition:transform_500ms_cubic-bezier(0.22,1,0.36,1),opacity_500ms,height_150ms] after:absolute after:left-0 after:h-[calc(var(--gap)+1px)] after:w-full after:pointer-events-auto after:content-[''] data-[expanded]:h-[var(--toast-height)] data-[expanded]:[transform:translateX(calc(var(--anchor-x)+var(--toast-swipe-movement-x,0px)))_translateY(var(--expanded-y))_scale(1)] data-[starting-style]:opacity-0 data-[starting-style]:[transform:translateX(var(--exit-x))_translateY(var(--exit-y))_scale(var(--scale))] data-[ending-style]:opacity-0 data-[limited]:opacity-0 [&[data-ending-style]:not([data-limited]):not([data-swipe-direction])]:[transform:translateX(var(--exit-x))_translateY(var(--exit-y))_scale(var(--scale))] data-[ending-style]:data-[swipe-direction=up]:[transform:translateX(calc(var(--anchor-x)+var(--toast-swipe-movement-x,0px)))_translateY(calc(var(--anchor-y)+var(--toast-swipe-movement-y)-150%))_scale(var(--scale))] data-[expanded]:data-[ending-style]:data-[swipe-direction=up]:[transform:translateX(calc(var(--anchor-x)+var(--toast-swipe-movement-x,0px)))_translateY(calc(var(--anchor-y)+var(--toast-swipe-movement-y)-150%))_scale(1)] data-[ending-style]:data-[swipe-direction=down]:[transform:translateX(calc(var(--anchor-x)+var(--toast-swipe-movement-x,0px)))_translateY(calc(var(--anchor-y)+var(--toast-swipe-movement-y)+150%))_scale(var(--scale))] data-[expanded]:data-[ending-style]:data-[swipe-direction=down]:[transform:translateX(calc(var(--anchor-x)+var(--toast-swipe-movement-x,0px)))_translateY(calc(var(--anchor-y)+var(--toast-swipe-movement-y)+150%))_scale(1)] data-[ending-style]:data-[swipe-direction=left]:[transform:translateX(calc(var(--anchor-x)+var(--toast-swipe-movement-x,0px)-150%))_translateY(var(--expanded-y))_scale(var(--scale))] data-[expanded]:data-[ending-style]:data-[swipe-direction=left]:[transform:translateX(calc(var(--anchor-x)+var(--toast-swipe-movement-x,0px)-150%))_translateY(var(--expanded-y))_scale(1)] data-[ending-style]:data-[swipe-direction=right]:[transform:translateX(calc(var(--anchor-x)+var(--toast-swipe-movement-x,0px)+150%))_translateY(var(--expanded-y))_scale(var(--scale))] data-[expanded]:data-[ending-style]:data-[swipe-direction=right]:[transform:translateX(calc(var(--anchor-x)+var(--toast-swipe-movement-x,0px)+150%))_translateY(var(--expanded-y))_scale(1)]";
+const toastRootBaseClassName = "[--gap:12px] [--peek:12px] [--anchor-x:0px] [--anchor-y:0px] [--scale:calc(max(0,1-(var(--toast-placement-index)*0.04)))] [--shrink:calc(1-var(--scale))] [--height:var(--toast-placement-frontmost-height,var(--toast-height))] absolute z-[calc(1000-var(--toast-placement-index))] h-[var(--height)] min-h-[var(--height)] w-[min(335px,calc(100vw-32px))] overflow-visible rounded-lg border border-line bg-surface-overlay text-fg-primary shadow-[var(--elevation-e2-shadow)] pointer-events-auto select-none [transform:translateX(calc(var(--anchor-x)+var(--toast-swipe-movement-x,0px)))_translateY(var(--collapsed-y))_scale(var(--scale))] [transition:transform_500ms_cubic-bezier(0.22,1,0.36,1),opacity_500ms,height_150ms] after:absolute after:left-0 after:h-[calc(var(--gap)+1px)] after:w-full after:pointer-events-auto after:content-[''] data-[expanded]:h-[var(--toast-height)] data-[expanded]:[transform:translateX(calc(var(--anchor-x)+var(--toast-swipe-movement-x,0px)))_translateY(var(--expanded-y))_scale(1)] data-[starting-style]:opacity-0 data-[starting-style]:[transform:translateX(var(--exit-x))_translateY(var(--exit-y))_scale(var(--scale))] data-[ending-style]:opacity-0 data-[limited]:opacity-0 [&[data-ending-style]:not([data-limited]):not([data-swipe-direction])]:[transform:translateX(var(--exit-x))_translateY(var(--exit-y))_scale(var(--scale))] data-[ending-style]:data-[swipe-direction=up]:[transform:translateX(calc(var(--anchor-x)+var(--toast-swipe-movement-x,0px)))_translateY(calc(var(--anchor-y)+var(--toast-swipe-movement-y)-150%))_scale(var(--scale))] data-[expanded]:data-[ending-style]:data-[swipe-direction=up]:[transform:translateX(calc(var(--anchor-x)+var(--toast-swipe-movement-x,0px)))_translateY(calc(var(--anchor-y)+var(--toast-swipe-movement-y)-150%))_scale(1)] data-[ending-style]:data-[swipe-direction=down]:[transform:translateX(calc(var(--anchor-x)+var(--toast-swipe-movement-x,0px)))_translateY(calc(var(--anchor-y)+var(--toast-swipe-movement-y)+150%))_scale(var(--scale))] data-[expanded]:data-[ending-style]:data-[swipe-direction=down]:[transform:translateX(calc(var(--anchor-x)+var(--toast-swipe-movement-x,0px)))_translateY(calc(var(--anchor-y)+var(--toast-swipe-movement-y)+150%))_scale(1)] data-[ending-style]:data-[swipe-direction=left]:[transform:translateX(calc(var(--anchor-x)+var(--toast-swipe-movement-x,0px)-150%))_translateY(var(--expanded-y))_scale(var(--scale))] data-[expanded]:data-[ending-style]:data-[swipe-direction=left]:[transform:translateX(calc(var(--anchor-x)+var(--toast-swipe-movement-x,0px)-150%))_translateY(var(--expanded-y))_scale(1)] data-[ending-style]:data-[swipe-direction=right]:[transform:translateX(calc(var(--anchor-x)+var(--toast-swipe-movement-x,0px)+150%))_translateY(var(--expanded-y))_scale(var(--scale))] data-[expanded]:data-[ending-style]:data-[swipe-direction=right]:[transform:translateX(calc(var(--anchor-x)+var(--toast-swipe-movement-x,0px)+150%))_translateY(var(--expanded-y))_scale(1)]";
 function getToastPlacement(item, isRtl = false) {
-  const side = item.positionerProps?.side ?? DEFAULT_TOAST_SIDE;
-  const align = item.positionerProps?.align ?? DEFAULT_TOAST_ALIGN;
-  const resolvedSide = resolveToastSide(side, isRtl);
-  return {
-    side: resolvedSide,
-    align,
-    key: `${resolvedSide}:${align}`
-  };
+	const side = item.positionerProps?.side ?? DEFAULT_TOAST_SIDE;
+	const align = item.positionerProps?.align ?? DEFAULT_TOAST_ALIGN;
+	const resolvedSide = resolveToastSide(side, isRtl);
+	return {
+		side: resolvedSide,
+		align,
+		key: `${resolvedSide}:${align}`
+	};
 }
 function resolveToastSide(side, isRtl) {
-  if (side === "inline-end") return isRtl ? "left" : "right";
-  if (side === "inline-start") return isRtl ? "right" : "left";
-  if (side === "top" || side === "bottom" || side === "left" || side === "right") {
-    return side;
-  }
-  return DEFAULT_TOAST_SIDE;
+	if (side === "inline-end") return isRtl ? "left" : "right";
+	if (side === "inline-start") return isRtl ? "right" : "left";
+	if (side === "top" || side === "bottom" || side === "left" || side === "right") return side;
+	return DEFAULT_TOAST_SIDE;
 }
 function getToastPositionClassName({ side, align }) {
-  const isVerticalSide = side === "top" || side === "bottom";
-  if (isVerticalSide) {
-    return cn(
-      side === "top" && "top-6 max-sm:top-4",
-      side === "bottom" && "bottom-6 max-sm:bottom-4",
-      align === "start" && "left-6 origin-top-left max-sm:left-4",
-      align === "center" && "left-1/2 origin-top [--anchor-x:-50%]",
-      align === "end" && "right-6 origin-top-right max-sm:right-4",
-      side === "bottom" && align === "start" && "origin-bottom-left",
-      side === "bottom" && align === "center" && "origin-bottom",
-      side === "bottom" && align === "end" && "origin-bottom-right"
-    );
-  }
-  return cn(
-    side === "left" && "left-6 origin-left max-sm:left-4",
-    side === "right" && "right-6 origin-right max-sm:right-4",
-    align === "start" && "top-6 max-sm:top-4",
-    align === "center" && "top-1/2 [--anchor-y:-50%]",
-    align === "end" && "bottom-6 max-sm:bottom-4",
-    side === "left" && align === "start" && "origin-top-left",
-    side === "left" && align === "end" && "origin-bottom-left",
-    side === "right" && align === "start" && "origin-top-right",
-    side === "right" && align === "end" && "origin-bottom-right"
-  );
+	if (side === "top" || side === "bottom") return cn(side === "top" && "top-6 max-sm:top-4", side === "bottom" && "bottom-6 max-sm:bottom-4", align === "start" && "left-6 origin-top-left max-sm:left-4", align === "center" && "left-1/2 origin-top [--anchor-x:-50%]", align === "end" && "right-6 origin-top-right max-sm:right-4", side === "bottom" && align === "start" && "origin-bottom-left", side === "bottom" && align === "center" && "origin-bottom", side === "bottom" && align === "end" && "origin-bottom-right");
+	return cn(side === "left" && "left-6 origin-left max-sm:left-4", side === "right" && "right-6 origin-right max-sm:right-4", align === "start" && "top-6 max-sm:top-4", align === "center" && "top-1/2 [--anchor-y:-50%]", align === "end" && "bottom-6 max-sm:bottom-4", side === "left" && align === "start" && "origin-top-left", side === "left" && align === "end" && "origin-bottom-left", side === "right" && align === "start" && "origin-top-right", side === "right" && align === "end" && "origin-bottom-right");
 }
 function getToastStackClassName({ side, align }) {
-  const stacksUp = side === "bottom" || (side === "left" || side === "right") && align === "end";
-  if (stacksUp) {
-    return "after:bottom-full [--expanded-y:calc(var(--anchor-y)+var(--toast-swipe-movement-y)-var(--toast-placement-offset-y)-(var(--toast-placement-index)*var(--gap)))] [--collapsed-y:calc(var(--anchor-y)+var(--toast-swipe-movement-y)-(var(--toast-placement-index)*var(--peek))-(var(--shrink)*var(--height)))]";
-  }
-  return "after:top-full [--expanded-y:calc(var(--anchor-y)+var(--toast-placement-offset-y)+(var(--toast-placement-index)*var(--gap))+var(--toast-swipe-movement-y))] [--collapsed-y:calc(var(--anchor-y)+var(--toast-swipe-movement-y)+(var(--toast-placement-index)*var(--peek))+(var(--shrink)*var(--height)))]";
+	if (side === "bottom" || (side === "left" || side === "right") && align === "end") return "after:bottom-full [--expanded-y:calc(var(--anchor-y)+var(--toast-swipe-movement-y)-var(--toast-placement-offset-y)-(var(--toast-placement-index)*var(--gap)))] [--collapsed-y:calc(var(--anchor-y)+var(--toast-swipe-movement-y)-(var(--toast-placement-index)*var(--peek))-(var(--shrink)*var(--height)))]";
+	return "after:top-full [--expanded-y:calc(var(--anchor-y)+var(--toast-placement-offset-y)+(var(--toast-placement-index)*var(--gap))+var(--toast-swipe-movement-y))] [--collapsed-y:calc(var(--anchor-y)+var(--toast-swipe-movement-y)+(var(--toast-placement-index)*var(--peek))+(var(--shrink)*var(--height)))]";
 }
 function getToastExitClassName(side) {
-  if (side === "bottom") {
-    return "[--exit-x:calc(var(--anchor-x)+24px)] [--exit-y:calc(var(--anchor-y)+150%)]";
-  }
-  if (side === "left") {
-    return "[--exit-x:calc(var(--anchor-x)-150%)] [--exit-y:var(--anchor-y)]";
-  }
-  if (side === "right") {
-    return "[--exit-x:calc(var(--anchor-x)+150%)] [--exit-y:var(--anchor-y)]";
-  }
-  return "[--exit-x:calc(var(--anchor-x)+24px)] [--exit-y:calc(var(--anchor-y)-150%)]";
+	if (side === "bottom") return "[--exit-x:calc(var(--anchor-x)+24px)] [--exit-y:calc(var(--anchor-y)+150%)]";
+	if (side === "left") return "[--exit-x:calc(var(--anchor-x)-150%)] [--exit-y:var(--anchor-y)]";
+	if (side === "right") return "[--exit-x:calc(var(--anchor-x)+150%)] [--exit-y:var(--anchor-y)]";
+	return "[--exit-x:calc(var(--anchor-x)+24px)] [--exit-y:calc(var(--anchor-y)-150%)]";
 }
 function getSwipeDirections(item, isRtl = false) {
-  const { side: resolvedSide, align } = getToastPlacement(item, isRtl);
-  const primary = resolvedSide === "top" ? "up" : resolvedSide === "bottom" ? "down" : resolvedSide === "left" ? "left" : (
-    /* right */
-    "right"
-  );
-  if (align === "center") return primary;
-  const isVerticalSide = resolvedSide === "top" || resolvedSide === "bottom";
-  const secondary = isVerticalSide ? align === "start" ? "left" : "right" : align === "start" ? "up" : "down";
-  return [primary, secondary];
+	const { side: resolvedSide, align } = getToastPlacement(item, isRtl);
+	const primary = resolvedSide === "top" ? "up" : resolvedSide === "bottom" ? "down" : resolvedSide === "left" ? "left" : "right";
+	if (align === "center") return primary;
+	return [primary, resolvedSide === "top" || resolvedSide === "bottom" ? align === "start" ? "left" : "right" : align === "start" ? "up" : "down"];
 }
-export {
-  ToastProvider,
-  toast,
-  toastManager
-};
-//# sourceMappingURL=toast.js.map
+//#endregion
+export { ToastProvider, toast, toastManager };

package/dist/tooltip.d.ts

@@ -1,11 +1,10 @@
-import * as React from 'react';
-import { Tooltip as Tooltip$1 } from '@base-ui/react/tooltip';
-
-declare function Tooltip({ ...props }: Tooltip$1.Root.Props): React.JSX.Element;
-declare function TooltipTrigger({ ...props }: Tooltip$1.Trigger.Props): React.JSX.Element;
+import { Tooltip as Tooltip$1 } from "@base-ui/react/tooltip";
+//#region src/tooltip.d.ts
+declare function Tooltip({ ...props }: Tooltip$1.Root.Props): import("react").JSX.Element;
+declare function TooltipTrigger({ ...props }: Tooltip$1.Trigger.Props): import("react").JSX.Element;
 type TooltipContentProps = Tooltip$1.Popup.Props & Pick<Tooltip$1.Positioner.Props, "align" | "alignOffset" | "side" | "sideOffset"> & Pick<Tooltip$1.Portal.Props, "container"> & {
-    showArrow?: boolean;
+  showArrow?: boolean;
 };
-declare function TooltipContent({ className, container, side, sideOffset, align, alignOffset, showArrow, children, ...props }: TooltipContentProps): React.JSX.Element;
-
-export { Tooltip, TooltipContent, TooltipTrigger };
+declare function TooltipContent({ className, container, side, sideOffset, align, alignOffset, showArrow, children, ...props }: TooltipContentProps): import("react").JSX.Element;
+//#endregion
+export { Tooltip, TooltipContent, TooltipTrigger };

package/dist/tooltip.js

@@ -1,13 +1,38 @@
 "use client";
-import {
-  Tooltip,
-  TooltipContent,
-  TooltipTrigger
-} from "./chunk-KDPYSOYZ.js";
-import "./chunk-Y4TTYVNE.js";
-export {
-  Tooltip,
-  TooltipContent,
-  TooltipTrigger
-};
-//# sourceMappingURL=tooltip.js.map
+import { t as cn } from "./cn-BI_4DMBf.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Tooltip as Tooltip$1 } from "@base-ui/react/tooltip";
+//#region src/tooltip.tsx
+function Tooltip({ ...props }) {
+	return /* @__PURE__ */ jsx(Tooltip$1.Root, {
+		"data-slot": "tooltip",
+		...props
+	});
+}
+function TooltipTrigger({ ...props }) {
+	return /* @__PURE__ */ jsx(Tooltip$1.Trigger, {
+		"data-slot": "tooltip-trigger",
+		delay: 100,
+		...props
+	});
+}
+function TooltipContent({ className, container, side = "top", sideOffset = 6, align = "center", alignOffset = 0, showArrow = true, children, ...props }) {
+	return /* @__PURE__ */ jsx(Tooltip$1.Portal, {
+		container,
+		children: /* @__PURE__ */ jsx(Tooltip$1.Positioner, {
+			align,
+			alignOffset,
+			side,
+			sideOffset,
+			className: "pointer-events-none isolate z-50",
+			children: /* @__PURE__ */ jsxs(Tooltip$1.Popup, {
+				"data-slot": "tooltip-content",
+				className: cn("z-50 relative inline-flex w-fit max-w-xs origin-(--transform-origin) items-center gap-1.5 rounded-[6px] border border-line bg-surface-overlay px-3 py-2 text-gdt-sm font-medium text-fg-primary shadow-2 duration-100 has-data-[slot=kbd]:pr-1.5 data-[side=bottom]:slide-in-from-top-2 data-[side=inline-end]:slide-in-from-left-2 data-[side=inline-start]:slide-in-from-right-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 **:data-[slot=kbd]:relative **:data-[slot=kbd]:isolate **:data-[slot=kbd]:z-50 **:data-[slot=kbd]:rounded-sm data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95", className),
+				...props,
+				children: [children, showArrow ? /* @__PURE__ */ jsx(Tooltip$1.Arrow, { className: "relative block w-3 h-1.5 overflow-clip data-[side=bottom]:top-[-6px] data-[side=left]:right-[-9px] data-[side=left]:rotate-90 data-[side=right]:left-[-9px] data-[side=right]:-rotate-90 data-[side=top]:bottom-[-6px] data-[side=top]:rotate-180 before:content-[''] before:absolute before:bottom-0 before:left-1/2 before:w-[calc(6px*sqrt(2))] before:h-[calc(6px*sqrt(2))] before:bg-surface-overlay before:border before:border-line before:[transform:translate(-50%,50%)_rotate(45deg)]" }) : null]
+			})
+		})
+	});
+}
+//#endregion
+export { Tooltip, TooltipContent, TooltipTrigger };

package/dist/tree-map.d.ts

@@ -1,10 +1,7 @@
-import * as React from 'react';
-import { ChartCard, ChartValueType } from './chart.js';
-import { ComponentSize } from './size-context.js';
-import 'class-variance-authority/types';
-import 'class-variance-authority';
-import 'recharts';
-
+import { t as ComponentSize } from "./size-context-D4mYvcg8.js";
+import { ChartCard, ChartValueType } from "./chart.js";
+import * as React from "react";
+//#region src/tree-map.d.ts
 /**
  * A treemap — part-to-whole composition drawn as proportionally sized, nested
  * rectangles. Reach for one to compare category shares at a glance (portfolio
@@ -56,72 +53,72 @@ type TreeMapSize = ComponentSize;
 /** Where the colour-key legend sits relative to the plot. */
 type TreeMapLegendPlacement = "right" | "bottom";
 type TreeMapDatum = {
-    /** Category name, shown in the tile label, legend, and tooltip. */
-    label: string;
-    /** Tile value — drives the tile's area. Omit on a group with `children`. */
-    value?: number;
-    /** Tile/group colour; defaults to the palette in order. Leaves inherit it. */
-    fill?: string;
-    /** Subcategories for a `nested` treemap. */
-    children?: TreeMapDatum[];
+  /** Category name, shown in the tile label, legend, and tooltip. */
+  label: string;
+  /** Tile value — drives the tile's area. Omit on a group with `children`. */
+  value?: number;
+  /** Tile/group colour; defaults to the palette in order. Leaves inherit it. */
+  fill?: string;
+  /** Subcategories for a `nested` treemap. */
+  children?: TreeMapDatum[];
 };
 /**
- * Tile palette, ordered by share: forest → brass → moss → clay → stone. Each
- * entry pairs a tile `fill` with the `text` colour that reads on it (a tonal
- * tint of the same scale). Giddaa has no `chart-1`…`chart-N` tokens yet, so these
- * map to the brand scales; assign by order, or override per datum with `fill`.
+ * Tile palette, ordered by share. A tile's area already encodes magnitude and
+ * every tile is directly labelled, so the fill carries category *identity* — the
+ * three validated categorical `chart-1`…`chart-3` tokens, then a neutral "Other"
+ * bucket for the fourth+ category (the brand has three validated categorical
+ * slots; see `styles/giddaa.css`). Each entry pairs a `fill` with the `text`
+ * colour that reads on it in both themes. Assign by order, or override per datum
+ * with `fill`.
  */
 declare const TREE_MAP_PALETTE: readonly [{
-    readonly fill: "var(--color-forest-700)";
-    readonly text: "var(--color-forest-100)";
+  readonly fill: "var(--color-chart-1)";
+  readonly text: "var(--color-forest-50)";
 }, {
-    readonly fill: "var(--color-brass-500)";
-    readonly text: "var(--color-brass-900)";
+  readonly fill: "var(--color-chart-2)";
+  readonly text: "var(--color-brass-900)";
 }, {
-    readonly fill: "var(--color-moss-600)";
-    readonly text: "var(--color-moss-100)";
+  readonly fill: "var(--color-chart-3)";
+  readonly text: "var(--color-clay-900)";
 }, {
-    readonly fill: "var(--color-clay-500)";
-    readonly text: "var(--color-clay-50)";
-}, {
-    readonly fill: "var(--color-stone-500)";
-    readonly text: "var(--color-stone-50)";
+  readonly fill: "var(--color-action-tertiary)";
+  readonly text: "var(--color-fg-primary)";
 }];
 type TreeMapLayout = {
-    /** Plot box height in px. Width stays fluid via the ResponsiveContainer. */
-    height: number;
-    /** Inset around every tile in px — straddles edges to read as a gap. */
-    gap: number;
-    /** Tile corner radius in px. */
-    radius: number;
-    /** Tile label padding from the top-left corner in px. */
-    labelPadding: number;
-    /** Tile label (name) font size in px. */
-    nameFontSize: number;
-    /** Tile label (share) font size in px. */
-    shareFontSize: number;
-    /** Smallest tile width/height in px that still shows its label. */
-    labelMinSide: number;
+  /** Plot box height in px. Width stays fluid via the ResponsiveContainer. */
+  height: number;
+  /** Inset around every tile in px — straddles edges to read as a gap. */
+  gap: number;
+  /** Tile corner radius in px. */
+  radius: number;
+  /** Tile label padding from the top-left corner in px. */
+  labelPadding: number;
+  /** Tile label (name) font size in px. */
+  nameFontSize: number;
+  /** Tile label (share) font size in px. */
+  shareFontSize: number;
+  /** Smallest tile width/height in px that still shows its label. */
+  labelMinSide: number;
 };
 declare const TREE_MAP_LAYOUT: Record<TreeMapSize, TreeMapLayout>;
 type TreeMapProps = Omit<React.ComponentProps<typeof ChartCard>, "size" | "children"> & {
-    /** Categories — flat leaves, or groups carrying `children` (nested). */
-    data: TreeMapDatum[];
-    /** Explicit size; otherwise inherited from the nearest `SizeProvider`. */
-    size?: TreeMapSize;
-    /** Chart heading. Omit to hide the title. */
-    title?: React.ReactNode;
-    /** Supporting metadata (period, source). Omit to hide the description. */
-    description?: React.ReactNode;
-    /** Enable the hover value tooltip. Default false. */
-    tooltip?: boolean;
-    /** Legend placement — a right column or a wrapped bottom row. Default right. */
-    legend?: TreeMapLegendPlacement;
-    /** Format the tile value in the tooltip. Defaults to a localised number. */
-    valueFormatter?: (value: number) => string;
-    /** Value formatting for the tooltip. Defaults to `number`. */
-    valueType?: ChartValueType;
+  /** Categories — flat leaves, or groups carrying `children` (nested). */
+  data: TreeMapDatum[];
+  /** Explicit size; otherwise inherited from the nearest `SizeProvider`. */
+  size?: TreeMapSize;
+  /** Chart heading. Omit to hide the title. */
+  title?: React.ReactNode;
+  /** Supporting metadata (period, source). Omit to hide the description. */
+  description?: React.ReactNode;
+  /** Enable the hover value tooltip. Default false. */
+  tooltip?: boolean;
+  /** Legend placement — a right column or a wrapped bottom row. Default right. */
+  legend?: TreeMapLegendPlacement;
+  /** Format the tile value in the tooltip. Defaults to a localised number. */
+  valueFormatter?: (value: number) => string;
+  /** Value formatting for the tooltip. Defaults to `number`. */
+  valueType?: ChartValueType;
 };
 declare function TreeMap({ data, size, title, description, tooltip, legend, valueFormatter, valueType, className, ...props }: TreeMapProps): React.JSX.Element;
-
-export { TREE_MAP_LAYOUT, TREE_MAP_PALETTE, TreeMap, type TreeMapDatum, type TreeMapLayout, type TreeMapLegendPlacement, type TreeMapProps, type TreeMapSize };
+//#endregion
+export { TREE_MAP_LAYOUT, TREE_MAP_PALETTE, TreeMap, type TreeMapDatum, type TreeMapLayout, type TreeMapLegendPlacement, type TreeMapProps, type TreeMapSize };