@dynamic-framework/ui-react 1.24.0 → 1.26.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.
- package/dist/css/dynamic-ui-non-root.css +46 -31
- package/dist/css/dynamic-ui-non-root.min.css +2 -2
- package/dist/css/dynamic-ui-root.css +1 -1
- package/dist/css/dynamic-ui-root.min.css +1 -1
- package/dist/css/dynamic-ui.css +46 -31
- package/dist/css/dynamic-ui.min.css +2 -2
- package/dist/index.esm.js +157 -27
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +151 -19
- package/dist/index.js.map +1 -1
- package/dist/types/components/DInputCheck/DInputCheck.d.ts +2 -2
- package/dist/types/components/DInputPin/DInputPin.d.ts +2 -2
- package/dist/types/components/DInputRange/DInputRange.d.ts +8 -0
- package/dist/types/components/DInputRange/index.d.ts +2 -0
- package/dist/types/components/DInputSelect/DInputSelect.d.ts +5 -3
- package/dist/types/components/DInputSwitch/DInputSwitch.d.ts +2 -2
- package/dist/types/components/DQuickActionCheck/DQuickActionCheck.d.ts +2 -2
- package/dist/types/components/DQuickActionSelect/DQuickActionSelect.d.ts +2 -2
- package/dist/types/components/DQuickActionSwitch/DQuickActionSwitch.d.ts +2 -2
- package/dist/types/components/DTabs/DTabs.d.ts +2 -1
- package/dist/types/components/DToast/DToast.d.ts +11 -0
- package/dist/types/components/DToast/components/DToastBody.d.ts +5 -0
- package/dist/types/components/DToast/components/DToastHeader.d.ts +5 -0
- package/dist/types/components/DToast/index.d.ts +4 -0
- package/dist/types/components/index.d.ts +2 -0
- package/package.json +2 -3
- package/src/style/abstracts/variables/_+import.scss +2 -1
- package/src/style/abstracts/variables/_forms.scss +5 -1
- package/src/style/base/_+import.scss +1 -0
- package/src/style/base/_form-range.scss +52 -0
- package/src/style/base/_input-group.scss +1 -1
- package/src/style/components/_d-select.scss +2 -0
package/dist/css/dynamic-ui.css
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
/*!
|
|
2
|
-
* dynamic-framework 1.
|
|
2
|
+
* dynamic-framework 1.26.0
|
|
3
3
|
* bootstrap ^5.3.3
|
|
4
4
|
* license https://github.com/dynamic-framework/dynamic-ui/blob/master/libraries/dynamic-ui-react/LICENSE.md
|
|
5
5
|
*/
|
|
@@ -3441,8 +3441,8 @@ textarea.form-control-lg {
|
|
|
3441
3441
|
box-shadow: none;
|
|
3442
3442
|
}
|
|
3443
3443
|
.form-check-input:checked {
|
|
3444
|
-
background-color: var(--bs-
|
|
3445
|
-
border-color: var(--bs-
|
|
3444
|
+
background-color: var(--bs-primary);
|
|
3445
|
+
border-color: var(--bs-primary);
|
|
3446
3446
|
}
|
|
3447
3447
|
.form-check-input:checked[type=checkbox] {
|
|
3448
3448
|
--bs-form-check-bg-image: url("data:image/svg+xml, %3csvg viewBox='-4 -6 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3e%3cpath fill-rule='evenodd' clip-rule='evenodd' d='M14.294 0.594229C14.3863 0.498719 14.4966 0.422536 14.6186 0.370127C14.7406 0.317718 14.8719 0.290132 15.0046 0.288978C15.1374 0.287824 15.2691 0.313126 15.392 0.363407C15.5149 0.413688 15.6265 0.487941 15.7204 0.581833C15.8143 0.675726 15.8886 0.787378 15.9389 0.910275C15.9891 1.03317 16.0144 1.16485 16.0133 1.29763C16.0121 1.43041 15.9846 1.56163 15.9321 1.68363C15.8797 1.80564 15.8036 1.91598 15.708 2.00823L6.70804 11.0082C6.52051 11.1957 6.26621 11.301 6.00104 11.301C5.73588 11.301 5.48157 11.1957 5.29404 11.0082L0.293041 6.00723C0.110883 5.81863 0.0100885 5.56602 0.0123669 5.30383C0.0146453 5.04163 0.119815 4.79082 0.305223 4.60541C0.490631 4.42 0.741443 4.31483 1.00364 4.31255C1.26584 4.31028 1.51844 4.41107 1.70704 4.59323L6.00104 8.88723L14.294 0.594229V0.594229Z' fill='%23fff'/%3e%3c/svg%3e");
|
|
@@ -3451,8 +3451,8 @@ textarea.form-control-lg {
|
|
|
3451
3451
|
--bs-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%23fff'/%3e%3c/svg%3e");
|
|
3452
3452
|
}
|
|
3453
3453
|
.form-check-input[type=checkbox]:indeterminate {
|
|
3454
|
-
background-color: var(--bs-
|
|
3455
|
-
border-color: var(--bs-
|
|
3454
|
+
background-color: var(--bs-primary);
|
|
3455
|
+
border-color: var(--bs-primary);
|
|
3456
3456
|
--bs-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='M6 10h8'/%3e%3c/svg%3e");
|
|
3457
3457
|
}
|
|
3458
3458
|
.form-check-input:disabled {
|
|
@@ -3527,10 +3527,10 @@ textarea.form-control-lg {
|
|
|
3527
3527
|
outline: 0;
|
|
3528
3528
|
}
|
|
3529
3529
|
.form-range:focus::-webkit-slider-thumb {
|
|
3530
|
-
box-shadow: 0 0 0
|
|
3530
|
+
box-shadow: 0 0 0 4px rgba(var(--bs-primary-rgb), 0.4);
|
|
3531
3531
|
}
|
|
3532
3532
|
.form-range:focus::-moz-range-thumb {
|
|
3533
|
-
box-shadow: 0 0 0
|
|
3533
|
+
box-shadow: 0 0 0 4px rgba(var(--bs-primary-rgb), 0.4);
|
|
3534
3534
|
}
|
|
3535
3535
|
.form-range::-moz-focus-outer {
|
|
3536
3536
|
border: 0;
|
|
@@ -3538,10 +3538,10 @@ textarea.form-control-lg {
|
|
|
3538
3538
|
.form-range::-webkit-slider-thumb {
|
|
3539
3539
|
width: 1rem;
|
|
3540
3540
|
height: 1rem;
|
|
3541
|
-
margin-top: -0.
|
|
3541
|
+
margin-top: -0.375rem;
|
|
3542
3542
|
-webkit-appearance: none;
|
|
3543
3543
|
appearance: none;
|
|
3544
|
-
background-color: var(--bs-
|
|
3544
|
+
background-color: var(--bs-primary);
|
|
3545
3545
|
border: 0;
|
|
3546
3546
|
border-radius: 1rem;
|
|
3547
3547
|
box-shadow: 0 0.1rem 0.25rem rgba(var(--bs-black-rgb), 0.1);
|
|
@@ -3555,24 +3555,24 @@ textarea.form-control-lg {
|
|
|
3555
3555
|
}
|
|
3556
3556
|
}
|
|
3557
3557
|
.form-range::-webkit-slider-thumb:active {
|
|
3558
|
-
background-color: var(--bs-
|
|
3558
|
+
background-color: var(--bs-primary);
|
|
3559
3559
|
}
|
|
3560
3560
|
.form-range::-webkit-slider-runnable-track {
|
|
3561
3561
|
width: 100%;
|
|
3562
|
-
height: 0.
|
|
3562
|
+
height: 0.25rem;
|
|
3563
3563
|
color: transparent;
|
|
3564
3564
|
cursor: pointer;
|
|
3565
3565
|
background-color: var(--bs-gray-300);
|
|
3566
3566
|
border-color: transparent;
|
|
3567
|
-
border-radius:
|
|
3568
|
-
box-shadow:
|
|
3567
|
+
border-radius: var(--bs-ref-spacer-6);
|
|
3568
|
+
box-shadow: none;
|
|
3569
3569
|
}
|
|
3570
3570
|
.form-range::-moz-range-thumb {
|
|
3571
3571
|
width: 1rem;
|
|
3572
3572
|
height: 1rem;
|
|
3573
3573
|
-moz-appearance: none;
|
|
3574
3574
|
appearance: none;
|
|
3575
|
-
background-color: var(--bs-
|
|
3575
|
+
background-color: var(--bs-primary);
|
|
3576
3576
|
border: 0;
|
|
3577
3577
|
border-radius: 1rem;
|
|
3578
3578
|
box-shadow: 0 0.1rem 0.25rem rgba(var(--bs-black-rgb), 0.1);
|
|
@@ -3586,17 +3586,17 @@ textarea.form-control-lg {
|
|
|
3586
3586
|
}
|
|
3587
3587
|
}
|
|
3588
3588
|
.form-range::-moz-range-thumb:active {
|
|
3589
|
-
background-color: var(--bs-
|
|
3589
|
+
background-color: var(--bs-primary);
|
|
3590
3590
|
}
|
|
3591
3591
|
.form-range::-moz-range-track {
|
|
3592
3592
|
width: 100%;
|
|
3593
|
-
height: 0.
|
|
3593
|
+
height: 0.25rem;
|
|
3594
3594
|
color: transparent;
|
|
3595
3595
|
cursor: pointer;
|
|
3596
3596
|
background-color: var(--bs-gray-300);
|
|
3597
3597
|
border-color: transparent;
|
|
3598
|
-
border-radius:
|
|
3599
|
-
box-shadow:
|
|
3598
|
+
border-radius: var(--bs-ref-spacer-6);
|
|
3599
|
+
box-shadow: none;
|
|
3600
3600
|
}
|
|
3601
3601
|
.form-range:disabled {
|
|
3602
3602
|
pointer-events: none;
|
|
@@ -3994,7 +3994,7 @@ textarea.form-control-lg {
|
|
|
3994
3994
|
--bs-dropdown-link-hover-color: rgb(var(--bs-gray-500-rgb));
|
|
3995
3995
|
--bs-dropdown-link-hover-bg: rgb(var(--bs-gray-100-rgb));
|
|
3996
3996
|
--bs-dropdown-link-active-color: var(--bs-white);
|
|
3997
|
-
--bs-dropdown-link-active-bg: var(--bs-
|
|
3997
|
+
--bs-dropdown-link-active-bg: var(--bs-primary);
|
|
3998
3998
|
--bs-dropdown-link-disabled-color: var(--bs-tertiary-color);
|
|
3999
3999
|
--bs-dropdown-item-padding-x: var(--bs-ref-spacer-4);
|
|
4000
4000
|
--bs-dropdown-item-padding-y: var(--bs-ref-spacer-2);
|
|
@@ -4261,7 +4261,7 @@ textarea.form-control-lg {
|
|
|
4261
4261
|
--bs-dropdown-divider-bg: var(--bs-border-color-translucent);
|
|
4262
4262
|
--bs-dropdown-link-hover-bg: rgba(var(--bs-white-rgb), 0.15);
|
|
4263
4263
|
--bs-dropdown-link-active-color: var(--bs-white);
|
|
4264
|
-
--bs-dropdown-link-active-bg: var(--bs-
|
|
4264
|
+
--bs-dropdown-link-active-bg: var(--bs-primary);
|
|
4265
4265
|
--bs-dropdown-link-disabled-color: var(--bs-gray-500);
|
|
4266
4266
|
--bs-dropdown-header-color: var(--bs-gray-500);
|
|
4267
4267
|
}
|
|
@@ -5311,8 +5311,8 @@ textarea.form-control-lg {
|
|
|
5311
5311
|
--bs-pagination-focus-bg: var(--bs-secondary-100);
|
|
5312
5312
|
--bs-pagination-focus-box-shadow: 0;
|
|
5313
5313
|
--bs-pagination-active-color: var(--bs-white);
|
|
5314
|
-
--bs-pagination-active-bg: var(--bs-
|
|
5315
|
-
--bs-pagination-active-border-color: var(--bs-
|
|
5314
|
+
--bs-pagination-active-bg: var(--bs-primary);
|
|
5315
|
+
--bs-pagination-active-border-color: var(--bs-primary);
|
|
5316
5316
|
--bs-pagination-disabled-color: var(--bs-gray-400);
|
|
5317
5317
|
--bs-pagination-disabled-bg: var(--bs-transparent);
|
|
5318
5318
|
--bs-pagination-disabled-border-color: var(--bs-border-color);
|
|
@@ -5563,8 +5563,8 @@ textarea.form-control-lg {
|
|
|
5563
5563
|
--bs-list-group-disabled-color: var(--bs-gray-600);
|
|
5564
5564
|
--bs-list-group-disabled-bg: transparent;
|
|
5565
5565
|
--bs-list-group-active-color: var(--bs-white);
|
|
5566
|
-
--bs-list-group-active-bg: var(--bs-
|
|
5567
|
-
--bs-list-group-active-border-color: var(--bs-
|
|
5566
|
+
--bs-list-group-active-bg: var(--bs-primary);
|
|
5567
|
+
--bs-list-group-active-border-color: var(--bs-primary);
|
|
5568
5568
|
display: flex;
|
|
5569
5569
|
flex-direction: column;
|
|
5570
5570
|
padding-left: 0;
|
|
@@ -7516,7 +7516,7 @@ body {
|
|
|
7516
7516
|
outline-offset: 2px;
|
|
7517
7517
|
}
|
|
7518
7518
|
.form-check-input:checked {
|
|
7519
|
-
border-color: var(--bs-
|
|
7519
|
+
border-color: var(--bs-primary);
|
|
7520
7520
|
}
|
|
7521
7521
|
.form-check-input:disabled:not(:checked, :indeterminate) {
|
|
7522
7522
|
background-color: var(--bs-gray-100);
|
|
@@ -7534,6 +7534,19 @@ body {
|
|
|
7534
7534
|
appearance: none;
|
|
7535
7535
|
}
|
|
7536
7536
|
|
|
7537
|
+
.form-range.form-range-value-indicator::-webkit-slider-runnable-track {
|
|
7538
|
+
background: linear-gradient(to right, var(--bs-primary) 0%, var(--bs-primary) var(--bs-form-range-component-value), var(--bs-gray-300) var(--bs-form-range-component-value), var(--bs-gray-300) 100%);
|
|
7539
|
+
}
|
|
7540
|
+
.form-range.form-range-value-indicator::-moz-range-track {
|
|
7541
|
+
background: linear-gradient(to right, var(--bs-primary) 0%, var(--bs-primary) var(--bs-form-range-component-value), var(--bs-gray-300) var(--bs-form-range-component-value), var(--bs-gray-300) 100%);
|
|
7542
|
+
}
|
|
7543
|
+
.form-range:disabled.form-range-value-indicator::-webkit-slider-runnable-track {
|
|
7544
|
+
background: linear-gradient(to right, var(--bs-gray-500) 0%, var(--bs-gray-500) var(--bs-form-range-component-value), var(--bs-gray-300) var(--bs-form-range-component-value), var(--bs-gray-300) 100%);
|
|
7545
|
+
}
|
|
7546
|
+
.form-range:disabled.form-range-value-indicator::-moz-range-track {
|
|
7547
|
+
background: linear-gradient(to right, var(--bs-gray-500) 0%, var(--bs-gray-500) var(--bs-form-range-component-value), var(--bs-gray-300) var(--bs-form-range-component-value), var(--bs-gray-300) 100%);
|
|
7548
|
+
}
|
|
7549
|
+
|
|
7537
7550
|
.form-text {
|
|
7538
7551
|
--bs-form-text-padding: 0 0.5rem;
|
|
7539
7552
|
--bs-form-text-gap: var(--bs-ref-spacer-1);
|
|
@@ -7609,24 +7622,24 @@ body {
|
|
|
7609
7622
|
border-color: var(--bs-input-focus-border-color);
|
|
7610
7623
|
box-shadow: var(--bs-input-focus-box-shadow);
|
|
7611
7624
|
}
|
|
7612
|
-
.input-group:has(.form-control.is-valid) {
|
|
7625
|
+
.input-group:has(.form-control.is-valid, .form-select.is-valid) {
|
|
7613
7626
|
border-color: var(--bs-form-valid-border-color);
|
|
7614
7627
|
box-shadow: 0 0 0 1px rgba(var(--bs-success-rgb), 1);
|
|
7615
7628
|
}
|
|
7616
|
-
.input-group:has(.form-control.is-valid) ~ .form-text {
|
|
7629
|
+
.input-group:has(.form-control.is-valid, .form-select.is-valid) ~ .form-text {
|
|
7617
7630
|
color: var(--bs-form-valid-border-color);
|
|
7618
7631
|
}
|
|
7619
|
-
.input-group:has(.form-control.is-valid) .input-group-validation-icon {
|
|
7632
|
+
.input-group:has(.form-control.is-valid, .form-select.is-valid) .input-group-validation-icon {
|
|
7620
7633
|
--bs-icon-color: var(--bs-success);
|
|
7621
7634
|
}
|
|
7622
|
-
.input-group:has(.form-control.is-invalid) {
|
|
7635
|
+
.input-group:has(.form-control.is-invalid, .form-select.is-invalid) {
|
|
7623
7636
|
border-color: var(--bs-form-invalid-border-color);
|
|
7624
7637
|
box-shadow: 0 0 0 1px rgba(var(--bs-danger-rgb), 1);
|
|
7625
7638
|
}
|
|
7626
|
-
.input-group:has(.form-control.is-invalid) ~ .form-text {
|
|
7639
|
+
.input-group:has(.form-control.is-invalid, .form-select.is-invalid) ~ .form-text {
|
|
7627
7640
|
color: var(--bs-form-invalid-border-color);
|
|
7628
7641
|
}
|
|
7629
|
-
.input-group:has(.form-control.is-invalid) .input-group-validation-icon {
|
|
7642
|
+
.input-group:has(.form-control.is-invalid, .form-select.is-invalid) .input-group-validation-icon {
|
|
7630
7643
|
--bs-icon-color: var(--bs-danger);
|
|
7631
7644
|
}
|
|
7632
7645
|
.input-group:has(.form-select:disabled), .input-group:has(.form-control:disabled) {
|
|
@@ -11731,6 +11744,7 @@ label .d-icon {
|
|
|
11731
11744
|
.d-select {
|
|
11732
11745
|
--bs-select-gap: 0.5rem;
|
|
11733
11746
|
--bs-select-menu-shadow: 0 8px 12px 0 rgba(35, 36, 38, 0.05);
|
|
11747
|
+
--bs-select-menu-z-index: 1000;
|
|
11734
11748
|
--bs-select-option-focus-bg: var(--bs-gray-100);
|
|
11735
11749
|
--bs-select-option-selected-color: var(--bs-secondary);
|
|
11736
11750
|
--bs-select-option-selected-bg: var(--bs-gray-100);
|
|
@@ -11814,6 +11828,7 @@ label .d-icon {
|
|
|
11814
11828
|
}
|
|
11815
11829
|
.d-select .d-select__menu-list {
|
|
11816
11830
|
top: calc(var(--bs-input-border-width) * 2);
|
|
11831
|
+
z-index: var(--bs-select-menu-z-index);
|
|
11817
11832
|
margin: calc(var(--bs-input-border-width) * -1);
|
|
11818
11833
|
background: var(--bs-white);
|
|
11819
11834
|
border-radius: var(--bs-input-border-radius);
|