@ship-it-ui/ui 0.0.6 → 0.0.8
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/index.cjs +2227 -829
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +403 -10
- package/dist/index.d.ts +403 -10
- package/dist/index.js +2194 -790
- package/dist/index.js.map +1 -1
- package/package.json +5 -2
- package/src/styles/animations.css +18 -0
- package/src/styles/globals.css +11 -0
package/dist/index.d.cts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { ClassValue } from 'clsx';
|
|
2
2
|
export { ClassValue } from 'clsx';
|
|
3
3
|
import * as react from 'react';
|
|
4
|
-
import { useEffect, KeyboardEvent, RefObject, ButtonHTMLAttributes, ReactNode, HTMLAttributes, InputHTMLAttributes, TextareaHTMLAttributes, AnchorHTMLAttributes, Ref, LabelHTMLAttributes, FC, SVGAttributes, MouseEventHandler } from 'react';
|
|
4
|
+
import { useEffect, KeyboardEvent, RefObject, ButtonHTMLAttributes, ReactNode, HTMLAttributes, InputHTMLAttributes, TextareaHTMLAttributes, AnchorHTMLAttributes, Ref, forwardRef, LabelHTMLAttributes, FC, SVGAttributes, MouseEventHandler } from 'react';
|
|
5
5
|
import * as class_variance_authority_types from 'class-variance-authority/types';
|
|
6
6
|
import { VariantProps } from 'class-variance-authority';
|
|
7
7
|
import * as RadixCheckbox from '@radix-ui/react-checkbox';
|
|
@@ -10,6 +10,7 @@ import * as RadixRadio from '@radix-ui/react-radio-group';
|
|
|
10
10
|
import * as RadixSelect from '@radix-ui/react-select';
|
|
11
11
|
import * as RadixSlider from '@radix-ui/react-slider';
|
|
12
12
|
import * as RadixSwitch from '@radix-ui/react-switch';
|
|
13
|
+
import * as RadixAccordion from '@radix-ui/react-accordion';
|
|
13
14
|
import * as RadixContext from '@radix-ui/react-context-menu';
|
|
14
15
|
import * as RadixDialog from '@radix-ui/react-dialog';
|
|
15
16
|
import * as RadixAlert from '@radix-ui/react-alert-dialog';
|
|
@@ -291,6 +292,55 @@ interface FieldProps extends Omit<HTMLAttributes<HTMLDivElement>, 'children'> {
|
|
|
291
292
|
*/
|
|
292
293
|
declare function Field({ label, hint, error, required, className, children, ...props }: FieldProps): react_jsx_runtime.JSX.Element;
|
|
293
294
|
|
|
295
|
+
/**
|
|
296
|
+
* Display-to-input rename primitive. Renders `value` as a static element until
|
|
297
|
+
* activated (default: double-click or Enter on the focused display), at which
|
|
298
|
+
* point it swaps to a focused `<input>` with the text pre-selected. Enter
|
|
299
|
+
* commits, Escape cancels, blur commits when `commitOnBlur` (default `true`).
|
|
300
|
+
*
|
|
301
|
+
* Reuses {@link useControllableState} so consumers can mirror the editing
|
|
302
|
+
* state externally (useful when the parent wants to open the editor
|
|
303
|
+
* programmatically — e.g., right-click → Rename).
|
|
304
|
+
*/
|
|
305
|
+
declare const displayStyles: (props?: ({
|
|
306
|
+
size?: "sm" | "md" | "lg" | null | undefined;
|
|
307
|
+
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
308
|
+
type AsElement = 'span' | 'div' | 'h1' | 'h2' | 'h3';
|
|
309
|
+
type Activation = 'dblclick' | 'click';
|
|
310
|
+
interface InlineEditProps extends Omit<HTMLAttributes<HTMLElement>, 'onChange' | 'children' | 'role'>, VariantProps<typeof displayStyles> {
|
|
311
|
+
/** Current label value. */
|
|
312
|
+
value: string;
|
|
313
|
+
/** Fired with the committed value. */
|
|
314
|
+
onValueChange: (next: string) => void;
|
|
315
|
+
/** Display element. Default 'span'. Use 'h1'-'h3' for headings. */
|
|
316
|
+
as?: AsElement;
|
|
317
|
+
/** Activation gesture besides the always-on Enter-on-focus. Default 'dblclick'. */
|
|
318
|
+
activate?: Activation;
|
|
319
|
+
/** Commit (vs cancel) on blur. Default `true`. */
|
|
320
|
+
commitOnBlur?: boolean;
|
|
321
|
+
/** Returns an error message on rejection, or `null` on success. */
|
|
322
|
+
validate?: (next: string) => string | null;
|
|
323
|
+
/** Shown when `value` is empty in display mode. */
|
|
324
|
+
placeholder?: string;
|
|
325
|
+
/** Disables activation and applies a muted style. */
|
|
326
|
+
disabled?: boolean;
|
|
327
|
+
/** Controlled editing flag. */
|
|
328
|
+
editing?: boolean;
|
|
329
|
+
/** Fired when the editing flag changes (uncontrolled mode or external open). */
|
|
330
|
+
onEditingChange?: (next: boolean) => void;
|
|
331
|
+
/** Extra className on the `<input>` in edit mode. */
|
|
332
|
+
inputClassName?: string;
|
|
333
|
+
/** Accessible label for the display element. Default `Edit {value}`. */
|
|
334
|
+
'aria-label'?: string;
|
|
335
|
+
}
|
|
336
|
+
interface InlineEditHandle {
|
|
337
|
+
/** Programmatically enter edit mode and focus the input. */
|
|
338
|
+
edit: () => void;
|
|
339
|
+
/** Cancel any pending edit and return to display mode. */
|
|
340
|
+
cancel: () => void;
|
|
341
|
+
}
|
|
342
|
+
declare const InlineEdit: react.ForwardRefExoticComponent<InlineEditProps & react.RefAttributes<InlineEditHandle>>;
|
|
343
|
+
|
|
294
344
|
declare const inputWrapperStyles: (props?: ({
|
|
295
345
|
size?: "sm" | "md" | "lg" | null | undefined;
|
|
296
346
|
tone?: "default" | "err" | null | undefined;
|
|
@@ -327,6 +377,31 @@ interface SearchInputProps extends InputHTMLAttributes<HTMLInputElement> {
|
|
|
327
377
|
*/
|
|
328
378
|
declare const SearchInput: react.ForwardRefExoticComponent<SearchInputProps & react.RefAttributes<HTMLInputElement>>;
|
|
329
379
|
|
|
380
|
+
/**
|
|
381
|
+
* NumberInput — numeric input with `−` / `+` stepper buttons. Long-press the
|
|
382
|
+
* buttons to repeat. Use for guest count, additional drivers, days, child
|
|
383
|
+
* seats — anywhere users tweak a small integer or decimal.
|
|
384
|
+
*/
|
|
385
|
+
interface NumberInputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'value' | 'defaultValue' | 'onChange' | 'type' | 'size'> {
|
|
386
|
+
/** Current value (controlled). */
|
|
387
|
+
value?: number;
|
|
388
|
+
/** Default value (uncontrolled). */
|
|
389
|
+
defaultValue?: number;
|
|
390
|
+
/** Fires when the value changes via input or stepper. */
|
|
391
|
+
onValueChange?: (value: number) => void;
|
|
392
|
+
/** Minimum allowed value. Default `0`. */
|
|
393
|
+
min?: number;
|
|
394
|
+
/** Maximum allowed value. Default `Infinity`. */
|
|
395
|
+
max?: number;
|
|
396
|
+
/** Step increment. Default `1`. */
|
|
397
|
+
step?: number;
|
|
398
|
+
/** Visual size. Default `'md'`. */
|
|
399
|
+
size?: 'sm' | 'md' | 'lg';
|
|
400
|
+
/** Accessible label. */
|
|
401
|
+
'aria-label'?: string;
|
|
402
|
+
}
|
|
403
|
+
declare const NumberInput: react.ForwardRefExoticComponent<NumberInputProps & react.RefAttributes<HTMLInputElement>>;
|
|
404
|
+
|
|
330
405
|
interface OTPProps {
|
|
331
406
|
/** Number of digit slots. Defaults to 6. */
|
|
332
407
|
length?: number;
|
|
@@ -367,6 +442,31 @@ interface RadioProps extends Omit<RadixRadio.RadioGroupItemProps, 'asChild' | 'c
|
|
|
367
442
|
}
|
|
368
443
|
declare const Radio: react.ForwardRefExoticComponent<RadioProps & react.RefAttributes<HTMLButtonElement>>;
|
|
369
444
|
|
|
445
|
+
/**
|
|
446
|
+
* SegmentedControl — pill-styled radio group for filtering the current view's
|
|
447
|
+
* data (Daily / Weekly / Monthly rates, Map / List view). Distinct from
|
|
448
|
+
* `Tabs`, which changes navigational context.
|
|
449
|
+
*/
|
|
450
|
+
interface SegmentedControlOption {
|
|
451
|
+
/** Stable identifier. */
|
|
452
|
+
value: string;
|
|
453
|
+
/** Visible label. */
|
|
454
|
+
label: ReactNode;
|
|
455
|
+
/** Optional leading icon name (from `@ship-it-ui/icons`). */
|
|
456
|
+
icon?: string;
|
|
457
|
+
/** When true, this option is disabled. */
|
|
458
|
+
disabled?: boolean;
|
|
459
|
+
}
|
|
460
|
+
interface SegmentedControlProps extends Omit<RadixRadio.RadioGroupProps, 'orientation' | 'children'> {
|
|
461
|
+
/** Options to render. */
|
|
462
|
+
options: ReadonlyArray<SegmentedControlOption>;
|
|
463
|
+
/** Visual size. Default `md`. */
|
|
464
|
+
size?: 'sm' | 'md';
|
|
465
|
+
/** When true, stretches to fill the parent. */
|
|
466
|
+
fullWidth?: boolean;
|
|
467
|
+
}
|
|
468
|
+
declare const SegmentedControl: react.ForwardRefExoticComponent<SegmentedControlProps & react.RefAttributes<HTMLDivElement>>;
|
|
469
|
+
|
|
370
470
|
declare const SelectRoot: react.FC<RadixSelect.SelectProps>;
|
|
371
471
|
declare const SelectValue: react.ForwardRefExoticComponent<RadixSelect.SelectValueProps & react.RefAttributes<HTMLSpanElement>>;
|
|
372
472
|
declare const SelectGroup: react.ForwardRefExoticComponent<RadixSelect.SelectGroupProps & react.RefAttributes<HTMLDivElement>>;
|
|
@@ -463,6 +563,26 @@ interface TextareaProps extends TextareaHTMLAttributes<HTMLTextAreaElement>, Var
|
|
|
463
563
|
}
|
|
464
564
|
declare const Textarea: react.ForwardRefExoticComponent<TextareaProps & react.RefAttributes<HTMLTextAreaElement>>;
|
|
465
565
|
|
|
566
|
+
/**
|
|
567
|
+
* Accordion — collapsible sections. Built on Radix Accordion.
|
|
568
|
+
*
|
|
569
|
+
* Use `type='single'` for one-open-at-a-time (FAQ pages); `'multiple'` when
|
|
570
|
+
* sections are independent (filter groups, listing detail panels).
|
|
571
|
+
*/
|
|
572
|
+
type AccordionProps = (RadixAccordion.AccordionSingleProps | RadixAccordion.AccordionMultipleProps) & {
|
|
573
|
+
children?: ReactNode;
|
|
574
|
+
};
|
|
575
|
+
declare const Accordion: react.ForwardRefExoticComponent<AccordionProps & react.RefAttributes<HTMLDivElement>>;
|
|
576
|
+
type AccordionItemProps = RadixAccordion.AccordionItemProps;
|
|
577
|
+
declare const AccordionItem: react.ForwardRefExoticComponent<RadixAccordion.AccordionItemProps & react.RefAttributes<HTMLDivElement>>;
|
|
578
|
+
interface AccordionTriggerProps extends Omit<RadixAccordion.AccordionTriggerProps, 'asChild'> {
|
|
579
|
+
/** Optional icon name rendered to the left of the trigger label. */
|
|
580
|
+
leadingIcon?: string;
|
|
581
|
+
}
|
|
582
|
+
declare const AccordionTrigger: react.ForwardRefExoticComponent<AccordionTriggerProps & react.RefAttributes<HTMLButtonElement>>;
|
|
583
|
+
type AccordionContentProps = RadixAccordion.AccordionContentProps;
|
|
584
|
+
declare const AccordionContent: react.ForwardRefExoticComponent<RadixAccordion.AccordionContentProps & react.RefAttributes<HTMLDivElement>>;
|
|
585
|
+
|
|
466
586
|
type AvatarSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
|
|
467
587
|
type AvatarStatus = 'ok' | 'warn' | 'err' | 'off';
|
|
468
588
|
interface AvatarProps extends HTMLAttributes<HTMLSpanElement> {
|
|
@@ -499,7 +619,7 @@ interface AvatarGroupProps extends HTMLAttributes<HTMLDivElement> {
|
|
|
499
619
|
declare const AvatarGroup: react.ForwardRefExoticComponent<AvatarGroupProps & react.RefAttributes<HTMLDivElement>>;
|
|
500
620
|
|
|
501
621
|
declare const badgeStyles: (props?: ({
|
|
502
|
-
variant?: "outline" | "err" | "pink" | "purple" | "solid" | "
|
|
622
|
+
variant?: "outline" | "err" | "pink" | "purple" | "solid" | "warn" | "ok" | "accent" | "neutral" | null | undefined;
|
|
503
623
|
size?: "sm" | "md" | "lg" | null | undefined;
|
|
504
624
|
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
505
625
|
interface BadgeProps extends HTMLAttributes<HTMLSpanElement>, VariantProps<typeof badgeStyles> {
|
|
@@ -618,6 +738,37 @@ type KbdProps = HTMLAttributes<HTMLElement>;
|
|
|
618
738
|
*/
|
|
619
739
|
declare const Kbd: react.ForwardRefExoticComponent<KbdProps & react.RefAttributes<HTMLElement>>;
|
|
620
740
|
|
|
741
|
+
/**
|
|
742
|
+
* Rating — star rating display and input.
|
|
743
|
+
*
|
|
744
|
+
* `readOnly` (default for displays of averaged values like 4.7) supports
|
|
745
|
+
* `precision='half'` for fractional fills via a clipped overlay. Interactive
|
|
746
|
+
* ratings step in whole units only — half-step input is uncommon UX and the
|
|
747
|
+
* keyboard model (radiogroup) doesn't map cleanly to it.
|
|
748
|
+
*/
|
|
749
|
+
interface RatingProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange' | 'defaultValue' | 'role'> {
|
|
750
|
+
/** Current rating (controlled). Range `0` … `max`. */
|
|
751
|
+
value?: number;
|
|
752
|
+
/** Default rating (uncontrolled). */
|
|
753
|
+
defaultValue?: number;
|
|
754
|
+
/** Fires with the new whole-number rating on click / keyboard select. */
|
|
755
|
+
onValueChange?: (value: number) => void;
|
|
756
|
+
/** Maximum number of stars. Default `5`. */
|
|
757
|
+
max?: number;
|
|
758
|
+
/**
|
|
759
|
+
* Fractional precision for **read-only** display. Interactive ratings always
|
|
760
|
+
* step in whole units. Default `'full'`.
|
|
761
|
+
*/
|
|
762
|
+
precision?: 'full' | 'half';
|
|
763
|
+
/** Visual size. Default `'md'`. */
|
|
764
|
+
size?: 'sm' | 'md' | 'lg';
|
|
765
|
+
/** When true, renders a non-interactive display (`role='img'`). */
|
|
766
|
+
readOnly?: boolean;
|
|
767
|
+
/** Accessible label. For read-only this overrides the auto-generated "X out of Y stars" label. */
|
|
768
|
+
'aria-label'?: string;
|
|
769
|
+
}
|
|
770
|
+
declare const Rating: react.ForwardRefExoticComponent<RatingProps & react.RefAttributes<HTMLDivElement>>;
|
|
771
|
+
|
|
621
772
|
/**
|
|
622
773
|
* ScrollArea — token-styled scrollbar primitive built on
|
|
623
774
|
* `@radix-ui/react-scroll-area`. Wraps a viewport with custom scrollbars that
|
|
@@ -965,7 +1116,7 @@ declare function SimpleTooltip({ content, children, side, delayDuration, }: Simp
|
|
|
965
1116
|
*/
|
|
966
1117
|
type AlertTone = 'accent' | 'ok' | 'warn' | 'err';
|
|
967
1118
|
declare const alertStyles: (props?: ({
|
|
968
|
-
tone?: "err" | "
|
|
1119
|
+
tone?: "err" | "warn" | "ok" | "accent" | null | undefined;
|
|
969
1120
|
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
970
1121
|
interface AlertProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'>, VariantProps<typeof alertStyles> {
|
|
971
1122
|
/** Bold title text. */
|
|
@@ -996,7 +1147,7 @@ declare const Alert: react.ForwardRefExoticComponent<AlertProps & react.RefAttri
|
|
|
996
1147
|
*/
|
|
997
1148
|
type BannerTone = 'accent' | 'ok' | 'warn' | 'err';
|
|
998
1149
|
declare const bannerStyles: (props?: ({
|
|
999
|
-
tone?: "err" | "
|
|
1150
|
+
tone?: "err" | "warn" | "ok" | "accent" | null | undefined;
|
|
1000
1151
|
sticky?: boolean | null | undefined;
|
|
1001
1152
|
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
1002
1153
|
interface BannerProps extends HTMLAttributes<HTMLDivElement>, VariantProps<typeof bannerStyles> {
|
|
@@ -1034,6 +1185,40 @@ interface CrumbProps extends AnchorHTMLAttributes<HTMLAnchorElement> {
|
|
|
1034
1185
|
}
|
|
1035
1186
|
declare const Crumb: react.ForwardRefExoticComponent<CrumbProps & react.RefAttributes<HTMLAnchorElement>>;
|
|
1036
1187
|
|
|
1188
|
+
/**
|
|
1189
|
+
* Carousel — a horizontal scroll-snap container with prev/next controls,
|
|
1190
|
+
* dot indicators, and an optional thumbnail strip. Native CSS scroll
|
|
1191
|
+
* behavior; no library.
|
|
1192
|
+
*
|
|
1193
|
+
* Pass an array of `items` and a `renderItem` function — the carousel
|
|
1194
|
+
* handles snapping, active-index tracking, and keyboard nav.
|
|
1195
|
+
*/
|
|
1196
|
+
interface CarouselProps<T = unknown> extends Omit<HTMLAttributes<HTMLDivElement>, 'children'> {
|
|
1197
|
+
/** Slide data. */
|
|
1198
|
+
items: ReadonlyArray<T>;
|
|
1199
|
+
/** Renderer for each slide. */
|
|
1200
|
+
renderItem: (item: T, index: number) => ReactNode;
|
|
1201
|
+
/** Optional renderer for a thumbnail strip below the viewport. */
|
|
1202
|
+
renderThumbnail?: (item: T, index: number) => ReactNode;
|
|
1203
|
+
/** Active slide index (controlled). */
|
|
1204
|
+
index?: number;
|
|
1205
|
+
/** Default index (uncontrolled). Default `0`. */
|
|
1206
|
+
defaultIndex?: number;
|
|
1207
|
+
/** Fires when the active index changes. */
|
|
1208
|
+
onIndexChange?: (index: number) => void;
|
|
1209
|
+
/** Aspect ratio of each slide. Default `16/10`. */
|
|
1210
|
+
aspectRatio?: string | number;
|
|
1211
|
+
/** When false, hides the dot indicators. Default `true`. */
|
|
1212
|
+
showDots?: boolean;
|
|
1213
|
+
/** When false, hides the prev/next arrows. Default `true`. */
|
|
1214
|
+
showArrows?: boolean;
|
|
1215
|
+
/** Accessible label for the carousel region. */
|
|
1216
|
+
'aria-label'?: string;
|
|
1217
|
+
}
|
|
1218
|
+
declare const Carousel: <T>(p: CarouselProps<T> & {
|
|
1219
|
+
ref?: React.Ref<HTMLDivElement>;
|
|
1220
|
+
}) => ReactNode;
|
|
1221
|
+
|
|
1037
1222
|
/**
|
|
1038
1223
|
* Combobox — text input with an attached, type-to-filter listbox. Implements
|
|
1039
1224
|
* the WAI-ARIA combobox pattern (input owns focus; listbox is referenced via
|
|
@@ -1195,13 +1380,26 @@ declare function DataTable<T>(props: DataTableProps<T> & {
|
|
|
1195
1380
|
ref?: Ref<HTMLTableElement>;
|
|
1196
1381
|
}): react_jsx_runtime.JSX.Element;
|
|
1197
1382
|
|
|
1383
|
+
/** A `{from, to}` date range used by `Calendar` and `DateRangePicker`. */
|
|
1384
|
+
interface DateRange {
|
|
1385
|
+
from?: Date;
|
|
1386
|
+
to?: Date;
|
|
1387
|
+
}
|
|
1198
1388
|
interface CalendarProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onSelect' | 'defaultValue'> {
|
|
1199
|
-
/**
|
|
1389
|
+
/** Selection mode. Default `'single'`. */
|
|
1390
|
+
mode?: 'single' | 'range';
|
|
1391
|
+
/** Currently selected date (controlled, single mode). */
|
|
1200
1392
|
value?: Date;
|
|
1201
|
-
/** Default selected date (uncontrolled). */
|
|
1393
|
+
/** Default selected date (uncontrolled, single mode). */
|
|
1202
1394
|
defaultValue?: Date;
|
|
1203
|
-
/** Fires with the newly selected date. */
|
|
1395
|
+
/** Fires with the newly selected date (single mode). */
|
|
1204
1396
|
onValueChange?: (date: Date) => void;
|
|
1397
|
+
/** Currently selected range (controlled, range mode). */
|
|
1398
|
+
range?: DateRange;
|
|
1399
|
+
/** Default range (uncontrolled, range mode). */
|
|
1400
|
+
defaultRange?: DateRange;
|
|
1401
|
+
/** Fires when the range changes (range mode). */
|
|
1402
|
+
onRangeChange?: (range: DateRange) => void;
|
|
1205
1403
|
/** Currently visible month (0-indexed) and year. */
|
|
1206
1404
|
month?: number;
|
|
1207
1405
|
year?: number;
|
|
@@ -1242,6 +1440,201 @@ interface DatePickerProps {
|
|
|
1242
1440
|
}
|
|
1243
1441
|
declare const DatePicker: react.ForwardRefExoticComponent<DatePickerProps & react.RefAttributes<HTMLButtonElement>>;
|
|
1244
1442
|
|
|
1443
|
+
/**
|
|
1444
|
+
* DateRangePicker — a button trigger that opens a popover with one or two
|
|
1445
|
+
* adjacent `Calendar` grids in `mode="range"`. The anchor of every
|
|
1446
|
+
* car-rental booking: pickup → return.
|
|
1447
|
+
*/
|
|
1448
|
+
interface DateRangePickerProps {
|
|
1449
|
+
value?: DateRange;
|
|
1450
|
+
defaultValue?: DateRange;
|
|
1451
|
+
onValueChange?: (range: DateRange) => void;
|
|
1452
|
+
/** Number of months shown side-by-side. Default `2` for desktop, `1` for mobile. */
|
|
1453
|
+
months?: 1 | 2;
|
|
1454
|
+
/** Placeholder shown when no range is set. */
|
|
1455
|
+
placeholder?: string;
|
|
1456
|
+
/** Custom formatter. Default uses each date's `toLocaleDateString()`. */
|
|
1457
|
+
format?: (d: Date) => string;
|
|
1458
|
+
/** Pixel width of the trigger. */
|
|
1459
|
+
width?: number | string;
|
|
1460
|
+
disabled?: boolean;
|
|
1461
|
+
/** Optional disable predicate forwarded to each Calendar. */
|
|
1462
|
+
isDateDisabled?: (date: Date) => boolean;
|
|
1463
|
+
'aria-label'?: string;
|
|
1464
|
+
id?: string;
|
|
1465
|
+
}
|
|
1466
|
+
declare const DateRangePicker: react.ForwardRefExoticComponent<DateRangePickerProps & react.RefAttributes<HTMLButtonElement>>;
|
|
1467
|
+
|
|
1468
|
+
/**
|
|
1469
|
+
* Lightbox — fullscreen photo viewer. Built on Radix Dialog (reuses the
|
|
1470
|
+
* focus trap, portal, and escape-to-close). Adds keyboard ←/→ navigation
|
|
1471
|
+
* between items and a counter overlay.
|
|
1472
|
+
*/
|
|
1473
|
+
interface LightboxProps {
|
|
1474
|
+
open?: boolean;
|
|
1475
|
+
defaultOpen?: boolean;
|
|
1476
|
+
onOpenChange?: (open: boolean) => void;
|
|
1477
|
+
/** Items to view — usually image URLs but anything renderable is fine. */
|
|
1478
|
+
items: ReadonlyArray<unknown>;
|
|
1479
|
+
/** Renderer for the active item. */
|
|
1480
|
+
renderItem: (item: unknown, index: number) => ReactNode;
|
|
1481
|
+
/** Current index (controlled). */
|
|
1482
|
+
index?: number;
|
|
1483
|
+
/** Default index (uncontrolled). */
|
|
1484
|
+
defaultIndex?: number;
|
|
1485
|
+
/** Fires when the index changes. */
|
|
1486
|
+
onIndexChange?: (index: number) => void;
|
|
1487
|
+
/** Accessible title (visually hidden). */
|
|
1488
|
+
title?: ReactNode;
|
|
1489
|
+
}
|
|
1490
|
+
declare const Lightbox: react.ForwardRefExoticComponent<LightboxProps & react.RefAttributes<HTMLDivElement>>;
|
|
1491
|
+
|
|
1492
|
+
/**
|
|
1493
|
+
* ListingCard — a consumer-marketplace card composing photos (`Carousel`),
|
|
1494
|
+
* title, `Rating`, price, host, and an optional verified badge / favorite
|
|
1495
|
+
* toggle. Distinct from `EntityCard`, which is dev-tool entity chrome.
|
|
1496
|
+
*/
|
|
1497
|
+
interface ListingCardProps extends Omit<HTMLAttributes<HTMLDivElement>, 'children' | 'title'> {
|
|
1498
|
+
/** Photo URLs (or anything `Carousel` can render). At least one. */
|
|
1499
|
+
photos: ReadonlyArray<string>;
|
|
1500
|
+
/** Listing title — e.g. "2023 Tesla Model 3". */
|
|
1501
|
+
title: ReactNode;
|
|
1502
|
+
/** Optional eyebrow text above the title (location, vehicle type). */
|
|
1503
|
+
eyebrow?: ReactNode;
|
|
1504
|
+
/** Average rating (0–5). When undefined, the rating row is hidden. */
|
|
1505
|
+
rating?: number;
|
|
1506
|
+
/** Number of reviews — shown next to the rating. */
|
|
1507
|
+
reviewCount?: number;
|
|
1508
|
+
/** Headline price (e.g. `89`). */
|
|
1509
|
+
price: ReactNode;
|
|
1510
|
+
/** Price unit suffix (e.g. `/day`). */
|
|
1511
|
+
priceUnit?: ReactNode;
|
|
1512
|
+
/** Original price for sale strike-through. */
|
|
1513
|
+
originalPrice?: ReactNode;
|
|
1514
|
+
/** Host / owner name. */
|
|
1515
|
+
host?: ReactNode;
|
|
1516
|
+
/** Distance label (e.g. `0.4 mi away`). */
|
|
1517
|
+
distance?: ReactNode;
|
|
1518
|
+
/** When true, shows a `verified` badge on the photo. */
|
|
1519
|
+
verified?: boolean;
|
|
1520
|
+
/** Link target for the whole card. */
|
|
1521
|
+
href?: string;
|
|
1522
|
+
/** Heart-icon favorite toggle handler. */
|
|
1523
|
+
onFavorite?: (next: boolean) => void;
|
|
1524
|
+
/** Current favorite state. */
|
|
1525
|
+
favorited?: boolean;
|
|
1526
|
+
/** Card width override. */
|
|
1527
|
+
width?: number | string;
|
|
1528
|
+
}
|
|
1529
|
+
declare const ListingCard: react.ForwardRefExoticComponent<ListingCardProps & react.RefAttributes<HTMLDivElement>>;
|
|
1530
|
+
|
|
1531
|
+
/**
|
|
1532
|
+
* Country data for `PhoneInput`. Subset of common origins — extend as the
|
|
1533
|
+
* product grows or replace with a full ISO 3166-1 list (e.g. `libphonenumber-js`
|
|
1534
|
+
* `getCountries()`). Each country lists its ISO code (cca2), display name,
|
|
1535
|
+
* E.164 dial code, and flag emoji.
|
|
1536
|
+
*/
|
|
1537
|
+
interface PhoneCountry {
|
|
1538
|
+
/** ISO 3166-1 alpha-2 code, e.g. "US". */
|
|
1539
|
+
code: string;
|
|
1540
|
+
/** Display name. */
|
|
1541
|
+
name: string;
|
|
1542
|
+
/** E.164 country calling code without `+`, e.g. "1" or "44". */
|
|
1543
|
+
dialCode: string;
|
|
1544
|
+
/** Unicode flag (regional indicator pair). */
|
|
1545
|
+
flag: string;
|
|
1546
|
+
}
|
|
1547
|
+
declare const phoneCountries: ReadonlyArray<PhoneCountry>;
|
|
1548
|
+
|
|
1549
|
+
/**
|
|
1550
|
+
* PhoneInput — country-code Select + national-number text input. Emits
|
|
1551
|
+
* E.164-formatted strings (`+CC<NSN>`) via `onValueChange`.
|
|
1552
|
+
*
|
|
1553
|
+
* The country list is a curated subset of common origins. Pass a custom
|
|
1554
|
+
* `countries` prop to supply your own (e.g. via `libphonenumber-js`).
|
|
1555
|
+
*/
|
|
1556
|
+
interface PhoneInputProps {
|
|
1557
|
+
/** E.164 value (controlled), e.g. `+14155550100`. */
|
|
1558
|
+
value?: string;
|
|
1559
|
+
/** Default E.164 value (uncontrolled). */
|
|
1560
|
+
defaultValue?: string;
|
|
1561
|
+
/** Fires with the new E.164 value. Empty national number → empty string. */
|
|
1562
|
+
onValueChange?: (value: string) => void;
|
|
1563
|
+
/** Custom country list. Defaults to the bundled subset. */
|
|
1564
|
+
countries?: ReadonlyArray<PhoneCountry>;
|
|
1565
|
+
/** Default selected country code. Default `'US'`. */
|
|
1566
|
+
defaultCountry?: string;
|
|
1567
|
+
placeholder?: string;
|
|
1568
|
+
disabled?: boolean;
|
|
1569
|
+
/** Accessible label for the national-number input. */
|
|
1570
|
+
'aria-label'?: string;
|
|
1571
|
+
}
|
|
1572
|
+
declare const PhoneInput: react.ForwardRefExoticComponent<PhoneInputProps & react.RefAttributes<HTMLInputElement>>;
|
|
1573
|
+
|
|
1574
|
+
/**
|
|
1575
|
+
* PriceBreakdown — labelled line items + a totals row. Used in booking
|
|
1576
|
+
* summaries, checkout sheets, trip receipts.
|
|
1577
|
+
*
|
|
1578
|
+
* Compose with `<PriceBreakdown.Line>` for individual rows, or pass an
|
|
1579
|
+
* `items` array for the common case. The `total` is rendered last with a
|
|
1580
|
+
* top border separator.
|
|
1581
|
+
*/
|
|
1582
|
+
interface PriceBreakdownItem {
|
|
1583
|
+
label: ReactNode;
|
|
1584
|
+
/** Optional secondary text (e.g. `$89 × 3 nights`). */
|
|
1585
|
+
subLabel?: ReactNode;
|
|
1586
|
+
amount: ReactNode;
|
|
1587
|
+
/** When set, renders the amount with a strike-through in the `sale` token. */
|
|
1588
|
+
originalAmount?: ReactNode;
|
|
1589
|
+
/** When true, renders the amount in the `sale` color (e.g. discounts). */
|
|
1590
|
+
discount?: boolean;
|
|
1591
|
+
}
|
|
1592
|
+
interface PriceBreakdownProps extends Omit<HTMLAttributes<HTMLDivElement>, 'children'> {
|
|
1593
|
+
/** Line items rendered in order. */
|
|
1594
|
+
items?: ReadonlyArray<PriceBreakdownItem>;
|
|
1595
|
+
/** Final total. Pre-formatted (e.g. `$267`). */
|
|
1596
|
+
total?: ReactNode;
|
|
1597
|
+
/** Label for the total row. Default `'Total'`. */
|
|
1598
|
+
totalLabel?: ReactNode;
|
|
1599
|
+
/** Currency hint shown next to the total. */
|
|
1600
|
+
currency?: ReactNode;
|
|
1601
|
+
/** Optional bespoke children — use instead of `items` for custom rows. */
|
|
1602
|
+
children?: ReactNode;
|
|
1603
|
+
}
|
|
1604
|
+
declare const PriceBreakdown: ReturnType<typeof forwardRef<HTMLDivElement, PriceBreakdownProps>> & {
|
|
1605
|
+
Line: typeof PriceBreakdownLine;
|
|
1606
|
+
};
|
|
1607
|
+
interface PriceBreakdownLineProps extends PriceBreakdownItem {
|
|
1608
|
+
className?: string;
|
|
1609
|
+
}
|
|
1610
|
+
declare const PriceBreakdownLine: react.ForwardRefExoticComponent<PriceBreakdownLineProps & react.RefAttributes<HTMLDivElement>>;
|
|
1611
|
+
|
|
1612
|
+
/**
|
|
1613
|
+
* ReviewCard — a single review feed item. Composes Avatar, Rating, date,
|
|
1614
|
+
* body, optional photos strip, and a `verified-trip` badge.
|
|
1615
|
+
*
|
|
1616
|
+
* Distinct from `Testimonial`, which is curated marketing chrome.
|
|
1617
|
+
*/
|
|
1618
|
+
interface ReviewCardProps extends Omit<HTMLAttributes<HTMLDivElement>, 'children'> {
|
|
1619
|
+
/** Reviewer display name. */
|
|
1620
|
+
author: ReactNode;
|
|
1621
|
+
/** Optional author avatar URL. */
|
|
1622
|
+
authorAvatar?: string;
|
|
1623
|
+
/** Star rating, 0–5. */
|
|
1624
|
+
rating: number;
|
|
1625
|
+
/** When set, renders as a Date — otherwise as a string. */
|
|
1626
|
+
date: ReactNode;
|
|
1627
|
+
/** Review body. */
|
|
1628
|
+
body: ReactNode;
|
|
1629
|
+
/** Optional photo URLs (rendered as a horizontal strip). */
|
|
1630
|
+
photos?: ReadonlyArray<string>;
|
|
1631
|
+
/** When true, shows the "Verified trip" badge. */
|
|
1632
|
+
verified?: boolean;
|
|
1633
|
+
/** Optional reviewer subtitle (location, member-since date). */
|
|
1634
|
+
subtitle?: ReactNode;
|
|
1635
|
+
}
|
|
1636
|
+
declare const ReviewCard: react.ForwardRefExoticComponent<ReviewCardProps & react.RefAttributes<HTMLDivElement>>;
|
|
1637
|
+
|
|
1245
1638
|
/**
|
|
1246
1639
|
* Dots — progress dots for carousels and onboarding tours. The current dot
|
|
1247
1640
|
* widens into a pill (per the handoff spec); the rest stay circular.
|
|
@@ -1290,7 +1683,7 @@ declare const Dropzone: react.ForwardRefExoticComponent<DropzoneProps & react.Re
|
|
|
1290
1683
|
* signal semantic intent (e.g., `err` for sync failures).
|
|
1291
1684
|
*/
|
|
1292
1685
|
declare const plateStyles: (props?: ({
|
|
1293
|
-
tone?: "err" | "
|
|
1686
|
+
tone?: "err" | "warn" | "ok" | "accent" | "neutral" | null | undefined;
|
|
1294
1687
|
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
1295
1688
|
type PlateVariantProps = VariantProps<typeof plateStyles>;
|
|
1296
1689
|
interface EmptyStateProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
|
|
@@ -1598,7 +1991,7 @@ declare const trackStyles: (props?: ({
|
|
|
1598
1991
|
size?: "sm" | "md" | "lg" | null | undefined;
|
|
1599
1992
|
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
1600
1993
|
declare const fillStyles: (props?: ({
|
|
1601
|
-
tone?: "err" | "
|
|
1994
|
+
tone?: "err" | "warn" | "ok" | "accent" | null | undefined;
|
|
1602
1995
|
} & class_variance_authority_types.ClassProp) | undefined) => string;
|
|
1603
1996
|
interface ProgressProps extends Omit<HTMLAttributes<HTMLDivElement>, 'role'>, VariantProps<typeof trackStyles>, VariantProps<typeof fillStyles> {
|
|
1604
1997
|
/** Numeric progress, 0..max. Ignored when `indeterminate`. */
|
|
@@ -2029,4 +2422,4 @@ interface WizardDialogProps {
|
|
|
2029
2422
|
}
|
|
2030
2423
|
declare const WizardDialog: react.ForwardRefExoticComponent<WizardDialogProps & react.RefAttributes<HTMLDivElement>>;
|
|
2031
2424
|
|
|
2032
|
-
export { type ActivityActor, type ActivityEvent, ActivityTimeline, type ActivityTimelineProps, Alert, AlertDialog, AlertDialogAction, AlertDialogCancel, type AlertDialogProps, AlertDialogRoot, AlertDialogTrigger, type AlertProps, type AlertTone, Avatar, AvatarGroup, type AvatarGroupProps, type AvatarProps, type AvatarSize, type AvatarStatus, Badge, type BadgeProps, Banner, type BannerProps, type BannerTone, Breadcrumbs, type BreadcrumbsProps, Button, ButtonGroup, type ButtonGroupProps, type ButtonProps, Calendar, type CalendarProps, Card, CardLink, type CardLinkProps, type CardProps, Checkbox, type CheckboxProps, Chip, type ChipProps, Combobox, type ComboboxOption, type ComboboxProps, CommandPalette, type CommandPaletteGroup, type CommandPaletteItem, type CommandPaletteProps, ContextMenu, ContextMenuContent, ContextMenuItem, type ContextMenuItemProps, ContextMenuPortal, ContextMenuRoot, ContextMenuSeparator, ContextMenuTrigger, Crumb, type CrumbProps, DataTable, type DataTableColumn, type DataTableProps, type DataTableSort, DatePicker, type DatePickerProps, Dialog, DialogClose, DialogContent, type DialogContentProps, DialogOverlay, DialogPortal, type DialogProps, DialogRoot, DialogTrigger, Dots, type DotsProps, Drawer, type DrawerProps, type DrawerSide, DropdownMenu, DropdownMenuContent, DropdownMenuGroup, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRoot, DropdownMenuTrigger, Dropzone, type DropzoneProps, EmptyState, type EmptyStateProps, FAB, type FABProps, Field, type FieldProps, FileChip, type FileChipProps, type FilterFacet, type FilterFacetOption, FilterPanel, type FilterPanelProps, type FilterPanelValue, HealthScore, type HealthScoreBreakdownEntry, type HealthScoreProps, HoverCard, HoverCardContent, HoverCardPortal, type HoverCardProps, HoverCardRoot, HoverCardTrigger, IconButton, type IconButtonProps, Input, type InputProps, Kbd, type KbdProps, LargeTitle, type LargeTitleProps, MenuCheckboxItem, MenuItem, type MenuItemProps, MenuSeparator, Menubar, MenubarContent, MenubarItem, type MenubarItemProps, MenubarMenu, MenubarSeparator, MenubarTrigger, NavBar, type NavBarItem, type NavBarOrientation, type NavBarProps, NavItem, type NavItemProps, NavSection, type NavSectionProps, type NormalizedOption, OTP, type OTPHandle, type OTPProps, OnboardingChecklist, type OnboardingChecklistProps, type OnboardingItem, type OnboardingItemStatus, Pagination, type PaginationProps, Popover, PopoverAnchor, PopoverArrow, PopoverClose, PopoverContent, PopoverPortal, PopoverRoot, PopoverTrigger, Progress, type ProgressProps, PullToRefresh, type PullToRefreshProps, type PullToRefreshState, RadialProgress, type RadialProgressProps, type RadialTone, Radio, RadioGroup, type RadioGroupProps, type RadioProps, ScrollArea, type ScrollAreaProps, type ScrollAreaType, SearchInput, type SearchInputProps, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, type SelectOption, type SelectProps, SelectRoot, SelectTrigger, SelectValue, Sheet, type SheetProps, Sidebar, type SidebarProps, SimpleTooltip, type SimpleTooltipProps, Skeleton, SkeletonGroup, type SkeletonGroupProps, type SkeletonProps, Slider, type SliderProps, Sparkline, type SparklineProps, Spinner, type SpinnerProps, SplitButton, type SplitButtonProps, StatCard, type StatCardProps, type StatTrend, StatusDot, type StatusDotProps, type StatusState, type StepState, Stepper, type StepperProps, type StepperStep, Switch, type SwitchProps, Tab, TabBar, type TabBarItem, type TabBarProps, type TabProps, Tabs, TabsContent, TabsList, type TabsProps, type TabsVariantProps, Tag, type TagProps, Textarea, type TextareaProps, type Theme, Timeline, type TimelineEvent, type TimelineEventTone, TimelineItem, type TimelineItemProps, type TimelineProps, ToastCard, type ToastInput, ToastProvider, type ToastVariant, Tooltip, TooltipArrow, TooltipContent, TooltipPortal, TooltipProvider, TooltipTrigger, Topbar, type TopbarProps, Tree, type TreeItem, type TreeProps, type UseControllableStateProps, type UseKeyboardListOptions, type UseKeyboardListResult, type WizardContext, WizardDialog, type WizardDialogProps, type WizardStep, badgeStyles, buttonStyles, cardStyles, cn, filterCommandItems, formatRelative, iconButtonStyles, useControllableState, useDisclosure, useEscape, useIsomorphicLayoutEffect, useKeyboardList, useOutsideClick, useTheme, useToast };
|
|
2425
|
+
export { Accordion, AccordionContent, type AccordionContentProps, AccordionItem, type AccordionItemProps, type AccordionProps, AccordionTrigger, type AccordionTriggerProps, type ActivityActor, type ActivityEvent, ActivityTimeline, type ActivityTimelineProps, Alert, AlertDialog, AlertDialogAction, AlertDialogCancel, type AlertDialogProps, AlertDialogRoot, AlertDialogTrigger, type AlertProps, type AlertTone, Avatar, AvatarGroup, type AvatarGroupProps, type AvatarProps, type AvatarSize, type AvatarStatus, Badge, type BadgeProps, Banner, type BannerProps, type BannerTone, Breadcrumbs, type BreadcrumbsProps, Button, ButtonGroup, type ButtonGroupProps, type ButtonProps, Calendar, type CalendarProps, Card, CardLink, type CardLinkProps, type CardProps, Carousel, type CarouselProps, Checkbox, type CheckboxProps, Chip, type ChipProps, Combobox, type ComboboxOption, type ComboboxProps, CommandPalette, type CommandPaletteGroup, type CommandPaletteItem, type CommandPaletteProps, ContextMenu, ContextMenuContent, ContextMenuItem, type ContextMenuItemProps, ContextMenuPortal, ContextMenuRoot, ContextMenuSeparator, ContextMenuTrigger, Crumb, type CrumbProps, DataTable, type DataTableColumn, type DataTableProps, type DataTableSort, DatePicker, type DatePickerProps, type DateRange, DateRangePicker, type DateRangePickerProps, Dialog, DialogClose, DialogContent, type DialogContentProps, DialogOverlay, DialogPortal, type DialogProps, DialogRoot, DialogTrigger, Dots, type DotsProps, Drawer, type DrawerProps, type DrawerSide, DropdownMenu, DropdownMenuContent, DropdownMenuGroup, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRoot, DropdownMenuTrigger, Dropzone, type DropzoneProps, EmptyState, type EmptyStateProps, FAB, type FABProps, Field, type FieldProps, FileChip, type FileChipProps, type FilterFacet, type FilterFacetOption, FilterPanel, type FilterPanelProps, type FilterPanelValue, HealthScore, type HealthScoreBreakdownEntry, type HealthScoreProps, HoverCard, HoverCardContent, HoverCardPortal, type HoverCardProps, HoverCardRoot, HoverCardTrigger, IconButton, type IconButtonProps, InlineEdit, type InlineEditHandle, type InlineEditProps, Input, type InputProps, Kbd, type KbdProps, LargeTitle, type LargeTitleProps, Lightbox, type LightboxProps, ListingCard, type ListingCardProps, MenuCheckboxItem, MenuItem, type MenuItemProps, MenuSeparator, Menubar, MenubarContent, MenubarItem, type MenubarItemProps, MenubarMenu, MenubarSeparator, MenubarTrigger, NavBar, type NavBarItem, type NavBarOrientation, type NavBarProps, NavItem, type NavItemProps, NavSection, type NavSectionProps, type NormalizedOption, NumberInput, type NumberInputProps, OTP, type OTPHandle, type OTPProps, OnboardingChecklist, type OnboardingChecklistProps, type OnboardingItem, type OnboardingItemStatus, Pagination, type PaginationProps, type PhoneCountry, PhoneInput, type PhoneInputProps, Popover, PopoverAnchor, PopoverArrow, PopoverClose, PopoverContent, PopoverPortal, PopoverRoot, PopoverTrigger, PriceBreakdown, type PriceBreakdownItem, PriceBreakdownLine, type PriceBreakdownLineProps, type PriceBreakdownProps, Progress, type ProgressProps, PullToRefresh, type PullToRefreshProps, type PullToRefreshState, RadialProgress, type RadialProgressProps, type RadialTone, Radio, RadioGroup, type RadioGroupProps, type RadioProps, Rating, type RatingProps, ReviewCard, type ReviewCardProps, ScrollArea, type ScrollAreaProps, type ScrollAreaType, SearchInput, type SearchInputProps, SegmentedControl, type SegmentedControlOption, type SegmentedControlProps, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, type SelectOption, type SelectProps, SelectRoot, SelectTrigger, SelectValue, Sheet, type SheetProps, Sidebar, type SidebarProps, SimpleTooltip, type SimpleTooltipProps, Skeleton, SkeletonGroup, type SkeletonGroupProps, type SkeletonProps, Slider, type SliderProps, Sparkline, type SparklineProps, Spinner, type SpinnerProps, SplitButton, type SplitButtonProps, StatCard, type StatCardProps, type StatTrend, StatusDot, type StatusDotProps, type StatusState, type StepState, Stepper, type StepperProps, type StepperStep, Switch, type SwitchProps, Tab, TabBar, type TabBarItem, type TabBarProps, type TabProps, Tabs, TabsContent, TabsList, type TabsProps, type TabsVariantProps, Tag, type TagProps, Textarea, type TextareaProps, type Theme, Timeline, type TimelineEvent, type TimelineEventTone, TimelineItem, type TimelineItemProps, type TimelineProps, ToastCard, type ToastInput, ToastProvider, type ToastVariant, Tooltip, TooltipArrow, TooltipContent, TooltipPortal, TooltipProvider, TooltipTrigger, Topbar, type TopbarProps, Tree, type TreeItem, type TreeProps, type UseControllableStateProps, type UseKeyboardListOptions, type UseKeyboardListResult, type WizardContext, WizardDialog, type WizardDialogProps, type WizardStep, badgeStyles, buttonStyles, cardStyles, cn, filterCommandItems, formatRelative, iconButtonStyles, phoneCountries, useControllableState, useDisclosure, useEscape, useIsomorphicLayoutEffect, useKeyboardList, useOutsideClick, useTheme, useToast };
|