@sesamehr/react-design-system 2.0.0-beta.6 → 2.0.0-beta.8

package/dist/hooks/useAutoGrow.d.ts

@@ -0,0 +1,22 @@
+import { RefObject } from 'react';
+export interface UseAutoGrowReturn {
+    /** Re-measure and re-apply the height. Cheap; call it on every keystroke. */
+    resize: () => void;
+}
+/**
+ * Grows a `<textarea>` with its content up to `maxRows`, then lets it scroll.
+ * Mirrors `@sesame/orxata-core` useAutoGrow.
+ *
+ * Measuring is the whole trick and it has one rule: the height has to be
+ * cleared before `scrollHeight` is read. `scrollHeight` never reports less
+ * than the element's own height, so measuring against the height left over
+ * from the previous keystroke makes the field a one-way ratchet — it grows
+ * when text is added and never shrinks when it is deleted.
+ *
+ * The cap is applied here rather than as a CSS `max-height` so that the
+ * overflow can be switched with it. A permanently scrollable textarea shows a
+ * scrollbar gutter in the browsers that reserve one, which moves the text by a
+ * few pixels for as long as the field is a single line — visible, and wrong
+ * against a design that has no scrollbar in it.
+ */
+export declare const useAutoGrow: (element: RefObject<HTMLTextAreaElement | null>, value: string, maxRows: number) => UseAutoGrowReturn;

package/dist/internal/Listbox/ListboxEmpty.d.ts

@@ -0,0 +1,3 @@
+export type ListboxEmptyProps = React.ComponentPropsWithoutRef<'div'>;
+/** Shown in place of the rows when a search matched nothing. Internal. */
+export declare const ListboxEmpty: import('react').ForwardRefExoticComponent<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;

package/dist/internal/Listbox/ListboxItem.d.ts

@@ -0,0 +1,23 @@
+export interface ListboxItemProps extends React.ComponentPropsWithoutRef<'div'> {
+    /**
+     * The check mark, for lists that have one. Pass it — even as a fragment that
+     * renders nothing while the row is unchecked — and the row reserves the space
+     * on its right; leave it out and the row sits flush.
+     */
+    indicator?: React.ReactNode;
+}
+/**
+ * One row of a list: `Select`'s option, `Combobox`'s option, `SearchPanel`'
+ * result. Port of `core/src/internal/Listbox/ListboxItem`.
+ *
+ * Whether the row leaves room on the right is decided by the presence of the
+ * `indicator` prop, not by whether the row is currently checked — a list with
+ * check marks always passes it and a list without one never does, so the gap
+ * is stable instead of appearing the moment a row becomes checked.
+ *
+ * The indicator wrapper is rendered here rather than left to the caller so the
+ * positioning lives in one file. That matters less in React than in Vue, where
+ * scoped CSS would simply not reach an element authored elsewhere, but keeping
+ * the two ports the same shape is what makes them comparable.
+ */
+export declare const ListboxItem: import('react').ForwardRefExoticComponent<ListboxItemProps & import('react').RefAttributes<HTMLDivElement>>;

package/dist/internal/Listbox/ListboxLabel.d.ts

@@ -0,0 +1,9 @@
+export type ListboxLabelProps = React.ComponentPropsWithoutRef<'div'>;
+/**
+ * The heading above a group of rows. Internal — see `Surface.tsx`.
+ *
+ * Content is `children`, never a string prop: the heading is the caller's word
+ * for their own category, and a design system that took it as a prop would be
+ * deciding how it can be written.
+ */
+export declare const ListboxLabel: import('react').ForwardRefExoticComponent<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;

package/dist/internal/Listbox/ListboxSeparator.d.ts

@@ -0,0 +1,3 @@
+export type ListboxSeparatorProps = React.ComponentPropsWithoutRef<'div'>;
+/** The rule between two groups of rows. Internal — see `Surface.tsx`. */
+export declare const ListboxSeparator: import('react').ForwardRefExoticComponent<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;

package/dist/internal/Listbox/ListboxViewport.d.ts

@@ -0,0 +1,9 @@
+export type ListboxViewportProps = React.ComponentPropsWithoutRef<'div'>;
+/**
+ * The padded, scrolling box the rows sit in. Internal — see `Surface.tsx`.
+ *
+ * Reached through `asChild` from Radix's `Select.Viewport` or cmdk's
+ * `Command.List`, both of which own the scrolling behaviour and neither of
+ * which agrees on a name.
+ */
+export declare const ListboxViewport: import('react').ForwardRefExoticComponent<Omit<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;

package/dist/internal/Surface/Surface.d.ts

@@ -0,0 +1,35 @@
+export interface SurfaceProps extends React.ComponentPropsWithoutRef<'div'> {
+    /**
+     * Drawn free of any trigger rather than tethered to one: no border, a deeper
+     * shadow. The command palette is the case.
+     */
+    floating?: boolean;
+    /**
+     * Joined to the edge of whatever it drops out of, rather than separated from
+     * it by a gap: the corners on the side it meets go square, so the two boxes
+     * read as one card. `SearchPanel`'s results are the case.
+     */
+    attached?: boolean;
+}
+/**
+ * The floating surface: the card a `Popover`, a `Select`, a `Combobox` or a
+ * `SearchPanel` panel is drawn on. Port of `core/src/internal/Surface`.
+ *
+ * Internal on purpose. It carries no portal and no positioning — those belong
+ * to whichever primitive family opened it, and they are not interchangeable.
+ * What is interchangeable is the *look*: the fill, the border, the radius, the
+ * shadow and the open/close animation. Each content component keeps its own
+ * primitive as the root and reaches this element through `asChild`, so the
+ * primitive's `data-state` and `data-side` land on the div below and the
+ * animation selectors see them.
+ *
+ * It is not exported from `main.ts`. On its own it is an inert div: no
+ * keyboard, no focus management, no positioning. The public way to get one
+ * stays `OxPopover`, `OxSelect`, `OxCombobox` or `OxSearchPanel`.
+ *
+ * `forwardRef` is not optional here: `asChild` composes the primitive's ref
+ * onto this component, and a plain function component would drop it — the
+ * popover would have nothing to measure and would position itself at the
+ * origin.
+ */
+export declare const Surface: import('react').ForwardRefExoticComponent<SurfaceProps & import('react').RefAttributes<HTMLDivElement>>;

package/dist/internal/index.d.ts

@@ -0,0 +1,13 @@
+/**
+ * Shared presentational parts. Deliberately absent from `src/main.ts`: each is
+ * an inert element with no keyboard, no roles and no positioning, so publishing
+ * one would ship something that looks like an option and behaves like a div.
+ * The public way to build a list stays `OxSelect`, `OxCombobox` or
+ * `OxSearchPanel`, each of which pairs these with its own primitive.
+ */
+export { Surface, type SurfaceProps } from './Surface/Surface.tsx';
+export { ListboxEmpty, type ListboxEmptyProps, } from './Listbox/ListboxEmpty.tsx';
+export { ListboxItem, type ListboxItemProps } from './Listbox/ListboxItem.tsx';
+export { ListboxLabel, type ListboxLabelProps, } from './Listbox/ListboxLabel.tsx';
+export { ListboxSeparator, type ListboxSeparatorProps, } from './Listbox/ListboxSeparator.tsx';
+export { ListboxViewport, type ListboxViewportProps, } from './Listbox/ListboxViewport.tsx';

package/dist/main.d.ts

@@ -1,4 +1,5 @@
 export * from './lib/utils.ts';
+export * from './hooks/index.ts';
 export { TransitionBounce as OxTransitionBounce } from './Transitions/TransitionBounce/TransitionBounce.tsx';
 export { TransitionSlideX as OxTransitionSlideX } from './Transitions/TransitionSlideX/TransitionSlideX.tsx';
 export { TransitionFade as OxTransitionFade } from './Transitions/TransitionFade/TransitionFade.tsx';
@@ -7,20 +8,24 @@ export { TransitionExpand as OxTransitionExpand } from './Transitions/Transition
 export { TransitionFlip as OxTransitionFlip } from './Transitions/TransitionFlip/TransitionFlip.tsx';
 export { Button as OxButton, buttonVariants, type ButtonVariants, } from './Button/index.ts';
 export { IconButton as OxIconButton, iconButtonVariants, type IconButtonVariants, } from './Button/IconButton/index.ts';
+export { ActionItem as OxActionItem, type ActionItemProps, } from './Button/ActionItem/index.ts';
 export { Card as OxCard, cardVariants, type CardVariants, } from './Layout/Card/index.ts';
 export { CardStack as OxCardStack, CARD_STACK_DECK, } from './Layout/CardStack/index.ts';
 export { Divider as OxDivider, type DividerProps, } from './Layout/Divider/index.ts';
 export { Resizable as OxResizable, ResizablePanel as OxResizablePanel, ResizableHandle as OxResizableHandle, } from './Layout/Resizable/index.ts';
+export { Scrollbar as OxScrollbar, useScrollbar, SCROLLBAR_THICKNESS, type ScrollbarProps, type UseScrollbarReturn, } from './Layout/Scrollbar/index.ts';
 export { LocaleProvider as OxLocaleProvider } from './Locale/index.ts';
 export { normalizeLocale, useLocale } from './Locale/index.ts';
-export { AvatarRounded as OxAvatarRounded, AvatarSquare as OxAvatarSquare, avatarRoundedVariants, avatarSquareVariants, type AvatarRoundedVariants, type AvatarSize, type AvatarSquareVariants, type AvatarTone, } from './Display/Avatar/index.ts';
+export { AvatarRounded as OxAvatarRounded, AvatarSkeleton as OxAvatarSkeleton, AvatarSquare as OxAvatarSquare, avatarRoundedVariants, avatarSquareVariants, type AvatarRoundedVariants, type AvatarSize, type AvatarSquareVariants, type AvatarTone, } from './Display/Avatar/index.ts';
 export { AvatarDetails as OxAvatarDetails } from './Display/AvatarDetails/index.ts';
 export { AvatarGroup as OxAvatarGroup, type AvatarItem, } from './Display/AvatarGroup/index.ts';
 export { Badge as OxBadge, badgeVariants, type BadgeVariants, } from './Display/Badge/index.ts';
 export { CalendarDate as OxCalendarDate, calendarDateVariants, type CalendarDateVariants, } from './Display/CalendarDate/index.ts';
 export { NumberFlow as OxNumberFlow, resolveNumberFlowPreset, NUMBER_FLOW_PRESETS, type NumberFlowConfig, type NumberFlowPreset, } from './Display/NumberFlow/index.ts';
 export { PaymentCard as OxPaymentCard, paymentCardVariants, type PaymentCardVariants, type BadgeType, type CardData, } from './Display/PaymentCard/index.ts';
-export { ChatBubble as OxChatBubble, chatBubbleVariants, type ChatBubbleVariants, } from './Display/ChatBubble/index.ts';
+export { FileCard as OxFileCard } from './Display/FileCard/index.ts';
+export { FilePreviewCard as OxFilePreviewCard } from './Display/FilePreviewCard/index.ts';
+export { ChatBubble as OxChatBubble, chatBubbleVariants, type ChatBubbleDelivery, type ChatBubbleVariants, } from './Display/ChatBubble/index.ts';
 export { ChatBubbleStatus as OxChatBubbleStatus, chatBubbleStatusVariants, type ChatBubbleStatusVariants, } from './Display/ChatBubble/ChatBubbleStatus/index.ts';
 export { Chip as OxChip, chipVariants, type ChipVariants, } from './Display/Chip/index.ts';
 export { PointMarker as OxPointMarker, pointMarkerVariants, type PointMarkerVariants, } from './Display/PointMarker/index.ts';
@@ -28,8 +33,9 @@ export { StatusBadge as OxStatusBadge, statusBadgeVariants, indicatorVariants, t
 export { Bullet as OxBullet, bulletVariants, type BulletVariants, } from './Feedback/Bullet/index.ts';
 export { Loader as OxLoader } from './Feedback/Loader/index.ts';
 export { Progress as OxProgress } from './Feedback/Progress/index.ts';
+export { Skeleton as OxSkeleton } from './Feedback/Skeleton/index.ts';
 export { Alert as OxAlert, AlertClose as OxAlertClose, AlertDescription as OxAlertDescription, AlertIcon as OxAlertIcon, AlertTitle as OxAlertTitle, AlertToggle as OxAlertToggle, } from './Feedback/Alert/index.ts';
-export { Dialog as OxDialog, DialogContent as OxDialogContent, DialogTitle as OxDialogTitle, DialogDescription as OxDialogDescription, DialogOverlay as OxDialogOverlay, DialogTwoPanelContent as OxDialogTwoPanelContent, DialogTrigger as OxDialogTrigger, DialogClose as OxDialogClose, } from './Feedback/Dialog/index.ts';
+export { Dialog as OxDialog, DialogContent as OxDialogContent, DialogBody as OxDialogBody, DialogTitle as OxDialogTitle, DialogDescription as OxDialogDescription, DialogOverlay as OxDialogOverlay, DialogTwoPanelContent as OxDialogTwoPanelContent, DialogTrigger as OxDialogTrigger, DialogClose as OxDialogClose, } from './Feedback/Dialog/index.ts';
 export { Tooltip as OxTooltip, TooltipContent as OxTooltipContent, } from './Feedback/Tooltip/index.ts';
 export { Popover as OxPopover, PopoverContent as OxPopoverContent, PopoverClose as OxPopoverClose, } from './Feedback/Popover/index.ts';
 export { Accordion as OxAccordion, AccordionItem as OxAccordionItem, AccordionTrigger as OxAccordionTrigger, AccordionContent as OxAccordionContent, } from './Navigation/Accordion/index.ts';
@@ -37,7 +43,7 @@ export { ToggleTabs as OxToggleTabs, ToggleTabsList as OxToggleTabsList, ToggleT
 export { PageControl as OxPageControl, pageControlDots, PAGE_CONTROL_WINDOW, type PageControlDot, type PageControlDotSize, } from './Navigation/PageControl/index.ts';
 export { Breadcrumb as OxBreadcrumb, BreadcrumbList as OxBreadcrumbList, BreadcrumbItem as OxBreadcrumbItem, BreadcrumbLink as OxBreadcrumbLink, BreadcrumbPage as OxBreadcrumbPage, BreadcrumbSeparator as OxBreadcrumbSeparator, BreadcrumbEllipsis as OxBreadcrumbEllipsis, } from './Navigation/Breadcrumb/index.ts';
 export { Counter as OxCounter, counterVariants, type CounterVariants, } from './Forms/Field/Counter/index.ts';
-export { FieldGroup as OxFieldGroup, FieldLabel as OxFieldLabel, FieldMessage as OxFieldMessage, type FieldGroupProps, } from './Forms/Field/index.ts';
-export { InputGroup as OxInputGroup, InputText as OxInputText, InputNumber as OxInputNumber, InputNumberContent as OxInputNumberContent, InputNumberDecrement as OxInputNumberDecrement, InputNumberIncrement as OxInputNumberIncrement, InputNumberInput as OxInputNumberInput, InputPassword as OxInputPassword, InputPasswordInput as OxInputPasswordInput, InputPasswordToggle as OxInputPasswordToggle, useInputPassword, InputOtp as OxInputOtp, InputOtpGroup as OxInputOtpGroup, InputOtpSlot as OxInputOtpSlot, InputOtpSeparator as OxInputOtpSeparator, useInputOtp, Calendar as OxCalendar, CalendarRange as OxCalendarRange, CalendarDay as OxCalendarDay, calendarDayVariants, Combobox as OxCombobox, ComboboxCancel as OxComboboxCancel, ComboboxInput as OxComboboxInput, ComboboxChipsInput as OxComboboxChipsInput, ComboboxContent as OxComboboxContent, ComboboxItem as OxComboboxItem, ComboboxEmpty as OxComboboxEmpty, ComboboxGroup as OxComboboxGroup, ComboboxSeparator as OxComboboxSeparator, SearchBar as OxSearchBar, searchBarVariants, useSearchDelay, Select as OxSelect, SelectTrigger as OxSelectTrigger, SelectContent as OxSelectContent, SelectItem as OxSelectItem, SelectGroup as OxSelectGroup, SelectSeparator as OxSelectSeparator, Switch as OxSwitch, Checkbox as OxCheckbox, RadioButton as OxRadioButton, RadioGroup as OxRadioGroup, ToggleGroup as OxToggleGroup, ToggleLabel as OxToggleLabel, ToggleDescription as OxToggleDescription, SWITCH_SIZES, type InputNumberProps, type InputPasswordProps, type InputPasswordContext, type InputOtpProps, type InputOtpSlotProps, type InputOtpContext, type CalendarProps, type CalendarRangeProps, type CalendarDateRange, type CalendarDayProps, type CalendarDayState, type CalendarDayVariants, type CalendarConstraints, type ComboboxProps, type SearchBarVariants, type UseSearchDelayReturn, type SelectProps, type RadioGroupProps, type ToggleGroupProps, type ToggleLabelProps, type ToggleDescriptionProps, } from './Forms/Inputs/index.ts';
+export { FieldGroup as OxFieldGroup, FieldLabel as OxFieldLabel, FieldMessage as OxFieldMessage, useFieldControl, useFieldControlGroup, type FieldControlAttrs, type FieldControlGroupAttrs, type FieldGroupProps, type FieldVariant, } from './Forms/Field/index.ts';
+export { InputGroup as OxInputGroup, InputText as OxInputText, InputNumber as OxInputNumber, InputNumberContent as OxInputNumberContent, InputNumberDecrement as OxInputNumberDecrement, InputNumberIncrement as OxInputNumberIncrement, InputNumberInput as OxInputNumberInput, InputPassword as OxInputPassword, InputPasswordInput as OxInputPasswordInput, InputPasswordToggle as OxInputPasswordToggle, useInputPassword, InputOtp as OxInputOtp, InputOtpGroup as OxInputOtpGroup, InputOtpSlot as OxInputOtpSlot, InputOtpSeparator as OxInputOtpSeparator, useInputOtp, Calendar as OxCalendar, CalendarRange as OxCalendarRange, CalendarDay as OxCalendarDay, calendarDayVariants, Combobox as OxCombobox, ComboboxCancel as OxComboboxCancel, ComboboxInput as OxComboboxInput, ComboboxChipsInput as OxComboboxChipsInput, ComboboxContent as OxComboboxContent, ComboboxItem as OxComboboxItem, ComboboxEmpty as OxComboboxEmpty, ComboboxGroup as OxComboboxGroup, ComboboxSeparator as OxComboboxSeparator, ChatInput as OxChatInput, DatePicker as OxDatePicker, DateRangePicker as OxDateRangePicker, DatePickerTrigger as OxDatePickerTrigger, DatePickerHeader as OxDatePickerHeader, DatePickerMonthSelect as OxDatePickerMonthSelect, DatePickerYearSelect as OxDatePickerYearSelect, SearchBar as OxSearchBar, searchBarVariants, useSearchDelay, SearchPanel as OxSearchPanel, SearchPanelInput as OxSearchPanelInput, SearchPanelList as OxSearchPanelList, SearchPanelGroup as OxSearchPanelGroup, SearchPanelItem as OxSearchPanelItem, SearchPanelEmpty as OxSearchPanelEmpty, Select as OxSelect, SelectTrigger as OxSelectTrigger, SelectContent as OxSelectContent, SelectItem as OxSelectItem, SelectGroup as OxSelectGroup, SelectSeparator as OxSelectSeparator, Textarea as OxTextarea, Switch as OxSwitch, Checkbox as OxCheckbox, RadioButton as OxRadioButton, RadioGroup as OxRadioGroup, ToggleGroup as OxToggleGroup, ToggleLabel as OxToggleLabel, ToggleDescription as OxToggleDescription, SWITCH_SIZES, type InputNumberProps, type InputPasswordProps, type InputPasswordContext, type InputOtpProps, type InputOtpSlotProps, type InputOtpContext, type CalendarProps, type CalendarRangeProps, type CalendarDateRange, type CalendarDayProps, type CalendarDayState, type CalendarDayVariants, type CalendarConstraints, type CalendarNav, type ComboboxProps, type ChatInputActionLabels, type ChatInputState, type DatePickerProps, type DateRangePickerProps, type DatePickerTriggerProps, type DatePickerHeaderProps, type DatePickerMonthSelectProps, type DatePickerYearSelectProps, type SearchBarVariants, type UseSearchDelayReturn, type SelectProps, type TextareaCounterState, type RadioGroupProps, type ToggleGroupProps, type ToggleLabelProps, type ToggleDescriptionProps, } from './Forms/Inputs/index.ts';
 export { Table as OxTable, TableVirtualized as OxTableVirtualized, TableHead as OxTableHead, TableBody as OxTableBody, TableRow as OxTableRow, TableCell as OxTableCell, TableHeaderCell as OxTableHeaderCell, TableSelectCell as OxTableSelectCell, TableDragCell as OxTableDragCell, TableBulkHeader as OxTableBulkHeader, TablePagination as OxTablePagination, TableEmpty as OxTableEmpty, TableRowExpanded as OxTableRowExpanded, TableExpandCell as OxTableExpandCell, TableColumnVisibility as OxTableColumnVisibility, useTable, useTableSelection, useTableSorting, useTablePagination, useTableDetailRow, useTablePinning, useTableColumns, useScrollShadow, useDragToScroll, useFixedColumns, useTableVirtual, } from './Data/Table/index.ts';
 export type { UseTableOptions, UseTableReturn, UseTableSelectionReturn, UseTableSortingReturn, UseTablePaginationOptions, UseTablePaginationReturn, DetailRowInstance, DetailRowOptions, DetailRowPluginDef, UseTablePinningOptions, UseTablePinningReturn, CellInfo, HeaderInfo, UseTableVirtualOptions, UseTableVirtualReturn, UseTableColumnsOptions, UseTableColumnsReturn, UseScrollShadowOptions, UseScrollShadowReturn, UseDragToScrollOptions, UseDragToScrollReturn, UseFixedColumnsOptions, TableProps, TableMode, ColumnDef, ColumnAlign, CellContext, SortingState, PaginationState, PaginationChangePayload, SortingChangePayload, SelectionChangePayload, FilterChangePayload, ColumnResizeMode, ColumnVisibilityState, ColumnOrderState, ExpandedState, ColumnVisibilityChangePayload, ColumnOrderChangePayload, RowExpandChangePayload, ColumnResizePayload, ColumnPinningState, } from './Data/Table/index.ts';