@sesamehr/react-design-system 1.1.0 → 1.3.0

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.
Files changed (56) hide show
  1. package/dist/Button/Button.d.ts +1 -1
  2. package/dist/Data/Table/TableBody/TableBody.d.ts +1 -2
  3. package/dist/Feedback/Alert/Alert.d.ts +7 -5
  4. package/dist/Feedback/Dialog/Dialog.d.ts +1 -1
  5. package/dist/Feedback/Dialog/DialogTwoPanelContent.d.ts +1 -1
  6. package/dist/Feedback/Popover/Popover.d.ts +2 -2
  7. package/dist/Feedback/Tooltip/Tooltip.d.ts +2 -2
  8. package/dist/Forms/Inputs/Combobox/Combobox.d.ts +2 -2
  9. package/dist/Forms/Inputs/Combobox/ComboboxChipsInput.d.ts +1 -1
  10. package/dist/Forms/Inputs/Combobox/ComboboxContent.d.ts +1 -1
  11. package/dist/Forms/Inputs/Combobox/ComboboxEmpty.d.ts +1 -1
  12. package/dist/Forms/Inputs/Combobox/ComboboxGroup.d.ts +1 -1
  13. package/dist/Forms/Inputs/Combobox/ComboboxInput.d.ts +1 -1
  14. package/dist/Forms/Inputs/Combobox/ComboboxItem.d.ts +1 -1
  15. package/dist/Forms/Inputs/Combobox/ComboboxSeparator.d.ts +1 -1
  16. package/dist/Forms/Inputs/Combobox/context.d.ts +4 -4
  17. package/dist/Forms/Inputs/InputNumber/InputNumber.d.ts +2 -1
  18. package/dist/Forms/Inputs/InputNumber/InputNumberDecrement.d.ts +1 -1
  19. package/dist/Forms/Inputs/InputNumber/InputNumberIncrement.d.ts +1 -1
  20. package/dist/Forms/Inputs/InputNumber/InputNumberInput.d.ts +1 -1
  21. package/dist/Forms/Inputs/InputOtp/InputOtp.d.ts +4 -5
  22. package/dist/Forms/Inputs/InputOtp/types.d.ts +2 -2
  23. package/dist/Forms/Inputs/InputPassword/InputPassword.d.ts +5 -5
  24. package/dist/Forms/Inputs/InputPassword/InputPasswordToggle.d.ts +2 -2
  25. package/dist/Forms/Inputs/InputText/InputText.d.ts +7 -7
  26. package/dist/Forms/Inputs/Select/Select.d.ts +20 -0
  27. package/dist/Forms/Inputs/Select/SelectContent.d.ts +11 -0
  28. package/dist/Forms/Inputs/Select/SelectGroup.d.ts +7 -0
  29. package/dist/Forms/Inputs/Select/SelectItem.d.ts +14 -0
  30. package/dist/Forms/Inputs/Select/SelectSeparator.d.ts +4 -0
  31. package/dist/Forms/Inputs/Select/SelectTrigger.d.ts +25 -0
  32. package/dist/Forms/Inputs/Select/context.d.ts +21 -0
  33. package/dist/Forms/Inputs/Select/index.d.ts +6 -0
  34. package/dist/Forms/Inputs/Select/types.d.ts +6 -0
  35. package/dist/Forms/Inputs/Toggle/Checkbox/Checkbox.d.ts +4 -4
  36. package/dist/Forms/Inputs/Toggle/RadioButton/RadioButton.d.ts +2 -2
  37. package/dist/Forms/Inputs/Toggle/RadioButton/RadioGroup.d.ts +1 -1
  38. package/dist/Forms/Inputs/Toggle/Switch/Switch.d.ts +2 -3
  39. package/dist/Forms/Inputs/index.d.ts +1 -0
  40. package/dist/Forms/Inputs/inputSize.d.ts +3 -3
  41. package/dist/Layout/Card/Card.d.ts +1 -1
  42. package/dist/Layout/Divider/Divider.d.ts +6 -5
  43. package/dist/Layout/Resizable/Resizable.d.ts +4 -4
  44. package/dist/Layout/Resizable/ResizableHandle.d.ts +5 -6
  45. package/dist/Layout/Resizable/ResizablePanel.d.ts +1 -1
  46. package/dist/Navigation/Accordion/Accordion.d.ts +1 -1
  47. package/dist/Navigation/Tabs/Tabs.d.ts +1 -1
  48. package/dist/Transitions/TransitionBase.d.ts +2 -2
  49. package/dist/Transitions/TransitionFlip/TransitionFlip.d.ts +3 -2
  50. package/dist/main.d.ts +1 -1
  51. package/dist/react-design-system.css +1 -1
  52. package/dist/react-design-system.js +10287 -7834
  53. package/dist/react-design-system.umd.cjs +48 -48
  54. package/package.json +2 -1
  55. package/src/assets/styles/theme-v2.css +2 -2
  56. package/src/assets/styles/theme-v3.css +2 -2
@@ -7,6 +7,6 @@ export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElemen
7
7
  }
8
8
  /**
9
9
  * Button — mirrors `@sesame/orxata-core` Button.
10
- * `asChild` replaces reka-ui's `<Primitive as-child>` via `@radix-ui/react-slot`.
10
+ * `asChild` renders the child element instead of a `<button>`, via `@radix-ui/react-slot`.
11
11
  */
12
12
  export declare const Button: import('react').ForwardRefExoticComponent<ButtonProps & import('react').RefAttributes<HTMLButtonElement>>;
@@ -15,7 +15,6 @@ export interface TableBodyProps extends React.ComponentPropsWithoutRef<'tbody'>
15
15
  }
16
16
  /**
17
17
  * Styled `<tbody>`. When `draggable`, wraps rows in a dnd-kit sortable
18
- * context — replacing the Vue `vue-draggable-plus` (Sortable.js) integration.
19
- * Sortable item ids are derived from the index of each `items` entry.
18
+ * context. Sortable item ids are derived from the index of each `items` entry.
20
19
  */
21
20
  export declare const TableBody: import('react').ForwardRefExoticComponent<TableBodyProps & import('react').RefAttributes<HTMLTableSectionElement>>;
@@ -4,15 +4,17 @@ export interface AlertProps extends Omit<React.HTMLAttributes<HTMLDivElement>, '
4
4
  dismissible?: boolean;
5
5
  collapsible?: boolean;
6
6
  isOpen?: boolean;
7
- /** Emitted when the alert is dismissed (maps Vue `dismissed`). */
7
+ /** Called once the alert has been dismissed. */
8
8
  onDismissed?: () => void;
9
- /** Emitted with the next open state (maps Vue `update:isOpen`). */
9
+ /** Called with the next open state — the controlled half of `isOpen`. */
10
10
  onOpenChange?: (isOpen: boolean) => void;
11
- /** Emitted with the next open state (maps Vue `toggled`). */
11
+ /** Called with the next open state when the collapsible toggle is used. */
12
12
  onToggled?: (open: boolean) => void;
13
13
  }
14
14
  /**
15
- * Alert — mirrors `@sesame/orxata-core` Alert.
16
- * Vue `provide/inject` context becomes React context (`AlertContext`).
15
+ * Alert.
16
+ *
17
+ * The parts share dismissal and collapsible state through `AlertContext`, so
18
+ * each one decides its own visibility rather than being told by the root.
17
19
  */
18
20
  export declare const Alert: import('react').ForwardRefExoticComponent<AlertProps & import('react').RefAttributes<HTMLDivElement>>;
@@ -5,7 +5,7 @@ export interface DialogProps {
5
5
  onOpenChange?: (open: boolean) => void;
6
6
  modal?: boolean;
7
7
  }
8
- /** Dialog — maps reka-ui `DialogRoot` to `@radix-ui/react-dialog`. */
8
+ /** Dialog root — built on `@radix-ui/react-dialog`. */
9
9
  export declare const Dialog: {
10
10
  ({ children, defaultOpen, open, onOpenChange, modal, }: DialogProps): import("react/jsx-runtime").JSX.Element;
11
11
  displayName: string;
@@ -1,7 +1,7 @@
1
1
  import * as DialogPrimitive from '@radix-ui/react-dialog';
2
2
  export interface DialogTwoPanelContentProps extends React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content> {
3
3
  showCloseButton?: boolean;
4
- /** Aside panel content (maps Vue `#aside` slot). */
4
+ /** Content of the side panel, beside the main one. */
5
5
  aside?: React.ReactNode;
6
6
  }
7
7
  /** DialogTwoPanelContent — two-column dialog (main + aside) with close button. */
@@ -1,5 +1,5 @@
1
1
  export interface PopoverProps {
2
- /** Trigger element (maps Vue `#trigger` slot); rendered via Radix `asChild`. */
2
+ /** Element that opens the popover; rendered via Radix `asChild`. */
3
3
  trigger?: React.ReactNode;
4
4
  children?: React.ReactNode;
5
5
  defaultOpen?: boolean;
@@ -7,7 +7,7 @@ export interface PopoverProps {
7
7
  onOpenChange?: (open: boolean) => void;
8
8
  modal?: boolean;
9
9
  }
10
- /** Popover — maps reka-ui `PopoverRoot/Trigger` to `@radix-ui/react-popover`. */
10
+ /** Popover — built on `@radix-ui/react-popover`, root and trigger in one. */
11
11
  export declare const Popover: {
12
12
  ({ trigger, children, defaultOpen, open, onOpenChange, modal, }: PopoverProps): import("react/jsx-runtime").JSX.Element;
13
13
  displayName: string;
@@ -1,5 +1,5 @@
1
1
  export interface TooltipProps {
2
- /** Trigger element (maps Vue `#trigger` slot); rendered via Radix `asChild`. */
2
+ /** Element the tooltip describes; rendered via Radix `asChild`. */
3
3
  trigger?: React.ReactNode;
4
4
  children?: React.ReactNode;
5
5
  defaultOpen?: boolean;
@@ -9,7 +9,7 @@ export interface TooltipProps {
9
9
  skipDelayDuration?: number;
10
10
  disableHoverableContent?: boolean;
11
11
  }
12
- /** Tooltip — maps reka-ui `TooltipProvider/Root/Trigger` to `@radix-ui/react-tooltip`. */
12
+ /** Tooltip — built on `@radix-ui/react-tooltip`, provider and root in one. */
13
13
  export declare const Tooltip: {
14
14
  ({ trigger, children, defaultOpen, open, onOpenChange, delayDuration, skipDelayDuration, disableHoverableContent, }: TooltipProps): import("react/jsx-runtime").JSX.Element;
15
15
  displayName: string;
@@ -19,9 +19,9 @@ export interface ComboboxProps extends Omit<React.HTMLAttributes<HTMLDivElement>
19
19
  dataTestid: string;
20
20
  }
21
21
  /**
22
- * Combobox root — replaces reka-ui `ComboboxRoot`.
22
+ * Combobox root.
23
23
  *
24
- * reka had no React equivalent, so this is `@radix-ui/react-popover` for the
24
+ * Radix ships no combobox, so this is `@radix-ui/react-popover` for the
25
25
  * open/close shell plus a small context (see `context.ts`) carrying the
26
26
  * selection, `multiple`, `disabled` and search state that the parts share.
27
27
  */
@@ -7,7 +7,7 @@ export interface ComboboxChipsInputProps extends Omit<React.InputHTMLAttributes<
7
7
  trigger?: React.ReactNode;
8
8
  }
9
9
  /**
10
- * ComboboxChipsInput — replaces reka `ComboboxChipsInput`.
10
+ * ComboboxChipsInput — the search field with the current selection as chips.
11
11
  * Multi-select field: renders the selected values as removable chips (read from
12
12
  * the shared `multiple` model) alongside the search field.
13
13
  */
@@ -5,7 +5,7 @@ export interface ComboboxContentProps extends Omit<React.ComponentPropsWithoutRe
5
5
  align?: 'start' | 'center' | 'end';
6
6
  }
7
7
  /**
8
- * ComboboxContent — replaces reka `ComboboxPortal`/`ComboboxContent`/`ComboboxViewport`.
8
+ * ComboboxContent — the popover surface and the scrollable list in one.
9
9
  * `@radix-ui/react-popover` provides the portal + positioning; `cmdk`'s `Command`
10
10
  * provides item filtering. A visually-hidden `CommandInput` receives the shared
11
11
  * search string so typing in the anchored input filters the list.
@@ -1,6 +1,6 @@
1
1
  import { CommandEmpty } from 'cmdk';
2
2
  export type ComboboxEmptyProps = React.ComponentPropsWithoutRef<typeof CommandEmpty>;
3
- /** ComboboxEmpty — replaces reka `ComboboxEmpty`. Shown when no items match. */
3
+ /** ComboboxEmpty — shown when the search matches no items. */
4
4
  export declare const ComboboxEmpty: import('react').ForwardRefExoticComponent<Omit<{
5
5
  children?: React.ReactNode;
6
6
  } & Pick<Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof import('react').HTMLAttributes<HTMLDivElement>> & {
@@ -3,5 +3,5 @@ export interface ComboboxGroupProps extends React.ComponentPropsWithoutRef<typeo
3
3
  /** Optional group heading. */
4
4
  label?: string;
5
5
  }
6
- /** ComboboxGroup — replaces reka `ComboboxGroup` + `ComboboxLabel`. */
6
+ /** ComboboxGroup — a labelled set of items. */
7
7
  export declare const ComboboxGroup: import('react').ForwardRefExoticComponent<ComboboxGroupProps & import('react').RefAttributes<HTMLDivElement>>;
@@ -9,7 +9,7 @@ export interface ComboboxInputProps extends Omit<React.InputHTMLAttributes<HTMLI
9
9
  trigger?: React.ReactNode;
10
10
  }
11
11
  /**
12
- * ComboboxInput — replaces reka `ComboboxAnchor` + `ComboboxInput` + `ComboboxTrigger`.
12
+ * ComboboxInput — the anchor, the search field and the trigger button in one.
13
13
  * The single-select text field: shows the current selection, opens the popover
14
14
  * on focus and drives cmdk filtering via the shared `search` state.
15
15
  */
@@ -4,7 +4,7 @@ export interface ComboboxItemProps extends Omit<React.ComponentPropsWithoutRef<t
4
4
  disabled?: boolean;
5
5
  }
6
6
  /**
7
- * ComboboxItem — replaces reka `ComboboxItem` + `ComboboxItemIndicator`.
7
+ * ComboboxItem — a selectable option, with its own check indicator.
8
8
  * Selecting commits the value through the shared context (toggles for multiple).
9
9
  */
10
10
  export declare const ComboboxItem: import('react').ForwardRefExoticComponent<ComboboxItemProps & import('react').RefAttributes<HTMLDivElement>>;
@@ -1,6 +1,6 @@
1
1
  import { CommandSeparator } from 'cmdk';
2
2
  export type ComboboxSeparatorProps = React.ComponentPropsWithoutRef<typeof CommandSeparator>;
3
- /** ComboboxSeparator — replaces reka `ComboboxSeparator`. */
3
+ /** ComboboxSeparator — a rule between groups of items. */
4
4
  export declare const ComboboxSeparator: import('react').ForwardRefExoticComponent<Omit<Pick<Pick<import('react').DetailedHTMLProps<import('react').HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof import('react').HTMLAttributes<HTMLDivElement>> & {
5
5
  ref?: React.Ref<HTMLDivElement>;
6
6
  } & {
@@ -1,10 +1,10 @@
1
1
  /**
2
2
  * Shared Combobox state.
3
3
  *
4
- * The reka-ui `ComboboxRoot` exposed a single context (model value, multiple,
5
- * disabled, open) consumed by every sub-part. cmdk + `@radix-ui/react-popover`
6
- * split those responsibilities, so we recreate that single context here to keep
7
- * the same public component split and behaviour.
4
+ * cmdk owns the list and the filtering, `@radix-ui/react-popover` owns the
5
+ * open state, and neither knows about the selection. One context holds what
6
+ * every part needs — the value, `multiple`, `disabled` and the search term — so
7
+ * a part can be used on its own without threading props through the tree.
8
8
  */
9
9
  export interface ComboboxContextValue {
10
10
  /** Current selection. `string` for single-select, `string[]` for multiple. */
@@ -13,7 +13,8 @@ export interface InputNumberProps extends Omit<React.HTMLAttributes<HTMLDivEleme
13
13
  disabled?: boolean;
14
14
  }
15
15
  /**
16
- * InputNumber root — replaces reka-ui `NumberFieldRoot`.
16
+ * InputNumber root. Radix ships no NumberField, so the stepping, clamping and
17
+ * keyboard behaviour are implemented here.
17
18
  * Radix has no NumberField, so this is a controlled numeric field that provides
18
19
  * value/step/min/max/disabled context to its subcomponents.
19
20
  */
@@ -1,3 +1,3 @@
1
1
  export type InputNumberDecrementProps = React.ButtonHTMLAttributes<HTMLButtonElement>;
2
- /** Replaces reka-ui `NumberFieldDecrement`. */
2
+ /** Steps the value down; holds to repeat. */
3
3
  export declare const InputNumberDecrement: import('react').ForwardRefExoticComponent<InputNumberDecrementProps & import('react').RefAttributes<HTMLButtonElement>>;
@@ -1,3 +1,3 @@
1
1
  export type InputNumberIncrementProps = React.ButtonHTMLAttributes<HTMLButtonElement>;
2
- /** Replaces reka-ui `NumberFieldIncrement`. */
2
+ /** Steps the value up; holds to repeat. */
3
3
  export declare const InputNumberIncrement: import('react').ForwardRefExoticComponent<InputNumberIncrementProps & import('react').RefAttributes<HTMLButtonElement>>;
@@ -1,3 +1,3 @@
1
1
  export type InputNumberInputProps = Omit<React.InputHTMLAttributes<HTMLInputElement>, 'value' | 'defaultValue' | 'type'>;
2
- /** Replaces reka-ui `NumberFieldInput` — a `spinbutton`-role text input. */
2
+ /** The editable field itself, with a `spinbutton` role. */
3
3
  export declare const InputNumberInput: import('react').ForwardRefExoticComponent<InputNumberInputProps & import('react').RefAttributes<HTMLInputElement>>;
@@ -1,10 +1,9 @@
1
1
  import { InputOtpProps } from './types.ts';
2
2
  /**
3
- * InputOtp root — mirrors `@sesame/orxata-core` InputOtp.
3
+ * InputOtp root.
4
4
  *
5
- * The Vue package delegates to reka-ui's `PinInput`, which has no Radix
6
- * counterpart, so the pin behaviour (focus advance, backspace, arrow keys,
7
- * paste spreading, per-slot labels) lives here and reaches the slots through
8
- * context. The rendered DOM matches the Vue version: one `<input>` per slot.
5
+ * Radix ships no PinInput, so the behaviour lives here — focus advance,
6
+ * backspace, arrow keys, paste spreading, per-slot labels — and reaches the
7
+ * slots through context. One `<input>` per slot.
9
8
  */
10
9
  export declare const InputOtp: import('react').ForwardRefExoticComponent<InputOtpProps & import('react').RefAttributes<HTMLDivElement>>;
@@ -6,13 +6,13 @@ export interface InputOtpProps extends Omit<React.HTMLAttributes<HTMLDivElement>
6
6
  /** Render every slot as a password field. */
7
7
  mask?: boolean;
8
8
  disabled?: boolean;
9
- /** Controlled code (mirrors the Vue `v-model`). */
9
+ /** Controlled code. Pair with `onValueChange`; omit for uncontrolled. */
10
10
  value?: string;
11
11
  /** Uncontrolled initial code. */
12
12
  defaultValue?: string;
13
13
  /** Emitted whenever the code changes. */
14
14
  onValueChange?: (code: string) => void;
15
- /** Emitted once every slot is filled (mirrors the Vue `complete` event). */
15
+ /** Called once every slot holds a character. */
16
16
  onComplete?: (code: string) => void;
17
17
  children?: React.ReactNode;
18
18
  }
@@ -1,20 +1,20 @@
1
1
  import { InputSize } from '../inputSize.ts';
2
2
  export interface InputPasswordProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange'> {
3
3
  size?: InputSize;
4
- /** Controlled value (mirrors the Vue `field` model). */
4
+ /** Controlled value. Pair with `onFieldChange`; omit for uncontrolled. */
5
5
  field?: string;
6
- /** Emitted on input (mirrors the Vue `update:field` event). */
6
+ /** Called on every input with the next value. */
7
7
  onFieldChange?: (value: string) => void;
8
- /** Controlled clear-text state (mirrors the Vue `visible` model). */
8
+ /** Controlled clear-text state. Pair with `onVisibleChange`. */
9
9
  visible?: boolean;
10
- /** Emitted when the toggle flips (mirrors the Vue `update:visible` event). */
10
+ /** Called when the reveal toggle flips, with the next state. */
11
11
  onVisibleChange?: (visible: boolean) => void;
12
12
  dataTestid: string;
13
13
  }
14
14
  /**
15
15
  * InputPassword root — mirrors `@sesame/orxata-core` InputPassword.
16
16
  * Provides the value and clear-text state to `InputPasswordInput` and
17
- * `InputPasswordToggle` through context, replacing the Vue provide/inject.
17
+ * `InputPasswordToggle` through context.
18
18
  * Both `field` and `visible` work controlled or uncontrolled.
19
19
  */
20
20
  export declare const InputPassword: import('react').ForwardRefExoticComponent<InputPasswordProps & import('react').RefAttributes<HTMLDivElement>>;
@@ -1,8 +1,8 @@
1
1
  import { ReactNode } from 'react';
2
2
  export interface InputPasswordToggleProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, 'children'> {
3
3
  /**
4
- * Custom toggle content. Accepts a render function to receive the clear-text
5
- * state, mirroring the Vue scoped slot `<slot :visible="visible">`.
4
+ * Custom toggle content. Pass a render function to receive the current
5
+ * clear-text state and render accordingly.
6
6
  */
7
7
  children?: ReactNode | ((props: {
8
8
  visible: boolean;
@@ -1,16 +1,16 @@
1
1
  import { InputSize } from '../inputSize.ts';
2
2
  export interface InputTextProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, 'size'> {
3
3
  size?: InputSize;
4
- /** Controlled value (mirrors the Vue `field` model). */
4
+ /** Controlled value. Pair with `onFieldChange`; omit for uncontrolled. */
5
5
  field?: string;
6
- /** Emitted on input (mirrors the Vue `update:field` event). */
6
+ /** Called on every input with the next value. */
7
7
  onFieldChange?: (value: string) => void;
8
8
  }
9
9
  /**
10
- * InputText — mirrors `@sesame/orxata-core` InputText.
11
- * The Vue `field` v-model becomes the `field` value + `onFieldChange` callback.
12
- * Native `value`/`onChange` still pass through via `...props`.
13
- * `type` defaults to `'text'` but can be overridden (matches the Vue
14
- * `<input type="text" v-bind="props">` where a passed `type` wins).
10
+ * InputText.
11
+ *
12
+ * `field` + `onFieldChange` are the controlled pair; native `value`/`onChange`
13
+ * still pass through via `...props` for anyone who prefers them. `type`
14
+ * defaults to `'text'`, and a `type` passed by the caller wins.
15
15
  */
16
16
  export declare const InputText: import('react').ForwardRefExoticComponent<InputTextProps & import('react').RefAttributes<HTMLInputElement>>;
@@ -0,0 +1,20 @@
1
+ import * as SelectPrimitive from '@radix-ui/react-select';
2
+ export interface SelectProps extends Omit<React.ComponentPropsWithoutRef<typeof SelectPrimitive.Root>, 'children'> {
3
+ className?: string;
4
+ children?: React.ReactNode;
5
+ dataTestid: string;
6
+ }
7
+ /**
8
+ * Select root. `@radix-ui/react-select` Root renders no element of its own, so
9
+ * the wrapper below is what carries `data-slot`, `data-testid` and the class.
10
+ *
11
+ * The selection is held here rather than handed to the primitive as an optional
12
+ * prop: an empty string is how Radix asks for the placeholder, so passing one
13
+ * keeps it controlled from the first render, where `undefined` would make it
14
+ * flip from uncontrolled to controlled on the first choice and warn. Both paths
15
+ * still work — `defaultValue` seeds the state, `value` overrides it.
16
+ *
17
+ * The same state also feeds the trigger's render prop, together with the label
18
+ * registry in `context.ts`.
19
+ */
20
+ export declare const Select: import('react').ForwardRefExoticComponent<SelectProps & import('react').RefAttributes<HTMLDivElement>>;
@@ -0,0 +1,11 @@
1
+ import * as SelectPrimitive from '@radix-ui/react-select';
2
+ export interface SelectContentProps extends Omit<React.ComponentPropsWithoutRef<typeof SelectPrimitive.Content>, 'side' | 'align' | 'sideOffset' | 'position'> {
3
+ side?: 'top' | 'right' | 'bottom' | 'left';
4
+ sideOffset?: number;
5
+ align?: 'start' | 'center' | 'end';
6
+ }
7
+ /**
8
+ * The floating list. Always positioned against the trigger rather than over it,
9
+ * so the popup matches the trigger's width and never covers it.
10
+ */
11
+ export declare const SelectContent: import('react').ForwardRefExoticComponent<SelectContentProps & import('react').RefAttributes<HTMLDivElement>>;
@@ -0,0 +1,7 @@
1
+ import * as SelectPrimitive from '@radix-ui/react-select';
2
+ export interface SelectGroupProps extends React.ComponentPropsWithoutRef<typeof SelectPrimitive.Group> {
3
+ /** Optional group heading. */
4
+ label?: string;
5
+ }
6
+ /** Groups related options under a heading, announced as a group label. */
7
+ export declare const SelectGroup: import('react').ForwardRefExoticComponent<SelectGroupProps & import('react').RefAttributes<HTMLDivElement>>;
@@ -0,0 +1,14 @@
1
+ import * as SelectPrimitive from '@radix-ui/react-select';
2
+ export interface SelectItemProps extends React.ComponentPropsWithoutRef<typeof SelectPrimitive.Item> {
3
+ value: string;
4
+ disabled?: boolean;
5
+ }
6
+ /**
7
+ * A single option.
8
+ *
9
+ * The rendered text is published to the root on mount so the trigger's render
10
+ * prop can name the selection. Reading it off the DOM keeps arbitrary markup
11
+ * working, and it runs while the list is closed too: the primitive keeps items
12
+ * mounted in a detached fragment so their text is available to the trigger.
13
+ */
14
+ export declare const SelectItem: import('react').ForwardRefExoticComponent<SelectItemProps & import('react').RefAttributes<HTMLDivElement>>;
@@ -0,0 +1,4 @@
1
+ import * as SelectPrimitive from '@radix-ui/react-select';
2
+ export type SelectSeparatorProps = React.ComponentPropsWithoutRef<typeof SelectPrimitive.Separator>;
3
+ /** A rule between groups of options. Decorative, hidden from assistive tech. */
4
+ export declare const SelectSeparator: import('react').ForwardRefExoticComponent<Omit<SelectPrimitive.SelectSeparatorProps & import('react').RefAttributes<HTMLDivElement>, "ref"> & import('react').RefAttributes<HTMLDivElement>>;
@@ -0,0 +1,25 @@
1
+ import * as SelectPrimitive from '@radix-ui/react-select';
2
+ /** What the `children` render prop receives. */
3
+ export interface SelectTriggerState {
4
+ /** Rendered text of the selected item, empty while nothing is chosen. */
5
+ selectedLabel: string;
6
+ /** Value of the selected item. */
7
+ value: string | undefined;
8
+ }
9
+ export interface SelectTriggerProps extends Omit<React.ComponentPropsWithoutRef<typeof SelectPrimitive.Trigger>, 'children'> {
10
+ /** Shown while nothing is selected. */
11
+ placeholder?: string;
12
+ disabled?: boolean;
13
+ /** Replaces the chevron. */
14
+ icon?: React.ReactNode;
15
+ /** Replaces what is rendered for the current value. */
16
+ children?: (state: SelectTriggerState) => React.ReactNode;
17
+ }
18
+ /**
19
+ * The button that opens the list and shows the current value.
20
+ *
21
+ * It takes no size prop: height and radius come from the `--controller-*`
22
+ * variables shared with every other input, so `inputSizeClass[size]` on any
23
+ * ancestor drives it.
24
+ */
25
+ export declare const SelectTrigger: import('react').ForwardRefExoticComponent<SelectTriggerProps & import('react').RefAttributes<HTMLButtonElement>>;
@@ -0,0 +1,21 @@
1
+ /**
2
+ * Shared Select state.
3
+ *
4
+ * Radix keeps its own selection state in a scoped context that is not part of
5
+ * its public API, and it never exposes the *text* of the selected item — the
6
+ * trigger shows it by portalling the item's own text node, so no caller ever
7
+ * gets a string back. `SelectTrigger` hands that string to its render prop, so
8
+ * the value and a value → text registry are kept here instead: every
9
+ * `SelectItem` publishes its rendered text on mount, including while the list
10
+ * is closed.
11
+ */
12
+ export interface SelectContextValue {
13
+ /** Current selection, or `undefined` while the placeholder shows. */
14
+ value: string | undefined;
15
+ /** Rendered text of every mounted item, keyed by its value. */
16
+ labels: Record<string, string>;
17
+ /** Publish an item's rendered text. Called by `SelectItem` on mount. */
18
+ registerLabel: (value: string, label: string) => void;
19
+ }
20
+ export declare const SelectContext: import('react').Context<SelectContextValue | null>;
21
+ export declare function useSelectContext(): SelectContextValue;
@@ -0,0 +1,6 @@
1
+ export { Select, type SelectProps } from './Select.tsx';
2
+ export { SelectTrigger, type SelectTriggerProps, type SelectTriggerState, } from './SelectTrigger.tsx';
3
+ export { SelectContent, type SelectContentProps } from './SelectContent.tsx';
4
+ export { SelectItem, type SelectItemProps } from './SelectItem.tsx';
5
+ export { SelectGroup, type SelectGroupProps } from './SelectGroup.tsx';
6
+ export { SelectSeparator, type SelectSeparatorProps, } from './SelectSeparator.tsx';
@@ -0,0 +1,6 @@
1
+ export type { SelectProps } from './Select';
2
+ export type { SelectTriggerProps, SelectTriggerState } from './SelectTrigger';
3
+ export type { SelectContentProps } from './SelectContent';
4
+ export type { SelectItemProps } from './SelectItem';
5
+ export type { SelectGroupProps } from './SelectGroup';
6
+ export type { SelectSeparatorProps } from './SelectSeparator';
@@ -3,9 +3,9 @@ export interface CheckboxProps extends React.ComponentPropsWithoutRef<typeof Che
3
3
  variant?: 'default' | 'rounded';
4
4
  }
5
5
  /**
6
- * Checkbox — mirrors `@sesame/orxata-core` Checkbox.
7
- * `v-model` (`boolean | 'indeterminate'`) maps to Radix `checked` /
8
- * `onCheckedChange` (+ `defaultChecked`). The Vue `TransitionBounce` wrapper
9
- * has no React equivalent yet and is omitted.
6
+ * Checkbox — built on `@radix-ui/react-checkbox`. `checked` is
7
+ * `boolean | 'indeterminate'`, paired with `onCheckedChange`, or
8
+ * `defaultChecked` for uncontrolled. The indicator appears without a
9
+ * transition; there is no ported animation wrapper yet.
10
10
  */
11
11
  export declare const Checkbox: import('react').ForwardRefExoticComponent<CheckboxProps & import('react').RefAttributes<HTMLButtonElement>>;
@@ -1,7 +1,7 @@
1
1
  import * as RadioGroupPrimitive from '@radix-ui/react-radio-group';
2
2
  export type RadioButtonProps = React.ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Item>;
3
3
  /**
4
- * RadioButton — mirrors `@sesame/orxata-core` RadioButton (reka `RadioGroupItem`).
5
- * The Vue `TransitionBounce` wrapper has no React equivalent yet and is omitted.
4
+ * RadioButton — built on `@radix-ui/react-radio-group` `Item`. The indicator
5
+ * appears without a transition; there is no ported animation wrapper yet.
6
6
  */
7
7
  export declare const RadioButton: import('react').ForwardRefExoticComponent<Omit<RadioGroupPrimitive.RadioGroupItemProps & import('react').RefAttributes<HTMLButtonElement>, "ref"> & import('react').RefAttributes<HTMLButtonElement>>;
@@ -3,7 +3,7 @@ export interface RadioGroupProps extends React.ComponentPropsWithoutRef<typeof R
3
3
  orientation?: 'horizontal' | 'vertical';
4
4
  }
5
5
  /**
6
- * RadioGroup — mirrors `@sesame/orxata-core` RadioGroup (reka `RadioGroupRoot`).
6
+ * RadioGroup — built on `@radix-ui/react-radio-group`.
7
7
  * `v-model` maps to Radix `value` / `onValueChange` (+ `defaultValue`).
8
8
  */
9
9
  export declare const RadioGroup: import('react').ForwardRefExoticComponent<RadioGroupProps & import('react').RefAttributes<HTMLDivElement>>;
@@ -6,8 +6,7 @@ export interface SwitchProps extends Omit<React.ComponentPropsWithoutRef<'div'>,
6
6
  children?: React.ReactNode;
7
7
  }
8
8
  /**
9
- * Switch — mirrors `@sesame/orxata-core` Switch. A custom div + native checkbox
10
- * toggle (the source does not use reka `SwitchRoot`), so it is ported as a
11
- * controlled component: `checked` + `onCheckedChange` replace Vue's `v-model`.
9
+ * Switch — a styled div wrapping a native checkbox rather than a primitive,
10
+ * controlled through `checked` + `onCheckedChange`.
12
11
  */
13
12
  export declare const Switch: import('react').ForwardRefExoticComponent<SwitchProps & import('react').RefAttributes<HTMLDivElement>>;
@@ -4,4 +4,5 @@ export * from './InputNumber/index.ts';
4
4
  export * from './InputPassword/index.ts';
5
5
  export * from './InputOtp/index.ts';
6
6
  export * from './Combobox/index.ts';
7
+ export * from './Select/index.ts';
7
8
  export * from './Toggle/index.ts';
@@ -1,7 +1,7 @@
1
1
  /**
2
- * Control sizes shared by every input. Mirrors the `input-{size}` classes the
3
- * Vue package applies directly; CSS modules hash the class names, so consumers
4
- * resolve them through this map instead of building the string by hand.
2
+ * Control sizes shared by every input. The class names are global and part of
3
+ * the public vocabulary — a consumer can apply `input-{size}` to an ancestor
4
+ * and every descendant control that reads the custom properties follows.
5
5
  */
6
6
  export type InputSize = 'sm' | 'md' | 'lg';
7
7
  export declare const inputSizeClass: Record<InputSize, string>;
@@ -5,6 +5,6 @@ export interface CardProps extends React.HTMLAttributes<HTMLDivElement> {
5
5
  }
6
6
  /**
7
7
  * Card — mirrors `@sesame/orxata-core` Card.
8
- * `asChild` replaces reka-ui's `<Primitive as-child>` via `@radix-ui/react-slot`.
8
+ * `asChild` renders the child element instead of a `<div>`, via `@radix-ui/react-slot`.
9
9
  */
10
10
  export declare const Card: import('react').ForwardRefExoticComponent<CardProps & import('react').RefAttributes<HTMLDivElement>>;
@@ -7,10 +7,11 @@ export interface DividerProps extends React.HTMLAttributes<HTMLDivElement> {
7
7
  dataTestid: string;
8
8
  }
9
9
  /**
10
- * Divider — mirrors `@sesame/orxata-core` Divider.
11
- * reka-ui's `Separator` has no Radix counterpart in this package's dependency
12
- * set, so the separator semantics are implemented here: `aria-orientation` is
13
- * only emitted for the vertical case (horizontal is the ARIA default).
14
- * `asChild` replaces reka-ui's `<Primitive as-child>` via `@radix-ui/react-slot`.
10
+ * Divider.
11
+ *
12
+ * No separator primitive is in this package's dependency set, so the semantics
13
+ * are implemented here: `aria-orientation` is emitted only for the vertical
14
+ * case, since horizontal is the ARIA default. `asChild` renders the child
15
+ * element instead of a `<div>`, via `@radix-ui/react-slot`.
15
16
  */
16
17
  export declare const Divider: import('react').ForwardRefExoticComponent<DividerProps & import('react').RefAttributes<HTMLDivElement>>;
@@ -5,10 +5,10 @@ export type ResizableProps = Omit<React.ComponentPropsWithoutRef<typeof PanelGro
5
5
  dataTestid: string;
6
6
  };
7
7
  /**
8
- * Resizable — maps reka-ui `SplitterGroup` to `react-resizable-panels` `PanelGroup`.
8
+ * Resizable — built on `react-resizable-panels` `PanelGroup`.
9
9
  *
10
- * `direction` mirrors reka's `direction`. We also set `data-orientation` from it
11
- * because `react-resizable-panels` emits `data-panel-group-direction` (not
12
- * `data-orientation`), and the CSS selectors + a11y rely on `data-orientation`.
10
+ * `data-orientation` is set from `direction` because the underlying library
11
+ * emits `data-panel-group-direction` instead, and both the CSS selectors and the
12
+ * accessibility hooks read `data-orientation`.
13
13
  */
14
14
  export declare const Resizable: ForwardRefExoticComponent<ResizableProps & RefAttributes<ImperativePanelGroupHandle>>;
@@ -1,17 +1,16 @@
1
1
  import { PanelResizeHandleProps } from 'react-resizable-panels';
2
2
  export type ResizableHandleProps = PanelResizeHandleProps & {
3
3
  /**
4
- * Orientation of the parent group. `react-resizable-panels` does not expose
5
- * the group direction to the handle DOM (reka propagated it via context), so
6
- * we accept it explicitly to drive the `data-orientation` CSS selectors.
4
+ * Orientation of the parent group. `react-resizable-panels` puts nothing on
5
+ * the handle DOM to say which way the group runs, so it is passed in to drive
6
+ * the `data-orientation` CSS selectors.
7
7
  */
8
8
  orientation?: 'horizontal' | 'vertical';
9
9
  dataTestid: string;
10
10
  };
11
11
  /**
12
- * ResizableHandle — maps reka-ui `SplitterResizeHandle` to
13
- * `react-resizable-panels` `PanelResizeHandle`. Renders a grip bar; `children`
14
- * override the default `GripVertical` icon (mirrors reka's default slot).
12
+ * ResizableHandle — built on `react-resizable-panels` `PanelResizeHandle`.
13
+ * Renders a grip bar; `children` replace the default `GripVertical` icon.
15
14
  *
16
15
  * Not `forwardRef`: `PanelResizeHandle` is a plain function component and does
17
16
  * not accept a `ref`.