coprl 3.0.0.beta.4 → 3.0.0.beta.8

data/lib/coprl/presenters/rails/concerns/coprl_partial.rb

@@ -0,0 +1,51 @@
+module Coprl
+  module Presenters
+    module Rails
+      module Concerns
+        module CoprlPartial
+          extend ActiveSupport::Concern
+
+          included do
+            before_action :set_view_path
+          end
+          
+          module ClassMethods
+            @plugins = []
+            def presenter_plugin(*plugins)
+              @plugins += Array(plugins)
+            end
+
+            def plugins
+              @plugins
+            end
+          end
+
+          def set_view_path
+            paths = Coprl::Presenters::WebClient::PluginViewsPath.new(pom: nil, plugins: self.class.plugins).render
+            paths.each do |path|
+              prepend_view_path path
+            end
+          end
+
+          def prepare_context(base_params = params)
+            prepare_context = Coprl::Presenters::Settings.config.presenters.web_client.prepare_context.dup
+            prepare_context.push(method(:scrub_context))
+            context = base_params.dup.to_unsafe_hash
+            prepare_context.reduce(context) do |params, context_proc|
+              context = context_proc.call(params, session, request.env)
+            end
+            context
+          end
+
+          def scrub_context(params, _session, _env)
+            %i(grid_nesting input_tag).each do |key|
+              params.delete(key) {params.delete(key.to_s)}
+            end
+            params
+          end
+
+        end
+      end
+    end
+  end
+end

data/lib/coprl/presenters/rails/engine.rb

@@ -12,6 +12,11 @@ module Coprl
           # TODO: should rename these since they are common names that are likely going to collide
           app.middleware.use ::ActionDispatch::Static, File.join(root, '..', 'public')
         end
+
+        ActiveSupport.on_load(:action_controller) do
+          include Concerns::CoprlPartial
+        end
+
       end
     end
   end

data/lib/coprl/presenters/rails/railtie.rb

@@ -1,5 +1,3 @@
-require 'filewatcher'
-
 module Coprl
   module Presenters
     module Rails
@@ -15,20 +13,14 @@ module Coprl
 
         WATCH = -> {
           return unless ::Rails.env.development?
+
           path = ::Rails.root.join('app', '**', '*.pom')
-          puts "Watching #{path} for changes..."
-          filewatcher = Filewatcher.new(path)
-          Thread.new(filewatcher) do |fw|
-            fw.watch do |f|
-              puts "Detected updated POM file: #{f}"
-              begin
-                BOOT.call
-              rescue Exception => exc
-                puts exc.backtrace
-                puts exc.message
-              end
-            end
+          file_watcher = ActiveSupport::FileUpdateChecker.new(Dir[path]) do
+            BOOT.call
           end
+
+          ::Rails.application.reloaders << Reloader.new(file_watcher)
+
         } unless defined?(WATCH)
 
         config.after_initialize do

data/lib/coprl/presenters/rails/reloader.rb

@@ -0,0 +1,15 @@
+module Coprl
+  module Presenters
+    module Rails
+      class Reloader
+        def initialize(file_watcher)
+          @file_watcher = file_watcher
+        end
+
+        def updated?
+          @file_watcher.execute_if_updated
+        end
+      end
+    end
+  end
+end

data/lib/coprl/presenters/version.rb

@@ -1,7 +1,7 @@
 module Coprl
   module Presenters
     module Version
-      VERSION = '3.0.0.beta.4'
+      VERSION = '3.0.0.beta.8'
     end
   end
 end

data/lib/coprl/presenters/web_client/helpers/headers.rb

@@ -2,16 +2,18 @@ module Coprl::Presenters::WebClient::Helpers
   module Headers
     include Coprl::Presenters::WebClient::Helpers::HtmlSafe
 
-    def coprl_headers(base_url, request, pom)
+    def coprl_headers
+      return unless @pom
+
       html_safe (<<~HEADERS)
         <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700" type="text/css">
         <link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
         <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.4.1/css/all.css" integrity="sha384-5sAR7xN1Nv6T6+dT2mhtzEpVJvfS3NScPQTrOxhwjIuvcA67KV2R5Jz6kr4abQsz" crossorigin="anonymous">
-        <link rel="stylesheet" href="#{ base_url }/#{ request.env['SCRIPT_NAME'] }bundle.css">
-        <script defer src="#{ base_url }/#{ request.env['SCRIPT_NAME'] }bundle.js"></script>
-        #{plugin_headers(pom)}
-        #{custom_css(request.env['REQUEST_PATH'], base_url)}
-        #{pom.csrf_meta_tags}
+        <link rel="stylesheet" href="#{ @base_url }/#{ request.env['SCRIPT_NAME'] }bundle.css">
+        <script defer src="#{ @base_url }/#{ request.env['SCRIPT_NAME'] }bundle.js"></script>
+        #{plugin_headers(@pom)}
+        #{custom_css(request.env['REQUEST_PATH'], @base_url)}
+        #{@pom.csrf_meta_tags}
       HEADERS
     end
 

data/lib/coprl/presenters/web_client/helpers/rails/template_helper.rb

@@ -0,0 +1,10 @@
+module Coprl::Presenters::WebClient::Helpers::Rails
+  module TemplateHelper
+    def with_presenters_wrapper(&block)
+      render partial: 'body/wrapper', locals: {
+        body_content: capture(&block), header: @pom&.header, drawer: @pom&.drawer,
+        footer: @pom&.footer
+      }
+    end
+  end
+end

data/lib/coprl/presenters/web_client/helpers/rails.rb

@@ -8,5 +8,6 @@ module Coprl::Presenters::WebClient::Helpers
     include Namespaced
     include Raw
     include EscapeHtml
+    include TemplateHelper
   end
 end

data/lib/coprl/presenters/web_client/helpers/sinatra/template_helper.rb

@@ -0,0 +1,20 @@
+module Coprl::Presenters::WebClient::Helpers::Sinatra
+  module TemplateHelper
+    def with_presenters_wrapper(&block)
+      buffer << partial("body/wrapper", locals: {
+        body_content: capture(buffer, &block), header: @pom&.header, drawer: @pom&.drawer,
+        footer: @pom&.footer
+      })
+    end
+
+    def buffer()
+      @_out_buf
+    end
+
+    def capture(buffer)
+      pos = buffer.size
+      yield
+      buffer.slice!(pos..buffer.size)
+    end
+  end
+end

data/lib/coprl/presenters/web_client/helpers/sinatra.rb

@@ -7,5 +7,6 @@ module Coprl::Presenters::WebClient::Helpers
     include SafeMarkdown
     include Raw
     include EscapeHtml
+    include TemplateHelper
   end
 end

data/lib/coprl/presenters/web_client/plugin_views_path.rb

@@ -8,17 +8,17 @@ module Coprl
         extend Pluggable
         include_plugins(:WebClientComponents)
 
-        def initialize(pom:)
+        def initialize(pom: nil, plugins: nil)
           @pom = pom
+          @plugins = plugins || []
           initialize_plugins
         end
 
         def render
           results = []
-          ((@plugins||[]) + Coprl::Presenters::Settings.config.presenters.plugins).each do |plugin|
+          (@plugins + Coprl::Presenters::Settings.config.presenters.plugins).each do |plugin|
             view_dir_method = :"view_dir_#{plugin}"
-            results << send(view_dir_method,
-                 @pom) if respond_to?(view_dir_method)
+            results << send(view_dir_method, @pom) if respond_to?(view_dir_method)
           end
           results
         end
@@ -26,7 +26,7 @@ module Coprl
         private
 
         def initialize_plugins
-          @plugins = @pom.send(:plugins)
+          @plugins += @pom.send(:plugins) if @pom
           self.class.include_plugins(:WebClientComponents, plugins: @plugins)
         end
       end

data/public/bundle.js

@@ -48739,9 +48739,7 @@ var VPosts = function (_VBase) {
                 }
             }
 
-            var paramCount = Array.from(formData).length;
-
-            if (paramCount < 1) {
+            if (this.paramCount(formData) < 1) {
                 console.warn('Creating request with no data!' + ' Are you sure you\'ve hooked everything up correctly?');
             }
 
@@ -48910,9 +48908,17 @@ var VPosts = function (_VBase) {
                 }
 
                 // Send our FormData object; HTTP headers are set automatically
-                httpRequest.send(formData);
+                // Rack 2.2 will throw an exception https://github.com/rack/rack/issues/1603
+                // if we set the header as multi-part form data with no data in the body
+                // So we set the body to null in this case.
+                httpRequest.send(_this2.paramCount(formData) < 1 ? null : formData);
             });
         }
+    }, {
+        key: 'paramCount',
+        value: function paramCount(formData) {
+            return Array.from(formData).length;
+        }
     }, {
         key: 'isForm',
         value: function isForm() {

data/public/wc.js

@@ -34213,9 +34213,7 @@ var VPosts = function (_VBase) {
                 }
             }
 
-            var paramCount = Array.from(formData).length;
-
-            if (paramCount < 1) {
+            if (this.paramCount(formData) < 1) {
                 console.warn('Creating request with no data!' + ' Are you sure you\'ve hooked everything up correctly?');
             }
 
@@ -34384,9 +34382,17 @@ var VPosts = function (_VBase) {
                 }
 
                 // Send our FormData object; HTTP headers are set automatically
-                httpRequest.send(formData);
+                // Rack 2.2 will throw an exception https://github.com/rack/rack/issues/1603
+                // if we set the header as multi-part form data with no data in the body
+                // So we set the body to null in this case.
+                httpRequest.send(_this2.paramCount(formData) < 1 ? null : formData);
             });
         }
+    }, {
+        key: 'paramCount',
+        value: function paramCount(formData) {
+            return Array.from(formData).length;
+        }
     }, {
         key: 'isForm',
         value: function isForm() {

data/rails-engine/app/controllers/coprl_controller.rb

@@ -23,21 +23,4 @@ class CoprlController < ApplicationController
       prepend_view_path path
     end
   end
-
-  def prepare_context(base_params = params)
-    prepare_context = Coprl::Presenters::Settings.config.presenters.web_client.prepare_context.dup
-    prepare_context.push(method(:scrub_context))
-    context = base_params.dup.to_unsafe_hash
-    prepare_context.reduce(context) do |params, context_proc|
-      context = context_proc.call(params, session, request.env)
-    end
-    context
-  end
-
-  def scrub_context(params, _session, _env)
-    %i(grid_nesting input_tag).each do |key|
-      params.delete(key) {params.delete(key.to_s)}
-    end
-    params
-  end
 end

data/rails-engine/app/views/layouts/coprl.html.erb

@@ -7,14 +7,14 @@
   <title><%= @pom.page.title if @pom.page %></title>
   <meta name="description" content="">
   <meta name="viewport" content="width=device-width, initial-scale=1">
-  <%= coprl_headers(@base_url, request, @pom) %>
+  <%= coprl_headers %>
   <%= csrf_meta_tags %>
   <%= csp_meta_tag if defined?(csp_meta_tag) %>
 </head>
 <body>
-<%= partial "body/preamble", :locals => {pom:@pom} %>
-<%= yield %>
-<%= partial "body/postamble", :locals => {pom:@pom} %>
+<%= with_presenters_wrapper do %>
+  <%= yield %>
+<% end %>
 <noscript><p>JavaScript must be enabled to continue.</p></noscript>
 </body>
 </html>

data/rails-engine/config/initializers/presenters.rb

@@ -28,9 +28,11 @@ class CoprlTemplateHandler
         # otherwise we need to get the presenter name built from params
         presenter_name = local_assigns[:presenter] ? presenter : namespaced_presenter(params)
         presenter = Coprl::Presenters::App[presenter_name].call
-        context = params.dup.to_unsafe_hash
+        context = self.controller.prepare_context(params)
         router = Coprl::Presenters::WebClient::Router.new(base_url: request.base_url)
-        @pom = presenter.expand(router: router, context: context)
+        plugins = self.controller.class.plugins
+      
+        @pom = presenter.expand(router: router, context: context, plugins: plugins)
       end
       #{source}
       end

data/rails-engine/config/initializers/routes.rb

@@ -0,0 +1,5 @@
+Rails.application.config.to_prepare do
+  Coprl::Presenters::Settings.configure do |config|
+    config.presenters.helpers << Coprl::Presenters::Helpers::Rails
+  end
+end

data/views/mdc/assets/js/components/events/posts.js

@@ -59,13 +59,10 @@ export class VPosts extends VBase {
             formData.append(name, encode(value));
         }
 
-        const paramCount = Array.from(formData).length;
-
-        if (paramCount < 1) {
+        if (this.paramCount(formData) < 1) {
             console.warn(
                 'Creating request with no data!'
-                + ' Are you sure you\'ve hooked everything up correctly?',
-            );
+                + ' Are you sure you\'ve hooked everything up correctly?');
         }
 
         let errors = this.validate(formData);
@@ -185,10 +182,17 @@ export class VPosts extends VBase {
             }
 
             // Send our FormData object; HTTP headers are set automatically
-            httpRequest.send(formData);
+            // Rack 2.2 will throw an exception https://github.com/rack/rack/issues/1603
+            // if we set the header as multi-part form data with no data in the body
+            // So we set the body to null in this case.
+            httpRequest.send(this.paramCount(formData) < 1 ? null : formData);
         });
     }
 
+    paramCount(formData){
+        return Array.from(formData).length;
+    }
+
     isForm() {
         var parentElement = this.parentElement();
         return parentElement && parentElement.elements;

data/views/mdc/body/{_preamble.erb → _wrapper.erb}

@@ -1,15 +1,10 @@
 <%
-  header = pom.header
-  drawer = pom.drawer
-  footer = pom.footer
-
   root_classes = []
   root_classes << 'v-root--header-present' if header
   root_classes << 'v-root--drawer-present' if drawer
   root_classes << 'v-root--footer-present' if footer
 %>
 <div class="v-root compatibility-wrapper mdc-typography <%= root_classes.join(' ') %>">
-
   <% if drawer %>
     <div class="drawer-frame-root">
       <%= partial "body/dismissable-drawer", :locals => {drawer: drawer} %>
@@ -22,5 +17,21 @@
     <div class="drawer-main-content">
       <%= partial "body/modal-drawer", :locals => {drawer: drawer} %>
   <% end %>
+
+  <%= body_content %>
+
   <div class="v-page-content page-content">
     <div class="v-errors">
+    </div>
+  </div>
+  <% if drawer %>
+    </div>
+    </div>
+    </div>
+  <% end %>
+
+  <%= partial "body/snackbar" %>
+  <% if footer %>
+    <%= partial "body/footer", :locals => {:footer => footer} %>
+  <% end %>
+</div>

data/views/mdc/components/_card.erb

@@ -1,7 +1,7 @@
 <div id="<%= comp.id %>" class="<%= 'v-hidden' if comp.hidden %>">
   <div
-  <% if comp.tag %>
-  data-input-tag="<%= comp.tag %>"
+  <% if comp.input_tag %>
+  data-input-tag="<%= comp.input_tag %>"
   <% end %>
   <%= draggable_attributes(comp) %>
   <%= drop_zone_attributes(comp) %>

data/views/mdc/components/_checkbox.erb

@@ -3,7 +3,7 @@
 %>
 <div class="v-form-field mdc-form-field">
   <div id="<%= comp.id %>"
-       <% if comp.tag %>data-input-tag="<%= comp.tag %>"<% end %>
+       <% if comp.input_tag %>data-input-tag="<%= comp.input_tag %>"<% end %>
        <% if comp.dirtyable %>data-dirtyable<% end %>
        class="v-checkbox mdc-checkbox v-input
               <%= data_table_class_name %>">

data/views/mdc/components/_chip.erb

@@ -9,8 +9,8 @@
   <% end %>
 
   <button id="<%= comp.id %>"
-          <% if comp.tag %>
-          data-input-tag="<%= comp.tag %>"
+          <% if comp.input_tag %>
+          data-input-tag="<%= comp.input_tag %>"
           <% end %>
           class="v-chip v-input mdc-chip
               <%= color_classname(comp) %>

data/views/mdc/components/_content.erb

@@ -3,8 +3,8 @@
      position_classes = comp.position.map {|p| "v-content-position-#{p}"}.join(' ')
 %>
   <div id="<%= comp.id %>"
-       <% if comp.tag %>
-       data-input-tag="<%= comp.tag %>"
+       <% if comp.input_tag %>
+       data-input-tag="<%= comp.input_tag %>"
        <% end %>
        <%= draggable_attributes(comp) %>
        <%= drop_zone_attributes(comp) %>

data/views/mdc/components/_datetime.erb

@@ -3,7 +3,7 @@
   type_class = comp.picker ? 'v-datetime' : 'v-date-text'
 %>
 <div id="<%= comp.id %>"
-     <% if comp.tag %>data-input-tag="<%= comp.tag %>"<% end %>
+     <% if comp.input_tag %>data-input-tag="<%= comp.input_tag %>"<% end %>
      <% if comp.dirtyable %>data-dirtyable<% end %>
      class="v-input <%= type_class %> mdc-text-field mdc-text-field--outlined
             <%= 'mdc-text-field--with-trailing-icon' if comp.clear_icon %>

data/views/mdc/components/_dialog.erb

@@ -2,8 +2,8 @@
   dialog_action_buttons = Array(comp&.actions&.buttons)
 %>
 <div id="<%= comp.id %>"
-     <% if comp.tag %>
-     data-input-tag="<%= comp.tag %>"
+     <% if comp.input_tag %>
+     data-input-tag="<%= comp.input_tag %>"
      <% end %>
      class="v-dialog mdc-dialog"
      role="alertdialog"

data/views/mdc/components/_form.erb

@@ -1,6 +1,6 @@
 <form role="form"
-      <% if comp.tag %>
-      data-input-tag="<%= comp.tag %>"
+      <% if comp.input_tag %>
+      data-input-tag="<%= comp.input_tag %>"
       <% end %>
       id="<%= comp.id %>"
       class="v-form"

data/views/mdc/components/_grid.erb

@@ -6,8 +6,8 @@
    @gutters.push comp.gutter.nil? ? @gutters.last : comp.gutter
 %>
 <div id="<%= comp.id %>"
-     <% if comp.tag %>
-     data-input-tag="<%= comp.tag %>"
+     <% if comp.input_tag %>
+     data-input-tag="<%= comp.input_tag %>"
      <% end %>
      class="v-grid mdc-layout-grid
             <%= _padding_classes_(comp.padding, @grid_nesting) %>

data/views/mdc/components/_hidden_field.erb

@@ -1,5 +1,5 @@
 <input class="v-input v-hidden-field"
        type="hidden"
-       <% if comp.tag %>data-input-tag="<%= comp.tag %>"<% end %>
+       <% if comp.input_tag %>data-input-tag="<%= comp.input_tag %>"<% end %>
        <% if comp.dirtyable %>data-dirtyable<% end %>
        id="<%= comp.id %>" name="<%= comp.name %>" value="<%= comp.value %>"/>

data/views/mdc/components/_multi_select.erb

@@ -2,7 +2,7 @@
      float_label = comp.options.select{|o| o.selected }.any?
 %>
   <div class="v-multi-select-container"
-       <% if comp.tag %>data-input-tag="<%= comp.tag %>"<% end %>
+       <% if comp.input_tag %>data-input-tag="<%= comp.input_tag %>"<% end %>
        <% if comp.dirtyable %>data-dirtyable<% end %>>
     <div class="v-multi-select--options-list v-hidden">
       <% comp.options.each do |option| %>

data/views/mdc/components/_number_field.erb

@@ -4,7 +4,7 @@
      auto_complete = comp.auto_complete&.to_sym == :off ? 'extra-off' : comp.auto_complete
 %>
   <div id="<%= comp.id %>"
-       <%= "data-input-tag='#{comp.tag}'" if comp.tag %>
+       <%= "data-input-tag='#{comp.input_tag}'" if comp.input_tag %>
        <%= 'data-dirtyable' if comp.dirtyable %>
        class="v-input v-text-field v-focusable mdc-text-field mdc-text-field--outlined
             <%= 'mdc-text-field--with-leading-icon' if leading_icon %>

data/views/mdc/components/_radio_button.erb

@@ -1,6 +1,6 @@
 <div class="v-form-field mdc-form-field">
   <div id="<%= comp.id %>"
-       <% if comp.tag %>data-input-tag="<%= comp.tag %>"<% end %>
+       <% if comp.input_tag %>data-input-tag="<%= comp.input_tag %>"<% end %>
        <% if comp.dirtyable %>data-dirtyable<% end %>
        class="v-radio mdc-radio v-input">
     <input class="mdc-radio__native-control"

data/views/mdc/components/_rich_text_area.erb

@@ -1,6 +1,6 @@
 <div class="v-rich-text-area-container v-input"
      id="<%= comp.id %>"
-     <% if comp.tag %>data-input-tag="<%= comp.tag %>"<% end %>
+     <% if comp.input_tag %>data-input-tag="<%= comp.input_tag %>"<% end %>
      <% if comp.dirtyable %>data-dirtyable<% end %>
      <% if comp.height %>data-initial-height="<%= comp.height %>"<% end %>
      <% if comp.resizable %>data-resizable<% end %>

data/views/mdc/components/_select.erb

@@ -4,7 +4,7 @@
   <div class="mdc-select v-select v-input
               <%= 'mdc-select--outlined' if comp.outlined %>
               <% if comp.disabled %>mdc-select--disabled<% end %>"
-       <% if comp.tag %>data-input-tag="<%= comp.tag %>"<% end %>
+       <% if comp.input_tag %>data-input-tag="<%= comp.input_tag %>"<% end %>
        <% if comp.dirtyable %>data-dirtyable<% end %>
        <%= 'style="width: 100%;"' if comp.full_width %>>
     <%= partial "components/icon", :locals => {comp: comp.icon, class_name: 'mdc-select__icon', parent_id: "#{comp.id}-input", size_class: '', position: []} if comp.icon %>

data/views/mdc/components/_slider.erb

@@ -1,6 +1,6 @@
 <div id="<%= comp.id %>"
-     <% if comp.tag %>
-     data-input-tag="<%= comp.tag %>"
+     <% if comp.input_tag %>
+     data-input-tag="<%= comp.input_tag %>"
      <% end %>
     class="v-slider v-input mdc-slider
       <%= 'mdc-slider--discrete' if comp.discrete %>

data/views/mdc/components/_stepper.erb

@@ -3,8 +3,8 @@
 %>
 <div class="v-errors">
   <ul id="<%= comp.id %>"
-      <% if comp.tag %>
-      data-input-tag="<%= comp.tag %>"
+      <% if comp.input_tag %>
+      data-input-tag="<%= comp.input_tag %>"
       <% end %>
       class="mdl-stepper v-stepper
             <%= ' mdl-stepper--horizontal' if horizontal %>
@@ -18,8 +18,8 @@
   <div id="<%= comp.id %>-content">
     <% for step in comp.steps %>
       <div id="<%= step.id %>-content"
-           <% if step.tag %>
-           data-input-tag="<%= step.tag %>"
+           <% if step.input_tag %>
+           data-input-tag="<%= step.input_tag %>"
            <% end %>
            class="v-content v-step__content v-step__content-<%= step.id %>
             <%= ' is-active' if step.selected %>

data/views/mdc/components/_switch.erb

@@ -3,7 +3,7 @@
 
 <div class="v-form-field mdc-form-field">
   <div id="<%= comp.id %>"
-       <% if comp.tag %>data-input-tag="<%= comp.tag %>"<% end %>
+       <% if comp.input_tag %>data-input-tag="<%= comp.input_tag %>"<% end %>
        <% if comp.dirtyable %>data-dirtyable<% end %>
        class="v-switch v-input mdc-switch
       <%= 'mdc-switch--disabled' if comp.disabled %>

data/views/mdc/components/_text_area.erb

@@ -1,6 +1,6 @@
 <div id="<%= comp.id %>" class="v-input v-text-field mdc-text-field mdc-text-field--textarea
             <% if comp.disabled %>mdc-text-field--disabled<% end %>"
-     <% if comp.tag %>data-input-tag="<%= comp.tag %>"<% end %>
+     <% if comp.input_tag %>data-input-tag="<%= comp.input_tag %>"<% end %>
      <% if comp.dirtyable %>data-dirtyable<% end %>
      style="<%= 'width:100%' if comp.full_width %>">
   <textarea id="<%= comp.id %>-input"

data/views/mdc/components/_text_field.erb

@@ -5,7 +5,7 @@
      behavior = comp.behavior || 'text'
 %>
   <div id="<%= comp.id %>"
-       <% if comp.tag %>data-input-tag="<%= comp.tag %>"<% end %>
+       <% if comp.input_tag %>data-input-tag="<%= comp.input_tag %>"<% end %>
        <% if comp.dirtyable %>data-dirtyable<% end %>
        class="v-input v-text-field v-focusable mdc-text-field mdc-text-field--outlined
             <%= 'mdc-text-field--with-leading-icon' if leading_icon %>