@pingux/astro 2.151.0-alpha.5 → 2.151.1-alpha.0

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 (29) hide show
  1. package/lib/cjs/components/CodeView/CodeView.js +14 -10
  2. package/lib/cjs/components/CodeView/CodeView.stories.d.ts +1 -0
  3. package/lib/cjs/components/CodeView/CodeView.stories.js +17 -1
  4. package/lib/cjs/components/CodeView/CodeView.styles.d.ts +79 -77
  5. package/lib/cjs/components/CodeView/CodeView.styles.js +5 -3
  6. package/lib/cjs/components/CopyText/CopyButton.js +9 -3
  7. package/lib/cjs/styles/themeOverrides/nextGenDarkMode/colors.d.ts +10 -0
  8. package/lib/cjs/styles/themeOverrides/nextGenDarkMode/colors.js +13 -1
  9. package/lib/cjs/styles/themes/next-gen/codeView/codeView.d.ts +252 -92
  10. package/lib/cjs/styles/themes/next-gen/codeView/codeView.js +104 -15
  11. package/lib/cjs/styles/themes/next-gen/colors/colors.d.ts +5 -0
  12. package/lib/cjs/styles/themes/next-gen/colors/colors.js +5 -0
  13. package/lib/cjs/styles/themes/next-gen/convertedComponentList.d.ts +1 -0
  14. package/lib/cjs/styles/themes/next-gen/convertedComponentList.js +1 -0
  15. package/lib/cjs/styles/themes/next-gen/next-gen.d.ts +496 -180
  16. package/lib/cjs/styles/themes/next-gen/tokens/colorTokens.d.ts +1 -0
  17. package/lib/cjs/styles/themes/next-gen/tokens/colorTokens.js +2 -1
  18. package/lib/cjs/styles/themes/next-gen/variants/button.d.ts +13 -4
  19. package/lib/cjs/styles/themes/next-gen/variants/variants.d.ts +239 -88
  20. package/lib/components/CodeView/CodeView.js +14 -10
  21. package/lib/components/CodeView/CodeView.stories.js +15 -0
  22. package/lib/components/CodeView/CodeView.styles.js +5 -3
  23. package/lib/components/CopyText/CopyButton.js +9 -3
  24. package/lib/styles/themeOverrides/nextGenDarkMode/colors.js +13 -1
  25. package/lib/styles/themes/next-gen/codeView/codeView.js +104 -15
  26. package/lib/styles/themes/next-gen/colors/colors.js +5 -0
  27. package/lib/styles/themes/next-gen/convertedComponentList.js +1 -0
  28. package/lib/styles/themes/next-gen/tokens/colorTokens.js +2 -1
  29. package/package.json +1 -1
@@ -87,6 +87,10 @@ declare const _default: {
87
87
  };
88
88
  };
89
89
  tooltip: string;
90
+ codeEditor: {
91
+ backgroundColor: string;
92
+ headerColor: string;
93
+ };
90
94
  twoTone: {
91
95
  bg: {
92
96
  orange: string;
@@ -251,6 +255,7 @@ declare const _default: {
251
255
  light: string;
252
256
  link: string;
253
257
  label: string;
258
+ reverse: string;
254
259
  };
255
260
  active_hover: string;
256
261
  active_pressed: string;
@@ -1353,11 +1358,20 @@ declare const _default: {
1353
1358
  boxShadow: string;
1354
1359
  };
1355
1360
  copyButton: {
1356
- mx: string;
1357
- path: {
1358
- fill: string;
1361
+ default: {
1362
+ mx: string;
1363
+ path: {
1364
+ fill: string;
1365
+ };
1366
+ border: string;
1367
+ };
1368
+ light: {
1369
+ mx: string;
1370
+ path: {
1371
+ fill: string;
1372
+ };
1373
+ border: string;
1359
1374
  };
1360
- border: string;
1361
1375
  };
1362
1376
  deleteAttachment: {
1363
1377
  backgroundColor: string;
@@ -3754,116 +3768,267 @@ declare const _default: {
3754
3768
  };
3755
3769
  };
3756
3770
  codeView: {
3757
- theme: {
3758
- plain: {
3759
- color: string;
3760
- backgroundColor: string;
3761
- };
3762
- styles: ({
3763
- types: string[];
3764
- style: {
3771
+ default: {
3772
+ theme: {
3773
+ plain: {
3765
3774
  color: string;
3766
- background?: undefined;
3767
- fontWeight?: undefined;
3768
- cursor?: undefined;
3775
+ backgroundColor: string;
3769
3776
  };
3770
- } | {
3771
- types: string[];
3772
- style: {
3773
- color: string;
3774
- background: string;
3775
- fontWeight?: undefined;
3776
- cursor?: undefined;
3777
+ styles: ({
3778
+ types: string[];
3779
+ style: {
3780
+ color: string;
3781
+ background?: undefined;
3782
+ fontWeight?: undefined;
3783
+ cursor?: undefined;
3784
+ };
3785
+ } | {
3786
+ types: string[];
3787
+ style: {
3788
+ color: string;
3789
+ background: string;
3790
+ fontWeight?: undefined;
3791
+ cursor?: undefined;
3792
+ };
3793
+ } | {
3794
+ types: string[];
3795
+ style: {
3796
+ fontWeight: string;
3797
+ color?: undefined;
3798
+ background?: undefined;
3799
+ cursor?: undefined;
3800
+ };
3801
+ } | {
3802
+ types: string[];
3803
+ style: {
3804
+ cursor: string;
3805
+ color?: undefined;
3806
+ background?: undefined;
3807
+ fontWeight?: undefined;
3808
+ };
3809
+ })[];
3810
+ };
3811
+ wrapper: {
3812
+ backgroundColor: string;
3813
+ border: string;
3814
+ borderColor: string;
3815
+ borderRadius: string;
3816
+ width: number;
3817
+ height: number;
3818
+ my: string;
3819
+ overflow: string;
3820
+ alignItems: string;
3821
+ '&.is-focused, &:focus': {
3822
+ boxShadow: string;
3823
+ outline: string;
3777
3824
  };
3778
- } | {
3779
- types: string[];
3780
- style: {
3781
- fontWeight: string;
3782
- color?: undefined;
3783
- background?: undefined;
3784
- cursor?: undefined;
3825
+ pre: {
3826
+ backgroundColor: string;
3827
+ padding: string;
3828
+ height: string;
3829
+ width: string;
3830
+ overflowX: string;
3831
+ overflowY: string;
3832
+ fontSize: string;
3833
+ '& .token-line': {
3834
+ display: string;
3835
+ alignItems: string;
3836
+ '& .token': {
3837
+ whiteSpace: string;
3838
+ wordBreak: string;
3839
+ };
3840
+ };
3841
+ fontFamily: string;
3842
+ lineHeight: string;
3785
3843
  };
3786
- } | {
3787
- types: string[];
3788
- style: {
3789
- cursor: string;
3790
- color?: undefined;
3791
- background?: undefined;
3792
- fontWeight?: undefined;
3844
+ '&.has-no-copy-button': {
3845
+ pre: {
3846
+ p: string;
3847
+ };
3793
3848
  };
3794
- })[];
3795
- };
3796
- wrapper: {
3797
- backgroundColor: string;
3798
- border: string;
3799
- borderColor: string;
3800
- borderRadius: string;
3801
- width: number;
3802
- height: number;
3803
- my: string;
3804
- overflow: string;
3805
- alignItems: string;
3806
- '&.is-focused, &:focus': {
3807
- boxShadow: string;
3808
- outline: string;
3849
+ '&.has-line-numbers': {
3850
+ pre: {
3851
+ p: string;
3852
+ overflow: string;
3853
+ '& .token-line:first-of-type *': {
3854
+ pt: string;
3855
+ };
3856
+ '& .token-line': {
3857
+ display: string;
3858
+ '& .token': {
3859
+ whiteSpace: string;
3860
+ };
3861
+ };
3862
+ };
3863
+ };
3864
+ };
3865
+ lineNo: {
3866
+ display: string;
3867
+ userSelect: string;
3868
+ px: string;
3869
+ m: string;
3870
+ bg: string;
3871
+ minWidth: number;
3872
+ color: string;
3873
+ lineHeight: string;
3874
+ backgroundColor: string;
3809
3875
  };
3810
- pre: {
3876
+ header: {
3811
3877
  backgroundColor: string;
3812
- padding: string;
3813
- height: string;
3878
+ color: string;
3879
+ px: string;
3814
3880
  width: string;
3815
- overflowX: string;
3816
- overflowY: string;
3817
- fontSize: string;
3818
- '& .token-line': {
3819
- display: string;
3820
- alignItems: string;
3821
- '& .token': {
3822
- whiteSpace: string;
3823
- wordBreak: string;
3881
+ borderBottom: string;
3882
+ borderBottomColor: string;
3883
+ lineHeight: string;
3884
+ };
3885
+ copyButton: {
3886
+ default: {
3887
+ mx: string;
3888
+ path: {
3889
+ fill: string;
3824
3890
  };
3891
+ border: string;
3892
+ };
3893
+ light: {
3894
+ mx: string;
3895
+ path: {
3896
+ fill: string;
3897
+ };
3898
+ border: string;
3825
3899
  };
3826
- fontFamily: string;
3827
- lineHeight: string;
3828
3900
  };
3829
- '&.has-no-copy-button': {
3830
- pre: {
3831
- p: string;
3901
+ };
3902
+ light: {
3903
+ theme: {
3904
+ styles: ({
3905
+ types: string[];
3906
+ style: {
3907
+ color: string;
3908
+ background?: undefined;
3909
+ fontWeight?: undefined;
3910
+ cursor?: undefined;
3911
+ };
3912
+ } | {
3913
+ types: string[];
3914
+ style: {
3915
+ color: string;
3916
+ background: string;
3917
+ fontWeight?: undefined;
3918
+ cursor?: undefined;
3919
+ };
3920
+ } | {
3921
+ types: string[];
3922
+ style: {
3923
+ fontWeight: string;
3924
+ color?: undefined;
3925
+ background?: undefined;
3926
+ cursor?: undefined;
3927
+ };
3928
+ } | {
3929
+ types: string[];
3930
+ style: {
3931
+ cursor: string;
3932
+ color?: undefined;
3933
+ background?: undefined;
3934
+ fontWeight?: undefined;
3935
+ };
3936
+ })[];
3937
+ plain: {
3938
+ color: string;
3939
+ backgroundColor: string;
3832
3940
  };
3833
3941
  };
3834
- '&.has-line-numbers': {
3942
+ wrapper: {
3943
+ backgroundColor: string;
3944
+ borderColor: string;
3945
+ border: string;
3946
+ borderRadius: string;
3947
+ width: number;
3948
+ height: number;
3949
+ my: string;
3950
+ overflow: string;
3951
+ alignItems: string;
3952
+ '&.is-focused, &:focus': {
3953
+ boxShadow: string;
3954
+ outline: string;
3955
+ };
3835
3956
  pre: {
3836
- p: string;
3837
- overflow: string;
3838
- '& .token-line:first-of-type *': {
3839
- pt: string;
3840
- };
3957
+ backgroundColor: string;
3958
+ padding: string;
3959
+ height: string;
3960
+ width: string;
3961
+ overflowX: string;
3962
+ overflowY: string;
3963
+ fontSize: string;
3841
3964
  '& .token-line': {
3842
3965
  display: string;
3966
+ alignItems: string;
3843
3967
  '& .token': {
3844
3968
  whiteSpace: string;
3969
+ wordBreak: string;
3970
+ };
3971
+ };
3972
+ fontFamily: string;
3973
+ lineHeight: string;
3974
+ };
3975
+ '&.has-no-copy-button': {
3976
+ pre: {
3977
+ p: string;
3978
+ };
3979
+ };
3980
+ '&.has-line-numbers': {
3981
+ pre: {
3982
+ p: string;
3983
+ overflow: string;
3984
+ '& .token-line:first-of-type *': {
3985
+ pt: string;
3986
+ };
3987
+ '& .token-line': {
3988
+ display: string;
3989
+ '& .token': {
3990
+ whiteSpace: string;
3991
+ };
3845
3992
  };
3846
3993
  };
3847
3994
  };
3848
3995
  };
3849
- };
3850
- lineNo: {
3851
- display: string;
3852
- userSelect: string;
3853
- px: string;
3854
- m: string;
3855
- bg: string;
3856
- minWidth: number;
3857
- color: string;
3858
- lineHeight: string;
3859
- };
3860
- header: {
3861
- color: string;
3862
- px: string;
3863
- width: string;
3864
- border: string;
3865
- borderColor: string;
3866
- lineHeight: string;
3996
+ header: {
3997
+ backgroundColor: string;
3998
+ borderBottomColor: string;
3999
+ color: string;
4000
+ px: string;
4001
+ width: string;
4002
+ borderBottom: string;
4003
+ lineHeight: string;
4004
+ };
4005
+ lineNo: {
4006
+ display: string;
4007
+ userSelect: string;
4008
+ px: string;
4009
+ m: string;
4010
+ bg: string;
4011
+ minWidth: number;
4012
+ color: string;
4013
+ lineHeight: string;
4014
+ backgroundColor: string;
4015
+ };
4016
+ copyButton: {
4017
+ default: {
4018
+ mx: string;
4019
+ path: {
4020
+ fill: string;
4021
+ };
4022
+ border: string;
4023
+ };
4024
+ light: {
4025
+ mx: string;
4026
+ path: {
4027
+ fill: string;
4028
+ };
4029
+ border: string;
4030
+ };
4031
+ };
3867
4032
  };
3868
4033
  };
3869
4034
  dataTable: {
@@ -5140,116 +5305,267 @@ declare const _default: {
5140
5305
  };
5141
5306
  overrides: {
5142
5307
  codeView: {
5143
- theme: {
5144
- plain: {
5145
- color: string;
5146
- backgroundColor: string;
5147
- };
5148
- styles: ({
5149
- types: string[];
5150
- style: {
5308
+ default: {
5309
+ theme: {
5310
+ plain: {
5151
5311
  color: string;
5152
- background?: undefined;
5153
- fontWeight?: undefined;
5154
- cursor?: undefined;
5312
+ backgroundColor: string;
5155
5313
  };
5156
- } | {
5157
- types: string[];
5158
- style: {
5159
- color: string;
5160
- background: string;
5161
- fontWeight?: undefined;
5162
- cursor?: undefined;
5314
+ styles: ({
5315
+ types: string[];
5316
+ style: {
5317
+ color: string;
5318
+ background?: undefined;
5319
+ fontWeight?: undefined;
5320
+ cursor?: undefined;
5321
+ };
5322
+ } | {
5323
+ types: string[];
5324
+ style: {
5325
+ color: string;
5326
+ background: string;
5327
+ fontWeight?: undefined;
5328
+ cursor?: undefined;
5329
+ };
5330
+ } | {
5331
+ types: string[];
5332
+ style: {
5333
+ fontWeight: string;
5334
+ color?: undefined;
5335
+ background?: undefined;
5336
+ cursor?: undefined;
5337
+ };
5338
+ } | {
5339
+ types: string[];
5340
+ style: {
5341
+ cursor: string;
5342
+ color?: undefined;
5343
+ background?: undefined;
5344
+ fontWeight?: undefined;
5345
+ };
5346
+ })[];
5347
+ };
5348
+ wrapper: {
5349
+ backgroundColor: string;
5350
+ border: string;
5351
+ borderColor: string;
5352
+ borderRadius: string;
5353
+ width: number;
5354
+ height: number;
5355
+ my: string;
5356
+ overflow: string;
5357
+ alignItems: string;
5358
+ '&.is-focused, &:focus': {
5359
+ boxShadow: string;
5360
+ outline: string;
5163
5361
  };
5164
- } | {
5165
- types: string[];
5166
- style: {
5167
- fontWeight: string;
5168
- color?: undefined;
5169
- background?: undefined;
5170
- cursor?: undefined;
5362
+ pre: {
5363
+ backgroundColor: string;
5364
+ padding: string;
5365
+ height: string;
5366
+ width: string;
5367
+ overflowX: string;
5368
+ overflowY: string;
5369
+ fontSize: string;
5370
+ '& .token-line': {
5371
+ display: string;
5372
+ alignItems: string;
5373
+ '& .token': {
5374
+ whiteSpace: string;
5375
+ wordBreak: string;
5376
+ };
5377
+ };
5378
+ fontFamily: string;
5379
+ lineHeight: string;
5171
5380
  };
5172
- } | {
5173
- types: string[];
5174
- style: {
5175
- cursor: string;
5176
- color?: undefined;
5177
- background?: undefined;
5178
- fontWeight?: undefined;
5381
+ '&.has-no-copy-button': {
5382
+ pre: {
5383
+ p: string;
5384
+ };
5385
+ };
5386
+ '&.has-line-numbers': {
5387
+ pre: {
5388
+ p: string;
5389
+ overflow: string;
5390
+ '& .token-line:first-of-type *': {
5391
+ pt: string;
5392
+ };
5393
+ '& .token-line': {
5394
+ display: string;
5395
+ '& .token': {
5396
+ whiteSpace: string;
5397
+ };
5398
+ };
5399
+ };
5179
5400
  };
5180
- })[];
5181
- };
5182
- wrapper: {
5183
- backgroundColor: string;
5184
- border: string;
5185
- borderColor: string;
5186
- borderRadius: string;
5187
- width: number;
5188
- height: number;
5189
- my: string;
5190
- overflow: string;
5191
- alignItems: string;
5192
- '&.is-focused, &:focus': {
5193
- boxShadow: string;
5194
- outline: string;
5195
5401
  };
5196
- pre: {
5402
+ lineNo: {
5403
+ display: string;
5404
+ userSelect: string;
5405
+ px: string;
5406
+ m: string;
5407
+ bg: string;
5408
+ minWidth: number;
5409
+ color: string;
5410
+ lineHeight: string;
5197
5411
  backgroundColor: string;
5198
- padding: string;
5199
- height: string;
5412
+ };
5413
+ header: {
5414
+ backgroundColor: string;
5415
+ color: string;
5416
+ px: string;
5200
5417
  width: string;
5201
- overflowX: string;
5202
- overflowY: string;
5203
- fontSize: string;
5204
- '& .token-line': {
5205
- display: string;
5206
- alignItems: string;
5207
- '& .token': {
5208
- whiteSpace: string;
5209
- wordBreak: string;
5418
+ borderBottom: string;
5419
+ borderBottomColor: string;
5420
+ lineHeight: string;
5421
+ };
5422
+ copyButton: {
5423
+ default: {
5424
+ mx: string;
5425
+ path: {
5426
+ fill: string;
5210
5427
  };
5428
+ border: string;
5429
+ };
5430
+ light: {
5431
+ mx: string;
5432
+ path: {
5433
+ fill: string;
5434
+ };
5435
+ border: string;
5211
5436
  };
5212
- fontFamily: string;
5213
- lineHeight: string;
5214
5437
  };
5215
- '&.has-no-copy-button': {
5216
- pre: {
5217
- p: string;
5438
+ };
5439
+ light: {
5440
+ theme: {
5441
+ styles: ({
5442
+ types: string[];
5443
+ style: {
5444
+ color: string;
5445
+ background?: undefined;
5446
+ fontWeight?: undefined;
5447
+ cursor?: undefined;
5448
+ };
5449
+ } | {
5450
+ types: string[];
5451
+ style: {
5452
+ color: string;
5453
+ background: string;
5454
+ fontWeight?: undefined;
5455
+ cursor?: undefined;
5456
+ };
5457
+ } | {
5458
+ types: string[];
5459
+ style: {
5460
+ fontWeight: string;
5461
+ color?: undefined;
5462
+ background?: undefined;
5463
+ cursor?: undefined;
5464
+ };
5465
+ } | {
5466
+ types: string[];
5467
+ style: {
5468
+ cursor: string;
5469
+ color?: undefined;
5470
+ background?: undefined;
5471
+ fontWeight?: undefined;
5472
+ };
5473
+ })[];
5474
+ plain: {
5475
+ color: string;
5476
+ backgroundColor: string;
5218
5477
  };
5219
5478
  };
5220
- '&.has-line-numbers': {
5479
+ wrapper: {
5480
+ backgroundColor: string;
5481
+ borderColor: string;
5482
+ border: string;
5483
+ borderRadius: string;
5484
+ width: number;
5485
+ height: number;
5486
+ my: string;
5487
+ overflow: string;
5488
+ alignItems: string;
5489
+ '&.is-focused, &:focus': {
5490
+ boxShadow: string;
5491
+ outline: string;
5492
+ };
5221
5493
  pre: {
5222
- p: string;
5223
- overflow: string;
5224
- '& .token-line:first-of-type *': {
5225
- pt: string;
5226
- };
5494
+ backgroundColor: string;
5495
+ padding: string;
5496
+ height: string;
5497
+ width: string;
5498
+ overflowX: string;
5499
+ overflowY: string;
5500
+ fontSize: string;
5227
5501
  '& .token-line': {
5228
5502
  display: string;
5503
+ alignItems: string;
5229
5504
  '& .token': {
5230
5505
  whiteSpace: string;
5506
+ wordBreak: string;
5507
+ };
5508
+ };
5509
+ fontFamily: string;
5510
+ lineHeight: string;
5511
+ };
5512
+ '&.has-no-copy-button': {
5513
+ pre: {
5514
+ p: string;
5515
+ };
5516
+ };
5517
+ '&.has-line-numbers': {
5518
+ pre: {
5519
+ p: string;
5520
+ overflow: string;
5521
+ '& .token-line:first-of-type *': {
5522
+ pt: string;
5523
+ };
5524
+ '& .token-line': {
5525
+ display: string;
5526
+ '& .token': {
5527
+ whiteSpace: string;
5528
+ };
5231
5529
  };
5232
5530
  };
5233
5531
  };
5234
5532
  };
5235
- };
5236
- lineNo: {
5237
- display: string;
5238
- userSelect: string;
5239
- px: string;
5240
- m: string;
5241
- bg: string;
5242
- minWidth: number;
5243
- color: string;
5244
- lineHeight: string;
5245
- };
5246
- header: {
5247
- color: string;
5248
- px: string;
5249
- width: string;
5250
- border: string;
5251
- borderColor: string;
5252
- lineHeight: string;
5533
+ header: {
5534
+ backgroundColor: string;
5535
+ borderBottomColor: string;
5536
+ color: string;
5537
+ px: string;
5538
+ width: string;
5539
+ borderBottom: string;
5540
+ lineHeight: string;
5541
+ };
5542
+ lineNo: {
5543
+ display: string;
5544
+ userSelect: string;
5545
+ px: string;
5546
+ m: string;
5547
+ bg: string;
5548
+ minWidth: number;
5549
+ color: string;
5550
+ lineHeight: string;
5551
+ backgroundColor: string;
5552
+ };
5553
+ copyButton: {
5554
+ default: {
5555
+ mx: string;
5556
+ path: {
5557
+ fill: string;
5558
+ };
5559
+ border: string;
5560
+ };
5561
+ light: {
5562
+ mx: string;
5563
+ path: {
5564
+ fill: string;
5565
+ };
5566
+ border: string;
5567
+ };
5568
+ };
5253
5569
  };
5254
5570
  };
5255
5571
  };