@weareconceptstudio/form 0.1.7 → 0.1.8
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.
- package/dist/form/Builder/style.js +16 -1
- package/dist/select/index.js +2 -2
- package/dist/styles/formStyle.js +15 -5
- package/package.json +1 -1
|
@@ -1,3 +1,18 @@
|
|
|
1
1
|
import styled from 'styled-components';
|
|
2
|
-
const BuilderStyle = styled.div
|
|
2
|
+
const BuilderStyle = styled.div `
|
|
3
|
+
.react-select__value-container {
|
|
4
|
+
input {
|
|
5
|
+
width: unset !important;
|
|
6
|
+
background-color: unset !important;
|
|
7
|
+
color: unset !important;
|
|
8
|
+
font-size: unset !important;
|
|
9
|
+
line-height: unset !important;
|
|
10
|
+
font-family: unset !important;
|
|
11
|
+
font-weight: unset !important;
|
|
12
|
+
border-radius: unset !important;
|
|
13
|
+
border: unset !important;
|
|
14
|
+
padding: unset !important;
|
|
15
|
+
}
|
|
16
|
+
}
|
|
17
|
+
`;
|
|
3
18
|
export default BuilderStyle;
|
package/dist/select/index.js
CHANGED
|
@@ -7,7 +7,7 @@ import useFormInstance from '../form/hooks/useFormInstance';
|
|
|
7
7
|
import { useTranslation } from '@weareconceptstudio/core';
|
|
8
8
|
import { useFormContext } from '../FormProvider';
|
|
9
9
|
const Select = (props) => {
|
|
10
|
-
const { name, placeholder, value, onChange, multiple = false, allowClear = false, allowSearch =
|
|
10
|
+
const { name, placeholder, value, onChange, multiple = false, allowClear = false, allowSearch = false, disabled = false, loading = false, options: list = [], className, select_arrow = false, select_empty = false, optionKey, optionValue, optGroup } = props;
|
|
11
11
|
const { selectIcon } = useFormContext();
|
|
12
12
|
const { translate } = useTranslation();
|
|
13
13
|
const formInstance = useFormInstance();
|
|
@@ -58,7 +58,7 @@ const Select = (props) => {
|
|
|
58
58
|
const customStyles = {
|
|
59
59
|
menuList: (provided) => ({
|
|
60
60
|
...provided,
|
|
61
|
-
maxHeight: '
|
|
61
|
+
maxHeight: '200px',
|
|
62
62
|
}),
|
|
63
63
|
};
|
|
64
64
|
const options = useMemo(() => {
|
package/dist/styles/formStyle.js
CHANGED
|
@@ -226,9 +226,11 @@ const FormStyle = createGlobalStyle `${css `
|
|
|
226
226
|
}
|
|
227
227
|
|
|
228
228
|
/* //! Hover */
|
|
229
|
-
@media (
|
|
230
|
-
|
|
231
|
-
|
|
229
|
+
@media (pointer: fine) {
|
|
230
|
+
@media (hover: hover) {
|
|
231
|
+
&:hover {
|
|
232
|
+
border-color: var(--form_selectBorderHoverColor);
|
|
233
|
+
}
|
|
232
234
|
}
|
|
233
235
|
}
|
|
234
236
|
|
|
@@ -291,8 +293,16 @@ const FormStyle = createGlobalStyle `${css `
|
|
|
291
293
|
padding: var(--form_inputPadTBL) var(--form_inputPadR) var(--form_inputPadTBL) var(--form_inputPadTBL);
|
|
292
294
|
background-color: var(--form_selectOptionBgColor);
|
|
293
295
|
|
|
294
|
-
&.react-select__option--is-focused {
|
|
296
|
+
/* &.react-select__option--is-focused {
|
|
295
297
|
background-color: var(--form_selectOptionFocusBgColor);
|
|
298
|
+
} */
|
|
299
|
+
|
|
300
|
+
@media (pointer: fine) {
|
|
301
|
+
@media (hover: hover) {
|
|
302
|
+
&:hover {
|
|
303
|
+
background-color: var(--form_selectOptionFocusBgColor);
|
|
304
|
+
}
|
|
305
|
+
}
|
|
296
306
|
}
|
|
297
307
|
|
|
298
308
|
&.react-select__option--is-selected {
|
|
@@ -368,7 +378,7 @@ const FormStyle = createGlobalStyle `${css `
|
|
|
368
378
|
input:not(input[type='radio']),
|
|
369
379
|
textarea {
|
|
370
380
|
background-color: var(--form_inputErrorBgColor);
|
|
371
|
-
border: 2px solid var(--form_inputBorderErrorColor);
|
|
381
|
+
border: 2px solid var(--form_inputBorderErrorColor) !important;
|
|
372
382
|
color: var(--form_inputErrorColor);
|
|
373
383
|
|
|
374
384
|
&::placeholder {
|