ariadne_view_components 0.0.17 → 0.0.19

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (33) hide show
  1. checksums.yaml +4 -4
  2. data/README.md +3 -0
  3. data/app/assets/builds/ariadne_view_components.css +20 -132
  4. data/app/assets/javascripts/ariadne_view_components.js +2 -2
  5. data/app/assets/javascripts/ariadne_view_components.js.map +1 -1
  6. data/app/assets/javascripts/rich-text-area-component.d.ts +2 -0
  7. data/app/components/ariadne/base_button.rb +2 -2
  8. data/app/components/ariadne/comment_component.html.erb +31 -37
  9. data/app/components/ariadne/comment_component.rb +9 -7
  10. data/app/components/ariadne/component.rb +4 -0
  11. data/app/components/ariadne/inline_flex_component.rb +2 -2
  12. data/app/components/ariadne/panel_bar_component.html.erb +1 -1
  13. data/app/components/ariadne/panel_bar_component.rb +1 -0
  14. data/app/components/ariadne/rich-text-area-component.d.ts +2 -0
  15. data/app/components/ariadne/rich-text-area-component.js +18 -9
  16. data/app/components/ariadne/rich-text-area-component.ts +23 -10
  17. data/app/components/ariadne/rich_text_area_component.html.erb +1 -1
  18. data/app/components/ariadne/slideover-component.js +0 -10
  19. data/app/components/ariadne/slideover-component.ts +0 -9
  20. data/app/components/ariadne/slideover_component.html.erb +6 -8
  21. data/app/components/ariadne/slideover_component.rb +9 -24
  22. data/app/components/ariadne/tab_component.rb +0 -1
  23. data/app/components/ariadne/tab_container_component.erb +2 -4
  24. data/app/components/ariadne/tab_container_component.rb +2 -1
  25. data/app/lib/ariadne/action_view_extensions/form_helper.rb +1 -1
  26. data/lib/ariadne/view_components/version.rb +1 -1
  27. data/static/arguments.yml +2 -6
  28. data/static/classes.yml +7 -13
  29. data/static/constants.json +10 -10
  30. metadata +2 -5
  31. data/app/components/ariadne/comment-component.d.ts +0 -0
  32. data/app/components/ariadne/comment-component.js +0 -33
  33. data/app/components/ariadne/comment-component.ts +0 -37
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: 91eb9f9dfa1c7b164a7e92014a94a979686e4e0b509839faf6f97d886df4b510
4
- data.tar.gz: 8db04adcc66584b7989a0c11016013e74a104effb5ca80c3bf7ae415bc1f244d
3
+ metadata.gz: 86da0c102743056c33b3982a59957000a992846a6240ebc26581ebcf0ac3dec9
4
+ data.tar.gz: a2083d05faeea010c894a23cbdeb225b07f334dc69b2c09f603d673bc3a04cb5
5
5
  SHA512:
6
- metadata.gz: a86f44423e1a4b441f4f242743434cb15bff839fc7ece26e3984e06d892512c2f460c518105df4cf71f0e02ff5bce8a3f5caede03225cf596ae1dbd26cdc4330
7
- data.tar.gz: 509582278f44cb39ef35bb81fdd85a2028700fcef624bbf1dfa6e1921d3c345d635ceadb65ae9049df4236256b393c68ea6806590c31bc4318e495a01787d68c
6
+ metadata.gz: 51eb0c7020d56ae225c6cfc3f155cb3a02c92d8ce87c7b5e563dc5623031bbe958ffe45d9fcb537ac3cdec63f80428baebad1a5fbf32ffea8ce1731ecbd7d3ae
7
+ data.tar.gz: c18933f3a37b3dea63de4b896f14a7a1066515b2e06a782041c092d175dc5220c91c6d31d83a9c980affd6cd6ce4d2d879465e2cc78c8a21c75b61aea8e1fb66
data/README.md CHANGED
@@ -34,6 +34,9 @@ DEFAULT_CLASSES = "bg-yellow-400"
34
34
 
35
35
  document schemes, fetch_or_raise, all that
36
36
 
37
+ ## remove @tailwind base;
38
+
39
+ this resets styles applied by ariadne, which already resets styles!!
37
40
  ### Incorporating Rubocop and other linters
38
41
 
39
42
  This gem comes with some standard linters to keep your code fresh and consistent. Refer to [the documentation](./docs/content/linting.md) for more information.
@@ -765,10 +765,6 @@ select {
765
765
  z-index: 50;
766
766
  }
767
767
 
768
- .ariadne-m-5 {
769
- margin: 1.25rem;
770
- }
771
-
772
768
  .ariadne-m-10 {
773
769
  margin: 2.5rem;
774
770
  }
@@ -851,10 +847,6 @@ select {
851
847
  margin-left: 1rem;
852
848
  }
853
849
 
854
- .ariadne-mt-1 {
855
- margin-top: 0.25rem;
856
- }
857
-
858
850
  .ariadne-block {
859
851
  display: block;
860
852
  }
@@ -899,18 +891,10 @@ select {
899
891
  height: 100%;
900
892
  }
901
893
 
902
- .ariadne-h-4 {
903
- height: 1rem;
904
- }
905
-
906
894
  .ariadne-w-56 {
907
895
  width: 14rem;
908
896
  }
909
897
 
910
- .ariadne-w-full {
911
- width: 100%;
912
- }
913
-
914
898
  .ariadne-w-0 {
915
899
  width: 0px;
916
900
  }
@@ -923,6 +907,10 @@ select {
923
907
  width: 1.25rem;
924
908
  }
925
909
 
910
+ .ariadne-w-full {
911
+ width: 100%;
912
+ }
913
+
926
914
  .ariadne-w-14 {
927
915
  width: 3.5rem;
928
916
  }
@@ -935,10 +923,6 @@ select {
935
923
  width: 60%;
936
924
  }
937
925
 
938
- .ariadne-w-4 {
939
- width: 1rem;
940
- }
941
-
942
926
  .ariadne-min-w-full {
943
927
  min-width: 100%;
944
928
  }
@@ -951,10 +935,6 @@ select {
951
935
  max-width: 20rem;
952
936
  }
953
937
 
954
- .ariadne-max-w-2xl {
955
- max-width: 42rem;
956
- }
957
-
958
938
  .ariadne-flex-1 {
959
939
  flex: 1 1 0%;
960
940
  }
@@ -983,20 +963,10 @@ select {
983
963
  cursor: pointer;
984
964
  }
985
965
 
986
- .ariadne-resize-none {
987
- resize: none;
988
- }
989
-
990
966
  .ariadne-list-none {
991
967
  list-style-type: none;
992
968
  }
993
969
 
994
- .ariadne-appearance-none {
995
- -webkit-appearance: none;
996
- -moz-appearance: none;
997
- appearance: none;
998
- }
999
-
1000
970
  .ariadne-flex-col {
1001
971
  flex-direction: column;
1002
972
  }
@@ -1042,12 +1012,6 @@ select {
1042
1012
  margin-bottom: calc(2rem * var(--tw-space-y-reverse));
1043
1013
  }
1044
1014
 
1045
- .ariadne-space-y-6 > :not([hidden]) ~ :not([hidden]) {
1046
- --tw-space-y-reverse: 0;
1047
- margin-top: calc(1.5rem * calc(1 - var(--tw-space-y-reverse)));
1048
- margin-bottom: calc(1.5rem * var(--tw-space-y-reverse));
1049
- }
1050
-
1051
1015
  .ariadne-divide-y > :not([hidden]) ~ :not([hidden]) {
1052
1016
  --tw-divide-y-reverse: 0;
1053
1017
  border-top-width: calc(1px * calc(1 - var(--tw-divide-y-reverse)));
@@ -1060,11 +1024,6 @@ select {
1060
1024
  border-left-width: calc(1px * calc(1 - var(--tw-divide-x-reverse)));
1061
1025
  }
1062
1026
 
1063
- .ariadne-divide-gray-200 > :not([hidden]) ~ :not([hidden]) {
1064
- --tw-divide-opacity: 1;
1065
- border-color: rgb(229 231 235 / var(--tw-divide-opacity));
1066
- }
1067
-
1068
1027
  .ariadne-divide-gray-100 > :not([hidden]) ~ :not([hidden]) {
1069
1028
  --tw-divide-opacity: 1;
1070
1029
  border-color: rgb(243 244 246 / var(--tw-divide-opacity));
@@ -1075,6 +1034,11 @@ select {
1075
1034
  border-color: rgb(209 213 219 / var(--tw-divide-opacity));
1076
1035
  }
1077
1036
 
1037
+ .ariadne-divide-gray-200 > :not([hidden]) ~ :not([hidden]) {
1038
+ --tw-divide-opacity: 1;
1039
+ border-color: rgb(229 231 235 / var(--tw-divide-opacity));
1040
+ }
1041
+
1078
1042
  .ariadne-overflow-hidden {
1079
1043
  overflow: hidden;
1080
1044
  }
@@ -1117,15 +1081,6 @@ select {
1117
1081
  border-width: 1px;
1118
1082
  }
1119
1083
 
1120
- .ariadne-border-x {
1121
- border-left-width: 1px;
1122
- border-right-width: 1px;
1123
- }
1124
-
1125
- .ariadne-border-b {
1126
- border-bottom-width: 1px;
1127
- }
1128
-
1129
1084
  .ariadne-border-b-2 {
1130
1085
  border-bottom-width: 2px;
1131
1086
  }
@@ -1168,11 +1123,6 @@ select {
1168
1123
  border-color: rgb(209 213 219 / var(--tw-border-opacity));
1169
1124
  }
1170
1125
 
1171
- .ariadne-border-gray-200 {
1172
- --tw-border-opacity: 1;
1173
- border-color: rgb(229 231 235 / var(--tw-border-opacity));
1174
- }
1175
-
1176
1126
  .ariadne-border-indigo-500 {
1177
1127
  --tw-border-opacity: 1;
1178
1128
  border-color: rgb(99 102 241 / var(--tw-border-opacity));
@@ -1218,6 +1168,11 @@ select {
1218
1168
  background-color: rgb(15 23 42 / var(--tw-bg-opacity));
1219
1169
  }
1220
1170
 
1171
+ .ariadne-bg-neutral-50 {
1172
+ --tw-bg-opacity: 1;
1173
+ background-color: rgb(250 250 250 / var(--tw-bg-opacity));
1174
+ }
1175
+
1221
1176
  .ariadne-bg-gray-50 {
1222
1177
  --tw-bg-opacity: 1;
1223
1178
  background-color: rgb(249 250 251 / var(--tw-bg-opacity));
@@ -1252,8 +1207,8 @@ select {
1252
1207
  padding: 0.375rem;
1253
1208
  }
1254
1209
 
1255
- .ariadne-p-0 {
1256
- padding: 0px;
1210
+ .ariadne-p-3 {
1211
+ padding: 0.75rem;
1257
1212
  }
1258
1213
 
1259
1214
  .ariadne-p-8 {
@@ -1340,10 +1295,6 @@ select {
1340
1295
  padding-bottom: 0.875rem;
1341
1296
  }
1342
1297
 
1343
- .ariadne-pt-2 {
1344
- padding-top: 0.5rem;
1345
- }
1346
-
1347
1298
  .ariadne-pl-3 {
1348
1299
  padding-left: 0.75rem;
1349
1300
  }
@@ -1364,6 +1315,10 @@ select {
1364
1315
  padding-top: 1.5rem;
1365
1316
  }
1366
1317
 
1318
+ .ariadne-pt-4 {
1319
+ padding-top: 1rem;
1320
+ }
1321
+
1367
1322
  .ariadne-pb-2 {
1368
1323
  padding-bottom: 0.5rem;
1369
1324
  }
@@ -1376,14 +1331,6 @@ select {
1376
1331
  padding-right: 0.75rem;
1377
1332
  }
1378
1333
 
1379
- .ariadne-pt-4 {
1380
- padding-top: 1rem;
1381
- }
1382
-
1383
- .ariadne-pt-8 {
1384
- padding-top: 2rem;
1385
- }
1386
-
1387
1334
  .ariadne-text-left {
1388
1335
  text-align: left;
1389
1336
  }
@@ -1463,10 +1410,6 @@ select {
1463
1410
  line-height: 1.25rem;
1464
1411
  }
1465
1412
 
1466
- .ariadne-leading-6 {
1467
- line-height: 1.5rem;
1468
- }
1469
-
1470
1413
  .ariadne-tracking-tight {
1471
1414
  letter-spacing: -0.025em;
1472
1415
  }
@@ -1606,16 +1549,6 @@ select {
1606
1549
  -moz-osx-font-smoothing: grayscale;
1607
1550
  }
1608
1551
 
1609
- .ariadne-placeholder-gray-400::-moz-placeholder {
1610
- --tw-placeholder-opacity: 1;
1611
- color: rgb(156 163 175 / var(--tw-placeholder-opacity));
1612
- }
1613
-
1614
- .ariadne-placeholder-gray-400::placeholder {
1615
- --tw-placeholder-opacity: 1;
1616
- color: rgb(156 163 175 / var(--tw-placeholder-opacity));
1617
- }
1618
-
1619
1552
  .ariadne-shadow-sm {
1620
1553
  --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
1621
1554
  --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
@@ -2082,22 +2015,6 @@ li.ProseMirror-selectednode:after {
2082
2015
  display: none;
2083
2016
  }
2084
2017
 
2085
- .focus-within\:ariadne-border-indigo-500:focus-within {
2086
- --tw-border-opacity: 1;
2087
- border-color: rgb(99 102 241 / var(--tw-border-opacity));
2088
- }
2089
-
2090
- .focus-within\:ariadne-ring-1:focus-within {
2091
- --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
2092
- --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
2093
- box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
2094
- }
2095
-
2096
- .focus-within\:ariadne-ring-indigo-500:focus-within {
2097
- --tw-ring-opacity: 1;
2098
- --tw-ring-color: rgb(99 102 241 / var(--tw-ring-opacity));
2099
- }
2100
-
2101
2018
  .hover\:ariadne-border-gray-300:hover {
2102
2019
  --tw-border-opacity: 1;
2103
2020
  border-color: rgb(209 213 219 / var(--tw-border-opacity));
@@ -2157,11 +2074,6 @@ li.ProseMirror-selectednode:after {
2157
2074
  z-index: 20;
2158
2075
  }
2159
2076
 
2160
- .focus\:ariadne-border-indigo-500:focus {
2161
- --tw-border-opacity: 1;
2162
- border-color: rgb(99 102 241 / var(--tw-border-opacity));
2163
- }
2164
-
2165
2077
  .focus\:ariadne-outline-none:focus {
2166
2078
  outline: 2px solid transparent;
2167
2079
  outline-offset: 2px;
@@ -2173,12 +2085,6 @@ li.ProseMirror-selectednode:after {
2173
2085
  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
2174
2086
  }
2175
2087
 
2176
- .focus\:ariadne-ring-0:focus {
2177
- --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
2178
- --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color);
2179
- box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
2180
- }
2181
-
2182
2088
  .focus\:ariadne-ring-purple-500:focus {
2183
2089
  --tw-ring-opacity: 1;
2184
2090
  --tw-ring-color: rgb(168 85 247 / var(--tw-ring-opacity));
@@ -2209,11 +2115,6 @@ li.ProseMirror-selectednode:after {
2209
2115
  --tw-ring-color: rgb(220 38 38 / var(--tw-ring-opacity));
2210
2116
  }
2211
2117
 
2212
- .focus\:ariadne-ring-indigo-500:focus {
2213
- --tw-ring-opacity: 1;
2214
- --tw-ring-color: rgb(99 102 241 / var(--tw-ring-opacity));
2215
- }
2216
-
2217
2118
  .focus\:ariadne-ring-offset-2:focus {
2218
2119
  --tw-ring-offset-width: 2px;
2219
2120
  }
@@ -2247,10 +2148,6 @@ li.ProseMirror-selectednode:after {
2247
2148
  margin-top: 0px;
2248
2149
  }
2249
2150
 
2250
- .sm\:ariadne-block {
2251
- display: block;
2252
- }
2253
-
2254
2151
  .sm\:ariadne-grid-cols-2 {
2255
2152
  grid-template-columns: repeat(2, minmax(0, 1fr));
2256
2153
  }
@@ -2270,10 +2167,6 @@ li.ProseMirror-selectednode:after {
2270
2167
  padding-left: 1.5rem;
2271
2168
  }
2272
2169
 
2273
- .sm\:ariadne-pt-10 {
2274
- padding-top: 2.5rem;
2275
- }
2276
-
2277
2170
  .sm\:ariadne-text-4xl {
2278
2171
  font-size: 2.25rem;
2279
2172
  line-height: 2.5rem;
@@ -2283,11 +2176,6 @@ li.ProseMirror-selectednode:after {
2283
2176
  font-size: 1.875rem;
2284
2177
  line-height: 2.25rem;
2285
2178
  }
2286
-
2287
- .sm\:ariadne-text-sm {
2288
- font-size: 0.875rem;
2289
- line-height: 1.25rem;
2290
- }
2291
2179
  }
2292
2180
 
2293
2181
  @media (min-width: 768px) {