@fragments-sdk/ui 0.9.0 → 0.9.2

package/dist/components/Toast/index.js

@@ -0,0 +1,299 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import * as React from "react";
+import styles from "./Toast.module.scss.js";
+const ToastContext = React.createContext(null);
+function useToast() {
+  const context = React.useContext(ToastContext);
+  if (!context) {
+    throw new Error("useToast must be used within a ToastProvider");
+  }
+  const toast = React.useCallback((options) => {
+    return context.addToast(options);
+  }, [context]);
+  const success = React.useCallback((title, description) => {
+    return context.addToast({ title, description, variant: "success" });
+  }, [context]);
+  const error = React.useCallback((title, description) => {
+    return context.addToast({ title, description, variant: "error" });
+  }, [context]);
+  const warning = React.useCallback((title, description) => {
+    return context.addToast({ title, description, variant: "warning" });
+  }, [context]);
+  const info = React.useCallback((title, description) => {
+    return context.addToast({ title, description, variant: "info" });
+  }, [context]);
+  return {
+    toast,
+    success,
+    error,
+    warning,
+    info,
+    dismiss: context.removeToast,
+    dismissAll: context.clearToasts
+  };
+}
+function SuccessIcon() {
+  return /* @__PURE__ */ jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: [
+    /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "10" }),
+    /* @__PURE__ */ jsx("path", { d: "m9 12 2 2 4-4" })
+  ] });
+}
+function ErrorIcon() {
+  return /* @__PURE__ */ jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: [
+    /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "10" }),
+    /* @__PURE__ */ jsx("line", { x1: "15", y1: "9", x2: "9", y2: "15" }),
+    /* @__PURE__ */ jsx("line", { x1: "9", y1: "9", x2: "15", y2: "15" })
+  ] });
+}
+function WarningIcon() {
+  return /* @__PURE__ */ jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: [
+    /* @__PURE__ */ jsx("path", { d: "m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3" }),
+    /* @__PURE__ */ jsx("line", { x1: "12", y1: "9", x2: "12", y2: "13" }),
+    /* @__PURE__ */ jsx("line", { x1: "12", y1: "17", x2: "12.01", y2: "17" })
+  ] });
+}
+function InfoIcon() {
+  return /* @__PURE__ */ jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: [
+    /* @__PURE__ */ jsx("circle", { cx: "12", cy: "12", r: "10" }),
+    /* @__PURE__ */ jsx("line", { x1: "12", y1: "16", x2: "12", y2: "12" }),
+    /* @__PURE__ */ jsx("line", { x1: "12", y1: "8", x2: "12.01", y2: "8" })
+  ] });
+}
+function CloseIcon() {
+  return /* @__PURE__ */ jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: [
+    /* @__PURE__ */ jsx("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
+    /* @__PURE__ */ jsx("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
+  ] });
+}
+const variantIcons = {
+  default: null,
+  success: SuccessIcon,
+  error: ErrorIcon,
+  warning: WarningIcon,
+  info: InfoIcon
+};
+function ToastItem({
+  id,
+  title,
+  description,
+  variant = "default",
+  action,
+  onDismiss,
+  onPause,
+  onResume,
+  className,
+  ...htmlProps
+}) {
+  const Icon = variantIcons[variant];
+  const uniqueId = React.useId();
+  const toastRef = React.useRef(null);
+  const titleId = title ? `toast-title-${id || uniqueId}` : void 0;
+  const descId = description ? `toast-desc-${id || uniqueId}` : void 0;
+  const liveRole = variant === "error" || variant === "warning" ? "alert" : "status";
+  const toastClasses = [
+    styles.toast,
+    styles[variant],
+    className
+  ].filter(Boolean).join(" ");
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ref: toastRef,
+      ...htmlProps,
+      className: toastClasses,
+      role: liveRole,
+      "aria-atomic": "true",
+      "aria-labelledby": titleId,
+      "aria-describedby": descId,
+      onMouseEnter: onPause,
+      onMouseLeave: () => {
+        requestAnimationFrame(() => {
+          var _a;
+          if (!((_a = toastRef.current) == null ? void 0 : _a.contains(document.activeElement))) {
+            onResume == null ? void 0 : onResume();
+          }
+        });
+      },
+      onFocusCapture: onPause,
+      onBlurCapture: () => {
+        requestAnimationFrame(() => {
+          var _a;
+          if (!((_a = toastRef.current) == null ? void 0 : _a.contains(document.activeElement))) {
+            onResume == null ? void 0 : onResume();
+          }
+        });
+      },
+      children: [
+        Icon && /* @__PURE__ */ jsx("span", { className: styles.icon, children: /* @__PURE__ */ jsx(Icon, {}) }),
+        /* @__PURE__ */ jsxs("div", { className: styles.content, children: [
+          title && /* @__PURE__ */ jsx("div", { id: titleId, className: styles.title, children: title }),
+          description && /* @__PURE__ */ jsx("div", { id: descId, className: styles.description, children: description })
+        ] }),
+        action && /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            className: styles.action,
+            onClick: action.onClick,
+            children: action.label
+          }
+        ),
+        onDismiss && /* @__PURE__ */ jsx(
+          "button",
+          {
+            type: "button",
+            className: styles.close,
+            onClick: onDismiss,
+            "aria-label": "Dismiss notification",
+            children: /* @__PURE__ */ jsx(CloseIcon, {})
+          }
+        )
+      ]
+    }
+  );
+}
+function ToastContainer({
+  toasts,
+  position,
+  onDismiss,
+  onPause,
+  onResume
+}) {
+  const containerClasses = [
+    styles.container,
+    styles[position.replace("-", "")]
+  ].filter(Boolean).join(" ");
+  return /* @__PURE__ */ jsx("div", { className: containerClasses, role: "region", "aria-label": "Notifications", children: toasts.map((toast) => /* @__PURE__ */ jsx(
+    ToastItem,
+    {
+      ...toast,
+      onDismiss: () => onDismiss(toast.id),
+      onPause: () => onPause(toast.id),
+      onResume: () => onResume(toast.id)
+    },
+    toast.id
+  )) });
+}
+let toastCounter = 0;
+function ToastProvider({
+  position = "bottom-right",
+  duration = 8e3,
+  max = 5,
+  children
+}) {
+  const [toasts, setToasts] = React.useState([]);
+  const timeoutRef = React.useRef(/* @__PURE__ */ new Map());
+  const remainingRef = React.useRef(/* @__PURE__ */ new Map());
+  const startTimeRef = React.useRef(/* @__PURE__ */ new Map());
+  const clearRemovalTimer = React.useCallback((id) => {
+    const timeout = timeoutRef.current.get(id);
+    if (timeout) {
+      clearTimeout(timeout);
+      timeoutRef.current.delete(id);
+    }
+  }, []);
+  const scheduleRemoval = React.useCallback(
+    (id, delay) => {
+      if (delay <= 0) return;
+      clearRemovalTimer(id);
+      remainingRef.current.set(id, delay);
+      startTimeRef.current.set(id, Date.now());
+      const timeout = setTimeout(() => {
+        setToasts((prev) => prev.filter((t) => t.id !== id));
+        clearRemovalTimer(id);
+        remainingRef.current.delete(id);
+        startTimeRef.current.delete(id);
+      }, delay);
+      timeoutRef.current.set(id, timeout);
+    },
+    [clearRemovalTimer]
+  );
+  const addToast = React.useCallback((toast) => {
+    const id = `toast-${++toastCounter}`;
+    const toastDuration = toast.duration ?? (toast.action ? 0 : duration);
+    setToasts((prev) => {
+      const nextToasts = [...prev, { ...toast, id }];
+      const overflowCount = Math.max(0, nextToasts.length - max);
+      if (overflowCount > 0) {
+        const removedToasts = nextToasts.slice(0, overflowCount);
+        removedToasts.forEach((removedToast) => {
+          clearRemovalTimer(removedToast.id);
+          remainingRef.current.delete(removedToast.id);
+          startTimeRef.current.delete(removedToast.id);
+        });
+      }
+      return overflowCount > 0 ? nextToasts.slice(overflowCount) : nextToasts;
+    });
+    if (toastDuration > 0) {
+      scheduleRemoval(id, toastDuration);
+    }
+    return id;
+  }, [clearRemovalTimer, duration, max, scheduleRemoval]);
+  const removeToast = React.useCallback((id) => {
+    clearRemovalTimer(id);
+    remainingRef.current.delete(id);
+    startTimeRef.current.delete(id);
+    setToasts((prev) => prev.filter((t) => t.id !== id));
+  }, [clearRemovalTimer]);
+  const pauseToast = React.useCallback((id) => {
+    const remaining = remainingRef.current.get(id);
+    if (remaining === void 0) return;
+    const startedAt = startTimeRef.current.get(id);
+    if (startedAt) {
+      const elapsed = Date.now() - startedAt;
+      remainingRef.current.set(id, Math.max(remaining - elapsed, 0));
+    }
+    clearRemovalTimer(id);
+  }, [clearRemovalTimer]);
+  const resumeToast = React.useCallback((id) => {
+    const remaining = remainingRef.current.get(id);
+    if (remaining === void 0 || remaining <= 0) return;
+    scheduleRemoval(id, remaining);
+  }, [scheduleRemoval]);
+  const clearToasts = React.useCallback(() => {
+    timeoutRef.current.forEach((timeout) => {
+      clearTimeout(timeout);
+    });
+    timeoutRef.current.clear();
+    remainingRef.current.clear();
+    startTimeRef.current.clear();
+    setToasts([]);
+  }, []);
+  React.useEffect(
+    () => () => {
+      timeoutRef.current.forEach((timeout) => {
+        clearTimeout(timeout);
+      });
+      timeoutRef.current.clear();
+      remainingRef.current.clear();
+      startTimeRef.current.clear();
+    },
+    []
+  );
+  const value = React.useMemo(
+    () => ({ toasts, addToast, removeToast, clearToasts }),
+    [toasts, addToast, removeToast, clearToasts]
+  );
+  return /* @__PURE__ */ jsxs(ToastContext.Provider, { value, children: [
+    children,
+    /* @__PURE__ */ jsx(
+      ToastContainer,
+      {
+        toasts,
+        position,
+        onDismiss: removeToast,
+        onPause: pauseToast,
+        onResume: resumeToast
+      }
+    )
+  ] });
+}
+const Toast = Object.assign(ToastItem, {
+  Provider: ToastProvider
+});
+export {
+  Toast,
+  ToastProvider,
+  useToast
+};
+//# sourceMappingURL=index.js.map

package/dist/components/Toast/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../src/components/Toast/index.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport styles from './Toast.module.scss';\n\n// ============================================\n// Types\n// ============================================\n\nexport type ToastVariant = 'default' | 'success' | 'error' | 'warning' | 'info';\nexport type ToastPosition =\n  | 'top-left'\n  | 'top-center'\n  | 'top-right'\n  | 'bottom-left'\n  | 'bottom-center'\n  | 'bottom-right';\n\nexport interface ToastData {\n  id: string;\n  title?: string;\n  description?: string;\n  variant?: ToastVariant;\n  duration?: number;\n  action?: {\n    label: string;\n    onClick: () => void;\n  };\n}\n\nexport interface ToastProps extends Omit<ToastData, 'id'>, Omit<React.HTMLAttributes<HTMLDivElement>, 'title'> {\n  /** Callback when toast should be dismissed */\n  onDismiss?: () => void;\n}\n\nexport interface ToastProviderProps {\n  /** Position of the toast container */\n  position?: ToastPosition;\n  /** Default duration in ms (0 = no auto-dismiss) */\n  duration?: number;\n  /** Maximum number of toasts to show */\n  max?: number;\n  /** Children */\n  children: React.ReactNode;\n}\n\n// ============================================\n// Context\n// ============================================\n\ninterface ToastContextValue {\n  toasts: ToastData[];\n  addToast: (toast: Omit<ToastData, 'id'>) => string;\n  removeToast: (id: string) => void;\n  clearToasts: () => void;\n}\n\nconst ToastContext = React.createContext<ToastContextValue | null>(null);\n\n// ============================================\n// Hook to use toast\n// ============================================\n\nexport function useToast() {\n  const context = React.useContext(ToastContext);\n  if (!context) {\n    throw new Error('useToast must be used within a ToastProvider');\n  }\n\n  const toast = React.useCallback((options: Omit<ToastData, 'id'>) => {\n    return context.addToast(options);\n  }, [context]);\n\n  const success = React.useCallback((title: string, description?: string) => {\n    return context.addToast({ title, description, variant: 'success' });\n  }, [context]);\n\n  const error = React.useCallback((title: string, description?: string) => {\n    return context.addToast({ title, description, variant: 'error' });\n  }, [context]);\n\n  const warning = React.useCallback((title: string, description?: string) => {\n    return context.addToast({ title, description, variant: 'warning' });\n  }, [context]);\n\n  const info = React.useCallback((title: string, description?: string) => {\n    return context.addToast({ title, description, variant: 'info' });\n  }, [context]);\n\n  return {\n    toast,\n    success,\n    error,\n    warning,\n    info,\n    dismiss: context.removeToast,\n    dismissAll: context.clearToasts,\n  };\n}\n\n// ============================================\n// Icons\n// ============================================\n\nfunction SuccessIcon() {\n  return (\n    <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\" aria-hidden=\"true\">\n      <circle cx=\"12\" cy=\"12\" r=\"10\" />\n      <path d=\"m9 12 2 2 4-4\" />\n    </svg>\n  );\n}\n\nfunction ErrorIcon() {\n  return (\n    <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\" aria-hidden=\"true\">\n      <circle cx=\"12\" cy=\"12\" r=\"10\" />\n      <line x1=\"15\" y1=\"9\" x2=\"9\" y2=\"15\" />\n      <line x1=\"9\" y1=\"9\" x2=\"15\" y2=\"15\" />\n    </svg>\n  );\n}\n\nfunction WarningIcon() {\n  return (\n    <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\" aria-hidden=\"true\">\n      <path d=\"m21.73 18-8-14a2 2 0 0 0-3.48 0l-8 14A2 2 0 0 0 4 21h16a2 2 0 0 0 1.73-3\" />\n      <line x1=\"12\" y1=\"9\" x2=\"12\" y2=\"13\" />\n      <line x1=\"12\" y1=\"17\" x2=\"12.01\" y2=\"17\" />\n    </svg>\n  );\n}\n\nfunction InfoIcon() {\n  return (\n    <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\" aria-hidden=\"true\">\n      <circle cx=\"12\" cy=\"12\" r=\"10\" />\n      <line x1=\"12\" y1=\"16\" x2=\"12\" y2=\"12\" />\n      <line x1=\"12\" y1=\"8\" x2=\"12.01\" y2=\"8\" />\n    </svg>\n  );\n}\n\nfunction CloseIcon() {\n  return (\n    <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" strokeWidth=\"2\" strokeLinecap=\"round\" strokeLinejoin=\"round\" aria-hidden=\"true\">\n      <line x1=\"18\" y1=\"6\" x2=\"6\" y2=\"18\" />\n      <line x1=\"6\" y1=\"6\" x2=\"18\" y2=\"18\" />\n    </svg>\n  );\n}\n\nconst variantIcons: Record<ToastVariant, React.ComponentType | null> = {\n  default: null,\n  success: SuccessIcon,\n  error: ErrorIcon,\n  warning: WarningIcon,\n  info: InfoIcon,\n};\n\n// ============================================\n// Toast Component\n// ============================================\n\nfunction ToastItem({\n  id,\n  title,\n  description,\n  variant = 'default',\n  action,\n  onDismiss,\n  onPause,\n  onResume,\n  className,\n  ...htmlProps\n}: ToastProps & {\n  id?: string;\n  onPause?: () => void;\n  onResume?: () => void;\n}) {\n  const Icon = variantIcons[variant];\n  const uniqueId = React.useId();\n  const toastRef = React.useRef<HTMLDivElement>(null);\n  const titleId = title ? `toast-title-${id || uniqueId}` : undefined;\n  const descId = description ? `toast-desc-${id || uniqueId}` : undefined;\n  const liveRole = variant === 'error' || variant === 'warning' ? 'alert' : 'status';\n\n  const toastClasses = [\n    styles.toast,\n    styles[variant],\n    className,\n  ].filter(Boolean).join(' ');\n\n  return (\n    <div\n      ref={toastRef}\n      {...htmlProps}\n      className={toastClasses}\n      role={liveRole}\n      aria-atomic=\"true\"\n      aria-labelledby={titleId}\n      aria-describedby={descId}\n      onMouseEnter={onPause}\n      onMouseLeave={() => {\n        requestAnimationFrame(() => {\n          if (!toastRef.current?.contains(document.activeElement)) {\n            onResume?.();\n          }\n        });\n      }}\n      onFocusCapture={onPause}\n      onBlurCapture={() => {\n        requestAnimationFrame(() => {\n          if (!toastRef.current?.contains(document.activeElement)) {\n            onResume?.();\n          }\n        });\n      }}\n    >\n      {Icon && (\n        <span className={styles.icon}>\n          <Icon />\n        </span>\n      )}\n      <div className={styles.content}>\n        {title && <div id={titleId} className={styles.title}>{title}</div>}\n        {description && <div id={descId} className={styles.description}>{description}</div>}\n      </div>\n      {action && (\n        <button\n          type=\"button\"\n          className={styles.action}\n          onClick={action.onClick}\n        >\n          {action.label}\n        </button>\n      )}\n      {onDismiss && (\n        <button\n          type=\"button\"\n          className={styles.close}\n          onClick={onDismiss}\n          aria-label=\"Dismiss notification\"\n        >\n          <CloseIcon />\n        </button>\n      )}\n    </div>\n  );\n}\n\n// ============================================\n// Toast Container\n// ============================================\n\nfunction ToastContainer({\n  toasts,\n  position,\n  onDismiss,\n  onPause,\n  onResume,\n}: {\n  toasts: ToastData[];\n  position: ToastPosition;\n  onDismiss: (id: string) => void;\n  onPause: (id: string) => void;\n  onResume: (id: string) => void;\n}) {\n  const containerClasses = [\n    styles.container,\n    styles[position.replace('-', '')],\n  ].filter(Boolean).join(' ');\n\n  // Always render the container for screen reader live region to work properly\n  // The live region must exist before announcements are made\n  return (\n    <div className={containerClasses} role=\"region\" aria-label=\"Notifications\">\n      {toasts.map((toast) => (\n        <ToastItem\n          key={toast.id}\n          {...toast}\n          onDismiss={() => onDismiss(toast.id)}\n          onPause={() => onPause(toast.id)}\n          onResume={() => onResume(toast.id)}\n        />\n      ))}\n    </div>\n  );\n}\n\n// ============================================\n// Toast Provider\n// ============================================\n\nlet toastCounter = 0;\n\nexport function ToastProvider({\n  position = 'bottom-right',\n  duration = 8000,\n  max = 5,\n  children,\n}: ToastProviderProps) {\n  const [toasts, setToasts] = React.useState<ToastData[]>([]);\n  const timeoutRef = React.useRef(new Map<string, ReturnType<typeof setTimeout>>());\n  const remainingRef = React.useRef(new Map<string, number>());\n  const startTimeRef = React.useRef(new Map<string, number>());\n\n  const clearRemovalTimer = React.useCallback((id: string) => {\n    const timeout = timeoutRef.current.get(id);\n    if (timeout) {\n      clearTimeout(timeout);\n      timeoutRef.current.delete(id);\n    }\n  }, []);\n\n  const scheduleRemoval = React.useCallback(\n    (id: string, delay: number) => {\n      if (delay <= 0) return;\n      clearRemovalTimer(id);\n      remainingRef.current.set(id, delay);\n      startTimeRef.current.set(id, Date.now());\n\n      const timeout = setTimeout(() => {\n        setToasts((prev) => prev.filter((t) => t.id !== id));\n        clearRemovalTimer(id);\n        remainingRef.current.delete(id);\n        startTimeRef.current.delete(id);\n      }, delay);\n\n      timeoutRef.current.set(id, timeout);\n    },\n    [clearRemovalTimer]\n  );\n\n  const addToast = React.useCallback((toast: Omit<ToastData, 'id'>) => {\n    const id = `toast-${++toastCounter}`;\n    const toastDuration = toast.duration ?? (toast.action ? 0 : duration);\n\n    setToasts((prev) => {\n      const nextToasts = [...prev, { ...toast, id }];\n      const overflowCount = Math.max(0, nextToasts.length - max);\n\n      if (overflowCount > 0) {\n        const removedToasts = nextToasts.slice(0, overflowCount);\n        removedToasts.forEach((removedToast) => {\n          clearRemovalTimer(removedToast.id);\n          remainingRef.current.delete(removedToast.id);\n          startTimeRef.current.delete(removedToast.id);\n        });\n      }\n\n      return overflowCount > 0 ? nextToasts.slice(overflowCount) : nextToasts;\n    });\n\n    // Auto-dismiss\n    if (toastDuration > 0) {\n      scheduleRemoval(id, toastDuration);\n    }\n\n    return id;\n  }, [clearRemovalTimer, duration, max, scheduleRemoval]);\n\n  const removeToast = React.useCallback((id: string) => {\n    clearRemovalTimer(id);\n    remainingRef.current.delete(id);\n    startTimeRef.current.delete(id);\n    setToasts((prev) => prev.filter((t) => t.id !== id));\n  }, [clearRemovalTimer]);\n\n  const pauseToast = React.useCallback((id: string) => {\n    const remaining = remainingRef.current.get(id);\n    if (remaining === undefined) return;\n\n    const startedAt = startTimeRef.current.get(id);\n    if (startedAt) {\n      const elapsed = Date.now() - startedAt;\n      remainingRef.current.set(id, Math.max(remaining - elapsed, 0));\n    }\n    clearRemovalTimer(id);\n  }, [clearRemovalTimer]);\n\n  const resumeToast = React.useCallback((id: string) => {\n    const remaining = remainingRef.current.get(id);\n    if (remaining === undefined || remaining <= 0) return;\n    scheduleRemoval(id, remaining);\n  }, [scheduleRemoval]);\n\n  const clearToasts = React.useCallback(() => {\n    timeoutRef.current.forEach((timeout) => {\n      clearTimeout(timeout);\n    });\n    timeoutRef.current.clear();\n    remainingRef.current.clear();\n    startTimeRef.current.clear();\n    setToasts([]);\n  }, []);\n\n  React.useEffect(\n    () => () => {\n      timeoutRef.current.forEach((timeout) => {\n        clearTimeout(timeout);\n      });\n      timeoutRef.current.clear();\n      remainingRef.current.clear();\n      startTimeRef.current.clear();\n    },\n    []\n  );\n\n  const value = React.useMemo(\n    () => ({ toasts, addToast, removeToast, clearToasts }),\n    [toasts, addToast, removeToast, clearToasts]\n  );\n\n  return (\n    <ToastContext.Provider value={value}>\n      {children}\n      <ToastContainer\n        toasts={toasts}\n        position={position}\n        onDismiss={removeToast}\n        onPause={pauseToast}\n        onResume={resumeToast}\n      />\n    </ToastContext.Provider>\n  );\n}\n\n// ============================================\n// Export Toast as compound component\n// ============================================\n\nexport const Toast = Object.assign(ToastItem, {\n  Provider: ToastProvider,\n});\n"],"names":[],"mappings":"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"}

package/dist/components/Toggle/Toggle.module.scss.cjs

@@ -0,0 +1,39 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const root = "_root_wjgd1_1";
+const rootWithDescription = "_rootWithDescription_wjgd1_13";
+const track = "_track_wjgd1_16";
+const trackSm = "_trackSm_wjgd1_60";
+const trackMd = "_trackMd_wjgd1_72";
+const thumb = "_thumb_wjgd1_84";
+const content = "_content_wjgd1_99";
+const label = "_label_wjgd1_103";
+const labelSm = "_labelSm_wjgd1_110";
+const description = "_description_wjgd1_114";
+const descriptionSm = "_descriptionSm_wjgd1_122";
+const styles = {
+  root,
+  rootWithDescription,
+  track,
+  trackSm,
+  trackMd,
+  thumb,
+  content,
+  label,
+  labelSm,
+  description,
+  descriptionSm
+};
+exports.content = content;
+exports.default = styles;
+exports.description = description;
+exports.descriptionSm = descriptionSm;
+exports.label = label;
+exports.labelSm = labelSm;
+exports.root = root;
+exports.rootWithDescription = rootWithDescription;
+exports.thumb = thumb;
+exports.track = track;
+exports.trackMd = trackMd;
+exports.trackSm = trackSm;
+//# sourceMappingURL=Toggle.module.scss.cjs.map

package/dist/components/Toggle/Toggle.module.scss.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Toggle.module.scss.cjs","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/Toggle/Toggle.module.scss.js

@@ -0,0 +1,39 @@
+const root = "_root_wjgd1_1";
+const rootWithDescription = "_rootWithDescription_wjgd1_13";
+const track = "_track_wjgd1_16";
+const trackSm = "_trackSm_wjgd1_60";
+const trackMd = "_trackMd_wjgd1_72";
+const thumb = "_thumb_wjgd1_84";
+const content = "_content_wjgd1_99";
+const label = "_label_wjgd1_103";
+const labelSm = "_labelSm_wjgd1_110";
+const description = "_description_wjgd1_114";
+const descriptionSm = "_descriptionSm_wjgd1_122";
+const styles = {
+  root,
+  rootWithDescription,
+  track,
+  trackSm,
+  trackMd,
+  thumb,
+  content,
+  label,
+  labelSm,
+  description,
+  descriptionSm
+};
+export {
+  content,
+  styles as default,
+  description,
+  descriptionSm,
+  label,
+  labelSm,
+  root,
+  rootWithDescription,
+  thumb,
+  track,
+  trackMd,
+  trackSm
+};
+//# sourceMappingURL=Toggle.module.scss.js.map

package/dist/components/Toggle/Toggle.module.scss.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Toggle.module.scss.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/Toggle/index.cjs

@@ -0,0 +1,84 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const React = require("react");
+const _switch = require("@base-ui/react/switch");
+const Toggle_module = require("./Toggle.module.scss.cjs");
+function _interopNamespaceDefault(e) {
+  const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
+  if (e) {
+    for (const k in e) {
+      if (k !== "default") {
+        const d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: () => e[k]
+        });
+      }
+    }
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+const React__namespace = /* @__PURE__ */ _interopNamespaceDefault(React);
+const SwitchRoot = React__namespace.forwardRef(
+  function Switch2({
+    checked,
+    defaultChecked,
+    onChange,
+    label,
+    description,
+    disabled = false,
+    size = "md",
+    className,
+    name,
+    id,
+    "aria-label": ariaLabel,
+    "aria-labelledby": ariaLabelledBy,
+    "aria-describedby": ariaDescribedBy
+  }, ref) {
+    const trackClasses = [
+      Toggle_module.default.track,
+      size === "sm" ? Toggle_module.default.trackSm : Toggle_module.default.trackMd
+    ].join(" ");
+    const thumbClasses = Toggle_module.default.thumb;
+    const labelClasses = [Toggle_module.default.label, size === "sm" && Toggle_module.default.labelSm].filter(Boolean).join(" ");
+    const descClasses = [
+      Toggle_module.default.description,
+      size === "sm" && Toggle_module.default.descriptionSm
+    ].filter(Boolean).join(" ");
+    const rootClasses = [
+      Toggle_module.default.root,
+      description && Toggle_module.default.rootWithDescription,
+      className
+    ].filter(Boolean).join(" ");
+    return /* @__PURE__ */ jsxRuntime.jsxs(
+      _switch.Switch.Root,
+      {
+        ref,
+        id,
+        checked,
+        defaultChecked,
+        onCheckedChange: onChange,
+        disabled,
+        name,
+        className: rootClasses,
+        "aria-label": ariaLabel,
+        "aria-labelledby": ariaLabelledBy,
+        "aria-describedby": ariaDescribedBy,
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx(_switch.Switch.Thumb, { className: trackClasses, children: /* @__PURE__ */ jsxRuntime.jsx("span", { className: thumbClasses, "aria-hidden": "true" }) }),
+          (label || description) && /* @__PURE__ */ jsxRuntime.jsxs("div", { className: Toggle_module.default.content, children: [
+            label && /* @__PURE__ */ jsxRuntime.jsx("span", { className: labelClasses, children: label }),
+            description && /* @__PURE__ */ jsxRuntime.jsx("span", { className: descClasses, children: description })
+          ] })
+        ]
+      }
+    );
+  }
+);
+const Switch = Object.assign(SwitchRoot, {
+  Root: SwitchRoot
+});
+exports.Switch = Switch;
+//# sourceMappingURL=index.cjs.map

package/dist/components/Toggle/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.cjs","sources":["../../../src/components/Toggle/index.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Switch as BaseSwitch } from '@base-ui/react/switch';\nimport styles from './Toggle.module.scss';\n\nexport interface SwitchProps {\n  checked?: boolean;\n  defaultChecked?: boolean;\n  onChange?: (checked: boolean) => void;\n  label?: string;\n  description?: string;\n  disabled?: boolean;\n  size?: 'sm' | 'md';\n  className?: string;\n  name?: string;\n  id?: string;\n  'aria-label'?: string;\n  'aria-labelledby'?: string;\n  'aria-describedby'?: string;\n}\n\nexport type ToggleProps = SwitchProps;\n\nconst SwitchRoot = React.forwardRef<HTMLButtonElement, SwitchProps>(\n  function Switch(\n    {\n      checked,\n      defaultChecked,\n      onChange,\n      label,\n      description,\n      disabled = false,\n      size = 'md',\n      className,\n      name,\n      id,\n      'aria-label': ariaLabel,\n      'aria-labelledby': ariaLabelledBy,\n      'aria-describedby': ariaDescribedBy,\n    },\n    ref\n  ) {\n    const trackClasses = [\n      styles.track,\n      size === 'sm' ? styles.trackSm : styles.trackMd,\n    ].join(' ');\n\n    const thumbClasses = styles.thumb;\n\n    const labelClasses = [styles.label, size === 'sm' && styles.labelSm]\n      .filter(Boolean)\n      .join(' ');\n\n    const descClasses = [\n      styles.description,\n      size === 'sm' && styles.descriptionSm,\n    ]\n      .filter(Boolean)\n      .join(' ');\n\n    const rootClasses = [\n      styles.root,\n      description && styles.rootWithDescription,\n      className,\n    ]\n      .filter(Boolean)\n      .join(' ');\n\n    return (\n      <BaseSwitch.Root\n        ref={ref}\n        id={id}\n        checked={checked}\n        defaultChecked={defaultChecked}\n        onCheckedChange={onChange}\n        disabled={disabled}\n        name={name}\n        className={rootClasses}\n        aria-label={ariaLabel}\n        aria-labelledby={ariaLabelledBy}\n        aria-describedby={ariaDescribedBy}\n      >\n        <BaseSwitch.Thumb className={trackClasses}>\n          <span className={thumbClasses} aria-hidden=\"true\" />\n        </BaseSwitch.Thumb>\n\n        {(label || description) && (\n          <div className={styles.content}>\n            {label && <span className={labelClasses}>{label}</span>}\n            {description && <span className={descClasses}>{description}</span>}\n          </div>\n        )}\n      </BaseSwitch.Root>\n    );\n  }\n);\n\nexport const Switch = Object.assign(SwitchRoot, {\n  Root: SwitchRoot,\n});\n\n/** @deprecated Use `Switch` instead. */\nexport const Toggle = Switch;\n"],"names":["React","Switch","styles","jsxs","BaseSwitch","jsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AAwBA,MAAM,aAAaA,iBAAM;AAAA,EACvB,SAASC,QACP;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,WAAW;AAAA,IACX,OAAO;AAAA,IACP;AAAA,IACA;AAAA,IACA;AAAA,IACA,cAAc;AAAA,IACd,mBAAmB;AAAA,IACnB,oBAAoB;AAAA,EAAA,GAEtB,KACA;AACA,UAAM,eAAe;AAAA,MACnBC,cAAAA,QAAO;AAAA,MACP,SAAS,OAAOA,sBAAO,UAAUA,cAAAA,QAAO;AAAA,IAAA,EACxC,KAAK,GAAG;AAEV,UAAM,eAAeA,cAAAA,QAAO;AAE5B,UAAM,eAAe,CAACA,cAAAA,QAAO,OAAO,SAAS,QAAQA,sBAAO,OAAO,EAChE,OAAO,OAAO,EACd,KAAK,GAAG;AAEX,UAAM,cAAc;AAAA,MAClBA,cAAAA,QAAO;AAAA,MACP,SAAS,QAAQA,sBAAO;AAAA,IAAA,EAEvB,OAAO,OAAO,EACd,KAAK,GAAG;AAEX,UAAM,cAAc;AAAA,MAClBA,cAAAA,QAAO;AAAA,MACP,eAAeA,cAAAA,QAAO;AAAA,MACtB;AAAA,IAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG;AAEX,WACEC,2BAAAA;AAAAA,MAACC,QAAAA,OAAW;AAAA,MAAX;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,iBAAiB;AAAA,QACjB;AAAA,QACA;AAAA,QACA,WAAW;AAAA,QACX,cAAY;AAAA,QACZ,mBAAiB;AAAA,QACjB,oBAAkB;AAAA,QAElB,UAAA;AAAA,UAAAC,2BAAAA,IAACD,QAAAA,OAAW,OAAX,EAAiB,WAAW,cAC3B,UAAAC,2BAAAA,IAAC,QAAA,EAAK,WAAW,cAAc,eAAY,OAAA,CAAO,EAAA,CACpD;AAAA,WAEE,SAAS,gBACTF,gCAAC,OAAA,EAAI,WAAWD,cAAAA,QAAO,SACpB,UAAA;AAAA,YAAA,SAASG,2BAAAA,IAAC,QAAA,EAAK,WAAW,cAAe,UAAA,OAAM;AAAA,YAC/C,eAAeA,2BAAAA,IAAC,QAAA,EAAK,WAAW,aAAc,UAAA,YAAA,CAAY;AAAA,UAAA,EAAA,CAC7D;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAIR;AACF;AAEO,MAAM,SAAS,OAAO,OAAO,YAAY;AAAA,EAC9C,MAAM;AACR,CAAC;;"}

package/dist/components/Toggle/index.d.ts

@@ -0,0 +1,25 @@
+import * as React from 'react';
+export interface SwitchProps {
+    checked?: boolean;
+    defaultChecked?: boolean;
+    onChange?: (checked: boolean) => void;
+    label?: string;
+    description?: string;
+    disabled?: boolean;
+    size?: 'sm' | 'md';
+    className?: string;
+    name?: string;
+    id?: string;
+    'aria-label'?: string;
+    'aria-labelledby'?: string;
+    'aria-describedby'?: string;
+}
+export type ToggleProps = SwitchProps;
+export declare const Switch: React.ForwardRefExoticComponent<SwitchProps & React.RefAttributes<HTMLButtonElement>> & {
+    Root: React.ForwardRefExoticComponent<SwitchProps & React.RefAttributes<HTMLButtonElement>>;
+};
+/** @deprecated Use `Switch` instead. */
+export declare const Toggle: React.ForwardRefExoticComponent<SwitchProps & React.RefAttributes<HTMLButtonElement>> & {
+    Root: React.ForwardRefExoticComponent<SwitchProps & React.RefAttributes<HTMLButtonElement>>;
+};
+//# sourceMappingURL=index.d.ts.map

package/dist/components/Toggle/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Toggle/index.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/B,MAAM,WAAW,WAAW;IAC1B,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,QAAQ,CAAC,EAAE,CAAC,OAAO,EAAE,OAAO,KAAK,IAAI,CAAC;IACtC,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,IAAI,CAAC,EAAE,IAAI,GAAG,IAAI,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,kBAAkB,CAAC,EAAE,MAAM,CAAC;CAC7B;AAED,MAAM,MAAM,WAAW,GAAG,WAAW,CAAC;AA4EtC,eAAO,MAAM,MAAM;;CAEjB,CAAC;AAEH,wCAAwC;AACxC,eAAO,MAAM,MAAM;;CAAS,CAAC"}

package/dist/components/Toggle/index.js

@@ -0,0 +1,67 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import * as React from "react";
+import { Switch as Switch$1 } from "@base-ui/react/switch";
+import styles from "./Toggle.module.scss.js";
+const SwitchRoot = React.forwardRef(
+  function Switch2({
+    checked,
+    defaultChecked,
+    onChange,
+    label,
+    description,
+    disabled = false,
+    size = "md",
+    className,
+    name,
+    id,
+    "aria-label": ariaLabel,
+    "aria-labelledby": ariaLabelledBy,
+    "aria-describedby": ariaDescribedBy
+  }, ref) {
+    const trackClasses = [
+      styles.track,
+      size === "sm" ? styles.trackSm : styles.trackMd
+    ].join(" ");
+    const thumbClasses = styles.thumb;
+    const labelClasses = [styles.label, size === "sm" && styles.labelSm].filter(Boolean).join(" ");
+    const descClasses = [
+      styles.description,
+      size === "sm" && styles.descriptionSm
+    ].filter(Boolean).join(" ");
+    const rootClasses = [
+      styles.root,
+      description && styles.rootWithDescription,
+      className
+    ].filter(Boolean).join(" ");
+    return /* @__PURE__ */ jsxs(
+      Switch$1.Root,
+      {
+        ref,
+        id,
+        checked,
+        defaultChecked,
+        onCheckedChange: onChange,
+        disabled,
+        name,
+        className: rootClasses,
+        "aria-label": ariaLabel,
+        "aria-labelledby": ariaLabelledBy,
+        "aria-describedby": ariaDescribedBy,
+        children: [
+          /* @__PURE__ */ jsx(Switch$1.Thumb, { className: trackClasses, children: /* @__PURE__ */ jsx("span", { className: thumbClasses, "aria-hidden": "true" }) }),
+          (label || description) && /* @__PURE__ */ jsxs("div", { className: styles.content, children: [
+            label && /* @__PURE__ */ jsx("span", { className: labelClasses, children: label }),
+            description && /* @__PURE__ */ jsx("span", { className: descClasses, children: description })
+          ] })
+        ]
+      }
+    );
+  }
+);
+const Switch = Object.assign(SwitchRoot, {
+  Root: SwitchRoot
+});
+export {
+  Switch
+};
+//# sourceMappingURL=index.js.map

package/dist/components/Toggle/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":["../../../src/components/Toggle/index.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Switch as BaseSwitch } from '@base-ui/react/switch';\nimport styles from './Toggle.module.scss';\n\nexport interface SwitchProps {\n  checked?: boolean;\n  defaultChecked?: boolean;\n  onChange?: (checked: boolean) => void;\n  label?: string;\n  description?: string;\n  disabled?: boolean;\n  size?: 'sm' | 'md';\n  className?: string;\n  name?: string;\n  id?: string;\n  'aria-label'?: string;\n  'aria-labelledby'?: string;\n  'aria-describedby'?: string;\n}\n\nexport type ToggleProps = SwitchProps;\n\nconst SwitchRoot = React.forwardRef<HTMLButtonElement, SwitchProps>(\n  function Switch(\n    {\n      checked,\n      defaultChecked,\n      onChange,\n      label,\n      description,\n      disabled = false,\n      size = 'md',\n      className,\n      name,\n      id,\n      'aria-label': ariaLabel,\n      'aria-labelledby': ariaLabelledBy,\n      'aria-describedby': ariaDescribedBy,\n    },\n    ref\n  ) {\n    const trackClasses = [\n      styles.track,\n      size === 'sm' ? styles.trackSm : styles.trackMd,\n    ].join(' ');\n\n    const thumbClasses = styles.thumb;\n\n    const labelClasses = [styles.label, size === 'sm' && styles.labelSm]\n      .filter(Boolean)\n      .join(' ');\n\n    const descClasses = [\n      styles.description,\n      size === 'sm' && styles.descriptionSm,\n    ]\n      .filter(Boolean)\n      .join(' ');\n\n    const rootClasses = [\n      styles.root,\n      description && styles.rootWithDescription,\n      className,\n    ]\n      .filter(Boolean)\n      .join(' ');\n\n    return (\n      <BaseSwitch.Root\n        ref={ref}\n        id={id}\n        checked={checked}\n        defaultChecked={defaultChecked}\n        onCheckedChange={onChange}\n        disabled={disabled}\n        name={name}\n        className={rootClasses}\n        aria-label={ariaLabel}\n        aria-labelledby={ariaLabelledBy}\n        aria-describedby={ariaDescribedBy}\n      >\n        <BaseSwitch.Thumb className={trackClasses}>\n          <span className={thumbClasses} aria-hidden=\"true\" />\n        </BaseSwitch.Thumb>\n\n        {(label || description) && (\n          <div className={styles.content}>\n            {label && <span className={labelClasses}>{label}</span>}\n            {description && <span className={descClasses}>{description}</span>}\n          </div>\n        )}\n      </BaseSwitch.Root>\n    );\n  }\n);\n\nexport const Switch = Object.assign(SwitchRoot, {\n  Root: SwitchRoot,\n});\n\n/** @deprecated Use `Switch` instead. */\nexport const Toggle = Switch;\n"],"names":["Switch","BaseSwitch"],"mappings":";;;;AAwBA,MAAM,aAAa,MAAM;AAAA,EACvB,SAASA,QACP;AAAA,IACE;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,WAAW;AAAA,IACX,OAAO;AAAA,IACP;AAAA,IACA;AAAA,IACA;AAAA,IACA,cAAc;AAAA,IACd,mBAAmB;AAAA,IACnB,oBAAoB;AAAA,EAAA,GAEtB,KACA;AACA,UAAM,eAAe;AAAA,MACnB,OAAO;AAAA,MACP,SAAS,OAAO,OAAO,UAAU,OAAO;AAAA,IAAA,EACxC,KAAK,GAAG;AAEV,UAAM,eAAe,OAAO;AAE5B,UAAM,eAAe,CAAC,OAAO,OAAO,SAAS,QAAQ,OAAO,OAAO,EAChE,OAAO,OAAO,EACd,KAAK,GAAG;AAEX,UAAM,cAAc;AAAA,MAClB,OAAO;AAAA,MACP,SAAS,QAAQ,OAAO;AAAA,IAAA,EAEvB,OAAO,OAAO,EACd,KAAK,GAAG;AAEX,UAAM,cAAc;AAAA,MAClB,OAAO;AAAA,MACP,eAAe,OAAO;AAAA,MACtB;AAAA,IAAA,EAEC,OAAO,OAAO,EACd,KAAK,GAAG;AAEX,WACE;AAAA,MAACC,SAAW;AAAA,MAAX;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,iBAAiB;AAAA,QACjB;AAAA,QACA;AAAA,QACA,WAAW;AAAA,QACX,cAAY;AAAA,QACZ,mBAAiB;AAAA,QACjB,oBAAkB;AAAA,QAElB,UAAA;AAAA,UAAA,oBAACA,SAAW,OAAX,EAAiB,WAAW,cAC3B,UAAA,oBAAC,QAAA,EAAK,WAAW,cAAc,eAAY,OAAA,CAAO,EAAA,CACpD;AAAA,WAEE,SAAS,gBACT,qBAAC,OAAA,EAAI,WAAW,OAAO,SACpB,UAAA;AAAA,YAAA,SAAS,oBAAC,QAAA,EAAK,WAAW,cAAe,UAAA,OAAM;AAAA,YAC/C,eAAe,oBAAC,QAAA,EAAK,WAAW,aAAc,UAAA,YAAA,CAAY;AAAA,UAAA,EAAA,CAC7D;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAIR;AACF;AAEO,MAAM,SAAS,OAAO,OAAO,YAAY;AAAA,EAC9C,MAAM;AACR,CAAC;"}