@sdata/web-vue 4.0.0 → 4.2.0

package/dist/sd.css

@@ -7938,6 +7938,9 @@ body.sd-tour-active .sd-tour-popover * {
   font-size: inherit;
   white-space: nowrap;
 }
+.sd-statistic-content .sd-statistic-value .sd-number-flow-fraction {
+  font-size: inherit;
+}
 .sd-statistic-content .sd-statistic-value-decimal {
   display: inline-block;
   font-size: inherit;
@@ -10515,6 +10518,74 @@ body.sd-tour-active .sd-tour-popover * {
   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-number-flow {
+  display: inline-flex;
+  align-items: baseline;
+  line-height: 1;
+  direction: ltr;
+  white-space: nowrap;
+  isolation: isolate;
+}
+.sd-number-flow-content, .sd-number-flow-part, .sd-number-flow-digit-track, .sd-number-flow-digit-value, .sd-number-flow-symbol {
+  display: inline-block;
+}
+.sd-number-flow-content {
+  margin: -0.25em -0.2em;
+  padding: 0.25em 0.2em;
+  overflow: hidden;
+}
+.sd-number-flow-part {
+  position: relative;
+  vertical-align: bottom;
+}
+.sd-number-flow-digit {
+  height: 1em;
+  overflow: hidden;
+}
+.sd-number-flow-digit-track {
+  display: flex;
+  flex-direction: column;
+  height: 1em;
+  transform: translateY(calc(1em * var(--sd-number-flow-start)));
+}
+.sd-number-flow-digit-value {
+  flex: 0 0 1em;
+  height: 1em;
+  line-height: 1;
+  text-align: center;
+  font-variant-numeric: tabular-nums;
+}
+.sd-number-flow-prepared .sd-number-flow-digit-track {
+  transition: none;
+}
+.sd-number-flow-animating .sd-number-flow-digit-track {
+  transform: translateY(calc(1em * var(--sd-number-flow-end)));
+  transition: transform var(--sd-number-flow-spin-duration, var(--sd-number-flow-duration)) var(--sd-number-flow-spin-easing, var(--sd-number-flow-easing)), opacity var(--sd-number-flow-opacity-duration) ease-out;
+}
+.sd-number-flow-symbol {
+  white-space: pre;
+}
+.sd-number-flow-will-change :is(.sd-number-flow-content, .sd-number-flow-part, .sd-number-flow-digit-track, .sd-number-flow-symbol) {
+  will-change: transform;
+}
+.sd-number-flow-custom-prefix {
+  margin-right: 4px;
+}
+.sd-number-flow-custom-suffix {
+  margin-left: 4px;
+}
+
+.sd-number-flow-group {
+  display: inline-flex;
+  gap: 4px;
+  align-items: baseline;
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .sd-number-flow-digit-track {
+    transition: none;
+  }
+}
 .sd-modal-container {
   position: fixed;
   inset: 0;
@@ -21932,6 +22003,124 @@ body.sd-tour-active .sd-tour-popover * {
   display: inline-flex;
 }
 
+.sd-bloom-menu {
+  display: inline-flex;
+  font-family: inter, "-apple-system", blinkmacsystemfont, "PingFang SC", "Hiragino Sans GB", "noto sans", "Microsoft YaHei", "Helvetica Neue", helvetica, arial, sans-serif;
+}
+.sd-bloom-menu-trigger-content {
+  display: inline-flex;
+  gap: 8px;
+  align-items: center;
+  white-space: nowrap;
+}
+.sd-bloom-menu-trigger-content svg {
+  width: 16px;
+  height: 16px;
+}
+.sd-bloom-menu-panel {
+  --bloom-menu-panel-width: min(86vw, 420px);
+  --bloom-menu-panel-color: var(--sd-color-text-1);
+  --bloom-menu-panel-background: var(--sd-color-bg-2);
+  --bloom-menu-panel-border-color: var(--sd-color-neutral-3);
+  --bloom-menu-panel-border-radius: var(--sd-border-radius-medium);
+  --bloom-menu-panel-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
+  overflow: hidden;
+  border: 1px solid var(--sd-color-neutral-3);
+}
+.sd-bloom-menu-popup {
+  padding: 0;
+}
+.sd-bloom-menu-content {
+  width: 100%;
+}
+.sd-bloom-menu-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 12px 16px;
+  color: var(--sd-color-text-2);
+  border-bottom: 1px solid var(--sd-color-neutral-3);
+}
+.sd-bloom-menu-title {
+  font-weight: 500;
+  font-size: 14px;
+}
+.sd-bloom-menu-close {
+  color: inherit;
+}
+.sd-bloom-menu-close:hover {
+  color: var(--sd-color-text-1);
+}
+.sd-bloom-menu-close svg {
+  width: 16px;
+  height: 16px;
+}
+.sd-bloom-menu-grid {
+  display: grid;
+  grid-template-columns: repeat(var(--bloom-menu-columns), minmax(0, 1fr));
+}
+.sd-bloom-menu-item {
+  min-width: 0;
+  height: auto;
+  padding: 24px 12px;
+  color: var(--sd-color-text-2);
+  border-radius: 0;
+}
+.sd-bloom-menu-item:hover:not(:disabled) {
+  color: var(--sd-color-text-1);
+  background: var(--sd-color-fill-2);
+}
+.sd-bloom-menu-item:focus-visible {
+  position: relative;
+  z-index: 1;
+  outline: 2px solid rgb(var(--sd-primary-6));
+  outline-offset: -2px;
+}
+.sd-bloom-menu-item-border-right {
+  border-right: 1px solid var(--sd-color-neutral-3);
+}
+.sd-bloom-menu-item-border-bottom {
+  border-bottom: 1px solid var(--sd-color-neutral-3);
+}
+.sd-bloom-menu-item-disabled, .sd-bloom-menu-item:disabled {
+  color: var(--sd-color-text-4);
+  cursor: not-allowed;
+}
+.sd-bloom-menu-item-content {
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
+  align-items: center;
+  min-width: 0;
+}
+.sd-bloom-menu-item-icon {
+  display: inline-flex;
+  font-size: 20px;
+}
+.sd-bloom-menu-item-icon svg {
+  width: 20px;
+  height: 20px;
+}
+.sd-bloom-menu-item-label {
+  max-width: 100%;
+  overflow: hidden;
+  font-weight: 500;
+  font-size: 14px;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+}
+.sd-bloom-menu-empty {
+  padding: 24px 16px;
+  color: var(--sd-color-text-2);
+  font-size: 14px;
+  text-align: center;
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .sd-bloom-menu-item, .sd-bloom-menu-close {
+    transition: none;
+  }
+}
 .sd-avatar {
   position: relative;
   display: inline-flex;