abstract class Components::Component

Overview

Base class for all components Components are reusable, composable units built from HTML elements

Direct Known Subclasses

Defined in:

components/base/component.cr

Constructors

Macro Summary

Instance Method Summary

Constructor Detail

def self.new(**attrs) #

[View source]

Macro Detail

macro component_css(css_string) #

Macro for registering component-level CSS. CSS is stored as a class variable and registered with the global ComponentCSSRegistry when the class is first loaded.

Usage: class ButtonComponent < Components::StatelessComponent component_css <<-CSS .btn { display: inline-flex; align-items: center; } .btn-primary { background-color: var(--color-blue-500); } CSS end


[View source]

Instance Method Detail

def <<(child : Component | Elements::HTMLElement | String | Elements::RawHTML) : self #

Add a child to the component


[View source]
def [](name : String) : String | Nil #

Get an attribute value


[View source]
def []=(name : String, value : String) : String #

Set an attribute value


[View source]
def add_children(*children : Component | Elements::HTMLElement | String | Elements::RawHTML) : self #

Add multiple children


[View source]
def attributes : Hash(String, String) #

Component attributes (props)


[View source]
def build(&block : self -> Nil) : self #

Build content using a block


[View source]
def children : Array(Component | Elements::HTMLElement | String | Elements::RawHTML) #

Component children


[View source]
def component_id : String #

Unique identifier for this component instance


[View source]
def render : SafeHTML #

THE OUTPUT CONTRACT (docs/SAFE_HTML_V1.md). Every Component renders to SafeHTML, not String — this is the type-level boundary that makes "a component that hand-built unsafe markup and forgot to escape a sink" a thing the compiler catches at the response-sink type, rather than a thing a human has to notice at review time.

This delegates to #render_safe_content, which subclasses may override directly (the preferred, migrated path — see DataTableComponent for the exemplar). The default implementation bridges the legacy render_content : String path through the loud, greppable SafeHTML.unsafe escape hatch, so every existing hand-built component keeps compiling and running unchanged — but its output is now explicitly, auditably marked "not yet vouched for by the safe DSL." grep -rn 'reason: "legacy component' src/ finds every component still on this bridge; that grep result is the migration progress list.


[View source]
abstract def render_content : String #

Abstract method to be implemented by subclasses


[View source]
def render_safe_content : SafeHTML #

Override this in a migrated component to build SafeHTML directly via the Elements/tag DSL (escaped by construction) instead of hand-built String.build. See docs/SAFE_HTML_V1.md "migration guide".


[View source]
def to_raw_html : Elements::RawHTML #

Render the component as raw HTML (for adding to elements)


[View source]
def to_s(io : IO) : Nil #

Convert to string (alias for render)


[View source]