/** Props for {@link EnvironmentVariableEditor}. */
export interface EnvironmentVariableEditorProps {
    /** The environment resource ID to display and manage variables for. */
    readonly environmentId: string;
    /** When `true`, all mutation controls (edit, delete, add) are hidden. */
    readonly readOnly?: boolean;
    /** Fired after a variable is successfully added or updated. */
    readonly onVariableUpdated?: (key: string) => void;
    /** Fired after a variable is successfully removed. */
    readonly onVariableRemoved?: (key: string) => void;
    /** Additional CSS class names for the root container. */
    readonly className?: string;
}
/**
 * Self-contained component that displays and manages all variables for
 * a single {@link Environment}. Fetches environment data by ID, renders
 * an editable variable list, and commits changes inline per variable.
 *
 * Each variable supports inline editing with immediate save, secret
 * value reveal (30 s auto-clear via `getSecretValue` RPC), and inline
 * delete confirmation. New variables are added via a collapsible form
 * at the bottom of the list.
 *
 * All visual properties flow through `--stgm-*` design tokens.
 *
 * Part of the **Environment Flow** — manages persistent credentials
 * stored in Environment resources.
 *
 * Platform builders who need a fully custom UI should use the Layer 1
 * hooks directly ({@link useUpdateEnvironmentVariables},
 * {@link useRemoveEnvironmentVariables}, {@link useRevealSecretValue}).
 *
 * @example
 * ```tsx
 * <EnvironmentVariableEditor environmentId="env-abc123" />
 *
 * <EnvironmentVariableEditor
 *   environmentId={env.metadata.id}
 *   readOnly
 *   className="mt-4"
 * />
 * ```
 */
export declare function EnvironmentVariableEditor({ environmentId, readOnly, onVariableUpdated, onVariableRemoved, className, }: EnvironmentVariableEditorProps): import("react/jsx-runtime").JSX.Element;
//# sourceMappingURL=EnvironmentVariableEditor.d.ts.map