ZuploZuplo
LoginStart for Free
  • Documentation
  • API Reference
Getting Started
Concepts
API Management
AI Gateway
MCP Gateway
MCP Server
Developer Portal
    Overview
    Getting Started
      Updating VersionsNode Modules & CustomizationZuplo Branding
      Configuration
      Writing
      OpenAPI
      Authentication
      Integrations
      Guides
      Extending
      Components
        General
        Documentation
          CodeTabsMermaidAPI PlaygroundSecretSidecar BoxStepperSyntax Highlight
        Form
        Utility
    Development
    Deploying & Source Control
    Analytics
    Observability
    Networking & Infrastructure
    Account Management
    Programming API
    Build with AI
    Zuplo CLI
    Migration Guides
    Platform LimitsVersion Support PolicySecuritySupportTrust & ComplianceChangelog
    powered by Zuplo
    Documentation

    Secret

    The Secret component can be used to display secrets, typically API keys, in your Dev Portal application.

    Import

    Code
    import { Secret } from "zudoku/ui/Secret";

    Usage

    Code
    <Secret secret="pkcd_this-is-a-never-01K1DASDXXQDA9S6GKASKYAFSDH" status="active" preview={5} onCopy={(secret) => { console.log("Copied secret:", secret); }} onReveal={(revealed) => { console.log("Revealed:", revealed); }} />
    •••• •••• •••• •••• •••• •••• •••• •••• •••AFSDH
    •••• •••• •••• •••• •••• •••• •••• •••• •••YSDXX
    •••• •••• •••• •••• •••• •••• •••• •••• •••E5KAS
    •••• •••• •••• •••• •••• •••• •••• •••• •••1SFSR
    •••• •••• •••• •••• •••• •••• •••• •••• •••1SFSR
    •••• •••• •••• •••• •••• •••• •••• •••• •••KASKY
    Client ID
    client-id-01985b58-d7af-71eb-a27e-b2062935ece4
    Client Secret
    •••• •••• •••• •••• •••• •••• •••• •••• •••KASKY
    Edit this page
    Last modified on October 1, 2026
    API PlaygroundSidecar Box
    On this page
    • Import
    • Usage
    React
    React