@bolio-ui/core 2.0.0-alpha.2 → 3.0.0-alpha.1

package/esm/css/Select.css

@@ -0,0 +1,91 @@
+@layer Select {
+.Select-module_select__ehP4U {
+  display: inline-flex;
+  align-items: center;
+  user-select: none;
+  white-space: nowrap;
+  position: relative;
+  cursor: var(--select-cursor);
+  max-width: 90vw;
+  overflow: hidden;
+  transition:
+    border 150ms ease-in 0s,
+    color 200ms ease-out 0s,
+    box-shadow 200ms ease 0s;
+  border: 1px solid var(--select-border-color);
+  border-radius: var(--select-radius);
+  background-color: var(--select-bg-color);
+  min-width: 12.5em;
+  width: var(--select-width);
+  height: var(--select-height);
+  padding: var(--select-padding-top) var(--select-padding-right)
+    var(--select-padding-bottom) var(--select-padding-left);
+  margin: var(--select-margin-top) var(--select-margin-right)
+    var(--select-margin-bottom) var(--select-margin-left);
+  background-clip: padding-box;
+}
+
+.Select-module_multiple__QrOT5 {
+  height: auto;
+  min-height: var(--select-height);
+  padding: var(--select-multiple-padding-top) var(--select-padding-right)
+    var(--select-multiple-padding-top) var(--select-padding-left);
+}
+
+.Select-module_select__ehP4U:hover {
+  border-color: var(--select-hover-border);
+  background-color: var(--select-hover-bg-color);
+}
+
+.Select-module_select__ehP4U.Select-module_active__KKXEg {
+  border-color: var(--select-focus-border);
+}
+
+.Select-module_select__ehP4U.Select-module_active__KKXEg .Select-module_icon__EEohP,
+.Select-module_select__ehP4U:hover .Select-module_icon__EEohP {
+  color: var(--select-color);
+}
+
+.Select-module_value__TFknF {
+  display: inline-flex;
+  flex: 1;
+  height: 100%;
+  align-items: center;
+  line-height: 1;
+  padding: 0;
+  margin-right: 1.25em;
+  font-size: var(--select-font-size);
+  color: var(--select-color);
+  width: calc(100% - 1.25em);
+}
+
+.Select-module_value__TFknF > div,
+.Select-module_value__TFknF > div:hover {
+  border-radius: 0;
+  background-color: transparent;
+  padding: 0;
+  margin: 0;
+  color: inherit;
+  font-weight: inherit;
+}
+
+.Select-module_placeholder__dhhM0 {
+  color: var(--select-placeholder-color);
+  font-size: var(--select-placeholder-font-size);
+}
+
+.Select-module_icon__EEohP {
+  position: absolute;
+  right: var(--select-icon-right);
+  font-size: var(--select-font-size);
+  top: 50%;
+  bottom: 0;
+  transform: translateY(-50%) rotate(var(--select-icon-rotate));
+  pointer-events: none;
+  transition: transform 200ms ease;
+  display: flex;
+  align-items: center;
+  color: var(--select-icon-color);
+}
+
+}

package/esm/css/Shared-backdrop.css

@@ -0,0 +1,64 @@
+@layer Shared-backdrop {
+.backdrop-module_backdrop__fZn5s {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  overflow: auto;
+  z-index: 1000;
+  -webkit-overflow-scrolling: touch;
+  box-sizing: border-box;
+  text-align: center;
+}
+
+.backdrop-module_position__rOSQr {
+  position: relative;
+  z-index: 1001;
+  outline: none;
+  max-width: 90%;
+  margin: 20px auto;
+  vertical-align: middle;
+  display: inline-block;
+}
+
+.backdrop-module_backdrop__fZn5s:before {
+  display: inline-block;
+  width: 0;
+  height: 100%;
+  vertical-align: middle;
+  content: '';
+}
+
+.backdrop-module_layer__SC2h8 {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  width: 100%;
+  height: 100%;
+  opacity: var(--backdrop-portal-opacity);
+  background-color: black;
+  transition: opacity 0.35s cubic-bezier(0.4, 0, 0.2, 1);
+  pointer-events: none;
+  z-index: 1000;
+}
+
+.backdrop-wrapper-enter .backdrop-module_layer__SC2h8 {
+  opacity: 0;
+}
+
+.backdrop-wrapper-enter-active .backdrop-module_layer__SC2h8 {
+  opacity: var(--backdrop-portal-opacity);
+}
+
+.backdrop-wrapper-leave .backdrop-module_layer__SC2h8 {
+  opacity: var(--backdrop-portal-opacity);
+}
+
+.backdrop-wrapper-leave-active .backdrop-module_layer__SC2h8 {
+  opacity: 0;
+}
+
+}

package/esm/css/Shared-ellipsis.css

@@ -0,0 +1,9 @@
+@layer Shared-ellipsis {
+.ellipsis-module_ellipsis__kLorN {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  min-width: 0;
+}
+
+}

package/esm/css/Skeleton.css

@@ -0,0 +1,46 @@
+@layer Skeleton {
+.Skeleton-module_skeleton__c22xA {
+  display: flex;
+  flex-direction: column;
+  gap: 0.5em;
+  box-sizing: border-box;
+}
+
+.Skeleton-module_shape__j2aRX {
+  display: block;
+  width: 100%;
+  background: linear-gradient(
+    90deg,
+    var(--skeleton-shimmer-1) 25%,
+    var(--skeleton-shimmer-2) 37%,
+    var(--skeleton-shimmer-1) 63%
+  );
+  background-size: 400% 100%;
+  animation: Skeleton-module_skeletonShimmer__Yz1Km 1.4s ease infinite;
+}
+
+.Skeleton-module_shape__j2aRX:last-child:not(:first-child) {
+  width: 60%;
+}
+
+.Skeleton-module_circle__xNX3i .Skeleton-module_shape__j2aRX {
+  border-radius: 50%;
+}
+
+@keyframes Skeleton-module_skeletonShimmer__Yz1Km {
+  from {
+    background-position: 100% 50%;
+  }
+  to {
+    background-position: 0 50%;
+  }
+}
+
+@media (prefers-reduced-motion: reduce) {
+  .Skeleton-module_shape__j2aRX {
+    animation: none;
+    background: var(--skeleton-shimmer-2);
+  }
+}
+
+}

package/esm/css/Slider-SliderDot.css

@@ -0,0 +1,39 @@
+@layer Slider-SliderDot {
+.SliderDot-module_dot__1VxCn {
+  position: absolute;
+  top: 50%;
+  transform: translate(-50%, -50%);
+  height: calc(var(--slider-font-size) * 1.25);
+  min-width: calc(var(--slider-font-size) * 1.25);
+  line-height: calc(var(--slider-font-size) * 1.25);
+  border-radius: calc(var(--slider-font-size) * 0.625);
+  user-select: none;
+  font-weight: 700;
+  font-size: calc(var(--slider-font-size) * 0.75);
+  z-index: 100;
+  text-align: center;
+  padding: 0 calc(0.57 * var(--slider-font-size));
+}
+
+.SliderDot-module_dot__1VxCn:focus-visible {
+  outline: 2px solid var(--slider-dot-focus-color);
+  outline-offset: 2px;
+}
+
+.SliderDot-module_dot__1VxCn.SliderDot-module_disabled__w2Xki {
+  cursor: not-allowed !important;
+}
+
+.SliderDot-module_dot__1VxCn.SliderDot-module_click__QZGR- {
+  transition: all 200ms ease;
+}
+
+.SliderDot-module_dot__1VxCn:hover {
+  cursor: grab;
+}
+
+.SliderDot-module_dot__1VxCn:active {
+  cursor: grabbing;
+}
+
+}

package/esm/css/Slider-SliderMark.css

@@ -0,0 +1,10 @@
+@layer Slider-SliderMark {
+.SliderMark-module_span__gKYKM {
+  position: absolute;
+  width: 2px;
+  height: 100%;
+  top: 50%;
+  transform: translate(-50%, -50%);
+}
+
+}

package/esm/css/Slider.css

@@ -0,0 +1,7 @@
+@layer Slider {
+.Slider-module_slider__Mn7eI {
+  border-radius: 50px;
+  position: relative;
+}
+
+}

package/esm/css/Snippet-SnippetIcon.css

@@ -0,0 +1,7 @@
+@layer Snippet-SnippetIcon {
+.SnippetIcon-module_icon__HUZlq {
+  width: 1.69em;
+  height: 1.69em;
+}
+
+}

package/esm/css/Snippet.css

@@ -0,0 +1,45 @@
+@layer Snippet {
+.Snippet-module_snippet__M4eX8 {
+  position: relative;
+  max-width: 100%;
+}
+
+.Snippet-module_snippet__M4eX8 pre {
+  margin: 0;
+  padding: 0;
+  border: none;
+  background-color: transparent;
+  font-size: inherit;
+}
+
+.Snippet-module_snippet__M4eX8 pre::before {
+  content: var(--snippet-symbol);
+  user-select: none;
+}
+
+.Snippet-module_snippet__M4eX8 pre * {
+  margin: 0;
+  padding: 0;
+  font-size: inherit;
+  color: inherit;
+}
+
+.Snippet-module_copy__vSMCk {
+  position: absolute;
+  right: 0;
+  top: 0;
+  bottom: 0;
+  display: inline-flex;
+  justify-content: center;
+  transition: opacity 150ms ease 0s;
+  color: inherit;
+  cursor: pointer;
+  user-select: none;
+  opacity: 0.65;
+}
+
+.Snippet-module_copy__vSMCk:hover {
+  opacity: 1;
+}
+
+}

package/esm/css/Spinner.css

@@ -0,0 +1,95 @@
+@layer Spinner {
+.Spinner-module_spinner__6Plyb {
+  display: block;
+  box-sizing: border-box;
+}
+
+.Spinner-module_container__MSmM6 {
+  width: 100%;
+  height: 100%;
+  position: relative;
+  left: 50%;
+  top: 50%;
+}
+
+.Spinner-module_container__MSmM6 span {
+  background-color: var(--spinner-color);
+  position: absolute;
+  top: -3.9%;
+  width: 24%;
+  height: 8%;
+  left: -10%;
+  border-radius: var(--spinner-radius);
+  animation: Spinner-module_spinnerSpin__o1ssr 1.2s linear 0s infinite normal none running;
+}
+
+.Spinner-module_container__MSmM6 span:nth-child(1) {
+  animation-delay: -1.2s;
+  transform: rotate(0deg) translate(146%);
+}
+
+.Spinner-module_container__MSmM6 span:nth-child(2) {
+  animation-delay: -1.1s;
+  transform: rotate(30deg) translate(146%);
+}
+
+.Spinner-module_container__MSmM6 span:nth-child(3) {
+  animation-delay: -1s;
+  transform: rotate(60deg) translate(146%);
+}
+
+.Spinner-module_container__MSmM6 span:nth-child(4) {
+  animation-delay: -0.9s;
+  transform: rotate(90deg) translate(146%);
+}
+
+.Spinner-module_container__MSmM6 span:nth-child(5) {
+  animation-delay: -0.8s;
+  transform: rotate(120deg) translate(146%);
+}
+
+.Spinner-module_container__MSmM6 span:nth-child(6) {
+  animation-delay: -0.7s;
+  transform: rotate(150deg) translate(146%);
+}
+
+.Spinner-module_container__MSmM6 span:nth-child(7) {
+  animation-delay: -0.6s;
+  transform: rotate(180deg) translate(146%);
+}
+
+.Spinner-module_container__MSmM6 span:nth-child(8) {
+  animation-delay: -0.5s;
+  transform: rotate(210deg) translate(146%);
+}
+
+.Spinner-module_container__MSmM6 span:nth-child(9) {
+  animation-delay: -0.4s;
+  transform: rotate(240deg) translate(146%);
+}
+
+.Spinner-module_container__MSmM6 span:nth-child(10) {
+  animation-delay: -0.3s;
+  transform: rotate(270deg) translate(146%);
+}
+
+.Spinner-module_container__MSmM6 span:nth-child(11) {
+  animation-delay: -0.2s;
+  transform: rotate(300deg) translate(146%);
+}
+
+.Spinner-module_container__MSmM6 span:nth-child(12) {
+  animation-delay: -0.1s;
+  transform: rotate(330deg) translate(146%);
+}
+
+@keyframes Spinner-module_spinnerSpin__o1ssr {
+  0% {
+    opacity: 1;
+  }
+  100% {
+    opacity: 0.15;
+  }
+}
+
+}

package/esm/css/Stat.css

@@ -0,0 +1,30 @@
+@layer Stat {
+.Stat-module_stat__aLq0n {
+  display: flex;
+  align-items: flex-start;
+  justify-content: space-between;
+  gap: 1em;
+  box-sizing: border-box;
+}
+
+.Stat-module_label__SmGam {
+  font-size: 0.875em;
+}
+
+.Stat-module_value__Nz3n9 {
+  font-size: 1.75em;
+  font-weight: 600;
+  line-height: 1.2;
+  font-variant-numeric: tabular-nums;
+}
+
+.Stat-module_change__cCQ6Q {
+  font-size: 0.8125em;
+}
+
+.Stat-module_extra__R4o8v {
+  display: flex;
+  align-items: center;
+}
+
+}

package/esm/css/Stepper-StepperStep.css

@@ -0,0 +1,106 @@
+@layer Stepper-StepperStep {
+.StepperStep-module_step__Of2Aj {
+  display: flex;
+  flex: 1;
+  align-items: center;
+  min-width: 0;
+}
+
+.StepperStep-module_last__OvXfG {
+  flex: 0 0 auto;
+}
+
+.StepperStep-module_vertical__Nd0eQ {
+  flex-direction: column;
+  align-items: flex-start;
+}
+
+.StepperStep-module_head__9GMkW {
+  display: flex;
+  align-items: center;
+  gap: 0.75em;
+  margin: 0;
+  padding: 0;
+  font: inherit;
+  text-align: left;
+  color: inherit;
+  background: none;
+  border: 0;
+  appearance: none;
+  -webkit-appearance: none;
+}
+
+button.StepperStep-module_head__9GMkW {
+  cursor: pointer;
+}
+
+button.StepperStep-module_head__9GMkW:disabled {
+  cursor: not-allowed;
+  opacity: 0.6;
+}
+
+button.StepperStep-module_head__9GMkW:focus-visible {
+  outline: 2px solid var(--stepper-focus-color);
+  outline-offset: 2px;
+}
+
+.StepperStep-module_indicator__FCCY6 {
+  display: inline-flex;
+  flex-shrink: 0;
+  align-items: center;
+  justify-content: center;
+  box-sizing: border-box;
+  width: 2em;
+  height: 2em;
+  font-weight: 600;
+  border-radius: 50%;
+  transition:
+    background-color 0.2s ease,
+    border-color 0.2s ease,
+    color 0.2s ease;
+}
+
+.StepperStep-module_text__DxOjn {
+  display: flex;
+  flex-direction: column;
+  line-height: 1.3em;
+}
+
+.StepperStep-module_label__FPtyS {
+  font-weight: 500;
+  white-space: nowrap;
+}
+
+.StepperStep-module_description__HyHso {
+  font-size: 0.875em;
+}
+
+.StepperStep-module_connector__8b1i- {
+  flex: 1;
+  height: 2px;
+  min-width: 1.5em;
+  margin: 0 0.75em;
+}
+
+.StepperStep-module_vertical__Nd0eQ .StepperStep-module_connector__8b1i- {
+  flex: none;
+  width: 2px;
+  height: auto;
+  min-width: 0;
+  min-height: 1.5em;
+  margin: 0.25em 0 0.25em calc(1em - 1px);
+}
+
+.StepperStep-module_srOnly__1yOBy {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  margin: -1px;
+  padding: 0;
+  overflow: hidden;
+  clip: rect(0 0 0 0);
+  white-space: nowrap;
+  border: 0;
+}
+
+}

package/esm/css/Stepper.css

@@ -0,0 +1,12 @@
+@layer Stepper {
+.Stepper-module_stepper__voFJp {
+  display: flex;
+  box-sizing: border-box;
+  list-style: none;
+}
+
+.Stepper-module_vertical__XlHRx {
+  flex-direction: column;
+}
+
+}

package/esm/css/Table-TableBody.css

@@ -0,0 +1,27 @@
+@layer Table-TableBody {
+.TableBody-module_tr__lTn-M {
+  transition: background-color 0.25s ease;
+  font-size: inherit;
+}
+
+.TableBody-module_hover__AjVlq:hover {
+  background-color: var(--table-body-hover-bg);
+}
+
+.TableBody-module_tr__lTn-M td {
+  padding: 0 0.5em;
+  border-bottom: 1px solid var(--table-body-border-color);
+  color: var(--table-body-text-color);
+  font-size: calc(0.875 * var(--table-font-size));
+  text-align: left;
+}
+
+.TableBody-module_tr__lTn-M .cell {
+  min-height: calc(3.125 * var(--table-font-size));
+  display: flex;
+  -webkit-box-align: center;
+  align-items: center;
+  flex-flow: row wrap;
+}
+
+}

package/esm/css/Table-TableHead.css

@@ -0,0 +1,47 @@
+@layer Table-TableHead {
+.TableHead-module_thead__zMtMt {
+  border-collapse: separate;
+  border-spacing: 0;
+  font-size: inherit;
+}
+
+.TableHead-module_th__GzIce {
+  padding: 0 0.5em;
+  font-size: calc(0.75 * var(--table-font-size));
+  font-weight: normal;
+  text-align: left;
+  letter-spacing: 0;
+  vertical-align: middle;
+  min-height: calc(2.5 * var(--table-font-size));
+  color: var(--table-head-text-color);
+  background: var(--table-head-bg);
+  border-bottom: 1px solid var(--table-head-border-color);
+  border-top: 1px solid var(--table-head-border-color);
+  border-radius: 0;
+}
+
+.TableHead-module_th__GzIce:first-child {
+  border-bottom: 1px solid var(--table-head-border-color);
+  border-left: 1px solid var(--table-head-border-color);
+  border-top: 1px solid var(--table-head-border-color);
+  border-top-left-radius: var(--table-head-radius);
+  border-bottom-left-radius: var(--table-head-radius);
+}
+
+.TableHead-module_th__GzIce:last-child {
+  border-bottom: 1px solid var(--table-head-border-color);
+  border-right: 1px solid var(--table-head-border-color);
+  border-top: 1px solid var(--table-head-border-color);
+  border-top-right-radius: var(--table-head-radius);
+  border-bottom-right-radius: var(--table-head-radius);
+}
+
+.TableHead-module_theadBox__6QaBJ {
+  display: flex;
+  align-items: center;
+  -webkit-box-align: center;
+  min-height: calc(2.5 * var(--table-font-size));
+  text-transform: uppercase;
+}
+
+}

package/esm/css/Table.css

@@ -0,0 +1,20 @@
+@layer Table {
+.Table-module_table__H9ZOx {
+  border-collapse: separate;
+  border-spacing: 0;
+  font-size: var(--table-font-size);
+  width: var(--table-width);
+  height: var(--table-height);
+  padding: var(--table-padding-top) var(--table-padding-right)
+    var(--table-padding-bottom) var(--table-padding-left);
+  margin: var(--table-margin-top) var(--table-margin-right)
+    var(--table-margin-bottom) var(--table-margin-left);
+}
+
+.Table-module_footer__7eFVi {
+  display: flex;
+  justify-content: flex-end;
+  margin-top: 1em;
+}
+
+}