arara 0.2.0

data/app/assets/stylesheets/arara/application.css

@@ -0,0 +1,15 @@
+/*
+ * This is a manifest file that'll be compiled into application.css, which will include all the files
+ * listed below.
+ *
+ * Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets,
+ * or any plugin's vendor/assets/stylesheets directory can be referenced here using a relative path.
+ *
+ * You're free to add application-wide styles to this file and they'll appear at the bottom of the
+ * compiled file so the styles you add here take precedence over styles defined in any other CSS/SCSS
+ * files in this directory. Styles in this file should be added after the last require_* statement.
+ * It is generally better to create a new file per style scope.
+ *
+ *= require_tree .
+ *= require_self
+ */

data/app/components/arara.rb

@@ -0,0 +1,2 @@
+module Arara
+end

data/app/components/arara/base_component.rb

@@ -0,0 +1,62 @@
+module Arara
+  module BaseComponent
+    class MissingTag < StandardError; end
+
+    def self.included(mod)
+      attr_reader :user_content, :user_variant, :user_tag, :user_data, :id, :options
+
+      def initialize(tag: nil, content: nil, variant: nil, id: nil, data: nil, **options)
+        @user_tag = tag.try(:to_s) || default_html_tag
+        @user_variant = variant.try(:to_s)
+        @user_content = content
+        @user_data = data || {}
+        @html_class = options.fetch(:class, "")
+        @options = options
+        @id = id
+      end
+    
+      def html_content
+        return content if content
+        user_content
+      end
+    
+      def html_class
+        classes = default_html_class ? [default_html_class] : []
+        classes.push(@html_class) unless @html_class.try(:empty?)
+        classes.empty? ? [] : classes
+      end
+    
+      def html_tag
+        raise MissingTag.new('You need to specify a tag') if @user_tag.nil?
+        @user_tag
+      end
+    
+      def html_options
+        opts = options.dup
+        opts[:class] = html_class unless html_class.empty?
+        opts[:data] = html_data unless html_data.empty?
+        opts[:id] = id if id
+        opts
+      end
+    
+      def html_data
+        data_controller = default_data_controller ? [default_data_controller] : []
+        data_controller.push(user_data[:controller]) if user_data.has_key?(:controller)
+        data_controller = (data_controller.empty? ? nil : data_controller.join(" "))
+    
+        data = user_data.dup
+        data.merge!({controller: data_controller})
+        data
+      end
+    
+      def default_data_controller
+      end
+    
+      def default_html_class
+      end
+
+      def default_html_tag
+      end
+    end
+  end
+end

data/app/components/arara/button_component.html.erb

@@ -0,0 +1,7 @@
+<%= content_tag(html_tag, html_options) do %>
+  <span class="mdc-button__ripple"></span>
+  <% if has_icon? %>
+    <i class="material-icons mdc-button__icon"><%= icon %></i>
+  <% end %>
+  <span class="mdc-button__label"><%= html_content %></span>
+<% end %>

data/app/components/arara/button_component.rb

@@ -0,0 +1,50 @@
+module Arara
+  class ButtonComponent < ActionView::Component::Base
+    include Arara::BaseComponent
+    attr_reader :type, :name, :value
+
+    def initialize(variant: "text", content: "Label", dense: false, icon: nil, type: nil, name: nil, value: nil, tag: "button", **kw)
+      @dense = dense
+      @icon = icon
+      @html_class = html_class
+      @type = type
+      @name = name
+      @value = value
+      super(tag: tag, variant: variant, content: content, **kw)
+    end
+
+    # private
+      attr_reader :icon, :data
+  
+      def html_class
+        klass = ["mdc-button"]
+        klass.push("mdc-button--dense") if @dense
+        klass.push("mdc-button--raised") if @user_variant == "raised"
+        klass.push("mdc-button--unelevated") if @user_variant == "unelevated"
+        klass.push("mdc-button--outlined") if @user_variant == "outlined"
+        klass.push("#{@html_class}") if @html_class
+        klass
+      end
+
+      def has_icon?
+        @icon.present?
+      end
+
+      def default_data_controller
+        "mdc-ripple"
+      end
+
+      def html_options
+        opts = super
+        opts.merge!(
+          class: html_class, data: html_data, type: type, name: name, value: value
+        )
+      end
+
+      def html_content
+        return content if content
+        return value if value
+        user_content
+      end
+  end
+end

data/app/components/arara/card_action_buttons_component.html.erb

@@ -0,0 +1,3 @@
+<%= content_tag(html_tag, html_options) do %>
+  <%= content %>
+<% end %>

data/app/components/arara/card_action_buttons_component.rb

@@ -0,0 +1,15 @@
+module Arara
+  class CardActionButtonsComponent < ActionView::Component::Base
+    include Arara::BaseComponent
+
+    validates :content, presence: true
+
+    def initialize(**kw)
+      super(tag: "div", **kw)
+    end
+
+    def default_html_class
+      "mdc-card__action-buttons"
+    end
+  end
+end

data/app/components/arara/card_action_icons_component.html.erb

@@ -0,0 +1,3 @@
+<%= content_tag(html_tag, html_options) do %>
+  <%= content %>
+<% end %>

data/app/components/arara/card_action_icons_component.rb

@@ -0,0 +1,15 @@
+module Arara
+  class CardActionIconsComponent < ActionView::Component::Base
+    include Arara::BaseComponent
+
+    validates :content, presence: true
+
+    def initialize(**kw)
+      super(tag: "div", **kw)
+    end
+
+    def default_html_class
+      "mdc-card__action-icons"
+    end
+  end
+end

data/app/components/arara/card_actions_component.html.erb

@@ -0,0 +1,3 @@
+<%= content_tag(html_tag, html_options) do %>
+  <%= content %>
+<% end %>

data/app/components/arara/card_actions_component.rb

@@ -0,0 +1,15 @@
+module Arara
+  class CardActionsComponent < ActionView::Component::Base
+    include Arara::BaseComponent
+
+    validates :content, presence: true
+
+    def initialize(**kw)
+      super(tag: "div", **kw)
+    end
+
+    def default_html_class
+      "mdc-card__actions"
+    end
+  end
+end

data/app/components/arara/card_component.html.erb

@@ -0,0 +1,3 @@
+<%= content_tag(html_tag, html_options) do %>
+  <%= content %>
+<% end %>

data/app/components/arara/card_component.rb

@@ -0,0 +1,15 @@
+module Arara
+  class CardComponent < ActionView::Component::Base
+    include Arara::BaseComponent
+
+    validates :content, presence: true
+
+    def initialize(**kw)
+      super(tag: "div", **kw)
+    end
+
+    def default_html_class
+      "mdc-card"
+    end
+  end
+end

data/app/components/arara/card_media_component.html.erb

@@ -0,0 +1,3 @@
+<%= content_tag(html_tag, html_options.merge(style: "background-image: url(#{image_url});")) do %>
+  <%= content %>
+<% end %>

data/app/components/arara/card_media_component.rb

@@ -0,0 +1,20 @@
+module Arara
+  class CardMediaComponent < ActionView::Component::Base
+    include Arara::BaseComponent
+
+    def initialize(variant:, image_url:, content_html_class: "", **kw)
+      super(tag: "div", variant: variant, **kw)
+
+      @image_url = image_url
+      @content_html_class = content_html_class
+    end
+
+    attr_reader :image_url, :content_html_class
+
+    def default_html_class
+      return "mdc-card__media mdc-card__media--16-9" if user_variant == "wide"
+      return "mdc-card__media mdc-card__media--square" if user_variant == "square"
+      "mdc-card__media"
+    end
+  end
+end

data/app/components/arara/card_media_content_component.html.erb

@@ -0,0 +1,3 @@
+<%= content_tag(html_tag, html_options) do %>
+  <%= content %>
+<% end %>

data/app/components/arara/card_media_content_component.rb

@@ -0,0 +1,15 @@
+module Arara
+  class CardMediaContentComponent < ActionView::Component::Base
+    include Arara::BaseComponent
+
+    def initialize(**kw)
+      super(tag: "div", **kw)
+    end
+
+    attr_reader :image_url, :content_html_class
+
+    def default_html_class
+      "mdc-card__media-content"
+    end
+  end
+end

data/app/components/arara/card_primary_content_component.html.erb

@@ -0,0 +1,3 @@
+<%= content_tag(html_tag, html_options.merge(tabindex: tabindex)) do %>
+  <%= content %>
+<% end %>

data/app/components/arara/card_primary_content_component.rb

@@ -0,0 +1,18 @@
+module Arara
+  class CardPrimaryContentComponent < ActionView::Component::Base
+    include Arara::BaseComponent
+
+    validates :content, presence: true
+
+    def initialize(tabindex: 0, **kw)
+      super(tag: "div", **kw)
+      @tabindex = tabindex
+    end
+
+    attr_reader :tabindex
+
+    def default_html_class
+      "mdc-card__primary-action"
+    end
+  end
+end

data/app/components/arara/checkbox_component.html.erb

@@ -0,0 +1,22 @@
+<%= content_tag(html_tag, html_options) do %>
+  <input
+    type="checkbox"
+    class="mdc-checkbox__native-control"
+    id="<%= id %>"
+    name="<%= name %>"
+    value="<%= value %>"
+    <% if checked %>
+    checked
+    <% end %>
+  />
+  <div class="mdc-checkbox__background">
+    <svg class="mdc-checkbox__checkmark"
+          viewBox="0 0 24 24">
+      <path class="mdc-checkbox__checkmark-path"
+            fill="none"
+            d="M1.73,12.91 8.1,19.28 22.79,4.59"/>
+    </svg>
+    <div class="mdc-checkbox__mixedmark"></div>
+  </div>
+  <div class="mdc-checkbox__ripple"></div>
+<% end %>

data/app/components/arara/checkbox_component.rb

@@ -0,0 +1,25 @@
+module Arara
+  class CheckboxComponent < ActionView::Component::Base
+    include Arara::BaseComponent
+    attr_reader :id, :name, :value, :checked, :indeterminate
+
+    def initialize(id:, name:, value: 1, checked: false, indeterminate: false, **kw)
+      super(tag: "div", **kw)
+      @checked = checked
+      @indeterminate = indeterminate
+      @id = id
+      @name = name
+      @value = value
+    end
+
+    def html_data
+      data = super
+      data.merge!(checked: checked, indeterminate: indeterminate)
+      data
+    end
+
+    def default_html_class
+      'mdc-checkbox'
+    end
+  end
+end

data/app/components/arara/chip_component.html.erb

@@ -0,0 +1,13 @@
+<%= content_tag(html_tag, html_options, role: "row", id: id) do %>
+  <div class="mdc-chip__ripple"></div>
+  <%= leading_icon %>
+  <% if user_variant == "filter" %>
+  <div class="mdc-chip__checkmark">
+    <svg class="mdc-chip__checkmark-svg" viewBox="-2 -3 30 30">
+      <path class="mdc-chip__checkmark-path" fill="none" stroke="black" d="M1.73,12.91 8.1,19.28 22.79,4.59"></path>
+    </svg>
+  </div>
+  <% end %>
+  <span role="button" tabindex="0" class="mdc-chip__text"><%= label %></span>
+  <%= trailing_icon %>
+<% end %>

data/app/components/arara/chip_component.rb

@@ -0,0 +1,22 @@
+module Arara
+  class ChipComponent < ActionView::Component::Base
+    include Arara::BaseComponent
+
+    with_content_areas :leading_icon, :trailing_icon
+
+    def initialize(id:, label:, variant: "choice", selected: false, should_remove_on_trailing_icon_click: false, **kw)
+      @id = id
+      @label = label
+      @selected = selected
+      @should_remove_on_trailing_icon_click = should_remove_on_trailing_icon_click
+      super(tag: "div", variant: variant, **kw)
+    end
+
+    attr_reader :id, :label, :selected, :user_variant
+
+    def default_html_class
+      return "mdc-chip mdc-chip--selected" if selected
+      "mdc-chip"
+    end
+  end
+end

data/app/components/arara/chipset_component.html.erb

@@ -0,0 +1,6 @@
+<%= content_tag(html_tag, html_options) do %>
+  <%= options[:include_choice_hidden_field] && tag("input",
+          html_options.slice(:name, :id, :value).merge!("type" => "hidden", data: { target: 'rails-chip-set-choice.input' })  
+        ) %>
+  <%= content %>
+<% end %>

data/app/components/arara/chipset_component.rb

@@ -0,0 +1,23 @@
+module Arara
+  class ChipsetComponent < ActionView::Component::Base
+    include Arara::BaseComponent
+
+    validates :content, presence: true
+
+    def initialize(variant: "", selected_chip_ids: [], **kw)
+      @variant = variant
+      @selected_chip_ids = selected_chip_ids
+      super(tag: "div", variant: variant, **kw)
+    end
+
+    def default_data_controller
+      "mdc-chip-set"
+    end
+
+    def default_html_class
+      return "mdc-chip-set mdc-chip-set--choice" if user_variant == "choice"
+      return "mdc-chip-set mdc-chip-set--filter" if user_variant == "filter"
+      "mdc-chip-set"
+    end
+  end
+end

data/app/components/arara/data_table_body_cell_component.html.erb

@@ -0,0 +1,3 @@
+<%= content_tag(html_tag, html_options) do %>
+  <%= content %>
+<% end %>

data/app/components/arara/data_table_body_cell_component.rb

@@ -0,0 +1,18 @@
+module Arara
+  class DataTableBodyCellComponent < ActionView::Component::Base
+    include Arara::BaseComponent
+    attr_reader :numeric
+
+    validates :content, presence: true
+
+    def initialize(numeric: false, **kw)
+      super(tag: "td", **kw)
+      @numeric = numeric
+    end
+
+    def default_html_class
+      return "mdc-data-table__cell mdc-data-table__cell--numeric" if numeric
+      "mdc-data-table__cell"
+    end
+  end
+end