Class: UI::Sidebar

Inherits:
Phlex::HTML
  • Object
show all
Includes:
SidebarBehavior
Defined in:
app/components/ui/sidebar.rb

Overview

Sidebar - Phlex implementation

Main sidebar container with support for variants and collapsible modes. Must be used within a SidebarProvider.

Automatically renders a mobile Sheet version (hidden on md+) alongside the desktop sidebar (hidden below md), eliminating content duplication.

Examples:

Basic usage

render UI::Sidebar.new do
  render UI::Header.new { "Header" }
  render UI::Content.new { "Content" }
  render UI::Footer.new { "Footer" }
end

With variant

render UI::Sidebar.new(variant: "floating") do
  # ...
end

Instance Method Summary collapse

Methods included from SidebarBehavior

#sidebar_classes, #sidebar_data_attributes, #sidebar_html_attributes

Constructor Details

#initialize(variant: "sidebar", side: "left", collapsible: "icon", classes: "", **attributes) ⇒ Sidebar

Returns a new instance of Sidebar.

Parameters:

  • variant (String) (defaults to: "sidebar") —

    Visual variant: “sidebar” (default), “floating”, or “inset”

  • side (String) (defaults to: "left") —

    Side position: “left” or “right” (default: “left”)

  • collapsible (String) (defaults to: "icon") —

    Collapsible mode: “offcanvas”, “icon”, or “none” (default: “icon”)

  • classes (String) (defaults to: "") —

    Additional CSS classes

  • attributes (Hash) —

    Additional HTML attributes



30
31
32
33
34
35
36
37
38
39
40
41
42
 
# File 'app/components/ui/sidebar.rb', line 30

def initialize(
  variant: "sidebar",
  side: "left",
  collapsible: "icon",
  classes: "",
  **attributes
)
  @variant = variant
  @side = side
  @collapsible = collapsible
  @classes = classes
  @attributes = attributes
end

Instance Method Details

#view_template(&block) ⇒ Object 



44
45
46
47
48
49
50
 
# File 'app/components/ui/sidebar.rb', line 44

def view_template(&block)
  # Render mobile Sheet version (visible only below md breakpoint)
  render_mobile_sheet(&block)

  # Render desktop sidebar (visible only at md+ breakpoint)
  render_desktop_sidebar(&block)
end