@rolster/react-components 18.21.16 → 18.21.19

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (17) hide show
  1. package/dist/cjs/assets/{index-gIb32nSW.css → index-KtbnpnSR.css} +29 -15
  2. package/dist/cjs/index.js +2 -1
  3. package/dist/cjs/index.js.map +1 -1
  4. package/dist/es/assets/{index-gIb32nSW.css → index-KtbnpnSR.css} +29 -15
  5. package/dist/es/index.js +2 -1
  6. package/dist/es/index.js.map +1 -1
  7. package/dist/esm/components/molecules/FieldMoney/FieldMoney.css +1 -1
  8. package/dist/esm/components/molecules/FieldNumber/FieldNumber.css +1 -1
  9. package/dist/esm/components/molecules/FieldPassword/FieldPassword.css +1 -1
  10. package/dist/esm/components/molecules/FieldReadonly/FieldReadonly.css +1 -1
  11. package/dist/esm/components/molecules/FieldText/FieldText.css +1 -1
  12. package/dist/esm/components/organisms/FieldAutocomplete/FieldAutocomplete.css +1 -1
  13. package/dist/esm/components/organisms/FieldDate/FieldDate.css +10 -4
  14. package/dist/esm/components/organisms/FieldDateRange/FieldDateRange.css +13 -5
  15. package/dist/esm/controllers/ListController.js +2 -1
  16. package/dist/esm/controllers/ListController.js.map +1 -1
  17. package/package.json +3 -3
package/dist/es/assets/{index-gIb32nSW.css → index-KtbnpnSR.css} RENAMED
@@ -1088,21 +1088,21 @@
1088
1088
  }
1089
1089
 
1090
1090
  .rls-field-money {
1091
- --rlc-fieldbox-body-padding: var(--rls-sizing-x3) var(--rls-sizing-x4);
1091
+ --rlc-fieldbox-body-padding: var(--rls-sizing-x4);
1092
1092
  position: relative;
1093
1093
  width: 100%;
1094
1094
  box-sizing: border-box;
1095
1095
  }
1096
1096
 
1097
1097
  .rls-field-number {
1098
- --rlc-fieldbox-body-padding: var(--rls-sizing-x3) var(--rls-sizing-x4);
1098
+ --rlc-fieldbox-body-padding: var(--rls-sizing-x4);
1099
1099
  position: relative;
1100
1100
  width: 100%;
1101
1101
  box-sizing: border-box;
1102
1102
  }
1103
1103
 
1104
1104
  .rls-field-password {
1105
- --rlc-fieldbox-body-padding: var(--rls-sizing-x3) var(--rls-sizing-x4);
1105
+ --rlc-fieldbox-body-padding: var(--rls-sizing-x4);
1106
1106
  --rlc-action-ripple-dimension: var(--rls-sizing-x12);
1107
1107
  --rlc-action-ripple-position: -6rem;
1108
1108
  position: relative;
@@ -1117,7 +1117,7 @@
1117
1117
  }
1118
1118
 
1119
1119
  .rls-field-readonly {
1120
- --rlc-fieldbox-body-padding: var(--rls-sizing-x3) var(--rls-sizing-x4);
1120
+ --rlc-fieldbox-body-padding: var(--rls-sizing-x4);
1121
1121
  --pvt-component-font-color: var(--rlc-input-font-color);
1122
1122
  position: relative;
1123
1123
  width: 100%;
@@ -1125,7 +1125,7 @@
1125
1125
  }
1126
1126
 
1127
1127
  .rls-field-text {
1128
- --rlc-fieldbox-body-padding: var(--rls-sizing-x3) var(--rls-sizing-x4);
1128
+ --rlc-fieldbox-body-padding: var(--rls-sizing-x4);
1129
1129
  position: relative;
1130
1130
  width: 100%;
1131
1131
  box-sizing: border-box;
@@ -1858,7 +1858,7 @@
1858
1858
  --pvt-control-opacity: 1;
1859
1859
  }
1860
1860
  .rls-field-autocomplete.rls-field-box--selected {
1861
- --pvt-control-width: calc(100% - var(--rlc-fieldlist-action-dimension));
1861
+ --pvt-control-width: calc(100% - var(--rlc-fieldbox-action-dimension));
1862
1862
  }
1863
1863
  .rls-field-autocomplete.rls-field-box--disabled {
1864
1864
  --pvt-control-opacity: 0.5;
@@ -2059,7 +2059,7 @@
2059
2059
  }
2060
2060
 
2061
2061
  .rls-field-date {
2062
- --rlc-fieldbox-body-padding: var(--rls-sizing-x3) var(--rls-sizing-x4);
2062
+ --rlc-fieldbox-body-padding: var(--rls-sizing-x4);
2063
2063
  position: relative;
2064
2064
  width: 100%;
2065
2065
  box-sizing: border-box;
@@ -2089,15 +2089,21 @@
2089
2089
  opacity: 0.5;
2090
2090
  }
2091
2091
  .rls-field-date__action {
2092
+ --rlc-icon-dimesion: calc(var(--rlc-fieldbox-action-dimension) - 2rem);
2093
+ width: var(--rlc-fieldbox-action-dimension);
2094
+ height: var(--rlc-fieldbox-action-dimension);
2092
2095
  color: var(--rls-app-color-600);
2093
- width: var(--rls-sizing-x12);
2094
- height: var(--rls-sizing-x12);
2095
2096
  padding: 0rem;
2096
- background: transparent;
2097
+ outline: none;
2098
+ border-radius: var(--rlc-fieldbox-action-radius);
2099
+ background: var(--rlc-fieldbox-action-background);
2097
2100
  }
2098
2101
  .rls-field-date__action:disabled {
2099
2102
  opacity: 0.5;
2100
2103
  }
2104
+ .rls-field-date__action .rls-icon {
2105
+ margin: 1rem;
2106
+ }
2101
2107
 
2102
2108
  .rls-picker-date-range {
2103
2109
  position: relative;
@@ -2179,7 +2185,7 @@
2179
2185
  }
2180
2186
 
2181
2187
  .rls-field-date-range {
2182
- --rlc-fieldbox-body-padding: var(--rls-sizing-x3) var(--rls-sizing-x4);
2188
+ --rlc-fieldbox-body-padding: var(--rls-sizing-x4);
2183
2189
  position: relative;
2184
2190
  width: 100%;
2185
2191
  box-sizing: border-box;
@@ -2206,12 +2212,20 @@
2206
2212
  opacity: 0.5;
2207
2213
  }
2208
2214
  .rls-field-date-range__action {
2215
+ --rlc-icon-dimesion: calc(var(--rlc-fieldbox-action-dimension) - 2rem);
2216
+ width: var(--rlc-fieldbox-action-dimension);
2217
+ height: var(--rlc-fieldbox-action-dimension);
2209
2218
  color: var(--rls-app-color-600);
2210
- width: var(--rls-sizing-x12);
2211
- height: var(--rls-sizing-x12);
2212
2219
  padding: 0rem;
2213
- margin-left: var(--rls-sizing-x2);
2214
- background: transparent;
2220
+ outline: none;
2221
+ border-radius: var(--rlc-fieldbox-action-radius);
2222
+ background: var(--rlc-fieldbox-action-background);
2223
+ }
2224
+ .rls-field-date-range__action:disabled {
2225
+ opacity: 0.5;
2226
+ }
2227
+ .rls-field-date-range__action .rls-icon {
2228
+ margin: 1rem;
2215
2229
  }
2216
2230
 
2217
2231
  .rls-field-select .rls-field-list__control {
package/dist/es/index.js CHANGED
@@ -2461,10 +2461,11 @@ function useListController(props) {
2461
2461
  changeValueInternal.current = false;
2462
2462
  }, [collection, formControl?.value]);
2463
2463
  const setState = useCallback((state) => {
2464
+ const length = suggestions.length > 6 ? 6 : suggestions.length;
2464
2465
  const _state = state.modalIsVisible
2465
2466
  ? {
2466
2467
  ...state,
2467
- higher: locationListCanTop(contentRef.current, listRef.current, 160)
2468
+ higher: locationListCanTop(contentRef.current, listRef.current, length * 48)
2468
2469
  }
2469
2470
  : state;
2470
2471
  refreshState((state) => ({ ...state, ..._state }));