eidosui 0.4.0__py3-none-any.whl → 0.6.0__py3-none-any.whl

eidos/css/styles.css

@@ -339,6 +339,54 @@
     margin: var(--space-xl) 0;
 }
 
+/* Table styles */
+.eidos-table {
+    width: 100%;
+    border-collapse: collapse;
+    font-size: var(--font-size-base);
+    background-color: var(--color-background);
+}
+
+.eidos-thead {
+    background-color: var(--color-surface);
+    border-bottom: var(--border-2) solid var(--color-border);
+}
+
+.eidos-tbody {
+    background-color: var(--color-background);
+}
+
+.eidos-tfoot {
+    background-color: var(--color-surface);
+    border-top: var(--border-2) solid var(--color-border);
+}
+
+.eidos-tr {
+    border-bottom: var(--border) solid var(--color-border);
+    transition: background-color var(--transition-fast);
+}
+
+.eidos-tbody .eidos-tr:hover {
+    background-color: var(--color-surface);
+}
+
+.eidos-tbody .eidos-tr:last-child {
+    border-bottom: none;
+}
+
+.eidos-th {
+    padding: var(--space-sm) var(--space-md);
+    text-align: left;
+    font-weight: var(--font-weight-semibold);
+    color: var(--color-text);
+}
+
+.eidos-td {
+    padding: var(--space-sm) var(--space-md);
+    text-align: left;
+    color: var(--color-text);
+}
+
 /* Navigation base styles */
 .eidos-navbar {
     width: 100%;
@@ -427,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);
 }

eidos/plugins/__init__.py

@@ -1 +1 @@
-# EidosUI plugins package
+# EidosUI plugins package

eidos/plugins/markdown/__init__.py

@@ -5,10 +5,10 @@ EidosUI themes through CSS variables.
 
 Basic usage:
     from eidos.plugins.markdown import Markdown, MarkdownCSS
-    
+
     # In your document head
     MarkdownCSS()
-    
+
     # In your content
     Markdown("# Hello World\\n\\nThis is **markdown**!")
 """
@@ -18,4 +18,4 @@ from .renderer import MarkdownRenderer
 
 __all__ = ["Markdown", "MarkdownCSS", "MarkdownRenderer"]
 
-__version__ = "0.1.0"
+__version__ = "0.1.0"

eidos/plugins/markdown/components.py

@@ -1,53 +1,41 @@
 """Markdown components for EidosUI"""
 
 import air
-from typing import Optional
-from .renderer import MarkdownRenderer
 
+from .renderer import MarkdownRenderer
 
 # Global renderer instance for reuse
 _renderer = MarkdownRenderer()
 
 
-def Markdown(content: str, class_: Optional[str] = None, **kwargs) -> air.Div:
+def Markdown(content: str, class_: str | None = None, **kwargs) -> air.Div:
     """Main markdown component that renders markdown content with theme integration.
-    
+
     Args:
         content: Markdown text to render
         class_: Additional CSS classes to apply
         **kwargs: Additional attributes to pass to the wrapper div
-        
+
     Returns:
         air.Div containing the rendered markdown HTML
     """
     # Render the markdown content
     html_content = _renderer.render(content)
-    
-    # Create the div with raw HTML content
-    if class_:
-        return air.Div(
-            air.RawHTML(html_content),
-            class_=class_,
-            **kwargs
-        )
-    else:
-        return air.Div(
-            air.RawHTML(html_content),
-            **kwargs
-        )
+
+    return air.Div(air.RawHTML(html_content), class_=class_, **kwargs)
 
 
 def MarkdownCSS() -> air.Link:
     """Returns a link tag to include the markdown CSS.
-    
+
     This should be included in the head of your document to ensure
     markdown styling is available.
-    
+
     Returns:
         air.Link element pointing to the markdown CSS file
     """
     return air.Link(
         rel="stylesheet",
         href="/eidos/plugins/markdown/css/markdown.css",
-        type="text/css"
-    )
+        type="text/css",
+    )

eidos/plugins/markdown/extensions/__init__.py

@@ -1 +1 @@
-# Markdown plugin extensions
+# Markdown plugin extensions

eidos/plugins/markdown/extensions/alerts.py

@@ -1,134 +1,124 @@
 """GitHub-style alerts extension for markdown"""
 
 import re
-from markdown.extensions import Extension
-from markdown.blockprocessors import BlockProcessor
 import xml.etree.ElementTree as etree
 from xml.etree.ElementTree import SubElement
 
+from markdown.blockprocessors import BlockProcessor
+from markdown.extensions import Extension
+
 
 class AlertBlockProcessor(BlockProcessor):
     """Process GitHub-style alert blocks"""
-    
+
     # Pattern to match > [!TYPE] at the start of a blockquote
-    RE_ALERT = re.compile(r'^> \[!(NOTE|TIP|IMPORTANT|WARNING|CAUTION)\]', re.MULTILINE)
-    
+    RE_ALERT = re.compile(r"^> \[!(NOTE|TIP|IMPORTANT|WARNING|CAUTION)\]", re.MULTILINE)
+
     # Alert type configurations
     ALERT_TYPES = {
-        'NOTE': {
-            'class': 'eidos-alert eidos-alert-info',
-            'icon': 'ℹ️',
-            'title': 'Note'
+        "NOTE": {"class": "eidos-alert eidos-alert-info", "icon": "ℹ️", "title": "Note"},
+        "TIP": {
+            "class": "eidos-alert eidos-alert-success",
+            "icon": "💡",
+            "title": "Tip",
         },
-        'TIP': {
-            'class': 'eidos-alert eidos-alert-success',
-            'icon': '💡',
-            'title': 'Tip'
+        "IMPORTANT": {
+            "class": "eidos-alert eidos-alert-warning",
+            "icon": "❗",
+            "title": "Important",
         },
-        'IMPORTANT': {
-            'class': 'eidos-alert eidos-alert-warning',
-            'icon': '❗',
-            'title': 'Important'
+        "WARNING": {
+            "class": "eidos-alert eidos-alert-warning",
+            "icon": "⚠️",
+            "title": "Warning",
         },
-        'WARNING': {
-            'class': 'eidos-alert eidos-alert-warning',
-            'icon': '⚠️',
-            'title': 'Warning'
+        "CAUTION": {
+            "class": "eidos-alert eidos-alert-error",
+            "icon": "🔴",
+            "title": "Caution",
         },
-        'CAUTION': {
-            'class': 'eidos-alert eidos-alert-error',
-            'icon': '🔴',
-            'title': 'Caution'
-        }
     }
-    
+
     def test(self, parent, block):
         """Test if the block is a GitHub-style alert"""
         return bool(self.RE_ALERT.match(block))
-    
+
     def run(self, parent, blocks):
         """Process the alert block"""
         block = blocks.pop(0)
-        
+
         # Extract alert type
         match = self.RE_ALERT.match(block)
         if not match:
             return False
-            
+
         alert_type = match.group(1)
-        alert_config = self.ALERT_TYPES.get(alert_type, self.ALERT_TYPES['NOTE'])
-        
+        alert_config = self.ALERT_TYPES.get(alert_type, self.ALERT_TYPES["NOTE"])
+
         # Create the alert container
-        alert_div = SubElement(parent, 'div')
-        alert_div.set('class', alert_config['class'])
-        
+        alert_div = SubElement(parent, "div")
+        alert_div.set("class", alert_config["class"])
+
         # Add the header with icon and title
-        header = SubElement(alert_div, 'div')
-        header.set('class', 'eidos-alert-header')
-        
-        icon_span = SubElement(header, 'span')
-        icon_span.set('class', 'eidos-alert-icon')
-        icon_span.text = alert_config['icon']
-        
-        title_span = SubElement(header, 'span')
-        title_span.set('class', 'eidos-alert-title')
-        title_span.text = alert_config['title']
-        
-        # Process the content
-        content_div = SubElement(alert_div, 'div')
-        content_div.set('class', 'eidos-alert-content')
-        
+        header = SubElement(alert_div, "div")
+        header.set("class", "eidos-alert-header")
+
+        icon_span = SubElement(header, "span")
+        icon_span.set("class", "eidos-alert-icon")
+        icon_span.text = alert_config["icon"]
+
+        title_span = SubElement(header, "span")
+        title_span.set("class", "eidos-alert-title")
+        title_span.text = alert_config["title"]
+
+        content_div = SubElement(alert_div, "div")
+        content_div.set("class", "eidos-alert-content")
+
         # Remove the alert marker and process the remaining content
-        content = self.RE_ALERT.sub('', block)
-        
-        # Handle multi-line content
-        lines = content.split('\n')
+        content = self.RE_ALERT.sub("", block)
+
+        lines = content.split("\n")
         processed_lines = []
-        
+
         for line in lines:
             # Remove leading '>' from each line
-            if line.startswith('>'):
+            if line.startswith(">"):
                 line = line[1:].lstrip()
             processed_lines.append(line)
-        
-        # Join the content and parse it
-        content_text = '\n'.join(processed_lines).strip()
-        
+
+        content_text = "\n".join(processed_lines).strip()
+
         # Parse the content as markdown
         if content_text:
-            # Create a temporary element to hold parsed content
-            temp_element = etree.Element('div')
+            temp_element = etree.Element("div")
             self.parser.parseBlocks(temp_element, [content_text])
-            
-            # Move all children to our content div
+
             for child in temp_element:
                 content_div.append(child)
-            
-            # If no children were added, add the text directly
+
             if len(content_div) == 0:
-                p = SubElement(content_div, 'p')
+                p = SubElement(content_div, "p")
                 p.text = content_text
-        
+
         # Continue processing subsequent blocks that might be part of the alert
-        while blocks and blocks[0].startswith('>'):
+        while blocks and blocks[0].startswith(">"):
             continuation = blocks.pop(0)
-            # Remove leading '>' and process
-            continuation_text = continuation[1:].lstrip() if continuation.startswith('>') else continuation
-            
+            continuation_text = continuation[1:].lstrip() if continuation.startswith(">") else continuation
+
             if continuation_text:
-                p = SubElement(content_div, 'p')
+                p = SubElement(content_div, "p")
                 p.text = continuation_text
-        
+
         return True
 
 
 class AlertExtension(Extension):
     """Add GitHub-style alerts to markdown"""
-    
+
     def extendMarkdown(self, md):
         """Add the alert processor to the markdown instance"""
         md.parser.blockprocessors.register(
             AlertBlockProcessor(md.parser),
-            'github_alerts',
-            175  # Priority - process before blockquote
-        )
+            "github_alerts",
+            175,  # Priority - process before blockquote
+        )

eidos/plugins/markdown/renderer.py

@@ -1,58 +1,53 @@
 """Core markdown rendering with theme integration"""
 
 import markdown
-from typing import Optional, List, Union
+
 from .extensions.alerts import AlertExtension
 
 
 class MarkdownRenderer:
     """Core markdown rendering with theme integration"""
-    
-    def __init__(self, extensions: Optional[List[Union[str, markdown.Extension]]] = None):
+
+    def __init__(self, extensions: list[str | markdown.Extension] | None = None):
         """Initialize the renderer with optional extensions.
-        
+
         Args:
             extensions: List of markdown extension names or instances to enable
         """
         self.extensions = extensions or []
         # Add some useful default extensions
         default_extensions = [
-            'fenced_code', 
-            'tables', 
-            'nl2br', 
-            'sane_lists',
-            AlertExtension()  # Add GitHub-style alerts
+            "fenced_code",
+            "tables",
+            "nl2br",
+            "sane_lists",
+            AlertExtension(),  # GitHub-style alerts
         ]
         self.extensions.extend(default_extensions)
-        
-        # Initialize the markdown processor
+
         self.md = markdown.Markdown(extensions=self.extensions)
-    
+
     def render(self, markdown_text: str) -> str:
         """Convert markdown to themed HTML.
-        
+
         Args:
             markdown_text: Raw markdown text to render
-            
+
         Returns:
             HTML string wrapped with eidos-md class for styling
         """
-        # Reset the markdown processor to clear any state
-        self.md.reset()
-        
-        # Convert markdown to HTML
+        self.md.reset()  # TODO: this is a hack to clear the state of the markdown processor
+
         html_content = self.md.convert(markdown_text)
-        
-        # Wrap in a div with our markdown class for styling
+
         return f'<div class="eidos-md">{html_content}</div>'
-    
+
     def add_extension(self, extension: str) -> None:
         """Add a markdown extension.
-        
+
         Args:
             extension: Name of the markdown extension to add
         """
         if extension not in self.extensions:
             self.extensions.append(extension)
-            # Recreate the markdown processor with new extensions
-            self.md = markdown.Markdown(extensions=self.extensions)
+            self.md = markdown.Markdown(extensions=self.extensions)

eidos/styles.py

@@ -6,16 +6,19 @@ Only includes classes that are actually defined in the CSS file.
 
 from typing import Final
 
+
 class Theme:
     """Theme-related CSS classes from styles.css."""
+
     body: Final[str] = "eidos-body"
 
+
 class Buttons:
     """Button-related CSS classes from styles.css."""
-    
+
     # Base button class (required for all buttons)
     base: Final[str] = "eidos-btn"
-    
+
     # Button variants
     primary: Final[str] = "eidos-btn-primary"
     secondary: Final[str] = "eidos-btn-secondary"
@@ -25,6 +28,7 @@ class Buttons:
     error: Final[str] = "eidos-btn-error"
     cta: Final[str] = "eidos-btn-cta"
 
+
 class Typography:
     """Typography-related CSS classes from styles.css."""
 
@@ -35,9 +39,7 @@ class Typography:
     h5: Final[str] = "eidos-h5"
     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"
@@ -47,34 +49,79 @@ class Semantic:
     var: Final[str] = "eidos-var"
     mark: Final[str] = "eidos-mark"
     time: Final[str] = "eidos-time"
-    
+
     # Code elements
     code: Final[str] = "eidos-code"
     pre: Final[str] = "eidos-pre"
     kbd: Final[str] = "eidos-kbd"
     samp: Final[str] = "eidos-samp"
-    
+
     # Structural elements
     blockquote: Final[str] = "eidos-blockquote"
     cite: Final[str] = "eidos-cite"
     address: Final[str] = "eidos-address"
     hr: Final[str] = "eidos-hr"
-    
+
     # Interactive elements
     details: Final[str] = "eidos-details"
     summary: Final[str] = "eidos-summary"
     details_content: Final[str] = "eidos-details-content"
-    
+
     # Definition list
     dl: Final[str] = "eidos-dl"
     dt: Final[str] = "eidos-dt"
     dd: Final[str] = "eidos-dd"
-    
+
     # Figure
     figure: Final[str] = "eidos-figure"
     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."""
+
+    # Base table class
+    table: Final[str] = "eidos-table"
+
+    # Table sections
+    thead: Final[str] = "eidos-thead"
+    tbody: Final[str] = "eidos-tbody"
+    tfoot: Final[str] = "eidos-tfoot"
+
+    # Table elements
+    tr: Final[str] = "eidos-tr"
+    th: Final[str] = "eidos-th"
+    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()