Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Add Tailwind Merge to base component for automatic class merging #67

Merged
merged 4 commits into from
Jul 28, 2024
Merged

Add Tailwind Merge to base component for automatic class merging #67

Show file tree
Hide file tree
Changes from 1 commit
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
a8520b2
add tailwind merge to all classes globaly
SethHorsley Jul 23, 2024
d61e9a4
update gemspec
SethHorsley Jul 28, 2024
b676da5
Merge branch 'main' into add-tailwind-merge
SethHorsley Jul 28, 2024
2ed9b7f
update gemfile
SethHorsley Jul 28, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 5 additions & 1 deletion Gemfile.lock
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,8 +3,9 @@ PATH
specs:
phlex_ui (0.1.10)
activesupport (>= 6.0)
phlex (~> 1.11)
phlex (~> 1.10)
rouge (~> 4.2.0)
tailwind_merge (= 0.12.0)
zeitwerk (~> 2.6)

GEM
Expand All @@ -23,6 +24,7 @@ GEM
json (2.7.2)
language_server-protocol (3.17.0.3)
lint_roller (1.1.0)
lru_redux (1.1.0)
minitest (5.24.0)
parallel (1.25.1)
parser (3.3.3.0)
Expand Down Expand Up @@ -66,6 +68,8 @@ GEM
lint_roller (~> 1.1)
rubocop-performance (~> 1.21.0)
strscan (3.1.0)
tailwind_merge (0.12.0)
lru_redux (~> 1.1)
tzinfo (2.0.6)
concurrent-ruby (~> 1.0)
unicode-display_width (2.5.0)
Expand Down
21 changes: 6 additions & 15 deletions lib/phlex_ui/attribute_merger.rb
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,16 +1,19 @@
module PhlexUI
class AttributeMerger
attr_reader :default_attrs, :user_attrs
OVERRIDE_KEY = "!".freeze

def initialize(default_attrs, user_attrs)
@default_attrs = flatten_hash(default_attrs)
@user_attrs = flatten_hash(user_attrs)
end

# @return [String]
# any key that ends with ! will override the default value
# ex: if default_attrs = { class: "text-right" }, user_attrs = { class!: "text-left" }
# the result will be { class: "text-left }
def call
merged_attrs = merge_hashes(default_attrs, non_override_attrs)
mix(merged_attrs, override_attrs)
merged_attrs = merge_hashes(default_attrs, user_attrs)
mix(merged_attrs, user_attrs)
end

private
Expand All @@ -37,18 +40,6 @@ def mix(*args)
end
end

def override_attrs
user_attrs.select do |key, value|
key.to_s.include?(OVERRIDE_KEY)
end
end

def non_override_attrs
user_attrs.reject do |key, value|
key.to_s.include?(OVERRIDE_KEY)
end
end

def flatten_hash(hash, parent_key = "", result_hash = {})
hash.each do |key, value|
new_key = parent_key.empty? ? key : :"#{parent_key}_#{key}"
Expand Down
3 changes: 3 additions & 0 deletions lib/phlex_ui/base.rb
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,11 +1,14 @@
# frozen_string_literal: true

require "tailwind_merge"

module PhlexUI
class Base < Phlex::HTML
attr_reader :attrs

def initialize(**user_attrs)
@attrs = PhlexUI::AttributeMerger.new(default_attrs, user_attrs).call
@attrs[:class] = ::TailwindMerge::Merger.new.merge(@attrs[:class]) if @attrs[:class]
end

if defined?(Rails) && Rails.env.development?
Expand Down
3 changes: 2 additions & 1 deletion phlex_ui.gemspec
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,10 +12,11 @@ Gem::Specification.new do |s|

s.required_ruby_version = ">= 3.2"

s.add_dependency "phlex", "~> 1.11"
s.add_dependency "phlex", "~> 1.10"
s.add_dependency "rouge", "~> 4.2.0"
s.add_dependency "zeitwerk", "~> 2.6"
s.add_dependency "activesupport", ">= 6.0"
s.add_dependency "tailwind_merge", "0.12.0"
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@iseth , I don't think we should be so restrictive and lock onto a specific version.

Take avo for example; they are taking an even more optimistic approach and using >= instead of ~> for their dependencies. I believe we should do the same here

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Good point. Thanks


s.add_development_dependency "rake"
s.add_development_dependency "standard"
Expand Down