@trebired/frontend 7.1.16 → 7.1.18

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 (45) hide show
  1. package/CHANGELOG.md +4 -0
  2. package/dist/actions/styles/index.scss +45 -45
  3. package/dist/config/scss.d.ts.map +1 -1
  4. package/dist/config/scss.js +3 -5
  5. package/dist/config/scss.js.map +1 -1
  6. package/dist/flash/styles/index.scss +19 -19
  7. package/dist/inputs/advanced/checkbox/styles.scss +11 -11
  8. package/dist/inputs/advanced/dropdown/styles/base.scss +4 -4
  9. package/dist/inputs/advanced/dropdown/styles/portaled.scss +3 -3
  10. package/dist/inputs/advanced/input/styles/file.scss +3 -3
  11. package/dist/inputs/advanced/radio/styles.scss +8 -8
  12. package/dist/inputs/advanced/tabs/styles.scss +21 -21
  13. package/dist/inputs/advanced/toggle/styles.scss +4 -4
  14. package/dist/inputs/styles/cropper-internals.scss +28 -28
  15. package/dist/inputs/styles/cropper.scss +27 -27
  16. package/dist/inputs/styles/upload.scss +40 -40
  17. package/dist/language/styles/index.scss +3 -3
  18. package/dist/logs/styles.scss +2 -2
  19. package/dist/modal/styles/index.scss +20 -20
  20. package/dist/namespace/css-var.d.ts +6 -0
  21. package/dist/namespace/css-var.d.ts.map +1 -0
  22. package/dist/namespace/css-var.js +47 -0
  23. package/dist/namespace/css-var.js.map +1 -0
  24. package/dist/namespace/index.d.ts.map +1 -1
  25. package/dist/namespace/index.js +2 -1
  26. package/dist/namespace/index.js.map +1 -1
  27. package/dist/popover/styles/index.scss +17 -17
  28. package/dist/primitives/styles/_card.scss +16 -16
  29. package/dist/primitives/styles/_controls.scss +58 -58
  30. package/dist/primitives/styles/_display.scss +12 -12
  31. package/dist/primitives/styles/_indicators.scss +5 -5
  32. package/dist/src/config/scss.d.ts.map +1 -1
  33. package/dist/src/config/scss.js +3 -5
  34. package/dist/src/config/scss.js.map +1 -1
  35. package/dist/src/namespace/css-var.d.ts +6 -0
  36. package/dist/src/namespace/css-var.d.ts.map +1 -0
  37. package/dist/src/namespace/css-var.js +47 -0
  38. package/dist/src/namespace/css-var.js.map +1 -0
  39. package/dist/src/namespace/index.d.ts.map +1 -1
  40. package/dist/src/namespace/index.js +2 -1
  41. package/dist/src/namespace/index.js.map +1 -1
  42. package/dist/surface/styles/index.scss +57 -57
  43. package/dist/theme/styles/index.scss +3 -3
  44. package/dist/tooltip/styles/index.scss +32 -32
  45. package/package.json +4 -4
@@ -1,32 +1,32 @@
1
1
  .tbf-button {
2
- --tbf-surfaces-button-current-icon-color: var(
3
- --tbf-surfaces-button-slots-icon-color,
4
- var(--tbf-primitives-button-slots-icon-color, currentColor)
2
+ --tbf-surf-btn-current-icon: var(
3
+ --tbf-surf-btn-slot-icon,
4
+ var(--tbf-ui-btn-slot-icon, currentColor)
5
5
  );
6
6
  display: inline-flex;
7
7
  align-items: center;
8
8
  justify-content: center;
9
- gap: var(--tbf-surfaces-button-root-gap, var(--tbf-primitives-button-root-gap, 8px));
10
- min-height: var(--tbf-surfaces-button-root-min-height, var(--tbf-surfaces-button-root-height, var(--tbf-primitives-button-root-height, 28px)));
9
+ gap: var(--tbf-surf-btn-root-gap, var(--tbf-ui-btn-root-gap, 8px));
10
+ min-height: var(--tbf-surf-btn-root-min-h, var(--tbf-surf-btn-root-height, var(--tbf-ui-btn-root-height, 28px)));
11
11
  box-sizing: border-box;
12
- padding: var(--tbf-surfaces-button-root-padding, var(--tbf-primitives-button-root-padding, 0 12px));
13
- padding-block: var(--tbf-surfaces-button-root-padding-block, var(--tbf-primitives-button-root-padding-block, 0));
12
+ padding: var(--tbf-surf-btn-root-padding, var(--tbf-ui-btn-root-padding, 0 12px));
13
+ padding-block: var(--tbf-surf-btn-root-py, var(--tbf-ui-btn-root-py, 0));
14
14
  border: var(
15
- --tbf-surfaces-button-root-border,
16
- var(--tbf-primitives-button-root-border, var(--border-width) solid var(--border-surface-2))
15
+ --tbf-surf-btn-root-border,
16
+ var(--tbf-ui-btn-root-border, var(--border-width) solid var(--border-surface-2))
17
17
  );
18
18
  border-radius: var(
19
- --tbf-surfaces-button-root-radius,
20
- var(--tbf-primitives-button-root-radius, var(--radius-md, var(--tbf-radius, 0)))
19
+ --tbf-surf-btn-root-radius,
20
+ var(--tbf-ui-btn-root-radius, var(--radius-md, var(--tbf-radius, 0)))
21
21
  );
22
- color: var(--tbf-surfaces-button-root-color, var(--tbf-primitives-button-root-color, var(--text-color)));
23
- background: var(--tbf-surfaces-button-root-background, var(--tbf-primitives-button-root-background, transparent));
22
+ color: var(--tbf-surf-btn-root-color, var(--tbf-ui-btn-root-color, var(--text-color)));
23
+ background: var(--tbf-surf-btn-root-bg, var(--tbf-ui-btn-root-bg, transparent));
24
24
  cursor: pointer;
25
25
  appearance: none;
26
26
  -webkit-appearance: none;
27
- font-family: var(--tbf-surfaces-button-root-font-family, var(--tbf-font-sans, "Inter", sans-serif));
28
- font-size: var(--tbf-surfaces-button-root-font-size, var(--tbf-primitives-button-root-font-size, 12px));
29
- font-weight: var(--tbf-surfaces-button-root-font-weight, var(--tbf-primitives-button-root-font-weight, 600));
27
+ font-family: var(--tbf-surf-btn-root-font-family, var(--tbf-font-sans, "Inter", sans-serif));
28
+ font-size: var(--tbf-surf-btn-root-font-size, var(--tbf-ui-btn-root-font-size, 12px));
29
+ font-weight: var(--tbf-surf-btn-root-font-weight, var(--tbf-ui-btn-root-font-weight, 600));
30
30
  line-height: 1.15;
31
31
  text-decoration: none;
32
32
  white-space: nowrap;
@@ -35,22 +35,22 @@
35
35
  .tbf-button:hover,
36
36
  .tbf-button[aria-pressed="true"],
37
37
  .tbf-button[data-tbf-active="true"] {
38
- --tbf-surfaces-button-current-icon-color: var(
39
- --tbf-surfaces-button-states-hover-icon-color,
40
- var(--tbf-primitives-button-states-hover-icon-color, currentColor)
38
+ --tbf-surf-btn-current-icon: var(
39
+ --tbf-surf-btn-state-hover-icon,
40
+ var(--tbf-ui-btn-state-hover-icon, currentColor)
41
41
  );
42
- border-color: var(--tbf-surfaces-button-states-hover-border-color, var(--tbf-primitives-button-states-hover-border-color, currentColor));
43
- color: var(--tbf-surfaces-button-states-hover-color, var(--tbf-primitives-button-states-hover-color, currentColor));
42
+ border-color: var(--tbf-surf-btn-state-hover-border, var(--tbf-ui-btn-state-hover-border, currentColor));
43
+ color: var(--tbf-surf-btn-state-hover-color, var(--tbf-ui-btn-state-hover-color, currentColor));
44
44
  background: var(
45
- --tbf-surfaces-button-states-hover-background,
46
- var(--tbf-primitives-button-states-hover-background, var(--tbf-primitives-button-root-background, transparent))
45
+ --tbf-surf-btn-state-hover-bg,
46
+ var(--tbf-ui-btn-state-hover-bg, var(--tbf-ui-btn-root-bg, transparent))
47
47
  );
48
48
  }
49
49
 
50
50
  .tbf-button:disabled,
51
51
  .tbf-button[disabled],
52
52
  .tbf-button.disabled {
53
- opacity: var(--tbf-surfaces-button-states-disabled-opacity, var(--tbf-primitives-button-states-disabled-opacity, 0.55));
53
+ opacity: var(--tbf-surf-btn-state-disabled-opacity, var(--tbf-ui-btn-state-disabled-opacity, 0.55));
54
54
  cursor: not-allowed;
55
55
  pointer-events: none;
56
56
  }
@@ -60,82 +60,82 @@
60
60
  .tbf-button > i svg,
61
61
  .tbf-button > [data-icon],
62
62
  .tbf-button > [data-icon] svg {
63
- color: var(--tbf-surfaces-button-current-icon-color);
63
+ color: var(--tbf-surf-btn-current-icon);
64
64
  flex: 0 0 auto;
65
65
  }
66
66
 
67
67
  .tbf-button--strong {
68
- --tbf-surfaces-button-current-icon-color: var(
69
- --tbf-surfaces-button-tones-highlight-icon-color,
70
- var(--tbf-primitives-button-tones-highlight-icon-color, currentColor)
68
+ --tbf-surf-btn-current-icon: var(
69
+ --tbf-surf-btn-tone-highlight-icon,
70
+ var(--tbf-ui-btn-tone-highlight-icon, currentColor)
71
71
  );
72
72
  border-color: var(
73
- --tbf-surfaces-button-tones-highlight-border-color,
74
- var(--tbf-primitives-button-tones-highlight-border-color, currentColor)
73
+ --tbf-surf-btn-tone-highlight-border,
74
+ var(--tbf-ui-btn-tone-highlight-border, currentColor)
75
75
  );
76
76
  color: var(
77
- --tbf-surfaces-button-tones-highlight-color,
78
- var(--tbf-primitives-button-tones-highlight-color, currentColor)
77
+ --tbf-surf-btn-tone-highlight-color,
78
+ var(--tbf-ui-btn-tone-highlight-color, currentColor)
79
79
  );
80
80
  background: var(
81
- --tbf-surfaces-button-tones-highlight-background,
82
- var(--tbf-primitives-button-tones-highlight-background, var(--tbf-primitives-button-root-background, transparent))
81
+ --tbf-surf-btn-tone-highlight-bg,
82
+ var(--tbf-ui-btn-tone-highlight-bg, var(--tbf-ui-btn-root-bg, transparent))
83
83
  );
84
84
  }
85
85
 
86
86
  .tbf-button--strong:hover,
87
87
  .tbf-button--strong[aria-pressed="true"],
88
88
  .tbf-button--strong[data-tbf-active="true"] {
89
- --tbf-surfaces-button-current-icon-color: var(
90
- --tbf-surfaces-button-tones-highlight-states-hover-icon-color,
91
- var(--tbf-primitives-button-tones-highlight-states-hover-icon-color, currentColor)
89
+ --tbf-surf-btn-current-icon: var(
90
+ --tbf-surf-btn-tone-highlight-state-hover-icon,
91
+ var(--tbf-ui-btn-tone-highlight-state-hover-icon, currentColor)
92
92
  );
93
93
  border-color: var(
94
- --tbf-surfaces-button-tones-highlight-states-hover-border-color,
95
- var(--tbf-primitives-button-tones-highlight-states-hover-border-color, currentColor)
94
+ --tbf-surf-btn-tone-highlight-state-hover-border,
95
+ var(--tbf-ui-btn-tone-highlight-state-hover-border, currentColor)
96
96
  );
97
97
  color: var(
98
- --tbf-surfaces-button-tones-highlight-states-hover-color,
99
- var(--tbf-primitives-button-tones-highlight-states-hover-color, currentColor)
98
+ --tbf-surf-btn-tone-highlight-state-hover-color,
99
+ var(--tbf-ui-btn-tone-highlight-state-hover-color, currentColor)
100
100
  );
101
101
  background: var(
102
- --tbf-surfaces-button-tones-highlight-states-hover-background,
102
+ --tbf-surf-btn-tone-highlight-state-hover-bg,
103
103
  var(
104
- --tbf-primitives-button-tones-highlight-states-hover-background,
105
- var(--tbf-primitives-button-states-hover-background, var(--tbf-primitives-button-root-background, transparent))
104
+ --tbf-ui-btn-tone-highlight-state-hover-bg,
105
+ var(--tbf-ui-btn-state-hover-bg, var(--tbf-ui-btn-root-bg, transparent))
106
106
  )
107
107
  );
108
108
  }
109
109
 
110
110
  .tbf-button--sm {
111
- min-height: var(--tbf-surfaces-button-sizes-sm-height, var(--tbf-primitives-button-sizes-sm-height, 24px));
112
- padding-inline: var(--tbf-surfaces-button-sizes-sm-padding-inline, var(--tbf-primitives-button-sizes-sm-padding-inline, 9px));
113
- font-size: var(--tbf-surfaces-button-sizes-sm-font-size, var(--tbf-primitives-button-sizes-sm-font-size, 11px));
111
+ min-height: var(--tbf-surf-btn-sizes-sm-height, var(--tbf-ui-btn-sizes-sm-height, 24px));
112
+ padding-inline: var(--tbf-surf-btn-sizes-sm-px, var(--tbf-ui-btn-sizes-sm-px, 9px));
113
+ font-size: var(--tbf-surf-btn-sizes-sm-font-size, var(--tbf-ui-btn-sizes-sm-font-size, 11px));
114
114
  }
115
115
 
116
116
  .tbf-button--lg {
117
- min-height: var(--tbf-surfaces-button-sizes-lg-height, var(--tbf-primitives-button-sizes-lg-height, 34px));
118
- padding-inline: var(--tbf-surfaces-button-sizes-lg-padding-inline, var(--tbf-primitives-button-sizes-lg-padding-inline, 14px));
119
- font-size: var(--tbf-surfaces-button-sizes-lg-font-size, var(--tbf-primitives-button-sizes-lg-font-size, 13px));
117
+ min-height: var(--tbf-surf-btn-sizes-lg-height, var(--tbf-ui-btn-sizes-lg-height, 34px));
118
+ padding-inline: var(--tbf-surf-btn-sizes-lg-px, var(--tbf-ui-btn-sizes-lg-px, 14px));
119
+ font-size: var(--tbf-surf-btn-sizes-lg-font-size, var(--tbf-ui-btn-sizes-lg-font-size, 13px));
120
120
  }
121
121
 
122
122
  .tbf-card,
123
123
  [data-tbf-card] {
124
124
  min-width: 0;
125
125
  box-sizing: border-box;
126
- border: var(--tbf-surfaces-card-root-border, var(--border-width) solid var(--border-surface-1));
127
- border-radius: var(--tbf-surfaces-card-root-radius, var(--radius-lg, var(--tbf-radius, 0)));
128
- color: var(--tbf-surfaces-card-root-color, var(--tbf-text, #000));
129
- background: var(--tbf-surfaces-card-root-background, var(--background-page, var(--tbf-page, #fff)));
126
+ border: var(--tbf-surf-card-root-border, var(--border-width) solid var(--border-surface-1));
127
+ border-radius: var(--tbf-surf-card-root-radius, var(--radius-lg, var(--tbf-radius, 0)));
128
+ color: var(--tbf-surf-card-root-color, var(--tbf-text, #000));
129
+ background: var(--tbf-surf-card-root-bg, var(--background-page, var(--tbf-page, #fff)));
130
130
  }
131
131
 
132
132
  .tbf-card.card,
133
133
  .card[data-tbf-card] {
134
- background: var(--tbf-surfaces-card-root-background, var(--background-page, var(--tbf-page, #fff)));
134
+ background: var(--tbf-surf-card-root-bg, var(--background-page, var(--tbf-page, #fff)));
135
135
  }
136
136
 
137
137
  .tbf-card[data-tbf-interactive="true"]:hover {
138
- border-color: var(--tbf-surfaces-card-states-hover-border-color, var(--tbf-focus, #000));
138
+ border-color: var(--tbf-surf-card-state-hover-border, var(--tbf-focus, #000));
139
139
  }
140
140
 
141
141
  .tbf-card__header,
@@ -143,7 +143,7 @@
143
143
  .tbf-card__footer {
144
144
  min-width: 0;
145
145
  box-sizing: border-box;
146
- padding: var(--tbf-surfaces-card-section-padding, var(--tbf-surfaces-card-root-padding, 12px));
146
+ padding: var(--tbf-surf-card-section-padding, var(--tbf-surf-card-root-padding, 12px));
147
147
  }
148
148
 
149
149
  .tbf-card__header,
@@ -9,8 +9,8 @@
9
9
  .tbf-theme-switch-popover .tbf-theme-select__option[data-tbf-theme-active="true"],
10
10
  .tbf-theme-switch-popover .tbf-theme-select__option[aria-checked="true"] {
11
11
  background: var(
12
- --tbf-shell-theme-option-states-current-background,
13
- var(--tbf-overlays-popover-item-states-selected-background, var(--background-surface-2, transparent))
12
+ --tbf-shell-theme-option-state-current-bg,
13
+ var(--tbf-overlay-popover-item-state-selected-bg, var(--background-surface-2, transparent))
14
14
  );
15
- color: var(--tbf-shell-theme-option-states-current-color, var(--text-color));
15
+ color: var(--tbf-shell-theme-option-state-current-color, var(--text-color));
16
16
  }
@@ -3,15 +3,15 @@
3
3
  z-index: var(--tbf-z-tooltip, 1100);
4
4
  box-sizing: border-box;
5
5
  max-width: min(380px, calc(100vw - 24px));
6
- padding: var(--tbf-overlays-tooltip-panel-padding, 7px 9px);
7
- border: var(--tbf-overlays-tooltip-panel-border, var(--tbf-border-width, 1px) solid var(--tbf-border, #000));
8
- border-radius: var(--tbf-overlays-tooltip-panel-radius, var(--tbf-radius-sm, 0));
9
- box-shadow: var(--tbf-overlays-tooltip-panel-shadow, var(--tbf-shadow, 0 0 0 1px #000));
10
- color: var(--tbf-overlays-tooltip-panel-color, var(--tbf-text, #000));
11
- background: var(--tbf-overlays-tooltip-panel-background, var(--tbf-surface, #fff));
12
- font-family: var(--tbf-overlays-tooltip-panel-font-family, var(--tbf-font-sans, sans-serif));
13
- font-size: var(--tbf-overlays-tooltip-panel-font-size, 12px);
14
- line-height: var(--tbf-overlays-tooltip-panel-line-height, 1.3);
6
+ padding: var(--tbf-overlay-tooltip-panel-padding, 7px 9px);
7
+ border: var(--tbf-overlay-tooltip-panel-border, var(--tbf-border-width, 1px) solid var(--tbf-border, #000));
8
+ border-radius: var(--tbf-overlay-tooltip-panel-radius, var(--tbf-radius-sm, 0));
9
+ box-shadow: var(--tbf-overlay-tooltip-panel-shadow, var(--tbf-shadow, 0 0 0 1px #000));
10
+ color: var(--tbf-overlay-tooltip-panel-color, var(--tbf-text, #000));
11
+ background: var(--tbf-overlay-tooltip-panel-bg, var(--tbf-surface, #fff));
12
+ font-family: var(--tbf-overlay-tooltip-panel-font-family, var(--tbf-font-sans, sans-serif));
13
+ font-size: var(--tbf-overlay-tooltip-panel-font-size, 12px);
14
+ line-height: var(--tbf-overlay-tooltip-panel-line-h, 1.3);
15
15
  opacity: 0;
16
16
  visibility: hidden;
17
17
  isolation: isolate;
@@ -19,19 +19,19 @@
19
19
  transform-origin: var(--tbf-tooltip-transform-origin, center bottom);
20
20
  pointer-events: none;
21
21
  transition:
22
- opacity var(--tbf-overlays-tooltip-motion-duration, 170ms) var(--tbf-overlays-tooltip-motion-easing, cubic-bezier(0.16, 1, 0.3, 1)),
23
- transform var(--tbf-overlays-tooltip-motion-duration, 170ms) var(--tbf-overlays-tooltip-motion-easing, cubic-bezier(0.16, 1, 0.3, 1)),
24
- visibility 0s linear var(--tbf-overlays-tooltip-motion-duration, 170ms);
22
+ opacity var(--tbf-overlay-tooltip-motion-duration, 170ms) var(--tbf-overlay-tooltip-motion-easing, cubic-bezier(0.16, 1, 0.3, 1)),
23
+ transform var(--tbf-overlay-tooltip-motion-duration, 170ms) var(--tbf-overlay-tooltip-motion-easing, cubic-bezier(0.16, 1, 0.3, 1)),
24
+ visibility 0s linear var(--tbf-overlay-tooltip-motion-duration, 170ms);
25
25
  }
26
26
 
27
27
  .tbf-tooltip::before,
28
28
  .tbf-tooltip::after {
29
- --tbf-overlays-tooltip-arrow-size-current: var(--tbf-overlays-tooltip-arrow-size, 8px);
30
- --tbf-overlays-tooltip-arrow-border-width-current: var(--tbf-overlays-tooltip-arrow-border-width, var(--tbf-border-width, 1px));
31
- --tbf-overlays-tooltip-arrow-border-color-current: var(--tbf-overlays-tooltip-arrow-border-color, var(--tbf-border, #000));
32
- --tbf-overlays-tooltip-arrow-background-current: var(
33
- --tbf-overlays-tooltip-arrow-background,
34
- var(--tbf-overlays-tooltip-panel-background, var(--tbf-surface, #fff))
29
+ --tbf-overlay-tooltip-arrow-size-current: var(--tbf-overlay-tooltip-arrow-size, 8px);
30
+ --tbf-overlay-tooltip-arrow-border-width-current: var(--tbf-overlay-tooltip-arrow-border-width, var(--tbf-border-width, 1px));
31
+ --tbf-overlay-tooltip-arrow-border-current: var(--tbf-overlay-tooltip-arrow-border, var(--tbf-border, #000));
32
+ --tbf-overlay-tooltip-arrow-bg-current: var(
33
+ --tbf-overlay-tooltip-arrow-bg,
34
+ var(--tbf-overlay-tooltip-panel-bg, var(--tbf-surface, #fff))
35
35
  );
36
36
 
37
37
  content: "";
@@ -55,18 +55,18 @@
55
55
  }
56
56
 
57
57
  .tbf-tooltip[data-tbf-placement="top"]::before {
58
- bottom: calc(0px - var(--tbf-overlays-tooltip-arrow-size-current));
59
- border-width: var(--tbf-overlays-tooltip-arrow-size-current) var(--tbf-overlays-tooltip-arrow-size-current) 0;
60
- border-top-color: var(--tbf-overlays-tooltip-arrow-border-color-current);
58
+ bottom: calc(0px - var(--tbf-overlay-tooltip-arrow-size-current));
59
+ border-width: var(--tbf-overlay-tooltip-arrow-size-current) var(--tbf-overlay-tooltip-arrow-size-current) 0;
60
+ border-top-color: var(--tbf-overlay-tooltip-arrow-border-current);
61
61
  }
62
62
 
63
63
  .tbf-tooltip[data-tbf-placement="top"]::after {
64
- bottom: calc(var(--tbf-overlays-tooltip-arrow-border-width-current) - var(--tbf-overlays-tooltip-arrow-size-current));
64
+ bottom: calc(var(--tbf-overlay-tooltip-arrow-border-width-current) - var(--tbf-overlay-tooltip-arrow-size-current));
65
65
  border-width:
66
- calc(var(--tbf-overlays-tooltip-arrow-size-current) - var(--tbf-overlays-tooltip-arrow-border-width-current))
67
- calc(var(--tbf-overlays-tooltip-arrow-size-current) - var(--tbf-overlays-tooltip-arrow-border-width-current))
66
+ calc(var(--tbf-overlay-tooltip-arrow-size-current) - var(--tbf-overlay-tooltip-arrow-border-width-current))
67
+ calc(var(--tbf-overlay-tooltip-arrow-size-current) - var(--tbf-overlay-tooltip-arrow-border-width-current))
68
68
  0;
69
- border-top-color: var(--tbf-overlays-tooltip-arrow-background-current);
69
+ border-top-color: var(--tbf-overlay-tooltip-arrow-bg-current);
70
70
  }
71
71
 
72
72
  .tbf-tooltip[data-tbf-placement="bottom"] {
@@ -75,18 +75,18 @@
75
75
  }
76
76
 
77
77
  .tbf-tooltip[data-tbf-placement="bottom"]::before {
78
- top: calc(0px - var(--tbf-overlays-tooltip-arrow-size-current));
79
- border-width: 0 var(--tbf-overlays-tooltip-arrow-size-current) var(--tbf-overlays-tooltip-arrow-size-current);
80
- border-bottom-color: var(--tbf-overlays-tooltip-arrow-border-color-current);
78
+ top: calc(0px - var(--tbf-overlay-tooltip-arrow-size-current));
79
+ border-width: 0 var(--tbf-overlay-tooltip-arrow-size-current) var(--tbf-overlay-tooltip-arrow-size-current);
80
+ border-bottom-color: var(--tbf-overlay-tooltip-arrow-border-current);
81
81
  }
82
82
 
83
83
  .tbf-tooltip[data-tbf-placement="bottom"]::after {
84
- top: calc(var(--tbf-overlays-tooltip-arrow-border-width-current) - var(--tbf-overlays-tooltip-arrow-size-current));
84
+ top: calc(var(--tbf-overlay-tooltip-arrow-border-width-current) - var(--tbf-overlay-tooltip-arrow-size-current));
85
85
  border-width:
86
86
  0
87
- calc(var(--tbf-overlays-tooltip-arrow-size-current) - var(--tbf-overlays-tooltip-arrow-border-width-current))
88
- calc(var(--tbf-overlays-tooltip-arrow-size-current) - var(--tbf-overlays-tooltip-arrow-border-width-current));
89
- border-bottom-color: var(--tbf-overlays-tooltip-arrow-background-current);
87
+ calc(var(--tbf-overlay-tooltip-arrow-size-current) - var(--tbf-overlay-tooltip-arrow-border-width-current))
88
+ calc(var(--tbf-overlay-tooltip-arrow-size-current) - var(--tbf-overlay-tooltip-arrow-border-width-current));
89
+ border-bottom-color: var(--tbf-overlay-tooltip-arrow-bg-current);
90
90
  }
91
91
 
92
92
  .tbf-tooltip[data-tbf-open="true"] {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@trebired/frontend",
3
- "version": "7.1.16",
3
+ "version": "7.1.18",
4
4
  "description": "Generic browser runtime systems for Trebired frontend packages and applications.",
5
5
  "type": "module",
6
6
  "private": false,
@@ -52,7 +52,7 @@
52
52
  },
53
53
  "dependencies": {
54
54
  "@package/logger-adapter": "npm:@trebired/logger-adapter@^0.4.9",
55
- "@trebired/utils": "^0.4.3",
55
+ "@trebired/utils": "^0.4.4",
56
56
  "chart.js": "^4.5.1",
57
57
  "country-flag-icons": "^1.6.20",
58
58
  "cropperjs": "^1.6.2",
@@ -65,8 +65,8 @@
65
65
  },
66
66
  "devDependencies": {
67
67
  "@trebired/bundler": "^5.0.0",
68
- "@trebired/code-discipline": "^6.1.0",
69
- "@trebired/configs": "^0.1.5",
68
+ "@trebired/code-discipline": "^7.0.0",
69
+ "@trebired/configs": "^0.2.0",
70
70
  "@types/bun": "^1.3.14",
71
71
  "@types/node": "^24.13.3",
72
72
  "@types/react": "^19.2.18",