shopify_app 8.3.2 → 8.4.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (52) hide show
  1. checksums.yaml +4 -4
  2. data/.babelrc +5 -0
  3. data/.github/CODEOWNERS +1 -0
  4. data/.github/probots.yml +2 -0
  5. data/.gitignore +1 -0
  6. data/.nvmrc +1 -0
  7. data/.travis.yml +24 -3
  8. data/CHANGELOG.md +5 -0
  9. data/README.md +1 -0
  10. data/app/assets/images/storage_access.svg +2 -0
  11. data/app/assets/javascripts/shopify_app/enable_cookies.js +3 -0
  12. data/app/assets/javascripts/shopify_app/itp_helper.js +40 -0
  13. data/app/assets/javascripts/shopify_app/partition_cookies.js +7 -0
  14. data/app/assets/javascripts/shopify_app/request_storage_access.js +3 -0
  15. data/app/assets/javascripts/shopify_app/storage_access.js +116 -0
  16. data/app/assets/javascripts/shopify_app/storage_access_redirect.js +17 -0
  17. data/app/assets/javascripts/shopify_app/top_level.js +2 -0
  18. data/app/assets/javascripts/shopify_app/top_level_interaction.js +11 -0
  19. data/app/controllers/shopify_app/callback_controller.rb +92 -0
  20. data/app/controllers/shopify_app/sessions_controller.rb +57 -84
  21. data/app/views/shopify_app/partials/_button_styles.html.erb +104 -0
  22. data/app/views/shopify_app/partials/_card_styles.html.erb +33 -0
  23. data/app/views/shopify_app/partials/_empty_state_styles.html.erb +129 -0
  24. data/app/views/shopify_app/partials/_layout_styles.html.erb +167 -0
  25. data/app/views/shopify_app/partials/_typography_styles.html.erb +35 -0
  26. data/app/views/shopify_app/sessions/enable_cookies.html.erb +7 -334
  27. data/app/views/shopify_app/sessions/request_storage_access.html.erb +67 -0
  28. data/app/views/shopify_app/sessions/top_level_interaction.html.erb +63 -0
  29. data/config/locales/de.yml +10 -0
  30. data/config/locales/en.yml +7 -0
  31. data/config/locales/es.yml +10 -0
  32. data/config/locales/fr.yml +11 -0
  33. data/config/locales/it.yml +11 -0
  34. data/config/locales/ja.yml +8 -0
  35. data/config/locales/pt-BR.yml +10 -0
  36. data/config/routes.rb +10 -1
  37. data/karma.conf.js +43 -0
  38. data/lib/shopify_app.rb +1 -0
  39. data/lib/shopify_app/controller_concerns/itp.rb +45 -0
  40. data/lib/shopify_app/controller_concerns/login_protection.rb +7 -11
  41. data/lib/shopify_app/engine.rb +4 -1
  42. data/lib/shopify_app/utils.rb +1 -1
  43. data/lib/shopify_app/version.rb +1 -1
  44. data/package-lock.json +23 -0
  45. data/package.json +28 -0
  46. data/service.yml +7 -0
  47. data/shipit.rubygems.yml +2 -0
  48. data/shopify_app.gemspec +1 -0
  49. data/webpack.config.js +24 -0
  50. data/yarn.lock +4594 -0
  51. metadata +44 -3
  52. data/app/assets/javascripts/shopify_app/itp_polyfill.js +0 -30
@@ -0,0 +1,104 @@
1
+ <style>
2
+ .Polaris-Button {
3
+ fill:#637381;
4
+ position:relative;
5
+ display:-webkit-inline-box;
6
+ display:-ms-inline-flexbox;
7
+ display:inline-flex;
8
+ -webkit-box-align:center;
9
+ -ms-flex-align:center;
10
+ align-items:center;
11
+ -webkit-box-pack:center;
12
+ -ms-flex-pack:center;
13
+ justify-content:center;
14
+ min-height:3.6rem;
15
+ min-width:3.6rem;
16
+ margin:0;
17
+ padding:0.7rem 1.6rem;
18
+ background:linear-gradient(to bottom, white, #f9fafb);
19
+ border:1px solid #c4cdd5;
20
+ box-shadow:0 1px 0 0 rgba(22, 29, 37, 0.05);
21
+ border-radius:3px;
22
+ line-height:1;
23
+ color:#212b36;
24
+ text-align:center;
25
+ cursor:pointer;
26
+ -webkit-user-select:none;
27
+ -moz-user-select:none;
28
+ -ms-user-select:none;
29
+ user-select:none;
30
+ text-decoration:none;
31
+ transition-property:background, border, box-shadow;
32
+ transition-duration:200ms;
33
+ transition-timing-function:cubic-bezier(0.64, 0, 0.35, 1);
34
+ }
35
+
36
+ .Polaris-Button:hover {
37
+ background:linear-gradient(to bottom, #f9fafb, #f4f6f8);
38
+ border-color:#c4cdd5;
39
+ }
40
+
41
+ .Polaris-Button:focus {
42
+ border-color:#5c6ac4;
43
+ outline:0;
44
+ box-shadow:0 0 0 1px #5c6ac4;
45
+ }
46
+
47
+ .Polaris-Button:active {
48
+ background:linear-gradient(to bottom, #f4f6f8, #f4f6f8);
49
+ border-color:#c4cdd5;
50
+ box-shadow:0 0 0 0 transparent, inset 0 1px 1px 0 rgba(99, 115, 129, 0.1), inset 0 1px 4px 0 rgba(99, 115, 129, 0.2);
51
+ }
52
+
53
+ .Polaris-Button__Content {
54
+ font-size:1.5rem;
55
+ font-weight:400;
56
+ line-height:1.6rem;
57
+ text-transform:initial;
58
+ letter-spacing:initial;
59
+ position:relative;
60
+ display:-webkit-box;
61
+ display:-ms-flexbox;
62
+ display:flex;
63
+ -webkit-box-pack:center;
64
+ -ms-flex-pack:center;
65
+ justify-content:center;
66
+ -webkit-box-align:center;
67
+ -ms-flex-align:center;
68
+ align-items:center;
69
+ min-width:1px;
70
+ min-height:1px;
71
+ }
72
+
73
+ @media (min-width: 40em) {
74
+ .Polaris-Button__Content {
75
+ font-size:1.4rem;
76
+ }
77
+ }
78
+
79
+ .Polaris-Button--primary {
80
+ background:linear-gradient(to bottom, #6371c7, #5563c1);
81
+ border-color:#3f4eae;
82
+ box-shadow:inset 0 1px 0 0 #6774c8, 0 1px 0 0 rgba(22, 29, 37, 0.05), 0 0 0 0 transparent;
83
+ color:white;
84
+ fill:white;
85
+ }
86
+
87
+ .Polaris-Button--primary:hover {
88
+ background:linear-gradient(to bottom, #5c6ac4, #4959bd);
89
+ border-color:#3f4eae;
90
+ color:white;
91
+ text-decoration:none;
92
+ }
93
+
94
+ .Polaris-Button--primary:focus {
95
+ border-color:#202e78;
96
+ box-shadow:inset 0 1px 0 0 #6f7bcb, 0 1px 0 0 rgba(22, 29, 37, 0.05), 0 0 0 1px #202e78;
97
+ }
98
+
99
+ .Polaris-Button--primary:active {
100
+ background:linear-gradient(to bottom, #3f4eae, #3f4eae);
101
+ border-color:#38469b;
102
+ box-shadow:inset 0 0 0 0 transparent, 0 1px 0 0 rgba(22, 29, 37, 0.05), 0 0 1px 0 #38469b;
103
+ }
104
+ </style>
@@ -0,0 +1,33 @@
1
+ <style>
2
+ .Polaris-Card {
3
+ overflow:hidden;
4
+ background-color:white;
5
+ box-shadow:0 0 0 1px rgba(63, 63, 68, 0.05), 0 1px 3px 0 rgba(63, 63, 68, 0.15);
6
+ }
7
+
8
+ .Polaris-Card + .Polaris-Card {
9
+ margin-top:2rem;
10
+ }
11
+
12
+ @media (min-width: 30.625em) {
13
+ .Polaris-Card {
14
+ border-radius:3px;
15
+ }
16
+ }
17
+
18
+ .Polaris-Card__Header {
19
+ padding:2rem 2rem 0;
20
+ }
21
+
22
+ .Polaris-Card__Section {
23
+ padding:2rem;
24
+ }
25
+
26
+ .Polaris-Card__Section + .Polaris-Card__Section {
27
+ border-top:1px solid #dfe3e8;
28
+ }
29
+
30
+ .Polaris-Card__Section--subdued {
31
+ background-color:#f9fafb;
32
+ }
33
+ </style>
@@ -0,0 +1,129 @@
1
+ <style>
2
+ .Polaris-EmptyState {
3
+ display:-webkit-box;
4
+ display:-ms-flexbox;
5
+ display:flex;
6
+ -webkit-box-orient:vertical;
7
+ -webkit-box-direction:normal;
8
+ -ms-flex-direction:column;
9
+ flex-direction:column;
10
+ -webkit-box-align:center;
11
+ -ms-flex-align:center;
12
+ align-items:center;
13
+ width:100%;
14
+ margin:2rem auto 0 auto;
15
+ padding:2rem 0;
16
+ max-width:99.8rem;
17
+ }
18
+
19
+ @media (min-width: 46.5em) {
20
+ .Polaris-EmptyState--imageContained .Polaris-EmptyState__Image {
21
+ position:initial;
22
+ width:100%;
23
+ }
24
+ }
25
+
26
+ .Polaris-EmptyState__Section {
27
+ position:relative;
28
+ display:-webkit-box;
29
+ display:-ms-flexbox;
30
+ display:flex;
31
+ -webkit-box-orient:vertical;
32
+ -webkit-box-direction:normal;
33
+ -ms-flex-direction:column;
34
+ flex-direction:column;
35
+ -webkit-box-flex:1;
36
+ -ms-flex:1 1 auto;
37
+ flex:1 1 auto;
38
+ width:100%;
39
+ }
40
+
41
+ @media (min-width: 46.5em) {
42
+ .Polaris-EmptyState__Section {
43
+ left:2rem;
44
+ -webkit-box-orient:horizontal;
45
+ -webkit-box-direction:normal;
46
+ -ms-flex-direction:row;
47
+ flex-direction:row;
48
+ -webkit-box-align:center;
49
+ -ms-flex-align:center;
50
+ align-items:center;
51
+ }
52
+ }
53
+
54
+ .Polaris-EmptyState__ImageContainer,
55
+ .Polaris-EmptyState__DetailsContainer {
56
+ -webkit-box-flex:1;
57
+ -ms-flex:1 1 auto;
58
+ flex:1 1 auto;
59
+ padding:0;
60
+ margin:0;
61
+ }
62
+
63
+ @media (min-width: 46.5em) {
64
+ .Polaris-EmptyState__ImageContainer,
65
+ .Polaris-EmptyState__DetailsContainer {
66
+ -ms-flex-preferred-size:50%;
67
+ flex-basis:50%;
68
+ }
69
+ }
70
+
71
+ @media (max-width: 30.625em) {
72
+ .Polaris-EmptyState__ImageContainer,
73
+ .Polaris-EmptyState__DetailsContainer {
74
+ overflow-x:hidden;
75
+ }
76
+ }
77
+
78
+ .Polaris-EmptyState__Details {
79
+ position:relative;
80
+ z-index:10;
81
+ padding:0 1.6rem;
82
+ width:33.6rem;
83
+ }
84
+
85
+ @media (min-width: 30.625em) {
86
+ .Polaris-EmptyState__Details {
87
+ padding:0;
88
+ }
89
+ }
90
+
91
+ .Polaris-EmptyState__Content {
92
+ font-size:1.6rem;
93
+ font-weight:400;
94
+ line-height:2.4rem;
95
+ color:#637381;
96
+ }
97
+
98
+ @media (min-width: 40em) {
99
+ .Polaris-EmptyState__Content {
100
+ font-size:2rem;
101
+ line-height:2.8rem;
102
+ }
103
+ }
104
+
105
+ .Polaris-EmptyState__Actions {
106
+ margin-top:1.6rem;
107
+ }
108
+
109
+ .Polaris-EmptyState__Image {
110
+ display: none;
111
+ }
112
+
113
+ @media (min-width: 30.625em) {
114
+ .Polaris-EmptyState__Image {
115
+ display: block;
116
+ margin-left:-60%;
117
+ margin-top:-30%;
118
+ width:200%;
119
+ }
120
+ }
121
+
122
+ @media (min-width: 46.5em) {
123
+ .Polaris-EmptyState__Image {
124
+ margin-top:0;
125
+ margin-left:-90%;
126
+ width:200%;
127
+ }
128
+ }
129
+ </style>
@@ -0,0 +1,167 @@
1
+ <style>
2
+ html,
3
+ body {
4
+ min-height:100%;
5
+ height:100%;
6
+ font-size:1.5rem;
7
+ font-weight:400;
8
+ line-height:2rem;
9
+ text-transform:initial;
10
+ letter-spacing:initial;
11
+ font-weight:400;
12
+ color:#212b36;
13
+ font-family:-apple-system, BlinkMacSystemFont, San Francisco, Roboto, Segoe UI, Helvetica Neue, sans-serif;
14
+ }
15
+
16
+ @media (min-width: 40em) {
17
+ html,
18
+ body {
19
+ font-size:1.4rem;
20
+ }
21
+ }
22
+
23
+ html {
24
+ position:relative;
25
+ font-size:62.5%;
26
+ -webkit-font-smoothing:antialiased;
27
+ -moz-osx-font-smoothing:grayscale;
28
+ -webkit-text-size-adjust:100%;
29
+ -ms-text-size-adjust:100%;
30
+ text-size-adjust:100%;
31
+ text-rendering:optimizeLegibility;
32
+ }
33
+
34
+ body {
35
+ min-height:100%;
36
+ margin:0;
37
+ padding:0;
38
+ background-color:#f4f6f8;
39
+ }
40
+
41
+ *,
42
+ *::before,
43
+ *::after{
44
+ box-sizing:border-box; }
45
+
46
+ h1,
47
+ h2,
48
+ h3,
49
+ h4,
50
+ h5,
51
+ h6,
52
+ p {
53
+ margin:0;
54
+ font-size:1em;
55
+ font-weight:400;
56
+ }
57
+
58
+ .Polaris-Page {
59
+ margin:0 auto;
60
+ padding:0;
61
+ max-width:99.8rem;
62
+ }
63
+
64
+ @media (min-width: 30.625em) {
65
+ .Polaris-Page {
66
+ padding:0 2rem;
67
+ }
68
+ }
69
+ @media (min-width: 46.5em) {
70
+ .Polaris-Page {
71
+ padding:0 3.2rem;
72
+ }
73
+ }
74
+
75
+ .Polaris-Page__Content {
76
+ margin:2rem 0;
77
+ }
78
+
79
+ @media (min-width: 46.5em) {
80
+ .Polaris-Page__Content {
81
+ margin-top:2rem;
82
+ }
83
+ }
84
+
85
+ @media (min-width: 46.5em) {
86
+ .Polaris-Page {
87
+ display: flex;
88
+ justify-content: center;
89
+ align-items: center;
90
+ height: 100vh;
91
+ }
92
+ }
93
+
94
+ .Polaris-Layout {
95
+ display:-webkit-box;
96
+ display:-ms-flexbox;
97
+ display:flex;
98
+ -ms-flex-wrap:wrap;
99
+ flex-wrap:wrap;
100
+ -webkit-box-pack:center;
101
+ -ms-flex-pack:center;
102
+ justify-content:center;
103
+ -webkit-box-align:start;
104
+ -ms-flex-align:start;
105
+ align-items:flex-start;
106
+ margin-top:-2rem;
107
+ margin-left:-2rem;
108
+ }
109
+
110
+ .Polaris-Layout__Section {
111
+ -webkit-box-flex:2;
112
+ -ms-flex:2 2 48rem;
113
+ flex:2 2 48rem;
114
+ min-width:51%;
115
+ }
116
+
117
+ .Polaris-Layout__Section--fullWidth {
118
+ -webkit-box-flex:1;
119
+ -ms-flex:1 1 100%;
120
+ flex:1 1 100%;
121
+ }
122
+
123
+ .Polaris-Layout__Section {
124
+ max-width:calc(100% - 2rem);
125
+ margin-top:2rem;
126
+ margin-left:2rem;
127
+ }
128
+
129
+ .Polaris-Stack {
130
+ margin-top:-1.6rem;
131
+ margin-left:-1.6rem;
132
+ display:-webkit-box;
133
+ display:-ms-flexbox;
134
+ display:flex;
135
+ -ms-flex-wrap:wrap;
136
+ flex-wrap:wrap;
137
+ -webkit-box-align:stretch;
138
+ -ms-flex-align:stretch;
139
+ align-items:stretch;
140
+ }
141
+
142
+ .Polaris-Stack > .Polaris-Stack__Item {
143
+ margin-top:1.6rem;
144
+ margin-left:1.6rem;
145
+ max-width:calc(100% - 1.6rem);
146
+ }
147
+
148
+ .Polaris-Stack__Item {
149
+ -webkit-box-flex:0;
150
+ -ms-flex:0 0 auto;
151
+ flex:0 0 auto;
152
+ min-width:0;
153
+ }
154
+
155
+ .Polaris-Stack--distributionTrailing {
156
+ -webkit-box-pack:end;
157
+ -ms-flex-pack:end;
158
+ justify-content:flex-end;
159
+ }
160
+
161
+ .Polaris-Stack--vertical {
162
+ -webkit-box-orient:vertical;
163
+ -webkit-box-direction:normal;
164
+ -ms-flex-direction:column;
165
+ flex-direction:column;
166
+ }
167
+ </style>
@@ -0,0 +1,35 @@
1
+ <style>
2
+ .Polaris-Heading {
3
+ font-size:1.7rem;
4
+ font-weight:600;
5
+ line-height:2.4rem;
6
+ margin:0;
7
+ }
8
+
9
+ @media (min-width: 40em) {
10
+ .Polaris-Heading {
11
+ font-size:1.6rem;
12
+ }
13
+ }
14
+
15
+ .Polaris-DisplayText {
16
+ margin:0;
17
+ }
18
+
19
+ .Polaris-DisplayText--sizeMedium {
20
+ font-size:2.1rem;
21
+ font-weight:400;
22
+ line-height:2.8rem;
23
+ }
24
+
25
+ @media (min-width: 40em) {
26
+ .Polaris-DisplayText--sizeMedium {
27
+ font-size:2.6rem;
28
+ line-height:3.2rem;
29
+ }
30
+ }
31
+
32
+ .Polaris-TextContainer > * + * {
33
+ margin-top:1.6rem;
34
+ }
35
+ </style>