Invoice ${invoice_number || ""}

Invoice Date

${formatDate(issue_date)}

From

${senderName ? `

${senderName}

` : ""} ${senderEmail ? `

${senderEmail}

` : ""} ${senderPhone ? `

${senderPhone}

` : ""} ${senderAddress ? `

${senderAddress}

` : ""}

Due Date

${due_date ? `${formatDate(due_date)}` : ""}

Billed To

${client_name ? `

${client_name}

` : ""} ${client_email ? `

${client_email}

` : ""} ${billedPhone ? `

${billedPhone}

` : ""} ${client_address ? `

${client_address}

` : ""}

Description

Rate

Qty

Amount

${filteredLineItems.map( (item, idx) => `

${item?.description ?? ""}

${formatCurrency(Number(item?.rate || 0))}

${Number(item?.quantity || 0)}

${formatCurrency(Number(item?.amount || Number(item?.quantity || 0) * Number(item?.rate || 0)))}

` ).join("")} ${filteredLineItems.length === 0 ? `

No items added yet

` : ""}

Subtotal

${formatCurrency(subtotalVal)}

${taxLabel || "Tax"}

${formatCurrency(tax)}

Discount

${formatCurrency(computedDiscount)}

Total

${formatCurrency(total_amount)}

Balance Due

${formatCurrency(total_amount)}

${notes ? `

Notes

${notes}

` : ""}

`; } // virtual:/apps/web/src/components/Invoice/InvoiceHeader.jsx init_injected_globals(); var import_react4 = __toESM(require_react()); var import_lucide_react = __toESM(require_lucide_react()); // ../../../node_modules/@tanstack/react-query/build/modern/index.js init_injected_globals(); // ../../../node_modules/@tanstack/query-core/build/modern/index.js init_injected_globals(); // ../../../node_modules/@tanstack/query-core/build/modern/retryer.js init_injected_globals(); // ../../../node_modules/@tanstack/query-core/build/modern/focusManager.js init_injected_globals(); // ../../../node_modules/@tanstack/query-core/build/modern/subscribable.js init_injected_globals(); var Subscribable = class { constructor() { this.listeners = /* @__PURE__ */ new Set(); this.subscribe = this.subscribe.bind(this); } subscribe(listener) { this.listeners.add(listener); this.onSubscribe(); return () => { this.listeners.delete(listener); this.onUnsubscribe(); }; } hasListeners() { return this.listeners.size > 0; } onSubscribe() { } onUnsubscribe() { } }; // ../../../node_modules/@tanstack/query-core/build/modern/utils.js init_injected_globals(); var isServer = typeof window === "undefined" || "Deno" in globalThis; function noop() { } function functionalUpdate(updater, input) { return typeof updater === "function" ? updater(input) : updater; } function isValidTimeout(value) { return typeof value === "number" && value >= 0 && value !== Infinity; } function timeUntilStale(updatedAt, staleTime) { return Math.max(updatedAt + (staleTime || 0) - Date.now(), 0); } function resolveStaleTime(staleTime, query) { return typeof staleTime === "function" ? staleTime(query) : staleTime; } function resolveEnabled(enabled, query) { return typeof enabled === "function" ? enabled(query) : enabled; } function matchQuery(filters, query) { const { type = "all", exact, fetchStatus, predicate, queryKey, stale } = filters; if (queryKey) { if (exact) { if (query.queryHash !== hashQueryKeyByOptions(queryKey, query.options)) { return false; } } else if (!partialMatchKey(query.queryKey, queryKey)) { return false; } } if (type !== "all") { const isActive = query.isActive(); if (type === "active" && !isActive) { return false; } if (type === "inactive" && isActive) { return false; } } if (typeof stale === "boolean" && query.isStale() !== stale) { return false; } if (fetchStatus && fetchStatus !== query.state.fetchStatus) { return false; } if (predicate && !predicate(query)) { return false; } return true; } function matchMutation(filters, mutation) { const { exact, status, predicate, mutationKey } = filters; if (mutationKey) { if (!mutation.options.mutationKey) { return false; } if (exact) { if (hashKey(mutation.options.mutationKey) !== hashKey(mutationKey)) { return false; } } else if (!partialMatchKey(mutation.options.mutationKey, mutationKey)) { return false; } } if (status && mutation.state.status !== status) { return false; } if (predicate && !predicate(mutation)) { return false; } return true; } function hashQueryKeyByOptions(queryKey, options) { const hashFn = options?.queryKeyHashFn || hashKey; return hashFn(queryKey); } function hashKey(queryKey) { return JSON.stringify( queryKey, (_, val) => isPlainObject(val) ? Object.keys(val).sort().reduce((result, key) => { result[key] = val[key]; return result; }, {}) : val ); } function partialMatchKey(a, b) { if (a === b) { return true; } if (typeof a !== typeof b) { return false; } if (a && b && typeof a === "object" && typeof b === "object") { return Object.keys(b).every((key) => partialMatchKey(a[key], b[key])); } return false; } function replaceEqualDeep(a, b) { if (a === b) { return a; } const array = isPlainArray(a) && isPlainArray(b); if (array || isPlainObject(a) && isPlainObject(b)) { const aItems = array ? a : Object.keys(a); const aSize = aItems.length; const bItems = array ? b : Object.keys(b); const bSize = bItems.length; const copy = array ? [] : {}; let equalItems = 0; for (let i = 0; i < bSize; i++) { const key = array ? i : bItems[i]; if ((!array && aItems.includes(key) || array) && a[key] === void 0 && b[key] === void 0) { copy[key] = void 0; equalItems++; } else { copy[key] = replaceEqualDeep(a[key], b[key]); if (copy[key] === a[key] && a[key] !== void 0) { equalItems++; } } } return aSize === bSize && equalItems === aSize ? a : copy; } return b; } function shallowEqualObjects(a, b) { if (!b || Object.keys(a).length !== Object.keys(b).length) { return false; } for (const key in a) { if (a[key] !== b[key]) { return false; } } return true; } function isPlainArray(value) { return Array.isArray(value) && value.length === Object.keys(value).length; } function isPlainObject(o) { if (!hasObjectPrototype(o)) { return false; } const ctor = o.constructor; if (ctor === void 0) { return true; } const prot = ctor.prototype; if (!hasObjectPrototype(prot)) { return false; } if (!prot.hasOwnProperty("isPrototypeOf")) { return false; } if (Object.getPrototypeOf(o) !== Object.prototype) { return false; } return true; } function hasObjectPrototype(o) { return Object.prototype.toString.call(o) === "[object Object]"; } function sleep(timeout) { return new Promise((resolve) => { setTimeout(resolve, timeout); }); } function replaceData(prevData, data, options) { if (typeof options.structuralSharing === "function") { return options.structuralSharing(prevData, data); } else if (options.structuralSharing !== false) { if (false) { try { return replaceEqualDeep(prevData, data); } catch (error) { console.error( `Structural sharing requires data to be JSON serializable. To fix this, turn off structuralSharing or return JSON-serializable data from your queryFn. [${options.queryHash}]: ${error}` ); throw error; } } return replaceEqualDeep(prevData, data); } return data; } function addToEnd(items, item, max = 0) { const newItems = [...items, item]; return max && newItems.length > max ? newItems.slice(1) : newItems; } function addToStart(items, item, max = 0) { const newItems = [item, ...items]; return max && newItems.length > max ? newItems.slice(0, -1) : newItems; } var skipToken = Symbol(); function ensureQueryFn(options, fetchOptions) { if (false) { if (options.queryFn === skipToken) { console.error( `Attempted to invoke queryFn when set to skipToken. This is likely a configuration error. Query hash: '${options.queryHash}'` ); } } if (!options.queryFn && fetchOptions?.initialPromise) { return () => fetchOptions.initialPromise; } if (!options.queryFn || options.queryFn === skipToken) { return () => Promise.reject(new Error(`Missing queryFn: '${options.queryHash}'`)); } return options.queryFn; } // ../../../node_modules/@tanstack/query-core/build/modern/focusManager.js var FocusManager = class extends Subscribable { #focused; #cleanup; #setup; constructor() { super(); this.#setup = (onFocus) => { if (!isServer && window.addEventListener) { const listener = () => onFocus(); window.addEventListener("visibilitychange", listener, false); return () => { window.removeEventListener("visibilitychange", listener); }; } return; }; } onSubscribe() { if (!this.#cleanup) { this.setEventListener(this.#setup); } } onUnsubscribe() { if (!this.hasListeners()) { this.#cleanup?.(); this.#cleanup = void 0; } } setEventListener(setup) { this.#setup = setup; this.#cleanup?.(); this.#cleanup = setup((focused) => { if (typeof focused === "boolean") { this.setFocused(focused); } else { this.onFocus(); } }); } setFocused(focused) { const changed = this.#focused !== focused; if (changed) { this.#focused = focused; this.onFocus(); } } onFocus() { const isFocused = this.isFocused(); this.listeners.forEach((listener) => { listener(isFocused); }); } isFocused() { if (typeof this.#focused === "boolean") { return this.#focused; } return globalThis.document?.visibilityState !== "hidden"; } }; var focusManager = new FocusManager(); // ../../../node_modules/@tanstack/query-core/build/modern/onlineManager.js init_injected_globals(); var OnlineManager = class extends Subscribable { #online = true; #cleanup; #setup; constructor() { super(); this.#setup = (onOnline) => { if (!isServer && window.addEventListener) { const onlineListener = () => onOnline(true); const offlineListener = () => onOnline(false); window.addEventListener("online", onlineListener, false); window.addEventListener("offline", offlineListener, false); return () => { window.removeEventListener("online", onlineListener); window.removeEventListener("offline", offlineListener); }; } return; }; } onSubscribe() { if (!this.#cleanup) { this.setEventListener(this.#setup); } } onUnsubscribe() { if (!this.hasListeners()) { this.#cleanup?.(); this.#cleanup = void 0; } } setEventListener(setup) { this.#setup = setup; this.#cleanup?.(); this.#cleanup = setup(this.setOnline.bind(this)); } setOnline(online) { const changed = this.#online !== online; if (changed) { this.#online = online; this.listeners.forEach((listener) => { listener(online); }); } } isOnline() { return this.#online; } }; var onlineManager = new OnlineManager(); // ../../../node_modules/@tanstack/query-core/build/modern/thenable.js init_injected_globals(); function pendingThenable() { let resolve; let reject; const thenable = new Promise((_resolve, _reject) => { resolve = _resolve; reject = _reject; }); thenable.status = "pending"; thenable.catch(() => { }); function finalize(data) { Object.assign(thenable, data); delete thenable.resolve; delete thenable.reject; } thenable.resolve = (value) => { finalize({ status: "fulfilled", value }); resolve(value); }; thenable.reject = (reason) => { finalize({ status: "rejected", reason }); reject(reason); }; return thenable; } // ../../../node_modules/@tanstack/query-core/build/modern/retryer.js function defaultRetryDelay(failureCount) { return Math.min(1e3 * 2 ** failureCount, 3e4); } function canFetch(networkMode) { return (networkMode ?? "online") === "online" ? onlineManager.isOnline() : true; } var CancelledError = class extends Error { constructor(options) { super("CancelledError"); this.revert = options?.revert; this.silent = options?.silent; } }; function isCancelledError(value) { return value instanceof CancelledError; } function createRetryer(config) { let isRetryCancelled = false; let failureCount = 0; let isResolved = false; let continueFn; const thenable = pendingThenable(); const cancel = (cancelOptions) => { if (!isResolved) { reject(new CancelledError(cancelOptions)); config.abort?.(); } }; const cancelRetry = () => { isRetryCancelled = true; }; const continueRetry = () => { isRetryCancelled = false; }; const canContinue = () => focusManager.isFocused() && (config.networkMode === "always" || onlineManager.isOnline()) && config.canRun(); const canStart = () => canFetch(config.networkMode) && config.canRun(); const resolve = (value) => { if (!isResolved) { isResolved = true; config.onSuccess?.(value); continueFn?.(); thenable.resolve(value); } }; const reject = (value) => { if (!isResolved) { isResolved = true; config.onError?.(value); continueFn?.(); thenable.reject(value); } }; const pause = () => { return new Promise((continueResolve) => { continueFn = (value) => { if (isResolved || canContinue()) { continueResolve(value); } }; config.onPause?.(); }).then(() => { continueFn = void 0; if (!isResolved) { config.onContinue?.(); } }); }; const run = () => { if (isResolved) { return; } let promiseOrValue; const initialPromise = failureCount === 0 ? config.initialPromise : void 0; try { promiseOrValue = initialPromise ?? config.fn(); } catch (error) { promiseOrValue = Promise.reject(error); } Promise.resolve(promiseOrValue).then(resolve).catch((error) => { if (isResolved) { return; } const retry = config.retry ?? (isServer ? 0 : 3); const retryDelay = config.retryDelay ?? defaultRetryDelay; const delay = typeof retryDelay === "function" ? retryDelay(failureCount, error) : retryDelay; const shouldRetry = retry === true || typeof retry === "number" && failureCount < retry || typeof retry === "function" && retry(failureCount, error); if (isRetryCancelled || !shouldRetry) { reject(error); return; } failureCount++; config.onFail?.(failureCount, error); sleep(delay).then(() => { return canContinue() ? void 0 : pause(); }).then(() => { if (isRetryCancelled) { reject(error); } else { run(); } }); }); }; return { promise: thenable, cancel, continue: () => { continueFn?.(); return thenable; }, cancelRetry, continueRetry, canStart, start: () => { if (canStart()) { run(); } else { pause().then(run); } return thenable; } }; } // ../../../node_modules/@tanstack/query-core/build/modern/queryCache.js init_injected_globals(); // ../../../node_modules/@tanstack/query-core/build/modern/query.js init_injected_globals(); // ../../../node_modules/@tanstack/query-core/build/modern/notifyManager.js init_injected_globals(); var defaultScheduler = (cb) => setTimeout(cb, 0); function createNotifyManager() { let queue = []; let transactions = 0; let notifyFn = (callback) => { callback(); }; let batchNotifyFn = (callback) => { callback(); }; let scheduleFn = defaultScheduler; const schedule = (callback) => { if (transactions) { queue.push(callback); } else { scheduleFn(() => { notifyFn(callback); }); } }; const flush = () => { const originalQueue = queue; queue = []; if (originalQueue.length) { scheduleFn(() => { batchNotifyFn(() => { originalQueue.forEach((callback) => { notifyFn(callback); }); }); }); } }; return { batch: (callback) => { let result; transactions++; try { result = callback(); } finally { transactions--; if (!transactions) { flush(); } } return result; }, /** * All calls to the wrapped function will be batched. */ batchCalls: (callback) => { return (...args) => { schedule(() => { callback(...args); }); }; }, schedule, /** * Use this method to set a custom notify function. * This can be used to for example wrap notifications with `React.act` while running tests. */ setNotifyFunction: (fn) => { notifyFn = fn; }, /** * Use this method to set a custom function to batch notifications together into a single tick. * By default React Query will use the batch function provided by ReactDOM or React Native. */ setBatchNotifyFunction: (fn) => { batchNotifyFn = fn; }, setScheduler: (fn) => { scheduleFn = fn; } }; } var notifyManager = createNotifyManager(); // ../../../node_modules/@tanstack/query-core/build/modern/removable.js init_injected_globals(); var Removable = class { #gcTimeout; destroy() { this.clearGcTimeout(); } scheduleGc() { this.clearGcTimeout(); if (isValidTimeout(this.gcTime)) { this.#gcTimeout = setTimeout(() => { this.optionalRemove(); }, this.gcTime); } } updateGcTime(newGcTime) { this.gcTime = Math.max( this.gcTime || 0, newGcTime ?? (isServer ? Infinity : 5 * 60 * 1e3) ); } clearGcTimeout() { if (this.#gcTimeout) { clearTimeout(this.#gcTimeout); this.#gcTimeout = void 0; } } }; // ../../../node_modules/@tanstack/query-core/build/modern/query.js var Query = class extends Removable { #initialState; #revertState; #cache; #client; #retryer; #defaultOptions; #abortSignalConsumed; constructor(config) { super(); this.#abortSignalConsumed = false; this.#defaultOptions = config.defaultOptions; this.setOptions(config.options); this.observers = []; this.#client = config.client; this.#cache = this.#client.getQueryCache(); this.queryKey = config.queryKey; this.queryHash = config.queryHash; this.#initialState = getDefaultState(this.options); this.state = config.state ?? this.#initialState; this.scheduleGc(); } get meta() { return this.options.meta; } get promise() { return this.#retryer?.promise; } setOptions(options) { this.options = { ...this.#defaultOptions, ...options }; this.updateGcTime(this.options.gcTime); } optionalRemove() { if (!this.observers.length && this.state.fetchStatus === "idle") { this.#cache.remove(this); } } setData(newData, options) { const data = replaceData(this.state.data, newData, this.options); this.#dispatch({ data, type: "success", dataUpdatedAt: options?.updatedAt, manual: options?.manual }); return data; } setState(state, setStateOptions) { this.#dispatch({ type: "setState", state, setStateOptions }); } cancel(options) { const promise = this.#retryer?.promise; this.#retryer?.cancel(options); return promise ? promise.then(noop).catch(noop) : Promise.resolve(); } destroy() { super.destroy(); this.cancel({ silent: true }); } reset() { this.destroy(); this.setState(this.#initialState); } isActive() { return this.observers.some( (observer) => resolveEnabled(observer.options.enabled, this) !== false ); } isDisabled() { if (this.getObserversCount() > 0) { return !this.isActive(); } return this.options.queryFn === skipToken || this.state.dataUpdateCount + this.state.errorUpdateCount === 0; } isStale() { if (this.state.isInvalidated) { return true; } if (this.getObserversCount() > 0) { return this.observers.some( (observer) => observer.getCurrentResult().isStale ); } return this.state.data === void 0; } isStaleByTime(staleTime = 0) { return this.state.isInvalidated || this.state.data === void 0 || !timeUntilStale(this.state.dataUpdatedAt, staleTime); } onFocus() { const observer = this.observers.find((x) => x.shouldFetchOnWindowFocus()); observer?.refetch({ cancelRefetch: false }); this.#retryer?.continue(); } onOnline() { const observer = this.observers.find((x) => x.shouldFetchOnReconnect()); observer?.refetch({ cancelRefetch: false }); this.#retryer?.continue(); } addObserver(observer) { if (!this.observers.includes(observer)) { this.observers.push(observer); this.clearGcTimeout(); this.#cache.notify({ type: "observerAdded", query: this, observer }); } } removeObserver(observer) { if (this.observers.includes(observer)) { this.observers = this.observers.filter((x) => x !== observer); if (!this.observers.length) { if (this.#retryer) { if (this.#abortSignalConsumed) { this.#retryer.cancel({ revert: true }); } else { this.#retryer.cancelRetry(); } } this.scheduleGc(); } this.#cache.notify({ type: "observerRemoved", query: this, observer }); } } getObserversCount() { return this.observers.length; } invalidate() { if (!this.state.isInvalidated) { this.#dispatch({ type: "invalidate" }); } } fetch(options, fetchOptions) { if (this.state.fetchStatus !== "idle") { if (this.state.data !== void 0 && fetchOptions?.cancelRefetch) { this.cancel({ silent: true }); } else if (this.#retryer) { this.#retryer.continueRetry(); return this.#retryer.promise; } } if (options) { this.setOptions(options); } if (!this.options.queryFn) { const observer = this.observers.find((x) => x.options.queryFn); if (observer) { this.setOptions(observer.options); } } if (false) { if (!Array.isArray(this.options.queryKey)) { console.error( `As of v4, queryKey needs to be an Array. If you are using a string like 'repoData', please change it to an Array, e.g. ['repoData']` ); } } const abortController = new AbortController(); const addSignalProperty = (object) => { Object.defineProperty(object, "signal", { enumerable: true, get: () => { this.#abortSignalConsumed = true; return abortController.signal; } }); }; const fetchFn = () => { const queryFn = ensureQueryFn(this.options, fetchOptions); const queryFnContext = { client: this.#client, queryKey: this.queryKey, meta: this.meta }; addSignalProperty(queryFnContext); this.#abortSignalConsumed = false; if (this.options.persister) { return this.options.persister( queryFn, queryFnContext, this ); } return queryFn(queryFnContext); }; const context = { fetchOptions, options: this.options, queryKey: this.queryKey, client: this.#client, state: this.state, fetchFn }; addSignalProperty(context); this.options.behavior?.onFetch( context, this ); this.#revertState = this.state; if (this.state.fetchStatus === "idle" || this.state.fetchMeta !== context.fetchOptions?.meta) { this.#dispatch({ type: "fetch", meta: context.fetchOptions?.meta }); } const onError = (error) => { if (!(isCancelledError(error) && error.silent)) { this.#dispatch({ type: "error", error }); } if (!isCancelledError(error)) { this.#cache.config.onError?.( error, this ); this.#cache.config.onSettled?.( this.state.data, error, this ); } this.scheduleGc(); }; this.#retryer = createRetryer({ initialPromise: fetchOptions?.initialPromise, fn: context.fetchFn, abort: abortController.abort.bind(abortController), onSuccess: (data) => { if (data === void 0) { if (false) { console.error( `Query data cannot be undefined. Please make sure to return a value other than undefined from your query function. Affected query key: ${this.queryHash}` ); } onError(new Error(`${this.queryHash} data is undefined`)); return; } try { this.setData(data); } catch (error) { onError(error); return; } this.#cache.config.onSuccess?.(data, this); this.#cache.config.onSettled?.( data, this.state.error, this ); this.scheduleGc(); }, onError, onFail: (failureCount, error) => { this.#dispatch({ type: "failed", failureCount, error }); }, onPause: () => { this.#dispatch({ type: "pause" }); }, onContinue: () => { this.#dispatch({ type: "continue" }); }, retry: context.options.retry, retryDelay: context.options.retryDelay, networkMode: context.options.networkMode, canRun: () => true }); return this.#retryer.start(); } #dispatch(action) { const reducer = (state) => { switch (action.type) { case "failed": return { ...state, fetchFailureCount: action.failureCount, fetchFailureReason: action.error }; case "pause": return { ...state, fetchStatus: "paused" }; case "continue": return { ...state, fetchStatus: "fetching" }; case "fetch": return { ...state, ...fetchState(state.data, this.options), fetchMeta: action.meta ?? null }; case "success": return { ...state, data: action.data, dataUpdateCount: state.dataUpdateCount + 1, dataUpdatedAt: action.dataUpdatedAt ?? Date.now(), error: null, isInvalidated: false, status: "success", ...!action.manual && { fetchStatus: "idle", fetchFailureCount: 0, fetchFailureReason: null } }; case "error": const error = action.error; if (isCancelledError(error) && error.revert && this.#revertState) { return { ...this.#revertState, fetchStatus: "idle" }; } return { ...state, error, errorUpdateCount: state.errorUpdateCount + 1, errorUpdatedAt: Date.now(), fetchFailureCount: state.fetchFailureCount + 1, fetchFailureReason: error, fetchStatus: "idle", status: "error" }; case "invalidate": return { ...state, isInvalidated: true }; case "setState": return { ...state, ...action.state }; } }; this.state = reducer(this.state); notifyManager.batch(() => { this.observers.forEach((observer) => { observer.onQueryUpdate(); }); this.#cache.notify({ query: this, type: "updated", action }); }); } }; function fetchState(data, options) { return { fetchFailureCount: 0, fetchFailureReason: null, fetchStatus: canFetch(options.networkMode) ? "fetching" : "paused", ...data === void 0 && { error: null, status: "pending" } }; } function getDefaultState(options) { const data = typeof options.initialData === "function" ? options.initialData() : options.initialData; const hasData = data !== void 0; const initialDataUpdatedAt = hasData ? typeof options.initialDataUpdatedAt === "function" ? options.initialDataUpdatedAt() : options.initialDataUpdatedAt : 0; return { data, dataUpdateCount: 0, dataUpdatedAt: hasData ? initialDataUpdatedAt ?? Date.now() : 0, error: null, errorUpdateCount: 0, errorUpdatedAt: 0, fetchFailureCount: 0, fetchFailureReason: null, fetchMeta: null, isInvalidated: false, status: hasData ? "success" : "pending", fetchStatus: "idle" }; } // ../../../node_modules/@tanstack/query-core/build/modern/queryCache.js var QueryCache = class extends Subscribable { constructor(config = {}) { super(); this.config = config; this.#queries = /* @__PURE__ */ new Map(); } #queries; build(client, options, state) { const queryKey = options.queryKey; const queryHash = options.queryHash ?? hashQueryKeyByOptions(queryKey, options); let query = this.get(queryHash); if (!query) { query = new Query({ client, queryKey, queryHash, options: client.defaultQueryOptions(options), state, defaultOptions: client.getQueryDefaults(queryKey) }); this.add(query); } return query; } add(query) { if (!this.#queries.has(query.queryHash)) { this.#queries.set(query.queryHash, query); this.notify({ type: "added", query }); } } remove(query) { const queryInMap = this.#queries.get(query.queryHash); if (queryInMap) { query.destroy(); if (queryInMap === query) { this.#queries.delete(query.queryHash); } this.notify({ type: "removed", query }); } } clear() { notifyManager.batch(() => { this.getAll().forEach((query) => { this.remove(query); }); }); } get(queryHash) { return this.#queries.get(queryHash); } getAll() { return [...this.#queries.values()]; } find(filters) { const defaultedFilters = { exact: true, ...filters }; return this.getAll().find( (query) => matchQuery(defaultedFilters, query) ); } findAll(filters = {}) { const queries = this.getAll(); return Object.keys(filters).length > 0 ? queries.filter((query) => matchQuery(filters, query)) : queries; } notify(event) { notifyManager.batch(() => { this.listeners.forEach((listener) => { listener(event); }); }); } onFocus() { notifyManager.batch(() => { this.getAll().forEach((query) => { query.onFocus(); }); }); } onOnline() { notifyManager.batch(() => { this.getAll().forEach((query) => { query.onOnline(); }); }); } }; // ../../../node_modules/@tanstack/query-core/build/modern/queryClient.js init_injected_globals(); // ../../../node_modules/@tanstack/query-core/build/modern/mutationCache.js init_injected_globals(); // ../../../node_modules/@tanstack/query-core/build/modern/mutation.js init_injected_globals(); var Mutation = class extends Removable { #observers; #mutationCache; #retryer; constructor(config) { super(); this.mutationId = config.mutationId; this.#mutationCache = config.mutationCache; this.#observers = []; this.state = config.state || getDefaultState2(); this.setOptions(config.options); this.scheduleGc(); } setOptions(options) { this.options = options; this.updateGcTime(this.options.gcTime); } get meta() { return this.options.meta; } addObserver(observer) { if (!this.#observers.includes(observer)) { this.#observers.push(observer); this.clearGcTimeout(); this.#mutationCache.notify({ type: "observerAdded", mutation: this, observer }); } } removeObserver(observer) { this.#observers = this.#observers.filter((x) => x !== observer); this.scheduleGc(); this.#mutationCache.notify({ type: "observerRemoved", mutation: this, observer }); } optionalRemove() { if (!this.#observers.length) { if (this.state.status === "pending") { this.scheduleGc(); } else { this.#mutationCache.remove(this); } } } continue() { return this.#retryer?.continue() ?? // continuing a mutation assumes that variables are set, mutation must have been dehydrated before this.execute(this.state.variables); } async execute(variables) { const onContinue = () => { this.#dispatch({ type: "continue" }); }; this.#retryer = createRetryer({ fn: () => { if (!this.options.mutationFn) { return Promise.reject(new Error("No mutationFn found")); } return this.options.mutationFn(variables); }, onFail: (failureCount, error) => { this.#dispatch({ type: "failed", failureCount, error }); }, onPause: () => { this.#dispatch({ type: "pause" }); }, onContinue, retry: this.options.retry ?? 0, retryDelay: this.options.retryDelay, networkMode: this.options.networkMode, canRun: () => this.#mutationCache.canRun(this) }); const restored = this.state.status === "pending"; const isPaused = !this.#retryer.canStart(); try { if (restored) { onContinue(); } else { this.#dispatch({ type: "pending", variables, isPaused }); await this.#mutationCache.config.onMutate?.( variables, this ); const context = await this.options.onMutate?.(variables); if (context !== this.state.context) { this.#dispatch({ type: "pending", context, variables, isPaused }); } } const data = await this.#retryer.start(); await this.#mutationCache.config.onSuccess?.( data, variables, this.state.context, this ); await this.options.onSuccess?.(data, variables, this.state.context); await this.#mutationCache.config.onSettled?.( data, null, this.state.variables, this.state.context, this ); await this.options.onSettled?.(data, null, variables, this.state.context); this.#dispatch({ type: "success", data }); return data; } catch (error) { try { await this.#mutationCache.config.onError?.( error, variables, this.state.context, this ); await this.options.onError?.( error, variables, this.state.context ); await this.#mutationCache.config.onSettled?.( void 0, error, this.state.variables, this.state.context, this ); await this.options.onSettled?.( void 0, error, variables, this.state.context ); throw error; } finally { this.#dispatch({ type: "error", error }); } } finally { this.#mutationCache.runNext(this); } } #dispatch(action) { const reducer = (state) => { switch (action.type) { case "failed": return { ...state, failureCount: action.failureCount, failureReason: action.error }; case "pause": return { ...state, isPaused: true }; case "continue": return { ...state, isPaused: false }; case "pending": return { ...state, context: action.context, data: void 0, failureCount: 0, failureReason: null, error: null, isPaused: action.isPaused, status: "pending", variables: action.variables, submittedAt: Date.now() }; case "success": return { ...state, data: action.data, failureCount: 0, failureReason: null, error: null, status: "success", isPaused: false }; case "error": return { ...state, data: void 0, error: action.error, failureCount: state.failureCount + 1, failureReason: action.error, isPaused: false, status: "error" }; } }; this.state = reducer(this.state); notifyManager.batch(() => { this.#observers.forEach((observer) => { observer.onMutationUpdate(action); }); this.#mutationCache.notify({ mutation: this, type: "updated", action }); }); } }; function getDefaultState2() { return { context: void 0, data: void 0, error: null, failureCount: 0, failureReason: null, isPaused: false, status: "idle", variables: void 0, submittedAt: 0 }; } // ../../../node_modules/@tanstack/query-core/build/modern/mutationCache.js var MutationCache = class extends Subscribable { constructor(config = {}) { super(); this.config = config; this.#mutations = /* @__PURE__ */ new Set(); this.#scopes = /* @__PURE__ */ new Map(); this.#mutationId = 0; } #mutations; #scopes; #mutationId; build(client, options, state) { const mutation = new Mutation({ mutationCache: this, mutationId: ++this.#mutationId, options: client.defaultMutationOptions(options), state }); this.add(mutation); return mutation; } add(mutation) { this.#mutations.add(mutation); const scope = scopeFor(mutation); if (typeof scope === "string") { const scopedMutations = this.#scopes.get(scope); if (scopedMutations) { scopedMutations.push(mutation); } else { this.#scopes.set(scope, [mutation]); } } this.notify({ type: "added", mutation }); } remove(mutation) { if (this.#mutations.delete(mutation)) { const scope = scopeFor(mutation); if (typeof scope === "string") { const scopedMutations = this.#scopes.get(scope); if (scopedMutations) { if (scopedMutations.length > 1) { const index = scopedMutations.indexOf(mutation); if (index !== -1) { scopedMutations.splice(index, 1); } } else if (scopedMutations[0] === mutation) { this.#scopes.delete(scope); } } } } this.notify({ type: "removed", mutation }); } canRun(mutation) { const scope = scopeFor(mutation); if (typeof scope === "string") { const mutationsWithSameScope = this.#scopes.get(scope); const firstPendingMutation = mutationsWithSameScope?.find( (m) => m.state.status === "pending" ); return !firstPendingMutation || firstPendingMutation === mutation; } else { return true; } } runNext(mutation) { const scope = scopeFor(mutation); if (typeof scope === "string") { const foundMutation = this.#scopes.get(scope)?.find((m) => m !== mutation && m.state.isPaused); return foundMutation?.continue() ?? Promise.resolve(); } else { return Promise.resolve(); } } clear() { notifyManager.batch(() => { this.#mutations.forEach((mutation) => { this.notify({ type: "removed", mutation }); }); this.#mutations.clear(); this.#scopes.clear(); }); } getAll() { return Array.from(this.#mutations); } find(filters) { const defaultedFilters = { exact: true, ...filters }; return this.getAll().find( (mutation) => matchMutation(defaultedFilters, mutation) ); } findAll(filters = {}) { return this.getAll().filter((mutation) => matchMutation(filters, mutation)); } notify(event) { notifyManager.batch(() => { this.listeners.forEach((listener) => { listener(event); }); }); } resumePausedMutations() { const pausedMutations = this.getAll().filter((x) => x.state.isPaused); return notifyManager.batch( () => Promise.all( pausedMutations.map((mutation) => mutation.continue().catch(noop)) ) ); } }; function scopeFor(mutation) { return mutation.options.scope?.id; } // ../../../node_modules/@tanstack/query-core/build/modern/infiniteQueryBehavior.js init_injected_globals(); function infiniteQueryBehavior(pages) { return { onFetch: (context, query) => { const options = context.options; const direction = context.fetchOptions?.meta?.fetchMore?.direction; const oldPages = context.state.data?.pages || []; const oldPageParams = context.state.data?.pageParams || []; let result = { pages: [], pageParams: [] }; let currentPage = 0; const fetchFn = async () => { let cancelled = false; const addSignalProperty = (object) => { Object.defineProperty(object, "signal", { enumerable: true, get: () => { if (context.signal.aborted) { cancelled = true; } else { context.signal.addEventListener("abort", () => { cancelled = true; }); } return context.signal; } }); }; const queryFn = ensureQueryFn(context.options, context.fetchOptions); const fetchPage = async (data, param, previous) => { if (cancelled) { return Promise.reject(); } if (param == null && data.pages.length) { return Promise.resolve(data); } const queryFnContext = { client: context.client, queryKey: context.queryKey, pageParam: param, direction: previous ? "backward" : "forward", meta: context.options.meta }; addSignalProperty(queryFnContext); const page = await queryFn( queryFnContext ); const { maxPages } = context.options; const addTo = previous ? addToStart : addToEnd; return { pages: addTo(data.pages, page, maxPages), pageParams: addTo(data.pageParams, param, maxPages) }; }; if (direction && oldPages.length) { const previous = direction === "backward"; const pageParamFn = previous ? getPreviousPageParam : getNextPageParam; const oldData = { pages: oldPages, pageParams: oldPageParams }; const param = pageParamFn(options, oldData); result = await fetchPage(oldData, param, previous); } else { const remainingPages = pages ?? oldPages.length; do { const param = currentPage === 0 ? oldPageParams[0] ?? options.initialPageParam : getNextPageParam(options, result); if (currentPage > 0 && param == null) { break; } result = await fetchPage(result, param); currentPage++; } while (currentPage < remainingPages); } return result; }; if (context.options.persister) { context.fetchFn = () => { return context.options.persister?.( fetchFn, { client: context.client, queryKey: context.queryKey, meta: context.options.meta, signal: context.signal }, query ); }; } else { context.fetchFn = fetchFn; } } }; } function getNextPageParam(options, { pages, pageParams }) { const lastIndex = pages.length - 1; return pages.length > 0 ? options.getNextPageParam( pages[lastIndex], pages, pageParams[lastIndex], pageParams ) : void 0; } function getPreviousPageParam(options, { pages, pageParams }) { return pages.length > 0 ? options.getPreviousPageParam?.(pages[0], pages, pageParams[0], pageParams) : void 0; } // ../../../node_modules/@tanstack/query-core/build/modern/queryClient.js var QueryClient = class { #queryCache; #mutationCache; #defaultOptions; #queryDefaults; #mutationDefaults; #mountCount; #unsubscribeFocus; #unsubscribeOnline; constructor(config = {}) { this.#queryCache = config.queryCache || new QueryCache(); this.#mutationCache = config.mutationCache || new MutationCache(); this.#defaultOptions = config.defaultOptions || {}; this.#queryDefaults = /* @__PURE__ */ new Map(); this.#mutationDefaults = /* @__PURE__ */ new Map(); this.#mountCount = 0; } mount() { this.#mountCount++; if (this.#mountCount !== 1) return; this.#unsubscribeFocus = focusManager.subscribe(async (focused) => { if (focused) { await this.resumePausedMutations(); this.#queryCache.onFocus(); } }); this.#unsubscribeOnline = onlineManager.subscribe(async (online) => { if (online) { await this.resumePausedMutations(); this.#queryCache.onOnline(); } }); } unmount() { this.#mountCount--; if (this.#mountCount !== 0) return; this.#unsubscribeFocus?.(); this.#unsubscribeFocus = void 0; this.#unsubscribeOnline?.(); this.#unsubscribeOnline = void 0; } isFetching(filters) { return this.#queryCache.findAll({ ...filters, fetchStatus: "fetching" }).length; } isMutating(filters) { return this.#mutationCache.findAll({ ...filters, status: "pending" }).length; } /** * Imperative (non-reactive) way to retrieve data for a QueryKey. * Should only be used in callbacks or functions where reading the latest data is necessary, e.g. for optimistic updates. * * Hint: Do not use this function inside a component, because it won't receive updates. * Use `useQuery` to create a `QueryObserver` that subscribes to changes. */ getQueryData(queryKey) { const options = this.defaultQueryOptions({ queryKey }); return this.#queryCache.get(options.queryHash)?.state.data; } ensureQueryData(options) { const defaultedOptions = this.defaultQueryOptions(options); const query = this.#queryCache.build(this, defaultedOptions); const cachedData = query.state.data; if (cachedData === void 0) { return this.fetchQuery(options); } if (options.revalidateIfStale && query.isStaleByTime(resolveStaleTime(defaultedOptions.staleTime, query))) { void this.prefetchQuery(defaultedOptions); } return Promise.resolve(cachedData); } getQueriesData(filters) { return this.#queryCache.findAll(filters).map(({ queryKey, state }) => { const data = state.data; return [queryKey, data]; }); } setQueryData(queryKey, updater, options) { const defaultedOptions = this.defaultQueryOptions({ queryKey }); const query = this.#queryCache.get( defaultedOptions.queryHash ); const prevData = query?.state.data; const data = functionalUpdate(updater, prevData); if (data === void 0) { return void 0; } return this.#queryCache.build(this, defaultedOptions).setData(data, { ...options, manual: true }); } setQueriesData(filters, updater, options) { return notifyManager.batch( () => this.#queryCache.findAll(filters).map(({ queryKey }) => [ queryKey, this.setQueryData(queryKey, updater, options) ]) ); } getQueryState(queryKey) { const options = this.defaultQueryOptions({ queryKey }); return this.#queryCache.get( options.queryHash )?.state; } removeQueries(filters) { const queryCache = this.#queryCache; notifyManager.batch(() => { queryCache.findAll(filters).forEach((query) => { queryCache.remove(query); }); }); } resetQueries(filters, options) { const queryCache = this.#queryCache; return notifyManager.batch(() => { queryCache.findAll(filters).forEach((query) => { query.reset(); }); return this.refetchQueries( { type: "active", ...filters }, options ); }); } cancelQueries(filters, cancelOptions = {}) { const defaultedCancelOptions = { revert: true, ...cancelOptions }; const promises = notifyManager.batch( () => this.#queryCache.findAll(filters).map((query) => query.cancel(defaultedCancelOptions)) ); return Promise.all(promises).then(noop).catch(noop); } invalidateQueries(filters, options = {}) { return notifyManager.batch(() => { this.#queryCache.findAll(filters).forEach((query) => { query.invalidate(); }); if (filters?.refetchType === "none") { return Promise.resolve(); } return this.refetchQueries( { ...filters, type: filters?.refetchType ?? filters?.type ?? "active" }, options ); }); } refetchQueries(filters, options = {}) { const fetchOptions = { ...options, cancelRefetch: options.cancelRefetch ?? true }; const promises = notifyManager.batch( () => this.#queryCache.findAll(filters).filter((query) => !query.isDisabled()).map((query) => { let promise = query.fetch(void 0, fetchOptions); if (!fetchOptions.throwOnError) { promise = promise.catch(noop); } return query.state.fetchStatus === "paused" ? Promise.resolve() : promise; }) ); return Promise.all(promises).then(noop); } fetchQuery(options) { const defaultedOptions = this.defaultQueryOptions(options); if (defaultedOptions.retry === void 0) { defaultedOptions.retry = false; } const query = this.#queryCache.build(this, defaultedOptions); return query.isStaleByTime( resolveStaleTime(defaultedOptions.staleTime, query) ) ? query.fetch(defaultedOptions) : Promise.resolve(query.state.data); } prefetchQuery(options) { return this.fetchQuery(options).then(noop).catch(noop); } fetchInfiniteQuery(options) { options.behavior = infiniteQueryBehavior(options.pages); return this.fetchQuery(options); } prefetchInfiniteQuery(options) { return this.fetchInfiniteQuery(options).then(noop).catch(noop); } ensureInfiniteQueryData(options) { options.behavior = infiniteQueryBehavior(options.pages); return this.ensureQueryData(options); } resumePausedMutations() { if (onlineManager.isOnline()) { return this.#mutationCache.resumePausedMutations(); } return Promise.resolve(); } getQueryCache() { return this.#queryCache; } getMutationCache() { return this.#mutationCache; } getDefaultOptions() { return this.#defaultOptions; } setDefaultOptions(options) { this.#defaultOptions = options; } setQueryDefaults(queryKey, options) { this.#queryDefaults.set(hashKey(queryKey), { queryKey, defaultOptions: options }); } getQueryDefaults(queryKey) { const defaults = [...this.#queryDefaults.values()]; const result = {}; defaults.forEach((queryDefault) => { if (partialMatchKey(queryKey, queryDefault.queryKey)) { Object.assign(result, queryDefault.defaultOptions); } }); return result; } setMutationDefaults(mutationKey, options) { this.#mutationDefaults.set(hashKey(mutationKey), { mutationKey, defaultOptions: options }); } getMutationDefaults(mutationKey) { const defaults = [...this.#mutationDefaults.values()]; const result = {}; defaults.forEach((queryDefault) => { if (partialMatchKey(mutationKey, queryDefault.mutationKey)) { Object.assign(result, queryDefault.defaultOptions); } }); return result; } defaultQueryOptions(options) { if (options._defaulted) { return options; } const defaultedOptions = { ...this.#defaultOptions.queries, ...this.getQueryDefaults(options.queryKey), ...options, _defaulted: true }; if (!defaultedOptions.queryHash) { defaultedOptions.queryHash = hashQueryKeyByOptions( defaultedOptions.queryKey, defaultedOptions ); } if (defaultedOptions.refetchOnReconnect === void 0) { defaultedOptions.refetchOnReconnect = defaultedOptions.networkMode !== "always"; } if (defaultedOptions.throwOnError === void 0) { defaultedOptions.throwOnError = !!defaultedOptions.suspense; } if (!defaultedOptions.networkMode && defaultedOptions.persister) { defaultedOptions.networkMode = "offlineFirst"; } if (defaultedOptions.queryFn === skipToken) { defaultedOptions.enabled = false; } return defaultedOptions; } defaultMutationOptions(options) { if (options?._defaulted) { return options; } return { ...this.#defaultOptions.mutations, ...options?.mutationKey && this.getMutationDefaults(options.mutationKey), ...options, _defaulted: true }; } clear() { this.#queryCache.clear(); this.#mutationCache.clear(); } }; // ../../../node_modules/@tanstack/query-core/build/modern/queryObserver.js init_injected_globals(); var QueryObserver = class extends Subscribable { constructor(client, options) { super(); this.options = options; this.#client = client; this.#selectError = null; this.#currentThenable = pendingThenable(); if (!this.options.experimental_prefetchInRender) { this.#currentThenable.reject( new Error("experimental_prefetchInRender feature flag is not enabled") ); } this.bindMethods(); this.setOptions(options); } #client; #currentQuery = void 0; #currentQueryInitialState = void 0; #currentResult = void 0; #currentResultState; #currentResultOptions; #currentThenable; #selectError; #selectFn; #selectResult; // This property keeps track of the last query with defined data. // It will be used to pass the previous data and query to the placeholder function between renders. #lastQueryWithDefinedData; #staleTimeoutId; #refetchIntervalId; #currentRefetchInterval; #trackedProps = /* @__PURE__ */ new Set(); bindMethods() { this.refetch = this.refetch.bind(this); } onSubscribe() { if (this.listeners.size === 1) { this.#currentQuery.addObserver(this); if (shouldFetchOnMount(this.#currentQuery, this.options)) { this.#executeFetch(); } else { this.updateResult(); } this.#updateTimers(); } } onUnsubscribe() { if (!this.hasListeners()) { this.destroy(); } } shouldFetchOnReconnect() { return shouldFetchOn( this.#currentQuery, this.options, this.options.refetchOnReconnect ); } shouldFetchOnWindowFocus() { return shouldFetchOn( this.#currentQuery, this.options, this.options.refetchOnWindowFocus ); } destroy() { this.listeners = /* @__PURE__ */ new Set(); this.#clearStaleTimeout(); this.#clearRefetchInterval(); this.#currentQuery.removeObserver(this); } setOptions(options) { const prevOptions = this.options; const prevQuery = this.#currentQuery; this.options = this.#client.defaultQueryOptions(options); if (this.options.enabled !== void 0 && typeof this.options.enabled !== "boolean" && typeof this.options.enabled !== "function" && typeof resolveEnabled(this.options.enabled, this.#currentQuery) !== "boolean") { throw new Error( "Expected enabled to be a boolean or a callback that returns a boolean" ); } this.#updateQuery(); this.#currentQuery.setOptions(this.options); if (prevOptions._defaulted && !shallowEqualObjects(this.options, prevOptions)) { this.#client.getQueryCache().notify({ type: "observerOptionsUpdated", query: this.#currentQuery, observer: this }); } const mounted = this.hasListeners(); if (mounted && shouldFetchOptionally( this.#currentQuery, prevQuery, this.options, prevOptions )) { this.#executeFetch(); } this.updateResult(); if (mounted && (this.#currentQuery !== prevQuery || resolveEnabled(this.options.enabled, this.#currentQuery) !== resolveEnabled(prevOptions.enabled, this.#currentQuery) || resolveStaleTime(this.options.staleTime, this.#currentQuery) !== resolveStaleTime(prevOptions.staleTime, this.#currentQuery))) { this.#updateStaleTimeout(); } const nextRefetchInterval = this.#computeRefetchInterval(); if (mounted && (this.#currentQuery !== prevQuery || resolveEnabled(this.options.enabled, this.#currentQuery) !== resolveEnabled(prevOptions.enabled, this.#currentQuery) || nextRefetchInterval !== this.#currentRefetchInterval)) { this.#updateRefetchInterval(nextRefetchInterval); } } getOptimisticResult(options) { const query = this.#client.getQueryCache().build(this.#client, options); const result = this.createResult(query, options); if (shouldAssignObserverCurrentProperties(this, result)) { this.#currentResult = result; this.#currentResultOptions = this.options; this.#currentResultState = this.#currentQuery.state; } return result; } getCurrentResult() { return this.#currentResult; } trackResult(result, onPropTracked) { const trackedResult = {}; Object.keys(result).forEach((key) => { Object.defineProperty(trackedResult, key, { configurable: false, enumerable: true, get: () => { this.trackProp(key); onPropTracked?.(key); return result[key]; } }); }); return trackedResult; } trackProp(key) { this.#trackedProps.add(key); } getCurrentQuery() { return this.#currentQuery; } refetch({ ...options } = {}) { return this.fetch({ ...options }); } fetchOptimistic(options) { const defaultedOptions = this.#client.defaultQueryOptions(options); const query = this.#client.getQueryCache().build(this.#client, defaultedOptions); return query.fetch().then(() => this.createResult(query, defaultedOptions)); } fetch(fetchOptions) { return this.#executeFetch({ ...fetchOptions, cancelRefetch: fetchOptions.cancelRefetch ?? true }).then(() => { this.updateResult(); return this.#currentResult; }); } #executeFetch(fetchOptions) { this.#updateQuery(); let promise = this.#currentQuery.fetch( this.options, fetchOptions ); if (!fetchOptions?.throwOnError) { promise = promise.catch(noop); } return promise; } #updateStaleTimeout() { this.#clearStaleTimeout(); const staleTime = resolveStaleTime( this.options.staleTime, this.#currentQuery ); if (isServer || this.#currentResult.isStale || !isValidTimeout(staleTime)) { return; } const time = timeUntilStale(this.#currentResult.dataUpdatedAt, staleTime); const timeout = time + 1; this.#staleTimeoutId = setTimeout(() => { if (!this.#currentResult.isStale) { this.updateResult(); } }, timeout); } #computeRefetchInterval() { return (typeof this.options.refetchInterval === "function" ? this.options.refetchInterval(this.#currentQuery) : this.options.refetchInterval) ?? false; } #updateRefetchInterval(nextInterval) { this.#clearRefetchInterval(); this.#currentRefetchInterval = nextInterval; if (isServer || resolveEnabled(this.options.enabled, this.#currentQuery) === false || !isValidTimeout(this.#currentRefetchInterval) || this.#currentRefetchInterval === 0) { return; } this.#refetchIntervalId = setInterval(() => { if (this.options.refetchIntervalInBackground || focusManager.isFocused()) { this.#executeFetch(); } }, this.#currentRefetchInterval); } #updateTimers() { this.#updateStaleTimeout(); this.#updateRefetchInterval(this.#computeRefetchInterval()); } #clearStaleTimeout() { if (this.#staleTimeoutId) { clearTimeout(this.#staleTimeoutId); this.#staleTimeoutId = void 0; } } #clearRefetchInterval() { if (this.#refetchIntervalId) { clearInterval(this.#refetchIntervalId); this.#refetchIntervalId = void 0; } } createResult(query, options) { const prevQuery = this.#currentQuery; const prevOptions = this.options; const prevResult = this.#currentResult; const prevResultState = this.#currentResultState; const prevResultOptions = this.#currentResultOptions; const queryChange = query !== prevQuery; const queryInitialState = queryChange ? query.state : this.#currentQueryInitialState; const { state } = query; let newState = { ...state }; let isPlaceholderData = false; let data; if (options._optimisticResults) { const mounted = this.hasListeners(); const fetchOnMount = !mounted && shouldFetchOnMount(query, options); const fetchOptionally = mounted && shouldFetchOptionally(query, prevQuery, options, prevOptions); if (fetchOnMount || fetchOptionally) { newState = { ...newState, ...fetchState(state.data, query.options) }; } if (options._optimisticResults === "isRestoring") { newState.fetchStatus = "idle"; } } let { error, errorUpdatedAt, status } = newState; data = newState.data; let skipSelect = false; if (options.placeholderData !== void 0 && data === void 0 && status === "pending") { let placeholderData; if (prevResult?.isPlaceholderData && options.placeholderData === prevResultOptions?.placeholderData) { placeholderData = prevResult.data; skipSelect = true; } else { placeholderData = typeof options.placeholderData === "function" ? options.placeholderData( this.#lastQueryWithDefinedData?.state.data, this.#lastQueryWithDefinedData ) : options.placeholderData; } if (placeholderData !== void 0) { status = "success"; data = replaceData( prevResult?.data, placeholderData, options ); isPlaceholderData = true; } } if (options.select && data !== void 0 && !skipSelect) { if (prevResult && data === prevResultState?.data && options.select === this.#selectFn) { data = this.#selectResult; } else { try { this.#selectFn = options.select; data = options.select(data); data = replaceData(prevResult?.data, data, options); this.#selectResult = data; this.#selectError = null; } catch (selectError) { this.#selectError = selectError; } } } if (this.#selectError) { error = this.#selectError; data = this.#selectResult; errorUpdatedAt = Date.now(); status = "error"; } const isFetching = newState.fetchStatus === "fetching"; const isPending = status === "pending"; const isError = status === "error"; const isLoading = isPending && isFetching; const hasData = data !== void 0; const result = { status, fetchStatus: newState.fetchStatus, isPending, isSuccess: status === "success", isError, isInitialLoading: isLoading, isLoading, data, dataUpdatedAt: newState.dataUpdatedAt, error, errorUpdatedAt, failureCount: newState.fetchFailureCount, failureReason: newState.fetchFailureReason, errorUpdateCount: newState.errorUpdateCount, isFetched: newState.dataUpdateCount > 0 || newState.errorUpdateCount > 0, isFetchedAfterMount: newState.dataUpdateCount > queryInitialState.dataUpdateCount || newState.errorUpdateCount > queryInitialState.errorUpdateCount, isFetching, isRefetching: isFetching && !isPending, isLoadingError: isError && !hasData, isPaused: newState.fetchStatus === "paused", isPlaceholderData, isRefetchError: isError && hasData, isStale: isStale(query, options), refetch: this.refetch, promise: this.#currentThenable }; const nextResult = result; if (this.options.experimental_prefetchInRender) { const finalizeThenableIfPossible = (thenable) => { if (nextResult.status === "error") { thenable.reject(nextResult.error); } else if (nextResult.data !== void 0) { thenable.resolve(nextResult.data); } }; const recreateThenable = () => { const pending = this.#currentThenable = nextResult.promise = pendingThenable(); finalizeThenableIfPossible(pending); }; const prevThenable = this.#currentThenable; switch (prevThenable.status) { case "pending": if (query.queryHash === prevQuery.queryHash) { finalizeThenableIfPossible(prevThenable); } break; case "fulfilled": if (nextResult.status === "error" || nextResult.data !== prevThenable.value) { recreateThenable(); } break; case "rejected": if (nextResult.status !== "error" || nextResult.error !== prevThenable.reason) { recreateThenable(); } break; } } return nextResult; } updateResult() { const prevResult = this.#currentResult; const nextResult = this.createResult(this.#currentQuery, this.options); this.#currentResultState = this.#currentQuery.state; this.#currentResultOptions = this.options; if (this.#currentResultState.data !== void 0) { this.#lastQueryWithDefinedData = this.#currentQuery; } if (shallowEqualObjects(nextResult, prevResult)) { return; } this.#currentResult = nextResult; const shouldNotifyListeners = () => { if (!prevResult) { return true; } const { notifyOnChangeProps } = this.options; const notifyOnChangePropsValue = typeof notifyOnChangeProps === "function" ? notifyOnChangeProps() : notifyOnChangeProps; if (notifyOnChangePropsValue === "all" || !notifyOnChangePropsValue && !this.#trackedProps.size) { return true; } const includedProps = new Set( notifyOnChangePropsValue ?? this.#trackedProps ); if (this.options.throwOnError) { includedProps.add("error"); } return Object.keys(this.#currentResult).some((key) => { const typedKey = key; const changed = this.#currentResult[typedKey] !== prevResult[typedKey]; return changed && includedProps.has(typedKey); }); }; this.#notify({ listeners: shouldNotifyListeners() }); } #updateQuery() { const query = this.#client.getQueryCache().build(this.#client, this.options); if (query === this.#currentQuery) { return; } const prevQuery = this.#currentQuery; this.#currentQuery = query; this.#currentQueryInitialState = query.state; if (this.hasListeners()) { prevQuery?.removeObserver(this); query.addObserver(this); } } onQueryUpdate() { this.updateResult(); if (this.hasListeners()) { this.#updateTimers(); } } #notify(notifyOptions) { notifyManager.batch(() => { if (notifyOptions.listeners) { this.listeners.forEach((listener) => { listener(this.#currentResult); }); } this.#client.getQueryCache().notify({ query: this.#currentQuery, type: "observerResultsUpdated" }); }); } }; function shouldLoadOnMount(query, options) { return resolveEnabled(options.enabled, query) !== false && query.state.data === void 0 && !(query.state.status === "error" && options.retryOnMount === false); } function shouldFetchOnMount(query, options) { return shouldLoadOnMount(query, options) || query.state.data !== void 0 && shouldFetchOn(query, options, options.refetchOnMount); } function shouldFetchOn(query, options, field) { if (resolveEnabled(options.enabled, query) !== false) { const value = typeof field === "function" ? field(query) : field; return value === "always" || value !== false && isStale(query, options); } return false; } function shouldFetchOptionally(query, prevQuery, options, prevOptions) { return (query !== prevQuery || resolveEnabled(prevOptions.enabled, query) === false) && (!options.suspense || query.state.status !== "error") && isStale(query, options); } function isStale(query, options) { return resolveEnabled(options.enabled, query) !== false && query.isStaleByTime(resolveStaleTime(options.staleTime, query)); } function shouldAssignObserverCurrentProperties(observer, optimisticResult) { if (!shallowEqualObjects(observer.getCurrentResult(), optimisticResult)) { return true; } return false; } // ../../../node_modules/@tanstack/react-query/build/modern/QueryClientProvider.js init_injected_globals(); var React2 = __toESM(require_react(), 1); var import_jsx_runtime = __toESM(require_jsx_runtime(), 1); var QueryClientContext = React2.createContext( void 0 ); var useQueryClient = (queryClient2) => { const client = React2.useContext(QueryClientContext); if (queryClient2) { return queryClient2; } if (!client) { throw new Error("No QueryClient set, use QueryClientProvider to set one"); } return client; }; var QueryClientProvider = ({ client, children }) => { React2.useEffect(() => { client.mount(); return () => { client.unmount(); }; }, [client]); return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(QueryClientContext.Provider, { value: client, children }); }; // ../../../node_modules/@tanstack/react-query/build/modern/isRestoring.js init_injected_globals(); var React3 = __toESM(require_react(), 1); var IsRestoringContext = React3.createContext(false); var useIsRestoring = () => React3.useContext(IsRestoringContext); var IsRestoringProvider = IsRestoringContext.Provider; // ../../../node_modules/@tanstack/react-query/build/modern/QueryErrorResetBoundary.js init_injected_globals(); var React4 = __toESM(require_react(), 1); var import_jsx_runtime2 = __toESM(require_jsx_runtime(), 1); function createValue() { let isReset = false; return { clearReset: () => { isReset = false; }, reset: () => { isReset = true; }, isReset: () => { return isReset; } }; } var QueryErrorResetBoundaryContext = React4.createContext(createValue()); var useQueryErrorResetBoundary = () => React4.useContext(QueryErrorResetBoundaryContext); // ../../../node_modules/@tanstack/react-query/build/modern/errorBoundaryUtils.js init_injected_globals(); var React5 = __toESM(require_react(), 1); // ../../../node_modules/@tanstack/react-query/build/modern/utils.js init_injected_globals(); function shouldThrowError(throwError, params) { if (typeof throwError === "function") { return throwError(...params); } return !!throwError; } function noop2() { } // ../../../node_modules/@tanstack/react-query/build/modern/errorBoundaryUtils.js var ensurePreventErrorBoundaryRetry = (options, errorResetBoundary) => { if (options.suspense || options.throwOnError || options.experimental_prefetchInRender) { if (!errorResetBoundary.isReset()) { options.retryOnMount = false; } } }; var useClearResetErrorBoundary = (errorResetBoundary) => { React5.useEffect(() => { errorResetBoundary.clearReset(); }, [errorResetBoundary]); }; var getHasError = ({ result, errorResetBoundary, throwOnError, query, suspense }) => { return result.isError && !errorResetBoundary.isReset() && !result.isFetching && query && (suspense && result.data === void 0 || shouldThrowError(throwOnError, [result.error, query])); }; // ../../../node_modules/@tanstack/react-query/build/modern/suspense.js init_injected_globals(); var ensureSuspenseTimers = (defaultedOptions) => { const originalStaleTime = defaultedOptions.staleTime; if (defaultedOptions.suspense) { defaultedOptions.staleTime = typeof originalStaleTime === "function" ? (...args) => Math.max(originalStaleTime(...args), 1e3) : Math.max(originalStaleTime ?? 1e3, 1e3); if (typeof defaultedOptions.gcTime === "number") { defaultedOptions.gcTime = Math.max(defaultedOptions.gcTime, 1e3); } } }; var willFetch = (result, isRestoring) => result.isLoading && result.isFetching && !isRestoring; var shouldSuspend = (defaultedOptions, result) => defaultedOptions?.suspense && result.isPending; var fetchOptimistic = (defaultedOptions, observer, errorResetBoundary) => observer.fetchOptimistic(defaultedOptions).catch(() => { errorResetBoundary.clearReset(); }); // ../../../node_modules/@tanstack/react-query/build/modern/useQuery.js init_injected_globals(); // ../../../node_modules/@tanstack/react-query/build/modern/useBaseQuery.js init_injected_globals(); var React6 = __toESM(require_react(), 1); function useBaseQuery(options, Observer, queryClient2) { if (false) { if (typeof options !== "object" || Array.isArray(options)) { throw new Error( 'Bad argument type. Starting with v5, only the "Object" form is allowed when calling query related functions. Please use the error stack to find the culprit call. More info here: https://tanstack.com/query/latest/docs/react/guides/migrating-to-v5#supports-a-single-signature-one-object' ); } } const client = useQueryClient(queryClient2); const isRestoring = useIsRestoring(); const errorResetBoundary = useQueryErrorResetBoundary(); const defaultedOptions = client.defaultQueryOptions(options); client.getDefaultOptions().queries?._experimental_beforeQuery?.( defaultedOptions ); if (false) { if (!defaultedOptions.queryFn) { console.error( `[${defaultedOptions.queryHash}]: No queryFn was passed as an option, and no default queryFn was found. The queryFn parameter is only optional when using a default queryFn. More info here: https://tanstack.com/query/latest/docs/framework/react/guides/default-query-function` ); } } defaultedOptions._optimisticResults = isRestoring ? "isRestoring" : "optimistic"; ensureSuspenseTimers(defaultedOptions); ensurePreventErrorBoundaryRetry(defaultedOptions, errorResetBoundary); useClearResetErrorBoundary(errorResetBoundary); const isNewCacheEntry = !client.getQueryCache().get(defaultedOptions.queryHash); const [observer] = React6.useState( () => new Observer( client, defaultedOptions ) ); const result = observer.getOptimisticResult(defaultedOptions); const shouldSubscribe = !isRestoring && options.subscribed !== false; React6.useSyncExternalStore( React6.useCallback( (onStoreChange) => { const unsubscribe = shouldSubscribe ? observer.subscribe(notifyManager.batchCalls(onStoreChange)) : noop2; observer.updateResult(); return unsubscribe; }, [observer, shouldSubscribe] ), () => observer.getCurrentResult(), () => observer.getCurrentResult() ); React6.useEffect(() => { observer.setOptions(defaultedOptions); }, [defaultedOptions, observer]); if (shouldSuspend(defaultedOptions, result)) { throw fetchOptimistic(defaultedOptions, observer, errorResetBoundary); } if (getHasError({ result, errorResetBoundary, throwOnError: defaultedOptions.throwOnError, query: client.getQueryCache().get(defaultedOptions.queryHash), suspense: defaultedOptions.suspense })) { throw result.error; } ; client.getDefaultOptions().queries?._experimental_afterQuery?.( defaultedOptions, result ); if (defaultedOptions.experimental_prefetchInRender && !isServer && willFetch(result, isRestoring)) { const promise = isNewCacheEntry ? ( // Fetch immediately on render in order to ensure `.promise` is resolved even if the component is unmounted fetchOptimistic(defaultedOptions, observer, errorResetBoundary) ) : ( // subscribe to the "cache promise" so that we can finalize the currentThenable once data comes in client.getQueryCache().get(defaultedOptions.queryHash)?.promise ); promise?.catch(noop2).finally(() => { observer.updateResult(); }); } return !defaultedOptions.notifyOnChangeProps ? observer.trackResult(result) : result; } // ../../../node_modules/@tanstack/react-query/build/modern/useQuery.js function useQuery(options, queryClient2) { return useBaseQuery(options, QueryObserver, queryClient2); } // virtual:/apps/web/src/components/Invoice/InvoiceHeader.jsx function InvoiceHeader({ viewMode, setViewMode, onDownload, downloading, brandColor, // NEW: allow parent to control when download should be disabled downloadDisabled = false }) { const { data: brandAssets } = useQuery({ queryKey: ["brand-assets"], queryFn: async () => { const res = await fetch("/api/settings/brand-assets"); if (!res.ok) { throw new Error( `When fetching /api/settings/brand-assets, the response was [${res.status}] ${res.statusText}` ); } const json = await res.json(); return json.data || {}; }, // Always fetch fresh on mount so the live link picks up logo changes immediately staleTime: 0, refetchOnMount: "always", refetchOnWindowFocus: true }); const savedLogoUrl = brandAssets?.logoUrl || null; const [logoError, setLogoError] = (0, import_react4.useState)(false); const [proxyTried, setProxyTried] = (0, import_react4.useState)(false); const [proxiedSrc, setProxiedSrc] = (0, import_react4.useState)(null); (0, import_react4.useEffect)(() => { setLogoError(false); setProxyTried(false); setProxiedSrc(null); }, [savedLogoUrl]); const tryProxy = async () => { if (!savedLogoUrl || proxyTried) return; try { setProxyTried(true); const r = await fetch( `/api/utils/proxy-image?url=${encodeURIComponent(savedLogoUrl)}` ); if (r.ok) { const j = await r.json(); if (j?.dataUrl) { setProxiedSrc(j.dataUrl); setLogoError(false); return; } } setLogoError(true); } catch (e) { console.warn("Header logo proxy failed", e); setLogoError(true); } }; const handleLogoError = () => { if (!proxyTried) { tryProxy(); return; } setLogoError(true); }; const logoSrc = proxiedSrc || savedLogoUrl; return ( // Wrap header content in a centered container with max width 1056px /* @__PURE__ */ import_react4.default.createElement("div", { className: "h-[72px] bg-white border-b border-[#EAEAEA]" }, /* @__PURE__ */ import_react4.default.createElement("div", { className: "relative max-w-[1056px] mx-auto w-full flex items-center justify-between px-4 py-4" }, /* @__PURE__ */ import_react4.default.createElement("div", { className: "flex items-center gap-3" }, logoSrc && !logoError ? /* @__PURE__ */ import_react4.default.createElement( "img", { src: logoSrc, alt: "Logo", className: "w-8 h-8 object-contain", loading: "eager", decoding: "async", onError: handleLogoError, draggable: "false" } ) : ( // Fallback badge uses current brand color if available /* @__PURE__ */ import_react4.default.createElement( "div", { className: "w-8 h-8 text-white rounded-lg flex items-center justify-center text-sm font-medium", style: { backgroundColor: brandColor || "#2563EB" } }, "I" ) ), /* @__PURE__ */ import_react4.default.createElement("h1", { className: "text-[20px] font-medium text-[#111111] font-inter-display tracking-[-0.006em]" }, "Invoza")), /* @__PURE__ */ import_react4.default.createElement("div", { className: "hidden lg:block absolute left-1/2 -translate-x-1/2" }, /* @__PURE__ */ import_react4.default.createElement("div", { className: "w-[320px] flex bg-[#F7F7F7] rounded-[12px] p-1 overflow-hidden" }, /* @__PURE__ */ import_react4.default.createElement( "button", { onClick: () => setViewMode("preview"), className: `flex-1 h-8 rounded-[8px] text-sm font-medium transition-all text-center ${viewMode === "preview" ? "bg-white text-[#111111] shadow-sm" : "text-[#707070]"}` }, "Preview" ), /* @__PURE__ */ import_react4.default.createElement( "button", { onClick: () => setViewMode("edit"), className: `flex-1 h-8 rounded-[8px] text-sm font-medium transition-all text-center ${viewMode === "edit" ? "bg-white text-[#111111] shadow-sm" : "text-[#707070]"}` }, "Edit" ))), /* @__PURE__ */ import_react4.default.createElement("div", { className: "flex items-center" }, /* @__PURE__ */ import_react4.default.createElement( "button", { onClick: onDownload, disabled: downloading || downloadDisabled, title: downloadDisabled ? "Fill From, Billed To, and add at least one item with a rate" : void 0, className: "h-9 px-3 bg-[#2563EB] text-white rounded-xl flex items-center gap-2 text-sm font-medium hover:bg-[#1D4ED8] transition-colors disabled:opacity-50 disabled:cursor-not-allowed" }, /* @__PURE__ */ import_react4.default.createElement(import_lucide_react.Download, { size: 16 }), downloading ? "Generating..." : "Download" )))) ); } // virtual:/apps/web/src/components/Invoice/InvoicePreview.jsx init_injected_globals(); // virtual:/apps/web/src/utils/currency.js init_injected_globals(); function getCurrencySymbol(currencyCode) { const symbols = { USD: "$", EUR: "\u20AC", GBP: "\xA3", JPY: "\xA5", CAD: "C$", AUD: "A$", CHF: "CHF", CNY: "\xA5", INR: "\u20B9", MXN: "MX$" }; return symbols[currencyCode] || "$"; } // virtual:/apps/web/src/components/Invoice/InvoiceEditForm.jsx init_injected_globals(); // virtual:/apps/web/src/components/Invoice/LineItemsTable.jsx init_injected_globals(); var import_react5 = __toESM(require_react()); var import_lucide_react2 = __toESM(require_lucide_react()); function LineItemsTable({ items, addItem, updateItem, removeItem, brandColor = "#2563EB", currency = "USD" }) { const currencySymbol = getCurrencySymbol(currency); const [editValues, setEditValues] = (0, import_react5.useState)( () => items.map((i) => ({ rate: String(i?.rate ?? 0), quantity: String(i?.quantity ?? 1) })) ); (0, import_react5.useEffect)(() => { setEditValues( items.map((i, idx) => ({ rate: String(i?.rate ?? 0), quantity: String(i?.quantity ?? 1) })) ); }, [items]); const handleRateChange = (index, val) => { setEditValues((prev) => { const next = [...prev]; next[index] = { ...next[index] || {}, rate: val }; return next; }); }; const handleRateBlur = (index) => { setEditValues((prev) => { const next = [...prev]; const current = next[index] || {}; const num2 = parseFloat(current.rate); const parsed = isNaN(num2) || num2 < 0 ? 0 : num2; next[index] = { ...current, rate: String(parsed) }; return next; }); const currentStr = editValues[index]?.rate ?? "0"; const num = parseFloat(currentStr); updateItem(index, "rate", isNaN(num) || num < 0 ? 0 : num); }; const handleQtyChange = (index, val) => { setEditValues((prev) => { const next = [...prev]; next[index] = { ...next[index] || {}, quantity: val }; return next; }); }; const handleQtyBlur = (index) => { setEditValues((prev) => { const next = [...prev]; const current = next[index] || {}; const num2 = parseFloat(current.quantity); const parsed = isNaN(num2) || num2 < 1 ? 1 : num2; next[index] = { ...current, quantity: String(parsed) }; return next; }); const currentStr = editValues[index]?.quantity ?? "1"; const num = parseFloat(currentStr); updateItem(index, "quantity", isNaN(num) || num < 1 ? 1 : num); }; return /* @__PURE__ */ import_react5.default.createElement("div", { className: "mb-8" }, /* @__PURE__ */ import_react5.default.createElement("div", { className: "flex items-center justify-between mb-4" }, /* @__PURE__ */ import_react5.default.createElement("h2", { className: "text-base font-semibold text-[#111111]" }, "Line Items"), /* @__PURE__ */ import_react5.default.createElement( "button", { onClick: addItem, className: "h-9 px-4 bg-[#2563EB] text-white rounded-lg flex items-center gap-2 text-sm font-medium hover:bg-[#1D4ED8] transition-colors" }, /* @__PURE__ */ import_react5.default.createElement(import_lucide_react2.Plus, { size: 16 }), "Add Item" )), /* @__PURE__ */ import_react5.default.createElement("div", { className: "hidden md:grid grid-cols-12 gap-2 pr-3 mb-2 text-xs text-[#6B7280] tracking-[-0.01em]" }, /* @__PURE__ */ import_react5.default.createElement("div", { className: "col-span-1" }), /* @__PURE__ */ import_react5.default.createElement("div", { className: "col-span-5" }, "Description"), /* @__PURE__ */ import_react5.default.createElement("div", { className: "col-span-2 text-right" }, "Rate"), /* @__PURE__ */ import_react5.default.createElement("div", { className: "col-span-2 text-center" }, "Qty"), /* @__PURE__ */ import_react5.default.createElement("div", { className: "col-span-2 text-right" }, "Amount")), /* @__PURE__ */ import_react5.default.createElement("div", { className: "space-y-2 bg-white mt-0 mb-4" }, items.length === 0 && /* @__PURE__ */ import_react5.default.createElement(import_react5.default.Fragment, null, /* @__PURE__ */ import_react5.default.createElement("div", { className: "md:hidden pr-3 text-sm text-[#6B7280] tracking-[-0.01em]" }, "No items added yet"), /* @__PURE__ */ import_react5.default.createElement("div", { className: "hidden md:grid grid-cols-12 gap-2 pr-3 text-sm text-[#6B7280] tracking-[-0.01em]" }, /* @__PURE__ */ import_react5.default.createElement("div", { className: "col-span-12" }, "No items added yet"))), items.map((item, index) => { const local = editValues[index] || {}; const qtyStr = local.quantity ?? String(item.quantity ?? 1); const rateStr = local.rate ?? String(item.rate ?? 0); const qtyNum = parseFloat(qtyStr); const rateNum = parseFloat(rateStr); const qtyDisplay = isNaN(qtyNum) ? 0 : qtyNum; const rateDisplay = isNaN(rateNum) ? 0 : rateNum; const amountDisplay = qtyDisplay * rateDisplay; const descId = `li-desc-${index}`; const rateId = `li-rate-${index}`; const qtyId = `li-qty-${index}`; return /* @__PURE__ */ import_react5.default.createElement("div", { key: index }, /* @__PURE__ */ import_react5.default.createElement("div", { className: "md:hidden flex flex-col gap-2 pr-3" }, /* @__PURE__ */ import_react5.default.createElement("div", null, /* @__PURE__ */ import_react5.default.createElement( "label", { htmlFor: descId, className: "block text-xs font-normal text-[#6B7280] mb-1" }, "Description" ), /* @__PURE__ */ import_react5.default.createElement( "input", { id: descId, type: "text", value: item.description, onChange: (e) => updateItem(index, "description", e.target.value), placeholder: "Item description", className: "w-full h-9 px-3 border border-[#D1D5DB] rounded-lg text-sm text-[#111111] outline-none focus:border-[#2563EB] focus:ring-1 focus:ring-[#2563EB] placeholder:text-[#9CA3AF]" } )), /* @__PURE__ */ import_react5.default.createElement("div", { className: "grid grid-cols-2 gap-2" }, /* @__PURE__ */ import_react5.default.createElement("div", null, /* @__PURE__ */ import_react5.default.createElement( "label", { htmlFor: rateId, className: "block text-xs font-normal text-[#6B7280] mb-1 text-left" }, "Rate" ), /* @__PURE__ */ import_react5.default.createElement( "input", { id: rateId, type: "number", value: rateStr, onChange: (e) => handleRateChange(index, e.target.value), onBlur: () => handleRateBlur(index), min: "0", step: "0.01", className: "w-full h-9 px-3 border border-[#D1D5DB] rounded-lg text-sm text-[#111111] text-right outline-none focus:border-[#2563EB] focus:ring-1 focus:ring-[#2563EB]" } )), /* @__PURE__ */ import_react5.default.createElement("div", null, /* @__PURE__ */ import_react5.default.createElement( "label", { htmlFor: qtyId, className: "block text-xs font-normal text-[#6B7280] mb-1 text-left" }, "Qty" ), /* @__PURE__ */ import_react5.default.createElement( "input", { id: qtyId, type: "number", value: qtyStr, onChange: (e) => handleQtyChange(index, e.target.value), onBlur: () => handleQtyBlur(index), min: "1", className: "w-full h-9 px-3 border border-[#D1D5DB] rounded-lg text-sm text-[#111111] text-center outline-none focus:border-[#2563EB] focus:ring-1 focus:ring-[#2563EB]" } ))), /* @__PURE__ */ import_react5.default.createElement("div", { className: "flex items-center justify-between" }, /* @__PURE__ */ import_react5.default.createElement( "button", { onClick: () => removeItem(index), className: "transition-opacity p-1 hover:opacity-80 disabled:opacity-40", style: { color: brandColor }, disabled: items.length === 1, "aria-label": "Remove item", title: "Remove item" }, /* @__PURE__ */ import_react5.default.createElement(import_lucide_react2.X, { size: 16 }) ), /* @__PURE__ */ import_react5.default.createElement("span", { className: "text-sm font-medium text-[#111111]" }, currencySymbol, amountDisplay.toFixed(2)))), /* @__PURE__ */ import_react5.default.createElement("div", { className: "hidden md:grid grid-cols-12 gap-2 pr-3" }, /* @__PURE__ */ import_react5.default.createElement("div", { className: "col-span-1 flex items-center" }, /* @__PURE__ */ import_react5.default.createElement( "button", { onClick: () => removeItem(index), className: "transition-opacity p-1 hover:opacity-80 disabled:opacity-40", style: { color: brandColor }, disabled: items.length === 1, "aria-label": "Remove item", title: "Remove item" }, /* @__PURE__ */ import_react5.default.createElement(import_lucide_react2.X, { size: 16 }) )), /* @__PURE__ */ import_react5.default.createElement("div", { className: "col-span-5" }, /* @__PURE__ */ import_react5.default.createElement( "input", { type: "text", value: item.description, onChange: (e) => updateItem(index, "description", e.target.value), placeholder: "Item description", className: "w-full h-9 px-3 border border-[#D1D5DB] rounded-lg text-sm text-[#111111] outline-none focus:border-[#2563EB] focus:ring-1 focus:ring-[#2563EB] placeholder:text-[#9CA3AF]" } )), /* @__PURE__ */ import_react5.default.createElement("div", { className: "col-span-2" }, /* @__PURE__ */ import_react5.default.createElement( "input", { type: "number", value: rateStr, onChange: (e) => handleRateChange(index, e.target.value), onBlur: () => handleRateBlur(index), min: "0", step: "0.01", className: "w-full h-9 px-3 border border-[#D1D5DB] rounded-lg text-sm text-[#111111] text-right outline-none focus:border-[#2563EB] focus:ring-1 focus:ring-[#2563EB]" } )), /* @__PURE__ */ import_react5.default.createElement("div", { className: "col-span-2" }, /* @__PURE__ */ import_react5.default.createElement( "input", { type: "number", value: qtyStr, onChange: (e) => handleQtyChange(index, e.target.value), onBlur: () => handleQtyBlur(index), min: "1", className: "w-full h-9 px-3 border border-[#D1D5DB] rounded-lg text-sm text-[#111111] text-center outline-none focus:border-[#2563EB] focus:ring-1 focus:ring-[#2563EB]" } )), /* @__PURE__ */ import_react5.default.createElement("div", { className: "col-span-2 flex items-center justify-end" }, /* @__PURE__ */ import_react5.default.createElement("span", { className: "text-sm font-medium text-[#111111]" }, currencySymbol, amountDisplay.toFixed(2))))); }))); } // virtual:/apps/web/src/components/Invoice/InvoiceEditForm.jsx var import_react6 = __toESM(require_react()); // virtual:/apps/web/src/utils/useUpload.js init_injected_globals(); var React9 = __toESM(require_react()); function useUpload() { const [loading, setLoading] = React9.useState(false); const upload = React9.useCallback(async (input) => { try { setLoading(true); let response; if ("file" in input && input.file) { const formData = new FormData(); formData.append("file", input.file); response = await fetch("/_create/api/upload/", { method: "POST", body: formData }); } else if ("url" in input) { response = await fetch("/_create/api/upload/", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ url: input.url }) }); } else if ("base64" in input) { response = await fetch("/_create/api/upload/", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ base64: input.base64 }) }); } else { response = await fetch("/_create/api/upload/", { method: "POST", headers: { "Content-Type": "application/octet-stream" }, body: input.buffer }); } if (!response.ok) { if (response.status === 413) { throw new Error("Upload failed: File too large."); } throw new Error("Upload failed"); } const data = await response.json(); return { url: data.url, mimeType: data.mimeType || null }; } catch (uploadError) { if (uploadError instanceof Error) { return { error: uploadError.message }; } if (typeof uploadError === "string") { return { error: uploadError }; } return { error: "Upload failed" }; } finally { setLoading(false); } }, []); return [upload, { loading }]; } var useUpload_default = useUpload; // virtual:/apps/web/src/components/Invoice/InvoiceEditForm.jsx function InvoiceEditForm({ invoiceData = {}, // Add default empty object updateInvoiceData, lineItems = [], // Add default empty array addLineItem, updateLineItem, removeLineItem, calculateSubtotal, calculateTax, calculateTotal, brandColor = "#2563EB", taxEnabled, currency = "USD" }) { const currencySymbol = getCurrencySymbol(currency); const safeCalculateSubtotal = calculateSubtotal || (() => 0); const safeCalculateTotal = calculateTotal || (() => 0); const safeCalculateTax = calculateTax || (() => 0); const safeUpdateInvoiceData = updateInvoiceData || (() => { }); const [upload, { loading: uploading }] = useUpload_default(); const fileInputRef = (0, import_react6.useRef)(null); const [uploadError, setUploadError] = (0, import_react6.useState)(""); const handlePickLogo = (0, import_react6.useCallback)(() => { setUploadError(""); fileInputRef.current?.click(); }, []); const handleFileChange = (0, import_react6.useCallback)( async (e) => { const file = e.target.files?.[0]; if (!file) return; setUploadError(""); const { url, error } = await upload({ file }); if (error) { console.error(error); setUploadError(error); return; } safeUpdateInvoiceData({ logoUrl: url }); }, [safeUpdateInvoiceData, upload] ); const handleRemoveLogo = (0, import_react6.useCallback)(() => { safeUpdateInvoiceData({ logoUrl: "" }); setUploadError(""); if (fileInputRef.current) fileInputRef.current.value = ""; }, [safeUpdateInvoiceData]); return /* @__PURE__ */ import_react6.default.createElement("div", { className: "px-4 py-8 md:p-8" }, /* @__PURE__ */ import_react6.default.createElement("h2", { className: "text-xl font-semibold text-[#111111] mb-8" }, "Edit Invoice"), /* @__PURE__ */ import_react6.default.createElement("div", { className: "mb-8" }, /* @__PURE__ */ import_react6.default.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-8" }, /* @__PURE__ */ import_react6.default.createElement("div", null, /* @__PURE__ */ import_react6.default.createElement("label", { className: "block text-sm font-medium text-[#374151] mb-2" }, "Invoice Title"), /* @__PURE__ */ import_react6.default.createElement( "input", { type: "text", value: invoiceData.invoice_title || "", onChange: (e) => safeUpdateInvoiceData({ invoice_title: e.target.value }), placeholder: "Invoice", className: "w-full h-10 px-3 border border-[#D1D5DB] rounded-xl text-sm text-[#111111] outline-none focus:border-[#2563EB] focus:ring-1 focus:ring-[#2563EB] placeholder:text-[#9CA3AF]" } )), /* @__PURE__ */ import_react6.default.createElement("div", null, /* @__PURE__ */ import_react6.default.createElement("label", { className: "block text-sm font-medium text-[#374151] mb-2" }, "Add your Logo"), /* @__PURE__ */ import_react6.default.createElement("div", { className: "flex items-center gap-4" }, /* @__PURE__ */ import_react6.default.createElement("div", { className: "w-20 h-20 rounded-md border border-[#E5E7EB] bg-[#F9FAFB] flex items-center justify-center overflow-hidden" }, invoiceData.logoUrl ? ( // eslint-disable-next-line @next/next/no-img-element /* @__PURE__ */ import_react6.default.createElement( "img", { src: invoiceData.logoUrl, alt: "Logo preview", className: "w-full h-full object-contain" } ) ) : /* @__PURE__ */ import_react6.default.createElement("span", { className: "text-xs text-[#6B7280]" }, "No image")), /* @__PURE__ */ import_react6.default.createElement("div", { className: "flex items-center gap-2" }, /* @__PURE__ */ import_react6.default.createElement( "button", { type: "button", onClick: handlePickLogo, className: "h-10 px-4 bg-[#F3F4F6] text-[#111111] rounded-md border border-[#E5E7EB] text-sm hover:bg-[#E5E7EB] disabled:opacity-50", disabled: uploading }, uploading ? "Uploading..." : invoiceData.logoUrl ? "Replace" : "Upload" ), invoiceData.logoUrl && /* @__PURE__ */ import_react6.default.createElement( "button", { type: "button", onClick: handleRemoveLogo, className: "h-10 px-3 text-[#6B7280] border border-transparent hover:border-[#E5E7EB] rounded-md text-sm" }, "Remove" ), /* @__PURE__ */ import_react6.default.createElement( "input", { ref: fileInputRef, type: "file", accept: "image/*", className: "hidden", onChange: handleFileChange } ))), uploadError && /* @__PURE__ */ import_react6.default.createElement("p", { className: "mt-2 text-xs text-[#991B1B]" }, uploadError), /* @__PURE__ */ import_react6.default.createElement("p", { className: "mt-2 text-xs text-[#6B7280]" }, "Upload a single image file. It will appear at the top right of the invoice.")))), /* @__PURE__ */ import_react6.default.createElement("div", { className: "border-t border-[#E5E7EB] mb-8" }), /* @__PURE__ */ import_react6.default.createElement("div", { className: "grid grid-cols-1 gap-8 mb-8" }, /* @__PURE__ */ import_react6.default.createElement("div", { className: "space-y-6" }, /* @__PURE__ */ import_react6.default.createElement("div", null, /* @__PURE__ */ import_react6.default.createElement("label", { className: "block text-sm font-medium text-[#374151] mb-2" }, "From"), /* @__PURE__ */ import_react6.default.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4 mb-4" }, /* @__PURE__ */ import_react6.default.createElement( "input", { type: "text", value: invoiceData.from_name || "", onChange: (e) => safeUpdateInvoiceData({ from_name: e.target.value }), placeholder: "Name", className: "w-full h-10 px-3 border border-[#D1D5DB] rounded-xl text-sm text-[#111111] outline-none focus:border-[#2563EB] focus:ring-1 focus:ring-[#2563EB] placeholder:text-[#9CA3AF]" } ), /* @__PURE__ */ import_react6.default.createElement( "input", { type: "email", value: invoiceData.from_email || "", onChange: (e) => safeUpdateInvoiceData({ from_email: e.target.value }), placeholder: "Email", className: "w-full h-10 px-3 border border-[#D1D5DB] rounded-xl text-sm text-[#111111] outline-none focus:border-[#2563EB] focus:ring-1 focus:ring-[#2563EB] placeholder:text-[#9CA3AF]" } )), /* @__PURE__ */ import_react6.default.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4" }, /* @__PURE__ */ import_react6.default.createElement( "textarea", { value: invoiceData.from_address || "", onChange: (e) => safeUpdateInvoiceData({ from_address: e.target.value }), placeholder: "Address", rows: 3, className: "w-full px-3 py-2 border border-[#D1D5DB] rounded-xl text-sm text-[#111111] outline-none focus:border-[#2563EB] focus:ring-1 focus:ring-[#2563EB] placeholder:text-[#9CA3AF] resize-none" } ), /* @__PURE__ */ import_react6.default.createElement( "input", { type: "tel", value: invoiceData.from_phone || "", onChange: (e) => safeUpdateInvoiceData({ from_phone: e.target.value }), placeholder: "Phone", className: "w-full h-10 px-3 border border-[#D1D5DB] rounded-xl text-sm text-[#111111] outline-none focus:border-[#2563EB] focus:ring-1 focus:ring-[#2563EB] placeholder:text-[#9CA3AF]" } )))), /* @__PURE__ */ import_react6.default.createElement("div", { className: "space-y-6" }, /* @__PURE__ */ import_react6.default.createElement("div", null, /* @__PURE__ */ import_react6.default.createElement("label", { className: "block text-sm font-medium text-[#374151] mb-2" }, "Billed To"), /* @__PURE__ */ import_react6.default.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4 mb-4" }, /* @__PURE__ */ import_react6.default.createElement( "input", { type: "text", value: invoiceData.client_name || "", onChange: (e) => safeUpdateInvoiceData({ client_name: e.target.value }), placeholder: "Recipient Name", className: "w-full h-10 px-3 border border-[#D1D5DB] rounded-xl text-sm text-[#111111] outline-none focus:border-[#2563EB] focus:ring-1 focus:ring-[#2563EB] placeholder:text-[#9CA3AF]" } ), /* @__PURE__ */ import_react6.default.createElement( "input", { type: "email", value: invoiceData.client_email || "", onChange: (e) => safeUpdateInvoiceData({ client_email: e.target.value }), placeholder: "Email", className: "w-full h-10 px-3 border border-[#D1D5DB] rounded-xl text-sm text-[#111111] outline-none focus:border-[#2563EB] focus:ring-1 focus:ring-[#2563EB] placeholder:text-[#9CA3AF]" } )), /* @__PURE__ */ import_react6.default.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4" }, /* @__PURE__ */ import_react6.default.createElement( "textarea", { value: invoiceData.client_address || "", onChange: (e) => safeUpdateInvoiceData({ client_address: e.target.value }), placeholder: "Address", rows: 3, className: "w-full px-3 py-2 border border-[#D1D5DB] rounded-xl text-sm text-[#111111] outline-none focus:border-[#2563EB] focus:ring-1 focus:ring-[#2563EB] placeholder:text-[#9CA3AF] resize-none" } ), /* @__PURE__ */ import_react6.default.createElement( "input", { type: "tel", value: invoiceData.client_phone || "", onChange: (e) => safeUpdateInvoiceData({ client_phone: e.target.value }), placeholder: "Phone", className: "w-full h-10 px-3 border border-[#D1D5DB] rounded-xl text-sm text-[#111111] outline-none focus:border-[#2563EB] focus:ring-1 focus:ring-[#2563EB] placeholder:text-[#9CA3AF]" } )))), /* @__PURE__ */ import_react6.default.createElement("div", { className: "border-t border-[#E5E7EB]" }), /* @__PURE__ */ import_react6.default.createElement("div", { className: "space-y-6" }, /* @__PURE__ */ import_react6.default.createElement("div", null, /* @__PURE__ */ import_react6.default.createElement("label", { className: "block text-sm font-medium text-[#374151] mb-2" }, "Invoice Number"), /* @__PURE__ */ import_react6.default.createElement( "input", { type: "text", value: invoiceData.invoice_number || "", onChange: (e) => safeUpdateInvoiceData({ invoice_number: e.target.value }), className: "w-full h-10 px-3 border border-[#D1D5DB] rounded-lg text-sm text-[#111111] outline-none focus:border-[#2563EB] focus:ring-1 focus:ring-[#2563EB]" } )), /* @__PURE__ */ import_react6.default.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4" }, /* @__PURE__ */ import_react6.default.createElement("div", null, /* @__PURE__ */ import_react6.default.createElement("label", { className: "block text-sm font-medium text-[#374151] mb-2" }, "Issue Date"), /* @__PURE__ */ import_react6.default.createElement( "input", { type: "date", value: invoiceData.issue_date || "", onChange: (e) => safeUpdateInvoiceData({ issue_date: e.target.value }), className: "w-full h-10 px-3 border border-[#D1D5DB] rounded-lg text-sm text-[#111111] outline-none focus:border-[#2563EB] focus:ring-1 focus:ring-[#2563EB]" } )), /* @__PURE__ */ import_react6.default.createElement("div", null, /* @__PURE__ */ import_react6.default.createElement("label", { className: "block text-sm font-medium text-[#374151] mb-2" }, "Due Date"), /* @__PURE__ */ import_react6.default.createElement( "input", { type: "date", value: invoiceData.due_date || "", onChange: (e) => safeUpdateInvoiceData({ due_date: e.target.value }), className: "w-full h-10 px-3 border border-[#D1D5DB] rounded-lg text-sm text-[#111111] outline-none focus:border-[#2563EB] focus:ring-1 focus:ring-[#2563EB]" } ))))), /* @__PURE__ */ import_react6.default.createElement("div", { className: "mb-8" }, /* @__PURE__ */ import_react6.default.createElement( LineItemsTable, { items: lineItems, addItem: addLineItem, updateItem: updateLineItem, removeItem: removeLineItem, brandColor, currency } )), /* @__PURE__ */ import_react6.default.createElement("div", { className: "mb-8 space-y-2" }, /* @__PURE__ */ import_react6.default.createElement("div", { className: "grid grid-cols-12 gap-2 pr-3 border-t border-[#E5E7EB] pt-3" }, /* @__PURE__ */ import_react6.default.createElement("div", { className: "col-span-6" }, /* @__PURE__ */ import_react6.default.createElement("span", { className: "text-sm text-[#111111]" }, "Subtotal")), /* @__PURE__ */ import_react6.default.createElement("div", { className: "col-span-2" }), /* @__PURE__ */ import_react6.default.createElement("div", { className: "col-span-2" }), /* @__PURE__ */ import_react6.default.createElement("div", { className: "col-span-2 text-right" }, /* @__PURE__ */ import_react6.default.createElement("span", { className: "text-sm font-medium text-[#111111]" }, currencySymbol, safeCalculateSubtotal().toFixed(2)))), taxEnabled && /* @__PURE__ */ import_react6.default.createElement("div", { className: "grid grid-cols-12 gap-2 pr-3" }, /* @__PURE__ */ import_react6.default.createElement("div", { className: "col-span-6" }, /* @__PURE__ */ import_react6.default.createElement("span", { className: "text-sm text-[#111111]" }, "Tax")), /* @__PURE__ */ import_react6.default.createElement("div", { className: "col-span-2" }), /* @__PURE__ */ import_react6.default.createElement("div", { className: "col-span-2" }), /* @__PURE__ */ import_react6.default.createElement("div", { className: "col-span-2 text-right" }, /* @__PURE__ */ import_react6.default.createElement("span", { className: "text-sm font-medium text-[#111111]" }, currencySymbol, safeCalculateTax().toFixed(2)))), /* @__PURE__ */ import_react6.default.createElement("div", { className: "grid grid-cols-12 gap-2 pr-3 border-t border-[#E5E7EB] pt-3" }, /* @__PURE__ */ import_react6.default.createElement("div", { className: "col-span-6" }, /* @__PURE__ */ import_react6.default.createElement("span", { className: "text-sm text-[#111111]" }, "Total")), /* @__PURE__ */ import_react6.default.createElement("div", { className: "col-span-2" }), /* @__PURE__ */ import_react6.default.createElement("div", { className: "col-span-2" }), /* @__PURE__ */ import_react6.default.createElement("div", { className: "col-span-2 text-right" }, /* @__PURE__ */ import_react6.default.createElement( "span", { className: "text-base font-semibold", style: { color: brandColor } }, currencySymbol, safeCalculateTotal().toFixed(2) )))), /* @__PURE__ */ import_react6.default.createElement("div", null, /* @__PURE__ */ import_react6.default.createElement("label", { className: "block text-sm font-medium text-[#374151] mb-2" }, "Notes (Optional)"), /* @__PURE__ */ import_react6.default.createElement( "textarea", { value: invoiceData.notes || "", onChange: (e) => safeUpdateInvoiceData({ notes: e.target.value }), placeholder: "Add any additional notes or payment terms...", rows: 4, className: "w-full px-3 py-2 border border-[#D1D5DB] rounded-lg text-sm text-[#111111] outline-none focus:border-[#2563EB] focus:ring-1 focus:ring-[#2563EB] placeholder:text-[#9CA3AF] resize-none" } ))); } // virtual:/apps/web/src/components/Invoice/InvoicePreview.jsx function InvoicePreview({ invoiceData = {}, // Add default empty object updateInvoiceData, lineItems = [], // Add default empty array addLineItem, updateLineItem, removeLineItem, calculateSubtotal, calculateTax, calculateTotal, viewMode, brandColor = "#2563EB", taxEnabled, currency = "USD", // new tax display options taxLabel = "Tax", taxType, taxInclusive }) { const currencySymbol = getCurrencySymbol(currency); const safeCalculateSubtotal = calculateSubtotal || (() => 0); const safeCalculateTotal = calculateTotal || (() => 0); const safeCalculateTax = calculateTax || (() => 0); const subtotalVal = safeCalculateSubtotal(); const discountType = invoiceData?.discountType || "amount"; const discountValue = Number(invoiceData?.discountValue ?? 0); const computedDiscount = (() => { if (discountType === "percent") { return subtotalVal * Math.max(0, discountValue) / 100; } const legacy = Number(invoiceData?.discount || 0); return discountValue > 0 ? discountValue : legacy; })(); const dueDateDisplay = invoiceData.due_date ? new Date(invoiceData.due_date).toLocaleDateString("en-US", { month: "short", day: "numeric", year: "numeric" }) : ""; if (viewMode === "edit") { return /* @__PURE__ */ React.createElement("div", { className: "bg-white rounded-xl border border-[#E5E7EB] overflow-hidden" }, /* @__PURE__ */ React.createElement( InvoiceEditForm, { invoiceData, updateInvoiceData, lineItems, addLineItem, updateLineItem, removeLineItem, calculateSubtotal: safeCalculateSubtotal, calculateTax: safeCalculateTax, calculateTotal: safeCalculateTotal, brandColor, taxEnabled, currency } )); } return /* @__PURE__ */ React.createElement("div", { className: "bg-white rounded-2xl border border-[#E5E7EB] overflow-hidden flex flex-col w-full min-h-[80vh] lg:min-h-[110vh]" }, /* @__PURE__ */ React.createElement("div", { className: "px-4 md:px-6 py-10" }, /* @__PURE__ */ React.createElement("div", { className: "flex flex-col gap-4 md:flex-row md:items-start md:justify-between mb-8" }, /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement("h1", { className: "text-3xl font-bold text-[#111111]" }, invoiceData.invoice_title || "Invoice"), invoiceData.invoice_number && /* @__PURE__ */ React.createElement("p", { className: "text-sm text-[#6B7280] mt-1" }, invoiceData.invoice_number)), invoiceData.logoUrl ? /* @__PURE__ */ React.createElement( "img", { src: invoiceData.logoUrl, alt: "Logo", className: "h-20 w-20 object-contain" } ) : null), /* @__PURE__ */ React.createElement("div", { className: "border-t border-[#E5E7EB] my-8" }), /* @__PURE__ */ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-6 md:gap-12 mb-10" }, /* @__PURE__ */ React.createElement("div", { className: "space-y-8" }, /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement("p", { className: "text-xs font-normal font-inter-display text-[#6B7280] mb-2" }, "Invoice Date"), /* @__PURE__ */ React.createElement("p", { className: "text-sm font-medium font-inter-display text-[#111111] tracking-[-0.01em] min-h-[20px]" }, invoiceData.issue_date ? new Date(invoiceData.issue_date).toLocaleDateString( "en-US", { month: "short", day: "numeric", year: "numeric" } ) : (/* @__PURE__ */ new Date()).toLocaleDateString("en-US", { month: "short", day: "numeric", year: "numeric" }))), /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement("p", { className: "text-xs font-normal font-inter-display text-[#6B7280] mb-2" }, "From"), /* @__PURE__ */ React.createElement("div", { className: "space-y-1" }, invoiceData.from_name ? /* @__PURE__ */ React.createElement("p", { className: "text-sm font-medium font-inter-display tracking-[-0.01em] text-[#111111]" }, invoiceData.from_name) : null, invoiceData.from_email ? /* @__PURE__ */ React.createElement("p", { className: "text-xs font-normal font-inter-display text-[#6B7280] tracking-[-0.01em]" }, invoiceData.from_email) : null, invoiceData.from_phone ? /* @__PURE__ */ React.createElement("p", { className: "text-xs font-normal font-inter-display text-[#6B7280] tracking-[-0.01em]" }, invoiceData.from_phone) : null, invoiceData.from_address ? /* @__PURE__ */ React.createElement("p", { className: "text-xs font-normal font-inter-display text-[#6B7280] tracking-[-0.01em] whitespace-pre-line" }, invoiceData.from_address) : null))), /* @__PURE__ */ React.createElement("div", { className: "space-y-8" }, /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement("p", { className: "text-xs font-normal font-inter-display text-[#6B7280] mb-2" }, "Due Date"), /* @__PURE__ */ React.createElement("p", { className: "text-sm font-medium font-inter-display text-[#111111] tracking-[-0.01em] min-h-[20px]" }, dueDateDisplay)), /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement("p", { className: "text-xs font-normal font-inter-display text-[#6B7280] mb-2" }, "Billed To"), /* @__PURE__ */ React.createElement("div", { className: "space-y-1" }, invoiceData.client_name ? /* @__PURE__ */ React.createElement("p", { className: "text-sm font-medium font-inter-display tracking-[-0.01em] text-[#111111]" }, invoiceData.client_name) : null, invoiceData.client_email && /* @__PURE__ */ React.createElement("p", { className: "text-xs font-normal font-inter-display text-[#6B7280] tracking-[-0.01em]" }, invoiceData.client_email), invoiceData.client_phone && /* @__PURE__ */ React.createElement("p", { className: "text-xs font-normal font-inter-display text-[#6B7280] tracking-[-0.01em]" }, invoiceData.client_phone), invoiceData.client_address && /* @__PURE__ */ React.createElement("div", { className: "text-xs font-normal font-inter-display text-[#6B7280] whitespace-pre-line tracking-[-0.01em]" }, invoiceData.client_address))))), /* @__PURE__ */ React.createElement("div", { className: "mb-0" }, /* @__PURE__ */ React.createElement( "div", { className: "grid grid-cols-12 gap-4 text-sm font-medium tracking-[-0.01em] text-white px-2 md:px-3 py-3 rounded-[12px]", style: { backgroundColor: brandColor } }, /* @__PURE__ */ React.createElement("div", { className: "col-span-6" }, "Description"), /* @__PURE__ */ React.createElement("div", { className: "col-span-2 text-right" }, "Rate"), /* @__PURE__ */ React.createElement("div", { className: "col-span-2 text-center" }, "Qty"), /* @__PURE__ */ React.createElement("div", { className: "col-span-2 text-right pr-0 md:pr-0" }, "Amount") ), /* @__PURE__ */ React.createElement("div", { className: "space-y-4 bg-white mt-4 mb-4" }, lineItems.length === 0 && /* @__PURE__ */ React.createElement("div", { className: "grid grid-cols-12 gap-4 px-0 md:px-3 text-sm text-[#6B7280] tracking-[-0.01em]" }, /* @__PURE__ */ React.createElement("div", { className: "col-span-12" }, "No items added yet")), lineItems.map((item, index) => { const qty = Number(item.quantity || 0); const rate = Number(item.rate || 0); const amount = Number(item.amount || qty * rate || 0); const description = item?.description ?? ""; return /* @__PURE__ */ React.createElement( "div", { key: index, className: "grid grid-cols-12 gap-4 px-0 md:px-3" }, /* @__PURE__ */ React.createElement("div", { className: "col-span-6" }, /* @__PURE__ */ React.createElement("p", { className: "text-sm font-medium text-[#111111] tracking-[-0.01em]" }, description)), /* @__PURE__ */ React.createElement("div", { className: "col-span-2 text-right" }, /* @__PURE__ */ React.createElement("p", { className: "text-sm text-[#111111] tracking-[-0.01em]" }, currencySymbol, rate.toFixed(2))), /* @__PURE__ */ React.createElement("div", { className: "col-span-2 text-center" }, /* @__PURE__ */ React.createElement("p", { className: "text-sm text-[#111111] tracking-[-0.01em]" }, qty)), /* @__PURE__ */ React.createElement("div", { className: "col-span-2 text-right pr-3 md:pr-0" }, /* @__PURE__ */ React.createElement("p", { className: "text-sm font-medium text-[#111111] tracking-[-0.01em]" }, currencySymbol, amount.toFixed(2))) ); })), /* @__PURE__ */ React.createElement("div", { className: "space-y-4" }, /* @__PURE__ */ React.createElement("div", { className: "grid grid-cols-12 gap-4 px-0 md:px-3 border-t border-[#E5E7EB] pt-4" }, /* @__PURE__ */ React.createElement("div", { className: "col-span-6" }, /* @__PURE__ */ React.createElement("p", { className: "text-sm text-[#111111] tracking-[-0.01em]" }, "Subtotal")), /* @__PURE__ */ React.createElement("div", { className: "col-span-2" }), /* @__PURE__ */ React.createElement("div", { className: "col-span-2" }), /* @__PURE__ */ React.createElement("div", { className: "col-span-2 text-right pr-3 md:pr-0" }, /* @__PURE__ */ React.createElement("p", { className: "text-sm font-medium text-[#111111] tracking-[-0.01em]" }, currencySymbol, subtotalVal.toFixed(2)))), /* @__PURE__ */ React.createElement("div", { className: "grid grid-cols-12 gap-4 px-0 md:px-3" }, /* @__PURE__ */ React.createElement("div", { className: "col-span-6" }, /* @__PURE__ */ React.createElement("p", { className: "text-sm text-[#111111] tracking-[-0.01em]" }, taxLabel || "Tax")), /* @__PURE__ */ React.createElement("div", { className: "col-span-2" }), /* @__PURE__ */ React.createElement("div", { className: "col-span-2" }), /* @__PURE__ */ React.createElement("div", { className: "col-span-2 text-right pr-3 md:pr-0" }, /* @__PURE__ */ React.createElement("p", { className: "text-sm font-medium text-[#111111] tracking-[-0.01em]" }, currencySymbol, safeCalculateTax().toFixed(2)))), /* @__PURE__ */ React.createElement("div", { className: "grid grid-cols-12 gap-4 px-0 md:px-3" }, /* @__PURE__ */ React.createElement("div", { className: "col-span-6" }, /* @__PURE__ */ React.createElement("p", { className: "text-sm text-[#111111] tracking-[-0.01em]" }, "Discount")), /* @__PURE__ */ React.createElement("div", { className: "col-span-2" }), /* @__PURE__ */ React.createElement("div", { className: "col-span-2" }), /* @__PURE__ */ React.createElement("div", { className: "col-span-2 text-right pr-3 md:pr-0" }, /* @__PURE__ */ React.createElement("p", { className: "text-sm font-medium text-[#111111] tracking-[-0.01em]" }, currencySymbol, Number(computedDiscount).toFixed(2)))), /* @__PURE__ */ React.createElement("div", { className: "grid grid-cols-12 gap-4 px-0 md:px-3 border-t border-[#E5E7EB] pt-4" }, /* @__PURE__ */ React.createElement("div", { className: "col-span-6" }, /* @__PURE__ */ React.createElement("p", { className: "text-sm text-[#111111] tracking-[-0.01em]" }, "Total")), /* @__PURE__ */ React.createElement("div", { className: "col-span-2" }), /* @__PURE__ */ React.createElement("div", { className: "col-span-2" }), /* @__PURE__ */ React.createElement("div", { className: "col-span-2 text-right pr-3 md:pr-0" }, /* @__PURE__ */ React.createElement("p", { className: "text-sm font-medium text-[#111111] tracking-[-0.01em]" }, currencySymbol, safeCalculateTotal().toFixed(2)))), /* @__PURE__ */ React.createElement("div", { className: "grid grid-cols-12 gap-4 px-0 md:px-3" }, /* @__PURE__ */ React.createElement("div", { className: "col-span-6" }, /* @__PURE__ */ React.createElement("p", { className: "text-sm text-[#111111] tracking-[-0.01em]" }, "Balance Due")), /* @__PURE__ */ React.createElement("div", { className: "col-span-2" }), /* @__PURE__ */ React.createElement("div", { className: "col-span-2" }), /* @__PURE__ */ React.createElement("div", { className: "col-span-2 text-right pr-3 md:pr-0" }, /* @__PURE__ */ React.createElement("p", { className: "text-right text-sm md:text-[24px] font-bold font-inter text-[#111111] tracking-[-0.01em] tabular-nums" }, currencySymbol, safeCalculateTotal().toFixed(2)))))), invoiceData.notes && /* @__PURE__ */ React.createElement("div", { className: "mt-12 pt-8 border-t border-[#E5E7EB]" }, /* @__PURE__ */ React.createElement("p", { className: "text-xs font-normal font-inter-display text-[#6B7280] mb-2" }, "Notes"), /* @__PURE__ */ React.createElement("p", { className: "text-sm font-inter-display text-[#111111] whitespace-pre-line tracking-[-0.01em]" }, invoiceData.notes)))); } // virtual:/apps/web/src/components/Invoice/CustomizationPanel.jsx init_injected_globals(); var import_lucide_react4 = __toESM(require_lucide_react()); // virtual:/apps/web/src/components/Invoice/ColorPresets.jsx init_injected_globals(); // virtual:/apps/web/src/components/Invoice/TaxSettings.jsx init_injected_globals(); var import_react7 = __toESM(require_react()); // virtual:/apps/web/src/components/Invoice/CurrencySelector.jsx init_injected_globals(); var import_lucide_react3 = __toESM(require_lucide_react()); function CurrencySelector({ currency, setCurrency }) { const currencies = [ { code: "USD", symbol: "$", name: "US Dollar", flag: "\u{1F1FA}\u{1F1F8}" }, { code: "EUR", symbol: "\u20AC", name: "Euro", flag: "\u{1F1EA}\u{1F1FA}" }, { code: "GBP", symbol: "\xA3", name: "British Pound", flag: "\u{1F1EC}\u{1F1E7}" }, { code: "JPY", symbol: "\xA5", name: "Japanese Yen", flag: "\u{1F1EF}\u{1F1F5}" }, { code: "CAD", symbol: "C$", name: "Canadian Dollar", flag: "\u{1F1E8}\u{1F1E6}" }, { code: "AUD", symbol: "A$", name: "Australian Dollar", flag: "\u{1F1E6}\u{1F1FA}" }, { code: "CHF", symbol: "CHF", name: "Swiss Franc", flag: "\u{1F1E8}\u{1F1ED}" }, { code: "CNY", symbol: "\xA5", name: "Chinese Yuan", flag: "\u{1F1E8}\u{1F1F3}" }, { code: "INR", symbol: "\u20B9", name: "Indian Rupee", flag: "\u{1F1EE}\u{1F1F3}" }, { code: "MXN", symbol: "MX$", name: "Mexican Peso", flag: "\u{1F1F2}\u{1F1FD}" } ]; return /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement("label", { className: "block text-sm font-medium text-[#374151] mb-4" }, "Currency"), /* @__PURE__ */ React.createElement("div", { className: "relative" }, /* @__PURE__ */ React.createElement( "select", { value: currency, onChange: (e) => setCurrency(e.target.value), className: "w-full appearance-none px-3 py-3 pr-10 border border-[#D1D5DB] rounded-xl text-sm text-[#111111] outline-none focus:border-[#2563EB] focus:ring-1 focus:ring-[#2563EB] cursor-pointer bg-white" }, currencies.map((curr) => /* @__PURE__ */ React.createElement("option", { key: curr.code, value: curr.code }, curr.flag, " ", curr.symbol, " ", curr.name, " (", curr.code, ")")) ), /* @__PURE__ */ React.createElement( import_lucide_react3.ChevronDown, { size: 16, className: "pointer-events-none absolute right-3 top-1/2 -translate-y-1/2 text-[#707070]" } ))); } // virtual:/apps/web/src/components/Invoice/CustomizationPanel.jsx var import_react8 = __toESM(require_react()); function CustomizationPanel({ brandColor, setBrandColor, taxEnabled, setTaxEnabled, taxRate, setTaxRate, currency, setCurrency, // NEW: allow panel to manage discount on the invoice invoiceData, updateInvoiceData, // Advanced tax options taxLabel, setTaxLabel, taxType, setTaxType, taxInclusive, setTaxInclusive, // NEW: tax value type (amount | percent) taxValueType, setTaxValueType }) { const colorOptions = [ "#2563EB", // Blue "#C62828", // Red (updated) "#2E7D32", // Green (updated) "#7C3AED", // Purple "#d81b60", // Pink (updated from orange) "#0891B2" // Cyan // removed last two colors to show only 6 options ]; const discountType = invoiceData?.discountType || "amount"; const discountValue = Number(invoiceData?.discountValue ?? 0); const [discountInput, setDiscountInput] = (0, import_react8.useState)(String(discountValue)); const [taxInput, setTaxInput] = (0, import_react8.useState)(String(taxRate ?? 0)); (0, import_react8.useEffect)(() => { if (discountInput === "") return; const localNum = parseFloat(discountInput); if ((isNaN(localNum) ? 0 : localNum) !== (isNaN(discountValue) ? 0 : discountValue)) { setDiscountInput(String(discountValue)); } }, [discountValue]); (0, import_react8.useEffect)(() => { setDiscountInput(String(discountValue)); }, [discountType]); (0, import_react8.useEffect)(() => { if (taxInput === "") return; const localNum = parseFloat(taxInput); const propNum = Number(taxRate || 0); if ((isNaN(localNum) ? 0 : localNum) !== propNum) { setTaxInput(String(propNum)); } }, [taxRate]); (0, import_react8.useEffect)(() => { setTaxInput(String(taxRate || 0)); }, [taxValueType]); return /* @__PURE__ */ import_react8.default.createElement("div", { className: "bg-white h-full overflow-y-auto" }, /* @__PURE__ */ import_react8.default.createElement("div", { className: "p-4" }, /* @__PURE__ */ import_react8.default.createElement("h2", { className: "text-lg font-semibold text-[#111111] mb-8" }, "Invoice settings"), /* @__PURE__ */ import_react8.default.createElement("div", { className: "space-y-8" }, /* @__PURE__ */ import_react8.default.createElement("div", null, /* @__PURE__ */ import_react8.default.createElement("label", { className: "block text-sm font-medium text-[#374151] mb-4" }, "Color"), /* @__PURE__ */ import_react8.default.createElement("div", { className: "grid grid-cols-6 gap-2" }, colorOptions.map((color) => /* @__PURE__ */ import_react8.default.createElement( "button", { key: color, onClick: () => setBrandColor(color), "aria-pressed": brandColor === color, className: "w-10 h-10 rounded-full flex items-center justify-center transition-transform hover:scale-105 focus:outline-none", style: { backgroundColor: color } }, brandColor === color ? /* @__PURE__ */ import_react8.default.createElement(import_lucide_react4.Check, { size: 18, strokeWidth: 3, color: "#ffffff" }) : null )))), /* @__PURE__ */ import_react8.default.createElement("div", { className: "h-px bg-[#E5E7EB]" }), /* @__PURE__ */ import_react8.default.createElement("div", null, /* @__PURE__ */ import_react8.default.createElement("label", { className: "block text-xs font-semibold text-[#111111] mb-3" }, "Tax"), /* @__PURE__ */ import_react8.default.createElement("div", { className: "space-y-3" }, /* @__PURE__ */ import_react8.default.createElement("div", null, /* @__PURE__ */ import_react8.default.createElement("label", { className: "block text-xs text-[#707070] mb-1" }, "Label"), /* @__PURE__ */ import_react8.default.createElement( "input", { type: "text", value: taxLabel, onChange: (e) => setTaxLabel(e.target.value), placeholder: "Tax", className: "w-full px-3 py-3 bg-white border border-[#EAEAEA] rounded-xl text-xs text-[#111111] outline-none focus:border-[#0063FF]" } )), /* @__PURE__ */ import_react8.default.createElement("div", null, /* @__PURE__ */ import_react8.default.createElement("label", { className: "block text-xs text-[#707070] mb-1" }, "Type"), /* @__PURE__ */ import_react8.default.createElement("div", { className: "relative" }, /* @__PURE__ */ import_react8.default.createElement( "select", { value: taxValueType, onChange: (e) => setTaxValueType(e.target.value), className: "w-full appearance-none px-3 py-3 pr-10 bg-white border border-[#EAEAEA] rounded-xl text-xs text-[#111111] outline-none focus:border-[#0063FF] cursor-pointer" }, /* @__PURE__ */ import_react8.default.createElement("option", { value: "amount" }, "Amount"), /* @__PURE__ */ import_react8.default.createElement("option", { value: "percent" }, "Percent") ), /* @__PURE__ */ import_react8.default.createElement( import_lucide_react4.ChevronDown, { size: 16, className: "pointer-events-none absolute right-3 top-1/2 -translate-y-1/2 text-[#707070]" } ))), taxValueType === "percent" ? /* @__PURE__ */ import_react8.default.createElement("div", null, /* @__PURE__ */ import_react8.default.createElement("label", { className: "block text-xs text-[#707070] mb-1" }, "Percent"), /* @__PURE__ */ import_react8.default.createElement("div", { className: "relative" }, /* @__PURE__ */ import_react8.default.createElement( "input", { type: "number", value: taxInput, onChange: (e) => setTaxInput(e.target.value), onBlur: () => { const num = parseFloat(taxInput); setTaxRate(isNaN(num) ? 0 : num); if (taxInput === "") setTaxInput("0"); }, min: "0", step: "0.1", className: "w-full px-3 py-3 pr-8 bg-white border border-[#EAEAEA] rounded-xl text-xs text-[#111111] outline-none focus:border-[#0063FF]" } ), /* @__PURE__ */ import_react8.default.createElement("span", { className: "absolute right-3 top-1/2 -translate-y-1/2 text-xs text-[#707070]" }, "%"))) : /* @__PURE__ */ import_react8.default.createElement("div", null, /* @__PURE__ */ import_react8.default.createElement("label", { className: "block text-xs text-[#707070] mb-1" }, "Amount"), /* @__PURE__ */ import_react8.default.createElement( "input", { type: "number", value: taxInput, onChange: (e) => setTaxInput(e.target.value), onBlur: () => { const num = parseFloat(taxInput); setTaxRate(isNaN(num) ? 0 : num); if (taxInput === "") setTaxInput("0"); }, min: "0", step: "0.01", className: "w-full px-3 py-3 bg-white border border-[#EAEAEA] rounded-xl text-xs text-[#111111] outline-none focus:border-[#0063FF]" } )))), /* @__PURE__ */ import_react8.default.createElement("div", { className: "h-px bg-[#E5E7EB]" }), /* @__PURE__ */ import_react8.default.createElement("div", null, /* @__PURE__ */ import_react8.default.createElement("label", { className: "block text-xs font-semibold text-[#111111] mb-3" }, "Discount"), /* @__PURE__ */ import_react8.default.createElement("div", { className: "space-y-3" }, /* @__PURE__ */ import_react8.default.createElement("div", null, /* @__PURE__ */ import_react8.default.createElement("label", { className: "block text-xs text-[#707070] mb-1" }, "Type"), /* @__PURE__ */ import_react8.default.createElement("div", { className: "relative" }, /* @__PURE__ */ import_react8.default.createElement( "select", { value: discountType, onChange: (e) => updateInvoiceData({ discountType: e.target.value }), className: "w-full appearance-none px-3 py-3 pr-10 bg-white border border-[#EAEAEA] rounded-xl text-xs text-[#111111] outline-none focus:border-[#0063FF] cursor-pointer" }, /* @__PURE__ */ import_react8.default.createElement("option", { value: "amount" }, "Amount"), /* @__PURE__ */ import_react8.default.createElement("option", { value: "percent" }, "Percent") ), /* @__PURE__ */ import_react8.default.createElement( import_lucide_react4.ChevronDown, { size: 16, className: "pointer-events-none absolute right-3 top-1/2 -translate-y-1/2 text-[#707070]" } ))), discountType === "percent" ? /* @__PURE__ */ import_react8.default.createElement("div", null, /* @__PURE__ */ import_react8.default.createElement("label", { className: "block text-xs text-[#707070] mb-1" }, "Percent"), /* @__PURE__ */ import_react8.default.createElement("div", { className: "relative" }, /* @__PURE__ */ import_react8.default.createElement( "input", { type: "number", value: discountInput, onChange: (e) => { setDiscountInput(e.target.value); }, onBlur: () => { const num = parseFloat(discountInput); updateInvoiceData({ discountValue: isNaN(num) ? 0 : num }); if (discountInput === "") setDiscountInput("0"); }, min: "0", step: "0.1", className: "w-full px-3 py-3 pr-8 bg-white border border-[#EAEAEA] rounded-xl text-xs text-[#111111] outline-none focus:border-[#0063FF]" } ), /* @__PURE__ */ import_react8.default.createElement("span", { className: "absolute right-3 top-1/2 -translate-y-1/2 text-xs text-[#707070]" }, "%"))) : /* @__PURE__ */ import_react8.default.createElement("div", null, /* @__PURE__ */ import_react8.default.createElement("label", { className: "block text-xs text-[#707070] mb-1" }, "Amount"), /* @__PURE__ */ import_react8.default.createElement( "input", { type: "number", value: discountInput, onChange: (e) => { setDiscountInput(e.target.value); }, onBlur: () => { const num = parseFloat(discountInput); updateInvoiceData({ discountValue: isNaN(num) ? 0 : num }); if (discountInput === "") setDiscountInput("0"); }, min: "0", step: "0.01", className: "w-full px-3 py-3 bg-white border border-[#EAEAEA] rounded-xl text-xs text-[#111111] outline-none focus:border-[#0063FF]" } )))), /* @__PURE__ */ import_react8.default.createElement("div", { className: "h-px bg-[#E5E7EB]" }), /* @__PURE__ */ import_react8.default.createElement(CurrencySelector, { currency, setCurrency })))); } // virtual:/apps/web/src/app/page.jsx function CreateInvoice() { const [viewMode, setViewMode] = (0, import_react9.useState)("preview"); const { invoiceData, updateInvoiceData, addLineItem, updateLineItem, removeLineItem, calculateSubtotal, calculateTax, calculateTotal } = useInvoiceForm(); const { brandColor, setBrandColor, taxEnabled, setTaxEnabled, taxRate, setTaxRate, currency, setCurrency, // new advanced tax options taxLabel, setTaxLabel, taxType, setTaxType, taxInclusive, setTaxInclusive, // NEW: tax value type (amount | percent) taxValueType, setTaxValueType } = useInvoiceCustomization(); const { downloading, downloadPDF } = useInvoiceDownload(); const hasFrom = Boolean((invoiceData.from_name || "").trim()); const hasBilledTo = Boolean((invoiceData.client_name || "").trim()); const hasItemWithRate = Array.isArray(invoiceData.line_items) ? invoiceData.line_items.some((it) => Number(it?.rate || 0) > 0) : false; const readyToDownload = hasFrom && hasBilledTo && hasItemWithRate; const handleDownload = () => { if (!readyToDownload) { alert( "Please fill From, Billed To, and add at least one item with a rate before downloading." ); return; } const invoiceToDownload = { ...invoiceData, subtotal: calculateSubtotal(), // Always compute tax (no enable toggle) tax: calculateTax(true, taxRate, taxType, taxInclusive, taxValueType), total_amount: calculateTotal( true, taxRate, taxType, taxInclusive, taxValueType ), brandColor, currency, taxLabel, taxType, taxInclusive, // include value type for reference taxValueType }; downloadPDF(invoiceToDownload); }; return /* @__PURE__ */ import_react9.default.createElement("div", { className: "min-h-screen bg-[#F6F8FA] font-inter-display" }, /* @__PURE__ */ import_react9.default.createElement("div", { className: "flex flex-col" }, /* @__PURE__ */ import_react9.default.createElement( InvoiceHeader, { viewMode, setViewMode, onDownload: handleDownload, downloading, brandColor, downloadDisabled: !readyToDownload } ), /* @__PURE__ */ import_react9.default.createElement("div", { className: "w-full lg:hidden" }, /* @__PURE__ */ import_react9.default.createElement("div", { className: "max-w-[1056px] mx-auto w-full px-4 pt-3" }, /* @__PURE__ */ import_react9.default.createElement("div", { className: "flex justify-center" }, /* @__PURE__ */ import_react9.default.createElement("div", { className: "w-[320px] flex bg-[#E2E4E9] rounded-[12px] p-1 overflow-hidden" }, /* @__PURE__ */ import_react9.default.createElement( "button", { onClick: () => setViewMode("preview"), className: `flex-1 h-8 rounded-[8px] text-sm font-medium transition-all text-center ${viewMode === "preview" ? "bg-white text-[#111111] shadow-sm" : "text-[#707070]"}` }, "Preview" ), /* @__PURE__ */ import_react9.default.createElement( "button", { onClick: () => setViewMode("edit"), className: `flex-1 h-8 rounded-[8px] text-sm font-medium transition-all text-center ${viewMode === "edit" ? "bg-white text-[#111111] shadow-sm" : "text-[#707070]"}` }, "Edit" ))))), /* @__PURE__ */ import_react9.default.createElement("div", { className: "py-6 min-h-[calc(100vh-56px)]" }, /* @__PURE__ */ import_react9.default.createElement("div", { className: "max-w-[1056px] mx-auto w-full flex flex-col lg:flex-row gap-4 lg:gap-[20px] px-4" }, /* @__PURE__ */ import_react9.default.createElement("div", { className: "flex-1 min-w-0" }, viewMode === "preview" && /* @__PURE__ */ import_react9.default.createElement("div", { className: "w-full" }, /* @__PURE__ */ import_react9.default.createElement( "div", { className: "relative w-full min-h-[80vh] lg:min-h-[110vh]" }, /* @__PURE__ */ import_react9.default.createElement( InvoicePreview, { invoiceData, updateInvoiceData, lineItems: invoiceData.line_items, addLineItem, updateLineItem, removeLineItem, calculateSubtotal, calculateTax: () => calculateTax( true, taxRate, taxType, taxInclusive, taxValueType ), calculateTotal: () => calculateTotal( true, taxRate, taxType, taxInclusive, taxValueType ), viewMode, brandColor, taxEnabled: true, currency, taxLabel, taxType, taxInclusive } ) )), viewMode === "edit" && /* @__PURE__ */ import_react9.default.createElement("div", { className: "bg-white rounded-xl border border-[#E5E7EB] overflow-hidden" }, /* @__PURE__ */ import_react9.default.createElement( InvoiceEditForm, { invoiceData, updateInvoiceData, lineItems: invoiceData.line_items, addLineItem, updateLineItem, removeLineItem, calculateSubtotal, calculateTax: () => calculateTax( true, taxRate, taxType, taxInclusive, taxValueType ), calculateTotal: () => calculateTotal( true, taxRate, taxType, taxInclusive, taxValueType ), brandColor, taxEnabled: true, currency } ))), /* @__PURE__ */ import_react9.default.createElement("div", { className: "w-full lg:w-80 flex-shrink-0 mt-4 lg:mt-0" }, /* @__PURE__ */ import_react9.default.createElement("div", { className: "bg-white rounded-2xl border border-[#E5E7EB] overflow-hidden" }, /* @__PURE__ */ import_react9.default.createElement( CustomizationPanel, { brandColor, setBrandColor, taxEnabled: true, setTaxEnabled: () => { }, taxRate, setTaxRate, currency, setCurrency, invoiceData, updateInvoiceData, taxLabel, setTaxLabel, taxType, setTaxType, taxInclusive, setTaxInclusive, taxValueType, setTaxValueType } ))))))); } // virtual:/apps/web/src/app/layout.jsx init_injected_globals(); var queryClient = new QueryClient({ defaultOptions: { queries: { staleTime: 1e3 * 60 * 5, // 5 minutes cacheTime: 1e3 * 60 * 30, // 30 minutes retry: 1, refetchOnWindowFocus: false } } }); function RootLayout({ children }) { return /* @__PURE__ */ React.createElement(QueryClientProvider, { client: queryClient }, /* @__PURE__ */ React.createElement("div", { className: "tracking-[-0.06em]" }, children)); } // virtual:/__wrapped_entry__.jsx function WrappedPage(props) { let content = /* @__PURE__ */ import_react10.default.createElement(CreateInvoice, { ...props }); content = /* @__PURE__ */ import_react10.default.createElement(RootLayout, null, content); return content; } return __toCommonJS(wrapped_entry_exports); })(); /*! Bundled license information: lucide-react/dist/cjs/lucide-react.js: (** * @license lucide-react v0.358.0 - ISC * * This source code is licensed under the ISC license. * See the LICENSE file in the root directory of this source tree. *) react/cjs/react-jsx-runtime.production.min.js: (** * @license React * react-jsx-runtime.production.min.js * * Copyright (c) Facebook, Inc. and its affiliates. * * This source code is licensed under the MIT license found in the * LICENSE file in the root directory of this source tree. *) */