@cloudscape-design/components-themeable 3.0.951 → 3.0.953
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.
- package/lib/internal/manifest.json +1 -1
- package/lib/internal/scss/button/constants.scss +1 -1
- package/lib/internal/template/app-layout/drawer/overflow-menu.d.ts.map +1 -1
- package/lib/internal/template/app-layout/drawer/overflow-menu.js +5 -4
- package/lib/internal/template/app-layout/drawer/overflow-menu.js.map +1 -1
- package/lib/internal/template/button/interfaces.d.ts +1 -1
- package/lib/internal/template/button/interfaces.js.map +1 -1
- package/lib/internal/template/button/internal.d.ts.map +1 -1
- package/lib/internal/template/button/internal.js +1 -1
- package/lib/internal/template/button/internal.js.map +1 -1
- package/lib/internal/template/button/styles.css.js +22 -22
- package/lib/internal/template/button/styles.scoped.css +70 -70
- package/lib/internal/template/button/styles.selectors.js +22 -22
- package/lib/internal/template/button-group/icon-button-item.d.ts.map +1 -1
- package/lib/internal/template/button-group/icon-button-item.js +1 -1
- package/lib/internal/template/button-group/icon-button-item.js.map +1 -1
- package/lib/internal/template/button-group/icon-toggle-button-item.d.ts.map +1 -1
- package/lib/internal/template/button-group/icon-toggle-button-item.js +1 -1
- package/lib/internal/template/button-group/icon-toggle-button-item.js.map +1 -1
- package/lib/internal/template/button-group/interfaces.d.ts +6 -0
- package/lib/internal/template/button-group/interfaces.d.ts.map +1 -1
- package/lib/internal/template/button-group/interfaces.js.map +1 -1
- package/lib/internal/template/button-group/menu-dropdown-item.d.ts.map +1 -1
- package/lib/internal/template/button-group/menu-dropdown-item.js +1 -1
- package/lib/internal/template/button-group/menu-dropdown-item.js.map +1 -1
- package/lib/internal/template/internal/base-component/styles.scoped.css +30 -0
- package/lib/internal/template/internal/environment.js +1 -1
- package/lib/internal/template/internal/environment.json +1 -1
- package/lib/internal/template/internal/generated/styles/tokens.d.ts +6 -0
- package/lib/internal/template/internal/generated/styles/tokens.js +6 -0
- package/lib/internal/template/internal/generated/theming/index.cjs +115 -1
- package/lib/internal/template/internal/generated/theming/index.cjs.d.ts +48 -0
- package/lib/internal/template/internal/generated/theming/index.d.ts +48 -0
- package/lib/internal/template/internal/generated/theming/index.js +115 -1
- package/lib/internal/template/prompt-input/interfaces.d.ts +1 -0
- package/lib/internal/template/prompt-input/interfaces.d.ts.map +1 -1
- package/lib/internal/template/prompt-input/interfaces.js.map +1 -1
- package/lib/internal/template/prompt-input/internal.d.ts.map +1 -1
- package/lib/internal/template/prompt-input/internal.js +11 -3
- package/lib/internal/template/prompt-input/internal.js.map +1 -1
- package/package.json +1 -1
|
@@ -1113,6 +1113,10 @@ export var preset = {
|
|
|
1113
1113
|
"light": "{colorBlue100}",
|
|
1114
1114
|
"dark": "{colorBlue900}"
|
|
1115
1115
|
},
|
|
1116
|
+
"colorBackgroundDialog": {
|
|
1117
|
+
"light": "{colorBackgroundStatusInfo}",
|
|
1118
|
+
"dark": "{colorBackgroundStatusInfo}"
|
|
1119
|
+
},
|
|
1116
1120
|
"colorBackgroundStatusSuccess": {
|
|
1117
1121
|
"light": "{colorGreen100}",
|
|
1118
1122
|
"dark": "{colorGreen900}"
|
|
@@ -1193,6 +1197,10 @@ export var preset = {
|
|
|
1193
1197
|
"light": "{colorBlue800}",
|
|
1194
1198
|
"dark": "{colorBlue400}"
|
|
1195
1199
|
},
|
|
1200
|
+
"colorTextButtonIconDisabled": {
|
|
1201
|
+
"light": "{colorGrey500}",
|
|
1202
|
+
"dark": "{colorGrey500}"
|
|
1203
|
+
},
|
|
1196
1204
|
"colorBorderButtonPrimaryDisabled": {
|
|
1197
1205
|
"light": "{colorBackgroundButtonPrimaryDisabled}",
|
|
1198
1206
|
"dark": "{colorBackgroundButtonPrimaryDisabled}"
|
|
@@ -1373,6 +1381,10 @@ export var preset = {
|
|
|
1373
1381
|
"light": "{colorYellow800}",
|
|
1374
1382
|
"dark": "{colorYellow700}"
|
|
1375
1383
|
},
|
|
1384
|
+
"colorBorderDialog": {
|
|
1385
|
+
"light": "{colorBorderStatusInfo}",
|
|
1386
|
+
"dark": "{colorBorderStatusInfo}"
|
|
1387
|
+
},
|
|
1376
1388
|
"colorBorderDividerInteractiveDefault": {
|
|
1377
1389
|
"light": "{colorGrey500}",
|
|
1378
1390
|
"dark": "{colorGrey300}"
|
|
@@ -1928,8 +1940,11 @@ export var preset = {
|
|
|
1928
1940
|
"borderLinkFocusRingOutline": "0",
|
|
1929
1941
|
"borderLinkFocusRingShadowSpread": "2px",
|
|
1930
1942
|
"borderWidthAlert": "2px",
|
|
1943
|
+
"borderWidthButton": "2px",
|
|
1944
|
+
"borderWidthDropdown": "2px",
|
|
1931
1945
|
"borderWidthField": "2px",
|
|
1932
1946
|
"borderWidthPopover": "2px",
|
|
1947
|
+
"borderWidthToken": "2px",
|
|
1933
1948
|
"motionDurationExtraFast": {
|
|
1934
1949
|
"default": "45ms",
|
|
1935
1950
|
"disabled": "0ms"
|
|
@@ -3358,6 +3373,10 @@ export var preset = {
|
|
|
3358
3373
|
"light": "{colorBlue900}",
|
|
3359
3374
|
"dark": "{colorBlue900}"
|
|
3360
3375
|
},
|
|
3376
|
+
"colorBackgroundDialog": {
|
|
3377
|
+
"light": "{colorBackgroundStatusInfo}",
|
|
3378
|
+
"dark": "{colorBackgroundStatusInfo}"
|
|
3379
|
+
},
|
|
3361
3380
|
"colorBackgroundStatusSuccess": {
|
|
3362
3381
|
"light": "{colorGreen900}",
|
|
3363
3382
|
"dark": "{colorGreen900}"
|
|
@@ -3438,6 +3457,10 @@ export var preset = {
|
|
|
3438
3457
|
"light": "{colorBlue400}",
|
|
3439
3458
|
"dark": "{colorBlue400}"
|
|
3440
3459
|
},
|
|
3460
|
+
"colorTextButtonIconDisabled": {
|
|
3461
|
+
"light": "{colorGrey500}",
|
|
3462
|
+
"dark": "{colorGrey500}"
|
|
3463
|
+
},
|
|
3441
3464
|
"colorBorderButtonPrimaryDisabled": {
|
|
3442
3465
|
"light": "{colorBackgroundButtonPrimaryDisabled}",
|
|
3443
3466
|
"dark": "{colorBackgroundButtonPrimaryDisabled}"
|
|
@@ -3618,6 +3641,10 @@ export var preset = {
|
|
|
3618
3641
|
"light": "{colorYellow700}",
|
|
3619
3642
|
"dark": "{colorYellow700}"
|
|
3620
3643
|
},
|
|
3644
|
+
"colorBorderDialog": {
|
|
3645
|
+
"light": "{colorBorderStatusInfo}",
|
|
3646
|
+
"dark": "{colorBorderStatusInfo}"
|
|
3647
|
+
},
|
|
3621
3648
|
"colorBorderDividerInteractiveDefault": {
|
|
3622
3649
|
"light": "{colorGrey300}",
|
|
3623
3650
|
"dark": "{colorGrey300}"
|
|
@@ -4504,6 +4531,10 @@ export var preset = {
|
|
|
4504
4531
|
"light": "{colorBlue900}",
|
|
4505
4532
|
"dark": "{colorBlue900}"
|
|
4506
4533
|
},
|
|
4534
|
+
"colorBackgroundDialog": {
|
|
4535
|
+
"light": "{colorBackgroundStatusInfo}",
|
|
4536
|
+
"dark": "{colorBackgroundStatusInfo}"
|
|
4537
|
+
},
|
|
4507
4538
|
"colorBackgroundStatusSuccess": {
|
|
4508
4539
|
"light": "{colorGreen900}",
|
|
4509
4540
|
"dark": "{colorGreen900}"
|
|
@@ -4584,6 +4615,10 @@ export var preset = {
|
|
|
4584
4615
|
"light": "{colorBlue400}",
|
|
4585
4616
|
"dark": "{colorBlue400}"
|
|
4586
4617
|
},
|
|
4618
|
+
"colorTextButtonIconDisabled": {
|
|
4619
|
+
"light": "{colorGrey500}",
|
|
4620
|
+
"dark": "{colorGrey500}"
|
|
4621
|
+
},
|
|
4587
4622
|
"colorBorderButtonPrimaryDisabled": {
|
|
4588
4623
|
"light": "{colorBackgroundButtonPrimaryDisabled}",
|
|
4589
4624
|
"dark": "{colorBackgroundButtonPrimaryDisabled}"
|
|
@@ -4764,6 +4799,10 @@ export var preset = {
|
|
|
4764
4799
|
"light": "{colorYellow700}",
|
|
4765
4800
|
"dark": "{colorYellow700}"
|
|
4766
4801
|
},
|
|
4802
|
+
"colorBorderDialog": {
|
|
4803
|
+
"light": "{colorBorderStatusInfo}",
|
|
4804
|
+
"dark": "{colorBorderStatusInfo}"
|
|
4805
|
+
},
|
|
4767
4806
|
"colorBorderDividerInteractiveDefault": {
|
|
4768
4807
|
"light": "{colorGrey300}",
|
|
4769
4808
|
"dark": "{colorGrey300}"
|
|
@@ -5582,6 +5621,10 @@ export var preset = {
|
|
|
5582
5621
|
"light": "{colorBlue100}",
|
|
5583
5622
|
"dark": "{colorBlue900}"
|
|
5584
5623
|
},
|
|
5624
|
+
"colorBackgroundDialog": {
|
|
5625
|
+
"light": "{colorBackgroundStatusInfo}",
|
|
5626
|
+
"dark": "{colorBackgroundStatusInfo}"
|
|
5627
|
+
},
|
|
5585
5628
|
"colorBackgroundStatusSuccess": {
|
|
5586
5629
|
"light": "{colorGreen100}",
|
|
5587
5630
|
"dark": "{colorGreen900}"
|
|
@@ -5662,6 +5705,10 @@ export var preset = {
|
|
|
5662
5705
|
"light": "{colorWhite}",
|
|
5663
5706
|
"dark": "{colorWhite}"
|
|
5664
5707
|
},
|
|
5708
|
+
"colorTextButtonIconDisabled": {
|
|
5709
|
+
"light": "{colorGrey500}",
|
|
5710
|
+
"dark": "{colorGrey500}"
|
|
5711
|
+
},
|
|
5665
5712
|
"colorBorderButtonPrimaryDisabled": {
|
|
5666
5713
|
"light": "{colorBackgroundButtonPrimaryDisabled}",
|
|
5667
5714
|
"dark": "{colorBackgroundButtonPrimaryDisabled}"
|
|
@@ -5842,6 +5889,10 @@ export var preset = {
|
|
|
5842
5889
|
"light": "{colorYellow800}",
|
|
5843
5890
|
"dark": "{colorYellow700}"
|
|
5844
5891
|
},
|
|
5892
|
+
"colorBorderDialog": {
|
|
5893
|
+
"light": "{colorBorderStatusInfo}",
|
|
5894
|
+
"dark": "{colorBorderStatusInfo}"
|
|
5895
|
+
},
|
|
5845
5896
|
"colorBorderDividerInteractiveDefault": {
|
|
5846
5897
|
"light": "{colorGrey500}",
|
|
5847
5898
|
"dark": "{colorGrey300}"
|
|
@@ -6660,6 +6711,10 @@ export var preset = {
|
|
|
6660
6711
|
"light": "{colorBlue100}",
|
|
6661
6712
|
"dark": "{colorBlue900}"
|
|
6662
6713
|
},
|
|
6714
|
+
"colorBackgroundDialog": {
|
|
6715
|
+
"light": "{colorBackgroundStatusInfo}",
|
|
6716
|
+
"dark": "{colorBackgroundStatusInfo}"
|
|
6717
|
+
},
|
|
6663
6718
|
"colorBackgroundStatusSuccess": {
|
|
6664
6719
|
"light": "{colorGreen100}",
|
|
6665
6720
|
"dark": "{colorGreen900}"
|
|
@@ -6740,6 +6795,10 @@ export var preset = {
|
|
|
6740
6795
|
"light": "{colorTextButtonNormalHover}",
|
|
6741
6796
|
"dark": "{colorTextButtonNormalHover}"
|
|
6742
6797
|
},
|
|
6798
|
+
"colorTextButtonIconDisabled": {
|
|
6799
|
+
"light": "{colorGrey500}",
|
|
6800
|
+
"dark": "{colorGrey500}"
|
|
6801
|
+
},
|
|
6743
6802
|
"colorBorderButtonPrimaryDisabled": {
|
|
6744
6803
|
"light": "{colorBackgroundButtonPrimaryDisabled}",
|
|
6745
6804
|
"dark": "{colorBackgroundButtonPrimaryDisabled}"
|
|
@@ -6920,6 +6979,10 @@ export var preset = {
|
|
|
6920
6979
|
"light": "{colorYellow800}",
|
|
6921
6980
|
"dark": "{colorYellow700}"
|
|
6922
6981
|
},
|
|
6982
|
+
"colorBorderDialog": {
|
|
6983
|
+
"light": "{colorBorderStatusInfo}",
|
|
6984
|
+
"dark": "{colorBorderStatusInfo}"
|
|
6985
|
+
},
|
|
6923
6986
|
"colorBorderDividerInteractiveDefault": {
|
|
6924
6987
|
"light": "{colorGrey500}",
|
|
6925
6988
|
"dark": "{colorGrey300}"
|
|
@@ -7738,6 +7801,10 @@ export var preset = {
|
|
|
7738
7801
|
"light": "{colorBlue100}",
|
|
7739
7802
|
"dark": "{colorBlue900}"
|
|
7740
7803
|
},
|
|
7804
|
+
"colorBackgroundDialog": {
|
|
7805
|
+
"light": "{colorBackgroundStatusInfo}",
|
|
7806
|
+
"dark": "{colorBackgroundStatusInfo}"
|
|
7807
|
+
},
|
|
7741
7808
|
"colorBackgroundStatusSuccess": {
|
|
7742
7809
|
"light": "{colorGreen100}",
|
|
7743
7810
|
"dark": "{colorGreen900}"
|
|
@@ -7818,6 +7885,10 @@ export var preset = {
|
|
|
7818
7885
|
"light": "{colorTextButtonNormalHover}",
|
|
7819
7886
|
"dark": "{colorTextButtonNormalHover}"
|
|
7820
7887
|
},
|
|
7888
|
+
"colorTextButtonIconDisabled": {
|
|
7889
|
+
"light": "{colorGrey500}",
|
|
7890
|
+
"dark": "{colorGrey500}"
|
|
7891
|
+
},
|
|
7821
7892
|
"colorBorderButtonPrimaryDisabled": {
|
|
7822
7893
|
"light": "{colorBackgroundButtonPrimaryDisabled}",
|
|
7823
7894
|
"dark": "{colorBackgroundButtonPrimaryDisabled}"
|
|
@@ -7998,6 +8069,10 @@ export var preset = {
|
|
|
7998
8069
|
"light": "{colorYellow800}",
|
|
7999
8070
|
"dark": "{colorYellow700}"
|
|
8000
8071
|
},
|
|
8072
|
+
"colorBorderDialog": {
|
|
8073
|
+
"light": "{colorBorderStatusInfo}",
|
|
8074
|
+
"dark": "{colorBorderStatusInfo}"
|
|
8075
|
+
},
|
|
8001
8076
|
"colorBorderDividerInteractiveDefault": {
|
|
8002
8077
|
"light": "{colorGrey500}",
|
|
8003
8078
|
"dark": "{colorGrey300}"
|
|
@@ -8818,6 +8893,10 @@ export var preset = {
|
|
|
8818
8893
|
"light": "{colorBlue900}",
|
|
8819
8894
|
"dark": "{colorBlue900}"
|
|
8820
8895
|
},
|
|
8896
|
+
"colorBackgroundDialog": {
|
|
8897
|
+
"light": "{colorBackgroundStatusInfo}",
|
|
8898
|
+
"dark": "{colorBackgroundStatusInfo}"
|
|
8899
|
+
},
|
|
8821
8900
|
"colorBackgroundStatusSuccess": {
|
|
8822
8901
|
"light": "{colorGreen900}",
|
|
8823
8902
|
"dark": "{colorGreen900}"
|
|
@@ -8898,6 +8977,10 @@ export var preset = {
|
|
|
8898
8977
|
"light": "{colorTextButtonNormalHover}",
|
|
8899
8978
|
"dark": "{colorTextButtonNormalHover}"
|
|
8900
8979
|
},
|
|
8980
|
+
"colorTextButtonIconDisabled": {
|
|
8981
|
+
"light": "{colorGrey500}",
|
|
8982
|
+
"dark": "{colorGrey500}"
|
|
8983
|
+
},
|
|
8901
8984
|
"colorBorderButtonPrimaryDisabled": {
|
|
8902
8985
|
"light": "{colorBackgroundButtonPrimaryDisabled}",
|
|
8903
8986
|
"dark": "{colorBackgroundButtonPrimaryDisabled}"
|
|
@@ -9078,6 +9161,10 @@ export var preset = {
|
|
|
9078
9161
|
"light": "{colorYellow700}",
|
|
9079
9162
|
"dark": "{colorYellow700}"
|
|
9080
9163
|
},
|
|
9164
|
+
"colorBorderDialog": {
|
|
9165
|
+
"light": "{colorBorderStatusInfo}",
|
|
9166
|
+
"dark": "{colorBorderStatusInfo}"
|
|
9167
|
+
},
|
|
9081
9168
|
"colorBorderDividerInteractiveDefault": {
|
|
9082
9169
|
"light": "{colorGrey300}",
|
|
9083
9170
|
"dark": "{colorGrey300}"
|
|
@@ -9805,6 +9892,7 @@ export var preset = {
|
|
|
9805
9892
|
"colorBackgroundSliderWarningPressed": "color",
|
|
9806
9893
|
"colorBackgroundStatusError": "color",
|
|
9807
9894
|
"colorBackgroundStatusInfo": "color",
|
|
9895
|
+
"colorBackgroundDialog": "color",
|
|
9808
9896
|
"colorBackgroundStatusSuccess": "color",
|
|
9809
9897
|
"colorBackgroundStatusWarning": "color",
|
|
9810
9898
|
"colorBackgroundTableHeader": "color",
|
|
@@ -9825,6 +9913,7 @@ export var preset = {
|
|
|
9825
9913
|
"colorBorderButtonNormalDisabled": "color",
|
|
9826
9914
|
"colorTextButtonNormalDisabled": "color",
|
|
9827
9915
|
"colorBorderButtonNormalHover": "color",
|
|
9916
|
+
"colorTextButtonIconDisabled": "color",
|
|
9828
9917
|
"colorBorderButtonPrimaryDisabled": "color",
|
|
9829
9918
|
"colorTextButtonPrimaryDisabled": "color",
|
|
9830
9919
|
"colorBorderCalendarGrid": "color",
|
|
@@ -9870,6 +9959,7 @@ export var preset = {
|
|
|
9870
9959
|
"colorBorderStatusInfo": "color",
|
|
9871
9960
|
"colorBorderStatusSuccess": "color",
|
|
9872
9961
|
"colorBorderStatusWarning": "color",
|
|
9962
|
+
"colorBorderDialog": "color",
|
|
9873
9963
|
"colorBorderDividerInteractiveDefault": "color",
|
|
9874
9964
|
"colorBorderTabsDivider": "color",
|
|
9875
9965
|
"colorBorderTabsShadow": "color",
|
|
@@ -10270,6 +10360,7 @@ export var preset = {
|
|
|
10270
10360
|
"colorBackgroundSegmentHover",
|
|
10271
10361
|
"colorBackgroundStatusError",
|
|
10272
10362
|
"colorBackgroundStatusInfo",
|
|
10363
|
+
"colorBackgroundDialog",
|
|
10273
10364
|
"colorBackgroundStatusSuccess",
|
|
10274
10365
|
"colorBackgroundStatusWarning",
|
|
10275
10366
|
"colorBackgroundToggleCheckedDisabled",
|
|
@@ -10283,6 +10374,7 @@ export var preset = {
|
|
|
10283
10374
|
"colorBorderButtonNormalDisabled",
|
|
10284
10375
|
"colorTextButtonNormalDisabled",
|
|
10285
10376
|
"colorBorderButtonNormalHover",
|
|
10377
|
+
"colorTextButtonIconDisabled",
|
|
10286
10378
|
"colorBorderButtonPrimaryDisabled",
|
|
10287
10379
|
"colorTextButtonPrimaryDisabled",
|
|
10288
10380
|
"colorBorderContainerTop",
|
|
@@ -10303,6 +10395,7 @@ export var preset = {
|
|
|
10303
10395
|
"colorBorderStatusInfo",
|
|
10304
10396
|
"colorBorderStatusSuccess",
|
|
10305
10397
|
"colorBorderStatusWarning",
|
|
10398
|
+
"colorBorderDialog",
|
|
10306
10399
|
"colorForegroundControlDefault",
|
|
10307
10400
|
"colorForegroundControlDisabled",
|
|
10308
10401
|
"colorForegroundControlReadOnly",
|
|
@@ -10401,8 +10494,11 @@ export var preset = {
|
|
|
10401
10494
|
"borderRadiusToken",
|
|
10402
10495
|
"borderRadiusTutorialPanelItem",
|
|
10403
10496
|
"borderWidthAlert",
|
|
10497
|
+
"borderWidthButton",
|
|
10498
|
+
"borderWidthDropdown",
|
|
10404
10499
|
"borderWidthField",
|
|
10405
|
-
"borderWidthPopover"
|
|
10500
|
+
"borderWidthPopover",
|
|
10501
|
+
"borderWidthToken"
|
|
10406
10502
|
],
|
|
10407
10503
|
"exposed": [
|
|
10408
10504
|
"colorChartsRed300",
|
|
@@ -10610,6 +10706,7 @@ export var preset = {
|
|
|
10610
10706
|
"colorBackgroundSegmentHover",
|
|
10611
10707
|
"colorBackgroundStatusError",
|
|
10612
10708
|
"colorBackgroundStatusInfo",
|
|
10709
|
+
"colorBackgroundDialog",
|
|
10613
10710
|
"colorBackgroundStatusSuccess",
|
|
10614
10711
|
"colorBackgroundStatusWarning",
|
|
10615
10712
|
"colorBackgroundToggleCheckedDisabled",
|
|
@@ -10627,6 +10724,7 @@ export var preset = {
|
|
|
10627
10724
|
"colorBorderButtonNormalDisabled",
|
|
10628
10725
|
"colorTextButtonNormalDisabled",
|
|
10629
10726
|
"colorBorderButtonNormalHover",
|
|
10727
|
+
"colorTextButtonIconDisabled",
|
|
10630
10728
|
"colorBorderButtonPrimaryDisabled",
|
|
10631
10729
|
"colorTextButtonPrimaryDisabled",
|
|
10632
10730
|
"colorBorderContainerTop",
|
|
@@ -10647,6 +10745,7 @@ export var preset = {
|
|
|
10647
10745
|
"colorBorderStatusInfo",
|
|
10648
10746
|
"colorBorderStatusSuccess",
|
|
10649
10747
|
"colorBorderStatusWarning",
|
|
10748
|
+
"colorBorderDialog",
|
|
10650
10749
|
"colorForegroundControlDefault",
|
|
10651
10750
|
"colorForegroundControlDisabled",
|
|
10652
10751
|
"colorForegroundControlReadOnly",
|
|
@@ -10748,8 +10847,11 @@ export var preset = {
|
|
|
10748
10847
|
"borderRadiusChatBubble",
|
|
10749
10848
|
"borderRadiusTutorialPanelItem",
|
|
10750
10849
|
"borderWidthAlert",
|
|
10850
|
+
"borderWidthButton",
|
|
10851
|
+
"borderWidthDropdown",
|
|
10751
10852
|
"borderWidthField",
|
|
10752
10853
|
"borderWidthPopover",
|
|
10854
|
+
"borderWidthToken",
|
|
10753
10855
|
"motionDurationAvatarGenAiGradient",
|
|
10754
10856
|
"motionDurationAvatarLoadingDots",
|
|
10755
10857
|
"motionEasingAvatarGenAiGradient",
|
|
@@ -11095,6 +11197,7 @@ export var preset = {
|
|
|
11095
11197
|
"colorBackgroundSliderWarningPressed": "color-background-slider-warning-pressed",
|
|
11096
11198
|
"colorBackgroundStatusError": "color-background-status-error",
|
|
11097
11199
|
"colorBackgroundStatusInfo": "color-background-status-info",
|
|
11200
|
+
"colorBackgroundDialog": "color-background-dialog",
|
|
11098
11201
|
"colorBackgroundStatusSuccess": "color-background-status-success",
|
|
11099
11202
|
"colorBackgroundStatusWarning": "color-background-status-warning",
|
|
11100
11203
|
"colorBackgroundTableHeader": "color-background-table-header",
|
|
@@ -11115,6 +11218,7 @@ export var preset = {
|
|
|
11115
11218
|
"colorBorderButtonNormalDisabled": "color-border-button-normal-disabled",
|
|
11116
11219
|
"colorTextButtonNormalDisabled": "color-text-button-normal-disabled",
|
|
11117
11220
|
"colorBorderButtonNormalHover": "color-border-button-normal-hover",
|
|
11221
|
+
"colorTextButtonIconDisabled": "color-text-button-icon-disabled",
|
|
11118
11222
|
"colorBorderButtonPrimaryDisabled": "color-border-button-primary-disabled",
|
|
11119
11223
|
"colorTextButtonPrimaryDisabled": "color-text-button-primary-disabled",
|
|
11120
11224
|
"colorBorderCalendarGrid": "color-border-calendar-grid",
|
|
@@ -11160,6 +11264,7 @@ export var preset = {
|
|
|
11160
11264
|
"colorBorderStatusInfo": "color-border-status-info",
|
|
11161
11265
|
"colorBorderStatusSuccess": "color-border-status-success",
|
|
11162
11266
|
"colorBorderStatusWarning": "color-border-status-warning",
|
|
11267
|
+
"colorBorderDialog": "color-border-dialog",
|
|
11163
11268
|
"colorBorderDividerInteractiveDefault": "color-border-divider-interactive-default",
|
|
11164
11269
|
"colorBorderTabsDivider": "color-border-tabs-divider",
|
|
11165
11270
|
"colorBorderTabsShadow": "color-border-tabs-shadow",
|
|
@@ -11364,8 +11469,11 @@ export var preset = {
|
|
|
11364
11469
|
"borderLinkFocusRingOutline": "border-link-focus-ring-outline",
|
|
11365
11470
|
"borderLinkFocusRingShadowSpread": "border-link-focus-ring-shadow-spread",
|
|
11366
11471
|
"borderWidthAlert": "border-width-alert",
|
|
11472
|
+
"borderWidthButton": "border-width-button",
|
|
11473
|
+
"borderWidthDropdown": "border-width-dropdown",
|
|
11367
11474
|
"borderWidthField": "border-width-field",
|
|
11368
11475
|
"borderWidthPopover": "border-width-popover",
|
|
11476
|
+
"borderWidthToken": "border-width-token",
|
|
11369
11477
|
"motionDurationExtraFast": "motion-duration-extra-fast",
|
|
11370
11478
|
"motionDurationExtraSlow": "motion-duration-extra-slow",
|
|
11371
11479
|
"motionDurationFast": "motion-duration-fast",
|
|
@@ -11844,6 +11952,7 @@ export var preset = {
|
|
|
11844
11952
|
"colorBackgroundSliderWarningPressed": "--color-background-slider-warning-pressed-pg5aih",
|
|
11845
11953
|
"colorBackgroundStatusError": "--color-background-status-error-5fz45j",
|
|
11846
11954
|
"colorBackgroundStatusInfo": "--color-background-status-info-gflgo4",
|
|
11955
|
+
"colorBackgroundDialog": "--color-background-dialog-wtz1wl",
|
|
11847
11956
|
"colorBackgroundStatusSuccess": "--color-background-status-success-ua29ej",
|
|
11848
11957
|
"colorBackgroundStatusWarning": "--color-background-status-warning-03nxlw",
|
|
11849
11958
|
"colorBackgroundTableHeader": "--color-background-table-header-inc72b",
|
|
@@ -11864,6 +11973,7 @@ export var preset = {
|
|
|
11864
11973
|
"colorBorderButtonNormalDisabled": "--color-border-button-normal-disabled-caqkhj",
|
|
11865
11974
|
"colorTextButtonNormalDisabled": "--color-text-button-normal-disabled-0s30to",
|
|
11866
11975
|
"colorBorderButtonNormalHover": "--color-border-button-normal-hover-2d2g0m",
|
|
11976
|
+
"colorTextButtonIconDisabled": "--color-text-button-icon-disabled-sa33d0",
|
|
11867
11977
|
"colorBorderButtonPrimaryDisabled": "--color-border-button-primary-disabled-xtv38q",
|
|
11868
11978
|
"colorTextButtonPrimaryDisabled": "--color-text-button-primary-disabled-klolb5",
|
|
11869
11979
|
"colorBorderCalendarGrid": "--color-border-calendar-grid-u86q1u",
|
|
@@ -11909,6 +12019,7 @@ export var preset = {
|
|
|
11909
12019
|
"colorBorderStatusInfo": "--color-border-status-info-z6pwqy",
|
|
11910
12020
|
"colorBorderStatusSuccess": "--color-border-status-success-4x6srk",
|
|
11911
12021
|
"colorBorderStatusWarning": "--color-border-status-warning-3feumr",
|
|
12022
|
+
"colorBorderDialog": "--color-border-dialog-u915ow",
|
|
11912
12023
|
"colorBorderDividerInteractiveDefault": "--color-border-divider-interactive-default-0c10au",
|
|
11913
12024
|
"colorBorderTabsDivider": "--color-border-tabs-divider-djfdfj",
|
|
11914
12025
|
"colorBorderTabsShadow": "--color-border-tabs-shadow-enjrr2",
|
|
@@ -12113,8 +12224,11 @@ export var preset = {
|
|
|
12113
12224
|
"borderLinkFocusRingOutline": "--border-link-focus-ring-outline-kkfop6",
|
|
12114
12225
|
"borderLinkFocusRingShadowSpread": "--border-link-focus-ring-shadow-spread-v8hkrl",
|
|
12115
12226
|
"borderWidthAlert": "--border-width-alert-t0f3yn",
|
|
12227
|
+
"borderWidthButton": "--border-width-button-ru6lbi",
|
|
12228
|
+
"borderWidthDropdown": "--border-width-dropdown-hh98qt",
|
|
12116
12229
|
"borderWidthField": "--border-width-field-h1g7tw",
|
|
12117
12230
|
"borderWidthPopover": "--border-width-popover-h2a419",
|
|
12231
|
+
"borderWidthToken": "--border-width-token-zo28pf",
|
|
12118
12232
|
"motionDurationExtraFast": "--motion-duration-extra-fast-3huyux",
|
|
12119
12233
|
"motionDurationExtraSlow": "--motion-duration-extra-slow-ngjb9g",
|
|
12120
12234
|
"motionDurationFast": "--motion-duration-fast-sbm3r7",
|
|
@@ -62,6 +62,7 @@ export interface PromptInputProps extends BaseInputProps, InputKeyEvents, InputA
|
|
|
62
62
|
minRows?: number;
|
|
63
63
|
/**
|
|
64
64
|
* Specifies the maximum number of lines of text the textarea will expand to.
|
|
65
|
+
* Defaults to 3. Use -1 for infinite rows.
|
|
65
66
|
*/
|
|
66
67
|
maxRows?: number;
|
|
67
68
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../src/prompt-input/interfaces.ts"],"names":[],"mappings":";AAEA,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAC/C,OAAO,EACL,gBAAgB,EAChB,cAAc,EACd,iBAAiB,EACjB,gBAAgB,EAChB,cAAc,EACd,eAAe,EAChB,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,+BAA+B,EAAE,MAAM,wCAAwC,CAAC;AACzF,OAAO,EAAE,aAAa,EAAE,yBAAyB,EAAE,MAAM,oBAAoB,CAAC;AAE9E,MAAM,WAAW,gBACf,SAAQ,cAAc,EACpB,cAAc,EACd,gBAAgB,EAChB,iBAAiB,EACjB,eAAe,EACf,kBAAkB,EAClB,+BAA+B;IACjC;;;OAGG;IACH,QAAQ,CAAC,EAAE,yBAAyB,CAAC,gBAAgB,CAAC,YAAY,CAAC,CAAC;IACpE;;OAEG;IACH,oBAAoB,CAAC,EAAE,SAAS,CAAC,IAAI,CAAC;IACtC;;;;OAIG;IACH,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B;;;;;;;;;;;;;;;;;;;;OAoBG;IACH,mBAAmB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACtC;;;OAGG;IACH,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B;;;OAGG;IACH,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAE/B;;OAEG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAE9B;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB
|
|
1
|
+
{"version":3,"file":"interfaces.d.ts","sourceRoot":"","sources":["../../../src/prompt-input/interfaces.ts"],"names":[],"mappings":";AAEA,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAC/C,OAAO,EACL,gBAAgB,EAChB,cAAc,EACd,iBAAiB,EACjB,gBAAgB,EAChB,cAAc,EACd,eAAe,EAChB,MAAM,qBAAqB,CAAC;AAC7B,OAAO,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AAChE,OAAO,EAAE,+BAA+B,EAAE,MAAM,wCAAwC,CAAC;AACzF,OAAO,EAAE,aAAa,EAAE,yBAAyB,EAAE,MAAM,oBAAoB,CAAC;AAE9E,MAAM,WAAW,gBACf,SAAQ,cAAc,EACpB,cAAc,EACd,gBAAgB,EAChB,iBAAiB,EACjB,eAAe,EACf,kBAAkB,EAClB,+BAA+B;IACjC;;;OAGG;IACH,QAAQ,CAAC,EAAE,yBAAyB,CAAC,gBAAgB,CAAC,YAAY,CAAC,CAAC;IACpE;;OAEG;IACH,oBAAoB,CAAC,EAAE,SAAS,CAAC,IAAI,CAAC;IACtC;;;;OAIG;IACH,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B;;;;;;;;;;;;;;;;;;;;OAoBG;IACH,mBAAmB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IACtC;;;OAGG;IACH,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B;;;OAGG;IACH,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAE/B;;OAEG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAE9B;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB;;OAEG;IACH,gBAAgB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAEnC;;OAEG;IACH,gBAAgB,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAEnC;;OAEG;IACH,+BAA+B,CAAC,EAAE,OAAO,CAAC;IAE1C;;OAEG;IACH,+BAA+B,CAAC,EAAE,OAAO,CAAC;CAC3C;AAED,yBAAiB,gBAAgB,CAAC;IAChC,KAAY,SAAS,GAAG,aAAa,CAAC;IACtC,KAAY,YAAY,GAAG,gBAAgB,CAAC;IAE5C,UAAiB,GAAG;QAClB;;WAEG;QACH,KAAK,IAAI,IAAI,CAAC;QAEd;;WAEG;QACH,MAAM,IAAI,IAAI,CAAC;QAEf;;;;;;WAMG;QACH,iBAAiB,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,EAAE,GAAG,EAAE,MAAM,GAAG,IAAI,EAAE,SAAS,CAAC,EAAE,SAAS,GAAG,UAAU,GAAG,MAAM,GAAG,IAAI,CAAC;KAChH;CACF"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/prompt-input/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { IconProps } from '../icon/interfaces';\nimport {\n BaseChangeDetail,\n BaseInputProps,\n InputAutoComplete,\n InputAutoCorrect,\n InputKeyEvents,\n InputSpellcheck,\n} from '../input/interfaces';\nimport { BaseComponentProps } from '../internal/base-component';\nimport { FormFieldValidationControlProps } from '../internal/context/form-field-context';\nimport { BaseKeyDetail, NonCancelableEventHandler } from '../internal/events';\n\nexport interface PromptInputProps\n extends BaseInputProps,\n InputKeyEvents,\n InputAutoCorrect,\n InputAutoComplete,\n InputSpellcheck,\n BaseComponentProps,\n FormFieldValidationControlProps {\n /**\n * Called whenever a user clicks the action button or presses the \"Enter\" key.\n * The event `detail` contains the current value of the field.\n */\n onAction?: NonCancelableEventHandler<PromptInputProps.ActionDetail>;\n /**\n * Determines what icon to display in the action button.\n */\n actionButtonIconName?: IconProps.Name;\n /**\n * Specifies the URL of a custom icon. Use this property if the icon you want isn't available.\n *\n * If you set both `actionButtonIconUrl` and `actionButtonIconSvg`, `actionButtonIconSvg` will take precedence.\n */\n actionButtonIconUrl?: string;\n /**\n * Specifies the SVG of a custom icon.\n *\n * Use this property if you want your custom icon to inherit colors dictated by variant or hover states.\n * When this property is set, the component will be decorated with `aria-hidden=\"true\"`. Ensure that the `svg` element:\n * - has attribute `focusable=\"false\"`.\n * - has `viewBox=\"0 0 16 16\"`.\n *\n * If you set the `svg` element as the root node of the slot, the component will automatically\n * - set `stroke=\"currentColor\"`, `fill=\"none\"`, and `vertical-align=\"top\"`.\n * - set the stroke width based on the size of the icon.\n * - set the width and height of the SVG element based on the size of the icon.\n *\n * If you don't want these styles to be automatically set, wrap the `svg` element into a `span`.\n * You can still set the stroke to `currentColor` to inherit the color of the surrounding elements.\n *\n * If you set both `actionButtonIconUrl` and `actionButtonIconSvg`, `iconSvg` will take precedence.\n *\n * *Note:* Remember to remove any additional elements (for example: `defs`) and related CSS classes from SVG files exported from design software.\n * In most cases, they aren't needed, as the `svg` element inherits styles from the icon component.\n */\n actionButtonIconSvg?: React.ReactNode;\n /**\n * Specifies alternate text for a custom icon. We recommend that you provide this for accessibility.\n * This property is ignored if you use a predefined icon or if you set your custom icon using the `iconSvg` slot.\n */\n actionButtonIconAlt?: string;\n /**\n * Adds an aria-label to the action button.\n * @i18n\n */\n actionButtonAriaLabel?: string;\n\n /**\n * Specifies whether to disable the action button.\n */\n disableActionButton?: boolean;\n\n /**\n * Specifies the minimum number of lines of text to set the height to.\n */\n minRows?: number;\n\n /**\n * Specifies the maximum number of lines of text the textarea will expand to.\n */\n maxRows?: number;\n\n /**\n * Use this slot to add secondary actions to the prompt input.\n */\n secondaryActions?: React.ReactNode;\n\n /**\n * Use this slot to add secondary content, such as file attachments, to the prompt input.\n */\n secondaryContent?: React.ReactNode;\n\n /**\n * Determines whether the secondary actions area of the input has padding. If true, removes the default padding from the secondary actions area.\n */\n disableSecondaryActionsPaddings?: boolean;\n\n /**\n * Determines whether the secondary content area of the input has padding. If true, removes the default padding from the secondary content area.\n */\n disableSecondaryContentPaddings?: boolean;\n}\n\nexport namespace PromptInputProps {\n export type KeyDetail = BaseKeyDetail;\n export type ActionDetail = BaseChangeDetail;\n\n export interface Ref {\n /**\n * Sets input focus on the textarea control.\n */\n focus(): void;\n\n /**\n * Selects all text in the textarea control.\n */\n select(): void;\n\n /**\n * Selects a range of text in the textarea control.\n *\n * See https://developer.mozilla.org/en-US/docs/Web/API/HTMLTextAreaElement/setSelectionRange\n * for more details on this method. Be aware that using this method in React has some\n * common pitfalls: https://stackoverflow.com/questions/60129605/is-javascripts-setselectionrange-incompatible-with-react-hooks\n */\n setSelectionRange(start: number | null, end: number | null, direction?: 'forward' | 'backward' | 'none'): void;\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"interfaces.js","sourceRoot":"","sources":["../../../src/prompt-input/interfaces.ts"],"names":[],"mappings":"","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport { IconProps } from '../icon/interfaces';\nimport {\n BaseChangeDetail,\n BaseInputProps,\n InputAutoComplete,\n InputAutoCorrect,\n InputKeyEvents,\n InputSpellcheck,\n} from '../input/interfaces';\nimport { BaseComponentProps } from '../internal/base-component';\nimport { FormFieldValidationControlProps } from '../internal/context/form-field-context';\nimport { BaseKeyDetail, NonCancelableEventHandler } from '../internal/events';\n\nexport interface PromptInputProps\n extends BaseInputProps,\n InputKeyEvents,\n InputAutoCorrect,\n InputAutoComplete,\n InputSpellcheck,\n BaseComponentProps,\n FormFieldValidationControlProps {\n /**\n * Called whenever a user clicks the action button or presses the \"Enter\" key.\n * The event `detail` contains the current value of the field.\n */\n onAction?: NonCancelableEventHandler<PromptInputProps.ActionDetail>;\n /**\n * Determines what icon to display in the action button.\n */\n actionButtonIconName?: IconProps.Name;\n /**\n * Specifies the URL of a custom icon. Use this property if the icon you want isn't available.\n *\n * If you set both `actionButtonIconUrl` and `actionButtonIconSvg`, `actionButtonIconSvg` will take precedence.\n */\n actionButtonIconUrl?: string;\n /**\n * Specifies the SVG of a custom icon.\n *\n * Use this property if you want your custom icon to inherit colors dictated by variant or hover states.\n * When this property is set, the component will be decorated with `aria-hidden=\"true\"`. Ensure that the `svg` element:\n * - has attribute `focusable=\"false\"`.\n * - has `viewBox=\"0 0 16 16\"`.\n *\n * If you set the `svg` element as the root node of the slot, the component will automatically\n * - set `stroke=\"currentColor\"`, `fill=\"none\"`, and `vertical-align=\"top\"`.\n * - set the stroke width based on the size of the icon.\n * - set the width and height of the SVG element based on the size of the icon.\n *\n * If you don't want these styles to be automatically set, wrap the `svg` element into a `span`.\n * You can still set the stroke to `currentColor` to inherit the color of the surrounding elements.\n *\n * If you set both `actionButtonIconUrl` and `actionButtonIconSvg`, `iconSvg` will take precedence.\n *\n * *Note:* Remember to remove any additional elements (for example: `defs`) and related CSS classes from SVG files exported from design software.\n * In most cases, they aren't needed, as the `svg` element inherits styles from the icon component.\n */\n actionButtonIconSvg?: React.ReactNode;\n /**\n * Specifies alternate text for a custom icon. We recommend that you provide this for accessibility.\n * This property is ignored if you use a predefined icon or if you set your custom icon using the `iconSvg` slot.\n */\n actionButtonIconAlt?: string;\n /**\n * Adds an aria-label to the action button.\n * @i18n\n */\n actionButtonAriaLabel?: string;\n\n /**\n * Specifies whether to disable the action button.\n */\n disableActionButton?: boolean;\n\n /**\n * Specifies the minimum number of lines of text to set the height to.\n */\n minRows?: number;\n\n /**\n * Specifies the maximum number of lines of text the textarea will expand to.\n * Defaults to 3. Use -1 for infinite rows.\n */\n maxRows?: number;\n\n /**\n * Use this slot to add secondary actions to the prompt input.\n */\n secondaryActions?: React.ReactNode;\n\n /**\n * Use this slot to add secondary content, such as file attachments, to the prompt input.\n */\n secondaryContent?: React.ReactNode;\n\n /**\n * Determines whether the secondary actions area of the input has padding. If true, removes the default padding from the secondary actions area.\n */\n disableSecondaryActionsPaddings?: boolean;\n\n /**\n * Determines whether the secondary content area of the input has padding. If true, removes the default padding from the secondary content area.\n */\n disableSecondaryContentPaddings?: boolean;\n}\n\nexport namespace PromptInputProps {\n export type KeyDetail = BaseKeyDetail;\n export type ActionDetail = BaseChangeDetail;\n\n export interface Ref {\n /**\n * Sets input focus on the textarea control.\n */\n focus(): void;\n\n /**\n * Selects all text in the textarea control.\n */\n select(): void;\n\n /**\n * Selects a range of text in the textarea control.\n *\n * See https://developer.mozilla.org/en-US/docs/Web/API/HTMLTextAreaElement/setSelectionRange\n * for more details on this method. Be aware that using this method in React has some\n * common pitfalls: https://stackoverflow.com/questions/60129605/is-javascripts-setselectionrange-incompatible-with-react-hooks\n */\n setSelectionRange(start: number | null, end: number | null, direction?: 'forward' | 'backward' | 'none'): void;\n }\n}\n"]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/prompt-input/internal.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAmE,MAAM,OAAO,CAAC;AAWxF,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAElF,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AACjD,OAAO,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAKhD,UAAU,wBACR,SAAQ,YAAY,CAAC,gBAAgB,EAAE,SAAS,GAAG,SAAS,CAAC,EAC3D,0BAA0B;CAAG;AAEjC,QAAA,MAAM,mBAAmB,
|
|
1
|
+
{"version":3,"file":"internal.d.ts","sourceRoot":"","sources":["../../../src/prompt-input/internal.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAmE,MAAM,OAAO,CAAC;AAWxF,OAAO,EAAE,0BAA0B,EAAE,MAAM,sCAAsC,CAAC;AAElF,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AACjD,OAAO,EAAE,gBAAgB,EAAE,MAAM,cAAc,CAAC;AAKhD,UAAU,wBACR,SAAQ,YAAY,CAAC,gBAAgB,EAAE,SAAS,GAAG,SAAS,CAAC,EAC3D,0BAA0B;CAAG;AAEjC,QAAA,MAAM,mBAAmB,uGAmNxB,CAAC;AAEF,eAAe,mBAAmB,CAAC"}
|
|
@@ -22,6 +22,7 @@ const InternalPromptInput = React.forwardRef((_a, ref) => {
|
|
|
22
22
|
const isCompactMode = useDensityMode(textareaRef) === 'compact';
|
|
23
23
|
const PADDING = isRefresh ? tokens.spaceXxs : tokens.spaceXxxs;
|
|
24
24
|
const LINE_HEIGHT = tokens.lineHeightBodyM;
|
|
25
|
+
const DEFAULT_MAX_ROWS = 3;
|
|
25
26
|
useImperativeHandle(ref, () => ({
|
|
26
27
|
focus(...args) {
|
|
27
28
|
var _a;
|
|
@@ -53,11 +54,18 @@ const InternalPromptInput = React.forwardRef((_a, ref) => {
|
|
|
53
54
|
const hasActionButton = actionButtonIconName || actionButtonIconSvg || actionButtonIconUrl;
|
|
54
55
|
const adjustTextareaHeight = useCallback(() => {
|
|
55
56
|
if (textareaRef.current) {
|
|
57
|
+
// this is required so the scrollHeight becomes dynamic, otherwise it will be locked at the highest value for the size it reached e.g. 500px
|
|
56
58
|
textareaRef.current.style.height = 'auto';
|
|
57
|
-
const maxRowsHeight = `calc(${maxRows <= 0 ? 3 : maxRows} * (${LINE_HEIGHT} + ${PADDING} / 2) + ${PADDING})`;
|
|
58
|
-
const scrollHeight = `calc(${textareaRef.current.scrollHeight}px)`;
|
|
59
59
|
const minTextareaHeight = `calc(${LINE_HEIGHT} + ${tokens.spaceScaledXxs} * 2)`; // the min height of Textarea with 1 row
|
|
60
|
-
|
|
60
|
+
if (maxRows === -1) {
|
|
61
|
+
const scrollHeight = `calc(${textareaRef.current.scrollHeight}px)`;
|
|
62
|
+
textareaRef.current.style.height = `max(${scrollHeight}, ${minTextareaHeight})`;
|
|
63
|
+
}
|
|
64
|
+
else {
|
|
65
|
+
const maxRowsHeight = `calc(${maxRows <= 0 ? DEFAULT_MAX_ROWS : maxRows} * (${LINE_HEIGHT} + ${PADDING} / 2) + ${PADDING})`;
|
|
66
|
+
const scrollHeight = `calc(${textareaRef.current.scrollHeight}px)`;
|
|
67
|
+
textareaRef.current.style.height = `min(max(${scrollHeight}, ${minTextareaHeight}), ${maxRowsHeight})`;
|
|
68
|
+
}
|
|
61
69
|
}
|
|
62
70
|
}, [maxRows, LINE_HEIGHT, PADDING]);
|
|
63
71
|
useEffect(() => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/prompt-input/internal.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { Ref, useCallback, useEffect, useImperativeHandle, useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { useDensityMode } from '@cloudscape-design/component-toolkit/internal';\n\nimport InternalButton from '../button/internal';\nimport { convertAutoComplete } from '../input/utils';\nimport { getBaseProps } from '../internal/base-component';\nimport { useFormFieldContext } from '../internal/context/form-field-context';\nimport { fireKeyboardEvent, fireNonCancelableEvent } from '../internal/events';\nimport * as tokens from '../internal/generated/styles/tokens';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport { SomeRequired } from '../internal/types';\nimport { PromptInputProps } from './interfaces';\n\nimport styles from './styles.css.js';\nimport testutilStyles from './test-classes/styles.css.js';\n\ninterface InternalPromptInputProps\n extends SomeRequired<PromptInputProps, 'maxRows' | 'minRows'>,\n InternalBaseComponentProps {}\n\nconst InternalPromptInput = React.forwardRef(\n (\n {\n value,\n actionButtonAriaLabel,\n actionButtonIconName,\n actionButtonIconUrl,\n actionButtonIconSvg,\n actionButtonIconAlt,\n ariaLabel,\n autoComplete,\n autoFocus,\n disableActionButton,\n disableBrowserAutocorrect,\n disabled,\n maxRows,\n minRows,\n name,\n onAction,\n onBlur,\n onChange,\n onFocus,\n onKeyDown,\n onKeyUp,\n placeholder,\n readOnly,\n spellcheck,\n secondaryActions,\n secondaryContent,\n disableSecondaryActionsPaddings,\n disableSecondaryContentPaddings,\n __internalRootRef = null,\n ...rest\n }: InternalPromptInputProps,\n ref: Ref<PromptInputProps.Ref>\n ) => {\n const { ariaLabelledby, ariaDescribedby, controlId, invalid, warning } = useFormFieldContext(rest);\n\n const baseProps = getBaseProps(rest);\n\n const textareaRef = useRef<HTMLTextAreaElement>(null);\n\n const isRefresh = useVisualRefresh();\n const isCompactMode = useDensityMode(textareaRef) === 'compact';\n\n const PADDING = isRefresh ? tokens.spaceXxs : tokens.spaceXxxs;\n const LINE_HEIGHT = tokens.lineHeightBodyM;\n\n useImperativeHandle(\n ref,\n () => ({\n focus(...args: Parameters<HTMLElement['focus']>) {\n textareaRef.current?.focus(...args);\n },\n select() {\n textareaRef.current?.select();\n },\n setSelectionRange(...args: Parameters<HTMLTextAreaElement['setSelectionRange']>) {\n textareaRef.current?.setSelectionRange(...args);\n },\n }),\n [textareaRef]\n );\n\n const handleKeyDown = (event: React.KeyboardEvent<HTMLTextAreaElement>) => {\n fireKeyboardEvent(onKeyDown, event);\n\n if (event.key === 'Enter' && !event.shiftKey) {\n if ('form' in event.target && event.target.form !== null && !event.isDefaultPrevented()) {\n (event.target.form as HTMLFormElement).requestSubmit();\n }\n\n event.preventDefault();\n fireNonCancelableEvent(onAction, { value });\n }\n };\n\n const handleChange = (event: React.ChangeEvent<HTMLTextAreaElement>) => {\n fireNonCancelableEvent(onChange, { value: event.target.value });\n adjustTextareaHeight();\n };\n\n const hasActionButton = actionButtonIconName || actionButtonIconSvg || actionButtonIconUrl;\n\n const adjustTextareaHeight = useCallback(() => {\n if (textareaRef.current) {\n textareaRef.current.style.height = 'auto';\n const maxRowsHeight = `calc(${maxRows <= 0 ? 3 : maxRows} * (${LINE_HEIGHT} + ${PADDING} / 2) + ${PADDING})`;\n const scrollHeight = `calc(${textareaRef.current.scrollHeight}px)`;\n const minTextareaHeight = `calc(${LINE_HEIGHT} + ${tokens.spaceScaledXxs} * 2)`; // the min height of Textarea with 1 row\n textareaRef.current.style.height = `min(max(${scrollHeight}, ${minTextareaHeight}), ${maxRowsHeight})`;\n }\n }, [maxRows, LINE_HEIGHT, PADDING]);\n\n useEffect(() => {\n const handleResize = () => {\n adjustTextareaHeight();\n };\n\n window.addEventListener('resize', handleResize);\n\n return () => {\n window.removeEventListener('resize', handleResize);\n };\n }, [adjustTextareaHeight]);\n\n useEffect(() => {\n adjustTextareaHeight();\n }, [value, adjustTextareaHeight, maxRows, isCompactMode]);\n\n const attributes: React.TextareaHTMLAttributes<HTMLTextAreaElement> = {\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledby,\n 'aria-describedby': ariaDescribedby,\n 'aria-invalid': invalid ? 'true' : undefined,\n name,\n placeholder,\n autoFocus,\n className: clsx(styles.textarea, testutilStyles.textarea, {\n [styles.invalid]: invalid,\n [styles.warning]: warning,\n }),\n autoComplete: convertAutoComplete(autoComplete),\n spellCheck: spellcheck,\n disabled,\n readOnly: readOnly ? true : undefined,\n rows: minRows,\n onKeyDown: handleKeyDown,\n onKeyUp: onKeyUp && (event => fireKeyboardEvent(onKeyUp, event)),\n // We set a default value on the component in order to force it into the controlled mode.\n value: value || '',\n onChange: handleChange,\n onBlur: onBlur && (() => fireNonCancelableEvent(onBlur)),\n onFocus: onFocus && (() => fireNonCancelableEvent(onFocus)),\n };\n\n if (disableBrowserAutocorrect) {\n attributes.autoCorrect = 'off';\n attributes.autoCapitalize = 'off';\n }\n\n const action = (\n <div className={styles.button}>\n <InternalButton\n className={clsx(styles['action-button'], testutilStyles['action-button'])}\n ariaLabel={actionButtonAriaLabel}\n disabled={disabled || readOnly || disableActionButton}\n __focusable={readOnly}\n iconName={actionButtonIconName}\n iconUrl={actionButtonIconUrl}\n iconSvg={actionButtonIconSvg}\n iconAlt={actionButtonIconAlt}\n onClick={() => fireNonCancelableEvent(onAction, { value })}\n variant=\"icon\"\n />\n </div>\n );\n\n return (\n <div\n {...baseProps}\n aria-label={ariaLabel}\n className={clsx(styles.root, testutilStyles.root, baseProps.className, {\n [styles['textarea-readonly']]: readOnly,\n [styles['textarea-invalid']]: invalid,\n [styles['textarea-warning']]: warning && !invalid,\n [styles.disabled]: disabled,\n })}\n ref={__internalRootRef}\n role=\"region\"\n >\n {secondaryContent && (\n <div\n className={clsx(styles['secondary-content'], testutilStyles['secondary-content'], {\n [styles['with-paddings']]: !disableSecondaryContentPaddings,\n [styles.invalid]: invalid,\n [styles.warning]: warning,\n })}\n >\n {secondaryContent}\n </div>\n )}\n <div className={styles['textarea-wrapper']}>\n <textarea ref={textareaRef} id={controlId} {...attributes} />\n {hasActionButton && !secondaryActions && action}\n </div>\n {secondaryActions && (\n <div\n className={clsx(styles['secondary-actions'], testutilStyles['secondary-actions'], {\n [styles['with-paddings']]: !disableSecondaryActionsPaddings,\n [styles.invalid]: invalid,\n [styles.warning]: warning,\n })}\n >\n {secondaryActions}\n <div className={styles.buffer} onClick={() => textareaRef.current?.focus()} />\n {hasActionButton && action}\n </div>\n )}\n </div>\n );\n }\n);\n\nexport default InternalPromptInput;\n"]}
|
|
1
|
+
{"version":3,"file":"internal.js","sourceRoot":"","sources":["../../../src/prompt-input/internal.tsx"],"names":[],"mappings":"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","sourcesContent":["// Copyright Amazon.com, Inc. or its affiliates. All Rights Reserved.\n// SPDX-License-Identifier: Apache-2.0\nimport React, { Ref, useCallback, useEffect, useImperativeHandle, useRef } from 'react';\nimport clsx from 'clsx';\n\nimport { useDensityMode } from '@cloudscape-design/component-toolkit/internal';\n\nimport InternalButton from '../button/internal';\nimport { convertAutoComplete } from '../input/utils';\nimport { getBaseProps } from '../internal/base-component';\nimport { useFormFieldContext } from '../internal/context/form-field-context';\nimport { fireKeyboardEvent, fireNonCancelableEvent } from '../internal/events';\nimport * as tokens from '../internal/generated/styles/tokens';\nimport { InternalBaseComponentProps } from '../internal/hooks/use-base-component';\nimport { useVisualRefresh } from '../internal/hooks/use-visual-mode';\nimport { SomeRequired } from '../internal/types';\nimport { PromptInputProps } from './interfaces';\n\nimport styles from './styles.css.js';\nimport testutilStyles from './test-classes/styles.css.js';\n\ninterface InternalPromptInputProps\n extends SomeRequired<PromptInputProps, 'maxRows' | 'minRows'>,\n InternalBaseComponentProps {}\n\nconst InternalPromptInput = React.forwardRef(\n (\n {\n value,\n actionButtonAriaLabel,\n actionButtonIconName,\n actionButtonIconUrl,\n actionButtonIconSvg,\n actionButtonIconAlt,\n ariaLabel,\n autoComplete,\n autoFocus,\n disableActionButton,\n disableBrowserAutocorrect,\n disabled,\n maxRows,\n minRows,\n name,\n onAction,\n onBlur,\n onChange,\n onFocus,\n onKeyDown,\n onKeyUp,\n placeholder,\n readOnly,\n spellcheck,\n secondaryActions,\n secondaryContent,\n disableSecondaryActionsPaddings,\n disableSecondaryContentPaddings,\n __internalRootRef = null,\n ...rest\n }: InternalPromptInputProps,\n ref: Ref<PromptInputProps.Ref>\n ) => {\n const { ariaLabelledby, ariaDescribedby, controlId, invalid, warning } = useFormFieldContext(rest);\n\n const baseProps = getBaseProps(rest);\n\n const textareaRef = useRef<HTMLTextAreaElement>(null);\n\n const isRefresh = useVisualRefresh();\n const isCompactMode = useDensityMode(textareaRef) === 'compact';\n\n const PADDING = isRefresh ? tokens.spaceXxs : tokens.spaceXxxs;\n const LINE_HEIGHT = tokens.lineHeightBodyM;\n const DEFAULT_MAX_ROWS = 3;\n\n useImperativeHandle(\n ref,\n () => ({\n focus(...args: Parameters<HTMLElement['focus']>) {\n textareaRef.current?.focus(...args);\n },\n select() {\n textareaRef.current?.select();\n },\n setSelectionRange(...args: Parameters<HTMLTextAreaElement['setSelectionRange']>) {\n textareaRef.current?.setSelectionRange(...args);\n },\n }),\n [textareaRef]\n );\n\n const handleKeyDown = (event: React.KeyboardEvent<HTMLTextAreaElement>) => {\n fireKeyboardEvent(onKeyDown, event);\n\n if (event.key === 'Enter' && !event.shiftKey) {\n if ('form' in event.target && event.target.form !== null && !event.isDefaultPrevented()) {\n (event.target.form as HTMLFormElement).requestSubmit();\n }\n\n event.preventDefault();\n fireNonCancelableEvent(onAction, { value });\n }\n };\n\n const handleChange = (event: React.ChangeEvent<HTMLTextAreaElement>) => {\n fireNonCancelableEvent(onChange, { value: event.target.value });\n adjustTextareaHeight();\n };\n\n const hasActionButton = actionButtonIconName || actionButtonIconSvg || actionButtonIconUrl;\n\n const adjustTextareaHeight = useCallback(() => {\n if (textareaRef.current) {\n // this is required so the scrollHeight becomes dynamic, otherwise it will be locked at the highest value for the size it reached e.g. 500px\n textareaRef.current.style.height = 'auto';\n\n const minTextareaHeight = `calc(${LINE_HEIGHT} + ${tokens.spaceScaledXxs} * 2)`; // the min height of Textarea with 1 row\n\n if (maxRows === -1) {\n const scrollHeight = `calc(${textareaRef.current.scrollHeight}px)`;\n textareaRef.current.style.height = `max(${scrollHeight}, ${minTextareaHeight})`;\n } else {\n const maxRowsHeight = `calc(${maxRows <= 0 ? DEFAULT_MAX_ROWS : maxRows} * (${LINE_HEIGHT} + ${PADDING} / 2) + ${PADDING})`;\n const scrollHeight = `calc(${textareaRef.current.scrollHeight}px)`;\n textareaRef.current.style.height = `min(max(${scrollHeight}, ${minTextareaHeight}), ${maxRowsHeight})`;\n }\n }\n }, [maxRows, LINE_HEIGHT, PADDING]);\n\n useEffect(() => {\n const handleResize = () => {\n adjustTextareaHeight();\n };\n\n window.addEventListener('resize', handleResize);\n\n return () => {\n window.removeEventListener('resize', handleResize);\n };\n }, [adjustTextareaHeight]);\n\n useEffect(() => {\n adjustTextareaHeight();\n }, [value, adjustTextareaHeight, maxRows, isCompactMode]);\n\n const attributes: React.TextareaHTMLAttributes<HTMLTextAreaElement> = {\n 'aria-label': ariaLabel,\n 'aria-labelledby': ariaLabelledby,\n 'aria-describedby': ariaDescribedby,\n 'aria-invalid': invalid ? 'true' : undefined,\n name,\n placeholder,\n autoFocus,\n className: clsx(styles.textarea, testutilStyles.textarea, {\n [styles.invalid]: invalid,\n [styles.warning]: warning,\n }),\n autoComplete: convertAutoComplete(autoComplete),\n spellCheck: spellcheck,\n disabled,\n readOnly: readOnly ? true : undefined,\n rows: minRows,\n onKeyDown: handleKeyDown,\n onKeyUp: onKeyUp && (event => fireKeyboardEvent(onKeyUp, event)),\n // We set a default value on the component in order to force it into the controlled mode.\n value: value || '',\n onChange: handleChange,\n onBlur: onBlur && (() => fireNonCancelableEvent(onBlur)),\n onFocus: onFocus && (() => fireNonCancelableEvent(onFocus)),\n };\n\n if (disableBrowserAutocorrect) {\n attributes.autoCorrect = 'off';\n attributes.autoCapitalize = 'off';\n }\n\n const action = (\n <div className={styles.button}>\n <InternalButton\n className={clsx(styles['action-button'], testutilStyles['action-button'])}\n ariaLabel={actionButtonAriaLabel}\n disabled={disabled || readOnly || disableActionButton}\n __focusable={readOnly}\n iconName={actionButtonIconName}\n iconUrl={actionButtonIconUrl}\n iconSvg={actionButtonIconSvg}\n iconAlt={actionButtonIconAlt}\n onClick={() => fireNonCancelableEvent(onAction, { value })}\n variant=\"icon\"\n />\n </div>\n );\n\n return (\n <div\n {...baseProps}\n aria-label={ariaLabel}\n className={clsx(styles.root, testutilStyles.root, baseProps.className, {\n [styles['textarea-readonly']]: readOnly,\n [styles['textarea-invalid']]: invalid,\n [styles['textarea-warning']]: warning && !invalid,\n [styles.disabled]: disabled,\n })}\n ref={__internalRootRef}\n role=\"region\"\n >\n {secondaryContent && (\n <div\n className={clsx(styles['secondary-content'], testutilStyles['secondary-content'], {\n [styles['with-paddings']]: !disableSecondaryContentPaddings,\n [styles.invalid]: invalid,\n [styles.warning]: warning,\n })}\n >\n {secondaryContent}\n </div>\n )}\n <div className={styles['textarea-wrapper']}>\n <textarea ref={textareaRef} id={controlId} {...attributes} />\n {hasActionButton && !secondaryActions && action}\n </div>\n {secondaryActions && (\n <div\n className={clsx(styles['secondary-actions'], testutilStyles['secondary-actions'], {\n [styles['with-paddings']]: !disableSecondaryActionsPaddings,\n [styles.invalid]: invalid,\n [styles.warning]: warning,\n })}\n >\n {secondaryActions}\n <div className={styles.buffer} onClick={() => textareaRef.current?.focus()} />\n {hasActionButton && action}\n </div>\n )}\n </div>\n );\n }\n);\n\nexport default InternalPromptInput;\n"]}
|