Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/TechFernandesLTDA/apex-mcp/llms.txt

Use this file to discover all available pages before exploring further.

These 20 components generate richly styled HTML via NATIVE_PLSQL region source — CSP-compliant server-side rendering for Oracle APEX 24.2. Each tool creates a PL/SQL region that calls sys.htp.p() to emit self-contained HTML with embedded CSS. No CDN resources, no inline JavaScript libraries, no separate static file uploads required.
These components are rendered by APEX’s NATIVE_PLSQL region source mechanism, which is CSP-compliant in APEX 24.2. All CSS is emitted via sys.htp.p('<style>...</style>') at render time, and JavaScript (where used) runs in the APEX page context without violating Content Security Policy. All user-supplied data passes through APEX_ESCAPE.HTML() before output.
All tools share a common guard check: the page must already exist in the session (created with apex_add_page(), apex_generate_crud(), or similar). Every tool returns a JSON object with status, region_id, and page_id.

​
Layout & Navigation

​
apex_add_hero_banner

Add a full-width hero banner to a page. Renders a prominent welcome or header section with a gradient background, title, optional subtitle, inline KPI stats (with live SQL), and an optional call-to-action button.
​
page_id
integer
required
Target page ID.
​
title
string
required
Main banner title. Supports APEX substitution strings, e.g. "Welcome, &APP_USER.!".
​
subtitle
string
Secondary text line under the title.
​
stats
array
Up to 4 inline KPI items displayed inside the banner. Each object:
{"label": "Open Tickets", "sql": "SELECT COUNT(*) FROM TICKETS WHERE STATUS='OPEN'", "suffix": ""}
​
bg_color
string
default:"unimed"
Background color — named (unimed, blue, teal) or hex (#00995D).
​
button_label
string
CTA button label (e.g., "New Record").
​
button_url
string
URL or f?p= reference for the CTA button.
​
title_size
string
default:"1.7rem"
CSS font-size for the title.
​
subtitle_size
string
default:"1rem"
CSS font-size for the subtitle.
​
custom_css
string
Additional CSS rules injected into the style block.
​
sequence
integer
default:"5"
Display order on page.
Example: 
apex_add_hero_banner(
    page_id=1,
    title="Welcome to HR Portal, &APP_USER.!",
    subtitle="Manage your workforce with ease.",
    bg_color="#1e88e5",
    stats=[
        {"label": "Employees",    "sql": "SELECT COUNT(*) FROM EMPLOYEES"},
        {"label": "Open Roles",   "sql": "SELECT COUNT(*) FROM JOB_POSTINGS WHERE STATUS='OPEN'"},
        {"label": "On Leave",     "sql": "SELECT COUNT(*) FROM LEAVE_REQUESTS WHERE STATUS='APPROVED' AND SYSDATE BETWEEN START_DATE AND END_DATE"},
    ],
    button_label="New Employee",
    button_url="f?p=&APP_ID.:11:&SESSION.::&DEBUG.:::",
)

​
apex_add_tabs_container

Add multiple content panels with a tab bar. Clicking a tab button shows that panel and hides the others. Implemented with an inline JavaScript mcpTab() function — no external dependencies.
​
page_id
integer
required
Target page ID.
​
region_name
string
required
Internal region name.
​
tabs
array
required
List of tab panel definitions. Each object:
{"title": "Overview",   "content": "<p>Any static HTML content here.</p>"},
{"title": "Details",    "content": "<ul><li>Detail 1</li></ul>"}
​
color
string
default:"unimed"
Accent color for the active tab indicator.
​
custom_css
string
Additional CSS rules injected into the component’s style block.
​
sequence
integer
default:"10"
Display order on page.

​
apex_add_collapsible_region

Add an expand/collapse toggle region. Content is visible or hidden based on the current state, with a smooth CSS transition.
​
page_id
integer
required
Target page ID.
​
region_name
string
required
Region name (shown as the toggle header).
​
content_html
string
Static HTML to display inside the collapsible body.
​
content_sql
string
SQL returning a VARCHAR2 value rendered as the body content. Overrides content_html if both are provided.
​
collapsed
boolean
default:"false"
Initial state: true = starts collapsed.
​
custom_css
string
Additional CSS rules injected into the component’s style block.
​
sequence
integer
default:"10"
Display order on page.
Add a grid of icon-button quick links — visually rich navigation shortcuts ideal for dashboard homepages.
​
page_id
integer
required
Target page ID.
​
region_name
string
required
Internal region name.
​
links
array
required
List of link definitions (4–8 recommended). Each object:
{
  "label": "Employees",
  "url":   "f?p=&APP_ID.:10:&SESSION.::&DEBUG.:::",
  "icon":  "fa-users",
  "color": "#1e88e5",
  "badge": "42"
}
badge is optional — use for counts or status labels.
​
columns
integer
default:"4"
Number of columns (2–5).
​
sequence
integer
default:"10"
Display order on page.
Example: 
apex_add_quick_links(
    page_id=1,
    region_name="Quick Actions",
    columns=4,
    links=[
        {"label": "Employees",   "url": "f?p=&APP_ID.:10:&SESSION.:::", "icon": "fa-users",       "color": "#1e88e5"},
        {"label": "Departments", "url": "f?p=&APP_ID.:12:&SESSION.:::", "icon": "fa-building",    "color": "#43a047"},
        {"label": "Reports",     "url": "f?p=&APP_ID.:20:&SESSION.:::", "icon": "fa-bar-chart",   "color": "#fb8c00"},
        {"label": "Settings",    "url": "f?p=&APP_ID.:99:&SESSION.:::", "icon": "fa-cog",         "color": "#8e24aa"},
    ],
)

​
Data Display

​
apex_add_kpi_row

Add a compact horizontal KPI strip — a single-line bar of metrics with colored values, no icons. Lighter than apex_add_metric_cards; ideal as a summary separator between page sections.
​
page_id
integer
required
Target page ID.
​
region_name
string
required
Internal region name.
​
metrics
array
required
List of metric objects (3–6 items recommended). Each:
{"label": "Avg Score", "sql": "SELECT ROUND(AVG(SCORE),1) FROM RESULTS", "suffix": "%", "color": "green"}
​
value_size
string
default:"1.4rem"
CSS font-size for metric values.

​
apex_add_stat_delta

Add metric cards with a current value and a delta arrow showing percentage change vs. a previous period. Each card shows an icon, label, current value, and a colored up/down arrow with the percentage change.
​
page_id
integer
required
Target page ID.
​
region_name
string
required
Internal region name.
​
metrics
array
required
List of metric objects. Each:
{
  "label":    "Monthly Orders",
  "sql":      "SELECT COUNT(*) FROM ORDERS WHERE TRUNC(ORDER_DATE,'MM') = TRUNC(SYSDATE,'MM')",
  "prev_sql": "SELECT COUNT(*) FROM ORDERS WHERE TRUNC(ORDER_DATE,'MM') = ADD_MONTHS(TRUNC(SYSDATE,'MM'),-1)",
  "icon":     "fa-shopping-cart",
  "color":    "blue",
  "suffix":   ""
}
prev_sql is used to compute the delta percentage. Set to "SELECT 0 FROM DUAL" if no prior period exists.
​
columns
integer
default:"4"
Number of columns (2–4).
​
delta_label
string
default:"vs anterior"
Label text after the percentage change.

​
apex_add_spotlight_metric

Add a large centered spotlight display for a single primary KPI — the value is rendered very large in the center, making it unmissable.
​
page_id
integer
required
Target page ID.
​
region_name
string
required
Internal region name.
​
sql_query
string
required
SQL returning a single scalar value.
​
label
string
required
Metric label displayed below the value.
​
color
string
default:"unimed"
Accent color for the value and icon.
​
icon
string
default:"fa-star"
Font Awesome class displayed above the value.
​
suffix
string
Unit suffix (e.g., %, pts).
​
prefix
string
Unit prefix (e.g., $, R$ ).
​
subtitle_sql
string
Optional SQL for a smaller subtitle line below the label.
​
value_size
string
default:"3.2rem"
CSS font-size for the value.
​
icon_size
string
default:"2.4rem"
CSS font-size for the icon displayed above the value.
​
custom_css
string
Additional CSS rules injected into the component’s style block.

​
apex_add_leaderboard

Add a ranked leaderboard list from SQL. Displays the top-N items with rank position, optional medal icons for top 3, a proportional progress bar, and the numeric value.
SQL should include ORDER BY value_column DESC to rank items correctly. The max value is auto-detected from the result set to scale the progress bars.
​
page_id
integer
required
Target page ID.
​
region_name
string
required
Region display name (shown as the header).
​
sql_query
string
required
SQL returning label and value columns, ordered DESC.
SELECT REP_NAME AS LABEL, TOTAL_SALES AS VALUE
  FROM SALES_REPS
 ORDER BY TOTAL_SALES DESC
​
label_column
string
default:"LABEL"
Column name for item labels.
​
value_column
string
default:"VALUE"
Column name for numeric values.
​
max_rows
integer
default:"10"
Maximum rows to display.
​
color
string
default:"unimed"
Accent color for progress bars and values.
​
show_medals
boolean
default:"true"
Show 🥇🥈🥉 medal icons for top 3.

​
apex_add_data_card_grid

Add a SQL-driven card grid where each result row becomes a visual card. Supports optional subtitle, badge, and per-row click URL columns.
SQL must return at least title_column and value_column. Additional columns for subtitle, badge, and URL are optional — specify with the subtitle_column, badge_column, and url_column parameters.
​
page_id
integer
required
Target page ID.
​
region_name
string
required
Region display name.
​
sql_query
string
required
SQL returning row data for cards.
​
title_column
string
default:"TITLE"
Column for card title.
​
subtitle_column
string
Column for card subtitle (optional).
​
value_column
string
default:"VALUE"
Column for the prominent numeric value.
​
badge_column
string
Column for badge text (optional, e.g., status).
​
url_column
string
Column providing a per-card click URL (optional).
​
color
string
default:"blue"
Accent color for value text and top border.
​
columns
integer
default:"3"
Grid columns (2–4).

​
apex_add_percent_bars

Add horizontal percentage bars rendered in pure HTML/CSS. Lighter and faster-rendering than JET charts — ideal for quick visual comparisons.
SQL must return LABEL and VALUE columns. Values are normalized against the maximum row value to compute bar widths as percentages.
​
page_id
integer
required
Target page ID.
​
region_name
string
required
Region display name.
​
sql_query
string
required
SQL returning LABEL and VALUE columns.
​
label_column
string
default:"LABEL"
Column for bar labels.
​
value_column
string
default:"VALUE"
Column for bar values.
​
color
string
default:"unimed"
Bar fill color (named or hex).
​
show_values
boolean
default:"true"
Display the numeric value at the end of each bar.

​
apex_add_ribbon_stats

Add a full-width colored ribbon with multiple KPI stats displayed side by side, separated by subtle dividers.
​
page_id
integer
required
Target page ID.
​
region_name
string
required
Internal region name.
​
metrics
array
required
List of stat definitions (3–6). Each:
{"label": "Uptime", "sql": "SELECT '99.9%' FROM DUAL", "icon": "fa-server", "color": "green", "suffix": ""}
​
bg_color
string
default:"#f8f9fa"
Ribbon background color (CSS value).

​
apex_add_icon_list

Add a vertical icon + label + value list from SQL. Each row shows a colored icon circle, a label, and a right-aligned value. Great for status summaries, category breakdowns, or configuration lists.
​
page_id
integer
required
Target page ID.
​
region_name
string
required
Region display name.
​
sql_query
string
required
SQL returning label and value columns, optionally an icon column.
SELECT DS_STATUS AS LABEL, COUNT(*) AS VALUE
  FROM ORDERS
 GROUP BY DS_STATUS
 ORDER BY 1
​
label_column
string
default:"LABEL"
Column for item labels.
​
value_column
string
default:"VALUE"
Column for right-aligned values.
​
icon_column
string
Column providing a Font Awesome class per row (optional). When omitted, default_icon is used for all rows.
​
default_icon
string
default:"fa-circle"
Fallback Font Awesome icon class when icon_column is empty or not specified.
​
color
string
default:"blue"
Accent color for icons and values (named or hex).
​
sequence
integer
default:"10"
Display order on page.

​
Status & Indicators

​
apex_add_traffic_light

Add a traffic-light status indicator grid. Each SQL row produces a card with a colored dot: green (OK/CONCLUIDA/ATIVO), amber (WARNING/EM_ANDAMENTO), or red (ERROR/CANCELADA). Unknown values render as grey.
​
page_id
integer
required
Target page ID.
​
region_name
string
required
Region display name.
​
sql_query
string
required
SQL returning a label column and a status column.
SELECT SERVICE_NAME AS LABEL,
       CASE WHEN ERROR_COUNT = 0 THEN 'GREEN'
            WHEN ERROR_COUNT < 5 THEN 'AMBER'
            ELSE 'RED'
       END AS STATUS
  FROM SERVICE_HEALTH
 ORDER BY 1
​
label_column
string
default:"LABEL"
Column for item labels.
​
status_column
string
default:"STATUS"
Column for status values. Automatically maps: GREEN / OK / CONCLUIDA / ATIVO → green AMBER / WARNING / EM_ANDAMENTO → amber RED / ERROR / CANCELADA → red

​
apex_add_alert_box

Add a styled alert/notification box. More visual than apex_add_notification_region — supports a bold title line and optional dismiss button.
​
page_id
integer
required
Target page ID.
​
message
string
required
Alert message text. Supports &ITEM. substitutions.
​
alert_type
string
default:"info"
Visual style: info (blue), success (green), warning (orange), error (red). All combinations maintain WCAG AA contrast (4.5:1+).
​
title
string
Optional bold title line above the message.
​
dismissible
boolean
default:"true"
Show × close button that removes the alert from the DOM.
​
icon
string
Font Awesome class override. Uses type default if empty (e.g., fa-info-circle for info).
​
sequence
integer
default:"5"
Display order on page (set low to appear above other content).
Example: 
apex_add_alert_box(
    page_id=10,
    message="Your session will expire in 10 minutes. Please save your work.",
    alert_type="warning",
    title="Session Expiry Notice",
    dismissible=True,
    sequence=3,
)

​
apex_add_progress_tracker

Add a horizontal step-by-step progress tracker with numbered breadcrumbs. Ideal for wizard flows, onboarding processes, or multi-stage approvals. Completed steps show a checkmark; the active step is highlighted.
​
page_id
integer
required
Target page ID.
​
region_name
string
required
Internal region name.
​
steps
array
required
List of step label strings, e.g. ["Basic Info", "Review", "Confirm"].
​
current_step
integer
default:"1"
Active step number (1-based). Steps before this are marked as completed.
​
color
string
default:"unimed"
Accent color for active and completed steps.
​
completed_label
string
Override the checkmark character for completed steps. Defaults to ✓.

​
apex_add_comparison_panel

Add a side-by-side two-column comparison panel (A vs B). Ideal for period comparison, group A/B analysis, or plan vs. actual.
​
page_id
integer
required
Target page ID.
​
region_name
string
required
Internal region name.
​
left_label
string
required
Header text for the left column (e.g., "Last Month").
​
left_metrics
array
required
Metrics for the left column. Each object:
{"label": "Total Sales", "sql": "SELECT SUM(AMOUNT) FROM ORDERS WHERE ...", "suffix": ""}
​
right_label
string
required
Header text for the right column (e.g., "This Month").
​
right_metrics
array
required
Metrics for the right column (same format as left_metrics).
​
left_color
string
default:"blue"
Accent color for the left column header.
​
right_color
string
default:"green"
Accent color for the right column header.

​
apex_add_status_matrix

Add a status matrix card grid — each SQL row becomes a card with a colored dot and badge reflecting its status. Optional group column adds a category label below each card.
​
page_id
integer
required
Target page ID.
​
region_name
string
required
Region display name.
​
sql_query
string
required
SQL returning label and status columns.
SELECT SERVICE_NAME AS LABEL, HEALTH_STATUS AS STATUS
  FROM SERVICES
 ORDER BY 1
​
label_column
string
default:"LABEL"
Column for item name.
​
status_column
string
default:"STATUS"
Column with status text. Automatically colored: ATIVO / ACTIVE / OK / CONCLUIDA → green PENDENTE / EM_ANDAMENTO / PENDING → amber INATIVO / CANCELADA / ERROR → red
​
group_column
string
Optional column for category grouping label shown below the item.

​
Advanced

​
apex_add_activity_stream

Add a scrollable audit/activity feed showing recent events in reverse-chronological order. Relative date labels are computed automatically: "há minutos", "3h atrás", "2d atrás", or DD/MM/YYYY.
SQL must return at minimum a text column and a date/timestamp column. Alias them to the values you pass as text_column and date_column. ORDER BY date DESC for correct feed order.
​
page_id
integer
required
Target page ID.
​
region_name
string
required
Region display name (shown as the feed header).
​
sql_query
string
required
SQL returning activity data ordered by date DESC.
SELECT ACTION_DESC AS TEXT, ACTION_DATE AS DT, 'fa-edit' AS ICON_COL
  FROM AUDIT_LOG
 ORDER BY ACTION_DATE DESC
​
text_column
string
default:"TEXT"
Column for the activity description.
​
date_column
string
default:"DT"
Column for the event timestamp (DATE or TIMESTAMP).
​
icon_column
string
Column providing a Font Awesome icon class per row (optional).
​
color_column
string
Column providing a hex color per row (optional).
​
default_icon
string
default:"fa-circle"
Default icon class when icon_column is empty or not provided.
​
default_color
string
default:"blue"
Default accent color.
​
max_rows
integer
default:"20"
Maximum rows to display.
Example: 
apex_add_activity_stream(
    page_id=1,
    region_name="Recent Activity",
    sql_query="""
        SELECT DS_DESCRIPTION AS TEXT,
               DT_CREATED      AS DT,
               CASE DS_TYPE
                 WHEN 'CREATE' THEN 'fa-plus-circle'
                 WHEN 'UPDATE' THEN 'fa-edit'
                 WHEN 'DELETE' THEN 'fa-trash'
                 ELSE 'fa-circle'
               END AS ICON_COL
          FROM AUDIT_LOG
         ORDER BY DT_CREATED DESC
    """,
    icon_column="ICON_COL",
    max_rows=15,
)

​
apex_add_tag_cloud

Add a dynamic tag/word cloud from SQL. Font size scales proportionally with the count column value. Colors cycle through a built-in 10-color palette.
SQL must return a label column and a count/frequency column. The tag with the highest count gets the largest font size; others scale proportionally.
​
page_id
integer
required
Target page ID.
​
region_name
string
required
Region display name.
​
sql_query
string
required
SQL returning tag text and frequency.
SELECT CATEGORY_NAME AS LABEL, POST_COUNT AS CNT
  FROM CATEGORIES
 ORDER BY POST_COUNT DESC
​
label_column
string
default:"LABEL"
Column for tag text.
​
count_column
string
default:"CNT"
Column for the frequency/weight value.

​
apex_add_heatmap_grid

Add a color-intensity heatmap matrix. Each cell’s background opacity reflects its value relative to the maximum value in the dataset. SQL must return row labels, column labels, and numeric cell values.
SQL must return three columns for the row dimension, column dimension, and cell value. The tool dynamically collects unique row and column labels, then renders a full cross-tab grid. Empty intersections are rendered as blank cells.
​
page_id
integer
required
Target page ID.
​
region_name
string
required
Region display name.
​
sql_query
string
required
SQL returning row label, column label, and numeric value.
SELECT TO_CHAR(ORDER_DATE,'DY') AS ROW_LABEL,
       TO_CHAR(ORDER_DATE,'HH24') AS COL_LABEL,
       COUNT(*) AS VALUE
  FROM ORDERS
 GROUP BY TO_CHAR(ORDER_DATE,'DY'), TO_CHAR(ORDER_DATE,'HH24')
 ORDER BY 1, 2
​
row_column
string
default:"ROW_LABEL"
Column for row labels.
​
col_column
string
default:"COL_LABEL"
Column for column labels.
​
value_column
string
default:"VALUE"
Column for numeric cell values.
​
color
string
default:"blue"
Heatmap base color. High-intensity cells use this color; low-intensity cells use a tint.
Example: 
apex_add_heatmap_grid(
    page_id=5,
    region_name="Orders by Day & Hour",
    sql_query="""
        SELECT TO_CHAR(ORDER_DATE, 'DY')  AS ROW_LABEL,
               TO_CHAR(ORDER_DATE, 'HH24') AS COL_LABEL,
               COUNT(*) AS VALUE
          FROM ORDERS
         WHERE ORDER_DATE >= SYSDATE - 90
         GROUP BY TO_CHAR(ORDER_DATE, 'DY'), TO_CHAR(ORDER_DATE, 'HH24')
         ORDER BY 1, 2
    """,
    color="#1e88e5",
)

Build docs developers (and LLMs) love

Get started for freeTalk to us