🐸 Groggy Display Template Prototype

Use this template to prototype new styles and themes for Groggy tables.

Basic Data Types

Demonstrates styling for different data types: strings, numbers, booleans, etc.

name age score active salary join_date
Alice Johnson 25 91.50 75,000 2023-01-15
Bob & Associates LLC 30,000 87.00 125,000 2022-03-22
Carol Smith 28 95.75 82,000 2023-06-10
David <Test> User 35 88.25 95,000 2021-11-30
Eve 'Quotes' Wilson 42 92.00 110,000 2020-08-15
Showing 5 of 1005 rows (sample data)

Large Numbers & Scientific Notation

Tests number formatting with large values, scientific notation, and precision.

metric small_value large_value scientific percentage
Revenue 1.20e-04 1,250,000 1.23e-08 15.75
Users 0.00 50,000,000 601999999999999995805696.00 99.99
Storage (TB) 1.00e-04 987,654,321 3.14 0.01
Throughput 1.00e-06 1,000,000,000 2.72 100.00
Showing 4 of 1004 rows (sample data)

Edge Cases & Truncation

Tests truncation, special characters, and edge cases in data display.

type short very_long_content special_chars json_data
Normal Short This is a very long piece of … Normal text {"key": "value", "number": 42}
HTML Test Content with <script>alert('x… &lt;tag&gt; {"html": "<div>content</div>"}
Unicode 🚀 Unicode content with émojis 🎉… Spéciål ¢hars {"emoji": "🌟", "text": "unico…
Quotes 'Test' Content with "double quotes" … "Quoted" {"nested": {"quotes": "test"}}
Showing 4 of 1004 rows (sample data)