igniteui-angular 20.0.2 → 20.0.3
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/fesm2022/igniteui-angular.mjs +185 -17
- package/fesm2022/igniteui-angular.mjs.map +1 -1
- package/index.d.ts +4998 -4923
- package/lib/core/styles/components/column-actions/_column-actions-theme.scss +1 -1
- package/lib/core/styles/components/combo/_combo-theme.scss +7 -0
- package/lib/core/styles/components/input/_input-group-component.scss +30 -0
- package/lib/core/styles/components/input/_input-group-theme.scss +69 -5
- package/package.json +1 -1
- package/styles/igniteui-angular-dark.css +1 -1
- package/styles/igniteui-angular.css +1 -1
- package/styles/igniteui-bootstrap-dark.css +1 -1
- package/styles/igniteui-bootstrap-light.css +1 -1
- package/styles/igniteui-dark-green.css +1 -1
- package/styles/igniteui-fluent-dark-excel.css +1 -1
- package/styles/igniteui-fluent-dark-word.css +1 -1
- package/styles/igniteui-fluent-dark.css +1 -1
- package/styles/igniteui-fluent-light-excel.css +1 -1
- package/styles/igniteui-fluent-light-word.css +1 -1
- package/styles/igniteui-fluent-light.css +1 -1
- package/styles/igniteui-indigo-dark.css +1 -1
- package/styles/igniteui-indigo-light.css +1 -1
- package/styles/maps/igniteui-angular-dark.css.map +1 -1
- package/styles/maps/igniteui-angular.css.map +1 -1
- package/styles/maps/igniteui-bootstrap-dark.css.map +1 -1
- package/styles/maps/igniteui-bootstrap-light.css.map +1 -1
- package/styles/maps/igniteui-dark-green.css.map +1 -1
- package/styles/maps/igniteui-fluent-dark-excel.css.map +1 -1
- package/styles/maps/igniteui-fluent-dark-word.css.map +1 -1
- package/styles/maps/igniteui-fluent-dark.css.map +1 -1
- package/styles/maps/igniteui-fluent-light-excel.css.map +1 -1
- package/styles/maps/igniteui-fluent-light-word.css.map +1 -1
- package/styles/maps/igniteui-fluent-light.css.map +1 -1
- package/styles/maps/igniteui-indigo-dark.css.map +1 -1
- package/styles/maps/igniteui-indigo-light.css.map +1 -1
|
@@ -301,6 +301,13 @@
|
|
|
301
301
|
padding: 0;
|
|
302
302
|
}
|
|
303
303
|
}
|
|
304
|
+
|
|
305
|
+
&:not(.igx-input-group--disabled){
|
|
306
|
+
%igx-combo__clear-button {
|
|
307
|
+
color: var-get($theme, 'clear-button-foreground');
|
|
308
|
+
background: var-get($theme, 'clear-button-background');
|
|
309
|
+
}
|
|
310
|
+
}
|
|
304
311
|
}
|
|
305
312
|
|
|
306
313
|
%form-group-bundle:not(%form-group-bundle--disabled):focus-within {
|
|
@@ -1000,6 +1000,36 @@
|
|
|
1000
1000
|
}
|
|
1001
1001
|
}
|
|
1002
1002
|
|
|
1003
|
+
@include mx(bootstrap, warning) {
|
|
1004
|
+
@include e(input) {
|
|
1005
|
+
@extend %bootstrap-input--warning !optional;
|
|
1006
|
+
|
|
1007
|
+
&:hover {
|
|
1008
|
+
@extend %bootstrap-input--warning !optional;
|
|
1009
|
+
}
|
|
1010
|
+
}
|
|
1011
|
+
|
|
1012
|
+
@include e(file-input) {
|
|
1013
|
+
@extend %bootstrap-input--warning !optional;
|
|
1014
|
+
|
|
1015
|
+
&:hover {
|
|
1016
|
+
@extend %bootstrap-input--warning !optional;
|
|
1017
|
+
}
|
|
1018
|
+
}
|
|
1019
|
+
|
|
1020
|
+
@include e(label) {
|
|
1021
|
+
@extend %bootstrap-label !optional;
|
|
1022
|
+
}
|
|
1023
|
+
|
|
1024
|
+
@include e(textarea) {
|
|
1025
|
+
@extend %bootstrap-input--warning !optional;
|
|
1026
|
+
|
|
1027
|
+
&:hover {
|
|
1028
|
+
@extend %bootstrap-input--warning !optional;
|
|
1029
|
+
}
|
|
1030
|
+
}
|
|
1031
|
+
}
|
|
1032
|
+
|
|
1003
1033
|
@include mx(bootstrap, textarea-group) {
|
|
1004
1034
|
@include e(bundle) {
|
|
1005
1035
|
@extend %form-group-bundle-bootstrap--textarea !optional;
|
|
@@ -747,12 +747,23 @@
|
|
|
747
747
|
}
|
|
748
748
|
}
|
|
749
749
|
}
|
|
750
|
+
|
|
751
|
+
&:not(%form-group-display--focused, %form-group-display--filled) {
|
|
752
|
+
&:has(input:not(:placeholder-shown, [type='file'])) {
|
|
753
|
+
%form-group-label {
|
|
754
|
+
@include type-style('subtitle-1');
|
|
755
|
+
transform: translateY(0);
|
|
756
|
+
}
|
|
757
|
+
}
|
|
758
|
+
}
|
|
750
759
|
}
|
|
751
760
|
}
|
|
752
761
|
|
|
753
762
|
%form-group-placeholder {
|
|
754
|
-
|
|
755
|
-
|
|
763
|
+
&:has(input:placeholder-shown, textarea:placeholder-shown) {
|
|
764
|
+
%form-group-label {
|
|
765
|
+
transition: none !important;
|
|
766
|
+
}
|
|
756
767
|
}
|
|
757
768
|
}
|
|
758
769
|
|
|
@@ -1255,13 +1266,20 @@
|
|
|
1255
1266
|
|
|
1256
1267
|
%form-group-label--focused-border,
|
|
1257
1268
|
%form-group-label--filled-border,
|
|
1258
|
-
%form-group-label--placeholder-border,
|
|
1259
1269
|
%form-group-label--file-border {
|
|
1260
1270
|
%igx-input-group__notch {
|
|
1261
1271
|
border-block-start-color: transparent !important;
|
|
1262
1272
|
}
|
|
1263
1273
|
}
|
|
1264
1274
|
|
|
1275
|
+
%form-group-label--placeholder-border {
|
|
1276
|
+
&:has(input:placeholder-shown, textarea:placeholder-shown) {
|
|
1277
|
+
%igx-input-group__notch {
|
|
1278
|
+
border-block-start-color: transparent !important;
|
|
1279
|
+
}
|
|
1280
|
+
}
|
|
1281
|
+
}
|
|
1282
|
+
|
|
1265
1283
|
%form-group-label--focused-border {
|
|
1266
1284
|
%form-group-bundle-start {
|
|
1267
1285
|
border-inline-start-width: rem(2px);
|
|
@@ -1349,6 +1367,26 @@
|
|
|
1349
1367
|
width: calc(100% - #{rem(2px)});
|
|
1350
1368
|
}
|
|
1351
1369
|
}
|
|
1370
|
+
|
|
1371
|
+
%textarea-group:not(%form-group-display--focused, %form-group-display--filled) {
|
|
1372
|
+
&:has(textarea:not(:placeholder-shown)) {
|
|
1373
|
+
%form-group-textarea-label:not(%textarea-group-label--focused) {
|
|
1374
|
+
@include type-style('subtitle-1');
|
|
1375
|
+
|
|
1376
|
+
top: calc($input-top-padding - #{rem(3px)});
|
|
1377
|
+
transform: translateY(0);
|
|
1378
|
+
margin-bottom: auto;
|
|
1379
|
+
}
|
|
1380
|
+
}
|
|
1381
|
+
}
|
|
1382
|
+
|
|
1383
|
+
%textarea-group:not(%form-group-display--focused, %form-group-display--filled) {
|
|
1384
|
+
&:has(%form-group-display--border, textarea:not(:placeholder-shown)) {
|
|
1385
|
+
%igx-input-group__notch {
|
|
1386
|
+
border-block-start-width: rem(1px);
|
|
1387
|
+
}
|
|
1388
|
+
}
|
|
1389
|
+
}
|
|
1352
1390
|
}
|
|
1353
1391
|
|
|
1354
1392
|
%form-group-textarea-group-bundle {
|
|
@@ -2423,12 +2461,38 @@
|
|
|
2423
2461
|
|
|
2424
2462
|
%bootstrap-input--success {
|
|
2425
2463
|
border: rem(1px) solid var-get($theme, 'success-secondary-color');
|
|
2426
|
-
|
|
2464
|
+
|
|
2465
|
+
&:focus {
|
|
2466
|
+
box-shadow: 0 0 0 rem(4px) var-get($theme, 'success-shadow-color');
|
|
2467
|
+
|
|
2468
|
+
+ %bootstrap-file-input {
|
|
2469
|
+
box-shadow: 0 0 0 rem(4px) var-get($theme, 'success-shadow-color');
|
|
2470
|
+
}
|
|
2471
|
+
}
|
|
2427
2472
|
}
|
|
2428
2473
|
|
|
2429
2474
|
%bootstrap-input--error {
|
|
2430
2475
|
border: rem(1px) solid var-get($theme, 'error-secondary-color');
|
|
2431
|
-
|
|
2476
|
+
|
|
2477
|
+
&:focus {
|
|
2478
|
+
box-shadow: 0 0 0 rem(4px) var-get($theme, 'error-shadow-color');
|
|
2479
|
+
|
|
2480
|
+
+ %bootstrap-file-input {
|
|
2481
|
+
box-shadow: 0 0 0 rem(4px) var-get($theme, 'error-shadow-color');
|
|
2482
|
+
}
|
|
2483
|
+
}
|
|
2484
|
+
}
|
|
2485
|
+
|
|
2486
|
+
%bootstrap-input--warning {
|
|
2487
|
+
border: rem(1px) solid var-get($theme, 'warning-secondary-color');
|
|
2488
|
+
|
|
2489
|
+
&:focus {
|
|
2490
|
+
box-shadow: 0 0 0 rem(4px) color($color: 'warn', $variant: 500, $opacity: 0.38);
|
|
2491
|
+
|
|
2492
|
+
+ %bootstrap-file-input {
|
|
2493
|
+
box-shadow: 0 0 0 rem(4px) color($color: 'warn', $variant: 500, $opacity: 0.38);
|
|
2494
|
+
}
|
|
2495
|
+
}
|
|
2432
2496
|
}
|
|
2433
2497
|
|
|
2434
2498
|
%bootstrap-input--disabled {
|
package/package.json
CHANGED