@x-plat/design-system 0.5.11 → 0.5.12

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 (24) hide show
  1. package/dist/components/Chart/index.cjs +67 -48
  2. package/dist/components/Chart/index.js +68 -49
  3. package/dist/components/DatePicker/index.cjs +401 -379
  4. package/dist/components/DatePicker/index.js +388 -366
  5. package/dist/components/Dropdown/index.cjs +38 -17
  6. package/dist/components/Dropdown/index.css +9 -9
  7. package/dist/components/Dropdown/index.js +37 -16
  8. package/dist/components/Modal/index.cjs +29 -9
  9. package/dist/components/Modal/index.d.cts +0 -3
  10. package/dist/components/Modal/index.d.ts +0 -3
  11. package/dist/components/Modal/index.js +28 -8
  12. package/dist/components/PopOver/index.cjs +33 -12
  13. package/dist/components/PopOver/index.css +6 -9
  14. package/dist/components/PopOver/index.js +32 -11
  15. package/dist/components/Select/index.cjs +351 -330
  16. package/dist/components/Select/index.css +12 -19
  17. package/dist/components/Select/index.js +350 -329
  18. package/dist/components/index.cjs +485 -440
  19. package/dist/components/index.css +27 -37
  20. package/dist/components/index.js +441 -396
  21. package/dist/index.cjs +509 -464
  22. package/dist/index.css +27 -37
  23. package/dist/index.js +463 -418
  24. package/package.json +1 -1
package/dist/components/index.css CHANGED
@@ -2604,9 +2604,9 @@
2604
2604
  .lib-xplat-dropdown .dropdown-trigger {
2605
2605
  cursor: pointer;
2606
2606
  }
2607
- .lib-xplat-dropdown .dropdown-menu {
2607
+ .lib-xplat-dropdown-menu {
2608
2608
  position: fixed;
2609
- z-index: 100;
2609
+ z-index: 1000;
2610
2610
  min-width: 160px;
2611
2611
  background: var(--semantic-surface-neutral-default);
2612
2612
  border: 1px solid var(--semantic-border-default);
@@ -2617,14 +2617,14 @@
2617
2617
  transform: translateY(-4px);
2618
2618
  transition: opacity 0.15s ease, transform 0.15s ease;
2619
2619
  }
2620
- .lib-xplat-dropdown .dropdown-menu.bottom {
2620
+ .lib-xplat-dropdown-menu.bottom {
2621
2621
  transform: translateY(4px);
2622
2622
  }
2623
- .lib-xplat-dropdown .dropdown-menu.visible {
2623
+ .lib-xplat-dropdown-menu.visible {
2624
2624
  opacity: 1;
2625
2625
  transform: translateY(0);
2626
2626
  }
2627
- .lib-xplat-dropdown .dropdown-item {
2627
+ .lib-xplat-dropdown-menu .dropdown-item {
2628
2628
  display: flex;
2629
2629
  align-items: center;
2630
2630
  width: 100%;
@@ -2637,16 +2637,16 @@
2637
2637
  text-align: left;
2638
2638
  transition: background-color 0.15s;
2639
2639
  }
2640
- .lib-xplat-dropdown .dropdown-item:hover:not(:disabled) {
2640
+ .lib-xplat-dropdown-menu .dropdown-item:hover:not(:disabled) {
2641
2641
  background-color: var(--semantic-surface-neutral-subtle);
2642
2642
  }
2643
- .lib-xplat-dropdown .dropdown-item.danger {
2643
+ .lib-xplat-dropdown-menu .dropdown-item.danger {
2644
2644
  color: var(--semantic-text-error);
2645
2645
  }
2646
- .lib-xplat-dropdown .dropdown-item.danger:hover:not(:disabled) {
2646
+ .lib-xplat-dropdown-menu .dropdown-item.danger:hover:not(:disabled) {
2647
2647
  background-color: var(--semantic-surface-error-subtle);
2648
2648
  }
2649
- .lib-xplat-dropdown .dropdown-item:disabled {
2649
+ .lib-xplat-dropdown-menu .dropdown-item:disabled {
2650
2650
  color: var(--semantic-text-disabled);
2651
2651
  cursor: not-allowed;
2652
2652
  }
@@ -2932,31 +2932,28 @@
2932
2932
  /* src/components/PopOver/popOver.scss */
2933
2933
  .lib-xplat-pop-over {
2934
2934
  position: relative;
2935
- z-index: 10;
2936
2935
  width: fit-content;
2937
2936
  cursor: pointer;
2938
2937
  user-select: none;
2939
2938
  }
2940
- .lib-xplat-pop-over > .content-wrap {
2939
+ .lib-xplat-pop-over-content {
2941
2940
  position: fixed;
2941
+ z-index: 1000;
2942
2942
  cursor: default;
2943
2943
  transition: transform 0.2s ease, opacity 0.2s ease;
2944
- background: white;
2944
+ background: var(--semantic-surface-neutral-default);
2945
2945
  border-radius: var(--spacing-radius-md);
2946
2946
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
2947
- z-index: 10;
2948
2947
  opacity: 0;
2949
2948
  transform: scale(0.8);
2950
2949
  }
2951
- .lib-xplat-pop-over > .content-wrap.top {
2950
+ .lib-xplat-pop-over-content.top {
2952
2951
  transform-origin: bottom;
2953
- margin-bottom: var(--spacing-space-2);
2954
2952
  }
2955
- .lib-xplat-pop-over > .content-wrap.bottom {
2953
+ .lib-xplat-pop-over-content.bottom {
2956
2954
  transform-origin: top;
2957
- margin-top: var(--spacing-space-2);
2958
2955
  }
2959
- .lib-xplat-pop-over > .content-wrap.visible {
2956
+ .lib-xplat-pop-over-content.visible {
2960
2957
  opacity: 1;
2961
2958
  transform: scale(1);
2962
2959
  }
@@ -3209,8 +3206,9 @@
3209
3206
  .lib-xplat-select .select-trigger .select-trigger-icon svg {
3210
3207
  font-size: 20px;
3211
3208
  }
3212
- .lib-xplat-select .select-content {
3209
+ .lib-xplat-select-content {
3213
3210
  position: fixed;
3211
+ z-index: 1000;
3214
3212
  padding: var(--spacing-space-1) 0;
3215
3213
  border-radius: var(--spacing-radius-md);
3216
3214
  background-color: var(--semantic-surface-neutral-default);
@@ -3221,50 +3219,42 @@
3221
3219
  opacity: 0;
3222
3220
  transition: transform 0.2s ease, opacity 0.2s ease;
3223
3221
  }
3224
- .lib-xplat-select .select-content.bottom {
3225
- top: 100%;
3226
- margin-top: var(--spacing-space-1);
3227
- margin-bottom: 0;
3222
+ .lib-xplat-select-content.bottom {
3228
3223
  transform: translateY(-8px);
3229
3224
  }
3230
- .lib-xplat-select .select-content.bottom.visible {
3225
+ .lib-xplat-select-content.bottom.visible {
3231
3226
  opacity: 1;
3232
3227
  transform: translateY(0);
3233
3228
  }
3234
- .lib-xplat-select .select-content.bottom.exit {
3229
+ .lib-xplat-select-content.bottom.exit {
3235
3230
  opacity: 0;
3236
3231
  transform: translateY(-8px);
3237
3232
  }
3238
- .lib-xplat-select .select-content {
3239
- }
3240
- .lib-xplat-select .select-content.top {
3241
- bottom: 100%;
3242
- margin-bottom: var(--spacing-space-1);
3243
- margin-top: 0;
3233
+ .lib-xplat-select-content.top {
3244
3234
  transform: translateY(8px);
3245
3235
  }
3246
- .lib-xplat-select .select-content.top.visible {
3236
+ .lib-xplat-select-content.top.visible {
3247
3237
  opacity: 1;
3248
3238
  transform: translateY(0);
3249
3239
  }
3250
- .lib-xplat-select .select-content.top.exit {
3240
+ .lib-xplat-select-content.top.exit {
3251
3241
  opacity: 0;
3252
3242
  transform: translateY(8px);
3253
3243
  }
3254
- .lib-xplat-select .select-item {
3244
+ .lib-xplat-select-content .select-item {
3255
3245
  padding: var(--spacing-space-2) var(--spacing-space-3);
3256
3246
  font-size: 14px;
3257
3247
  cursor: pointer;
3258
3248
  transition: background-color 0.15s ease;
3259
3249
  outline: none;
3260
3250
  }
3261
- .lib-xplat-select .select-item:hover:not(.disabled) {
3251
+ .lib-xplat-select-content .select-item:hover:not(.disabled) {
3262
3252
  background-color: var(--semantic-surface-neutral-subtle);
3263
3253
  }
3264
- .lib-xplat-select .select-item:focus-visible:not(.disabled) {
3254
+ .lib-xplat-select-content .select-item:focus-visible:not(.disabled) {
3265
3255
  background-color: var(--semantic-surface-neutral-subtle);
3266
3256
  }
3267
- .lib-xplat-select .select-item.disabled {
3257
+ .lib-xplat-select-content .select-item.disabled {
3268
3258
  cursor: not-allowed;
3269
3259
  color: var(--semantic-text-disabled);
3270
3260
  }