@kompasid/lit-web-components 0.9.41 → 0.9.43

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 (34) hide show
  1. package/demo/header.html +3 -3
  2. package/demo/paywall.html +17 -20
  3. package/dist/src/components/kompasid-header-account/KompasHeaderAccount.d.ts +3 -7
  4. package/dist/src/components/kompasid-header-account/KompasHeaderAccount.js +9 -29
  5. package/dist/src/components/kompasid-header-account/KompasHeaderAccount.js.map +1 -1
  6. package/dist/src/components/kompasid-header-account-menu/KompasHeaderAccountMenu.d.ts +3 -15
  7. package/dist/src/components/kompasid-header-account-menu/KompasHeaderAccountMenu.js +9 -30
  8. package/dist/src/components/kompasid-header-account-menu/KompasHeaderAccountMenu.js.map +1 -1
  9. package/dist/src/components/kompasid-header-account-profile/KompasHeaderAccountProfile.d.ts +0 -1
  10. package/dist/src/components/kompasid-header-account-profile/KompasHeaderAccountProfile.js +0 -4
  11. package/dist/src/components/kompasid-header-account-profile/KompasHeaderAccountProfile.js.map +1 -1
  12. package/dist/src/components/kompasid-paywall/KompasPaywall.js +11 -11
  13. package/dist/src/components/kompasid-paywall/KompasPaywall.js.map +1 -1
  14. package/dist/src/components/kompasid-paywall/types.d.ts +4 -0
  15. package/dist/src/components/kompasid-paywall/types.js.map +1 -1
  16. package/dist/src/components/kompasid-paywall-body/KompasPaywallBody.d.ts +2 -2
  17. package/dist/src/components/kompasid-paywall-body/KompasPaywallBody.js +187 -159
  18. package/dist/src/components/kompasid-paywall-body/KompasPaywallBody.js.map +1 -1
  19. package/dist/tailwind/tailwind.js +78 -91
  20. package/dist/tailwind/tailwind.js.map +1 -1
  21. package/dist/tsconfig.tsbuildinfo +1 -1
  22. package/package.json +1 -1
  23. package/src/components/kompasid-header-account/KompasHeaderAccount.ts +6 -14
  24. package/src/components/kompasid-header-account/readme.md +29 -7
  25. package/src/components/kompasid-header-account-menu/KompasHeaderAccountMenu.ts +8 -24
  26. package/src/components/kompasid-header-account-profile/KompasHeaderAccountProfile.ts +0 -1
  27. package/src/components/kompasid-paywall/KompasPaywall.ts +11 -11
  28. package/src/components/kompasid-paywall/readme.md +74 -352
  29. package/src/components/kompasid-paywall/types.ts +4 -0
  30. package/src/components/kompasid-paywall-body/KompasPaywallBody.ts +210 -199
  31. package/src/components/kompasid-paywall-body/readme.md +3 -0
  32. package/tailwind/tailwind.css +78 -91
  33. package/tailwind/tailwind.ts +78 -91
  34. package/tailwind.config.js +1 -1
@@ -586,6 +586,10 @@ video {
586
586
  bottom: -1.5rem;
587
587
  }
588
588
 
589
+ .-top-1\.5 {
590
+ top: -0.375rem;
591
+ }
592
+
589
593
  .-top-2 {
590
594
  top: -0.5rem;
591
595
  }
@@ -602,6 +606,10 @@ video {
602
606
  left: 0px;
603
607
  }
604
608
 
609
+ .left-2\.5 {
610
+ left: 0.625rem;
611
+ }
612
+
605
613
  .left-4 {
606
614
  left: 1rem;
607
615
  }
@@ -755,10 +763,6 @@ video {
755
763
  margin-bottom: 2rem;
756
764
  }
757
765
 
758
- .ml-0\.5 {
759
- margin-left: 0.125rem;
760
- }
761
-
762
766
  .ml-1 {
763
767
  margin-left: 0.25rem;
764
768
  }
@@ -803,10 +807,6 @@ video {
803
807
  margin-right: 0.75rem;
804
808
  }
805
809
 
806
- .mr-3\.5 {
807
- margin-right: 0.875rem;
808
- }
809
-
810
810
  .mr-4 {
811
811
  margin-right: 1rem;
812
812
  }
@@ -831,10 +831,6 @@ video {
831
831
  margin-top: 0.5rem;
832
832
  }
833
833
 
834
- .mt-2\.5 {
835
- margin-top: 0.625rem;
836
- }
837
-
838
834
  .mt-3 {
839
835
  margin-top: 0.75rem;
840
836
  }
@@ -843,8 +839,8 @@ video {
843
839
  margin-top: 1rem;
844
840
  }
845
841
 
846
- .mt-6 {
847
- margin-top: 1.5rem;
842
+ .mt-5 {
843
+ margin-top: 1.25rem;
848
844
  }
849
845
 
850
846
  .mt-8 {
@@ -935,10 +931,6 @@ video {
935
931
  height: 68px;
936
932
  }
937
933
 
938
- .h-\[76px\] {
939
- height: 76px;
940
- }
941
-
942
934
  .h-auto {
943
935
  height: auto;
944
936
  }
@@ -964,6 +956,14 @@ video {
964
956
  max-height: 116px;
965
957
  }
966
958
 
959
+ .min-h-\[68px\] {
960
+ min-height: 68px;
961
+ }
962
+
963
+ .min-h-\[76px\] {
964
+ min-height: 76px;
965
+ }
966
+
967
967
  .w-1\/2 {
968
968
  width: 50%;
969
969
  }
@@ -976,10 +976,6 @@ video {
976
976
  width: 25%;
977
977
  }
978
978
 
979
- .w-1\/5 {
980
- width: 20%;
981
- }
982
-
983
979
  .w-10 {
984
980
  width: 2.5rem;
985
981
  }
@@ -1133,10 +1129,6 @@ video {
1133
1129
  max-width: 20rem;
1134
1130
  }
1135
1131
 
1136
- .flex-none {
1137
- flex: none;
1138
- }
1139
-
1140
1132
  .flex-shrink-0 {
1141
1133
  flex-shrink: 0;
1142
1134
  }
@@ -1307,12 +1299,6 @@ video {
1307
1299
  row-gap: 1rem;
1308
1300
  }
1309
1301
 
1310
- .space-x-1 > :not([hidden]) ~ :not([hidden]) {
1311
- --tw-space-x-reverse: 0;
1312
- margin-right: calc(0.25rem * var(--tw-space-x-reverse));
1313
- margin-left: calc(0.25rem * calc(1 - var(--tw-space-x-reverse)));
1314
- }
1315
-
1316
1302
  .space-x-2 > :not([hidden]) ~ :not([hidden]) {
1317
1303
  --tw-space-x-reverse: 0;
1318
1304
  margin-right: calc(0.5rem * var(--tw-space-x-reverse));
@@ -1353,10 +1339,6 @@ video {
1353
1339
  align-self: center;
1354
1340
  }
1355
1341
 
1356
- .overflow-hidden {
1357
- overflow: hidden;
1358
- }
1359
-
1360
1342
  .overflow-y-auto {
1361
1343
  overflow-y: auto;
1362
1344
  }
@@ -1482,7 +1464,7 @@ video {
1482
1464
 
1483
1465
  .border-grey-100 {
1484
1466
  --tw-border-opacity: 1;
1485
- border-color: rgb(255 255 255 / var(--tw-border-opacity, 1));
1467
+ border-color: rgb(244 244 244 / var(--tw-border-opacity, 1));
1486
1468
  }
1487
1469
 
1488
1470
  .border-grey-200 {
@@ -1591,7 +1573,7 @@ video {
1591
1573
 
1592
1574
  .bg-grey-100 {
1593
1575
  --tw-bg-opacity: 1;
1594
- background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
1576
+ background-color: rgb(244 244 244 / var(--tw-bg-opacity, 1));
1595
1577
  }
1596
1578
 
1597
1579
  .bg-grey-200 {
@@ -1604,6 +1586,11 @@ video {
1604
1586
  background-color: rgb(221 221 221 / var(--tw-bg-opacity, 1));
1605
1587
  }
1606
1588
 
1589
+ .bg-grey-500 {
1590
+ --tw-bg-opacity: 1;
1591
+ background-color: rgb(102 102 102 / var(--tw-bg-opacity, 1));
1592
+ }
1593
+
1607
1594
  .bg-grey-600 {
1608
1595
  --tw-bg-opacity: 1;
1609
1596
  background-color: rgb(51 51 51 / var(--tw-bg-opacity, 1));
@@ -1842,10 +1829,6 @@ video {
1842
1829
  padding-top: 0px;
1843
1830
  }
1844
1831
 
1845
- .pt-0\.5 {
1846
- padding-top: 0.125rem;
1847
- }
1848
-
1849
1832
  .pt-1 {
1850
1833
  padding-top: 0.25rem;
1851
1834
  }
@@ -2073,7 +2056,7 @@ video {
2073
2056
 
2074
2057
  .text-grey-100 {
2075
2058
  --tw-text-opacity: 1;
2076
- color: rgb(255 255 255 / var(--tw-text-opacity, 1));
2059
+ color: rgb(244 244 244 / var(--tw-text-opacity, 1));
2077
2060
  }
2078
2061
 
2079
2062
  .text-grey-300 {
@@ -2111,6 +2094,11 @@ video {
2111
2094
  color: rgb(219 93 0 / var(--tw-text-opacity, 1));
2112
2095
  }
2113
2096
 
2097
+ .text-red-500 {
2098
+ --tw-text-opacity: 1;
2099
+ color: rgb(208 13 18 / var(--tw-text-opacity, 1));
2100
+ }
2101
+
2114
2102
  .text-red-600 {
2115
2103
  --tw-text-opacity: 1;
2116
2104
  color: rgb(174 9 27 / var(--tw-text-opacity, 1));
@@ -2125,6 +2113,10 @@ video {
2125
2113
  text-decoration-line: underline;
2126
2114
  }
2127
2115
 
2116
+ .line-through {
2117
+ text-decoration-line: line-through;
2118
+ }
2119
+
2128
2120
  .no-underline {
2129
2121
  text-decoration-line: none;
2130
2122
  }
@@ -2224,11 +2216,6 @@ video {
2224
2216
  margin-right: 0px;
2225
2217
  }
2226
2218
 
2227
- .md\:my-3 {
2228
- margin-top: 0.75rem;
2229
- margin-bottom: 0.75rem;
2230
- }
2231
-
2232
2219
  .md\:my-8 {
2233
2220
  margin-top: 2rem;
2234
2221
  margin-bottom: 2rem;
@@ -2247,18 +2234,14 @@ video {
2247
2234
  margin-bottom: 1.25rem;
2248
2235
  }
2249
2236
 
2250
- .md\:ml-1 {
2251
- margin-left: 0.25rem;
2237
+ .md\:ml-2 {
2238
+ margin-left: 0.5rem;
2252
2239
  }
2253
2240
 
2254
2241
  .md\:ml-6 {
2255
2242
  margin-left: 1.5rem;
2256
2243
  }
2257
2244
 
2258
- .md\:mr-5 {
2259
- margin-right: 1.25rem;
2260
- }
2261
-
2262
2245
  .md\:mr-6 {
2263
2246
  margin-right: 1.5rem;
2264
2247
  }
@@ -2267,10 +2250,6 @@ video {
2267
2250
  margin-top: 0.5rem;
2268
2251
  }
2269
2252
 
2270
- .md\:mt-2\.5 {
2271
- margin-top: 0.625rem;
2272
- }
2273
-
2274
2253
  .md\:mt-3 {
2275
2254
  margin-top: 0.75rem;
2276
2255
  }
@@ -2279,8 +2258,12 @@ video {
2279
2258
  margin-top: 1rem;
2280
2259
  }
2281
2260
 
2282
- .md\:mt-8 {
2283
- margin-top: 2rem;
2261
+ .md\:mt-5 {
2262
+ margin-top: 1.25rem;
2263
+ }
2264
+
2265
+ .md\:mt-7 {
2266
+ margin-top: 1.75rem;
2284
2267
  }
2285
2268
 
2286
2269
  .md\:block {
@@ -2303,15 +2286,6 @@ video {
2303
2286
  height: 1.25rem;
2304
2287
  }
2305
2288
 
2306
- .md\:h-\[68px\] {
2307
- height: 68px;
2308
- }
2309
-
2310
- .md\:h-max {
2311
- height: -moz-max-content;
2312
- height: max-content;
2313
- }
2314
-
2315
2289
  .md\:max-h-\[220px\] {
2316
2290
  max-height: 220px;
2317
2291
  }
@@ -2320,6 +2294,10 @@ video {
2320
2294
  min-height: 244px;
2321
2295
  }
2322
2296
 
2297
+ .md\:min-h-\[68px\] {
2298
+ min-height: 68px;
2299
+ }
2300
+
2323
2301
  .md\:w-1\/2 {
2324
2302
  width: 50%;
2325
2303
  }
@@ -2332,6 +2310,10 @@ video {
2332
2310
  width: 10rem;
2333
2311
  }
2334
2312
 
2313
+ .md\:w-5 {
2314
+ width: 1.25rem;
2315
+ }
2316
+
2335
2317
  .md\:w-5\/12 {
2336
2318
  width: 41.666667%;
2337
2319
  }
@@ -2376,8 +2358,8 @@ video {
2376
2358
  max-width: 200px;
2377
2359
  }
2378
2360
 
2379
- .md\:max-w-\[464px\] {
2380
- max-width: 464px;
2361
+ .md\:max-w-\[492px\] {
2362
+ max-width: 492px;
2381
2363
  }
2382
2364
 
2383
2365
  .md\:max-w-\[737px\] {
@@ -2424,20 +2406,16 @@ video {
2424
2406
  justify-content: center;
2425
2407
  }
2426
2408
 
2427
- .md\:gap-8 {
2428
- gap: 2rem;
2409
+ .md\:justify-between {
2410
+ justify-content: space-between;
2429
2411
  }
2430
2412
 
2431
- .md\:space-x-0 > :not([hidden]) ~ :not([hidden]) {
2432
- --tw-space-x-reverse: 0;
2433
- margin-right: calc(0px * var(--tw-space-x-reverse));
2434
- margin-left: calc(0px * calc(1 - var(--tw-space-x-reverse)));
2413
+ .md\:gap-3 {
2414
+ gap: 0.75rem;
2435
2415
  }
2436
2416
 
2437
- .md\:space-x-2 > :not([hidden]) ~ :not([hidden]) {
2438
- --tw-space-x-reverse: 0;
2439
- margin-right: calc(0.5rem * var(--tw-space-x-reverse));
2440
- margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse)));
2417
+ .md\:gap-8 {
2418
+ gap: 2rem;
2441
2419
  }
2442
2420
 
2443
2421
  .md\:space-x-4 > :not([hidden]) ~ :not([hidden]) {
@@ -2458,12 +2436,6 @@ video {
2458
2436
  margin-bottom: calc(0px * var(--tw-space-y-reverse));
2459
2437
  }
2460
2438
 
2461
- .md\:space-y-1 > :not([hidden]) ~ :not([hidden]) {
2462
- --tw-space-y-reverse: 0;
2463
- margin-top: calc(0.25rem * calc(1 - var(--tw-space-y-reverse)));
2464
- margin-bottom: calc(0.25rem * var(--tw-space-y-reverse));
2465
- }
2466
-
2467
2439
  .md\:space-y-4 > :not([hidden]) ~ :not([hidden]) {
2468
2440
  --tw-space-y-reverse: 0;
2469
2441
  margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));
@@ -2495,6 +2467,11 @@ video {
2495
2467
  padding-right: 0px;
2496
2468
  }
2497
2469
 
2470
+ .md\:px-10 {
2471
+ padding-left: 2.5rem;
2472
+ padding-right: 2.5rem;
2473
+ }
2474
+
2498
2475
  .md\:px-20 {
2499
2476
  padding-left: 5rem;
2500
2477
  padding-right: 5rem;
@@ -2556,10 +2533,6 @@ video {
2556
2533
  padding-top: 0.75rem;
2557
2534
  }
2558
2535
 
2559
- .md\:pt-5 {
2560
- padding-top: 1.25rem;
2561
- }
2562
-
2563
2536
  .md\:pt-8 {
2564
2537
  padding-top: 2rem;
2565
2538
  }
@@ -2657,6 +2630,10 @@ video {
2657
2630
  margin-top: 0px;
2658
2631
  }
2659
2632
 
2633
+ .lg\:mt-5 {
2634
+ margin-top: 1.25rem;
2635
+ }
2636
+
2660
2637
  .lg\:block {
2661
2638
  display: block;
2662
2639
  }
@@ -2768,6 +2745,11 @@ video {
2768
2745
  padding-right: 6rem;
2769
2746
  }
2770
2747
 
2748
+ .lg\:px-4 {
2749
+ padding-left: 1rem;
2750
+ padding-right: 1rem;
2751
+ }
2752
+
2771
2753
  .lg\:px-6 {
2772
2754
  padding-left: 1.5rem;
2773
2755
  padding-right: 1.5rem;
@@ -2788,6 +2770,11 @@ video {
2788
2770
  padding-bottom: 0.75rem;
2789
2771
  }
2790
2772
 
2773
+ .lg\:py-5 {
2774
+ padding-top: 1.25rem;
2775
+ padding-bottom: 1.25rem;
2776
+ }
2777
+
2791
2778
  .lg\:py-8 {
2792
2779
  padding-top: 2rem;
2793
2780
  padding-bottom: 2rem;