daisyui_on_phlex 0.1.2 → 0.2.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/README.md +77 -7
- data/lib/daisyui_on_phlex/components/accordion.rb +59 -0
- data/lib/daisyui_on_phlex/components/avatar.rb +90 -0
- data/lib/daisyui_on_phlex/components/breadcrumbs.rb +27 -0
- data/lib/daisyui_on_phlex/components/calendar.rb +20 -0
- data/lib/daisyui_on_phlex/components/carousel.rb +37 -0
- data/lib/daisyui_on_phlex/components/chat.rb +54 -0
- data/lib/daisyui_on_phlex/components/checkbox.rb +64 -0
- data/lib/daisyui_on_phlex/components/collapse.rb +37 -0
- data/lib/daisyui_on_phlex/components/countdown.rb +20 -0
- data/lib/daisyui_on_phlex/components/diff.rb +27 -0
- data/lib/daisyui_on_phlex/components/divider.rb +20 -0
- data/lib/daisyui_on_phlex/components/dock.rb +33 -0
- data/lib/daisyui_on_phlex/components/drawer.rb +49 -0
- data/lib/daisyui_on_phlex/components/dropdown.rb +66 -0
- data/lib/daisyui_on_phlex/components/fieldset.rb +31 -0
- data/lib/daisyui_on_phlex/components/file_input.rb +69 -0
- data/lib/daisyui_on_phlex/components/filter.rb +34 -0
- data/lib/daisyui_on_phlex/components/footer.rb +32 -0
- data/lib/daisyui_on_phlex/components/hero.rb +28 -0
- data/lib/daisyui_on_phlex/components/indicator.rb +61 -0
- data/lib/daisyui_on_phlex/components/join.rb +24 -0
- data/lib/daisyui_on_phlex/components/kbd.rb +27 -0
- data/lib/daisyui_on_phlex/components/label.rb +23 -0
- data/lib/daisyui_on_phlex/components/link.rb +45 -0
- data/lib/daisyui_on_phlex/components/list.rb +19 -0
- data/lib/daisyui_on_phlex/components/loading.rb +36 -0
- data/lib/daisyui_on_phlex/components/mask.rb +42 -0
- data/lib/daisyui_on_phlex/components/menu.rb +60 -0
- data/lib/daisyui_on_phlex/components/mockup_browser.rb +25 -0
- data/lib/daisyui_on_phlex/components/mockup_code.rb +21 -0
- data/lib/daisyui_on_phlex/components/mockup_phone.rb +29 -0
- data/lib/daisyui_on_phlex/components/mockup_window.rb +29 -0
- data/lib/daisyui_on_phlex/components/navbar.rb +27 -0
- data/lib/daisyui_on_phlex/components/pagination.rb +56 -0
- data/lib/daisyui_on_phlex/components/progress.rb +50 -0
- data/lib/daisyui_on_phlex/components/radial_progress.rb +56 -0
- data/lib/daisyui_on_phlex/components/radio.rb +62 -0
- data/lib/daisyui_on_phlex/components/range.rb +62 -0
- data/lib/daisyui_on_phlex/components/rating.rb +61 -0
- data/lib/daisyui_on_phlex/components/select.rb +74 -0
- data/lib/daisyui_on_phlex/components/skeleton.rb +23 -0
- data/lib/daisyui_on_phlex/components/stack.rb +15 -0
- data/lib/daisyui_on_phlex/components/stat.rb +39 -0
- data/lib/daisyui_on_phlex/components/status.rb +34 -0
- data/lib/daisyui_on_phlex/components/steps.rb +42 -0
- data/lib/daisyui_on_phlex/components/swap.rb +45 -0
- data/lib/daisyui_on_phlex/components/tab.rb +72 -0
- data/lib/daisyui_on_phlex/components/table.rb +52 -0
- data/lib/daisyui_on_phlex/components/textarea.rb +66 -0
- data/lib/daisyui_on_phlex/components/theme_controller.rb +29 -0
- data/lib/daisyui_on_phlex/components/timeline.rb +52 -0
- data/lib/daisyui_on_phlex/components/toast.rb +56 -0
- data/lib/daisyui_on_phlex/components/toggle.rb +62 -0
- data/lib/daisyui_on_phlex/components/tooltip.rb +57 -0
- data/lib/daisyui_on_phlex/components/validator.rb +35 -0
- data/lib/daisyui_on_phlex/version.rb +1 -1
- metadata +56 -1
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: d94b605dc1bf46e2309c0f5301835ffdf8a05da8e5a0b0080c9648075b372b4b
|
4
|
+
data.tar.gz: b2ae9465060c594cc717001c3bf1a125ecc5e481163bab54e7cc81d75a32bf72
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 867e2b256c3b582b7ea260e9b38e76838e03eb12fe2e7a86f9e0714a84907b8a5759cc779e40103719a65ffb3352e3e7b7d1b476a8c0319c753e839cf86b5e62
|
7
|
+
data.tar.gz: 3c5e646525da907b3a2a832c36ee8321102e9aa2138e24ca369d9d48914614a41c6663210fb033364dd724896e7dc939b7415fbf34ce69b2622cbc043dc77bd2
|
data/README.md
CHANGED
@@ -164,16 +164,86 @@ render DaisyuiOnPhlex::Components::Input.new(
|
|
164
164
|
|
165
165
|
## Available Components
|
166
166
|
|
167
|
-
|
167
|
+
All 61+ DaisyUI components are now implemented as Phlex components:
|
168
168
|
|
169
|
+
### Actions
|
169
170
|
- **Button** - Interactive buttons with multiple variants and sizes
|
170
|
-
- **
|
171
|
-
- **
|
171
|
+
- **Dropdown** - Dropdown menus and popovers
|
172
|
+
- **Modal** - Overlay dialogs and modals
|
173
|
+
- **Swap** - Toggle between two states with animations
|
174
|
+
- **Theme Controller** - Theme switching controls
|
175
|
+
|
176
|
+
### Data Display
|
177
|
+
- **Accordion** - Collapsible content sections
|
178
|
+
- **Avatar** - User profile images with various styles
|
172
179
|
- **Badge** - Small status indicators and labels
|
173
|
-
- **
|
174
|
-
- **
|
175
|
-
|
176
|
-
|
180
|
+
- **Card** - Content containers with optional borders and layouts
|
181
|
+
- **Carousel** - Image and content sliders
|
182
|
+
- **Chat** - Chat bubble components for messaging interfaces
|
183
|
+
- **Collapse** - Collapsible content areas
|
184
|
+
- **Countdown** - Animated countdown displays
|
185
|
+
- **Kbd** - Keyboard shortcut styling
|
186
|
+
- **Stat** - Statistics display blocks
|
187
|
+
- **Table** - Data tables with sorting and styling
|
188
|
+
- **Timeline** - Chronological event displays
|
189
|
+
|
190
|
+
### Data Input
|
191
|
+
- **Checkbox** - Checkbox form controls
|
192
|
+
- **File Input** - File upload inputs with drag & drop
|
193
|
+
- **Input** - Text input fields with styling variants
|
194
|
+
- **Radio** - Radio button form controls
|
195
|
+
- **Range** - Range slider inputs
|
196
|
+
- **Rating** - Star rating components
|
197
|
+
- **Select** - Dropdown select inputs
|
198
|
+
- **Textarea** - Multi-line text inputs
|
199
|
+
- **Toggle** - Toggle switch controls
|
200
|
+
|
201
|
+
### Layout
|
202
|
+
- **Divider** - Visual content separators
|
203
|
+
- **Drawer** - Slide-out navigation panels
|
204
|
+
- **Footer** - Page footer sections
|
205
|
+
- **Hero** - Hero sections with backgrounds
|
206
|
+
- **Indicator** - Corner indicators and badges
|
207
|
+
- **Join** - Grouped elements with shared borders
|
208
|
+
- **Mask** - Image cropping with various shapes
|
209
|
+
- **Stack** - Layered element positioning
|
210
|
+
|
211
|
+
### Navigation
|
212
|
+
- **Breadcrumbs** - Navigation breadcrumb trails
|
213
|
+
- **Dock** - Bottom navigation bars
|
214
|
+
- **Link** - Styled hyperlinks
|
215
|
+
- **Menu** - Navigation menus and lists
|
216
|
+
- **Navbar** - Top navigation bars
|
217
|
+
- **Pagination** - Page navigation controls
|
218
|
+
- **Steps** - Step-by-step progress indicators
|
219
|
+
- **Tab** - Tabbed content interfaces
|
220
|
+
|
221
|
+
### Feedback
|
222
|
+
- **Alert** - Notification messages with different types
|
223
|
+
- **Loading** - Loading spinners and animations
|
224
|
+
- **Progress** - Progress bars
|
225
|
+
- **Radial Progress** - Circular progress indicators
|
226
|
+
- **Skeleton** - Loading state placeholders
|
227
|
+
- **Toast** - Temporary notification popups
|
228
|
+
- **Tooltip** - Hover information displays
|
229
|
+
|
230
|
+
### Mockups
|
231
|
+
- **Mockup Browser** - Browser window mockups
|
232
|
+
- **Mockup Code** - Code editor mockups
|
233
|
+
- **Mockup Phone** - Mobile device mockups
|
234
|
+
- **Mockup Window** - Desktop window mockups
|
235
|
+
|
236
|
+
### Utilities
|
237
|
+
- **Calendar** - Calendar styling support
|
238
|
+
- **Diff** - Side-by-side content comparison
|
239
|
+
- **Filter** - Filter controls for data
|
240
|
+
- **Fieldset** - Form field grouping
|
241
|
+
- **Label** - Form field labels
|
242
|
+
- **List** - Styled lists and menus
|
243
|
+
- **Status** - Status indicators
|
244
|
+
- **Validator** - Form validation styling
|
245
|
+
|
246
|
+
All components follow DaisyUI's design system and support the full range of variants, sizes, and styling options. Check the [DaisyUI documentation](https://daisyui.com/components/) for detailed usage examples and styling options.
|
177
247
|
|
178
248
|
## Component Options
|
179
249
|
|
@@ -0,0 +1,59 @@
|
|
1
|
+
# frozen_string_literal: true
|
2
|
+
|
3
|
+
module DaisyuiOnPhlex
|
4
|
+
module Components
|
5
|
+
class Accordion < DaisyuiOnPhlex::Base
|
6
|
+
def initialize(collapse: false, **attributes)
|
7
|
+
@collapse = collapse
|
8
|
+
@attributes = attributes
|
9
|
+
end
|
10
|
+
|
11
|
+
def view_template(&block)
|
12
|
+
div(
|
13
|
+
class: merge_classes("join", "join-vertical", "w-full", @attributes[:class]),
|
14
|
+
**@attributes.except(:class),
|
15
|
+
&block
|
16
|
+
)
|
17
|
+
end
|
18
|
+
|
19
|
+
def item(open: false, **attributes)
|
20
|
+
div(class: merge_classes("collapse", ("collapse-open" if open)), **attributes) do
|
21
|
+
yield AccordionItem.new
|
22
|
+
end
|
23
|
+
end
|
24
|
+
|
25
|
+
private
|
26
|
+
|
27
|
+
class AccordionItem
|
28
|
+
include Phlex::HTML
|
29
|
+
|
30
|
+
def title(**attributes, &block)
|
31
|
+
div(class: "collapse-title text-xl font-medium", **attributes, &block)
|
32
|
+
end
|
33
|
+
|
34
|
+
def content(**attributes, &block)
|
35
|
+
div(class: "collapse-content", **attributes, &block)
|
36
|
+
end
|
37
|
+
|
38
|
+
def checkbox(name:, **attributes)
|
39
|
+
input(
|
40
|
+
type: "checkbox",
|
41
|
+
name: name,
|
42
|
+
class: "collapse-checkbox",
|
43
|
+
**attributes
|
44
|
+
)
|
45
|
+
end
|
46
|
+
|
47
|
+
def radio(name:, value:, **attributes)
|
48
|
+
input(
|
49
|
+
type: "radio",
|
50
|
+
name: name,
|
51
|
+
value: value,
|
52
|
+
class: "collapse-radio",
|
53
|
+
**attributes
|
54
|
+
)
|
55
|
+
end
|
56
|
+
end
|
57
|
+
end
|
58
|
+
end
|
59
|
+
end
|
@@ -0,0 +1,90 @@
|
|
1
|
+
# frozen_string_literal: true
|
2
|
+
|
3
|
+
module DaisyuiOnPhlex
|
4
|
+
module Components
|
5
|
+
class Avatar < DaisyuiOnPhlex::Base
|
6
|
+
def initialize(size: :md, shape: :circle, online: nil, placeholder: false, **attributes)
|
7
|
+
@size = size
|
8
|
+
@shape = shape
|
9
|
+
@online = online
|
10
|
+
@placeholder = placeholder
|
11
|
+
@attributes = attributes
|
12
|
+
end
|
13
|
+
|
14
|
+
def view_template(&block)
|
15
|
+
div(class: avatar_classes, **@attributes) do
|
16
|
+
if @online
|
17
|
+
div(class: status_classes)
|
18
|
+
end
|
19
|
+
|
20
|
+
if @placeholder
|
21
|
+
div(class: placeholder_classes, &block)
|
22
|
+
else
|
23
|
+
div(class: image_classes, &block)
|
24
|
+
end
|
25
|
+
end
|
26
|
+
end
|
27
|
+
|
28
|
+
# Helper method that adds styling for initials
|
29
|
+
def initials(text, **attributes)
|
30
|
+
span(class: merge_classes("text-3xl", attributes[:class]), **attributes.except(:class)) { text }
|
31
|
+
end
|
32
|
+
|
33
|
+
private
|
34
|
+
|
35
|
+
def avatar_classes
|
36
|
+
classes = ["avatar"]
|
37
|
+
classes << "placeholder" if @placeholder
|
38
|
+
classes << "online" if @online == true
|
39
|
+
classes << "offline" if @online == false
|
40
|
+
merge_classes(*classes)
|
41
|
+
end
|
42
|
+
|
43
|
+
def image_classes
|
44
|
+
classes = ["w-24", "rounded-full"]
|
45
|
+
|
46
|
+
case @size
|
47
|
+
when :xs then classes = ["w-6", "rounded-full"]
|
48
|
+
when :sm then classes = ["w-8", "rounded-full"]
|
49
|
+
when :md then classes = ["w-12", "rounded-full"]
|
50
|
+
when :lg then classes = ["w-16", "rounded-full"]
|
51
|
+
when :xl then classes = ["w-20", "rounded-full"]
|
52
|
+
when :"2xl" then classes = ["w-24", "rounded-full"]
|
53
|
+
end
|
54
|
+
|
55
|
+
case @shape
|
56
|
+
when :square then classes[-1] = "rounded"
|
57
|
+
when :circle then # default rounded-full
|
58
|
+
end
|
59
|
+
|
60
|
+
merge_classes(*classes)
|
61
|
+
end
|
62
|
+
|
63
|
+
def placeholder_classes
|
64
|
+
classes = ["bg-neutral", "text-neutral-content", "rounded-full", "w-24"]
|
65
|
+
|
66
|
+
case @size
|
67
|
+
when :xs then classes[-1] = "w-6"
|
68
|
+
when :sm then classes[-1] = "w-8"
|
69
|
+
when :md then classes[-1] = "w-12"
|
70
|
+
when :lg then classes[-1] = "w-16"
|
71
|
+
when :xl then classes[-1] = "w-20"
|
72
|
+
when :"2xl" then classes[-1] = "w-24"
|
73
|
+
end
|
74
|
+
|
75
|
+
case @shape
|
76
|
+
when :square then classes[2] = "rounded"
|
77
|
+
when :circle then # default rounded-full
|
78
|
+
end
|
79
|
+
|
80
|
+
merge_classes(*classes)
|
81
|
+
end
|
82
|
+
|
83
|
+
def status_classes
|
84
|
+
classes = ["absolute", "top-0", "right-0", "w-3", "h-3", "border-2", "border-white", "rounded-full"]
|
85
|
+
classes << (@online ? "bg-green-400" : "bg-gray-400")
|
86
|
+
merge_classes(*classes)
|
87
|
+
end
|
88
|
+
end
|
89
|
+
end
|
90
|
+
end
|
@@ -0,0 +1,27 @@
|
|
1
|
+
# frozen_string_literal: true
|
2
|
+
|
3
|
+
module DaisyuiOnPhlex
|
4
|
+
module Components
|
5
|
+
class Breadcrumbs < DaisyuiOnPhlex::Base
|
6
|
+
def initialize(**attributes)
|
7
|
+
@attributes = attributes
|
8
|
+
end
|
9
|
+
|
10
|
+
def view_template(&block)
|
11
|
+
div(class: "text-sm breadcrumbs", **@attributes) do
|
12
|
+
ul(&block)
|
13
|
+
end
|
14
|
+
end
|
15
|
+
|
16
|
+
def item(href: nil, active: false, **attributes, &block)
|
17
|
+
li(**attributes) do
|
18
|
+
if href && !active
|
19
|
+
a(href: href, &block)
|
20
|
+
else
|
21
|
+
span(class: ("font-bold" if active), &block)
|
22
|
+
end
|
23
|
+
end
|
24
|
+
end
|
25
|
+
end
|
26
|
+
end
|
27
|
+
end
|
@@ -0,0 +1,20 @@
|
|
1
|
+
# frozen_string_literal: true
|
2
|
+
|
3
|
+
module DaisyuiOnPhlex
|
4
|
+
module Components
|
5
|
+
class Calendar < DaisyuiOnPhlex::Base
|
6
|
+
def initialize(compact: false, **attributes)
|
7
|
+
@compact = compact
|
8
|
+
@attributes = attributes
|
9
|
+
end
|
10
|
+
|
11
|
+
def view_template(&block)
|
12
|
+
div(
|
13
|
+
class: merge_classes("calendar", ("calendar-compact" if @compact), @attributes[:class]),
|
14
|
+
**@attributes.except(:class),
|
15
|
+
&block
|
16
|
+
)
|
17
|
+
end
|
18
|
+
end
|
19
|
+
end
|
20
|
+
end
|
@@ -0,0 +1,37 @@
|
|
1
|
+
# frozen_string_literal: true
|
2
|
+
|
3
|
+
module DaisyuiOnPhlex
|
4
|
+
module Components
|
5
|
+
class Carousel < DaisyuiOnPhlex::Base
|
6
|
+
def initialize(center: false, end: false, vertical: false, **attributes)
|
7
|
+
@center = center
|
8
|
+
@end = end
|
9
|
+
@vertical = vertical
|
10
|
+
@attributes = attributes
|
11
|
+
end
|
12
|
+
|
13
|
+
def view_template(&block)
|
14
|
+
div(class: carousel_classes, **@attributes, &block)
|
15
|
+
end
|
16
|
+
|
17
|
+
def item(id: nil, **attributes, &block)
|
18
|
+
div(
|
19
|
+
class: "carousel-item",
|
20
|
+
id: id,
|
21
|
+
**attributes,
|
22
|
+
&block
|
23
|
+
)
|
24
|
+
end
|
25
|
+
|
26
|
+
private
|
27
|
+
|
28
|
+
def carousel_classes
|
29
|
+
classes = ["carousel"]
|
30
|
+
classes << "carousel-center" if @center
|
31
|
+
classes << "carousel-end" if @end
|
32
|
+
classes << "carousel-vertical" if @vertical
|
33
|
+
merge_classes(*classes)
|
34
|
+
end
|
35
|
+
end
|
36
|
+
end
|
37
|
+
end
|
@@ -0,0 +1,54 @@
|
|
1
|
+
# frozen_string_literal: true
|
2
|
+
|
3
|
+
module DaisyuiOnPhlex
|
4
|
+
module Components
|
5
|
+
class Chat < DaisyuiOnPhlex::Base
|
6
|
+
def initialize(position: :start, **attributes)
|
7
|
+
@position = position
|
8
|
+
@attributes = attributes
|
9
|
+
end
|
10
|
+
|
11
|
+
def view_template(&block)
|
12
|
+
div(class: chat_classes, **@attributes, &block)
|
13
|
+
end
|
14
|
+
|
15
|
+
def image(src:, alt: "", **attributes)
|
16
|
+
div(class: "chat-image avatar") do
|
17
|
+
div(class: "w-10 rounded-full") do
|
18
|
+
img(src: src, alt: alt, **attributes)
|
19
|
+
end
|
20
|
+
end
|
21
|
+
end
|
22
|
+
|
23
|
+
def header(time: nil, **attributes, &block)
|
24
|
+
div(class: merge_classes("chat-header", attributes[:class]), **attributes.except(:class)) do
|
25
|
+
yield if block_given?
|
26
|
+
if time
|
27
|
+
time_tag(time, class: "text-xs opacity-50") { time }
|
28
|
+
end
|
29
|
+
end
|
30
|
+
end
|
31
|
+
|
32
|
+
def bubble(**attributes, &block)
|
33
|
+
div(class: merge_classes("chat-bubble", attributes[:class]), **attributes.except(:class), &block)
|
34
|
+
end
|
35
|
+
|
36
|
+
def footer(**attributes, &block)
|
37
|
+
div(class: merge_classes("chat-footer", "opacity-50", attributes[:class]), **attributes.except(:class), &block)
|
38
|
+
end
|
39
|
+
|
40
|
+
private
|
41
|
+
|
42
|
+
def chat_classes
|
43
|
+
classes = ["chat"]
|
44
|
+
|
45
|
+
case @position
|
46
|
+
when :start then classes << "chat-start"
|
47
|
+
when :end then classes << "chat-end"
|
48
|
+
end
|
49
|
+
|
50
|
+
merge_classes(*classes)
|
51
|
+
end
|
52
|
+
end
|
53
|
+
end
|
54
|
+
end
|
@@ -0,0 +1,64 @@
|
|
1
|
+
# frozen_string_literal: true
|
2
|
+
|
3
|
+
module DaisyuiOnPhlex
|
4
|
+
module Components
|
5
|
+
class Checkbox < DaisyuiOnPhlex::Base
|
6
|
+
def initialize(
|
7
|
+
variant: nil,
|
8
|
+
size: :md,
|
9
|
+
checked: false,
|
10
|
+
disabled: false,
|
11
|
+
name: nil,
|
12
|
+
value: nil,
|
13
|
+
**attributes
|
14
|
+
)
|
15
|
+
@variant = variant
|
16
|
+
@size = size
|
17
|
+
@checked = checked
|
18
|
+
@disabled = disabled
|
19
|
+
@name = name
|
20
|
+
@value = value
|
21
|
+
@attributes = attributes
|
22
|
+
end
|
23
|
+
|
24
|
+
def view_template
|
25
|
+
input(
|
26
|
+
type: "checkbox",
|
27
|
+
class: checkbox_classes,
|
28
|
+
checked: @checked,
|
29
|
+
disabled: @disabled,
|
30
|
+
name: @name,
|
31
|
+
value: @value,
|
32
|
+
**@attributes
|
33
|
+
)
|
34
|
+
end
|
35
|
+
|
36
|
+
private
|
37
|
+
|
38
|
+
def checkbox_classes
|
39
|
+
classes = ["checkbox"]
|
40
|
+
|
41
|
+
# Variant classes
|
42
|
+
case @variant
|
43
|
+
when :primary then classes << "checkbox-primary"
|
44
|
+
when :secondary then classes << "checkbox-secondary"
|
45
|
+
when :accent then classes << "checkbox-accent"
|
46
|
+
when :success then classes << "checkbox-success"
|
47
|
+
when :warning then classes << "checkbox-warning"
|
48
|
+
when :info then classes << "checkbox-info"
|
49
|
+
when :error then classes << "checkbox-error"
|
50
|
+
end
|
51
|
+
|
52
|
+
# Size classes
|
53
|
+
case @size
|
54
|
+
when :xs then classes << "checkbox-xs"
|
55
|
+
when :sm then classes << "checkbox-sm"
|
56
|
+
when :md then classes << "checkbox-md"
|
57
|
+
when :lg then classes << "checkbox-lg"
|
58
|
+
end
|
59
|
+
|
60
|
+
merge_classes(*classes)
|
61
|
+
end
|
62
|
+
end
|
63
|
+
end
|
64
|
+
end
|
@@ -0,0 +1,37 @@
|
|
1
|
+
# frozen_string_literal: true
|
2
|
+
|
3
|
+
module DaisyuiOnPhlex
|
4
|
+
module Components
|
5
|
+
class Collapse < DaisyuiOnPhlex::Base
|
6
|
+
def initialize(open: false, arrow: false, plus: false, **attributes)
|
7
|
+
@open = open
|
8
|
+
@arrow = arrow
|
9
|
+
@plus = plus
|
10
|
+
@attributes = attributes
|
11
|
+
end
|
12
|
+
|
13
|
+
def view_template(&block)
|
14
|
+
details(
|
15
|
+
class: merge_classes(
|
16
|
+
"collapse",
|
17
|
+
("collapse-arrow" if @arrow),
|
18
|
+
("collapse-plus" if @plus),
|
19
|
+
("collapse-open" if @open),
|
20
|
+
@attributes[:class]
|
21
|
+
),
|
22
|
+
open: @open,
|
23
|
+
**@attributes.except(:class),
|
24
|
+
&block
|
25
|
+
)
|
26
|
+
end
|
27
|
+
|
28
|
+
def title(**attributes, &block)
|
29
|
+
summary(class: merge_classes("collapse-title", attributes[:class]), **attributes.except(:class), &block)
|
30
|
+
end
|
31
|
+
|
32
|
+
def content(**attributes, &block)
|
33
|
+
div(class: merge_classes("collapse-content", attributes[:class]), **attributes.except(:class), &block)
|
34
|
+
end
|
35
|
+
end
|
36
|
+
end
|
37
|
+
end
|
@@ -0,0 +1,20 @@
|
|
1
|
+
# frozen_string_literal: true
|
2
|
+
|
3
|
+
module DaisyuiOnPhlex
|
4
|
+
module Components
|
5
|
+
class Countdown < DaisyuiOnPhlex::Base
|
6
|
+
def initialize(value:, **attributes)
|
7
|
+
@value = value
|
8
|
+
@attributes = attributes
|
9
|
+
end
|
10
|
+
|
11
|
+
def view_template
|
12
|
+
span(
|
13
|
+
class: "countdown font-mono text-2xl",
|
14
|
+
style: "--value: #{@value};",
|
15
|
+
**@attributes
|
16
|
+
)
|
17
|
+
end
|
18
|
+
end
|
19
|
+
end
|
20
|
+
end
|
@@ -0,0 +1,27 @@
|
|
1
|
+
# frozen_string_literal: true
|
2
|
+
|
3
|
+
module DaisyuiOnPhlex
|
4
|
+
module Components
|
5
|
+
class Diff < DaisyuiOnPhlex::Base
|
6
|
+
def initialize(**attributes)
|
7
|
+
@attributes = attributes
|
8
|
+
end
|
9
|
+
|
10
|
+
def view_template(&block)
|
11
|
+
div(class: "diff aspect-[16/9]", **@attributes, &block)
|
12
|
+
end
|
13
|
+
|
14
|
+
def item_1(**attributes, &block)
|
15
|
+
div(class: "diff-item-1", **attributes, &block)
|
16
|
+
end
|
17
|
+
|
18
|
+
def item_2(**attributes, &block)
|
19
|
+
div(class: "diff-item-2", **attributes, &block)
|
20
|
+
end
|
21
|
+
|
22
|
+
def resizer
|
23
|
+
div(class: "diff-resizer")
|
24
|
+
end
|
25
|
+
end
|
26
|
+
end
|
27
|
+
end
|
@@ -0,0 +1,20 @@
|
|
1
|
+
# frozen_string_literal: true
|
2
|
+
|
3
|
+
module DaisyuiOnPhlex
|
4
|
+
module Components
|
5
|
+
class Divider < DaisyuiOnPhlex::Base
|
6
|
+
def initialize(vertical: false, **attributes)
|
7
|
+
@vertical = vertical
|
8
|
+
@attributes = attributes
|
9
|
+
end
|
10
|
+
|
11
|
+
def view_template(&block)
|
12
|
+
div(
|
13
|
+
class: merge_classes("divider", ("divider-horizontal" if @vertical), @attributes[:class]),
|
14
|
+
**@attributes.except(:class),
|
15
|
+
&block
|
16
|
+
)
|
17
|
+
end
|
18
|
+
end
|
19
|
+
end
|
20
|
+
end
|
@@ -0,0 +1,33 @@
|
|
1
|
+
# frozen_string_literal: true
|
2
|
+
|
3
|
+
module DaisyuiOnPhlex
|
4
|
+
module Components
|
5
|
+
class Dock < DaisyuiOnPhlex::Base
|
6
|
+
def initialize(**attributes)
|
7
|
+
@attributes = attributes
|
8
|
+
end
|
9
|
+
|
10
|
+
def view_template(&block)
|
11
|
+
div(class: "btm-nav", **@attributes, &block)
|
12
|
+
end
|
13
|
+
|
14
|
+
def item(active: false, disabled: false, **attributes, &block)
|
15
|
+
button(
|
16
|
+
class: dock_item_classes(active: active, disabled: disabled),
|
17
|
+
disabled: disabled,
|
18
|
+
**attributes,
|
19
|
+
&block
|
20
|
+
)
|
21
|
+
end
|
22
|
+
|
23
|
+
private
|
24
|
+
|
25
|
+
def dock_item_classes(active:, disabled:)
|
26
|
+
classes = []
|
27
|
+
classes << "active" if active
|
28
|
+
classes << "disabled" if disabled
|
29
|
+
merge_classes(*classes)
|
30
|
+
end
|
31
|
+
end
|
32
|
+
end
|
33
|
+
end
|
@@ -0,0 +1,49 @@
|
|
1
|
+
# frozen_string_literal: true
|
2
|
+
|
3
|
+
module DaisyuiOnPhlex
|
4
|
+
module Components
|
5
|
+
class Drawer < DaisyuiOnPhlex::Base
|
6
|
+
def initialize(end: false, **attributes)
|
7
|
+
@end = end
|
8
|
+
@attributes = attributes
|
9
|
+
end
|
10
|
+
|
11
|
+
def view_template(&block)
|
12
|
+
div(class: "drawer", **@attributes, &block)
|
13
|
+
end
|
14
|
+
|
15
|
+
def toggle(id:, **attributes)
|
16
|
+
input(
|
17
|
+
id: id,
|
18
|
+
type: "checkbox",
|
19
|
+
class: "drawer-toggle",
|
20
|
+
**attributes
|
21
|
+
)
|
22
|
+
end
|
23
|
+
|
24
|
+
def content(**attributes, &block)
|
25
|
+
div(class: "drawer-content", **attributes, &block)
|
26
|
+
end
|
27
|
+
|
28
|
+
def side(**attributes, &block)
|
29
|
+
div(class: drawer_side_classes, **attributes, &block)
|
30
|
+
end
|
31
|
+
|
32
|
+
def overlay(for_id:, **attributes)
|
33
|
+
label(
|
34
|
+
for: for_id,
|
35
|
+
class: "drawer-overlay",
|
36
|
+
**attributes
|
37
|
+
)
|
38
|
+
end
|
39
|
+
|
40
|
+
private
|
41
|
+
|
42
|
+
def drawer_side_classes
|
43
|
+
classes = ["drawer-side"]
|
44
|
+
classes << "drawer-end" if @end
|
45
|
+
merge_classes(*classes)
|
46
|
+
end
|
47
|
+
end
|
48
|
+
end
|
49
|
+
end
|