polaris_view_components 0.5.0 → 0.8.1
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/README.md +12 -2
- data/app/assets/javascripts/polaris_view_components/autocomplete_controller.js +136 -0
- data/app/assets/javascripts/polaris_view_components/button_controller.js +47 -0
- data/app/assets/javascripts/polaris_view_components/dropzone_controller.js +495 -0
- data/app/assets/javascripts/polaris_view_components/frame_controller.js +41 -0
- data/app/assets/javascripts/polaris_view_components/index.js +21 -1
- data/app/assets/javascripts/polaris_view_components/modal_controller.js +25 -0
- data/app/assets/javascripts/polaris_view_components/option_list_controller.js +41 -0
- data/app/assets/javascripts/polaris_view_components/polaris_controller.js +28 -0
- data/app/assets/javascripts/polaris_view_components/popover_controller.js +56 -0
- data/app/assets/javascripts/polaris_view_components/scrollable_controller.js +60 -0
- data/app/assets/javascripts/polaris_view_components/text_field_controller.js +4 -0
- data/app/assets/javascripts/polaris_view_components/toast_controller.js +68 -0
- data/app/assets/javascripts/polaris_view_components/utils.js +23 -0
- data/app/assets/javascripts/polaris_view_components.js +2400 -1
- data/app/assets/stylesheets/polaris_view_components/custom.css +104 -6
- data/app/assets/stylesheets/polaris_view_components.css +2147 -2021
- data/app/assets/stylesheets/polaris_view_components.postcss.css +1 -1
- data/app/components/polaris/action.rb +3 -3
- data/app/components/polaris/action_list/item_component.html.erb +35 -0
- data/app/components/polaris/action_list/item_component.rb +41 -0
- data/app/components/polaris/action_list/section_component.html.erb +16 -0
- data/app/components/polaris/action_list/section_component.rb +26 -0
- data/app/components/polaris/action_list_component.html.erb +13 -0
- data/app/components/polaris/action_list_component.rb +25 -0
- data/app/components/polaris/autocomplete/action_component.rb +7 -0
- data/app/components/polaris/autocomplete/option_component.rb +35 -0
- data/app/components/polaris/autocomplete/section_component.html.erb +9 -0
- data/app/components/polaris/autocomplete/section_component.rb +12 -0
- data/app/components/polaris/autocomplete_component.html.erb +30 -0
- data/app/components/polaris/autocomplete_component.rb +65 -0
- data/app/components/polaris/avatar_component.rb +2 -2
- data/app/components/polaris/badge_component.rb +2 -2
- data/app/components/polaris/banner_component.rb +8 -8
- data/app/components/polaris/base_button.rb +2 -2
- data/app/components/polaris/base_checkbox.rb +48 -0
- data/app/components/polaris/base_component.rb +1 -1
- data/app/components/polaris/base_radio_button.rb +38 -0
- data/app/components/polaris/button_component.html.erb +13 -0
- data/app/components/polaris/button_group_component.rb +8 -8
- data/app/components/polaris/callout_card_component.rb +6 -6
- data/app/components/polaris/caption_component.rb +3 -3
- data/app/components/polaris/card/header_component.rb +2 -2
- data/app/components/polaris/card/section_component.rb +4 -4
- data/app/components/polaris/card_component.html.erb +4 -0
- data/app/components/polaris/card_component.rb +6 -5
- data/app/components/polaris/character_count.rb +10 -10
- data/app/components/polaris/checkbox_component.html.erb +1 -5
- data/app/components/polaris/checkbox_component.rb +20 -13
- data/app/components/polaris/choice_component.rb +2 -2
- data/app/components/polaris/choice_list_component.rb +6 -6
- data/app/components/polaris/component.rb +6 -1
- data/app/components/polaris/data_table/cell_component.rb +4 -4
- data/app/components/polaris/data_table/column_component.rb +1 -1
- data/app/components/polaris/data_table_component.rb +4 -4
- data/app/components/polaris/description_list_component.rb +5 -5
- data/app/components/polaris/display_text_component.rb +3 -3
- data/app/components/polaris/dropzone_component.html.erb +156 -0
- data/app/components/polaris/dropzone_component.rb +150 -0
- data/app/components/polaris/empty_state_component.rb +4 -4
- data/app/components/polaris/exception_list/item_component.rb +3 -3
- data/app/components/polaris/exception_list_component.rb +2 -2
- data/app/components/polaris/filters_component.html.erb +22 -0
- data/app/components/polaris/filters_component.rb +61 -8
- data/app/components/polaris/footer_help_component.rb +2 -2
- data/app/components/polaris/form_layout/group_component.rb +5 -5
- data/app/components/polaris/form_layout/item_component.rb +2 -2
- data/app/components/polaris/form_layout_component.rb +4 -4
- data/app/components/polaris/frame/save_bar_component.html.erb +23 -0
- data/app/components/polaris/frame/save_bar_component.rb +31 -0
- data/app/components/polaris/frame/top_bar_component.html.erb +30 -0
- data/app/components/polaris/frame/top_bar_component.rb +18 -0
- data/app/components/polaris/frame_component.html.erb +44 -0
- data/app/components/polaris/frame_component.rb +33 -0
- data/app/components/polaris/heading_component.rb +2 -2
- data/app/components/polaris/headless_button.html.erb +13 -0
- data/app/components/polaris/headless_button.rb +18 -6
- data/app/components/polaris/icon_component.rb +3 -3
- data/app/components/polaris/index_table/cell_component.rb +3 -3
- data/app/components/polaris/index_table/column_component.rb +1 -1
- data/app/components/polaris/index_table_component.rb +4 -4
- data/app/components/polaris/inline_error_component.rb +2 -2
- data/app/components/polaris/label_component.rb +3 -3
- data/app/components/polaris/labelled_component.rb +3 -3
- data/app/components/polaris/layout/annotated_section.rb +2 -2
- data/app/components/polaris/layout/section.rb +2 -2
- data/app/components/polaris/layout_component.rb +4 -4
- data/app/components/polaris/link_component.rb +4 -4
- data/app/components/polaris/list_component.rb +5 -5
- data/app/components/polaris/logo.rb +13 -0
- data/app/components/polaris/modal/section_component.rb +19 -0
- data/app/components/polaris/modal_component.html.erb +79 -0
- data/app/components/polaris/modal_component.rb +98 -0
- data/app/components/polaris/navigation/item_component.html.erb +31 -0
- data/app/components/polaris/navigation/item_component.rb +85 -0
- data/app/components/polaris/navigation/section_component.html.erb +17 -0
- data/app/components/polaris/navigation/section_component.rb +64 -0
- data/app/components/polaris/navigation_component.html.erb +29 -0
- data/app/components/polaris/navigation_component.rb +15 -0
- data/app/components/polaris/option_list/checkbox_component.html.erb +14 -0
- data/app/components/polaris/option_list/checkbox_component.rb +37 -0
- data/app/components/polaris/option_list/option_component.rb +24 -0
- data/app/components/polaris/option_list/radio_button_component.rb +54 -0
- data/app/components/polaris/option_list/section_component.html.erb +14 -0
- data/app/components/polaris/option_list/section_component.rb +53 -0
- data/app/components/polaris/option_list_component.html.erb +15 -0
- data/app/components/polaris/option_list_component.rb +67 -0
- data/app/components/polaris/page_actions_component.rb +9 -8
- data/app/components/polaris/page_component.rb +5 -5
- data/app/components/polaris/pagination_component.rb +2 -6
- data/app/components/polaris/popover/pane_component.html.erb +25 -0
- data/app/components/polaris/popover/pane_component.rb +20 -0
- data/app/components/polaris/popover/section_component.rb +19 -0
- data/app/components/polaris/popover_component.html.erb +31 -0
- data/app/components/polaris/popover_component.rb +113 -0
- data/app/components/polaris/progress_bar_component.rb +6 -6
- data/app/components/polaris/radio_button_component.html.erb +1 -6
- data/app/components/polaris/radio_button_component.rb +18 -8
- data/app/components/polaris/resource_item_component.html.erb +16 -6
- data/app/components/polaris/resource_item_component.rb +43 -10
- data/app/components/polaris/resource_list_component.rb +3 -3
- data/app/components/polaris/scrollable_component.html.erb +5 -0
- data/app/components/polaris/scrollable_component.rb +48 -0
- data/app/components/polaris/select_component.rb +4 -4
- data/app/components/polaris/setting_toggle_component.html.erb +10 -0
- data/app/components/polaris/setting_toggle_component.rb +24 -0
- data/app/components/polaris/shopify_navigation_component.rb +8 -8
- data/app/components/polaris/skeleton_body_text_component.rb +2 -2
- data/app/components/polaris/spacer_component.rb +4 -4
- data/app/components/polaris/spinner_component.rb +3 -3
- data/app/components/polaris/stack/item_component.rb +15 -0
- data/app/components/polaris/stack_component.rb +6 -22
- data/app/components/polaris/subheading_component.rb +2 -2
- data/app/components/polaris/tabs/tab_component.html.erb +10 -0
- data/app/components/polaris/tabs/tab_component.rb +34 -0
- data/app/components/polaris/tabs_component.html.erb +7 -0
- data/app/components/polaris/tabs_component.rb +37 -0
- data/app/components/polaris/tag_component.rb +3 -2
- data/app/components/polaris/text_container_component.rb +3 -3
- data/app/components/polaris/text_field_component.rb +25 -11
- data/app/components/polaris/text_style_component.rb +5 -5
- data/app/components/polaris/thumbnail_component.rb +3 -3
- data/app/components/polaris/toast_component.html.erb +21 -0
- data/app/components/polaris/toast_component.rb +40 -0
- data/app/components/polaris/top_bar/user_menu_component.html.erb +19 -0
- data/app/components/polaris/top_bar/user_menu_component.rb +9 -0
- data/app/components/polaris/visually_hidden_component.rb +1 -1
- data/app/helpers/polaris/form_builder.rb +19 -8
- data/app/helpers/polaris/url_helper.rb +3 -3
- data/app/helpers/polaris/view_helper.rb +24 -4
- data/app/validators/type_validator.rb +2 -2
- data/config/locales/en.yml +6 -0
- data/lib/generators/polaris_view_components/install_generator.rb +5 -5
- data/lib/polaris/view_components/engine.rb +16 -2
- data/lib/polaris/view_components/version.rb +1 -1
- data/lib/polaris_view_components.rb +1 -1
- metadata +79 -16
- data/app/components/polaris/application_component.rb +0 -35
- data/app/components/polaris/dropzone/component.html.erb +0 -72
- data/app/components/polaris/dropzone/component.rb +0 -128
- data/app/components/polaris/dropzone/controller.js +0 -226
- data/app/components/polaris/dropzone/utils.js +0 -57
- data/app/components/polaris/new_component.rb +0 -10
- data/app/helpers/polaris/conditional_helper.rb +0 -11
@@ -1,7 +1,12 @@
|
|
1
1
|
module Polaris
|
2
2
|
# Module to allow shorthand calls for Polaris components
|
3
3
|
module ViewHelper
|
4
|
+
# standard:disable Layout/HashAlignment
|
4
5
|
POLARIS_HELPERS = {
|
6
|
+
action_list: "Polaris::ActionListComponent",
|
7
|
+
autocomplete: "Polaris::AutocompleteComponent",
|
8
|
+
autocomplete_section: "Polaris::Autocomplete::SectionComponent",
|
9
|
+
autocomplete_option: "Polaris::Autocomplete::OptionComponent",
|
5
10
|
avatar: "Polaris::AvatarComponent",
|
6
11
|
badge: "Polaris::BadgeComponent",
|
7
12
|
banner: "Polaris::BannerComponent",
|
@@ -17,11 +22,12 @@ module Polaris
|
|
17
22
|
data_table: "Polaris::DataTableComponent",
|
18
23
|
description_list: "Polaris::DescriptionListComponent",
|
19
24
|
display_text: "Polaris::DisplayTextComponent",
|
20
|
-
dropzone: "Polaris::
|
25
|
+
dropzone: "Polaris::DropzoneComponent",
|
21
26
|
empty_state: "Polaris::EmptyStateComponent",
|
22
27
|
exception_list: "Polaris::ExceptionListComponent",
|
23
28
|
footer_help: "Polaris::FooterHelpComponent",
|
24
29
|
form_layout: "Polaris::FormLayoutComponent",
|
30
|
+
frame: "Polaris::FrameComponent",
|
25
31
|
filters: "Polaris::FiltersComponent",
|
26
32
|
heading: "Polaris::HeadingComponent",
|
27
33
|
icon: "Polaris::IconComponent",
|
@@ -30,27 +36,37 @@ module Polaris
|
|
30
36
|
layout: "Polaris::LayoutComponent",
|
31
37
|
link: "Polaris::LinkComponent",
|
32
38
|
list: "Polaris::ListComponent",
|
39
|
+
modal: "Polaris::ModalComponent",
|
40
|
+
navigation: "Polaris::NavigationComponent",
|
41
|
+
option_list: "Polaris::OptionListComponent",
|
33
42
|
page: "Polaris::PageComponent",
|
34
43
|
page_actions: "Polaris::PageActionsComponent",
|
35
44
|
pagination: "Polaris::PaginationComponent",
|
36
45
|
progress_bar: "Polaris::ProgressBarComponent",
|
46
|
+
popover: "Polaris::PopoverComponent",
|
37
47
|
radio_button: "Polaris::RadioButtonComponent",
|
38
48
|
resource_list: "Polaris::ResourceListComponent",
|
39
49
|
resource_item: "Polaris::ResourceItemComponent",
|
40
50
|
select: "Polaris::SelectComponent",
|
51
|
+
setting_toggle: "Polaris::SettingToggleComponent",
|
41
52
|
shopify_navigation: "Polaris::ShopifyNavigationComponent",
|
42
53
|
stack: "Polaris::StackComponent",
|
54
|
+
stack_item: "Polaris::Stack::ItemComponent",
|
43
55
|
subheading: "Polaris::SubheadingComponent",
|
56
|
+
scrollable: "Polaris::ScrollableComponent",
|
44
57
|
spinner: "Polaris::SpinnerComponent",
|
45
58
|
skeleton_body_text: "Polaris::SkeletonBodyTextComponent",
|
46
59
|
spacer: "Polaris::SpacerComponent",
|
60
|
+
tabs: "Polaris::TabsComponent",
|
47
61
|
tag: "Polaris::TagComponent",
|
48
62
|
text_container: "Polaris::TextContainerComponent",
|
49
63
|
text_field: "Polaris::TextFieldComponent",
|
50
64
|
text_style: "Polaris::TextStyleComponent",
|
51
65
|
thumbnail: "Polaris::ThumbnailComponent",
|
52
|
-
|
66
|
+
toast: "Polaris::ToastComponent",
|
67
|
+
visually_hidden: "Polaris::VisuallyHiddenComponent"
|
53
68
|
}.freeze
|
69
|
+
# standard:enable Layout/HashAlignment
|
54
70
|
POLARIS_HELPERS.each do |name, component|
|
55
71
|
define_method "polaris_#{name}" do |*args, **kwargs, &block|
|
56
72
|
render component.constantize.new(*args, **kwargs), &block
|
@@ -68,7 +84,7 @@ module Polaris
|
|
68
84
|
path = ViewComponents::Engine.root.join("app", "assets", "icons", "polaris", "#{name}.svg")
|
69
85
|
file = File.read(path)
|
70
86
|
doc = Nokogiri::HTML::DocumentFragment.parse(file)
|
71
|
-
svg = doc.at_css
|
87
|
+
svg = doc.at_css "svg"
|
72
88
|
svg[:class] = "Polaris-Icon__Svg"
|
73
89
|
svg[:focusable] = false
|
74
90
|
svg[:"aria-hidden"] = true
|
@@ -76,7 +92,11 @@ module Polaris
|
|
76
92
|
end
|
77
93
|
|
78
94
|
def polaris_body_styles
|
79
|
-
%
|
95
|
+
%(background-color: rgb(246, 246, 247); color: rgb(32, 34, 35); --p-background:rgba(246, 246, 247, 1); --p-background-hovered:rgba(241, 242, 243, 1); --p-background-pressed:rgba(237, 238, 239, 1); --p-background-selected:rgba(237, 238, 239, 1); --p-surface:rgba(255, 255, 255, 1); --p-surface-neutral:rgba(228, 229, 231, 1); --p-surface-neutral-hovered:rgba(219, 221, 223, 1); --p-surface-neutral-pressed:rgba(201, 204, 208, 1); --p-surface-neutral-disabled:rgba(241, 242, 243, 1); --p-surface-neutral-subdued:rgba(246, 246, 247, 1); --p-surface-subdued:rgba(250, 251, 251, 1); --p-surface-disabled:rgba(250, 251, 251, 1); --p-surface-hovered:rgba(246, 246, 247, 1); --p-surface-pressed:rgba(241, 242, 243, 1); --p-surface-depressed:rgba(237, 238, 239, 1); --p-backdrop:rgba(0, 0, 0, 0.5); --p-overlay:rgba(255, 255, 255, 0.5); --p-shadow-from-dim-light:rgba(0, 0, 0, 0.2); --p-shadow-from-ambient-light:rgba(23, 24, 24, 0.05); --p-shadow-from-direct-light:rgba(0, 0, 0, 0.15); --p-hint-from-direct-light:rgba(0, 0, 0, 0.15); --p-on-surface-background:rgba(241, 242, 243, 1); --p-border:rgba(140, 145, 150, 1); --p-border-neutral-subdued:rgba(186, 191, 195, 1); --p-border-hovered:rgba(153, 158, 164, 1); --p-border-disabled:rgba(210, 213, 216, 1); --p-border-subdued:rgba(201, 204, 207, 1); --p-border-depressed:rgba(87, 89, 89, 1); --p-border-shadow:rgba(174, 180, 185, 1); --p-border-shadow-subdued:rgba(186, 191, 196, 1); --p-divider:rgba(225, 227, 229, 1); --p-icon:rgba(92, 95, 98, 1); --p-icon-hovered:rgba(26, 28, 29, 1); --p-icon-pressed:rgba(68, 71, 74, 1); --p-icon-disabled:rgba(186, 190, 195, 1); --p-icon-subdued:rgba(140, 145, 150, 1); --p-text:rgba(32, 34, 35, 1); --p-text-disabled:rgba(140, 145, 150, 1); --p-text-subdued:rgba(109, 113, 117, 1); --p-interactive:rgba(44, 110, 203, 1); --p-interactive-disabled:rgba(189, 193, 204, 1); --p-interactive-hovered:rgba(31, 81, 153, 1); --p-interactive-pressed:rgba(16, 50, 98, 1); --p-focused:rgba(69, 143, 255, 1); --p-surface-selected:rgba(242, 247, 254, 1); --p-surface-selected-hovered:rgba(237, 244, 254, 1); --p-surface-selected-pressed:rgba(229, 239, 253, 1); --p-icon-on-interactive:rgba(255, 255, 255, 1); --p-text-on-interactive:rgba(255, 255, 255, 1); --p-action-secondary:rgba(255, 255, 255, 1); --p-action-secondary-disabled:rgba(255, 255, 255, 1); --p-action-secondary-hovered:rgba(246, 246, 247, 1); --p-action-secondary-pressed:rgba(241, 242, 243, 1); --p-action-secondary-depressed:rgba(109, 113, 117, 1); --p-action-primary:rgba(0, 128, 96, 1); --p-action-primary-disabled:rgba(241, 241, 241, 1); --p-action-primary-hovered:rgba(0, 110, 82, 1); --p-action-primary-pressed:rgba(0, 94, 70, 1); --p-action-primary-depressed:rgba(0, 61, 44, 1); --p-icon-on-primary:rgba(255, 255, 255, 1); --p-text-on-primary:rgba(255, 255, 255, 1); --p-text-primary:rgba(0, 123, 92, 1); --p-text-primary-hovered:rgba(0, 108, 80, 1); --p-text-primary-pressed:rgba(0, 92, 68, 1); --p-surface-primary-selected:rgba(241, 248, 245, 1); --p-surface-primary-selected-hovered:rgba(179, 208, 195, 1); --p-surface-primary-selected-pressed:rgba(162, 188, 176, 1); --p-border-critical:rgba(253, 87, 73, 1); --p-border-critical-subdued:rgba(224, 179, 178, 1); --p-border-critical-disabled:rgba(255, 167, 163, 1); --p-icon-critical:rgba(215, 44, 13, 1); --p-surface-critical:rgba(254, 211, 209, 1); --p-surface-critical-subdued:rgba(255, 244, 244, 1); --p-surface-critical-subdued-hovered:rgba(255, 240, 240, 1); --p-surface-critical-subdued-pressed:rgba(255, 233, 232, 1); --p-surface-critical-subdued-depressed:rgba(254, 188, 185, 1); --p-text-critical:rgba(215, 44, 13, 1); --p-action-critical:rgba(216, 44, 13, 1); --p-action-critical-disabled:rgba(241, 241, 241, 1); --p-action-critical-hovered:rgba(188, 34, 0, 1); --p-action-critical-pressed:rgba(162, 27, 0, 1); --p-action-critical-depressed:rgba(108, 15, 0, 1); --p-icon-on-critical:rgba(255, 255, 255, 1); --p-text-on-critical:rgba(255, 255, 255, 1); --p-interactive-critical:rgba(216, 44, 13, 1); --p-interactive-critical-disabled:rgba(253, 147, 141, 1); --p-interactive-critical-hovered:rgba(205, 41, 12, 1); --p-interactive-critical-pressed:rgba(103, 15, 3, 1); --p-border-warning:rgba(185, 137, 0, 1); --p-border-warning-subdued:rgba(225, 184, 120, 1); --p-icon-warning:rgba(185, 137, 0, 1); --p-surface-warning:rgba(255, 215, 157, 1); --p-surface-warning-subdued:rgba(255, 245, 234, 1); --p-surface-warning-subdued-hovered:rgba(255, 242, 226, 1); --p-surface-warning-subdued-pressed:rgba(255, 235, 211, 1); --p-text-warning:rgba(145, 106, 0, 1); --p-border-highlight:rgba(68, 157, 167, 1); --p-border-highlight-subdued:rgba(152, 198, 205, 1); --p-icon-highlight:rgba(0, 160, 172, 1); --p-surface-highlight:rgba(164, 232, 242, 1); --p-surface-highlight-subdued:rgba(235, 249, 252, 1); --p-surface-highlight-subdued-hovered:rgba(228, 247, 250, 1); --p-surface-highlight-subdued-pressed:rgba(213, 243, 248, 1); --p-text-highlight:rgba(52, 124, 132, 1); --p-border-success:rgba(0, 164, 124, 1); --p-border-success-subdued:rgba(149, 201, 180, 1); --p-icon-success:rgba(0, 127, 95, 1); --p-surface-success:rgba(174, 233, 209, 1); --p-surface-success-subdued:rgba(241, 248, 245, 1); --p-surface-success-subdued-hovered:rgba(236, 246, 241, 1); --p-surface-success-subdued-pressed:rgba(226, 241, 234, 1); --p-text-success:rgba(0, 128, 96, 1); --p-decorative-one-icon:rgba(126, 87, 0, 1); --p-decorative-one-surface:rgba(255, 201, 107, 1); --p-decorative-one-text:rgba(61, 40, 0, 1); --p-decorative-two-icon:rgba(175, 41, 78, 1); --p-decorative-two-surface:rgba(255, 196, 176, 1); --p-decorative-two-text:rgba(73, 11, 28, 1); --p-decorative-three-icon:rgba(0, 109, 65, 1); --p-decorative-three-surface:rgba(146, 230, 181, 1); --p-decorative-three-text:rgba(0, 47, 25, 1); --p-decorative-four-icon:rgba(0, 106, 104, 1); --p-decorative-four-surface:rgba(145, 224, 214, 1); --p-decorative-four-text:rgba(0, 45, 45, 1); --p-decorative-five-icon:rgba(174, 43, 76, 1); --p-decorative-five-surface:rgba(253, 201, 208, 1); --p-decorative-five-text:rgba(79, 14, 31, 1); --p-border-radius-base:0.4rem; --p-border-radius-wide:0.8rem; --p-border-radius-full:50%; --p-card-shadow:0px 0px 5px var(--p-shadow-from-ambient-light), 0px 1px 2px var(--p-shadow-from-direct-light); --p-popover-shadow:-1px 0px 20px var(--p-shadow-from-ambient-light), 0px 1px 5px var(--p-shadow-from-direct-light); --p-modal-shadow:0px 26px 80px var(--p-shadow-from-dim-light), 0px 0px 1px var(--p-shadow-from-dim-light); --p-top-bar-shadow:0 2px 2px -1px var(--p-shadow-from-direct-light); --p-button-drop-shadow:0 1px 0 rgba(0, 0, 0, 0.05); --p-button-inner-shadow:inset 0 -1px 0 rgba(0, 0, 0, 0.2); --p-button-pressed-inner-shadow:inset 0 1px 0 rgba(0, 0, 0, 0.15); --p-override-none:none; --p-override-transparent:transparent; --p-override-one:1; --p-override-visible:visible; --p-override-zero:0; --p-override-loading-z-index:514; --p-button-font-weight:500; --p-non-null-content:''; --p-choice-size:2rem; --p-icon-size:1rem; --p-choice-margin:0.1rem; --p-control-border-width:0.2rem; --p-banner-border-default:inset 0 0.1rem 0 0 var(--p-border-neutral-subdued), inset 0 0 0 0.1rem var(--p-border-neutral-subdued); --p-banner-border-success:inset 0 0.1rem 0 0 var(--p-border-success-subdued), inset 0 0 0 0.1rem var(--p-border-success-subdued); --p-banner-border-highlight:inset 0 0.1rem 0 0 var(--p-border-highlight-subdued), inset 0 0 0 0.1rem var(--p-border-highlight-subdued); --p-banner-border-warning:inset 0 0.1rem 0 0 var(--p-border-warning-subdued), inset 0 0 0 0.1rem var(--p-border-warning-subdued); --p-banner-border-critical:inset 0 0.1rem 0 0 var(--p-border-critical-subdued), inset 0 0 0 0.1rem var(--p-border-critical-subdued); --p-badge-mix-blend-mode:luminosity; --p-thin-border-subdued:0.1rem solid var(--p-border-subdued); --p-text-field-spinner-offset:0.2rem; --p-text-field-focus-ring-offset:-0.4rem; --p-text-field-focus-ring-border-radius:0.7rem; --p-button-group-item-spacing:-0.1rem; --p-duration-1-0-0:100ms; --p-duration-1-5-0:150ms; --p-ease-in:cubic-bezier(0.5, 0.1, 1, 1); --p-ease:cubic-bezier(0.4, 0.22, 0.28, 1); --p-range-slider-thumb-size-base:1.6rem; --p-range-slider-thumb-size-active:2.4rem; --p-range-slider-thumb-scale:1.5; --p-badge-font-weight:400; --p-frame-offset:0px;)
|
96
|
+
end
|
97
|
+
|
98
|
+
def polaris_inversed_colors
|
99
|
+
%(--p-background:rgba(11, 12, 13, 1); --p-background-hovered:rgba(11, 12, 13, 1); --p-background-pressed:rgba(11, 12, 13, 1); --p-background-selected:rgba(11, 12, 13, 1); --p-surface:rgba(32, 33, 35, 1); --p-surface-neutral:rgba(49, 51, 53, 1); --p-surface-neutral-hovered:rgba(49, 51, 53, 1); --p-surface-neutral-pressed:rgba(49, 51, 53, 1); --p-surface-neutral-disabled:rgba(49, 51, 53, 1); --p-surface-neutral-subdued:rgba(68, 71, 74, 1); --p-surface-subdued:rgba(26, 28, 29, 1); --p-surface-disabled:rgba(26, 28, 29, 1); --p-surface-hovered:rgba(47, 49, 51, 1); --p-surface-pressed:rgba(62, 64, 67, 1); --p-surface-depressed:rgba(80, 83, 86, 1); --p-surface-search-field:rgba(47, 49, 51, 1); --p-backdrop:rgba(0, 0, 0, 0.5); --p-overlay:rgba(33, 33, 33, 0.5); --p-shadow-from-dim-light:rgba(255, 255, 255, 0.2); --p-shadow-from-ambient-light:rgba(23, 24, 24, 0.05); --p-shadow-from-direct-light:rgba(255, 255, 255, 0.15); --p-hint-from-direct-light:rgba(185, 185, 185, 0.2); --p-border:rgba(80, 83, 86, 1); --p-border-neutral-subdued:rgba(130, 135, 139, 1); --p-border-hovered:rgba(80, 83, 86, 1); --p-border-disabled:rgba(103, 107, 111, 1); --p-border-subdued:rgba(130, 135, 139, 1); --p-border-depressed:rgba(142, 145, 145, 1); --p-border-shadow:rgba(91, 95, 98, 1); --p-border-shadow-subdued:rgba(130, 135, 139, 1); --p-divider:rgba(69, 71, 73, 1); --p-icon:rgba(166, 172, 178, 1); --p-icon-hovered:rgba(225, 227, 229, 1); --p-icon-pressed:rgba(166, 172, 178, 1); --p-icon-disabled:rgba(84, 87, 90, 1); --p-icon-subdued:rgba(120, 125, 129, 1); --p-text:rgba(227, 229, 231, 1); --p-text-disabled:rgba(111, 115, 119, 1); --p-text-subdued:rgba(153, 159, 164, 1); --p-interactive:rgba(54, 163, 255, 1); --p-interactive-disabled:rgba(38, 98, 182, 1); --p-interactive-hovered:rgba(103, 175, 255, 1); --p-interactive-pressed:rgba(136, 188, 255, 1); --p-icon-interactive:rgba(54, 163, 255, 1); --p-focused:rgba(38, 98, 182, 1); --p-surface-selected:rgba(2, 14, 35, 1); --p-surface-selected-hovered:rgba(7, 29, 61, 1); --p-surface-selected-pressed:rgba(13, 43, 86, 1); --p-icon-on-interactive:rgba(255, 255, 255, 1); --p-text-on-interactive:rgba(255, 255, 255, 1); --p-action-secondary:rgba(77, 80, 83, 1); --p-action-secondary-disabled:rgba(32, 34, 35, 1); --p-action-secondary-hovered:rgba(84, 87, 91, 1); --p-action-secondary-pressed:rgba(96, 100, 103, 1); --p-action-secondary-depressed:rgba(123, 127, 132, 1); --p-action-primary:rgba(0, 128, 96, 1); --p-action-primary-disabled:rgba(0, 86, 64, 1); --p-action-primary-hovered:rgba(0, 150, 113, 1); --p-action-primary-pressed:rgba(0, 164, 124, 1); --p-action-primary-depressed:rgba(0, 179, 136, 1); --p-icon-on-primary:rgba(230, 255, 244, 1); --p-text-on-primary:rgba(255, 255, 255, 1); --p-text-primary:rgba(0, 141, 106, 1); --p-text-primary-hovered:rgba(0, 158, 120, 1); --p-text-primary-pressed:rgba(0, 176, 133, 1); --p-surface-primary-selected:rgba(12, 18, 16, 1); --p-surface-primary-selected-hovered:rgba(40, 48, 44, 1); --p-surface-primary-selected-pressed:rgba(54, 64, 59, 1); --p-border-critical:rgba(227, 47, 14, 1); --p-border-critical-subdued:rgba(227, 47, 14, 1); --p-border-critical-disabled:rgba(131, 23, 4, 1); --p-icon-critical:rgba(218, 45, 13, 1); --p-surface-critical:rgba(69, 7, 1, 1); --p-surface-critical-subdued:rgba(69, 7, 1, 1); --p-surface-critical-subdued-hovered:rgba(68, 23, 20, 1); --p-surface-critical-subdued-pressed:rgba(107, 16, 3, 1); --p-surface-critical-subdued-depressed:rgba(135, 24, 5, 1); --p-text-critical:rgba(233, 128, 122, 1); --p-action-critical:rgba(205, 41, 12, 1); --p-action-critical-disabled:rgba(187, 37, 10, 1); --p-action-critical-hovered:rgba(227, 47, 14, 1); --p-action-critical-pressed:rgba(250, 53, 17, 1); --p-action-critical-depressed:rgba(253, 87, 73, 1); --p-icon-on-critical:rgba(255, 248, 247, 1); --p-text-on-critical:rgba(255, 255, 255, 1); --p-interactive-critical:rgba(253, 114, 106, 1); --p-interactive-critical-disabled:rgba(254, 172, 168, 1); --p-interactive-critical-hovered:rgba(253, 138, 132, 1); --p-interactive-critical-pressed:rgba(253, 159, 155, 1); --p-border-warning:rgba(153, 112, 0, 1); --p-border-warning-subdued:rgba(153, 112, 0, 1); --p-icon-warning:rgba(104, 75, 0, 1); --p-surface-warning:rgba(153, 112, 0, 1); --p-surface-warning-subdued:rgba(77, 59, 29, 1); --p-surface-warning-subdued-hovered:rgba(82, 63, 32, 1); --p-surface-warning-subdued-pressed:rgba(87, 67, 34, 1); --p-text-warning:rgba(202, 149, 0, 1); --p-border-highlight:rgba(68, 157, 167, 1); --p-border-highlight-subdued:rgba(68, 157, 167, 1); --p-icon-highlight:rgba(44, 108, 115, 1); --p-surface-highlight:rgba(0, 105, 113, 1); --p-surface-highlight-subdued:rgba(18, 53, 57, 1); --p-surface-highlight-subdued-hovered:rgba(20, 58, 62, 1); --p-surface-highlight-subdued-pressed:rgba(24, 65, 70, 1); --p-text-highlight:rgba(162, 239, 250, 1); --p-border-success:rgba(0, 135, 102, 1); --p-border-success-subdued:rgba(0, 135, 102, 1); --p-icon-success:rgba(0, 94, 70, 1); --p-surface-success:rgba(0, 94, 70, 1); --p-surface-success-subdued:rgba(28, 53, 44, 1); --p-surface-success-subdued-hovered:rgba(31, 58, 48, 1); --p-surface-success-subdued-pressed:rgba(35, 65, 54, 1); --p-text-success:rgba(88, 173, 142, 1); --p-decorative-one-icon:rgba(255, 186, 67, 1); --p-decorative-one-surface:rgba(142, 102, 9, 1); --p-decorative-one-text:rgba(255, 255, 255, 1); --p-decorative-two-icon:rgba(245, 182, 192, 1); --p-decorative-two-surface:rgba(206, 88, 20, 1); --p-decorative-two-text:rgba(255, 255, 255, 1); --p-decorative-three-icon:rgba(0, 227, 141, 1); --p-decorative-three-surface:rgba(0, 124, 90, 1); --p-decorative-three-text:rgba(255, 255, 255, 1); --p-decorative-four-icon:rgba(0, 221, 218, 1); --p-decorative-four-surface:rgba(22, 124, 121, 1); --p-decorative-four-text:rgba(255, 255, 255, 1); --p-decorative-five-icon:rgba(244, 183, 191, 1); --p-decorative-five-surface:rgba(194, 51, 86, 1); --p-decorative-five-text:rgba(255, 255, 255, 1); --p-border-radius-slim:0.2rem; --p-border-radius-base:0.4rem; --p-border-radius-wide:0.8rem; --p-border-radius-full:50%; --p-card-shadow:0px 0px 5px var(--p-shadow-from-ambient-light), 0px 1px 2px var(--p-shadow-from-direct-light); --p-popover-shadow:-1px 0px 20px var(--p-shadow-from-ambient-light), 0px 1px 5px var(--p-shadow-from-direct-light); --p-modal-shadow:0px 26px 80px var(--p-shadow-from-dim-light), 0px 0px 1px var(--p-shadow-from-dim-light); --p-top-bar-shadow:0 2px 2px -1px var(--p-shadow-from-direct-light); --p-button-drop-shadow:0 1px 0 rgba(0, 0, 0, 0.05); --p-button-inner-shadow:inset 0 -1px 0 rgba(0, 0, 0, 0.2); --p-button-pressed-inner-shadow:inset 0 1px 0 rgba(0, 0, 0, 0.15); --p-override-none:none; --p-override-transparent:transparent; --p-override-one:1; --p-override-visible:visible; --p-override-zero:0; --p-override-loading-z-index:514; --p-button-font-weight:500; --p-non-null-content:""; --p-choice-size:2rem; --p-icon-size:1rem; --p-choice-margin:0.1rem; --p-control-border-width:0.2rem; --p-banner-border-default:inset 0 0.1rem 0 0 var(--p-border-neutral-subdued), inset 0 0 0 0.1rem var(--p-border-neutral-subdued); --p-banner-border-success:inset 0 0.1rem 0 0 var(--p-border-success-subdued), inset 0 0 0 0.1rem var(--p-border-success-subdued); --p-banner-border-highlight:inset 0 0.1rem 0 0 var(--p-border-highlight-subdued), inset 0 0 0 0.1rem var(--p-border-highlight-subdued); --p-banner-border-warning:inset 0 0.1rem 0 0 var(--p-border-warning-subdued), inset 0 0 0 0.1rem var(--p-border-warning-subdued); --p-banner-border-critical:inset 0 0.1rem 0 0 var(--p-border-critical-subdued), inset 0 0 0 0.1rem var(--p-border-critical-subdued); --p-badge-mix-blend-mode:luminosity; --p-thin-border-subdued:0.1rem solid var(--p-border-subdued); --p-text-field-spinner-offset:0.2rem; --p-text-field-focus-ring-offset:-0.4rem; --p-text-field-focus-ring-border-radius:0.7rem; --p-button-group-item-spacing:-0.1rem; --p-duration-1-0-0:100ms; --p-duration-1-5-0:150ms; --p-ease-in:cubic-bezier(0.5, 0.1, 1, 1); --p-ease:cubic-bezier(0.4, 0.22, 0.28, 1); --p-range-slider-thumb-size-base:1.6rem; --p-range-slider-thumb-size-active:2.4rem; --p-range-slider-thumb-scale:1.5; --p-badge-font-weight:400; --p-frame-offset:0px; color: rgb(227, 229, 231);)
|
80
100
|
end
|
81
101
|
end
|
82
102
|
end
|
@@ -3,11 +3,11 @@ class TypeValidator < ActiveModel::EachValidator
|
|
3
3
|
required_type = options[:with]
|
4
4
|
|
5
5
|
if value.is_a?(Array)
|
6
|
-
unless value.all? { |i| i.
|
6
|
+
unless value.all? { |i| i.instance_of?(required_type) }
|
7
7
|
record.errors.add attribute, (options[:message] || "is not of class #{required_type}")
|
8
8
|
end
|
9
9
|
else
|
10
|
-
unless value.
|
10
|
+
unless value.instance_of?(required_type)
|
11
11
|
record.errors.add attribute, (options[:message] || "is not of class #{required_type}")
|
12
12
|
end
|
13
13
|
end
|
@@ -1,10 +1,10 @@
|
|
1
1
|
# frozen_string_literal: true
|
2
2
|
|
3
|
-
require
|
3
|
+
require "rails/generators/active_record"
|
4
4
|
|
5
5
|
module PolarisViewComponents
|
6
6
|
class InstallGenerator < Rails::Generators::Base
|
7
|
-
source_root File.expand_path(
|
7
|
+
source_root File.expand_path("templates", __dir__)
|
8
8
|
|
9
9
|
def add_npm_package
|
10
10
|
say "Adding NPM package", :green
|
@@ -14,13 +14,13 @@ module PolarisViewComponents
|
|
14
14
|
def add_to_stimulus_controller
|
15
15
|
say "Adding import to to Stimulus controller", :green
|
16
16
|
dir_path = "app/javascript/controllers"
|
17
|
-
empty_directory(
|
17
|
+
empty_directory("app/javascript")
|
18
18
|
empty_directory(dir_path)
|
19
19
|
|
20
20
|
file_path = "#{dir_path}/index.js"
|
21
21
|
|
22
22
|
unless File.exist?(file_path)
|
23
|
-
copy_file
|
23
|
+
copy_file "stimulus_index.js", file_path
|
24
24
|
end
|
25
25
|
|
26
26
|
append_to_file file_path do
|
@@ -29,7 +29,7 @@ module PolarisViewComponents
|
|
29
29
|
end
|
30
30
|
|
31
31
|
def show_readme
|
32
|
-
readme
|
32
|
+
readme "README"
|
33
33
|
end
|
34
34
|
end
|
35
35
|
end
|
@@ -1,5 +1,9 @@
|
|
1
1
|
require "rails/engine"
|
2
|
-
require "view_component
|
2
|
+
require "view_component"
|
3
|
+
require "view_component/version"
|
4
|
+
if ViewComponent::VERSION::MAJOR == 2 && ViewComponent::VERSION::MINOR < 43
|
5
|
+
require "view_component/engine"
|
6
|
+
end
|
3
7
|
|
4
8
|
module Polaris
|
5
9
|
module ViewComponents
|
@@ -11,6 +15,11 @@ module Polaris
|
|
11
15
|
#{root}/app/helpers
|
12
16
|
]
|
13
17
|
|
18
|
+
# Remove default wrapping .field_with_errors for proper Shopify form validations
|
19
|
+
config.to_prepare do
|
20
|
+
ActionView::Base.field_error_proc = ->(html_tag, _instance) { html_tag.html_safe }
|
21
|
+
end
|
22
|
+
|
14
23
|
initializer "polaris_view_components.assets" do |app|
|
15
24
|
if app.config.respond_to?(:assets)
|
16
25
|
app.config.assets.precompile += %w[
|
@@ -19,11 +28,16 @@ module Polaris
|
|
19
28
|
end
|
20
29
|
end
|
21
30
|
|
31
|
+
initializer "polaris_view_components.importmap", before: "importmap" do |app|
|
32
|
+
if app.config.respond_to?(:importmap) && app.config.importmap.has_key?(:cache_sweepers)
|
33
|
+
app.config.importmap.cache_sweepers << Engine.root.join("app/assets/javascripts")
|
34
|
+
end
|
35
|
+
end
|
36
|
+
|
22
37
|
initializer "polaris_view_components.helpers" do
|
23
38
|
ActiveSupport.on_load(:action_controller_base) do
|
24
39
|
helper Polaris::ViewHelper
|
25
40
|
helper Polaris::UrlHelper
|
26
|
-
helper Polaris::ConditionalHelper
|
27
41
|
end
|
28
42
|
end
|
29
43
|
end
|
@@ -1 +1 @@
|
|
1
|
-
require
|
1
|
+
require "polaris/view_components"
|
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.
|
4
|
+
version: 0.8.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:
|
12
|
+
date: 2022-01-26 00:00:00.000000000 Z
|
13
13
|
dependencies:
|
14
14
|
- !ruby/object:Gem::Dependency
|
15
15
|
name: rails
|
@@ -35,22 +35,22 @@ dependencies:
|
|
35
35
|
name: view_component
|
36
36
|
requirement: !ruby/object:Gem::Requirement
|
37
37
|
requirements:
|
38
|
-
- - "~>"
|
39
|
-
- !ruby/object:Gem::Version
|
40
|
-
version: '2.0'
|
41
38
|
- - ">="
|
42
39
|
- !ruby/object:Gem::Version
|
43
40
|
version: 2.0.0
|
41
|
+
- - "<"
|
42
|
+
- !ruby/object:Gem::Version
|
43
|
+
version: '3.0'
|
44
44
|
type: :runtime
|
45
45
|
prerelease: false
|
46
46
|
version_requirements: !ruby/object:Gem::Requirement
|
47
47
|
requirements:
|
48
|
-
- - "~>"
|
49
|
-
- !ruby/object:Gem::Version
|
50
|
-
version: '2.0'
|
51
48
|
- - ">="
|
52
49
|
- !ruby/object:Gem::Version
|
53
50
|
version: 2.0.0
|
51
|
+
- - "<"
|
52
|
+
- !ruby/object:Gem::Version
|
53
|
+
version: '3.0'
|
54
54
|
description:
|
55
55
|
email:
|
56
56
|
- dan@dangamble.co.uk
|
@@ -448,17 +448,39 @@ files:
|
|
448
448
|
- app/assets/icons/polaris/WholesaleMajor.svg
|
449
449
|
- app/assets/icons/polaris/WifiMajor.svg
|
450
450
|
- app/assets/javascripts/polaris_view_components.js
|
451
|
+
- app/assets/javascripts/polaris_view_components/autocomplete_controller.js
|
452
|
+
- app/assets/javascripts/polaris_view_components/button_controller.js
|
453
|
+
- app/assets/javascripts/polaris_view_components/dropzone_controller.js
|
454
|
+
- app/assets/javascripts/polaris_view_components/frame_controller.js
|
451
455
|
- app/assets/javascripts/polaris_view_components/index.js
|
456
|
+
- app/assets/javascripts/polaris_view_components/modal_controller.js
|
457
|
+
- app/assets/javascripts/polaris_view_components/option_list_controller.js
|
458
|
+
- app/assets/javascripts/polaris_view_components/polaris_controller.js
|
459
|
+
- app/assets/javascripts/polaris_view_components/popover_controller.js
|
452
460
|
- app/assets/javascripts/polaris_view_components/resource_item_controller.js
|
461
|
+
- app/assets/javascripts/polaris_view_components/scrollable_controller.js
|
453
462
|
- app/assets/javascripts/polaris_view_components/select_controller.js
|
454
463
|
- app/assets/javascripts/polaris_view_components/text_field_controller.js
|
464
|
+
- app/assets/javascripts/polaris_view_components/toast_controller.js
|
465
|
+
- app/assets/javascripts/polaris_view_components/utils.js
|
455
466
|
- app/assets/stylesheets/polaris_view_components.css
|
456
467
|
- app/assets/stylesheets/polaris_view_components.postcss.css
|
457
468
|
- app/assets/stylesheets/polaris_view_components/custom.css
|
458
469
|
- app/assets/stylesheets/polaris_view_components/shopify_navigation.css
|
459
470
|
- app/assets/stylesheets/polaris_view_components/spacer_component.css
|
460
471
|
- app/components/polaris/action.rb
|
461
|
-
- app/components/polaris/
|
472
|
+
- app/components/polaris/action_list/item_component.html.erb
|
473
|
+
- app/components/polaris/action_list/item_component.rb
|
474
|
+
- app/components/polaris/action_list/section_component.html.erb
|
475
|
+
- app/components/polaris/action_list/section_component.rb
|
476
|
+
- app/components/polaris/action_list_component.html.erb
|
477
|
+
- app/components/polaris/action_list_component.rb
|
478
|
+
- app/components/polaris/autocomplete/action_component.rb
|
479
|
+
- app/components/polaris/autocomplete/option_component.rb
|
480
|
+
- app/components/polaris/autocomplete/section_component.html.erb
|
481
|
+
- app/components/polaris/autocomplete/section_component.rb
|
482
|
+
- app/components/polaris/autocomplete_component.html.erb
|
483
|
+
- app/components/polaris/autocomplete_component.rb
|
462
484
|
- app/components/polaris/avatar_component.html.erb
|
463
485
|
- app/components/polaris/avatar_component.rb
|
464
486
|
- app/components/polaris/badge_component.html.erb
|
@@ -466,7 +488,9 @@ files:
|
|
466
488
|
- app/components/polaris/banner_component.html.erb
|
467
489
|
- app/components/polaris/banner_component.rb
|
468
490
|
- app/components/polaris/base_button.rb
|
491
|
+
- app/components/polaris/base_checkbox.rb
|
469
492
|
- app/components/polaris/base_component.rb
|
493
|
+
- app/components/polaris/base_radio_button.rb
|
470
494
|
- app/components/polaris/button_component.html.erb
|
471
495
|
- app/components/polaris/button_component.rb
|
472
496
|
- app/components/polaris/button_group_component.html.erb
|
@@ -496,10 +520,8 @@ files:
|
|
496
520
|
- app/components/polaris/description_list_component.html.erb
|
497
521
|
- app/components/polaris/description_list_component.rb
|
498
522
|
- app/components/polaris/display_text_component.rb
|
499
|
-
- app/components/polaris/
|
500
|
-
- app/components/polaris/
|
501
|
-
- app/components/polaris/dropzone/controller.js
|
502
|
-
- app/components/polaris/dropzone/utils.js
|
523
|
+
- app/components/polaris/dropzone_component.html.erb
|
524
|
+
- app/components/polaris/dropzone_component.rb
|
503
525
|
- app/components/polaris/empty_state_component.html.erb
|
504
526
|
- app/components/polaris/empty_state_component.rb
|
505
527
|
- app/components/polaris/exception_list/item_component.html.erb
|
@@ -515,6 +537,12 @@ files:
|
|
515
537
|
- app/components/polaris/form_layout/item_component.rb
|
516
538
|
- app/components/polaris/form_layout_component.html.erb
|
517
539
|
- app/components/polaris/form_layout_component.rb
|
540
|
+
- app/components/polaris/frame/save_bar_component.html.erb
|
541
|
+
- app/components/polaris/frame/save_bar_component.rb
|
542
|
+
- app/components/polaris/frame/top_bar_component.html.erb
|
543
|
+
- app/components/polaris/frame/top_bar_component.rb
|
544
|
+
- app/components/polaris/frame_component.html.erb
|
545
|
+
- app/components/polaris/frame_component.rb
|
518
546
|
- app/components/polaris/heading_component.rb
|
519
547
|
- app/components/polaris/headless_button.html.erb
|
520
548
|
- app/components/polaris/headless_button.rb
|
@@ -538,13 +566,35 @@ files:
|
|
538
566
|
- app/components/polaris/link_component.rb
|
539
567
|
- app/components/polaris/list_component.html.erb
|
540
568
|
- app/components/polaris/list_component.rb
|
541
|
-
- app/components/polaris/
|
569
|
+
- app/components/polaris/logo.rb
|
570
|
+
- app/components/polaris/modal/section_component.rb
|
571
|
+
- app/components/polaris/modal_component.html.erb
|
572
|
+
- app/components/polaris/modal_component.rb
|
573
|
+
- app/components/polaris/navigation/item_component.html.erb
|
574
|
+
- app/components/polaris/navigation/item_component.rb
|
575
|
+
- app/components/polaris/navigation/section_component.html.erb
|
576
|
+
- app/components/polaris/navigation/section_component.rb
|
577
|
+
- app/components/polaris/navigation_component.html.erb
|
578
|
+
- app/components/polaris/navigation_component.rb
|
579
|
+
- app/components/polaris/option_list/checkbox_component.html.erb
|
580
|
+
- app/components/polaris/option_list/checkbox_component.rb
|
581
|
+
- app/components/polaris/option_list/option_component.rb
|
582
|
+
- app/components/polaris/option_list/radio_button_component.rb
|
583
|
+
- app/components/polaris/option_list/section_component.html.erb
|
584
|
+
- app/components/polaris/option_list/section_component.rb
|
585
|
+
- app/components/polaris/option_list_component.html.erb
|
586
|
+
- app/components/polaris/option_list_component.rb
|
542
587
|
- app/components/polaris/page_actions_component.html.erb
|
543
588
|
- app/components/polaris/page_actions_component.rb
|
544
589
|
- app/components/polaris/page_component.html.erb
|
545
590
|
- app/components/polaris/page_component.rb
|
546
591
|
- app/components/polaris/pagination_component.html.erb
|
547
592
|
- app/components/polaris/pagination_component.rb
|
593
|
+
- app/components/polaris/popover/pane_component.html.erb
|
594
|
+
- app/components/polaris/popover/pane_component.rb
|
595
|
+
- app/components/polaris/popover/section_component.rb
|
596
|
+
- app/components/polaris/popover_component.html.erb
|
597
|
+
- app/components/polaris/popover_component.rb
|
548
598
|
- app/components/polaris/progress_bar_component.html.erb
|
549
599
|
- app/components/polaris/progress_bar_component.rb
|
550
600
|
- app/components/polaris/radio_button_component.html.erb
|
@@ -553,8 +603,12 @@ files:
|
|
553
603
|
- app/components/polaris/resource_item_component.rb
|
554
604
|
- app/components/polaris/resource_list_component.html.erb
|
555
605
|
- app/components/polaris/resource_list_component.rb
|
606
|
+
- app/components/polaris/scrollable_component.html.erb
|
607
|
+
- app/components/polaris/scrollable_component.rb
|
556
608
|
- app/components/polaris/select_component.html.erb
|
557
609
|
- app/components/polaris/select_component.rb
|
610
|
+
- app/components/polaris/setting_toggle_component.html.erb
|
611
|
+
- app/components/polaris/setting_toggle_component.rb
|
558
612
|
- app/components/polaris/shopify_navigation_component.html.erb
|
559
613
|
- app/components/polaris/shopify_navigation_component.rb
|
560
614
|
- app/components/polaris/skeleton_body_text_component.html.erb
|
@@ -562,9 +616,14 @@ files:
|
|
562
616
|
- app/components/polaris/spacer_component.rb
|
563
617
|
- app/components/polaris/spinner_component.html.erb
|
564
618
|
- app/components/polaris/spinner_component.rb
|
619
|
+
- app/components/polaris/stack/item_component.rb
|
565
620
|
- app/components/polaris/stack_component.html.erb
|
566
621
|
- app/components/polaris/stack_component.rb
|
567
622
|
- app/components/polaris/subheading_component.rb
|
623
|
+
- app/components/polaris/tabs/tab_component.html.erb
|
624
|
+
- app/components/polaris/tabs/tab_component.rb
|
625
|
+
- app/components/polaris/tabs_component.html.erb
|
626
|
+
- app/components/polaris/tabs_component.rb
|
568
627
|
- app/components/polaris/tag_component.html.erb
|
569
628
|
- app/components/polaris/tag_component.rb
|
570
629
|
- app/components/polaris/text_container_component.rb
|
@@ -573,15 +632,19 @@ files:
|
|
573
632
|
- app/components/polaris/text_style_component.rb
|
574
633
|
- app/components/polaris/thumbnail_component.html.erb
|
575
634
|
- app/components/polaris/thumbnail_component.rb
|
635
|
+
- app/components/polaris/toast_component.html.erb
|
636
|
+
- app/components/polaris/toast_component.rb
|
637
|
+
- app/components/polaris/top_bar/user_menu_component.html.erb
|
638
|
+
- app/components/polaris/top_bar/user_menu_component.rb
|
576
639
|
- app/components/polaris/visually_hidden_component.rb
|
577
640
|
- app/helpers/polaris/class_name_helper.rb
|
578
|
-
- app/helpers/polaris/conditional_helper.rb
|
579
641
|
- app/helpers/polaris/fetch_or_fallback_helper.rb
|
580
642
|
- app/helpers/polaris/form_builder.rb
|
581
643
|
- app/helpers/polaris/option_helper.rb
|
582
644
|
- app/helpers/polaris/url_helper.rb
|
583
645
|
- app/helpers/polaris/view_helper.rb
|
584
646
|
- app/validators/type_validator.rb
|
647
|
+
- config/locales/en.yml
|
585
648
|
- lib/generators/polaris_view_components/USAGE
|
586
649
|
- lib/generators/polaris_view_components/install_generator.rb
|
587
650
|
- lib/generators/polaris_view_components/templates/README
|
@@ -610,7 +673,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
|
|
610
673
|
- !ruby/object:Gem::Version
|
611
674
|
version: '0'
|
612
675
|
requirements: []
|
613
|
-
rubygems_version: 3.2.
|
676
|
+
rubygems_version: 3.2.32
|
614
677
|
signing_key:
|
615
678
|
specification_version: 4
|
616
679
|
summary: ViewComponents for Polaris Design System
|
@@ -1,35 +0,0 @@
|
|
1
|
-
class Polaris::ApplicationComponent < ViewComponent::Base
|
2
|
-
include ActiveModel::Validations
|
3
|
-
|
4
|
-
def initialize(data: {}, aria: {}, html_options: {}, **args)
|
5
|
-
@data = data
|
6
|
-
@aria = aria
|
7
|
-
@html_options = html_options
|
8
|
-
end
|
9
|
-
|
10
|
-
private
|
11
|
-
|
12
|
-
def classes
|
13
|
-
[]
|
14
|
-
end
|
15
|
-
|
16
|
-
def additional_data
|
17
|
-
{}
|
18
|
-
end
|
19
|
-
|
20
|
-
def additional_aria
|
21
|
-
{}
|
22
|
-
end
|
23
|
-
|
24
|
-
def content_tag_options
|
25
|
-
{
|
26
|
-
class: classes.compact,
|
27
|
-
data: @data.merge(additional_data),
|
28
|
-
aria: @aria.merge(additional_aria)
|
29
|
-
}.merge(@html_options)
|
30
|
-
end
|
31
|
-
|
32
|
-
def before_render
|
33
|
-
validate!
|
34
|
-
end
|
35
|
-
end
|
@@ -1,72 +0,0 @@
|
|
1
|
-
<%= render Polaris::Labelled::Component.new(**labelled_attrs) do %>
|
2
|
-
<%= content_tag('div', content_tag_options) do %>
|
3
|
-
<div
|
4
|
-
class="Polaris-DropZone__Overlay Polaris-VisuallyHidden"
|
5
|
-
data-polaris--dropzone-target="overlay"
|
6
|
-
>
|
7
|
-
<%= polaris_stack(vertical: true, spacing: :tight) do |stack| %>
|
8
|
-
<% stack.item do %>
|
9
|
-
<%= polaris_icon(color: :primary) do %>
|
10
|
-
<svg viewBox="0 0 20 20" class="Polaris-Icon__Svg" focusable="false" aria-hidden="true">
|
11
|
-
<path d="M2 2h1V0H1.5A1.5 1.5 0 000 1.5V3h2V2zM5 2h3V0H5v2zM13 2h-3V0h3v2zM0 5v3h2V5H0zM0 10v3h2v-3H0zM18 5h-2v3h2V5zM5 18h3v-2H5v2zM0 17a1 1 0 001 1h2v-2H2v-1H0v2zM16 3V2h-1V0h1.5A1.5 1.5 0 0118 1.5V3h-2z" />
|
12
|
-
|
13
|
-
<path d="M10.814 14H5.5A1.5 1.5 0 014 12.5v-7A1.5 1.5 0 015.5 4h7A1.5 1.5 0 0114 5.5v5.314l5.512 2.506a.832.832 0 01.028 1.501l-2.898 1.45a.832.832 0 00-.372.371l-1.449 2.898a.832.832 0 01-1.501-.028L10.814 14zm-.909-2l-.828-1.821c-.318-.7.402-1.42 1.102-1.102L12 9.905V6H6v6h3.905z" />
|
14
|
-
</svg>
|
15
|
-
<% end %>
|
16
|
-
<% end %>
|
17
|
-
|
18
|
-
<% stack.item do %>
|
19
|
-
<%= polaris_display_text(size: :small) do %>
|
20
|
-
<%= @overlay_text %>
|
21
|
-
<% end %>
|
22
|
-
<% end %>
|
23
|
-
<% end %>
|
24
|
-
</div>
|
25
|
-
|
26
|
-
<div class="Polaris-DropZone__Container" data-polaris--dropzone-target="container">
|
27
|
-
<div class="Polaris-DropZone-FileUpload" data-polaris--dropzone-target="fileUpload">
|
28
|
-
<%= polaris_stack(vertical: true) do |stack| %>
|
29
|
-
<% stack.item do %>
|
30
|
-
<img width="40" src="data:image/svg+xml,%3csvg fill='none' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill-rule='evenodd' clip-rule='evenodd' d='M20 10a10 10 0 11-20 0 10 10 0 0120 0zM5.3 8.3l4-4a1 1 0 011.4 0l4 4a1 1 0 01-1.4 1.4L11 7.4V15a1 1 0 11-2 0V7.4L6.7 9.7a1 1 0 01-1.4-1.4z' fill='%235C5F62'/%3e%3c/svg%3e" alt="">
|
31
|
-
<% end %>
|
32
|
-
|
33
|
-
<% stack.item do %>
|
34
|
-
<div class="Polaris-DropZone-FileUpload__Button">Add file</div>
|
35
|
-
<% end %>
|
36
|
-
|
37
|
-
<% stack.item do %>
|
38
|
-
<%= polaris_text_style(variation: :subdued) do %>
|
39
|
-
or drop files to upload
|
40
|
-
<% end %>
|
41
|
-
<% end %>
|
42
|
-
<% end %>
|
43
|
-
</div>
|
44
|
-
</div>
|
45
|
-
|
46
|
-
<%= polaris_visually_hidden do %>
|
47
|
-
<%= @form.file_field(@attribute, input_attrs) %>
|
48
|
-
<% end %>
|
49
|
-
|
50
|
-
<template data-polaris--dropzone-target="itemsTemplate">
|
51
|
-
<%= polaris_stack(vertical: true, data: { rendered: '' }) do %>
|
52
|
-
<span class="target"></span>
|
53
|
-
<% end %>
|
54
|
-
</template>
|
55
|
-
|
56
|
-
<template data-polaris--dropzone-target="itemTemplate">
|
57
|
-
<div class="Polaris-Stack__Item">
|
58
|
-
<%= polaris_stack(alignment: :center) do |stack| %>
|
59
|
-
<% stack.item do %>
|
60
|
-
<%# polaris_thumnail(source: "TODO", size: :small) %>
|
61
|
-
<% end %>
|
62
|
-
|
63
|
-
<% stack.item do %>
|
64
|
-
<div class="content">
|
65
|
-
<%= polaris_caption_component { "TODO" } %>
|
66
|
-
</div>
|
67
|
-
<% end %>
|
68
|
-
<% end %>
|
69
|
-
</div>
|
70
|
-
</template>
|
71
|
-
<% end %>
|
72
|
-
<% end %>
|