voom-presenters 0.1.13 → 0.2.0

data/views/mdc/assets/scss/styles.scss

@@ -4,12 +4,13 @@
 
 .v-error-message {
     color: $v-theme-error-message;
-    margin: 20px;
     padding: 20px;
     border: 1px solid $v-theme-error-message;
     font-weight: bold;
+    border-radius: 5px;
 }
 
-.v-hidden {
+.v-hidden,
+.incompatible-browser .compatibility-wrapper * {
     display: none;
 }

data/views/mdc/assets/scss/theme.scss

@@ -12,6 +12,12 @@ $v-drawer-color: #71818c;
 
 $v-title-background: #EBF0F4;
 
+// Variables for matching Material blue-gray-orange theme
+$v-input-border-radius: 4px;
+$v-input-border-color: rgba(0, 0, 0, 0.24);
+$v-input-hover-border-color: rgba(0, 0, 0, 0.87);
+$v-input-focus-border-color: $mdc-theme-primary;
+
 .mdl-layout__header {
   background-color: $v-title-background;
   .mdl-layout__header-row {

data/views/mdc/body/header.erb

@@ -7,6 +7,7 @@
           <%= erb :"components/event", :locals => {events: header.title&.events, parent_id: header.title&.event_parent_id} %>>
       <%= expand_text(header.title&.text) %>
     </span>
+    <%= erb :"components/icon", :locals => {comp: header.title&.icon } if header.title&.icon %>
     <div class="mdl-layout-spacer"></div>
     <% if header.nav %>
       <nav class="mdl-navigation">

data/views/mdc/body/snackbar.erb

@@ -1,5 +1,5 @@
 <div id="snackbar"
-      class="mdc-snackbar"
+      class="v-snackbar mdc-snackbar v-hidden"
       aria-live="assertive"
       aria-atomic="true"
       aria-hidden="true">

data/views/mdc/components/actions/clear.rb

@@ -0,0 +1,11 @@
+module WebClient
+  module Actions
+    class Clear
+      def call(action, *)
+        # Type, URL, Options, Params (passed into javascript event/action classes)
+        [action.type, action.url, action.options.to_h, action.params.to_h]
+      end
+    end
+  end
+end
+

data/views/mdc/components/actions/delete.rb

@@ -0,0 +1,11 @@
+module WebClient
+  module Actions
+    class Delete
+      def call(action, parent_id, *)
+        # Type, URL, Options, Params (passed into javascript event/action classes)
+        [action.type, action.url,
+         action.options.to_h.merge({__parent_id__: parent_id, input_tag: action.options[:input_tag]}), {}]
+      end
+    end
+  end
+end

data/views/mdc/components/actions/dialog.rb

@@ -0,0 +1,11 @@
+module WebClient
+  module Actions
+    class Dialog
+      def call(action, *)
+        # Type, URL, Options, Params (passed into javascript event/action classes)
+        [action.type, nil, action.options.to_h, {}]
+      end
+    end
+  end
+end
+

data/views/mdc/components/actions/loads.rb

@@ -0,0 +1,11 @@
+module WebClient
+  module Actions
+    class Loads
+      def call(action, *)
+        # Type, URL, Options, Params (passed into javascript event/action classes)
+        [action.type, action.url, action.options.to_h, {}]
+      end
+    end
+  end
+end
+

data/views/mdc/components/actions/navigates.rb

@@ -0,0 +1,11 @@
+module WebClient
+  module Actions
+    class Navigates
+      def call(action, *)
+        # Type, URL, Options, Params (passed into javascript event/action classes)
+        [action.type, nil, {}, {}]
+      end
+    end
+  end
+end
+

data/views/mdc/components/actions/post.rb

@@ -0,0 +1,17 @@
+module WebClient
+  module Actions
+    class Post
+      def call(action, parent_id, *)
+        # Type, URL, Options, Params (passed into javascript event/action classes)
+        [action.type, action.url,
+         action.options.to_h.merge({__parent_id__: parent_id, input_tag: action.options[:input_tag]}),
+         nils_to_empty_string(action.params.to_h)]
+      end
+
+      private
+      def nils_to_empty_string(params)
+        params.map {|k, v| [k, v.nil? ? '' : v]}.to_h
+      end
+    end
+  end
+end

data/views/mdc/components/actions/remove.rb

@@ -0,0 +1,10 @@
+module WebClient
+  module Actions
+    class Remove
+      def call(action, *)
+        # Type, URL, Options, Params (passed into javascript event/action classes)
+        [action.type, nil, action.options.to_h, action.params.to_h]
+      end
+    end
+  end
+end

data/views/mdc/components/actions/replaces.rb

@@ -0,0 +1,12 @@
+module WebClient
+  module Actions
+    class Replaces
+      def call(action, parent_id, grid_nesting, *)
+        # Type, URL, Options, Params (passed into javascript event/action classes)
+        [action.type, action.url,
+         action.options.to_h.merge({grid_nesting: grid_nesting, __parent_id__: parent_id, input_tag: action.options[:input_tag]}),
+         {}]
+      end
+    end
+  end
+end

data/views/mdc/components/actions/snackbar.rb

@@ -0,0 +1,10 @@
+module WebClient
+  module Actions
+    class Snackbar
+      def call(action, *)
+        # Type, URL, Options, Params (passed into javascript event/action classes)
+        [action.type, action.url, action.options.to_h, action.params.to_h]
+      end
+    end
+  end
+end

data/views/mdc/components/actions/stepper.rb

@@ -0,0 +1,10 @@
+module WebClient
+  module Actions
+    class Stepper
+      def call(action, *)
+        # Type, URL, Options, Params (passed into javascript event/action classes)
+        [action.type, nil, action.options.to_h, action.params.to_h]
+      end
+    end
+  end
+end

data/views/mdc/components/actions/toggle_visibility.rb

@@ -0,0 +1,10 @@
+module WebClient
+  module Actions
+    class ToggleVisibility
+      def call(action, *)
+        # Type, URL, Options, Params (passed into javascript event/action classes)
+        [action.type, nil, action.options.to_h, action.params.to_h]
+      end
+    end
+  end
+end

data/views/mdc/components/actions/update.rb

@@ -0,0 +1,10 @@
+require_relative 'post'
+
+module WebClient
+  module Actions
+    class Update < Post
+    end
+  end
+end
+
+

data/views/mdc/components/button.erb

@@ -1,21 +1,24 @@
-<% class_name = '' unless local_variables.include? :class_name
+<%
+  class_name = '' unless local_variables.include? :class_name
+  event_parent_id = nil unless local_variables.include? :event_parent_id
+  data_attributes = '' unless local_variables.include? :data_attributes
 %>
 <% if comp
      position_classes = comp.position.map {|p| "v-button-position-#{p}"}.join(' ')
-     class_name= "#{class_name} #{position_classes}"
+     class_name = "#{class_name} #{position_classes} #{comp.full_width ? 'v-button-full-width' : nil}"
 %>
   <% if comp.menu %>
     <div class="mdc-menu-anchor" %>
   <% end %>
   <% case comp.button_type.to_sym
         when :fab %>
-            <%= erb :"components/buttons/fab", :locals => {:comp => comp, class_name: class_name} %>
+            <%= erb :"components/buttons/fab", :locals => {:comp => comp, class_name: class_name, event_parent_id: event_parent_id, data_attributes: data_attributes} %>
      <% when :icon %>
-            <%= erb :"components/buttons/icon", :locals => {:comp => comp, class_name: class_name} %>
+            <%= erb :"components/buttons/icon", :locals => {:comp => comp, class_name: class_name, event_parent_id: event_parent_id, data_attributes: data_attributes} %>
     <% when :image %>
-            <%= erb :"components/buttons/image", :locals => {:comp => comp, class_name: class_name} %>
+            <%= erb :"components/buttons/image", :locals => {:comp => comp, class_name: class_name, event_parent_id: event_parent_id, data_attributes: data_attributes} %>
     <% else  %>
-            <%= erb :"components/buttons/button", :locals => {:comp => comp, class_name: class_name} %>
+            <%= erb :"components/buttons/button", :locals => {:comp => comp, class_name: class_name, event_parent_id: event_parent_id, data_attributes: data_attributes} %>
   <% end %>
   <% if comp.menu %>
     </div>

data/views/mdc/components/buttons/button.erb

@@ -1,19 +1,24 @@
 <% class_name = '' unless local_variables.include? :class_name
    position_classes = comp.position.map {|p| "v-button-position-#{p}"}.join(' ')
-   text_align = comp.position.select {|p| eq(p, :left)}.any? && eq(comp.button_type, :flat)%>
+   text_align = comp.position.select {|p| eq(p, :left)}.any? && eq(comp.button_type, :flat)
+   event_parent_id = nil unless local_variables.include? :event_parent_id
+   data_attributes = '' unless local_variables.include? :data_attributes
+%>
 
 
-<button
-id="<%= comp.id %>"
-class="mdc-button v-js-ripple-button <%=class_name%>
+<button id="<%= comp.id %>"
+         class="mdc-button v-js-ripple-button <%=class_name%>
+         <%= 'v-hidden' if comp.hidden %>
           <%= 'mdc-button--raised' if eq(comp.button_type, :raised) %>
           <%= 'v-secondary-filled-button' if eq(comp.button_type, :raised) && eq(comp.color, :secondary) %>
           <%= 'v-secondary-text-button' if eq(comp.button_type, :flat) && eq(comp.color, :secondary) %>
           <%=  position_classes %>
            <%= "v-button-text-align-left" if text_align %>
           <%= 'v-menu-click' if comp.menu%>"
+         <%= data_attributes %>
 <%= 'disabled' if comp.disabled %>
-<%= erb :"components/event", :locals => {events: comp.events, parent_id: comp.event_parent_id} unless comp.disabled %>>
+<%= "type='#{eq(comp.button_type, :raised) ? 'submit' : 'button'}'" %>
+<%= erb :"components/event", :locals => {events: comp.events, parent_id: event_parent_id || comp.event_parent_id} unless comp.disabled %>>
   <%= erb :"components/icon", :locals => {comp: comp.icon, class_name: 'mdc-button__icon'} %>
   <%= erb :"components/image", :locals => {comp: comp.image} %>
   <%= comp.text %>

data/views/mdc/components/buttons/fab.erb

@@ -1,13 +1,19 @@
 <% class_name = '' unless local_variables.include? :class_name
    position_classes = comp.position.map {|p| "v-button-fab-position-#{p}"}.join(' ')
+   event_parent_id = nil unless local_variables.include? :event_parent_id
+   data_attributes = '' unless local_variables.include? :data_attributes
 %>
 
 <button id="<%= comp.id %>"
-        class="mdc-fab material-icons v-fab--absolute v-js-ripple-button <%= class_name %> <%= position_classes %>
+        <%= data_attributes %>
+        class="mdc-fab material-icons v-fab--absolute v-js-ripple-button
+          <%= 'v-hidden' if comp.hidden %>
+          <%= class_name %>
+          <%= position_classes %>
           <%= 'mdc-fab--mini' if eq(comp.size, :small) %>"
         aria-label="<%= inflector.humanize(comp.icon.icon) %>"
         <%= 'disabled' if comp.disabled %>
-        <%= erb :"components/event", :locals => {events: comp.events, parent_id: comp.event_parent_id} unless comp.disabled %>>
+        <%= erb :"components/event", :locals => {events: comp.events, parent_id: event_parent_id || comp.event_parent_id} unless comp.disabled %>>
   <span class="mdc-fab__icon">
   <%= comp.icon.icon %>
   </span>

data/views/mdc/components/buttons/icon.erb

@@ -1,15 +1,22 @@
 <% class_name = '' unless local_variables.include? :class_name
    position_classes = comp.position.map {|p| "v-button-icon-position-#{p}"}.join(' ')
+   event_parent_id = nil unless local_variables.include? :event_parent_id
+   data_attributes = '' unless local_variables.include? :data_attributes
 %>
 
 <button id="<%= comp.id %>"
-        class="mdl-button mdl-js-button mdl-button--icon  <%=class_name%> <%= position_classes %>
+        <%= data_attributes %>
+        class="mdl-button mdl-js-button mdl-button--icon
+         <%= 'v-hidden' if comp.hidden %>
+         <%=class_name%>
+         <%= position_classes %>
          <%= 'mdl-button--colored' if eq(comp.color, :primary) %>
          <%= 'mdl-button--accent' if eq(comp.color, :secondary) %>
          <%= 'v-menu-click' if comp.menu%>"
         style = "<%= color_style(comp) %>"
         <%= 'disabled' if comp.disabled %>
-        <%= erb :'components/event', :locals => {events: comp.events, parent_id: comp.event_parent_id} unless comp.disabled %>>
+        <%= "type='#{eq(comp.button_type, :raised) ? 'submit' : 'button'}'" %>
+        <%= erb :'components/event', :locals => {events: comp.events, parent_id: event_parent_id || comp.event_parent_id} unless comp.disabled %>>
   <%= erb :'components/icon', :locals => {comp: comp.icon} %>
   <%= comp.text %>
 </button>

data/views/mdc/components/buttons/image.erb

@@ -1,10 +1,14 @@
 <% class_name = '' unless local_variables.include? :class_name
-   position_classes = comp.position.map {|p| "v-button-position-#{p}"}.join(' ') %>
-
+   position_classes = comp.position.map {|p| "v-button-position-#{p}"}.join(' ')
+   event_parent_id = nil unless local_variables.include? :event_parent_id
+   data_attributes = '' unless local_variables.include? :data_attributes
+%>
 
 <button
   id="<%= comp.id %>"
   class="mdc-button v-js-ripple-button v-button-image <%=class_name%>
+          <%= data_attributes %>
+          <%= 'v-hidden' if comp.hidden %>
           <%= 'mdc-button--raised' if eq(comp.button_type, :raised) %>
           <%= 'v-secondary-filled-button' if eq(comp.button_type, :raised) && eq(comp.color, :secondary) %>
           <%= 'v-secondary-text-button' if eq(comp.button_type, :flat) && eq(comp.color, :secondary) %>
@@ -12,8 +16,9 @@
           <%= 'v-menu-click' if comp.menu%>"
   style="background-image: url(<%= comp.image.url %>);"
   <%= 'disabled' if comp.disabled %>
-  <%= erb :"components/event", :locals => {events: comp.events, parent_id: comp.event_parent_id} unless comp.disabled %>>
+  <%= "type='#{eq(comp.button_type, :raised) ? 'submit' : 'button'}'" %>
+  <%= erb :"components/event", :locals => {events: comp.events, parent_id: event_parent_id || comp.event_parent_id} unless comp.disabled %>>
   <%= erb :"components/icon", :locals => {comp: comp.icon, class_name: 'mdc-button__icon', position: [:right, :center]} %>
 </button>
 <%= erb :"components/tooltip", :locals => {comp: comp.tooltip, parent_id: comp.id} %>
-<%= erb :"components/menu", :locals => {comp: comp.menu, parent_id: comp.id} %>
+<%= erb :"components/menu", :locals => {comp: comp.menu, parent_id: comp.id} %>

data/views/mdc/components/card.erb

@@ -1,5 +1,8 @@
 <div id="<%=comp.id%>"
-    class="card-<%= comp.id %> mdc-card v-card
+     <% if comp.tag %>
+     data-input-tag="<%= comp.tag %>"
+     <% end %>
+    class="v-card card-<%= comp.id %> mdc-card
            <%= 'v-actionable' if comp.events %>"
      style="<%= "width: #{comp.width};" if comp.width%>
          <%= "height: #{comp.height};" if comp.height%>
@@ -16,7 +19,7 @@
         <%= erb :"components/button", :locals => {:comp => comp.media.button, class_name: "v-card__media-menu"} %>
         <%= erb :"components/image", :locals => {:comp => comp.media.image, class_name: 'v-card-media-image'} %>
         <%= erb :"components/avatar", :locals => {:comp => comp.media.avatar, class_name: 'v-card-media-avatar'} %>
-        <%= erb :"components/title", :locals => {:comp => comp.media.title, class_name: "v-card-title"} %>
+        <%= erb :"components/headline", :locals => {:comp => comp.media.title, class_name: "v-card-title"} %>
       </div>
     </div>
   <% end %>
@@ -31,7 +34,7 @@
          action_buttons = comp.actions.buttons.select {|b| !eq(b.button_type, :icon)}
          action_icons = comp.actions.buttons.select {|b| eq(b.button_type, :icon)}
     %>
-      <div class="mdc-card__actions">
+      <div class="mdc-card__actions v-card--actions">
         <div class="mdc-card__action-buttons">
           <% action_buttons.each do |button| %>
             <%= erb :"components/button", :locals => {:comp => button, class_name: 'mdc-card__action mdc-card__action--button'} %>

data/views/mdc/components/checkbox.erb

@@ -1,15 +1,26 @@
-<%  class_name = '' unless local_variables.include? :class_name %>
+<% class_name = '' unless local_variables.include? :class_name %>
 
-<div class="mdc-checkbox">
+<div class="mdc-form-field">
+<div
+<% if comp.tag %>
+data-input-tag="<%= comp.tag %>"
+<% end %>
+class="v-checkbox mdc-checkbox v-input">
   <input type="checkbox"
-         id="<%=comp.id%>"
-         name="<%=comp.name%>"
-         value="<%=comp.value%>"
+         id="<%= comp.id %>"
+         name="<%= comp.name %>"
+         data-indeterminate=<%=comp.indeterminate%>
+         <% if comp.value %>
+          value="<%= comp.value %>"
+         <% end %>
          class="mdc-checkbox__native-control
                <%= class_name %>"
-         <% if comp.checked %> checked <% end %><% if comp.disabled %> disabled <% end %>
+         <% if comp.checked %> checked
+         <% end %>
+  <% if comp.disabled %> disabled
+         <% end %>
          <%= erb :"components/event", :locals => {events: comp.events, parent_id: comp.event_parent_id} %>
-    />
+         />
   <div class="mdc-checkbox__background">
     <svg class="mdc-checkbox__checkmark"
          viewBox="0 0 24 24">
@@ -21,5 +32,6 @@
     <div class="mdc-checkbox__mixedmark"></div>
   </div>
 </div>
-<label class="v-checkbox__label" id="<%=comp.id%>" for="<%=comp.id%>"><%=comp.text%></label>
-<%= erb :"components/tooltip", :locals => {comp: comp.tooltip, parent_id: comp.id }%>
+<label class="v-checkbox__label" id="<%= comp.id %>-label" for="<%= comp.id %>"><%= comp.text %></label>
+</div>
+<%= erb :"components/tooltip", :locals => {comp: comp.tooltip, parent_id: comp.id} %>

data/views/mdc/components/chip.erb

@@ -7,16 +7,25 @@
      child_events = (leading_icon&.events || trailing_icon&.events || comp.text&.events||[]).any?
 %>
   <% if first_chip %>
-    <div class="mdc-chip-set">
+    <div class="v-chip-set mdc-chip-set">
   <% end %>
   <% if comp.menu %>
     <div class="mdc-menu-anchor">
   <% end %>
 
   <div id="<%= comp.id %>"
-       class="mdc-chip
+       <% if comp.tag %>
+       data-input-tag="<%= comp.tag %>"
+       <% end %>
+       class="v-chip v-input mdc-chip
               <%= color_classname(comp) %>
               v-menu-click"
+       <% if comp.name %>
+         data-name="<%= comp.name %>"
+       <% end %>
+       <% if comp.value %>
+         data-value="<%= comp.value %>"
+       <% end %>
        style = "<%= color_style(comp, 'background-') %>"
        tabindex="0"
        <%= erb(:"components/event", locals: {events: comp.events,
@@ -27,7 +36,7 @@
     <%= erb :"components/typography", :locals => {comp: comp.text, type: 'chip-text', class_name: 'mdc-chip__text'} %>
     <%= erb(:"components/icon", locals: {comp: trailing_icon,
                                          class_name: 'mdc-chip__icon mdc-chip__icon--trailing',
-                                         events: trailing_icon&.events || comp.events }) %>
+                                         events: child_events ? (trailing_icon&.events || comp.events) : nil}) %>
   </div>
   <% if comp.menu %>
     <%= erb :"components/list/menu", :locals => {:comp => comp.menu} %>