@sdata/web-vue 3.13.0 → 3.15.0

package/es/index.css

@@ -934,6 +934,12 @@ html[data-overlayscrollbars-viewport~=scrollbarHidden] > body::-webkit-scrollbar
     transform: rotate(360deg);
   }
 }
+@media (prefers-reduced-motion: reduce) {
+  .sd-icon-loading,
+  .sd-icon-spin {
+    animation-duration: 3s;
+  }
+}
 .sd-icon-hover {
   position: relative;
   display: block;
@@ -948,7 +954,7 @@ html[data-overlayscrollbars-viewport~=scrollbarHidden] > body::-webkit-scrollbar
   box-sizing: border-box;
   background-color: transparent;
   border-radius: var(--sd-border-radius-circle);
-  transition: background-color 0.1s cubic-bezier(0, 0, 1, 1);
+  transition: background-color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1);
   content: "";
 }
 .sd-icon-hover:hover::before {
@@ -1064,7 +1070,7 @@ html[data-overlayscrollbars-viewport~=scrollbarHidden] > body::-webkit-scrollbar
 
 .zoom-in-enter-from,
 .zoom-in-appear-from {
-  transform: scale(0.5, 0.5);
+  transform: scale(0.94, 0.94);
   opacity: 0;
 }
 
@@ -1085,7 +1091,7 @@ html[data-overlayscrollbars-viewport~=scrollbarHidden] > body::-webkit-scrollbar
 }
 
 .zoom-in-leave-to {
-  transform: scale(0.5, 0.5);
+  transform: scale(0.94, 0.94);
   opacity: 0;
 }
 
@@ -1095,7 +1101,7 @@ html[data-overlayscrollbars-viewport~=scrollbarHidden] > body::-webkit-scrollbar
 
 .zoom-in-fade-out-enter-from,
 .zoom-in-fade-out-appear-from {
-  transform: scale(0.5, 0.5);
+  transform: scale(0.96, 0.96);
   opacity: 0;
 }
 
@@ -1116,7 +1122,6 @@ html[data-overlayscrollbars-viewport~=scrollbarHidden] > body::-webkit-scrollbar
 }
 
 .zoom-in-fade-out-leave-to {
-  transform: scale(0.5, 0.5);
   opacity: 0;
 }
 
@@ -1397,6 +1402,18 @@ html[data-overlayscrollbars-viewport~=scrollbarHidden] > body::-webkit-scrollbar
   transition: transform 0.3s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 
+@media (prefers-reduced-motion: reduce) {
+  [class*=-enter-from],
+  [class*=-appear-from],
+  [class*=-leave-to] {
+    transform: none !important;
+  }
+  [class*=-enter-active],
+  [class*=-appear-active],
+  [class*=-leave-active] {
+    transition-duration: 0.1s !important;
+  }
+}
 :where(body, [sd-theme]) {
   --sd-color-white: #fff;
   --sd-color-black: #000;
@@ -1974,7 +1991,7 @@ body {
 }
 .sd-tag-checkable {
   cursor: pointer;
-  transition: all 0.1s cubic-bezier(0, 0, 1, 1);
+  transition: background-color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1), border-color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-tag-checkable:hover {
   background-color: var(--sd-color-fill-2);
@@ -2425,7 +2442,7 @@ body {
   border: 1px solid transparent;
   border-radius: var(--sd-border-radius-small);
   cursor: text;
-  transition: color 0.1s cubic-bezier(0, 0, 1, 1), border-color 0.1s cubic-bezier(0, 0, 1, 1), background-color 0.1s cubic-bezier(0, 0, 1, 1);
+  transition: color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1), border-color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1), background-color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-select-view-single:hover {
   background-color: var(--sd-color-fill-3);
@@ -2510,7 +2527,7 @@ body {
 }
 .sd-select-view-single .sd-select-view-clear-btn > svg {
   position: relative;
-  transition: color 0.1s cubic-bezier(0, 0, 1, 1);
+  transition: color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-select-view-single:hover .sd-select-view-clear-btn {
   visibility: visible;
@@ -2622,7 +2639,7 @@ body {
   border: 1px solid transparent;
   border-radius: var(--sd-border-radius-small);
   cursor: text;
-  transition: color 0.1s cubic-bezier(0, 0, 1, 1), border-color 0.1s cubic-bezier(0, 0, 1, 1), background-color 0.1s cubic-bezier(0, 0, 1, 1);
+  transition: color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1), border-color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1), background-color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-select-view-multiple:hover {
   background-color: var(--sd-color-fill-3);
@@ -2707,7 +2724,7 @@ body {
 }
 .sd-select-view-multiple .sd-select-view-clear-btn > svg {
   position: relative;
-  transition: color 0.1s cubic-bezier(0, 0, 1, 1);
+  transition: color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-select-view-multiple:hover .sd-select-view-clear-btn {
   visibility: visible;
@@ -2981,7 +2998,7 @@ body {
   background-color: var(--sd-color-fill-2);
   border: 1px solid transparent;
   border-radius: var(--sd-border-radius-small);
-  transition: all 0.1s cubic-bezier(0, 0, 1, 1);
+  transition: color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1), background-color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1), border-color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1), box-shadow 0.1s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-picker-input {
   display: inline-flex;
@@ -2997,7 +3014,7 @@ body {
   background-color: transparent;
   border: none;
   outline: none;
-  transition: all 0.1s cubic-bezier(0, 0, 1, 1);
+  transition: color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1), background-color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-picker input::placeholder {
   color: var(--sd-color-text-3);
@@ -3150,7 +3167,7 @@ body {
   border: 1px solid transparent;
   border-radius: var(--sd-border-radius-small);
   cursor: text;
-  transition: color 0.1s cubic-bezier(0, 0, 1, 1), border-color 0.1s cubic-bezier(0, 0, 1, 1), background-color 0.1s cubic-bezier(0, 0, 1, 1);
+  transition: color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1), border-color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1), background-color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-input-label:hover {
   background-color: var(--sd-color-fill-3);
@@ -3235,7 +3252,7 @@ body {
 }
 .sd-input-label .sd-input-label-clear-btn > svg {
   position: relative;
-  transition: color 0.1s cubic-bezier(0, 0, 1, 1);
+  transition: color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-input-label:hover .sd-input-label-clear-btn {
   visibility: visible;
@@ -3395,7 +3412,7 @@ body {
   background: var(--sd-color-fill-2);
   border: 1px dashed var(--sd-color-neutral-3);
   border-radius: var(--sd-border-radius-small);
-  transition: all 0.1s cubic-bezier(0, 0, 1, 1);
+  transition: color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1), background-color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1), border-color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-upload-picture-card:hover {
   color: var(--sd-color-text-2);
@@ -3410,7 +3427,7 @@ body {
   background-color: var(--sd-color-fill-1);
   border: 1px dashed var(--sd-color-neutral-3);
   border-radius: var(--sd-border-radius-small);
-  transition: all 0.2s ease;
+  transition: color 0.2s ease, background-color 0.2s ease, border-color 0.2s ease;
 }
 .sd-upload-drag .sd-icon-plus {
   margin-bottom: 24px;
@@ -3510,7 +3527,7 @@ body {
   color: rgb(var(--sd-primary-6));
   font-size: 14px;
   cursor: pointer;
-  transition: all 0.2s ease;
+  transition: color 0.2s ease;
 }
 .sd-upload-icon-upload:active, .sd-upload-icon-upload:hover {
   color: rgb(var(--sd-primary-7));
@@ -3556,7 +3573,7 @@ body {
   font-size: 14px;
   background-color: var(--sd-color-fill-1);
   border-radius: var(--sd-border-radius-small);
-  transition: background-color 0.1s cubic-bezier(0, 0, 1, 1);
+  transition: background-color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-upload-list-item-file-icon {
   margin-right: 12px;
@@ -3645,7 +3662,7 @@ body {
   padding-right: 0;
   overflow: hidden;
   vertical-align: top;
-  transition: all 0.2s cubic-bezier(0.34, 0.69, 0.1, 1);
+  transition: opacity 0.2s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-upload-list-picture-status-error .sd-upload-list-picture-mask {
   opacity: 1;
@@ -3675,7 +3692,7 @@ body {
   background: rgba(0, 0, 0, 0.5);
   cursor: pointer;
   opacity: 0;
-  transition: opacity 0.1s cubic-bezier(0, 0, 1, 1);
+  transition: opacity 0.1s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-upload-list-picture-operation {
   display: none;
@@ -3731,7 +3748,7 @@ body {
   margin: 0;
   overflow: hidden;
   opacity: 0;
-  transition: opacity 0.1s cubic-bezier(0, 0, 1, 1), height 0.3s cubic-bezier(0.34, 0.69, 0.1, 1) 0.1s, margin 0.3s cubic-bezier(0.34, 0.69, 0.1, 1) 0.1s;
+  transition: opacity 0.1s cubic-bezier(0.34, 0.69, 0.1, 1), height 0.3s cubic-bezier(0.34, 0.69, 0.1, 1) 0.1s, margin 0.3s cubic-bezier(0.34, 0.69, 0.1, 1) 0.1s;
 }
 
 .sd-upload-list-item.sd-upload-slide-inline-enter {
@@ -3739,7 +3756,7 @@ body {
 }
 .sd-upload-list-item.sd-upload-slide-inline-enter-active {
   opacity: 1;
-  transition: opacity 0.2s cubic-bezier(0, 0, 1, 1);
+  transition: opacity 0.2s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-upload-list-item.sd-upload-slide-inline-exit {
   opacity: 1;
@@ -3748,7 +3765,7 @@ body {
   margin: 0;
   overflow: hidden;
   opacity: 0;
-  transition: opacity 0.1s cubic-bezier(0, 0, 1, 1), width 0.3s cubic-bezier(0.34, 0.69, 0.1, 1) 0.1s, margin 0.3s cubic-bezier(0.34, 0.69, 0.1, 1) 0.1s;
+  transition: opacity 0.1s cubic-bezier(0.34, 0.69, 0.1, 1), width 0.3s cubic-bezier(0.34, 0.69, 0.1, 1) 0.1s, margin 0.3s cubic-bezier(0.34, 0.69, 0.1, 1) 0.1s;
 }
 
 .sd-typography {
@@ -3865,7 +3882,7 @@ body {
   background-color: transparent;
   border-radius: 2px;
   cursor: pointer;
-  transition: background-color 0.1s cubic-bezier(0, 0, 1, 1);
+  transition: background-color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-typography-operation-copy:hover {
   color: var(--sd-color-text-2);
@@ -3881,7 +3898,7 @@ body {
   background-color: transparent;
   border-radius: 2px;
   cursor: pointer;
-  transition: background-color 0.1s cubic-bezier(0, 0, 1, 1);
+  transition: background-color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-typography-operation-edit:hover {
   color: var(--sd-color-text-2);
@@ -4059,7 +4076,7 @@ body {
 }
 .sd-tree-node-selected .sd-tree-node-title, .sd-tree-node-selected .sd-tree-node-title:hover {
   color: rgb(var(--sd-primary-6));
-  transition: color 0.2s cubic-bezier(0, 0, 1, 1);
+  transition: color 0.2s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-tree-node-disabled-selectable .sd-tree-node-title,
 .sd-tree-node-disabled-selectable .sd-tree-node-title:hover, .sd-tree-node-disabled .sd-tree-node-title,
@@ -4470,7 +4487,7 @@ body {
 }
 .sd-transfer-list-item-dragged {
   animation: sd-transfer-drag-item-blink 0.4s;
-  animation-timing-function: cubic-bezier(0, 0, 1, 1);
+  animation-timing-function: cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-transfer-operations {
   padding: 0 20px;
@@ -5139,7 +5156,7 @@ body.sd-tour-active .sd-tour-popover * {
   border: 1px solid transparent;
   border-radius: var(--sd-border-radius-small);
   cursor: text;
-  transition: color 0.1s cubic-bezier(0, 0, 1, 1), border-color 0.1s cubic-bezier(0, 0, 1, 1), background-color 0.1s cubic-bezier(0, 0, 1, 1);
+  transition: color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1), border-color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1), background-color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-textarea-wrapper:hover {
   background-color: var(--sd-color-fill-3);
@@ -5224,7 +5241,7 @@ body.sd-tour-active .sd-tour-popover * {
 }
 .sd-textarea-wrapper .sd-textarea-clear-btn > svg {
   position: relative;
-  transition: color 0.1s cubic-bezier(0, 0, 1, 1);
+  transition: color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-textarea-wrapper:hover .sd-textarea-clear-btn {
   visibility: visible;
@@ -5545,7 +5562,7 @@ body.sd-tour-active .sd-tour-popover * {
   line-height: 1.5715;
   outline: none;
   cursor: pointer;
-  transition: color 0.2s cubic-bezier(0, 0, 1, 1);
+  transition: color 0.2s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-tabs-tab-title {
   display: inline-block;
@@ -5601,7 +5618,7 @@ body.sd-tour-active .sd-tour-popover * {
   background-color: transparent;
   border-radius: var(--sd-border-radius-small);
   opacity: 1;
-  transition: background-color 0.2s cubic-bezier(0, 0, 1, 1), opacity 0.2s cubic-bezier(0, 0, 1, 1);
+  transition: background-color 0.2s cubic-bezier(0.34, 0.69, 0.1, 1), opacity 0.2s cubic-bezier(0.34, 0.69, 0.1, 1);
   content: "";
 }
 .sd-tabs-nav-type-line .sd-tabs-tab:hover .sd-tabs-tab-title::before {
@@ -5627,7 +5644,7 @@ body.sd-tour-active .sd-tour-popover * {
   padding: 4px 16px;
   font-size: 14px;
   border: 1px solid var(--sd-color-neutral-3);
-  transition: padding 0.2s cubic-bezier(0, 0, 1, 1), color 0.2s cubic-bezier(0, 0, 1, 1);
+  transition: padding 0.2s cubic-bezier(0.34, 0.69, 0.1, 1), color 0.2s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-tabs-nav-type-card .sd-tabs-tab-closable, .sd-tabs-nav-type-card-gutter .sd-tabs-tab-closable {
   padding-right: 12px;
@@ -5802,7 +5819,7 @@ body.sd-tour-active .sd-tour-popover * {
   height: 14px;
   background-color: var(--sd-color-fill-3);
   transform: translateY(-50%);
-  transition: all 0.2s cubic-bezier(0, 0, 1, 1);
+  transition: opacity 0.2s cubic-bezier(0.34, 0.69, 0.1, 1);
   content: "";
 }
 
@@ -5839,7 +5856,7 @@ body.sd-tour-active .sd-tour-popover * {
   border-top: none;
 }
 .sd-tabs-content-animation {
-  transition: all 0.2s cubic-bezier(0.34, 0.69, 0.1, 1);
+  transition: margin 0.2s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-tabs-horizontal.sd-tabs-justify {
   display: flex;
@@ -6482,7 +6499,7 @@ body.sd-tour-active .sd-tour-popover * {
   width: 10px;
   box-shadow: none;
   transform: translateX(-100%);
-  transition: box-shadow 0.1s cubic-bezier(0, 0, 1, 1);
+  transition: box-shadow 0.1s cubic-bezier(0.34, 0.69, 0.1, 1);
   content: "";
   pointer-events: none;
 }
@@ -6500,7 +6517,7 @@ body.sd-tour-active .sd-tour-popover * {
   border: 1px solid var(--sd-color-white);
   border-radius: var(--sd-border-radius-medium);
   cursor: pointer;
-  transition: all 0.1s cubic-bezier(0, 0, 1, 1);
+  transition: border-color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-table-editable-row:hover .sd-table-cell-wrap-value {
   border: 1px solid var(--sd-color-neutral-3);
@@ -6520,7 +6537,7 @@ body.sd-tour-active .sd-tour-popover * {
   border-radius: 2px;
   outline: none;
   cursor: pointer;
-  transition: background-color 0.1s cubic-bezier(0, 0, 1, 1);
+  transition: background-color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-table .sd-table-expand-btn:hover {
   color: var(--sd-color-text-1);
@@ -6597,7 +6614,7 @@ body.sd-tour-active .sd-tour-popover * {
   max-width: 40px;
 }
 .sd-table-th {
-  transition: background-color 0.1s cubic-bezier(0, 0, 1, 1);
+  transition: background-color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-table-cell-with-sorter {
   display: flex;
@@ -6644,7 +6661,7 @@ body.sd-tour-active .sd-tour-popover * {
   top: 50%;
   color: var(--sd-color-neutral-5);
   font-size: 12px;
-  transition: all 0.1s cubic-bezier(0, 0, 1, 1);
+  transition: color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-table-sorter-icon .sd-icon-caret-up {
   top: -2px;
@@ -6670,7 +6687,7 @@ body.sd-tour-active .sd-tour-popover * {
   vertical-align: 0;
   background-color: transparent;
   cursor: pointer;
-  transition: all 0.1s cubic-bezier(0, 0, 1, 1);
+  transition: background-color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-table-filters:hover, .sd-table-filters-open {
   background-color: var(--sd-color-neutral-4);
@@ -6678,7 +6695,7 @@ body.sd-tour-active .sd-tour-popover * {
 .sd-table-filters svg {
   color: var(--sd-color-text-2);
   font-size: 16px;
-  transition: all 0.1s cubic-bezier(0, 0, 1, 1);
+  transition: color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-table-filters-active svg {
   color: rgb(var(--sd-primary-6));
@@ -6732,7 +6749,7 @@ body.sd-tour-active .sd-tour-popover * {
   width: 10px;
   height: 100%;
   box-shadow: none;
-  transition: box-shadow 0.1s cubic-bezier(0, 0, 1, 1);
+  transition: box-shadow 0.1s cubic-bezier(0.34, 0.69, 0.1, 1);
   content: "";
   pointer-events: none;
 }
@@ -7075,7 +7092,7 @@ body.sd-tour-active .sd-tour-popover * {
   font-size: 12px;
   background-color: var(--sd-color-bg-white);
   border-radius: 50%;
-  transition: all 0.2s cubic-bezier(0.34, 0.69, 0.1, 1);
+  transition: left 0.2s cubic-bezier(0.34, 0.69, 0.1, 1), color 0.2s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-switch-checked {
   background-color: rgb(var(--sd-primary-6));
@@ -7830,7 +7847,7 @@ body.sd-tour-active .sd-tour-popover * {
 }
 .sd-steps-changeable .sd-steps-item-title,
 .sd-steps-changeable .sd-steps-item-description {
-  transition: all 0.1s cubic-bezier(0, 0, 1, 1);
+  transition: color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-steps-changeable .sd-steps-item:not(.sd-steps-item-active, .sd-steps-item-disabled) {
   cursor: pointer;
@@ -8105,7 +8122,7 @@ body.sd-tour-active .sd-tour-popover * {
   z-index: 11;
   text-align: center;
   background-color: var(--sd-color-spin-layer-bg);
-  transition: opacity 0.1s cubic-bezier(0, 0, 1, 1);
+  transition: opacity 0.1s cubic-bezier(0.34, 0.69, 0.1, 1);
   user-select: none;
 }
 .sd-spin-loading {
@@ -8274,7 +8291,7 @@ body.sd-tour-active .sd-tour-popover * {
   background: var(--sd-color-bg-2);
   border: 2px solid rgb(var(--sd-primary-6));
   border-radius: 50%;
-  transition: all 0.3s cubic-bezier(0.3, 1.3, 0.3, 1);
+  transition: transform 0.3s cubic-bezier(0.3, 1.3, 0.3, 1), box-shadow 0.3s cubic-bezier(0.3, 1.3, 0.3, 1);
   content: "";
 }
 .sd-slider-btn.sd-slider-btn-active::after, .sd-slider-btn:hover::after {
@@ -8485,7 +8502,7 @@ body.sd-tour-active .sd-tour-popover * {
 .sd-select-dropdown .sd-select-option-active, .sd-select-dropdown .sd-select-option:not(.sd-select-dropdown .sd-select-option-disabled):hover {
   color: var(--sd-color-text-1);
   background-color: var(--sd-color-fill-2);
-  transition: all 0.1s cubic-bezier(0, 0, 1, 1);
+  transition: color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1), background-color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-select-dropdown .sd-select-option-disabled {
   color: var(--sd-color-text-4);
@@ -8898,7 +8915,7 @@ body.sd-tour-active .sd-tour-popover * {
   height: 100%;
   background-color: var(--sd-color-primary-light-3);
   border-radius: 0 100px 100px 0;
-  transition: all 0.6s cubic-bezier(0.34, 0.69, 0.1, 1);
+  transition: width 0.6s cubic-bezier(0.34, 0.69, 0.1, 1), background-color 0.6s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-progress-line-bar-animate::after {
   position: absolute;
@@ -9032,7 +9049,7 @@ body.sd-tour-active .sd-tour-popover * {
   stroke: var(--sd-color-fill-3);
 }
 .sd-progress-circle-bar {
-  transition: stroke-dashoffset 0.6s cubic-bezier(0, 0, 1, 1) 0s, stroke 0.6s cubic-bezier(0, 0, 1, 1);
+  transition: stroke-dashoffset 0.6s cubic-bezier(0.34, 0.69, 0.1, 1) 0s, stroke 0.6s cubic-bezier(0.34, 0.69, 0.1, 1);
   stroke: rgb(var(--sd-primary-6));
 }
 .sd-progress-size-mini .sd-progress-circle-bg {
@@ -9318,7 +9335,7 @@ body.sd-tour-active .sd-tour-popover * {
   background-color: transparent;
   border-radius: var(--sd-border-radius-small);
   cursor: pointer;
-  transition: all 0.1s cubic-bezier(0, 0, 1, 1);
+  transition: color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1), background-color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-radio-button-content {
   position: relative;
@@ -9334,7 +9351,7 @@ body.sd-tour-active .sd-tour-popover * {
   height: 14px;
   background-color: var(--sd-color-neutral-3);
   transform: translateY(-50%);
-  transition: all 0.1s cubic-bezier(0, 0, 1, 1);
+  transition: opacity 0.1s cubic-bezier(0.34, 0.69, 0.1, 1);
   content: "";
 }
 .sd-radio-button:hover::before, .sd-radio-button:hover + .sd-radio-button::before, .sd-radio-button.sd-radio-checked::before, .sd-radio-button.sd-radio-checked + .sd-radio-button::before {
@@ -9505,7 +9522,13 @@ body.sd-tour-active .sd-tour-popover * {
   border-radius: var(--sd-border-radius-small);
   outline: 0;
   cursor: pointer;
+  transition: color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1), background-color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1), border-color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1), transform 0.1s cubic-bezier(0.34, 0.69, 0.1, 1);
   user-select: none;
+}
+.sd-pagination-item:active:not(.sd-pagination-item-disabled) {
+  transform: scale(0.97);
+}
+.sd-pagination-item {
   min-width: 32px;
   height: 32px;
   font-size: 14px;
@@ -9523,7 +9546,6 @@ body.sd-tour-active .sd-tour-popover * {
   color: rgb(var(--sd-primary-6));
   background-color: var(--sd-color-primary-light-1);
   border-color: transparent;
-  transition: color 0.2s cubic-bezier(0, 0, 1, 1), background-color 0.2s cubic-bezier(0, 0, 1, 1);
 }
 .sd-pagination-item-disabled, .sd-pagination-item-disabled:hover {
   color: var(--sd-color-text-4);
@@ -9876,7 +9898,7 @@ body.sd-tour-active .sd-tour-popover * {
   border-radius: var(--sd-border-radius-medium);
   box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
   opacity: 1;
-  transition: opacity 0.2s cubic-bezier(0, 0, 1, 1);
+  transition: opacity 0.2s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-notification:not(:last-child) {
   margin-bottom: 20px;
@@ -10006,7 +10028,7 @@ body.sd-tour-active .sd-tour-popover * {
 }
 
 .slide-left-notification-leave-active {
-  transition: all 0.3s cubic-bezier(0.34, 0.69, 0.1, 1);
+  transition: height 0.3s cubic-bezier(0.34, 0.69, 0.1, 1), margin 0.3s cubic-bezier(0.34, 0.69, 0.1, 1), padding 0.3s cubic-bezier(0.34, 0.69, 0.1, 1), opacity 0.3s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 
 .slide-right-notification-enter-from,
@@ -10038,7 +10060,7 @@ body.sd-tour-active .sd-tour-popover * {
 }
 
 .slide-right-notification-leave-active {
-  transition: all 0.3s cubic-bezier(0.34, 0.69, 0.1, 1);
+  transition: height 0.3s cubic-bezier(0.34, 0.69, 0.1, 1), margin 0.3s cubic-bezier(0.34, 0.69, 0.1, 1), padding 0.3s cubic-bezier(0.34, 0.69, 0.1, 1), opacity 0.3s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 
 .sd-modal-container {
@@ -10224,7 +10246,7 @@ body.sd-tour-active .sd-tour-popover * {
 
 .zoom-modal-enter-from,
 .zoom-modal-appear-from {
-  transform: scale(0.5, 0.5);
+  transform: scale(0.94, 0.94);
   opacity: 0;
 }
 
@@ -10245,7 +10267,7 @@ body.sd-tour-active .sd-tour-popover * {
 }
 
 .zoom-modal-leave-to {
-  transform: scale(0.5, 0.5);
+  transform: scale(0.94, 0.94);
   opacity: 0;
 }
 
@@ -10315,7 +10337,7 @@ body.sd-tour-active .sd-tour-popover * {
   border: 1px solid var(--sd-color-neutral-3);
   border-radius: var(--sd-border-radius-small);
   box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
-  transition: all 0.1s cubic-bezier(0, 0, 1, 1);
+  transition: background-color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1), border-color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1);
   pointer-events: auto;
 }
 .sd-message-icon {
@@ -10324,7 +10346,7 @@ body.sd-tour-active .sd-tour-popover * {
   color: var(--sd-color-text-1);
   font-size: 20px;
   vertical-align: middle;
-  animation: sd-msg-fade 0.1s cubic-bezier(0, 0, 1, 1), sd-msg-fade 0.4s cubic-bezier(0.3, 1.3, 0.3, 1);
+  animation: sd-msg-fade 0.1s cubic-bezier(0.34, 0.69, 0.1, 1), sd-msg-fade 0.4s cubic-bezier(0.3, 1.3, 0.3, 1);
 }
 .sd-message-content {
   color: var(--sd-color-text-1);
@@ -10403,7 +10425,7 @@ body.sd-tour-active .sd-tour-popover * {
 
 .fade-message-enter-active,
 .fade-message-appear-active {
-  transition: opacity 0.1s cubic-bezier(0, 0, 1, 1);
+  transition: opacity 0.1s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 
 .fade-message-leave-from {
@@ -10513,13 +10535,13 @@ body.sd-tour-active .sd-tour-popover * {
 .sd-menu .sd-menu-pop-header.sd-menu-selected,
 .sd-menu .sd-menu-inline-header.sd-menu-selected {
   font-weight: 500;
-  transition: color 0.2s cubic-bezier(0, 0, 1, 1);
+  transition: color 0.2s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-menu .sd-menu-item.sd-menu-selected svg,
 .sd-menu .sd-menu-group-title.sd-menu-selected svg,
 .sd-menu .sd-menu-pop-header.sd-menu-selected svg,
 .sd-menu .sd-menu-inline-header.sd-menu-selected svg {
-  transition: color 0.2s cubic-bezier(0, 0, 1, 1);
+  transition: color 0.2s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-menu .sd-menu-item .sd-icon,
 .sd-menu .sd-menu-item .sd-menu-icon,
@@ -10625,7 +10647,7 @@ body.sd-tour-active .sd-tour-popover * {
 .sd-menu-light.sd-menu-horizontal .sd-menu-pop-header.sd-menu-selected,
 .sd-menu-light.sd-menu-horizontal .sd-menu-inline-header.sd-menu-selected {
   background: none;
-  transition: color 0.2s cubic-bezier(0, 0, 1, 1);
+  transition: color 0.2s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-menu-light.sd-menu-horizontal .sd-menu-item.sd-menu-selected:hover,
 .sd-menu-light.sd-menu-horizontal .sd-menu-group-title.sd-menu-selected:hover,
@@ -10732,7 +10754,7 @@ body.sd-tour-active .sd-tour-popover * {
 .sd-menu-dark.sd-menu-horizontal .sd-menu-pop-header.sd-menu-selected,
 .sd-menu-dark.sd-menu-horizontal .sd-menu-inline-header.sd-menu-selected {
   background: none;
-  transition: color 0.2s cubic-bezier(0, 0, 1, 1);
+  transition: color 0.2s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-menu-dark.sd-menu-horizontal .sd-menu-item.sd-menu-selected:hover,
 .sd-menu-dark.sd-menu-horizontal .sd-menu-group-title.sd-menu-selected:hover,
@@ -10937,7 +10959,7 @@ body.sd-tour-active .sd-tour-popover * {
   left: 12px;
   height: 3px;
   background-color: rgb(var(--sd-primary-6));
-  animation: sd-menu-selected-item-label-enter 0.2s cubic-bezier(0, 0, 1, 1);
+  animation: sd-menu-selected-item-label-enter 0.2s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-menu-pop-button {
   width: auto;
@@ -11070,7 +11092,7 @@ body.sd-tour-active .sd-tour-popover * {
   color: var(--sd-color-text-1);
   font-weight: 500;
   background-color: transparent;
-  transition: all 0.1s cubic-bezier(0, 0, 1, 1);
+  transition: color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1), background-color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-trigger-menu-item:hover, .sd-trigger-menu-pop-header:hover {
   color: var(--sd-color-text-1);
@@ -11332,7 +11354,7 @@ body.sd-tour-active .sd-tour-popover * {
   background-color: transparent;
   border-radius: var(--sd-border-radius-small);
   cursor: pointer;
-  transition: all 0.1s cubic-bezier(0, 0, 1, 1);
+  transition: color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1), background-color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-link:hover {
   color: rgb(var(--sd-link-6));
@@ -11526,7 +11548,7 @@ body.sd-tour-active .sd-tour-popover * {
   line-height: 44px;
   text-align: center;
   cursor: pointer;
-  transition: all 0.2s cubic-bezier(0.34, 0.69, 0.1, 1);
+  transition: color 0.2s cubic-bezier(0.34, 0.69, 0.1, 1), background-color 0.2s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-layout-sider-zero-width-trigger {
   position: absolute;
@@ -11549,7 +11571,7 @@ body.sd-tour-active .sd-tour-popover * {
   position: absolute;
   inset: 0;
   background: transparent;
-  transition: all 0.3s;
+  transition: background-color 0.3s ease;
   content: "";
 }
 .sd-layout-sider-zero-width-trigger:hover::after {
@@ -11620,7 +11642,7 @@ body.sd-tour-active .sd-tour-popover * {
   border: 1px solid transparent;
   border-radius: var(--sd-border-radius-small);
   cursor: text;
-  transition: color 0.1s cubic-bezier(0, 0, 1, 1), border-color 0.1s cubic-bezier(0, 0, 1, 1), background-color 0.1s cubic-bezier(0, 0, 1, 1);
+  transition: color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1), border-color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1), background-color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-input-tag:hover {
   background-color: var(--sd-color-fill-3);
@@ -11705,7 +11727,7 @@ body.sd-tour-active .sd-tour-popover * {
 }
 .sd-input-tag .sd-input-tag-clear-btn > svg {
   position: relative;
-  transition: color 0.1s cubic-bezier(0, 0, 1, 1);
+  transition: color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-input-tag:hover .sd-input-tag-clear-btn {
   visibility: visible;
@@ -11939,7 +11961,7 @@ body.sd-tour-active .sd-tour-popover * {
 }
 
 .input-tag-zoom-enter-from {
-  transform: scale(0.5, 0.5);
+  transform: scale(0.94, 0.94);
   opacity: 0;
 }
 
@@ -11949,7 +11971,7 @@ body.sd-tour-active .sd-tour-popover * {
 }
 
 .input-tag-zoom-enter-active {
-  transition: all 0.3s cubic-bezier(0.34, 0.69, 0.1, 1);
+  transition: transform 0.3s cubic-bezier(0.34, 0.69, 0.1, 1), opacity 0.3s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 
 .input-tag-zoom-leave-from {
@@ -11958,17 +11980,17 @@ body.sd-tour-active .sd-tour-popover * {
 }
 
 .input-tag-zoom-leave-to {
-  transform: scale(0.5, 0.5);
+  transform: scale(0.94, 0.94);
   opacity: 0;
 }
 
 .input-tag-zoom-leave-active {
   position: absolute;
-  transition: all 0.3s cubic-bezier(0.3, 1.3, 0.3, 1);
+  transition: transform 0.3s cubic-bezier(0.34, 0.69, 0.1, 1), opacity 0.3s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 
 .input-tag-zoom-move {
-  transition: all 0.3s cubic-bezier(0.3, 1.3, 0.3, 1);
+  transition: transform 0.3s cubic-bezier(0.3, 1.3, 0.3, 1);
 }
 
 .sd-input-number {
@@ -11987,7 +12009,7 @@ body.sd-tour-active .sd-tour-popover * {
   background-color: var(--sd-color-fill-2);
   cursor: pointer;
   user-select: none;
-  transition: all 0.1s cubic-bezier(0, 0, 1, 1);
+  transition: color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1), background-color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1), border-color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1), opacity 0.1s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-input-number-step-button:hover {
   background-color: var(--sd-color-fill-3);
@@ -12010,7 +12032,7 @@ body.sd-tour-active .sd-tour-popover * {
   position: relative;
 }
 .sd-input-number-prefix, .sd-input-number-suffix {
-  transition: all 0.1s cubic-bezier(0, 0, 1, 1);
+  transition: color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1), background-color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1), border-color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1), opacity 0.1s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-input-number-mode-embed .sd-input-number-step {
   position: absolute;
@@ -12021,7 +12043,7 @@ body.sd-tour-active .sd-tour-popover * {
   overflow: hidden;
   border-radius: 1px;
   opacity: 0;
-  transition: all 0.1s cubic-bezier(0, 0, 1, 1);
+  transition: color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1), background-color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1), border-color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1), opacity 0.1s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-input-number-mode-embed .sd-input-number-step .sd-input-number-step-button {
   width: 100%;
@@ -12113,7 +12135,7 @@ body.sd-tour-active .sd-tour-popover * {
   border: 1px solid transparent;
   border-radius: var(--sd-border-radius-small);
   cursor: text;
-  transition: color 0.1s cubic-bezier(0, 0, 1, 1), border-color 0.1s cubic-bezier(0, 0, 1, 1), background-color 0.1s cubic-bezier(0, 0, 1, 1);
+  transition: color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1), border-color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1), background-color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-input-wrapper:hover {
   background-color: var(--sd-color-fill-3);
@@ -12198,7 +12220,7 @@ body.sd-tour-active .sd-tour-popover * {
 }
 .sd-input-wrapper .sd-input-clear-btn > svg {
   position: relative;
-  transition: color 0.1s cubic-bezier(0, 0, 1, 1);
+  transition: color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-input-wrapper:hover .sd-input-clear-btn {
   visibility: visible;
@@ -15010,8 +15032,8 @@ body.sd-tour-active .sd-tour-popover * {
 
 .form-blink-enter-active,
 .form-blink-appear-active {
-  transition: opacity 0.3s cubic-bezier(0, 0, 1, 1);
-  animation: sd-form-blink 0.5s cubic-bezier(0, 0, 1, 1);
+  transition: opacity 0.3s cubic-bezier(0.34, 0.69, 0.1, 1);
+  animation: sd-form-blink 0.5s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 
 @keyframes sd-form-blink {
@@ -15240,9 +15262,6 @@ body.sd-tour-active .sd-tour-popover * {
   min-width: 0;
   border-radius: 4px;
 }
-.sd-json-form-control--inline {
-  min-width: 0;
-}
 
 .sd-ellipsis {
   display: inline-block;
@@ -15335,7 +15354,7 @@ body.sd-tour-active .sd-tour-popover * {
 .sd-dropdown-option-active, .sd-dropdown-option:not(.sd-dropdown-option-disabled):hover {
   color: var(--sd-color-text-1);
   background-color: var(--sd-color-fill-2);
-  transition: all 0.1s cubic-bezier(0, 0, 1, 1);
+  transition: color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1), background-color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-dropdown-option-disabled {
   color: var(--sd-color-text-4);
@@ -15862,7 +15881,7 @@ body.sd-tour-active .sd-tour-popover * {
   text-align: center;
   background-color: var(--sd-color-bg-popup);
   border-radius: 50%;
-  transition: all 0.1s cubic-bezier(0, 0, 1, 1);
+  transition: background-color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1);
   user-select: none;
 }
 .sd-picker-header-icon:not(.sd-picker-header-icon-hidden) {
@@ -15875,7 +15894,7 @@ body.sd-tour-active .sd-tour-popover * {
   padding: 2px;
   border-radius: 2px;
   cursor: pointer;
-  transition: all 0.1s;
+  transition: background-color 0.1s;
 }
 .sd-picker-header-label:hover {
   background-color: var(--sd-color-fill-3);
@@ -15931,7 +15950,7 @@ body.sd-tour-active .sd-tour-popover * {
 .sd-picker-cell-selected .sd-picker-date-value {
   color: var(--sd-color-white);
   background-color: rgb(var(--sd-primary-6));
-  transition: background-color 0.1s cubic-bezier(0, 0, 1, 1);
+  transition: background-color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-picker-cell-in-view:not(.sd-picker-cell-selected, .sd-picker-cell-range-start, .sd-picker-cell-range-end, .sd-picker-cell-disabled, .sd-picker-cell-week) .sd-picker-date-value:hover {
   color: var(--sd-color-text-1);
@@ -17033,7 +17052,7 @@ body.sd-tour-active .sd-tour-popover * {
 }
 .sd-checkbox:hover .sd-checkbox-icon {
   border-color: var(--sd-color-fill-4);
-  transition: border-color 0.1s cubic-bezier(0, 0, 1, 1), transform 0.3s cubic-bezier(0.3, 1.3, 0.3, 1);
+  transition: border-color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1), transform 0.3s cubic-bezier(0.3, 1.3, 0.3, 1);
 }
 .sd-checkbox-checked:hover .sd-checkbox-icon, .sd-checkbox-indeterminate:hover .sd-checkbox-icon {
   transition: transform 0.3s cubic-bezier(0.3, 1.3, 0.3, 1);
@@ -17264,7 +17283,7 @@ body.sd-tour-active .sd-tour-popover * {
 .sd-cascader-option-active {
   color: var(--sd-color-text-1);
   background-color: var(--sd-color-fill-2);
-  transition: all 0.2s cubic-bezier(0, 0, 1, 1);
+  transition: color 0.2s cubic-bezier(0.34, 0.69, 0.1, 1), background-color 0.2s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-cascader-option-active:hover {
   color: var(--sd-color-text-1);
@@ -17699,7 +17718,7 @@ body.sd-tour-active .sd-tour-popover * {
 }
 .sd-carousel-arrow-hover div {
   opacity: 0;
-  transition: all 0.3s;
+  transition: opacity 0.3s;
 }
 .sd-carousel:hover .sd-carousel-arrow-hover div {
   opacity: 1;
@@ -17731,7 +17750,7 @@ body.sd-tour-active .sd-tour-popover * {
   position: relative;
   background: var(--sd-color-bg-2);
   border-radius: var(--sd-border-radius-none);
-  transition: box-shadow 0.2s cubic-bezier(0, 0, 1, 1);
+  transition: box-shadow 0.2s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-card-header {
   position: relative;
@@ -17791,7 +17810,7 @@ body.sd-tour-active .sd-tour-popover * {
   justify-content: center;
   color: var(--sd-color-text-2);
   cursor: pointer;
-  transition: color 0.2s cubic-bezier(0, 0, 1, 1);
+  transition: color 0.2s cubic-bezier(0.34, 0.69, 0.1, 1);
   overflow: hidden;
   white-space: nowrap;
   text-overflow: ellipsis;
@@ -17836,7 +17855,7 @@ body.sd-tour-active .sd-tour-popover * {
 .sd-card-grid::before {
   position: absolute;
   inset: 0;
-  transition: box-shadow 0.2s cubic-bezier(0, 0, 1, 1);
+  transition: box-shadow 0.2s cubic-bezier(0.34, 0.69, 0.1, 1);
   content: "";
   pointer-events: none;
 }
@@ -17941,13 +17960,13 @@ body.sd-tour-active .sd-tour-popover * {
   border: 1px solid var(--sd-color-neutral-3);
   border-radius: var(--sd-border-radius-large);
   cursor: pointer;
-  transition: color 0.2s cubic-bezier(0, 0, 1, 1), background-color 0.2s cubic-bezier(0, 0, 1, 1), border-color 0.2s cubic-bezier(0, 0, 1, 1), box-shadow 0.2s cubic-bezier(0, 0, 1, 1);
+  transition: color 0.2s cubic-bezier(0.34, 0.69, 0.1, 1), background-color 0.2s cubic-bezier(0.34, 0.69, 0.1, 1), border-color 0.2s cubic-bezier(0.34, 0.69, 0.1, 1), box-shadow 0.2s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-selectable-card::after {
   position: absolute;
   background: transparent;
   border-radius: inherit;
-  transition: background 0.2s cubic-bezier(0, 0, 1, 1);
+  transition: background 0.2s cubic-bezier(0.34, 0.69, 0.1, 1);
   content: "";
   pointer-events: none;
   inset: 0;
@@ -19748,7 +19767,7 @@ body.sd-tour-active .sd-tour-popover * {
 }
 
 [class*=-calendar-delete-btn-enter-from] {
-  transform: scale(0) rotate(-90deg);
+  transform: scale(0.5) rotate(-90deg);
 }
 
 [class*=-calendar-delete-btn-enter-to] {
@@ -19756,7 +19775,7 @@ body.sd-tour-active .sd-tour-popover * {
 }
 
 [class*=-calendar-delete-btn-leave-active] {
-  transform: scale(0);
+  transform: scale(0.5);
   transition: 0.3s ease-in-out;
 }
 
@@ -19777,7 +19796,7 @@ body.sd-tour-active .sd-tour-popover * {
   white-space: nowrap;
   outline: none;
   cursor: pointer;
-  transition: all 0.1s cubic-bezier(0, 0, 1, 1);
+  transition: color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1), background-color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1), border-color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1), transform 0.1s cubic-bezier(0.34, 0.69, 0.1, 1);
   appearance: none;
   user-select: none;
 }
@@ -19785,7 +19804,7 @@ body.sd-tour-active .sd-tour-popover * {
   color: currentcolor;
 }
 .sd-btn:active {
-  transition: none;
+  transform: scale(0.97);
 }
 .sd-btn-long {
   display: flex;
@@ -19825,13 +19844,10 @@ body.sd-tour-active .sd-tour-popover * {
   background: #fff;
   border-radius: inherit;
   opacity: 0.4;
-  transition: opacity 0.1s cubic-bezier(0, 0, 1, 1);
+  transition: opacity 0.1s cubic-bezier(0.34, 0.69, 0.1, 1);
   content: "";
   pointer-events: none;
 }
-.sd-btn-loading-fixed-width {
-  transition: none;
-}
 .sd-btn-two-chinese-chars > *:not(svg) {
   margin-right: -0.3em;
   letter-spacing: 0.3em;
@@ -20654,6 +20670,9 @@ body.sd-tour-active .sd-tour-popover * {
 .sd-btn-group .sd-btn-dashed:active {
   z-index: 2;
 }
+.sd-btn-group .sd-btn:active {
+  transform: none;
+}
 .sd-btn-group .sd-btn:first-child {
   border-top-right-radius: 0;
   border-bottom-right-radius: 0;
@@ -20670,6 +20689,14 @@ body.sd-tour-active .sd-tour-popover * {
   color: rgba(255, 255, 255, 0.3);
 }
 
+@media (prefers-reduced-motion: reduce) {
+  .sd-btn:active {
+    transform: none;
+  }
+  .sd-btn .sd-icon-loading {
+    animation-duration: 3s;
+  }
+}
 .sd-breadcrumb {
   display: inline-flex;
   align-items: center;
@@ -20861,7 +20888,7 @@ body.sd-tour-active .sd-tour-popover * {
 
 @keyframes sd-badge-scale {
   from {
-    transform: scale(0, 0);
+    transform: scale(0.5, 0.5);
   }
   to {
     transform: scale(1, 1);
@@ -20869,7 +20896,7 @@ body.sd-tour-active .sd-tour-popover * {
 }
 .badge-zoom-enter,
 .badge-zoom-appear {
-  transform: translate(50%, -50%) scale(0.2, 0.2);
+  transform: translate(50%, -50%) scale(0.5, 0.5);
   transform-origin: center;
 }
 
@@ -20888,12 +20915,38 @@ body.sd-tour-active .sd-tour-popover * {
 }
 
 .badge-zoom-exit-active {
-  transform: translate(50%, -50%) scale(0.2, 0.2);
+  transform: translate(50%, -50%) scale(0.5, 0.5);
   transform-origin: center;
   opacity: 0;
   transition: opacity 0.3s cubic-bezier(0.3, 1.3, 0.3, 1), transform 0.3s cubic-bezier(0.3, 1.3, 0.3, 1);
 }
 
+.sd-basic-crud-table {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  width: 100%;
+  min-width: 0;
+}
+.sd-basic-crud-table-header {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+}
+.sd-basic-crud-table-header-actions {
+  display: flex;
+  justify-content: flex-end;
+}
+.sd-basic-crud-table-title {
+  margin: 0;
+  color: var(--sd-color-text-1);
+  font-size: 24px;
+}
+.sd-basic-crud-table-body {
+  width: 100%;
+  min-width: 0;
+}
+
 .sd-back-top {
   position: fixed;
   right: 24px;
@@ -20911,7 +20964,7 @@ body.sd-tour-active .sd-tour-popover * {
   border-radius: var(--sd-border-radius-circle);
   outline: none;
   cursor: pointer;
-  transition: all 0.2s cubic-bezier(0, 0, 1, 1);
+  transition: background-color 0.2s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-back-top-btn:hover {
   background-color: rgb(var(--sd-primary-5));
@@ -20990,7 +21043,7 @@ body.sd-tour-active .sd-tour-popover * {
   text-align: center;
   background-color: var(--sd-color-neutral-2);
   border-radius: var(--sd-border-radius-circle);
-  transition: background-color 0.1s cubic-bezier(0, 0, 1, 1);
+  transition: background-color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-avatar-trigger-icon-mask {
   position: absolute;
@@ -21007,7 +21060,7 @@ body.sd-tour-active .sd-tour-popover * {
   background-color: color-mix(in srgb, #1d2129 60%, transparent);
   border-radius: var(--sd-border-radius-medium);
   opacity: 0;
-  transition: all 0.1s cubic-bezier(0, 0, 1, 1);
+  transition: opacity 0.1s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-avatar-circle .sd-avatar-trigger-icon-mask {
   border-radius: var(--sd-border-radius-circle);
@@ -21157,7 +21210,7 @@ body.sd-tour-active .sd-tour-popover * {
 .sd-anchor-link-active > .sd-anchor-link {
   color: var(--sd-color-text-1);
   font-weight: 500;
-  transition: all 0.1s cubic-bezier(0, 0, 1, 1);
+  transition: color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1), background-color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-anchor-link-item .sd-anchor-link-item {
   margin-left: 16px;
@@ -21316,7 +21369,7 @@ body.sd-tour-active .sd-tour-popover * {
   border: none;
   outline: none;
   cursor: pointer;
-  transition: color 0.1s cubic-bezier(0, 0, 1, 1);
+  transition: color 0.1s cubic-bezier(0.34, 0.69, 0.1, 1);
 }
 .sd-alert-close-btn:hover {
   color: var(--sd-color-text-1);