@ardium-ui/ui 5.0.0-alpha.41 → 5.0.0-alpha.43

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (39) hide show
  1. package/fesm2022/ardium-ui-ui.mjs +1 -1
  2. package/fesm2022/ardium-ui-ui.mjs.map +1 -1
  3. package/lib/_internal/item-storages/dropdown-item-storage.d.ts +1 -0
  4. package/lib/slider/range-slider/range-slider.component.d.ts +1 -1
  5. package/package.json +1 -1
  6. package/prebuilt-themes/default/buttons/button.css +1 -1
  7. package/prebuilt-themes/default/buttons/fab.css +1 -1
  8. package/prebuilt-themes/default/buttons/icon-button.css +6 -6
  9. package/prebuilt-themes/default/calendar.css +3 -3
  10. package/prebuilt-themes/default/inputs/autocomplete-input.css +11 -11
  11. package/prebuilt-themes/default/inputs/date-input.css +8 -8
  12. package/prebuilt-themes/default/inputs/file-input.css +11 -11
  13. package/prebuilt-themes/default/inputs/hex-input.css +9 -9
  14. package/prebuilt-themes/default/inputs/input.css +8 -8
  15. package/prebuilt-themes/default/inputs/number-input.css +8 -8
  16. package/prebuilt-themes/default/inputs/password-input.css +9 -9
  17. package/prebuilt-themes/default/inputs/search-bar.css +8 -8
  18. package/prebuilt-themes/default/segment.css +3 -3
  19. package/prebuilt-themes/default/select.css +13 -13
  20. package/prebuilt-themes/default/slider.css +7 -7
  21. package/prebuilt-themes/default/tabber.css +1 -1
  22. package/prebuilt-themes/default/table.css +8 -8
  23. package/themes/default/buttons/button.scss +1 -1
  24. package/themes/default/buttons/fab.scss +1 -1
  25. package/themes/default/buttons/icon-button.scss +6 -6
  26. package/themes/default/calendar.scss +3 -3
  27. package/themes/default/inputs/autocomplete-input.scss +11 -11
  28. package/themes/default/inputs/date-input.scss +8 -8
  29. package/themes/default/inputs/file-input.scss +11 -11
  30. package/themes/default/inputs/hex-input.scss +9 -9
  31. package/themes/default/inputs/input.scss +8 -8
  32. package/themes/default/inputs/number-input.scss +8 -8
  33. package/themes/default/inputs/password-input.scss +9 -9
  34. package/themes/default/inputs/search-bar.scss +8 -8
  35. package/themes/default/segment.scss +3 -3
  36. package/themes/default/select.scss +13 -13
  37. package/themes/default/slider.scss +7 -7
  38. package/themes/default/tabber.scss +1 -1
  39. package/themes/default/table.scss +8 -8
@@ -12,6 +12,7 @@ export interface ItemStorageHost {
12
12
  readonly childrenFrom: Signal<string>;
13
13
  readonly itemsAlreadyGrouped: Signal<Nullable<boolean>>;
14
14
  readonly hideSelected: Signal<boolean>;
15
+ readonly isLoading: Signal<boolean>;
15
16
  readonly searchCaseSensitive: Signal<boolean>;
16
17
  readonly searchFn: Signal<SearchFn>;
17
18
  readonly compareWith: Signal<Nullable<CompareWithFn>>;
@@ -29,7 +29,7 @@ export declare class ArdiumRangeSliderComponent extends _AbstractSlider<SliderRa
29
29
  onPointerMove(event: MouseEvent | TouchEvent): void;
30
30
  protected _percentValueToValue(percent: number, handleId: number): SliderRange;
31
31
  protected readonly _handlePositions: import("@angular/core").Signal<[number, number]>;
32
- readonly currentHandle: import("@angular/core").WritableSignal<1 | 2 | null>;
32
+ readonly currentHandle: import("@angular/core").WritableSignal<2 | 1 | null>;
33
33
  onHandleFocus(event: FocusEvent, handleId: 1 | 2): void;
34
34
  onBlur(event: FocusEvent): void;
35
35
  static ɵfac: i0.ɵɵFactoryDeclaration<ArdiumRangeSliderComponent, never>;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ardium-ui/ui",
3
- "version": "5.0.0-alpha.41",
3
+ "version": "5.0.0-alpha.43",
4
4
  "peerDependencies": {
5
5
  "@angular/common": ">=18.0.0",
6
6
  "@angular/core": ">=18.0.0",
@@ -15,7 +15,7 @@
15
15
  --ard-button-overlay-active-opacity: 0.18;
16
16
  --ard-button-overlay-focus-visible-opacity: 0.24;
17
17
  --ard-button-overlay-disabled-opacity: 0.2;
18
- --ard-button-rounded-corner-radius: var(--ard-rounded-corner-radius, 0.375rem);
18
+ --ard-button-rounded-corner-radius: ;
19
19
  --ard-button-disabled-opacity: 0.6;
20
20
  }
21
21
 
@@ -11,7 +11,7 @@
11
11
  --ard-fab-overlay-active-opacity: 0.18;
12
12
  --ard-fab-overlay-focus-visible-opacity: 0.24;
13
13
  --ard-fab-overlay-disabled-opacity: 0.2;
14
- --ard-fab-rounded-corner-radius: var(--ard-rounded-corner-radius, 0.375rem);
14
+ --ard-fab-rounded-corner-radius: ;
15
15
  --ard-fab-disabled-opacity: 0.6;
16
16
  }
17
17
 
@@ -6,12 +6,12 @@
6
6
  --ard-icon-button-icon-font-size: 1.5em;
7
7
  --ard-icon-button-font-size-compact: 0.75rem;
8
8
  --ard-icon-button-font-weight: 600;
9
- --ard-icon-button-overlay-hover-opacity: var(--ard-button-overlay-hover-opacity, 0.04);
10
- --ard-icon-button-overlay-focus-opacity: var(--ard-button-overlay-focus-opacity, 0.12);
11
- --ard-icon-button-overlay-active-opacity: var(--ard-button-overlay-active-opacity, 0.18);
12
- --ard-icon-button-overlay-focus-visible-opacity: var(--ard-button-overlay-focus-visible-opacity, 0.24);
13
- --ard-icon-button-overlay-disabled-opacity: var(--ard-button-overlay-disabled-opacity, 0.2);
14
- --ard-icon-button-disabled-opacity: var(--ard-button-disabled-opacity, 0.6);
9
+ --ard-icon-button-overlay-hover-opacity: ;
10
+ --ard-icon-button-overlay-focus-opacity: ;
11
+ --ard-icon-button-overlay-active-opacity: ;
12
+ --ard-icon-button-overlay-focus-visible-opacity: ;
13
+ --ard-icon-button-overlay-disabled-opacity: ;
14
+ --ard-icon-button-disabled-opacity: ;
15
15
  }
16
16
 
17
17
  ard-icon-button {
@@ -6,19 +6,19 @@
6
6
  --ard-calendar-weekday-padding: 0 0 0.5rem 0;
7
7
  --ard-calendar-weekday-font-size: 0.875rem;
8
8
  --ard-calendar-weekday-font-weight: 500;
9
- --ard-calendar-weekday-color: var(--ard-text);
9
+ --ard-calendar-weekday-color: ;
10
10
  --ard-calendar-floating-month-transform: none;
11
11
  --ard-calendar-floating-month-padding: 0 0 0 1rem;
12
12
  --ard-calendar-floating-month-font-size: 0.875rem;
13
13
  --ard-calendar-floating-month-font-weight: 500;
14
- --ard-calendar-floating-month-color: var(--ard-text3);
14
+ --ard-calendar-floating-month-color: ;
15
15
  --ard-calendar-entry-padding: 0;
16
16
  --ard-calendar-entry-font-size: 0.875rem;
17
17
  --ard-calendar-entry-font-weight: 400;
18
18
  --ard-calendar-entry-border-radius: 9999px;
19
19
  --ard-calendar-entry-range-overlay-border-width: 1px;
20
20
  --ard-calendar-entry-range-overlay-border-style: dashed;
21
- --ard-calendar-entry-today-border-color: var(--ard-detail);
21
+ --ard-calendar-entry-today-border-color: ;
22
22
  --ard-calendar-entry-today-selected-border: 2px solid var(--ard-bg);
23
23
  --ard-calendar-entry-highlighted-overlay-opacity: 20%;
24
24
  --ard-calendar-entry-selected-overlay-opacity: 100%;
@@ -2,18 +2,18 @@
2
2
  * Should be applied to the first element in the component's template.
3
3
  */
4
4
  :root {
5
- --ard-autocomplete-input-height: var(--ard-form-field-height, 2.3125rem);
6
- --ard-autocomplete-input-height-compact: var(--ard-form-field-height-compact, 1.6875rem);
5
+ --ard-autocomplete-input-height: ;
6
+ --ard-autocomplete-input-height-compact: ;
7
7
  --ard-autocomplete-input-gap: 0.625rem;
8
- --ard-autocomplete-input-font-size: var(--ard-form-field-font-size, 1rem);
9
- --ard-autocomplete-input-font-size-compact: var(--ard-form-field-font-size-compact, 0.875rem);
8
+ --ard-autocomplete-input-font-size: ;
9
+ --ard-autocomplete-input-font-size-compact: ;
10
10
  --ard-autocomplete-input-line-height: 1.25;
11
11
  --ard-autocomplete-input-line-height-compact: 1;
12
12
  --ard-autocomplete-input-font-weight: 400;
13
- --ard-autocomplete-input-padding: var(--ard-form-field-padding, 0 0.375rem);
14
- --ard-autocomplete-input-padding-compact: var(--ard-form-field-padding-compact, 0 0.375rem);
15
- --ard-autocomplete-input-color: var(--ard-text);
16
- --ard-autocomplete-input-placeholder-color: var(--ard-text);
13
+ --ard-autocomplete-input-padding: ;
14
+ --ard-autocomplete-input-padding-compact: ;
15
+ --ard-autocomplete-input-color: ;
16
+ --ard-autocomplete-input-placeholder-color: ;
17
17
  --ard-autocomplete-input-placeholder-opacity: 60%;
18
18
  --ard-autocomplete-input-min-width: 10rem;
19
19
  --ard-autocomplete-input-max-width: 100%;
@@ -25,10 +25,10 @@
25
25
  --ard-autocomplete-input-option-padding-compact: 0.25rem 0.5rem;
26
26
  --ard-autocomplete-input-font-size: 1rem;
27
27
  --ard-autocomplete-input-font-size-compact: 0.875rem;
28
- --ard-autocomplete-input-color: var(--ard-text2);
29
- --ard-autocomplete-input-highlighted-background: var(--ard-darken-overlay-light);
28
+ --ard-autocomplete-input-color: ;
29
+ --ard-autocomplete-input-highlighted-background: ;
30
30
  --ard-autocomplete-input-highlighted-font-weight: 400;
31
- --ard-autocomplete-input-selected-background: var(--ard-darken-overlay-medium);
31
+ --ard-autocomplete-input-selected-background: ;
32
32
  --ard-autocomplete-input-selected-font-weight: 500;
33
33
  --ard-autocomplete-input-disabled-opacity: 50%;
34
34
  }
@@ -2,18 +2,18 @@
2
2
  * Should be applied to the first element in the component's template.
3
3
  */
4
4
  :root {
5
- --ard-date-input-height: var(--ard-form-field-height, 2.3125rem);
6
- --ard-date-input-height-compact: var(--ard-form-field-height-compact, 1.6875rem);
5
+ --ard-date-input-height: ;
6
+ --ard-date-input-height-compact: ;
7
7
  --ard-date-input-gap: 0.625rem;
8
- --ard-date-input-font-size: var(--ard-form-field-font-size, 1rem);
9
- --ard-date-input-font-size-compact: var(--ard-form-field-font-size-compact, 0.875rem);
8
+ --ard-date-input-font-size: ;
9
+ --ard-date-input-font-size-compact: ;
10
10
  --ard-date-input-line-height: 1.25;
11
11
  --ard-date-input-line-height-compact: 1;
12
12
  --ard-date-input-font-weight: 400;
13
- --ard-date-input-padding: var(--ard-form-field-padding, 0 0.375rem);
14
- --ard-date-input-padding-compact: var(--ard-form-field-padding-compact, 0 0.375rem);
15
- --ard-date-input-color: var(--ard-text);
16
- --ard-date-input-placeholder-color: var(--ard-text);
13
+ --ard-date-input-padding: ;
14
+ --ard-date-input-padding-compact: ;
15
+ --ard-date-input-color: ;
16
+ --ard-date-input-placeholder-color: ;
17
17
  --ard-date-input-placeholder-opacity: 60%;
18
18
  --ard-date-input-padding: 0 0 0 0.375rem;
19
19
  --ard-date-input-input-padding: 0 2.625rem 0 0.375rem;
@@ -2,18 +2,18 @@
2
2
  * Should be applied to the first element in the component's template.
3
3
  */
4
4
  :root {
5
- --ard-file-input-height: var(--ard-form-field-height, 2.3125rem);
6
- --ard-file-input-height-compact: var(--ard-form-field-height-compact, 1.6875rem);
5
+ --ard-file-input-height: ;
6
+ --ard-file-input-height-compact: ;
7
7
  --ard-file-input-gap: 0.625rem;
8
- --ard-file-input-font-size: var(--ard-form-field-font-size, 1rem);
9
- --ard-file-input-font-size-compact: var(--ard-form-field-font-size-compact, 0.875rem);
8
+ --ard-file-input-font-size: ;
9
+ --ard-file-input-font-size-compact: ;
10
10
  --ard-file-input-line-height: 1.25;
11
11
  --ard-file-input-line-height-compact: 1;
12
12
  --ard-file-input-font-weight: 400;
13
- --ard-file-input-padding: var(--ard-form-field-padding, 0 0.375rem);
14
- --ard-file-input-padding-compact: var(--ard-form-field-padding-compact, 0 0.375rem);
15
- --ard-file-input-color: var(--ard-text);
16
- --ard-file-input-placeholder-color: var(--ard-text);
13
+ --ard-file-input-padding: ;
14
+ --ard-file-input-padding-compact: ;
15
+ --ard-file-input-color: ;
16
+ --ard-file-input-placeholder-color: ;
17
17
  --ard-file-input-placeholder-opacity: 60%;
18
18
  --ard-file-input-min-width: 10rem;
19
19
  --ard-file-input-max-width: 100%;
@@ -28,10 +28,10 @@
28
28
  --ard-file-input-browse-button-border-radius: 9999px;
29
29
  --ard-file-input-browse-button-background: none;
30
30
  --ard-file-input-browse-button-padding: 0;
31
- --ard-file-input-browse-button-color: var(--ard-text2);
32
- --ard-file-input-browse-button-color-error: rgb(var(--ard-danger-700));
31
+ --ard-file-input-browse-button-color: ;
32
+ --ard-file-input-browse-button-color-error: ;
33
33
  --ard-file-input-browse-button-overlay-offset: 0rem;
34
- --ard-file-input-browse-button-overlay-color: var(--ard-overlay);
34
+ --ard-file-input-browse-button-overlay-color: ;
35
35
  --ard-file-input-browse-button-overlay-hover-opacity: 4%;
36
36
  --ard-file-input-browse-button-overlay-focus-opacity: 0;
37
37
  --ard-file-input-browse-button-overlay-active-opacity: 12%;
@@ -2,23 +2,23 @@
2
2
  * Should be applied to the first element in the component's template.
3
3
  */
4
4
  :root {
5
- --ard-hex-input-height: var(--ard-form-field-height, 2.3125rem);
6
- --ard-hex-input-height-compact: var(--ard-form-field-height-compact, 1.6875rem);
5
+ --ard-hex-input-height: ;
6
+ --ard-hex-input-height-compact: ;
7
7
  --ard-hex-input-gap: 0.625rem;
8
- --ard-hex-input-font-size: var(--ard-form-field-font-size, 1rem);
9
- --ard-hex-input-font-size-compact: var(--ard-form-field-font-size-compact, 0.875rem);
8
+ --ard-hex-input-font-size: ;
9
+ --ard-hex-input-font-size-compact: ;
10
10
  --ard-hex-input-line-height: 1.25;
11
11
  --ard-hex-input-line-height-compact: 1;
12
12
  --ard-hex-input-font-weight: 400;
13
- --ard-hex-input-padding: var(--ard-form-field-padding, 0 0.375rem);
14
- --ard-hex-input-padding-compact: var(--ard-form-field-padding-compact, 0 0.375rem);
15
- --ard-hex-input-color: var(--ard-text);
16
- --ard-hex-input-placeholder-color: var(--ard-text);
13
+ --ard-hex-input-padding: ;
14
+ --ard-hex-input-padding-compact: ;
15
+ --ard-hex-input-color: ;
16
+ --ard-hex-input-placeholder-color: ;
17
17
  --ard-hex-input-placeholder-opacity: 60%;
18
18
  --ard-hex-input-min-width: 10rem;
19
19
  --ard-hex-input-max-width: 100%;
20
20
  --ard-hex-input-hash-margin: 0 0 -0.5rem 0;
21
- --ard-hex-input-hash-color: var(--ard-text);
21
+ --ard-hex-input-hash-color: ;
22
22
  --ard-hex-input-hash-opacity: 70%;
23
23
  }
24
24
 
@@ -2,18 +2,18 @@
2
2
  * Should be applied to the first element in the component's template.
3
3
  */
4
4
  :root {
5
- --ard-input-height: var(--ard-form-field-height, 2.3125rem);
6
- --ard-input-height-compact: var(--ard-form-field-height-compact, 1.6875rem);
5
+ --ard-input-height: ;
6
+ --ard-input-height-compact: ;
7
7
  --ard-input-gap: 0.625rem;
8
- --ard-input-font-size: var(--ard-form-field-font-size, 1rem);
9
- --ard-input-font-size-compact: var(--ard-form-field-font-size-compact, 0.875rem);
8
+ --ard-input-font-size: ;
9
+ --ard-input-font-size-compact: ;
10
10
  --ard-input-line-height: 1.25;
11
11
  --ard-input-line-height-compact: 1;
12
12
  --ard-input-font-weight: 400;
13
- --ard-input-padding: var(--ard-form-field-padding, 0 0.375rem);
14
- --ard-input-padding-compact: var(--ard-form-field-padding-compact, 0 0.375rem);
15
- --ard-input-color: var(--ard-text);
16
- --ard-input-placeholder-color: var(--ard-text);
13
+ --ard-input-padding: ;
14
+ --ard-input-padding-compact: ;
15
+ --ard-input-color: ;
16
+ --ard-input-placeholder-color: ;
17
17
  --ard-input-placeholder-opacity: 60%;
18
18
  --ard-input-min-width: 10rem;
19
19
  --ard-input-max-width: 100%;
@@ -2,18 +2,18 @@
2
2
  * Should be applied to the first element in the component's template.
3
3
  */
4
4
  :root {
5
- --ard-number-input-height: var(--ard-form-field-height, 2.3125rem);
6
- --ard-number-input-height-compact: var(--ard-form-field-height-compact, 1.6875rem);
5
+ --ard-number-input-height: ;
6
+ --ard-number-input-height-compact: ;
7
7
  --ard-number-input-gap: 0.625rem;
8
- --ard-number-input-font-size: var(--ard-form-field-font-size, 1rem);
9
- --ard-number-input-font-size-compact: var(--ard-form-field-font-size-compact, 0.875rem);
8
+ --ard-number-input-font-size: ;
9
+ --ard-number-input-font-size-compact: ;
10
10
  --ard-number-input-line-height: 1.25;
11
11
  --ard-number-input-line-height-compact: 1;
12
12
  --ard-number-input-font-weight: 400;
13
- --ard-number-input-padding: var(--ard-form-field-padding, 0 0.375rem);
14
- --ard-number-input-padding-compact: var(--ard-form-field-padding-compact, 0 0.375rem);
15
- --ard-number-input-color: var(--ard-text);
16
- --ard-number-input-placeholder-color: var(--ard-text);
13
+ --ard-number-input-padding: ;
14
+ --ard-number-input-padding-compact: ;
15
+ --ard-number-input-color: ;
16
+ --ard-number-input-placeholder-color: ;
17
17
  --ard-number-input-placeholder-opacity: 60%;
18
18
  --ard-number-input-width: 9.5rem;
19
19
  --ard-number-input-rounded-border-radius: 8px;
@@ -2,18 +2,18 @@
2
2
  * Should be applied to the first element in the component's template.
3
3
  */
4
4
  :root {
5
- --ard-password-input-height: var(--ard-form-field-height, 2.3125rem);
6
- --ard-password-input-height-compact: var(--ard-form-field-height-compact, 1.6875rem);
5
+ --ard-password-input-height: ;
6
+ --ard-password-input-height-compact: ;
7
7
  --ard-password-input-gap: 0.625rem;
8
- --ard-password-input-font-size: var(--ard-form-field-font-size, 1rem);
9
- --ard-password-input-font-size-compact: var(--ard-form-field-font-size-compact, 0.875rem);
8
+ --ard-password-input-font-size: ;
9
+ --ard-password-input-font-size-compact: ;
10
10
  --ard-password-input-line-height: 1.25;
11
11
  --ard-password-input-line-height-compact: 1;
12
12
  --ard-password-input-font-weight: 400;
13
- --ard-password-input-padding: var(--ard-form-field-padding, 0 0.375rem);
14
- --ard-password-input-padding-compact: var(--ard-form-field-padding-compact, 0 0.375rem);
15
- --ard-password-input-color: var(--ard-text);
16
- --ard-password-input-placeholder-color: var(--ard-text);
13
+ --ard-password-input-padding: ;
14
+ --ard-password-input-padding-compact: ;
15
+ --ard-password-input-color: ;
16
+ --ard-password-input-placeholder-color: ;
17
17
  --ard-password-input-placeholder-opacity: 60%;
18
18
  --ard-password-input-min-width: 10rem;
19
19
  --ard-password-input-max-width: 100%;
@@ -24,7 +24,7 @@
24
24
  --ard-password-input-reveal-button-width: unset;
25
25
  --ard-password-input-reveal-button-aspect-ratio: 1;
26
26
  --ard-password-input-reveal-button-padding: 0;
27
- --ard-password-input-reveal-button-color: var(--ard-text);
27
+ --ard-password-input-reveal-button-color: ;
28
28
  --ard-password-input-reveal-button-border-radius: 9999px;
29
29
  --ard-password-input-reveal-button-border: none;
30
30
  --ard-password-input-reveal-button-background: transparent;
@@ -2,18 +2,18 @@
2
2
  * Should be applied to the first element in the component's template.
3
3
  */
4
4
  :root {
5
- --ard-search-bar-height: var(--ard-form-field-height, 2.3125rem);
6
- --ard-search-bar-height-compact: var(--ard-form-field-height-compact, 1.6875rem);
5
+ --ard-search-bar-height: ;
6
+ --ard-search-bar-height-compact: ;
7
7
  --ard-search-bar-gap: 0.625rem;
8
- --ard-search-bar-font-size: var(--ard-form-field-font-size, 1rem);
9
- --ard-search-bar-font-size-compact: var(--ard-form-field-font-size-compact, 0.875rem);
8
+ --ard-search-bar-font-size: ;
9
+ --ard-search-bar-font-size-compact: ;
10
10
  --ard-search-bar-line-height: 1.25;
11
11
  --ard-search-bar-line-height-compact: 1;
12
12
  --ard-search-bar-font-weight: 400;
13
- --ard-search-bar-padding: var(--ard-form-field-padding, 0 0.375rem);
14
- --ard-search-bar-padding-compact: var(--ard-form-field-padding-compact, 0 0.375rem);
15
- --ard-search-bar-color: var(--ard-text);
16
- --ard-search-bar-placeholder-color: var(--ard-text);
13
+ --ard-search-bar-padding: ;
14
+ --ard-search-bar-padding-compact: ;
15
+ --ard-search-bar-color: ;
16
+ --ard-search-bar-placeholder-color: ;
17
17
  --ard-search-bar-placeholder-opacity: 60%;
18
18
  --ard-search-bar-min-width: 10rem;
19
19
  --ard-search-bar-max-width: 100%;
@@ -1,8 +1,8 @@
1
1
  :root {
2
2
  --ard-segment-margin: 0;
3
3
  --ard-segment-padding: 0.15rem;
4
- --ard-segment-option-gap: var(--ard-segment-padding, 0.15rem);
5
- --ard-segment-font-family: var(--ard-font-family);
4
+ --ard-segment-option-gap: ;
5
+ --ard-segment-font-family: ;
6
6
  --ard-segment-font-size: 0.875rem;
7
7
  --ard-segment-font-size-compact: 0.75rem;
8
8
  --ard-segment-rounded-border-radius: 0.5rem;
@@ -17,7 +17,7 @@
17
17
  --ard-segment-option-active-bg-opacity: 12%;
18
18
  --ard-segment-option-active-keyboard-bg-opacity: 34%;
19
19
  --ard-segment-option-selected-bg-opacity: 16%;
20
- --ard-segment-border-color: var(--ard-border-light);
20
+ --ard-segment-border-color: ;
21
21
  }
22
22
 
23
23
  .ard-segment-container {
@@ -1,18 +1,18 @@
1
1
  :root {
2
- --ard-select-height: var(--ard-form-field-height, 2.3125rem);
3
- --ard-select-height-compact: var(--ard-form-field-height-compact, 1.6875rem);
2
+ --ard-select-height: ;
3
+ --ard-select-height-compact: ;
4
4
  --ard-select-gap: 0.625rem;
5
5
  --ard-select-gap-compact: 0.5rem;
6
6
  --ard-select-controls-gap: 0.625rem;
7
7
  --ard-select-controls-gap-compact: 0.5rem;
8
8
  --ard-select-padding: 0 1em 0 0.375em;
9
9
  --ard-select-padding-compact: 0 0.625em 0 0.375em;
10
- --ard-select-font-size: var(--ard-form-field-font-size, 1rem);
11
- --ard-select-font-size-compact: var(--ard-form-field-font-size-compact, 0.875rem);
12
- --ard-select-text-color: var(--ard-text, rgba(0, 0, 0, 100%));
13
- --ard-select-placeholder-color: var(--ard-text3, rgba(0, 0, 0, 75%));
10
+ --ard-select-font-size: ;
11
+ --ard-select-font-size-compact: ;
12
+ --ard-select-text-color: ;
13
+ --ard-select-placeholder-color: ;
14
14
  --ard-select-search-min-width: 10ch;
15
- --ard-select-dropdown-arrow-color: var(--ard-detail, rgba(0, 0, 0, 60%));
15
+ --ard-select-dropdown-arrow-color: ;
16
16
  --ard-select-dropdown-arrow-active-transform: rotate(180deg);
17
17
  --ard-select-dropdown-arrow-transition: 0.2s ease-in-out;
18
18
  --ard-select-multiselect-padding: 0.25em 0;
@@ -21,8 +21,8 @@
21
21
  --ard-select-dropdown-max-width: max(25em, 100%);
22
22
  --ard-select-dropdown-min-width: 100%;
23
23
  --ard-select-dropdown-max-height: 15em;
24
- --ard-select-dropdown-font-size: var(--ard-select-font-size, var(--ard-form-field-font-size, 1rem));
25
- --ard-select-dropdown-font-size-compact: var(--ard-select-font-size-compact, var(--ard-form-field-font-size-compact, 0.875rem));
24
+ --ard-select-dropdown-font-size: ;
25
+ --ard-select-dropdown-font-size-compact: ;
26
26
  --ard-select-dropdown-padding: 0.375em 0.625em;
27
27
  --ard-select-dropdown-gap: 0;
28
28
  --ard-select-dropdown-optgroup-label-font-size: 0.875em;
@@ -30,11 +30,11 @@
30
30
  --ard-select-dropdown-optgroup-label-letter-spacing: 0.25px;
31
31
  --ard-select-dropdown-optgroup-label-padding: 0.375em 0.625em 0.0625em 0.625em;
32
32
  --ard-select-dropdown-option-padding: 0.375em 0.625em;
33
- --ard-select-dropdown-option-text-color: var(--ard-text2, rgba(0, 0, 0, 87%));
34
- --ard-select-dropdown-option-highlighted-bg: var(--ard-darken-overlay-light, rgba(0, 0, 0, 5%));
33
+ --ard-select-dropdown-option-text-color: ;
34
+ --ard-select-dropdown-option-highlighted-bg: ;
35
35
  --ard-select-dropdown-option-selected-font-weight: 500;
36
- --ard-select-dropdown-option-selected-bg: var(--ard-darken-overlay-medium, rgba(0, 0, 0, 10%));
37
- --ard-select-dropdown-option-selected-highlighted-bg: var(--ard-darken-overlay-medium-strong, rgba(0, 0, 0, 13%));
36
+ --ard-select-dropdown-option-selected-bg: ;
37
+ --ard-select-dropdown-option-selected-highlighted-bg: ;
38
38
  --ard-select-dropdown-option-disabled-opacity: 50%;
39
39
  --ard-select-dropdown-add-custom-gap: 0.375rem;
40
40
  --ard-select-dropdown-add-custom-label-font-size: 85%;
@@ -1,20 +1,20 @@
1
1
  :root {
2
- --ard-slider-font-size: var(--ard-form-field-font-size, 1rem);
3
- --ard-slider-font-size-compact: var(--ard-form-field-font-size-compact, 0.875rem);
2
+ --ard-slider-font-size: ;
3
+ --ard-slider-font-size-compact: ;
4
4
  --ard-slider-width: 100%;
5
5
  --ard-slider-padding: 0 calc(var(--ard-slider-handle-size, 1.25em) / 2);
6
6
  --ard-slider-track-height: 0.25em;
7
- --ard-slider-track-color: var(--ard-cmpcl--bg-colored);
7
+ --ard-slider-track-color: ;
8
8
  --ard-slider-track-opacity: 20%;
9
9
  --ard-slider-track-border-radius: 9999px;
10
10
  --ard-slider-active-track-height: calc(100% + 0.125em);
11
- --ard-slider-active-color: var(--ard-cmpcl--bg-colored);
11
+ --ard-slider-active-color: ;
12
12
  --ard-slider-active-track-opacity: 100%;
13
13
  --ard-slider-value-tick-size: 0.125em;
14
14
  --ard-slider-value-tick-opacity: 30%;
15
15
  --ard-slider-track-hitbox-size: calc(var(--ard-slider-handle-size, 1.25em) / 2);
16
16
  --ard-slider-handle-size: 1.25em;
17
- --ard-slider-handle-bg: var(--ard-cmpcl--bg-colored);
17
+ --ard-slider-handle-bg: ;
18
18
  --ard-slider-handle-border: none;
19
19
  --ard-slider-handle-border-radius: 9999px;
20
20
  --ard-slider-handle-hitbox-size: 0.375em;
@@ -24,8 +24,8 @@
24
24
  --ard-slider-handle-overlay-active-opacity: 25%;
25
25
  --ard-slider-label-font-size: 0.875rem;
26
26
  --ard-slider-label-padding-top: 0.2em;
27
- --ard-slider-label-bg: var(--ard-text3);
28
- --ard-slider-label-color: var(--ard-text2-alt);
27
+ --ard-slider-label-bg: ;
28
+ --ard-slider-label-color: ;
29
29
  --ard-slider-label-height: 2em;
30
30
  --ard-slider-label-border: none;
31
31
  --ard-slider-label-border-radius: 0.375em;
@@ -8,7 +8,7 @@
8
8
  --ard-tabber-tab-gap: 0;
9
9
  --ard-tabber-tab-content-gap: 0.375rem;
10
10
  --ard-tabber-separator-border: 1px solid var(--ard-detail-ultralight, rgba(0, 0, 0, 12%));
11
- --ard-tabber-tab-overlay-color: var(--ard-bg-alt, black);
11
+ --ard-tabber-tab-overlay-color: ;
12
12
  --ard-tabber-tab-hover-opacity: 4%;
13
13
  --ard-tabber-tab-active-opacity: 12%;
14
14
  --ard-tabber-tab-focus-visible-opacity: 18%;
@@ -1,15 +1,15 @@
1
1
  .ard-table {
2
2
  border-collapse: collapse;
3
3
  background: var(--ard-bg);
4
- --ard-_table-header-border: var(--ard-cmpcl--border);
5
- --ard-_table-header-border-light: var(--ard-cmpcl--border-light);
4
+ --ard-_table-header-border: ;
5
+ --ard-_table-header-border-light: ;
6
6
  --ard-_table-border: ARD.$border;
7
- --ard-_table-header-background: var(--ard-cmpcl--bg);
8
- --ard-_table-header-background-light: var(--ard-cmpcl--bg-header);
9
- --ard-_table-header-color: var(--ard-cmpcl--content);
10
- --ard-_table-header-color-on-bg: var(--ard-cmpcl--on-bg);
11
- --ard-_table-overlay: var(--ard-cmpcl--overlay-rgb);
12
- --ard-_table-overlay-colorless: var(--ard-overlay-rgb);
7
+ --ard-_table-header-background: ;
8
+ --ard-_table-header-background-light: ;
9
+ --ard-_table-header-color: ;
10
+ --ard-_table-header-color-on-bg: ;
11
+ --ard-_table-overlay: ;
12
+ --ard-_table-overlay-colorless: ;
13
13
  }
14
14
  .ard-table.ard-color-none {
15
15
  --ard-cmpcl--bg: var(--ard-bg);
@@ -17,7 +17,7 @@
17
17
  --ard-button-overlay-active-opacity: 0.18;
18
18
  --ard-button-overlay-focus-visible-opacity: 0.24;
19
19
  --ard-button-overlay-disabled-opacity: 0.2;
20
- --ard-button-rounded-corner-radius: var(--ard-rounded-corner-radius, 0.375rem);
20
+ --ard-button-rounded-corner-radius: ;
21
21
  --ard-button-disabled-opacity: 0.6;
22
22
  }
23
23
 
@@ -14,7 +14,7 @@
14
14
  --ard-fab-overlay-active-opacity: 0.18;
15
15
  --ard-fab-overlay-focus-visible-opacity: 0.24;
16
16
  --ard-fab-overlay-disabled-opacity: 0.2;
17
- --ard-fab-rounded-corner-radius: var(--ard-rounded-corner-radius, 0.375rem);
17
+ --ard-fab-rounded-corner-radius: ;
18
18
  --ard-fab-disabled-opacity: 0.6;
19
19
  }
20
20
 
@@ -8,12 +8,12 @@
8
8
  --ard-icon-button-icon-font-size: 1.5em;
9
9
  --ard-icon-button-font-size-compact: 0.75rem;
10
10
  --ard-icon-button-font-weight: 600;
11
- --ard-icon-button-overlay-hover-opacity: var(--ard-button-overlay-hover-opacity, 0.04);
12
- --ard-icon-button-overlay-focus-opacity: var(--ard-button-overlay-focus-opacity, 0.12);
13
- --ard-icon-button-overlay-active-opacity: var(--ard-button-overlay-active-opacity, 0.18);
14
- --ard-icon-button-overlay-focus-visible-opacity: var(--ard-button-overlay-focus-visible-opacity, 0.24);
15
- --ard-icon-button-overlay-disabled-opacity: var(--ard-button-overlay-disabled-opacity, 0.2);
16
- --ard-icon-button-disabled-opacity: var(--ard-button-disabled-opacity, 0.6);
11
+ --ard-icon-button-overlay-hover-opacity: ;
12
+ --ard-icon-button-overlay-focus-opacity: ;
13
+ --ard-icon-button-overlay-active-opacity: ;
14
+ --ard-icon-button-overlay-focus-visible-opacity: ;
15
+ --ard-icon-button-overlay-disabled-opacity: ;
16
+ --ard-icon-button-disabled-opacity: ;
17
17
  }
18
18
 
19
19
  ard-icon-button {
@@ -11,19 +11,19 @@
11
11
  --ard-calendar-weekday-padding: 0 0 0.5rem 0;
12
12
  --ard-calendar-weekday-font-size: 0.875rem;
13
13
  --ard-calendar-weekday-font-weight: 500;
14
- --ard-calendar-weekday-color: #{ARD.$text};
14
+ --ard-calendar-weekday-color: ;
15
15
  --ard-calendar-floating-month-transform: none;
16
16
  --ard-calendar-floating-month-padding: 0 0 0 1rem;
17
17
  --ard-calendar-floating-month-font-size: 0.875rem;
18
18
  --ard-calendar-floating-month-font-weight: 500;
19
- --ard-calendar-floating-month-color: #{ARD.$text3};
19
+ --ard-calendar-floating-month-color: ;
20
20
  --ard-calendar-entry-padding: 0;
21
21
  --ard-calendar-entry-font-size: 0.875rem;
22
22
  --ard-calendar-entry-font-weight: 400;
23
23
  --ard-calendar-entry-border-radius: 9999px;
24
24
  --ard-calendar-entry-range-overlay-border-width: 1px;
25
25
  --ard-calendar-entry-range-overlay-border-style: dashed;
26
- --ard-calendar-entry-today-border-color: #{ARD.$detail};
26
+ --ard-calendar-entry-today-border-color: ;
27
27
  --ard-calendar-entry-today-selected-border: 2px solid #{ARD.$bg};
28
28
  --ard-calendar-entry-highlighted-overlay-opacity: 20%;
29
29
  --ard-calendar-entry-selected-overlay-opacity: 100%;
@@ -4,18 +4,18 @@
4
4
  @use '../../variables' as ARD;
5
5
 
6
6
  :root {
7
- --ard-autocomplete-input-height: var(--ard-form-field-height, 2.3125rem);
8
- --ard-autocomplete-input-height-compact: var(--ard-form-field-height-compact, 1.6875rem);
7
+ --ard-autocomplete-input-height: ;
8
+ --ard-autocomplete-input-height-compact: ;
9
9
  --ard-autocomplete-input-gap: 0.625rem;
10
- --ard-autocomplete-input-font-size: var(--ard-form-field-font-size, 1rem);
11
- --ard-autocomplete-input-font-size-compact: var(--ard-form-field-font-size-compact, 0.875rem);
10
+ --ard-autocomplete-input-font-size: ;
11
+ --ard-autocomplete-input-font-size-compact: ;
12
12
  --ard-autocomplete-input-line-height: 1.25;
13
13
  --ard-autocomplete-input-line-height-compact: 1;
14
14
  --ard-autocomplete-input-font-weight: 400;
15
- --ard-autocomplete-input-padding: var(--ard-form-field-padding, 0 0.375rem);
16
- --ard-autocomplete-input-padding-compact: var(--ard-form-field-padding-compact, 0 0.375rem);
17
- --ard-autocomplete-input-color: #{ARD.$text};
18
- --ard-autocomplete-input-placeholder-color: #{ARD.$text};
15
+ --ard-autocomplete-input-padding: ;
16
+ --ard-autocomplete-input-padding-compact: ;
17
+ --ard-autocomplete-input-color: ;
18
+ --ard-autocomplete-input-placeholder-color: ;
19
19
  --ard-autocomplete-input-placeholder-opacity: 60%;
20
20
 
21
21
  --ard-autocomplete-input-min-width: 10rem;
@@ -28,10 +28,10 @@
28
28
  --ard-autocomplete-input-option-padding-compact: 0.25rem 0.5rem;
29
29
  --ard-autocomplete-input-font-size: 1rem;
30
30
  --ard-autocomplete-input-font-size-compact: 0.875rem;
31
- --ard-autocomplete-input-color: #{ARD.$text2};
32
- --ard-autocomplete-input-highlighted-background: #{ARD.$darken-overlay-light};
31
+ --ard-autocomplete-input-color: ;
32
+ --ard-autocomplete-input-highlighted-background: ;
33
33
  --ard-autocomplete-input-highlighted-font-weight: 400;
34
- --ard-autocomplete-input-selected-background: #{ARD.$darken-overlay-medium};
34
+ --ard-autocomplete-input-selected-background: ;
35
35
  --ard-autocomplete-input-selected-font-weight: 500;
36
36
  --ard-autocomplete-input-disabled-opacity: 50%;
37
37
  }
@@ -2,18 +2,18 @@
2
2
  @use '../../variables' as ARD;
3
3
 
4
4
  :root {
5
- --ard-date-input-height: var(--ard-form-field-height, 2.3125rem);
6
- --ard-date-input-height-compact: var(--ard-form-field-height-compact, 1.6875rem);
5
+ --ard-date-input-height: ;
6
+ --ard-date-input-height-compact: ;
7
7
  --ard-date-input-gap: 0.625rem;
8
- --ard-date-input-font-size: var(--ard-form-field-font-size, 1rem);
9
- --ard-date-input-font-size-compact: var(--ard-form-field-font-size-compact, 0.875rem);
8
+ --ard-date-input-font-size: ;
9
+ --ard-date-input-font-size-compact: ;
10
10
  --ard-date-input-line-height: 1.25;
11
11
  --ard-date-input-line-height-compact: 1;
12
12
  --ard-date-input-font-weight: 400;
13
- --ard-date-input-padding: var(--ard-form-field-padding, 0 0.375rem);
14
- --ard-date-input-padding-compact: var(--ard-form-field-padding-compact, 0 0.375rem);
15
- --ard-date-input-color: #{ARD.$text};
16
- --ard-date-input-placeholder-color: #{ARD.$text};
13
+ --ard-date-input-padding: ;
14
+ --ard-date-input-padding-compact: ;
15
+ --ard-date-input-color: ;
16
+ --ard-date-input-placeholder-color: ;
17
17
  --ard-date-input-placeholder-opacity: 60%;
18
18
 
19
19
  --ard-date-input-padding: 0 0 0 0.375rem;