@rolster/react-components 18.13.5 → 18.14.1

package/dist/cjs/assets/{index-LjAadYQE.css → index--xgdaD5z.css}

@@ -497,32 +497,26 @@
   opacity: var(--pvt-value-opacity);
   color: var(--pvt-value-font-color);
   font-weight: var(--rls-font-weight-medium);
-  font-size: var(--rls-input-font-size);
+  font-size: var(--rlc-input-font-size);
   text-align: var(--rlc-input-text-align);
-  letter-spacing: var(--rls-input-letter-spacing);
+  letter-spacing: var(--rlc-input-letter-spacing);
 }
 
 .rls-input-money {
   position: relative;
-  float: left;
   width: 100%;
-  padding: var(--rlc-input-parent-padding);
   box-sizing: border-box;
 }
 
 .rls-input-number {
   position: relative;
-  float: left;
   width: 100%;
-  padding: var(--rlc-input-parent-padding);
   box-sizing: border-box;
 }
 
 .rls-input-password {
   position: relative;
-  float: left;
   width: 100%;
-  padding: var(--rlc-input-parent-padding);
   box-sizing: border-box;
 }
 .rls-input-password__component {
@@ -559,9 +553,7 @@
 
 .rls-input-text {
   position: relative;
-  float: left;
   width: 100%;
-  padding: var(--rlc-input-parent-padding);
   box-sizing: border-box;
 }
 
@@ -1043,7 +1035,40 @@
   color: var(--rls-app-color-500);
 }
 
-.rls-checkbox-label {
+.rls-field-money {
+  --rlc-fieldbox-body-padding: var(--rls-sizing-x3) var(--rls-sizing-x4);
+  position: relative;
+  width: 100%;
+  box-sizing: border-box;
+}
+
+.rls-field-number {
+  --rlc-fieldbox-body-padding: var(--rls-sizing-x3) var(--rls-sizing-x4);
+  position: relative;
+  width: 100%;
+  box-sizing: border-box;
+}
+
+.rls-field-password {
+  --rlc-fieldbox-body-padding: var(--rls-sizing-x3) var(--rls-sizing-x4);
+  --rlc-action-ripple-dimension: var(--rls-sizing-x16);
+  --rlc-action-ripple-position: -8rem;
+  position: relative;
+  width: 100%;
+  box-sizing: border-box;
+}
+.rls-field-password .rls-button-action {
+  margin: auto var(--rls-sizing-x2) auto 0rem;
+}
+
+.rls-field-text {
+  --rlc-fieldbox-body-padding: var(--rls-sizing-x3) var(--rls-sizing-x4);
+  position: relative;
+  width: 100%;
+  box-sizing: border-box;
+}
+
+.rls-label-checkbox {
   --pvt-text-opacity: 1;
   --pvt-text-height: var(--rls-sizing-x12);
   --pvt-text-overflow: hidden;
@@ -1052,20 +1077,59 @@
   display: flex;
   column-gap: var(--rls-sizing-x4);
 }
-.rls-checkbox-label--disabled {
+.rls-label-checkbox--disabled {
+  --pvt-text-opacity: 0.5;
+  pointer-events: none;
+}
+.rls-label-checkbox--extended {
+  --pvt-text-text-overflow: initial;
+  --pvt-text-overflow: initial;
+  --pvt-text-white-space: initial;
+  --pvt-text-height: auto;
+}
+.rls-label-checkbox__component {
+  width: auto;
+}
+.rls-label-checkbox__text {
+  max-width: calc(100% - var(--rls-sizing-x16));
+  height: var(--pvt-text-height);
+  line-height: var(--rls-sizing-x12);
+  color: var(--rls-app-color-300);
+  font-size: var(--rls-label-font-size);
+  font-weight: var(--rls-font-weight-medium);
+  letter-spacing: var(--rls-label-letter-spacing);
+  user-select: none;
+  opacity: var(--pvt-text-opacity);
+  overflow: var(--pvt-text-overflow);
+  white-space: var(--pvt-text-white-space);
+  text-overflow: var(--pvt-text-text-overflow);
+}
+
+.rls-label-radiobutton {
+  --pvt-text-opacity: 1;
+  --pvt-text-height: var(--rls-sizing-x12);
+  --pvt-text-overflow: hidden;
+  --pvt-text-white-space: nowrap;
+  --pvt-text-text-overflow: ellipsis;
+  position: relative;
+  width: 100%;
+  display: flex;
+}
+.rls-label-radiobutton--disabled {
   --pvt-text-opacity: 0.5;
   pointer-events: none;
 }
-.rls-checkbox-label--extended {
+.rls-label-radiobutton--extended {
   --pvt-text-text-overflow: initial;
   --pvt-text-overflow: initial;
   --pvt-text-white-space: initial;
   --pvt-text-height: auto;
 }
-.rls-checkbox-label__component {
+.rls-label-radiobutton__component {
+  margin-right: var(--rls-sizing-x4);
   width: auto;
 }
-.rls-checkbox-label__text {
+.rls-label-radiobutton__text {
   max-width: calc(100% - var(--rls-sizing-x16));
   height: var(--pvt-text-height);
   line-height: var(--rls-sizing-x12);
@@ -1080,7 +1144,112 @@
   text-overflow: var(--pvt-text-text-overflow);
 }
 
-.rls-day-picker {
+.rls-label-switch {
+  --pvt-text-opacity: 1;
+  --pvt-text-height: var(--rls-sizing-x12);
+  --pvt-text-overflow: hidden;
+  --pvt-text-white-space: nowrap;
+  --pvt-text-text-overflow: ellipsis;
+  display: flex;
+  column-gap: var(--rls-sizing-x4);
+}
+.rls-label-switch--disabled {
+  --pvt-text-opacity: 0.5;
+  pointer-events: none;
+}
+.rls-label-switch--extended {
+  --pvt-text-text-overflow: initial;
+  --pvt-text-overflow: initial;
+  --pvt-text-white-space: initial;
+  --pvt-text-height: auto;
+}
+.rls-label-switch__component {
+  max-width: 20rem;
+}
+.rls-label-switch__text {
+  max-width: calc(100% - var(--rls-sizing-x28));
+  height: var(--pvt-text-height);
+  line-height: var(--rls-sizing-x12);
+  color: var(--rls-app-color-300);
+  font-size: var(--rls-label-font-size);
+  font-weight: var(--rls-font-weight-medium);
+  letter-spacing: var(--rls-label-letter-spacing);
+  user-select: none;
+  opacity: var(--pvt-text-opacity);
+  overflow: var(--pvt-text-overflow);
+  white-space: var(--pvt-text-white-space);
+  text-overflow: var(--pvt-text-text-overflow);
+}
+
+.rls-pagination {
+  position: relative;
+  display: flex;
+  justify-content: center;
+  width: 100%;
+  overflow: hidden;
+  height: var(--rls-sizing-x20);
+  padding: 0rem var(--rls-sizing-x6);
+  box-sizing: border-box;
+}
+.rls-pagination__pages {
+  display: flex;
+  gap: var(--rls-sizing-x4);
+  width: auto;
+  margin: 0rem var(--rls-sizing-x4);
+}
+.rls-pagination__page {
+  background: var(--rls-app-background-100);
+  color: var(--rls-app-color-500);
+  cursor: default;
+  margin: auto 0rem;
+  text-align: center;
+  width: var(--rls-sizing-x16);
+  height: var(--rls-sizing-x16);
+  line-height: var(--rls-sizing-x16);
+  border-radius: var(--rls-sizing-x2);
+  font-size: var(--rls-body-font-size);
+  letter-spacing: var(--rls-body-letter-spacing);
+}
+.rls-pagination__page:hover {
+  background: var(--rls-theme-color-300);
+  color: var(--rls-theme-color-900);
+}
+.rls-pagination__page--active {
+  background: var(--rls-theme-gradient-500);
+  color: var(--rls-light-color-500);
+}
+.rls-pagination__description {
+  color: var(--rls-app-color-500);
+  margin: 0rem var(--rls-sizing-x4);
+  width: auto;
+  height: var(--rls-sizing-x20);
+  line-height: var(--rls-sizing-x20);
+  font-size: var(--rls-body-font-size);
+  font-weight: var(--rls-font-weight-bold);
+  letter-spacing: var(--rls-body-letter-spacing);
+}
+.rls-pagination__actions {
+  width: auto;
+}
+.rls-pagination__action {
+  background: none;
+  outline: none;
+  color: var(--rls-app-color-300);
+  height: var(--rls-sizing-x18);
+  width: var(--rls-sizing-x18);
+  padding: var(--rls-sizing-x3);
+  margin: var(--rls-sizing-x1) 0rem;
+}
+.rls-pagination__action:hover {
+  color: var(--rls-theme-color-300);
+  cursor: pointer;
+}
+.rls-pagination__action:disabled {
+  pointer-events: none;
+  opacity: 0.5;
+}
+
+.rls-picker-day {
   --pvt-span-background: transparent;
   --pvt-span-font-color: var(--rls-app-color-500);
   --pvt-span-border: var(--rls-border-1) solid transparent;
@@ -1090,29 +1259,29 @@
   box-sizing: border-box;
   user-select: none;
 }
-.rls-day-picker__header {
+.rls-picker-day__header {
   display: flex;
   margin-bottom: var(--rls-sizing-x4);
   background: var(--rls-app-background-100);
   color: var(--rls-app-color-500);
   border-radius: var(--rls-sizing-x2);
 }
-.rls-day-picker__label {
+.rls-picker-day__label {
   padding: var(--rls-sizing-x6) 0rem;
   text-align: center;
   width: 100%;
   font-size: var(--rls-sizing-x6);
   font-weight: var(--rls-font-weight-bold);
 }
-.rls-day-picker__week {
+.rls-picker-day__week {
   display: flex;
 }
-.rls-day-picker__day {
+.rls-picker-day__element {
   text-align: center;
   padding: var(--rls-sizing-x1);
   box-sizing: border-box;
 }
-.rls-day-picker__day__span {
+.rls-picker-day__element__span {
   position: relative;
   display: block;
   font-size: 7rem;
@@ -1123,43 +1292,43 @@
   line-height: var(--rls-sizing-x18);
   box-sizing: border-box;
 }
-.rls-day-picker__day__span:not(:hover) {
+.rls-picker-day__element__span:not(:hover) {
   color: var(--pvt-span-font-color);
   border: var(--pvt-span-border);
   background: var(--pvt-span-background);
 }
-.rls-day-picker__day__span:hover {
+.rls-picker-day__element__span:hover {
   background: var(--rls-theme-color-900);
   color: var(--rls-theme-font-900);
   border: var(--rls-theme-border-1-900);
 }
-.rls-day-picker__day--today {
+.rls-picker-day__element--today {
   --pvt-span-background: transparent;
   --pvt-span-font-color: var(--rls-theme-color-500);
   --pvt-span-border: var(--rls-theme-border-1-500);
 }
-.rls-day-picker__day--selected {
+.rls-picker-day__element--selected {
   --pvt-span-border: var(--rls-app-border-1-300);
 }
-.rls-day-picker__day--focused {
+.rls-picker-day__element--focused {
   --pvt-span-background: var(--rls-theme-color-500);
   --pvt-span-font-color: var(--rls-theme-font-500);
   --pvt-span-border: var(--rls-theme-border-1-500);
 }
-.rls-day-picker__day--forbidden {
+.rls-picker-day__element--forbidden {
   --pvt-span-background: var(--rls-app-background-300);
   --pvt-span-font-color: var(--rls-app-color-100);
   --pvt-span-border: var(--rls-border-1) solid var(--rls-app-background-300);
   pointer-events: none;
 }
-.rls-day-picker__day--disabled {
+.rls-picker-day__element--disabled {
   --pvt-span-background: transparent;
   --pvt-span-font-color: var(--rls-app-color-100);
   --pvt-span-border: var(--rls-border-1) solid transparent;
   pointer-events: none;
 }
 
-.rls-day-range-picker {
+.rls-picker-day-range {
   --pvt-span-nothover-background: transparent;
   --pvt-span-nothover-font-color: inherit;
   --pvt-span-background: transparent;
@@ -1172,7 +1341,7 @@
   box-sizing: border-box;
   user-select: none;
 }
-.rls-day-range-picker__title {
+.rls-picker-day-range__title {
   color: var(--rls-theme-color-500);
   text-align: center;
   padding: var(--rls-sizing-x4) 0rem;
@@ -1181,28 +1350,28 @@
   line-height: var(--rls-subtitle-line-height);
   font-weight: var(--rls-font-weight-bold);
 }
-.rls-day-range-picker__header {
+.rls-picker-day-range__header {
   display: flex;
   background: var(--rls-app-background-100);
   color: var(--rls-app-color-500);
   border-radius: var(--rls-sizing-x2);
 }
-.rls-day-range-picker__label {
+.rls-picker-day-range__label {
   padding: var(--rls-sizing-x6) 0rem;
   text-align: center;
   width: 100%;
   font-size: var(--rls-sizing-x6);
   font-weight: var(--rls-font-weight-bold);
 }
-.rls-day-range-picker__week {
+.rls-picker-day-range__week {
   display: flex;
 }
-.rls-day-range-picker__day {
+.rls-picker-day-range__element {
   text-align: center;
   padding: var(--rls-sizing-x1);
   box-sizing: border-box;
 }
-.rls-day-range-picker__day__span {
+.rls-picker-day-range__element__span {
   position: relative;
   display: block;
   color: var(--rls-app-color-500);
@@ -1213,43 +1382,36 @@
   font-size: 7rem;
   font-weight: var(--rls-font-weight-semibold);
 }
-.rls-day-range-picker__day__span:not(:hover) {
+.rls-picker-day-range__element__span:not(:hover) {
   background: var(--pvt-span-nothover-background);
   color: var(--pvt-span-nothover-font-color);
 }
-.rls-day-range-picker__day__span:hover {
+.rls-picker-day-range__element__span:hover {
   color: var(--rls-light-color-500);
   background: var(--rls-theme-color-900);
 }
-.rls-day-range-picker__day--end {
+.rls-picker-day-range__element--end {
   --pvt-span-nothover-background: var(--rls-app-color-500);
   --pvt-span-nothover-font-color: var(--rls-app-background-500);
 }
-.rls-day-range-picker__day--source {
+.rls-picker-day-range__element--source {
   --pvt-span-nothover-background: var(--rls-theme-color-500);
   --pvt-span-nothover-font-color: var(--rls-light-color-500);
 }
-.rls-day-range-picker__day--ranged {
+.rls-picker-day-range__element--ranged {
   --pvt-span-nothover-background: var(--rls-theme-color-100);
 }
-.rls-day-range-picker__day--forbidden {
+.rls-picker-day-range__element--forbidden {
   --pvt-span-background: var(--rls-app-background-100);
   pointer-events: none;
   opacity: 0.5;
 }
-.rls-day-range-picker__day--disabled {
+.rls-picker-day-range__element--disabled {
   pointer-events: none;
   opacity: 0.5;
 }
 
-.rls-money-field {
-  --rlc-input-parent-padding: var(--rls-sizing-x3) var(--rls-sizing-x4);
-  position: relative;
-  width: 100%;
-  box-sizing: border-box;
-}
-
-.rls-month-picker {
+.rls-picker-month {
   --pvt-component-background: transparent;
   --pvt-component-font-color: var(--rls-app-color-500);
   --pvt-component-border: var(--rls-border-1) solid transparent;
@@ -1263,7 +1425,7 @@
   padding: var(--rls-sizing-x1);
   box-sizing: border-box;
 }
-.rls-month-picker__component {
+.rls-picker-month__component {
   position: relative;
   display: flex;
   box-sizing: border-box;
@@ -1273,31 +1435,31 @@
   border-radius: var(--rls-sizing-x4);
   box-sizing: border-box;
 }
-.rls-month-picker__component:not(:hover) {
+.rls-picker-month__component:not(:hover) {
   color: var(--pvt-component-font-color);
   border: var(--pvt-component-border);
   background: var(--pvt-component-background);
 }
-.rls-month-picker__component:hover {
+.rls-picker-month__component:hover {
   background: var(--rls-theme-color-900);
   color: var(--rls-theme-font-900);
   border: var(--rls-theme-border-1-900);
 }
-.rls-month-picker__component--selected {
+.rls-picker-month__component--selected {
   --pvt-component-border: var(--rls-app-border-1-300);
 }
-.rls-month-picker__component--focused {
+.rls-picker-month__component--focused {
   --pvt-component-background: var(--rls-theme-color-500);
   --pvt-component-font-color: var(--rls-theme-font-500);
   --pvt-component-border: var(--rls-theme-border-1-500);
 }
-.rls-month-picker__component--disabled {
+.rls-picker-month__component--disabled {
   --pvt-component-background: transparent;
   --pvt-component-font-color: var(--rls-app-color-100);
   --pvt-component-border: var(--rls-border-1) solid transparent;
   pointer-events: none;
 }
-.rls-month-picker__span {
+.rls-picker-month__span {
   font-weight: var(--rls-font-weight-semibold);
   font-size: 6rem;
   cursor: default;
@@ -1305,11 +1467,11 @@
   letter-spacing: 0.25rem;
 }
 
-.rls-month-title-picker {
+.rls-picker-month-title {
   display: flex;
   justify-content: space-between;
 }
-.rls-month-title-picker span {
+.rls-picker-month-title span {
   color: var(--rls-app-color-300);
   cursor: default;
   margin: auto 0rem;
@@ -1318,178 +1480,99 @@
   font-size: var(--rls-sizing-x10);
   font-weight: var(--rls-font-weight-bold);
 }
-.rls-month-title-picker span:hover {
+.rls-picker-month-title span:hover {
   color: var(--rls-theme-color-500);
 }
 
-.rls-number-field {
-  --rlc-input-parent-padding: var(--rls-sizing-x3) var(--rls-sizing-x4);
+.rls-picker-year {
+  --pvt-component-background: transparent;
+  --pvt-component-font-color: var(--rls-app-color-500);
+  --pvt-component-border: var(--rls-border-1) solid transparent;
   position: relative;
   width: 100%;
+  max-width: 140rem;
   box-sizing: border-box;
-}
-
-.rls-pagination {
-  position: relative;
-  display: flex;
-  justify-content: center;
-  width: 100%;
   overflow: hidden;
-  height: var(--rls-sizing-x20);
-  padding: 0rem var(--rls-sizing-x6);
-  box-sizing: border-box;
+  user-select: none;
 }
-.rls-pagination__pages {
+.rls-picker-year__header {
   display: flex;
-  gap: var(--rls-sizing-x4);
-  width: auto;
-  margin: 0rem var(--rls-sizing-x4);
-}
-.rls-pagination__page {
-  background: var(--rls-app-background-100);
+  justify-content: space-between;
+  align-items: center;
+  box-sizing: border-box;
+  padding: var(--rls-sizing-x4) var(--rls-sizing-x6);
   color: var(--rls-app-color-500);
-  cursor: default;
-  margin: auto 0rem;
-  text-align: center;
+  background: var(--rls-app-background-100);
+  border-radius: var(--rls-sizing-x4);
+}
+.rls-picker-year__action {
   width: var(--rls-sizing-x16);
   height: var(--rls-sizing-x16);
   line-height: var(--rls-sizing-x16);
-  border-radius: var(--rls-sizing-x2);
-  font-size: var(--rls-body-font-size);
-  letter-spacing: var(--rls-body-letter-spacing);
-}
-.rls-pagination__page:hover {
-  background: var(--rls-theme-color-300);
-  color: var(--rls-theme-color-900);
-}
-.rls-pagination__page--active {
-  background: var(--rls-theme-gradient-500);
-  color: var(--rls-light-color-500);
 }
-.rls-pagination__description {
+.rls-picker-year__action button {
   color: var(--rls-app-color-500);
-  margin: 0rem var(--rls-sizing-x4);
-  width: auto;
-  height: var(--rls-sizing-x20);
-  line-height: var(--rls-sizing-x20);
-  font-size: var(--rls-body-font-size);
-  font-weight: var(--rls-font-weight-bold);
-  letter-spacing: var(--rls-body-letter-spacing);
-}
-.rls-pagination__actions {
-  width: auto;
-}
-.rls-pagination__action {
-  background: none;
+  background: transparent;
   outline: none;
-  color: var(--rls-app-color-300);
-  height: var(--rls-sizing-x18);
-  width: var(--rls-sizing-x18);
-  padding: var(--rls-sizing-x3);
-  margin: var(--rls-sizing-x1) 0rem;
+  width: inherit;
+  height: inherit;
 }
-.rls-pagination__action:hover {
-  color: var(--rls-theme-color-300);
-  cursor: pointer;
+.rls-picker-year__action button:not(:disabled):hover {
+  color: var(--rls-theme-color-500);
 }
-.rls-pagination__action:disabled {
-  pointer-events: none;
+.rls-picker-year__action button:disabled {
   opacity: 0.5;
 }
-
-.rls-password-field {
-  --rlc-input-parent-padding: var(--rls-sizing-x3) var(--rls-sizing-x4);
-  --rlc-action-ripple-dimension: var(--rls-sizing-x16);
-  --rlc-action-ripple-position: -8rem;
+.rls-picker-year__component {
   position: relative;
+  display: grid;
   width: 100%;
+  grid-template-columns: repeat(3, 1fr);
+  padding: var(--rls-sizing-x4);
   box-sizing: border-box;
+  row-gap: var(--rls-sizing-x6);
+  column-gap: var(--rls-sizing-x8);
 }
-.rls-password-field .rls-button-action {
-  margin: auto var(--rls-sizing-x2) auto 0rem;
-}
-
-.rls-radiobutton-label {
-  --pvt-text-opacity: 1;
-  --pvt-text-height: var(--rls-sizing-x12);
-  --pvt-text-overflow: hidden;
-  --pvt-text-white-space: nowrap;
-  --pvt-text-text-overflow: ellipsis;
+.rls-picker-year__year {
   position: relative;
-  width: 100%;
   display: flex;
+  align-items: center;
+  justify-content: center;
+  box-sizing: border-box;
+  text-align: center;
+  height: var(--rls-sizing-x20);
+  border-radius: var(--rls-sizing-x4);
 }
-.rls-radiobutton-label--disabled {
-  --pvt-text-opacity: 0.5;
-  pointer-events: none;
-}
-.rls-radiobutton-label--extended {
-  --pvt-text-text-overflow: initial;
-  --pvt-text-overflow: initial;
-  --pvt-text-white-space: initial;
-  --pvt-text-height: auto;
+.rls-picker-year__year:not(:hover) {
+  color: var(--pvt-component-font-color);
+  border: var(--pvt-component-border);
+  background: var(--pvt-component-background);
 }
-.rls-radiobutton-label__component {
-  margin-right: var(--rls-sizing-x4);
-  width: auto;
+.rls-picker-year__year:hover {
+  background: var(--rls-theme-color-900);
+  color: var(--rls-theme-font-900);
+  border: var(--rls-theme-border-1-900);
 }
-.rls-radiobutton-label__text {
-  max-width: calc(100% - var(--rls-sizing-x16));
-  height: var(--pvt-text-height);
-  line-height: var(--rls-sizing-x12);
-  color: var(--rls-app-color-300);
-  font-size: var(--rls-label-font-size);
-  font-weight: var(--rls-font-weight-medium);
-  letter-spacing: var(--rls-label-letter-spacing);
-  user-select: none;
-  opacity: var(--pvt-text-opacity);
-  overflow: var(--pvt-text-overflow);
-  white-space: var(--pvt-text-white-space);
-  text-overflow: var(--pvt-text-text-overflow);
+.rls-picker-year__year--selected {
+  --pvt-component-border: var(--rls-app-border-1-300);
 }
-
-.rls-switch-label {
-  --pvt-text-opacity: 1;
-  --pvt-text-height: var(--rls-sizing-x12);
-  --pvt-text-overflow: hidden;
-  --pvt-text-white-space: nowrap;
-  --pvt-text-text-overflow: ellipsis;
-  display: flex;
-  column-gap: var(--rls-sizing-x4);
+.rls-picker-year__year--focused {
+  --pvt-component-background: var(--rls-theme-color-500);
+  --pvt-component-font-color: var(--rls-theme-font-500);
+  --pvt-component-border: var(--rls-theme-border-1-500);
 }
-.rls-switch-label--disabled {
-  --pvt-text-opacity: 0.5;
+.rls-picker-year__year--disabled {
+  --pvt-span-background: var(--rls-app-background-300);
+  --pvt-component-font-color: var(--rls-app-color-100);
+  --pvt-span-border: var(--rls-border-1) solid var(--rls-app-background-300);
   pointer-events: none;
 }
-.rls-switch-label--extended {
-  --pvt-text-text-overflow: initial;
-  --pvt-text-overflow: initial;
-  --pvt-text-white-space: initial;
-  --pvt-text-height: auto;
-}
-.rls-switch-label__component {
-  max-width: 20rem;
-}
-.rls-switch-label__text {
-  max-width: calc(100% - var(--rls-sizing-x28));
-  height: var(--pvt-text-height);
-  line-height: var(--rls-sizing-x12);
-  color: var(--rls-app-color-300);
-  font-size: var(--rls-label-font-size);
-  font-weight: var(--rls-font-weight-medium);
-  letter-spacing: var(--rls-label-letter-spacing);
-  user-select: none;
-  opacity: var(--pvt-text-opacity);
-  overflow: var(--pvt-text-overflow);
-  white-space: var(--pvt-text-white-space);
-  text-overflow: var(--pvt-text-text-overflow);
-}
-
-.rls-text-field {
-  --rlc-input-parent-padding: var(--rls-sizing-x3) var(--rls-sizing-x4);
-  position: relative;
-  width: 100%;
-  box-sizing: border-box;
+.rls-picker-year__year__span {
+  font-weight: var(--rls-font-weight-semibold);
+  font-size: var(--rls-sizing-x8);
+  cursor: default;
+  pointer-events: none;
+  letter-spacing: 0.325rem;
 }
 
 .rls-toolbar {
@@ -1533,171 +1616,6 @@
   align-items: center;
 }
 
-.rls-year-picker {
-  --pvt-component-background: transparent;
-  --pvt-component-font-color: var(--rls-app-color-500);
-  --pvt-component-border: var(--rls-border-1) solid transparent;
-  position: relative;
-  width: 100%;
-  max-width: 140rem;
-  box-sizing: border-box;
-  overflow: hidden;
-  user-select: none;
-}
-.rls-year-picker__header {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  box-sizing: border-box;
-  padding: var(--rls-sizing-x4) var(--rls-sizing-x6);
-  color: var(--rls-app-color-500);
-  background: var(--rls-app-background-100);
-  border-radius: var(--rls-sizing-x4);
-}
-.rls-year-picker__action {
-  width: var(--rls-sizing-x16);
-  height: var(--rls-sizing-x16);
-  line-height: var(--rls-sizing-x16);
-}
-.rls-year-picker__action button {
-  color: var(--rls-app-color-500);
-  background: transparent;
-  outline: none;
-  width: inherit;
-  height: inherit;
-}
-.rls-year-picker__action button:not(:disabled):hover {
-  color: var(--rls-theme-color-500);
-}
-.rls-year-picker__action button:disabled {
-  opacity: 0.5;
-}
-.rls-year-picker__component {
-  position: relative;
-  display: grid;
-  width: 100%;
-  grid-template-columns: repeat(3, 1fr);
-  padding: var(--rls-sizing-x4);
-  box-sizing: border-box;
-  row-gap: var(--rls-sizing-x6);
-  column-gap: var(--rls-sizing-x8);
-}
-.rls-year-picker__year {
-  position: relative;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  box-sizing: border-box;
-  text-align: center;
-  height: var(--rls-sizing-x20);
-  border-radius: var(--rls-sizing-x4);
-}
-.rls-year-picker__year:not(:hover) {
-  color: var(--pvt-component-font-color);
-  border: var(--pvt-component-border);
-  background: var(--pvt-component-background);
-}
-.rls-year-picker__year:hover {
-  background: var(--rls-theme-color-900);
-  color: var(--rls-theme-font-900);
-  border: var(--rls-theme-border-1-900);
-}
-.rls-year-picker__year--selected {
-  --pvt-component-border: var(--rls-app-border-1-300);
-}
-.rls-year-picker__year--focused {
-  --pvt-component-background: var(--rls-theme-color-500);
-  --pvt-component-font-color: var(--rls-theme-font-500);
-  --pvt-component-border: var(--rls-theme-border-1-500);
-}
-.rls-year-picker__year--disabled {
-  --pvt-span-background: var(--rls-app-background-300);
-  --pvt-component-font-color: var(--rls-app-color-100);
-  --pvt-span-border: var(--rls-border-1) solid var(--rls-app-background-300);
-  pointer-events: none;
-}
-.rls-year-picker__year__span {
-  font-weight: var(--rls-font-weight-semibold);
-  font-size: var(--rls-sizing-x8);
-  cursor: default;
-  pointer-events: none;
-  letter-spacing: 0.325rem;
-}
-
-.rls-autocomplete-field {
-  --pvt-control-width: 100%;
-  --pvt-control-opacity: 1;
-}
-.rls-autocomplete-field.rls-box-field--selected {
-  --pvt-control-width: calc(100% - var(--rls-sizing-x14));
-}
-.rls-autocomplete-field.rls-box-field--disabled {
-  --pvt-control-opacity: 0.5;
-}
-.rls-autocomplete-field .rls-list-field__control {
-  width: var(--pvt-control-width);
-  text-overflow: ellipsis;
-  overflow: hidden;
-  white-space: nowrap;
-  opacity: var(--pvt-control-opacity);
-}
-.rls-autocomplete-field .rls-list-field__ul__search {
-  display: flex;
-  align-items: center;
-  width: 100%;
-  margin-top: var(--rls-sizing-x2);
-  margin-bottom: var(--rls-sizing-x6);
-  background: var(--rls-app-background-300);
-  border-radius: var(--rls-sizing-x4);
-  padding: var(--rls-sizing-x4);
-  box-sizing: border-box;
-}
-.rls-autocomplete-field .rls-list-field__ul__search button {
-  color: var(--rls-app-color-300);
-  background: transparent;
-}
-.rls-autocomplete-field
-  .rls-list-field__ul__search
-  button:not(:disabled):hover {
-  color: var(--rls-theme-color-300);
-}
-.rls-autocomplete-field .rls-list-field__ul__search button:disabled {
-  opacity: 0.5;
-}
-.rls-autocomplete-field .rls-list-field__ul__control {
-  width: 100%;
-  height: var(--rls-sizing-x12);
-  line-height: var(--rls-sizing-x12);
-  padding: 0rem;
-  cursor: text;
-  border: none;
-  outline: none;
-  background: transparent;
-  color: var(--rls-app-color-500);
-  font-size: var(--rls-input-font-size);
-  font-weight: var(--rls-font-weight-medium);
-  letter-spacing: var(--rls-input-letter-spacing);
-}
-.rls-autocomplete-field .rls-list-field__ul__control::placeholder {
-  color: var(--rls-app-color-100);
-}
-.rls-autocomplete-field .rls-list-field__ul__control::selection {
-  background: var(--rls-theme-color-700);
-  color: var(--rls-light-color-500);
-}
-.rls-autocomplete-field .rls-list-field__ul__control:disabled {
-  opacity: 0.5;
-}
-.rls-autocomplete-field .rls-list-field__ul .rls-progress-bar {
-  margin-bottom: var(--rls-sizing-x8);
-}
-.rls-autocomplete-field .rls-list-field__element .rls-ballot__title label {
-  background: var(--rls-theme-color-100);
-  color: var(--rls-theme-color-500);
-  padding: 0rem var(--rls-sizing-x2);
-  border-radius: var(--rls-sizing-x2);
-}
-
 .rls-card {
   background: var(--rls-app-background-500);
   border-radius: var(--rls-sizing-x4);
@@ -1864,85 +1782,78 @@
   }
 }
 
-.rls-date-picker {
-  position: relative;
-  display: flex;
-  flex-direction: column;
-  max-width: 150rem;
-  overflow: hidden;
-  row-gap: var(--rls-sizing-x4);
-}
-.rls-date-picker__header {
-  display: flex;
-  flex-direction: column;
-  row-gap: var(--rls-sizing-x4);
-  padding: var(--rls-sizing-x4);
-  box-sizing: border-box;
-  background: var(--rls-theme-color-100);
-}
-.rls-date-picker__header .rls-month-title-picker {
-  padding: 0rem var(--rls-sizing-x6);
-  box-sizing: border-box;
-}
-.rls-date-picker__title {
-  color: var(--rls-app-color-500);
-  text-align: center;
-  cursor: default;
-  font-weight: var(--rls-font-weight-bold);
+.rls-field-autocomplete {
+  --pvt-control-width: 100%;
+  --pvt-control-opacity: 1;
 }
-.rls-date-picker__title:hover {
-  color: var(--rls-theme-color-500);
+.rls-field-autocomplete.rls-field-box--selected {
+  --pvt-control-width: calc(100% - var(--rls-sizing-x14));
 }
-.rls-date-picker__title--description {
-  height: var(--rls-sizing-x16);
-  line-height: var(--rls-sizing-x16);
-  font-size: 9.25rem;
+.rls-field-autocomplete.rls-field-box--disabled {
+  --pvt-control-opacity: 0.5;
 }
-.rls-date-picker__title--year {
-  height: var(--rls-sizing-x16);
-  line-height: var(--rls-sizing-x16);
-  font-size: var(--rls-sizing-x12);
-  color: var(--rls-app-color-300);
+.rls-field-autocomplete .rls-field-list__control {
+  width: var(--pvt-control-width);
+  text-overflow: ellipsis;
+  overflow: hidden;
+  white-space: nowrap;
+  opacity: var(--pvt-control-opacity);
 }
-.rls-date-picker__component {
+.rls-field-autocomplete .rls-field-list__ul__search {
   display: flex;
-  justify-content: center;
-  width: 150rem;
-  padding: 0rem var(--rls-sizing-x2);
+  align-items: center;
+  width: 100%;
+  margin-top: var(--rls-sizing-x2);
+  margin-bottom: var(--rls-sizing-x6);
+  background: var(--rls-app-background-300);
+  border-radius: var(--rls-sizing-x4);
+  padding: var(--rls-sizing-x4);
   box-sizing: border-box;
 }
-.rls-date-picker__component > * {
-  display: none;
+.rls-field-autocomplete .rls-field-list__ul__search button {
+  color: var(--rls-app-color-300);
+  background: transparent;
 }
-.rls-date-picker__component--day .rls-day-picker {
-  display: block;
+.rls-field-autocomplete
+  .rls-field-list__ul__search
+  button:not(:disabled):hover {
+  color: var(--rls-theme-color-300);
 }
-.rls-date-picker__component--month .rls-month-picker {
-  display: grid;
+.rls-field-autocomplete .rls-field-list__ul__search button:disabled {
+  opacity: 0.5;
 }
-.rls-date-picker__component--year .rls-year-picker {
-  display: block;
+.rls-field-autocomplete .rls-field-list__ul__control {
+  width: 100%;
+  height: var(--rls-sizing-x12);
+  line-height: var(--rls-sizing-x12);
+  padding: 0rem;
+  cursor: text;
+  border: none;
+  outline: none;
+  background: transparent;
+  color: var(--rls-app-color-500);
+  font-size: var(--rls-input-font-size);
+  font-weight: var(--rls-font-weight-medium);
+  letter-spacing: var(--rls-input-letter-spacing);
 }
-.rls-date-picker__actions {
-  display: flex;
-  flex-wrap: wrap;
-  gap: var(--rls-sizing-x4);
-  padding: var(--rls-sizing-x4) var(--rls-sizing-x8) var(--rls-sizing-x6)
-    var(--rls-sizing-x8);
-  overflow: hidden;
-  box-sizing: border-box;
+.rls-field-autocomplete .rls-field-list__ul__control::placeholder {
+  color: var(--rls-app-color-100);
 }
-.rls-date-picker__actions--cancel {
-  width: calc(50% - var(--rls-sizing-x2));
+.rls-field-autocomplete .rls-field-list__ul__control::selection {
+  background: var(--rls-theme-color-700);
+  color: var(--rls-light-color-500);
 }
-.rls-date-picker__actions--today {
-  width: calc(50% - var(--rls-sizing-x2));
+.rls-field-autocomplete .rls-field-list__ul__control:disabled {
+  opacity: 0.5;
 }
-.rls-date-picker__actions--ok {
-  width: 100%;
+.rls-field-autocomplete .rls-field-list__ul .rls-progress-bar {
+  margin-bottom: var(--rls-sizing-x8);
 }
-.rls-date-picker__actions button {
-  width: 100%;
+.rls-field-autocomplete .rls-field-list__element .rls-ballot__title label {
+  background: var(--rls-theme-color-100);
+  color: var(--rls-theme-color-500);
+  padding: 0rem var(--rls-sizing-x2);
+  border-radius: var(--rls-sizing-x2);
 }
 
 .rls-modal {
@@ -2005,16 +1916,97 @@
     bottom 120ms 0ms var(--rls-deceleration-curve);
 }
 
-.rls-date-field {
-  --rlc-boxfield-body-padding: var(--rls-sizing-x3) var(--rls-sizing-x4);
+.rls-picker-date {
+  position: relative;
+  display: flex;
+  flex-direction: column;
+  max-width: 150rem;
+  overflow: hidden;
+  row-gap: var(--rls-sizing-x4);
+}
+.rls-picker-date__header {
+  display: flex;
+  flex-direction: column;
+  row-gap: var(--rls-sizing-x4);
+  padding: var(--rls-sizing-x4);
+  box-sizing: border-box;
+  background: var(--rls-theme-color-100);
+}
+.rls-picker-date__header .rls-picker-month-title {
+  padding: 0rem var(--rls-sizing-x6);
+  box-sizing: border-box;
+}
+.rls-picker-date__title {
+  color: var(--rls-app-color-500);
+  text-align: center;
+  cursor: default;
+  font-weight: var(--rls-font-weight-bold);
+}
+.rls-picker-date__title:hover {
+  color: var(--rls-theme-color-500);
+}
+.rls-picker-date__title--description {
+  height: var(--rls-sizing-x16);
+  line-height: var(--rls-sizing-x16);
+  font-size: 9.25rem;
+}
+.rls-picker-date__title--year {
+  height: var(--rls-sizing-x16);
+  line-height: var(--rls-sizing-x16);
+  font-size: var(--rls-sizing-x12);
+  color: var(--rls-app-color-300);
+}
+.rls-picker-date__component {
+  display: flex;
+  justify-content: center;
+  width: 150rem;
+  padding: 0rem var(--rls-sizing-x2);
+  box-sizing: border-box;
+}
+.rls-picker-date__component > * {
+  display: none;
+}
+.rls-picker-date__component--day .rls-picker-day {
+  display: block;
+}
+.rls-picker-date__component--month .rls-picker-month {
+  display: grid;
+}
+.rls-picker-date__component--year .rls-picker-year {
+  display: block;
+}
+.rls-picker-date__actions {
+  display: flex;
+  flex-wrap: wrap;
+  gap: var(--rls-sizing-x4);
+  padding: var(--rls-sizing-x4) var(--rls-sizing-x8) var(--rls-sizing-x6)
+    var(--rls-sizing-x8);
+  overflow: hidden;
+  box-sizing: border-box;
+}
+.rls-picker-date__actions--cancel {
+  width: calc(50% - var(--rls-sizing-x2));
+}
+.rls-picker-date__actions--today {
+  width: calc(50% - var(--rls-sizing-x2));
+}
+.rls-picker-date__actions--ok {
+  width: 100%;
+}
+.rls-picker-date__actions button {
+  width: 100%;
+}
+
+.rls-field-date {
+  --rlc-fieldbox-body-padding: var(--rls-sizing-x3) var(--rls-sizing-x4);
   position: relative;
   width: 100%;
   box-sizing: border-box;
 }
-.rls-date-field .rls-box-field__body {
+.rls-field-date .rls-field-box__body {
   column-gap: var(--rls-sizing-x2);
 }
-.rls-date-field__control {
+.rls-field-date__control {
   position: relative;
   width: calc(100% - var(--rls-sizing-x14));
   height: var(--rls-sizing-x12);
@@ -2029,24 +2021,24 @@
   font-size: var(--rlc-input-font-size);
   letter-spacing: var(--rlc-input-letter-spacing);
 }
-.rls-date-field__control::placeholder {
+.rls-field-date__control::placeholder {
   color: var(--rls-app-color-100);
 }
-.rls-date-field__control:disabled {
+.rls-field-date__control:disabled {
   opacity: 0.5;
 }
-.rls-date-field__action {
+.rls-field-date__action {
   color: var(--rls-app-color-300);
   width: var(--rls-sizing-x12);
   height: var(--rls-sizing-x12);
   padding: 0rem;
   background: transparent;
 }
-.rls-date-field__action:disabled {
+.rls-field-date__action:disabled {
   opacity: 0.5;
 }
 
-.rls-date-range-picker {
+.rls-picker-date-range {
   position: relative;
   display: flex;
   flex-direction: column;
@@ -2054,66 +2046,66 @@
   overflow: hidden;
   max-width: 150rem;
 }
-.rls-date-range-picker__header {
+.rls-picker-date-range__header {
   background: var(--rls-theme-color-100);
   padding: var(--rls-sizing-x4);
   box-sizing: border-box;
 }
-.rls-date-range-picker__title {
+.rls-picker-date-range__title {
   color: var(--rls-app-color-500);
   text-align: center;
   cursor: default;
   font-weight: var(--rls-font-weight-bold);
 }
-.rls-date-range-picker__title:hover {
+.rls-picker-date-range__title:hover {
   color: var(--rls-theme-color-500);
 }
-.rls-date-range-picker__title--description {
+.rls-picker-date-range__title--description {
   height: var(--rls-sizing-x16);
   line-height: var(--rls-sizing-x16);
   font-size: 9.25rem;
 }
-.rls-date-range-picker__title--year {
+.rls-picker-date-range__title--year {
   margin: var(--rls-sizing-x4) 0rem var(--rls-sizing-x2) 0rem;
   height: var(--rls-sizing-x16);
   line-height: var(--rls-sizing-x16);
   font-size: var(--rls-sizing-x12);
   color: var(--rls-app-color-300);
 }
-.rls-date-range-picker__title--month {
+.rls-picker-date-range__title--month {
   display: flex;
   justify-content: space-between;
 }
-.rls-date-range-picker__title--month span {
+.rls-picker-date-range__title--month span {
   height: var(--rls-sizing-x14);
   line-height: var(--rls-sizing-x14);
   font-size: var(--rls-sizing-x10);
   color: var(--rls-app-color-300);
   margin: auto 0rem;
 }
-.rls-date-range-picker__component {
+.rls-picker-date-range__component {
   display: flex;
   justify-content: center;
   width: 150rem;
   padding: 0rem var(--rls-sizing-x2);
   box-sizing: border-box;
 }
-.rls-date-range-picker__component > * {
+.rls-picker-date-range__component > * {
   display: none;
 }
-.rls-date-range-picker__component--day .rls-day-range-picker {
+.rls-picker-date-range__component--day .rls-picker-day-range {
   display: flex;
 }
-.rls-date-range-picker__component--month .rls-month-picker {
+.rls-picker-date-range__component--month .rls-picker-month {
   display: grid;
 }
-.rls-date-range-picker__component--year .rls-year-picker {
+.rls-picker-date-range__component--year .rls-picker-year {
   display: block;
 }
-.rls-date-range-picker__footer--hidden {
+.rls-picker-date-range__footer--hidden {
   display: none;
 }
-.rls-date-range-picker__actions {
+.rls-picker-date-range__actions {
   display: flex;
   flex-wrap: wrap;
   gap: var(--rls-sizing-x4);
@@ -2121,17 +2113,17 @@
   overflow: hidden;
   box-sizing: border-box;
 }
-.rls-date-range-picker__actions button {
+.rls-picker-date-range__actions button {
   width: 100%;
 }
 
-.rls-date-range-field {
-  --rlc-boxfield-body-padding: var(--rls-sizing-x3) var(--rls-sizing-x4);
+.rls-field-date-range {
+  --rlc-fieldbox-body-padding: var(--rls-sizing-x3) var(--rls-sizing-x4);
   position: relative;
   width: 100%;
   box-sizing: border-box;
 }
-.rls-date-range-field__control {
+.rls-field-date-range__control {
   position: relative;
   width: calc(100% - var(--rls-sizing-x14));
   height: var(--rls-sizing-x12);
@@ -2146,13 +2138,13 @@
   font-size: var(--rlc-input-font-size);
   letter-spacing: var(--rlc-input-letter-spacing);
 }
-.rls-date-range-field__control::placeholder {
+.rls-field-date-range__control::placeholder {
   color: var(--rls-app-color-100);
 }
-.rls-date-range-field__control:disabled {
+.rls-field-date-range__control:disabled {
   opacity: 0.5;
 }
-.rls-date-range-field__action {
+.rls-field-date-range__action {
   color: var(--rls-app-color-300);
   width: var(--rls-sizing-x12);
   height: var(--rls-sizing-x12);
@@ -2161,6 +2153,17 @@
   background: transparent;
 }
 
+.rls-field-select .rls-field-list__control {
+  cursor: pointer;
+}
+
+.rls-field-select .rls-field-list__action {
+  transition: transform 160ms 0ms var(--rls-sharp-curve);
+}
+.rls-field-select .rls-field-list__action--visible {
+  transform: rotate(180deg);
+}
+
 .rls-form-navigation {
   position: fixed;
   top: var(--rls-sizing-x8);
@@ -2192,17 +2195,6 @@
   float: right;
 }
 
-.rls-select-field .rls-list-field__control {
-  cursor: pointer;
-}
-
-.rls-select-field .rls-list-field__action {
-  transition: transform 160ms 0ms var(--rls-sharp-curve);
-}
-.rls-select-field .rls-list-field__action--visible {
-  transform: rotate(180deg);
-}
-
 .rls-snackbar {
   position: fixed;
   display: flex;