YFlite Dev Components

Y Components Demo

This page demonstrates a few `y_*` helper components. If they are not available, follow the notes below.

Y-Functional Components Showcase

Below are all the UI components available in Y.php.

y_accordion

Content 1
Content 2

y_modal

y_tabs & y_tab_panel

Panel 1 Content
Panel 2 Content

y_input & y_checkbox



y_heading, y_text, y_label

Heading 2 Component

This is some body text.

y_badge & y_avatar

Success Badge

Layout Components

Container content...
Cell 1
Cell 2
Stack Item 1
Stack Item 2
Flex Item 1
Flex Item 2

y_card

Card Header
Card Body Content
Card Footer

y_spacer & y_divider

y_nav & y_nav_item

y_sidebar & y_sidebar_item

y_breadcrumbs

  1. Home/
  2. Products/
  3. Shoes

y_pagination_item

y_drawer

y_menu & y_menu_item

Profile Logout

y_dropdown

y_alert

This is a success alert!

y_notice & y_marquee

🔧 Scheduled maintenance tonight at 11 PM UTC.
⚡ Acme Corp 🚀 Stellar Labs 🌍 GlobalTech 🎯 TargetSoft 💎 Crystal Systems

y_skeleton, y_progress_bar, y_progress_circle



y_tooltip & y_popover

Hover me
Tooltip text!


Click me

Popover content...

🔍
Name Role
Alice Admin
Bob User
🔍
No match found
🔍
  • System Logs
    DevOps
  • Database Backups
    Infrastructure
  • User Permissions
    Security
  • 📋
    We couldn't find any log entries matching that parameter.

y_list & y_tree

  • List Item 1
  • List Item 2
  • 📋
    No match found

  • ▼ Root
    • # Child 1
    • # Child 2

y_carousel

Slide 1
Slide 2

y_toast

Data saved successfully!

y_autocomplete & y_combobox

New York
London

United States
Canada

Specialized Inputs





Min: 0 50 Max: 100


★★★★★






Start typing here...


Full editor with all tools enabled...







y_stepper

1
Step 1
2
Step 2

Data Visualization

A
1
B
2

Total Users
1,234 +5.2%


Revenue Chart

Canvas Placeholder

ID Value
1 A

Feedback & Status

Status: Active


📭

No Data

You have not added any data yet.



Timeline Event

New

Code & Developer Tools

php 
echo "Hello World";

{
    "key": "value",
    "nested": {
        "a": 1
    }
}

bash
Starting server...
Error: Port in use

API Endpointhttps://api.example.com/v1
StatusActive
Last Sync2 mins ago

Ctrl+C

Interactive Query Terminal Console
$

old text line 2
new text line 2

Source Code Workspace Buffer UTF-8 
function test() {}

Query Target Filter Conditions

Misc Composites



Admin Access Grant full administrative privileges.

Sign In





🔍

🔍
⚙️ Open Local Account Profile
🔒 System Permission Configuration Panel
⚙️
No local navigation commands found.






Processing document parameters...