raft-ui 0.0.1 → 0.0.4

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.
@@ -0,0 +1,34 @@
1
+ import { cn } from "cnfast";
2
+ import { tv } from "tailwind-variants/lite";
3
+ import { createContext, use } from "react";
4
+ //#region src/lib/tv.ts
5
+ const tv$1 = ((options) => {
6
+ const recipe = tv(options);
7
+ const wrappedRecipe = ((props) => {
8
+ const result = recipe(props);
9
+ if (typeof result === "string") return cn(result);
10
+ return Object.fromEntries(Object.entries(result).map(([slotName, slot]) => [slotName, (slotProps) => cn(slot(slotProps))]));
11
+ });
12
+ return Object.assign(wrappedRecipe, recipe);
13
+ });
14
+ //#endregion
15
+ //#region src/lib/theme/theme-context.ts
16
+ const ThemeContext = createContext("brutal");
17
+ const ThemeStateContext = createContext({
18
+ theme: "brutal",
19
+ setTheme: () => void 0,
20
+ mode: "light",
21
+ resolvedMode: "light"
22
+ });
23
+ //#endregion
24
+ //#region src/lib/theme/use-theme.ts
25
+ /** Read the active style family for theme-aware component recipes. */
26
+ function useThemeFamily() {
27
+ return use(ThemeContext);
28
+ }
29
+ /** Read and update the application-level RUI theme selection. */
30
+ function useTheme() {
31
+ return use(ThemeStateContext);
32
+ }
33
+ //#endregion
34
+ export { tv$1 as a, ThemeStateContext as i, useThemeFamily as n, ThemeContext as r, useTheme as t };
package/dist/wip.d.mts CHANGED
@@ -1,332 +1,10 @@
1
1
  import { n as VariantProps, t as StyledProps } from "./styled-props-B3SNekJg.mjs";
2
2
  import { ComponentPropsWithRef, ReactNode } from "react";
3
3
  import { useRender } from "@base-ui/react/use-render";
4
- import { Field as Field$1 } from "@base-ui/react/field";
5
4
  import { Toggle } from "@base-ui/react/toggle";
6
5
  import { ToggleGroup as ToggleGroup$1 } from "@base-ui/react/toggle-group";
7
6
  import { Dialog } from "@base-ui/react/dialog";
8
7
 
9
- //#region src/components/field/field.d.ts
10
- declare const field: import("tailwind-variants/lite").TVReturnType<{
11
- theme: {
12
- brutal: {
13
- root: string[];
14
- label: string[];
15
- description: string[];
16
- error: string[];
17
- };
18
- elegant: {
19
- label: string[];
20
- description: string[];
21
- error: string[];
22
- };
23
- };
24
- size: {
25
- sm: {
26
- label: string;
27
- };
28
- md: {
29
- label: string;
30
- };
31
- };
32
- }, {
33
- root: string[];
34
- item: string[];
35
- label: string[];
36
- description: string[];
37
- error: string[];
38
- }, undefined, {
39
- theme: {
40
- brutal: {
41
- root: string[];
42
- label: string[];
43
- description: string[];
44
- error: string[];
45
- };
46
- elegant: {
47
- label: string[];
48
- description: string[];
49
- error: string[];
50
- };
51
- };
52
- size: {
53
- sm: {
54
- label: string;
55
- };
56
- md: {
57
- label: string;
58
- };
59
- };
60
- }, {
61
- root: string[];
62
- item: string[];
63
- label: string[];
64
- description: string[];
65
- error: string[];
66
- }, import("tailwind-variants/lite").TVReturnType<{
67
- theme: {
68
- brutal: {
69
- root: string[];
70
- label: string[];
71
- description: string[];
72
- error: string[];
73
- };
74
- elegant: {
75
- label: string[];
76
- description: string[];
77
- error: string[];
78
- };
79
- };
80
- size: {
81
- sm: {
82
- label: string;
83
- };
84
- md: {
85
- label: string;
86
- };
87
- };
88
- }, {
89
- root: string[];
90
- item: string[];
91
- label: string[];
92
- description: string[];
93
- error: string[];
94
- }, undefined, unknown, unknown, undefined>>;
95
- type FieldProps = StyledProps<Field$1.Root.Props>;
96
- declare function Field({
97
- className,
98
- ...props
99
- }: FieldProps): import("react").JSX.Element;
100
- type FieldItemProps = StyledProps<Field$1.Item.Props>;
101
- declare function FieldItem({
102
- className,
103
- ...props
104
- }: FieldItemProps): import("react").JSX.Element;
105
- type LabelMarker = {
106
- required?: boolean;
107
- optional?: never;
108
- } | {
109
- optional?: boolean;
110
- required?: never;
111
- };
112
- type FieldLabelProps = StyledProps<Field$1.Label.Props> & Omit<VariantProps<typeof field>, "theme"> & LabelMarker;
113
- declare function FieldLabel({
114
- size,
115
- required,
116
- optional,
117
- className,
118
- children,
119
- ...props
120
- }: FieldLabelProps): import("react").JSX.Element;
121
- type FieldDescriptionProps = StyledProps<Field$1.Description.Props>;
122
- declare function FieldDescription({
123
- className,
124
- ...props
125
- }: FieldDescriptionProps): import("react").JSX.Element;
126
- type FieldErrorProps = StyledProps<Field$1.Error.Props>;
127
- declare function FieldError({
128
- className,
129
- role,
130
- ...props
131
- }: FieldErrorProps): import("react").JSX.Element;
132
- type FieldControlProps = Field$1.Control.Props;
133
- declare function FieldControl(props: FieldControlProps): import("react").JSX.Element;
134
- type FieldValidityProps = Field$1.Validity.Props;
135
- declare function FieldValidity(props: FieldValidityProps): import("react").JSX.Element;
136
- //#endregion
137
- //#region src/components/text/text.d.ts
138
- declare const heading: import("tailwind-variants/lite").TVReturnType<{
139
- level: {
140
- 1: string[];
141
- 2: string[];
142
- 3: string[];
143
- 4: string[];
144
- 5: string[];
145
- 6: string[];
146
- };
147
- variant: {
148
- default: string[];
149
- primary: string[];
150
- information: string[];
151
- muted: string[];
152
- accent: string[];
153
- success: string[];
154
- warning: string[];
155
- danger: string[];
156
- };
157
- }, undefined, string[], {
158
- level: {
159
- 1: string[];
160
- 2: string[];
161
- 3: string[];
162
- 4: string[];
163
- 5: string[];
164
- 6: string[];
165
- };
166
- variant: {
167
- default: string[];
168
- primary: string[];
169
- information: string[];
170
- muted: string[];
171
- accent: string[];
172
- success: string[];
173
- warning: string[];
174
- danger: string[];
175
- };
176
- }, undefined, import("tailwind-variants/lite").TVReturnType<{
177
- level: {
178
- 1: string[];
179
- 2: string[];
180
- 3: string[];
181
- 4: string[];
182
- 5: string[];
183
- 6: string[];
184
- };
185
- variant: {
186
- default: string[];
187
- primary: string[];
188
- information: string[];
189
- muted: string[];
190
- accent: string[];
191
- success: string[];
192
- warning: string[];
193
- danger: string[];
194
- };
195
- }, undefined, string[], unknown, unknown, undefined>>;
196
- declare const sans: import("tailwind-variants/lite").TVReturnType<{
197
- size: {
198
- large: string[];
199
- body: string[];
200
- small: string[];
201
- caption: string[];
202
- };
203
- variant: {
204
- default: string[];
205
- primary: string[];
206
- information: string[];
207
- muted: string[];
208
- accent: string[];
209
- success: string[];
210
- warning: string[];
211
- danger: string[];
212
- };
213
- }, undefined, string[], {
214
- size: {
215
- large: string[];
216
- body: string[];
217
- small: string[];
218
- caption: string[];
219
- };
220
- variant: {
221
- default: string[];
222
- primary: string[];
223
- information: string[];
224
- muted: string[];
225
- accent: string[];
226
- success: string[];
227
- warning: string[];
228
- danger: string[];
229
- };
230
- }, undefined, import("tailwind-variants/lite").TVReturnType<{
231
- size: {
232
- large: string[];
233
- body: string[];
234
- small: string[];
235
- caption: string[];
236
- };
237
- variant: {
238
- default: string[];
239
- primary: string[];
240
- information: string[];
241
- muted: string[];
242
- accent: string[];
243
- success: string[];
244
- warning: string[];
245
- danger: string[];
246
- };
247
- }, undefined, string[], unknown, unknown, undefined>>;
248
- declare const mono: import("tailwind-variants/lite").TVReturnType<{
249
- size: {
250
- code: string[];
251
- meta: string[];
252
- eyebrow: string[];
253
- tabular: string[];
254
- };
255
- variant: {
256
- default: string[];
257
- primary: string[];
258
- information: string[];
259
- muted: string[];
260
- accent: string[];
261
- success: string[];
262
- warning: string[];
263
- danger: string[];
264
- };
265
- }, undefined, string[], {
266
- size: {
267
- code: string[];
268
- meta: string[];
269
- eyebrow: string[];
270
- tabular: string[];
271
- };
272
- variant: {
273
- default: string[];
274
- primary: string[];
275
- information: string[];
276
- muted: string[];
277
- accent: string[];
278
- success: string[];
279
- warning: string[];
280
- danger: string[];
281
- };
282
- }, undefined, import("tailwind-variants/lite").TVReturnType<{
283
- size: {
284
- code: string[];
285
- meta: string[];
286
- eyebrow: string[];
287
- tabular: string[];
288
- };
289
- variant: {
290
- default: string[];
291
- primary: string[];
292
- information: string[];
293
- muted: string[];
294
- accent: string[];
295
- success: string[];
296
- warning: string[];
297
- danger: string[];
298
- };
299
- }, undefined, string[], unknown, unknown, undefined>>;
300
- type TextHeadingProps = useRender.ComponentProps<"h1"> & VariantProps<typeof heading>;
301
- declare function TextHeading({
302
- level,
303
- variant,
304
- className,
305
- render,
306
- ...props
307
- }: TextHeadingProps): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
308
- type TextSansProps = useRender.ComponentProps<"p"> & VariantProps<typeof sans>;
309
- declare function TextSans({
310
- size,
311
- variant,
312
- className,
313
- render,
314
- ...props
315
- }: TextSansProps): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
316
- type TextMonoProps = useRender.ComponentProps<"p"> & VariantProps<typeof mono>;
317
- declare function TextMono({
318
- size,
319
- variant,
320
- className,
321
- render,
322
- ...props
323
- }: TextMonoProps): import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>>;
324
- declare const Text: {
325
- Heading: typeof TextHeading;
326
- Sans: typeof TextSans;
327
- Mono: typeof TextMono;
328
- };
329
- //#endregion
330
8
  //#region src/components/toggle-group/toggle-group.d.ts
331
9
  declare const toggleGroup: import("tailwind-variants/lite").TVReturnType<{
332
10
  theme: {
@@ -1235,4 +913,4 @@ declare function BottomSheetDescription({
1235
913
  ...props
1236
914
  }: BottomSheetDescriptionProps): import("react").JSX.Element;
1237
915
  //#endregion
1238
- export { BottomSheet, BottomSheetClose, type BottomSheetCloseProps, BottomSheetContent, type BottomSheetContentProps, BottomSheetDescription, type BottomSheetDescriptionProps, BottomSheetFooter, type BottomSheetFooterProps, BottomSheetHeader, type BottomSheetHeaderProps, BottomSheetPortal, type BottomSheetPortalProps, type BottomSheetProps, BottomSheetTitle, type BottomSheetTitleProps, BottomSheetTrigger, type BottomSheetTriggerProps, ConversationPreviewCard, ConversationPreviewCardAction, type ConversationPreviewCardActionProps, ConversationPreviewCardAuthor, ConversationPreviewCardAuthorName, type ConversationPreviewCardAuthorNameProps, type ConversationPreviewCardAuthorProps, ConversationPreviewCardAuthorSubtitle, type ConversationPreviewCardAuthorSubtitleProps, ConversationPreviewCardChannel, type ConversationPreviewCardChannelProps, ConversationPreviewCardContent, type ConversationPreviewCardContentProps, ConversationPreviewCardFooter, type ConversationPreviewCardFooterProps, ConversationPreviewCardMeta, type ConversationPreviewCardMetaProps, ConversationPreviewCardPreview, ConversationPreviewCardPreviewAuthor, type ConversationPreviewCardPreviewAuthorProps, ConversationPreviewCardPreviewLeading, type ConversationPreviewCardPreviewLeadingProps, type ConversationPreviewCardPreviewProps, type ConversationPreviewCardProps, ConversationPreviewCardSecondaryPreview, type ConversationPreviewCardSecondaryPreviewProps, ConversationPreviewCardTimestamp, type ConversationPreviewCardTimestampProps, DescriptionAction, type DescriptionActionProps, DescriptionDetails, type DescriptionDetailsProps, DescriptionItem, type DescriptionItemProps, DescriptionList, type DescriptionListProps, DescriptionTerm, type DescriptionTermProps, Field, FieldControl, type FieldControlProps, FieldDescription, type FieldDescriptionProps, FieldError, type FieldErrorProps, FieldItem, type FieldItemProps, FieldLabel, type FieldLabelProps, type FieldProps, FieldValidity, type FieldValidityProps, Lightbox, LightboxActions, type LightboxActionsProps, LightboxClose, type LightboxCloseProps, LightboxContent, type LightboxContentProps, LightboxHeader, type LightboxHeaderProps, LightboxMedia, type LightboxMediaProps, LightboxPortal, type LightboxPortalProps, type LightboxProps, LightboxStage, type LightboxStageProps, LightboxTitle, type LightboxTitleProps, LightboxTrigger, type LightboxTriggerProps, ListItem, ListItemActionGroup, type ListItemActionGroupProps, ListItemBody, type ListItemBodyProps, ListItemDescription, type ListItemDescriptionProps, ListItemIcon, type ListItemIconProps, ListItemMeta, type ListItemMetaProps, type ListItemProps, ListItemRow, type ListItemRowProps, ListItemTitle, type ListItemTitleProps, MediaListItem, MediaListItemActionGroup, type MediaListItemActionGroupProps, MediaListItemAside, type MediaListItemAsideProps, MediaListItemBody, type MediaListItemBodyProps, type MediaListItemProps, MediaListItemSubtitle, type MediaListItemSubtitleProps, MediaListItemText, type MediaListItemTextProps, MediaListItemTitle, type MediaListItemTitleProps, MediaListItemVisual, type MediaListItemVisualProps, PanelHeader, PanelHeaderActions, type PanelHeaderActionsProps, PanelHeaderContent, type PanelHeaderContentProps, PanelHeaderIcon, type PanelHeaderIconProps, type PanelHeaderProps, PanelHeaderSubtitle, type PanelHeaderSubtitleProps, PanelHeaderSuffix, type PanelHeaderSuffixProps, PanelHeaderTitle, type PanelHeaderTitleProps, PanelHeaderTitleRow, type PanelHeaderTitleRowProps, PanelHeaderVisual, type PanelHeaderVisualProps, PreviewShell, type PreviewShellProps, QuotedMessageCard, QuotedMessageCardAttachments, type QuotedMessageCardAttachmentsProps, QuotedMessageCardAuthor, QuotedMessageCardAuthorName, type QuotedMessageCardAuthorNameProps, type QuotedMessageCardAuthorProps, QuotedMessageCardAuthorSubtitle, type QuotedMessageCardAuthorSubtitleProps, QuotedMessageCardBody, type QuotedMessageCardBodyProps, QuotedMessageCardChannel, type QuotedMessageCardChannelProps, QuotedMessageCardContent, type QuotedMessageCardContentProps, QuotedMessageCardContentWrap, type QuotedMessageCardContentWrapProps, QuotedMessageCardHeader, type QuotedMessageCardHeaderProps, QuotedMessageCardMeta, type QuotedMessageCardMetaProps, type QuotedMessageCardProps, QuotedMessageCardSeparator, type QuotedMessageCardSeparatorProps, QuotedMessageCardTag, type QuotedMessageCardTagProps, QuotedMessageCardThread, type QuotedMessageCardThreadProps, QuotedMessageCardTimestamp, type QuotedMessageCardTimestampProps, QuotedMessageCardUnavailable, type QuotedMessageCardUnavailableProps, SectionHeader, SectionHeaderActions, type SectionHeaderActionsProps, SectionHeaderContent, type SectionHeaderContentProps, SectionHeaderCount, type SectionHeaderCountProps, SectionHeaderIcon, type SectionHeaderIconProps, type SectionHeaderProps, SectionHeaderTitle, type SectionHeaderTitleProps, SectionLabel, type SectionLabelProps, Text, TextHeading, type TextHeadingProps, TextMono, type TextMonoProps, TextSans, type TextSansProps, ToggleGroup, ToggleGroupCount, type ToggleGroupCountProps, ToggleGroupItem, type ToggleGroupItemProps, ToggleGroupLabel, type ToggleGroupLabelProps, type ToggleGroupProps };
916
+ export { BottomSheet, BottomSheetClose, type BottomSheetCloseProps, BottomSheetContent, type BottomSheetContentProps, BottomSheetDescription, type BottomSheetDescriptionProps, BottomSheetFooter, type BottomSheetFooterProps, BottomSheetHeader, type BottomSheetHeaderProps, BottomSheetPortal, type BottomSheetPortalProps, type BottomSheetProps, BottomSheetTitle, type BottomSheetTitleProps, BottomSheetTrigger, type BottomSheetTriggerProps, ConversationPreviewCard, ConversationPreviewCardAction, type ConversationPreviewCardActionProps, ConversationPreviewCardAuthor, ConversationPreviewCardAuthorName, type ConversationPreviewCardAuthorNameProps, type ConversationPreviewCardAuthorProps, ConversationPreviewCardAuthorSubtitle, type ConversationPreviewCardAuthorSubtitleProps, ConversationPreviewCardChannel, type ConversationPreviewCardChannelProps, ConversationPreviewCardContent, type ConversationPreviewCardContentProps, ConversationPreviewCardFooter, type ConversationPreviewCardFooterProps, ConversationPreviewCardMeta, type ConversationPreviewCardMetaProps, ConversationPreviewCardPreview, ConversationPreviewCardPreviewAuthor, type ConversationPreviewCardPreviewAuthorProps, ConversationPreviewCardPreviewLeading, type ConversationPreviewCardPreviewLeadingProps, type ConversationPreviewCardPreviewProps, type ConversationPreviewCardProps, ConversationPreviewCardSecondaryPreview, type ConversationPreviewCardSecondaryPreviewProps, ConversationPreviewCardTimestamp, type ConversationPreviewCardTimestampProps, DescriptionAction, type DescriptionActionProps, DescriptionDetails, type DescriptionDetailsProps, DescriptionItem, type DescriptionItemProps, DescriptionList, type DescriptionListProps, DescriptionTerm, type DescriptionTermProps, Lightbox, LightboxActions, type LightboxActionsProps, LightboxClose, type LightboxCloseProps, LightboxContent, type LightboxContentProps, LightboxHeader, type LightboxHeaderProps, LightboxMedia, type LightboxMediaProps, LightboxPortal, type LightboxPortalProps, type LightboxProps, LightboxStage, type LightboxStageProps, LightboxTitle, type LightboxTitleProps, LightboxTrigger, type LightboxTriggerProps, ListItem, ListItemActionGroup, type ListItemActionGroupProps, ListItemBody, type ListItemBodyProps, ListItemDescription, type ListItemDescriptionProps, ListItemIcon, type ListItemIconProps, ListItemMeta, type ListItemMetaProps, type ListItemProps, ListItemRow, type ListItemRowProps, ListItemTitle, type ListItemTitleProps, MediaListItem, MediaListItemActionGroup, type MediaListItemActionGroupProps, MediaListItemAside, type MediaListItemAsideProps, MediaListItemBody, type MediaListItemBodyProps, type MediaListItemProps, MediaListItemSubtitle, type MediaListItemSubtitleProps, MediaListItemText, type MediaListItemTextProps, MediaListItemTitle, type MediaListItemTitleProps, MediaListItemVisual, type MediaListItemVisualProps, PanelHeader, PanelHeaderActions, type PanelHeaderActionsProps, PanelHeaderContent, type PanelHeaderContentProps, PanelHeaderIcon, type PanelHeaderIconProps, type PanelHeaderProps, PanelHeaderSubtitle, type PanelHeaderSubtitleProps, PanelHeaderSuffix, type PanelHeaderSuffixProps, PanelHeaderTitle, type PanelHeaderTitleProps, PanelHeaderTitleRow, type PanelHeaderTitleRowProps, PanelHeaderVisual, type PanelHeaderVisualProps, PreviewShell, type PreviewShellProps, QuotedMessageCard, QuotedMessageCardAttachments, type QuotedMessageCardAttachmentsProps, QuotedMessageCardAuthor, QuotedMessageCardAuthorName, type QuotedMessageCardAuthorNameProps, type QuotedMessageCardAuthorProps, QuotedMessageCardAuthorSubtitle, type QuotedMessageCardAuthorSubtitleProps, QuotedMessageCardBody, type QuotedMessageCardBodyProps, QuotedMessageCardChannel, type QuotedMessageCardChannelProps, QuotedMessageCardContent, type QuotedMessageCardContentProps, QuotedMessageCardContentWrap, type QuotedMessageCardContentWrapProps, QuotedMessageCardHeader, type QuotedMessageCardHeaderProps, QuotedMessageCardMeta, type QuotedMessageCardMetaProps, type QuotedMessageCardProps, QuotedMessageCardSeparator, type QuotedMessageCardSeparatorProps, QuotedMessageCardTag, type QuotedMessageCardTagProps, QuotedMessageCardThread, type QuotedMessageCardThreadProps, QuotedMessageCardTimestamp, type QuotedMessageCardTimestampProps, QuotedMessageCardUnavailable, type QuotedMessageCardUnavailableProps, SectionHeader, SectionHeaderActions, type SectionHeaderActionsProps, SectionHeaderContent, type SectionHeaderContentProps, SectionHeaderCount, type SectionHeaderCountProps, SectionHeaderIcon, type SectionHeaderIconProps, type SectionHeaderProps, SectionHeaderTitle, type SectionHeaderTitleProps, SectionLabel, type SectionLabelProps, ToggleGroup, ToggleGroupCount, type ToggleGroupCountProps, ToggleGroupItem, type ToggleGroupItemProps, ToggleGroupLabel, type ToggleGroupLabelProps, type ToggleGroupProps };
package/dist/wip.mjs CHANGED
@@ -1,4 +1,4 @@
1
- import { l as tv, n as LabelAsterisk, o as useThemeFamily, r as LabelOptional } from "./label-DWq4ia5I.mjs";
1
+ import { a as tv, n as useThemeFamily } from "./use-theme-Y_h1DKll.mjs";
2
2
  import { cn } from "./cn.mjs";
3
3
  import { Button } from "@base-ui/react/button";
4
4
  import { useCallback, useRef, useState } from "react";
@@ -6,212 +6,10 @@ import { mergeProps } from "@base-ui/react/merge-props";
6
6
  import { useRender } from "@base-ui/react/use-render";
7
7
  import { Fragment, jsx, jsxs } from "react/jsx-runtime";
8
8
  import { MessageSquare } from "lucide-react";
9
- import { Field as Field$1 } from "@base-ui/react/field";
10
9
  import { Toggle } from "@base-ui/react/toggle";
11
10
  import { ToggleGroup as ToggleGroup$1 } from "@base-ui/react/toggle-group";
12
11
  import { Dialog } from "@base-ui/react/dialog";
13
12
  import { useHotkey } from "@tanstack/react-hotkeys";
14
- //#region src/components/field/field.tsx
15
- const field = tv({
16
- slots: {
17
- root: ["group/field flex flex-col gap-1.5"],
18
- item: ["group/field-item flex items-start gap-2", "[&>[data-slot=checkbox]]:mt-px"],
19
- label: ["block leading-none", "group-data-[disabled]/field:text-foreground-disabled"],
20
- description: ["text-xs leading-5", "group-data-[disabled]/field:text-foreground-disabled"],
21
- error: ["text-xs leading-5", "group-data-[disabled]/field:text-foreground-disabled"]
22
- },
23
- variants: {
24
- theme: {
25
- brutal: {
26
- root: ["gap-1"],
27
- label: ["font-bold text-foreground-strong"],
28
- description: ["text-foreground/50"],
29
- error: ["text-danger-base"]
30
- },
31
- elegant: {
32
- label: ["font-medium text-foreground"],
33
- description: ["text-[13px] text-[oklch(0.48_0_0)] dark:text-[oklch(0.76_0_0)]", "group-data-[disabled]/field:text-foreground-disabled"],
34
- error: ["text-[13px] text-danger-base"]
35
- }
36
- },
37
- size: {
38
- sm: { label: "text-xs" },
39
- md: { label: "text-sm" }
40
- }
41
- },
42
- compoundVariants: [{
43
- theme: "brutal",
44
- size: "sm",
45
- class: { label: "text-foreground/60" }
46
- }],
47
- defaultVariants: { size: "md" }
48
- });
49
- function Field({ className, ...props }) {
50
- const { root } = field({ theme: useThemeFamily() });
51
- return /* @__PURE__ */ jsx(Field$1.Root, {
52
- "data-slot": "field",
53
- className: root({ className }),
54
- ...props
55
- });
56
- }
57
- function FieldItem({ className, ...props }) {
58
- const { item } = field({ theme: useThemeFamily() });
59
- return /* @__PURE__ */ jsx(Field$1.Item, {
60
- "data-slot": "field-item",
61
- className: item({ className }),
62
- ...props
63
- });
64
- }
65
- function FieldLabel({ size, required, optional, className, children, ...props }) {
66
- const { label } = field({
67
- theme: useThemeFamily(),
68
- size
69
- });
70
- return /* @__PURE__ */ jsxs(Field$1.Label, {
71
- "data-slot": "field-label",
72
- className: label({ className }),
73
- ...props,
74
- children: [
75
- children,
76
- required ? /* @__PURE__ */ jsx(LabelAsterisk, { className: "ml-1" }) : null,
77
- optional ? /* @__PURE__ */ jsx(LabelOptional, { className: "ml-1" }) : null
78
- ]
79
- });
80
- }
81
- function FieldDescription({ className, ...props }) {
82
- const { description } = field({ theme: useThemeFamily() });
83
- return /* @__PURE__ */ jsx(Field$1.Description, {
84
- "data-slot": "field-description",
85
- className: description({ className }),
86
- ...props
87
- });
88
- }
89
- function FieldError({ className, role = "alert", ...props }) {
90
- const { error } = field({ theme: useThemeFamily() });
91
- return /* @__PURE__ */ jsx(Field$1.Error, {
92
- "data-slot": "field-error",
93
- role,
94
- className: error({ className }),
95
- ...props
96
- });
97
- }
98
- function FieldControl(props) {
99
- return /* @__PURE__ */ jsx(Field$1.Control, {
100
- "data-slot": "field-control",
101
- ...props
102
- });
103
- }
104
- function FieldValidity(props) {
105
- return /* @__PURE__ */ jsx(Field$1.Validity, { ...props });
106
- }
107
- //#endregion
108
- //#region src/components/text/text.tsx
109
- const textColorVariants = {
110
- default: ["text-foreground-strong"],
111
- primary: ["text-primary-700"],
112
- information: ["text-info-dark"],
113
- muted: ["text-foreground-muted"],
114
- accent: ["text-accent-700"],
115
- success: ["text-success-base"],
116
- warning: ["text-warning-base"],
117
- danger: ["text-danger-base"]
118
- };
119
- const heading = tv({
120
- base: ["m-0 font-heading font-medium text-foreground-strong"],
121
- variants: {
122
- level: {
123
- 1: ["text-[3.5rem] tracking-[-0.01em] leading-[64px]"],
124
- 2: ["text-[3rem] tracking-[-0.01em] leading-[56px]"],
125
- 3: ["text-[2.5rem] tracking-[-0.01em] leading-[48px]"],
126
- 4: ["text-[2rem] tracking-[-0.005em] leading-[40px]"],
127
- 5: ["text-[1.5rem] leading-8"],
128
- 6: ["text-[1.25rem] leading-7"]
129
- },
130
- variant: textColorVariants
131
- },
132
- defaultVariants: { level: 1 }
133
- });
134
- const sans = tv({
135
- base: ["m-0 font-sans font-normal"],
136
- variants: {
137
- size: {
138
- large: ["text-lg leading-7 text-foreground"],
139
- body: ["text-base leading-6 text-foreground"],
140
- small: ["text-sm leading-5 text-foreground-muted"],
141
- caption: ["text-xs leading-4 text-foreground-muted"]
142
- },
143
- variant: textColorVariants
144
- },
145
- defaultVariants: { size: "body" }
146
- });
147
- const mono = tv({
148
- base: ["m-0 font-mono font-normal"],
149
- variants: {
150
- size: {
151
- code: ["text-sm leading-5 text-foreground"],
152
- meta: ["text-xs leading-4 text-foreground-muted"],
153
- eyebrow: ["text-[10px] font-medium uppercase tracking-wide leading-none", "text-foreground-placeholder"],
154
- tabular: ["text-sm tabular-nums leading-5 text-foreground"]
155
- },
156
- variant: textColorVariants
157
- },
158
- defaultVariants: { size: "code" }
159
- });
160
- function TextHeading({ level = 1, variant, className, render, ...props }) {
161
- const defaultProps = { className: heading({
162
- level,
163
- variant,
164
- className
165
- }) };
166
- return useRender({
167
- defaultTagName: `h${level}`,
168
- render,
169
- props: mergeProps(defaultProps, props),
170
- state: {
171
- slot: "text-heading",
172
- level,
173
- variant
174
- }
175
- });
176
- }
177
- function TextSans({ size = "body", variant, className, render, ...props }) {
178
- return useRender({
179
- defaultTagName: "p",
180
- render,
181
- props: mergeProps({ className: sans({
182
- size,
183
- variant,
184
- className
185
- }) }, props),
186
- state: {
187
- slot: "text-sans",
188
- size,
189
- variant
190
- }
191
- });
192
- }
193
- function TextMono({ size = "code", variant, className, render, ...props }) {
194
- return useRender({
195
- defaultTagName: "p",
196
- render,
197
- props: mergeProps({ className: mono({
198
- size,
199
- variant,
200
- className
201
- }) }, props),
202
- state: {
203
- slot: "text-mono",
204
- size,
205
- variant
206
- }
207
- });
208
- }
209
- const Text = {
210
- Heading: TextHeading,
211
- Sans: TextSans,
212
- Mono: TextMono
213
- };
214
- //#endregion
215
13
  //#region src/components/toggle-group/toggle-group.tsx
216
14
  const toggleGroup = tv({
217
15
  slots: {
@@ -1413,4 +1211,4 @@ function BottomSheetDescription({ className, ...props }) {
1413
1211
  });
1414
1212
  }
1415
1213
  //#endregion
1416
- export { BottomSheet, BottomSheetClose, BottomSheetContent, BottomSheetDescription, BottomSheetFooter, BottomSheetHeader, BottomSheetPortal, BottomSheetTitle, BottomSheetTrigger, ConversationPreviewCard, ConversationPreviewCardAction, ConversationPreviewCardAuthor, ConversationPreviewCardAuthorName, ConversationPreviewCardAuthorSubtitle, ConversationPreviewCardChannel, ConversationPreviewCardContent, ConversationPreviewCardFooter, ConversationPreviewCardMeta, ConversationPreviewCardPreview, ConversationPreviewCardPreviewAuthor, ConversationPreviewCardPreviewLeading, ConversationPreviewCardSecondaryPreview, ConversationPreviewCardTimestamp, DescriptionAction, DescriptionDetails, DescriptionItem, DescriptionList, DescriptionTerm, Field, FieldControl, FieldDescription, FieldError, FieldItem, FieldLabel, FieldValidity, Lightbox, LightboxActions, LightboxClose, LightboxContent, LightboxHeader, LightboxMedia, LightboxPortal, LightboxStage, LightboxTitle, LightboxTrigger, ListItem, ListItemActionGroup, ListItemBody, ListItemDescription, ListItemIcon, ListItemMeta, ListItemRow, ListItemTitle, MediaListItem, MediaListItemActionGroup, MediaListItemAside, MediaListItemBody, MediaListItemSubtitle, MediaListItemText, MediaListItemTitle, MediaListItemVisual, PanelHeader, PanelHeaderActions, PanelHeaderContent, PanelHeaderIcon, PanelHeaderSubtitle, PanelHeaderSuffix, PanelHeaderTitle, PanelHeaderTitleRow, PanelHeaderVisual, PreviewShell, QuotedMessageCard, QuotedMessageCardAttachments, QuotedMessageCardAuthor, QuotedMessageCardAuthorName, QuotedMessageCardAuthorSubtitle, QuotedMessageCardBody, QuotedMessageCardChannel, QuotedMessageCardContent, QuotedMessageCardContentWrap, QuotedMessageCardHeader, QuotedMessageCardMeta, QuotedMessageCardSeparator, QuotedMessageCardTag, QuotedMessageCardThread, QuotedMessageCardTimestamp, QuotedMessageCardUnavailable, SectionHeader, SectionHeaderActions, SectionHeaderContent, SectionHeaderCount, SectionHeaderIcon, SectionHeaderTitle, SectionLabel, Text, TextHeading, TextMono, TextSans, ToggleGroup, ToggleGroupCount, ToggleGroupItem, ToggleGroupLabel };
1214
+ export { BottomSheet, BottomSheetClose, BottomSheetContent, BottomSheetDescription, BottomSheetFooter, BottomSheetHeader, BottomSheetPortal, BottomSheetTitle, BottomSheetTrigger, ConversationPreviewCard, ConversationPreviewCardAction, ConversationPreviewCardAuthor, ConversationPreviewCardAuthorName, ConversationPreviewCardAuthorSubtitle, ConversationPreviewCardChannel, ConversationPreviewCardContent, ConversationPreviewCardFooter, ConversationPreviewCardMeta, ConversationPreviewCardPreview, ConversationPreviewCardPreviewAuthor, ConversationPreviewCardPreviewLeading, ConversationPreviewCardSecondaryPreview, ConversationPreviewCardTimestamp, DescriptionAction, DescriptionDetails, DescriptionItem, DescriptionList, DescriptionTerm, Lightbox, LightboxActions, LightboxClose, LightboxContent, LightboxHeader, LightboxMedia, LightboxPortal, LightboxStage, LightboxTitle, LightboxTrigger, ListItem, ListItemActionGroup, ListItemBody, ListItemDescription, ListItemIcon, ListItemMeta, ListItemRow, ListItemTitle, MediaListItem, MediaListItemActionGroup, MediaListItemAside, MediaListItemBody, MediaListItemSubtitle, MediaListItemText, MediaListItemTitle, MediaListItemVisual, PanelHeader, PanelHeaderActions, PanelHeaderContent, PanelHeaderIcon, PanelHeaderSubtitle, PanelHeaderSuffix, PanelHeaderTitle, PanelHeaderTitleRow, PanelHeaderVisual, PreviewShell, QuotedMessageCard, QuotedMessageCardAttachments, QuotedMessageCardAuthor, QuotedMessageCardAuthorName, QuotedMessageCardAuthorSubtitle, QuotedMessageCardBody, QuotedMessageCardChannel, QuotedMessageCardContent, QuotedMessageCardContentWrap, QuotedMessageCardHeader, QuotedMessageCardMeta, QuotedMessageCardSeparator, QuotedMessageCardTag, QuotedMessageCardThread, QuotedMessageCardTimestamp, QuotedMessageCardUnavailable, SectionHeader, SectionHeaderActions, SectionHeaderContent, SectionHeaderCount, SectionHeaderIcon, SectionHeaderTitle, SectionLabel, ToggleGroup, ToggleGroupCount, ToggleGroupItem, ToggleGroupLabel };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "raft-ui",
3
- "version": "0.0.1",
3
+ "version": "0.0.4",
4
4
  "description": "React UI components for Raft.",
5
5
  "license": "MIT",
6
6
  "repository": {
package/src/index.ts CHANGED
@@ -135,6 +135,25 @@ export type {
135
135
  export { Input } from "./components/input/index.ts";
136
136
  export type { InputProps } from "./components/input/index.ts";
137
137
 
138
+ export {
139
+ Field,
140
+ FieldControl,
141
+ FieldDescription,
142
+ FieldError,
143
+ FieldItem,
144
+ FieldLabel,
145
+ FieldValidity,
146
+ } from "./components/field/index.ts";
147
+ export type {
148
+ FieldControlProps,
149
+ FieldDescriptionProps,
150
+ FieldErrorProps,
151
+ FieldItemProps,
152
+ FieldLabelProps,
153
+ FieldProps,
154
+ FieldValidityProps,
155
+ } from "./components/field/index.ts";
156
+
138
157
  export { InputGroup, InputGroupAddon, InputGroupInput } from "./components/input-group/index.ts";
139
158
  export type {
140
159
  InputGroupAddonProps,
@@ -293,6 +312,9 @@ export type { InlineCodeProps } from "./components/inline-code/index.ts";
293
312
  export { Kbd, KbdGroup } from "./components/kbd/index.ts";
294
313
  export type { KbdGroupProps, KbdProps } from "./components/kbd/index.ts";
295
314
 
315
+ export { Text, TextHeading, TextMono, TextSans } from "./components/text/index.ts";
316
+ export type { TextHeadingProps, TextMonoProps, TextSansProps } from "./components/text/index.ts";
317
+
296
318
  export { Status } from "./components/status/index.ts";
297
319
  export type { StatusProps } from "./components/status/index.ts";
298
320
 
package/src/wip.ts CHANGED
@@ -1,25 +1,3 @@
1
- export {
2
- Field,
3
- FieldControl,
4
- FieldDescription,
5
- FieldError,
6
- FieldItem,
7
- FieldLabel,
8
- FieldValidity,
9
- } from "./components/field/index.ts";
10
- export type {
11
- FieldControlProps,
12
- FieldDescriptionProps,
13
- FieldErrorProps,
14
- FieldItemProps,
15
- FieldLabelProps,
16
- FieldProps,
17
- FieldValidityProps,
18
- } from "./components/field/index.ts";
19
-
20
- export { Text, TextHeading, TextMono, TextSans } from "./components/text/index.ts";
21
- export type { TextHeadingProps, TextMonoProps, TextSansProps } from "./components/text/index.ts";
22
-
23
1
  export {
24
2
  ToggleGroup,
25
3
  ToggleGroupCount,