diff --git a/.changeset/odd-dots-laugh.md b/.changeset/odd-dots-laugh.md deleted file mode 100644 index 8667f57324..0000000000 --- a/.changeset/odd-dots-laugh.md +++ /dev/null @@ -1,5 +0,0 @@ ---- -'@primer/view-components': minor ---- - -Support leading and trailing icons for Links diff --git a/.changeset/quiet-kids-sort.md b/.changeset/quiet-kids-sort.md new file mode 100644 index 0000000000..3b910778e0 --- /dev/null +++ b/.changeset/quiet-kids-sort.md @@ -0,0 +1,5 @@ +--- +'@primer/view-components': patch +--- + +Revert leading/trailing visuals for link component diff --git a/app/components/primer/base_component.rb b/app/components/primer/base_component.rb index 4b0ea3f136..061f6a921d 100644 --- a/app/components/primer/base_component.rb +++ b/app/components/primer/base_component.rb @@ -151,7 +151,6 @@ class BaseComponent < Primer::Component # | :- | :- | :- | # | classes | String | CSS class name value to be concatenated with generated Primer CSS classes. | # | test_selector | String | Adds `data-test-selector='given value'` in non-Production environments for testing purposes. | - # | trim | Boolean | Calls `strip` on the content to remove trailing and leading white spaces. | def initialize(tag:, classes: nil, **system_arguments) @tag = tag @@ -159,8 +158,6 @@ def initialize(tag:, classes: nil, **system_arguments) @result = Primer::Classify.call(**@system_arguments.merge(classes: classes)) - @trim = !!@system_arguments.delete(:trim) - @system_arguments[:"data-view-component"] = true # Filter out Primer keys so they don't get assigned as HTML attributes @content_tag_args = add_test_selector(@system_arguments).except(*Primer::Classify::Utilities::UTILITIES.keys) @@ -170,7 +167,7 @@ def call if SELF_CLOSING_TAGS.include?(@tag) tag(@tag, @content_tag_args.merge(@result)) else - content_tag(@tag, @trim ? trimmed_content : content, @content_tag_args.merge(@result)) + content_tag(@tag, content, @content_tag_args.merge(@result)) end end end diff --git a/app/components/primer/beta/link.html.erb b/app/components/primer/beta/link.html.erb deleted file mode 100644 index c6abde2bf6..0000000000 --- a/app/components/primer/beta/link.html.erb +++ /dev/null @@ -1,16 +0,0 @@ -<%= render Primer::ConditionalWrapper.new(condition: tooltip?, trim: true, tag: :span, position: :relative) do %> - <%= render(Primer::BaseComponent.new(trim: true, **@system_arguments)) do %> - <% if leading_visual %> - - <%= leading_visual %> - - <% end %> - <%= content %> - <% if trailing_visual %> - - <%= trailing_visual %> - - <% end %> - <% end %> - <%= tooltip if tooltip? %> -<% end %> diff --git a/app/components/primer/beta/link.rb b/app/components/primer/beta/link.rb index 1fdfd0442a..91462e6ae7 100644 --- a/app/components/primer/beta/link.rb +++ b/app/components/primer/beta/link.rb @@ -30,32 +30,6 @@ class Link < Primer::Component Primer::Alpha::Tooltip.new(**system_arguments) } - # Leading visuals appear to the left of the link text. - # - # Use: - # - # - `leading_visual_icon` which accepts the arguments accepted by <%= link_to_component(Primer::Beta::Octicon) %>. - # - # @param system_arguments [Hash] Same arguments as <%= link_to_component(Primer::Beta::Octicon) %>. - renders_one :leading_visual, types: { - icon: lambda { |**system_arguments| - Primer::Beta::Octicon.new(**system_arguments) - } - } - - # Trailing visuals appear to the right of the link text. - # - # Use: - # - # - `trailing_visual_icon` which accepts the arguments accepted by <%= link_to_component(Primer::Beta::Octicon) %>. - # - # @param system_arguments [Hash] Same arguments as <%= link_to_component(Primer::Beta::Octicon) %>. - renders_one :trailing_visual, types: { - icon: lambda { |**system_arguments| - Primer::Beta::Octicon.new(**system_arguments) - } - } - # @param href [String] URL to be used for the Link. Required. If the requirements are not met an error will be raised in non production environments. In production, an empty link element will be rendered. # @param scheme [Symbol] <%= one_of(Primer::Beta::Link::SCHEME_MAPPINGS.keys) %> # @param muted [Boolean] Uses light gray for Link color, and blue on hover. @@ -80,6 +54,20 @@ def initialize(href: nil, scheme: DEFAULT_SCHEME, muted: false, underline: false def before_render raise ArgumentError, "href is required" if @system_arguments[:href].nil? && !Rails.env.production? end + + def call + if tooltip.present? + render Primer::BaseComponent.new(tag: :span, position: :relative) do + render(Primer::BaseComponent.new(**@system_arguments)) do + content + end.to_s + tooltip.to_s + end + else + render(Primer::BaseComponent.new(**@system_arguments)) do + content + end + end + end end end end diff --git a/app/components/primer/component.rb b/app/components/primer/component.rb index abc7a16f07..79c416954f 100644 --- a/app/components/primer/component.rb +++ b/app/components/primer/component.rb @@ -144,12 +144,5 @@ def should_raise_error? def should_raise_aria_error? !Rails.env.production? && raise_on_invalid_aria? && !ENV["PRIMER_WARNINGS_DISABLED"] end - - def trimmed_content - return content unless content.present? - - # strip unsets `html_safe`, so we have to set it back again to guarantee that HTML blocks won't break - content.html_safe? ? content.strip.html_safe : content.strip # rubocop:disable Rails/OutputSafety - end end end diff --git a/app/components/primer/conditional_wrapper.rb b/app/components/primer/conditional_wrapper.rb index 27fcc46368..57c61e93b7 100644 --- a/app/components/primer/conditional_wrapper.rb +++ b/app/components/primer/conditional_wrapper.rb @@ -10,15 +10,12 @@ class ConditionalWrapper < Primer::Component def initialize(condition:, **base_component_arguments) @condition = condition @base_component_arguments = base_component_arguments - @trim = !!@base_component_arguments.delete(:trim) end def call - unless @condition - return @trim ? trimmed_content : content - end + return content unless @condition - BaseComponent.new(trim: @trim, **@base_component_arguments).render_in(self) { content } + BaseComponent.new(**@base_component_arguments).render_in(self) { content } end end end diff --git a/previews/primer/beta/link_preview.rb b/previews/primer/beta/link_preview.rb index 0a76c35cd4..b8e0734342 100644 --- a/previews/primer/beta/link_preview.rb +++ b/previews/primer/beta/link_preview.rb @@ -9,14 +9,8 @@ class LinkPreview < ViewComponent::Preview # @param underline [Boolean] # @param muted [Boolean] # @param scheme [Symbol] select [default, primary, secondary] - # @param leading_visual_icon [Symbol] octicon - # @param trailing_visual_icon [Symbol] octicon - def playground(scheme: :default, muted: false, underline: true, leading_visual_icon: nil, trailing_visual_icon: nil) - render(Primer::Beta::Link.new(href: "#", scheme: scheme, muted: muted, underline: underline)) do |link| - link.with_leading_visual_icon(icon: leading_visual_icon) if leading_visual_icon && leading_visual_icon != :none - link.with_trailing_visual_icon(icon: trailing_visual_icon) if trailing_visual_icon && trailing_visual_icon != :none - "This is a link!" - end + def playground(scheme: :default, muted: false, underline: true) + render(Primer::Beta::Link.new(href: "#", scheme: scheme, muted: muted, underline: underline)) { "This is a link!" } end # @label Default Options @@ -72,22 +66,6 @@ def color_scheme_secondary_muted render(Primer::Beta::Link.new(href: "#", scheme: :secondary, muted: true)) { "This is a muted secondary link color." } end # @!endgroup - - # @label With leading icon - def with_leading_icon - render(Primer::Beta::Link.new(href: "#")) do |component| - component.with_leading_visual_icon(icon: :"mark-github") - "Link with leading icon" - end - end - - # @label With trailing icon - def with_trailing_icon - render(Primer::Beta::Link.new(href: "#")) do |component| - component.with_trailing_visual_icon(icon: :"link-external") - "Link with trailing icon" - end - end end end end diff --git a/test/components/beta/link_test.rb b/test/components/beta/link_test.rb index b8d5471763..dbfbd7e94c 100644 --- a/test/components/beta/link_test.rb +++ b/test/components/beta/link_test.rb @@ -92,26 +92,4 @@ def test_renders_with_tooltip_sibling assert_selector("a[href='http://google.com'] + tool-tip", text: "Tooltip text", visible: false) end - - def test_renders_leading_visual_icon - render_inline(Primer::Beta::Link.new(href: "http://google.com")) do |component| - component.with_leading_visual_icon(icon: "plus") - "content" - end - - assert_selector("a[href='http://google.com']") - assert_selector(".octicon-plus") - end - - def test_renders_trailing_visual_icon - render_inline(Primer::Beta::Link.new(href: "http://google.com")) do |component| - component.with_leading_visual_icon(icon: "plus") - component.with_trailing_visual_icon(icon: "alert") - "content" - end - - assert_selector("a[href='http://google.com']") - assert_selector("a span:first-child .octicon-plus") - assert_selector("a span:nth-child(2) .octicon-alert") - end end