@lets-events/react 7.1.0 → 7.2.1
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/.turbo/turbo-build.log +9 -10
- package/CHANGELOG.md +12 -0
- package/dist/index.d.mts +1571 -71
- package/dist/index.d.ts +1571 -71
- package/dist/index.js +1025 -229
- package/dist/index.mjs +988 -200
- package/package.json +1 -1
- package/src/components/Alert.tsx +200 -153
- package/src/components/Badge.tsx +0 -1
- package/src/components/Calendar/index.tsx +5 -2
- package/src/components/Card.tsx +69 -0
- package/src/components/Step.tsx +107 -91
- package/src/components/Text.tsx +5 -7
- package/src/components/TextField.tsx +52 -43
- package/src/components/TextareaField.tsx +101 -0
- package/src/components/TimePicker.tsx +30 -4
- package/src/index.tsx +2 -0
|
@@ -57,6 +57,32 @@ export const TimerPickerContentStyled = styled("div", {
|
|
|
57
57
|
},
|
|
58
58
|
});
|
|
59
59
|
|
|
60
|
+
export const InputStyled = styled("input", {
|
|
61
|
+
height: "$40",
|
|
62
|
+
fontFamily: "$default",
|
|
63
|
+
borderRadius: "$sm",
|
|
64
|
+
boxSizing: "border-box",
|
|
65
|
+
color: "$dark500",
|
|
66
|
+
border: "1px solid $dark300",
|
|
67
|
+
position: "relative",
|
|
68
|
+
display: "flex",
|
|
69
|
+
width: "100%",
|
|
70
|
+
alignItems: "center",
|
|
71
|
+
padding: "0",
|
|
72
|
+
outline: "none",
|
|
73
|
+
margin: 0,
|
|
74
|
+
textAlign: "center",
|
|
75
|
+
"&:has(input:focus)": {
|
|
76
|
+
border: "2px solid $brand300",
|
|
77
|
+
},
|
|
78
|
+
"&:has(input:disabled)": {
|
|
79
|
+
backgroundColor: "$dark100",
|
|
80
|
+
color: "$dark400",
|
|
81
|
+
border: "1px solid $dark200",
|
|
82
|
+
cursor: "not-allowed",
|
|
83
|
+
},
|
|
84
|
+
});
|
|
85
|
+
|
|
60
86
|
export type TimePickerProps = {
|
|
61
87
|
selected: string | undefined;
|
|
62
88
|
setSelected: React.Dispatch<React.SetStateAction<string | undefined>>;
|
|
@@ -141,6 +167,7 @@ export function TimePicker({
|
|
|
141
167
|
}}
|
|
142
168
|
>
|
|
143
169
|
<Button
|
|
170
|
+
type="button"
|
|
144
171
|
variant="text"
|
|
145
172
|
onClick={() => handleIncrement(unit as "hours" | "minutes")}
|
|
146
173
|
>
|
|
@@ -161,16 +188,14 @@ export function TimePicker({
|
|
|
161
188
|
/>
|
|
162
189
|
</svg>
|
|
163
190
|
</Button>
|
|
164
|
-
<
|
|
191
|
+
<InputStyled
|
|
165
192
|
value={unit === "hours" ? hours : minutes}
|
|
166
193
|
onChange={(e) => handleInputValue(e.target.value)}
|
|
167
194
|
type="text"
|
|
168
195
|
placeholder="00"
|
|
169
|
-
typography="labelSmall"
|
|
170
|
-
fontWeight="regular"
|
|
171
|
-
textAlign="center"
|
|
172
196
|
/>
|
|
173
197
|
<Button
|
|
198
|
+
type="button"
|
|
174
199
|
variant="text"
|
|
175
200
|
onClick={() => handleDecrement(unit as "hours" | "minutes")}
|
|
176
201
|
>
|
|
@@ -197,6 +222,7 @@ export function TimePicker({
|
|
|
197
222
|
</TimerPickerContentStyled>
|
|
198
223
|
<TimePickerFooterStyled>
|
|
199
224
|
<Button
|
|
225
|
+
type="button"
|
|
200
226
|
variant="text"
|
|
201
227
|
color="brand"
|
|
202
228
|
onClick={() => handleInputValue(`${hours}:${minutes}`)}
|
package/src/index.tsx
CHANGED
|
@@ -20,6 +20,8 @@ export * from './components/TimePicker'
|
|
|
20
20
|
export * from './components/Alert'
|
|
21
21
|
export * from './components/Switch'
|
|
22
22
|
export * from './components/Step'
|
|
23
|
+
export * from './components/Card'
|
|
24
|
+
export * from './components/TextareaField'
|
|
23
25
|
|
|
24
26
|
// Layouts
|
|
25
27
|
export * from './components/Flex'
|