[{"data":1,"prerenderedAt":-1},["ShallowReactive",2],{"skill-vercel-labs-tw-blocks":3,"mdc--l0ne54-key":35,"related-org-vercel-labs-tw-blocks":3564,"related-repo-vercel-labs-tw-blocks":3732},{"slug":4,"name":4,"fn":5,"description":6,"org":7,"tags":11,"stars":25,"repoUrl":26,"updatedAt":27,"license":28,"forks":29,"topics":30,"repo":31,"sourceUrl":33,"mdContent":34},"tw-blocks","build UIs with Tailwind CSS spacing","Semantic spacing system for Tailwind CSS v4 using block (32px) and tab (4px) units. Use when building UIs with consistent spacing, dashboards, admin panels, design tools, or any interface requiring a harmonious spacing system. Provides patterns for buttons, inputs, cards, toolbars, panels, and layouts.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},"vercel-labs","Vercel Labs","https:\u002F\u002Fpexgzepcugksgbtrxkhf.supabase.co\u002Fstorage\u002Fv1\u002Fobject\u002Fpublic\u002Forg-logos\u002Fvercel-labs.png",[12,16,19,22],{"name":13,"slug":14,"type":15},"Tailwind CSS","tailwind-css","tag",{"name":17,"slug":18,"type":15},"UI Components","ui-components",{"name":20,"slug":21,"type":15},"Frontend","frontend",{"name":23,"slug":24,"type":15},"Design","design",1,"https:\u002F\u002Fgithub.com\u002Fvercel-labs\u002Ftw-blocks","2026-07-17T06:09:03.521088",null,0,[],{"repoUrl":26,"stars":25,"forks":29,"topics":32,"description":28},[],"https:\u002F\u002Fgithub.com\u002Fvercel-labs\u002Ftw-blocks\u002Ftree\u002FHEAD\u002FSKILLS\u002Ftw-blocks","---\nname: tw-blocks\ndescription: Semantic spacing system for Tailwind CSS v4 using block (32px) and tab (4px) units. Use when building UIs with consistent spacing, dashboards, admin panels, design tools, or any interface requiring a harmonious spacing system. Provides patterns for buttons, inputs, cards, toolbars, panels, and layouts.\n---\n\n# TW-Blocks Design System\n\n## Core Principles\n\nTW-Blocks provides semantic spacing using two fundamental units:\n\n- **Block (2rem \u002F 32px)**: Component sizes - buttons, inputs, headers, toolbars, avatars\n- **Tab (0.25rem \u002F 4px)**: Padding, margins, gaps - spacing between and within elements\n\n**The 4:1 Ratio**: 4 tabs = 1 block. This creates predictable, harmonious layouts.\n\n```\n1 block = 32px = 4 tabs\n████████  ████████  ████████  ████████\n tab-1     tab-2     tab-3     tab-4\n  4px       8px       12px      16px\n```\n\n---\n\n## Installation & Setup\n\n```bash\npnpm add tw-blocks\n```\n\n```css\n\u002F* app\u002Fglobals.css *\u002F\n@import \"tailwindcss\";\n@import \"tw-blocks\";\n```\n\n---\n\n## Class Reference\n\n### Tab Spacing Scale (17 values)\n| Class suffix | Value | Pixels |\n|--------------|-------|--------|\n| `tab-0` | 0 | 0px |\n| `tab-0.5` | 0.5 × tab | 2px |\n| `tab-1` | 1 × tab | 4px |\n| `tab-1.5` | 1.5 × tab | 6px |\n| `tab-2` | 2 × tab | 8px |\n| `tab-2.5` | 2.5 × tab | 10px |\n| `tab-3` | 3 × tab | 12px |\n| `tab-4` | 4 × tab | 16px |\n| `tab-5` | 5 × tab | 20px |\n| `tab-6` | 6 × tab | 24px |\n| `tab-8` | 8 × tab | 32px |\n| `tab-10` | 10 × tab | 40px |\n| `tab-12` | 12 × tab | 48px |\n| `tab-16` | 16 × tab | 64px |\n| `tab-20` | 20 × tab | 80px |\n| `tab-24` | 24 × tab | 96px |\n| `tab-32` | 32 × tab | 128px |\n\n### Block Spacing Scale (14 values)\n| Class suffix | Value | Pixels |\n|--------------|-------|--------|\n| `block-0` | 0 | 0px |\n| `block-0.5` | 0.5 × block | 16px |\n| `block-1` | 1 × block | 32px |\n| `block-1.5` | 1.5 × block | 48px |\n| `block-2` | 2 × block | 64px |\n| `block-2.5` | 2.5 × block | 80px |\n| `block-3` | 3 × block | 96px |\n| `block-4` | 4 × block | 128px |\n| `block-5` | 5 × block | 160px |\n| `block-6` | 6 × block | 192px |\n| `block-8` | 8 × block | 256px |\n| `block-10` | 10 × block | 320px |\n| `block-12` | 12 × block | 384px |\n| `block-16` | 16 × block | 512px |\n\n### Border Radius Values\n| Class | Value | Pixels |\n|-------|-------|--------|\n| `rounded-tab-1` | 1 × tab | 4px |\n| `rounded-tab-2` | 2 × tab | 8px |\n| `rounded-tab-3` | 3 × tab | 12px |\n| `rounded-tab-4` | 4 × tab | 16px |\n| `rounded-block-0.5` | 0.5 × block | 16px |\n| `rounded-block-1` | 1 × block | 32px (fully round) |\n\n### Supported Tailwind Utilities\nAll standard Tailwind spacing utilities work with block\u002Ftab:\n- **Padding**: `p-tab-4`, `px-tab-3`, `py-tab-2`, `p-block-1`\n- **Margin**: `m-tab-4`, `mx-tab-3`, `my-tab-2`, `m-block-1`\n- **Gap**: `gap-tab-4`, `gap-x-tab-3`, `gap-block-1`\n- **Width\u002FHeight**: `w-block-2`, `h-block-1`, `size-block-1`\n- **Inset**: `top-tab-2`, `left-tab-4`, `inset-block-1`\n- **Space**: `space-x-tab-2`, `space-y-tab-4`\n\n---\n\n## Quick Patterns\n\n### Button\n```html\n\u003Cbutton class=\"h-block-1 px-tab-4 rounded-tab-2 bg-blue-500 text-white\">Click me\u003C\u002Fbutton>\n```\n\n### Small Button\n```html\n\u003Cbutton class=\"h-tab-6 px-tab-3 rounded-tab-1.5 text-sm\">Small\u003C\u002Fbutton>\n```\n\n### Icon Button\n```html\n\u003Cbutton class=\"size-block-1 flex items-center justify-center rounded-tab-2\">\n  \u003Csvg class=\"w-tab-4 h-tab-4\" \u002F>\n\u003C\u002Fbutton>\n```\n\n### Input Field\n```html\n\u003Cinput type=\"text\" class=\"h-block-1 px-tab-3 rounded-tab-2 border border-gray-300\" \u002F>\n```\n\n### Card\n```html\n\u003Cdiv class=\"p-tab-4 rounded-block-0.5 bg-white shadow-sm border\">\n  \u003Ch3 class=\"text-lg font-semibold\">Title\u003C\u002Fh3>\n  \u003Cp class=\"mt-tab-2 text-gray-600\">Description\u003C\u002Fp>\n\u003C\u002Fdiv>\n```\n\n---\n\n## Best Practices\n\n### Component Height Guidelines\n| Component | Height | Class |\n|-----------|--------|-------|\n| Standard button | 32px | `h-block-1` |\n| Small button | 24px | `h-tab-6` |\n| Large button | 48px | `h-block-1.5` |\n| Input field | 32px | `h-block-1` |\n| Small input | 24px | `h-tab-6` |\n| Toolbar | 48px | `h-block-1.5` |\n| Header (main) | 64px | `h-block-2` |\n| Status bar | 24px | `h-tab-6` |\n| Avatar (small) | 32px | `size-block-1` |\n| Avatar (large) | 48px | `size-block-1.5` |\n\n### Horizontal Padding Standards\n| Container | Padding |\n|-----------|---------|\n| Page content | `px-tab-6` |\n| Card | `p-tab-4` |\n| Button | `px-tab-4` |\n| Input | `px-tab-3` |\n| Panel section | `p-tab-2` or `p-tab-3` |\n| Header | `px-tab-4` |\n\n### Border Radius Guidelines\n| Element | Radius |\n|---------|--------|\n| Button | `rounded-tab-2` (8px) |\n| Card | `rounded-block-0.5` (16px) |\n| Input | `rounded-tab-2` (8px) |\n| Small badge | `rounded-tab-1` (4px) |\n| Avatar | `rounded-full` |\n\n### UI Density Patterns\n\n**Compact UI** (Code editors, IDEs, tools):\n- Toolbar: `h-block-1` (32px)\n- List items: `h-tab-5` or `h-tab-6` (20-24px)\n- Padding: `p-tab-2`, `px-tab-3`\n- Gaps: `gap-tab-1`, `gap-tab-2`\n\n**Normal UI** (Dashboards, apps):\n- Header: `h-block-2` (64px)\n- Buttons: `h-block-1` (32px)\n- Cards: `p-tab-4` or `p-tab-6`\n- Gaps: `gap-tab-4`, `gap-tab-6`\n\n**Spacious UI** (Marketing, content):\n- Headers: `h-block-2.5` or `h-block-3`\n- Cards: `p-tab-8`, `p-tab-12`\n- Gaps: `gap-tab-8`, `gap-tab-12`\n\n---\n\n## Combining with Standard Tailwind\n\nTW-Blocks focuses on **spacing and sizing**. Use standard Tailwind for everything else:\n\n### ✅ Use Standard Tailwind For:\n- Colors: `bg-blue-500`, `text-gray-700`, `border-gray-200`\n- Typography: `text-sm`, `font-bold`\n- Flexbox\u002FGrid: `flex`, `grid`, `items-center`\n- Borders: `border`, `border-t`\n- Effects: `shadow-md`, `hover:bg-gray-100`\n\n### ❌ Avoid Standard Tailwind For:\n- Spacing: Use `p-tab-4` not `p-4`\n- Component sizing: Use `h-block-1` not `h-8`\n- Block-aligned radius: Use `rounded-tab-2` not `rounded-md`\n\n---\n\n## Detailed Patterns\n\nFor complete component patterns, see **[references\u002Fpatterns.md](references\u002Fpatterns.md)**:\n\n- Dashboard layouts (sidebar, stat cards)\n- Toolbars & headers (dashboard, design tool, status bar)\n- Panels & sidebars (tool palette, property panels, layers)\n- Forms & inputs (buttons, inputs, cards)\n- Tables & lists (dense lists, email lists)\n- Status indicators (badges, progress bars, selected states)\n- Chat & messages (chat bubbles, message lists)\n- Charts & data viz (containers, recommended heights)\n- Timeline & animation panels\n- Code editor interface (full IDE layout)\n\n**Read patterns.md when you need specific implementation examples.**\n\n---\n\n## Common Mistakes to Avoid\n\n### ❌ Don't mix spacing systems\n```html\n\u003C!-- Bad -->\n\u003Cdiv class=\"p-4 mt-tab-2 mb-8\">\n\n\u003C!-- Good -->\n\u003Cdiv class=\"p-tab-4 mt-tab-2 mb-tab-8\">\n```\n\n### ❌ Don't use blocks for small padding\n```html\n\u003C!-- Bad -->\n\u003Cbutton class=\"p-block-1\">\n\n\u003C!-- Good -->\n\u003Cbutton class=\"px-tab-4 py-tab-2\">\n```\n\n### ❌ Don't use tabs for component sizing\n```html\n\u003C!-- Bad -->\n\u003Cbutton class=\"h-tab-8\">\n\n\u003C!-- Good -->\n\u003Cbutton class=\"h-block-1\">\n```\n\n### ✅ Do use fractional values\n```html\n\u003Cdiv class=\"p-tab-1.5\">  \u003C!-- 6px -->\n\u003Cdiv class=\"h-block-1.5\"> \u003C!-- 48px -->\n\u003Cdiv class=\"gap-tab-2.5\"> \u003C!-- 10px -->\n```\n\n---\n\n## Debugging Tips\n\n### Inspect CSS Variables\n```javascript\ngetComputedStyle(document.documentElement).getPropertyValue('--spacing-block') \u002F\u002F \"2rem\"\ngetComputedStyle(document.documentElement).getPropertyValue('--spacing-tab')   \u002F\u002F \"0.25rem\"\n```\n\n### Test with Visible Borders\n```html\n\u003Cdiv class=\"p-tab-4 border-2 border-red-500\">\n  \u003Cdiv class=\"h-block-1 border-2 border-blue-500\">Button height\u003C\u002Fdiv>\n\u003C\u002Fdiv>\n```\n\n---\n\n## Quick Reference\n\n```\n┌─────────────────────────────────────────────────────────┐\n│ BLOCKS (Component Sizing)                                │\n│ block-1 = 32px | block-1.5 = 48px | block-2 = 64px      │\n├─────────────────────────────────────────────────────────┤\n│ TABS (Spacing\u002FPadding)                                   │\n│ tab-1 = 4px | tab-2 = 8px | tab-3 = 12px | tab-4 = 16px │\n├─────────────────────────────────────────────────────────┤\n│ HEIGHT: Button h-block-1 | Header h-block-2 | Toolbar h-block-1.5 │\n├─────────────────────────────────────────────────────────┤\n│ PADDING: Button px-tab-4 | Card p-tab-4 | Input px-tab-3 │\n├─────────────────────────────────────────────────────────┤\n│ RADIUS: Button rounded-tab-2 | Card rounded-block-0.5    │\n└─────────────────────────────────────────────────────────┘\n```\n",{"data":36,"body":37},{"name":4,"description":6},{"type":38,"children":39},"root",[40,49,56,62,88,98,111,115,121,152,225,228,234,241,648,654,977,983,1129,1135,1140,1326,1329,1335,1341,1412,1418,1478,1484,1585,1591,1657,1663,1829,1832,1838,1844,2074,2080,2206,2212,2319,2325,2335,2403,2413,2472,2482,2537,2540,2546,2558,2564,2671,2677,2732,2735,2741,2757,2810,2818,2821,2827,2833,2938,2944,3043,3049,3148,3154,3283,3286,3292,3298,3423,3429,3540,3543,3549,3558],{"type":41,"tag":42,"props":43,"children":45},"element","h1",{"id":44},"tw-blocks-design-system",[46],{"type":47,"value":48},"text","TW-Blocks Design System",{"type":41,"tag":50,"props":51,"children":53},"h2",{"id":52},"core-principles",[54],{"type":47,"value":55},"Core Principles",{"type":41,"tag":57,"props":58,"children":59},"p",{},[60],{"type":47,"value":61},"TW-Blocks provides semantic spacing using two fundamental units:",{"type":41,"tag":63,"props":64,"children":65},"ul",{},[66,78],{"type":41,"tag":67,"props":68,"children":69},"li",{},[70,76],{"type":41,"tag":71,"props":72,"children":73},"strong",{},[74],{"type":47,"value":75},"Block (2rem \u002F 32px)",{"type":47,"value":77},": Component sizes - buttons, inputs, headers, toolbars, avatars",{"type":41,"tag":67,"props":79,"children":80},{},[81,86],{"type":41,"tag":71,"props":82,"children":83},{},[84],{"type":47,"value":85},"Tab (0.25rem \u002F 4px)",{"type":47,"value":87},": Padding, margins, gaps - spacing between and within elements",{"type":41,"tag":57,"props":89,"children":90},{},[91,96],{"type":41,"tag":71,"props":92,"children":93},{},[94],{"type":47,"value":95},"The 4:1 Ratio",{"type":47,"value":97},": 4 tabs = 1 block. This creates predictable, harmonious layouts.",{"type":41,"tag":99,"props":100,"children":104},"pre",{"className":101,"code":103,"language":47},[102],"language-text","1 block = 32px = 4 tabs\n████████  ████████  ████████  ████████\n tab-1     tab-2     tab-3     tab-4\n  4px       8px       12px      16px\n",[105],{"type":41,"tag":106,"props":107,"children":109},"code",{"__ignoreMap":108},"",[110],{"type":47,"value":103},{"type":41,"tag":112,"props":113,"children":114},"hr",{},[],{"type":41,"tag":50,"props":116,"children":118},{"id":117},"installation-setup",[119],{"type":47,"value":120},"Installation & Setup",{"type":41,"tag":99,"props":122,"children":126},{"className":123,"code":124,"language":125,"meta":108,"style":108},"language-bash shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","pnpm add tw-blocks\n","bash",[127],{"type":41,"tag":106,"props":128,"children":129},{"__ignoreMap":108},[130],{"type":41,"tag":131,"props":132,"children":134},"span",{"class":133,"line":25},"line",[135,141,147],{"type":41,"tag":131,"props":136,"children":138},{"style":137},"--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B",[139],{"type":47,"value":140},"pnpm",{"type":41,"tag":131,"props":142,"children":144},{"style":143},"--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D",[145],{"type":47,"value":146}," add",{"type":41,"tag":131,"props":148,"children":149},{"style":143},[150],{"type":47,"value":151}," tw-blocks\n",{"type":41,"tag":99,"props":153,"children":157},{"className":154,"code":155,"language":156,"meta":108,"style":108},"language-css shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u002F* app\u002Fglobals.css *\u002F\n@import \"tailwindcss\";\n@import \"tw-blocks\";\n","css",[158],{"type":41,"tag":106,"props":159,"children":160},{"__ignoreMap":108},[161,170,201],{"type":41,"tag":131,"props":162,"children":163},{"class":133,"line":25},[164],{"type":41,"tag":131,"props":165,"children":167},{"style":166},"--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#546E7A;--shiki-default-font-style:italic;--shiki-dark:#676E95;--shiki-dark-font-style:italic",[168],{"type":47,"value":169},"\u002F* app\u002Fglobals.css *\u002F\n",{"type":41,"tag":131,"props":171,"children":173},{"class":133,"line":172},2,[174,180,186,191,196],{"type":41,"tag":131,"props":175,"children":177},{"style":176},"--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic",[178],{"type":47,"value":179},"@import",{"type":41,"tag":131,"props":181,"children":183},{"style":182},"--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF",[184],{"type":47,"value":185}," \"",{"type":41,"tag":131,"props":187,"children":188},{"style":143},[189],{"type":47,"value":190},"tailwindcss",{"type":41,"tag":131,"props":192,"children":193},{"style":182},[194],{"type":47,"value":195},"\"",{"type":41,"tag":131,"props":197,"children":198},{"style":182},[199],{"type":47,"value":200},";\n",{"type":41,"tag":131,"props":202,"children":204},{"class":133,"line":203},3,[205,209,213,217,221],{"type":41,"tag":131,"props":206,"children":207},{"style":176},[208],{"type":47,"value":179},{"type":41,"tag":131,"props":210,"children":211},{"style":182},[212],{"type":47,"value":185},{"type":41,"tag":131,"props":214,"children":215},{"style":143},[216],{"type":47,"value":4},{"type":41,"tag":131,"props":218,"children":219},{"style":182},[220],{"type":47,"value":195},{"type":41,"tag":131,"props":222,"children":223},{"style":182},[224],{"type":47,"value":200},{"type":41,"tag":112,"props":226,"children":227},{},[],{"type":41,"tag":50,"props":229,"children":231},{"id":230},"class-reference",[232],{"type":47,"value":233},"Class Reference",{"type":41,"tag":235,"props":236,"children":238},"h3",{"id":237},"tab-spacing-scale-17-values",[239],{"type":47,"value":240},"Tab Spacing Scale (17 values)",{"type":41,"tag":242,"props":243,"children":244},"table",{},[245,269],{"type":41,"tag":246,"props":247,"children":248},"thead",{},[249],{"type":41,"tag":250,"props":251,"children":252},"tr",{},[253,259,264],{"type":41,"tag":254,"props":255,"children":256},"th",{},[257],{"type":47,"value":258},"Class suffix",{"type":41,"tag":254,"props":260,"children":261},{},[262],{"type":47,"value":263},"Value",{"type":41,"tag":254,"props":265,"children":266},{},[267],{"type":47,"value":268},"Pixels",{"type":41,"tag":270,"props":271,"children":272},"tbody",{},[273,296,318,340,362,384,406,428,450,472,494,516,538,560,582,604,626],{"type":41,"tag":250,"props":274,"children":275},{},[276,286,291],{"type":41,"tag":277,"props":278,"children":279},"td",{},[280],{"type":41,"tag":106,"props":281,"children":283},{"className":282},[],[284],{"type":47,"value":285},"tab-0",{"type":41,"tag":277,"props":287,"children":288},{},[289],{"type":47,"value":290},"0",{"type":41,"tag":277,"props":292,"children":293},{},[294],{"type":47,"value":295},"0px",{"type":41,"tag":250,"props":297,"children":298},{},[299,308,313],{"type":41,"tag":277,"props":300,"children":301},{},[302],{"type":41,"tag":106,"props":303,"children":305},{"className":304},[],[306],{"type":47,"value":307},"tab-0.5",{"type":41,"tag":277,"props":309,"children":310},{},[311],{"type":47,"value":312},"0.5 × tab",{"type":41,"tag":277,"props":314,"children":315},{},[316],{"type":47,"value":317},"2px",{"type":41,"tag":250,"props":319,"children":320},{},[321,330,335],{"type":41,"tag":277,"props":322,"children":323},{},[324],{"type":41,"tag":106,"props":325,"children":327},{"className":326},[],[328],{"type":47,"value":329},"tab-1",{"type":41,"tag":277,"props":331,"children":332},{},[333],{"type":47,"value":334},"1 × tab",{"type":41,"tag":277,"props":336,"children":337},{},[338],{"type":47,"value":339},"4px",{"type":41,"tag":250,"props":341,"children":342},{},[343,352,357],{"type":41,"tag":277,"props":344,"children":345},{},[346],{"type":41,"tag":106,"props":347,"children":349},{"className":348},[],[350],{"type":47,"value":351},"tab-1.5",{"type":41,"tag":277,"props":353,"children":354},{},[355],{"type":47,"value":356},"1.5 × tab",{"type":41,"tag":277,"props":358,"children":359},{},[360],{"type":47,"value":361},"6px",{"type":41,"tag":250,"props":363,"children":364},{},[365,374,379],{"type":41,"tag":277,"props":366,"children":367},{},[368],{"type":41,"tag":106,"props":369,"children":371},{"className":370},[],[372],{"type":47,"value":373},"tab-2",{"type":41,"tag":277,"props":375,"children":376},{},[377],{"type":47,"value":378},"2 × tab",{"type":41,"tag":277,"props":380,"children":381},{},[382],{"type":47,"value":383},"8px",{"type":41,"tag":250,"props":385,"children":386},{},[387,396,401],{"type":41,"tag":277,"props":388,"children":389},{},[390],{"type":41,"tag":106,"props":391,"children":393},{"className":392},[],[394],{"type":47,"value":395},"tab-2.5",{"type":41,"tag":277,"props":397,"children":398},{},[399],{"type":47,"value":400},"2.5 × tab",{"type":41,"tag":277,"props":402,"children":403},{},[404],{"type":47,"value":405},"10px",{"type":41,"tag":250,"props":407,"children":408},{},[409,418,423],{"type":41,"tag":277,"props":410,"children":411},{},[412],{"type":41,"tag":106,"props":413,"children":415},{"className":414},[],[416],{"type":47,"value":417},"tab-3",{"type":41,"tag":277,"props":419,"children":420},{},[421],{"type":47,"value":422},"3 × tab",{"type":41,"tag":277,"props":424,"children":425},{},[426],{"type":47,"value":427},"12px",{"type":41,"tag":250,"props":429,"children":430},{},[431,440,445],{"type":41,"tag":277,"props":432,"children":433},{},[434],{"type":41,"tag":106,"props":435,"children":437},{"className":436},[],[438],{"type":47,"value":439},"tab-4",{"type":41,"tag":277,"props":441,"children":442},{},[443],{"type":47,"value":444},"4 × tab",{"type":41,"tag":277,"props":446,"children":447},{},[448],{"type":47,"value":449},"16px",{"type":41,"tag":250,"props":451,"children":452},{},[453,462,467],{"type":41,"tag":277,"props":454,"children":455},{},[456],{"type":41,"tag":106,"props":457,"children":459},{"className":458},[],[460],{"type":47,"value":461},"tab-5",{"type":41,"tag":277,"props":463,"children":464},{},[465],{"type":47,"value":466},"5 × tab",{"type":41,"tag":277,"props":468,"children":469},{},[470],{"type":47,"value":471},"20px",{"type":41,"tag":250,"props":473,"children":474},{},[475,484,489],{"type":41,"tag":277,"props":476,"children":477},{},[478],{"type":41,"tag":106,"props":479,"children":481},{"className":480},[],[482],{"type":47,"value":483},"tab-6",{"type":41,"tag":277,"props":485,"children":486},{},[487],{"type":47,"value":488},"6 × tab",{"type":41,"tag":277,"props":490,"children":491},{},[492],{"type":47,"value":493},"24px",{"type":41,"tag":250,"props":495,"children":496},{},[497,506,511],{"type":41,"tag":277,"props":498,"children":499},{},[500],{"type":41,"tag":106,"props":501,"children":503},{"className":502},[],[504],{"type":47,"value":505},"tab-8",{"type":41,"tag":277,"props":507,"children":508},{},[509],{"type":47,"value":510},"8 × tab",{"type":41,"tag":277,"props":512,"children":513},{},[514],{"type":47,"value":515},"32px",{"type":41,"tag":250,"props":517,"children":518},{},[519,528,533],{"type":41,"tag":277,"props":520,"children":521},{},[522],{"type":41,"tag":106,"props":523,"children":525},{"className":524},[],[526],{"type":47,"value":527},"tab-10",{"type":41,"tag":277,"props":529,"children":530},{},[531],{"type":47,"value":532},"10 × tab",{"type":41,"tag":277,"props":534,"children":535},{},[536],{"type":47,"value":537},"40px",{"type":41,"tag":250,"props":539,"children":540},{},[541,550,555],{"type":41,"tag":277,"props":542,"children":543},{},[544],{"type":41,"tag":106,"props":545,"children":547},{"className":546},[],[548],{"type":47,"value":549},"tab-12",{"type":41,"tag":277,"props":551,"children":552},{},[553],{"type":47,"value":554},"12 × tab",{"type":41,"tag":277,"props":556,"children":557},{},[558],{"type":47,"value":559},"48px",{"type":41,"tag":250,"props":561,"children":562},{},[563,572,577],{"type":41,"tag":277,"props":564,"children":565},{},[566],{"type":41,"tag":106,"props":567,"children":569},{"className":568},[],[570],{"type":47,"value":571},"tab-16",{"type":41,"tag":277,"props":573,"children":574},{},[575],{"type":47,"value":576},"16 × tab",{"type":41,"tag":277,"props":578,"children":579},{},[580],{"type":47,"value":581},"64px",{"type":41,"tag":250,"props":583,"children":584},{},[585,594,599],{"type":41,"tag":277,"props":586,"children":587},{},[588],{"type":41,"tag":106,"props":589,"children":591},{"className":590},[],[592],{"type":47,"value":593},"tab-20",{"type":41,"tag":277,"props":595,"children":596},{},[597],{"type":47,"value":598},"20 × tab",{"type":41,"tag":277,"props":600,"children":601},{},[602],{"type":47,"value":603},"80px",{"type":41,"tag":250,"props":605,"children":606},{},[607,616,621],{"type":41,"tag":277,"props":608,"children":609},{},[610],{"type":41,"tag":106,"props":611,"children":613},{"className":612},[],[614],{"type":47,"value":615},"tab-24",{"type":41,"tag":277,"props":617,"children":618},{},[619],{"type":47,"value":620},"24 × tab",{"type":41,"tag":277,"props":622,"children":623},{},[624],{"type":47,"value":625},"96px",{"type":41,"tag":250,"props":627,"children":628},{},[629,638,643],{"type":41,"tag":277,"props":630,"children":631},{},[632],{"type":41,"tag":106,"props":633,"children":635},{"className":634},[],[636],{"type":47,"value":637},"tab-32",{"type":41,"tag":277,"props":639,"children":640},{},[641],{"type":47,"value":642},"32 × tab",{"type":41,"tag":277,"props":644,"children":645},{},[646],{"type":47,"value":647},"128px",{"type":41,"tag":235,"props":649,"children":651},{"id":650},"block-spacing-scale-14-values",[652],{"type":47,"value":653},"Block Spacing Scale (14 values)",{"type":41,"tag":242,"props":655,"children":656},{},[657,675],{"type":41,"tag":246,"props":658,"children":659},{},[660],{"type":41,"tag":250,"props":661,"children":662},{},[663,667,671],{"type":41,"tag":254,"props":664,"children":665},{},[666],{"type":47,"value":258},{"type":41,"tag":254,"props":668,"children":669},{},[670],{"type":47,"value":263},{"type":41,"tag":254,"props":672,"children":673},{},[674],{"type":47,"value":268},{"type":41,"tag":270,"props":676,"children":677},{},[678,698,719,740,761,782,803,824,845,867,889,911,933,955],{"type":41,"tag":250,"props":679,"children":680},{},[681,690,694],{"type":41,"tag":277,"props":682,"children":683},{},[684],{"type":41,"tag":106,"props":685,"children":687},{"className":686},[],[688],{"type":47,"value":689},"block-0",{"type":41,"tag":277,"props":691,"children":692},{},[693],{"type":47,"value":290},{"type":41,"tag":277,"props":695,"children":696},{},[697],{"type":47,"value":295},{"type":41,"tag":250,"props":699,"children":700},{},[701,710,715],{"type":41,"tag":277,"props":702,"children":703},{},[704],{"type":41,"tag":106,"props":705,"children":707},{"className":706},[],[708],{"type":47,"value":709},"block-0.5",{"type":41,"tag":277,"props":711,"children":712},{},[713],{"type":47,"value":714},"0.5 × block",{"type":41,"tag":277,"props":716,"children":717},{},[718],{"type":47,"value":449},{"type":41,"tag":250,"props":720,"children":721},{},[722,731,736],{"type":41,"tag":277,"props":723,"children":724},{},[725],{"type":41,"tag":106,"props":726,"children":728},{"className":727},[],[729],{"type":47,"value":730},"block-1",{"type":41,"tag":277,"props":732,"children":733},{},[734],{"type":47,"value":735},"1 × block",{"type":41,"tag":277,"props":737,"children":738},{},[739],{"type":47,"value":515},{"type":41,"tag":250,"props":741,"children":742},{},[743,752,757],{"type":41,"tag":277,"props":744,"children":745},{},[746],{"type":41,"tag":106,"props":747,"children":749},{"className":748},[],[750],{"type":47,"value":751},"block-1.5",{"type":41,"tag":277,"props":753,"children":754},{},[755],{"type":47,"value":756},"1.5 × block",{"type":41,"tag":277,"props":758,"children":759},{},[760],{"type":47,"value":559},{"type":41,"tag":250,"props":762,"children":763},{},[764,773,778],{"type":41,"tag":277,"props":765,"children":766},{},[767],{"type":41,"tag":106,"props":768,"children":770},{"className":769},[],[771],{"type":47,"value":772},"block-2",{"type":41,"tag":277,"props":774,"children":775},{},[776],{"type":47,"value":777},"2 × block",{"type":41,"tag":277,"props":779,"children":780},{},[781],{"type":47,"value":581},{"type":41,"tag":250,"props":783,"children":784},{},[785,794,799],{"type":41,"tag":277,"props":786,"children":787},{},[788],{"type":41,"tag":106,"props":789,"children":791},{"className":790},[],[792],{"type":47,"value":793},"block-2.5",{"type":41,"tag":277,"props":795,"children":796},{},[797],{"type":47,"value":798},"2.5 × block",{"type":41,"tag":277,"props":800,"children":801},{},[802],{"type":47,"value":603},{"type":41,"tag":250,"props":804,"children":805},{},[806,815,820],{"type":41,"tag":277,"props":807,"children":808},{},[809],{"type":41,"tag":106,"props":810,"children":812},{"className":811},[],[813],{"type":47,"value":814},"block-3",{"type":41,"tag":277,"props":816,"children":817},{},[818],{"type":47,"value":819},"3 × block",{"type":41,"tag":277,"props":821,"children":822},{},[823],{"type":47,"value":625},{"type":41,"tag":250,"props":825,"children":826},{},[827,836,841],{"type":41,"tag":277,"props":828,"children":829},{},[830],{"type":41,"tag":106,"props":831,"children":833},{"className":832},[],[834],{"type":47,"value":835},"block-4",{"type":41,"tag":277,"props":837,"children":838},{},[839],{"type":47,"value":840},"4 × block",{"type":41,"tag":277,"props":842,"children":843},{},[844],{"type":47,"value":647},{"type":41,"tag":250,"props":846,"children":847},{},[848,857,862],{"type":41,"tag":277,"props":849,"children":850},{},[851],{"type":41,"tag":106,"props":852,"children":854},{"className":853},[],[855],{"type":47,"value":856},"block-5",{"type":41,"tag":277,"props":858,"children":859},{},[860],{"type":47,"value":861},"5 × block",{"type":41,"tag":277,"props":863,"children":864},{},[865],{"type":47,"value":866},"160px",{"type":41,"tag":250,"props":868,"children":869},{},[870,879,884],{"type":41,"tag":277,"props":871,"children":872},{},[873],{"type":41,"tag":106,"props":874,"children":876},{"className":875},[],[877],{"type":47,"value":878},"block-6",{"type":41,"tag":277,"props":880,"children":881},{},[882],{"type":47,"value":883},"6 × block",{"type":41,"tag":277,"props":885,"children":886},{},[887],{"type":47,"value":888},"192px",{"type":41,"tag":250,"props":890,"children":891},{},[892,901,906],{"type":41,"tag":277,"props":893,"children":894},{},[895],{"type":41,"tag":106,"props":896,"children":898},{"className":897},[],[899],{"type":47,"value":900},"block-8",{"type":41,"tag":277,"props":902,"children":903},{},[904],{"type":47,"value":905},"8 × block",{"type":41,"tag":277,"props":907,"children":908},{},[909],{"type":47,"value":910},"256px",{"type":41,"tag":250,"props":912,"children":913},{},[914,923,928],{"type":41,"tag":277,"props":915,"children":916},{},[917],{"type":41,"tag":106,"props":918,"children":920},{"className":919},[],[921],{"type":47,"value":922},"block-10",{"type":41,"tag":277,"props":924,"children":925},{},[926],{"type":47,"value":927},"10 × block",{"type":41,"tag":277,"props":929,"children":930},{},[931],{"type":47,"value":932},"320px",{"type":41,"tag":250,"props":934,"children":935},{},[936,945,950],{"type":41,"tag":277,"props":937,"children":938},{},[939],{"type":41,"tag":106,"props":940,"children":942},{"className":941},[],[943],{"type":47,"value":944},"block-12",{"type":41,"tag":277,"props":946,"children":947},{},[948],{"type":47,"value":949},"12 × block",{"type":41,"tag":277,"props":951,"children":952},{},[953],{"type":47,"value":954},"384px",{"type":41,"tag":250,"props":956,"children":957},{},[958,967,972],{"type":41,"tag":277,"props":959,"children":960},{},[961],{"type":41,"tag":106,"props":962,"children":964},{"className":963},[],[965],{"type":47,"value":966},"block-16",{"type":41,"tag":277,"props":968,"children":969},{},[970],{"type":47,"value":971},"16 × block",{"type":41,"tag":277,"props":973,"children":974},{},[975],{"type":47,"value":976},"512px",{"type":41,"tag":235,"props":978,"children":980},{"id":979},"border-radius-values",[981],{"type":47,"value":982},"Border Radius Values",{"type":41,"tag":242,"props":984,"children":985},{},[986,1005],{"type":41,"tag":246,"props":987,"children":988},{},[989],{"type":41,"tag":250,"props":990,"children":991},{},[992,997,1001],{"type":41,"tag":254,"props":993,"children":994},{},[995],{"type":47,"value":996},"Class",{"type":41,"tag":254,"props":998,"children":999},{},[1000],{"type":47,"value":263},{"type":41,"tag":254,"props":1002,"children":1003},{},[1004],{"type":47,"value":268},{"type":41,"tag":270,"props":1006,"children":1007},{},[1008,1028,1048,1068,1088,1108],{"type":41,"tag":250,"props":1009,"children":1010},{},[1011,1020,1024],{"type":41,"tag":277,"props":1012,"children":1013},{},[1014],{"type":41,"tag":106,"props":1015,"children":1017},{"className":1016},[],[1018],{"type":47,"value":1019},"rounded-tab-1",{"type":41,"tag":277,"props":1021,"children":1022},{},[1023],{"type":47,"value":334},{"type":41,"tag":277,"props":1025,"children":1026},{},[1027],{"type":47,"value":339},{"type":41,"tag":250,"props":1029,"children":1030},{},[1031,1040,1044],{"type":41,"tag":277,"props":1032,"children":1033},{},[1034],{"type":41,"tag":106,"props":1035,"children":1037},{"className":1036},[],[1038],{"type":47,"value":1039},"rounded-tab-2",{"type":41,"tag":277,"props":1041,"children":1042},{},[1043],{"type":47,"value":378},{"type":41,"tag":277,"props":1045,"children":1046},{},[1047],{"type":47,"value":383},{"type":41,"tag":250,"props":1049,"children":1050},{},[1051,1060,1064],{"type":41,"tag":277,"props":1052,"children":1053},{},[1054],{"type":41,"tag":106,"props":1055,"children":1057},{"className":1056},[],[1058],{"type":47,"value":1059},"rounded-tab-3",{"type":41,"tag":277,"props":1061,"children":1062},{},[1063],{"type":47,"value":422},{"type":41,"tag":277,"props":1065,"children":1066},{},[1067],{"type":47,"value":427},{"type":41,"tag":250,"props":1069,"children":1070},{},[1071,1080,1084],{"type":41,"tag":277,"props":1072,"children":1073},{},[1074],{"type":41,"tag":106,"props":1075,"children":1077},{"className":1076},[],[1078],{"type":47,"value":1079},"rounded-tab-4",{"type":41,"tag":277,"props":1081,"children":1082},{},[1083],{"type":47,"value":444},{"type":41,"tag":277,"props":1085,"children":1086},{},[1087],{"type":47,"value":449},{"type":41,"tag":250,"props":1089,"children":1090},{},[1091,1100,1104],{"type":41,"tag":277,"props":1092,"children":1093},{},[1094],{"type":41,"tag":106,"props":1095,"children":1097},{"className":1096},[],[1098],{"type":47,"value":1099},"rounded-block-0.5",{"type":41,"tag":277,"props":1101,"children":1102},{},[1103],{"type":47,"value":714},{"type":41,"tag":277,"props":1105,"children":1106},{},[1107],{"type":47,"value":449},{"type":41,"tag":250,"props":1109,"children":1110},{},[1111,1120,1124],{"type":41,"tag":277,"props":1112,"children":1113},{},[1114],{"type":41,"tag":106,"props":1115,"children":1117},{"className":1116},[],[1118],{"type":47,"value":1119},"rounded-block-1",{"type":41,"tag":277,"props":1121,"children":1122},{},[1123],{"type":47,"value":735},{"type":41,"tag":277,"props":1125,"children":1126},{},[1127],{"type":47,"value":1128},"32px (fully round)",{"type":41,"tag":235,"props":1130,"children":1132},{"id":1131},"supported-tailwind-utilities",[1133],{"type":47,"value":1134},"Supported Tailwind Utilities",{"type":41,"tag":57,"props":1136,"children":1137},{},[1138],{"type":47,"value":1139},"All standard Tailwind spacing utilities work with block\u002Ftab:",{"type":41,"tag":63,"props":1141,"children":1142},{},[1143,1181,1217,1246,1275,1304],{"type":41,"tag":67,"props":1144,"children":1145},{},[1146,1151,1153,1159,1161,1167,1168,1174,1175],{"type":41,"tag":71,"props":1147,"children":1148},{},[1149],{"type":47,"value":1150},"Padding",{"type":47,"value":1152},": ",{"type":41,"tag":106,"props":1154,"children":1156},{"className":1155},[],[1157],{"type":47,"value":1158},"p-tab-4",{"type":47,"value":1160},", ",{"type":41,"tag":106,"props":1162,"children":1164},{"className":1163},[],[1165],{"type":47,"value":1166},"px-tab-3",{"type":47,"value":1160},{"type":41,"tag":106,"props":1169,"children":1171},{"className":1170},[],[1172],{"type":47,"value":1173},"py-tab-2",{"type":47,"value":1160},{"type":41,"tag":106,"props":1176,"children":1178},{"className":1177},[],[1179],{"type":47,"value":1180},"p-block-1",{"type":41,"tag":67,"props":1182,"children":1183},{},[1184,1189,1190,1196,1197,1203,1204,1210,1211],{"type":41,"tag":71,"props":1185,"children":1186},{},[1187],{"type":47,"value":1188},"Margin",{"type":47,"value":1152},{"type":41,"tag":106,"props":1191,"children":1193},{"className":1192},[],[1194],{"type":47,"value":1195},"m-tab-4",{"type":47,"value":1160},{"type":41,"tag":106,"props":1198,"children":1200},{"className":1199},[],[1201],{"type":47,"value":1202},"mx-tab-3",{"type":47,"value":1160},{"type":41,"tag":106,"props":1205,"children":1207},{"className":1206},[],[1208],{"type":47,"value":1209},"my-tab-2",{"type":47,"value":1160},{"type":41,"tag":106,"props":1212,"children":1214},{"className":1213},[],[1215],{"type":47,"value":1216},"m-block-1",{"type":41,"tag":67,"props":1218,"children":1219},{},[1220,1225,1226,1232,1233,1239,1240],{"type":41,"tag":71,"props":1221,"children":1222},{},[1223],{"type":47,"value":1224},"Gap",{"type":47,"value":1152},{"type":41,"tag":106,"props":1227,"children":1229},{"className":1228},[],[1230],{"type":47,"value":1231},"gap-tab-4",{"type":47,"value":1160},{"type":41,"tag":106,"props":1234,"children":1236},{"className":1235},[],[1237],{"type":47,"value":1238},"gap-x-tab-3",{"type":47,"value":1160},{"type":41,"tag":106,"props":1241,"children":1243},{"className":1242},[],[1244],{"type":47,"value":1245},"gap-block-1",{"type":41,"tag":67,"props":1247,"children":1248},{},[1249,1254,1255,1261,1262,1268,1269],{"type":41,"tag":71,"props":1250,"children":1251},{},[1252],{"type":47,"value":1253},"Width\u002FHeight",{"type":47,"value":1152},{"type":41,"tag":106,"props":1256,"children":1258},{"className":1257},[],[1259],{"type":47,"value":1260},"w-block-2",{"type":47,"value":1160},{"type":41,"tag":106,"props":1263,"children":1265},{"className":1264},[],[1266],{"type":47,"value":1267},"h-block-1",{"type":47,"value":1160},{"type":41,"tag":106,"props":1270,"children":1272},{"className":1271},[],[1273],{"type":47,"value":1274},"size-block-1",{"type":41,"tag":67,"props":1276,"children":1277},{},[1278,1283,1284,1290,1291,1297,1298],{"type":41,"tag":71,"props":1279,"children":1280},{},[1281],{"type":47,"value":1282},"Inset",{"type":47,"value":1152},{"type":41,"tag":106,"props":1285,"children":1287},{"className":1286},[],[1288],{"type":47,"value":1289},"top-tab-2",{"type":47,"value":1160},{"type":41,"tag":106,"props":1292,"children":1294},{"className":1293},[],[1295],{"type":47,"value":1296},"left-tab-4",{"type":47,"value":1160},{"type":41,"tag":106,"props":1299,"children":1301},{"className":1300},[],[1302],{"type":47,"value":1303},"inset-block-1",{"type":41,"tag":67,"props":1305,"children":1306},{},[1307,1312,1313,1319,1320],{"type":41,"tag":71,"props":1308,"children":1309},{},[1310],{"type":47,"value":1311},"Space",{"type":47,"value":1152},{"type":41,"tag":106,"props":1314,"children":1316},{"className":1315},[],[1317],{"type":47,"value":1318},"space-x-tab-2",{"type":47,"value":1160},{"type":41,"tag":106,"props":1321,"children":1323},{"className":1322},[],[1324],{"type":47,"value":1325},"space-y-tab-4",{"type":41,"tag":112,"props":1327,"children":1328},{},[],{"type":41,"tag":50,"props":1330,"children":1332},{"id":1331},"quick-patterns",[1333],{"type":47,"value":1334},"Quick Patterns",{"type":41,"tag":235,"props":1336,"children":1338},{"id":1337},"button",[1339],{"type":47,"value":1340},"Button",{"type":41,"tag":99,"props":1342,"children":1346},{"className":1343,"code":1344,"language":1345,"meta":108,"style":108},"language-html shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003Cbutton class=\"h-block-1 px-tab-4 rounded-tab-2 bg-blue-500 text-white\">Click me\u003C\u002Fbutton>\n","html",[1347],{"type":41,"tag":106,"props":1348,"children":1349},{"__ignoreMap":108},[1350],{"type":41,"tag":131,"props":1351,"children":1352},{"class":133,"line":25},[1353,1358,1363,1369,1374,1378,1383,1387,1392,1398,1403,1407],{"type":41,"tag":131,"props":1354,"children":1355},{"style":182},[1356],{"type":47,"value":1357},"\u003C",{"type":41,"tag":131,"props":1359,"children":1361},{"style":1360},"--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178",[1362],{"type":47,"value":1337},{"type":41,"tag":131,"props":1364,"children":1366},{"style":1365},"--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA",[1367],{"type":47,"value":1368}," class",{"type":41,"tag":131,"props":1370,"children":1371},{"style":182},[1372],{"type":47,"value":1373},"=",{"type":41,"tag":131,"props":1375,"children":1376},{"style":182},[1377],{"type":47,"value":195},{"type":41,"tag":131,"props":1379,"children":1380},{"style":143},[1381],{"type":47,"value":1382},"h-block-1 px-tab-4 rounded-tab-2 bg-blue-500 text-white",{"type":41,"tag":131,"props":1384,"children":1385},{"style":182},[1386],{"type":47,"value":195},{"type":41,"tag":131,"props":1388,"children":1389},{"style":182},[1390],{"type":47,"value":1391},">",{"type":41,"tag":131,"props":1393,"children":1395},{"style":1394},"--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8",[1396],{"type":47,"value":1397},"Click me",{"type":41,"tag":131,"props":1399,"children":1400},{"style":182},[1401],{"type":47,"value":1402},"\u003C\u002F",{"type":41,"tag":131,"props":1404,"children":1405},{"style":1360},[1406],{"type":47,"value":1337},{"type":41,"tag":131,"props":1408,"children":1409},{"style":182},[1410],{"type":47,"value":1411},">\n",{"type":41,"tag":235,"props":1413,"children":1415},{"id":1414},"small-button",[1416],{"type":47,"value":1417},"Small Button",{"type":41,"tag":99,"props":1419,"children":1421},{"className":1343,"code":1420,"language":1345,"meta":108,"style":108},"\u003Cbutton class=\"h-tab-6 px-tab-3 rounded-tab-1.5 text-sm\">Small\u003C\u002Fbutton>\n",[1422],{"type":41,"tag":106,"props":1423,"children":1424},{"__ignoreMap":108},[1425],{"type":41,"tag":131,"props":1426,"children":1427},{"class":133,"line":25},[1428,1432,1436,1440,1444,1448,1453,1457,1461,1466,1470,1474],{"type":41,"tag":131,"props":1429,"children":1430},{"style":182},[1431],{"type":47,"value":1357},{"type":41,"tag":131,"props":1433,"children":1434},{"style":1360},[1435],{"type":47,"value":1337},{"type":41,"tag":131,"props":1437,"children":1438},{"style":1365},[1439],{"type":47,"value":1368},{"type":41,"tag":131,"props":1441,"children":1442},{"style":182},[1443],{"type":47,"value":1373},{"type":41,"tag":131,"props":1445,"children":1446},{"style":182},[1447],{"type":47,"value":195},{"type":41,"tag":131,"props":1449,"children":1450},{"style":143},[1451],{"type":47,"value":1452},"h-tab-6 px-tab-3 rounded-tab-1.5 text-sm",{"type":41,"tag":131,"props":1454,"children":1455},{"style":182},[1456],{"type":47,"value":195},{"type":41,"tag":131,"props":1458,"children":1459},{"style":182},[1460],{"type":47,"value":1391},{"type":41,"tag":131,"props":1462,"children":1463},{"style":1394},[1464],{"type":47,"value":1465},"Small",{"type":41,"tag":131,"props":1467,"children":1468},{"style":182},[1469],{"type":47,"value":1402},{"type":41,"tag":131,"props":1471,"children":1472},{"style":1360},[1473],{"type":47,"value":1337},{"type":41,"tag":131,"props":1475,"children":1476},{"style":182},[1477],{"type":47,"value":1411},{"type":41,"tag":235,"props":1479,"children":1481},{"id":1480},"icon-button",[1482],{"type":47,"value":1483},"Icon Button",{"type":41,"tag":99,"props":1485,"children":1487},{"className":1343,"code":1486,"language":1345,"meta":108,"style":108},"\u003Cbutton class=\"size-block-1 flex items-center justify-center rounded-tab-2\">\n  \u003Csvg class=\"w-tab-4 h-tab-4\" \u002F>\n\u003C\u002Fbutton>\n",[1488],{"type":41,"tag":106,"props":1489,"children":1490},{"__ignoreMap":108},[1491,1527,1570],{"type":41,"tag":131,"props":1492,"children":1493},{"class":133,"line":25},[1494,1498,1502,1506,1510,1514,1519,1523],{"type":41,"tag":131,"props":1495,"children":1496},{"style":182},[1497],{"type":47,"value":1357},{"type":41,"tag":131,"props":1499,"children":1500},{"style":1360},[1501],{"type":47,"value":1337},{"type":41,"tag":131,"props":1503,"children":1504},{"style":1365},[1505],{"type":47,"value":1368},{"type":41,"tag":131,"props":1507,"children":1508},{"style":182},[1509],{"type":47,"value":1373},{"type":41,"tag":131,"props":1511,"children":1512},{"style":182},[1513],{"type":47,"value":195},{"type":41,"tag":131,"props":1515,"children":1516},{"style":143},[1517],{"type":47,"value":1518},"size-block-1 flex items-center justify-center rounded-tab-2",{"type":41,"tag":131,"props":1520,"children":1521},{"style":182},[1522],{"type":47,"value":195},{"type":41,"tag":131,"props":1524,"children":1525},{"style":182},[1526],{"type":47,"value":1411},{"type":41,"tag":131,"props":1528,"children":1529},{"class":133,"line":172},[1530,1535,1540,1544,1548,1552,1557,1561,1566],{"type":41,"tag":131,"props":1531,"children":1532},{"style":182},[1533],{"type":47,"value":1534},"  \u003C",{"type":41,"tag":131,"props":1536,"children":1537},{"style":1360},[1538],{"type":47,"value":1539},"svg",{"type":41,"tag":131,"props":1541,"children":1542},{"style":1365},[1543],{"type":47,"value":1368},{"type":41,"tag":131,"props":1545,"children":1546},{"style":182},[1547],{"type":47,"value":1373},{"type":41,"tag":131,"props":1549,"children":1550},{"style":182},[1551],{"type":47,"value":195},{"type":41,"tag":131,"props":1553,"children":1554},{"style":143},[1555],{"type":47,"value":1556},"w-tab-4 h-tab-4",{"type":41,"tag":131,"props":1558,"children":1559},{"style":182},[1560],{"type":47,"value":195},{"type":41,"tag":131,"props":1562,"children":1563},{"style":1394},[1564],{"type":47,"value":1565}," \u002F",{"type":41,"tag":131,"props":1567,"children":1568},{"style":182},[1569],{"type":47,"value":1411},{"type":41,"tag":131,"props":1571,"children":1572},{"class":133,"line":203},[1573,1577,1581],{"type":41,"tag":131,"props":1574,"children":1575},{"style":182},[1576],{"type":47,"value":1402},{"type":41,"tag":131,"props":1578,"children":1579},{"style":1360},[1580],{"type":47,"value":1337},{"type":41,"tag":131,"props":1582,"children":1583},{"style":182},[1584],{"type":47,"value":1411},{"type":41,"tag":235,"props":1586,"children":1588},{"id":1587},"input-field",[1589],{"type":47,"value":1590},"Input Field",{"type":41,"tag":99,"props":1592,"children":1594},{"className":1343,"code":1593,"language":1345,"meta":108,"style":108},"\u003Cinput type=\"text\" class=\"h-block-1 px-tab-3 rounded-tab-2 border border-gray-300\" \u002F>\n",[1595],{"type":41,"tag":106,"props":1596,"children":1597},{"__ignoreMap":108},[1598],{"type":41,"tag":131,"props":1599,"children":1600},{"class":133,"line":25},[1601,1605,1610,1615,1619,1623,1627,1631,1635,1639,1643,1648,1652],{"type":41,"tag":131,"props":1602,"children":1603},{"style":182},[1604],{"type":47,"value":1357},{"type":41,"tag":131,"props":1606,"children":1607},{"style":1360},[1608],{"type":47,"value":1609},"input",{"type":41,"tag":131,"props":1611,"children":1612},{"style":1365},[1613],{"type":47,"value":1614}," type",{"type":41,"tag":131,"props":1616,"children":1617},{"style":182},[1618],{"type":47,"value":1373},{"type":41,"tag":131,"props":1620,"children":1621},{"style":182},[1622],{"type":47,"value":195},{"type":41,"tag":131,"props":1624,"children":1625},{"style":143},[1626],{"type":47,"value":47},{"type":41,"tag":131,"props":1628,"children":1629},{"style":182},[1630],{"type":47,"value":195},{"type":41,"tag":131,"props":1632,"children":1633},{"style":1365},[1634],{"type":47,"value":1368},{"type":41,"tag":131,"props":1636,"children":1637},{"style":182},[1638],{"type":47,"value":1373},{"type":41,"tag":131,"props":1640,"children":1641},{"style":182},[1642],{"type":47,"value":195},{"type":41,"tag":131,"props":1644,"children":1645},{"style":143},[1646],{"type":47,"value":1647},"h-block-1 px-tab-3 rounded-tab-2 border border-gray-300",{"type":41,"tag":131,"props":1649,"children":1650},{"style":182},[1651],{"type":47,"value":195},{"type":41,"tag":131,"props":1653,"children":1654},{"style":182},[1655],{"type":47,"value":1656}," \u002F>\n",{"type":41,"tag":235,"props":1658,"children":1660},{"id":1659},"card",[1661],{"type":47,"value":1662},"Card",{"type":41,"tag":99,"props":1664,"children":1666},{"className":1343,"code":1665,"language":1345,"meta":108,"style":108},"\u003Cdiv class=\"p-tab-4 rounded-block-0.5 bg-white shadow-sm border\">\n  \u003Ch3 class=\"text-lg font-semibold\">Title\u003C\u002Fh3>\n  \u003Cp class=\"mt-tab-2 text-gray-600\">Description\u003C\u002Fp>\n\u003C\u002Fdiv>\n",[1667],{"type":41,"tag":106,"props":1668,"children":1669},{"__ignoreMap":108},[1670,1707,1760,1813],{"type":41,"tag":131,"props":1671,"children":1672},{"class":133,"line":25},[1673,1677,1682,1686,1690,1694,1699,1703],{"type":41,"tag":131,"props":1674,"children":1675},{"style":182},[1676],{"type":47,"value":1357},{"type":41,"tag":131,"props":1678,"children":1679},{"style":1360},[1680],{"type":47,"value":1681},"div",{"type":41,"tag":131,"props":1683,"children":1684},{"style":1365},[1685],{"type":47,"value":1368},{"type":41,"tag":131,"props":1687,"children":1688},{"style":182},[1689],{"type":47,"value":1373},{"type":41,"tag":131,"props":1691,"children":1692},{"style":182},[1693],{"type":47,"value":195},{"type":41,"tag":131,"props":1695,"children":1696},{"style":143},[1697],{"type":47,"value":1698},"p-tab-4 rounded-block-0.5 bg-white shadow-sm border",{"type":41,"tag":131,"props":1700,"children":1701},{"style":182},[1702],{"type":47,"value":195},{"type":41,"tag":131,"props":1704,"children":1705},{"style":182},[1706],{"type":47,"value":1411},{"type":41,"tag":131,"props":1708,"children":1709},{"class":133,"line":172},[1710,1714,1718,1722,1726,1730,1735,1739,1743,1748,1752,1756],{"type":41,"tag":131,"props":1711,"children":1712},{"style":182},[1713],{"type":47,"value":1534},{"type":41,"tag":131,"props":1715,"children":1716},{"style":1360},[1717],{"type":47,"value":235},{"type":41,"tag":131,"props":1719,"children":1720},{"style":1365},[1721],{"type":47,"value":1368},{"type":41,"tag":131,"props":1723,"children":1724},{"style":182},[1725],{"type":47,"value":1373},{"type":41,"tag":131,"props":1727,"children":1728},{"style":182},[1729],{"type":47,"value":195},{"type":41,"tag":131,"props":1731,"children":1732},{"style":143},[1733],{"type":47,"value":1734},"text-lg font-semibold",{"type":41,"tag":131,"props":1736,"children":1737},{"style":182},[1738],{"type":47,"value":195},{"type":41,"tag":131,"props":1740,"children":1741},{"style":182},[1742],{"type":47,"value":1391},{"type":41,"tag":131,"props":1744,"children":1745},{"style":1394},[1746],{"type":47,"value":1747},"Title",{"type":41,"tag":131,"props":1749,"children":1750},{"style":182},[1751],{"type":47,"value":1402},{"type":41,"tag":131,"props":1753,"children":1754},{"style":1360},[1755],{"type":47,"value":235},{"type":41,"tag":131,"props":1757,"children":1758},{"style":182},[1759],{"type":47,"value":1411},{"type":41,"tag":131,"props":1761,"children":1762},{"class":133,"line":203},[1763,1767,1771,1775,1779,1783,1788,1792,1796,1801,1805,1809],{"type":41,"tag":131,"props":1764,"children":1765},{"style":182},[1766],{"type":47,"value":1534},{"type":41,"tag":131,"props":1768,"children":1769},{"style":1360},[1770],{"type":47,"value":57},{"type":41,"tag":131,"props":1772,"children":1773},{"style":1365},[1774],{"type":47,"value":1368},{"type":41,"tag":131,"props":1776,"children":1777},{"style":182},[1778],{"type":47,"value":1373},{"type":41,"tag":131,"props":1780,"children":1781},{"style":182},[1782],{"type":47,"value":195},{"type":41,"tag":131,"props":1784,"children":1785},{"style":143},[1786],{"type":47,"value":1787},"mt-tab-2 text-gray-600",{"type":41,"tag":131,"props":1789,"children":1790},{"style":182},[1791],{"type":47,"value":195},{"type":41,"tag":131,"props":1793,"children":1794},{"style":182},[1795],{"type":47,"value":1391},{"type":41,"tag":131,"props":1797,"children":1798},{"style":1394},[1799],{"type":47,"value":1800},"Description",{"type":41,"tag":131,"props":1802,"children":1803},{"style":182},[1804],{"type":47,"value":1402},{"type":41,"tag":131,"props":1806,"children":1807},{"style":1360},[1808],{"type":47,"value":57},{"type":41,"tag":131,"props":1810,"children":1811},{"style":182},[1812],{"type":47,"value":1411},{"type":41,"tag":131,"props":1814,"children":1816},{"class":133,"line":1815},4,[1817,1821,1825],{"type":41,"tag":131,"props":1818,"children":1819},{"style":182},[1820],{"type":47,"value":1402},{"type":41,"tag":131,"props":1822,"children":1823},{"style":1360},[1824],{"type":47,"value":1681},{"type":41,"tag":131,"props":1826,"children":1827},{"style":182},[1828],{"type":47,"value":1411},{"type":41,"tag":112,"props":1830,"children":1831},{},[],{"type":41,"tag":50,"props":1833,"children":1835},{"id":1834},"best-practices",[1836],{"type":47,"value":1837},"Best Practices",{"type":41,"tag":235,"props":1839,"children":1841},{"id":1840},"component-height-guidelines",[1842],{"type":47,"value":1843},"Component Height Guidelines",{"type":41,"tag":242,"props":1845,"children":1846},{},[1847,1867],{"type":41,"tag":246,"props":1848,"children":1849},{},[1850],{"type":41,"tag":250,"props":1851,"children":1852},{},[1853,1858,1863],{"type":41,"tag":254,"props":1854,"children":1855},{},[1856],{"type":47,"value":1857},"Component",{"type":41,"tag":254,"props":1859,"children":1860},{},[1861],{"type":47,"value":1862},"Height",{"type":41,"tag":254,"props":1864,"children":1865},{},[1866],{"type":47,"value":996},{"type":41,"tag":270,"props":1868,"children":1869},{},[1870,1890,1911,1932,1952,1972,1992,2013,2033,2053],{"type":41,"tag":250,"props":1871,"children":1872},{},[1873,1878,1882],{"type":41,"tag":277,"props":1874,"children":1875},{},[1876],{"type":47,"value":1877},"Standard button",{"type":41,"tag":277,"props":1879,"children":1880},{},[1881],{"type":47,"value":515},{"type":41,"tag":277,"props":1883,"children":1884},{},[1885],{"type":41,"tag":106,"props":1886,"children":1888},{"className":1887},[],[1889],{"type":47,"value":1267},{"type":41,"tag":250,"props":1891,"children":1892},{},[1893,1898,1902],{"type":41,"tag":277,"props":1894,"children":1895},{},[1896],{"type":47,"value":1897},"Small button",{"type":41,"tag":277,"props":1899,"children":1900},{},[1901],{"type":47,"value":493},{"type":41,"tag":277,"props":1903,"children":1904},{},[1905],{"type":41,"tag":106,"props":1906,"children":1908},{"className":1907},[],[1909],{"type":47,"value":1910},"h-tab-6",{"type":41,"tag":250,"props":1912,"children":1913},{},[1914,1919,1923],{"type":41,"tag":277,"props":1915,"children":1916},{},[1917],{"type":47,"value":1918},"Large button",{"type":41,"tag":277,"props":1920,"children":1921},{},[1922],{"type":47,"value":559},{"type":41,"tag":277,"props":1924,"children":1925},{},[1926],{"type":41,"tag":106,"props":1927,"children":1929},{"className":1928},[],[1930],{"type":47,"value":1931},"h-block-1.5",{"type":41,"tag":250,"props":1933,"children":1934},{},[1935,1940,1944],{"type":41,"tag":277,"props":1936,"children":1937},{},[1938],{"type":47,"value":1939},"Input field",{"type":41,"tag":277,"props":1941,"children":1942},{},[1943],{"type":47,"value":515},{"type":41,"tag":277,"props":1945,"children":1946},{},[1947],{"type":41,"tag":106,"props":1948,"children":1950},{"className":1949},[],[1951],{"type":47,"value":1267},{"type":41,"tag":250,"props":1953,"children":1954},{},[1955,1960,1964],{"type":41,"tag":277,"props":1956,"children":1957},{},[1958],{"type":47,"value":1959},"Small input",{"type":41,"tag":277,"props":1961,"children":1962},{},[1963],{"type":47,"value":493},{"type":41,"tag":277,"props":1965,"children":1966},{},[1967],{"type":41,"tag":106,"props":1968,"children":1970},{"className":1969},[],[1971],{"type":47,"value":1910},{"type":41,"tag":250,"props":1973,"children":1974},{},[1975,1980,1984],{"type":41,"tag":277,"props":1976,"children":1977},{},[1978],{"type":47,"value":1979},"Toolbar",{"type":41,"tag":277,"props":1981,"children":1982},{},[1983],{"type":47,"value":559},{"type":41,"tag":277,"props":1985,"children":1986},{},[1987],{"type":41,"tag":106,"props":1988,"children":1990},{"className":1989},[],[1991],{"type":47,"value":1931},{"type":41,"tag":250,"props":1993,"children":1994},{},[1995,2000,2004],{"type":41,"tag":277,"props":1996,"children":1997},{},[1998],{"type":47,"value":1999},"Header (main)",{"type":41,"tag":277,"props":2001,"children":2002},{},[2003],{"type":47,"value":581},{"type":41,"tag":277,"props":2005,"children":2006},{},[2007],{"type":41,"tag":106,"props":2008,"children":2010},{"className":2009},[],[2011],{"type":47,"value":2012},"h-block-2",{"type":41,"tag":250,"props":2014,"children":2015},{},[2016,2021,2025],{"type":41,"tag":277,"props":2017,"children":2018},{},[2019],{"type":47,"value":2020},"Status bar",{"type":41,"tag":277,"props":2022,"children":2023},{},[2024],{"type":47,"value":493},{"type":41,"tag":277,"props":2026,"children":2027},{},[2028],{"type":41,"tag":106,"props":2029,"children":2031},{"className":2030},[],[2032],{"type":47,"value":1910},{"type":41,"tag":250,"props":2034,"children":2035},{},[2036,2041,2045],{"type":41,"tag":277,"props":2037,"children":2038},{},[2039],{"type":47,"value":2040},"Avatar (small)",{"type":41,"tag":277,"props":2042,"children":2043},{},[2044],{"type":47,"value":515},{"type":41,"tag":277,"props":2046,"children":2047},{},[2048],{"type":41,"tag":106,"props":2049,"children":2051},{"className":2050},[],[2052],{"type":47,"value":1274},{"type":41,"tag":250,"props":2054,"children":2055},{},[2056,2061,2065],{"type":41,"tag":277,"props":2057,"children":2058},{},[2059],{"type":47,"value":2060},"Avatar (large)",{"type":41,"tag":277,"props":2062,"children":2063},{},[2064],{"type":47,"value":559},{"type":41,"tag":277,"props":2066,"children":2067},{},[2068],{"type":41,"tag":106,"props":2069,"children":2071},{"className":2070},[],[2072],{"type":47,"value":2073},"size-block-1.5",{"type":41,"tag":235,"props":2075,"children":2077},{"id":2076},"horizontal-padding-standards",[2078],{"type":47,"value":2079},"Horizontal Padding Standards",{"type":41,"tag":242,"props":2081,"children":2082},{},[2083,2098],{"type":41,"tag":246,"props":2084,"children":2085},{},[2086],{"type":41,"tag":250,"props":2087,"children":2088},{},[2089,2094],{"type":41,"tag":254,"props":2090,"children":2091},{},[2092],{"type":47,"value":2093},"Container",{"type":41,"tag":254,"props":2095,"children":2096},{},[2097],{"type":47,"value":1150},{"type":41,"tag":270,"props":2099,"children":2100},{},[2101,2118,2133,2149,2165,2190],{"type":41,"tag":250,"props":2102,"children":2103},{},[2104,2109],{"type":41,"tag":277,"props":2105,"children":2106},{},[2107],{"type":47,"value":2108},"Page content",{"type":41,"tag":277,"props":2110,"children":2111},{},[2112],{"type":41,"tag":106,"props":2113,"children":2115},{"className":2114},[],[2116],{"type":47,"value":2117},"px-tab-6",{"type":41,"tag":250,"props":2119,"children":2120},{},[2121,2125],{"type":41,"tag":277,"props":2122,"children":2123},{},[2124],{"type":47,"value":1662},{"type":41,"tag":277,"props":2126,"children":2127},{},[2128],{"type":41,"tag":106,"props":2129,"children":2131},{"className":2130},[],[2132],{"type":47,"value":1158},{"type":41,"tag":250,"props":2134,"children":2135},{},[2136,2140],{"type":41,"tag":277,"props":2137,"children":2138},{},[2139],{"type":47,"value":1340},{"type":41,"tag":277,"props":2141,"children":2142},{},[2143],{"type":41,"tag":106,"props":2144,"children":2146},{"className":2145},[],[2147],{"type":47,"value":2148},"px-tab-4",{"type":41,"tag":250,"props":2150,"children":2151},{},[2152,2157],{"type":41,"tag":277,"props":2153,"children":2154},{},[2155],{"type":47,"value":2156},"Input",{"type":41,"tag":277,"props":2158,"children":2159},{},[2160],{"type":41,"tag":106,"props":2161,"children":2163},{"className":2162},[],[2164],{"type":47,"value":1166},{"type":41,"tag":250,"props":2166,"children":2167},{},[2168,2173],{"type":41,"tag":277,"props":2169,"children":2170},{},[2171],{"type":47,"value":2172},"Panel section",{"type":41,"tag":277,"props":2174,"children":2175},{},[2176,2182,2184],{"type":41,"tag":106,"props":2177,"children":2179},{"className":2178},[],[2180],{"type":47,"value":2181},"p-tab-2",{"type":47,"value":2183}," or ",{"type":41,"tag":106,"props":2185,"children":2187},{"className":2186},[],[2188],{"type":47,"value":2189},"p-tab-3",{"type":41,"tag":250,"props":2191,"children":2192},{},[2193,2198],{"type":41,"tag":277,"props":2194,"children":2195},{},[2196],{"type":47,"value":2197},"Header",{"type":41,"tag":277,"props":2199,"children":2200},{},[2201],{"type":41,"tag":106,"props":2202,"children":2204},{"className":2203},[],[2205],{"type":47,"value":2148},{"type":41,"tag":235,"props":2207,"children":2209},{"id":2208},"border-radius-guidelines",[2210],{"type":47,"value":2211},"Border Radius Guidelines",{"type":41,"tag":242,"props":2213,"children":2214},{},[2215,2231],{"type":41,"tag":246,"props":2216,"children":2217},{},[2218],{"type":41,"tag":250,"props":2219,"children":2220},{},[2221,2226],{"type":41,"tag":254,"props":2222,"children":2223},{},[2224],{"type":47,"value":2225},"Element",{"type":41,"tag":254,"props":2227,"children":2228},{},[2229],{"type":47,"value":2230},"Radius",{"type":41,"tag":270,"props":2232,"children":2233},{},[2234,2251,2268,2284,2302],{"type":41,"tag":250,"props":2235,"children":2236},{},[2237,2241],{"type":41,"tag":277,"props":2238,"children":2239},{},[2240],{"type":47,"value":1340},{"type":41,"tag":277,"props":2242,"children":2243},{},[2244,2249],{"type":41,"tag":106,"props":2245,"children":2247},{"className":2246},[],[2248],{"type":47,"value":1039},{"type":47,"value":2250}," (8px)",{"type":41,"tag":250,"props":2252,"children":2253},{},[2254,2258],{"type":41,"tag":277,"props":2255,"children":2256},{},[2257],{"type":47,"value":1662},{"type":41,"tag":277,"props":2259,"children":2260},{},[2261,2266],{"type":41,"tag":106,"props":2262,"children":2264},{"className":2263},[],[2265],{"type":47,"value":1099},{"type":47,"value":2267}," (16px)",{"type":41,"tag":250,"props":2269,"children":2270},{},[2271,2275],{"type":41,"tag":277,"props":2272,"children":2273},{},[2274],{"type":47,"value":2156},{"type":41,"tag":277,"props":2276,"children":2277},{},[2278,2283],{"type":41,"tag":106,"props":2279,"children":2281},{"className":2280},[],[2282],{"type":47,"value":1039},{"type":47,"value":2250},{"type":41,"tag":250,"props":2285,"children":2286},{},[2287,2292],{"type":41,"tag":277,"props":2288,"children":2289},{},[2290],{"type":47,"value":2291},"Small badge",{"type":41,"tag":277,"props":2293,"children":2294},{},[2295,2300],{"type":41,"tag":106,"props":2296,"children":2298},{"className":2297},[],[2299],{"type":47,"value":1019},{"type":47,"value":2301}," (4px)",{"type":41,"tag":250,"props":2303,"children":2304},{},[2305,2310],{"type":41,"tag":277,"props":2306,"children":2307},{},[2308],{"type":47,"value":2309},"Avatar",{"type":41,"tag":277,"props":2311,"children":2312},{},[2313],{"type":41,"tag":106,"props":2314,"children":2316},{"className":2315},[],[2317],{"type":47,"value":2318},"rounded-full",{"type":41,"tag":235,"props":2320,"children":2322},{"id":2321},"ui-density-patterns",[2323],{"type":47,"value":2324},"UI Density Patterns",{"type":41,"tag":57,"props":2326,"children":2327},{},[2328,2333],{"type":41,"tag":71,"props":2329,"children":2330},{},[2331],{"type":47,"value":2332},"Compact UI",{"type":47,"value":2334}," (Code editors, IDEs, tools):",{"type":41,"tag":63,"props":2336,"children":2337},{},[2338,2350,2369,2385],{"type":41,"tag":67,"props":2339,"children":2340},{},[2341,2343,2348],{"type":47,"value":2342},"Toolbar: ",{"type":41,"tag":106,"props":2344,"children":2346},{"className":2345},[],[2347],{"type":47,"value":1267},{"type":47,"value":2349}," (32px)",{"type":41,"tag":67,"props":2351,"children":2352},{},[2353,2355,2361,2362,2367],{"type":47,"value":2354},"List items: ",{"type":41,"tag":106,"props":2356,"children":2358},{"className":2357},[],[2359],{"type":47,"value":2360},"h-tab-5",{"type":47,"value":2183},{"type":41,"tag":106,"props":2363,"children":2365},{"className":2364},[],[2366],{"type":47,"value":1910},{"type":47,"value":2368}," (20-24px)",{"type":41,"tag":67,"props":2370,"children":2371},{},[2372,2374,2379,2380],{"type":47,"value":2373},"Padding: ",{"type":41,"tag":106,"props":2375,"children":2377},{"className":2376},[],[2378],{"type":47,"value":2181},{"type":47,"value":1160},{"type":41,"tag":106,"props":2381,"children":2383},{"className":2382},[],[2384],{"type":47,"value":1166},{"type":41,"tag":67,"props":2386,"children":2387},{},[2388,2390,2396,2397],{"type":47,"value":2389},"Gaps: ",{"type":41,"tag":106,"props":2391,"children":2393},{"className":2392},[],[2394],{"type":47,"value":2395},"gap-tab-1",{"type":47,"value":1160},{"type":41,"tag":106,"props":2398,"children":2400},{"className":2399},[],[2401],{"type":47,"value":2402},"gap-tab-2",{"type":41,"tag":57,"props":2404,"children":2405},{},[2406,2411],{"type":41,"tag":71,"props":2407,"children":2408},{},[2409],{"type":47,"value":2410},"Normal UI",{"type":47,"value":2412}," (Dashboards, apps):",{"type":41,"tag":63,"props":2414,"children":2415},{},[2416,2428,2439,2456],{"type":41,"tag":67,"props":2417,"children":2418},{},[2419,2421,2426],{"type":47,"value":2420},"Header: ",{"type":41,"tag":106,"props":2422,"children":2424},{"className":2423},[],[2425],{"type":47,"value":2012},{"type":47,"value":2427}," (64px)",{"type":41,"tag":67,"props":2429,"children":2430},{},[2431,2433,2438],{"type":47,"value":2432},"Buttons: ",{"type":41,"tag":106,"props":2434,"children":2436},{"className":2435},[],[2437],{"type":47,"value":1267},{"type":47,"value":2349},{"type":41,"tag":67,"props":2440,"children":2441},{},[2442,2444,2449,2450],{"type":47,"value":2443},"Cards: ",{"type":41,"tag":106,"props":2445,"children":2447},{"className":2446},[],[2448],{"type":47,"value":1158},{"type":47,"value":2183},{"type":41,"tag":106,"props":2451,"children":2453},{"className":2452},[],[2454],{"type":47,"value":2455},"p-tab-6",{"type":41,"tag":67,"props":2457,"children":2458},{},[2459,2460,2465,2466],{"type":47,"value":2389},{"type":41,"tag":106,"props":2461,"children":2463},{"className":2462},[],[2464],{"type":47,"value":1231},{"type":47,"value":1160},{"type":41,"tag":106,"props":2467,"children":2469},{"className":2468},[],[2470],{"type":47,"value":2471},"gap-tab-6",{"type":41,"tag":57,"props":2473,"children":2474},{},[2475,2480],{"type":41,"tag":71,"props":2476,"children":2477},{},[2478],{"type":47,"value":2479},"Spacious UI",{"type":47,"value":2481}," (Marketing, content):",{"type":41,"tag":63,"props":2483,"children":2484},{},[2485,2503,2520],{"type":41,"tag":67,"props":2486,"children":2487},{},[2488,2490,2496,2497],{"type":47,"value":2489},"Headers: ",{"type":41,"tag":106,"props":2491,"children":2493},{"className":2492},[],[2494],{"type":47,"value":2495},"h-block-2.5",{"type":47,"value":2183},{"type":41,"tag":106,"props":2498,"children":2500},{"className":2499},[],[2501],{"type":47,"value":2502},"h-block-3",{"type":41,"tag":67,"props":2504,"children":2505},{},[2506,2507,2513,2514],{"type":47,"value":2443},{"type":41,"tag":106,"props":2508,"children":2510},{"className":2509},[],[2511],{"type":47,"value":2512},"p-tab-8",{"type":47,"value":1160},{"type":41,"tag":106,"props":2515,"children":2517},{"className":2516},[],[2518],{"type":47,"value":2519},"p-tab-12",{"type":41,"tag":67,"props":2521,"children":2522},{},[2523,2524,2530,2531],{"type":47,"value":2389},{"type":41,"tag":106,"props":2525,"children":2527},{"className":2526},[],[2528],{"type":47,"value":2529},"gap-tab-8",{"type":47,"value":1160},{"type":41,"tag":106,"props":2532,"children":2534},{"className":2533},[],[2535],{"type":47,"value":2536},"gap-tab-12",{"type":41,"tag":112,"props":2538,"children":2539},{},[],{"type":41,"tag":50,"props":2541,"children":2543},{"id":2542},"combining-with-standard-tailwind",[2544],{"type":47,"value":2545},"Combining with Standard Tailwind",{"type":41,"tag":57,"props":2547,"children":2548},{},[2549,2551,2556],{"type":47,"value":2550},"TW-Blocks focuses on ",{"type":41,"tag":71,"props":2552,"children":2553},{},[2554],{"type":47,"value":2555},"spacing and sizing",{"type":47,"value":2557},". Use standard Tailwind for everything else:",{"type":41,"tag":235,"props":2559,"children":2561},{"id":2560},"use-standard-tailwind-for",[2562],{"type":47,"value":2563},"✅ Use Standard Tailwind For:",{"type":41,"tag":63,"props":2565,"children":2566},{},[2567,2592,2610,2635,2653],{"type":41,"tag":67,"props":2568,"children":2569},{},[2570,2572,2578,2579,2585,2586],{"type":47,"value":2571},"Colors: ",{"type":41,"tag":106,"props":2573,"children":2575},{"className":2574},[],[2576],{"type":47,"value":2577},"bg-blue-500",{"type":47,"value":1160},{"type":41,"tag":106,"props":2580,"children":2582},{"className":2581},[],[2583],{"type":47,"value":2584},"text-gray-700",{"type":47,"value":1160},{"type":41,"tag":106,"props":2587,"children":2589},{"className":2588},[],[2590],{"type":47,"value":2591},"border-gray-200",{"type":41,"tag":67,"props":2593,"children":2594},{},[2595,2597,2603,2604],{"type":47,"value":2596},"Typography: ",{"type":41,"tag":106,"props":2598,"children":2600},{"className":2599},[],[2601],{"type":47,"value":2602},"text-sm",{"type":47,"value":1160},{"type":41,"tag":106,"props":2605,"children":2607},{"className":2606},[],[2608],{"type":47,"value":2609},"font-bold",{"type":41,"tag":67,"props":2611,"children":2612},{},[2613,2615,2621,2622,2628,2629],{"type":47,"value":2614},"Flexbox\u002FGrid: ",{"type":41,"tag":106,"props":2616,"children":2618},{"className":2617},[],[2619],{"type":47,"value":2620},"flex",{"type":47,"value":1160},{"type":41,"tag":106,"props":2623,"children":2625},{"className":2624},[],[2626],{"type":47,"value":2627},"grid",{"type":47,"value":1160},{"type":41,"tag":106,"props":2630,"children":2632},{"className":2631},[],[2633],{"type":47,"value":2634},"items-center",{"type":41,"tag":67,"props":2636,"children":2637},{},[2638,2640,2646,2647],{"type":47,"value":2639},"Borders: ",{"type":41,"tag":106,"props":2641,"children":2643},{"className":2642},[],[2644],{"type":47,"value":2645},"border",{"type":47,"value":1160},{"type":41,"tag":106,"props":2648,"children":2650},{"className":2649},[],[2651],{"type":47,"value":2652},"border-t",{"type":41,"tag":67,"props":2654,"children":2655},{},[2656,2658,2664,2665],{"type":47,"value":2657},"Effects: ",{"type":41,"tag":106,"props":2659,"children":2661},{"className":2660},[],[2662],{"type":47,"value":2663},"shadow-md",{"type":47,"value":1160},{"type":41,"tag":106,"props":2666,"children":2668},{"className":2667},[],[2669],{"type":47,"value":2670},"hover:bg-gray-100",{"type":41,"tag":235,"props":2672,"children":2674},{"id":2673},"avoid-standard-tailwind-for",[2675],{"type":47,"value":2676},"❌ Avoid Standard Tailwind For:",{"type":41,"tag":63,"props":2678,"children":2679},{},[2680,2698,2715],{"type":41,"tag":67,"props":2681,"children":2682},{},[2683,2685,2690,2692],{"type":47,"value":2684},"Spacing: Use ",{"type":41,"tag":106,"props":2686,"children":2688},{"className":2687},[],[2689],{"type":47,"value":1158},{"type":47,"value":2691}," not ",{"type":41,"tag":106,"props":2693,"children":2695},{"className":2694},[],[2696],{"type":47,"value":2697},"p-4",{"type":41,"tag":67,"props":2699,"children":2700},{},[2701,2703,2708,2709],{"type":47,"value":2702},"Component sizing: Use ",{"type":41,"tag":106,"props":2704,"children":2706},{"className":2705},[],[2707],{"type":47,"value":1267},{"type":47,"value":2691},{"type":41,"tag":106,"props":2710,"children":2712},{"className":2711},[],[2713],{"type":47,"value":2714},"h-8",{"type":41,"tag":67,"props":2716,"children":2717},{},[2718,2720,2725,2726],{"type":47,"value":2719},"Block-aligned radius: Use ",{"type":41,"tag":106,"props":2721,"children":2723},{"className":2722},[],[2724],{"type":47,"value":1039},{"type":47,"value":2691},{"type":41,"tag":106,"props":2727,"children":2729},{"className":2728},[],[2730],{"type":47,"value":2731},"rounded-md",{"type":41,"tag":112,"props":2733,"children":2734},{},[],{"type":41,"tag":50,"props":2736,"children":2738},{"id":2737},"detailed-patterns",[2739],{"type":47,"value":2740},"Detailed Patterns",{"type":41,"tag":57,"props":2742,"children":2743},{},[2744,2746,2755],{"type":47,"value":2745},"For complete component patterns, see ",{"type":41,"tag":71,"props":2747,"children":2748},{},[2749],{"type":41,"tag":2750,"props":2751,"children":2753},"a",{"href":2752},"references\u002Fpatterns.md",[2754],{"type":47,"value":2752},{"type":47,"value":2756},":",{"type":41,"tag":63,"props":2758,"children":2759},{},[2760,2765,2770,2775,2780,2785,2790,2795,2800,2805],{"type":41,"tag":67,"props":2761,"children":2762},{},[2763],{"type":47,"value":2764},"Dashboard layouts (sidebar, stat cards)",{"type":41,"tag":67,"props":2766,"children":2767},{},[2768],{"type":47,"value":2769},"Toolbars & headers (dashboard, design tool, status bar)",{"type":41,"tag":67,"props":2771,"children":2772},{},[2773],{"type":47,"value":2774},"Panels & sidebars (tool palette, property panels, layers)",{"type":41,"tag":67,"props":2776,"children":2777},{},[2778],{"type":47,"value":2779},"Forms & inputs (buttons, inputs, cards)",{"type":41,"tag":67,"props":2781,"children":2782},{},[2783],{"type":47,"value":2784},"Tables & lists (dense lists, email lists)",{"type":41,"tag":67,"props":2786,"children":2787},{},[2788],{"type":47,"value":2789},"Status indicators (badges, progress bars, selected states)",{"type":41,"tag":67,"props":2791,"children":2792},{},[2793],{"type":47,"value":2794},"Chat & messages (chat bubbles, message lists)",{"type":41,"tag":67,"props":2796,"children":2797},{},[2798],{"type":47,"value":2799},"Charts & data viz (containers, recommended heights)",{"type":41,"tag":67,"props":2801,"children":2802},{},[2803],{"type":47,"value":2804},"Timeline & animation panels",{"type":41,"tag":67,"props":2806,"children":2807},{},[2808],{"type":47,"value":2809},"Code editor interface (full IDE layout)",{"type":41,"tag":57,"props":2811,"children":2812},{},[2813],{"type":41,"tag":71,"props":2814,"children":2815},{},[2816],{"type":47,"value":2817},"Read patterns.md when you need specific implementation examples.",{"type":41,"tag":112,"props":2819,"children":2820},{},[],{"type":41,"tag":50,"props":2822,"children":2824},{"id":2823},"common-mistakes-to-avoid",[2825],{"type":47,"value":2826},"Common Mistakes to Avoid",{"type":41,"tag":235,"props":2828,"children":2830},{"id":2829},"dont-mix-spacing-systems",[2831],{"type":47,"value":2832},"❌ Don't mix spacing systems",{"type":41,"tag":99,"props":2834,"children":2836},{"className":1343,"code":2835,"language":1345,"meta":108,"style":108},"\u003C!-- Bad -->\n\u003Cdiv class=\"p-4 mt-tab-2 mb-8\">\n\n\u003C!-- Good -->\n\u003Cdiv class=\"p-tab-4 mt-tab-2 mb-tab-8\">\n",[2837],{"type":41,"tag":106,"props":2838,"children":2839},{"__ignoreMap":108},[2840,2848,2884,2893,2901],{"type":41,"tag":131,"props":2841,"children":2842},{"class":133,"line":25},[2843],{"type":41,"tag":131,"props":2844,"children":2845},{"style":166},[2846],{"type":47,"value":2847},"\u003C!-- Bad -->\n",{"type":41,"tag":131,"props":2849,"children":2850},{"class":133,"line":172},[2851,2855,2859,2863,2867,2871,2876,2880],{"type":41,"tag":131,"props":2852,"children":2853},{"style":182},[2854],{"type":47,"value":1357},{"type":41,"tag":131,"props":2856,"children":2857},{"style":1360},[2858],{"type":47,"value":1681},{"type":41,"tag":131,"props":2860,"children":2861},{"style":1365},[2862],{"type":47,"value":1368},{"type":41,"tag":131,"props":2864,"children":2865},{"style":182},[2866],{"type":47,"value":1373},{"type":41,"tag":131,"props":2868,"children":2869},{"style":182},[2870],{"type":47,"value":195},{"type":41,"tag":131,"props":2872,"children":2873},{"style":143},[2874],{"type":47,"value":2875},"p-4 mt-tab-2 mb-8",{"type":41,"tag":131,"props":2877,"children":2878},{"style":182},[2879],{"type":47,"value":195},{"type":41,"tag":131,"props":2881,"children":2882},{"style":182},[2883],{"type":47,"value":1411},{"type":41,"tag":131,"props":2885,"children":2886},{"class":133,"line":203},[2887],{"type":41,"tag":131,"props":2888,"children":2890},{"emptyLinePlaceholder":2889},true,[2891],{"type":47,"value":2892},"\n",{"type":41,"tag":131,"props":2894,"children":2895},{"class":133,"line":1815},[2896],{"type":41,"tag":131,"props":2897,"children":2898},{"style":166},[2899],{"type":47,"value":2900},"\u003C!-- Good -->\n",{"type":41,"tag":131,"props":2902,"children":2904},{"class":133,"line":2903},5,[2905,2909,2913,2917,2921,2925,2930,2934],{"type":41,"tag":131,"props":2906,"children":2907},{"style":182},[2908],{"type":47,"value":1357},{"type":41,"tag":131,"props":2910,"children":2911},{"style":1360},[2912],{"type":47,"value":1681},{"type":41,"tag":131,"props":2914,"children":2915},{"style":1365},[2916],{"type":47,"value":1368},{"type":41,"tag":131,"props":2918,"children":2919},{"style":182},[2920],{"type":47,"value":1373},{"type":41,"tag":131,"props":2922,"children":2923},{"style":182},[2924],{"type":47,"value":195},{"type":41,"tag":131,"props":2926,"children":2927},{"style":143},[2928],{"type":47,"value":2929},"p-tab-4 mt-tab-2 mb-tab-8",{"type":41,"tag":131,"props":2931,"children":2932},{"style":182},[2933],{"type":47,"value":195},{"type":41,"tag":131,"props":2935,"children":2936},{"style":182},[2937],{"type":47,"value":1411},{"type":41,"tag":235,"props":2939,"children":2941},{"id":2940},"dont-use-blocks-for-small-padding",[2942],{"type":47,"value":2943},"❌ Don't use blocks for small padding",{"type":41,"tag":99,"props":2945,"children":2947},{"className":1343,"code":2946,"language":1345,"meta":108,"style":108},"\u003C!-- Bad -->\n\u003Cbutton class=\"p-block-1\">\n\n\u003C!-- Good -->\n\u003Cbutton class=\"px-tab-4 py-tab-2\">\n",[2948],{"type":41,"tag":106,"props":2949,"children":2950},{"__ignoreMap":108},[2951,2958,2993,3000,3007],{"type":41,"tag":131,"props":2952,"children":2953},{"class":133,"line":25},[2954],{"type":41,"tag":131,"props":2955,"children":2956},{"style":166},[2957],{"type":47,"value":2847},{"type":41,"tag":131,"props":2959,"children":2960},{"class":133,"line":172},[2961,2965,2969,2973,2977,2981,2985,2989],{"type":41,"tag":131,"props":2962,"children":2963},{"style":182},[2964],{"type":47,"value":1357},{"type":41,"tag":131,"props":2966,"children":2967},{"style":1360},[2968],{"type":47,"value":1337},{"type":41,"tag":131,"props":2970,"children":2971},{"style":1365},[2972],{"type":47,"value":1368},{"type":41,"tag":131,"props":2974,"children":2975},{"style":182},[2976],{"type":47,"value":1373},{"type":41,"tag":131,"props":2978,"children":2979},{"style":182},[2980],{"type":47,"value":195},{"type":41,"tag":131,"props":2982,"children":2983},{"style":143},[2984],{"type":47,"value":1180},{"type":41,"tag":131,"props":2986,"children":2987},{"style":182},[2988],{"type":47,"value":195},{"type":41,"tag":131,"props":2990,"children":2991},{"style":182},[2992],{"type":47,"value":1411},{"type":41,"tag":131,"props":2994,"children":2995},{"class":133,"line":203},[2996],{"type":41,"tag":131,"props":2997,"children":2998},{"emptyLinePlaceholder":2889},[2999],{"type":47,"value":2892},{"type":41,"tag":131,"props":3001,"children":3002},{"class":133,"line":1815},[3003],{"type":41,"tag":131,"props":3004,"children":3005},{"style":166},[3006],{"type":47,"value":2900},{"type":41,"tag":131,"props":3008,"children":3009},{"class":133,"line":2903},[3010,3014,3018,3022,3026,3030,3035,3039],{"type":41,"tag":131,"props":3011,"children":3012},{"style":182},[3013],{"type":47,"value":1357},{"type":41,"tag":131,"props":3015,"children":3016},{"style":1360},[3017],{"type":47,"value":1337},{"type":41,"tag":131,"props":3019,"children":3020},{"style":1365},[3021],{"type":47,"value":1368},{"type":41,"tag":131,"props":3023,"children":3024},{"style":182},[3025],{"type":47,"value":1373},{"type":41,"tag":131,"props":3027,"children":3028},{"style":182},[3029],{"type":47,"value":195},{"type":41,"tag":131,"props":3031,"children":3032},{"style":143},[3033],{"type":47,"value":3034},"px-tab-4 py-tab-2",{"type":41,"tag":131,"props":3036,"children":3037},{"style":182},[3038],{"type":47,"value":195},{"type":41,"tag":131,"props":3040,"children":3041},{"style":182},[3042],{"type":47,"value":1411},{"type":41,"tag":235,"props":3044,"children":3046},{"id":3045},"dont-use-tabs-for-component-sizing",[3047],{"type":47,"value":3048},"❌ Don't use tabs for component sizing",{"type":41,"tag":99,"props":3050,"children":3052},{"className":1343,"code":3051,"language":1345,"meta":108,"style":108},"\u003C!-- Bad -->\n\u003Cbutton class=\"h-tab-8\">\n\n\u003C!-- Good -->\n\u003Cbutton class=\"h-block-1\">\n",[3053],{"type":41,"tag":106,"props":3054,"children":3055},{"__ignoreMap":108},[3056,3063,3099,3106,3113],{"type":41,"tag":131,"props":3057,"children":3058},{"class":133,"line":25},[3059],{"type":41,"tag":131,"props":3060,"children":3061},{"style":166},[3062],{"type":47,"value":2847},{"type":41,"tag":131,"props":3064,"children":3065},{"class":133,"line":172},[3066,3070,3074,3078,3082,3086,3091,3095],{"type":41,"tag":131,"props":3067,"children":3068},{"style":182},[3069],{"type":47,"value":1357},{"type":41,"tag":131,"props":3071,"children":3072},{"style":1360},[3073],{"type":47,"value":1337},{"type":41,"tag":131,"props":3075,"children":3076},{"style":1365},[3077],{"type":47,"value":1368},{"type":41,"tag":131,"props":3079,"children":3080},{"style":182},[3081],{"type":47,"value":1373},{"type":41,"tag":131,"props":3083,"children":3084},{"style":182},[3085],{"type":47,"value":195},{"type":41,"tag":131,"props":3087,"children":3088},{"style":143},[3089],{"type":47,"value":3090},"h-tab-8",{"type":41,"tag":131,"props":3092,"children":3093},{"style":182},[3094],{"type":47,"value":195},{"type":41,"tag":131,"props":3096,"children":3097},{"style":182},[3098],{"type":47,"value":1411},{"type":41,"tag":131,"props":3100,"children":3101},{"class":133,"line":203},[3102],{"type":41,"tag":131,"props":3103,"children":3104},{"emptyLinePlaceholder":2889},[3105],{"type":47,"value":2892},{"type":41,"tag":131,"props":3107,"children":3108},{"class":133,"line":1815},[3109],{"type":41,"tag":131,"props":3110,"children":3111},{"style":166},[3112],{"type":47,"value":2900},{"type":41,"tag":131,"props":3114,"children":3115},{"class":133,"line":2903},[3116,3120,3124,3128,3132,3136,3140,3144],{"type":41,"tag":131,"props":3117,"children":3118},{"style":182},[3119],{"type":47,"value":1357},{"type":41,"tag":131,"props":3121,"children":3122},{"style":1360},[3123],{"type":47,"value":1337},{"type":41,"tag":131,"props":3125,"children":3126},{"style":1365},[3127],{"type":47,"value":1368},{"type":41,"tag":131,"props":3129,"children":3130},{"style":182},[3131],{"type":47,"value":1373},{"type":41,"tag":131,"props":3133,"children":3134},{"style":182},[3135],{"type":47,"value":195},{"type":41,"tag":131,"props":3137,"children":3138},{"style":143},[3139],{"type":47,"value":1267},{"type":41,"tag":131,"props":3141,"children":3142},{"style":182},[3143],{"type":47,"value":195},{"type":41,"tag":131,"props":3145,"children":3146},{"style":182},[3147],{"type":47,"value":1411},{"type":41,"tag":235,"props":3149,"children":3151},{"id":3150},"do-use-fractional-values",[3152],{"type":47,"value":3153},"✅ Do use fractional values",{"type":41,"tag":99,"props":3155,"children":3157},{"className":1343,"code":3156,"language":1345,"meta":108,"style":108},"\u003Cdiv class=\"p-tab-1.5\">  \u003C!-- 6px -->\n\u003Cdiv class=\"h-block-1.5\"> \u003C!-- 48px -->\n\u003Cdiv class=\"gap-tab-2.5\"> \u003C!-- 10px -->\n",[3158],{"type":41,"tag":106,"props":3159,"children":3160},{"__ignoreMap":108},[3161,3202,3242],{"type":41,"tag":131,"props":3162,"children":3163},{"class":133,"line":25},[3164,3168,3172,3176,3180,3184,3189,3193,3197],{"type":41,"tag":131,"props":3165,"children":3166},{"style":182},[3167],{"type":47,"value":1357},{"type":41,"tag":131,"props":3169,"children":3170},{"style":1360},[3171],{"type":47,"value":1681},{"type":41,"tag":131,"props":3173,"children":3174},{"style":1365},[3175],{"type":47,"value":1368},{"type":41,"tag":131,"props":3177,"children":3178},{"style":182},[3179],{"type":47,"value":1373},{"type":41,"tag":131,"props":3181,"children":3182},{"style":182},[3183],{"type":47,"value":195},{"type":41,"tag":131,"props":3185,"children":3186},{"style":143},[3187],{"type":47,"value":3188},"p-tab-1.5",{"type":41,"tag":131,"props":3190,"children":3191},{"style":182},[3192],{"type":47,"value":195},{"type":41,"tag":131,"props":3194,"children":3195},{"style":182},[3196],{"type":47,"value":1391},{"type":41,"tag":131,"props":3198,"children":3199},{"style":166},[3200],{"type":47,"value":3201},"  \u003C!-- 6px -->\n",{"type":41,"tag":131,"props":3203,"children":3204},{"class":133,"line":172},[3205,3209,3213,3217,3221,3225,3229,3233,3237],{"type":41,"tag":131,"props":3206,"children":3207},{"style":182},[3208],{"type":47,"value":1357},{"type":41,"tag":131,"props":3210,"children":3211},{"style":1360},[3212],{"type":47,"value":1681},{"type":41,"tag":131,"props":3214,"children":3215},{"style":1365},[3216],{"type":47,"value":1368},{"type":41,"tag":131,"props":3218,"children":3219},{"style":182},[3220],{"type":47,"value":1373},{"type":41,"tag":131,"props":3222,"children":3223},{"style":182},[3224],{"type":47,"value":195},{"type":41,"tag":131,"props":3226,"children":3227},{"style":143},[3228],{"type":47,"value":1931},{"type":41,"tag":131,"props":3230,"children":3231},{"style":182},[3232],{"type":47,"value":195},{"type":41,"tag":131,"props":3234,"children":3235},{"style":182},[3236],{"type":47,"value":1391},{"type":41,"tag":131,"props":3238,"children":3239},{"style":166},[3240],{"type":47,"value":3241}," \u003C!-- 48px -->\n",{"type":41,"tag":131,"props":3243,"children":3244},{"class":133,"line":203},[3245,3249,3253,3257,3261,3265,3270,3274,3278],{"type":41,"tag":131,"props":3246,"children":3247},{"style":182},[3248],{"type":47,"value":1357},{"type":41,"tag":131,"props":3250,"children":3251},{"style":1360},[3252],{"type":47,"value":1681},{"type":41,"tag":131,"props":3254,"children":3255},{"style":1365},[3256],{"type":47,"value":1368},{"type":41,"tag":131,"props":3258,"children":3259},{"style":182},[3260],{"type":47,"value":1373},{"type":41,"tag":131,"props":3262,"children":3263},{"style":182},[3264],{"type":47,"value":195},{"type":41,"tag":131,"props":3266,"children":3267},{"style":143},[3268],{"type":47,"value":3269},"gap-tab-2.5",{"type":41,"tag":131,"props":3271,"children":3272},{"style":182},[3273],{"type":47,"value":195},{"type":41,"tag":131,"props":3275,"children":3276},{"style":182},[3277],{"type":47,"value":1391},{"type":41,"tag":131,"props":3279,"children":3280},{"style":166},[3281],{"type":47,"value":3282}," \u003C!-- 10px -->\n",{"type":41,"tag":112,"props":3284,"children":3285},{},[],{"type":41,"tag":50,"props":3287,"children":3289},{"id":3288},"debugging-tips",[3290],{"type":47,"value":3291},"Debugging Tips",{"type":41,"tag":235,"props":3293,"children":3295},{"id":3294},"inspect-css-variables",[3296],{"type":47,"value":3297},"Inspect CSS Variables",{"type":41,"tag":99,"props":3299,"children":3303},{"className":3300,"code":3301,"language":3302,"meta":108,"style":108},"language-javascript shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","getComputedStyle(document.documentElement).getPropertyValue('--spacing-block') \u002F\u002F \"2rem\"\ngetComputedStyle(document.documentElement).getPropertyValue('--spacing-tab')   \u002F\u002F \"0.25rem\"\n","javascript",[3304],{"type":41,"tag":106,"props":3305,"children":3306},{"__ignoreMap":108},[3307,3369],{"type":41,"tag":131,"props":3308,"children":3309},{"class":133,"line":25},[3310,3316,3321,3326,3331,3335,3340,3345,3350,3355,3359,3364],{"type":41,"tag":131,"props":3311,"children":3313},{"style":3312},"--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF",[3314],{"type":47,"value":3315},"getComputedStyle",{"type":41,"tag":131,"props":3317,"children":3318},{"style":1394},[3319],{"type":47,"value":3320},"(document",{"type":41,"tag":131,"props":3322,"children":3323},{"style":182},[3324],{"type":47,"value":3325},".",{"type":41,"tag":131,"props":3327,"children":3328},{"style":1394},[3329],{"type":47,"value":3330},"documentElement)",{"type":41,"tag":131,"props":3332,"children":3333},{"style":182},[3334],{"type":47,"value":3325},{"type":41,"tag":131,"props":3336,"children":3337},{"style":3312},[3338],{"type":47,"value":3339},"getPropertyValue",{"type":41,"tag":131,"props":3341,"children":3342},{"style":1394},[3343],{"type":47,"value":3344},"(",{"type":41,"tag":131,"props":3346,"children":3347},{"style":182},[3348],{"type":47,"value":3349},"'",{"type":41,"tag":131,"props":3351,"children":3352},{"style":143},[3353],{"type":47,"value":3354},"--spacing-block",{"type":41,"tag":131,"props":3356,"children":3357},{"style":182},[3358],{"type":47,"value":3349},{"type":41,"tag":131,"props":3360,"children":3361},{"style":1394},[3362],{"type":47,"value":3363},") ",{"type":41,"tag":131,"props":3365,"children":3366},{"style":166},[3367],{"type":47,"value":3368},"\u002F\u002F \"2rem\"\n",{"type":41,"tag":131,"props":3370,"children":3371},{"class":133,"line":172},[3372,3376,3380,3384,3388,3392,3396,3400,3404,3409,3413,3418],{"type":41,"tag":131,"props":3373,"children":3374},{"style":3312},[3375],{"type":47,"value":3315},{"type":41,"tag":131,"props":3377,"children":3378},{"style":1394},[3379],{"type":47,"value":3320},{"type":41,"tag":131,"props":3381,"children":3382},{"style":182},[3383],{"type":47,"value":3325},{"type":41,"tag":131,"props":3385,"children":3386},{"style":1394},[3387],{"type":47,"value":3330},{"type":41,"tag":131,"props":3389,"children":3390},{"style":182},[3391],{"type":47,"value":3325},{"type":41,"tag":131,"props":3393,"children":3394},{"style":3312},[3395],{"type":47,"value":3339},{"type":41,"tag":131,"props":3397,"children":3398},{"style":1394},[3399],{"type":47,"value":3344},{"type":41,"tag":131,"props":3401,"children":3402},{"style":182},[3403],{"type":47,"value":3349},{"type":41,"tag":131,"props":3405,"children":3406},{"style":143},[3407],{"type":47,"value":3408},"--spacing-tab",{"type":41,"tag":131,"props":3410,"children":3411},{"style":182},[3412],{"type":47,"value":3349},{"type":41,"tag":131,"props":3414,"children":3415},{"style":1394},[3416],{"type":47,"value":3417},")   ",{"type":41,"tag":131,"props":3419,"children":3420},{"style":166},[3421],{"type":47,"value":3422},"\u002F\u002F \"0.25rem\"\n",{"type":41,"tag":235,"props":3424,"children":3426},{"id":3425},"test-with-visible-borders",[3427],{"type":47,"value":3428},"Test with Visible Borders",{"type":41,"tag":99,"props":3430,"children":3432},{"className":1343,"code":3431,"language":1345,"meta":108,"style":108},"\u003Cdiv class=\"p-tab-4 border-2 border-red-500\">\n  \u003Cdiv class=\"h-block-1 border-2 border-blue-500\">Button height\u003C\u002Fdiv>\n\u003C\u002Fdiv>\n",[3433],{"type":41,"tag":106,"props":3434,"children":3435},{"__ignoreMap":108},[3436,3472,3525],{"type":41,"tag":131,"props":3437,"children":3438},{"class":133,"line":25},[3439,3443,3447,3451,3455,3459,3464,3468],{"type":41,"tag":131,"props":3440,"children":3441},{"style":182},[3442],{"type":47,"value":1357},{"type":41,"tag":131,"props":3444,"children":3445},{"style":1360},[3446],{"type":47,"value":1681},{"type":41,"tag":131,"props":3448,"children":3449},{"style":1365},[3450],{"type":47,"value":1368},{"type":41,"tag":131,"props":3452,"children":3453},{"style":182},[3454],{"type":47,"value":1373},{"type":41,"tag":131,"props":3456,"children":3457},{"style":182},[3458],{"type":47,"value":195},{"type":41,"tag":131,"props":3460,"children":3461},{"style":143},[3462],{"type":47,"value":3463},"p-tab-4 border-2 border-red-500",{"type":41,"tag":131,"props":3465,"children":3466},{"style":182},[3467],{"type":47,"value":195},{"type":41,"tag":131,"props":3469,"children":3470},{"style":182},[3471],{"type":47,"value":1411},{"type":41,"tag":131,"props":3473,"children":3474},{"class":133,"line":172},[3475,3479,3483,3487,3491,3495,3500,3504,3508,3513,3517,3521],{"type":41,"tag":131,"props":3476,"children":3477},{"style":182},[3478],{"type":47,"value":1534},{"type":41,"tag":131,"props":3480,"children":3481},{"style":1360},[3482],{"type":47,"value":1681},{"type":41,"tag":131,"props":3484,"children":3485},{"style":1365},[3486],{"type":47,"value":1368},{"type":41,"tag":131,"props":3488,"children":3489},{"style":182},[3490],{"type":47,"value":1373},{"type":41,"tag":131,"props":3492,"children":3493},{"style":182},[3494],{"type":47,"value":195},{"type":41,"tag":131,"props":3496,"children":3497},{"style":143},[3498],{"type":47,"value":3499},"h-block-1 border-2 border-blue-500",{"type":41,"tag":131,"props":3501,"children":3502},{"style":182},[3503],{"type":47,"value":195},{"type":41,"tag":131,"props":3505,"children":3506},{"style":182},[3507],{"type":47,"value":1391},{"type":41,"tag":131,"props":3509,"children":3510},{"style":1394},[3511],{"type":47,"value":3512},"Button height",{"type":41,"tag":131,"props":3514,"children":3515},{"style":182},[3516],{"type":47,"value":1402},{"type":41,"tag":131,"props":3518,"children":3519},{"style":1360},[3520],{"type":47,"value":1681},{"type":41,"tag":131,"props":3522,"children":3523},{"style":182},[3524],{"type":47,"value":1411},{"type":41,"tag":131,"props":3526,"children":3527},{"class":133,"line":203},[3528,3532,3536],{"type":41,"tag":131,"props":3529,"children":3530},{"style":182},[3531],{"type":47,"value":1402},{"type":41,"tag":131,"props":3533,"children":3534},{"style":1360},[3535],{"type":47,"value":1681},{"type":41,"tag":131,"props":3537,"children":3538},{"style":182},[3539],{"type":47,"value":1411},{"type":41,"tag":112,"props":3541,"children":3542},{},[],{"type":41,"tag":50,"props":3544,"children":3546},{"id":3545},"quick-reference",[3547],{"type":47,"value":3548},"Quick Reference",{"type":41,"tag":99,"props":3550,"children":3553},{"className":3551,"code":3552,"language":47},[102],"┌─────────────────────────────────────────────────────────┐\n│ BLOCKS (Component Sizing)                                │\n│ block-1 = 32px | block-1.5 = 48px | block-2 = 64px      │\n├─────────────────────────────────────────────────────────┤\n│ TABS (Spacing\u002FPadding)                                   │\n│ tab-1 = 4px | tab-2 = 8px | tab-3 = 12px | tab-4 = 16px │\n├─────────────────────────────────────────────────────────┤\n│ HEIGHT: Button h-block-1 | Header h-block-2 | Toolbar h-block-1.5 │\n├─────────────────────────────────────────────────────────┤\n│ PADDING: Button px-tab-4 | Card p-tab-4 | Input px-tab-3 │\n├─────────────────────────────────────────────────────────┤\n│ RADIUS: Button rounded-tab-2 | Card rounded-block-0.5    │\n└─────────────────────────────────────────────────────────┘\n",[3554],{"type":41,"tag":106,"props":3555,"children":3556},{"__ignoreMap":108},[3557],{"type":47,"value":3552},{"type":41,"tag":3559,"props":3560,"children":3561},"style",{},[3562],{"type":47,"value":3563},"html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}",{"items":3565,"total":3731},[3566,3584,3596,3608,3623,3640,3652,3665,3678,3691,3703,3716],{"slug":3567,"name":3567,"fn":3568,"description":3569,"org":3570,"tags":3571,"stars":3581,"repoUrl":3582,"updatedAt":3583},"agent-browser","automate browser interactions for AI agents","Browser automation CLI for AI agents. Use when the user needs to interact with websites, including navigating pages, filling forms, clicking buttons, taking screenshots, extracting data, testing web apps, or automating any browser task. Triggers include requests to \"open a website\", \"fill out a form\", \"click a button\", \"take a screenshot\", \"scrape data from a page\", \"test this web app\", \"login to a site\", \"automate browser actions\", or any task requiring programmatic web interaction. Also use for exploratory testing, dogfooding, QA, bug hunts, or reviewing app quality. Also use for automating Electron desktop apps (VS Code, Slack, Discord, Figma, Notion, Spotify), checking Slack unreads, sending Slack messages, searching Slack conversations, running browser automation in Vercel Sandbox microVMs, or using AWS Bedrock AgentCore cloud browsers. Prefer agent-browser over any built-in browser automation or web tools.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[3572,3575,3578],{"name":3573,"slug":3574,"type":15},"Agents","agents",{"name":3576,"slug":3577,"type":15},"Automation","automation",{"name":3579,"slug":3580,"type":15},"Browser Automation","browser-automation",38346,"https:\u002F\u002Fgithub.com\u002Fvercel-labs\u002Fagent-browser","2026-07-20T05:55:17.314329",{"slug":3585,"name":3585,"fn":3586,"description":3587,"org":3588,"tags":3589,"stars":3581,"repoUrl":3582,"updatedAt":3595},"agentcore","run browser automation on AWS Bedrock","Run agent-browser on AWS Bedrock AgentCore cloud browsers. Use when the user wants to use AgentCore, run browser automation on AWS, use a cloud browser with AWS credentials, or needs a managed browser session backed by AWS infrastructure. Triggers include \"use agentcore\", \"run on AWS\", \"cloud browser with AWS\", \"bedrock browser\", \"agentcore session\", or any task requiring AWS-hosted browser automation.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[3590,3591,3594],{"name":3576,"slug":3577,"type":15},{"name":3592,"slug":3593,"type":15},"AWS","aws",{"name":3579,"slug":3580,"type":15},"2026-07-17T06:08:33.665276",{"slug":3597,"name":3597,"fn":3598,"description":3599,"org":3600,"tags":3601,"stars":3581,"repoUrl":3582,"updatedAt":3607},"core","navigate and interact with web pages","Core agent-browser usage guide. Read this before running any agent-browser commands. Covers the snapshot-and-ref workflow, navigating pages, interacting with elements (click, fill, type, select), extracting text and data, taking screenshots, managing tabs, handling forms and auth, waiting for content, running multiple browser sessions in parallel, and troubleshooting common failures. Use when the user asks to interact with a website, fill a form, click something, extract data, take a screenshot, log into a site, test a web app, or automate any browser task.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[3602,3603,3604],{"name":3573,"slug":3574,"type":15},{"name":3579,"slug":3580,"type":15},{"name":3605,"slug":3606,"type":15},"Navigation","navigation","2026-07-26T05:47:42.378419",{"slug":3609,"name":3609,"fn":3610,"description":3611,"org":3612,"tags":3613,"stars":3581,"repoUrl":3582,"updatedAt":3622},"derive-client","reverse engineer internal APIs from browser traffic","Reverse-engineer a website's internal API by recording browser traffic into a HAR file, then generate a standalone client or CLI that calls the endpoints directly, with no browser needed after the first recording. Use when asked to \"derive a client\", \"build a CLI for \u003Csite>\", \"reverse engineer this site's API\", \"record network requests\", \"turn this site into an API\", or when the same site will be automated repeatedly and direct HTTP calls would beat driving the browser every time.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[3614,3617,3618,3619],{"name":3615,"slug":3616,"type":15},"API Development","api-development",{"name":3576,"slug":3577,"type":15},{"name":3579,"slug":3580,"type":15},{"name":3620,"slug":3621,"type":15},"Web Scraping","web-scraping","2026-07-20T06:24:11.928835",{"slug":3624,"name":3624,"fn":3625,"description":3626,"org":3627,"tags":3628,"stars":3581,"repoUrl":3582,"updatedAt":3639},"dogfood","perform exploratory testing on web applications","Systematically explore and test a web application to find bugs, UX issues, and other problems. Use when asked to \"dogfood\", \"QA\", \"exploratory test\", \"find issues\", \"bug hunt\", \"test this app\u002Fsite\u002Fplatform\", or review the quality of a web application. Produces a structured report with full reproduction evidence -- step-by-step screenshots, repro videos, and detailed repro steps for every issue -- so findings can be handed directly to the responsible teams.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[3629,3630,3633,3636],{"name":3579,"slug":3580,"type":15},{"name":3631,"slug":3632,"type":15},"Debugging","debugging",{"name":3634,"slug":3635,"type":15},"QA","qa",{"name":3637,"slug":3638,"type":15},"Testing","testing","2026-07-17T06:07:41.421482",{"slug":3641,"name":3641,"fn":3642,"description":3643,"org":3644,"tags":3645,"stars":3581,"repoUrl":3582,"updatedAt":3651},"electron","automate Electron desktop applications","Automate Electron desktop apps (VS Code, Slack, Discord, Figma, Notion, Spotify, etc.) using agent-browser via Chrome DevTools Protocol. Use when the user needs to interact with an Electron app, automate a desktop app, connect to a running app, control a native app, or test an Electron application. Triggers include \"automate Slack app\", \"control VS Code\", \"interact with Discord app\", \"test this Electron app\", \"connect to desktop app\", or any task requiring automation of a native Electron application.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[3646,3647,3648],{"name":3573,"slug":3574,"type":15},{"name":3579,"slug":3580,"type":15},{"name":3649,"slug":3650,"type":15},"Desktop","desktop","2026-07-17T06:08:28.007783",{"slug":3653,"name":3653,"fn":3654,"description":3655,"org":3656,"tags":3657,"stars":3581,"repoUrl":3582,"updatedAt":3664},"slack","interact with Slack workspaces","Interact with Slack workspaces using browser automation. Use when the user needs to check unread channels, navigate Slack, send messages, extract data, find information, search conversations, or automate any Slack task. Triggers include \"check my Slack\", \"what channels have unreads\", \"send a message to\", \"search Slack for\", \"extract from Slack\", \"find who said\", or any task requiring programmatic Slack interaction.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[3658,3659,3662],{"name":3579,"slug":3580,"type":15},{"name":3660,"slug":3661,"type":15},"Messaging","messaging",{"name":3663,"slug":3653,"type":15},"Slack","2026-07-17T06:08:27.679015",{"slug":3666,"name":3666,"fn":3667,"description":3668,"org":3669,"tags":3670,"stars":3581,"repoUrl":3582,"updatedAt":3677},"vercel-sandbox","run browser automation in Vercel Sandbox","Run agent-browser + Chrome inside Vercel Sandbox microVMs for browser automation from any Vercel-deployed app. Use when the user needs browser automation in a Vercel app (Next.js, SvelteKit, Nuxt, Remix, Astro, etc.), wants to run headless Chrome without binary size limits, needs persistent browser sessions across commands, or wants ephemeral isolated browser environments. Triggers include \"Vercel Sandbox browser\", \"microVM Chrome\", \"agent-browser in sandbox\", \"browser automation on Vercel\", or any task requiring Chrome in a Vercel Sandbox.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[3671,3672,3673,3674],{"name":3576,"slug":3577,"type":15},{"name":3579,"slug":3580,"type":15},{"name":3637,"slug":3638,"type":15},{"name":3675,"slug":3676,"type":15},"Vercel","vercel","2026-07-17T06:08:28.349899",{"slug":3679,"name":3679,"fn":3680,"description":3681,"org":3682,"tags":3683,"stars":3688,"repoUrl":3689,"updatedAt":3690},"deploy-to-vercel","deploy applications to Vercel","Deploy applications and websites to Vercel. Use when the user requests deployment actions like \"deploy my app\", \"deploy and give me the link\", \"push this live\", or \"create a preview deployment\".",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[3684,3687],{"name":3685,"slug":3686,"type":15},"Deployment","deployment",{"name":3675,"slug":3676,"type":15},28993,"https:\u002F\u002Fgithub.com\u002Fvercel-labs\u002Fagent-skills","2026-07-17T06:08:41.18374",{"slug":3692,"name":3692,"fn":3693,"description":3694,"org":3695,"tags":3696,"stars":3688,"repoUrl":3689,"updatedAt":3702},"vercel-cli-with-tokens","manage Vercel projects via CLI","Deploy and manage projects on Vercel using token-based authentication. Use when working with Vercel CLI using access tokens rather than interactive login — e.g. \"deploy to vercel\", \"set up vercel\", \"add environment variables to vercel\".",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[3697,3700,3701],{"name":3698,"slug":3699,"type":15},"CLI","cli",{"name":3685,"slug":3686,"type":15},{"name":3675,"slug":3676,"type":15},"2026-07-17T06:08:41.84179",{"slug":3704,"name":3704,"fn":3705,"description":3706,"org":3707,"tags":3708,"stars":3688,"repoUrl":3689,"updatedAt":3715},"vercel-composition-patterns","implement scalable React composition patterns","React composition patterns that scale. Use when refactoring components with boolean prop proliferation, building flexible component libraries, or designing reusable APIs. Triggers on tasks involving compound components, render props, context providers, or component architecture. Includes React 19 API changes.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[3709,3710,3711,3714],{"name":1837,"slug":1834,"type":15},{"name":20,"slug":21,"type":15},{"name":3712,"slug":3713,"type":15},"React","react",{"name":17,"slug":18,"type":15},"2026-07-17T06:05:40.576913",{"slug":3717,"name":3717,"fn":3718,"description":3719,"org":3720,"tags":3721,"stars":3688,"repoUrl":3689,"updatedAt":3730},"vercel-optimize","optimize Vercel project performance and costs","Use for Vercel cost and performance optimization on deployed projects, especially Next.js, SvelteKit, Nuxt, and limited Astro apps. Collect Vercel metrics, usage, project config, and code scan results first; investigate only metric-backed candidates; produce ranked recommendations grounded in verified files and version-aware Vercel\u002Fframework docs. Trigger for Vercel bill reduction, slow or expensive routes, caching opportunities, Function Invocations, Build Minutes, Fast Data Transfer, Core Web Vitals, Bot Management, Fluid compute, or cost breakdown requests.",{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[3722,3725,3726,3729],{"name":3723,"slug":3724,"type":15},"Cost Optimization","cost-optimization",{"name":3685,"slug":3686,"type":15},{"name":3727,"slug":3728,"type":15},"Performance","performance",{"name":3675,"slug":3676,"type":15},"2026-07-17T06:04:08.327515",100,{"items":3733,"total":25},[3734],{"slug":4,"name":4,"fn":5,"description":6,"org":3735,"tags":3736,"stars":25,"repoUrl":26,"updatedAt":27},{"slug":8,"name":9,"logoUrl":10,"githubOrg":8},[3737,3738,3739,3740],{"name":23,"slug":24,"type":15},{"name":20,"slug":21,"type":15},{"name":13,"slug":14,"type":15},{"name":17,"slug":18,"type":15}]