@atom-learning/components 1.4.0 → 1.6.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/dist/components/accordion/Accordion.js +1 -1
- package/dist/components/accordion/AccordionContent.js +1 -1
- package/dist/components/accordion/AccordionItem.js +1 -1
- package/dist/components/accordion/AccordionTrigger.js +1 -1
- package/dist/components/action-icon/ActionIcon.js +1 -1
- package/dist/components/alert-dialog/AlertDialog.js +1 -1
- package/dist/components/alert-dialog/AlertDialogContent.js +1 -1
- package/dist/components/alert-dialog/alert-context/AlertContext.js +1 -1
- package/dist/components/alert-dialog/alert-context/AlertDialog.js +1 -1
- package/dist/components/alert-dialog/alert-context/reducer.js +1 -1
- package/dist/components/box/Box.js +1 -1
- package/dist/components/button/Button.d.ts +1 -1
- package/dist/components/button/Button.js +1 -1
- package/dist/components/calendar/Calendar.d.ts +19 -0
- package/dist/components/calendar/Calendar.js +1 -0
- package/dist/components/calendar/Day.d.ts +269 -0
- package/dist/components/calendar/Day.js +1 -0
- package/dist/components/calendar/constants.d.ts +2 -0
- package/dist/components/calendar/constants.js +1 -0
- package/dist/components/carousel/Carousel.js +1 -1
- package/dist/components/carousel/CarouselArrows.js +1 -1
- package/dist/components/carousel/CarouselPagination.js +1 -1
- package/dist/components/carousel/CarouselSlide.js +1 -1
- package/dist/components/carousel/CarouselSlider.js +1 -1
- package/dist/components/checkbox/Checkbox.js +1 -1
- package/dist/components/checkbox-field/CheckboxField.js +1 -1
- package/dist/components/combobox/Combobox.js +1 -1
- package/dist/components/combobox/ComboboxInput.js +1 -1
- package/dist/components/combobox/ComboboxPopover.js +1 -1
- package/dist/components/date-field/DateField.d.ts +17 -0
- package/dist/components/date-field/DateField.js +1 -0
- package/dist/components/date-field/index.d.ts +1 -0
- package/dist/components/date-input/DateInput.d.ts +19 -0
- package/dist/components/date-input/DateInput.js +1 -0
- package/dist/components/date-input/constants.d.ts +1 -0
- package/dist/components/date-input/constants.js +1 -0
- package/dist/components/date-input/index.d.ts +1 -0
- package/dist/components/date-input/use-date.d.ts +5 -0
- package/dist/components/date-input/use-date.js +1 -0
- package/dist/components/dialog/Dialog.js +1 -1
- package/dist/components/dialog/DialogContent.d.ts +1 -0
- package/dist/components/dialog/DialogContent.js +1 -1
- package/dist/components/divider/Divider.js +1 -1
- package/dist/components/dropdown-menu/DropdownMenu.js +1 -1
- package/dist/components/dropdown-menu/DropdownMenuContent.js +1 -1
- package/dist/components/dropdown-menu/DropdownMenuItem.js +1 -1
- package/dist/components/dropdown-menu/DropdownMenuLinkItem.js +1 -1
- package/dist/components/dropdown-menu/DropdownMenuTrigger.js +1 -1
- package/dist/components/field-wrapper/FieldDescription.js +1 -1
- package/dist/components/field-wrapper/FieldWrapper.js +1 -1
- package/dist/components/field-wrapper/InlineFieldWrapper.js +1 -1
- package/dist/components/flex/Flex.js +1 -1
- package/dist/components/form/Form.js +1 -1
- package/dist/components/form/Form.types.js +1 -1
- package/dist/components/form/useFieldError.js +1 -1
- package/dist/components/grid/Grid.js +1 -1
- package/dist/components/heading/Heading.js +1 -1
- package/dist/components/icon/Icon.js +1 -1
- package/dist/components/image/Image.js +1 -1
- package/dist/components/index.d.ts +6 -1
- package/dist/components/input/Input.js +1 -1
- package/dist/components/input-field/InputField.js +1 -1
- package/dist/components/label/Label.js +1 -1
- package/dist/components/link/Link.js +1 -1
- package/dist/components/list/List.js +1 -1
- package/dist/components/loader/Loader.js +1 -1
- package/dist/components/markdown-content/MarkdownContent.js +1 -1
- package/dist/components/markdown-content/components/MarkdownCode.js +1 -1
- package/dist/components/markdown-content/components/MarkdownEmphasis.js +1 -1
- package/dist/components/markdown-content/components/MarkdownHeading.js +1 -1
- package/dist/components/markdown-content/components/MarkdownImage.js +1 -1
- package/dist/components/markdown-content/components/MarkdownInlineCode.js +1 -1
- package/dist/components/markdown-content/components/MarkdownLink.js +1 -1
- package/dist/components/markdown-content/components/MarkdownList.js +1 -1
- package/dist/components/markdown-content/components/MarkdownListItem.js +1 -1
- package/dist/components/markdown-content/components/MarkdownParagraph.js +1 -1
- package/dist/components/markdown-content/components/MarkdownStrong.js +1 -1
- package/dist/components/markdown-content/components/MarkdownText.js +1 -1
- package/dist/components/markdown-content/components/MarkdownThematicBreak.js +1 -1
- package/dist/components/notification-badge/NotificationBadge.js +1 -1
- package/dist/components/password-field/PasswordField.js +1 -1
- package/dist/components/password-input/PasswordInput.js +1 -1
- package/dist/components/popover/Popover.js +1 -1
- package/dist/components/popover/PopoverContent.d.ts +1 -0
- package/dist/components/popover/PopoverContent.js +1 -1
- package/dist/components/progress-bar/ProgressBar.js +1 -1
- package/dist/components/radio-button/RadioButton.js +1 -1
- package/dist/components/radio-button/RadioButtonGroup.js +1 -1
- package/dist/components/radio-button-field/RadioButtonField.js +1 -1
- package/dist/components/radio-button-field/RadioField.js +1 -1
- package/dist/components/radio-card/RadioCard.js +1 -1
- package/dist/components/radio-card/RadioCardGroup.js +1 -1
- package/dist/components/search-input/SearchInput.d.ts +4 -1
- package/dist/components/search-input/SearchInput.js +1 -1
- package/dist/components/select/Select.js +1 -1
- package/dist/components/select-field/SelectField.js +1 -1
- package/dist/components/slider/Slider.d.ts +276 -0
- package/dist/components/slider/Slider.js +1 -0
- package/dist/components/slider/SliderSteps.d.ts +13 -0
- package/dist/components/slider/SliderSteps.js +1 -0
- package/dist/components/slider/SliderValue.d.ts +9 -0
- package/dist/components/slider/SliderValue.js +1 -0
- package/dist/components/slider/index.d.ts +1 -0
- package/dist/components/slider-field/SliderField.d.ts +13 -0
- package/dist/components/slider-field/SliderField.js +1 -0
- package/dist/components/slider-field/index.d.ts +1 -0
- package/dist/components/stack/Stack.js +1 -1
- package/dist/components/stack-content/StackContent.js +1 -1
- package/dist/components/stepper/Stepper.d.ts +10 -0
- package/dist/components/stepper/Stepper.js +1 -0
- package/dist/components/stepper/StepperStepBack.d.ts +4 -0
- package/dist/components/stepper/StepperStepBack.js +1 -0
- package/dist/components/stepper/StepperStepForward.d.ts +4 -0
- package/dist/components/stepper/StepperStepForward.js +1 -0
- package/dist/components/stepper/StepperSteps.d.ts +2 -0
- package/dist/components/stepper/StepperSteps.js +1 -0
- package/dist/components/stepper/index.d.ts +1 -0
- package/dist/components/stepper/stepper-context/StepperContext.d.ts +4 -0
- package/dist/components/stepper/stepper-context/StepperContext.js +1 -0
- package/dist/components/stepper/types.d.ts +24 -0
- package/dist/components/switch/Switch.js +1 -1
- package/dist/components/table/Table.js +1 -1
- package/dist/components/table/TableBody.js +1 -1
- package/dist/components/table/TableCell.js +1 -1
- package/dist/components/table/TableFooter.js +1 -1
- package/dist/components/table/TableHeader.js +1 -1
- package/dist/components/table/TableHeaderCell.js +1 -1
- package/dist/components/table/TableRow.js +1 -1
- package/dist/components/tabs/TabTrigger.js +1 -1
- package/dist/components/tabs/Tabs.js +1 -1
- package/dist/components/tabs/TabsTriggerList.d.ts +1 -0
- package/dist/components/tabs/TabsTriggerList.js +1 -1
- package/dist/components/tabs/utils.js +1 -1
- package/dist/components/text/Text.js +1 -1
- package/dist/components/textarea/Textarea.js +1 -1
- package/dist/components/textarea-field/TextareaField.js +1 -1
- package/dist/components/toast/Toast.js +1 -1
- package/dist/components/toast/ToastProvider.js +1 -1
- package/dist/components/tooltip/Tooltip.js +1 -1
- package/dist/components/tooltip/TooltipContent.js +1 -1
- package/dist/components/validation-error/ValidationError.js +1 -1
- package/dist/components/video/Video.js +1 -1
- package/dist/docgen.json +1 -1
- package/dist/docs/Button.mdx +3 -2
- package/dist/docs/DateField.mdx +20 -0
- package/dist/docs/DateInput.mdx +87 -0
- package/dist/docs/Dialog.mdx +16 -1
- package/dist/docs/RadioButton.mdx +1 -1
- package/dist/docs/SearchInput.mdx +2 -1
- package/dist/docs/Slider.mdx +117 -0
- package/dist/docs/SliderField.mdx +35 -0
- package/dist/docs/Stepper.mdx +45 -0
- package/dist/docs/Tabs.mdx +2 -0
- package/dist/index.cjs.js +1 -1
- package/dist/index.js +1 -1
- package/dist/stitches.js +1 -1
- package/dist/utilities/css-wrapper/CSSWrapper.js +1 -1
- package/dist/utilities/style/capsize.js +1 -1
- package/dist/utilities/style/encode-background-icon.js +1 -1
- package/dist/utilities/style/keyframe-animations.js +1 -1
- package/dist/utilities/use-is-mounted-ref/index.js +1 -1
- package/package.json +26 -17
|
@@ -0,0 +1,276 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { SliderSteps } from './SliderSteps';
|
|
3
|
+
import { SliderValue } from './SliderValue';
|
|
4
|
+
declare const StyledSlider: import("@stitches/react/types/styled-component").StyledComponent<React.ForwardRefExoticComponent<import("@radix-ui/react-slider").SliderProps & React.RefAttributes<HTMLSpanElement>>, {
|
|
5
|
+
theme?: "light" | "tonal" | undefined;
|
|
6
|
+
}, {
|
|
7
|
+
sm: string;
|
|
8
|
+
md: string;
|
|
9
|
+
lg: string;
|
|
10
|
+
xl: string;
|
|
11
|
+
reducedMotion: string;
|
|
12
|
+
allowMotion: string;
|
|
13
|
+
hover: string;
|
|
14
|
+
}, import("@stitches/react/types/css-util").CSS<{
|
|
15
|
+
sm: string;
|
|
16
|
+
md: string;
|
|
17
|
+
lg: string;
|
|
18
|
+
xl: string;
|
|
19
|
+
reducedMotion: string;
|
|
20
|
+
allowMotion: string;
|
|
21
|
+
hover: string;
|
|
22
|
+
}, {
|
|
23
|
+
colors: {
|
|
24
|
+
textForeground: any;
|
|
25
|
+
textSubtle: any;
|
|
26
|
+
textPlaceholder: any;
|
|
27
|
+
background: any;
|
|
28
|
+
backgroundAccent: any;
|
|
29
|
+
tonal50: any;
|
|
30
|
+
tonal100: any;
|
|
31
|
+
tonal200: any;
|
|
32
|
+
tonal300: any;
|
|
33
|
+
tonal400: any;
|
|
34
|
+
tonal500: any;
|
|
35
|
+
tonal600: any;
|
|
36
|
+
alpha100: any;
|
|
37
|
+
alpha150: any;
|
|
38
|
+
alpha200: any;
|
|
39
|
+
alpha250: any;
|
|
40
|
+
alpha600: any;
|
|
41
|
+
primaryLight: any;
|
|
42
|
+
primary: any;
|
|
43
|
+
primaryMid: any;
|
|
44
|
+
primaryDark: any;
|
|
45
|
+
secondary: any;
|
|
46
|
+
brandRed: any;
|
|
47
|
+
brandRedAccent: any;
|
|
48
|
+
brandGreen: any;
|
|
49
|
+
brandGreenAccent: any;
|
|
50
|
+
brandPurple: any;
|
|
51
|
+
brandPurpleAccent: any;
|
|
52
|
+
brandYellow: any;
|
|
53
|
+
brandYellowAccent: any;
|
|
54
|
+
successLight: any;
|
|
55
|
+
success: any;
|
|
56
|
+
successMid: any;
|
|
57
|
+
successDark: any;
|
|
58
|
+
dangerLight: any;
|
|
59
|
+
danger: any;
|
|
60
|
+
dangerMid: any;
|
|
61
|
+
dangerDark: any;
|
|
62
|
+
warningLight: any;
|
|
63
|
+
warning: any;
|
|
64
|
+
warningMid: any;
|
|
65
|
+
warningDark: any;
|
|
66
|
+
subjectEnglish: any;
|
|
67
|
+
subjectMaths: any;
|
|
68
|
+
subjectScience: any;
|
|
69
|
+
subjectVerbalReasoning: any;
|
|
70
|
+
subjectNonVerbalReasoning: any;
|
|
71
|
+
subjectCreativeWriting: any;
|
|
72
|
+
subjectExamSkills: any;
|
|
73
|
+
};
|
|
74
|
+
space: {
|
|
75
|
+
"0": any;
|
|
76
|
+
"1": any;
|
|
77
|
+
"2": any;
|
|
78
|
+
"3": any;
|
|
79
|
+
"4": any;
|
|
80
|
+
"5": any;
|
|
81
|
+
"6": any;
|
|
82
|
+
"7": any;
|
|
83
|
+
"8": any;
|
|
84
|
+
"9": any;
|
|
85
|
+
};
|
|
86
|
+
fontSizes: {
|
|
87
|
+
xs: any;
|
|
88
|
+
sm: any;
|
|
89
|
+
md: any;
|
|
90
|
+
lg: any;
|
|
91
|
+
xl: any;
|
|
92
|
+
"2xl": any;
|
|
93
|
+
"3xl": any;
|
|
94
|
+
"4xl": any;
|
|
95
|
+
};
|
|
96
|
+
fonts: {
|
|
97
|
+
sans: any;
|
|
98
|
+
mono: any;
|
|
99
|
+
display: any;
|
|
100
|
+
body: any;
|
|
101
|
+
};
|
|
102
|
+
sizes: {
|
|
103
|
+
"0": any;
|
|
104
|
+
"1": any;
|
|
105
|
+
"2": any;
|
|
106
|
+
"3": any;
|
|
107
|
+
"4": any;
|
|
108
|
+
"5": any;
|
|
109
|
+
"6": any;
|
|
110
|
+
"7": any;
|
|
111
|
+
"8": any;
|
|
112
|
+
};
|
|
113
|
+
radii: {
|
|
114
|
+
"0": any;
|
|
115
|
+
"1": any;
|
|
116
|
+
"2": any;
|
|
117
|
+
"3": any;
|
|
118
|
+
round: any;
|
|
119
|
+
};
|
|
120
|
+
shadows: {
|
|
121
|
+
"0": any;
|
|
122
|
+
"1": any;
|
|
123
|
+
"2": any;
|
|
124
|
+
"3": any;
|
|
125
|
+
};
|
|
126
|
+
}, import("@stitches/react/types/config").DefaultThemeMap, {
|
|
127
|
+
bg: (value: {
|
|
128
|
+
readonly [$$PropertyValue]: "background";
|
|
129
|
+
}) => {
|
|
130
|
+
background: {
|
|
131
|
+
readonly [$$PropertyValue]: "background";
|
|
132
|
+
};
|
|
133
|
+
};
|
|
134
|
+
inset: (value: string | number | {
|
|
135
|
+
readonly [$$ScaleValue]: "space";
|
|
136
|
+
}) => {
|
|
137
|
+
top: string | number | {
|
|
138
|
+
readonly [$$ScaleValue]: "space";
|
|
139
|
+
};
|
|
140
|
+
right: string | number | {
|
|
141
|
+
readonly [$$ScaleValue]: "space";
|
|
142
|
+
};
|
|
143
|
+
bottom: string | number | {
|
|
144
|
+
readonly [$$ScaleValue]: "space";
|
|
145
|
+
};
|
|
146
|
+
left: string | number | {
|
|
147
|
+
readonly [$$ScaleValue]: "space";
|
|
148
|
+
};
|
|
149
|
+
};
|
|
150
|
+
size: (value: string | number | {
|
|
151
|
+
readonly [$$ScaleValue]: "size";
|
|
152
|
+
}) => {
|
|
153
|
+
height: string | number | {
|
|
154
|
+
readonly [$$ScaleValue]: "size";
|
|
155
|
+
};
|
|
156
|
+
width: string | number | {
|
|
157
|
+
readonly [$$ScaleValue]: "size";
|
|
158
|
+
};
|
|
159
|
+
};
|
|
160
|
+
p: (value: string | number | {
|
|
161
|
+
readonly [$$ScaleValue]: "space";
|
|
162
|
+
}) => {
|
|
163
|
+
padding: string | number | {
|
|
164
|
+
readonly [$$ScaleValue]: "space";
|
|
165
|
+
};
|
|
166
|
+
};
|
|
167
|
+
pt: (value: string | number | {
|
|
168
|
+
readonly [$$ScaleValue]: "space";
|
|
169
|
+
}) => {
|
|
170
|
+
paddingTop: string | number | {
|
|
171
|
+
readonly [$$ScaleValue]: "space";
|
|
172
|
+
};
|
|
173
|
+
};
|
|
174
|
+
pr: (value: string | number | {
|
|
175
|
+
readonly [$$ScaleValue]: "space";
|
|
176
|
+
}) => {
|
|
177
|
+
paddingRight: string | number | {
|
|
178
|
+
readonly [$$ScaleValue]: "space";
|
|
179
|
+
};
|
|
180
|
+
};
|
|
181
|
+
pb: (value: string | number | {
|
|
182
|
+
readonly [$$ScaleValue]: "space";
|
|
183
|
+
}) => {
|
|
184
|
+
paddingBottom: string | number | {
|
|
185
|
+
readonly [$$ScaleValue]: "space";
|
|
186
|
+
};
|
|
187
|
+
};
|
|
188
|
+
pl: (value: string | number | {
|
|
189
|
+
readonly [$$ScaleValue]: "space";
|
|
190
|
+
}) => {
|
|
191
|
+
paddingLeft: string | number | {
|
|
192
|
+
readonly [$$ScaleValue]: "space";
|
|
193
|
+
};
|
|
194
|
+
};
|
|
195
|
+
px: (value: string | number | {
|
|
196
|
+
readonly [$$ScaleValue]: "space";
|
|
197
|
+
}) => {
|
|
198
|
+
paddingLeft: string | number | {
|
|
199
|
+
readonly [$$ScaleValue]: "space";
|
|
200
|
+
};
|
|
201
|
+
paddingRight: string | number | {
|
|
202
|
+
readonly [$$ScaleValue]: "space";
|
|
203
|
+
};
|
|
204
|
+
};
|
|
205
|
+
py: (value: string | number | {
|
|
206
|
+
readonly [$$ScaleValue]: "space";
|
|
207
|
+
}) => {
|
|
208
|
+
paddingTop: string | number | {
|
|
209
|
+
readonly [$$ScaleValue]: "space";
|
|
210
|
+
};
|
|
211
|
+
paddingBottom: string | number | {
|
|
212
|
+
readonly [$$ScaleValue]: "space";
|
|
213
|
+
};
|
|
214
|
+
};
|
|
215
|
+
m: (value: string | number | {
|
|
216
|
+
readonly [$$ScaleValue]: "space";
|
|
217
|
+
}) => {
|
|
218
|
+
margin: string | number | {
|
|
219
|
+
readonly [$$ScaleValue]: "space";
|
|
220
|
+
};
|
|
221
|
+
};
|
|
222
|
+
mt: (value: string | number | {
|
|
223
|
+
readonly [$$ScaleValue]: "space";
|
|
224
|
+
}) => {
|
|
225
|
+
marginTop: string | number | {
|
|
226
|
+
readonly [$$ScaleValue]: "space";
|
|
227
|
+
};
|
|
228
|
+
};
|
|
229
|
+
mr: (value: string | number | {
|
|
230
|
+
readonly [$$ScaleValue]: "space";
|
|
231
|
+
}) => {
|
|
232
|
+
marginRight: string | number | {
|
|
233
|
+
readonly [$$ScaleValue]: "space";
|
|
234
|
+
};
|
|
235
|
+
};
|
|
236
|
+
mb: (value: string | number | {
|
|
237
|
+
readonly [$$ScaleValue]: "space";
|
|
238
|
+
}) => {
|
|
239
|
+
marginBottom: string | number | {
|
|
240
|
+
readonly [$$ScaleValue]: "space";
|
|
241
|
+
};
|
|
242
|
+
};
|
|
243
|
+
ml: (value: string | number | {
|
|
244
|
+
readonly [$$ScaleValue]: "space";
|
|
245
|
+
}) => {
|
|
246
|
+
marginLeft: string | number | {
|
|
247
|
+
readonly [$$ScaleValue]: "space";
|
|
248
|
+
};
|
|
249
|
+
};
|
|
250
|
+
mx: (value: string | number | {
|
|
251
|
+
readonly [$$ScaleValue]: "space";
|
|
252
|
+
}) => {
|
|
253
|
+
marginLeft: string | number | {
|
|
254
|
+
readonly [$$ScaleValue]: "space";
|
|
255
|
+
};
|
|
256
|
+
marginRight: string | number | {
|
|
257
|
+
readonly [$$ScaleValue]: "space";
|
|
258
|
+
};
|
|
259
|
+
};
|
|
260
|
+
my: (value: string | number | {
|
|
261
|
+
readonly [$$ScaleValue]: "space";
|
|
262
|
+
}) => {
|
|
263
|
+
marginTop: string | number | {
|
|
264
|
+
readonly [$$ScaleValue]: "space";
|
|
265
|
+
};
|
|
266
|
+
marginBottom: string | number | {
|
|
267
|
+
readonly [$$ScaleValue]: "space";
|
|
268
|
+
};
|
|
269
|
+
};
|
|
270
|
+
}>>;
|
|
271
|
+
export declare type SliderProps = React.ComponentProps<typeof StyledSlider>;
|
|
272
|
+
export declare const Slider: React.FC<SliderProps> & {
|
|
273
|
+
Value: typeof SliderValue;
|
|
274
|
+
Steps: typeof SliderSteps;
|
|
275
|
+
};
|
|
276
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{Track as $,Root as b,Range as h,Thumb as g}from"@radix-ui/react-slider";import{createElement as o}from"react";import{styled as t}from"../../stitches.js";import{SliderSteps as f}from"./SliderSteps.js";import{SliderValue as S}from"./SliderValue.js";import{CSSWrapper as y}from"../../utilities/css-wrapper/CSSWrapper.js";const i=t($,{borderRadius:"$round",flexGrow:1,position:"relative",'&[data-orientation="horizontal"]':{height:"$space$1"},'&[data-orientation="vertical"]':{width:"$space$1"}}),v=t(b,{alignItems:"center",display:"flex",position:"relative",touchAction:"none",userSelect:"none",cursor:"pointer",'&[data-orientation="horizontal"]':{height:"$1"},'&[data-orientation="vertical"]':{flexDirection:"column",width:"$1"},"&[data-disabled]":{cursor:"not-allowed",bg:"$tonal100"},variants:{theme:{light:{[`${i}`]:{bg:"#fff"}},tonal:{[`${i}`]:{bg:"$tonal200"}}}}}),w=t(h,{bg:"$primary",borderRadius:"$round",height:"100%",position:"absolute","&[data-disabled]":{bg:"$tonal200",cursor:"not-allowed"}}),x=t(g,{bg:"$primaryMid",borderRadius:"$round",display:"block",size:"$1","&:hover":{bg:"$primaryDark"},"&:focus":{outline:"2px solid $primaryMid",outlineOffset:"2px"},"&[data-disabled]":{bg:"$tonal200",cursor:"not-allowed"}}),e=({value:a,defaultValue:l,min:n=0,max:d=100,theme:s="tonal",css:p,children:c,...m})=>{const r=a||l;return o(y,{css:p},o(v,{theme:s,defaultValue:l,value:a,min:n,max:d,...m},o(i,null,o(w,null)),(r==null?void 0:r.length)&&r.map((R,u)=>o(x,{key:`thumb${u}`}))),c)};e.Value=S,e.Steps=f,e.displayName="Slider";export{e as Slider};
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
export declare type SliderStepsType = {
|
|
3
|
+
steps?: {
|
|
4
|
+
label: string;
|
|
5
|
+
value: number;
|
|
6
|
+
}[];
|
|
7
|
+
};
|
|
8
|
+
declare type SliderStepsProps = {
|
|
9
|
+
min: number;
|
|
10
|
+
max: number;
|
|
11
|
+
} & SliderStepsType;
|
|
12
|
+
export declare const SliderSteps: React.FC<SliderStepsProps>;
|
|
13
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{createElement as l}from"react";import{styled as a}from"../../stitches.js";import{Text as i}from"../text/Text.js";const s=a("div",{height:"$space$3",mt:"$3",position:"relative",width:"100%"}),o=(r,e,n)=>(r-e)/(n-e)*100,u=(r,e,n)=>{const t=o(r,e,n);return t<=10?0:t>=90?100:50},c=({min:r,max:e,steps:n=[]})=>n.length===0?null:l(s,null,n.map(t=>l(i,{as:"span",key:t.value,css:{position:"absolute",color:"$tonal300"},style:{left:`${o(t.value,r,e)}%`,transform:`translateX(-${u(t.value,r,e)}%)`}},t.label)));export{c as SliderSteps};
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
export declare type SliderValueType = {
|
|
3
|
+
outputLabel?: (value: number | number[]) => string;
|
|
4
|
+
};
|
|
5
|
+
declare type SliderValueProps = SliderValueType & {
|
|
6
|
+
value?: number[];
|
|
7
|
+
};
|
|
8
|
+
export declare const SliderValue: React.FC<SliderValueProps>;
|
|
9
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{createElement as o}from"react";import{Text as m}from"../text/Text.js";const n=({value:t=[],outputLabel:r=e=>`Current value is ${e}`})=>o(m,{css:{mt:"$4",color:"$tonal300",width:"100%"}},r(t.length===1?t[0]:t));export{n as SliderValue};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export * from './Slider';
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { SliderProps } from '../../components/slider';
|
|
3
|
+
import { SliderStepsType } from '../../components/slider/SliderSteps';
|
|
4
|
+
import { SliderValueType } from '../slider/SliderValue';
|
|
5
|
+
import type { CSS } from '../../stitches';
|
|
6
|
+
declare type SliderFieldProps = SliderProps & SliderStepsType & SliderValueType & {
|
|
7
|
+
css?: CSS;
|
|
8
|
+
label: string;
|
|
9
|
+
name: string;
|
|
10
|
+
defaultValue: number[];
|
|
11
|
+
};
|
|
12
|
+
export declare const SliderField: React.FC<SliderFieldProps>;
|
|
13
|
+
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import e from"react";import{useFormContext as S,Controller as f}from"react-hook-form";import{FieldWrapper as C}from"../field-wrapper/FieldWrapper.js";import"../field-wrapper/InlineFieldWrapper.js";import{Slider as o}from"../slider/Slider.js";const n=({css:p,label:c,name:r,defaultValue:t,outputLabel:d,min:l=0,max:i=100,steps:a=[],...s})=>{const{control:E}=S();return e.createElement(C,{css:p,fieldId:r,label:c},e.createElement(f,{control:E,name:r,defaultValue:t,render:({onChange:F,value:m})=>e.createElement(o,{name:r,defaultValue:t,onValueChange:F,value:m,min:l,max:i,...s},e.createElement(o.Steps,{min:l,max:i,steps:a}),e.createElement(o.Value,{value:m||t,outputLabel:d}))}))};n.displayName="SliderField";export{n as SliderField};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { SliderField } from './SliderField';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
|
|
1
|
+
import{createElement as r}from"react";import{theme as s,styled as i}from"../../stitches.js";import{CSSWrapper as l}from"../../utilities/css-wrapper/CSSWrapper.js";const m=Object.keys(s.space).reduce((t,e)=>({...t,[e]:{mt:`-$space$${e}`,ml:`-$space$${e}`,"& > *":{mt:`$space$${e}`,ml:`$space$${e}`}}}),{}),p=i("div",{display:"flex",flexWrap:"wrap","& > *":{m:0},variants:{direction:{row:{flexDirection:"row",alignItems:"center"},"row-reverse":{flexDirection:"row-reverse",alignItems:"center"},column:{flexDirection:"column"}},justify:{start:{justifyContent:"flex-start"},end:{justifyContent:"flex-end"},center:{justifyContent:"center"}},gap:m}}),a=({css:t,gap:e=2,direction:n="row",justify:c="start",...o})=>r(l,{css:t},r(p,{direction:n,gap:e,justify:c,...o}));a.displayName="Stack";export{a as Stack};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
|
|
1
|
+
import{createElement as e,Children as a,isValidElement as p,cloneElement as s}from"react";import{styled as f}from"../../stitches.js";import{Divider as d}from"../divider/Divider.js";import{Heading as c}from"../heading/Heading.js";import{Image as l}from"../image/Image.js";import{List as k}from"../list/List.js";import"../markdown-content/components/MarkdownCode.js";import"../markdown-content/components/MarkdownEmphasis.js";import{MarkdownHeading as u}from"../markdown-content/components/MarkdownHeading.js";import"../markdown-content/components/MarkdownInlineCode.js";import{MarkdownImage as y}from"../markdown-content/components/MarkdownImage.js";import"../link/Link.js";import{MarkdownList as $}from"../markdown-content/components/MarkdownList.js";import{MarkdownParagraph as g}from"../markdown-content/components/MarkdownParagraph.js";import"../markdown-content/components/MarkdownStrong.js";import{MarkdownThematicBreak as w}from"../markdown-content/components/MarkdownThematicBreak.js";import{Text as C}from"../text/Text.js";const M=f("div",{}),m=(o,i)=>s(o,{css:{...i,...o.props.css?o.props.css:{}}}),n=({children:o,...i})=>e(M,{...i},a.map(o,r=>{if(!p(r))return r;const t=r==null?void 0:r.type;return t===c||t===u?m(r,{maxWidth:"65ch","&:not(:first-child)":{mt:"$5"},"&:not(:last-child)":{mb:"$5"}}):t===C||t===g||t===k||t===$?m(r,{maxWidth:"75ch","&:not(:last-child)":{mb:"$5"}}):t===d||t===w?m(r,{my:"$5"}):t===l||t===y?m(r,{display:"block","&:not(:first-child)":{mt:"$6"},"&:not(:last-child)":{mb:"$6"}}):r}));n.displayName="StackContent";export{n as StackContent};
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { StepperStepBack } from './StepperStepBack';
|
|
3
|
+
import { StepperStepForward } from './StepperStepForward';
|
|
4
|
+
import { StepperSteps } from './StepperSteps';
|
|
5
|
+
import { IStepperProps } from './types';
|
|
6
|
+
export declare const Stepper: React.FC<IStepperProps> & {
|
|
7
|
+
StepBack: typeof StepperStepBack;
|
|
8
|
+
StepForward: typeof StepperStepForward;
|
|
9
|
+
Steps: typeof StepperSteps;
|
|
10
|
+
};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{createElement as e}from"react";import{Box as i}from"../box/Box.js";import{StepperProvider as S}from"./stepper-context/StepperContext.js";import{StepperStepBack as s}from"./StepperStepBack.js";import{StepperStepForward as d}from"./StepperStepForward.js";import{StepperSteps as f}from"./StepperSteps.js";const r=({children:p,stepCount:t,allowSkip:o,onComplete:m,onStepChange:a})=>e(S,{stepCount:t,allowSkip:o,onComplete:m,onStepChange:a},e(i,{"aria-label":"progress",css:{width:"100%",display:"grid",gridTemplateColumns:"1fr auto 1fr"}},p));r.StepBack=s,r.StepForward=d,r.Steps=f,r.displayName="Stepper";export{r as Stepper};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{createElement as i}from"react";import{Button as m}from"../button/Button.js";import{useStepper as n}from"./stepper-context/StepperContext.js";const a=({label:t,children:o,...r})=>{const{activeStep:e,goToPreviousStep:p}=n();return i(m,{size:"sm",appearance:"outline",...r,disabled:e===0,onClick:p},o||t(e))};export{a as StepperStepBack};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{createElement as m}from"react";import{Button as s}from"../button/Button.js";import{useStepper as c}from"./stepper-context/StepperContext.js";const i=({label:t,children:e,...o})=>{const{goToNextStep:r,activeStep:p}=c();return m(s,{size:"sm",...o,onClick:r,css:{ml:"auto"}},e||t(p))};export{i as StepperStepForward};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{createElement as a}from"react";import{styled as c}from"../../stitches.js";import{Flex as i}from"../flex/Flex.js";import{useStepper as m}from"./stepper-context/StepperContext.js";const h=c(i,{position:"relative",p:"$2",justifyContent:"center",alignItems:"center",width:"$2",height:"$2",borderRadius:"50%",border:"none",bg:"$tonal50",fontFamily:"$body",fontWeight:400,fontSize:"$sm","&:not(:first-child)":{ml:"$3"},"&:not(:last-child)::after":{content:"",width:"$1",height:"1px",position:"absolute",left:"$sizes$2"},variants:{state:{normal:{bg:"$tonal50",color:"$tonal400"},active:{bg:"$primary",color:"white"},viewed:{bg:"$primaryDark",color:"white"}},separator:{normal:{"&:not(:last-child)::after":{bg:"$tonal400"}},highlight:{"&:not(:last-child)::after":{bg:"$primary"}}}}}),$=()=>{const{steps:l,goToStep:s,activeStep:e,viewedSteps:n,allowSkip:r}=m(),p=o=>e===o?"active":n.includes(o)?"viewed":"normal";return a(i,{css:{alignItems:"center"}},l.map((o,t)=>a(h,{key:`step_${t}`,as:r?"button":"div",onClick:()=>r?s(t):void 0,state:p(t),separator:t<e?"highlight":"normal","aria-current":t===e?"step":void 0,"aria-label":`step ${t+1}`,css:{cursor:r?"pointer":"auto"}},t+1)))};export{$ as StepperSteps};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export { Stepper } from './Stepper';
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{createContext as w,useState as c,useEffect as d,createElement as x,useContext as T}from"react";const i=w({steps:[],goToPreviousStep:()=>null,goToNextStep:()=>null,goToStep:()=>null,activeStep:0,viewedSteps:[],allowSkip:!1}),g=({children:o,stepCount:r,allowSkip:u,onComplete:p,onStepChange:s})=>{const[t,n]=c(0),[S,l]=c([0]);d(()=>{l(e=>e.includes(t)?e:[...e,t]),s==null||s(t)},[t,s]);const a=()=>{if(p&&t===r-1)return p();if(t<r-1)return n(e=>e+1)},v=()=>{n(e=>e-1)},f=e=>{n(e)};return x(i.Provider,{value:{steps:Array(r).fill(""),goToPreviousStep:v,goToNextStep:a,goToStep:f,activeStep:t,viewedSteps:S,allowSkip:u}},o)},m=()=>{const o=T(i);if(!o)throw new Error("Ensure that you wrap any components with the root component Stepper");return o};export{g as StepperProvider,m as useStepper};
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
export declare type Context = {
|
|
2
|
+
steps: unknown[];
|
|
3
|
+
goToPreviousStep: () => void;
|
|
4
|
+
goToNextStep: () => void;
|
|
5
|
+
goToStep: (index: number) => void;
|
|
6
|
+
activeStep: number;
|
|
7
|
+
viewedSteps: number[];
|
|
8
|
+
allowSkip?: boolean;
|
|
9
|
+
};
|
|
10
|
+
export declare type StepperProviderProps = {
|
|
11
|
+
stepCount: number;
|
|
12
|
+
allowSkip?: boolean;
|
|
13
|
+
onComplete?: () => void;
|
|
14
|
+
onStepChange?: (activeStep: number) => void;
|
|
15
|
+
};
|
|
16
|
+
export interface IStepperProps {
|
|
17
|
+
stepCount: number;
|
|
18
|
+
allowSkip?: boolean;
|
|
19
|
+
onComplete?: () => void;
|
|
20
|
+
onStepChange?: (activeStep: number) => void;
|
|
21
|
+
}
|
|
22
|
+
export interface IStepperNavigateProps {
|
|
23
|
+
label: (currentStep?: number) => string;
|
|
24
|
+
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{Root as
|
|
1
|
+
import{Root as a,Thumb as n}from"@radix-ui/react-switch";import{createElement as o}from"react";import{styled as r}from"../../stitches.js";const i=r(a,{appearance:"none",backgroundColor:"$tonal200",border:"none",borderRadius:"$round",cursor:"pointer",display:"flex",overflow:"hidden",p:"$0",position:"relative",transition:"all 50ms ease-out",width:"$4","&:hover":{backgroundColor:"$tonal300"},"&:focus":{outline:"2px solid $primary",outlineOffset:"1px"},'&[data-state="checked"]':{backgroundColor:"$primary"},'&[data-state="checked"]:hover':{backgroundColor:"$primaryMid"}}),s=r(n,{backgroundColor:"white",borderRadius:"$round",display:"block",size:"$1",transition:"transform 50ms",willChange:"transform",'&[data-state="checked"]':{transform:"translateX(calc($sizes$2 - $space$1))"}}),t=e=>o(i,{...e},o(s,null));t.displayName="Switch";export{t as Switch};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
|
|
1
|
+
import{createElement as m}from"react";import{styled as s}from"../../stitches.js";import{TableBody as p}from"./TableBody.js";import{TableCell as o}from"./TableCell.js";import{TableFooter as $}from"./TableFooter.js";import{TableFooterCell as t}from"./TableFooterCell.js";import{TableHeader as b}from"./TableHeader.js";import{TableHeaderCell as r}from"./TableHeaderCell.js";import{TableRow as l}from"./TableRow.js";const f=s("table",{borderCollapse:"separate",borderSpacing:0,fontFamily:"$sans",fontSize:"$sm",width:"100%",variants:{size:{md:{[`${o}, ${r}, ${t}`]:{height:"$4"}},lg:{[`${o}, ${r}, ${t}`]:{height:"$5"}}},corners:{round:{[`${r}`]:{"&:first-of-type":{borderTopLeftRadius:"$0"},"&:last-of-type":{borderTopRightRadius:"$0"}},[`${l}:last-child`]:{[`${o}:first-child`]:{borderBottomLeftRadius:"$0"},[`${o}:last-child`]:{borderBottomRightRadius:"$0"}}},square:{}}}}),e=({size:a="md",corners:i="round",...d})=>m(f,{size:a,corners:i,...d});e.Body=p,e.Cell=o,e.Footer=$,e.FooterCell=t,e.Header=b,e.HeaderCell=r,e.Row=l,e.displayName="Table";export{e as Table};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{styled as
|
|
1
|
+
import{styled as d}from"../../stitches.js";const o=d("tbody",{});o.displayName="TableBody";export{o as TableBody};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{styled as t}from"../../stitches.js";const
|
|
1
|
+
import{styled as t}from"../../stitches.js";const l=t("td",{borderBottom:"1px solid $tonal100",boxSizing:"border-box",color:"$tonal400",fontFamily:"$body",lineHeight:1.5,p:"$2 $3",textAlign:"left",verticalAlign:"middle","&:first-child":{fontWeight:"bold"},"tr:nth-child(odd) &":{bg:"white"},"tr:nth-child(even) &":{bg:"$tonal50"}});l.displayName="TableCell";export{l as TableCell};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{styled as
|
|
1
|
+
import{styled as t}from"../../stitches.js";const o=t("tfoot",{});o.displayName="TableFooter";export{o as TableFooter};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
|
|
1
|
+
import{styled as t}from"../../stitches.js";import i from"react";import{TableHeaderCell as r}from"./TableHeaderCell.js";const l=t("thead",{variants:{theme:{primary:{[`${r}`]:{bg:"$primary"}},primaryDark:{[`${r}`]:{bg:"$primaryDark"}}}}}),e=({theme:a="primaryDark",...m})=>i.createElement(l,{theme:a,...m});e.displayName="TableHeader";export{e as TableHeader};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{styled as
|
|
1
|
+
import{styled as l}from"../../stitches.js";const e=l("th",{color:"white",fontFamily:"$body",fontWeight:600,lineHeight:1.5,p:"$2 $3",textAlign:"left",verticalAlign:"middle"});e.displayName="TableHeaderCell";export{e as TableHeaderCell};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{styled as
|
|
1
|
+
import{styled as e}from"../../stitches.js";const o=e("tr",{});o.displayName="TableRow";export{o as TableRow};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
|
|
1
|
+
import{Trigger as d}from"@radix-ui/react-tabs";import{createElement as n}from"react";import{opacify as a}from"polished";import{styled as s,theme as e}from"../../stitches.js";const c=s(d,{cursor:"pointer",flexShrink:0,fontFamily:"$body",p:"$4",height:"$5",userSelect:"none",transition:"0.3s",variants:{theme:{light:{'&[data-state="active"]':{color:"$primary",fontWeight:600,letterSpacing:"-0.005em",boxShadow:"inset 0 -2px 0 0 currentColor"},'&[data-state="inactive"]':{color:"$tonal500"},"&:not([data-disabled]):hover":{color:"$primary",bg:a(-.9,e.colors.primary.value)},"&:not([data-disabled]):active":{color:"$primary",bg:a(-.8,e.colors.primary.value),boxShadow:"none"},"&[data-disabled],&[data-disabled]:hover":{color:"$tonal200",cursor:"not-allowed"}},dark:{color:"white",'&[data-state="active"]':{fontWeight:600,letterSpacing:"-0.005em",boxShadow:"inset 0 -2px 0 0 currentColor"},"&:not([data-disabled]):hover":{bg:a(-.8,"white")},"&:not([data-disabled]):active":{bg:a(-.7,"white"),boxShadow:"none"},"&[data-disabled],&[data-disabled]:hover":{color:"$tonal200",cursor:"not-allowed"}}}}}),o=({children:t,theme:r,disabled:i=!1,...l})=>n(c,{disabled:i,theme:r,...l},t);o.displayName="TabTrigger";export{o as TabTrigger};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
|
|
1
|
+
import{Root as m,Content as n}from"@radix-ui/react-tabs";import{createElement as p}from"react";import{styled as t}from"../../stitches.js";import{TabTrigger as s}from"./TabTrigger.js";import{TriggerListWrapper as e}from"./TabsTriggerList.js";import{passPropsToChildren as g}from"./utils.js";const c=t(m,{display:"flex",flexDirection:"column",variants:{theme:{light:{color:"$primary"},dark:{color:"white"}}}}),i=t(n,{flexGrow:1,fontFamily:"$body",variants:{theme:{light:{color:"$textForeground"},dark:{bg:"$primaryDark",color:"white"}}}}),r=({theme:o="light",children:a,...l})=>p(c,{theme:o,...l},g(a,{theme:o},[e,i]));r.TriggerList=e,r.Trigger=s,r.Content=i,r.displayName="Tabs";export{r as Tabs};
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
interface ListProps extends React.ComponentProps<typeof StyledTriggerList> {
|
|
3
3
|
enableTabScrolling?: boolean;
|
|
4
|
+
scrollPercentage?: number;
|
|
4
5
|
}
|
|
5
6
|
declare const StyledTriggerList: import("@stitches/react/types/styled-component").StyledComponent<React.ForwardRefExoticComponent<import("@radix-ui/react-tabs").TabsListProps & React.RefAttributes<HTMLDivElement>>, {
|
|
6
7
|
theme?: "dark" | "light" | undefined;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
|
|
1
|
+
import{List as B}from"@radix-ui/react-tabs";import o,{useRef as P,useState as h,useCallback as F,useEffect as L}from"react";import{ChevronLeft as M,ChevronRight as X}from"@atom-learning/icons";import{opacify as W}from"polished";import{debounce as _}from"throttle-debounce";import{theme as j,styled as y}from"../../stitches.js";import{ActionIcon as q}from"../action-icon/ActionIcon.js";import{Flex as G}from"../flex/Flex.js";import{Icon as E}from"../icon/Icon.js";import{TabTrigger as k}from"./TabTrigger.js";import{passPropsToChildren as x}from"./utils.js";const H=W(-.2,"white"),J=W(-.2,j.colors.primaryDark.value),T=y(q,{position:"absolute",transition:"all 125ms",variants:{theme:{light:{bg:`${H} !important`},dark:{bg:`${J} !important`,color:"currentColor !important"}},visible:{true:{opacity:1,visibility:"visible",pointerEvents:"all"},false:{opacity:0,visibility:"hidden",pointerEvents:"none"}}}}),C=y(B,{flexShrink:0,display:"flex",width:"100%",overflowX:"auto","&::-webkit-scrollbar":{display:"none"},scrollbarWidth:"none",variants:{theme:{light:{borderBottom:"1px solid $tonal300"},dark:{bg:"$primaryDark",borderBottom:"1px solid $tonal200"}},appearance:{uppercase:{textTransform:"uppercase"}}}}),K=({children:d,theme:l,appearance:p,enableTabScrolling:z,scrollPercentage:R=10,...u})=>{const n=P(null),[g,c]=h(!1),[v,a]=h(!1),[$,A]=h(),b=F(t=>{const e=n.current;if(e){const{scrollWidth:i,scrollLeft:s,offsetWidth:f}=e,w=Math.round(i*(R/100));let m=s;if(t==="right"){const r=s+w;m=r+f<=i?r:i-f}else{const r=s-w;m=r>0?r:0}e.scroll({left:m,behavior:"smooth"}),setTimeout(()=>{const{scrollWidth:r,scrollLeft:S,offsetWidth:D}=e,I=r-(S+D);S===0?(c(!1),a(!0)):I<5?(a(!1),c(!0)):(c(!0),a(!0))},500)}},[]);return L(()=>{const t=_(500,()=>{A(window.innerWidth)});return window.addEventListener("resize",t),()=>{window.removeEventListener("resize",t)}},[]),L(()=>{var t;const e=n.current;if(e){const{offsetWidth:i,scrollWidth:s}=e,f=s>i;(t=e.scroll)==null||t.call(e,{left:0}),c(!1),a(f)}},[$]),g||v||z?o.createElement(G,{css:{position:"relative"}},o.createElement(T,{size:"xl",label:"Scroll Left",theme:l,onClick:()=>b("left"),visible:g,css:{left:0}},o.createElement(E,{is:M,size:"lg"})),o.createElement(C,{...u,ref:n,appearance:p,theme:l},x(d,{theme:l},[k])),o.createElement(T,{size:"xl",label:"Scroll right",theme:l,onClick:()=>b("right"),visible:v,css:{right:0}},o.createElement(E,{is:X,size:"lg"}))):o.createElement(C,{theme:l,...u,appearance:p,ref:n},x(d,{theme:l},[k]))};export{K as TriggerListWrapper};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
|
|
1
|
+
import r from"react";const p=(n,t,o=[])=>r.Children.map(n,e=>r.isValidElement(e)&&o.includes(e==null?void 0:e.type)?r.cloneElement(e,{...t}):e);export{p as passPropsToChildren};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
|
|
1
|
+
import{forwardRef as f,createElement as l}from"react";import{styled as g}from"../../stitches.js";import{capsize as e}from"../../utilities/style/capsize.js";const i=({applyCapsize:t=!0}={})=>({xs:{fontSize:"$xs",lineHeight:1.6,...t?e(.4364):{}},sm:{fontSize:"$sm",lineHeight:1.53,...t?e(.4056):{}},md:{fontSize:"$md",lineHeight:1.5,...t?e(.3864):{}},lg:{fontSize:"$lg",lineHeight:1.52,...t?e(.3983):{}},xl:{fontSize:"$xl",lineHeight:1.42,...t?e(.3506):{}}}),o=g("p",{color:"$tonal600",fontFamily:"$body",fontWeight:400,margin:0,"& > &":{"&:before, &:after":{display:"none"}},variants:{size:i()}}),n=f(({size:t="md",...r},m)=>l(o,{size:t,...r,ref:m}));n.displayName="Text";export{o as StyledParagraph,n as Text,i as textVariantSize};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{forwardRef as
|
|
1
|
+
import{forwardRef as a,createElement as t}from"react";import{styled as l}from"../../stitches.js";const n=l("textarea",{boxShadow:"none",fontSize:"$md",appearance:"none",border:"1px solid $tonal400",borderRadius:"$0",boxSizing:"border-box",color:"$tonal600",fontFamily:"$body",fontWeight:400,lineHeight:1.4,minHeight:"$7",px:"$3",py:"calc($2 + $1)",resize:"vertical",transition:"all 75ms ease-out",width:"100%","&:focus":{borderColor:"$primary",outline:"none"},"&[disabled]":{backgroundColor:"$tonal100",color:"$tonal400",cursor:"not-allowed"},"&::placeholder":{color:"$tonal300",opacity:1},variants:{state:{error:{border:"1px solid $danger"}}}}),o=a((e,r)=>t(n,{...e,ref:r}));o.displayName="Textarea";export{o as Textarea};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
|
|
1
|
+
import{createElement as i}from"react";import{useFormContext as c}from"react-hook-form";import{FieldWrapper as x}from"../field-wrapper/FieldWrapper.js";import"../field-wrapper/InlineFieldWrapper.js";import"../form/Form.js";import{useFieldError as F}from"../form/useFieldError.js";import{Textarea as a}from"../textarea/Textarea.js";const m=({css:p=void 0,label:d,name:r,validation:e,prompt:s,description:f,...l})=>{const{register:o}=c(),{error:t}=F(r),u=e?o(e):o;return i(x,{css:p,description:f,error:t,fieldId:r,label:d,prompt:s,required:Boolean(e==null?void 0:e.required)},i(a,{id:r,name:r,ref:u,...t&&{state:"error"},...l}))};m.displayName="TextareaField";export{m as TextareaField};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{Error as
|
|
1
|
+
import{Error as g,Close as $}from"@atom-learning/icons";import{memo as h,createElement as o}from"react";import{toast as y}from"react-hot-toast";import{keyframes as i,styled as a}from"../../stitches.js";import{ActionIcon as v}from"../action-icon/ActionIcon.js";import{Icon as e}from"../icon/Icon.js";import{Loader as w}from"../loader/Loader.js";import{Text as x}from"../text/Text.js";const n=400,T=i({"0%":{transform:"translate3d(0,-100%,0)",opacity:0},"100%":{transform:"translate3d(0,0,0)",opacity:1}}),k=i({"0%":{transform:"translate3d(0,0,0)",opacity:1},"100%":{transform:"translate3d(0,-100%,0)",opacity:0}}),C=a("div",{position:"absolute",width:"100%",variants:{visible:{true:{"@allowMotion":{animation:`${T} 250ms cubic-bezier(0.22, 1, 0.36, 1)`}},false:{opacity:0,"@allowMotion":{animation:`${k} 250ms cubic-bezier(0.22, 1, 0.36, 1)`}}}}}),I=a("div",{alignItems:"center",borderRadius:"$0",boxShadow:"$1",boxSizing:"border-box",color:"white",display:"flex",minHeight:"$5",pl:"$4",position:"relative",pr:"$6",py:"$4",transition:"background-color 50ms ease-out",width:"100%","@sm":{width:n},"@allowMotion":{transition:"background-color 50ms ease-out, transform 150ms ease-out"},variants:{status:{blank:{bg:"$primary"},error:{bg:"$danger"},loading:{bg:"$primary"},success:{bg:"$success"}}}}),z=h(({ariaLive:l,height:m,id:t,message:c,role:d,type:r="blank",visible:f,calculateOffset:p,updateHeight:u})=>{const b=p(t,{reverseOrder:!0,margin:8});return o(C,{visible:f},o(I,{ref:s=>{s&&m===void 0&&u(t,s.getBoundingClientRect().height)},status:r,role:d,"aria-live":l,style:{transform:`translateY(${b}px)`}},r==="error"&&o(e,{size:"sm",css:{mr:"$3",flex:"0 0 auto"},is:g}),o(x,{css:{color:"inherit"}},c),r==="loading"?o(w,{css:{flex:"0 0 auto",ml:"auto"}}):o(v,{css:{position:"absolute",top:"$2",right:"$2",color:"white","&:hover,&:focus":{color:"white",opacity:.5}},label:"Close alert",onClick:()=>y.dismiss(t)},o(e,{is:$}))))});export{n as TOAST_WIDTH,z as Toast};
|