fleetio_spark 0.2.40 → 0.2.41

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 (63) hide show
  1. checksums.yaml +4 -4
  2. data/app/assets/javascripts/spark/_icons.js +1 -1
  3. data/app/assets/javascripts/spark/components/nav/_tabs.js +1 -1
  4. data/app/assets/stylesheets/spark/components/_index.scss +3 -1
  5. data/app/assets/stylesheets/spark/components/app/_sidebar.scss +2 -2
  6. data/app/assets/stylesheets/spark/components/app/sidebar/_header.scss +1 -1
  7. data/app/assets/stylesheets/spark/components/button/_button.scss +84 -0
  8. data/app/assets/stylesheets/spark/components/button/_button_group.scss +32 -0
  9. data/app/assets/stylesheets/spark/components/button/_disabled.scss +11 -0
  10. data/app/assets/stylesheets/spark/components/button/_size.scss +60 -0
  11. data/app/assets/stylesheets/spark/components/button/_theme-base.scss +23 -0
  12. data/app/assets/stylesheets/spark/components/button/_theme-primary.scss +22 -0
  13. data/app/assets/stylesheets/spark/components/button/_theme-text.scss +28 -0
  14. data/app/assets/stylesheets/spark/components/form/_switch.scss +4 -2
  15. data/app/assets/stylesheets/spark/components/layout/_grid.scss +7 -1
  16. data/app/assets/stylesheets/spark/components/nav/_item.scss +3 -1
  17. data/app/assets/stylesheets/spark/components/nav/_pills.scss +1 -1
  18. data/app/assets/stylesheets/spark/components/nav/_sidebar.scss +2 -2
  19. data/app/assets/stylesheets/spark/components/nav/_tabs.scss +2 -2
  20. data/app/assets/stylesheets/spark/core/_text.scss +1 -1
  21. data/app/assets/stylesheets/spark/core/_vars.scss +2 -1
  22. data/app/components/spark/app/sidebar_component.rb +1 -1
  23. data/app/components/spark/button/add_component.rb +9 -0
  24. data/app/components/spark/button/base_component.rb +39 -0
  25. data/app/components/spark/button/cancel_component.rb +8 -0
  26. data/app/components/spark/button/danger_component.rb +8 -0
  27. data/app/components/spark/button/group_component.rb +24 -0
  28. data/app/components/spark/button/icon_component.rb +14 -0
  29. data/app/components/spark/button/primary_component.rb +8 -0
  30. data/app/components/spark/button/text_component.rb +8 -0
  31. data/app/components/spark/form/input_component.rb +3 -0
  32. data/app/components/spark/form/label_component.rb +3 -3
  33. data/app/components/spark/form/switch_component.rb +7 -4
  34. data/app/components/spark/layout/grid/column_component.rb +11 -17
  35. data/app/components/spark/layout/grid_component.rb +14 -11
  36. data/app/components/spark/nav/group_component.rb +6 -4
  37. data/app/components/spark/nav/item_component.rb +2 -2
  38. data/app/components/spark/nav/pills_component.rb +1 -1
  39. data/app/components/spark/nav/sidebar_component.rb +5 -8
  40. data/app/components/spark/nav/tabs_component.rb +4 -2
  41. data/app/components/spark/nav/tree/group_component.rb +1 -1
  42. data/app/components/spark/nav/tree_component.rb +1 -2
  43. data/app/components/spark/ui/icon_component.rb +4 -4
  44. data/lib/fleetio_spark/component.rb +6 -11
  45. data/lib/fleetio_spark/version.rb +1 -1
  46. data/public/code-0.2.41.js +2 -0
  47. data/public/code-0.2.41.js.gz +0 -0
  48. data/public/code-0.2.41.js.map +1 -0
  49. data/public/{spark-0.2.40.css → spark-0.2.41.css} +1 -1
  50. data/public/spark-0.2.41.css.gz +0 -0
  51. data/public/spark-0.2.41.js +2 -0
  52. data/public/spark-0.2.41.js.gz +0 -0
  53. data/public/spark-0.2.41.js.map +1 -0
  54. metadata +25 -12
  55. data/app/assets/stylesheets/spark/components/ui/_button.scss +0 -0
  56. data/app/components/spark/ui/button_component.rb +0 -15
  57. data/public/code-0.2.40.js +0 -2
  58. data/public/code-0.2.40.js.gz +0 -0
  59. data/public/code-0.2.40.js.map +0 -1
  60. data/public/spark-0.2.40.css.gz +0 -0
  61. data/public/spark-0.2.40.js +0 -2
  62. data/public/spark-0.2.40.js.gz +0 -0
  63. data/public/spark-0.2.40.js.map +0 -1
@@ -1,4 +1,4 @@
1
1
  body {
2
2
  font-family: $base-font;
3
- color: $fl-gray-900;
3
+ color: $base-text-color;
4
4
  }
@@ -10,7 +10,8 @@ $radius-lg: 8px;
10
10
  $base-font: -apple-system, BlinkMacSystemFont, 'Avenir Next', Avenir, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol';
11
11
  $mono-font: 'Roboto Mono', Consolas, 'Andale Mono WT', 'Andale Mono', 'Lucida Console', 'Lucida Sans Typewriter', 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', 'Liberation Mono', 'Nimbus Mono L', Monaco, 'Courier New', Courier, monospace;
12
12
 
13
- // Links
13
+ // Text colors
14
+ $base-text-color: $fl-gray-900;
14
15
  $link-color: $fl-blue-600;
15
16
  $link-hover-color: $fl-blue-700;
16
17
 
@@ -7,7 +7,7 @@ class App::SidebarComponent < Nav::SidebarComponent
7
7
 
8
8
  element :nav, component: "nav/tree" do
9
9
  root_attr id: "app-sidebar-nav"
10
- attribute root_icon_size: "18px"
10
+ attribute root_icon_size: :medium
11
11
  end
12
12
 
13
13
  def render
@@ -0,0 +1,9 @@
1
+ class Button::AddComponent < Button::PrimaryComponent
2
+ attribute color: 'green'
3
+ attribute icon: 'plus'
4
+
5
+ def before_render
6
+ super
7
+ end
8
+
9
+ end
@@ -0,0 +1,39 @@
1
+ class Button::BaseComponent < SparkComponents::Component
2
+ COLORS = %i(blue green yellow red)
3
+ SIZES = %i(small base medium large)
4
+
5
+ attribute :text, :color, :size, :icon, :href
6
+ root_attr :value, :disabled, :name, :target, type: :button
7
+ aria_attr :hidden
8
+
9
+ base_class "spark-button"
10
+
11
+ validates_choice :size, SIZES.dup, required: false
12
+ validates_choice :color, COLORS.dup, required: false
13
+ validates :text, presence: true, if: -> { @yield.nil? }
14
+
15
+ def before_render
16
+ add_class("size-#{size}") if size
17
+ add_class("color-#{color}") if color
18
+ if (href && (data_attr[:remote] || data_attr[:method]))
19
+ root_attr rel: "nofollow"
20
+ end
21
+ end
22
+
23
+ def render
24
+ content_tag(:div, class: join_class("wrapper")) do
25
+ if href
26
+ link_to(button_content, href, tag_attrs)
27
+ else
28
+ tag.button(button_content, tag_attrs)
29
+ end
30
+ end
31
+ end
32
+
33
+ def button_content
34
+ capture {
35
+ concat component("ui/icon", name: icon) if icon
36
+ concat tag.span(text || @yield, class: join_class(:label))
37
+ }
38
+ end
39
+ end
@@ -0,0 +1,8 @@
1
+ class Button::CancelComponent < Button::TextComponent
2
+ aria_attr hidden: true
3
+
4
+ def before_render
5
+ super
6
+ end
7
+
8
+ end
@@ -0,0 +1,8 @@
1
+ class Button::DangerComponent < Button::PrimaryComponent
2
+ attribute color: :red
3
+
4
+ def before_render
5
+ super
6
+ end
7
+
8
+ end
@@ -0,0 +1,24 @@
1
+ class Button::GroupComponent < SparkComponents::Component
2
+ COLORS = Button::BaseComponent::COLORS
3
+ SIZES = Button::BaseComponent::SIZES
4
+
5
+ attribute :color, :size
6
+ root_attr role: "group"
7
+
8
+ base_class "spark-button-group"
9
+
10
+ validates_choice :color, COLORS, required: false
11
+ validates_choice :size, SIZES, required: false
12
+
13
+ element :button, multiple: true, component: "button/base"
14
+
15
+ def render
16
+ unless buttons.empty?
17
+ content_tag(:div, tag_attrs) do
18
+ buttons.each { |button|
19
+ concat button
20
+ }
21
+ end
22
+ end
23
+ end
24
+ end
@@ -0,0 +1,14 @@
1
+ class Button::IconComponent < Button::BaseComponent
2
+
3
+ def before_render
4
+ aria_attr label: text
5
+ add_class("theme-icon-only")
6
+ super
7
+ end
8
+
9
+ validates :icon, presence: true
10
+
11
+ def button_content
12
+ concat component("ui/icon", name: icon, class: join_class('icon')) if icon
13
+ end
14
+ end
@@ -0,0 +1,8 @@
1
+ class Button::PrimaryComponent < Button::BaseComponent
2
+
3
+ def before_render
4
+ add_class("theme-primary")
5
+ super
6
+ end
7
+
8
+ end
@@ -0,0 +1,8 @@
1
+ class Button::TextComponent < Button::BaseComponent
2
+
3
+ def before_render
4
+ add_class("theme-text")
5
+ super
6
+ end
7
+
8
+ end
@@ -3,4 +3,7 @@ class Form::InputComponent < SparkComponents::Component
3
3
  attribute :label
4
4
  add_class "spark-input"
5
5
 
6
+ # TODO: Add aria attribute validation when component attribute features are fixed.
7
+ # If a label is not passed, require an aria-label for accessibility
8
+ #validates :label, presence: { message: %q(a label or `aria: { label: "text" }` is required for accessiblity) }, unless: -> { @aria.present? && @aria[:label].present? }
6
9
  end
@@ -1,10 +1,10 @@
1
1
  class Form::LabelComponent < SparkComponents::Component
2
2
  attribute :text
3
- base_class "label"
3
+ base_class "spark-label"
4
4
 
5
5
  def render
6
- content_tag(:label, tag_attrs) do
7
- concat content_tag(:div, text, class: join_class("text"))
6
+ tag.label(tag_attrs) do
7
+ concat tag.div(text, class: "label-text") if text
8
8
  concat @yield
9
9
  end
10
10
 
@@ -1,12 +1,15 @@
1
1
  class Form::SwitchComponent < Form::CheckboxComponent
2
+ SIZE = %i[small medium].freeze
3
+ ALIGNMENT = %i[left right].freeze
4
+
2
5
  base_class "spark-switch"
3
- attribute :size, align: :left
6
+ attribute size: :medium, align: :left, value: true
4
7
 
5
- validates_choice :size, %i[small medium], required: false
6
- validates_choice :align, %i[left right]
8
+ validates_choice :size, SIZE
9
+ validates_choice :align, ALIGNMENT
7
10
 
8
11
  def before_render
9
- add_class(size) if size
12
+ add_class(size)
10
13
  add_class(join_class("align-#{align}")) if align
11
14
  end
12
15
 
@@ -1,18 +1,18 @@
1
1
  class Layout::Grid::ColumnComponent < SparkComponents::Component
2
- SPAN_CLASSES = (1..12).to_a
3
- base_class "spark-grid-column"
4
- attribute :fill
2
+ SPAN_NAME = { half: 6, third: 4, fourth: 3, sixth: 2 }.freeze
3
+ SPAN = [*(1..12), *SPAN_NAME.keys].freeze
4
+ OFFSET = [*(1..11), *SPAN_NAME.keys].freeze
5
5
 
6
6
  data_attr :span, :offset
7
7
 
8
- validates_choice :span, (1..12).to_a.concat(%w(half third fourth sixth)), required: false
9
- validates_choice :offset, (1..11).to_a.concat(%w(half third fourth sixth)), required: false
8
+ validates_choice :span, SPAN, required: false
9
+ validates_choice :offset, OFFSET, required: false
10
10
 
11
11
  def before_render
12
+ base_class "spark-grid-column"
12
13
  @span ||= parent.span if parent && parent.respond_to?(:span)
13
14
  data_attr span: span_name(span) || 0
14
15
  data_attr offset: span_name(offset)
15
- add_class "fill-column" if @fill
16
16
  end
17
17
 
18
18
  def render
@@ -20,19 +20,13 @@ class Layout::Grid::ColumnComponent < SparkComponents::Component
20
20
  end
21
21
 
22
22
  def span_name(size)
23
+ return if size.nil?
23
24
  if size.is_a? Integer
24
- SPAN_CLASSES[size - 1]
25
+ SPAN[size - 1]
25
26
  elsif size.is_a? Float
26
- SPAN_CLASSES[(SPAN_CLASSES.size * size) - 1]
27
- else
28
- size = case size
29
- when :half then 2
30
- when :third then 3
31
- when :fourth then 4
32
- when :sixth then 6
33
- else return size
34
- end
35
- SPAN_CLASSES[(SPAN_CLASSES.size / size) - 1]
27
+ SPAN[(SPAN.size * size) - 1]
28
+ elsif size = SPAN_NAME[size.to_sym]
29
+ SPAN[(12 / size) - 1]
36
30
  end
37
31
  end
38
32
  end
@@ -1,32 +1,35 @@
1
1
  class Layout::GridComponent < SparkComponents::Component
2
- attribute :gutter, :gutter_match, :reverse, :cols, :span, :break, :min, wrap: true
2
+ COLUMN = [1,2,3,4,6,12].freeze
3
+ GUTTER = %i[small base medium large xl].freeze
3
4
 
4
- base_class "spark-grid"
5
+ attribute :span, :cols, :gutter, :gutter_match, :min, wrap: true
5
6
 
6
- element :column, multiple: true, component: "layout/grid/column"
7
+ validates_choice :span, Layout::Grid::ColumnComponent::SPAN, required: false
8
+ validates_choice :cols, COLUMN, required: false
9
+ validates_choice :gutter, GUTTER, required: false
7
10
 
8
- validates_choice :span, (1..12).to_a.concat(%w(half third fourth sixth)), required: false
9
- validates_choice :cols, [1,2,3,4,6,12], required: false
10
- validates_choice :gutter, %i[default small medium large xl], required: false
11
+ element :column, multiple: true, component: "layout/grid/column"
11
12
 
12
13
  def after_init
14
+ raise "Grids do not support both cols and span. Set `span` (default span for colums), or `cols` (the number of columns per row)" if span && cols
15
+ @gutter ||= :base if gutter_match
13
16
  @span = 12 / @cols if @cols
14
17
  end
15
18
 
16
19
  def before_render
20
+ base_class "spark-grid"
21
+
17
22
  add_class(join_class("gutter-#{gutter}")) if gutter
18
23
  add_class(join_class("gutter-#{gutter}-match")) if gutter && gutter_match
19
24
  data_attr column_min: min
20
- data_attr column_break: @break
21
25
  add_class join_class("no-wrap") unless wrap
22
- add_class join_class("reverse") if reverse
23
26
  end
24
27
 
25
28
  def render
26
29
  content_tag(:div, tag_attrs) do
27
- concat content_tag(:div, class: join_class("columns")) {
28
- columns.each { |column|
29
- concat column
30
+ concat content_tag(:div, class: join_class(:columns)) {
31
+ columns.each { |column|
32
+ concat column
30
33
  }
31
34
  }
32
35
  end
@@ -1,16 +1,18 @@
1
1
  class Nav::GroupComponent < SparkComponents::Component
2
- element :item, multiple: true, component: "nav/item"
2
+ attribute role: 'group'
3
3
  attribute item_role: 'menuitem'
4
4
 
5
+ element :item, multiple: true, component: "nav/item"
6
+
5
7
  def before_render
6
8
  add_class "active" if active?
7
9
  end
8
10
 
9
11
  def render
10
12
  unless items.empty?
11
- content_tag(:ul, class: "nav-group", role: "group") do
12
- items.each { |item|
13
- concat content_tag(:li, item, class: "nav-item-wrapper", role: item_role)
13
+ tag.ul(class: "spark-nav-group", role: role) do
14
+ items.each { |item|
15
+ concat tag.li(item, class: "nav-item-wrapper", role: item_role)
14
16
  }
15
17
  end
16
18
  end
@@ -1,6 +1,6 @@
1
1
  class Nav::ItemComponent < SparkComponents::Component
2
2
  attribute :text, :icon, :detail, :badge, :active, :beta, :new
3
- attribute icon_size: "12px"
3
+ attribute icon_size: :small
4
4
  root_attr :href, :role, :id, :tabindex, :target
5
5
  base_class "nav-item"
6
6
 
@@ -11,7 +11,7 @@ class Nav::ItemComponent < SparkComponents::Component
11
11
 
12
12
  def render
13
13
  content_tag(:a, tag_attrs) do
14
- concat @view.use_svg(icon, width: icon_size, height: icon_size, class: join_class("icon")) if icon
14
+ concat component("ui/icon", name: icon, size: icon_size, class: join_class("icon")) if icon
15
15
  concat tag.span(class: join_class("content")) {
16
16
  concat tag.span(text || @yield, class: join_class("text"))
17
17
  concat tag.span(label.upcase, class: [join_class("label"), label]) if label
@@ -17,7 +17,7 @@ class Nav::PillsComponent < SparkComponents::Component
17
17
  return if items.empty?
18
18
  content_tag(:nav, tag_attrs) do
19
19
  content_tag(:div, class: "nav-pills-wrapper") {
20
- concat content_tag(:ul, class: "nav-group") {
20
+ concat content_tag(:ul, class: "spark-nav-group") {
21
21
  items.each { |item|
22
22
  concat content_tag(:li, item, class: "nav-pill-wrapper #{item.active? ? "active" : nil}")
23
23
  }
@@ -6,7 +6,7 @@ class Nav::SidebarComponent < SparkComponents::Component
6
6
 
7
7
  element :header
8
8
  element :footer
9
- element :nav, component: "nav/group", multiple: true do
9
+ element :group, component: "nav/group", multiple: true do
10
10
  attribute :title
11
11
 
12
12
  def render
@@ -26,11 +26,7 @@ class Nav::SidebarComponent < SparkComponents::Component
26
26
  concat sidebar_toggle_tag
27
27
  concat content_tag(:div, class: join_class("wrapper")) {
28
28
  concat header_tag unless header.blank?
29
- if nav.is_a?(Array)
30
- navs.each { |nav| concat nav }
31
- else
32
- concat nav
33
- end
29
+ groups.each { |group| concat group }
34
30
  concat footer_tag unless footer.blank?
35
31
  }
36
32
  end
@@ -49,11 +45,12 @@ class Nav::SidebarComponent < SparkComponents::Component
49
45
  def sidebar_toggle_tag
50
46
  component("nav/toggle", target: selector(:data, :nav_id), class: join_class("toggle"), text: sidebar_button_text)
51
47
  end
48
+
52
49
  # Tries to find the text for the active nav item, otherwise shows sidebar label text
53
50
  def sidebar_button_text
54
51
  # Find any navs which have active items
55
- active_nav = navs.find { |nav|
56
- nav.active_item
52
+ active_nav = groups.find { |group|
53
+ group.active_item
57
54
  }
58
55
 
59
56
  # Use the active item text or the label for the sidebar
@@ -1,11 +1,13 @@
1
1
  class Nav::TabsComponent < SparkComponents::Component
2
+ LAYOUT = %i[flush padded]
3
+
2
4
  base_class "spark-nav-tabs"
3
5
  root_attr role: "navigation"
4
6
  attribute layout: :flush
5
7
 
6
8
  aria_attr :label
7
9
  validates :label, presence: true
8
- validates_choice :layout, %i[padded flush]
10
+ validates_choice :layout, LAYOUT
9
11
 
10
12
  element :item, multiple: true, component: "nav/item" do
11
13
  def render
@@ -51,7 +53,7 @@ class Nav::TabsComponent < SparkComponents::Component
51
53
  end
52
54
 
53
55
  def tab_group(options={}, &block)
54
- options[:class] = "nav-group #{options[:class]}"
56
+ options[:class] = "spark-nav-group #{options[:class]}"
55
57
  content_tag(:ul, options, &block)
56
58
  end
57
59
  end
@@ -1,7 +1,6 @@
1
1
  class Nav::Tree::GroupComponent < Nav::GroupComponent
2
2
  attribute :icon, :text, expanded: false
3
3
  attribute :group_icon_size
4
- root_attr role: "treeitem"
5
4
  base_class "nav-item-wrapper"
6
5
 
7
6
  def before_render
@@ -14,6 +13,7 @@ class Nav::Tree::GroupComponent < Nav::GroupComponent
14
13
 
15
14
  def render
16
15
  unless items.empty?
16
+ root_attr role: "treeitem"
17
17
  content_tag(:li, tag_attrs) do
18
18
  concat component("nav/item", text: text, icon: icon, icon_size: group_icon_size, class: "tree-trigger", tabindex: 0, href: "#") { expand_icon }
19
19
  concat super
@@ -2,7 +2,7 @@ class Nav::TreeComponent < SparkComponents::Component
2
2
  base_class "nav-tree"
3
3
  root_attr :id, role: "tree"
4
4
  aria_attr :label
5
- attribute root_icon_size: "14px"
5
+ attribute root_icon_size: :small
6
6
 
7
7
  def before_render
8
8
  data_attr tree: id
@@ -29,7 +29,6 @@ class Nav::TreeComponent < SparkComponents::Component
29
29
  parent.items << super unless items.empty?
30
30
  end
31
31
 
32
-
33
32
  def expanded?
34
33
  parent.group_expanded?(node) || active? || expanded
35
34
  end