Class EmptyStateLayout


public class EmptyStateLayout extends PageLayout<EmptyStateLayout>
A layout for empty state displays with icon, message, and action.

EmptyStateLayout provides a centered, visually appealing structure for displaying empty states such as "no data found", first-run experiences, search results with no matches, or any scenario where content is absent but user guidance is needed.

Structure:

 ┌──────────────────────────────────────┐
 │                                      │
 │            ┌────────┐                │
 │            │  Icon  │                │
 │            └────────┘                │
 │                                      │
 │           Primary Message            │
 │         Secondary Message            │
 │                                      │
 │           [ Action Button ]          │
 │                                      │
 └──────────────────────────────────────┘
 

Features:

  • Centered icon/illustration area
  • Primary and secondary message text
  • Optional action buttons
  • Configurable spacing and sizing
  • Fills parent or viewport

Usage:


 // Basic empty state
 EmptyStateLayout empty = new EmptyStateLayout();
 empty.icon(noDataIcon)
      .message("No students found")
      .action(addStudentBtn);

 // With description
 EmptyStateLayout empty = new EmptyStateLayout();
 empty.icon(searchIcon)
      .message("No results found")
      .description("Try adjusting your search criteria")
      .action(clearFiltersBtn);

 // Multiple actions
 EmptyStateLayout empty = new EmptyStateLayout();
 empty.icon(welcomeIcon)
      .message("Welcome!")
      .description("Get started by creating your first project")
      .actions(createProjectBtn, viewTutorialBtn);

 // Fill parent container
 empty.fillParent();
 
Since:
2025
Version:
1.0
Author:
Marvin P. Warble Jr.
See Also:
  • Constructor Details

    • EmptyStateLayout

      public EmptyStateLayout()
      Constructs an EmptyStateLayout with default configuration.
  • Method Details

    • initialize

      protected void initialize()
      Builds the element tree for the layout.
      Overrides:
      initialize in class StyledElement<EmptyStateLayout>
    • icon

      public EmptyStateLayout icon(Element<?> icon)
      Sets the icon or illustration.
      Parameters:
      icon - the icon element (image, SVG, icon component, etc.)
      Returns:
      this EmptyStateLayout for method chaining
    • message

      public EmptyStateLayout message(String message)
      Sets the primary message text.
      Parameters:
      message - the message text
      Returns:
      this EmptyStateLayout for method chaining
    • message

      public EmptyStateLayout message(Element<?> message)
      Sets the primary message element.
      Parameters:
      message - the message element
      Returns:
      this EmptyStateLayout for method chaining
    • description

      public EmptyStateLayout description(String description)
      Sets the secondary description text.
      Parameters:
      description - the description text
      Returns:
      this EmptyStateLayout for method chaining
    • description

      public EmptyStateLayout description(Element<?> description)
      Sets the secondary description element.
      Parameters:
      description - the description element
      Returns:
      this EmptyStateLayout for method chaining
    • action

      public EmptyStateLayout action(Element<?> action)
      Sets a single action button.
      Parameters:
      action - the action button element
      Returns:
      this EmptyStateLayout for method chaining
    • actions

      public EmptyStateLayout actions(Element<?>... actions)
      Sets multiple action buttons.
      Parameters:
      actions - the action button elements
      Returns:
      this EmptyStateLayout for method chaining
    • setMaxWidth

      public EmptyStateLayout setMaxWidth(int maxWidth)
      Sets the maximum width of the content container.
      Overrides:
      setMaxWidth in class StyledElement<EmptyStateLayout>
      Parameters:
      maxWidth - the max width in pixels
      Returns:
      this EmptyStateLayout for method chaining
    • setMaxWidth

      public EmptyStateLayout setMaxWidth(String maxWidth)
      Sets the maximum width of the content container.
      Overrides:
      setMaxWidth in class StyledElement<EmptyStateLayout>
      Parameters:
      maxWidth - the max width value (e.g., "400px", "50%")
      Returns:
      this EmptyStateLayout for method chaining
    • setContentPadding

      public EmptyStateLayout setContentPadding(int padding)
      Sets padding for the content container.
      Parameters:
      padding - the padding in pixels
      Returns:
      this EmptyStateLayout for method chaining
    • setContentPadding

      public EmptyStateLayout setContentPadding(String padding)
      Sets padding for the content container.
      Parameters:
      padding - the padding value (e.g., "32px", "2rem")
      Returns:
      this EmptyStateLayout for method chaining
    • setIconSpacing

      public EmptyStateLayout setIconSpacing(int spacing)
      Sets spacing below the icon.
      Parameters:
      spacing - the spacing in pixels
      Returns:
      this EmptyStateLayout for method chaining
    • setIconSpacing

      public EmptyStateLayout setIconSpacing(String spacing)
      Sets spacing below the icon.
      Parameters:
      spacing - the spacing value (e.g., "24px", "1.5rem")
      Returns:
      this EmptyStateLayout for method chaining
    • setMessageSpacing

      public EmptyStateLayout setMessageSpacing(int spacing)
      Sets spacing below the message.
      Parameters:
      spacing - the spacing in pixels
      Returns:
      this EmptyStateLayout for method chaining
    • setMessageSpacing

      public EmptyStateLayout setMessageSpacing(String spacing)
      Sets spacing below the message.
      Parameters:
      spacing - the spacing value (e.g., "8px", "0.5rem")
      Returns:
      this EmptyStateLayout for method chaining
    • setDescriptionSpacing

      public EmptyStateLayout setDescriptionSpacing(int spacing)
      Sets spacing below the description.
      Parameters:
      spacing - the spacing in pixels
      Returns:
      this EmptyStateLayout for method chaining
    • setDescriptionSpacing

      public EmptyStateLayout setDescriptionSpacing(String spacing)
      Sets spacing below the description.
      Parameters:
      spacing - the spacing value (e.g., "24px", "1.5rem")
      Returns:
      this EmptyStateLayout for method chaining
    • setActionsGap

      public EmptyStateLayout setActionsGap(int gap)
      Sets the gap between action buttons.
      Parameters:
      gap - the gap in pixels
      Returns:
      this EmptyStateLayout for method chaining
    • setActionsGap

      public EmptyStateLayout setActionsGap(String gap)
      Sets the gap between action buttons.
      Parameters:
      gap - the gap value (e.g., "12px", "1rem")
      Returns:
      this EmptyStateLayout for method chaining
    • setMessageColor

      public EmptyStateLayout setMessageColor(String color)
      Sets the message text color.
      Parameters:
      color - the text color
      Returns:
      this EmptyStateLayout for method chaining
    • setDescriptionColor

      public EmptyStateLayout setDescriptionColor(String color)
      Sets the description text color.
      Parameters:
      color - the text color
      Returns:
      this EmptyStateLayout for method chaining
    • getContainer

      public Div getContainer()
      Returns the container for advanced customization.
      Returns:
      the container div
    • getIconArea

      public Div getIconArea()
      Returns the icon area for advanced customization.
      Returns:
      the icon area div
    • getMessageArea

      public Div getMessageArea()
      Returns the message area for advanced customization.
      Returns:
      the message area div
    • getDescriptionArea

      public Div getDescriptionArea()
      Returns the description area for advanced customization.
      Returns:
      the description area div
    • getActionsArea

      public Div getActionsArea()
      Returns the actions area for advanced customization.
      Returns:
      the actions area div
    • noResults

      public EmptyStateLayout noResults()
      Configures the layout for a "no results" state (e.g., search returned nothing).
      Returns:
      this EmptyStateLayout for method chaining
    • noData

      public EmptyStateLayout noData()
      Configures the layout for a "no data" state (e.g., empty list/table).
      Returns:
      this EmptyStateLayout for method chaining
    • notFound

      public EmptyStateLayout notFound()
      Configures the layout for a "not found" state.
      Returns:
      this EmptyStateLayout for method chaining
    • welcome

      public EmptyStateLayout welcome()
      Configures the layout for a first-time/welcome experience.
      Returns:
      this EmptyStateLayout for method chaining
    • noMessages

      public EmptyStateLayout noMessages()
      Configures the layout for an inbox/messages empty state.
      Returns:
      this EmptyStateLayout for method chaining
    • noNotifications

      public EmptyStateLayout noNotifications()
      Configures the layout for a notifications empty state.
      Returns:
      this EmptyStateLayout for method chaining
    • messageAndDescription

      public EmptyStateLayout messageAndDescription(String message, String description)
      Sets both message and description in one call.
      Parameters:
      message - the primary message
      description - the secondary description
      Returns:
      this EmptyStateLayout for method chaining
    • setup

      public EmptyStateLayout setup(Element<?> icon, String message, String description)
      Sets icon, message, and description in one call.
      Parameters:
      icon - the icon element
      message - the primary message
      description - the secondary description
      Returns:
      this EmptyStateLayout for method chaining
    • compactStyle

      public EmptyStateLayout compactStyle()
      Applies compact spacing (smaller gaps between elements).
      Returns:
      this EmptyStateLayout for method chaining
    • spaciousStyle

      public EmptyStateLayout spaciousStyle()
      Applies spacious spacing (larger gaps between elements).
      Returns:
      this EmptyStateLayout for method chaining