@teseor/css 1.14.2 → 1.15.0

package/src/components/data-display/stat/stat.docs.json

@@ -1,114 +0,0 @@
-{
-  "id": "stat",
-  "type": "component",
-  "title": "Stat",
-  "description": "Statistic display with prominent value and descriptive label.",
-  "api": "./stat.api.json",
-  "sections": [
-    {
-      "title": "Default",
-      "examples": [
-        {
-          "items": [
-            {
-              "tag": "div",
-              "class": "ui-stat",
-              "children": [
-                { "tag": "span", "class": "ui-stat__value", "text": "2,847" },
-                { "tag": "span", "class": "ui-stat__label", "text": "Total users" }
-              ]
-            }
-          ]
-        }
-      ]
-    },
-    {
-      "title": "Multiple stats",
-      "examples": [
-        {
-          "items": [
-            {
-              "tag": "div",
-              "class": "ui-row ui-row--lg",
-              "children": [
-                {
-                  "tag": "div",
-                  "class": "ui-stat",
-                  "children": [
-                    { "tag": "span", "class": "ui-stat__value", "text": "12.5k" },
-                    { "tag": "span", "class": "ui-stat__label", "text": "Revenue" }
-                  ]
-                },
-                {
-                  "tag": "div",
-                  "class": "ui-stat",
-                  "children": [
-                    { "tag": "span", "class": "ui-stat__value", "text": "573" },
-                    { "tag": "span", "class": "ui-stat__label", "text": "Orders" }
-                  ]
-                },
-                {
-                  "tag": "div",
-                  "class": "ui-stat",
-                  "children": [
-                    { "tag": "span", "class": "ui-stat__value", "text": "98%" },
-                    { "tag": "span", "class": "ui-stat__label", "text": "Satisfaction" }
-                  ]
-                }
-              ]
-            }
-          ]
-        }
-      ]
-    },
-    {
-      "title": "Small",
-      "examples": [
-        {
-          "items": [
-            {
-              "tag": "div",
-              "class": "ui-stat ui-stat--sm",
-              "children": [
-                { "tag": "span", "class": "ui-stat__value", "text": "42" },
-                { "tag": "span", "class": "ui-stat__label", "text": "Active now" }
-              ]
-            }
-          ]
-        }
-      ]
-    }
-  ],
-  "customization": [
-    {
-      "token": "--ui-stat-gap",
-      "default": "var(--ui-space-1)",
-      "description": "Gap between value and label"
-    },
-    {
-      "token": "--ui-stat-value-font-size",
-      "default": "var(--ui-font-size-3xl)",
-      "description": "Value font size"
-    },
-    {
-      "token": "--ui-stat-value-font-weight",
-      "default": "var(--ui-weight-bold)",
-      "description": "Value font weight"
-    },
-    {
-      "token": "--ui-stat-value-color",
-      "default": "var(--ui-color-text)",
-      "description": "Value text color"
-    },
-    {
-      "token": "--ui-stat-label-font-size",
-      "default": "var(--ui-font-size-sm)",
-      "description": "Label font size"
-    },
-    {
-      "token": "--ui-stat-label-color",
-      "default": "var(--ui-color-text-muted)",
-      "description": "Label text color"
-    }
-  ]
-}

package/src/components/data-display/status/status.docs.json

@@ -1,147 +0,0 @@
-{
-  "id": "status",
-  "type": "component",
-  "title": "Status",
-  "description": "Visual status indicator with colored dot to show state.",
-  "api": "./status.api.json",
-  "sections": [
-    {
-      "title": "Variants",
-      "examples": [
-        {
-          "items": [
-            {
-              "tag": "div",
-              "attrs": {
-                "style": "display: flex; flex-direction: column; gap: var(--ui-space-2);"
-              },
-              "children": [
-                {
-                  "tag": "span",
-                  "class": "ui-status",
-                  "children": [{ "tag": "span", "class": "ui-status__dot" }, { "text": "Default" }]
-                },
-                {
-                  "tag": "span",
-                  "class": "ui-status ui-status--success",
-                  "children": [{ "tag": "span", "class": "ui-status__dot" }, { "text": "Online" }]
-                },
-                {
-                  "tag": "span",
-                  "class": "ui-status ui-status--warning",
-                  "children": [{ "tag": "span", "class": "ui-status__dot" }, { "text": "Away" }]
-                },
-                {
-                  "tag": "span",
-                  "class": "ui-status ui-status--danger",
-                  "children": [{ "tag": "span", "class": "ui-status__dot" }, { "text": "Busy" }]
-                },
-                {
-                  "tag": "span",
-                  "class": "ui-status ui-status--info",
-                  "children": [
-                    { "tag": "span", "class": "ui-status__dot" },
-                    { "text": "In a meeting" }
-                  ]
-                }
-              ]
-            }
-          ],
-          "code": "<span class=\"ui-status ui-status--success\">\n  <span class=\"ui-status__dot\"></span>\n  Online\n</span>"
-        }
-      ]
-    },
-    {
-      "title": "Sizes",
-      "examples": [
-        {
-          "items": [
-            {
-              "tag": "div",
-              "attrs": { "style": "display: flex; gap: var(--ui-space-4); align-items: center;" },
-              "children": [
-                {
-                  "tag": "span",
-                  "class": "ui-status ui-status--success ui-status--sm",
-                  "children": [{ "tag": "span", "class": "ui-status__dot" }, { "text": "Small" }]
-                },
-                {
-                  "tag": "span",
-                  "class": "ui-status ui-status--success",
-                  "children": [{ "tag": "span", "class": "ui-status__dot" }, { "text": "Default" }]
-                },
-                {
-                  "tag": "span",
-                  "class": "ui-status ui-status--success ui-status--lg",
-                  "children": [{ "tag": "span", "class": "ui-status__dot" }, { "text": "Large" }]
-                }
-              ]
-            }
-          ],
-          "code": "<span class=\"ui-status ui-status--sm\">...</span>\n<span class=\"ui-status\">...</span>\n<span class=\"ui-status ui-status--lg\">...</span>"
-        }
-      ]
-    },
-    {
-      "title": "Pulse Animation",
-      "description": "For live or active indicators",
-      "api": "./status.api.json",
-      "examples": [
-        {
-          "items": [
-            {
-              "tag": "span",
-              "class": "ui-status ui-status--success ui-status--pulse",
-              "children": [{ "tag": "span", "class": "ui-status__dot" }, { "text": "Live" }]
-            }
-          ],
-          "code": "<span class=\"ui-status ui-status--success ui-status--pulse\">\n  <span class=\"ui-status__dot\"></span>\n  Live\n</span>"
-        }
-      ]
-    },
-    {
-      "title": "Dot Only",
-      "examples": [
-        {
-          "items": [
-            {
-              "tag": "div",
-              "attrs": { "style": "display: flex; gap: var(--ui-space-2);" },
-              "children": [
-                {
-                  "tag": "span",
-                  "class": "ui-status ui-status--success",
-                  "children": [{ "tag": "span", "class": "ui-status__dot" }]
-                },
-                {
-                  "tag": "span",
-                  "class": "ui-status ui-status--warning",
-                  "children": [{ "tag": "span", "class": "ui-status__dot" }]
-                },
-                {
-                  "tag": "span",
-                  "class": "ui-status ui-status--danger",
-                  "children": [{ "tag": "span", "class": "ui-status__dot" }]
-                }
-              ]
-            }
-          ],
-          "code": "<span class=\"ui-status ui-status--success\">\n  <span class=\"ui-status__dot\"></span>\n</span>"
-        }
-      ]
-    }
-  ],
-  "customization": [
-    { "token": "--ui-status-size", "default": "var(--ui-unit)", "description": "Dot size" },
-    {
-      "token": "--ui-status-color",
-      "default": "var(--ui-color-text-muted)",
-      "description": "Default dot color"
-    },
-    {
-      "token": "--ui-status-gap",
-      "default": "var(--ui-unit)",
-      "description": "Gap between dot and text"
-    }
-  ]
-}

package/src/components/data-display/table/table.docs.json

@@ -1,184 +0,0 @@
-{
-  "id": "table",
-  "type": "component",
-  "title": "Table",
-  "description": "Styled table with header formatting and optional variants.",
-  "api": "./table.api.json",
-  "componentName": "table",
-  "sections": [
-    {
-      "title": "Basic table",
-      "examples": [
-        {
-          "title": "Default",
-          "items": [
-            {
-              "tag": "table",
-              "class": "ui-table",
-              "children": [
-                {
-                  "tag": "thead",
-                  "children": [
-                    {
-                      "tag": "tr",
-                      "children": [
-                        { "tag": "th", "text": "Name" },
-                        { "tag": "th", "text": "Value" }
-                      ]
-                    }
-                  ]
-                },
-                {
-                  "tag": "tbody",
-                  "children": [
-                    {
-                      "tag": "tr",
-                      "children": [{ "tag": "td", "text": "Alpha" }, { "tag": "td", "text": "100" }]
-                    },
-                    {
-                      "tag": "tr",
-                      "children": [{ "tag": "td", "text": "Beta" }, { "tag": "td", "text": "200" }]
-                    }
-                  ]
-                }
-              ]
-            }
-          ]
-        }
-      ]
-    },
-    {
-      "title": "Variants",
-      "examples": [
-        {
-          "title": "Compact",
-          "items": [
-            {
-              "tag": "table",
-              "class": "ui-table ui-table--compact",
-              "children": [
-                {
-                  "tag": "thead",
-                  "children": [
-                    {
-                      "tag": "tr",
-                      "children": [
-                        { "tag": "th", "text": "Token" },
-                        { "tag": "th", "text": "Value" }
-                      ]
-                    }
-                  ]
-                },
-                {
-                  "tag": "tbody",
-                  "children": [
-                    {
-                      "tag": "tr",
-                      "children": [
-                        {
-                          "tag": "td",
-                          "children": [
-                            { "tag": "code", "class": "ui-code ui-code--sm", "text": "--space-1" }
-                          ]
-                        },
-                        { "tag": "td", "text": "0.5rem" }
-                      ]
-                    },
-                    {
-                      "tag": "tr",
-                      "children": [
-                        {
-                          "tag": "td",
-                          "children": [
-                            { "tag": "code", "class": "ui-code ui-code--sm", "text": "--space-2" }
-                          ]
-                        },
-                        { "tag": "td", "text": "1rem" }
-                      ]
-                    }
-                  ]
-                }
-              ]
-            }
-          ]
-        },
-        {
-          "title": "Striped",
-          "items": [
-            {
-              "tag": "table",
-              "class": "ui-table ui-table--striped",
-              "children": [
-                {
-                  "tag": "thead",
-                  "children": [
-                    {
-                      "tag": "tr",
-                      "children": [
-                        { "tag": "th", "text": "Item" },
-                        { "tag": "th", "text": "Status" }
-                      ]
-                    }
-                  ]
-                },
-                {
-                  "tag": "tbody",
-                  "children": [
-                    {
-                      "tag": "tr",
-                      "children": [
-                        { "tag": "td", "text": "Task 1" },
-                        { "tag": "td", "text": "Done" }
-                      ]
-                    },
-                    {
-                      "tag": "tr",
-                      "children": [
-                        { "tag": "td", "text": "Task 2" },
-                        { "tag": "td", "text": "Pending" }
-                      ]
-                    },
-                    {
-                      "tag": "tr",
-                      "children": [
-                        { "tag": "td", "text": "Task 3" },
-                        { "tag": "td", "text": "Done" }
-                      ]
-                    }
-                  ]
-                }
-              ]
-            }
-          ]
-        }
-      ]
-    }
-  ],
-  "customization": [
-    {
-      "token": "--ui-table-font-size",
-      "default": "var(--ui-font-size-sm)",
-      "description": "Table font size"
-    },
-    {
-      "token": "--ui-table-border-color",
-      "default": "var(--ui-color-border)",
-      "description": "Border color"
-    },
-    {
-      "token": "--ui-table-header-bg",
-      "default": "var(--ui-color-bg-subtle)",
-      "description": "Header background"
-    },
-    {
-      "token": "--ui-table-cell-padding-x",
-      "default": "var(--ui-space-2)",
-      "description": "Cell horizontal padding"
-    },
-    {
-      "token": "--ui-table-cell-padding-y",
-      "default": "var(--ui-space-1)",
-      "description": "Cell vertical padding"
-    }
-  ]
-}

package/src/components/data-display/tag/tag.docs.json

@@ -1,146 +0,0 @@
-{
-  "id": "tag",
-  "type": "component",
-  "title": "Tag",
-  "description": "Keyword labels for categorization. Use for filtering, attributes, or status indicators.",
-  "api": "./tag.api.json",
-  "sections": [
-    {
-      "title": "Default",
-      "examples": [
-        {
-          "layout": "row",
-          "items": [
-            { "tag": "span", "class": "ui-tag", "text": "Tag" },
-            { "tag": "span", "class": "ui-tag", "text": "Category" },
-            { "tag": "span", "class": "ui-tag", "text": "Label" }
-          ],
-          "code": "<span class=\"ui-tag\">Tag</span>"
-        }
-      ]
-    },
-    {
-      "title": "Sizes",
-      "examples": [
-        {
-          "layout": "row",
-          "items": [
-            { "tag": "span", "class": "ui-tag ui-tag--sm", "text": "Small" },
-            { "tag": "span", "class": "ui-tag", "text": "Default" },
-            { "tag": "span", "class": "ui-tag ui-tag--lg", "text": "Large" }
-          ],
-          "code": "<span class=\"ui-tag ui-tag--sm\">Small</span>\n<span class=\"ui-tag\">Default</span>\n<span class=\"ui-tag ui-tag--lg\">Large</span>"
-        }
-      ]
-    },
-    {
-      "title": "Variants",
-      "examples": [
-        {
-          "layout": "row",
-          "items": [
-            { "tag": "span", "class": "ui-tag", "text": "Default" },
-            { "tag": "span", "class": "ui-tag ui-tag--primary", "text": "Primary" },
-            { "tag": "span", "class": "ui-tag ui-tag--success", "text": "Success" },
-            { "tag": "span", "class": "ui-tag ui-tag--warning", "text": "Warning" },
-            { "tag": "span", "class": "ui-tag ui-tag--danger", "text": "Danger" }
-          ],
-          "code": "<span class=\"ui-tag\">Default</span>\n<span class=\"ui-tag ui-tag--primary\">Primary</span>\n<span class=\"ui-tag ui-tag--success\">Success</span>\n<span class=\"ui-tag ui-tag--warning\">Warning</span>\n<span class=\"ui-tag ui-tag--danger\">Danger</span>"
-        }
-      ]
-    },
-    {
-      "title": "With Remove Button",
-      "examples": [
-        {
-          "items": [
-            {
-              "tag": "span",
-              "class": "ui-tag",
-              "children": [
-                { "tag": "span", "text": "Removable" },
-                {
-                  "tag": "button",
-                  "class": "ui-tag__remove",
-                  "attrs": { "aria-label": "Remove" },
-                  "children": [
-                    {
-                      "tag": "svg",
-                      "class": "ui-icon ui-icon--xs",
-                      "attrs": { "viewBox": "0 0 24 24" },
-                      "children": [{ "tag": "path", "attrs": { "d": "M18 6 6 18M6 6l12 12" } }]
-                    }
-                  ]
-                }
-              ]
-            }
-          ],
-          "code": "<span class=\"ui-tag\">\n  Removable\n  <button class=\"ui-tag__remove\" aria-label=\"Remove\">\n    <svg class=\"ui-icon\">...</svg>\n  </button>\n</span>"
-        }
-      ]
-    },
-    {
-      "title": "Tag Group",
-      "examples": [
-        {
-          "items": [
-            {
-              "tag": "div",
-              "class": "ui-tag-group",
-              "children": [
-                { "tag": "span", "class": "ui-tag", "text": "JavaScript" },
-                { "tag": "span", "class": "ui-tag", "text": "TypeScript" },
-                { "tag": "span", "class": "ui-tag", "text": "React" },
-                { "tag": "span", "class": "ui-tag", "text": "CSS" }
-              ]
-            }
-          ],
-          "code": "<div class=\"ui-tag-group\">\n  <span class=\"ui-tag\">JavaScript</span>\n  <span class=\"ui-tag\">TypeScript</span>\n  <span class=\"ui-tag\">React</span>\n</div>"
-        }
-      ]
-    }
-  ],
-  "customization": [
-    {
-      "token": "--ui-tag-height",
-      "default": "calc(var(--ui-unit) * 3)",
-      "description": "Default height"
-    },
-    {
-      "token": "--ui-tag-height-sm",
-      "default": "calc(var(--ui-unit) * 2.5)",
-      "description": "Small height"
-    },
-    {
-      "token": "--ui-tag-height-lg",
-      "default": "calc(var(--ui-unit) * 3.5)",
-      "description": "Large height"
-    },
-    {
-      "token": "--ui-tag-padding-x",
-      "default": "var(--ui-space-1)",
-      "description": "Horizontal padding"
-    },
-    {
-      "token": "--ui-tag-gap",
-      "default": "calc(var(--ui-unit) * 0.5)",
-      "description": "Gap between content and remove button"
-    },
-    {
-      "token": "--ui-tag-radius",
-      "default": "var(--ui-radius-full)",
-      "description": "Border radius"
-    },
-    {
-      "token": "--ui-tag-font-size",
-      "default": "var(--ui-font-size-sm)",
-      "description": "Font size"
-    },
-    {
-      "token": "--ui-tag-bg",
-      "default": "var(--ui-color-bg-muted)",
-      "description": "Background color"
-    },
-    { "token": "--ui-tag-color", "default": "var(--ui-color-text)", "description": "Text color" }
-  ]
-}