openproject-primer_view_components 0.43.1 → 0.44.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.
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: e105dba73aa891e37065e362a68bfb937694b8f94e41ee4f097f2566007eb0ca
4
- data.tar.gz: 03b7e1291daddc054605b01df516b261fd9a97c36fe111247ddd056e3b7554c1
3
+ metadata.gz: 4070976cb5e56ee3459252e07c3fd1ca3544841315d96c5f4c05d57cad5eeeee
4
+ data.tar.gz: 1a4cafe7ca3769c7ffaab32f19981d27323948c54416c870548d7cca7ea6ef9d
5
5
  SHA512:
6
- metadata.gz: c3525069a63ab515e716f213e82056b7f22d8e40ae64efe5194d25062fd7caaaa8490c7770497e2cd967db298cbcc37ce9a8f882c1e30fd59938a76d5fb97454
7
- data.tar.gz: ffd61ce4dfb0e3d285e469374279931ddd516b1590eea60422a6c03063956ab9583e6cb929ff28b11fb27883b06e381e2c0908b4b66ec2df61085b8ec2a0a16d
6
+ metadata.gz: 1a1fdf6170b51b055da049ded17920b44cabfd528a10020d36f0d9281a04eba575f9bf85b90f47827fb15f5cb6eacf0c7471e7f792ab6c6face6f6476dc4d40d
7
+ data.tar.gz: 5f4f687e0b02c3d2f206b6bcb1c2019524b55550ad02f9c94150ef13ee5e4ba0203291c0034beee7f0f2c437a2e189c325683617ed11d1085ee7f23c4c0373fe
data/CHANGELOG.md CHANGED
@@ -1,5 +1,17 @@
1
1
  # CHANGELOG
2
2
 
3
+ ## 0.44.1
4
+
5
+ ### Patch Changes
6
+
7
+ - [#172](https://github.com/opf/primer_view_components/pull/172) [`2a500c9`](https://github.com/opf/primer_view_components/commit/2a500c95c359033253dec429da012b675da60099) Thanks [@HDinger](https://github.com/HDinger)! - Delegate calls for `primary_action` and `secondary_action` from FeedbackMessage to the `Blankslate`
8
+
9
+ ## 0.44.0
10
+
11
+ ### Minor Changes
12
+
13
+ - [#167](https://github.com/opf/primer_view_components/pull/167) [`1049ebf`](https://github.com/opf/primer_view_components/commit/1049ebf66abb16efc271212a45d6cc655abd301f) Thanks [@HDinger](https://github.com/HDinger)! - Add `FeedbackDialog` and `FeedbackMessage` components to display different kinds of user feedback
14
+
3
15
  ## 0.43.1
4
16
 
5
17
  ### Patch Changes
@@ -0,0 +1 @@
1
+ <svg width="64" height="64" xmlns="http://www.w3.org/2000/svg"><g><rect x="-16" y="-16" width="32" height="32" fill="none" stroke="#a3eea8" stroke-width="4" rx="10" transform="translate(32 32)"><animate attributeName="stroke-width" attributeType="XML" dur="4s" repeatCount="indefinite" values="0;4;0;0" keyTimes="0;0.35;0.6;1" keySplines="0.42 0 0.58 1;0.42 0 0.58 1;0.42 0 0.58 1" calcMode="spline"/><animateTransform attributeName="transform" additive="sum" attributeType="XML" type="scale" dur="4s" repeatCount="indefinite" values="0.5;0.5;1.6;0.5" keyTimes="0;0.35;0.6;1" keySplines="0.42 0 0.58 1;0.42 0 0.58 1;0.42 0 0.58 1" calcMode="spline"/></rect><rect x="-16" y="-16" width="32" height="32" fill="#35c53f" rx="5" transform="translate(32 32)"><animateTransform attributeName="transform" additive="sum" attributeType="XML" type="scale" dur="4s" repeatCount="indefinite" values="1;1.3;1.1;1" keyTimes="0;0.5;0.6;1" keySplines="0.42 0 0.58 1;0.42 0 0.58 1;0.42 0 0.58 1" calcMode="spline"/></rect><animateTransform attributeName="transform" attributeType="XML" additive="sum" type="rotate" dur="4s" repeatCount="indefinite" values="45 32 32;1080 32 32;945 32 32" keyTimes="0;0.6;1" keySplines="0.42 0 0.58 1;0.42 0 0.58 1" calcMode="spline"/></g></svg>
@@ -0,0 +1,15 @@
1
+ <%= render @dialog do |dialog| %>
2
+ <% dialog.with_body do %>
3
+ <%= feedback_message %>
4
+ <% if additional_content.present? %>
5
+ <%= additional_content %>
6
+ <% end %>
7
+ <% end %>
8
+ <% dialog.with_footer do %>
9
+ <% if footer.present? %>
10
+ <%= footer %>
11
+ <% else %>
12
+ <%= render(Primer::Beta::Button.new("data-close-dialog-id": @system_arguments[:id])) { I18n.t("button_close") } %>
13
+ <% end %>
14
+ <% end %>
15
+ <% end %>
@@ -0,0 +1,64 @@
1
+ # frozen_string_literal: true
2
+
3
+ module Primer
4
+ module OpenProject
5
+ # A pre-configured dialog which includes the FeedbackMessage
6
+ class FeedbackDialog < Primer::Component
7
+ status :open_project
8
+
9
+ # A feedback message with some defaults that are necessary for rendering nicely
10
+ #
11
+ # @param heading [String] the heading for the success message
12
+ # @param description [String] the description for the success message
13
+ # @param icon_arguments [Hash] the system_arguments for the icon
14
+ # @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
15
+ renders_one :feedback_message, lambda { |icon_arguments: {}, **system_arguments|
16
+ system_arguments[:border] = false
17
+ Primer::OpenProject::FeedbackMessage.new(icon_arguments: icon_arguments, **system_arguments)
18
+ }
19
+
20
+ # Optional additional_content like a form input or toast.
21
+ #
22
+ # @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
23
+ renders_one :additional_content, lambda { |**system_arguments|
24
+ deny_tag_argument(**system_arguments)
25
+ system_arguments[:tag] = :div
26
+ system_arguments[:classes] = class_names(
27
+ system_arguments[:classes],
28
+ "FeedbackDialog-additionalContent"
29
+ )
30
+
31
+ system_arguments[:display] ||= :flex
32
+ system_arguments[:align_items] ||= :center
33
+ system_arguments[:justify_content] ||= :center
34
+ system_arguments[:mb] ||= 3
35
+
36
+ Primer::BaseComponent.new(**system_arguments)
37
+ }
38
+
39
+ renders_one :footer
40
+
41
+ # @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
42
+ def initialize(**system_arguments)
43
+ @system_arguments = system_arguments
44
+ @system_arguments[:classes] = class_names(
45
+ system_arguments[:classes],
46
+ "FeedbackDialog"
47
+ )
48
+ @system_arguments[:id] ||= self.class.generate_id
49
+
50
+ @dialog = Primer::Alpha::Dialog.new(title: @system_arguments[:title], subtitle: nil, visually_hide_title: true, **@system_arguments)
51
+ end
52
+
53
+ delegate :header?, :header, :with_header, :with_header_content,
54
+ :show_button?, :show_button, :with_show_button, :with_show_button_content,
55
+ to: :@dialog
56
+
57
+ private
58
+
59
+ def before_render
60
+ content
61
+ end
62
+ end
63
+ end
64
+ end
@@ -0,0 +1 @@
1
+ <%= render(@blankslate) %>
@@ -0,0 +1,55 @@
1
+ # frozen_string_literal: true
2
+
3
+ module Primer
4
+ module OpenProject
5
+ # A view component for messages, inspired by the Primer Blankslate,
6
+ # which serves a different use-case (messages for when data is missing).
7
+ # We decided to wrap the Blankslate, because we don't want to have to adapt
8
+ # lots of different usages if Primer decides to change the Blankslate
9
+ # in a way that does not go well with our "misuse".
10
+ class FeedbackMessage < Primer::Component
11
+ status :open_project
12
+
13
+ # @param icon_arguments [Hash] special arguments for the icon
14
+ # @param loading [Boolean] Show a loading spinner instead of an icon
15
+ # @param system_arguments [Hash] <%= link_to_system_arguments_docs %>
16
+ def initialize(icon_arguments: {}, loading: false, **system_arguments)
17
+ @system_arguments = system_arguments
18
+ @icon_arguments = icon_arguments
19
+ @system_arguments[:classes] = class_names(
20
+ system_arguments[:classes],
21
+ "FeedbackMessage"
22
+ )
23
+
24
+ @icon_arguments[:icon] ||= :"check-circle"
25
+ @icon_arguments[:color] ||= :success
26
+
27
+ @loading = loading
28
+
29
+ @blankslate = Primer::Beta::Blankslate.new(**@system_arguments)
30
+ end
31
+
32
+ delegate :description?, :description, :with_description, :with_description_content,
33
+ :heading?, :heading, :with_heading, :with_heading_content,
34
+ :primary_action?, :primary_action, :with_primary_action, :with_primary_action_content,
35
+ :secondary_action?, :secondary_action, :with_secondary_action, :with_secondary_action_content,
36
+ to: :@blankslate
37
+
38
+ private
39
+
40
+ def before_render
41
+ if @loading
42
+ @blankslate.with_visual_image(src: asset_path("loading_indicator.svg"), alt: I18n.t(:label_loading))
43
+ else
44
+ @blankslate.with_visual_icon(size: :medium, **@icon_arguments)
45
+ end
46
+
47
+ content
48
+ end
49
+
50
+ def render?
51
+ heading.present?
52
+ end
53
+ end
54
+ end
55
+ end
@@ -5,7 +5,7 @@ module Primer
5
5
  module ViewComponents
6
6
  module VERSION
7
7
  MAJOR = 0
8
- MINOR = 43
8
+ MINOR = 44
9
9
  PATCH = 1
10
10
 
11
11
  STRING = [MAJOR, MINOR, PATCH].join(".")
@@ -0,0 +1,9 @@
1
+ <%= render(Primer::OpenProject::FeedbackDialog.new) do |dialog| %>
2
+ <% dialog.with_show_button { "Click me" } %>
3
+ <% dialog.with_feedback_message do |message| %>
4
+ <% message.with_heading(tag: :h2).with_content("Action successful") %>
5
+ <% end %>
6
+ <% dialog.with_additional_content do %>
7
+ <% render(Primer::Beta::Text.new) { "You can render whatever component you want here." } %>
8
+ <% end %>
9
+ <% end %>
@@ -0,0 +1,10 @@
1
+ <%= render(Primer::OpenProject::FeedbackDialog.new(id: "my-dialog")) do |dialog| %>
2
+ <% dialog.with_show_button { "Click me" } %>
3
+ <% dialog.with_feedback_message do |message| %>
4
+ <% message.with_heading(tag: :h2).with_content("Action successful") %>
5
+ <% end %>
6
+ <% dialog.with_footer do %>
7
+ <%= render(Primer::Beta::Button.new("data-close-dialog-id": "my-dialog")) { "Cancel" } %>
8
+ <%= render(Primer::Beta::Button.new(scheme: :primary)) { "Accept" } %>
9
+ <% end %>
10
+ <% end %>
@@ -0,0 +1,18 @@
1
+ <%= render(Primer::OpenProject::FeedbackDialog.new(id: "my-dialog")) do |dialog| %>
2
+ <% dialog.with_show_button { "Click me" } %>
3
+ <% dialog.with_feedback_message(icon_arguments: { icon: icon, color: icon_color }, loading: loading_state) do |message| %>
4
+ <% message.with_heading(tag: :h2).with_content("Awesome!") %>
5
+ <% message.with_description { "Great! Everything worked well." } if show_description %>
6
+ <% end %>
7
+ <% if show_additional_content %>
8
+ <% dialog.with_additional_content(display: :inline) do %>
9
+ <%= render(Primer::Alpha::Banner.new) { "Some additional content below" } %>
10
+ <% end %>
11
+ <% end %>
12
+ <% if custom_footer %>
13
+ <% dialog.with_footer do %>
14
+ <%= render(Primer::Beta::Button.new("data-close-dialog-id": "my-dialog")) { "Cancel" } %>
15
+ <%= render(Primer::Beta::Button.new(scheme: :primary)) { "Accept" } %>
16
+ <% end %>
17
+ <% end %>
18
+ <% end %>
@@ -0,0 +1,70 @@
1
+ # frozen_string_literal: true
2
+
3
+ # Setup Playground to use all available component props
4
+ # Setup Features to use individual component props and combinations
5
+
6
+ module Primer
7
+ module OpenProject
8
+ # @label FeedbackDialog
9
+ class FeedbackDialogPreview < ViewComponent::Preview
10
+ # @label Default
11
+ # @snapshot interactive
12
+ def default
13
+ render(Primer::OpenProject::FeedbackDialog.new(title: "Success dialog")) do |dialog|
14
+ dialog.with_show_button { "Click me" }
15
+ dialog.with_feedback_message do |message|
16
+ message.with_heading(tag: :h2) { "Success" }
17
+ message.with_description { "Great! Everything worked well." }
18
+ end
19
+ end
20
+ end
21
+
22
+ # @label Playground
23
+ # @param icon [Symbol] octicon
24
+ # @param icon_color [Symbol] select [default, muted, subtle, accent, success, attention, severe, danger, open, closed, done, sponsors, on_emphasis, inherit]
25
+ # @param loading_state [Boolean] toggle
26
+ # @param show_description toggle
27
+ # @param show_additional_content toggle
28
+ # @param custom_footer toggle
29
+ def playground(icon: :"check-circle", icon_color: :success, loading_state: false, show_description: true, show_additional_content: false, custom_footer: false)
30
+ render_with_template(locals: { icon: icon,
31
+ icon_color: icon_color,
32
+ loading_state: loading_state,
33
+ show_description: show_description,
34
+ show_additional_content: show_additional_content,
35
+ custom_footer: custom_footer })
36
+ end
37
+
38
+ # @label With additional content
39
+ def additional_content
40
+ render_with_template(locals: {})
41
+ end
42
+
43
+ # @label With custom icon
44
+ def custom_icon
45
+ render(Primer::OpenProject::FeedbackDialog.new(title: "Error message")) do |dialog|
46
+ dialog.with_show_button { "Click me" }
47
+ dialog.with_feedback_message(icon_arguments: { icon: :"x-circle", color: :danger }) do |message|
48
+ message.with_heading(tag: :h2) { "Ups, something went wrong" }
49
+ message.with_description { "Please try again or contact your administrator if the issue persists." }
50
+ end
51
+ end
52
+ end
53
+
54
+ # @label With custom footer
55
+ def custom_footer
56
+ render_with_template(locals: {})
57
+ end
58
+
59
+ # @label With loading spinner
60
+ def loading_spinner
61
+ render(Primer::OpenProject::FeedbackDialog.new(title: "Waiting...")) do |dialog|
62
+ dialog.with_show_button { "Click me" }
63
+ dialog.with_feedback_message(loading: true) do |message|
64
+ message.with_heading(tag: :h2) { "Please wait, your request is being processed." }
65
+ end
66
+ end
67
+ end
68
+ end
69
+ end
70
+ end
@@ -0,0 +1,66 @@
1
+ # frozen_string_literal: true
2
+
3
+ module Primer
4
+ module OpenProject
5
+ # @label FeedbackMessage
6
+ class FeedbackMessagePreview < ViewComponent::Preview
7
+ # @label Default
8
+ # @snapshot
9
+ def default
10
+ render Primer::OpenProject::FeedbackMessage.new do |component|
11
+ component.with_heading(tag: :h2) { "Success" }
12
+ component.with_description { "You successfully created your first FeedbackMessage component" }
13
+ end
14
+ end
15
+
16
+
17
+ # @label Playground
18
+ #
19
+ # @param icon [Symbol] octicon
20
+ # @param icon_color [Symbol] select [default, muted, subtle, accent, success, attention, severe, danger, open, closed, done, sponsors, on_emphasis, inherit]
21
+ # @param loading_state [Boolean] toggle
22
+ # @param title [String]
23
+ # @param description [String]
24
+ # @param narrow [Boolean] toggle
25
+ # @param spacious [Boolean] toggle
26
+ # @param border [Boolean] toggle
27
+ def playground(icon: "check-circle", icon_color: :success, loading_state: false, title: "Yeah!", description: "Some description below...", narrow: false, spacious: false, border: false)
28
+ render Primer::OpenProject::FeedbackMessage.new(icon_arguments: { icon: icon, color: icon_color}, loading: loading_state, narrow: narrow, spacious: spacious, border: border) do |component|
29
+ component.with_heading(tag: :h2).with_content(title)
30
+ component.with_description { description }
31
+ end
32
+ end
33
+
34
+ # @label With custom icon
35
+ def with_custom_icon
36
+ render Primer::OpenProject::FeedbackMessage.new(icon_arguments: { icon: :"op-enterprise-addons", classes: "upsale-colored" }) do |component|
37
+ component.with_heading(tag: :h2) { "You are a hero" }
38
+ component.with_description { "Thanks for supporting an open source project!" }
39
+ end
40
+ end
41
+
42
+ # @label With custom color
43
+ def with_custom_color
44
+ render Primer::OpenProject::FeedbackMessage.new(icon_arguments: { icon: :"x-circle", color: :danger }) do |component|
45
+ component.with_heading(tag: :h2) { "Ups, something went wrong" }
46
+ component.with_description { "Please try again or contact your administrator." }
47
+ end
48
+ end
49
+
50
+ # @label With loading spinner
51
+ def loading_spinner
52
+ render(Primer::OpenProject::FeedbackMessage.new(loading: true)) do |component|
53
+ component.with_heading(tag: :h2) { "Please wait, your request is being processed." }
54
+ end
55
+ end
56
+
57
+ # @label With secondary action
58
+ def secondary_action
59
+ render(Primer::OpenProject::FeedbackMessage.new(loading: true)) do |component|
60
+ component.with_heading(tag: :h2) { "Please wait, your request is being processed." }
61
+ component.with_secondary_action(href: "#").with_content("Skip")
62
+ end
63
+ end
64
+ end
65
+ end
66
+ end
@@ -5039,6 +5039,50 @@
5039
5039
  }
5040
5040
  ]
5041
5041
  },
5042
+ {
5043
+ "component": "OpenProject::FeedbackDialog",
5044
+ "status": "open_project",
5045
+ "a11y_reviewed": false,
5046
+ "short_name": "OpenProjectFeedbackDialog",
5047
+ "source": "https://github.com/primer/view_components/tree/main/app/components/primer/open_project/feedback_dialog.rb",
5048
+ "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/open_project/feedback_dialog/default/",
5049
+ "parameters": [
5050
+ {
5051
+ "name": "system_arguments",
5052
+ "type": "Hash",
5053
+ "default": "N/A",
5054
+ "description": "[System arguments](/system-arguments)"
5055
+ }
5056
+ ]
5057
+ },
5058
+ {
5059
+ "component": "OpenProject::FeedbackMessage",
5060
+ "status": "open_project",
5061
+ "a11y_reviewed": false,
5062
+ "short_name": "OpenProjectFeedbackMessage",
5063
+ "source": "https://github.com/primer/view_components/tree/main/app/components/primer/open_project/feedback_message.rb",
5064
+ "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/open_project/feedback_message/default/",
5065
+ "parameters": [
5066
+ {
5067
+ "name": "icon_arguments",
5068
+ "type": "Hash",
5069
+ "default": "`{}`",
5070
+ "description": "special arguments for the icon"
5071
+ },
5072
+ {
5073
+ "name": "loading",
5074
+ "type": "Boolean",
5075
+ "default": "`false`",
5076
+ "description": "Show a loading spinner instead of an icon"
5077
+ },
5078
+ {
5079
+ "name": "system_arguments",
5080
+ "type": "Hash",
5081
+ "default": "N/A",
5082
+ "description": "[System arguments](/system-arguments)"
5083
+ }
5084
+ ]
5085
+ },
5042
5086
  {
5043
5087
  "component": "OpenProject::FlexLayout",
5044
5088
  "status": "open_project",
@@ -118,6 +118,8 @@
118
118
  "Primer::OpenProject::BorderGrid": "",
119
119
  "Primer::OpenProject::BorderGrid::Cell": "",
120
120
  "Primer::OpenProject::DragHandle": "",
121
+ "Primer::OpenProject::FeedbackDialog": "",
122
+ "Primer::OpenProject::FeedbackMessage": "",
121
123
  "Primer::OpenProject::FlexLayout": "",
122
124
  "Primer::OpenProject::GridLayout": "",
123
125
  "Primer::OpenProject::GridLayout::Area": "",
@@ -1422,6 +1422,10 @@
1422
1422
  "medium"
1423
1423
  ]
1424
1424
  },
1425
+ "Primer::OpenProject::FeedbackDialog": {
1426
+ },
1427
+ "Primer::OpenProject::FeedbackMessage": {
1428
+ },
1425
1429
  "Primer::OpenProject::FlexLayout": {
1426
1430
  },
1427
1431
  "Primer::OpenProject::GridLayout": {
@@ -17294,6 +17294,288 @@
17294
17294
 
17295
17295
  ]
17296
17296
  },
17297
+ {
17298
+ "fully_qualified_name": "Primer::OpenProject::FeedbackDialog",
17299
+ "description": "A pre-configured dialog which includes the FeedbackMessage",
17300
+ "accessibility_docs": null,
17301
+ "is_form_component": false,
17302
+ "is_published": true,
17303
+ "requires_js": false,
17304
+ "component": "OpenProject::FeedbackDialog",
17305
+ "status": "open_project",
17306
+ "a11y_reviewed": false,
17307
+ "short_name": "OpenProjectFeedbackDialog",
17308
+ "source": "https://github.com/primer/view_components/tree/main/app/components/primer/open_project/feedback_dialog.rb",
17309
+ "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/open_project/feedback_dialog/default/",
17310
+ "parameters": [
17311
+ {
17312
+ "name": "system_arguments",
17313
+ "type": "Hash",
17314
+ "default": "N/A",
17315
+ "description": "{{link_to_system_arguments_docs}}"
17316
+ }
17317
+ ],
17318
+ "slots": [
17319
+ {
17320
+ "name": "feedback_message",
17321
+ "description": "A feedback message with some defaults that are necessary for rendering nicely",
17322
+ "parameters": [
17323
+ {
17324
+ "name": "heading",
17325
+ "type": "String",
17326
+ "default": "N/A",
17327
+ "description": "the heading for the success message"
17328
+ },
17329
+ {
17330
+ "name": "description",
17331
+ "type": "String",
17332
+ "default": "N/A",
17333
+ "description": "the description for the success message"
17334
+ },
17335
+ {
17336
+ "name": "icon_arguments",
17337
+ "type": "Hash",
17338
+ "default": "N/A",
17339
+ "description": "the system_arguments for the icon"
17340
+ },
17341
+ {
17342
+ "name": "system_arguments",
17343
+ "type": "Hash",
17344
+ "default": "N/A",
17345
+ "description": "{{link_to_system_arguments_docs}}"
17346
+ }
17347
+ ]
17348
+ },
17349
+ {
17350
+ "name": "additional_content",
17351
+ "description": "Optional additional_content like a form input or toast.",
17352
+ "parameters": [
17353
+ {
17354
+ "name": "system_arguments",
17355
+ "type": "Hash",
17356
+ "default": "N/A",
17357
+ "description": "{{link_to_system_arguments_docs}}"
17358
+ }
17359
+ ]
17360
+ },
17361
+ {
17362
+ "name": "footer",
17363
+ "description": null,
17364
+ "parameters": [
17365
+
17366
+ ]
17367
+ }
17368
+ ],
17369
+ "methods": [
17370
+
17371
+ ],
17372
+ "previews": [
17373
+ {
17374
+ "preview_path": "primer/open_project/feedback_dialog/default",
17375
+ "name": "default",
17376
+ "snapshot": "interactive",
17377
+ "skip_rules": {
17378
+ "wont_fix": [
17379
+ "region"
17380
+ ],
17381
+ "will_fix": [
17382
+ "color-contrast"
17383
+ ]
17384
+ }
17385
+ },
17386
+ {
17387
+ "preview_path": "primer/open_project/feedback_dialog/playground",
17388
+ "name": "playground",
17389
+ "snapshot": "false",
17390
+ "skip_rules": {
17391
+ "wont_fix": [
17392
+ "region"
17393
+ ],
17394
+ "will_fix": [
17395
+ "color-contrast"
17396
+ ]
17397
+ }
17398
+ },
17399
+ {
17400
+ "preview_path": "primer/open_project/feedback_dialog/additional_content",
17401
+ "name": "additional_content",
17402
+ "snapshot": "false",
17403
+ "skip_rules": {
17404
+ "wont_fix": [
17405
+ "region"
17406
+ ],
17407
+ "will_fix": [
17408
+ "color-contrast"
17409
+ ]
17410
+ }
17411
+ },
17412
+ {
17413
+ "preview_path": "primer/open_project/feedback_dialog/custom_icon",
17414
+ "name": "custom_icon",
17415
+ "snapshot": "false",
17416
+ "skip_rules": {
17417
+ "wont_fix": [
17418
+ "region"
17419
+ ],
17420
+ "will_fix": [
17421
+ "color-contrast"
17422
+ ]
17423
+ }
17424
+ },
17425
+ {
17426
+ "preview_path": "primer/open_project/feedback_dialog/custom_footer",
17427
+ "name": "custom_footer",
17428
+ "snapshot": "false",
17429
+ "skip_rules": {
17430
+ "wont_fix": [
17431
+ "region"
17432
+ ],
17433
+ "will_fix": [
17434
+ "color-contrast"
17435
+ ]
17436
+ }
17437
+ },
17438
+ {
17439
+ "preview_path": "primer/open_project/feedback_dialog/loading_spinner",
17440
+ "name": "loading_spinner",
17441
+ "snapshot": "false",
17442
+ "skip_rules": {
17443
+ "wont_fix": [
17444
+ "region"
17445
+ ],
17446
+ "will_fix": [
17447
+ "color-contrast"
17448
+ ]
17449
+ }
17450
+ }
17451
+ ],
17452
+ "subcomponents": [
17453
+
17454
+ ]
17455
+ },
17456
+ {
17457
+ "fully_qualified_name": "Primer::OpenProject::FeedbackMessage",
17458
+ "description": "A view component for messages, inspired by the Primer Blankslate,\nwhich serves a different use-case (messages for when data is missing).\nWe decided to wrap the Blankslate, because we don't want to have to adapt\nlots of different usages if Primer decides to change the Blankslate\nin a way that does not go well with our \"misuse\".",
17459
+ "accessibility_docs": null,
17460
+ "is_form_component": false,
17461
+ "is_published": true,
17462
+ "requires_js": false,
17463
+ "component": "OpenProject::FeedbackMessage",
17464
+ "status": "open_project",
17465
+ "a11y_reviewed": false,
17466
+ "short_name": "OpenProjectFeedbackMessage",
17467
+ "source": "https://github.com/primer/view_components/tree/main/app/components/primer/open_project/feedback_message.rb",
17468
+ "lookbook": "https://primer.style/view-components/lookbook/inspect/primer/open_project/feedback_message/default/",
17469
+ "parameters": [
17470
+ {
17471
+ "name": "icon_arguments",
17472
+ "type": "Hash",
17473
+ "default": "`{}`",
17474
+ "description": "special arguments for the icon"
17475
+ },
17476
+ {
17477
+ "name": "loading",
17478
+ "type": "Boolean",
17479
+ "default": "`false`",
17480
+ "description": "Show a loading spinner instead of an icon"
17481
+ },
17482
+ {
17483
+ "name": "system_arguments",
17484
+ "type": "Hash",
17485
+ "default": "N/A",
17486
+ "description": "{{link_to_system_arguments_docs}}"
17487
+ }
17488
+ ],
17489
+ "slots": [
17490
+
17491
+ ],
17492
+ "methods": [
17493
+
17494
+ ],
17495
+ "previews": [
17496
+ {
17497
+ "preview_path": "primer/open_project/feedback_message/default",
17498
+ "name": "default",
17499
+ "snapshot": "true",
17500
+ "skip_rules": {
17501
+ "wont_fix": [
17502
+ "region"
17503
+ ],
17504
+ "will_fix": [
17505
+ "color-contrast"
17506
+ ]
17507
+ }
17508
+ },
17509
+ {
17510
+ "preview_path": "primer/open_project/feedback_message/playground",
17511
+ "name": "playground",
17512
+ "snapshot": "false",
17513
+ "skip_rules": {
17514
+ "wont_fix": [
17515
+ "region"
17516
+ ],
17517
+ "will_fix": [
17518
+ "color-contrast"
17519
+ ]
17520
+ }
17521
+ },
17522
+ {
17523
+ "preview_path": "primer/open_project/feedback_message/with_custom_icon",
17524
+ "name": "with_custom_icon",
17525
+ "snapshot": "false",
17526
+ "skip_rules": {
17527
+ "wont_fix": [
17528
+ "region"
17529
+ ],
17530
+ "will_fix": [
17531
+ "color-contrast"
17532
+ ]
17533
+ }
17534
+ },
17535
+ {
17536
+ "preview_path": "primer/open_project/feedback_message/with_custom_color",
17537
+ "name": "with_custom_color",
17538
+ "snapshot": "false",
17539
+ "skip_rules": {
17540
+ "wont_fix": [
17541
+ "region"
17542
+ ],
17543
+ "will_fix": [
17544
+ "color-contrast"
17545
+ ]
17546
+ }
17547
+ },
17548
+ {
17549
+ "preview_path": "primer/open_project/feedback_message/loading_spinner",
17550
+ "name": "loading_spinner",
17551
+ "snapshot": "false",
17552
+ "skip_rules": {
17553
+ "wont_fix": [
17554
+ "region"
17555
+ ],
17556
+ "will_fix": [
17557
+ "color-contrast"
17558
+ ]
17559
+ }
17560
+ },
17561
+ {
17562
+ "preview_path": "primer/open_project/feedback_message/secondary_action",
17563
+ "name": "secondary_action",
17564
+ "snapshot": "false",
17565
+ "skip_rules": {
17566
+ "wont_fix": [
17567
+ "region"
17568
+ ],
17569
+ "will_fix": [
17570
+ "color-contrast"
17571
+ ]
17572
+ }
17573
+ }
17574
+ ],
17575
+ "subcomponents": [
17576
+
17577
+ ]
17578
+ },
17297
17579
  {
17298
17580
  "fully_qualified_name": "Primer::OpenProject::FlexLayout",
17299
17581
  "description": "A layouting component used to arrange multiple components next / below each other",
data/static/previews.json CHANGED
@@ -3647,6 +3647,178 @@
3647
3647
  }
3648
3648
  ]
3649
3649
  },
3650
+ {
3651
+ "name": "feedback_dialog",
3652
+ "component": "OpenProject::FeedbackDialog",
3653
+ "status": "open_project",
3654
+ "lookup_path": "primer/open_project/feedback_dialog",
3655
+ "examples": [
3656
+ {
3657
+ "preview_path": "primer/open_project/feedback_dialog/default",
3658
+ "name": "default",
3659
+ "snapshot": "interactive",
3660
+ "skip_rules": {
3661
+ "wont_fix": [
3662
+ "region"
3663
+ ],
3664
+ "will_fix": [
3665
+ "color-contrast"
3666
+ ]
3667
+ }
3668
+ },
3669
+ {
3670
+ "preview_path": "primer/open_project/feedback_dialog/playground",
3671
+ "name": "playground",
3672
+ "snapshot": "false",
3673
+ "skip_rules": {
3674
+ "wont_fix": [
3675
+ "region"
3676
+ ],
3677
+ "will_fix": [
3678
+ "color-contrast"
3679
+ ]
3680
+ }
3681
+ },
3682
+ {
3683
+ "preview_path": "primer/open_project/feedback_dialog/additional_content",
3684
+ "name": "additional_content",
3685
+ "snapshot": "false",
3686
+ "skip_rules": {
3687
+ "wont_fix": [
3688
+ "region"
3689
+ ],
3690
+ "will_fix": [
3691
+ "color-contrast"
3692
+ ]
3693
+ }
3694
+ },
3695
+ {
3696
+ "preview_path": "primer/open_project/feedback_dialog/custom_icon",
3697
+ "name": "custom_icon",
3698
+ "snapshot": "false",
3699
+ "skip_rules": {
3700
+ "wont_fix": [
3701
+ "region"
3702
+ ],
3703
+ "will_fix": [
3704
+ "color-contrast"
3705
+ ]
3706
+ }
3707
+ },
3708
+ {
3709
+ "preview_path": "primer/open_project/feedback_dialog/custom_footer",
3710
+ "name": "custom_footer",
3711
+ "snapshot": "false",
3712
+ "skip_rules": {
3713
+ "wont_fix": [
3714
+ "region"
3715
+ ],
3716
+ "will_fix": [
3717
+ "color-contrast"
3718
+ ]
3719
+ }
3720
+ },
3721
+ {
3722
+ "preview_path": "primer/open_project/feedback_dialog/loading_spinner",
3723
+ "name": "loading_spinner",
3724
+ "snapshot": "false",
3725
+ "skip_rules": {
3726
+ "wont_fix": [
3727
+ "region"
3728
+ ],
3729
+ "will_fix": [
3730
+ "color-contrast"
3731
+ ]
3732
+ }
3733
+ }
3734
+ ]
3735
+ },
3736
+ {
3737
+ "name": "feedback_message",
3738
+ "component": "OpenProject::FeedbackMessage",
3739
+ "status": "open_project",
3740
+ "lookup_path": "primer/open_project/feedback_message",
3741
+ "examples": [
3742
+ {
3743
+ "preview_path": "primer/open_project/feedback_message/default",
3744
+ "name": "default",
3745
+ "snapshot": "true",
3746
+ "skip_rules": {
3747
+ "wont_fix": [
3748
+ "region"
3749
+ ],
3750
+ "will_fix": [
3751
+ "color-contrast"
3752
+ ]
3753
+ }
3754
+ },
3755
+ {
3756
+ "preview_path": "primer/open_project/feedback_message/playground",
3757
+ "name": "playground",
3758
+ "snapshot": "false",
3759
+ "skip_rules": {
3760
+ "wont_fix": [
3761
+ "region"
3762
+ ],
3763
+ "will_fix": [
3764
+ "color-contrast"
3765
+ ]
3766
+ }
3767
+ },
3768
+ {
3769
+ "preview_path": "primer/open_project/feedback_message/with_custom_icon",
3770
+ "name": "with_custom_icon",
3771
+ "snapshot": "false",
3772
+ "skip_rules": {
3773
+ "wont_fix": [
3774
+ "region"
3775
+ ],
3776
+ "will_fix": [
3777
+ "color-contrast"
3778
+ ]
3779
+ }
3780
+ },
3781
+ {
3782
+ "preview_path": "primer/open_project/feedback_message/with_custom_color",
3783
+ "name": "with_custom_color",
3784
+ "snapshot": "false",
3785
+ "skip_rules": {
3786
+ "wont_fix": [
3787
+ "region"
3788
+ ],
3789
+ "will_fix": [
3790
+ "color-contrast"
3791
+ ]
3792
+ }
3793
+ },
3794
+ {
3795
+ "preview_path": "primer/open_project/feedback_message/loading_spinner",
3796
+ "name": "loading_spinner",
3797
+ "snapshot": "false",
3798
+ "skip_rules": {
3799
+ "wont_fix": [
3800
+ "region"
3801
+ ],
3802
+ "will_fix": [
3803
+ "color-contrast"
3804
+ ]
3805
+ }
3806
+ },
3807
+ {
3808
+ "preview_path": "primer/open_project/feedback_message/secondary_action",
3809
+ "name": "secondary_action",
3810
+ "snapshot": "false",
3811
+ "skip_rules": {
3812
+ "wont_fix": [
3813
+ "region"
3814
+ ],
3815
+ "will_fix": [
3816
+ "color-contrast"
3817
+ ]
3818
+ }
3819
+ }
3820
+ ]
3821
+ },
3650
3822
  {
3651
3823
  "name": "flash",
3652
3824
  "component": "Flash",
data/static/statuses.json CHANGED
@@ -118,6 +118,8 @@
118
118
  "Primer::OpenProject::BorderGrid": "open_project",
119
119
  "Primer::OpenProject::BorderGrid::Cell": "open_project",
120
120
  "Primer::OpenProject::DragHandle": "open_project",
121
+ "Primer::OpenProject::FeedbackDialog": "open_project",
122
+ "Primer::OpenProject::FeedbackMessage": "open_project",
121
123
  "Primer::OpenProject::FlexLayout": "open_project",
122
124
  "Primer::OpenProject::GridLayout": "open_project",
123
125
  "Primer::OpenProject::GridLayout::Area": "open_project",
metadata CHANGED
@@ -1,7 +1,7 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: openproject-primer_view_components
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.43.1
4
+ version: 0.44.1
5
5
  platform: ruby
6
6
  authors:
7
7
  - GitHub Open Source
@@ -9,7 +9,7 @@ authors:
9
9
  autorequire:
10
10
  bindir: bin
11
11
  cert_chain: []
12
- date: 2024-09-03 00:00:00.000000000 Z
12
+ date: 2024-09-04 00:00:00.000000000 Z
13
13
  dependencies:
14
14
  - !ruby/object:Gem::Dependency
15
15
  name: actionview
@@ -82,6 +82,7 @@ files:
82
82
  - CHANGELOG.md
83
83
  - LICENSE.txt
84
84
  - README.md
85
+ - app/assets/images/loading_indicator.svg
85
86
  - app/assets/javascripts/app/components/primer/alpha/action_bar_element.d.ts
86
87
  - app/assets/javascripts/app/components/primer/alpha/action_list.d.ts
87
88
  - app/assets/javascripts/app/components/primer/alpha/action_menu/action_menu_element.d.ts
@@ -489,6 +490,10 @@ files:
489
490
  - app/components/primer/open_project/drag_handle.html.erb
490
491
  - app/components/primer/open_project/drag_handle.pcss
491
492
  - app/components/primer/open_project/drag_handle.rb
493
+ - app/components/primer/open_project/feedback_dialog.html.erb
494
+ - app/components/primer/open_project/feedback_dialog.rb
495
+ - app/components/primer/open_project/feedback_message.html.erb
496
+ - app/components/primer/open_project/feedback_message.rb
492
497
  - app/components/primer/open_project/flex_layout.html.erb
493
498
  - app/components/primer/open_project/flex_layout.rb
494
499
  - app/components/primer/open_project/grid_layout.html.erb
@@ -985,6 +990,11 @@ files:
985
990
  - previews/primer/forms_preview/text_field_and_checkbox_form.html.erb
986
991
  - previews/primer/open_project/border_grid_preview.rb
987
992
  - previews/primer/open_project/drag_handle_preview.rb
993
+ - previews/primer/open_project/feedback_dialog_preview.rb
994
+ - previews/primer/open_project/feedback_dialog_preview/additional_content.html.erb
995
+ - previews/primer/open_project/feedback_dialog_preview/custom_footer.html.erb
996
+ - previews/primer/open_project/feedback_dialog_preview/playground.html.erb
997
+ - previews/primer/open_project/feedback_message_preview.rb
988
998
  - previews/primer/open_project/flex_layout_preview.rb
989
999
  - previews/primer/open_project/grid_layout_preview.rb
990
1000
  - previews/primer/open_project/input_group_preview.rb
@@ -1032,7 +1042,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
1032
1042
  - !ruby/object:Gem::Version
1033
1043
  version: '0'
1034
1044
  requirements: []
1035
- rubygems_version: 3.5.11
1045
+ rubygems_version: 3.5.16
1036
1046
  signing_key:
1037
1047
  specification_version: 4
1038
1048
  summary: ViewComponents of the Primer Design System for OpenProject