Class: BetterUi::General::Modal::ModalComponent

Inherits:
ViewComponent::Base
  • Object
show all
Defined in:
app/components/better_ui/general/modal/modal_component.rb

Constant Summary collapse

"fixed inset-0 z-50 flex items-center justify-center p-4 bg-black bg-opacity-50"
"relative bg-white shadow-xl w-full"
{
  default: "bg-gray-50 border-b border-gray-200 text-gray-900",
  white: "bg-white border-b border-gray-200 text-gray-900",
  red: "bg-red-50 border-b border-red-200 text-red-900",
  rose: "bg-rose-50 border-b border-rose-200 text-rose-900",
  orange: "bg-orange-50 border-b border-orange-200 text-orange-900",
  green: "bg-green-50 border-b border-green-200 text-green-900",
  blue: "bg-blue-50 border-b border-blue-200 text-blue-900",
  yellow: "bg-yellow-50 border-b border-yellow-200 text-yellow-900",
  violet: "bg-violet-50 border-b border-violet-200 text-violet-900"
}
{
  small: "max-w-sm",
  medium: "max-w-md",
  large: "max-w-2xl"
}
{
  none: "rounded-none",
  small: "rounded-md",
  medium: "rounded-lg",
  large: "rounded-xl",
  full: "rounded-full"
}

Instance Attribute Summary collapse

Instance Method Summary collapse

Constructor Details

#initialize(title:, theme: :default, size: :medium, rounded: :medium, backdrop: true, closable: true, classes: nil, **html_options) ⇒ ModalComponent

Inizializzazione del modal component



43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
# File 'app/components/better_ui/general/modal/modal_component.rb', line 43

def initialize(
  title:,
  theme: :default,
  size: :medium,
  rounded: :medium,
  backdrop: true,
  closable: true,
  classes: nil,
  **html_options
)
  @title = title
  @theme = theme.to_sym
  @size = size.to_sym
  @rounded = rounded.to_sym
  @backdrop = backdrop
  @closable = closable
  @classes = classes
  @html_options = html_options

  validate_params
end

Instance Attribute Details

#backdropObject (readonly)

Returns the value of attribute backdrop.



5
6
7
# File 'app/components/better_ui/general/modal/modal_component.rb', line 5

def backdrop
  @backdrop
end

#classesObject (readonly)

Returns the value of attribute classes.



5
6
7
# File 'app/components/better_ui/general/modal/modal_component.rb', line 5

def classes
  @classes
end

#closableObject (readonly)

Returns the value of attribute closable.



5
6
7
# File 'app/components/better_ui/general/modal/modal_component.rb', line 5

def closable
  @closable
end

#html_optionsObject (readonly)

Returns the value of attribute html_options.



5
6
7
# File 'app/components/better_ui/general/modal/modal_component.rb', line 5

def html_options
  @html_options
end

#sizeObject (readonly)

Returns the value of attribute size.



5
6
7
# File 'app/components/better_ui/general/modal/modal_component.rb', line 5

def size
  @size
end

#themeObject (readonly)

Returns the value of attribute theme.



5
6
7
# File 'app/components/better_ui/general/modal/modal_component.rb', line 5

def theme
  @theme
end

#titleObject (readonly)

Returns the value of attribute title.



5
6
7
# File 'app/components/better_ui/general/modal/modal_component.rb', line 5

def title
  @title
end

Instance Method Details

#backdrop_attributesObject

Restituisce gli attributi per il backdrop



102
103
104
105
106
107
# File 'app/components/better_ui/general/modal/modal_component.rb', line 102

def backdrop_attributes
  {
    class: backdrop_classes,
    'data-bui-modal-target': 'backdrop'
  }
end

#backdrop_classesObject

Combina tutte le classi per il backdrop



66
67
68
# File 'app/components/better_ui/general/modal/modal_component.rb', line 66

def backdrop_classes
  MODAL_BACKDROP_CLASSES
end

#container_attributesObject

Restituisce gli attributi per il contenitore



110
111
112
113
114
115
116
117
118
# File 'app/components/better_ui/general/modal/modal_component.rb', line 110

def container_attributes
  {
    class: container_classes,
    role: "dialog",
    "aria-modal": "true",
    "aria-labelledby": "modal-title",
    'data-bui-modal-target': 'container'
  }
end

#container_classesObject

Combina tutte le classi per il contenitore



71
72
73
74
75
76
77
78
79
# File 'app/components/better_ui/general/modal/modal_component.rb', line 71

def container_classes
  [
    MODAL_CONTAINER_CLASSES,
    get_modal_size_classes,
    get_modal_rounded_classes,
    @classes,
    @html_options[:class]
  ].compact.join(" ")
end

#get_modal_rounded_classesObject



97
98
99
# File 'app/components/better_ui/general/modal/modal_component.rb', line 97

def get_modal_rounded_classes
  MODAL_ROUNDED[@rounded] || MODAL_ROUNDED[:medium]
end

#get_modal_size_classesObject



93
94
95
# File 'app/components/better_ui/general/modal/modal_component.rb', line 93

def get_modal_size_classes
  MODAL_SIZES[@size] || MODAL_SIZES[:medium]
end

#get_modal_theme_classesObject



89
90
91
# File 'app/components/better_ui/general/modal/modal_component.rb', line 89

def get_modal_theme_classes
  MODAL_THEME[@theme] || MODAL_THEME[:default]
end

#header_attributesObject

Restituisce gli attributi per l’header



121
122
123
124
125
# File 'app/components/better_ui/general/modal/modal_component.rb', line 121

def header_attributes
  {
    class: header_classes
  }
end

#header_classesObject

Combina tutte le classi per l’header



82
83
84
85
86
87
# File 'app/components/better_ui/general/modal/modal_component.rb', line 82

def header_classes
  [
    "flex items-center justify-between p-6",
    get_modal_theme_classes
  ].compact.join(" ")
end

#render?Boolean

Verifica se rendere il componente

Returns:

  • (Boolean)


128
129
130
# File 'app/components/better_ui/general/modal/modal_component.rb', line 128

def render?
  @title.present?
end