@caratlogic/design-system 0.0.6 → 0.0.8

package/dist/index.esm.js

@@ -1,6 +1,7 @@
 import { jsx, jsxs, Fragment as Fragment$2 } from 'react/jsx-runtime';
 import * as React from 'react';
 import React__default, { forwardRef, createElement, useState, useCallback, useMemo, useEffect, useRef, createContext, useContext, useLayoutEffect, cloneElement, createRef, Component, Fragment as Fragment$3, lazy, Suspense, memo, useReducer, PureComponent, useDebugValue } from 'react';
+import { toast } from 'sonner';
 import * as ReactDOM from 'react-dom';
 import ReactDOM__default, { unstable_batchedUpdates, createPortal } from 'react-dom';
 import { Link as Link$1 } from 'react-router-dom';
@@ -3936,301 +3937,6 @@ const renderBadge = (text, type = BadgeType.SECONDARY, options) => {
     return (jsxs(Badge$1, { className: `text-xs flex items-center gap-1 ${className}`, children: [options?.showIcon && IconToRender && (jsx(IconToRender, { className: "w-3 h-3" })), text] }));
 };
 
-function __insertCSS(code) {
-  if (typeof document == 'undefined') return
-  let head = document.head || document.getElementsByTagName('head')[0];
-  let style = document.createElement('style');
-  style.type = 'text/css';
-  head.appendChild(style)
-  ;style.styleSheet ? (style.styleSheet.cssText = code) : style.appendChild(document.createTextNode(code));
-}
-Array(12).fill(0);
-
-let toastsCounter = 1;
-class Observer {
-    constructor(){
-        // We use arrow functions to maintain the correct `this` reference
-        this.subscribe = (subscriber)=>{
-            this.subscribers.push(subscriber);
-            return ()=>{
-                const index = this.subscribers.indexOf(subscriber);
-                this.subscribers.splice(index, 1);
-            };
-        };
-        this.publish = (data)=>{
-            this.subscribers.forEach((subscriber)=>subscriber(data));
-        };
-        this.addToast = (data)=>{
-            this.publish(data);
-            this.toasts = [
-                ...this.toasts,
-                data
-            ];
-        };
-        this.create = (data)=>{
-            var _data_id;
-            const { message, ...rest } = data;
-            const id = typeof (data == null ? void 0 : data.id) === 'number' || ((_data_id = data.id) == null ? void 0 : _data_id.length) > 0 ? data.id : toastsCounter++;
-            const alreadyExists = this.toasts.find((toast)=>{
-                return toast.id === id;
-            });
-            const dismissible = data.dismissible === undefined ? true : data.dismissible;
-            if (this.dismissedToasts.has(id)) {
-                this.dismissedToasts.delete(id);
-            }
-            if (alreadyExists) {
-                this.toasts = this.toasts.map((toast)=>{
-                    if (toast.id === id) {
-                        this.publish({
-                            ...toast,
-                            ...data,
-                            id,
-                            title: message
-                        });
-                        return {
-                            ...toast,
-                            ...data,
-                            id,
-                            dismissible,
-                            title: message
-                        };
-                    }
-                    return toast;
-                });
-            } else {
-                this.addToast({
-                    title: message,
-                    ...rest,
-                    dismissible,
-                    id
-                });
-            }
-            return id;
-        };
-        this.dismiss = (id)=>{
-            if (id) {
-                this.dismissedToasts.add(id);
-                requestAnimationFrame(()=>this.subscribers.forEach((subscriber)=>subscriber({
-                            id,
-                            dismiss: true
-                        })));
-            } else {
-                this.toasts.forEach((toast)=>{
-                    this.subscribers.forEach((subscriber)=>subscriber({
-                            id: toast.id,
-                            dismiss: true
-                        }));
-                });
-            }
-            return id;
-        };
-        this.message = (message, data)=>{
-            return this.create({
-                ...data,
-                message
-            });
-        };
-        this.error = (message, data)=>{
-            return this.create({
-                ...data,
-                message,
-                type: 'error'
-            });
-        };
-        this.success = (message, data)=>{
-            return this.create({
-                ...data,
-                type: 'success',
-                message
-            });
-        };
-        this.info = (message, data)=>{
-            return this.create({
-                ...data,
-                type: 'info',
-                message
-            });
-        };
-        this.warning = (message, data)=>{
-            return this.create({
-                ...data,
-                type: 'warning',
-                message
-            });
-        };
-        this.loading = (message, data)=>{
-            return this.create({
-                ...data,
-                type: 'loading',
-                message
-            });
-        };
-        this.promise = (promise, data)=>{
-            if (!data) {
-                // Nothing to show
-                return;
-            }
-            let id = undefined;
-            if (data.loading !== undefined) {
-                id = this.create({
-                    ...data,
-                    promise,
-                    type: 'loading',
-                    message: data.loading,
-                    description: typeof data.description !== 'function' ? data.description : undefined
-                });
-            }
-            const p = Promise.resolve(promise instanceof Function ? promise() : promise);
-            let shouldDismiss = id !== undefined;
-            let result;
-            const originalPromise = p.then(async (response)=>{
-                result = [
-                    'resolve',
-                    response
-                ];
-                const isReactElementResponse = React__default.isValidElement(response);
-                if (isReactElementResponse) {
-                    shouldDismiss = false;
-                    this.create({
-                        id,
-                        type: 'default',
-                        message: response
-                    });
-                } else if (isHttpResponse(response) && !response.ok) {
-                    shouldDismiss = false;
-                    const promiseData = typeof data.error === 'function' ? await data.error(`HTTP error! status: ${response.status}`) : data.error;
-                    const description = typeof data.description === 'function' ? await data.description(`HTTP error! status: ${response.status}`) : data.description;
-                    const isExtendedResult = typeof promiseData === 'object' && !React__default.isValidElement(promiseData);
-                    const toastSettings = isExtendedResult ? promiseData : {
-                        message: promiseData
-                    };
-                    this.create({
-                        id,
-                        type: 'error',
-                        description,
-                        ...toastSettings
-                    });
-                } else if (response instanceof Error) {
-                    shouldDismiss = false;
-                    const promiseData = typeof data.error === 'function' ? await data.error(response) : data.error;
-                    const description = typeof data.description === 'function' ? await data.description(response) : data.description;
-                    const isExtendedResult = typeof promiseData === 'object' && !React__default.isValidElement(promiseData);
-                    const toastSettings = isExtendedResult ? promiseData : {
-                        message: promiseData
-                    };
-                    this.create({
-                        id,
-                        type: 'error',
-                        description,
-                        ...toastSettings
-                    });
-                } else if (data.success !== undefined) {
-                    shouldDismiss = false;
-                    const promiseData = typeof data.success === 'function' ? await data.success(response) : data.success;
-                    const description = typeof data.description === 'function' ? await data.description(response) : data.description;
-                    const isExtendedResult = typeof promiseData === 'object' && !React__default.isValidElement(promiseData);
-                    const toastSettings = isExtendedResult ? promiseData : {
-                        message: promiseData
-                    };
-                    this.create({
-                        id,
-                        type: 'success',
-                        description,
-                        ...toastSettings
-                    });
-                }
-            }).catch(async (error)=>{
-                result = [
-                    'reject',
-                    error
-                ];
-                if (data.error !== undefined) {
-                    shouldDismiss = false;
-                    const promiseData = typeof data.error === 'function' ? await data.error(error) : data.error;
-                    const description = typeof data.description === 'function' ? await data.description(error) : data.description;
-                    const isExtendedResult = typeof promiseData === 'object' && !React__default.isValidElement(promiseData);
-                    const toastSettings = isExtendedResult ? promiseData : {
-                        message: promiseData
-                    };
-                    this.create({
-                        id,
-                        type: 'error',
-                        description,
-                        ...toastSettings
-                    });
-                }
-            }).finally(()=>{
-                if (shouldDismiss) {
-                    // Toast is still in load state (and will be indefinitely — dismiss it)
-                    this.dismiss(id);
-                    id = undefined;
-                }
-                data.finally == null ? void 0 : data.finally.call(data);
-            });
-            const unwrap = ()=>new Promise((resolve, reject)=>originalPromise.then(()=>result[0] === 'reject' ? reject(result[1]) : resolve(result[1])).catch(reject));
-            if (typeof id !== 'string' && typeof id !== 'number') {
-                // cannot Object.assign on undefined
-                return {
-                    unwrap
-                };
-            } else {
-                return Object.assign(id, {
-                    unwrap
-                });
-            }
-        };
-        this.custom = (jsx, data)=>{
-            const id = (data == null ? void 0 : data.id) || toastsCounter++;
-            this.create({
-                jsx: jsx(id),
-                id,
-                ...data
-            });
-            return id;
-        };
-        this.getActiveToasts = ()=>{
-            return this.toasts.filter((toast)=>!this.dismissedToasts.has(toast.id));
-        };
-        this.subscribers = [];
-        this.toasts = [];
-        this.dismissedToasts = new Set();
-    }
-}
-const ToastState = new Observer();
-// bind this to the toast function
-const toastFunction = (message, data)=>{
-    const id = (data == null ? void 0 : data.id) || toastsCounter++;
-    ToastState.addToast({
-        title: message,
-        ...data,
-        id
-    });
-    return id;
-};
-const isHttpResponse = (data)=>{
-    return data && typeof data === 'object' && 'ok' in data && typeof data.ok === 'boolean' && 'status' in data && typeof data.status === 'number';
-};
-const basicToast = toastFunction;
-const getHistory = ()=>ToastState.toasts;
-const getToasts = ()=>ToastState.getActiveToasts();
-// We use `Object.assign` to maintain the correct types as we would lose them otherwise
-const toast = Object.assign(basicToast, {
-    success: ToastState.success,
-    info: ToastState.info,
-    warning: ToastState.warning,
-    error: ToastState.error,
-    custom: ToastState.custom,
-    message: ToastState.message,
-    promise: ToastState.promise,
-    dismiss: ToastState.dismiss,
-    loading: ToastState.loading
-}, {
-    getHistory,
-    getToasts
-});
-
-__insertCSS("[data-sonner-toaster][dir=ltr],html[dir=ltr]{--toast-icon-margin-start:-3px;--toast-icon-margin-end:4px;--toast-svg-margin-start:-1px;--toast-svg-margin-end:0px;--toast-button-margin-start:auto;--toast-button-margin-end:0;--toast-close-button-start:0;--toast-close-button-end:unset;--toast-close-button-transform:translate(-35%, -35%)}[data-sonner-toaster][dir=rtl],html[dir=rtl]{--toast-icon-margin-start:4px;--toast-icon-margin-end:-3px;--toast-svg-margin-start:0px;--toast-svg-margin-end:-1px;--toast-button-margin-start:0;--toast-button-margin-end:auto;--toast-close-button-start:unset;--toast-close-button-end:0;--toast-close-button-transform:translate(35%, -35%)}[data-sonner-toaster]{position:fixed;width:var(--width);font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol,Noto Color Emoji;--gray1:hsl(0, 0%, 99%);--gray2:hsl(0, 0%, 97.3%);--gray3:hsl(0, 0%, 95.1%);--gray4:hsl(0, 0%, 93%);--gray5:hsl(0, 0%, 90.9%);--gray6:hsl(0, 0%, 88.7%);--gray7:hsl(0, 0%, 85.8%);--gray8:hsl(0, 0%, 78%);--gray9:hsl(0, 0%, 56.1%);--gray10:hsl(0, 0%, 52.3%);--gray11:hsl(0, 0%, 43.5%);--gray12:hsl(0, 0%, 9%);--border-radius:8px;box-sizing:border-box;padding:0;margin:0;list-style:none;outline:0;z-index:999999999;transition:transform .4s ease}@media (hover:none) and (pointer:coarse){[data-sonner-toaster][data-lifted=true]{transform:none}}[data-sonner-toaster][data-x-position=right]{right:var(--offset-right)}[data-sonner-toaster][data-x-position=left]{left:var(--offset-left)}[data-sonner-toaster][data-x-position=center]{left:50%;transform:translateX(-50%)}[data-sonner-toaster][data-y-position=top]{top:var(--offset-top)}[data-sonner-toaster][data-y-position=bottom]{bottom:var(--offset-bottom)}[data-sonner-toast]{--y:translateY(100%);--lift-amount:calc(var(--lift) * var(--gap));z-index:var(--z-index);position:absolute;opacity:0;transform:var(--y);touch-action:none;transition:transform .4s,opacity .4s,height .4s,box-shadow .2s;box-sizing:border-box;outline:0;overflow-wrap:anywhere}[data-sonner-toast][data-styled=true]{padding:16px;background:var(--normal-bg);border:1px solid var(--normal-border);color:var(--normal-text);border-radius:var(--border-radius);box-shadow:0 4px 12px rgba(0,0,0,.1);width:var(--width);font-size:13px;display:flex;align-items:center;gap:6px}[data-sonner-toast]:focus-visible{box-shadow:0 4px 12px rgba(0,0,0,.1),0 0 0 2px rgba(0,0,0,.2)}[data-sonner-toast][data-y-position=top]{top:0;--y:translateY(-100%);--lift:1;--lift-amount:calc(1 * var(--gap))}[data-sonner-toast][data-y-position=bottom]{bottom:0;--y:translateY(100%);--lift:-1;--lift-amount:calc(var(--lift) * var(--gap))}[data-sonner-toast][data-styled=true] [data-description]{font-weight:400;line-height:1.4;color:#3f3f3f}[data-rich-colors=true][data-sonner-toast][data-styled=true] [data-description]{color:inherit}[data-sonner-toaster][data-sonner-theme=dark] [data-description]{color:#e8e8e8}[data-sonner-toast][data-styled=true] [data-title]{font-weight:500;line-height:1.5;color:inherit}[data-sonner-toast][data-styled=true] [data-icon]{display:flex;height:16px;width:16px;position:relative;justify-content:flex-start;align-items:center;flex-shrink:0;margin-left:var(--toast-icon-margin-start);margin-right:var(--toast-icon-margin-end)}[data-sonner-toast][data-promise=true] [data-icon]>svg{opacity:0;transform:scale(.8);transform-origin:center;animation:sonner-fade-in .3s ease forwards}[data-sonner-toast][data-styled=true] [data-icon]>*{flex-shrink:0}[data-sonner-toast][data-styled=true] [data-icon] svg{margin-left:var(--toast-svg-margin-start);margin-right:var(--toast-svg-margin-end)}[data-sonner-toast][data-styled=true] [data-content]{display:flex;flex-direction:column;gap:2px}[data-sonner-toast][data-styled=true] [data-button]{border-radius:4px;padding-left:8px;padding-right:8px;height:24px;font-size:12px;color:var(--normal-bg);background:var(--normal-text);margin-left:var(--toast-button-margin-start);margin-right:var(--toast-button-margin-end);border:none;font-weight:500;cursor:pointer;outline:0;display:flex;align-items:center;flex-shrink:0;transition:opacity .4s,box-shadow .2s}[data-sonner-toast][data-styled=true] [data-button]:focus-visible{box-shadow:0 0 0 2px rgba(0,0,0,.4)}[data-sonner-toast][data-styled=true] [data-button]:first-of-type{margin-left:var(--toast-button-margin-start);margin-right:var(--toast-button-margin-end)}[data-sonner-toast][data-styled=true] [data-cancel]{color:var(--normal-text);background:rgba(0,0,0,.08)}[data-sonner-toaster][data-sonner-theme=dark] [data-sonner-toast][data-styled=true] [data-cancel]{background:rgba(255,255,255,.3)}[data-sonner-toast][data-styled=true] [data-close-button]{position:absolute;left:var(--toast-close-button-start);right:var(--toast-close-button-end);top:0;height:20px;width:20px;display:flex;justify-content:center;align-items:center;padding:0;color:var(--gray12);background:var(--normal-bg);border:1px solid var(--gray4);transform:var(--toast-close-button-transform);border-radius:50%;cursor:pointer;z-index:1;transition:opacity .1s,background .2s,border-color .2s}[data-sonner-toast][data-styled=true] [data-close-button]:focus-visible{box-shadow:0 4px 12px rgba(0,0,0,.1),0 0 0 2px rgba(0,0,0,.2)}[data-sonner-toast][data-styled=true] [data-disabled=true]{cursor:not-allowed}[data-sonner-toast][data-styled=true]:hover [data-close-button]:hover{background:var(--gray2);border-color:var(--gray5)}[data-sonner-toast][data-swiping=true]::before{content:'';position:absolute;left:-100%;right:-100%;height:100%;z-index:-1}[data-sonner-toast][data-y-position=top][data-swiping=true]::before{bottom:50%;transform:scaleY(3) translateY(50%)}[data-sonner-toast][data-y-position=bottom][data-swiping=true]::before{top:50%;transform:scaleY(3) translateY(-50%)}[data-sonner-toast][data-swiping=false][data-removed=true]::before{content:'';position:absolute;inset:0;transform:scaleY(2)}[data-sonner-toast][data-expanded=true]::after{content:'';position:absolute;left:0;height:calc(var(--gap) + 1px);bottom:100%;width:100%}[data-sonner-toast][data-mounted=true]{--y:translateY(0);opacity:1}[data-sonner-toast][data-expanded=false][data-front=false]{--scale:var(--toasts-before) * 0.05 + 1;--y:translateY(calc(var(--lift-amount) * var(--toasts-before))) scale(calc(-1 * var(--scale)));height:var(--front-toast-height)}[data-sonner-toast]>*{transition:opacity .4s}[data-sonner-toast][data-x-position=right]{right:0}[data-sonner-toast][data-x-position=left]{left:0}[data-sonner-toast][data-expanded=false][data-front=false][data-styled=true]>*{opacity:0}[data-sonner-toast][data-visible=false]{opacity:0;pointer-events:none}[data-sonner-toast][data-mounted=true][data-expanded=true]{--y:translateY(calc(var(--lift) * var(--offset)));height:var(--initial-height)}[data-sonner-toast][data-removed=true][data-front=true][data-swipe-out=false]{--y:translateY(calc(var(--lift) * -100%));opacity:0}[data-sonner-toast][data-removed=true][data-front=false][data-swipe-out=false][data-expanded=true]{--y:translateY(calc(var(--lift) * var(--offset) + var(--lift) * -100%));opacity:0}[data-sonner-toast][data-removed=true][data-front=false][data-swipe-out=false][data-expanded=false]{--y:translateY(40%);opacity:0;transition:transform .5s,opacity .2s}[data-sonner-toast][data-removed=true][data-front=false]::before{height:calc(var(--initial-height) + 20%)}[data-sonner-toast][data-swiping=true]{transform:var(--y) translateY(var(--swipe-amount-y,0)) translateX(var(--swipe-amount-x,0));transition:none}[data-sonner-toast][data-swiped=true]{user-select:none}[data-sonner-toast][data-swipe-out=true][data-y-position=bottom],[data-sonner-toast][data-swipe-out=true][data-y-position=top]{animation-duration:.2s;animation-timing-function:ease-out;animation-fill-mode:forwards}[data-sonner-toast][data-swipe-out=true][data-swipe-direction=left]{animation-name:swipe-out-left}[data-sonner-toast][data-swipe-out=true][data-swipe-direction=right]{animation-name:swipe-out-right}[data-sonner-toast][data-swipe-out=true][data-swipe-direction=up]{animation-name:swipe-out-up}[data-sonner-toast][data-swipe-out=true][data-swipe-direction=down]{animation-name:swipe-out-down}@keyframes swipe-out-left{from{transform:var(--y) translateX(var(--swipe-amount-x));opacity:1}to{transform:var(--y) translateX(calc(var(--swipe-amount-x) - 100%));opacity:0}}@keyframes swipe-out-right{from{transform:var(--y) translateX(var(--swipe-amount-x));opacity:1}to{transform:var(--y) translateX(calc(var(--swipe-amount-x) + 100%));opacity:0}}@keyframes swipe-out-up{from{transform:var(--y) translateY(var(--swipe-amount-y));opacity:1}to{transform:var(--y) translateY(calc(var(--swipe-amount-y) - 100%));opacity:0}}@keyframes swipe-out-down{from{transform:var(--y) translateY(var(--swipe-amount-y));opacity:1}to{transform:var(--y) translateY(calc(var(--swipe-amount-y) + 100%));opacity:0}}@media (max-width:600px){[data-sonner-toaster]{position:fixed;right:var(--mobile-offset-right);left:var(--mobile-offset-left);width:100%}[data-sonner-toaster][dir=rtl]{left:calc(var(--mobile-offset-left) * -1)}[data-sonner-toaster] [data-sonner-toast]{left:0;right:0;width:calc(100% - var(--mobile-offset-left) * 2)}[data-sonner-toaster][data-x-position=left]{left:var(--mobile-offset-left)}[data-sonner-toaster][data-y-position=bottom]{bottom:var(--mobile-offset-bottom)}[data-sonner-toaster][data-y-position=top]{top:var(--mobile-offset-top)}[data-sonner-toaster][data-x-position=center]{left:var(--mobile-offset-left);right:var(--mobile-offset-right);transform:none}}[data-sonner-toaster][data-sonner-theme=light]{--normal-bg:#fff;--normal-border:var(--gray4);--normal-text:var(--gray12);--success-bg:hsl(143, 85%, 96%);--success-border:hsl(145, 92%, 87%);--success-text:hsl(140, 100%, 27%);--info-bg:hsl(208, 100%, 97%);--info-border:hsl(221, 91%, 93%);--info-text:hsl(210, 92%, 45%);--warning-bg:hsl(49, 100%, 97%);--warning-border:hsl(49, 91%, 84%);--warning-text:hsl(31, 92%, 45%);--error-bg:hsl(359, 100%, 97%);--error-border:hsl(359, 100%, 94%);--error-text:hsl(360, 100%, 45%)}[data-sonner-toaster][data-sonner-theme=light] [data-sonner-toast][data-invert=true]{--normal-bg:#000;--normal-border:hsl(0, 0%, 20%);--normal-text:var(--gray1)}[data-sonner-toaster][data-sonner-theme=dark] [data-sonner-toast][data-invert=true]{--normal-bg:#fff;--normal-border:var(--gray3);--normal-text:var(--gray12)}[data-sonner-toaster][data-sonner-theme=dark]{--normal-bg:#000;--normal-bg-hover:hsl(0, 0%, 12%);--normal-border:hsl(0, 0%, 20%);--normal-border-hover:hsl(0, 0%, 25%);--normal-text:var(--gray1);--success-bg:hsl(150, 100%, 6%);--success-border:hsl(147, 100%, 12%);--success-text:hsl(150, 86%, 65%);--info-bg:hsl(215, 100%, 6%);--info-border:hsl(223, 43%, 17%);--info-text:hsl(216, 87%, 65%);--warning-bg:hsl(64, 100%, 6%);--warning-border:hsl(60, 100%, 9%);--warning-text:hsl(46, 87%, 65%);--error-bg:hsl(358, 76%, 10%);--error-border:hsl(357, 89%, 16%);--error-text:hsl(358, 100%, 81%)}[data-sonner-toaster][data-sonner-theme=dark] [data-sonner-toast] [data-close-button]{background:var(--normal-bg);border-color:var(--normal-border);color:var(--normal-text)}[data-sonner-toaster][data-sonner-theme=dark] [data-sonner-toast] [data-close-button]:hover{background:var(--normal-bg-hover);border-color:var(--normal-border-hover)}[data-rich-colors=true][data-sonner-toast][data-type=success]{background:var(--success-bg);border-color:var(--success-border);color:var(--success-text)}[data-rich-colors=true][data-sonner-toast][data-type=success] [data-close-button]{background:var(--success-bg);border-color:var(--success-border);color:var(--success-text)}[data-rich-colors=true][data-sonner-toast][data-type=info]{background:var(--info-bg);border-color:var(--info-border);color:var(--info-text)}[data-rich-colors=true][data-sonner-toast][data-type=info] [data-close-button]{background:var(--info-bg);border-color:var(--info-border);color:var(--info-text)}[data-rich-colors=true][data-sonner-toast][data-type=warning]{background:var(--warning-bg);border-color:var(--warning-border);color:var(--warning-text)}[data-rich-colors=true][data-sonner-toast][data-type=warning] [data-close-button]{background:var(--warning-bg);border-color:var(--warning-border);color:var(--warning-text)}[data-rich-colors=true][data-sonner-toast][data-type=error]{background:var(--error-bg);border-color:var(--error-border);color:var(--error-text)}[data-rich-colors=true][data-sonner-toast][data-type=error] [data-close-button]{background:var(--error-bg);border-color:var(--error-border);color:var(--error-text)}.sonner-loading-wrapper{--size:16px;height:var(--size);width:var(--size);position:absolute;inset:0;z-index:10}.sonner-loading-wrapper[data-visible=false]{transform-origin:center;animation:sonner-fade-out .2s ease forwards}.sonner-spinner{position:relative;top:50%;left:50%;height:var(--size);width:var(--size)}.sonner-loading-bar{animation:sonner-spin 1.2s linear infinite;background:var(--gray11);border-radius:6px;height:8%;left:-10%;position:absolute;top:-3.9%;width:24%}.sonner-loading-bar:first-child{animation-delay:-1.2s;transform:rotate(.0001deg) translate(146%)}.sonner-loading-bar:nth-child(2){animation-delay:-1.1s;transform:rotate(30deg) translate(146%)}.sonner-loading-bar:nth-child(3){animation-delay:-1s;transform:rotate(60deg) translate(146%)}.sonner-loading-bar:nth-child(4){animation-delay:-.9s;transform:rotate(90deg) translate(146%)}.sonner-loading-bar:nth-child(5){animation-delay:-.8s;transform:rotate(120deg) translate(146%)}.sonner-loading-bar:nth-child(6){animation-delay:-.7s;transform:rotate(150deg) translate(146%)}.sonner-loading-bar:nth-child(7){animation-delay:-.6s;transform:rotate(180deg) translate(146%)}.sonner-loading-bar:nth-child(8){animation-delay:-.5s;transform:rotate(210deg) translate(146%)}.sonner-loading-bar:nth-child(9){animation-delay:-.4s;transform:rotate(240deg) translate(146%)}.sonner-loading-bar:nth-child(10){animation-delay:-.3s;transform:rotate(270deg) translate(146%)}.sonner-loading-bar:nth-child(11){animation-delay:-.2s;transform:rotate(300deg) translate(146%)}.sonner-loading-bar:nth-child(12){animation-delay:-.1s;transform:rotate(330deg) translate(146%)}@keyframes sonner-fade-in{0%{opacity:0;transform:scale(.8)}100%{opacity:1;transform:scale(1)}}@keyframes sonner-fade-out{0%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(.8)}}@keyframes sonner-spin{0%{opacity:1}100%{opacity:.15}}@media (prefers-reduced-motion){.sonner-loading-bar,[data-sonner-toast],[data-sonner-toast]>*{transition:none!important;animation:none!important}}.sonner-loader{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);transform-origin:center;transition:opacity .2s,transform .2s}.sonner-loader[data-visible=false]{opacity:0;transform:scale(.8) translate(-50%,-50%)}");
-
 function AlertTitle({ className, ...props }) {
     return (jsx("div", { "data-slot": "alert-title", className: cn('col-start-2 line-clamp-1 min-h-4 font-medium tracking-tight', className), ...props }));
 }
@@ -12850,7 +12556,7 @@ var Popover$1 = (props) => {
 };
 Popover$1.displayName = POPOVER_NAME;
 var ANCHOR_NAME$2 = "PopoverAnchor";
-var PopoverAnchor = React.forwardRef(
+var PopoverAnchor$1 = React.forwardRef(
   (props, forwardedRef) => {
     const { __scopePopover, ...anchorProps } = props;
     const context = usePopoverContext(ANCHOR_NAME$2, __scopePopover);
@@ -12863,7 +12569,7 @@ var PopoverAnchor = React.forwardRef(
     return /* @__PURE__ */ jsx(Anchor$1, { ...popperScope, ...anchorProps, ref: forwardedRef });
   }
 );
-PopoverAnchor.displayName = ANCHOR_NAME$2;
+PopoverAnchor$1.displayName = ANCHOR_NAME$2;
 var TRIGGER_NAME$5 = "PopoverTrigger";
 var PopoverTrigger$1 = React.forwardRef(
   (props, forwardedRef) => {
@@ -13083,6 +12789,7 @@ function getState$2(open) {
   return open ? "open" : "closed";
 }
 var Root2$3 = Popover$1;
+var Anchor2$1 = PopoverAnchor$1;
 var Trigger$4 = PopoverTrigger$1;
 var Portal$4 = PopoverPortal;
 var Content2$4 = PopoverContent$1;
@@ -13096,6 +12803,9 @@ function PopoverTrigger({ ...props }) {
 function PopoverContent({ className, align = 'center', sideOffset = 8, ...props }) {
     return (jsx(Portal$4, { children: jsx(Content2$4, { "data-slot": "popover-content", align: align, sideOffset: sideOffset, className: cn('bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-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 z-50 w-72 origin-(--radix-popover-content-transform-origin) rounded-md border p-4 shadow-md outline-hidden', className), ...props }) }));
 }
+function PopoverAnchor({ ...props }) {
+    return jsx(Anchor2$1, { "data-slot": "popover-anchor", ...props });
+}
 
 const SCROLL_THRESHOLD = 50;
 function useSearchableSelect({ selectedItem, onChange, getOptionKey, getOptionLabel, getOptionSubLabel, fetchPage, staticOptions, filterFn, preSelectedId, resolveById, pageSize, debounceMs, }) {
@@ -21224,14 +20934,14 @@ function useRefundToWallet(open) {
     return { refundToWallet, setRefundToWallet };
 }
 
-const ConfirmDialog = ({ open, onOpenChange, title, description, info, confirmLabel = 'Yes', cancelLabel = 'Cancel', confirmVariant = 'default', disabled = false, onConfirm, onCancel, }) => {
+const ConfirmDialog = ({ open, onOpenChange, title, description, info, confirmLabel = 'Yes', cancelLabel = 'Cancel', confirmVariant = 'default', icon: Icon = Trash2, disabled = false, onConfirm, onCancel, }) => {
     const { refundToWallet, setRefundToWallet } = useRefundToWallet(open);
-    return (jsx(Dialog, { open: open, onOpenChange: onOpenChange, children: jsxs(DialogContent, { children: [jsxs(DialogHeader, { children: [jsxs(DialogTitle, { className: "flex items-center gap-2", children: [confirmVariant === 'destructive' && (jsx("span", { className: "inline-flex h-8 w-8 shrink-0 items-center justify-center rounded-full bg-destructive/10", children: jsx(Trash2, { className: "h-4 w-4 text-destructive" }) })), jsx("span", { children: title })] }), description && (jsx(DialogDescription, { className: "mt-2", children: description })), info && (jsx(InfoCard, { info: info, title: title, refundToWallet: refundToWallet, onRefundChange: setRefundToWallet }))] }), jsxs(DialogFooter, { className: "mt-4", children: [jsx(Button$1, { variant: "outline", onClick: () => {
+    return (jsx(Dialog, { open: open, onOpenChange: onOpenChange, children: jsxs(DialogContent, { className: "gap-3 p-5", children: [jsxs(DialogHeader, { className: "gap-1.5", children: [jsxs(DialogTitle, { className: "flex items-center gap-2", children: [confirmVariant === 'destructive' && (jsx("span", { className: "inline-flex h-7 w-7 shrink-0 items-center justify-center rounded-full bg-destructive/10", children: jsx(Icon, { className: "h-3.5 w-3.5 text-destructive" }) })), jsx("span", { children: title })] }), description && jsx(DialogDescription, { children: description }), info && (jsx(InfoCard, { info: info, title: title, refundToWallet: refundToWallet, onRefundChange: setRefundToWallet }))] }), jsxs(DialogFooter, { className: "mt-1", children: [jsx(Button$1, { variant: "outline", onClick: () => {
                                 onCancel?.();
                                 onOpenChange(false);
                             }, disabled: disabled, children: cancelLabel }), jsxs(Button$1, { variant: confirmVariant, onClick: async () => {
                                 await onConfirm(title === 'Cancel Invoice' ? refundToWallet : undefined);
-                            }, disabled: disabled, className: "ml-3", children: [confirmVariant === 'destructive' && (jsx(Trash2, { className: "mr-1.5 h-4 w-4", "aria-hidden": true })), disabled ? 'Please wait...' : confirmLabel] })] })] }) }));
+                            }, disabled: disabled, children: [confirmVariant === 'destructive' && (jsx(Icon, { className: "h-4 w-4", "aria-hidden": true })), disabled ? 'Please wait...' : confirmLabel] })] })] }) }));
 };
 
 /** Class builder for a segment button in the `segmented` variant. */
@@ -35021,11 +34731,18 @@ function DatePickerHeader({ monthDate, changeYear, changeMonth, decreaseMonth, i
 function DateInput({ value, onChange, onBlur, name, className, min, max, disabled, placeholder = 'Select date', }) {
     const [open, setOpen] = useState(false);
     const { minDate, maxDate, minYear, maxYear } = computeDateBounds(min, max);
-    const openPicker = () => {
-        if (!disabled)
-            setOpen(true);
-    };
-    return (jsxs(Popover, { open: open, onOpenChange: setOpen, children: [jsx(PopoverTrigger, { asChild: true, children: jsxs("button", { type: "button", name: name, onBlur: onBlur, onClick: openPicker, disabled: disabled, "data-slot": "input", "data-empty": !value || undefined, className: cn('border-input-border flex h-9 w-full min-w-0 cursor-pointer items-center justify-between gap-2 rounded-md border bg-transparent px-3 py-1 text-left shadow-[0_1px_2px_0_#0000000d] transition-[color,box-shadow] outline-none', 'focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]', 'aria-invalid:ring-destructive/20 aria-invalid:border-destructive', disabled && 'cursor-not-allowed bg-muted text-label', className), children: [jsx("span", { className: cn('truncate text-sm md:text-sm', value ? 'text-foreground' : 'text-placeholder'), children: value ? moment(value).format('DD/MM/YYYY') : placeholder }), jsx("span", { className: "inline-flex h-4 w-4 shrink-0 items-center justify-center text-muted-foreground", children: jsx(CalendarDays, { className: "h-4 w-4 stroke-[1.75]" }) })] }) }), jsx(PopoverContent, { align: "start", className: "date-range-picker-popover w-auto p-4", children: jsx(DatePicker, { inline: true, selected: value ?? null, minDate: minDate ? moment(minDate, 'YYYY-MM-DD').toDate() : undefined, maxDate: maxDate ? moment(maxDate, 'YYYY-MM-DD').toDate() : undefined, onChange: (date) => {
+    // NOTE: We drive `open` ourselves from the button's onClick instead of using
+    // Radix's <PopoverTrigger> toggle. When this Popover is nested inside the
+    // modal <SlideOut> (Radix Dialog), the trigger's built-in toggle does not
+    // fire in Safari, so the calendar never opened. Using <PopoverAnchor> (pure
+    // positioning, no event handlers) + a single controlled toggle is the one
+    // source of truth — no double-fire, and it works across browsers. `modal`
+    // lets the open popover own pointer events above the dialog so the calendar
+    // (portalled to <body>) stays clickable.
+    return (jsxs(Popover, { open: open, onOpenChange: setOpen, modal: true, children: [jsx(PopoverAnchor, { asChild: true, children: jsxs("button", { type: "button", name: name, onBlur: onBlur, disabled: disabled, "aria-haspopup": "dialog", "aria-expanded": open, onClick: () => {
+                        if (!disabled)
+                            setOpen((prev) => !prev);
+                    }, "data-slot": "input", "data-empty": !value || undefined, className: cn('border-input-border flex h-9 w-full min-w-0 cursor-pointer items-center justify-between gap-2 rounded-md border bg-transparent px-3 py-1 text-left shadow-[0_1px_2px_0_#0000000d] transition-[color,box-shadow] outline-none', 'focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]', 'aria-invalid:ring-destructive/20 aria-invalid:border-destructive', disabled && 'cursor-not-allowed bg-muted text-label', className), children: [jsx("span", { className: cn('truncate text-sm md:text-sm', value ? 'text-foreground' : 'text-placeholder'), children: value ? moment(value).format('DD/MM/YYYY') : placeholder }), jsx("span", { className: "inline-flex h-4 w-4 shrink-0 items-center justify-center text-muted-foreground", children: jsx(CalendarDays, { className: "h-4 w-4 stroke-[1.75]" }) })] }) }), jsx(PopoverContent, { align: "start", className: "date-range-picker-popover w-auto p-4", children: jsx(DatePicker, { inline: true, selected: value ?? null, minDate: minDate ? moment(minDate, 'YYYY-MM-DD').toDate() : undefined, maxDate: maxDate ? moment(maxDate, 'YYYY-MM-DD').toDate() : undefined, onChange: (date) => {
                         onChange(date ?? undefined);
                         if (date)
                             setOpen(false);
@@ -65174,6 +64891,10 @@ var Highlight = Mark.create({
   }
 });
 
+// StarterKit v3 already bundles the Underline mark. Re-registering the
+// standalone @tiptap/extension-underline duplicates the mark, which corrupts
+// the ProseMirror schema and makes editor.getHTML() throw
+// ("Cannot read properties of null (reading 'cached')").
 const EDITOR_EXTENSIONS = [
     index_default.configure({
         paragraph: {
@@ -65185,7 +64906,6 @@ const EDITOR_EXTENSIONS = [
             levels: [1, 2, 3],
         },
     }),
-    Underline,
     TextStyle,
     Color,
     Highlight.configure({ multicolor: true }),
@@ -73683,7 +73403,7 @@ function ImageCropModal({ open, imageUrl, fileType, onCancel, onConfirm, }) {
                             return (jsxs("button", { type: "button", onClick: () => setAspectKey(a.key), className: cn('flex cursor-pointer flex-col items-center justify-center gap-1 rounded-lg border px-3 py-3 text-xs transition-colors', selected
                                     ? 'border-primary bg-primary/10 text-primary'
                                     : 'border-transparent bg-[#FAFAFA] text-foreground hover:bg-muted/50 dark:bg-[#262626]'), children: [a.icon, jsx("span", { children: a.label })] }, a.key));
-                        }) })] }), jsxs("div", { className: "bg-muted px-6 py-4", children: [jsx("div", { className: "flex max-h-[420px] items-center justify-center overflow-auto", children: jsx(S, { crop: crop, onChange: (c) => setCrop(c), onComplete: (c) => setCompletedCrop(c), aspect: aspect, keepSelection: true, children: jsx("img", { ref: imgRef, src: imageUrl, alt: "Crop preview", onLoad: handleImageLoad, className: "max-h-[400px] object-contain" }) }) }), jsx("p", { className: "mt-3 text-center text-sm text-muted-foreground", children: "Drag the handles or click and drag on the image to redefine the crop area" })] })] }));
+                        }) })] }), jsxs("div", { className: "bg-muted px-6 py-4", children: [jsx("div", { className: "flex max-h-[420px] items-center justify-center overflow-auto", children: jsx(S, { crop: crop, onChange: (c) => setCrop(c), onComplete: (c) => setCompletedCrop(c), aspect: aspect, keepSelection: true, className: "max-h-[400px]", children: jsx("img", { ref: imgRef, src: imageUrl, alt: "Crop preview", onLoad: handleImageLoad, className: "block h-auto max-h-[400px] w-auto" }) }) }), jsx("p", { className: "mt-3 text-center text-sm text-muted-foreground", children: "Drag the handles or click and drag on the image to redefine the crop area" })] })] }));
 }
 async function getCroppedBlob(img, crop, mime) {
     const canvas = document.createElement('canvas');
@@ -76193,6 +75913,8 @@ function useRichTextareaEditor(value, onChange, disabled) {
         content: value,
         editable: !disabled,
         onUpdate: ({ editor }) => {
+            if (editor.isDestroyed)
+                return;
             onChange?.(editor.getHTML());
         },
         editorProps: {
@@ -76202,7 +75924,12 @@ function useRichTextareaEditor(value, onChange, disabled) {
         },
     });
     useEffect(() => {
-        if (editor && value !== editor.getHTML()) {
+        // `editor.getHTML()` reads `editor.schema`, which TipTap sets to null when
+        // the editor is destroyed. React StrictMode (dev) and editor re-creation
+        // can run this effect against a destroyed editor, so guard before calling
+        // any schema-dependent method — otherwise DOMSerializer.fromSchema(null)
+        // throws "Cannot read properties of null (reading 'cached')".
+        if (editor && !editor.isDestroyed && value !== editor.getHTML()) {
             editor.commands.setContent(value);
         }
     }, [value, editor]);