@bosonprotocol/react-kit 0.33.0-alpha.10 → 0.33.0-alpha.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 (42) hide show
  1. package/dist/cjs/components/buttons/BaseButton.d.ts +1 -0
  2. package/dist/cjs/components/buttons/BaseButton.d.ts.map +1 -1
  3. package/dist/cjs/components/buttons/BaseButton.js +1 -0
  4. package/dist/cjs/components/buttons/BaseButton.js.map +1 -1
  5. package/dist/cjs/components/form/CountrySelect.d.ts +2 -1
  6. package/dist/cjs/components/form/CountrySelect.d.ts.map +1 -1
  7. package/dist/cjs/components/form/CountrySelect.js +12 -7
  8. package/dist/cjs/components/form/CountrySelect.js.map +1 -1
  9. package/dist/cjs/components/form/Select.d.ts +2 -1
  10. package/dist/cjs/components/form/Select.d.ts.map +1 -1
  11. package/dist/cjs/components/form/Select.js +18 -15
  12. package/dist/cjs/components/form/Select.js.map +1 -1
  13. package/dist/cjs/components/form/index.d.ts +1 -1
  14. package/dist/cjs/components/form/index.d.ts.map +1 -1
  15. package/dist/cjs/components/form/index.js.map +1 -1
  16. package/dist/cjs/components/form/types.d.ts +33 -0
  17. package/dist/cjs/components/form/types.d.ts.map +1 -1
  18. package/dist/esm/components/buttons/BaseButton.d.ts +1 -0
  19. package/dist/esm/components/buttons/BaseButton.d.ts.map +1 -1
  20. package/dist/esm/components/buttons/BaseButton.js +1 -0
  21. package/dist/esm/components/buttons/BaseButton.js.map +1 -1
  22. package/dist/esm/components/form/CountrySelect.d.ts +2 -1
  23. package/dist/esm/components/form/CountrySelect.d.ts.map +1 -1
  24. package/dist/esm/components/form/CountrySelect.js +50 -43
  25. package/dist/esm/components/form/CountrySelect.js.map +1 -1
  26. package/dist/esm/components/form/Select.d.ts +2 -1
  27. package/dist/esm/components/form/Select.d.ts.map +1 -1
  28. package/dist/esm/components/form/Select.js +19 -15
  29. package/dist/esm/components/form/Select.js.map +1 -1
  30. package/dist/esm/components/form/index.d.ts +1 -1
  31. package/dist/esm/components/form/index.d.ts.map +1 -1
  32. package/dist/esm/components/form/index.js.map +1 -1
  33. package/dist/esm/components/form/types.d.ts +33 -0
  34. package/dist/esm/components/form/types.d.ts.map +1 -1
  35. package/package.json +5 -5
  36. package/src/components/buttons/BaseButton.tsx +4 -0
  37. package/src/components/form/CountrySelect.tsx +102 -88
  38. package/src/components/form/Select.tsx +20 -14
  39. package/src/components/form/index.ts +1 -1
  40. package/src/components/form/types.ts +33 -0
  41. package/src/stories/selects/CountrySelect.stories.tsx +8 -1
  42. package/src/stories/selects/Select.stories.tsx +117 -0
package/dist/esm/components/form/Select.d.ts CHANGED
@@ -1,4 +1,5 @@
1
1
  /// <reference types="react" />
2
2
  import type { SelectProps } from "./types";
3
- export default function SelectComponent({ name, options, placeholder, isClearable, isSearchable, disabled, errorMessage, onChange, ...props }: SelectProps): JSX.Element;
3
+ export type { SelectProps } from "./types";
4
+ export default function SelectComponent({ name, options, placeholder, isClearable, isSearchable, disabled, errorMessage, onChange, theme, ...props }: SelectProps): JSX.Element;
4
5
  //# sourceMappingURL=Select.d.ts.map
package/dist/esm/components/form/Select.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../../src/components/form/Select.tsx"],"names":[],"mappings":";AASA,OAAO,KAAK,EAAmB,WAAW,EAAE,MAAM,SAAS,CAAC;AAgE5D,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,EACtC,IAAI,EACJ,OAAO,EACP,WAAyB,EACzB,WAAmB,EACnB,YAAmB,EACnB,QAAgB,EAChB,YAAY,EACZ,QAAQ,EACR,GAAG,KAAK,EACT,EAAE,WAAW,eA4Cb"}
1
+ {"version":3,"file":"Select.d.ts","sourceRoot":"","sources":["../../../../src/components/form/Select.tsx"],"names":[],"mappings":";AASA,OAAO,KAAK,EAAmB,WAAW,EAAE,MAAM,SAAS,CAAC;AAC5D,YAAY,EAAE,WAAW,EAAE,MAAM,SAAS,CAAC;AAoE3C,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,EACtC,IAAI,EACJ,OAAO,EACP,WAAyB,EACzB,WAAmB,EACnB,YAAmB,EACnB,QAAgB,EAChB,YAAY,EACZ,QAAQ,EACR,KAAK,EACL,GAAG,KAAK,EACT,EAAE,WAAW,eA4Cb"}
package/dist/esm/components/form/Select.js CHANGED
@@ -7,7 +7,7 @@ import { theme } from "../../theme";
7
7
  import { zIndex } from "../ui/zIndex";
8
8
  import Error from "./Error";
9
9
  const colors = theme.colors.light;
10
- const customStyles = (error) => ({
10
+ const customStyles = (error, customTheme) => ({
11
11
  // eslint-disable-next-line @typescript-eslint/no-unused-vars
12
12
  singleValue: (provided, state) => {
13
13
  return {
@@ -31,16 +31,18 @@ const customStyles = (error) => ({
31
31
  borderRadius: 0,
32
32
  padding: "0.4rem 0.25rem",
33
33
  boxShadow: "none",
34
- ":hover": {
35
- borderColor: colors.secondary,
36
- borderWidth: "1px"
37
- },
38
34
  background: colors.lightGrey,
35
+ ...customTheme?.control,
39
36
  border: state.isFocused
40
- ? `1px solid ${colors.secondary}`
37
+ ? customTheme?.control?.focus?.border ?? `1px solid ${colors.secondary}`
41
38
  : !checkIfValueIsEmpty(error)
42
- ? `1px solid ${colors.orange}`
43
- : `1px solid ${colors.border}`,
39
+ ? customTheme?.control?.error?.border ?? `1px solid ${colors.orange}`
40
+ : customTheme?.control?.border ?? `1px solid ${colors.border}`,
41
+ ":hover": {
42
+ borderColor: colors.secondary,
43
+ borderWidth: "1px",
44
+ ...customTheme?.control?.hover
45
+ },
44
46
  ...before
45
47
  };
46
48
  },
@@ -53,19 +55,21 @@ const customStyles = (error) => ({
53
55
  option: (provided, state) => ({
54
56
  ...provided,
55
57
  cursor: state.isDisabled ? "not-allowed" : "pointer",
56
- opacity: state.isDisabled ? "0.5" : "1",
58
+ opacity: state.isDisabled
59
+ ? customTheme?.option?.disabled?.opacity ?? "0.5"
60
+ : customTheme?.option?.opacity ?? "1",
57
61
  background: state.isOptionSelected || state.isSelected || state.isFocused
58
- ? colors.lightGrey
59
- : colors.white,
62
+ ? customTheme?.option?.selected?.background ?? colors.lightGrey
63
+ : customTheme?.option?.background ?? colors.white,
60
64
  color: state.isOptionSelected || state.isSelected
61
- ? colors.secondary
62
- : colors.black
65
+ ? customTheme?.option?.selected?.color ?? colors.secondary
66
+ : customTheme?.option?.color ?? colors.black
63
67
  }),
64
68
  indicatorSeparator: () => ({
65
69
  display: "none"
66
70
  })
67
71
  });
68
- export default function SelectComponent({ name, options, placeholder = "Choose...", isClearable = false, isSearchable = true, disabled = false, errorMessage, onChange, ...props }) {
72
+ export default function SelectComponent({ name, options, placeholder = "Choose...", isClearable = false, isSearchable = true, disabled = false, errorMessage, onChange, theme, ...props }) {
69
73
  const [field, meta, helpers] = useField(name);
70
74
  const displayErrorMessage = meta.error && meta.touched && !errorMessage
71
75
  ? meta.error
@@ -86,7 +90,7 @@ export default function SelectComponent({ name, options, placeholder = "Choose..
86
90
  }
87
91
  };
88
92
  return (React.createElement(React.Fragment, null,
89
- React.createElement(Select, { styles: customStyles(displayErrorMessage), ...field, ...props, placeholder: placeholder, options: options, value: field.value, onChange: handleChange, onBlur: handleBlur, isSearchable: isSearchable, isClearable: isClearable, isDisabled: disabled, isOptionDisabled: (option) => option.disabled }),
93
+ React.createElement(Select, { styles: customStyles(displayErrorMessage, theme), ...field, ...props, placeholder: placeholder, options: options, value: field.value, onChange: handleChange, onBlur: handleBlur, isSearchable: isSearchable, isClearable: isClearable, isDisabled: disabled, isOptionDisabled: (option) => option.disabled }),
90
94
  React.createElement(Error, { display: displayError, message: displayErrorMessage }),
91
95
  " "));
92
96
  }
package/dist/esm/components/form/Select.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Select.js","sourceRoot":"","sources":["../../../../src/components/form/Select.tsx"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"Select.js","sourceRoot":"","sources":["../../../../src/components/form/Select.tsx"],"names":[],"mappings":"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"}
package/dist/esm/components/form/index.d.ts CHANGED
@@ -5,7 +5,7 @@ export { FormField } from "./FormField";
5
5
  export * from "./BaseInput";
6
6
  export { default as Input, InputProps } from "./Input";
7
7
  export { default as Phone } from "./Phone";
8
- export { default as Select } from "./Select";
8
+ export { default as Select, SelectProps } from "./Select";
9
9
  export * from "./CountrySelect";
10
10
  export * from "./BaseTagsInput";
11
11
  export * from "./BaseTextArea";
package/dist/esm/components/form/index.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/form/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC;AACjD,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,cAAc,CAAC;AACrD,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,SAAS,CAAC;AAC3C,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,cAAc,aAAa,CAAC;AAC5B,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AACvD,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,SAAS,CAAC;AAC3C,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,UAAU,CAAC;AAC7C,cAAc,iBAAiB,CAAC;AAChC,cAAc,iBAAiB,CAAC;AAChC,cAAc,gBAAgB,CAAC;AAC/B,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,iBAAiB,CAAC"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/components/form/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC;AACjD,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,cAAc,CAAC;AACrD,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,SAAS,CAAC;AAC3C,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,cAAc,aAAa,CAAC;AAC5B,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AACvD,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,SAAS,CAAC;AAC3C,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAC1D,cAAc,iBAAiB,CAAC;AAChC,cAAc,iBAAiB,CAAC;AAChC,cAAc,gBAAgB,CAAC;AAC/B,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,iBAAiB,CAAC"}
package/dist/esm/components/form/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/form/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC;AACjD,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,cAAc,CAAC;AACrD,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,SAAS,CAAC;AAC3C,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,cAAc,aAAa,CAAC;AAC5B,OAAO,EAAE,OAAO,IAAI,KAAK,EAAc,MAAM,SAAS,CAAC;AACvD,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,SAAS,CAAC;AAC3C,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,UAAU,CAAC;AAC7C,cAAc,iBAAiB,CAAC;AAChC,cAAc,iBAAiB,CAAC;AAChC,cAAc,gBAAgB,CAAC;AAC/B,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,iBAAiB,CAAC"}
1
+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/form/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC;AACjD,OAAO,EAAE,OAAO,IAAI,UAAU,EAAE,MAAM,cAAc,CAAC;AACrD,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,SAAS,CAAC;AAC3C,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AACxC,cAAc,aAAa,CAAC;AAC5B,OAAO,EAAE,OAAO,IAAI,KAAK,EAAc,MAAM,SAAS,CAAC;AACvD,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,SAAS,CAAC;AAC3C,OAAO,EAAE,OAAO,IAAI,MAAM,EAAe,MAAM,UAAU,CAAC;AAC1D,cAAc,iBAAiB,CAAC;AAChC,cAAc,iBAAiB,CAAC;AAChC,cAAc,gBAAgB,CAAC;AAC/B,OAAO,EAAE,OAAO,IAAI,MAAM,EAAE,MAAM,iBAAiB,CAAC"}
package/dist/esm/components/form/types.d.ts CHANGED
@@ -72,6 +72,39 @@ export interface SelectProps extends BaseProps {
72
72
  errorMessage?: string;
73
73
  onChange?: (option: SelectDataProps<string>) => void;
74
74
  label?: string;
75
+ theme?: Partial<{
76
+ control: Partial<{
77
+ background: CSSProperties["background"];
78
+ borderRadius: CSSProperties["borderRadius"];
79
+ padding: CSSProperties["padding"];
80
+ boxShadow: CSSProperties["boxShadow"];
81
+ borderWidth: CSSProperties["borderWidth"];
82
+ border: CSSProperties["border"];
83
+ focus: Partial<{
84
+ border: CSSProperties["border"];
85
+ }>;
86
+ hover: Partial<{
87
+ borderColor: CSSProperties["borderColor"];
88
+ borderWidth: CSSProperties["borderWidth"];
89
+ border: CSSProperties["border"];
90
+ }>;
91
+ error: Partial<{
92
+ border: CSSProperties["border"];
93
+ }>;
94
+ }>;
95
+ option: Partial<{
96
+ opacity: CSSProperties["opacity"];
97
+ background: CSSProperties["background"];
98
+ color: CSSProperties["color"];
99
+ selected: Partial<{
100
+ background: CSSProperties["background"];
101
+ color: CSSProperties["color"];
102
+ }>;
103
+ disabled: Partial<{
104
+ opacity: CSSProperties["opacity"];
105
+ }>;
106
+ }>;
107
+ }>;
75
108
  }
76
109
  export type UploadProps = BaseProps & {
77
110
  accept?: string;
package/dist/esm/components/form/types.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/form/types.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/components/form/types.ts"],"names":[],"mappings":"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"}
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@bosonprotocol/react-kit",
3
3
  "description": "React toolkit with smart components and hooks for building on top of the Boson Protocol.",
4
- "version": "0.33.0-alpha.10",
4
+ "version": "0.33.0-alpha.12",
5
5
  "main": "./dist/cjs/index.js",
6
6
  "module": "./dist/esm/index.js",
7
7
  "types": "./dist/cjs/index.d.ts",
@@ -15,9 +15,9 @@
15
15
  "license": "Apache-2.0",
16
16
  "dependencies": {
17
17
  "@bosonprotocol/chat-sdk": "^1.3.1-alpha.9",
18
- "@bosonprotocol/core-sdk": "^1.40.5-alpha.9",
19
- "@bosonprotocol/ethers-sdk": "^1.14.5-alpha.9",
20
- "@bosonprotocol/ipfs-storage": "^1.11.4-alpha.4",
18
+ "@bosonprotocol/core-sdk": "^1.40.5-alpha.11",
19
+ "@bosonprotocol/ethers-sdk": "^1.14.5-alpha.11",
20
+ "@bosonprotocol/ipfs-storage": "^1.11.4-alpha.6",
21
21
  "@davatar/react": "1.11.1",
22
22
  "@ethersproject/units": "5.6.0",
23
23
  "@glidejs/glide": "3.6.0",
@@ -188,5 +188,5 @@
188
188
  "overrides": {
189
189
  "typescript": "^5.1.6"
190
190
  },
191
- "gitHead": "47e2384cd1da7b4fe343833b8cc47a032775b1c2"
191
+ "gitHead": "1650d963f4a2f1f152c6202154f24b5ec9be281c"
192
192
  }
package/src/components/buttons/BaseButton.tsx CHANGED
@@ -19,6 +19,7 @@ const colors = theme.colors.light;
19
19
  const ButtonWithThemeProps = styled.button<{
20
20
  size: ButtonSizeProp;
21
21
  fill: boolean | undefined;
22
+ theme: BaseButtonTheme;
22
23
  }>`
23
24
  ${() => Styles.button};
24
25
  ${(props) => Styles[props.size as keyof typeof Styles]}
@@ -26,6 +27,8 @@ const ButtonWithThemeProps = styled.button<{
26
27
  border-color: ${(props) => props.theme?.borderColor || "transparent"};
27
28
  border-width: ${(props) => props.theme?.borderWidth || 0}px;
28
29
  border-radius: ${(props) => props.theme?.borderRadius || 0}px;
30
+ ${(props) =>
31
+ props.theme?.boxShadow ? `box-shadow: ${props.theme.boxShadow}` : ""};
29
32
  color: ${(props) => props.theme?.color || "#000000"};
30
33
  background-color: ${(props) => props.theme?.background || "transparent"};
31
34
  svg {
@@ -110,6 +113,7 @@ export type BaseButtonTheme = {
110
113
  borderColor?: CSSProperties["borderColor"];
111
114
  borderRadius?: CSSProperties["borderRadius"];
112
115
  borderWidth?: CSSProperties["borderWidth"];
116
+ boxShadow?: CSSProperties["boxShadow"];
113
117
  color?: CSSProperties["color"];
114
118
  padding?: CSSProperties["padding"];
115
119
  gap?: CSSProperties["gap"];
package/src/components/form/CountrySelect.tsx CHANGED
@@ -122,6 +122,7 @@ const PhoneWrapper = styled.div`
122
122
 
123
123
  export type CountrySelectProps = InputProps & {
124
124
  countries?: CountryCode[];
125
+ fieldValueIsCountryCode?: boolean; // if true, the field.value will be the countryCodeOrName, otherwise the country name
125
126
  theme?: Partial<{
126
127
  controlHeight: CSSProperties["height"];
127
128
  borderRadius: CSSProperties["borderRadius"];
@@ -135,11 +136,12 @@ export type CountrySelectProps = InputProps & {
135
136
  unselectedOptionColor: CSSProperties["color"];
136
137
  }>;
137
138
  };
138
-
139
+ type CountryName = string;
139
140
  export function CountrySelect({
140
141
  name,
141
142
  countries,
142
143
  theme: selectTheme,
144
+ fieldValueIsCountryCode,
143
145
  ...rest
144
146
  }: CountrySelectProps) {
145
147
  const { status } = useFormikContext();
@@ -149,11 +151,13 @@ export function CountrySelect({
149
151
  const errorMessage = errorText && meta.touched ? errorText : "";
150
152
  const displayError = typeof errorMessage === "string" && errorMessage !== "";
151
153
  const [phone, setPhone] = useState<string | undefined>(undefined);
152
- const [countryCode, setCountryCode] = useState<CountryCode | undefined>();
154
+ const [countryCodeOrName, setCountryCodeOrName] = useState<
155
+ CountryCode | CountryName | undefined
156
+ >();
153
157
 
154
158
  useEffect(() => {
155
159
  if (!initialized && field.value) {
156
- setCountryCode(field.value as CountryCode);
160
+ setCountryCodeOrName(field.value);
157
161
  setInitialized(true);
158
162
  }
159
163
  }, [field.value, initialized]); // eslint-disable-line
@@ -167,94 +171,104 @@ export function CountrySelect({
167
171
  <div></div>
168
172
  ))}
169
173
  addInternationalOption={false}
170
- country={countryCode}
174
+ country={countryCodeOrName}
171
175
  value={phone}
172
176
  onChange={(value) => setPhone((value || "").replace(/\+/g, ""))}
173
177
  countries={countries}
174
- countrySelectComponent={({ iconComponent: Icon, ...props }) => (
175
- <>
176
- <div>
177
- <Select
178
- {...rest}
179
- {...props}
180
- isDisabled={rest.disabled}
181
- theme={(theme) => ({
182
- ...theme,
183
- controlHeight: selectTheme?.controlHeight,
184
- borderRadius: selectTheme?.borderRadius || 0,
185
- colors: {
186
- ...theme.colors,
187
- controlHoverBorderColor:
188
- selectTheme?.controlHoverBorderColor ||
189
- colors.secondary,
190
- controlBackground:
191
- selectTheme?.controlBackground || colors.lightGrey,
192
- controlFocusBorderColor:
193
- selectTheme?.controlFocusBorderColor ||
194
- colors.secondary,
195
- controlUnfocusedBorderColor:
196
- selectTheme?.controlUnfocusedBorderColor ||
197
- colors.border,
198
- selectedOptionBackground:
199
- selectTheme?.selectedOptionBackground ||
200
- colors.lightGrey,
201
- unselectedOptionBackground:
202
- selectTheme?.unselectedOptionBackground || colors.white,
203
- selectedOptionColor:
204
- selectTheme?.selectedOptionColor || colors.secondary,
205
- unselectedOptionColor:
206
- selectTheme?.unselectedOptionColor || colors.black
207
- }
208
- })}
209
- styles={customStyles}
210
- name="countrySelect"
211
- value={(props?.options || []).find(
212
- (o: SelectDataProps) => o.value === countryCode
213
- )}
214
- onChange={(o: SelectDataProps) => {
215
- setCountryCode(o.value as CountryCode);
216
- helpers.setValue(o.label);
217
- }}
218
- components={{
219
- Control: (props) => {
220
- const country =
221
- (props?.getValue()[0] as any)?.value || null;
222
- return (
223
- <components.Control {...props}>
224
- <ControlGrid>
225
- {country ? (
226
- <Icon country={country as CountryCode} label="" />
227
- ) : (
228
- <GlobeHemisphereWest />
229
- )}
230
- {props.children as any}
231
- </ControlGrid>
232
- </components.Control>
233
- );
234
- },
235
- Option: (props) => {
236
- const country = (props?.data as any)?.value || null;
237
- return (
238
- <components.Option {...props}>
239
- <OptionGrid>
240
- {country ? (
241
- <Icon
242
- country={country as CountryCode}
243
- label={props.label}
244
- />
245
- ) : (
246
- <GlobeHemisphereWest />
247
- )}
248
- {props.label}
249
- </OptionGrid>
250
- </components.Option>
251
- );
252
- }
253
- }}
254
- />
255
- </div>
256
- </>
257
- )}
178
+ countrySelectComponent={({ iconComponent: Icon, ...props }) => {
179
+ const value = (props?.options || []).find((o: SelectDataProps) =>
180
+ fieldValueIsCountryCode
181
+ ? o.value === countryCodeOrName
182
+ : o.label === countryCodeOrName
183
+ );
184
+ return (
185
+ <>
186
+ <div>
187
+ <Select
188
+ {...rest}
189
+ {...props}
190
+ isDisabled={rest.disabled}
191
+ theme={(theme) => ({
192
+ ...theme,
193
+ controlHeight: selectTheme?.controlHeight,
194
+ borderRadius: selectTheme?.borderRadius || 0,
195
+ colors: {
196
+ ...theme.colors,
197
+ controlHoverBorderColor:
198
+ selectTheme?.controlHoverBorderColor ||
199
+ colors.secondary,
200
+ controlBackground:
201
+ selectTheme?.controlBackground || colors.lightGrey,
202
+ controlFocusBorderColor:
203
+ selectTheme?.controlFocusBorderColor ||
204
+ colors.secondary,
205
+ controlUnfocusedBorderColor:
206
+ selectTheme?.controlUnfocusedBorderColor ||
207
+ colors.border,
208
+ selectedOptionBackground:
209
+ selectTheme?.selectedOptionBackground ||
210
+ colors.lightGrey,
211
+ unselectedOptionBackground:
212
+ selectTheme?.unselectedOptionBackground ||
213
+ colors.white,
214
+ selectedOptionColor:
215
+ selectTheme?.selectedOptionColor || colors.secondary,
216
+ unselectedOptionColor:
217
+ selectTheme?.unselectedOptionColor || colors.black
218
+ }
219
+ })}
220
+ styles={customStyles}
221
+ name="countrySelect"
222
+ value={value}
223
+ onChange={(o: SelectDataProps) => {
224
+ const value = fieldValueIsCountryCode ? o.value : o.label;
225
+ setCountryCodeOrName(value);
226
+ helpers.setValue(value);
227
+ }}
228
+ components={{
229
+ Control: (props) => {
230
+ const country =
231
+ (props?.getValue()[0] as any)?.value || null;
232
+ return (
233
+ <components.Control {...props}>
234
+ <ControlGrid>
235
+ {country ? (
236
+ <Icon
237
+ country={country as CountryCode}
238
+ label=""
239
+ />
240
+ ) : (
241
+ <GlobeHemisphereWest />
242
+ )}
243
+ {props.children as any}
244
+ </ControlGrid>
245
+ </components.Control>
246
+ );
247
+ },
248
+ Option: (props) => {
249
+ const country = (props?.data as any)?.value || null;
250
+ return (
251
+ <components.Option {...props}>
252
+ <OptionGrid>
253
+ {country ? (
254
+ <Icon
255
+ country={country as CountryCode}
256
+ label={props.label}
257
+ />
258
+ ) : (
259
+ <GlobeHemisphereWest />
260
+ )}
261
+ {props.label}
262
+ </OptionGrid>
263
+ </components.Option>
264
+ );
265
+ }
266
+ }}
267
+ />
268
+ </div>
269
+ </>
270
+ );
271
+ }}
258
272
  />
259
273
  </PhoneWrapper>
260
274
  <Error display={!rest.hideError && displayError} message={errorMessage} />
package/src/components/form/Select.tsx CHANGED
@@ -8,9 +8,10 @@ import { zIndex } from "../ui/zIndex";
8
8
 
9
9
  import Error from "./Error";
10
10
  import type { SelectDataProps, SelectProps } from "./types";
11
+ export type { SelectProps } from "./types";
11
12
  const colors = theme.colors.light;
12
13
 
13
- const customStyles = (error: any) => ({
14
+ const customStyles = (error: any, customTheme: SelectProps["theme"]) => ({
14
15
  // eslint-disable-next-line @typescript-eslint/no-unused-vars
15
16
  singleValue: (provided: any, state: any) => {
16
17
  return {
@@ -34,16 +35,18 @@ const customStyles = (error: any) => ({
34
35
  borderRadius: 0,
35
36
  padding: "0.4rem 0.25rem",
36
37
  boxShadow: "none",
37
- ":hover": {
38
- borderColor: colors.secondary,
39
- borderWidth: "1px"
40
- },
41
38
  background: colors.lightGrey,
39
+ ...customTheme?.control,
42
40
  border: state.isFocused
43
- ? `1px solid ${colors.secondary}`
41
+ ? customTheme?.control?.focus?.border ?? `1px solid ${colors.secondary}`
44
42
  : !checkIfValueIsEmpty(error)
45
- ? `1px solid ${colors.orange}`
46
- : `1px solid ${colors.border}`,
43
+ ? customTheme?.control?.error?.border ?? `1px solid ${colors.orange}`
44
+ : customTheme?.control?.border ?? `1px solid ${colors.border}`,
45
+ ":hover": {
46
+ borderColor: colors.secondary,
47
+ borderWidth: "1px",
48
+ ...customTheme?.control?.hover
49
+ },
47
50
  ...before
48
51
  };
49
52
  },
@@ -56,15 +59,17 @@ const customStyles = (error: any) => ({
56
59
  option: (provided: any, state: any) => ({
57
60
  ...provided,
58
61
  cursor: state.isDisabled ? "not-allowed" : "pointer",
59
- opacity: state.isDisabled ? "0.5" : "1",
62
+ opacity: state.isDisabled
63
+ ? customTheme?.option?.disabled?.opacity ?? "0.5"
64
+ : customTheme?.option?.opacity ?? "1",
60
65
  background:
61
66
  state.isOptionSelected || state.isSelected || state.isFocused
62
- ? colors.lightGrey
63
- : colors.white,
67
+ ? customTheme?.option?.selected?.background ?? colors.lightGrey
68
+ : customTheme?.option?.background ?? colors.white,
64
69
  color:
65
70
  state.isOptionSelected || state.isSelected
66
- ? colors.secondary
67
- : colors.black
71
+ ? customTheme?.option?.selected?.color ?? colors.secondary
72
+ : customTheme?.option?.color ?? colors.black
68
73
  }),
69
74
  indicatorSeparator: () => ({
70
75
  display: "none"
@@ -80,6 +85,7 @@ export default function SelectComponent({
80
85
  disabled = false,
81
86
  errorMessage,
82
87
  onChange,
88
+ theme,
83
89
  ...props
84
90
  }: SelectProps) {
85
91
  const [field, meta, helpers] = useField(name);
@@ -109,7 +115,7 @@ export default function SelectComponent({
109
115
  return (
110
116
  <>
111
117
  <Select
112
- styles={customStyles(displayErrorMessage)}
118
+ styles={customStyles(displayErrorMessage, theme)}
113
119
  {...field}
114
120
  {...props}
115
121
  placeholder={placeholder}
package/src/components/form/index.ts CHANGED
@@ -5,7 +5,7 @@ export { FormField } from "./FormField";
5
5
  export * from "./BaseInput";
6
6
  export { default as Input, InputProps } from "./Input";
7
7
  export { default as Phone } from "./Phone";
8
- export { default as Select } from "./Select";
8
+ export { default as Select, SelectProps } from "./Select";
9
9
  export * from "./CountrySelect";
10
10
  export * from "./BaseTagsInput";
11
11
  export * from "./BaseTextArea";
package/src/components/form/types.ts CHANGED
@@ -89,6 +89,39 @@ export interface SelectProps extends BaseProps {
89
89
  errorMessage?: string;
90
90
  onChange?: (option: SelectDataProps<string>) => void;
91
91
  label?: string;
92
+ theme?: Partial<{
93
+ control: Partial<{
94
+ background: CSSProperties["background"];
95
+ borderRadius: CSSProperties["borderRadius"];
96
+ padding: CSSProperties["padding"];
97
+ boxShadow: CSSProperties["boxShadow"];
98
+ borderWidth: CSSProperties["borderWidth"];
99
+ border: CSSProperties["border"];
100
+ focus: Partial<{
101
+ border: CSSProperties["border"];
102
+ }>;
103
+ hover: Partial<{
104
+ borderColor: CSSProperties["borderColor"];
105
+ borderWidth: CSSProperties["borderWidth"];
106
+ border: CSSProperties["border"];
107
+ }>;
108
+ error: Partial<{
109
+ border: CSSProperties["border"];
110
+ }>;
111
+ }>;
112
+ option: Partial<{
113
+ opacity: CSSProperties["opacity"];
114
+ background: CSSProperties["background"];
115
+ color: CSSProperties["color"];
116
+ selected: Partial<{
117
+ background: CSSProperties["background"];
118
+ color: CSSProperties["color"];
119
+ }>;
120
+ disabled: Partial<{
121
+ opacity: CSSProperties["opacity"];
122
+ }>;
123
+ }>;
124
+ }>;
92
125
  }
93
126
 
94
127
  export type UploadProps = BaseProps & {
package/src/stories/selects/CountrySelect.stories.tsx CHANGED
@@ -74,7 +74,14 @@ export default {
74
74
  initialValues={{ [inputName]: "" }}
75
75
  initialTouched={{ [inputName]: true }}
76
76
  >
77
- <Story args={{ ...args, name: inputName }} />
77
+ {({ values }) => {
78
+ return (
79
+ <>
80
+ <Story args={{ ...args, name: inputName }} />
81
+ <div>selected value: {JSON.stringify(values)}</div>
82
+ </>
83
+ );
84
+ }}
78
85
  </Formik>
79
86
  );
80
87
  }