@x-plat/design-system 0.7.1 → 0.7.2

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 (9) hide show
  1. package/dist/components/AutoResizeTextArea/index.css +1 -1
  2. package/dist/components/ChatInput/index.css +2 -2
  3. package/dist/components/DatePicker/index.css +1 -1
  4. package/dist/components/Input/index.css +1 -1
  5. package/dist/components/Select/index.css +4 -2
  6. package/dist/components/TextArea/index.css +1 -1
  7. package/dist/components/index.css +8 -6
  8. package/dist/index.css +8 -6
  9. package/package.json +1 -1
package/dist/components/AutoResizeTextArea/index.css CHANGED
@@ -13,7 +13,7 @@
13
13
  overflow: hidden;
14
14
  background-color: var(--semantic-surface-neutral-primary);
15
15
  width: 100%;
16
- transition: border-color 0.15s, box-shadow 0.15s;
16
+ transition: border-color 0.28s cubic-bezier(0.25, 0.46, 0.45, 0.94), box-shadow 0.28s cubic-bezier(0.25, 0.46, 0.45, 0.94);
17
17
  }
18
18
  .lib-xplat-auto-resize-textarea-wrapper .lib-xplat-auto-resize-textarea:hover:not(.disabled):not(:focus-within) {
19
19
  border-color: var(--semantic-border-tertiary);
package/dist/components/ChatInput/index.css CHANGED
@@ -91,7 +91,7 @@
91
91
  overflow: hidden;
92
92
  background-color: var(--semantic-surface-neutral-primary);
93
93
  width: 100%;
94
- transition: border-color 0.15s, box-shadow 0.15s;
94
+ transition: border-color 0.28s cubic-bezier(0.25, 0.46, 0.45, 0.94), box-shadow 0.28s cubic-bezier(0.25, 0.46, 0.45, 0.94);
95
95
  }
96
96
  .lib-xplat-auto-resize-textarea-wrapper .lib-xplat-auto-resize-textarea:hover:not(.disabled):not(:focus-within) {
97
97
  border-color: var(--semantic-border-tertiary);
@@ -136,7 +136,7 @@
136
136
  border: 1px solid var(--semantic-border-primary);
137
137
  border-radius: var(--spacing-radius-lg);
138
138
  background-color: var(--semantic-surface-neutral-primary);
139
- transition: border-color 0.15s, box-shadow 0.15s;
139
+ transition: border-color 0.28s cubic-bezier(0.25, 0.46, 0.45, 0.94), box-shadow 0.28s cubic-bezier(0.25, 0.46, 0.45, 0.94);
140
140
  }
141
141
  .lib-xplat-chat-input:hover:not(.disabled):not(:focus-within) {
142
142
  border-color: var(--semantic-border-tertiary);
package/dist/components/DatePicker/index.css CHANGED
@@ -119,7 +119,7 @@
119
119
  background-color: var(--semantic-surface-neutral-primary);
120
120
  padding-right: var(--spacing-space-2);
121
121
  width: 100%;
122
- transition: border-color 0.15s, box-shadow 0.15s;
122
+ transition: border-color 0.28s cubic-bezier(0.25, 0.46, 0.45, 0.94), box-shadow 0.28s cubic-bezier(0.25, 0.46, 0.45, 0.94);
123
123
  }
124
124
  .lib-xplat-input-wrap .lib-xplat-input:hover:not(.disabled):not(:focus-within) {
125
125
  border-color: var(--semantic-border-tertiary);
package/dist/components/Input/index.css CHANGED
@@ -13,7 +13,7 @@
13
13
  background-color: var(--semantic-surface-neutral-primary);
14
14
  padding-right: var(--spacing-space-2);
15
15
  width: 100%;
16
- transition: border-color 0.15s, box-shadow 0.15s;
16
+ transition: border-color 0.28s cubic-bezier(0.25, 0.46, 0.45, 0.94), box-shadow 0.28s cubic-bezier(0.25, 0.46, 0.45, 0.94);
17
17
  }
18
18
  .lib-xplat-input-wrap .lib-xplat-input:hover:not(.disabled):not(:focus-within) {
19
19
  border-color: var(--semantic-border-tertiary);
package/dist/components/Select/index.css CHANGED
@@ -48,7 +48,7 @@
48
48
  border-radius: var(--spacing-radius-md);
49
49
  background-color: var(--semantic-surface-neutral-primary);
50
50
  color: var(--semantic-text-primary);
51
- transition: border-color 0.15s;
51
+ transition: border-color 0.28s cubic-bezier(0.25, 0.46, 0.45, 0.94), box-shadow 0.28s cubic-bezier(0.25, 0.46, 0.45, 0.94);
52
52
  }
53
53
  .lib-xplat-select .select-trigger:hover:not(.disabled) {
54
54
  border-color: var(--semantic-border-tertiary);
@@ -57,7 +57,9 @@
57
57
  border-color: var(--semantic-interaction-focus-ring);
58
58
  }
59
59
  .lib-xplat-select .select-trigger:focus-visible {
60
- outline: 2px solid var(--semantic-interaction-focus-ring);
60
+ border-color: var(--semantic-interaction-focus-ring);
61
+ box-shadow: 0 0 0 2px var(--semantic-interaction-overlay-10);
62
+ outline: 2px solid transparent;
61
63
  outline-offset: 2px;
62
64
  }
63
65
  .lib-xplat-select .select-trigger.disabled {
package/dist/components/TextArea/index.css CHANGED
@@ -12,7 +12,7 @@
12
12
  color: var(--semantic-text-secondary);
13
13
  font-family: inherit;
14
14
  outline: none;
15
- transition: border-color 0.15s, box-shadow 0.15s;
15
+ transition: border-color 0.28s cubic-bezier(0.25, 0.46, 0.45, 0.94), box-shadow 0.28s cubic-bezier(0.25, 0.46, 0.45, 0.94);
16
16
  }
17
17
  .lib-xplat-textarea-wrap .lib-xplat-textarea.sm {
18
18
  padding: var(--spacing-space-2) var(--spacing-space-3);
package/dist/components/index.css CHANGED
@@ -1450,7 +1450,7 @@
1450
1450
  overflow: hidden;
1451
1451
  background-color: var(--semantic-surface-neutral-primary);
1452
1452
  width: 100%;
1453
- transition: border-color 0.15s, box-shadow 0.15s;
1453
+ transition: border-color 0.28s cubic-bezier(0.25, 0.46, 0.45, 0.94), box-shadow 0.28s cubic-bezier(0.25, 0.46, 0.45, 0.94);
1454
1454
  }
1455
1455
  .lib-xplat-auto-resize-textarea-wrapper .lib-xplat-auto-resize-textarea:hover:not(.disabled):not(:focus-within) {
1456
1456
  border-color: var(--semantic-border-tertiary);
@@ -2392,7 +2392,7 @@
2392
2392
  border: 1px solid var(--semantic-border-primary);
2393
2393
  border-radius: var(--spacing-radius-lg);
2394
2394
  background-color: var(--semantic-surface-neutral-primary);
2395
- transition: border-color 0.15s, box-shadow 0.15s;
2395
+ transition: border-color 0.28s cubic-bezier(0.25, 0.46, 0.45, 0.94), box-shadow 0.28s cubic-bezier(0.25, 0.46, 0.45, 0.94);
2396
2396
  }
2397
2397
  .lib-xplat-chat-input:hover:not(.disabled):not(:focus-within) {
2398
2398
  border-color: var(--semantic-border-tertiary);
@@ -2624,7 +2624,7 @@
2624
2624
  background-color: var(--semantic-surface-neutral-primary);
2625
2625
  padding-right: var(--spacing-space-2);
2626
2626
  width: 100%;
2627
- transition: border-color 0.15s, box-shadow 0.15s;
2627
+ transition: border-color 0.28s cubic-bezier(0.25, 0.46, 0.45, 0.94), box-shadow 0.28s cubic-bezier(0.25, 0.46, 0.45, 0.94);
2628
2628
  }
2629
2629
  .lib-xplat-input-wrap .lib-xplat-input:hover:not(.disabled):not(:focus-within) {
2630
2630
  border-color: var(--semantic-border-tertiary);
@@ -4237,7 +4237,7 @@
4237
4237
  border-radius: var(--spacing-radius-md);
4238
4238
  background-color: var(--semantic-surface-neutral-primary);
4239
4239
  color: var(--semantic-text-primary);
4240
- transition: border-color 0.15s;
4240
+ transition: border-color 0.28s cubic-bezier(0.25, 0.46, 0.45, 0.94), box-shadow 0.28s cubic-bezier(0.25, 0.46, 0.45, 0.94);
4241
4241
  }
4242
4242
  .lib-xplat-select .select-trigger:hover:not(.disabled) {
4243
4243
  border-color: var(--semantic-border-tertiary);
@@ -4246,7 +4246,9 @@
4246
4246
  border-color: var(--semantic-interaction-focus-ring);
4247
4247
  }
4248
4248
  .lib-xplat-select .select-trigger:focus-visible {
4249
- outline: 2px solid var(--semantic-interaction-focus-ring);
4249
+ border-color: var(--semantic-interaction-focus-ring);
4250
+ box-shadow: 0 0 0 2px var(--semantic-interaction-overlay-10);
4251
+ outline: 2px solid transparent;
4250
4252
  outline-offset: 2px;
4251
4253
  }
4252
4254
  .lib-xplat-select .select-trigger.disabled {
@@ -5197,7 +5199,7 @@
5197
5199
  color: var(--semantic-text-secondary);
5198
5200
  font-family: inherit;
5199
5201
  outline: none;
5200
- transition: border-color 0.15s, box-shadow 0.15s;
5202
+ transition: border-color 0.28s cubic-bezier(0.25, 0.46, 0.45, 0.94), box-shadow 0.28s cubic-bezier(0.25, 0.46, 0.45, 0.94);
5201
5203
  }
5202
5204
  .lib-xplat-textarea-wrap .lib-xplat-textarea.sm {
5203
5205
  padding: var(--spacing-space-2) var(--spacing-space-3);
package/dist/index.css CHANGED
@@ -1450,7 +1450,7 @@
1450
1450
  overflow: hidden;
1451
1451
  background-color: var(--semantic-surface-neutral-primary);
1452
1452
  width: 100%;
1453
- transition: border-color 0.15s, box-shadow 0.15s;
1453
+ transition: border-color 0.28s cubic-bezier(0.25, 0.46, 0.45, 0.94), box-shadow 0.28s cubic-bezier(0.25, 0.46, 0.45, 0.94);
1454
1454
  }
1455
1455
  .lib-xplat-auto-resize-textarea-wrapper .lib-xplat-auto-resize-textarea:hover:not(.disabled):not(:focus-within) {
1456
1456
  border-color: var(--semantic-border-tertiary);
@@ -2392,7 +2392,7 @@
2392
2392
  border: 1px solid var(--semantic-border-primary);
2393
2393
  border-radius: var(--spacing-radius-lg);
2394
2394
  background-color: var(--semantic-surface-neutral-primary);
2395
- transition: border-color 0.15s, box-shadow 0.15s;
2395
+ transition: border-color 0.28s cubic-bezier(0.25, 0.46, 0.45, 0.94), box-shadow 0.28s cubic-bezier(0.25, 0.46, 0.45, 0.94);
2396
2396
  }
2397
2397
  .lib-xplat-chat-input:hover:not(.disabled):not(:focus-within) {
2398
2398
  border-color: var(--semantic-border-tertiary);
@@ -2624,7 +2624,7 @@
2624
2624
  background-color: var(--semantic-surface-neutral-primary);
2625
2625
  padding-right: var(--spacing-space-2);
2626
2626
  width: 100%;
2627
- transition: border-color 0.15s, box-shadow 0.15s;
2627
+ transition: border-color 0.28s cubic-bezier(0.25, 0.46, 0.45, 0.94), box-shadow 0.28s cubic-bezier(0.25, 0.46, 0.45, 0.94);
2628
2628
  }
2629
2629
  .lib-xplat-input-wrap .lib-xplat-input:hover:not(.disabled):not(:focus-within) {
2630
2630
  border-color: var(--semantic-border-tertiary);
@@ -4237,7 +4237,7 @@
4237
4237
  border-radius: var(--spacing-radius-md);
4238
4238
  background-color: var(--semantic-surface-neutral-primary);
4239
4239
  color: var(--semantic-text-primary);
4240
- transition: border-color 0.15s;
4240
+ transition: border-color 0.28s cubic-bezier(0.25, 0.46, 0.45, 0.94), box-shadow 0.28s cubic-bezier(0.25, 0.46, 0.45, 0.94);
4241
4241
  }
4242
4242
  .lib-xplat-select .select-trigger:hover:not(.disabled) {
4243
4243
  border-color: var(--semantic-border-tertiary);
@@ -4246,7 +4246,9 @@
4246
4246
  border-color: var(--semantic-interaction-focus-ring);
4247
4247
  }
4248
4248
  .lib-xplat-select .select-trigger:focus-visible {
4249
- outline: 2px solid var(--semantic-interaction-focus-ring);
4249
+ border-color: var(--semantic-interaction-focus-ring);
4250
+ box-shadow: 0 0 0 2px var(--semantic-interaction-overlay-10);
4251
+ outline: 2px solid transparent;
4250
4252
  outline-offset: 2px;
4251
4253
  }
4252
4254
  .lib-xplat-select .select-trigger.disabled {
@@ -5197,7 +5199,7 @@
5197
5199
  color: var(--semantic-text-secondary);
5198
5200
  font-family: inherit;
5199
5201
  outline: none;
5200
- transition: border-color 0.15s, box-shadow 0.15s;
5202
+ transition: border-color 0.28s cubic-bezier(0.25, 0.46, 0.45, 0.94), box-shadow 0.28s cubic-bezier(0.25, 0.46, 0.45, 0.94);
5201
5203
  }
5202
5204
  .lib-xplat-textarea-wrap .lib-xplat-textarea.sm {
5203
5205
  padding: var(--spacing-space-2) var(--spacing-space-3);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@x-plat/design-system",
3
- "version": "0.7.1",
3
+ "version": "0.7.2",
4
4
  "description": "XPLAT UI Design System",
5
5
  "author": "XPLAT WOONG",
6
6
  "main": "dist/index.cjs",