@elliemae/ds-controlled-form 2.4.6 → 2.4.9

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.
@@ -18,7 +18,6 @@ const defaultProps = {
18
18
  startPlacementPreference: 'bottom-start',
19
19
  placementOrderPreference: ['bottom-start', 'bottom-end'],
20
20
  noOptionsMessage: 'No Matches Found',
21
- filteredOptions: [],
22
21
  isNonClearable: false // override in useCombobox to avoid ref duplications when more than one cb is used
23
22
 
24
23
  };
@@ -99,7 +99,7 @@ const useKeyboardNavigation = () => {
99
99
  setMenuState(false, 'selectOption', e);
100
100
  }
101
101
 
102
- onChange(listHelper.getSuggestedValueOnChange(currentItem, selectedValues), currentItem, e);
102
+ onChange(listHelper.getSuggestedValueOnChange(currentItem, selectedValues, isNonClearable), currentItem, e);
103
103
  }
104
104
  }
105
105
 
@@ -38,39 +38,44 @@ const StyledMin4DigitsInput = /*#__PURE__*/styled__default["default"](ResettedIn
38
38
  });
39
39
  const StyledInputsWrapperGrid = /*#__PURE__*/styled__default["default"](dsGrid.Grid).withConfig({
40
40
  componentId: "sc-2wbvze-5"
41
- })(["width:max-content;align-items:center;", " border-color:", ";border-radius:2px;padding-left:", ";padding-right:", ";position:relative;", ""], _ref3 => {
41
+ })(["width:max-content;align-items:center;background:", ";", " border-color:", ";border-radius:2px;padding-left:", ";padding-right:", ";position:relative;", ""], _ref3 => {
42
42
  let {
43
- isControllerOnly
43
+ theme
44
44
  } = _ref3;
45
+ return theme.colors.neutral['000'];
46
+ }, _ref4 => {
47
+ let {
48
+ isControllerOnly
49
+ } = _ref4;
45
50
  return isControllerOnly ? `` : `
46
51
  height: 28px;
47
52
  border-width: 1px;
48
53
  border-style: solid;
49
54
  `;
50
- }, _ref4 => {
55
+ }, _ref5 => {
51
56
  let {
52
57
  theme,
53
58
  hasError,
54
59
  disabled
55
- } = _ref4;
60
+ } = _ref5;
56
61
  if (hasError) return theme.colors.danger[900];
57
62
  if (disabled) return theme.colors.neutral[400];
58
63
  return theme.colors.neutral[200];
59
- }, _ref5 => {
64
+ }, _ref6 => {
60
65
  let {
61
66
  justPicker
62
- } = _ref5;
67
+ } = _ref6;
63
68
  return justPicker ? '0' : '2px';
64
- }, _ref6 => {
69
+ }, _ref7 => {
65
70
  let {
66
71
  withAnyPicker
67
- } = _ref6;
72
+ } = _ref7;
68
73
  return withAnyPicker ? '' : '0';
69
- }, _ref7 => {
74
+ }, _ref8 => {
70
75
  let {
71
76
  theme,
72
77
  disabled
73
- } = _ref7;
78
+ } = _ref8;
74
79
  return disabled ? `background-color: ${theme.colors.neutral[100]};` : ``;
75
80
  });
76
81
  const StyledDateInputsWrapperGrid = /*#__PURE__*/styled__default["default"].div.withConfig({
@@ -81,35 +86,35 @@ const StyledTimeInputsWrapperGrid = /*#__PURE__*/styled__default["default"].div.
81
86
  })(["display:grid;grid-template-columns:24px min-content 24px min-content 24px min-content 24px;grid-template-rows:min-content;padding:6px 0;gap:0px 0px;align-items:center;input,p{margin:0;}"]);
82
87
  const StyledPickersIconsWrapperGrid = /*#__PURE__*/styled__default["default"](dsGrid.Grid).withConfig({
83
88
  componentId: "sc-2wbvze-8"
84
- })(["position:relative;", ":before{content:'';position:absolute;top:0px;left:-1px;width:100%;height:100%;border-radius:2px;z-index:-1;", "}"], _ref8 => {
89
+ })(["position:relative;", ":before{content:'';position:absolute;top:0px;left:-1px;width:100%;height:100%;border-radius:2px;z-index:-1;", "}"], _ref9 => {
85
90
  let {
86
91
  isControllerOnly
87
- } = _ref8;
92
+ } = _ref9;
88
93
  return isControllerOnly ? `` : `height: 26px;`;
89
- }, _ref9 => {
94
+ }, _ref10 => {
90
95
  let {
91
96
  theme,
92
97
  isControllerOnly,
93
98
  hasError
94
- } = _ref9;
99
+ } = _ref10;
95
100
  return isControllerOnly ? `` : `
96
101
  border-left: 1px solid ${hasError ? theme.colors.danger[900] : theme.colors.neutral[200]}
97
102
  `;
98
103
  });
99
104
  const StyledFocusWithIn = /*#__PURE__*/styled__default["default"](dsGrid.Grid).withConfig({
100
105
  componentId: "sc-2wbvze-9"
101
- })(["position:relative;&:focus-within{&:after{display:block;content:' ';position:absolute;top:-5px;left:-2px;width:calc(100% + 4px);height:calc(100% + 10px);border:2px solid ", ";border-radius:2px;pointer-events:none;}}"], _ref10 => {
106
+ })(["position:relative;&:focus-within{&:after{display:block;content:' ';position:absolute;top:-5px;left:-2px;width:calc(100% + 4px);height:calc(100% + 10px);border:2px solid ", ";border-radius:2px;pointer-events:none;}}"], _ref11 => {
102
107
  let {
103
108
  theme
104
- } = _ref10;
109
+ } = _ref11;
105
110
  return theme.colors.brand[700];
106
111
  });
107
112
  const StyledClearButton = /*#__PURE__*/styled__default["default"](DSButton.DSButtonV2).withConfig({
108
113
  componentId: "sc-2wbvze-10"
109
- })(["height:26px;position:relative;visibility:", ";"], _ref11 => {
114
+ })(["height:26px;position:relative;visibility:", ";"], _ref12 => {
110
115
  let {
111
116
  shouldDisplay
112
- } = _ref11;
117
+ } = _ref12;
113
118
  return shouldDisplay ? 'visible' : 'hidden';
114
119
  });
115
120
 
@@ -14,7 +14,6 @@ const defaultProps = {
14
14
  startPlacementPreference: 'bottom-start',
15
15
  placementOrderPreference: ['bottom-start', 'bottom-end'],
16
16
  noOptionsMessage: 'No Matches Found',
17
- filteredOptions: [],
18
17
  isNonClearable: false // override in useCombobox to avoid ref duplications when more than one cb is used
19
18
 
20
19
  };
@@ -95,7 +95,7 @@ const useKeyboardNavigation = () => {
95
95
  setMenuState(false, 'selectOption', e);
96
96
  }
97
97
 
98
- onChange(getSuggestedValueOnChange(currentItem, selectedValues), currentItem, e);
98
+ onChange(getSuggestedValueOnChange(currentItem, selectedValues, isNonClearable), currentItem, e);
99
99
  }
100
100
  }
101
101
 
@@ -30,39 +30,44 @@ const StyledMin4DigitsInput = /*#__PURE__*/styled(ResettedInput).withConfig({
30
30
  });
31
31
  const StyledInputsWrapperGrid = /*#__PURE__*/styled(Grid).withConfig({
32
32
  componentId: "sc-2wbvze-5"
33
- })(["width:max-content;align-items:center;", " border-color:", ";border-radius:2px;padding-left:", ";padding-right:", ";position:relative;", ""], _ref3 => {
33
+ })(["width:max-content;align-items:center;background:", ";", " border-color:", ";border-radius:2px;padding-left:", ";padding-right:", ";position:relative;", ""], _ref3 => {
34
34
  let {
35
- isControllerOnly
35
+ theme
36
36
  } = _ref3;
37
+ return theme.colors.neutral['000'];
38
+ }, _ref4 => {
39
+ let {
40
+ isControllerOnly
41
+ } = _ref4;
37
42
  return isControllerOnly ? `` : `
38
43
  height: 28px;
39
44
  border-width: 1px;
40
45
  border-style: solid;
41
46
  `;
42
- }, _ref4 => {
47
+ }, _ref5 => {
43
48
  let {
44
49
  theme,
45
50
  hasError,
46
51
  disabled
47
- } = _ref4;
52
+ } = _ref5;
48
53
  if (hasError) return theme.colors.danger[900];
49
54
  if (disabled) return theme.colors.neutral[400];
50
55
  return theme.colors.neutral[200];
51
- }, _ref5 => {
56
+ }, _ref6 => {
52
57
  let {
53
58
  justPicker
54
- } = _ref5;
59
+ } = _ref6;
55
60
  return justPicker ? '0' : '2px';
56
- }, _ref6 => {
61
+ }, _ref7 => {
57
62
  let {
58
63
  withAnyPicker
59
- } = _ref6;
64
+ } = _ref7;
60
65
  return withAnyPicker ? '' : '0';
61
- }, _ref7 => {
66
+ }, _ref8 => {
62
67
  let {
63
68
  theme,
64
69
  disabled
65
- } = _ref7;
70
+ } = _ref8;
66
71
  return disabled ? `background-color: ${theme.colors.neutral[100]};` : ``;
67
72
  });
68
73
  const StyledDateInputsWrapperGrid = /*#__PURE__*/styled.div.withConfig({
@@ -73,35 +78,35 @@ const StyledTimeInputsWrapperGrid = /*#__PURE__*/styled.div.withConfig({
73
78
  })(["display:grid;grid-template-columns:24px min-content 24px min-content 24px min-content 24px;grid-template-rows:min-content;padding:6px 0;gap:0px 0px;align-items:center;input,p{margin:0;}"]);
74
79
  const StyledPickersIconsWrapperGrid = /*#__PURE__*/styled(Grid).withConfig({
75
80
  componentId: "sc-2wbvze-8"
76
- })(["position:relative;", ":before{content:'';position:absolute;top:0px;left:-1px;width:100%;height:100%;border-radius:2px;z-index:-1;", "}"], _ref8 => {
81
+ })(["position:relative;", ":before{content:'';position:absolute;top:0px;left:-1px;width:100%;height:100%;border-radius:2px;z-index:-1;", "}"], _ref9 => {
77
82
  let {
78
83
  isControllerOnly
79
- } = _ref8;
84
+ } = _ref9;
80
85
  return isControllerOnly ? `` : `height: 26px;`;
81
- }, _ref9 => {
86
+ }, _ref10 => {
82
87
  let {
83
88
  theme,
84
89
  isControllerOnly,
85
90
  hasError
86
- } = _ref9;
91
+ } = _ref10;
87
92
  return isControllerOnly ? `` : `
88
93
  border-left: 1px solid ${hasError ? theme.colors.danger[900] : theme.colors.neutral[200]}
89
94
  `;
90
95
  });
91
96
  const StyledFocusWithIn = /*#__PURE__*/styled(Grid).withConfig({
92
97
  componentId: "sc-2wbvze-9"
93
- })(["position:relative;&:focus-within{&:after{display:block;content:' ';position:absolute;top:-5px;left:-2px;width:calc(100% + 4px);height:calc(100% + 10px);border:2px solid ", ";border-radius:2px;pointer-events:none;}}"], _ref10 => {
98
+ })(["position:relative;&:focus-within{&:after{display:block;content:' ';position:absolute;top:-5px;left:-2px;width:calc(100% + 4px);height:calc(100% + 10px);border:2px solid ", ";border-radius:2px;pointer-events:none;}}"], _ref11 => {
94
99
  let {
95
100
  theme
96
- } = _ref10;
101
+ } = _ref11;
97
102
  return theme.colors.brand[700];
98
103
  });
99
104
  const StyledClearButton = /*#__PURE__*/styled(DSButtonV2).withConfig({
100
105
  componentId: "sc-2wbvze-10"
101
- })(["height:26px;position:relative;visibility:", ";"], _ref11 => {
106
+ })(["height:26px;position:relative;visibility:", ";"], _ref12 => {
102
107
  let {
103
108
  shouldDisplay
104
- } = _ref11;
109
+ } = _ref12;
105
110
  return shouldDisplay ? 'visible' : 'hidden';
106
111
  });
107
112
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@elliemae/ds-controlled-form",
3
- "version": "2.4.6",
3
+ "version": "2.4.9",
4
4
  "license": "MIT",
5
5
  "description": "ICE MT - Dimsum - Controlled Form Controllers",
6
6
  "module": "./esm/index.js",
@@ -896,20 +896,20 @@
896
896
  "build": "node ../../scripts/build/build.js"
897
897
  },
898
898
  "dependencies": {
899
- "@elliemae/ds-button": "2.4.6",
900
- "@elliemae/ds-circular-progress-indicator": "2.4.6",
901
- "@elliemae/ds-controlled-form": "2.4.6",
902
- "@elliemae/ds-form": "2.4.6",
903
- "@elliemae/ds-form-layout-blocks": "2.4.6",
904
- "@elliemae/ds-grid": "2.4.6",
905
- "@elliemae/ds-icon": "2.4.6",
906
- "@elliemae/ds-icons": "2.4.6",
907
- "@elliemae/ds-pills": "2.4.6",
908
- "@elliemae/ds-popperjs": "2.4.6",
909
- "@elliemae/ds-props-helpers": "2.4.6",
910
- "@elliemae/ds-system": "2.4.6",
911
- "@elliemae/ds-tooltip": "2.4.6",
912
- "@elliemae/ds-truncated-tooltip-text": "2.4.6",
899
+ "@elliemae/ds-button": "2.4.9",
900
+ "@elliemae/ds-circular-progress-indicator": "2.4.9",
901
+ "@elliemae/ds-controlled-form": "2.4.9",
902
+ "@elliemae/ds-form": "2.4.9",
903
+ "@elliemae/ds-form-layout-blocks": "2.4.9",
904
+ "@elliemae/ds-grid": "2.4.9",
905
+ "@elliemae/ds-icon": "2.4.9",
906
+ "@elliemae/ds-icons": "2.4.9",
907
+ "@elliemae/ds-pills": "2.4.9",
908
+ "@elliemae/ds-popperjs": "2.4.9",
909
+ "@elliemae/ds-props-helpers": "2.4.9",
910
+ "@elliemae/ds-system": "2.4.9",
911
+ "@elliemae/ds-tooltip": "2.4.9",
912
+ "@elliemae/ds-truncated-tooltip-text": "2.4.9",
913
913
  "prop-types": "~15.7.2",
914
914
  "react-desc": "~4.1.3",
915
915
  "react-popper": "~2.2.5",
@@ -31,6 +31,7 @@ export declare namespace DSComboboxT {
31
31
  menuMaxHeight?: number;
32
32
  placeholder?: string;
33
33
  autoFocus?: boolean;
34
+ filteredOptions: OptionTypes[];
34
35
  isMenuOpen?: boolean;
35
36
  onMenuChange?: (state: boolean, reason: string, e: Event) => void;
36
37
  onCreate?: (label: string) => void;
@@ -47,7 +48,6 @@ export declare namespace DSComboboxT {
47
48
  interface DefaultProps {
48
49
  startPlacementPreference: string;
49
50
  placementOrderPreference: string[];
50
- filteredOptions: OptionTypes[];
51
51
  hasError: boolean;
52
52
  inline: boolean;
53
53
  withoutPortal: boolean;