-
Notifications
You must be signed in to change notification settings - Fork 4
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
1 parent
a786bc6
commit f28e4c1
Showing
5 changed files
with
301 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,138 @@ | ||
# frozen_string_literal: true | ||
|
||
require "debug" | ||
|
||
module PhlexyUI | ||
class Link < Base | ||
def initialize(*args, &) | ||
options = args.last.is_a?(Hash) ? args.pop : {} | ||
@link_to_name = args.shift if args.first.is_a?(String) || args.first.nil? | ||
@link_to_path = args.shift if args.first.is_a?(String) || args.first.nil? | ||
modifiers = args.select { |arg| arg.is_a?(Symbol) } | ||
|
||
super(*modifiers, **options, &) | ||
end | ||
|
||
def view_template(&) | ||
generate_classes!( | ||
modifiers_map: LINK_MODIFIERS_MAP, | ||
base_modifiers:, | ||
options: | ||
).then do |classes| | ||
if respond_to?(:link_to) | ||
10.times do | ||
puts "1" | ||
pp @link_to_name | ||
pp @link_to_path | ||
pp @options | ||
pp options | ||
end | ||
link_to(@link_to_name, class: classes, **options, &) | ||
elsif block_given? | ||
10.times do | ||
puts "2" | ||
pp @link_to_name | ||
pp @link_to_path | ||
pp @options | ||
pp options | ||
end | ||
a(href: @link_to_name, class: classes, **options, &) | ||
else | ||
10.times do | ||
puts "3" | ||
pp @link_to_name | ||
pp @link_to_path | ||
pp @options | ||
pp options | ||
end | ||
a(href: @link_to_path, class: classes, **options) do | ||
@link_to_name | ||
end | ||
end | ||
end | ||
end | ||
|
||
private | ||
|
||
attr_reader :link_to_name | ||
|
||
LINK_MODIFIERS_MAP = { | ||
# "sm:link" | ||
# "md:link" | ||
# "lg:link" | ||
underlined: "link", | ||
# "sm:active" | ||
# "md:active" | ||
# "lg:active" | ||
active: "active", | ||
# "sm:image-full" | ||
# "md:image-full" | ||
# "lg:image-full" | ||
image_full: "image-full", | ||
# "sm:card-bordered" | ||
# "md:card-bordered" | ||
# "lg:card-bordered" | ||
bordered: "card-bordered", | ||
# "sm:card-normal" | ||
# "md:card-normal" | ||
# "lg:card-normal" | ||
normal: "card-normal", | ||
# "sm:card-compact" | ||
# "md:card-compact" | ||
# "lg:card-compact" | ||
compact: "card-compact", | ||
# "sm:card-side" | ||
# "md:card-side" | ||
# "lg:card-side" | ||
side: "card-side", | ||
# "sm:glass" | ||
# "md:glass" | ||
# "lg:glass" | ||
glass: "glass", | ||
# "sm:bg-primary sm:text-primary-content" | ||
# "md:bg-primary md:text-primary-content" | ||
# "lg:bg-primary lg:text-primary-content" | ||
primary: "bg-primary text-primary-content", | ||
# "sm:bg-secondary sm:text-secondary-content" | ||
# "md:bg-secondary md:text-secondary-content" | ||
# "lg:bg-secondary lg:text-secondary-content" | ||
secondary: "bg-secondary text-secondary-content", | ||
# "sm:bg-accent sm:text-accent-content" | ||
# "md:bg-accent md:text-accent-content" | ||
# "lg:bg-accent lg:text-accent-content" | ||
accent: "bg-accent text-accent-content", | ||
# "sm:bg-neutral sm:text-neutral-content" | ||
# "md:bg-neutral md:text-neutral-content" | ||
# "lg:bg-neutral lg:text-neutral-content" | ||
neutral: "bg-neutral text-neutral-content", | ||
# "sm:bg-base-100 sm:text-base-content" | ||
# "md:bg-base-100 md:text-base-content" | ||
# "lg:bg-base-100 lg:text-base-content" | ||
base_100: "bg-base-100 text-base-content", | ||
# "sm:bg-base-200 sm:text-base-content" | ||
# "md:bg-base-200 md:text-base-content" | ||
# "lg:bg-base-200 lg:text-base-content" | ||
base_200: "bg-base-200 text-base-content", | ||
# "sm:bg-base-300 sm:text-base-content" | ||
# "md:bg-base-300 md:text-base-content" | ||
# "lg:bg-base-300 lg:text-base-content" | ||
base_300: "bg-base-300 text-base-content", | ||
# "sm:bg-info sm:text-info-content" | ||
# "md:bg-info sm:text-info-content" | ||
# "lg:bg-info sm:text-info-content" | ||
info: "bg-info text-info-content", | ||
# "sm:bg-success sm:text-success-content" | ||
# "md:bg-success md:text-success-content" | ||
# "lg:bg-success lg:text-success-content" | ||
success: "bg-success text-success-content", | ||
# "sm:bg-warning sm:text-warning-content" | ||
# "md:bg-warning md:text-warning-content" | ||
# "lg:bg-warning lg:text-warning-content" | ||
warning: "bg-warning text-warning-content", | ||
# "sm:bg-error sm:text-error-content" | ||
# "md:bg-error md:text-error-content" | ||
# "lg:bg-error lg:text-error-content" | ||
error: "bg-error text-error-content" | ||
}.freeze | ||
end | ||
end |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,77 @@ | ||
require "spec_helper" | ||
|
||
describe PhlexyUI::Link do | ||
subject(:output) { render described_class.new } | ||
|
||
describe "rendering via Kit" do | ||
subject(:output) do | ||
Link tip: "A tooltip" | ||
end | ||
|
||
it "renders it correctly" do | ||
expected_html = html <<~HTML | ||
<div class="tooltip" data-tip="A tooltip"></div> | ||
HTML | ||
|
||
expect(output).to eq(expected_html) | ||
end | ||
end | ||
|
||
describe "passing :as option" do | ||
subject(:output) { render described_class.new(as: :a, tip: "A tooltip") } | ||
|
||
it "renders the tooltip as the given tag" do | ||
expected_html = html <<~HTML | ||
<a class="tooltip" data-tip="A tooltip"></a> | ||
HTML | ||
|
||
expect(output).to eq(expected_html) | ||
end | ||
end | ||
|
||
describe "rendering a full link" do | ||
let(:component) do | ||
Class.new(Phlex::HTML) do | ||
def view_template(&) | ||
render PhlexyUI::Link.new("/test", :active, class: "test", data: {my: "data"}) do | ||
"Link text" | ||
end | ||
end | ||
end | ||
end | ||
|
||
subject(:output) do | ||
render component.new | ||
end | ||
|
||
it "is expected to match the formatted HTML" do | ||
expected_html = html <<~HTML | ||
<a href="/test" class="active test" data-my="data">Link text</a> | ||
HTML | ||
|
||
is_expected.to eq(expected_html) | ||
end | ||
end | ||
|
||
describe "rendering a full link" do | ||
let(:component) do | ||
Class.new(Phlex::HTML) do | ||
def view_template(&) | ||
render PhlexyUI::Link.new("Link text", "/test", :active, class: "test", data: {my: "data"}) | ||
end | ||
end | ||
end | ||
|
||
subject(:output) do | ||
render component.new | ||
end | ||
|
||
it "is expected to match the formatted HTML" do | ||
expected_html = html <<~HTML | ||
<a href="/test" class="active test" data-my="data">Link text</a> | ||
HTML | ||
|
||
is_expected.to eq(expected_html) | ||
end | ||
end | ||
end |