@teseor/css 1.14.2 → 1.15.0

package/src/layout/main/main.docs.json

@@ -1,87 +0,0 @@
-{
-  "id": "main",
-  "type": "primitive",
-  "title": "Main",
-  "description": "Main content area that accounts for sidebar and topbar offsets in app layouts.",
-  "api": "main.api.json",
-  "sections": [
-    {
-      "title": "Default",
-      "description": "Offsets content for a start-side sidebar and optional topbar.",
-      "examples": [
-        {
-          "items": [
-            {
-              "tag": "div",
-              "style": { "position": "relative", "height": "var(--ui-row-4)" },
-              "children": [
-                {
-                  "tag": "main",
-                  "class": "ui-main",
-                  "style": {
-                    "background": "var(--ui-color-bg-muted)",
-                    "padding": "var(--ui-space-2)"
-                  },
-                  "children": [{ "tag": "p", "text": "Main content area" }]
-                }
-              ]
-            }
-          ],
-          "code": "<main class=\"ui-main\">Main content area</main>"
-        }
-      ]
-    },
-    {
-      "title": "Sidebar End",
-      "description": "Offsets content for an end-side sidebar instead of start.",
-      "examples": [
-        {
-          "items": [
-            {
-              "tag": "div",
-              "style": { "position": "relative", "height": "var(--ui-row-4)" },
-              "children": [
-                {
-                  "tag": "main",
-                  "class": "ui-main ui-main--sidebar-end",
-                  "style": {
-                    "background": "var(--ui-color-bg-muted)",
-                    "padding": "var(--ui-space-2)"
-                  },
-                  "children": [{ "tag": "p", "text": "Content with end sidebar" }]
-                }
-              ]
-            }
-          ],
-          "code": "<main class=\"ui-main ui-main--sidebar-end\">Content with end sidebar</main>"
-        }
-      ]
-    },
-    {
-      "title": "Full Width",
-      "description": "No sidebar offset. Use when there is no sidebar.",
-      "examples": [
-        {
-          "items": [
-            {
-              "tag": "div",
-              "style": { "position": "relative", "height": "var(--ui-row-4)" },
-              "children": [
-                {
-                  "tag": "main",
-                  "class": "ui-main ui-main--full",
-                  "style": {
-                    "background": "var(--ui-color-bg-muted)",
-                    "padding": "var(--ui-space-2)"
-                  },
-                  "children": [{ "tag": "p", "text": "Full width content" }]
-                }
-              ]
-            }
-          ],
-          "code": "<main class=\"ui-main ui-main--full\">Full width content</main>"
-        }
-      ]
-    }
-  ]
-}

package/src/layout/nav-rail/nav-rail.docs.json

@@ -1,76 +0,0 @@
-{
-  "id": "nav-rail",
-  "type": "primitive",
-  "title": "Nav Rail",
-  "description": "Narrow fixed vertical navigation rail for icon-based navigation with bottom actions.",
-  "api": "./nav-rail.api.json",
-  "sections": [
-    {
-      "title": "Default",
-      "description": "Fixed narrow rail with icon items and bottom actions.",
-      "examples": [
-        {
-          "items": [
-            {
-              "tag": "nav",
-              "class": "ui-nav-rail",
-              "style": "position: relative; block-size: 320px",
-              "children": [
-                {
-                  "tag": "div",
-                  "class": "ui-nav-rail__items",
-                  "children": [
-                    {
-                      "tag": "button",
-                      "class": "ui-button ui-button--ghost ui-button--icon",
-                      "text": "H"
-                    },
-                    {
-                      "tag": "button",
-                      "class": "ui-button ui-button--ghost ui-button--icon",
-                      "text": "S"
-                    },
-                    {
-                      "tag": "button",
-                      "class": "ui-button ui-button--ghost ui-button--icon",
-                      "text": "M"
-                    }
-                  ]
-                },
-                {
-                  "tag": "div",
-                  "class": "ui-nav-rail__actions",
-                  "children": [
-                    {
-                      "tag": "button",
-                      "class": "ui-button ui-button--ghost ui-button--icon",
-                      "text": "G"
-                    }
-                  ]
-                }
-              ]
-            }
-          ]
-        }
-      ]
-    },
-    {
-      "title": "End Position",
-      "description": "Rail on the end (right in LTR) side.",
-      "examples": [
-        {
-          "code": "<nav class=\"ui-nav-rail ui-nav-rail--end\">\n  <div class=\"ui-nav-rail__items\">\n    <!-- icon buttons -->\n  </div>\n  <div class=\"ui-nav-rail__actions\">\n    <!-- settings, profile -->\n  </div>\n</nav>"
-        }
-      ]
-    },
-    {
-      "title": "With Topbar",
-      "description": "Nav rail respects --topbar-height, offsetting below the topbar.",
-      "examples": [
-        {
-          "code": "<body class=\"ui-app-shell\" style=\"--topbar-height: var(--ui-row-3)\">\n  <header class=\"ui-topbar ui-topbar--fixed ui-topbar--bordered\">\n    <div class=\"ui-topbar__start\"><strong>App</strong></div>\n  </header>\n  <nav class=\"ui-nav-rail\">\n    <div class=\"ui-nav-rail__items\"><!-- icons --></div>\n  </nav>\n</body>"
-        }
-      ]
-    }
-  ]
-}

package/src/layout/page-header/page-header.docs.json

@@ -1,124 +0,0 @@
-{
-  "id": "page-header",
-  "type": "primitive",
-  "title": "Page Header",
-  "description": "Content area header with title, description, actions, and optional breadcrumb.",
-  "api": "./page-header.api.json",
-  "sections": [
-    {
-      "title": "Default",
-      "description": "Title with actions on the end side.",
-      "examples": [
-        {
-          "items": [
-            {
-              "tag": "header",
-              "class": "ui-page-header ui-page-header--bordered",
-              "children": [
-                {
-                  "tag": "div",
-                  "class": "ui-page-header__title",
-                  "children": [
-                    { "tag": "h1", "class": "ui-heading ui-heading--xl", "text": "Users" },
-                    { "tag": "p", "text": "Manage user accounts and permissions." }
-                  ]
-                },
-                {
-                  "tag": "div",
-                  "class": "ui-page-header__actions",
-                  "children": [
-                    { "tag": "button", "class": "ui-button ui-button--primary", "text": "Add user" }
-                  ]
-                }
-              ]
-            }
-          ]
-        }
-      ]
-    },
-    {
-      "title": "With Breadcrumb",
-      "description": "Breadcrumb spans the full width above the title row.",
-      "examples": [
-        {
-          "items": [
-            {
-              "tag": "header",
-              "class": "ui-page-header ui-page-header--bordered",
-              "children": [
-                {
-                  "tag": "nav",
-                  "class": "ui-page-header__breadcrumb",
-                  "children": [{ "tag": "span", "text": "Home / Settings / Users" }]
-                },
-                {
-                  "tag": "div",
-                  "class": "ui-page-header__title",
-                  "children": [
-                    { "tag": "h1", "class": "ui-heading ui-heading--xl", "text": "Users" }
-                  ]
-                },
-                {
-                  "tag": "div",
-                  "class": "ui-page-header__actions",
-                  "children": [{ "tag": "button", "class": "ui-button", "text": "Export" }]
-                }
-              ]
-            }
-          ]
-        }
-      ]
-    },
-    {
-      "title": "Bordered",
-      "description": "Bottom border via inset box-shadow.",
-      "examples": [
-        {
-          "items": [
-            {
-              "tag": "header",
-              "class": "ui-page-header ui-page-header--bordered",
-              "children": [
-                {
-                  "tag": "div",
-                  "class": "ui-page-header__title",
-                  "children": [
-                    { "tag": "h1", "class": "ui-heading ui-heading--xl", "text": "Dashboard" }
-                  ]
-                }
-              ]
-            }
-          ]
-        }
-      ]
-    },
-    {
-      "title": "Sticky",
-      "description": "Sticks to the top of the scroll container.",
-      "examples": [
-        {
-          "items": [
-            {
-              "tag": "header",
-              "class": "ui-page-header ui-page-header--sticky ui-page-header--bordered",
-              "children": [
-                {
-                  "tag": "div",
-                  "class": "ui-page-header__title",
-                  "children": [
-                    { "tag": "h1", "class": "ui-heading ui-heading--xl", "text": "Sticky Header" }
-                  ]
-                },
-                {
-                  "tag": "div",
-                  "class": "ui-page-header__actions",
-                  "children": [{ "tag": "button", "class": "ui-button", "text": "Save" }]
-                }
-              ]
-            }
-          ]
-        }
-      ]
-    }
-  ]
-}

package/src/layout/row/row.docs.json

@@ -1,237 +0,0 @@
-{
-  "id": "row",
-  "type": "primitive",
-  "title": "Row",
-  "description": "Horizontal layout with wrapping.",
-  "api": "row.api.json",
-  "sections": [
-    {
-      "title": "Basic",
-      "examples": [
-        {
-          "items": [
-            {
-              "tag": "div",
-              "class": "ui-row ui-row--md",
-              "children": [
-                {
-                  "tag": "div",
-                  "text": "Tag 1",
-                  "style": {
-                    "background": "var(--ui-color-bg-muted)",
-                    "padding": "var(--ui-space-2)"
-                  }
-                },
-                {
-                  "tag": "div",
-                  "text": "Tag 2",
-                  "style": {
-                    "background": "var(--ui-color-bg-muted)",
-                    "padding": "var(--ui-space-2)"
-                  }
-                },
-                {
-                  "tag": "div",
-                  "text": "Tag 3",
-                  "style": {
-                    "background": "var(--ui-color-bg-muted)",
-                    "padding": "var(--ui-space-2)"
-                  }
-                },
-                {
-                  "tag": "div",
-                  "text": "Tag 4",
-                  "style": {
-                    "background": "var(--ui-color-bg-muted)",
-                    "padding": "var(--ui-space-2)"
-                  }
-                }
-              ]
-            }
-          ]
-        }
-      ]
-    },
-    {
-      "title": "Sizes",
-      "examples": [
-        {
-          "items": [
-            {
-              "tag": "div",
-              "class": "ui-row ui-row--xs",
-              "children": [
-                {
-                  "tag": "div",
-                  "text": "xs",
-                  "style": {
-                    "background": "var(--ui-color-bg-muted)",
-                    "padding": "var(--ui-space-1)"
-                  }
-                },
-                {
-                  "tag": "div",
-                  "text": "xs",
-                  "style": {
-                    "background": "var(--ui-color-bg-muted)",
-                    "padding": "var(--ui-space-1)"
-                  }
-                },
-                {
-                  "tag": "div",
-                  "text": "xs",
-                  "style": {
-                    "background": "var(--ui-color-bg-muted)",
-                    "padding": "var(--ui-space-1)"
-                  }
-                }
-              ]
-            }
-          ]
-        },
-        {
-          "items": [
-            {
-              "tag": "div",
-              "class": "ui-row ui-row--lg",
-              "children": [
-                {
-                  "tag": "div",
-                  "text": "lg",
-                  "style": {
-                    "background": "var(--ui-color-bg-muted)",
-                    "padding": "var(--ui-space-1)"
-                  }
-                },
-                {
-                  "tag": "div",
-                  "text": "lg",
-                  "style": {
-                    "background": "var(--ui-color-bg-muted)",
-                    "padding": "var(--ui-space-1)"
-                  }
-                },
-                {
-                  "tag": "div",
-                  "text": "lg",
-                  "style": {
-                    "background": "var(--ui-color-bg-muted)",
-                    "padding": "var(--ui-space-1)"
-                  }
-                }
-              ]
-            }
-          ]
-        },
-        {
-          "items": [
-            {
-              "tag": "div",
-              "class": "ui-row ui-row--sm",
-              "children": [
-                {
-                  "tag": "div",
-                  "text": "sm",
-                  "style": {
-                    "background": "var(--ui-color-bg-muted)",
-                    "padding": "var(--ui-space-1)"
-                  }
-                },
-                {
-                  "tag": "div",
-                  "text": "sm",
-                  "style": {
-                    "background": "var(--ui-color-bg-muted)",
-                    "padding": "var(--ui-space-1)"
-                  }
-                },
-                {
-                  "tag": "div",
-                  "text": "sm",
-                  "style": {
-                    "background": "var(--ui-color-bg-muted)",
-                    "padding": "var(--ui-space-1)"
-                  }
-                }
-              ]
-            }
-          ]
-        }
-      ]
-    },
-    {
-      "title": "Alignment",
-      "examples": [
-        {
-          "items": [
-            {
-              "tag": "div",
-              "class": "ui-row ui-row--start",
-              "style": { "background": "var(--ui-color-bg-muted)" },
-              "children": [
-                {
-                  "tag": "div",
-                  "text": "Start",
-                  "style": { "background": "var(--ui-color-bg)", "padding": "var(--ui-space-2)" }
-                }
-              ]
-            }
-          ]
-        },
-        {
-          "items": [
-            {
-              "tag": "div",
-              "class": "ui-row ui-row--center",
-              "style": { "background": "var(--ui-color-bg-muted)" },
-              "children": [
-                {
-                  "tag": "div",
-                  "text": "Center",
-                  "style": { "background": "var(--ui-color-bg)", "padding": "var(--ui-space-2)" }
-                }
-              ]
-            }
-          ]
-        },
-        {
-          "items": [
-            {
-              "tag": "div",
-              "class": "ui-row ui-row--end",
-              "style": { "background": "var(--ui-color-bg-muted)" },
-              "children": [
-                {
-                  "tag": "div",
-                  "text": "End",
-                  "style": { "background": "var(--ui-color-bg)", "padding": "var(--ui-space-2)" }
-                }
-              ]
-            }
-          ]
-        },
-        {
-          "items": [
-            {
-              "tag": "div",
-              "class": "ui-row ui-row--between",
-              "style": { "background": "var(--ui-color-bg-muted)" },
-              "children": [
-                {
-                  "tag": "div",
-                  "text": "Between A",
-                  "style": { "background": "var(--ui-color-bg)", "padding": "var(--ui-space-2)" }
-                },
-                {
-                  "tag": "div",
-                  "text": "Between B",
-                  "style": { "background": "var(--ui-color-bg)", "padding": "var(--ui-space-2)" }
-                }
-              ]
-            }
-          ]
-        }
-      ]
-    }
-  ]
-}

package/src/layout/sidebar/sidebar.docs.json

@@ -1,63 +0,0 @@
-{
-  "id": "sidebar",
-  "type": "primitive",
-  "title": "Sidebar",
-  "description": "Fixed-position sidebar for app layouts with adjustable widths and positioning.",
-  "api": "./sidebar.api.json",
-  "sections": [
-    {
-      "title": "Basic",
-      "description": "Default sidebar positioned on the start side. Use inside an app-shell layout.",
-      "examples": [
-        {
-          "code": "<aside class=\"ui-sidebar\">\n  <p>Sidebar content</p>\n</aside>"
-        }
-      ]
-    },
-    {
-      "title": "Widths",
-      "description": "Three width options via size modifiers.",
-      "examples": [
-        {
-          "layout": "column",
-          "items": [
-            {
-              "tag": "div",
-              "class": "ui-row",
-              "children": [
-                { "tag": "code", "text": "--sm" },
-                { "tag": "span", "text": "192px (24 units)" }
-              ]
-            },
-            {
-              "tag": "div",
-              "class": "ui-row",
-              "children": [
-                { "tag": "code", "text": "--md" },
-                { "tag": "span", "text": "240px (30 units, default)" }
-              ]
-            },
-            {
-              "tag": "div",
-              "class": "ui-row",
-              "children": [
-                { "tag": "code", "text": "--lg" },
-                { "tag": "span", "text": "320px (40 units)" }
-              ]
-            }
-          ],
-          "code": "<aside class=\"ui-sidebar ui-sidebar--sm\">192px</aside>\n<aside class=\"ui-sidebar ui-sidebar--md\">240px (default)</aside>\n<aside class=\"ui-sidebar ui-sidebar--lg\">320px</aside>"
-        }
-      ]
-    },
-    {
-      "title": "End Position",
-      "description": "Position sidebar on the end side with --end modifier.",
-      "examples": [
-        {
-          "code": "<aside class=\"ui-sidebar ui-sidebar--end\">\n  <p>End sidebar</p>\n</aside>"
-        }
-      ]
-    }
-  ]
-}