element_component 0.8.0 → 0.10.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/AGENTS.md +92 -11
- data/README.md +5 -0
- data/lib/element_component/element.rb +6 -3
- data/lib/element_component/version.rb +1 -1
- metadata +1 -1
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: 85eed5018abeec014030f5b5e766bd15bb22485e1e085071350829d9dd8979c6
|
|
4
|
+
data.tar.gz: 65e106b1cb82eab8c0db53e65b09c396e5a85a16cffd8f46d548938503c6b122
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 40a635e98231ea288f2a865889f8a4814a2d6bd1d9fa37359320267bf506197049c615b90ee7719a8c5adbf76c984377330310904392e1b66c26f75082657377
|
|
7
|
+
data.tar.gz: 0fdfafc6cb4933a1e56704d35befb3b933c253d9d888c34fd09ad243367806dd31a4cdebeb6985b05923ccc4874953ac0c890fcc439c415b785275683a4cb7b6
|
data/AGENTS.md
CHANGED
|
@@ -18,12 +18,82 @@ lib/
|
|
|
18
18
|
heading.rb # AlertHeading component
|
|
19
19
|
link.rb # AlertLink component
|
|
20
20
|
close_button.rb # AlertCloseButton component
|
|
21
|
+
badge.rb # Badge component
|
|
22
|
+
breadcrumb.rb # Breadcrumb component
|
|
23
|
+
breadcrumb/
|
|
24
|
+
item.rb # BreadcrumbItem component
|
|
25
|
+
button.rb # Button component
|
|
26
|
+
button_group.rb # ButtonGroup component
|
|
27
|
+
card.rb # Card component
|
|
28
|
+
card/
|
|
29
|
+
header.rb # CardHeader component
|
|
30
|
+
body.rb # CardBody component
|
|
31
|
+
footer.rb # CardFooter component
|
|
32
|
+
title.rb # CardTitle component
|
|
33
|
+
text.rb # CardText component
|
|
34
|
+
image.rb # CardImage component
|
|
35
|
+
carousel.rb # Carousel component
|
|
36
|
+
carousel/
|
|
37
|
+
item.rb # CarouselItem component
|
|
38
|
+
caption.rb # CarouselCaption component
|
|
39
|
+
close_button.rb # CloseButton component
|
|
40
|
+
dropdown.rb # Dropdown component
|
|
41
|
+
dropdown/
|
|
42
|
+
menu.rb # DropdownMenu component
|
|
43
|
+
item.rb # DropdownItem component
|
|
44
|
+
divider.rb # DropdownDivider component
|
|
45
|
+
header.rb # DropdownHeader component
|
|
46
|
+
list_group.rb # ListGroup component
|
|
47
|
+
list_group/
|
|
48
|
+
item.rb # ListGroupItem component
|
|
49
|
+
modal.rb # Modal component
|
|
50
|
+
modal/
|
|
51
|
+
dialog.rb # ModalDialog component
|
|
52
|
+
content.rb # ModalContent component
|
|
53
|
+
header.rb # ModalHeader component
|
|
54
|
+
title.rb # ModalTitle component
|
|
55
|
+
body.rb # ModalBody component
|
|
56
|
+
footer.rb # ModalFooter component
|
|
57
|
+
nav.rb # Nav component
|
|
58
|
+
nav/
|
|
59
|
+
item.rb # NavItem component
|
|
60
|
+
link.rb # NavLink component
|
|
61
|
+
navbar.rb # Navbar component
|
|
62
|
+
navbar/
|
|
63
|
+
brand.rb # NavbarBrand component
|
|
64
|
+
toggler.rb # NavbarToggler component
|
|
65
|
+
collapse.rb # NavbarCollapse component
|
|
66
|
+
nav.rb # NavbarNav component
|
|
67
|
+
pagination.rb # Pagination component
|
|
68
|
+
pagination/
|
|
69
|
+
item.rb # PageItem component
|
|
70
|
+
progress.rb # Progress component
|
|
71
|
+
progress/
|
|
72
|
+
bar.rb # ProgressBar component
|
|
73
|
+
spinner.rb # Spinner component
|
|
74
|
+
table.rb # Table component
|
|
21
75
|
spec/
|
|
22
76
|
element_component_spec.rb # Version check
|
|
23
77
|
lib/
|
|
24
78
|
element_spec.rb # Element unit tests
|
|
25
79
|
components/
|
|
26
80
|
alert_spec.rb # Alert component tests
|
|
81
|
+
badge_spec.rb # Badge component tests
|
|
82
|
+
breadcrumb_spec.rb # Breadcrumb component tests
|
|
83
|
+
button_spec.rb # Button component tests
|
|
84
|
+
button_group_spec.rb # ButtonGroup component tests
|
|
85
|
+
card_spec.rb # Card component tests
|
|
86
|
+
carousel_spec.rb # Carousel component tests
|
|
87
|
+
close_button_spec.rb # CloseButton component tests
|
|
88
|
+
dropdown_spec.rb # Dropdown component tests
|
|
89
|
+
list_group_spec.rb # ListGroup component tests
|
|
90
|
+
modal_spec.rb # Modal component tests
|
|
91
|
+
nav_spec.rb # Nav component tests
|
|
92
|
+
navbar_spec.rb # Navbar component tests
|
|
93
|
+
pagination_spec.rb # Pagination component tests
|
|
94
|
+
progress_spec.rb # Progress component tests
|
|
95
|
+
spinner_spec.rb # Spinner component tests
|
|
96
|
+
table_spec.rb # Table component tests
|
|
27
97
|
spec_helper.rb # RSpec config
|
|
28
98
|
examples/
|
|
29
99
|
alert_example.rb # Complete Alert usage examples
|
|
@@ -34,7 +104,7 @@ examples/
|
|
|
34
104
|
### `ElementComponent::Element`
|
|
35
105
|
- **Attributes**: `element` (tag name), `attributes` (Hash), `contents` (Array), `html` (rendered output)
|
|
36
106
|
- **Constructor**: `Element.new(tag_name, closing_tag: true, **attributes)`
|
|
37
|
-
- **Content methods**: `add_content`, `add_content!`, `add_content(&block)`
|
|
107
|
+
- **Content methods**: `add_content`, `add_content!`, `add_content(&block)` — `content` can be a single value or an Array of values
|
|
38
108
|
- **Attribute methods**: `add_attribute`, `add_attribute!`, `remove_attribute`, `remove_attribute_value`
|
|
39
109
|
- **Render**: `render` (with hooks: `before_render`, `after_render`, `around_render`)
|
|
40
110
|
|
|
@@ -42,12 +112,25 @@ examples/
|
|
|
42
112
|
|
|
43
113
|
Components live under `ElementComponent::Components`. Each component folder contains the main class and its sub-components in separate files.
|
|
44
114
|
|
|
45
|
-
| Component | Class |
|
|
46
|
-
|
|
47
|
-
| Alert | `
|
|
48
|
-
|
|
|
49
|
-
|
|
|
50
|
-
|
|
|
115
|
+
| Component | Class | Tag | Key Options |
|
|
116
|
+
|---|---|---|---|
|
|
117
|
+
| Alert | `Alert` | `<div>` | `variant`, `dismissible` |
|
|
118
|
+
| Badge | `Badge` | `<span>` | `variant`, `pill` |
|
|
119
|
+
| Breadcrumb | `Breadcrumb` | `<nav>` → `<ol>` | `BreadcrumbItem` (`href`, `active`) |
|
|
120
|
+
| Button | `Button` | `<button>` / `<a>` | `variant`, `outline`, `size`, `href` |
|
|
121
|
+
| ButtonGroup | `ButtonGroup` | `<div>` | `size`, `vertical` |
|
|
122
|
+
| Card | `Card` | `<div>` | Sub-components: Header, Body, Footer, Title, Text, Image |
|
|
123
|
+
| Carousel | `Carousel` | `<div>` | `fade`, `indicators`, `controls`; `CarouselItem`, `CarouselCaption` |
|
|
124
|
+
| CloseButton | `CloseButton` | `<button>` (self-closing) | `disabled` |
|
|
125
|
+
| Dropdown | `Dropdown` | `<div>` | `direction`; `DropdownMenu`, `DropdownItem`, `DropdownDivider`, `DropdownHeader` |
|
|
126
|
+
| ListGroup | `ListGroup` | `<ul>` | `flush`, `numbered`; `ListGroupItem` (`variant`, `active`, `disabled`, `href`) |
|
|
127
|
+
| Modal | `Modal` | `<div>` | `fade`, `static`, `scrollable`, `centered`, `size`; `ModalContent`, `ModalHeader`, `ModalBody`, `ModalFooter` |
|
|
128
|
+
| Nav | `Nav` | `<ul>` | `type` (tabs/pills/underline), `fill`, `justified`, `vertical` |
|
|
129
|
+
| Navbar | `Navbar` | `<nav>` | `expand`, `theme`, `background`, `fixed`, `sticky`; `NavbarBrand`, `NavbarNav`, `NavbarToggler` |
|
|
130
|
+
| Pagination | `Pagination` | `<nav>` → `<ul>` | `size`; `PageItem` (`active`, `disabled`) |
|
|
131
|
+
| Progress | `Progress` | `<div>` | `ProgressBar` (`value`, `variant`, `striped`, `animated`) |
|
|
132
|
+
| Spinner | `Spinner` | `<div>` | `type` (border/grow), `variant` |
|
|
133
|
+
| Table | `Table` | `<table>` | `striped`, `bordered`, `hover`, `small`, `variant` |
|
|
51
134
|
|
|
52
135
|
**Alert constructor**: `Alert.new(variant: :primary, dismissible: false, **attributes, &block)`
|
|
53
136
|
- `variant`: one of `:primary`, `:secondary`, `:success`, `:danger`, `:warning`, `:info`, `:light`, `:dark`
|
|
@@ -113,7 +196,8 @@ ruby examples/alert_example.rb # Run Alert examples
|
|
|
113
196
|
## Key Design Decisions
|
|
114
197
|
|
|
115
198
|
- Attributes stored as Hash of Symbol => Array of values (supports multiple values per attribute)
|
|
116
|
-
- Contents stored as Array (supports strings, Elements,
|
|
199
|
+
- Contents stored as Array (supports strings, Elements, Procs/blocks, and Arrays of any of these)
|
|
200
|
+
- `add_content(content)` accepts a single value or an Array; Arrays are spread into `@contents`
|
|
117
201
|
- `!` suffix methods reset state before adding (e.g., `add_content!` clears then adds)
|
|
118
202
|
- Hooks (`before_render`, `after_render`, `around_render`) are optional, detected via `respond_to?`
|
|
119
203
|
- Self-closing tags controlled by `closing_tag:` parameter
|
|
@@ -121,6 +205,3 @@ ruby examples/alert_example.rb # Run Alert examples
|
|
|
121
205
|
|
|
122
206
|
## Roadmap Features (from README)
|
|
123
207
|
- Caching support
|
|
124
|
-
- Pre-built Bulma components
|
|
125
|
-
- Pre-built Bootstrap components
|
|
126
|
-
- Enhanced DSL for nested structures
|
data/README.md
CHANGED
|
@@ -80,6 +80,11 @@ div.add_content { |e| e.new_element("em") { |em| em.add_content("deferred") } }
|
|
|
80
80
|
|
|
81
81
|
puts div.render
|
|
82
82
|
# => <div>plain text<span>nested</span><em>deferred</em></div>
|
|
83
|
+
|
|
84
|
+
# Array of content
|
|
85
|
+
div.add_content(["Hello ", ElementComponent::Element.new("strong") { |s| s.add_content("World") }, "!"])
|
|
86
|
+
puts div.render
|
|
87
|
+
# => <div>Hello <strong>World</strong>!</div>
|
|
83
88
|
```
|
|
84
89
|
|
|
85
90
|
### Attribute Management
|
|
@@ -4,25 +4,28 @@ module ElementComponent
|
|
|
4
4
|
class Element
|
|
5
5
|
attr_reader :element, :attributes, :contents, :html
|
|
6
6
|
|
|
7
|
-
def initialize(element, closing_tag: true, **attribute, &block)
|
|
7
|
+
def initialize(element, content = nil, closing_tag: true, **attribute, &block)
|
|
8
8
|
@element = element
|
|
9
9
|
@closing_tag = closing_tag
|
|
10
10
|
@html = String.new
|
|
11
11
|
|
|
12
12
|
add_attribute!(attribute)
|
|
13
13
|
reset_contents!
|
|
14
|
+
add_content(content) if content
|
|
14
15
|
block&.call(self)
|
|
15
16
|
end
|
|
16
17
|
|
|
17
|
-
def add_content!(content)
|
|
18
|
+
def add_content!(content = nil, &)
|
|
18
19
|
reset_contents!
|
|
19
20
|
|
|
20
|
-
add_content(content)
|
|
21
|
+
add_content(content, &)
|
|
21
22
|
end
|
|
22
23
|
|
|
23
24
|
def add_content(content = nil, &block)
|
|
24
25
|
if block_given?
|
|
25
26
|
@contents.push(block)
|
|
27
|
+
elsif content.is_a?(Array)
|
|
28
|
+
@contents.push(*content)
|
|
26
29
|
else
|
|
27
30
|
@contents.push(content)
|
|
28
31
|
end
|