code7-leia 0.1.157 → 0.1.158
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/code7-leia.cjs.development.js +8 -2
- package/dist/code7-leia.cjs.development.js.map +1 -1
- package/dist/code7-leia.cjs.production.min.js +1 -1
- package/dist/code7-leia.cjs.production.min.js.map +1 -1
- package/dist/code7-leia.esm.js +8 -2
- package/dist/code7-leia.esm.js.map +1 -1
- package/dist/components/MultiSelect/styles.d.ts +2 -0
- package/package.json +1 -1
- package/src/components/MultiSelect/index.tsx +5 -0
- package/src/components/MultiSelect/styles.tsx +18 -0
|
@@ -4,3 +4,5 @@ export declare const SelectBox: import("styled-components").IStyledComponent<"we
|
|
|
4
4
|
export declare const OverSelect: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>;
|
|
5
5
|
export declare const Checkboxes: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>;
|
|
6
6
|
export declare const CheckboxLabel: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, never>>;
|
|
7
|
+
export declare const SelectedValues: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>;
|
|
8
|
+
export declare const SelectedValue: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>>;
|
package/package.json
CHANGED
|
@@ -73,6 +73,11 @@ const MultiSelect: React.FC<MultiSelectProps> = ({ options, presset, setPresset,
|
|
|
73
73
|
onChange={handleInputChange}
|
|
74
74
|
onKeyPress={handleInputKeyPress}
|
|
75
75
|
/>
|
|
76
|
+
<S.SelectedValues>
|
|
77
|
+
{presset.map((value, index) => (
|
|
78
|
+
<S.SelectedValue key={index}>{value}</S.SelectedValue>
|
|
79
|
+
))}
|
|
80
|
+
</S.SelectedValues>
|
|
76
81
|
</S.OverSelect>
|
|
77
82
|
</S.SelectBox>
|
|
78
83
|
<S.Checkboxes style={{ display: expanded ? 'block' : 'none' }}>
|
|
@@ -55,3 +55,21 @@ export const CheckboxLabel = styled.label`
|
|
|
55
55
|
background-color: #6690ff;
|
|
56
56
|
}
|
|
57
57
|
`;
|
|
58
|
+
|
|
59
|
+
export const SelectedValues = styled.div`
|
|
60
|
+
position: absolute;
|
|
61
|
+
right: 5px;
|
|
62
|
+
top: 5px;
|
|
63
|
+
display: flex;
|
|
64
|
+
flex-wrap: wrap;
|
|
65
|
+
`;
|
|
66
|
+
|
|
67
|
+
export const SelectedValue = styled.div`
|
|
68
|
+
background-color: #6690ff;
|
|
69
|
+
color: white;
|
|
70
|
+
border-radius: 15px;
|
|
71
|
+
padding: 5px 10px;
|
|
72
|
+
margin-right: 5px;
|
|
73
|
+
margin-bottom: 5px;
|
|
74
|
+
white-space: nowrap;
|
|
75
|
+
`;
|