@kofile/gds-foundations 1.4.16 → 1.4.19

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.
@@ -45,7 +45,7 @@
45
45
  font-weight: var(--font-weights-bold);
46
46
  letter-spacing: var(--letter-spacing-xl);
47
47
  line-height: var(--line-heights-xl);
48
- text-align: var(--center);
48
+ text-align: center;
49
49
  }
50
50
  .title[data-mode="dark"] {
51
51
  color: var(--color-neutral-lightest);
@@ -60,7 +60,7 @@
60
60
  font-weight: var(--font-weights-regular);
61
61
  letter-spacing: var(--letter-spacing-2xs);
62
62
  line-height: var(--line-heights-2xs);
63
- text-align: var(--center);
63
+ text-align: center;
64
64
  }
65
65
  .description[data-mode="dark"] {
66
66
  color: var(--color-neutral-lightest);
@@ -39,7 +39,7 @@
39
39
  font-weight: var(--font-weights-semibold);
40
40
  letter-spacing: var(--letter-spacing-xl);
41
41
  line-height: var(--line-heights-xl);
42
- text-align: var(--center);
42
+ text-align: center;
43
43
  }
44
44
  .title[data-mode="dark"] {
45
45
  color: var(--color-neutral-lightest);
@@ -54,7 +54,7 @@
54
54
  font-weight: var(--font-weights-regular);
55
55
  letter-spacing: var(--letter-spacing-2xs);
56
56
  line-height: var(--line-heights-2xs);
57
- text-align: var(--center);
57
+ text-align: center;
58
58
  }
59
59
  .description[data-mode="dark"] {
60
60
  color: var(--color-neutral-lightest);
@@ -14,52 +14,85 @@
14
14
  border-block-end-style: solid;
15
15
  }
16
16
  .list[data-mode="dark"][data-border] {
17
- border-color: var(--color-neutral-800);
17
+ border-block-end-color: var(--color-neutral-800);
18
18
  }
19
+
19
20
  .trigger {
20
- box-sizing: border-box;
21
+ /* Reset native button defaults so foundations styles aren't fighting the UA */
22
+ appearance: none;
21
23
  background-color: transparent;
22
- border-block-end-color: transparent;
23
- border-block-end-width: var(--border-width-md);
24
- border-block-end-style: solid;
25
- padding-block-end: 0;
26
- cursor: pointer;
24
+ border: 0;
25
+ margin: 0;
26
+
27
+ /* Layout — hug content horizontally to match Figma; height + flex-center give
28
+ the same vertical rhythm as Figma's padding-block on the tab-label frame. */
29
+ box-sizing: border-box;
27
30
  display: flex;
28
31
  align-items: center;
29
32
  justify-content: center;
33
+ height: var(--spacing-2xl);
34
+ padding: 0;
35
+
36
+ /* Bottom border = the underline target. Reserved at the trigger's full width
37
+ so transitioning from default → hover → active doesn't shift layout. */
38
+ border-block-end-style: solid;
39
+ border-block-end-width: var(--border-width-md);
40
+ border-block-end-color: transparent;
41
+
42
+ /* Typography — Large = 18px SemiBold per Figma .tab-item Size=Large */
30
43
  font-family: var(--font-families-default);
31
44
  font-size: var(--font-size-lg);
32
- font-weight: var(--font-weights-bold);
45
+ font-weight: var(--font-weights-semibold);
33
46
  letter-spacing: var(--letter-spacing-lg);
34
47
  line-height: var(--line-heights-lg);
35
- height: var(--spacing-2xl);
36
48
  color: var(--color-neutral-darkest);
49
+
50
+ cursor: pointer;
37
51
  }
52
+
53
+ /* Hover lights up the primary underline + recolors text. Same visual as Active
54
+ but without the weight bump — matches Figma State=Hover. */
38
55
  .trigger:hover {
39
56
  color: var(--color-primary-700);
57
+ border-block-end-color: var(--color-primary-700);
40
58
  }
59
+
60
+ /* Active state — primary underline + bold weight (Figma State=Active). */
41
61
  .trigger[data-state="active"] {
42
- box-sizing: border-box;
43
62
  color: var(--color-primary-700);
44
- border-color: var(--color-primary-700);
63
+ border-block-end-color: var(--color-primary-700);
64
+ font-weight: var(--font-weights-bold);
45
65
  }
66
+
67
+ .trigger:focus-visible {
68
+ outline: var(--border-width-md) solid var(--color-primary-700);
69
+ outline-offset: var(--border-width-sm);
70
+ }
71
+
72
+ /* X-Large size — 24px text, 48px height (Figma .tab-item Size=X-Large). */
46
73
  .trigger[data-size="xl"] {
47
- font-family: var(--font-families-default);
48
74
  font-size: var(--font-size-2xl);
49
- font-weight: var(--font-weights-bold);
50
75
  letter-spacing: var(--letter-spacing-2xl);
51
76
  line-height: var(--line-heights-2xl);
52
77
  height: var(--spacing-3xl);
53
78
  }
79
+
80
+ /* Dark mode — Figma .tab-item only documents Mode=Light, so dark uses the
81
+ lighter primary tints (300/400) carried over from the previous version. */
54
82
  .trigger[data-mode="dark"] {
55
83
  color: var(--color-neutral-lightest);
56
84
  }
57
85
  .trigger[data-mode="dark"]:hover {
58
86
  color: var(--color-primary-300);
87
+ border-block-end-color: var(--color-primary-300);
59
88
  }
60
89
  .trigger[data-mode="dark"][data-state="active"] {
61
90
  color: var(--color-primary-400);
62
- border-color: var(--color-primary-400);
91
+ border-block-end-color: var(--color-primary-400);
92
+ font-weight: var(--font-weights-bold);
93
+ }
94
+ .trigger[data-mode="dark"]:focus-visible {
95
+ outline-color: var(--color-primary-300);
63
96
  }
64
97
 
65
98
  .content {
@@ -1,6 +1,8 @@
1
1
  /* /Users/mmhuntsberry/Desktop/design-system/packages/foundations/build/css/components/toast.module.css */
2
2
 
3
- button {
3
+ /* reset: scope to buttons inside viewport/root to avoid leaking to all buttons */
4
+ .viewport button,
5
+ .root button {
4
6
  all: unset;
5
7
  }
6
8
 
@@ -1,5 +1,5 @@
1
- /* reset */
2
- button {
1
+ /* reset: scope to buttons inside tooltip content only (if any) to avoid leaking to all buttons */
2
+ .content button {
3
3
  all: unset;
4
4
  }
5
5
 
@@ -1 +1 @@
1
- .overlay,.overlay[data-mode=dark]{background-color:rgba(0,0,0,.5);inset:0}.content,.overlay,.overlay[data-mode=dark]{position:fixed;z-index:var(--elevation-absolute-top)}.content{background-color:var(--color-neutral-lightest);border-radius:var(--primitive-6);box-shadow:var(--shadow-md);left:50%;padding-block:var(--spacing-xl);padding-inline:var(--spacing-lg);top:50%;transform:translate(-50%,-50%);width:var(--layout-2xs)}.content:focus{outline:none}.content[data-size=spacious]{width:var(--layout-sm)}.content[data-mode=dark]{background-color:var(--color-neutral-darkest)}.title{color:var(--color-neutral-darkest);font-family:var(--font-families-default);font-size:var(--font-size-xl);font-weight:var(--font-weights-bold);letter-spacing:var(--letter-spacing-xl);line-height:var(--line-heights-xl);margin:var(--spacing-4xs);margin-block-start:var(--spacing-sm);text-align:var(--center)}.title[data-mode=dark]{color:var(--color-neutral-lightest)}.description{color:var(--color-neutral-400);font-family:var(--font-families-default);font-size:var(--font-size-2xs);font-weight:var(--font-weights-regular);letter-spacing:var(--letter-spacing-2xs);line-height:var(--line-heights-2xs);margin:var(--spacing-4xs);margin-block-start:var(--spacing-sm);text-align:var(--center)}.description[data-mode=dark]{color:var(--color-neutral-lightest)}.icon{background-color:var(--color-neutral-200);border-radius:var(--primitive-6);display:flex;justify-content:center;margin:0 auto;padding:var(--spacing-2xs);width:min-content}.icon[data-type=destructive],.icon[data-type=error]{background-color:var(--color-danger-100)}.icon[data-type=success]{background-color:var(--color-success-100)}.icon[data-mode=dark][data-type=loading],.icon[data-type=loading]{background-color:transparent}.icon[data-mode=dark]{background-color:var(--color-neutral-900)}.icon[data-mode=dark][data-type=destructive],.icon[data-mode=dark][data-type=error]{background-color:var(--color-danger-900)}.icon[data-mode=dark][data-type=success]{background-color:var(--color-success-900)}
1
+ .overlay,.overlay[data-mode=dark]{background-color:rgba(0,0,0,.5);inset:0}.content,.overlay,.overlay[data-mode=dark]{position:fixed;z-index:var(--elevation-absolute-top)}.content{background-color:var(--color-neutral-lightest);border-radius:var(--primitive-6);box-shadow:var(--shadow-md);left:50%;padding-block:var(--spacing-xl);padding-inline:var(--spacing-lg);top:50%;transform:translate(-50%,-50%);width:var(--layout-2xs)}.content:focus{outline:none}.content[data-size=spacious]{width:var(--layout-sm)}.content[data-mode=dark]{background-color:var(--color-neutral-darkest)}.title{color:var(--color-neutral-darkest);font-family:var(--font-families-default);font-size:var(--font-size-xl);font-weight:var(--font-weights-bold);letter-spacing:var(--letter-spacing-xl);line-height:var(--line-heights-xl);margin:var(--spacing-4xs);margin-block-start:var(--spacing-sm);text-align:center}.title[data-mode=dark]{color:var(--color-neutral-lightest)}.description{color:var(--color-neutral-400);font-family:var(--font-families-default);font-size:var(--font-size-2xs);font-weight:var(--font-weights-regular);letter-spacing:var(--letter-spacing-2xs);line-height:var(--line-heights-2xs);margin:var(--spacing-4xs);margin-block-start:var(--spacing-sm);text-align:center}.description[data-mode=dark]{color:var(--color-neutral-lightest)}.icon{background-color:var(--color-neutral-200);border-radius:var(--primitive-6);display:flex;justify-content:center;margin:0 auto;padding:var(--spacing-2xs);width:min-content}.icon[data-type=destructive],.icon[data-type=error]{background-color:var(--color-danger-100)}.icon[data-type=success]{background-color:var(--color-success-100)}.icon[data-mode=dark][data-type=loading],.icon[data-type=loading]{background-color:transparent}.icon[data-mode=dark]{background-color:var(--color-neutral-900)}.icon[data-mode=dark][data-type=destructive],.icon[data-mode=dark][data-type=error]{background-color:var(--color-danger-900)}.icon[data-mode=dark][data-type=success]{background-color:var(--color-success-900)}
@@ -1 +1 @@
1
- .overlay,.overlay[data-mode=dark]{background-color:rgba(0,0,0,.5);inset:0;position:fixed}.content{background-color:var(--color-neutral-lightest);border-radius:var(--primitive-6);box-shadow:var(--shadow-md);left:50%;position:fixed;top:50%;transform:translate(-50%,-50%);width:var(--layout-md)}.content:focus{outline:none}.content[data-size=spacious]{width:var(--layout-sm)}.content[data-mode=dark]{background-color:var(--color-neutral-darkest)}.title{color:var(--color-neutral-darkest);font-family:var(--font-families-default);font-size:var(--font-size-xl);font-weight:var(--font-weights-semibold);letter-spacing:var(--letter-spacing-xl);line-height:var(--line-heights-xl);margin:var(--spacing-4xs);text-align:var(--center)}.title[data-mode=dark]{color:var(--color-neutral-lightest)}.description{color:var(--color-neutral-400);font-family:var(--font-families-default);font-size:var(--font-size-2xs);font-weight:var(--font-weights-regular);letter-spacing:var(--letter-spacing-2xs);line-height:var(--line-heights-2xs);margin:var(--spacing-4xs);margin-block-start:var(--spacing-sm);text-align:var(--center)}.description[data-mode=dark]{color:var(--color-neutral-lightest)}.icon{background-color:var(--color-neutral-200);border-radius:var(--primitive-6);display:flex;justify-content:center;margin:0 auto;padding:var(--spacing-2xs);width:min-content}.icon[data-type=destructive],.icon[data-type=error]{background-color:var(--color-danger-100)}.icon[data-type=success]{background-color:var(--color-success-100)}.icon[data-mode=dark][data-type=loading],.icon[data-type=loading]{background-color:transparent}.icon[data-mode=dark]{background-color:var(--color-neutral-900)}.icon[data-mode=dark][data-type=destructive],.icon[data-mode=dark][data-type=error]{background-color:var(--color-danger-900)}.icon[data-mode=dark][data-type=success]{background-color:var(--color-success-900)}.content[data-size=md]{width:var(--layout-md)}.content[data-size=lg]{width:var(--layout-lg)}.content[data-size=xl]{width:var(--layout-xl)}
1
+ .overlay,.overlay[data-mode=dark]{background-color:rgba(0,0,0,.5);inset:0;position:fixed}.content{background-color:var(--color-neutral-lightest);border-radius:var(--primitive-6);box-shadow:var(--shadow-md);left:50%;position:fixed;top:50%;transform:translate(-50%,-50%);width:var(--layout-md)}.content:focus{outline:none}.content[data-size=spacious]{width:var(--layout-sm)}.content[data-mode=dark]{background-color:var(--color-neutral-darkest)}.title{color:var(--color-neutral-darkest);font-family:var(--font-families-default);font-size:var(--font-size-xl);font-weight:var(--font-weights-semibold);letter-spacing:var(--letter-spacing-xl);line-height:var(--line-heights-xl);margin:var(--spacing-4xs);text-align:center}.title[data-mode=dark]{color:var(--color-neutral-lightest)}.description{color:var(--color-neutral-400);font-family:var(--font-families-default);font-size:var(--font-size-2xs);font-weight:var(--font-weights-regular);letter-spacing:var(--letter-spacing-2xs);line-height:var(--line-heights-2xs);margin:var(--spacing-4xs);margin-block-start:var(--spacing-sm);text-align:center}.description[data-mode=dark]{color:var(--color-neutral-lightest)}.icon{background-color:var(--color-neutral-200);border-radius:var(--primitive-6);display:flex;justify-content:center;margin:0 auto;padding:var(--spacing-2xs);width:min-content}.icon[data-type=destructive],.icon[data-type=error]{background-color:var(--color-danger-100)}.icon[data-type=success]{background-color:var(--color-success-100)}.icon[data-mode=dark][data-type=loading],.icon[data-type=loading]{background-color:transparent}.icon[data-mode=dark]{background-color:var(--color-neutral-900)}.icon[data-mode=dark][data-type=destructive],.icon[data-mode=dark][data-type=error]{background-color:var(--color-danger-900)}.icon[data-mode=dark][data-type=success]{background-color:var(--color-success-900)}.content[data-size=md]{width:var(--layout-md)}.content[data-size=lg]{width:var(--layout-lg)}.content[data-size=xl]{width:var(--layout-xl)}
@@ -1 +1 @@
1
- .root{flex-direction:column}.list,.root{display:flex}.list{column-gap:var(--spacing-xl);flex-shrink:0}.list[data-border]{border-block-end-color:var(--color-neutral-300);border-block-end-style:solid;border-block-end-width:var(--border-width-sm)}.list[data-mode=dark][data-border]{border-color:var(--color-neutral-800)}.trigger{align-items:center;background-color:transparent;border-block-end-color:transparent;border-block-end-style:solid;border-block-end-width:var(--border-width-md);box-sizing:border-box;color:var(--color-neutral-darkest);cursor:pointer;display:flex;font-family:var(--font-families-default);font-size:var(--font-size-lg);font-weight:var(--font-weights-bold);height:var(--spacing-2xl);justify-content:center;letter-spacing:var(--letter-spacing-lg);line-height:var(--line-heights-lg);padding-block-end:0}.trigger:hover,.trigger[data-state=active]{color:var(--color-primary-700)}.trigger[data-state=active]{border-color:var(--color-primary-700);box-sizing:border-box}.trigger[data-size=xl]{font-family:var(--font-families-default);font-size:var(--font-size-2xl);font-weight:var(--font-weights-bold);height:var(--spacing-3xl);letter-spacing:var(--letter-spacing-2xl);line-height:var(--line-heights-2xl)}.trigger[data-mode=dark]{color:var(--color-neutral-lightest)}.trigger[data-mode=dark]:hover{color:var(--color-primary-300)}.trigger[data-mode=dark][data-state=active]{border-color:var(--color-primary-400);color:var(--color-primary-400)}.content{background-color:var(--color-neutral-lightest);border:var(--border-width-sm) solid var(--color-neutral-300);border-radius:var(--border-radius-sm);flex-shrink:1;margin-top:var(--spacing-xs);outline:none;padding:var(--spacing-md);width:auto}.content:focus{border:var(--border-width-sm) solid var(--color-neutral-300)}.content[data-mode=dark]{background-color:var(--color-neutral-darkest);border-color:var(--color-neutral-800)}
1
+ .root{flex-direction:column}.list,.root{display:flex}.list{column-gap:var(--spacing-xl);flex-shrink:0}.list[data-border]{border-block-end-color:var(--color-neutral-300);border-block-end-style:solid;border-block-end-width:var(--border-width-sm)}.list[data-mode=dark][data-border]{border-block-end-color:var(--color-neutral-800)}.trigger{align-items:center;appearance:none;background-color:transparent;border:0;border-block-end-color:transparent;border-block-end-style:solid;border-block-end-width:var(--border-width-md);box-sizing:border-box;color:var(--color-neutral-darkest);cursor:pointer;display:flex;font-family:var(--font-families-default);font-size:var(--font-size-lg);font-weight:var(--font-weights-semibold);height:var(--spacing-2xl);justify-content:center;letter-spacing:var(--letter-spacing-lg);line-height:var(--line-heights-lg);margin:0;padding:0}.trigger:hover,.trigger[data-state=active]{border-block-end-color:var(--color-primary-700);color:var(--color-primary-700)}.trigger[data-state=active]{font-weight:var(--font-weights-bold)}.trigger:focus-visible{outline:var(--border-width-md) solid var(--color-primary-700);outline-offset:var(--border-width-sm)}.trigger[data-size=xl]{font-size:var(--font-size-2xl);height:var(--spacing-3xl);letter-spacing:var(--letter-spacing-2xl);line-height:var(--line-heights-2xl)}.trigger[data-mode=dark]{color:var(--color-neutral-lightest)}.trigger[data-mode=dark]:hover{border-block-end-color:var(--color-primary-300);color:var(--color-primary-300)}.trigger[data-mode=dark][data-state=active]{border-block-end-color:var(--color-primary-400);color:var(--color-primary-400);font-weight:var(--font-weights-bold)}.trigger[data-mode=dark]:focus-visible{outline-color:var(--color-primary-300)}.content{background-color:var(--color-neutral-lightest);border:var(--border-width-sm) solid var(--color-neutral-300);border-radius:var(--border-radius-sm);flex-shrink:1;margin-top:var(--spacing-xs);outline:none;padding:var(--spacing-md);width:auto}.content:focus{border:var(--border-width-sm) solid var(--color-neutral-300)}.content[data-mode=dark]{background-color:var(--color-neutral-darkest);border-color:var(--color-neutral-800)}
@@ -1 +1 @@
1
- button{all:unset}.viewport{--viewport-padding:var(--spacing-xs);display:flex;gap:var(--spacing-xs);justify-content:center;list-style:none;margin:0;max-width:100vw;outline:none;padding:var(--viewport-padding);position:fixed;transform:translateX(var(--viewport-translate-x));width:100%;z-index:var(--elevation-absolute-top)}.viewport[data-position=bottom]{bottom:var(--spacing-3xl)}.viewport[data-position=top]{top:var(--spacing-3xl)}.root{align-items:center;background-color:var(--color-neutral-200);border:var(--border-width-sm) solid var(--color-neutral-300);border-radius:var(--primitive-6);display:flex;gap:var(--spacing-xs);padding:var(--spacing-md)}.root[data-state=open]{animation:slideIn .15s cubic-bezier(.16,1,.3,1)}.root[data-state=closed]{animation:hide .1s ease-in}.root[data-swipe=move]{transform:translateX(var(--radix-toast-swipe-move-x))}.root[data-swipe=cancel]{transform:translateX(0);transition:transform .2s ease-out}.root[data-swipe=end]{animation:swipeOut .1s ease-out}.root[data-status=success]{background-color:var(--color-success-100);border-color:var(--color-neutral-300);color:var(--color-success-900)}.root[data-status=highlight]{background-color:var(--color-highlight-200);border-color:var(--color-neutral-300);color:var(--color-highlight-900)}@keyframes hide{0%{opacity:1}to{opacity:0}}@keyframes slideIn{0%{transform:translateX(calc(100% + var(--viewport-padding)))}to{transform:translateX(0)}}@keyframes swipeOut{0%{transform:translateX(var(--radix-toast-swipe-end-x))}to{transform:translateX(calc(100% + var(--viewport-padding)))}}.title{align-items:center;color:var(--color-neutral-900);display:flex;font-family:var(--font-families-default);font-size:var(--font-size-md);font-weight:var(--font-weights-semibold);gap:var(--spacing-xs);letter-spacing:var(--letter-spacing-md);line-height:var(--line-heights-md);margin-bottom:var(--primitive-5)}.description{color:var(--primitive-gray-800);font:var(--font-size-md-regular);margin:0}.action{grid-area:action}
1
+ .root button,.viewport button{all:unset}.viewport{--viewport-padding:var(--spacing-xs);display:flex;gap:var(--spacing-xs);justify-content:center;list-style:none;margin:0;max-width:100vw;outline:none;padding:var(--viewport-padding);position:fixed;transform:translateX(var(--viewport-translate-x));width:100%;z-index:var(--elevation-absolute-top)}.viewport[data-position=bottom]{bottom:var(--spacing-3xl)}.viewport[data-position=top]{top:var(--spacing-3xl)}.root{align-items:center;background-color:var(--color-neutral-200);border:var(--border-width-sm) solid var(--color-neutral-300);border-radius:var(--primitive-6);display:flex;gap:var(--spacing-xs);padding:var(--spacing-md)}.root[data-state=open]{animation:slideIn .15s cubic-bezier(.16,1,.3,1)}.root[data-state=closed]{animation:hide .1s ease-in}.root[data-swipe=move]{transform:translateX(var(--radix-toast-swipe-move-x))}.root[data-swipe=cancel]{transform:translateX(0);transition:transform .2s ease-out}.root[data-swipe=end]{animation:swipeOut .1s ease-out}.root[data-status=success]{background-color:var(--color-success-100);border-color:var(--color-neutral-300);color:var(--color-success-900)}.root[data-status=highlight]{background-color:var(--color-highlight-200);border-color:var(--color-neutral-300);color:var(--color-highlight-900)}@keyframes hide{0%{opacity:1}to{opacity:0}}@keyframes slideIn{0%{transform:translateX(calc(100% + var(--viewport-padding)))}to{transform:translateX(0)}}@keyframes swipeOut{0%{transform:translateX(var(--radix-toast-swipe-end-x))}to{transform:translateX(calc(100% + var(--viewport-padding)))}}.title{align-items:center;color:var(--color-neutral-900);display:flex;font-family:var(--font-families-default);font-size:var(--font-size-md);font-weight:var(--font-weights-semibold);gap:var(--spacing-xs);letter-spacing:var(--letter-spacing-md);line-height:var(--line-heights-md);margin-bottom:var(--primitive-5)}.description{color:var(--primitive-gray-800);font:var(--font-size-md-regular);margin:0}.action{grid-area:action}
@@ -1 +1 @@
1
- button{all:unset}.content{--gds-tooltip-width:fit-content;--radix-tooltip-trigger-width:var(--gds-tooltip-width);animation-duration:.4s;animation-timing-function:cubic-bezier(.16,1,.3,1);background-color:var(--color-neutral-darkest);border-radius:var(--border-radius-sm);box-shadow:var(--shadow-sm);color:var(--color-neutral-lightest);font-size:var(--font-size-xs);line-height:var(--line-heights-xs);max-width:var(--gds-tooltip-width);padding:var(--spacing-xs) var(--spacing-sm);user-select:none;width:var(--radix-tooltip-content-available-width);will-change:transform,opacity;z-index:var(--elevation-absolute-top)}.content[data-state=delayed-open][data-side=top]{animation-name:slideDownAndFade}.content[data-state=delayed-open][data-side=right]{animation-name:slideLeftAndFade}.content[data-state=delayed-open][data-side=bottom]{animation-name:slideUpAndFade}.content[data-state=delayed-open][data-side=left]{animation-name:slideRightAndFade}.arrow{fill:var(--color-neutral-darkest)}@keyframes slideUpAndFade{0%{opacity:0;transform:translateY(2px)}to{opacity:1;transform:translateY(0)}}@keyframes slideRightAndFade{0%{opacity:0;transform:translateX(-2px)}to{opacity:1;transform:translateX(0)}}@keyframes slideDownAndFade{0%{opacity:0;transform:translateY(-2px)}to{opacity:1;transform:translateY(0)}}@keyframes slideLeftAndFade{0%{opacity:0;transform:translateX(2px)}to{opacity:1;transform:translateX(0)}}
1
+ .content button{all:unset}.content{--gds-tooltip-width:fit-content;--radix-tooltip-trigger-width:var(--gds-tooltip-width);animation-duration:.4s;animation-timing-function:cubic-bezier(.16,1,.3,1);background-color:var(--color-neutral-darkest);border-radius:var(--border-radius-sm);box-shadow:var(--shadow-sm);color:var(--color-neutral-lightest);font-size:var(--font-size-xs);line-height:var(--line-heights-xs);max-width:var(--gds-tooltip-width);padding:var(--spacing-xs) var(--spacing-sm);user-select:none;width:var(--radix-tooltip-content-available-width);will-change:transform,opacity;z-index:var(--elevation-absolute-top)}.content[data-state=delayed-open][data-side=top]{animation-name:slideDownAndFade}.content[data-state=delayed-open][data-side=right]{animation-name:slideLeftAndFade}.content[data-state=delayed-open][data-side=bottom]{animation-name:slideUpAndFade}.content[data-state=delayed-open][data-side=left]{animation-name:slideRightAndFade}.arrow{fill:var(--color-neutral-darkest)}@keyframes slideUpAndFade{0%{opacity:0;transform:translateY(2px)}to{opacity:1;transform:translateY(0)}}@keyframes slideRightAndFade{0%{opacity:0;transform:translateX(-2px)}to{opacity:1;transform:translateX(0)}}@keyframes slideDownAndFade{0%{opacity:0;transform:translateY(-2px)}to{opacity:1;transform:translateY(0)}}@keyframes slideLeftAndFade{0%{opacity:0;transform:translateX(2px)}to{opacity:1;transform:translateX(0)}}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kofile/gds-foundations",
3
- "version": "1.4.16",
3
+ "version": "1.4.19",
4
4
  "description": "",
5
5
  "main": "build/css/index.css",
6
6
  "exports": {