import type { FunnelUser } from './FunnelContext.js';
import { type PaywallStateOptions } from '../services/funnel-state.service.js';
import type { RuntimeMode } from '../services/runtime-mode.service.js';
export type RuntimeDevInfoValue = {
    label: string;
    value: string | number | boolean | null | undefined;
    source?: string;
};
type RuntimeDevInfoBoxProps = {
    runtimeMode: RuntimeMode;
    user: Pick<FunnelUser, 'id' | 'email'>;
    configValues?: readonly RuntimeDevInfoValue[];
    initialConfigOpen?: boolean;
    initialExpanded?: boolean;
    paywallStateOptions?: PaywallStateOptions;
    reloadOnReset?: boolean;
    title?: string;
};
export declare const copyRuntimeDevInfoValue: (value: string) => Promise<boolean>;
export declare function RuntimeDevInfoBox({ runtimeMode, user, configValues, initialConfigOpen, initialExpanded, paywallStateOptions, reloadOnReset, title, }: RuntimeDevInfoBoxProps): import("react/jsx-runtime").JSX.Element | null;
export declare const runtimeDevInfoBoxStyles = "\n.runtime-dev-info {\n  position: fixed;\n  right: 16px;\n  bottom: 16px;\n  z-index: 100000;\n  width: min(392px, calc(100vw - 32px));\n  color: #f8fafc;\n  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;\n  pointer-events: none;\n}\n\n.runtime-dev-info * {\n  box-sizing: border-box;\n}\n\n.runtime-dev-info-pill,\n.runtime-dev-info-panel {\n  pointer-events: auto;\n}\n\n.runtime-dev-info.is-collapsed {\n  width: auto;\n}\n\n.runtime-dev-info-pill {\n  min-height: 56px;\n  display: inline-flex;\n  align-items: center;\n  gap: 10px;\n  border: 1px solid rgb(255 255 255 / 12%);\n  border-radius: 28px;\n  background: #11161d;\n  color: inherit;\n  padding: 0 20px;\n  box-shadow: 0 18px 42px rgb(15 23 42 / 24%);\n  cursor: pointer;\n}\n\n.runtime-dev-info-wordmark {\n  font-size: 17px;\n  font-weight: 800;\n  letter-spacing: 0;\n}\n\n.runtime-dev-info-chevron {\n  color: #cbd5e1;\n  font-size: 18px;\n  font-weight: 700;\n  line-height: 1;\n}\n\n.runtime-dev-info-panel {\n  margin-top: 10px;\n  border: 1px solid rgb(255 255 255 / 12%);\n  border-radius: 20px;\n  background: #11161d;\n  box-shadow: 0 22px 50px rgb(15 23 42 / 30%);\n  overflow: hidden;\n}\n\n.runtime-dev-info-status-row,\n.runtime-dev-info-config-head {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  gap: 12px;\n}\n\n.runtime-dev-info-status-row {\n  padding: 18px 20px 14px;\n}\n\n.runtime-dev-info-title,\n.runtime-dev-info-config-head p {\n  margin: 0;\n}\n\n.runtime-dev-info-title {\n  color: #e5e7eb;\n  font-size: 16px;\n  font-weight: 750;\n  line-height: 1.2;\n}\n\n.runtime-dev-info-badge {\n  border: 1px solid #3b82f6;\n  border-radius: 999px;\n  color: #60a5fa;\n  font-size: 12px;\n  font-weight: 750;\n  line-height: 1;\n  padding: 7px 10px;\n}\n\n.runtime-dev-info-identities {\n  display: grid;\n  gap: 10px;\n  padding: 0 20px 18px;\n}\n\n.runtime-dev-info-identity-card {\n  min-width: 0;\n  border: 1px solid rgb(255 255 255 / 10%);\n  border-radius: 10px;\n  background: rgb(255 255 255 / 4%);\n  padding: 10px;\n}\n\n.runtime-dev-info-identity-main {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n}\n\n.runtime-dev-info-identity-value {\n  min-width: 0;\n  flex: 1;\n  color: #f8fafc;\n  overflow-wrap: anywhere;\n  white-space: normal;\n}\n\n.runtime-dev-info-identity-label,\n.runtime-dev-info-config-name {\n  display: block;\n  margin-top: 5px;\n  color: #94a3b8;\n  font-size: 12px;\n  line-height: 1.25;\n}\n\n.runtime-dev-info-identity-value,\n.runtime-dev-info-config-value {\n  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, 'Liberation Mono', monospace;\n  font-size: 12px;\n  letter-spacing: 0;\n}\n\n.runtime-dev-info-config-value {\n  color: #dbeafe;\n}\n\n.runtime-dev-info-identity-main button,\n.runtime-dev-info-actions button,\n.runtime-dev-info-config-head button {\n  min-height: 30px;\n  border: 1px solid rgb(255 255 255 / 14%);\n  border-radius: 8px;\n  background: rgb(255 255 255 / 6%);\n  color: #e5e7eb;\n  font: inherit;\n  font-size: 12px;\n  font-weight: 700;\n  cursor: pointer;\n}\n\n.runtime-dev-info-identity-main button {\n  flex: 0 0 auto;\n  padding: 0 9px;\n}\n\n.runtime-dev-info-actions {\n  display: grid;\n  grid-template-columns: repeat(2, minmax(0, 1fr));\n  gap: 8px;\n  border-top: 1px solid rgb(255 255 255 / 10%);\n  padding: 14px 20px;\n}\n\n.runtime-dev-info-actions button {\n  width: 100%;\n  padding: 0 8px;\n}\n\n.runtime-dev-info-actions button:hover,\n.runtime-dev-info-identity-main button:hover,\n.runtime-dev-info-config-head button:hover {\n  background: rgb(255 255 255 / 12%);\n}\n\n.runtime-dev-info-config {\n  border-top: 1px solid rgb(255 255 255 / 10%);\n  padding: 14px 20px;\n}\n\n.runtime-dev-info-config-head {\n  margin-bottom: 10px;\n  color: #e5e7eb;\n  font-size: 13px;\n  font-weight: 750;\n}\n\n.runtime-dev-info-config-head button {\n  padding: 0 10px;\n}\n\n.runtime-dev-info-config-list {\n  display: grid;\n  gap: 5px;\n  max-height: 220px;\n  overflow: auto;\n}\n\n.runtime-dev-info-config-row {\n  min-width: 0;\n  border-bottom: 1px solid rgb(255 255 255 / 8%);\n  padding: 7px 0;\n}\n\n.runtime-dev-info-config-value {\n  display: block;\n  min-width: 0;\n  overflow-wrap: anywhere;\n  white-space: normal;\n}\n\n.runtime-dev-info-config-name {\n  font-size: 11px;\n}\n\n@media (max-width: 430px) {\n  .runtime-dev-info {\n    right: 10px;\n    bottom: 10px;\n    width: min(360px, calc(100vw - 20px));\n  }\n\n  .runtime-dev-info-actions {\n    grid-template-columns: 1fr;\n  }\n\n  .runtime-dev-info-identity-main {\n    align-items: flex-start;\n  }\n}\n";
export {};