RubyGems - activemail - Versions diffs - 1.0.0 - Mend

activemail 1.0.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.

Files changed (64) hide show

checksums.yaml +7 -0
data/CHANGELOG.md +60 -0
data/LICENSE.txt +23 -0
data/README.md +375 -0
data/app/assets/stylesheets/active_mail/_active_mail_tokens.scss.erb +3 -0
data/app/assets/stylesheets/active_mail/_components.scss +58 -0
data/app/assets/stylesheets/active_mail/_dark.scss +123 -0
data/app/assets/stylesheets/active_mail/_grid.scss +49 -0
data/app/assets/stylesheets/active_mail/_settings.scss +25 -0
data/app/assets/stylesheets/active_mail/_utilities.scss +47 -0
data/app/assets/stylesheets/active_mail/active_mail.scss +44 -0
data/app/helpers/active_mail/styles_helper.rb +29 -0
data/app/views/layouts/active_mail/_footer.html.inky-erb +10 -0
data/app/views/layouts/active_mail/_head.html.inky-erb +6 -0
data/app/views/layouts/active_mail/mailer.html.inky-erb +35 -0
data/lib/active_mail/components/base.rb +119 -0
data/lib/active_mail/components/block_grid.rb +19 -0
data/lib/active_mail/components/button.rb +39 -0
data/lib/active_mail/components/callout.rb +23 -0
data/lib/active_mail/components/center.rb +24 -0
data/lib/active_mail/components/columns.rb +72 -0
data/lib/active_mail/components/container.rb +25 -0
data/lib/active_mail/components/cta.rb +36 -0
data/lib/active_mail/components/h_line.rb +19 -0
data/lib/active_mail/components/info_box.rb +32 -0
data/lib/active_mail/components/inky.rb +18 -0
data/lib/active_mail/components/menu.rb +22 -0
data/lib/active_mail/components/menu_item.rb +21 -0
data/lib/active_mail/components/row.rb +18 -0
data/lib/active_mail/components/spacer.rb +45 -0
data/lib/active_mail/components/wrapper.rb +21 -0
data/lib/active_mail/configuration.rb +229 -0
data/lib/active_mail/inliner/base.rb +29 -0
data/lib/active_mail/inliner/interceptor.rb +51 -0
data/lib/active_mail/inliner/null.rb +23 -0
data/lib/active_mail/inliner/premailer.rb +22 -0
data/lib/active_mail/inliner/roadie.rb +30 -0
data/lib/active_mail/libxml.rb +8 -0
data/lib/active_mail/parse_error_reporter.rb +47 -0
data/lib/active_mail/quality/configuration.rb +56 -0
data/lib/active_mail/quality/guard.rb +131 -0
data/lib/active_mail/quality/minitest.rb +64 -0
data/lib/active_mail/quality/preview_renderer.rb +70 -0
data/lib/active_mail/quality/render_all.rb +90 -0
data/lib/active_mail/quality/rspec.rb +65 -0
data/lib/active_mail/quality.rb +38 -0
data/lib/active_mail/rails/compiled_stylesheet.rb +62 -0
data/lib/active_mail/rails/engine.rb +36 -0
data/lib/active_mail/rails/template_handler.rb +62 -0
data/lib/active_mail/tokens.rb +139 -0
data/lib/active_mail/version.rb +6 -0
data/lib/active_mail.rb +161 -0
data/lib/activemail.rb +5 -0
data/lib/generators/active_mail/component_generator.rb +31 -0
data/lib/generators/active_mail/install_generator.rb +59 -0
data/lib/generators/active_mail/styles_generator.rb +30 -0
data/lib/generators/active_mail/templates/component.rb.tt +13 -0
data/lib/generators/active_mail/templates/initializer.rb +32 -0
data/lib/generators/active_mail/templates/mailer_layout.html.inky-erb +30 -0
data/lib/generators/active_mail/templates/mailer_layout.html.inky-haml +17 -0
data/lib/generators/active_mail/templates/mailer_layout.html.inky-slim +16 -0
data/lib/generators/active_mail/views_generator.rb +16 -0
data/lib/tasks/active_mail.rake +36 -0
metadata +151 -0

data/app/assets/stylesheets/active_mail/_grid.scss ADDED Viewed

@@ -0,0 +1,49 @@
+// Gutters are unconditional padding (inlined by the CSS inliner): the gem emits
+// none, and they must not depend on media queries (stripped by Gmail mobile).
+.container {
+  width: 100%;
+  max-width: $am-container-width;
+  margin: 0 auto;
+}
+.body {
+  width: 100%;
+}
+.row {
+  width: 100%;
+}
+// Gutters: half on each side, outer edges collapsed via first/last so content
+// stays flush with the container.
+// box-sizing keeps the gutter inside the inline max-width — without it a 300px
+// 2-col cell + 8px padding becomes 316px and the row overflows ~616px, wrapping
+// in clients that honor inline padding.
+.columns {
+  box-sizing: border-box;
+  padding-left: $am-gutter;
+  padding-right: $am-gutter;
+}
+.columns.first {
+  padding-left: 0;
+}
+.columns.last {
+  padding-right: 0;
+}
+// A single full-width column carries no side gutter.
+.columns.first.last {
+  padding-left: 0;
+  padding-right: 0;
+}
+// Collapse removes gutters on demand (e.g. edge-to-edge images). Columns are not
+// direct children of .row — the real markup nests them as <th class="columns">
+// under tbody > tr — so this must be a descendant selector, not a child one.
+.row.collapse .columns {
+  padding-left: 0;
+  padding-right: 0;
+}

data/app/assets/stylesheets/active_mail/_settings.scss ADDED Viewed

@@ -0,0 +1,25 @@
+// Semantic aliases mapped from the $am-* token vars. All !default so a host
+// app can pre-declare any value before importing the framework.
+@import "active_mail/active_mail_tokens";
+// Typography
+$am-font-family: $am-font-body !default;
+$am-heading-font-family: $am-font-heading !default;
+// Palette
+$am-text: $am-color-text !default;
+$am-background: $am-color-background !default;
+$am-muted: $am-color-muted !default;
+$am-border: $am-color-border !default;
+// Buttons
+$am-button-primary-bg: $am-color-primary !default;
+$am-button-secondary-bg: $am-color-secondary !default;
+$am-button-color: $am-color-button-text !default;
+$am-button-radius: 4px !default;
+// Grid — the gem emits no gutters; we provide them via column padding.
+// Width follows config.container_width via the token bridge, so the SCSS grid
+// stays aligned with the transpiled markup (ghost tables, column max-width).
+$am-container-width: $am-grid-container-width !default;
+$am-gutter: $am-spacing-sm !default;

data/app/assets/stylesheets/active_mail/_utilities.scss ADDED Viewed

@@ -0,0 +1,47 @@
+// Alignment and visibility utilities.
+.text-center {
+  text-align: center;
+}
+.text-right {
+  text-align: right;
+}
+.text-left {
+  text-align: left;
+}
+.text-muted {
+  color: $am-muted;
+}
+.float-center {
+  margin: 0 auto;
+  float: none;
+  text-align: center;
+}
+// Shown only on large screens. Hidden by default (mobile-first); the media
+// query below reveals it as an enhancement.
+.show-for-large {
+  display: none;
+  font-size: 0;
+  max-height: 0;
+  line-height: 0;
+  overflow: hidden;
+}
+@media only screen and (min-width: 596px) {
+  .show-for-large {
+    display: block !important;
+    font-size: inherit;
+    max-height: none;
+    line-height: inherit;
+    overflow: visible;
+  }
+  .hide-for-large {
+    display: none !important;
+  }
+}

data/app/assets/stylesheets/active_mail/active_mail.scss ADDED Viewed

@@ -0,0 +1,44 @@
+// ActiveMail email framework entry point. Critical styles are inlined by the
+// configured CSS inliner (Gmail mobile strips <style>); only media-query and
+// dark-mode enhancements stay in the <head>.
+@import "active_mail/settings";
+@import "active_mail/grid";
+@import "active_mail/components";
+@import "active_mail/utilities";
+@import "active_mail/dark";
+body,
+table,
+td,
+p,
+li,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+a {
+  font-family: $am-font-family;
+}
+h1,
+h2,
+h3,
+h4,
+h5,
+h6 {
+  font-family: $am-heading-font-family;
+}
+body {
+  margin: 0;
+  padding: 0;
+  background-color: $am-background;
+  color: $am-text;
+}
+img {
+  border: 0;
+  max-width: 100%;
+}

data/app/helpers/active_mail/styles_helper.rb ADDED Viewed

@@ -0,0 +1,29 @@
+# typed: false
+# frozen_string_literal: true
+module ActiveMail
+  # Embeds the compiled framework CSS as a <style> block so the Premailer adapter
+  # (string-only) inlines it — it can't fetch the stylesheet_link_tag's asset URL.
+  module StylesHelper
+    FRAMEWORK_STYLESHEET = 'active_mail/active_mail.css'
+    # '' (not raise) when the asset can't be read — degrades to the link fallback,
+    # but warns, since the email then ships unstyled.
+    def active_mail_inline_styles
+      css = active_mail_compiled_css
+      if css.blank?
+        ActiveMail.log_warning('[activemail] framework stylesheet could not be read from the asset pipeline; ' \
+                               'email ships without inlined framework CSS')
+        return ''.html_safe
+      end
+      content_tag(:style, css.html_safe, type: 'text/css')
+    end
+    private
+    def active_mail_compiled_css
+      ActiveMail::CompiledStylesheet.read(FRAMEWORK_STYLESHEET)
+    end
+  end
+end

data/app/views/layouts/active_mail/_footer.html.inky-erb ADDED Viewed

@@ -0,0 +1,10 @@
+<%# Neutral footer. Hosts override this partial to add address/social/unsubscribe. %>
+<row>
+  <columns>
+    <spacer size="24"></spacer>
+    <h-line></h-line>
+    <p class="text-muted text-center">
+      <%= I18n.t("active_mail.footer.sent_with", default: "Sent with ActiveMail") %>
+    </p>
+  </columns>
+</row>

data/app/views/layouts/active_mail/_head.html.inky-erb ADDED Viewed

@@ -0,0 +1,6 @@
+<%# Header slot — hosts override this partial to add a logo/banner. %>
+<row>
+  <columns>
+    <spacer size="16"></spacer>
+  </columns>
+</row>

data/app/views/layouts/active_mail/mailer.html.inky-erb ADDED Viewed

@@ -0,0 +1,35 @@
+<!DOCTYPE html>
+<html lang="<%= I18n.locale %>" xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office">
+  <head>
+    <meta charset="utf-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <meta name="x-apple-disable-message-reformatting">
+    <meta name="color-scheme" content="light dark">
+    <meta name="supported-color-schemes" content="light dark">
+    <!--[if mso]>
+    <noscript>
+      <xml>
+        <o:OfficeDocumentSettings>
+          <o:PixelsPerInch>96</o:PixelsPerInch>
+        </o:OfficeDocumentSettings>
+      </xml>
+    </noscript>
+    <![endif]-->
+    <%# Embedded so the Premailer adapter (HTML-string only) can inline the framework CSS. %>
+    <%= active_mail_inline_styles %>
+    <%# Fallback for when active_mail_inline_styles cannot read the compiled asset %>
+    <%# (CDN-only host, compile=false without precompile); redundant otherwise, as the %>
+    <%# embed's rules are idempotent once inlined. %>
+    <%= stylesheet_link_tag "active_mail/active_mail", media: "all" %>
+  </head>
+  <body style="margin:0;padding:0;word-spacing:normal;">
+    <div role="article" aria-roledescription="email" lang="<%= I18n.locale %>" style="width:100%;">
+      <container>
+        <%= render "layouts/active_mail/head" %>
+        <%= yield %>
+        <%= render "layouts/active_mail/footer" %>
+      </container>
+    </div>
+  </body>
+</html>

data/lib/active_mail/components/base.rb ADDED Viewed

@@ -0,0 +1,119 @@
+# typed: strict
+# frozen_string_literal: true
+require 'cgi/escape'
+require 'sorbet-runtime'
+module ActiveMail
+  module Components
+    class << self
+      extend T::Sig
+      # A non-class (e.g. a tag-name string) would NoMethodError downstream; reject it here.
+      sig { params(tag: T.any(String, Symbol), klass: T.untyped).void }
+      def validate_component!(tag, klass)
+        return if klass.is_a?(Class) && klass < Components::Base
+        raise TypeError,
+              "component for tag '#{tag}' must be a class inheriting from ActiveMail::Components::Base, " \
+              "got #{klass.inspect}. Register components with " \
+              'ActiveMail.configuration.register_component(tag, ComponentClass).'
+      end
+    end
+    # Public extension point: subclass, implement #transform(node, inner), then register.
+    class Base
+      extend T::Sig
+      extend T::Helpers
+      abstract!
+      IGNORED_ON_PASSTHROUGH = T.let(
+        %w[class id href size large no-expander small target up size-sm size-lg style].freeze,
+        T::Array[String]
+      )
+      # Layout tables: presentation role (a11y) and zeroed legacy spacing.
+      TABLE_RESET = 'role="presentation" border="0" cellpadding="0" cellspacing="0"'
+      sig { params(core: ::ActiveMail::Core).void }
+      def initialize(core)
+        @core = core
+      end
+      sig { abstract.params(node: Nokogiri::XML::Node, inner: String).returns(String) }
+      def transform(node, inner); end
+      private
+      # Private: a component is a pure transformer; the engine handle stays internal.
+      sig { returns(::ActiveMail::Core) }
+      attr_reader :core
+      sig { params(value: T.untyped).returns(String) }
+      def escape_attr(value)
+        CGI.escapeHTML(value.to_s)
+      end
+      # Author attributes are untrusted: "abc".to_i would silently become 0.
+      sig { params(value: T.untyped).returns(T.nilable(Integer)) }
+      def positive_int(value)
+        # The RBI types Integer(exception: false) as non-nilable; it does return nil.
+        int = T.let(Integer(value.to_s, exception: false), T.nilable(Integer))
+        int if int&.positive?
+      end
+      sig { params(node: Nokogiri::XML::Node).returns(String) }
+      def pass_through_attributes(node)
+        node.attributes.reject { |name, _| IGNORED_ON_PASSTHROUGH.include?(name.downcase) }.map do |name, value|
+          %(#{name}="#{escape_attr(value)}" )
+        end.join
+      end
+      # Author style merged after layout (a duplicated style attribute would be
+      # dropped by parsers); author wins on overlapping properties.
+      sig { params(node: Nokogiri::XML::Node, layout: String).returns(String) }
+      def style_attribute(node, layout = '')
+        user = escape_attr(node.attr('style').to_s.strip)
+        user = "#{user};" unless user.empty? || user.end_with?(';')
+        value = "#{layout}#{user}"
+        value.empty? ? '' : %( style="#{value}")
+      end
+      sig { params(node: Nokogiri::XML::Node, klass: String).returns(T::Boolean) }
+      def class?(node, klass)
+        !((node.attr('class') || '') =~ /(^|\s)#{Regexp.escape(klass)}($|\s)/).nil?
+      end
+      sig { params(node: Nokogiri::XML::Node, extra_classes: T.nilable(String)).returns(String) }
+      def combine_classes(node, extra_classes)
+        existing = node['class'].to_s.split
+        to_add = extra_classes.to_s.split
+        (existing + to_add).uniq.join(' ')
+      end
+      sig { params(node: Nokogiri::XML::Node, extra_classes: T.nilable(String)).returns(String) }
+      def combine_attributes(node, extra_classes = nil)
+        classes = combine_classes(node, extra_classes)
+        # Escape like the other attribute paths: a literal " in the class would
+        # otherwise reopen the attribute.
+        [pass_through_attributes(node), %(class="#{escape_attr(classes)}")].join
+      end
+      sig { params(node: Nokogiri::XML::Node).returns(String) }
+      def target_attribute(node)
+        node.attributes['target'] ? %( target="#{escape_attr(node.attributes['target'])}") : ''
+      end
+      sig { returns(Integer) }
+      def column_count
+        core.column_count
+      end
+      sig { returns(Integer) }
+      def container_width
+        core.container_width
+      end
+    end
+  end
+end

data/lib/active_mail/components/block_grid.rb ADDED Viewed

@@ -0,0 +1,19 @@
+# typed: strict
+# frozen_string_literal: true
+require_relative 'base'
+module ActiveMail
+  module Components
+    class BlockGrid < Base
+      extend T::Sig
+      sig { override.params(node: Nokogiri::XML::Node, inner: String).returns(String) }
+      def transform(node, inner)
+        up = positive_int(node.attr('up'))
+        classes = combine_classes(node, ['block-grid', up && "up-#{up}"].compact.join(' '))
+        %(<table class="#{classes}" #{TABLE_RESET}#{style_attribute(node, 'width:100%;')}><tbody><tr>#{inner}</tr></tbody></table>)
+      end
+    end
+  end
+end

data/lib/active_mail/components/button.rb ADDED Viewed

@@ -0,0 +1,39 @@
+# typed: strict
+# frozen_string_literal: true
+require_relative 'base'
+module ActiveMail
+  module Components
+    class Button < Base
+      extend T::Sig
+      sig { override.params(node: Nokogiri::XML::Node, inner: String).returns(String) }
+      def transform(node, inner)
+        expand = class?(node, 'expand')
+        inner = anchor(node, inner, expand) if node.attr('href')
+        inner = "<center>#{inner}</center>" if expand
+        classes = combine_classes(node, 'button')
+        expander = expand ? '<td class="expander"></td>' : ''
+        [
+          %(<table class="#{classes}" #{TABLE_RESET}><tbody><tr><td>),
+          %(<table #{TABLE_RESET}><tbody><tr><td>#{inner}</td></tr></tbody></table>),
+          %(</td>#{expander}</tr></tbody></table>)
+        ].join
+      end
+      private
+      sig { params(node: Nokogiri::XML::Node, inner: String, expand: T::Boolean).returns(String) }
+      def anchor(node, inner, expand)
+        target = target_attribute(node)
+        extra = expand ? ' align="center" class="float-center"' : ''
+        # Padding on the <a> makes the whole button a clickable target.
+        link_style = 'display:inline-block;text-decoration:none;padding:12px 24px;'
+        attrs = %(#{pass_through_attributes(node)}href="#{escape_attr(node.attr('href'))}"#{target}#{extra})
+        %(<a #{attrs}#{style_attribute(node, link_style)}>#{inner}</a>)
+      end
+    end
+  end
+end

data/lib/active_mail/components/callout.rb ADDED Viewed

@@ -0,0 +1,23 @@
+# typed: strict
+# frozen_string_literal: true
+require_relative 'base'
+module ActiveMail
+  module Components
+    class Callout < Base
+      extend T::Sig
+      sig { override.params(node: Nokogiri::XML::Node, inner: String).returns(String) }
+      def transform(node, inner)
+        classes = combine_classes(node, 'callout-inner')
+        attributes = pass_through_attributes(node)
+        [
+          %(<table #{attributes}class="callout" #{TABLE_RESET}#{style_attribute(node, 'width:100%;')}><tbody><tr>),
+          %(<th class="#{classes}">#{inner}</th><th class="expander"></th>),
+          '</tr></tbody></table>'
+        ].join
+      end
+    end
+  end
+end

data/lib/active_mail/components/center.rb ADDED Viewed

@@ -0,0 +1,24 @@
+# typed: strict
+# frozen_string_literal: true
+require_relative 'base'
+module ActiveMail
+  module Components
+    class Center < Base
+      extend T::Sig
+      sig { override.params(node: Nokogiri::XML::Node, _inner: String).returns(String) }
+      def transform(node, _inner)
+        elements = node.elements
+        elements.each do |child|
+          child['align'] = 'center'
+          child['class'] = combine_classes(child, 'float-center')
+        end
+        items = elements.css('.menu-item').to_a.concat(elements.css('item').to_a)
+        items.each { |item| item['class'] = combine_classes(item, 'float-center') }
+        node.to_s
+      end
+    end
+  end
+end

data/lib/active_mail/components/columns.rb ADDED Viewed

@@ -0,0 +1,72 @@
+# typed: strict
+# frozen_string_literal: true
+require_relative 'base'
+module ActiveMail
+  module Components
+    class Columns < Base
+      extend T::Sig
+      sig { override.params(node: Nokogiri::XML::Node, inner: String).returns(String) }
+      def transform(node, inner)
+        small, large = column_sizes(node)
+        width_px = ghost_width(large)
+        [
+          %(<!--[if mso | IE]><td width="#{width_px}" valign="top"><![endif]-->),
+          column_markup(node, inner, column_classes(node, small, large), width_px, expander(node, large)),
+          '<!--[if mso | IE]></td><![endif]-->'
+        ].join
+      end
+      private
+      sig { params(node: Nokogiri::XML::Node).returns([Integer, Integer]) }
+      def column_sizes(node)
+        small = positive_int(node.attr('small'))
+        large = positive_int(node.attr('large'))
+        siblings = node.parent ? node.parent.elements.size : 1
+        [small || column_count, large || small || [column_count / siblings, 1].max]
+      end
+      sig { params(node: Nokogiri::XML::Node, small: Integer, large: Integer).returns(String) }
+      def column_classes(node, small, large)
+        classes = combine_classes(node, "small-#{small} large-#{large} columns")
+        classes += ' first' unless node.previous_element
+        classes += ' last' unless node.next_element
+        classes
+      end
+      sig { params(node: Nokogiri::XML::Node, large: Integer).returns(String) }
+      def expander(node, large)
+        subrows = node.elements.css('.row').to_a.concat(node.elements.css('row').to_a)
+        return '' unless large == column_count && subrows.empty?
+        %(<th class="expander"></th>)
+      end
+      # Clamp: an oversized `large` would push the MSO ghost cell past the
+      # container and force a wrap in Outlook Word.
+      sig { params(large: Integer).returns(Integer) }
+      def ghost_width(large)
+        [((large.to_f / column_count) * container_width).round, container_width].min
+      end
+      sig { params(node: Nokogiri::XML::Node, inner: String, classes: String, width_px: Integer, expander: String).returns(String) }
+      def column_markup(node, inner, classes, width_px, expander)
+        # display:inline-block + max-width gives natural stacking on small screens
+        # without a media query; MSO ghost cells restore the grid in Outlook Word.
+        style = "display:inline-block;vertical-align:top;width:100%;max-width:#{width_px}px;"
+        # Neutralize the client default th rendering (bold, centered).
+        content_style = 'font-weight:normal;text-align:left;'
+        [
+          %(<#{::ActiveMail::Core::INTERIM_TH_TAG} class="#{classes}"#{style_attribute(node, style)} #{pass_through_attributes(node)}>),
+          %(<table #{TABLE_RESET} style="width:100%;"><tbody><tr>),
+          %(<th style="#{content_style}">#{inner}</th>#{expander}),
+          %(</tr></tbody></table></#{::ActiveMail::Core::INTERIM_TH_TAG}>)
+        ].join
+      end
+    end
+  end
+end

data/lib/active_mail/components/container.rb ADDED Viewed

@@ -0,0 +1,25 @@
+# typed: strict
+# frozen_string_literal: true
+require_relative 'base'
+module ActiveMail
+  module Components
+    class Container < Base
+      extend T::Sig
+      sig { override.params(node: Nokogiri::XML::Node, inner: String).returns(String) }
+      def transform(node, inner)
+        attributes = combine_attributes(node, 'container')
+        width = container_width
+        # Outlook Word ignores max-width; the MSO ghost table pins the width.
+        [
+          %(<!--[if mso | IE]><table #{TABLE_RESET} align="center" width="#{width}"><tr><td><![endif]-->),
+          %(<table #{attributes} #{TABLE_RESET} align="center"#{style_attribute(node, "width:100%;max-width:#{width}px;margin:0 auto;")}>),
+          %(<tbody><tr><td>#{inner}</td></tr></tbody></table>),
+          '<!--[if mso | IE]></td></tr></table><![endif]-->'
+        ].join
+      end
+    end
+  end
+end

data/lib/active_mail/components/cta.rb ADDED Viewed

@@ -0,0 +1,36 @@
+# typed: strict
+# frozen_string_literal: true
+require_relative 'base'
+module ActiveMail
+  module Components
+    # Colors read from tokens at transform time (runtime config), not load-time constants.
+    class Cta < Base
+      extend T::Sig
+      sig { override.params(node: Nokogiri::XML::Node, inner: String).returns(String) }
+      def transform(node, inner)
+        # A CTA without a link is an authoring bug — surface it at render time.
+        raise ArgumentError, '<cta> requires an href attribute' if node.attr('href').to_s.strip.empty?
+        background = ActiveMail.tokens.color!(class?(node, 'secondary') ? :secondary : :primary)
+        classes = combine_classes(node, 'cta')
+        anchor = %(<a href="#{escape_attr(node.attr('href'))}"#{target_attribute(node)} style="#{link_style(background)}">#{inner}</a>)
+        [
+          %(<table class="#{classes}" #{TABLE_RESET}><tbody><tr><td>),
+          %(<table #{TABLE_RESET}><tbody><tr><td style="background:#{background};border-radius:4px;">),
+          "#{anchor}</td></tr></tbody></table></td></tr></tbody></table>"
+        ].join
+      end
+      private
+      sig { params(background: String).returns(String) }
+      def link_style(background)
+        'display:inline-block;text-decoration:none;padding:12px 24px;' \
+          "background:#{background};color:#{ActiveMail.tokens.color!(:button_text)};font-weight:bold;border-radius:4px;"
+      end
+    end
+  end
+end

data/lib/active_mail/components/h_line.rb ADDED Viewed

@@ -0,0 +1,19 @@
+# typed: strict
+# frozen_string_literal: true
+require_relative 'base'
+module ActiveMail
+  module Components
+    class HLine < Base
+      extend T::Sig
+      sig { override.params(node: Nokogiri::XML::Node, _inner: String).returns(String) }
+      def transform(node, _inner)
+        classes = combine_classes(node, 'h-line')
+        attributes = pass_through_attributes(node)
+        %(<table #{attributes}class="#{classes}" #{TABLE_RESET}#{style_attribute(node, 'width:100%;')}><tbody><tr><th>&nbsp;</th></tr></tbody></table>)
+      end
+    end
+  end
+end

data/lib/active_mail/components/info_box.rb ADDED Viewed

@@ -0,0 +1,32 @@
+# typed: strict
+# frozen_string_literal: true
+require_relative 'base'
+module ActiveMail
+  module Components
+    # Colors read from tokens at transform time (runtime config), not load-time constants.
+    class InfoBox < Base
+      extend T::Sig
+      sig { override.params(node: Nokogiri::XML::Node, inner: String).returns(String) }
+      def transform(node, inner)
+        classes = combine_classes(node, 'info-box')
+        [
+          %(<table class="#{classes}" #{TABLE_RESET} style="width:100%;"><tbody><tr>),
+          %(<td style="#{cell_style}">#{inner}</td>),
+          '</tr></tbody></table>'
+        ].join
+      end
+      private
+      sig { returns(String) }
+      def cell_style
+        tokens = ActiveMail.tokens
+        "background-color:#{tokens.color!(:background)};border-left:5px solid #{tokens.color!(:border)};" \
+          "color:#{tokens.color!(:text)};padding:#{tokens.spacing!(:md)};"
+      end
+    end
+  end
+end