@bioturing/components 0.13.1

package/dist/style.css

@@ -0,0 +1,1242 @@
+:root {
+  --ds-modal-padding: 24px;
+  --ds-modal-edge-padding: 16px;
+  --ds-scrollbar-width: auto;
+  --ds-scrollbar-width-legacy: 15;
+  --ds-inter: "Inter", Helvetica, Arial, sans-serif;
+  --ds-roboto-mono: "Roboto Mono", Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
+}
+
+@supports (font-variation-settings: normal) {
+  :root {
+    --ds-inter: "InterVariable", Helvetica, Arial, sans-seri;
+    --ds-roboto-mono: "Roboto Mono Variable", Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
+    font-optical-sizing: auto;
+  }
+}
+
+.ds-theme-provider {
+  --ds-color-bg-segment-active: #fff;
+  --ds-scrollbar-color-thumb: #0003;
+  --ds-scrollbar-color-track: #0000;
+  --ds-color-base-solid: #000;
+  --ds-table-fixed-column-shadow-color: #0000001a;
+}
+
+.ds-theme-provider.dark {
+  --ds-color-bg-segment-active: #424248;
+  --ds-scrollbar-color-thumb: #fff3;
+  --ds-scrollbar-color-track: #0000;
+  --ds-color-base-solid: #fff;
+  --ds-table-fixed-column-shadow-color: #0003;
+}
+
+@supports (scrollbar-width: auto) {
+  * {
+    scrollbar-color: var(--ds-scrollbar-color-thumb) var(--ds-scrollbar-color-track);
+    scrollbar-width: var(--ds-scrollbar-width);
+  }
+}
+
+@supports selector(::-webkit-scrollbar) {
+  ::-webkit-scrollbar-thumb {
+    background: var(--ds-scrollbar-color-thumb);
+  }
+
+  ::-webkit-scrollbar-track {
+    background: var(--ds-scrollbar-color-track);
+  }
+
+  ::-webkit-scrollbar {
+    max-width: var(--ds-scrollbar-width-legacy);
+    max-height: var(--ds-scrollbar-width-legacy);
+  }
+}
+
+body {
+  margin: 0;
+  padding: 0;
+}
+
+a[href], button:not(:disabled) {
+  cursor: pointer;
+}
+
+svg {
+  vertical-align: baseline;
+}
+
+.ds-grow {
+  flex-grow: 1;
+}
+
+.ds-shrink {
+  flex-shrink: 1;
+}
+
+.ds-truncate {
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  flex-grow: 1;
+  width: 100%;
+  overflow: hidden;
+}
+
+.text-ds-subheading {
+  text-transform: uppercase;
+  letter-spacing: .002em;
+  font-size: .75rem;
+  font-weight: 500;
+  line-height: 1rem;
+}
+
+.text-ds-subheading2 {
+  text-transform: uppercase;
+  letter-spacing: .002em;
+  font-size: .625rem;
+  font-weight: 500;
+  line-height: 1.4;
+}
+
+.ds-breadcrumb {
+  display: flex;
+}
+
+.ds-breadcrumb ol {
+  flex: 1;
+  gap: .25rem 0;
+  min-width: 0;
+  display: inline-flex;
+}
+
+.ds-breadcrumb > ol > li {
+  flex: 0 1 0;
+  align-items: center;
+  max-width: 100%;
+  display: inline-flex;
+}
+
+.ds-breadcrumb > ol > li.ds-breadcrumb-separator {
+  flex: 0;
+}
+
+.ds-breadcrumb > ol > li .ds-breadcrumb-link {
+  white-space: nowrap;
+  flex: 0 auto;
+  align-items: center;
+  gap: .5rem;
+  min-width: 0;
+  display: inline-flex;
+}
+
+.ds-breadcrumb .ds-breadcrumb-item-name {
+  flex: auto;
+}
+
+.ds-breadcrumb .ds-breadcrumb-item-icon {
+  flex: none;
+}
+
+.ds-breadcrumb.ds-breadcrumb-nowrap {
+  flex-grow: 1;
+  align-items: center;
+  min-width: 0;
+  display: flex;
+}
+
+.ds-breadcrumb.ds-breadcrumb-nowrap ol {
+  flex-wrap: nowrap;
+}
+
+.ds-breadcrumb.ds-breadcrumb-nowrap ol li:not(.ds-breadcrumb-separator) {
+  flex: 0 auto;
+  min-width: 0;
+  max-width: 100%;
+  transition: all .2s;
+  display: flex;
+}
+
+.ds-breadcrumb.ds-breadcrumb-nowrap ol li:not(.ds-breadcrumb-separator) span.ds-breadcrumb-link {
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  max-width: 100%;
+  display: block;
+  overflow: hidden;
+}
+
+.ds-breadcrumb.ds-breadcrumb-nowrap ol li:last-child {
+  flex: none;
+}
+
+.ds-breadcrumb.ds-breadcrumb-nowrap ol:hover li:last-child {
+  flex-shrink: 1;
+}
+
+.ds-breadcrumb.ds-breadcrumb-nowrap ol li:hover {
+  flex-shrink: 0;
+}
+
+span.ds-btn-icon {
+  align-items: center;
+  display: flex;
+}
+
+.ds-checkbox-wrapper .ds-checkbox.ds-checkbox-indeterminate .ds-checkbox-inner {
+  background-color: var(--ds-color-primary) !important;
+  border-color: var(--ds-color-primary) !important;
+}
+
+.ds-checkbox-wrapper .ds-checkbox.ds-checkbox-indeterminate .ds-checkbox-inner:after {
+  background-color: var(--ds-color-white);
+  border-radius: .125rem;
+  height: .125rem;
+}
+
+.ds-code-block {
+  background: var(--ds-color-bg-layout);
+  box-shadow: 0 0 0 1px inset var(--ds-color-split);
+  border-radius: var(--ds-border-radius);
+  font-family: var(--font-mono);
+  padding: 1rem;
+  position: relative;
+}
+
+.ds-code-block-header {
+  justify-items: start;
+  margin-bottom: .75rem;
+  display: flex;
+}
+
+.ds-code-block-copy {
+  opacity: 0;
+  transition: opacity .2s ease-in-out;
+  position: absolute;
+  top: 1rem;
+  right: .75rem;
+}
+
+.ds-code-block:hover .ds-code-block-copy {
+  opacity: 100;
+}
+
+.ds-code-block-content {
+  padding-right: 1.5rem;
+}
+
+.ds-code-block-content .ds-scoll-area {
+  max-height: 30rem;
+}
+
+.ds-collapse .ds-collapse-header {
+  align-items: center;
+  display: flex;
+}
+
+.ds-collapse .ds-collapse-expand-icon {
+  flex-grow: 0;
+  flex-shrink: 0;
+  justify-content: center;
+  align-items: center;
+  display: flex;
+}
+
+.ds-collapse .ds-collapse-header-text {
+  flex-grow: 1;
+  flex-shrink: 1;
+  min-width: 0;
+}
+
+.ds-collapsible-panel {
+  flex-basis: fit-content;
+  flex-direction: column;
+  flex-grow: 0;
+  flex-shrink: 0;
+  max-height: 100%;
+  display: flex;
+  overflow: hidden;
+}
+
+.ds-collapsible-panel[data-closed] {
+  transition: all .2s ease-out;
+}
+
+.ds-collapsible-panel[data-open] {
+  flex-grow: 1;
+  transition: all .2s ease-in;
+}
+
+.ds-collapsible-panel-trigger {
+  cursor: pointer;
+  text-align: left;
+  background: none;
+  border: none;
+  padding: 0;
+}
+
+.ds-collapsible-panel-header {
+  border-bottom: 1px solid #0000;
+  flex-direction: column;
+  flex-grow: 0;
+  transition: all .2s ease-in-out;
+  display: flex;
+}
+
+.ds-collapsible-panel-header-inner {
+  align-items: center;
+  gap: .5rem;
+  padding: .75rem 1rem;
+  transition: width .2s;
+  display: flex;
+}
+
+.ds-collapsible-panel-header-after {
+  align-items: center;
+  gap: .5rem;
+  padding: 0 1rem .75rem;
+  display: flex;
+}
+
+.ds-collapsible-panel[data-open] .ds-collapsible-panel-header {
+  border-bottom: 1px solid var(--ds-color-split);
+}
+
+.ds-collapsible-panel[data-open] .ds-collapsible-panel-header-inner {
+  flex-grow: 1;
+  justify-content: flex-start;
+}
+
+.ds-collapsible-panel-trigger:hover .ds-collapsible-panel-header {
+  background-color: var(--ds-color-bg-hover);
+}
+
+.ds-collapsible-panel-header-actions {
+  flex-grow: 0;
+  flex-shrink: 0;
+  justify-content: center;
+  align-items: center;
+  gap: .5rem;
+  display: flex;
+}
+
+.ds-collapsible-panel-header-text {
+  font-size: var(--text-ds-h5);
+  font-weight: var(--text-ds-h5--font-weight);
+  line-height: var(--text-ds-h5--line-height);
+  color: var(--ds-color-text);
+  flex-grow: 1;
+  display: inline-block;
+}
+
+.ds-collapsible-panel[data-closed] .ds-collapsible-panel-header-inner {
+  writing-mode: vertical-rl;
+  transform: rotate(180deg);
+}
+
+.ds-collapsible-panel-content {
+  flex-direction: column;
+  flex-grow: 1;
+  flex-shrink: 1;
+  display: flex;
+  overflow-y: auto;
+}
+
+.ds-collapsible-panel-content[data-closed] {
+  display: none;
+}
+
+.ds-collapsible-panel-body {
+  padding: var(--ds-content-padding);
+  flex-grow: 1;
+  transition: opacity .2s ease-in-out;
+}
+
+.ds-collapsible-panel-body[data-starting], .ds-collapsible-panel-body[data-ending] {
+  opacity: 0;
+}
+
+.ds-dropdown-menu {
+  box-shadow: var(--ds-box-shadow-secondary);
+  border-radius: var(--ds-border-radius);
+  background: var(--ds-color-bg-elevated);
+  color: var(--ds-color-text);
+  font-size: var(--ds-font-size);
+  font-family: var(--ds-font-family);
+  transition-property: transform, scale, opacity;
+  transition-duration: .2s;
+  transition-timing-function: var(--ds-motion-ease-out);
+  transform-origin: var(--transform-origin);
+  padding: .25rem;
+  list-style: none;
+}
+
+.ds-dropdown-menu[data-ending-style], .ds-dropdown-menu[data-starting-style] {
+  opacity: 0;
+  transform: scale(.9);
+}
+
+.ds-dropdown-menu:focus {
+  outline: none;
+}
+
+.ds-dropdown-menu-item {
+  border-radius: var(--ds-border-radius-sm);
+  transition: all .3s var(--ds-motion-ease-out);
+  cursor: pointer;
+  align-items: center;
+  padding: .375rem .75rem;
+  display: flex;
+}
+
+.ds-dropdown-menu-item:focus {
+  outline: none;
+}
+
+.ds-dropdown-menu-item:hover {
+  background: var(--ds-control-item-bg-hover);
+}
+
+.ds-dropdown-menu-item:active, .ds-dropdown-menu-item:focus, .ds-dropdown-menu-item[data-focus] {
+  background: var(--ds-control-item-bg-active);
+}
+
+.ds-dropdown-menu-item[data-disabled] {
+  pointer-events: none;
+  color: var(--ds-color-text-disabled);
+}
+
+.ds-dropdown-menu-item[data-danger] {
+  color: var(--ds-color-error);
+}
+
+.ds-dropdown-menu-item[data-danger]:hover {
+  background: var(--ds-color-error-bg);
+}
+
+.ds-dropdown-menu-item[data-danger]:active, .ds-dropdown-menu-item[data-danger]:focus, .ds-dropdown-menu-item[data-danger][data-focus] {
+  background: var(--ds-color-error-bg-hover);
+}
+
+.ds-dropdown-menu-item-icon {
+  color: var(--ds-color-icon);
+  justify-content: center;
+  align-items: center;
+  margin-right: .5rem;
+  font-size: 1rem;
+  display: flex;
+}
+
+[data-danger] .ds-dropdown-menu-item-icon {
+  color: var(--ds-color-error);
+}
+
+.ds-dropdown-menu-divider {
+  border-bottom: 1px solid var(--ds-color-split);
+  margin: .25rem 0;
+}
+
+.ds-dropdown-menu-header {
+  text-transform: uppercase;
+  color: var(--ds-color-text-tertiary);
+  padding: .75rem .75rem .25rem;
+  font-size: .75rem;
+  font-weight: 500;
+  line-height: 1rem;
+}
+
+.ds-dropdown-menu-header:first-child {
+  padding-top: .5rem;
+}
+
+.ds-icon-button {
+  cursor: pointer;
+  color: var(--ds-color-icon);
+  background-color: #0000;
+  border: none;
+  border-radius: 999px;
+  justify-content: center;
+  align-items: center;
+  transition: all .2s;
+  display: inline-flex;
+}
+
+.ds-icon-button:hover {
+  background-color: var(--ds-color-fill-secondary);
+  color: var(--ds-color-icon-hover);
+}
+
+.ds-icon-button:active, .ds-icon-button.ds-popover-open {
+  background-color: var(--ds-color-primary-bg);
+  color: var(--ds-color-primary);
+}
+
+.ds-icon-button:focus {
+  outline: none;
+}
+
+.ds-icon-button:disabled {
+  cursor: not-allowed;
+  pointer-events: none;
+  color: var(--ds-color-text-disabled);
+}
+
+.ds-icon-button.ds-icon-button-medium {
+  width: 1.5rem;
+  height: 1.5rem;
+  padding: .125rem;
+  font-size: 1.25rem;
+}
+
+.ds-icon-button.ds-icon-button-small {
+  width: 1.25rem;
+  height: 1.25rem;
+  padding: .125rem;
+  font-size: 1rem;
+}
+
+.ds-icon-button.ds-icon-button-negative-margin {
+  margin: -.125rem;
+}
+
+.ds-empty .ds-empty-image {
+  height: auto;
+}
+
+.ds-empty-small .ds-empty-icon {
+  color: var(--ds-color-base-solid);
+  font-size: 2rem;
+}
+
+.ds-empty-medium .ds-empty-icon {
+  font-size: 3rem;
+}
+
+.ds-empty-large .ds-empty-icon {
+  font-size: 4rem;
+}
+
+.ds-form-item-label-inner {
+  align-items: center;
+  gap: .25rem;
+  display: inline-flex;
+}
+
+.ds-form-item-label-optional-mark {
+  color: var(--ds-color-text-tertiary);
+}
+
+.ds-field {
+  align-items: center;
+  gap: .5rem;
+  display: inline-flex;
+}
+
+.ds-field label {
+  color: var(--ds-color-text-secondary);
+  font-size: var(--ds-font-size);
+  line-height: var(--ds-line-height);
+}
+
+.ds-message {
+  flex-direction: column;
+  justify-content: flex-end;
+  display: flex;
+  position: fixed;
+  bottom: 20px !important;
+  top: unset !important;
+}
+
+@keyframes moveUp {
+  0% {
+    opacity: 0;
+    height: 0;
+    padding-bottom: 0;
+    transform: translateY(30%);
+  }
+
+  to {
+    opacity: 1;
+    height: calc-size(auto);
+    padding-bottom: var(--ds-padding-sm);
+    transform: translateY(0);
+  }
+}
+
+.ds-message-notice-wrapper {
+  padding-top: 0;
+  padding-left: 0;
+  padding-right: 0;
+  padding-bottom: var(--ds-padding-sm);
+}
+
+.ds-message .ds-message-move-up-appear, .ds-message .ds-message-move-up-enter {
+  animation-name: moveUp;
+  animation-duration: .3s;
+  overflow: hidden;
+}
+
+.ds-message .ds-message-move-up-appear-active {
+  padding-bottom: var(--ds-padding-sm);
+}
+
+.ds-message .ds-message-move-up-leave {
+  animation-name: moveUp;
+  animation-duration: .3s;
+  animation-timing-function: ease-in-out;
+  animation-direction: reverse;
+}
+
+.ds-modal-wrap {
+  max-height: 100vh;
+}
+
+.ds-modal-wrap .ds-modal-close-x {
+  width: 100%;
+  display: flex;
+}
+
+.ds-modal-wrap .ds-modal {
+  max-height: 100vh;
+  margin-top: 0;
+  margin-bottom: 0;
+  padding-bottom: 0;
+  top: 0;
+}
+
+.ds-modal-wrap .ds-modal .ds-modal-content {
+  flex-direction: column;
+  padding: 0;
+  display: flex;
+}
+
+.ds-modal-wrap .ds-modal .ds-modal-body {
+  padding: var(--ds-modal-content-padding);
+  flex-grow: 1;
+  flex-shrink: 1;
+  min-height: 0;
+  overflow: auto;
+}
+
+.ds-modal-wrap .ds-modal .ds-modal-header {
+  padding: calc(var(--ds-modal-padding) * 2 / 3) var(--ds-modal-padding) 0 var(--ds-modal-padding);
+  margin-bottom: 0;
+}
+
+.ds-modal-wrap .ds-modal .ds-modal-footer {
+  padding: 0 var(--ds-modal-padding) var(--ds-modal-padding) var(--ds-modal-padding);
+  margin-top: 0;
+}
+
+.ds-modal-wrap .ds-modal .ds-modal-close {
+  top: calc(var(--ds-modal-padding) * 2 / 3 - 4px);
+}
+
+.ds-modal-wrap:not(.ds-modal-centered) .ds-modal-inner {
+  margin-top: 4rem;
+}
+
+.ds-modal-wrap:not(.ds-modal-fullscreen) .ds-modal-content {
+  max-height: calc(100vh - var(--ds-modal-edge-padding) * 2);
+  margin: var(--ds-modal-edge-padding);
+}
+
+.ds-modal-wrap:not(.ds-modal-fullscreen) .ds-modal > div[tabindex="0"] {
+  max-height: calc(100vh - var(--ds-modal-edge-padding) * 2);
+}
+
+.ds-modal-fullscreen .ds-modal > div[tabindex="0"], .ds-modal-fullscreen .ds-modal .ds-modal-inner {
+  height: 100%;
+}
+
+.ds-modal-fullscreen .ds-modal .ds-modal-content {
+  border-radius: 0;
+  width: 100%;
+  height: 100%;
+}
+
+.ds-modal-fixed .ds-modal .ds-modal-footer {
+  border-top: 1px solid var(--ds-color-split);
+  padding: calc(var(--ds-modal-padding) / 2) var(--ds-modal-padding);
+  margin-top: 0;
+}
+
+.ds-modal-fixed .ds-modal .ds-modal-header {
+  border-bottom: 1px solid var(--ds-color-split);
+  padding: calc(var(--ds-modal-padding) / 2) var(--ds-modal-padding);
+  margin-bottom: 0;
+}
+
+.ds-modal-fixed .ds-modal .ds-modal-close {
+  top: 8px;
+}
+
+.ds-modal-scrollable .ds-modal .ds-modal-inner {
+  margin-top: 0;
+}
+
+.ds-radio {
+  align-self: unset;
+}
+
+.ds-radio-wrapper {
+  display: inline-flex;
+}
+
+.ds-radio-wrapper .ds-radio {
+  transform: translateY(.1875rem);
+}
+
+.ds-scroll-area {
+  flex-direction: column;
+  height: 100%;
+  min-height: 0;
+  display: flex;
+}
+
+.ds-scroll-area .ds-scroll-area-viewport {
+  overscroll-behavior: contain;
+  flex-shrink: 1;
+  height: 100%;
+  max-height: 100%;
+  overflow: hidden;
+}
+
+.ds-scroll-area .ds-scroll-area-viewport:focus-visible {
+  outline-offset: 4px;
+  outline-width: 2px;
+  outline-color: var(--ds-color-primary);
+}
+
+.ds-scroll-area .ds-scroll-area-scrollbar {
+  opacity: 0;
+  background-color: #0000;
+  justify-content: center;
+  padding: .25rem;
+  transition-property: opacity;
+  transition-delay: .1s;
+  display: flex;
+}
+
+.ds-scroll-area .ds-scroll-area-scrollbar .ds-scroll-area-thumb {
+  background-color: var(--ds-color-bg-fill-tertiary);
+  border: 1px solid var(--ds-color-border);
+  border-radius: 9999px;
+}
+
+.ds-scroll-area .ds-scroll-area-scrollbar[data-orientation="vertical"] {
+  width: .875rem;
+}
+
+.ds-scroll-area .ds-scroll-area-scrollbar[data-orientation="vertical"] .ds-scroll-area-thumb {
+  width: 100%;
+}
+
+.ds-scroll-area .ds-scroll-area-scrollbar[data-orientation="horizontal"] {
+  flex-direction: column;
+  width: 100%;
+  height: .875rem;
+}
+
+.ds-scroll-area .ds-scroll-area-scrollbar[data-orientation="horizontal"] .ds-scroll-area-thumb {
+  height: 100%;
+}
+
+.ds-scroll-area .ds-scroll-area-scrollbar[data-hovering], .ds-scroll-area .ds-scroll-area-scrollbar[data-scrolling] {
+  opacity: 1;
+  transition-duration: .2s;
+  transition-delay: 0s;
+}
+
+.ds-segmented .ds-segmented-item-label {
+  justify-content: center;
+  align-items: center;
+  display: flex;
+}
+
+.ds-segmented .ds-segmented-item-icon {
+  justify-content: center;
+  align-items: center;
+  height: 100%;
+  font-size: 1rem;
+  display: flex;
+}
+
+.ds-select-popup .ds-select-item-option-state {
+  order: -1;
+}
+
+.ds-select-popup .ds-select-checkbox-indicator, .ds-select-popup .ant-select-checkbox-indicator {
+  margin-right: .5rem;
+}
+
+.ds-select-multiple .ds-select-item-option-selected:not(.ds-select-item-option-disabled):not(:hover) {
+  background: none;
+}
+
+:root {
+  --ds-animate-spin: ds-spin 1s linear infinite;
+}
+
+@keyframes ds-spin {
+  0% {
+    transform: rotate(0);
+  }
+
+  to {
+    transform: rotate(360deg);
+  }
+}
+
+.ds-spin .ds-spin-icon {
+  animation: var(--ds-animate-spin);
+  color: var(--ds-color-icon);
+}
+
+.ds-spin .ds-spin-text {
+  color: var(--ds-color-icon);
+}
+
+.ds-spin-loader {
+  border: max(2px, .12em) solid var(--ds-color-border);
+  border-bottom-color: var(--ds-color-icon);
+  box-sizing: border-box;
+  border-radius: 50%;
+  width: 1em;
+  height: 1em;
+  animation: 1s linear infinite spin;
+  display: inline-block;
+}
+
+.ds-splitter > .ds-splitter-bar .ds-splitter-bar-collapse-bar.ds-splitter-bar-collapse-bar-start {
+  opacity: 1;
+}
+
+.ds-switch .ds-switch-inner span.ds-switch-inner-checked, .ds-switch .ds-switch-inner span.ds-switch-inner-unchecked {
+  place-items: center;
+  display: flex;
+}
+
+.ds-table-column-sort-icon {
+  flex-direction: column;
+  display: flex;
+}
+
+.ds-table-column-sort-icon svg {
+  color: var(--ds-color-text-disabled);
+  font-size: 1rem;
+}
+
+.ds-table-column-sort-icon svg:hover {
+  color: var(--ds-color-text-secondary);
+}
+
+.ds-table-column-sort-icon.ds-table-column-sort-icon-none svg {
+  font-size: .75rem;
+}
+
+.ds-table-column-sort-icon.ds-table-column-sort-icon-none > svg:first-child {
+  margin-bottom: -2px;
+}
+
+.ds-table-column-sort-icon.ds-table-column-sort-icon-none > svg:last-child {
+  margin-top: -2px;
+}
+
+.ds-table-column-filter-icon {
+  flex-direction: column;
+  display: flex;
+}
+
+.ds-table-column-filter-icon svg {
+  color: var(--ds-color-text-disabled);
+  font-size: .875rem;
+}
+
+.ds-table-column-filter-icon svg:hover {
+  color: var(--ds-color-text-secondary);
+}
+
+.ds-table-column-filter-icon.ds-table-column-filter-icon-active svg {
+  color: var(--ds-color-primary);
+}
+
+.ds-table-wrapper .ds-table-ping-left .ds-table-cell-fix-left-first:after, .ds-table-wrapper .ds-table-ping-left .ds-table-cell-fix-left-last:after {
+  box-shadow: inset 10px 0 8px -8px var(--ds-table-fixed-column-shadow-color);
+}
+
+.ds-table-wrapper .ds-table-ping-right .ds-table-cell-fix-right-first:after, .ds-table-wrapper .ds-table-ping-right .ds-table-cell-fix-right-last:after, .ds-table-wrapper .ds-table-ping-right:not(.ds-table-has-fix-right) .ds-table-container:after {
+  box-shadow: inset -10px 0 8px -8px var(--ds-table-fixed-column-shadow-color);
+}
+
+.ds-table-wrapper .ds-table-ping-left:not(.ds-table-has-fix-left) .ds-table-container:before {
+  box-shadow: inset 10px 0 8px -8px var(--ds-table-fixed-column-shadow-color);
+}
+
+.ds-table-wrapper {
+  flex-direction: column;
+  display: flex;
+}
+
+.ds-table-wrapper .ds-spin-nested-loading, .ds-table-wrapper .ds-spin-container {
+  flex-direction: column;
+  flex-grow: 1;
+  flex-shrink: 1;
+  min-height: 0;
+  display: flex;
+}
+
+.ds-table-wrapper .ds-spin-container .ds-table {
+  flex-grow: 1;
+  flex-shrink: 1;
+  min-height: 0;
+}
+
+.ds-table {
+  flex-direction: column;
+  display: flex;
+}
+
+.ds-table-container {
+  flex-direction: column;
+  flex-shrink: 1;
+  min-height: 0;
+  display: flex;
+}
+
+.ds-table-header {
+  flex-shrink: 0;
+}
+
+.ds-table-body {
+  flex-shrink: 1;
+}
+
+.ds-tag {
+  align-items: center;
+  display: inline-flex;
+}
+
+.ds-tag[data-active] {
+  background-color: var(--ds-color-primary-bg);
+  border-color: var(--ds-color-primary);
+  color: var(--ds-color-primary);
+}
+
+.ds-tag .ds-tag-close-icon {
+  color: var(--ds-color-icon);
+}
+
+.ds-toast-viewport {
+  z-index: 2001;
+  justify-content: center;
+  width: 100%;
+  max-width: 30rem;
+  margin: 0 auto;
+  display: flex;
+  position: fixed;
+  top: auto;
+  bottom: 2rem;
+  left: 50%;
+  transform: translate(-50%);
+}
+
+.ds-toast {
+  --gap: .5rem;
+  --offset-y: calc(var(--toast-offset-y) * -1 + (var(--toast-index) * var(--gap) * -1)  + var(--toast-swipe-movement-y));
+  font-family: var(--font-sans);
+  box-sizing: border-box;
+  background: var(--ds-color-bg-elevated);
+  color: var(--ds-color-text);
+  gap: var(--gap);
+  max-width: 100%;
+  box-shadow: var(--ds-box-shadow-secondary);
+  -webkit-user-select: none;
+  user-select: none;
+  cursor: default;
+  z-index: calc(1000 - var(--toast-index));
+  transform: translateX(var(--toast-swipe-movement-x)) translateY(calc(var(--toast-swipe-movement-y)  + (var(--toast-index) * -20%))) scale(calc(1 - (var(--toast-index) * .1)));
+  background-clip: padding-box;
+  border-radius: .5rem;
+  margin-right: 0;
+  padding: .75rem 1rem;
+  transition: transform .5s cubic-bezier(.22, 1, .36, 1), opacity .5s;
+  display: inline-flex;
+  position: absolute;
+  bottom: 0;
+}
+
+.ds-toast:after {
+  top: 100%;
+}
+
+.ds-toast[data-expanded] {
+  transform: translateX(var(--toast-swipe-movement-x)) translateY(var(--offset-y));
+}
+
+.ds-toast[data-starting-style], .ds-toast[data-ending-style]:not([data-limited]) {
+  transform: translateY(150%);
+}
+
+.ds-toast[data-ending-style] {
+  opacity: 0;
+}
+
+.ds-toast[data-ending-style][data-swipe-direction="up"] {
+  transform: translateY(calc(var(--toast-swipe-movement-y)  - 150%));
+}
+
+.ds-toast[data-ending-style][data-swipe-direction="left"] {
+  transform: translateX(calc(var(--toast-swipe-movement-x)  - 150%)) translateY(var(--offset-y));
+}
+
+.ds-toast[data-ending-style][data-swipe-direction="right"] {
+  transform: translateX(calc(var(--toast-swipe-movement-x)  + 150%)) translateY(var(--offset-y));
+}
+
+.ds-toast[data-ending-style][data-swipe-direction="down"] {
+  transform: translateY(calc(var(--toast-swipe-movement-y)  + 150%));
+}
+
+.ds-toast:after {
+  content: "";
+  width: 100%;
+  height: calc(var(--gap)  + 1px);
+  position: absolute;
+  left: 0;
+}
+
+.ds-toast-content {
+  flex-direction: column;
+  flex: 1;
+  gap: 2px;
+  display: flex;
+}
+
+.ds-toast-title {
+  font-size: var(--text-ds-h5);
+  font-weight: var(--text-ds-h5--font-weight);
+  line-height: var(--text-ds-h5--line-height);
+}
+
+.ds-toast-description {
+  font-size: var(--ds-font-size);
+  line-height: var(--ds-line-height);
+}
+
+.ds-toast-description-traceback p:not(:first-child) {
+  margin-top: .5rem;
+}
+
+.ds-toast-icon-wrap {
+  flex: 0;
+  width: 1.25rem;
+  font-size: 1.25rem;
+  display: block;
+}
+
+.ds-toast-icon {
+  width: 1.25rem;
+  height: 1.25rem;
+  display: block;
+}
+
+.ds-toast-icon.ds-toast-icon-info {
+  color: var(--ds-color-primary);
+}
+
+.ds-toast-icon.ds-toast-icon-success {
+  color: var(--ds-color-success);
+}
+
+.ds-toast-icon.ds-toast-icon-warning {
+  color: var(--ds-color-warning);
+}
+
+.ds-toast-icon.ds-toast-icon-error {
+  color: var(--ds-color-error);
+}
+
+.ds-toast-icon.ds-toast-icon-progress {
+  color: var(--ds-color-primary);
+  animation: var(--ds-animate-spin);
+}
+
+.ds-tooltip .ds-tooltip-inner {
+  min-height: auto;
+}
+
+.ds-tour .ds-tour-header {
+  padding-top: 1rem;
+  padding-bottom: .75rem;
+}
+
+.ds-tour .ds-tour-title {
+  font-size: var(--text-ds-h5);
+  font-weight: var(--text-ds-h5--font-weight);
+  line-height: var(--text-ds-h5--line-height);
+}
+
+.ds-tour .ds-tour-description {
+  font-size: var(--text-ds-md);
+  font-weight: var(--text-ds-md--font-weight);
+  line-height: var(--text-ds-md--line-height);
+}
+
+:is(.ds-tour .ds-tour-description p, .ds-tour .ds-tour-description ul, .ds-tour .ds-tour-description ol):not(:first-child) {
+  margin-top: .875rem;
+}
+
+.ds-tour .ds-tour-description strong {
+  font-weight: 600;
+}
+
+.ds-tour .ds-tour-description ul {
+  padding-left: 1rem;
+  list-style: outside;
+}
+
+.ds-tour .ds-tour-description ol {
+  padding-left: 1rem;
+  list-style: decimal;
+}
+
+.ds-tour .ds-tour-description li {
+  padding-left: .5rem;
+}
+
+.ds-tour .ds-tour-description li:not(:first-child) {
+  margin-top: .5rem;
+}
+
+.ds-tour .ds-tour-description li svg {
+  margin-bottom: -.25rem;
+  font-size: 1.25rem;
+  display: inline-block;
+}
+
+.ds-tour .ds-tour-footer {
+  padding-top: 1rem;
+}
+
+.ds-tour .ds-tour-indicators-wrap {
+  align-items: center;
+  gap: .5rem;
+  width: 100%;
+  height: 100%;
+  display: inline-flex;
+}
+
+.ds-tour .ds-tour-indicators-summary-text {
+  font-size: var(--text-ds-sm);
+  font-weight: var(--text-ds-sm--font-weight);
+  line-height: var(--text-ds-sm--line-height);
+  color: var(--ds-color-text-tertiary);
+  align-items: center;
+  padding-top: .25rem;
+  display: inline-flex;
+}
+
+.ds-tree {
+  background: none;
+}
+
+.ds-tree-treenode {
+  width: 100%;
+  display: flex;
+}
+
+.ds-tree-node-content-wrapper {
+  flex-grow: 1;
+  display: flex;
+}
+
+.ds-tree-title {
+  flex: 1;
+}
+
+.ds-tree-switcher {
+  justify-content: center;
+  align-items: center;
+  display: flex;
+}
+
+.ds-tree-icon__customize {
+  color: var(--ds-color-icon);
+  justify-content: center;
+  align-items: center;
+  margin-right: .5rem;
+  font-size: 1rem;
+  display: flex;
+}
+
+.ds-tree-treenode-selected .ds-tree-icon__customize, .ds-tree-treenode:not(.ds-tree-treenode-disabled).ds-tree-treenode-selected .ds-tree-node-content-wrapper:hover {
+  color: var(--ds-tree-directory-node-selected-color);
+}
+
+.ds-tree-switcher .ds-tree-switcher-icon {
+  font-size: .75rem;
+}
+
+.ds-caret-switcher-icon {
+  transition: transform .2s ease-in-out;
+}
+
+.ds-tree-switcher_open .ds-caret-switcher-icon {
+  transform: rotate(90deg);
+}
+
+.ds-tree .ds-tree-switcher:before {
+  height: max(100%, var(--ds-tree-title-height));
+}
+
+.ds-upload-wrapper {
+  flex-direction: column;
+  display: flex;
+}
+
+.ds-upload-list {
+  flex-direction: column;
+  flex-grow: 1;
+  display: flex;
+}
+
+.ds-upload-list-item-container {
+  margin-top: .5rem;
+}
+
+.ds-upload-item {
+  border-radius: var(--ds-border-radius);
+  border: 1px solid var(--ds-color-border);
+  flex-grow: 1;
+  padding: .5rem;
+}
+
+.ds-upload-item-icon {
+  color: var(--ds-color-text-tertiary);
+  font-size: 1.25rem;
+}
+
+.ds-upload-drag-icon {
+  color: var(--ds-color-primary);
+  justify-content: center;
+  align-items: center;
+  margin-bottom: .5rem;
+  font-size: 2.5rem;
+  display: flex;
+}
+
+.ds-upload-item-content {
+  justify-content: space-between;
+  align-items: center;
+  min-width: 0;
+  display: flex;
+}
+
+.ds-upload-item-name-progress {
+  flex-direction: column;
+  flex-grow: 1;
+  flex-shrink: 1;
+  gap: 0;
+  min-width: 0;
+  display: flex;
+}
+