eidosui 0.5.0__tar.gz → 0.7.0__tar.gz

{eidosui-0.5.0 → eidosui-0.7.0}/PKG-INFO

@@ -1,6 +1,6 @@
 Metadata-Version: 2.4
 Name: eidosui
-Version: 0.5.0
+Version: 0.7.0
 Summary: A modern, Tailwind CSS-based UI library for air development
 Project-URL: Homepage, https://github.com/isaac-flath/EidosUI
 Project-URL: Repository, https://github.com/isaac-flath/EidosUI

{eidosui-0.5.0 → eidosui-0.7.0}/eidos/__init__.py

@@ -15,7 +15,7 @@ from . import styles
 
 # Import components
 from .components import DataTable, EidosHeaders, NavBar
-from .styles import buttons, semantic, tables, typography
+from .styles import buttons, lists, tables, typography
 from .tags import (
     # Headings
     H1,
@@ -148,7 +148,7 @@ __all__ = [
     "styles",
     "buttons",
     "typography",
-    "semantic",
+    "lists",
     "tables",
     # Components
     "DataTable",

{eidosui-0.5.0 → eidosui-0.7.0}/eidos/components/__init__.py

@@ -6,5 +6,6 @@ Higher-level components built on top of the base tags.
 from .headers import EidosHeaders
 from .navigation import NavBar
 from .table import DataTable
+from .tabs import TabContainer, TabList, TabPanel, Tabs
 
-__all__ = ["DataTable", "NavBar", "EidosHeaders"]
+__all__ = ["DataTable", "NavBar", "EidosHeaders", "TabContainer", "TabList", "TabPanel", "Tabs"]

eidosui-0.7.0/eidos/components/tabs.py

@@ -0,0 +1,140 @@
+from air import Button, Div, Tag
+
+from .. import styles
+from ..utils import stringify
+
+
+def TabContainer(
+    initial_tab_url: str,
+    cls: str = "",
+    target_id: str = "tabs",
+) -> Tag:
+    """HTMX-based tab container that loads tabs dynamically.
+    
+    Args:
+        initial_tab_url: URL to load the initial tab content
+        cls: Additional classes for the container
+        target_id: ID for the tab container (default: "tabs")
+        
+    Returns:
+        Tag: The tab container that will be populated via HTMX
+        
+    Example:
+        TabContainer("/settings/general")
+    """
+    return Div(
+        id=target_id,
+        hx_get=initial_tab_url,
+        hx_trigger="load delay:100ms",
+        hx_target=f"#{target_id}",
+        hx_swap="innerHTML",
+        class_=stringify(styles.tabs.container, cls),
+    )
+
+
+def TabList(
+    *tabs: tuple[str, str],
+    selected: int = 0,
+    tab_cls: str = "",
+    hx_target: str = "#tabs",
+    hx_swap: str = "innerHTML",
+) -> Tag:
+    """HTMX-based tab list for server-rendered tabs.
+    
+    Args:
+        *tabs: Variable number of (label, url) tuples
+        selected: Index of the selected tab (0-based)
+        tab_cls: Additional classes for tab buttons
+        hx_target: HTMX target for tab content (default: "#tabs")
+        hx_swap: HTMX swap method (default: "innerHTML")
+        
+    Returns:
+        Tag: The tab list component
+        
+    Example:
+        TabList(
+            ("General", "/settings/general"),
+            ("Security", "/settings/security"),
+            ("Advanced", "/settings/advanced"),
+            selected=0
+        )
+    """
+    tab_buttons = []
+
+    for i, (label, url) in enumerate(tabs):
+        is_selected = i == selected
+
+        tab_button = Button(
+            label,
+            hx_get=url,
+            hx_target=hx_target,
+            hx_swap=hx_swap,
+            role="tab",
+            aria_selected="true" if is_selected else "false",
+            aria_controls="tab-content",
+            class_=stringify(
+                styles.tabs.tab,
+                styles.tabs.tab_active if is_selected else "",
+                tab_cls
+            ),
+        )
+        tab_buttons.append(tab_button)
+
+    return Div(
+        *tab_buttons,
+        role="tablist",
+        class_=styles.tabs.list,
+    )
+
+
+def TabPanel(
+    content: Tag,
+    panel_cls: str = "",
+) -> Tag:
+    """Tab panel content wrapper.
+    
+    Args:
+        content: The content to display in the tab panel
+        panel_cls: Additional classes for the panel
+        
+    Returns:
+        Tag: The tab panel component
+    """
+    return Div(
+        content,
+        id="tab-content",
+        role="tabpanel",
+        class_=stringify(styles.tabs.panel, styles.tabs.panel_active, panel_cls),
+    )
+
+
+def Tabs(
+    tab_list: Tag,
+    tab_panel: Tag,
+    cls: str = "",
+) -> Tag:
+    """Complete tab component with list and panel.
+    
+    Args:
+        tab_list: The TabList component
+        tab_panel: The TabPanel component
+        cls: Additional classes for the container
+        
+    Returns:
+        Tag: The complete tabs component
+        
+    Example:
+        # In your route handler:
+        tab_list = TabList(
+            ("General", "/settings/general"),
+            ("Security", "/settings/security"),
+            selected=0
+        )
+        tab_panel = TabPanel(general_settings_content)
+        return Tabs(tab_list, tab_panel)
+    """
+    return Div(
+        tab_list,
+        tab_panel,
+        class_=stringify(styles.tabs.container, cls),
+    )

{eidosui-0.5.0 → eidosui-0.7.0}/eidos/css/styles.css

@@ -475,4 +475,111 @@
         transform: translateY(0);
         opacity: 1;
     }
+}
+
+/* List Styles */
+.eidos-ul {
+    list-style-type: disc;
+    margin: var(--space-md) 0;
+    padding-left: var(--space-xl);
+    color: var(--color-text);
+}
+
+.eidos-ol {
+    list-style-type: decimal;
+    margin: var(--space-md) 0;
+    padding-left: var(--space-xl);
+    color: var(--color-text);
+}
+
+.eidos-li {
+    margin-bottom: var(--space-xs);
+    line-height: var(--line-height-relaxed);
+}
+
+/* Nested lists */
+.eidos-ul .eidos-ul,
+.eidos-ul .eidos-ol,
+.eidos-ol .eidos-ul,
+.eidos-ol .eidos-ol {
+    margin: var(--space-xs) 0;
+}
+
+/* Remove bottom margin from last list item */
+.eidos-li:last-child {
+    margin-bottom: 0;
+}
+
+/* List item hover effect for interactive lists */
+.eidos-li-interactive {
+    padding: var(--space-xs) var(--space-sm);
+    margin-left: calc(var(--space-xl) * -1);
+    margin-right: calc(var(--space-sm) * -1);
+    padding-left: var(--space-xl);
+    border-radius: var(--radius-sm);
+    transition: background-color var(--transition-fast);
+    cursor: pointer;
+}
+
+.eidos-li-interactive:hover {
+    background-color: var(--color-surface);
+}
+
+/* Tabs Component */
+.eidos-tabs {
+    position: relative;
+}
+
+.eidos-tabs-list {
+    display: flex;
+    border-bottom: 1px solid var(--color-border);
+    overflow-x: auto;
+    scrollbar-width: thin;
+    -webkit-overflow-scrolling: touch;
+}
+
+.eidos-tab {
+    padding: var(--space-sm) var(--space-lg);
+    border-bottom: 2px solid transparent;
+    color: var(--color-text-muted);
+    text-decoration: none;
+    white-space: nowrap;
+    transition: all var(--transition-fast);
+    position: relative;
+    top: 1px;
+}
+
+.eidos-tab:hover {
+    color: var(--color-text);
+}
+
+.eidos-tab:focus {
+    outline: 2px solid var(--color-focus);
+    outline-offset: -2px;
+}
+
+.eidos-tab-active {
+    color: var(--color-primary);
+    border-bottom-color: var(--color-primary);
+}
+
+.eidos-tab-panel {
+    padding: var(--space-lg) 0;
+    display: none;
+}
+
+.eidos-tab-panel-active {
+    display: block;
+}
+
+/* HTMX-enhanced transitions */
+.eidos-tabs.htmx-swapping .eidos-tab-panel {
+    opacity: 0;
+    transform: translateY(-4px);
+}
+
+.eidos-tabs.htmx-settling .eidos-tab-panel {
+    opacity: 1;
+    transform: translateY(0);
+    transition: opacity var(--transition-normal), transform var(--transition-normal);
 }

{eidosui-0.5.0 → eidosui-0.7.0}/eidos/styles.py

@@ -40,9 +40,6 @@ class Typography:
     h6: Final[str] = "eidos-h6"
 
 
-class Semantic:
-    """Semantic HTML element CSS classes from styles.css."""
-
     # Text formatting
     strong: Final[str] = "eidos-strong"
     i: Final[str] = "eidos-i"
@@ -80,6 +77,15 @@ class Semantic:
     figcaption: Final[str] = "eidos-figcaption"
 
 
+class Lists:
+    """List-related CSS classes from styles.css."""
+
+    ul: Final[str] = "eidos-ul"
+    ol: Final[str] = "eidos-ol"
+    li: Final[str] = "eidos-li"
+    li_interactive: Final[str] = "eidos-li-interactive"
+
+
 class Tables:
     """Table-related CSS classes from styles.css."""
 
@@ -97,8 +103,25 @@ class Tables:
     td: Final[str] = "eidos-td"
 
 
+class Tabs:
+    """Tab-related CSS classes from styles.css."""
+
+    # Container and structure
+    container: Final[str] = "eidos-tabs"
+    list: Final[str] = "eidos-tabs-list"
+
+    # Tab elements
+    tab: Final[str] = "eidos-tab"
+    tab_active: Final[str] = "eidos-tab-active"
+
+    # Panel elements
+    panel: Final[str] = "eidos-tab-panel"
+    panel_active: Final[str] = "eidos-tab-panel-active"
+
+
 # Create singleton instance for easy access
 buttons = Buttons()
 typography = Typography()
-semantic = Semantic()
 tables = Tables()
+lists = Lists()
+tabs = Tabs()

{eidosui-0.5.0 → eidosui-0.7.0}/eidos/tags.py

@@ -1,130 +1,10 @@
 from typing import Any
 
 import air
-
+from air.tags import *
 from . import styles
 from .utils import stringify
 
-# Define exports for this module
-__all__ = [
-    # Custom EidosUI components
-    "Button",
-    "H1",
-    "H2",
-    "H3",
-    "H4",
-    "H5",
-    "H6",
-    "Body",
-    # Semantic components with styling
-    "Strong",
-    "I",
-    "Small",
-    "Del",
-    "Abbr",
-    "Var",
-    "Mark",
-    "Time",
-    "Code",
-    "Pre",
-    "Kbd",
-    "Samp",
-    "Blockquote",
-    "Cite",
-    "Address",
-    "Hr",
-    "Details",
-    "Summary",
-    "Dl",
-    "Dt",
-    "Dd",
-    "Figure",
-    "Figcaption",
-    # Table components with styling
-    "Table",
-    "Thead",
-    "Tbody",
-    "Tfoot",
-    "Tr",
-    "Th",
-    "Td",
-    # Pass-through HTML tags from air.tags
-    "A",
-    "Area",
-    "Article",
-    "Aside",
-    "Audio",
-    "B",
-    "Base",
-    "Bdi",
-    "Bdo",
-    "Br",
-    "Canvas",
-    "Caption",
-    "Col",
-    "Colgroup",
-    "Data",
-    "Datalist",
-    "Dfn",
-    "Dialog",
-    "Div",
-    "Em",
-    "Embed",
-    "Fieldset",
-    "Footer",
-    "Form",
-    "Head",
-    "Header",
-    "Hgroup",
-    "Html",
-    "Iframe",
-    "Img",
-    "Input",
-    "Ins",
-    "Label",
-    "Legend",
-    "Li",
-    "Link",
-    "Main",
-    "Map",
-    "Menu",
-    "Meta",
-    "Meter",
-    "Nav",
-    "Noscript",
-    "Object",
-    "Ol",
-    "Optgroup",
-    "Option",
-    "Output",
-    "P",
-    "Param",
-    "Picture",
-    "Progress",
-    "Q",
-    "Rp",
-    "Rt",
-    "Ruby",
-    "S",
-    "Script",
-    "Search",
-    "Section",
-    "Select",
-    "Source",
-    "Span",
-    "Style",
-    "Sub",
-    "Sup",
-    "Template",
-    "Textarea",
-    "Title",
-    "Track",
-    "U",
-    "Ul",
-    "Video",
-    "Wbr",
-]
-
 
 def Button(
     *content: Any,
@@ -214,19 +94,19 @@ def Body(*content: Any, class_: str | list[str] | None = None, **kwargs: Any) ->
 
 
 def Strong(*content: Any, class_: str | list[str] | None = None, **kwargs: Any) -> air.Tag:
-    return air.Strong(*content, class_=stringify(styles.semantic.strong, class_), **kwargs)
+    return air.Strong(*content, class_=stringify(styles.typography.strong, class_), **kwargs)
 
 
 def I(*content: Any, class_: str | list[str] | None = None, **kwargs: Any) -> air.Tag:
-    return air.I(*content, class_=stringify(styles.semantic.i, class_), **kwargs)
+    return air.I(*content, class_=stringify(styles.typography.i, class_), **kwargs)
 
 
 def Small(*content: Any, class_: str | list[str] | None = None, **kwargs: Any) -> air.Tag:
-    return air.Small(*content, class_=stringify(styles.semantic.small, class_), **kwargs)
+    return air.Small(*content, class_=stringify(styles.typography.small, class_), **kwargs)
 
 
 def Del(*content: Any, class_: str | list[str] | None = None, **kwargs: Any) -> air.Tag:
-    return air.Del(*content, class_=stringify(styles.semantic.del_, class_), **kwargs)
+    return air.Del(*content, class_=stringify(styles.typography.del_, class_), **kwargs)
 
 
 def Abbr(*content: Any, class_: str | list[str] | None = None, **kwargs: Any) -> air.Tag:
@@ -242,79 +122,79 @@ def Abbr(*content: Any, class_: str | list[str] | None = None, **kwargs: Any) ->
     Example:
         Abbr("HTML", title="Hyper Text Markup Language")
     """
-    return air.Abbr(*content, class_=stringify(styles.semantic.abbr, class_), **kwargs)
+    return air.Abbr(*content, class_=stringify(styles.typography.abbr, class_), **kwargs)
 
 
 def Var(*content: Any, class_: str | list[str] | None = None, **kwargs: Any) -> air.Tag:
-    return air.Var(*content, class_=stringify(styles.semantic.var, class_), **kwargs)
+    return air.Var(*content, class_=stringify(styles.typography.var, class_), **kwargs)
 
 
 def Mark(*content: Any, class_: str | list[str] | None = None, **kwargs: Any) -> air.Tag:
-    return air.Mark(*content, class_=stringify(styles.semantic.mark, class_), **kwargs)
+    return air.Mark(*content, class_=stringify(styles.typography.mark, class_), **kwargs)
 
 
 def Time(*content: Any, class_: str | list[str] | None = None, **kwargs: Any) -> air.Tag:
-    return air.Time(*content, class_=stringify(styles.semantic.time, class_), **kwargs)
+    return air.Time(*content, class_=stringify(styles.typography.time, class_), **kwargs)
 
 
 def Code(*content: Any, class_: str | list[str] | None = None, **kwargs: Any) -> air.Tag:
-    return air.Code(*content, class_=stringify(styles.semantic.code, class_), **kwargs)
+    return air.Code(*content, class_=stringify(styles.typography.code, class_), **kwargs)
 
 
 def Pre(*content: Any, class_: str | list[str] | None = None, **kwargs: Any) -> air.Tag:
-    return air.Pre(*content, class_=stringify(styles.semantic.pre, class_), **kwargs)
+    return air.Pre(*content, class_=stringify(styles.typography.pre, class_), **kwargs)
 
 
 def Kbd(*content: Any, class_: str | list[str] | None = None, **kwargs: Any) -> air.Tag:
-    return air.Kbd(*content, class_=stringify(styles.semantic.kbd, class_), **kwargs)
+    return air.Kbd(*content, class_=stringify(styles.typography.kbd, class_), **kwargs)
 
 
 def Samp(*content: Any, class_: str | list[str] | None = None, **kwargs: Any) -> air.Tag:
-    return air.Samp(*content, class_=stringify(styles.semantic.samp, class_), **kwargs)
+    return air.Samp(*content, class_=stringify(styles.typography.samp, class_), **kwargs)
 
 
 def Blockquote(*content: Any, class_: str | list[str] | None = None, **kwargs: Any) -> air.Tag:
-    return air.Blockquote(*content, class_=stringify(styles.semantic.blockquote, class_), **kwargs)
+    return air.Blockquote(*content, class_=stringify(styles.typography.blockquote, class_), **kwargs)
 
 
 def Cite(*content: Any, class_: str | list[str] | None = None, **kwargs: Any) -> air.Tag:
-    return air.Cite(*content, class_=stringify(styles.semantic.cite, class_), **kwargs)
+    return air.Cite(*content, class_=stringify(styles.typography.cite, class_), **kwargs)
 
 
 def Address(*content: Any, class_: str | list[str] | None = None, **kwargs: Any) -> air.Tag:
-    return air.Address(*content, class_=stringify(styles.semantic.address, class_), **kwargs)
+    return air.Address(*content, class_=stringify(styles.typography.address, class_), **kwargs)
 
 
 def Hr(class_: str | list[str] | None = None, **kwargs: Any) -> air.Tag:
-    return air.Hr(class_=stringify(styles.semantic.hr, class_), **kwargs)
+    return air.Hr(class_=stringify(styles.typography.hr, class_), **kwargs)
 
 
 def Details(*content: Any, class_: str | list[str] | None = None, **kwargs: Any) -> air.Tag:
-    return air.Details(*content, class_=stringify(styles.semantic.details, class_), **kwargs)
+    return air.Details(*content, class_=stringify(styles.typography.details, class_), **kwargs)
 
 
 def Summary(*content: Any, class_: str | list[str] | None = None, **kwargs: Any) -> air.Tag:
-    return air.Summary(*content, class_=stringify(styles.semantic.summary, class_), **kwargs)
+    return air.Summary(*content, class_=stringify(styles.typography.summary, class_), **kwargs)
 
 
 def Dl(*content: Any, class_: str | list[str] | None = None, **kwargs: Any) -> air.Tag:
-    return air.Dl(*content, class_=stringify(styles.semantic.dl, class_), **kwargs)
+    return air.Dl(*content, class_=stringify(styles.typography.dl, class_), **kwargs)
 
 
 def Dt(*content: Any, class_: str | list[str] | None = None, **kwargs: Any) -> air.Tag:
-    return air.Dt(*content, class_=stringify(styles.semantic.dt, class_), **kwargs)
+    return air.Dt(*content, class_=stringify(styles.typography.dt, class_), **kwargs)
 
 
 def Dd(*content: Any, class_: str | list[str] | None = None, **kwargs: Any) -> air.Tag:
-    return air.Dd(*content, class_=stringify(styles.semantic.dd, class_), **kwargs)
+    return air.Dd(*content, class_=stringify(styles.typography.dd, class_), **kwargs)
 
 
 def Figure(*content: Any, class_: str | list[str] | None = None, **kwargs: Any) -> air.Tag:
-    return air.Figure(*content, class_=stringify(styles.semantic.figure, class_), **kwargs)
+    return air.Figure(*content, class_=stringify(styles.typography.figure, class_), **kwargs)
 
 
 def Figcaption(*content: Any, class_: str | list[str] | None = None, **kwargs: Any) -> air.Tag:
-    return air.Figcaption(*content, class_=stringify(styles.semantic.figcaption, class_), **kwargs)
+    return air.Figcaption(*content, class_=stringify(styles.typography.figcaption, class_), **kwargs)
 
 
 # Table elements with styling
@@ -355,81 +235,18 @@ def Td(*content: Any, class_: str | list[str] | None = None, **kwargs: Any) -> a
     return air.Td(*content, class_=stringify(styles.tables.td, class_), **kwargs)
 
 
+def Ul(*content: Any, class_: str | list[str] | None = None, **kwargs: Any) -> air.Tag:
+    return air.Ul(*content, class_=stringify(styles.lists.ul, class_), **kwargs)
+
+
+def Ol(*content: Any, class_: str | list[str] | None = None, **kwargs: Any) -> air.Tag:
+    return air.Ol(*content, class_=stringify(styles.lists.ol, class_), **kwargs)
+
+
+def Li(*content: Any, class_: str | list[str] | None = None, **kwargs: Any) -> air.Tag:
+    return air.Li(*content, class_=stringify(styles.lists.li, class_), **kwargs)
+
+
+
 # Pass-through tags from air.tags
 # Import all standard HTML tags that don't have custom styling
-from air.tags import (
-    A,
-    Area,
-    Article,
-    Aside,
-    Audio,
-    B,
-    Base,
-    Bdi,
-    Bdo,
-    Br,
-    Canvas,
-    Caption,
-    Col,
-    Colgroup,
-    Data,
-    Datalist,
-    Dfn,
-    Dialog,
-    Div,
-    Em,
-    Embed,
-    Fieldset,
-    Footer,
-    Form,
-    Head,
-    Header,
-    Hgroup,
-    Html,
-    Iframe,
-    Img,
-    Input,
-    Ins,
-    Label,
-    Legend,
-    Li,
-    Link,
-    Main,
-    Map,
-    Menu,
-    Meta,
-    Meter,
-    Nav,
-    Noscript,
-    Object,
-    Ol,
-    Optgroup,
-    Option,
-    Output,
-    P,
-    Param,
-    Picture,
-    Progress,
-    Q,
-    Rp,
-    Rt,
-    Ruby,
-    S,
-    Script,
-    Search,
-    Section,
-    Select,
-    Source,
-    Span,
-    Style,
-    Sub,
-    Sup,
-    Template,
-    Textarea,
-    Title,
-    Track,
-    U,
-    Ul,
-    Video,
-    Wbr,
-)

{eidosui-0.5.0 → eidosui-0.7.0}/pyproject.toml

@@ -4,7 +4,7 @@ build-backend = "hatchling.build"
 
 [project]
 name = "eidosui"
-version = "0.5.0"
+version = "0.7.0"
 description = "A modern, Tailwind CSS-based UI library for air development"
 readme = "README.md"
 license = "MIT"