@databricks/design-system 1.4.0 → 1.5.0

package/dist/index.css

@@ -3230,9 +3230,9 @@ a.du-bois-light-btn-sm {
 .du-bois-light-select-single .du-bois-light-select-selector .du-bois-light-select-selection-search {
   position: absolute;
   top: 0;
-  right: 7px;
+  right: 12px;
   bottom: 0;
-  left: 7px;
+  left: 12px;
 }
 .du-bois-light-select-single .du-bois-light-select-selector .du-bois-light-select-selection-search-input {
   width: 100%;
@@ -3265,7 +3265,7 @@ a.du-bois-light-btn-sm {
   content: '\a0';
 }
 .du-bois-light-select-single.du-bois-light-select-show-arrow .du-bois-light-select-selection-search {
-  right: 20px;
+  right: 25px;
 }
 .du-bois-light-select-single.du-bois-light-select-show-arrow .du-bois-light-select-selection-item,
 .du-bois-light-select-single.du-bois-light-select-show-arrow .du-bois-light-select-selection-placeholder {
@@ -3277,7 +3277,7 @@ a.du-bois-light-btn-sm {
 .du-bois-light-select-single:not(.du-bois-light-select-customize-input) .du-bois-light-select-selector {
   width: 100%;
   height: 40px;
-  padding: 0 7px;
+  padding: 0 12px;
 }
 .du-bois-light-select-single:not(.du-bois-light-select-customize-input) .du-bois-light-select-selector .du-bois-light-select-selection-search-input {
   height: 38px;
@@ -3296,7 +3296,7 @@ a.du-bois-light-btn-sm {
   position: absolute;
   right: 0;
   left: 0;
-  padding: 0 7px;
+  padding: 0 12px;
 }
 .du-bois-light-select-single.du-bois-light-select-customize-input .du-bois-light-select-selector .du-bois-light-select-selection-placeholder::after {
   display: none;
@@ -3324,21 +3324,21 @@ a.du-bois-light-btn-sm {
   height: 30px;
 }
 .du-bois-light-select-single.du-bois-light-select-sm:not(.du-bois-light-select-customize-input) .du-bois-light-select-selection-search {
-  right: 3px;
-  left: 3px;
+  right: 12px;
+  left: 12px;
 }
 .du-bois-light-select-single.du-bois-light-select-sm:not(.du-bois-light-select-customize-input) .du-bois-light-select-selector {
-  padding: 0 3px;
+  padding: 0 12px;
 }
 .du-bois-light-select-single.du-bois-light-select-sm:not(.du-bois-light-select-customize-input).du-bois-light-select-show-arrow .du-bois-light-select-selection-search {
-  right: 22.5px;
+  right: 31.5px;
 }
 .du-bois-light-select-single.du-bois-light-select-sm:not(.du-bois-light-select-customize-input).du-bois-light-select-show-arrow .du-bois-light-select-selection-item,
 .du-bois-light-select-single.du-bois-light-select-sm:not(.du-bois-light-select-customize-input).du-bois-light-select-show-arrow .du-bois-light-select-selection-placeholder {
   padding-right: 19.5px;
 }
 .du-bois-light-select-single.du-bois-light-select-lg:not(.du-bois-light-select-customize-input) .du-bois-light-select-selector {
-  padding: 0 7px;
+  padding: 0 12px;
 }
 /**
  * Do not merge `height` & `line-height` under style with `selection` & `search`,
@@ -3360,7 +3360,7 @@ a.du-bois-light-btn-sm {
   display: flex;
   flex-wrap: wrap;
   align-items: center;
-  padding: 0px 3px;
+  padding: 1px 5px;
 }
 .du-bois-light-select-show-search.du-bois-light-select-multiple .du-bois-light-select-selector {
   cursor: text;
@@ -3372,8 +3372,8 @@ a.du-bois-light-btn-sm {
 .du-bois-light-select-multiple .du-bois-light-select-selector::after {
   display: inline-block;
   width: 0;
-  margin: 2px 0;
-  line-height: 34px;
+  margin: 3px 0;
+  line-height: 30px;
   content: '\a0';
 }
 .du-bois-light-select-multiple.du-bois-light-select-show-arrow .du-bois-light-select-selector,
@@ -3386,17 +3386,17 @@ a.du-bois-light-btn-sm {
   flex: none;
   box-sizing: border-box;
   max-width: 100%;
-  height: 34px;
-  margin-top: 2px;
-  margin-bottom: 2px;
-  line-height: 32px;
+  height: 30px;
+  margin-top: 3px;
+  margin-bottom: 3px;
+  line-height: 28px;
   background: #f5f5f5;
   border: 1px solid #f0f0f0;
   border-radius: 4px;
   cursor: default;
   transition: font-size 0.3s, line-height 0.3s, height 0.3s;
   user-select: none;
-  margin-inline-end: 3px;
+  margin-inline-end: 5px;
   padding-inline-start: 4px;
   padding-inline-end: 2px;
 }
@@ -3453,15 +3453,15 @@ a.du-bois-light-btn-sm {
 .du-bois-light-select-multiple .du-bois-light-select-selection-search {
   position: relative;
   max-width: 100%;
-  margin-top: 2px;
-  margin-bottom: 2px;
-  margin-inline-start: 4px;
+  margin-top: 3px;
+  margin-bottom: 3px;
+  margin-inline-start: 7px;
 }
 .du-bois-light-select-multiple .du-bois-light-select-selection-search-input,
 .du-bois-light-select-multiple .du-bois-light-select-selection-search-mirror {
-  height: 34px;
+  height: 30px;
   font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
-  line-height: 34px;
+  line-height: 30px;
   transition: all 0.3s;
 }
 .du-bois-light-select-multiple .du-bois-light-select-selection-search-input {
@@ -3479,45 +3479,45 @@ a.du-bois-light-btn-sm {
 .du-bois-light-select-multiple .du-bois-light-select-selection-placeholder {
   position: absolute;
   top: 50%;
-  right: 7px;
-  left: 7px;
+  right: 12px;
+  left: 12px;
   transform: translateY(-50%);
   transition: all 0.3s;
 }
 .du-bois-light-select-multiple.du-bois-light-select-lg .du-bois-light-select-selector::after {
-  line-height: 34px;
+  line-height: 30px;
 }
 .du-bois-light-select-multiple.du-bois-light-select-lg .du-bois-light-select-selection-item {
-  height: 34px;
-  line-height: 32px;
+  height: 30px;
+  line-height: 28px;
 }
 .du-bois-light-select-multiple.du-bois-light-select-lg .du-bois-light-select-selection-search {
-  height: 34px;
-  line-height: 34px;
+  height: 30px;
+  line-height: 30px;
 }
 .du-bois-light-select-multiple.du-bois-light-select-lg .du-bois-light-select-selection-search-input,
 .du-bois-light-select-multiple.du-bois-light-select-lg .du-bois-light-select-selection-search-mirror {
-  height: 34px;
-  line-height: 32px;
+  height: 30px;
+  line-height: 28px;
 }
 .du-bois-light-select-multiple.du-bois-light-select-sm .du-bois-light-select-selector::after {
-  line-height: 26px;
+  line-height: 22px;
 }
 .du-bois-light-select-multiple.du-bois-light-select-sm .du-bois-light-select-selection-item {
-  height: 26px;
-  line-height: 24px;
+  height: 22px;
+  line-height: 20px;
 }
 .du-bois-light-select-multiple.du-bois-light-select-sm .du-bois-light-select-selection-search {
-  height: 26px;
-  line-height: 26px;
+  height: 22px;
+  line-height: 22px;
 }
 .du-bois-light-select-multiple.du-bois-light-select-sm .du-bois-light-select-selection-search-input,
 .du-bois-light-select-multiple.du-bois-light-select-sm .du-bois-light-select-selection-search-mirror {
-  height: 26px;
-  line-height: 24px;
+  height: 22px;
+  line-height: 20px;
 }
 .du-bois-light-select-multiple.du-bois-light-select-sm .du-bois-light-select-selection-placeholder {
-  left: 3px;
+  left: 12px;
 }
 .du-bois-light-select-multiple.du-bois-light-select-sm .du-bois-light-select-selection-search {
   margin-inline-start: 3px;
@@ -3827,7 +3827,7 @@ a.du-bois-light-btn-sm {
 }
 .du-bois-light-select-rtl.du-bois-light-select-multiple.du-bois-light-select-show-arrow .du-bois-light-select-selector,
 .du-bois-light-select-rtl.du-bois-light-select-multiple.du-bois-light-select-allow-clear .du-bois-light-select-selector {
-  padding-right: 3px;
+  padding-right: 5px;
   padding-left: 20px;
 }
 .du-bois-light-select-rtl.du-bois-light-select-multiple .du-bois-light-select-selection-item {
@@ -3843,11 +3843,11 @@ a.du-bois-light-btn-sm {
   left: auto;
 }
 .du-bois-light-select-rtl.du-bois-light-select-multiple .du-bois-light-select-selection-placeholder {
-  right: 7px;
+  right: 12px;
   left: auto;
 }
 .du-bois-light-select-rtl.du-bois-light-select-multiple.du-bois-light-select-sm .du-bois-light-select-selection-placeholder {
-  right: 3px;
+  right: 12px;
 }
 .du-bois-light-select-rtl.du-bois-light-select-single .du-bois-light-select-selector .du-bois-light-select-selection-item,
 .du-bois-light-select-rtl.du-bois-light-select-single .du-bois-light-select-selector .du-bois-light-select-selection-placeholder {
@@ -3856,8 +3856,8 @@ a.du-bois-light-btn-sm {
   text-align: right;
 }
 .du-bois-light-select-rtl.du-bois-light-select-single.du-bois-light-select-show-arrow .du-bois-light-select-selection-search {
-  right: 7px;
-  left: 20px;
+  right: 12px;
+  left: 25px;
 }
 .du-bois-light-select-rtl.du-bois-light-select-single.du-bois-light-select-show-arrow .du-bois-light-select-selection-item,
 .du-bois-light-select-rtl.du-bois-light-select-single.du-bois-light-select-show-arrow .du-bois-light-select-selection-placeholder {
@@ -3865,7 +3865,7 @@ a.du-bois-light-btn-sm {
   padding-left: 17px;
 }
 .du-bois-light-select-rtl.du-bois-light-select-single.du-bois-light-select-sm:not(.du-bois-light-select-customize-input).du-bois-light-select-show-arrow .du-bois-light-select-selection-search {
-  right: 2px;
+  right: 11px;
 }
 .du-bois-light-select-rtl.du-bois-light-select-single.du-bois-light-select-sm:not(.du-bois-light-select-customize-input).du-bois-light-select-show-arrow .du-bois-light-select-selection-item,
 .du-bois-light-select-rtl.du-bois-light-select-single.du-bois-light-select-sm:not(.du-bois-light-select-customize-input).du-bois-light-select-show-arrow .du-bois-light-select-selection-placeholder {
@@ -4109,7 +4109,7 @@ a.du-bois-light-btn-sm {
   line-height: 20px;
   list-style: none;
   font-feature-settings: 'tnum';
-  padding: 0 7px 0;
+  padding: 0 12px 0;
   position: relative;
   display: inline-flex;
   align-items: center;
@@ -4153,7 +4153,7 @@ a.du-bois-light-btn-sm {
   display: inline-block;
   width: 100%;
   min-width: 0;
-  padding: 3px 7px;
+  padding: 5px 12px;
   color: #1F272D;
   font-size: 13px;
   line-height: 20px;
@@ -4228,11 +4228,11 @@ textarea.du-bois-light-picker-input > input {
   transition: all 0.3s, height 0s;
 }
 .du-bois-light-picker-input > input-lg {
-  padding: -161px 7px;
+  padding: 5px 12px;
   font-size: 18px;
 }
 .du-bois-light-picker-input > input-sm {
-  padding: 0 3px;
+  padding: 5px 12px;
 }
 .du-bois-light-picker-input > input:focus {
   box-shadow: none;
@@ -4247,13 +4247,13 @@ textarea.du-bois-light-picker-input > input {
   color: #bfbfbf;
 }
 .du-bois-light-picker-large {
-  padding: 0 7px 0;
+  padding: 0 12px 0;
 }
 .du-bois-light-picker-large .du-bois-light-picker-input > input {
   font-size: 18px;
 }
 .du-bois-light-picker-small {
-  padding: 0 3px 0;
+  padding: 0 12px 0;
 }
 .du-bois-light-picker-suffix {
   align-self: center;
@@ -4304,7 +4304,7 @@ textarea.du-bois-light-picker-input > input {
   display: inline-flex;
 }
 .du-bois-light-picker-range .du-bois-light-picker-clear {
-  right: 7px;
+  right: 12px;
 }
 .du-bois-light-picker-range:hover .du-bois-light-picker-clear {
   opacity: 1;
@@ -4312,7 +4312,7 @@ textarea.du-bois-light-picker-input > input {
 .du-bois-light-picker-range .du-bois-light-picker-active-bar {
   bottom: -1px;
   height: 2px;
-  margin-left: 7px;
+  margin-left: 12px;
   background: #2272B4;
   opacity: 0;
   transition: all 0.3s ease-out;
@@ -4327,10 +4327,10 @@ textarea.du-bois-light-picker-input > input {
   line-height: 1;
 }
 .du-bois-light-picker-range.du-bois-light-picker-small .du-bois-light-picker-clear {
-  right: 3px;
+  right: 12px;
 }
 .du-bois-light-picker-range.du-bois-light-picker-small .du-bois-light-picker-active-bar {
-  margin-left: 3px;
+  margin-left: 12px;
 }
 .du-bois-light-picker-dropdown {
   box-sizing: border-box;
@@ -4417,7 +4417,7 @@ textarea.du-bois-light-picker-input > input {
   display: none;
   width: 10px;
   height: 10px;
-  margin-left: 10.5px;
+  margin-left: 18px;
   box-shadow: 2px -2px 6px rgba(0, 0, 0, 0.06);
   transition: left 0.3s ease-out;
 }
@@ -4977,14 +4977,14 @@ _:-ms-fullscreen .du-bois-light-picker-range-wrapper .du-bois-light-picker-year-
 }
 .du-bois-light-picker-rtl.du-bois-light-picker-range .du-bois-light-picker-clear {
   right: auto;
-  left: 7px;
+  left: 12px;
 }
 .du-bois-light-picker-rtl.du-bois-light-picker-range .du-bois-light-picker-active-bar {
-  margin-right: 7px;
+  margin-right: 12px;
   margin-left: 0;
 }
 .du-bois-light-picker-rtl.du-bois-light-picker-range.du-bois-light-picker-small .du-bois-light-picker-active-bar {
-  margin-right: 3px;
+  margin-right: 12px;
 }
 .du-bois-light-picker-dropdown-rtl .du-bois-light-picker-ranges {
   text-align: right;
@@ -5989,13 +5989,13 @@ _:-ms-fullscreen .du-bois-light-picker-range-wrapper .du-bois-light-picker-year-
   right: 32px;
 }
 .du-bois-light-form-item-has-feedback .du-bois-light-picker {
-  padding-right: 23.9px;
+  padding-right: 28.9px;
 }
 .du-bois-light-form-item-has-feedback .du-bois-light-picker-large {
-  padding-right: 23.9px;
+  padding-right: 28.9px;
 }
 .du-bois-light-form-item-has-feedback .du-bois-light-picker-small {
-  padding-right: 19.9px;
+  padding-right: 28.9px;
 }
 .du-bois-light-form-item-has-feedback.du-bois-light-form-item-has-success .du-bois-light-form-item-children-icon,
 .du-bois-light-form-item-has-feedback.du-bois-light-form-item-has-warning .du-bois-light-form-item-children-icon,
@@ -6494,11 +6494,11 @@ _:-ms-fullscreen .du-bois-light-picker-range-wrapper .du-bois-light-picker-year-
   width: 100%;
 }
 .du-bois-light-form-rtl .du-bois-light-form-item-has-feedback .du-bois-light-input {
-  padding-right: 7px;
+  padding-right: 12px;
   padding-left: 24px;
 }
 .du-bois-light-form-rtl .du-bois-light-form-item-has-feedback .du-bois-light-input-affix-wrapper .du-bois-light-input-suffix {
-  padding-right: 7px;
+  padding-right: 12px;
   padding-left: 18px;
 }
 .du-bois-light-form-rtl .du-bois-light-form-item-has-feedback .du-bois-light-input-affix-wrapper .du-bois-light-input {
@@ -6532,16 +6532,16 @@ _:-ms-fullscreen .du-bois-light-picker-range-wrapper .du-bois-light-picker-year-
   left: 32px;
 }
 .du-bois-light-form-rtl .du-bois-light-form-item-has-feedback .du-bois-light-picker {
-  padding-right: 7px;
-  padding-left: 23.9px;
+  padding-right: 12px;
+  padding-left: 28.9px;
 }
 .du-bois-light-form-rtl .du-bois-light-form-item-has-feedback .du-bois-light-picker-large {
-  padding-right: 7px;
-  padding-left: 23.9px;
+  padding-right: 12px;
+  padding-left: 28.9px;
 }
 .du-bois-light-form-rtl .du-bois-light-form-item-has-feedback .du-bois-light-picker-small {
-  padding-right: 3px;
-  padding-left: 19.9px;
+  padding-right: 12px;
+  padding-left: 28.9px;
 }
 .du-bois-light-form-rtl .du-bois-light-form-item-has-feedback.du-bois-light-form-item-has-success .du-bois-light-form-item-children-icon,
 .du-bois-light-form-rtl .du-bois-light-form-item-has-feedback.du-bois-light-form-item-has-warning .du-bois-light-form-item-children-icon,
@@ -11994,7 +11994,7 @@ _:-ms-fullscreen .du-bois-light-picker-range-wrapper .du-bois-light-picker-year-
   display: inline-block;
   width: 100%;
   min-width: 0;
-  padding: 3px 7px;
+  padding: 5px 12px;
   color: #1F272D;
   font-size: 13px;
   line-height: 20px;
@@ -12073,11 +12073,11 @@ textarea.du-bois-light-input-affix-wrapper {
   transition: all 0.3s, height 0s;
 }
 .du-bois-light-input-affix-wrapper-lg {
-  padding: -161px 7px;
+  padding: 5px 12px;
   font-size: 18px;
 }
 .du-bois-light-input-affix-wrapper-sm {
-  padding: 0 3px;
+  padding: 5px 12px;
 }
 .du-bois-light-input-affix-wrapper-rtl {
   direction: rtl;
@@ -12167,7 +12167,7 @@ textarea.du-bois-light-input-affix-wrapper {
   display: inline-block;
   width: 100%;
   min-width: 0;
-  padding: 3px 7px;
+  padding: 5px 12px;
   color: #1F272D;
   font-size: 13px;
   line-height: 20px;
@@ -12245,11 +12245,11 @@ textarea.du-bois-light-input {
   transition: all 0.3s, height 0s;
 }
 .du-bois-light-input-lg {
-  padding: -161px 7px;
+  padding: 5px 12px;
   font-size: 18px;
 }
 .du-bois-light-input-sm {
-  padding: 0 3px;
+  padding: 5px 12px;
 }
 .du-bois-light-input-rtl {
   direction: rtl;
@@ -12319,7 +12319,7 @@ textarea.du-bois-light-input {
 }
 .du-bois-light-input-group-addon {
   position: relative;
-  padding: 0 7px;
+  padding: 0 12px;
   color: #1F272D;
   font-weight: normal;
   font-size: 13px;
@@ -12330,7 +12330,7 @@ textarea.du-bois-light-input {
   transition: all 0.3s;
 }
 .du-bois-light-input-group-addon .du-bois-light-select {
-  margin: -4px -7px;
+  margin: -6px -12px;
 }
 .du-bois-light-input-group-addon .du-bois-light-select.du-bois-light-select-single:not(.du-bois-light-select-customize-input) .du-bois-light-select-selector {
   background-color: inherit;
@@ -12386,12 +12386,12 @@ textarea.du-bois-light-input {
 }
 .du-bois-light-input-group-lg .du-bois-light-input,
 .du-bois-light-input-group-lg > .du-bois-light-input-group-addon {
-  padding: -161px 7px;
+  padding: 5px 12px;
   font-size: 18px;
 }
 .du-bois-light-input-group-sm .du-bois-light-input,
 .du-bois-light-input-group-sm > .du-bois-light-input-group-addon {
-  padding: 0 3px;
+  padding: 5px 12px;
 }
 .du-bois-light-input-group-lg .du-bois-light-select-single .du-bois-light-select-selector {
   height: 40px;
@@ -16339,7 +16339,7 @@ tr.du-bois-light-table-expanded-row .du-bois-light-descriptions-view table {
   display: inline-block;
   width: 100%;
   min-width: 0;
-  padding: 3px 7px;
+  padding: 5px 12px;
   color: #1F272D;
   font-size: 13px;
   line-height: 20px;
@@ -16411,11 +16411,11 @@ textarea.du-bois-light-pagination-options-quick-jumper input {
   transition: all 0.3s, height 0s;
 }
 .du-bois-light-pagination-options-quick-jumper input-lg {
-  padding: -161px 7px;
+  padding: 5px 12px;
   font-size: 18px;
 }
 .du-bois-light-pagination-options-quick-jumper input-sm {
-  padding: 0 3px;
+  padding: 5px 12px;
 }
 .du-bois-light-pagination-simple .du-bois-light-pagination-prev,
 .du-bois-light-pagination-simple .du-bois-light-pagination-next {
@@ -16509,7 +16509,7 @@ textarea.du-bois-light-pagination-options-quick-jumper input {
   line-height: 24px;
 }
 .du-bois-light-pagination.mini .du-bois-light-pagination-options-quick-jumper input {
-  padding: 0 3px;
+  padding: 5px 12px;
   width: 44px;
   height: 32px;
 }
@@ -17901,9 +17901,9 @@ a.du-bois-light-typography.du-bois-light-typography-disabled:active,
   position: relative;
 }
 div.du-bois-light-typography-edit-content {
-  left: -8px;
-  margin-top: -4px;
-  margin-bottom: calc(1em - 3px - 1px);
+  left: -13px;
+  margin-top: -6px;
+  margin-bottom: calc(1em - 5px - 1px);
 }
 .du-bois-light-typography-edit-content-confirm {
   position: absolute;
@@ -17991,7 +17991,7 @@ span.du-bois-light-typography-ellipsis-single-line {
   float: left;
 }
 div.du-bois-light-typography-edit-content.du-bois-light-typography-rtl {
-  right: -8px;
+  right: -13px;
   left: auto;
 }
 .du-bois-light-typography-rtl .du-bois-light-typography-edit-content-confirm {