@elliemae/ds-controlled-form 2.0.0-next.9 → 2.0.0-rc.12

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 (199) hide show
  1. package/cjs/controlled-checkbox/ControlledCheckbox.js +11 -4
  2. package/cjs/controlled-checkbox/config/useValidateProps.js +2 -2
  3. package/cjs/controlled-checkbox/propTypes.js +5 -4
  4. package/cjs/controlled-checkbox/styles.js +84 -48
  5. package/cjs/controlled-checkbox/utils/setMultipleRefs.js +4 -0
  6. package/cjs/controlled-checkbox/utils/styleHelpers.js +13 -7
  7. package/cjs/controlled-date-range-picker/ControlledDateRangePickerDatatestid.js +1 -18
  8. package/cjs/controlled-date-range-picker/config/useControlledDateRangePicker.js +19 -3
  9. package/cjs/controlled-date-range-picker/config/useRangePickerLogic.js +20 -12
  10. package/cjs/controlled-date-range-picker/parts/ControlledDateRangeCalendar.js +7 -0
  11. package/cjs/controlled-date-range-picker/parts/ControlledDateRangeContent.js +29 -8
  12. package/cjs/controlled-date-range-picker/parts/ControlledDateRangeFromDate.js +7 -0
  13. package/cjs/controlled-date-range-picker/parts/ControlledDateRangeToDate.js +7 -0
  14. package/cjs/controlled-date-time-picker/ControlledDateTimePickerCTX.js +12 -1
  15. package/cjs/controlled-date-time-picker/ControlledDateTimePickerDatatestid.js +5 -0
  16. package/cjs/controlled-date-time-picker/config/useControlledDateTimePicker.js +154 -13
  17. package/cjs/controlled-date-time-picker/config/useGetDestructuredValues.js +19 -16
  18. package/cjs/controlled-date-time-picker/parts/ClearButton/ClearButton.js +5 -6
  19. package/cjs/controlled-date-time-picker/parts/ClearButton/useClearButton.js +15 -3
  20. package/cjs/controlled-date-time-picker/parts/ControlledDateTimePickerContent.js +35 -14
  21. package/cjs/controlled-date-time-picker/parts/DateInputs/DDInput.js +15 -11
  22. package/cjs/controlled-date-time-picker/parts/DateInputs/DateInputs.js +8 -4
  23. package/cjs/controlled-date-time-picker/parts/DateInputs/MMInput.js +16 -12
  24. package/cjs/controlled-date-time-picker/parts/DateInputs/YYYYInput.js +15 -11
  25. package/cjs/controlled-date-time-picker/parts/DateInputs/useDateInputs.js +101 -33
  26. package/cjs/controlled-date-time-picker/parts/Pickers/Calendar/Calendar.js +4 -3
  27. package/cjs/controlled-date-time-picker/parts/Pickers/Calendar/CalendarBody.js +10 -7
  28. package/cjs/controlled-date-time-picker/parts/Pickers/Calendar/CalendarContent.js +4 -3
  29. package/cjs/controlled-date-time-picker/parts/Pickers/Calendar/CalendarContext.js +1 -0
  30. package/cjs/controlled-date-time-picker/parts/Pickers/Calendar/CalendarDaysList.js +33 -28
  31. package/cjs/controlled-date-time-picker/parts/Pickers/Calendar/CalendarHead.js +10 -17
  32. package/cjs/controlled-date-time-picker/parts/Pickers/Calendar/CalendarIconTrigger.js +10 -11
  33. package/cjs/controlled-date-time-picker/parts/Pickers/Calendar/CalendarWrapper.js +5 -0
  34. package/cjs/controlled-date-time-picker/parts/Pickers/Calendar/Day.js +20 -10
  35. package/cjs/controlled-date-time-picker/parts/Pickers/Calendar/Styleds.js +326 -117
  36. package/cjs/controlled-date-time-picker/parts/Pickers/Calendar/useConfigCalendarCTX.js +8 -43
  37. package/cjs/controlled-date-time-picker/parts/Pickers/Calendar/useFocusLogic.js +47 -21
  38. package/cjs/controlled-date-time-picker/parts/Pickers/Calendar/useKeyboardHandlers.js +59 -58
  39. package/cjs/controlled-date-time-picker/parts/Pickers/Calendar/usePopperTriggerLogic.js +25 -13
  40. package/cjs/controlled-date-time-picker/parts/Pickers/CalendarWithTimeWheel/CalendarWithTimeWheelContext.js +2 -1
  41. package/cjs/controlled-date-time-picker/parts/Pickers/CalendarWithTimeWheel/CalendarWithTimeWheelIconTrigger.js +10 -11
  42. package/cjs/controlled-date-time-picker/parts/Pickers/CalendarWithTimeWheel/CalendarWithTimeWheelWrapper.js +5 -0
  43. package/cjs/controlled-date-time-picker/parts/Pickers/CalendarWithTimeWheel/Styleds.js +55 -25
  44. package/cjs/controlled-date-time-picker/parts/Pickers/CalendarWithTimeWheel/useConfigCalendarWithTimeWheelCTX.js +18 -7
  45. package/cjs/controlled-date-time-picker/parts/Pickers/TimeWheel/HoursList.js +7 -0
  46. package/cjs/controlled-date-time-picker/parts/Pickers/TimeWheel/MeridiemList.js +1 -0
  47. package/cjs/controlled-date-time-picker/parts/Pickers/TimeWheel/MinutesList.js +7 -0
  48. package/cjs/controlled-date-time-picker/parts/Pickers/TimeWheel/SecondsList.js +11 -7
  49. package/cjs/controlled-date-time-picker/parts/Pickers/TimeWheel/Styleds.js +201 -80
  50. package/cjs/controlled-date-time-picker/parts/Pickers/TimeWheel/TimeWheel.js +4 -3
  51. package/cjs/controlled-date-time-picker/parts/Pickers/TimeWheel/TimeWheelContent.js +4 -3
  52. package/cjs/controlled-date-time-picker/parts/Pickers/TimeWheel/TimeWheelContext.js +2 -1
  53. package/cjs/controlled-date-time-picker/parts/Pickers/TimeWheel/TimeWheelIconTrigger.js +10 -11
  54. package/cjs/controlled-date-time-picker/parts/Pickers/TimeWheel/TimeWheelWrapper.js +5 -0
  55. package/cjs/controlled-date-time-picker/parts/Pickers/TimeWheel/useConfigTimePickerCTX.js +6 -61
  56. package/cjs/controlled-date-time-picker/parts/Pickers/TimeWheel/useCurrentDisplayedWheelsLogic.js +8 -5
  57. package/cjs/controlled-date-time-picker/parts/Pickers/TimeWheel/useKeyboardHandlers.js +64 -141
  58. package/cjs/controlled-date-time-picker/parts/Pickers/TimeWheel/usePopperTriggerLogic.js +11 -7
  59. package/cjs/controlled-date-time-picker/parts/Styleds.js +70 -26
  60. package/cjs/controlled-date-time-picker/parts/TimeInputs/HHInput.js +16 -12
  61. package/cjs/controlled-date-time-picker/parts/TimeInputs/MeridiemInput.js +15 -11
  62. package/cjs/controlled-date-time-picker/parts/TimeInputs/MinutesInput.js +15 -11
  63. package/cjs/controlled-date-time-picker/parts/TimeInputs/TimeInputs.js +8 -5
  64. package/cjs/controlled-date-time-picker/parts/TimeInputs/useTimeInputs.js +95 -173
  65. package/cjs/controlled-date-time-picker/propTypes.js +1 -0
  66. package/cjs/controlled-date-time-picker/utils/constants.js +16 -0
  67. package/cjs/controlled-date-time-picker/utils/dateHelpers.js +34 -16
  68. package/cjs/controlled-date-time-picker/utils/dateTimeHelpers.js +5 -0
  69. package/cjs/controlled-date-time-picker/utils/stringHelpers.js +23 -14
  70. package/cjs/controlled-date-time-picker/utils/timeHelpers.js +2 -1
  71. package/cjs/controlled-toggle/ControlledToggle.js +21 -15
  72. package/cjs/controlled-toggle/styles.js +138 -69
  73. package/cjs/controlled-toggle/utils/addTooltipOnReadOnly.js +2 -2
  74. package/cjs/controlled-toggle/utils/styleHelpers.js +15 -9
  75. package/esm/controlled-checkbox/ControlledCheckbox.js +11 -4
  76. package/esm/controlled-checkbox/config/useValidateProps.js +2 -2
  77. package/esm/controlled-checkbox/propTypes.js +5 -4
  78. package/esm/controlled-checkbox/styles.js +84 -48
  79. package/esm/controlled-checkbox/utils/setMultipleRefs.js +4 -0
  80. package/esm/controlled-checkbox/utils/styleHelpers.js +13 -7
  81. package/esm/controlled-date-range-picker/ControlledDateRangePickerDatatestid.js +1 -18
  82. package/esm/controlled-date-range-picker/config/useControlledDateRangePicker.js +15 -3
  83. package/esm/controlled-date-range-picker/config/useRangePickerLogic.js +20 -12
  84. package/esm/controlled-date-range-picker/parts/ControlledDateRangeCalendar.js +7 -0
  85. package/esm/controlled-date-range-picker/parts/ControlledDateRangeContent.js +28 -8
  86. package/esm/controlled-date-range-picker/parts/ControlledDateRangeFromDate.js +7 -0
  87. package/esm/controlled-date-range-picker/parts/ControlledDateRangeToDate.js +7 -0
  88. package/esm/controlled-date-time-picker/ControlledDateTimePickerCTX.js +12 -1
  89. package/esm/controlled-date-time-picker/ControlledDateTimePickerDatatestid.js +5 -0
  90. package/esm/controlled-date-time-picker/config/useControlledDateTimePicker.js +156 -15
  91. package/esm/controlled-date-time-picker/config/useGetDestructuredValues.js +19 -16
  92. package/esm/controlled-date-time-picker/parts/ClearButton/ClearButton.js +1 -1
  93. package/esm/controlled-date-time-picker/parts/ClearButton/useClearButton.js +15 -3
  94. package/esm/controlled-date-time-picker/parts/ControlledDateTimePickerContent.js +34 -14
  95. package/esm/controlled-date-time-picker/parts/DateInputs/DDInput.js +15 -11
  96. package/esm/controlled-date-time-picker/parts/DateInputs/DateInputs.js +8 -4
  97. package/esm/controlled-date-time-picker/parts/DateInputs/MMInput.js +16 -12
  98. package/esm/controlled-date-time-picker/parts/DateInputs/YYYYInput.js +15 -11
  99. package/esm/controlled-date-time-picker/parts/DateInputs/useDateInputs.js +101 -33
  100. package/esm/controlled-date-time-picker/parts/Pickers/Calendar/Calendar.js +4 -3
  101. package/esm/controlled-date-time-picker/parts/Pickers/Calendar/CalendarBody.js +10 -7
  102. package/esm/controlled-date-time-picker/parts/Pickers/Calendar/CalendarContent.js +4 -3
  103. package/esm/controlled-date-time-picker/parts/Pickers/Calendar/CalendarContext.js +1 -0
  104. package/esm/controlled-date-time-picker/parts/Pickers/Calendar/CalendarDaysList.js +33 -28
  105. package/esm/controlled-date-time-picker/parts/Pickers/Calendar/CalendarHead.js +1 -4
  106. package/esm/controlled-date-time-picker/parts/Pickers/Calendar/CalendarIconTrigger.js +7 -7
  107. package/esm/controlled-date-time-picker/parts/Pickers/Calendar/CalendarWrapper.js +5 -0
  108. package/esm/controlled-date-time-picker/parts/Pickers/Calendar/Day.js +20 -10
  109. package/esm/controlled-date-time-picker/parts/Pickers/Calendar/Styleds.js +321 -113
  110. package/esm/controlled-date-time-picker/parts/Pickers/Calendar/useConfigCalendarCTX.js +8 -43
  111. package/esm/controlled-date-time-picker/parts/Pickers/Calendar/useFocusLogic.js +48 -22
  112. package/esm/controlled-date-time-picker/parts/Pickers/Calendar/useKeyboardHandlers.js +60 -59
  113. package/esm/controlled-date-time-picker/parts/Pickers/Calendar/usePopperTriggerLogic.js +26 -14
  114. package/esm/controlled-date-time-picker/parts/Pickers/CalendarWithTimeWheel/CalendarWithTimeWheelContext.js +2 -1
  115. package/esm/controlled-date-time-picker/parts/Pickers/CalendarWithTimeWheel/CalendarWithTimeWheelIconTrigger.js +7 -7
  116. package/esm/controlled-date-time-picker/parts/Pickers/CalendarWithTimeWheel/CalendarWithTimeWheelWrapper.js +5 -0
  117. package/esm/controlled-date-time-picker/parts/Pickers/CalendarWithTimeWheel/Styleds.js +53 -23
  118. package/esm/controlled-date-time-picker/parts/Pickers/CalendarWithTimeWheel/useConfigCalendarWithTimeWheelCTX.js +18 -7
  119. package/esm/controlled-date-time-picker/parts/Pickers/TimeWheel/HoursList.js +7 -0
  120. package/esm/controlled-date-time-picker/parts/Pickers/TimeWheel/MeridiemList.js +1 -0
  121. package/esm/controlled-date-time-picker/parts/Pickers/TimeWheel/MinutesList.js +7 -0
  122. package/esm/controlled-date-time-picker/parts/Pickers/TimeWheel/SecondsList.js +9 -3
  123. package/esm/controlled-date-time-picker/parts/Pickers/TimeWheel/Styleds.js +196 -76
  124. package/esm/controlled-date-time-picker/parts/Pickers/TimeWheel/TimeWheel.js +4 -3
  125. package/esm/controlled-date-time-picker/parts/Pickers/TimeWheel/TimeWheelContent.js +4 -3
  126. package/esm/controlled-date-time-picker/parts/Pickers/TimeWheel/TimeWheelContext.js +2 -1
  127. package/esm/controlled-date-time-picker/parts/Pickers/TimeWheel/TimeWheelIconTrigger.js +7 -7
  128. package/esm/controlled-date-time-picker/parts/Pickers/TimeWheel/TimeWheelWrapper.js +5 -0
  129. package/esm/controlled-date-time-picker/parts/Pickers/TimeWheel/useConfigTimePickerCTX.js +6 -61
  130. package/esm/controlled-date-time-picker/parts/Pickers/TimeWheel/useCurrentDisplayedWheelsLogic.js +8 -5
  131. package/esm/controlled-date-time-picker/parts/Pickers/TimeWheel/useKeyboardHandlers.js +65 -142
  132. package/esm/controlled-date-time-picker/parts/Pickers/TimeWheel/usePopperTriggerLogic.js +12 -8
  133. package/esm/controlled-date-time-picker/parts/Styleds.js +68 -24
  134. package/esm/controlled-date-time-picker/parts/TimeInputs/HHInput.js +16 -12
  135. package/esm/controlled-date-time-picker/parts/TimeInputs/MeridiemInput.js +15 -11
  136. package/esm/controlled-date-time-picker/parts/TimeInputs/MinutesInput.js +15 -11
  137. package/esm/controlled-date-time-picker/parts/TimeInputs/TimeInputs.js +8 -5
  138. package/esm/controlled-date-time-picker/parts/TimeInputs/useTimeInputs.js +96 -170
  139. package/esm/controlled-date-time-picker/propTypes.js +1 -0
  140. package/esm/controlled-date-time-picker/utils/constants.js +10 -1
  141. package/esm/controlled-date-time-picker/utils/dateHelpers.js +34 -17
  142. package/esm/controlled-date-time-picker/utils/dateTimeHelpers.js +5 -0
  143. package/esm/controlled-date-time-picker/utils/stringHelpers.js +23 -14
  144. package/esm/controlled-date-time-picker/utils/timeHelpers.js +2 -1
  145. package/esm/controlled-toggle/ControlledToggle.js +21 -15
  146. package/esm/controlled-toggle/styles.js +138 -69
  147. package/esm/controlled-toggle/utils/addTooltipOnReadOnly.js +1 -1
  148. package/esm/controlled-toggle/utils/styleHelpers.js +15 -9
  149. package/package.json +21 -12
  150. package/types/controlled-checkbox/ControlledCheckbox.d.ts +60 -9
  151. package/types/controlled-checkbox/config/useValidateProps.d.ts +1 -1
  152. package/types/controlled-checkbox/index.d.d.ts +1 -0
  153. package/types/controlled-checkbox/propTypes.d.ts +55 -8
  154. package/types/controlled-checkbox/styles.d.ts +4 -4
  155. package/types/controlled-checkbox/tests/DSControlledCheckbox.keyboard.test.d.ts +1 -0
  156. package/types/controlled-checkbox/tests/DSControlledCheckbox.test.d.ts +1 -0
  157. package/types/controlled-checkbox/tests/DSControllledCheckbox.events.test.d.ts +1 -0
  158. package/types/controlled-date-range-picker/ControlledDateRangePicker.d.ts +12 -2
  159. package/types/controlled-date-range-picker/ControlledDateRangePickerDatatestid.d.ts +1 -18
  160. package/types/controlled-date-range-picker/propTypes.d.ts +7 -1
  161. package/types/controlled-date-range-picker/tests/date-range-picker.auto-advance.test.d.ts +1 -0
  162. package/types/controlled-date-range-picker/tests/date-range-picker.classes.test.d.ts +1 -0
  163. package/types/controlled-date-range-picker/tests/date-range-picker.clear-button.test.d.ts +1 -0
  164. package/types/controlled-date-range-picker/tests/date-range-picker.keyboard-focus.test.d.ts +1 -0
  165. package/types/controlled-date-range-picker/tests/date-range-picker.manual-delete-values.test.d.ts +1 -0
  166. package/types/controlled-date-range-picker/tests/date-range-picker.types-dom.test.d.ts +1 -0
  167. package/types/controlled-date-time-picker/ControlledDateTimePicker.d.ts +81 -21
  168. package/types/controlled-date-time-picker/ControlledDateTimePickerDatatestid.d.ts +3 -0
  169. package/types/controlled-date-time-picker/parts/DateInputs/DDInput.d.ts +2 -1
  170. package/types/controlled-date-time-picker/parts/DateInputs/MMInput.d.ts +2 -1
  171. package/types/controlled-date-time-picker/parts/DateInputs/YYYYInput.d.ts +2 -1
  172. package/types/controlled-date-time-picker/parts/Pickers/Calendar/CalendarContext.d.ts +2 -1
  173. package/types/controlled-date-time-picker/parts/Pickers/Calendar/Styleds.d.ts +10 -70
  174. package/types/controlled-date-time-picker/parts/Pickers/Calendar/useFocusLogic.d.ts +1 -3
  175. package/types/controlled-date-time-picker/parts/Pickers/Calendar/useKeyboardHandlers.d.ts +2 -17
  176. package/types/controlled-date-time-picker/parts/Pickers/Calendar/usePopperTriggerLogic.d.ts +3 -6
  177. package/types/controlled-date-time-picker/parts/Pickers/CalendarWithTimeWheel/CalendarWithTimeWheelContext.d.ts +1 -0
  178. package/types/controlled-date-time-picker/parts/Pickers/CalendarWithTimeWheel/Styleds.d.ts +4 -24
  179. package/types/controlled-date-time-picker/parts/Pickers/TimeWheel/Styleds.d.ts +10 -70
  180. package/types/controlled-date-time-picker/parts/Pickers/TimeWheel/TimeWheelContext.d.ts +1 -0
  181. package/types/controlled-date-time-picker/parts/Pickers/TimeWheel/useKeyboardHandlers.d.ts +3 -12
  182. package/types/controlled-date-time-picker/parts/Pickers/TimeWheel/usePopperTriggerLogic.d.ts +1 -10
  183. package/types/controlled-date-time-picker/parts/Styleds.d.ts +10 -30
  184. package/types/controlled-date-time-picker/parts/TimeInputs/HHInput.d.ts +2 -1
  185. package/types/controlled-date-time-picker/parts/TimeInputs/MeridiemInput.d.ts +2 -1
  186. package/types/controlled-date-time-picker/parts/TimeInputs/MinutesInput.d.ts +2 -1
  187. package/types/controlled-date-time-picker/propTypes.d.ts +76 -20
  188. package/types/controlled-date-time-picker/tests/date-time-picker.keyboard.data-entry-typing.test.d.ts +1 -0
  189. package/types/controlled-date-time-picker/tests/date-time-picker.keyboard.fill-with-now.test.d.ts +1 -0
  190. package/types/controlled-date-time-picker/tests/date-time-picker.keyboard.regressive-backspace.test.d.ts +1 -0
  191. package/types/controlled-date-time-picker/tests/date-time-picker.keyboard.shortcut-clear.test.d.ts +1 -0
  192. package/types/controlled-date-time-picker/utils/constants.d.ts +9 -0
  193. package/types/controlled-date-time-picker/utils/dateHelpers.d.ts +1 -0
  194. package/types/controlled-toggle/ControlledToggle.d.ts +78 -13
  195. package/types/controlled-toggle/propTypes.d.ts +73 -12
  196. package/types/controlled-toggle/styles.d.ts +7 -7
  197. package/cjs/controlled-date-time-picker/parts/TimeInputs/SSInput.js +0 -53
  198. package/esm/controlled-date-time-picker/parts/TimeInputs/SSInput.js +0 -45
  199. package/types/controlled-date-time-picker/parts/TimeInputs/SSInput.d.ts +0 -13
@@ -1,3 +1,8 @@
1
+ import 'core-js/modules/esnext.async-iterator.filter.js';
2
+ import 'core-js/modules/esnext.iterator.constructor.js';
3
+ import 'core-js/modules/esnext.iterator.filter.js';
4
+ import 'core-js/modules/esnext.async-iterator.for-each.js';
5
+ import 'core-js/modules/esnext.iterator.for-each.js';
1
6
  import _defineProperty from '@babel/runtime/helpers/esm/defineProperty';
2
7
  import _jsx from '@babel/runtime/helpers/esm/jsx';
3
8
  import 'core-js/modules/web.dom-collections.iterator.js';
@@ -14,20 +19,21 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
14
19
 
15
20
  function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
16
21
 
17
- const DSControlledToggle = ({
18
- labelOn,
19
- labelOff,
20
- name,
21
- value,
22
- checked,
23
- onChange,
24
- size,
25
- readOnly,
26
- active,
27
- disabled,
28
- containerProps,
29
- id
30
- }) => {
22
+ const DSControlledToggle = _ref => {
23
+ let {
24
+ labelOn,
25
+ labelOff,
26
+ name,
27
+ value,
28
+ checked,
29
+ onChange,
30
+ size,
31
+ readOnly,
32
+ active,
33
+ disabled,
34
+ containerProps,
35
+ id
36
+ } = _ref;
31
37
  const [isLongerTextRendering, setIsLongerTextRendering] = useState(false);
32
38
  const [width, setWidth] = useState(0);
33
39
  const labelTextRef = useRef(null);
@@ -85,7 +91,7 @@ const DSControlledToggle = ({
85
91
  active: active,
86
92
  disabled: disabled,
87
93
  htmlFor: id ? undefined : instanceUID,
88
- as: id ? 'span' : 'label'
94
+ as: id ? 'p' : 'label'
89
95
  }, void 0, /*#__PURE__*/_jsx(StyledCircle, {
90
96
  checked: checked,
91
97
  size: size,
@@ -3,87 +3,156 @@ import { containerHeight, borderRadius, margin, labelHeight, handleBorderColor,
3
3
 
4
4
  const StyledContainer = /*#__PURE__*/styled.div.withConfig({
5
5
  componentId: "sc-v733m4-0"
6
- })(["display:inline-flex;width:fit-content;justify-content:center;align-items:center;height:", ";border-radius:", ";outline:none;position:relative;border:2px solid transparent;&:hover,&:focus-within{border:2px solid ", ";&:after{content:'';height:calc(100% + 4px);width:calc(100% + 4px);border:1px solid ", ";border-radius:20px;position:absolute;}}"], ({
7
- size
8
- }) => containerHeight[size], ({
9
- size
10
- }) => borderRadius[size], ({
11
- theme
12
- }) => theme.colors.brand[300], ({
13
- theme
14
- }) => theme.colors.brand[600]);
6
+ })(["display:inline-flex;width:fit-content;justify-content:center;align-items:center;height:", ";border-radius:", ";outline:none;position:relative;border:2px solid transparent;&:hover,&:focus-within{border:2px solid ", ";&:after{content:'';height:calc(100% + 4px);width:calc(100% + 4px);border:1px solid ", ";border-radius:20px;position:absolute;}}"], _ref => {
7
+ let {
8
+ size
9
+ } = _ref;
10
+ return containerHeight[size];
11
+ }, _ref2 => {
12
+ let {
13
+ size
14
+ } = _ref2;
15
+ return borderRadius[size];
16
+ }, _ref3 => {
17
+ let {
18
+ theme
19
+ } = _ref3;
20
+ return theme.colors.brand[300];
21
+ }, _ref4 => {
22
+ let {
23
+ theme
24
+ } = _ref4;
25
+ return theme.colors.brand[600];
26
+ });
15
27
  const StyledLabel = /*#__PURE__*/styled.div.withConfig({
16
28
  componentId: "sc-v733m4-1"
17
- })(["width:", ";height:", ";z-index:2;outline:none;border-radius:", ";"], ({
18
- width,
19
- size
20
- }) => "calc(".concat(width, "px + ").concat(margin[size], ")"), ({
21
- size
22
- }) => labelHeight[size], ({
23
- size
24
- }) => labelHeight[size]);
29
+ })(["width:", ";height:", ";z-index:2;outline:none;border-radius:", ";"], _ref5 => {
30
+ let {
31
+ width,
32
+ size
33
+ } = _ref5;
34
+ return "calc(".concat(width, "px + ").concat(margin[size], ")");
35
+ }, _ref6 => {
36
+ let {
37
+ size
38
+ } = _ref6;
39
+ return labelHeight[size];
40
+ }, _ref7 => {
41
+ let {
42
+ size
43
+ } = _ref7;
44
+ return labelHeight[size];
45
+ });
25
46
  const StyledVisibleContent = /*#__PURE__*/styled.label.withConfig({
26
47
  componentId: "sc-v733m4-2"
27
- })(["display:flex;margin:0;padding:0;align-items:center;height:100%;flex-direction:", ";border-radius:", ";border:", ";transition:background-color 0.2s;background-color:", ";&:hover{cursor:", ";}"], ({
28
- checked
29
- }) => checked ? 'row-reverse' : 'row', ({
30
- size
31
- }) => "calc(".concat(labelHeight[size], " - 4px)"), ({
32
- theme,
33
- size,
34
- checked,
35
- disabled,
36
- readOnly,
37
- active
38
- }) => size === 's' ? "1px solid ".concat(handleBorderColor(checked, disabled, readOnly, active, theme)) : "\n 2px solid ".concat(handleBorderColor(checked, disabled, readOnly, active, theme), "\n "), ({
39
- theme,
40
- checked,
41
- disabled,
42
- readOnly,
43
- active
44
- }) => handleBackgroundColor(checked, disabled, readOnly, active, theme), ({
45
- disabled,
46
- readOnly
47
- }) => handleCursors(disabled, readOnly));
48
+ })(["display:flex;margin:0;padding:0;align-items:center;height:100%;flex-direction:", ";border-radius:", ";border:", ";transition:background-color 0.2s;background-color:", ";&:hover{cursor:", ";}"], _ref8 => {
49
+ let {
50
+ checked
51
+ } = _ref8;
52
+ return checked ? 'row-reverse' : 'row';
53
+ }, _ref9 => {
54
+ let {
55
+ size
56
+ } = _ref9;
57
+ return "calc(".concat(labelHeight[size], " - 4px)");
58
+ }, _ref10 => {
59
+ let {
60
+ theme,
61
+ size,
62
+ checked,
63
+ disabled,
64
+ readOnly,
65
+ active
66
+ } = _ref10;
67
+ return size === 's' ? "1px solid ".concat(handleBorderColor(checked, disabled, readOnly, active, theme)) : "\n 2px solid ".concat(handleBorderColor(checked, disabled, readOnly, active, theme), "\n ");
68
+ }, _ref11 => {
69
+ let {
70
+ theme,
71
+ checked,
72
+ disabled,
73
+ readOnly,
74
+ active
75
+ } = _ref11;
76
+ return handleBackgroundColor(checked, disabled, readOnly, active, theme);
77
+ }, _ref12 => {
78
+ let {
79
+ disabled,
80
+ readOnly
81
+ } = _ref12;
82
+ return handleCursors(disabled, readOnly);
83
+ });
48
84
  const StyledCircle = /*#__PURE__*/styled.div.withConfig({
49
85
  componentId: "sc-v733m4-3"
50
- })(["height:", ";width:", ";border-radius:50%;background-color:", ";"], ({
51
- size
52
- }) => circleValues[size], ({
53
- size
54
- }) => circleValues[size], ({
55
- theme,
56
- readOnly
57
- }) => readOnly ? theme.colors.neutral[100] : theme.colors.neutral['000']);
86
+ })(["height:", ";width:", ";border-radius:50%;background-color:", ";"], _ref13 => {
87
+ let {
88
+ size
89
+ } = _ref13;
90
+ return circleValues[size];
91
+ }, _ref14 => {
92
+ let {
93
+ size
94
+ } = _ref14;
95
+ return circleValues[size];
96
+ }, _ref15 => {
97
+ let {
98
+ theme,
99
+ readOnly
100
+ } = _ref15;
101
+ return readOnly ? theme.colors.neutral[100] : theme.colors.neutral['000'];
102
+ });
58
103
  const StyledText = /*#__PURE__*/styled.div.withConfig({
59
104
  componentId: "sc-v733m4-4"
60
- })(["display:flex;flex-grow:1;line-height:1;margin-bottom:-0.12rem;align-items:center;justify-content:", ";font-size:", ";font-weight:", ";color:", ";", " ", ""], ({
61
- isLongerTextRendering
62
- }) => isLongerTextRendering ? 'flex-start' : 'center', ({
63
- theme,
64
- size
65
- }) => handleFontSize(size, theme), ({
66
- theme
67
- }) => theme.fontWeights.semibold, ({
68
- theme,
69
- disabled
70
- }) => disabled ? '#5c6574' : theme.colors.neutral['000'], ({
71
- isLongerTextRendering,
72
- checked
73
- }) => isLongerTextRendering && checked ? "margin-left: 6px;" : undefined, ({
74
- isLongerTextRendering,
75
- checked
76
- }) => isLongerTextRendering && !checked ? "margin-left: 4px;" : undefined);
105
+ })(["display:flex;flex-grow:1;line-height:1;margin-bottom:-0.12rem;align-items:center;justify-content:", ";font-size:", ";font-weight:", ";color:", ";", " ", ""], _ref16 => {
106
+ let {
107
+ isLongerTextRendering
108
+ } = _ref16;
109
+ return isLongerTextRendering ? 'flex-start' : 'center';
110
+ }, _ref17 => {
111
+ let {
112
+ theme,
113
+ size
114
+ } = _ref17;
115
+ return handleFontSize(size, theme);
116
+ }, _ref18 => {
117
+ let {
118
+ theme
119
+ } = _ref18;
120
+ return theme.fontWeights.semibold;
121
+ }, _ref19 => {
122
+ let {
123
+ theme,
124
+ disabled
125
+ } = _ref19;
126
+ return disabled ? '#5c6574' : theme.colors.neutral['000'];
127
+ }, _ref20 => {
128
+ let {
129
+ isLongerTextRendering,
130
+ checked
131
+ } = _ref20;
132
+ return isLongerTextRendering && checked ? "margin-left: 6px;" : undefined;
133
+ }, _ref21 => {
134
+ let {
135
+ isLongerTextRendering,
136
+ checked
137
+ } = _ref21;
138
+ return isLongerTextRendering && !checked ? "margin-left: 4px;" : undefined;
139
+ });
77
140
  const StyledInput = /*#__PURE__*/styled.input.withConfig({
78
141
  componentId: "sc-v733m4-5"
79
142
  })(["position:absolute;opacity:0;z-index:20;height:100%;width:100%;cursor:pointer;"]);
80
143
  const SetLabelWidth = /*#__PURE__*/styled.div.withConfig({
81
144
  componentId: "sc-v733m4-6"
82
- })(["font-size:", ";font-weight:", ";width:auto;position:absolute;white-space:nowrap;visibility:hidden;"], ({
83
- theme,
84
- size
85
- }) => handleFontSize(size, theme), ({
86
- theme
87
- }) => theme.fontWeights.semibold);
145
+ })(["font-size:", ";font-weight:", ";width:auto;position:absolute;white-space:nowrap;visibility:hidden;"], _ref22 => {
146
+ let {
147
+ theme,
148
+ size
149
+ } = _ref22;
150
+ return handleFontSize(size, theme);
151
+ }, _ref23 => {
152
+ let {
153
+ theme
154
+ } = _ref23;
155
+ return theme.fontWeights.semibold;
156
+ });
88
157
 
89
158
  export { SetLabelWidth, StyledCircle, StyledContainer, StyledInput, StyledLabel, StyledText, StyledVisibleContent };
@@ -1,6 +1,6 @@
1
1
  import _jsx from '@babel/runtime/helpers/esm/jsx';
2
2
  import 'react';
3
- import { DSTooltipV2 } from '@elliemae/ds-basic/Tooltip';
3
+ import { DSTooltipV2 } from '@elliemae/ds-tooltip';
4
4
 
5
5
  const addTooltipOnReadOnly = (Component, readOnly) => {
6
6
  if (readOnly) return /*#__PURE__*/_jsx(DSTooltipV2, {
@@ -23,9 +23,11 @@ const borderRadius = {
23
23
  m: '20px',
24
24
  l: '22px'
25
25
  };
26
- const handleFontSize = (size, {
27
- fontSizes
28
- }) => {
26
+ const handleFontSize = (size, _ref) => {
27
+ let {
28
+ fontSizes
29
+ } = _ref;
30
+
29
31
  switch (size) {
30
32
  case 's':
31
33
  return fontSizes.microText[200];
@@ -40,9 +42,11 @@ const handleFontSize = (size, {
40
42
  return '15px';
41
43
  }
42
44
  };
43
- const handleBackgroundColor = (checked, disabled, readOnly, active, {
44
- colors
45
- }) => {
45
+ const handleBackgroundColor = (checked, disabled, readOnly, active, _ref2) => {
46
+ let {
47
+ colors
48
+ } = _ref2;
49
+
46
50
  if (disabled) {
47
51
  return colors.neutral[100];
48
52
  } else if (readOnly) {
@@ -57,9 +61,11 @@ const handleBackgroundColor = (checked, disabled, readOnly, active, {
57
61
  return colors.neutral[600];
58
62
  }
59
63
  };
60
- const handleBorderColor = (checked, disabled, readOnly, active, {
61
- colors
62
- }) => {
64
+ const handleBorderColor = (checked, disabled, readOnly, active, _ref3) => {
65
+ let {
66
+ colors
67
+ } = _ref3;
68
+
63
69
  if (disabled) {
64
70
  return colors.neutral[100];
65
71
  } else if (readOnly) {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@elliemae/ds-controlled-form",
3
- "version": "2.0.0-next.9",
3
+ "version": "2.0.0-rc.12",
4
4
  "license": "MIT",
5
5
  "description": "ICE MT - Dimsum - Controlled Form Controllers",
6
6
  "module": "./esm/index.js",
@@ -91,10 +91,6 @@
91
91
  "import": "./esm/controlled-date-time-picker/parts/TimeInputs/TimeInputs.js",
92
92
  "require": "./cjs/controlled-date-time-picker/parts/TimeInputs/TimeInputs.js"
93
93
  },
94
- "./controlled-date-time-picker/parts/TimeInputs/SSInput": {
95
- "import": "./esm/controlled-date-time-picker/parts/TimeInputs/SSInput.js",
96
- "require": "./cjs/controlled-date-time-picker/parts/TimeInputs/SSInput.js"
97
- },
98
94
  "./controlled-date-time-picker/parts/TimeInputs/MinutesInput": {
99
95
  "import": "./esm/controlled-date-time-picker/parts/TimeInputs/MinutesInput.js",
100
96
  "require": "./cjs/controlled-date-time-picker/parts/TimeInputs/MinutesInput.js"
@@ -456,21 +452,34 @@
456
452
  "build": "node ../../scripts/build/build.js"
457
453
  },
458
454
  "dependencies": {
459
- "@elliemae/ds-basic": "2.0.0-next.9",
460
- "@elliemae/ds-button": "2.0.0-next.9",
461
- "@elliemae/ds-icons": "2.0.0-next.9",
455
+ "@elliemae/ds-button": "2.0.0-rc.12",
456
+ "@elliemae/ds-form-layout-blocks": "2.0.0-rc.12",
457
+ "@elliemae/ds-grid": "2.0.0-rc.12",
458
+ "@elliemae/ds-icon": "2.0.0-rc.12",
459
+ "@elliemae/ds-icons": "2.0.0-rc.12",
460
+ "@elliemae/ds-props-helpers": "2.0.0-rc.12",
461
+ "@elliemae/ds-system": "2.0.0-rc.12",
462
+ "@elliemae/ds-tooltip": "2.0.0-rc.12",
463
+ "@elliemae/ds-truncated-tooltip-text": "2.0.0-rc.12",
462
464
  "prop-types": "~15.7.2",
463
- "react-desc": "^4.1.3",
464
- "react-popper": "~2.2.5"
465
+ "react-desc": "~4.1.3",
466
+ "react-popper": "~2.2.5",
467
+ "uid": "~2.0.0"
465
468
  },
466
469
  "devDependencies": {
467
- "styled-components": "~5.3.1",
470
+ "@elliemae/pui-theme": "~2.2.5",
471
+ "@testing-library/dom": "~8.11.1",
472
+ "@testing-library/jest-dom": "~5.15.0",
473
+ "@testing-library/react": "~12.1.2",
474
+ "@testing-library/user-event": "~13.5.0",
475
+ "styled-components": "~5.3.3",
468
476
  "styled-system": "~5.1.5"
469
477
  },
470
478
  "peerDependencies": {
479
+ "@elliemae/pui-theme": "^2.2.5",
471
480
  "react": "^17.0.2",
472
481
  "react-dom": "^17.0.2",
473
- "styled-components": "^5.3.1",
482
+ "styled-components": "^5.3.3",
474
483
  "styled-system": "^5.1.5"
475
484
  },
476
485
  "publishConfig": {
@@ -1,20 +1,71 @@
1
+ /// <reference path="../../../../../shared/typings/react-desc.d.ts" />
1
2
  /// <reference types="react" />
2
3
  import type { DSControlledCheckboxPropsT } from './index.d';
3
4
  declare const DSControlledCheckbox: {
4
5
  (props: DSControlledCheckboxPropsT): JSX.Element;
5
6
  propTypes: {
6
7
  checked: any;
7
- value: any;
8
+ value: {
9
+ defaultValue<T = unknown>(arg: T): {
10
+ deprecated: import("react-desc").PropTypesDescValidator;
11
+ };
12
+ isRequired: import("react-desc").PropTypesDescValidator;
13
+ };
8
14
  name: any;
9
- label: any;
15
+ label: {
16
+ defaultValue<T = unknown>(arg: T): {
17
+ deprecated: import("react-desc").PropTypesDescValidator;
18
+ };
19
+ isRequired: import("react-desc").PropTypesDescValidator;
20
+ };
10
21
  id: any;
11
- readOnly: any;
12
- hasError: any;
13
- disabled: any;
14
- ariaControls: any;
15
- ariaLabel: any;
16
- innerRef: any;
22
+ readOnly: {
23
+ defaultValue<T = unknown>(arg: T): {
24
+ deprecated: import("react-desc").PropTypesDescValidator;
25
+ };
26
+ isRequired: import("react-desc").PropTypesDescValidator;
27
+ };
28
+ hasError: {
29
+ defaultValue<T = unknown>(arg: T): {
30
+ deprecated: import("react-desc").PropTypesDescValidator;
31
+ };
32
+ isRequired: import("react-desc").PropTypesDescValidator;
33
+ };
34
+ disabled: {
35
+ defaultValue<T = unknown>(arg: T): {
36
+ deprecated: import("react-desc").PropTypesDescValidator;
37
+ };
38
+ isRequired: import("react-desc").PropTypesDescValidator;
39
+ };
40
+ ariaControls: {
41
+ defaultValue<T = unknown>(arg: T): {
42
+ deprecated: import("react-desc").PropTypesDescValidator;
43
+ };
44
+ isRequired: import("react-desc").PropTypesDescValidator;
45
+ };
46
+ ariaLabel: {
47
+ defaultValue<T = unknown>(arg: T): {
48
+ deprecated: import("react-desc").PropTypesDescValidator;
49
+ };
50
+ isRequired: import("react-desc").PropTypesDescValidator;
51
+ };
52
+ innerRef: {
53
+ defaultValue<T = unknown>(arg: T): {
54
+ deprecated: import("react-desc").PropTypesDescValidator;
55
+ };
56
+ isRequired: import("react-desc").PropTypesDescValidator;
57
+ };
58
+ autoFocus: {
59
+ defaultValue<T = unknown>(arg: T): {
60
+ deprecated: import("react-desc").PropTypesDescValidator;
61
+ };
62
+ isRequired: import("react-desc").PropTypesDescValidator;
63
+ };
17
64
  };
18
65
  };
19
- declare const DSControlledCheckboxWithSchema: any;
66
+ declare const DSControlledCheckboxWithSchema: {
67
+ (props?: DSControlledCheckboxPropsT | undefined): JSX.Element;
68
+ propTypes: unknown;
69
+ toTypescript: () => import("react-desc").TypescriptSchema;
70
+ };
20
71
  export { DSControlledCheckbox, DSControlledCheckboxWithSchema };
@@ -1,2 +1,2 @@
1
1
  import { DSControlledCheckboxPropsT } from '../index.d';
2
- export declare const useValidateProps: (props: DSControlledCheckboxPropsT, schema: unknown) => void;
2
+ export declare const useValidateProps: (props: DSControlledCheckboxPropsT, propTypes: unknown) => void;
@@ -11,6 +11,7 @@ export interface DSControlledCheckboxPropsT {
11
11
  hasError?: boolean;
12
12
  disabled?: boolean;
13
13
  innerRef?: (ref: HTMLInputElement) => void;
14
+ autoFocus?: boolean;
14
15
  }
15
16
  export interface StyledCheckBoxT {
16
17
  checked: boolean | 'mixed';
@@ -1,13 +1,60 @@
1
+ /// <reference path="../../../../../shared/typings/react-desc.d.ts" />
1
2
  export declare const propTypes: {
2
3
  checked: any;
3
- value: any;
4
+ value: {
5
+ defaultValue<T = unknown>(arg: T): {
6
+ deprecated: import("react-desc").PropTypesDescValidator;
7
+ };
8
+ isRequired: import("react-desc").PropTypesDescValidator;
9
+ };
4
10
  name: any;
5
- label: any;
11
+ label: {
12
+ defaultValue<T = unknown>(arg: T): {
13
+ deprecated: import("react-desc").PropTypesDescValidator;
14
+ };
15
+ isRequired: import("react-desc").PropTypesDescValidator;
16
+ };
6
17
  id: any;
7
- readOnly: any;
8
- hasError: any;
9
- disabled: any;
10
- ariaControls: any;
11
- ariaLabel: any;
12
- innerRef: any;
18
+ readOnly: {
19
+ defaultValue<T = unknown>(arg: T): {
20
+ deprecated: import("react-desc").PropTypesDescValidator;
21
+ };
22
+ isRequired: import("react-desc").PropTypesDescValidator;
23
+ };
24
+ hasError: {
25
+ defaultValue<T = unknown>(arg: T): {
26
+ deprecated: import("react-desc").PropTypesDescValidator;
27
+ };
28
+ isRequired: import("react-desc").PropTypesDescValidator;
29
+ };
30
+ disabled: {
31
+ defaultValue<T = unknown>(arg: T): {
32
+ deprecated: import("react-desc").PropTypesDescValidator;
33
+ };
34
+ isRequired: import("react-desc").PropTypesDescValidator;
35
+ };
36
+ ariaControls: {
37
+ defaultValue<T = unknown>(arg: T): {
38
+ deprecated: import("react-desc").PropTypesDescValidator;
39
+ };
40
+ isRequired: import("react-desc").PropTypesDescValidator;
41
+ };
42
+ ariaLabel: {
43
+ defaultValue<T = unknown>(arg: T): {
44
+ deprecated: import("react-desc").PropTypesDescValidator;
45
+ };
46
+ isRequired: import("react-desc").PropTypesDescValidator;
47
+ };
48
+ innerRef: {
49
+ defaultValue<T = unknown>(arg: T): {
50
+ deprecated: import("react-desc").PropTypesDescValidator;
51
+ };
52
+ isRequired: import("react-desc").PropTypesDescValidator;
53
+ };
54
+ autoFocus: {
55
+ defaultValue<T = unknown>(arg: T): {
56
+ deprecated: import("react-desc").PropTypesDescValidator;
57
+ };
58
+ isRequired: import("react-desc").PropTypesDescValidator;
59
+ };
13
60
  };
@@ -1,5 +1,5 @@
1
1
  import { StyledCheckBoxT, StyledLabelT } from './index.d';
2
- export declare const StyledContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
3
- export declare const StyledCheckBox: import("styled-components").StyledComponent<"span", any, StyledCheckBoxT, never>;
4
- export declare const StyledInput: import("styled-components").StyledComponent<"input", any, {}, never>;
5
- export declare const StyledLabel: import("styled-components").StyledComponent<"label", any, StyledLabelT, never>;
2
+ export declare const StyledContainer: import("styled-components").StyledComponent<"div", import("styled-components").DefaultTheme, {}, never>;
3
+ export declare const StyledCheckBox: import("styled-components").StyledComponent<"span", import("styled-components").DefaultTheme, StyledCheckBoxT, never>;
4
+ export declare const StyledInput: import("styled-components").StyledComponent<"input", import("styled-components").DefaultTheme, {}, never>;
5
+ export declare const StyledLabel: import("styled-components").StyledComponent<"label", import("styled-components").DefaultTheme, StyledLabelT, never>;
@@ -1,10 +1,20 @@
1
+ /// <reference path="../../../../../shared/typings/react-desc.d.ts" />
1
2
  /// <reference types="react" />
2
3
  import type { DateRangePickerPropsT } from './index.d';
3
4
  declare const DSControlledDateRangePicker: {
4
5
  (props: DateRangePickerPropsT): JSX.Element;
5
6
  propTypes: {
6
- type: any;
7
+ type: {
8
+ defaultValue<T = unknown>(arg: T): {
9
+ deprecated: import("react-desc").PropTypesDescValidator;
10
+ };
11
+ isRequired: import("react-desc").PropTypesDescValidator;
12
+ };
7
13
  };
8
14
  };
9
- declare const DSControlledDateRangePickerWithSchema: any;
15
+ declare const DSControlledDateRangePickerWithSchema: {
16
+ (props?: DateRangePickerPropsT | undefined): JSX.Element;
17
+ propTypes: unknown;
18
+ toTypescript: () => import("react-desc").TypescriptSchema;
19
+ };
10
20
  export { DSControlledDateRangePickerWithSchema, DSControlledDateRangePicker };
@@ -1,20 +1,3 @@
1
1
  export declare const ControlledDateRangePickerDatatestid: {
2
- FROM_DATE_INPUTS: {
3
- MONTH: string;
4
- DAY: string;
5
- YEAR: string;
6
- };
7
- TO_DATE_INPUTS: {
8
- MONTH: string;
9
- DAY: string;
10
- YEAR: string;
11
- };
12
- PICKER_ICON: string;
13
- CALENDAR: {
14
- DAY: string;
15
- FROM_DAY: string;
16
- TO_DAY: string;
17
- };
18
- FROM_CLEAR_BUTTON: string;
19
- TO_CLEAR_BUTTON: string;
2
+ WRAPPER: string;
20
3
  };
@@ -1,3 +1,9 @@
1
+ /// <reference path="../../../../../shared/typings/react-desc.d.ts" />
1
2
  export declare const propTypes: {
2
- type: any;
3
+ type: {
4
+ defaultValue<T = unknown>(arg: T): {
5
+ deprecated: import("react-desc").PropTypesDescValidator;
6
+ };
7
+ isRequired: import("react-desc").PropTypesDescValidator;
8
+ };
3
9
  };