polaris_view_components 0.9.0 → 0.10.1

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.
@@ -1,6 +1,6 @@
1
- <%= render Polaris::BaseComponent.new(**@system_arguments) do %>
1
+ <%= render Polaris::BaseComponent.new(**system_arguments) do %>
2
2
  <% if render_header? %>
3
- <%= render Polaris::BaseComponent.new(**@header_arguments) do %>
3
+ <%= render Polaris::BaseComponent.new(**header_arguments) do %>
4
4
  <div class="Polaris-Page-Header__Row">
5
5
  <% if @back_url.present? %>
6
6
  <div class="Polaris-Page-Header__BreadcrumbWrapper">
@@ -17,7 +17,7 @@
17
17
  <% end %>
18
18
 
19
19
  <div class="Polaris-Page-Header__TitleWrapper">
20
- <div <% if thumbnail.present? %>class="Polaris-Header-Title--hasThumbnail"<% end %>>
20
+ <%= tag.div(class: ["Polaris-Header-Title--hasThumbnail": thumbnail.present?]) do %>
21
21
  <% if thumbnail.present? %>
22
22
  <div>
23
23
  <%= thumbnail %>
@@ -38,18 +38,89 @@
38
38
  <% end %>
39
39
 
40
40
  <% if @subtitle.present? %>
41
- <div class="Polaris-Header-Title__SubTitle">
41
+ <%= render Polaris::BaseComponent.new(**subtitle_arguments) do %>
42
42
  <p><%= @subtitle %></p>
43
- </div>
43
+ <% end %>
44
44
  <% end %>
45
45
  </div>
46
- </div>
46
+ <% end %>
47
47
  </div>
48
48
 
49
- <% if primary_action.present? %>
49
+ <% if @secondary_actions.any? || action_group.present? || primary_action.present? || has_pagination? %>
50
50
  <div class="Polaris-Page-Header__RightAlign">
51
- <div class="Polaris-Page-Header__PrimaryActionWrapper">
52
- <%= primary_action %>
51
+ <div class="Polaris-Page-Header__Actions">
52
+ <% if @secondary_actions.any? || action_group.present? %>
53
+ <div class="Polaris-ActionMenu Polaris-ActionMenu--mobile">
54
+ <div class="Polaris-ActionMenu-RollupActions__RollupActivator">
55
+ <%= polaris_popover do |popover| %>
56
+ <% popover.button do |button| %>
57
+ <% button.icon(name: "HorizontalDotsMinor") %>
58
+ <% end %>
59
+ <%= polaris_action_list(style: "text-align: left;") do |action_list| %>
60
+ <% if @secondary_actions.any? %>
61
+ <% action_list.section do |section| %>
62
+ <% @secondary_actions.each do |action| %>
63
+ <% section.item(**action) { action[:content] } %>
64
+ <% end %>
65
+ <% end %>
66
+ <% end %>
67
+
68
+ <% if action_group.present? %>
69
+ <% action_list.section(title: action_group.title) do |section| %>
70
+ <% action_group.actions.each do |action| %>
71
+ <% section.item(**action) { action[:content] } %>
72
+ <% end %>
73
+ <% end %>
74
+ <% end %>
75
+ <% end %>
76
+ <% end %>
77
+ </div>
78
+ </div>
79
+ <div class="Polaris-ActionMenu Polaris-ActionMenu--desktop">
80
+ <div class="Polaris-ActionMenu-Actions__ActionsLayout">
81
+ <%= polaris_button_group(spacing: :extra_tight) do |group| %>
82
+ <% @secondary_actions.each do |action| %>
83
+ <% group.item do %>
84
+ <% destructive = action.delete(:destructive) %>
85
+ <% tag.span(class: ["Polaris-ActionMenu-SecondaryAction", "Polaris-ActionMenu-SecondaryAction--destructive": destructive]) do %>
86
+ <%= polaris_button(**action) { action[:content] } %>
87
+ <% end %>
88
+ <% end %>
89
+ <% end %>
90
+ <% if action_group.present? %>
91
+ <% group.item do %>
92
+ <span class="Polaris-ActionMenu-SecondaryAction">
93
+ <%= action_group %>
94
+ </span>
95
+ <% end %>
96
+ <% end %>
97
+ <% end %>
98
+ </div>
99
+ </div>
100
+ <% end %>
101
+ <% if primary_action.present? %>
102
+ <div class="Polaris-Page-Header__PrimaryActionWrapper">
103
+ <%= primary_action %>
104
+ </div>
105
+ <% end %>
106
+ <% if has_pagination? %>
107
+ <div class="Polaris-Page-Header__PaginationWrapper">
108
+ <nav aria-label="Pagination">
109
+ <%= polaris_button_group(segmented: true) do |group| %>
110
+ <% group.item do %>
111
+ <%= polaris_button(url: @prev_url, outline: true, disabled: @prev_url.blank?) do |button| %>
112
+ <% button.icon(name: "ChevronLeftMinor") %>
113
+ <% end %>
114
+ <% end %>
115
+ <% group.item do %>
116
+ <%= polaris_button(url: @next_url, outline: true, disabled: @next_url.blank?) do |button| %>
117
+ <% button.icon(name: "ChevronRightMinor") %>
118
+ <% end %>
119
+ <% end %>
120
+ <% end %>
121
+ </nav>
122
+ </div>
123
+ <% end %>
53
124
  </div>
54
125
  </div>
55
126
  <% end %>
@@ -57,7 +128,7 @@
57
128
  <% end %>
58
129
  <% end %>
59
130
 
60
- <%= render Polaris::BaseComponent.new(**@content_arguments) do %>
131
+ <%= render Polaris::BaseComponent.new(**content_arguments) do %>
61
132
  <%= content %>
62
133
  <% end %>
63
134
  <% end %>
@@ -2,55 +2,112 @@
2
2
 
3
3
  module Polaris
4
4
  class PageComponent < Polaris::Component
5
+ renders_one :title_metadata
6
+ renders_one :thumbnail, Polaris::ThumbnailComponent
5
7
  renders_one :primary_action, ->(primary: true, **system_arguments) do
6
8
  Polaris::ButtonComponent.new(primary: primary, **system_arguments)
7
9
  end
8
- # renders_many :secondary_actions, Polaris::ButtonComponent
9
- renders_one :title_metadata
10
- renders_one :thumbnail, Polaris::ThumbnailComponent
10
+ renders_one :action_group, "ActionGroupComponent"
11
11
 
12
12
  def initialize(
13
13
  title: nil,
14
14
  subtitle: nil,
15
+ compact_title: false,
15
16
  back_url: nil,
17
+ prev_url: nil,
18
+ next_url: nil,
16
19
  narrow_width: false,
17
20
  full_width: false,
18
21
  divider: false,
22
+ secondary_actions: [],
19
23
  **system_arguments
20
24
  )
21
25
  @title = title
22
26
  @subtitle = subtitle
27
+ @compact_title = compact_title
23
28
  @back_url = back_url
24
-
29
+ @prev_url = prev_url
30
+ @next_url = next_url
31
+ @narrow_width = narrow_width
32
+ @full_width = full_width
33
+ @divider = divider
34
+ @secondary_actions = secondary_actions
25
35
  @system_arguments = system_arguments
26
- @system_arguments[:tag] = "div"
27
- @system_arguments[:classes] = class_names(
28
- @system_arguments[:classes],
29
- "Polaris-Page",
30
- "Polaris-Page--narrowWidth": narrow_width,
31
- "Polaris-Page--fullWidth": full_width
32
- )
33
-
34
- @header_arguments = {}
35
- @header_arguments[:tag] = "div"
36
- @header_arguments[:classes] = class_names(
37
- "Polaris-Page-Header",
38
- "Polaris-Page-Header--mobileView",
39
- "Polaris-Page-Header--mediumTitle",
40
- "Polaris-Page-Header--hasNavigation": back_url.present?,
41
- "Polaris-Page-Header--noBreadcrumbs": back_url.blank?
42
- )
43
-
44
- @content_arguments = {}
45
- @content_arguments[:tag] = "div"
46
- @content_arguments[:classes] = class_names(
47
- "Polaris-Page__Content",
48
- "Polaris-Page--divider": divider
49
- )
36
+ end
37
+
38
+ def header_arguments
39
+ {
40
+ tag: "div",
41
+ classes: class_names(
42
+ "Polaris-Page-Header",
43
+ "Polaris-Page-Header--mobileView",
44
+ "Polaris-Page-Header--mediumTitle",
45
+ "Polaris-Page-Header--hasNavigation": @back_url.present?,
46
+ "Polaris-Page-Header--noBreadcrumbs": @back_url.blank?
47
+ )
48
+ }
49
+ end
50
+
51
+ def subtitle_arguments
52
+ {
53
+ tag: "div",
54
+ classes: class_names(
55
+ "Polaris-Header-Title__SubTitle",
56
+ "Polaris-Header-Title__SubtitleCompact": @compact_title
57
+ )
58
+ }
59
+ end
60
+
61
+ def content_arguments
62
+ {
63
+ tag: "div",
64
+ classes: class_names(
65
+ "Polaris-Page__Content",
66
+ "Polaris-Page--divider": @divider
67
+ )
68
+ }
69
+ end
70
+
71
+ def system_arguments
72
+ @system_arguments.tap do |opts|
73
+ opts[:tag] = "div"
74
+ opts[:classes] = class_names(
75
+ opts[:classes],
76
+ "Polaris-Page",
77
+ "Polaris-Page--narrowWidth": @narrow_width,
78
+ "Polaris-Page--fullWidth": @full_width
79
+ )
80
+ end
50
81
  end
51
82
 
52
83
  def render_header?
53
84
  @title.present? || @subtitle.present? || @back_url.present? || primary_action.present?
54
85
  end
86
+
87
+ def has_pagination?
88
+ @next_url.present? || @prev_url.present?
89
+ end
90
+
91
+ class ActionGroupComponent < Polaris::Component
92
+ attr_reader :title
93
+ attr_reader :actions
94
+
95
+ def initialize(title:, actions: [])
96
+ @title = title
97
+ @actions = actions
98
+ end
99
+
100
+ def call
101
+ render(Polaris::PopoverComponent.new) do |popover|
102
+ popover.button(disclosure: true) { @title }
103
+
104
+ polaris_action_list do |list|
105
+ @actions.each do |action|
106
+ list.item(**action) { action[:content] }
107
+ end
108
+ end
109
+ end
110
+ end
111
+ end
55
112
  end
56
113
  end
@@ -31,6 +31,7 @@ module Polaris
31
31
  vertical_alignment: ALIGNMENT_DEFAULT,
32
32
  cursor: CURSOR_DEFAULT,
33
33
  selectable: false,
34
+ selected: false,
34
35
  offset: false,
35
36
  wrapper_arguments: {},
36
37
  container_arguments: {},
@@ -40,6 +41,7 @@ module Polaris
40
41
  @vertical_alignment = vertical_alignment
41
42
  @cursor = fetch_or_fallback(CURSOR_OPTIONS, cursor, CURSOR_DEFAULT)
42
43
  @selectable = selectable
44
+ @selected = selected
43
45
  @offset = offset
44
46
  @wrapper_arguments = wrapper_arguments
45
47
  @container_arguments = container_arguments
@@ -79,7 +81,8 @@ module Polaris
79
81
  args[:classes] = class_names(
80
82
  args[:classes],
81
83
  "Polaris-ResourceItem",
82
- "Polaris-ResourceItem--selectable": @selectable
84
+ "Polaris-ResourceItem--selectable": @selectable,
85
+ "Polaris-ResourceItem--selected": @selected
83
86
  )
84
87
  prepend_option(args, :style, "cursor: #{@cursor};")
85
88
  prepend_option(args[:data], :action, "click->polaris-resource-item#open")
@@ -45,7 +45,7 @@
45
45
  type="button"
46
46
  class="Polaris-TextField__ClearButton
47
47
  <% if @value.blank? %>
48
- Polaris-TextField__ClearButton--hidden
48
+ Polaris-TextField__Hidden
49
49
  <% end %>"
50
50
  tabindex="0"
51
51
  data-polaris-text-field-target="clearButton"
@@ -105,7 +105,7 @@ module Polaris
105
105
  tag: "div",
106
106
  data: {
107
107
  polaris_text_field_has_value_class: "Polaris-TextField--hasValue",
108
- polaris_text_field_clear_button_hidden_class: "Polaris-TextField__ClearButton--hidden"
108
+ polaris_text_field_clear_button_hidden_class: "Polaris-TextField__Hidden"
109
109
  }
110
110
  }.deep_merge(@system_arguments).tap do |opts|
111
111
  opts[:classes] = class_names(
@@ -2,9 +2,6 @@
2
2
 
3
3
  module Polaris
4
4
  class VisuallyHiddenComponent < Polaris::Component
5
- def initialize
6
- end
7
-
8
5
  def call
9
6
  content_tag(:span, content, class: "Polaris-VisuallyHidden")
10
7
  end
@@ -1,5 +1,5 @@
1
1
  module Polaris
2
2
  module ViewComponents
3
- VERSION = "0.9.0"
3
+ VERSION = "0.10.1"
4
4
  end
5
5
  end
metadata CHANGED
@@ -1,7 +1,7 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: polaris_view_components
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.9.0
4
+ version: 0.10.1
5
5
  platform: ruby
6
6
  authors:
7
7
  - Dan Gamble
@@ -9,7 +9,7 @@ authors:
9
9
  autorequire:
10
10
  bindir: bin
11
11
  cert_chain: []
12
- date: 2022-03-07 00:00:00.000000000 Z
12
+ date: 2022-06-04 00:00:00.000000000 Z
13
13
  dependencies:
14
14
  - !ruby/object:Gem::Dependency
15
15
  name: rails
@@ -39,6 +39,90 @@ dependencies:
39
39
  - - ">="
40
40
  - !ruby/object:Gem::Version
41
41
  version: 2.0.0
42
+ - !ruby/object:Gem::Dependency
43
+ name: capybara
44
+ requirement: !ruby/object:Gem::Requirement
45
+ requirements:
46
+ - - "~>"
47
+ - !ruby/object:Gem::Version
48
+ version: '3'
49
+ type: :development
50
+ prerelease: false
51
+ version_requirements: !ruby/object:Gem::Requirement
52
+ requirements:
53
+ - - "~>"
54
+ - !ruby/object:Gem::Version
55
+ version: '3'
56
+ - !ruby/object:Gem::Dependency
57
+ name: webdrivers
58
+ requirement: !ruby/object:Gem::Requirement
59
+ requirements:
60
+ - - "~>"
61
+ - !ruby/object:Gem::Version
62
+ version: '5.0'
63
+ type: :development
64
+ prerelease: false
65
+ version_requirements: !ruby/object:Gem::Requirement
66
+ requirements:
67
+ - - "~>"
68
+ - !ruby/object:Gem::Version
69
+ version: '5.0'
70
+ - !ruby/object:Gem::Dependency
71
+ name: selenium-webdriver
72
+ requirement: !ruby/object:Gem::Requirement
73
+ requirements:
74
+ - - "~>"
75
+ - !ruby/object:Gem::Version
76
+ version: '4.1'
77
+ type: :development
78
+ prerelease: false
79
+ version_requirements: !ruby/object:Gem::Requirement
80
+ requirements:
81
+ - - "~>"
82
+ - !ruby/object:Gem::Version
83
+ version: '4.1'
84
+ - !ruby/object:Gem::Dependency
85
+ name: minitest
86
+ requirement: !ruby/object:Gem::Requirement
87
+ requirements:
88
+ - - "~>"
89
+ - !ruby/object:Gem::Version
90
+ version: '5.0'
91
+ type: :development
92
+ prerelease: false
93
+ version_requirements: !ruby/object:Gem::Requirement
94
+ requirements:
95
+ - - "~>"
96
+ - !ruby/object:Gem::Version
97
+ version: '5.0'
98
+ - !ruby/object:Gem::Dependency
99
+ name: pry
100
+ requirement: !ruby/object:Gem::Requirement
101
+ requirements:
102
+ - - ">="
103
+ - !ruby/object:Gem::Version
104
+ version: '0'
105
+ type: :development
106
+ prerelease: false
107
+ version_requirements: !ruby/object:Gem::Requirement
108
+ requirements:
109
+ - - ">="
110
+ - !ruby/object:Gem::Version
111
+ version: '0'
112
+ - !ruby/object:Gem::Dependency
113
+ name: sprockets-rails
114
+ requirement: !ruby/object:Gem::Requirement
115
+ requirements:
116
+ - - ">="
117
+ - !ruby/object:Gem::Version
118
+ version: '0'
119
+ type: :development
120
+ prerelease: false
121
+ version_requirements: !ruby/object:Gem::Requirement
122
+ requirements:
123
+ - - ">="
124
+ - !ruby/object:Gem::Version
125
+ version: '0'
42
126
  description:
43
127
  email:
44
128
  - dan@dangamble.co.uk
@@ -469,7 +553,8 @@ files:
469
553
  - app/assets/javascripts/polaris_view_components/select_controller.js
470
554
  - app/assets/javascripts/polaris_view_components/text_field_controller.js
471
555
  - app/assets/javascripts/polaris_view_components/toast_controller.js
472
- - app/assets/javascripts/polaris_view_components/utils.js
556
+ - app/assets/javascripts/polaris_view_components/utils/index.js
557
+ - app/assets/javascripts/polaris_view_components/utils/use-transition.js
473
558
  - app/assets/stylesheets/polaris_view_components.css
474
559
  - app/assets/stylesheets/polaris_view_components.postcss.css
475
560
  - app/assets/stylesheets/polaris_view_components/custom.css
@@ -684,7 +769,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
684
769
  - !ruby/object:Gem::Version
685
770
  version: '0'
686
771
  requirements: []
687
- rubygems_version: 3.2.32
772
+ rubygems_version: 3.3.7
688
773
  signing_key:
689
774
  specification_version: 4
690
775
  summary: ViewComponents for Polaris Design System