w-design-system 0.0.53 → 0.0.55
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/components/Select/index.d.ts.map +1 -1
- package/dist/components/Select/index.js +10 -3
- package/dist/components/Select/index.js.map +1 -1
- package/dist/components/Select/styles.d.ts +0 -1
- package/dist/components/Select/styles.d.ts.map +1 -1
- package/dist/components/Select/styles.js +0 -11
- package/dist/components/Select/styles.js.map +1 -1
- package/package.json +1 -1
- package/src/components/Select/index.tsx +14 -4
- package/src/components/Select/styles.ts +0 -12
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Select/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EACZ,cAAc,EACd,iBAAiB,EACjB,SAAS,EAMV,MAAM,OAAO,CAAA;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/Select/index.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EACZ,cAAc,EACd,iBAAiB,EACjB,SAAS,EAMV,MAAM,OAAO,CAAA;AASd,MAAM,WAAW,WAAW,CAC1B,CAAC,SAAS;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,EAAE,EAAE,MAAM,CAAC;IAAC,IAAI,CAAC,EAAE,SAAS,CAAA;CAAE,GAAG;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,EAAE,EAAE,MAAM,CAAC;IAAC,IAAI,CAAC,EAAE,SAAS,CAAA;CAAE,CACzG,SAAQ,cAAc,CAAC,cAAc,CAAC;IACtC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,CAAC,GAAG,IAAI,KAAK,IAAI,CAAA;IAC3C,OAAO,CAAC,EAAE,CAAC,EAAE,CAAA;IACb,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,SAAS,CAAC,EAAE,SAAS,CAAA;IACrB,cAAc,CAAC,EAAE,CAAC,GAAG,IAAI,CAAA;IACzB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,iBAAiB,CAAC,EAAE,MAAM,CAAA;CAC3B;AAED,MAAM,WAAW,SAAS;IACxB,OAAO,CAAC,IAAI,EAAE,OAAO,GAAG,IAAI,CAAA;CAC7B;AA0KD,eAAO,MAAM,MAAM,EAAwC,CAAC,CAAwD,SAA9C;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,EAAE,EAAE,MAAM,CAAC;IAAC,IAAI,CAAC,EAAE,SAAS,CAAA;CAAE,EAClH,KAAK,EAAE,iBAAiB,CAAC,WAAW,CAAC,CAAC,CAAC,CAAC,GAAG;IAAE,GAAG,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,SAAS,CAAC,CAAA;CAAE,KAC/E,KAAK,CAAC,YAAY,CAAA"}
|
|
@@ -13,8 +13,9 @@ import React, { useEffect, useImperativeHandle, useMemo, useRef, useState, } fro
|
|
|
13
13
|
import { chevronDownSVG } from '../../assets/icon';
|
|
14
14
|
import { IconWrapper } from '../IconWrapper';
|
|
15
15
|
import { Input } from '../Input';
|
|
16
|
+
import { Paragraph } from '../Paragraph';
|
|
16
17
|
import { theme } from '../Themes';
|
|
17
|
-
import {
|
|
18
|
+
import { Dropdown, DropdownWrapper, OptionButton, OptionText, OptionTextBadge, SelectWrapper } from './styles';
|
|
18
19
|
const SelectFowardRef = (_a, ref) => {
|
|
19
20
|
var _b;
|
|
20
21
|
var { children, label, leftIcon, onOptionChange, options, placeholder, rightIcon, selectedOption, value, dropDownWidth, disabled, disableSearch } = _a, props = __rest(_a, ["children", "label", "leftIcon", "onOptionChange", "options", "placeholder", "rightIcon", "selectedOption", "value", "dropDownWidth", "disabled", "disableSearch"]);
|
|
@@ -99,12 +100,18 @@ const SelectFowardRef = (_a, ref) => {
|
|
|
99
100
|
return (React.createElement(SelectWrapper, Object.assign({}, props, { ref: wrapperRef }),
|
|
100
101
|
React.createElement(Input, { disabled: disabled, leftIcon: leftIcon, rightIcon: React.createElement(React.Fragment, null,
|
|
101
102
|
rightIcon,
|
|
102
|
-
React.createElement(IconWrapper, { className: `icon ${open ? 'icon-rotate' : ''}`, src: chevronDownSVG, width: "16px", color: theme.colors.shade30 })), placeholder: placeholder, label: label, value: computedValue, readonly: !open, onChange: onInputChange, onClick: () =>
|
|
103
|
+
React.createElement(IconWrapper, { className: `icon ${open ? 'icon-rotate' : ''}`, src: chevronDownSVG, width: "16px", color: theme.colors.shade30 })), placeholder: placeholder, label: label, value: computedValue, readonly: !open, onChange: onInputChange, onClick: () => {
|
|
104
|
+
if (!disabled) {
|
|
105
|
+
setComputedValue('');
|
|
106
|
+
setUsingInput(true);
|
|
107
|
+
setOpen(true);
|
|
108
|
+
}
|
|
109
|
+
} }),
|
|
103
110
|
open && (React.createElement(DropdownWrapper, null,
|
|
104
111
|
React.createElement(Dropdown, { dropDownTop: props.dropDownTop, dropDownWidth: dropDownWidth, dropDownMaxHeight: props.dropDownMaxHeight },
|
|
105
112
|
((_b = options === null || options === void 0 ? void 0 : options.length) !== null && _b !== void 0 ? _b : 0) > 0 && (React.createElement("div", null, filteredOptions.map(option => (React.createElement(OptionButton, { selected: (selectedOption === null || selectedOption === void 0 ? void 0 : selectedOption.id) === option.id, key: option.id, onClick: () => onOptionClick(option) }, (option === null || option === void 0 ? void 0 : option.badge) ? (React.createElement(OptionTextBadge, null,
|
|
106
113
|
React.createElement("div", null, option.text),
|
|
107
|
-
React.createElement(
|
|
114
|
+
React.createElement(Paragraph, { strongBod: true, color: theme.colors.honey30 }, option.badge))) : (React.createElement(React.Fragment, null,
|
|
108
115
|
option.icon,
|
|
109
116
|
React.createElement(OptionText, null, option.text)))))))),
|
|
110
117
|
children)))));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Select/index.tsx"],"names":[],"mappings":";;;;;;;;;;;AAAA,OAAO,KAAK,EAAE,EAIZ,SAAS,EACT,mBAAmB,EACnB,OAAO,EACP,MAAM,EACN,QAAQ,GACT,MAAM,OAAO,CAAA;AACd,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAA;AAClD,OAAO,EAAE,WAAW,EAAE,MAAM,gBAAgB,CAAA;AAC5C,OAAO,EAAE,KAAK,EAAE,MAAM,UAAU,CAAA;AAChC,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/Select/index.tsx"],"names":[],"mappings":"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"}
|
|
@@ -12,5 +12,4 @@ export interface OptionButtonProps {
|
|
|
12
12
|
export declare const OptionButton: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, OptionButtonProps>> & string;
|
|
13
13
|
export declare const OptionText: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
|
|
14
14
|
export declare const OptionTextBadge: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
|
|
15
|
-
export declare const Badge: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
|
|
16
15
|
//# sourceMappingURL=styles.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/components/Select/styles.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,aAAa,6NAUzB,CAAA;AACD,MAAM,WAAW,aAAa;IAC5B,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,iBAAiB,CAAC,EAAE,MAAM,CAAA;CAC3B;AAED,eAAO,MAAM,QAAQ,kPAgBpB,CAAA;AAED,eAAO,MAAM,eAAe,6NAG3B,CAAA;AAED,MAAM,WAAW,iBAAiB;IAChC,QAAQ,EAAE,OAAO,CAAA;CAClB;AAED,eAAO,MAAM,YAAY,kQA2BxB,CAAA;AAED,eAAO,MAAM,UAAU,6NAEtB,CAAA;AACD,eAAO,MAAM,eAAe,6NAK3B,CAAA
|
|
1
|
+
{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../../src/components/Select/styles.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,aAAa,6NAUzB,CAAA;AACD,MAAM,WAAW,aAAa;IAC5B,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,iBAAiB,CAAC,EAAE,MAAM,CAAA;CAC3B;AAED,eAAO,MAAM,QAAQ,kPAgBpB,CAAA;AAED,eAAO,MAAM,eAAe,6NAG3B,CAAA;AAED,MAAM,WAAW,iBAAiB;IAChC,QAAQ,EAAE,OAAO,CAAA;CAClB;AAED,eAAO,MAAM,YAAY,kQA2BxB,CAAA;AAED,eAAO,MAAM,UAAU,6NAEtB,CAAA;AACD,eAAO,MAAM,eAAe,6NAK3B,CAAA"}
|
|
@@ -69,15 +69,4 @@ export const OptionTextBadge = styled.div `
|
|
|
69
69
|
width: 100%;
|
|
70
70
|
justify-content: space-between;
|
|
71
71
|
`;
|
|
72
|
-
export const Badge = styled.div `
|
|
73
|
-
display: flex;
|
|
74
|
-
align-items: center;
|
|
75
|
-
justify-content: center;
|
|
76
|
-
gap: 0.5rem;
|
|
77
|
-
padding: 0.3rem;
|
|
78
|
-
border-radius: 40px;
|
|
79
|
-
background-color: ${theme.colors.honey30};
|
|
80
|
-
color: ${theme.colors.white};
|
|
81
|
-
font-size: 11px;
|
|
82
|
-
`;
|
|
83
72
|
//# sourceMappingURL=styles.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/components/Select/styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,MAAM,mBAAmB,CAAA;AACtC,OAAO,EAAE,KAAK,EAAE,MAAM,WAAW,CAAA;AAEjC,MAAM,CAAC,MAAM,aAAa,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;;;;CAUtC,CAAA;AAOD,MAAM,CAAC,MAAM,QAAQ,GAAG,MAAM,CAAC,GAAG,CAAe;;;aAGpC,KAAK,CAAC,MAAM,CAAC,EAAE;;sBAEN,KAAK,CAAC,MAAM,CAAC,KAAK;WAC7B,CAAC,EAAE,aAAa,EAAE,EAAE,EAAE,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,MAAM,CAAC;IACtE,CAAC,EAAE,WAAW,EAAE,EAAE,EAAE,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,kBAAkB,CAAC;;;;sBAIvD,KAAK,CAAC,MAAM,CAAC,OAAO;;;gBAG1B,CAAC,EAAE,iBAAiB,EAAE,EAAE,EAAE,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,OAAO,CAAC;;CAE3F,CAAA;AAED,MAAM,CAAC,MAAM,eAAe,GAAG,MAAM,CAAC,GAAG,CAAA;;aAE5B,KAAK,CAAC,MAAM,CAAC,EAAE;CAC3B,CAAA;AAMD,MAAM,CAAC,MAAM,YAAY,GAAG,MAAM,CAAC,MAAM,CAAmB;;;;;;WAMjD,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC;;;;;;;eAOrE,KAAK,CAAC,SAAS,CAAC,MAAM;;;;;;;;+BAQN,KAAK,CAAC,MAAM,CAAC,OAAO;;;;aAItC,KAAK,CAAC,MAAM,CAAC,MAAM;;CAE/B,CAAA;AAED,MAAM,CAAC,MAAM,UAAU,GAAG,MAAM,CAAC,GAAG,CAAA;;CAEnC,CAAA;AACD,MAAM,CAAC,MAAM,eAAe,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;CAKxC,CAAA
|
|
1
|
+
{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../src/components/Select/styles.ts"],"names":[],"mappings":"AAAA,OAAO,MAAM,MAAM,mBAAmB,CAAA;AACtC,OAAO,EAAE,KAAK,EAAE,MAAM,WAAW,CAAA;AAEjC,MAAM,CAAC,MAAM,aAAa,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;;;;CAUtC,CAAA;AAOD,MAAM,CAAC,MAAM,QAAQ,GAAG,MAAM,CAAC,GAAG,CAAe;;;aAGpC,KAAK,CAAC,MAAM,CAAC,EAAE;;sBAEN,KAAK,CAAC,MAAM,CAAC,KAAK;WAC7B,CAAC,EAAE,aAAa,EAAE,EAAE,EAAE,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,MAAM,CAAC;IACtE,CAAC,EAAE,WAAW,EAAE,EAAE,EAAE,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,eAAe,CAAC,CAAC,CAAC,kBAAkB,CAAC;;;;sBAIvD,KAAK,CAAC,MAAM,CAAC,OAAO;;;gBAG1B,CAAC,EAAE,iBAAiB,EAAE,EAAE,EAAE,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,OAAO,CAAC;;CAE3F,CAAA;AAED,MAAM,CAAC,MAAM,eAAe,GAAG,MAAM,CAAC,GAAG,CAAA;;aAE5B,KAAK,CAAC,MAAM,CAAC,EAAE;CAC3B,CAAA;AAMD,MAAM,CAAC,MAAM,YAAY,GAAG,MAAM,CAAC,MAAM,CAAmB;;;;;;WAMjD,CAAC,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC;;;;;;;eAOrE,KAAK,CAAC,SAAS,CAAC,MAAM;;;;;;;;+BAQN,KAAK,CAAC,MAAM,CAAC,OAAO;;;;aAItC,KAAK,CAAC,MAAM,CAAC,MAAM;;CAE/B,CAAA;AAED,MAAM,CAAC,MAAM,UAAU,GAAG,MAAM,CAAC,GAAG,CAAA;;CAEnC,CAAA;AACD,MAAM,CAAC,MAAM,eAAe,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;CAKxC,CAAA"}
|
package/package.json
CHANGED
|
@@ -11,8 +11,10 @@ import React, {
|
|
|
11
11
|
import { chevronDownSVG } from '../../assets/icon'
|
|
12
12
|
import { IconWrapper } from '../IconWrapper'
|
|
13
13
|
import { Input } from '../Input'
|
|
14
|
+
import { Paragraph } from '../Paragraph'
|
|
15
|
+
|
|
14
16
|
import { theme } from '../Themes'
|
|
15
|
-
import {
|
|
17
|
+
import { Dropdown, DropdownWrapper, OptionButton, OptionText, OptionTextBadge, SelectWrapper } from './styles'
|
|
16
18
|
|
|
17
19
|
export interface SelectProps<
|
|
18
20
|
T extends { text: string; id: number; icon?: ReactNode } = { text: string; id: number; icon?: ReactNode },
|
|
@@ -36,7 +38,7 @@ export interface SelectRef {
|
|
|
36
38
|
setOpen(open: boolean): void
|
|
37
39
|
}
|
|
38
40
|
|
|
39
|
-
const SelectFowardRef = <T extends { text: string; id: number; icon?: ReactNode; badge?:
|
|
41
|
+
const SelectFowardRef = <T extends { text: string; id: number; icon?: ReactNode; badge?: string | number }>(
|
|
40
42
|
{
|
|
41
43
|
children,
|
|
42
44
|
label,
|
|
@@ -156,7 +158,13 @@ const SelectFowardRef = <T extends { text: string; id: number; icon?: ReactNode;
|
|
|
156
158
|
value={computedValue}
|
|
157
159
|
readonly={!open}
|
|
158
160
|
onChange={onInputChange}
|
|
159
|
-
onClick={() =>
|
|
161
|
+
onClick={() => {
|
|
162
|
+
if (!disabled) {
|
|
163
|
+
setComputedValue('')
|
|
164
|
+
setUsingInput(true)
|
|
165
|
+
setOpen(true)
|
|
166
|
+
}
|
|
167
|
+
}}
|
|
160
168
|
/>
|
|
161
169
|
{open && (
|
|
162
170
|
<DropdownWrapper>
|
|
@@ -176,7 +184,9 @@ const SelectFowardRef = <T extends { text: string; id: number; icon?: ReactNode;
|
|
|
176
184
|
{option?.badge ? (
|
|
177
185
|
<OptionTextBadge>
|
|
178
186
|
<div>{option.text}</div>
|
|
179
|
-
<
|
|
187
|
+
<Paragraph strongBod color={theme.colors.honey30}>
|
|
188
|
+
{option.badge}
|
|
189
|
+
</Paragraph>
|
|
180
190
|
</OptionTextBadge>
|
|
181
191
|
) : (
|
|
182
192
|
<>
|
|
@@ -83,15 +83,3 @@ export const OptionTextBadge = styled.div`
|
|
|
83
83
|
width: 100%;
|
|
84
84
|
justify-content: space-between;
|
|
85
85
|
`
|
|
86
|
-
|
|
87
|
-
export const Badge = styled.div`
|
|
88
|
-
display: flex;
|
|
89
|
-
align-items: center;
|
|
90
|
-
justify-content: center;
|
|
91
|
-
gap: 0.5rem;
|
|
92
|
-
padding: 0.3rem;
|
|
93
|
-
border-radius: 40px;
|
|
94
|
-
background-color: ${theme.colors.honey30};
|
|
95
|
-
color: ${theme.colors.white};
|
|
96
|
-
font-size: 11px;
|
|
97
|
-
`
|